:root{color-scheme:dark;--navy:#050e2c;--gold:#ffdb89;--cream:#fff5df;font-family:Arial,Helvetica,sans-serif;background:var(--navy);color:var(--cream)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 0 100%,#152f6c88,transparent 65%),var(--navy)}.landing{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:72px;max-width:1280px;margin:auto;padding:48px 48px;min-height:100svh}.content{padding:22px 0}.eyebrow{display:flex;align-items:center;gap:14px;font-size:12px;line-height:1.6;letter-spacing:.19em;color:var(--gold);font-weight:700;margin:0 0 43px}.eyebrow:before{content:'';width:35px;height:1px;background:var(--gold);flex:none}.lead{font-size:17px;letter-spacing:.27em;font-weight:700;margin:0 0 12px}h1{font-size:clamp(36px,4.15vw,58px);font-weight:900;letter-spacing:-.045em;line-height:1.03;margin:0}h1 span{color:var(--gold)}.highlight{font-size:12px;letter-spacing:.2em;font-weight:700;margin:20px 0;color:#ced9f3}.event-details{border-top:1px solid #ffdb8933;padding-top:26px}.save{font-size:12px;letter-spacing:.26em;margin:0 0 8px}.date-row{display:flex;align-items:center;gap:26px}.date-row time{font-size:68px;font-weight:900;color:var(--gold);letter-spacing:-.055em;line-height:1.15;white-space:nowrap}.date-row time span{font-weight:400;font-size:.75em;margin:0 4px}.date-row p{font-size:12px;letter-spacing:.09em;line-height:1.8;border-left:1px solid #ffdb8940;padding-left:24px;margin:0}.date-row strong{font-size:21px;letter-spacing:.05em}.venue{font-size:22px;line-height:1.5;margin:14px 0 28px}.venue span{color:var(--gold);padding:0 6px}.vip{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;min-height:64px;border:1px solid var(--gold);border-radius:8px;background:var(--gold);color:var(--navy);font:800 15px Arial,Helvetica,sans-serif;letter-spacing:.035em;padding:18px 20px;cursor:pointer;box-shadow:0 8px 28px #0003;transition:background .15s,transform .15s}.vip svg{width:25px;height:25px;flex:none}.vip>span{font-size:23px;margin-left:auto}.vip:hover{background:#ffe9b7;transform:translateY(-2px)}.vip:focus-visible{outline:3px solid #fff;outline-offset:5px}.support{font-size:13px;color:#b8c5e0;text-align:center;line-height:1.5;margin:14px 0 0}#vip-status{color:var(--gold);text-align:center;font-size:14px;line-height:1.5}footer{display:flex;align-items:center;gap:13px;font-size:10px;letter-spacing:.13em;color:#a3b2d0;margin-top:35px}footer strong{color:var(--cream);font-size:12px;letter-spacing:.11em}
@media(min-width:1600px){.landing{gap:90px}}
@media(max-width:900px){.landing{gap:32px;padding:32px 28px;grid-template-columns:1fr 1fr}h1{font-size:36px}.eyebrow{margin-bottom:28px;font-size:11px}.date-row{gap:16px}.date-row time{font-size:54px}.date-row p{padding-left:16px;font-size:10px}.date-row strong{font-size:18px}.venue{font-size:19px}.vip{font-size:12px;padding:16px 13px;gap:8px}}
@media(max-width:650px){.landing{display:flex;flex-direction:column;gap:34px;padding:32px 22px 25px;max-width:480px}.content{width:100%;padding:0}.eyebrow{justify-content:center;font-size:11px;margin-bottom:31px;gap:10px}.eyebrow:after{content:'';width:25px;height:1px;background:var(--gold)}.eyebrow:before{width:25px}.lead,h1,.highlight{text-align:center}.lead{font-size:14px}h1{font-size:clamp(30px,8.4vw,42px)}.highlight{font-size:11px;margin:17px 0}.event-details{text-align:center;padding-top:20px}.date-row{justify-content:center}.date-row time{font-size:62px}.date-row p{text-align:left;font-size:11px}.date-row strong{font-size:20px}.venue{margin:12px 0 23px;font-size:21px}.vip{font-size:14px;min-height:62px}.vip>span{margin-left:4px}.support{font-size:12px}footer{justify-content:center;margin-top:25px}}
@media(prefers-reduced-motion:reduce){.vip{transition:none}}


.tracks{list-style:none;padding:0;margin:24px 0 32px;display:grid;gap:14px;width:min(100%,285px)}.track{display:grid;grid-template-columns:56px minmax(0,1fr);align-items:center;gap:10px;padding:0;background:transparent;border:0;text-align:left}.track-cover{width:56px;aspect-ratio:1;position:relative;overflow:hidden;border-radius:4px}.track-cover img{position:absolute;display:block;max-width:none;width:908.451%;height:auto}.cover-postinho img{left:-90.141%;top:-19.014%}.cover-lencol img{left:-88.732%;top:-152.817%}.track-info{min-width:0}.track-title{font-size:16px;line-height:1.35;color:#fff;font-weight:500;letter-spacing:-.02em;margin:0 0 8px;overflow-wrap:break-word}.track-meta{display:flex;align-items:center;gap:5px;font-size:14px;line-height:1.4;color:#b8c5e0;margin:0}.track-meta svg{width:17px;height:17px;flex:none}
@media(max-width:650px){.tracks{margin:22px auto 27px}}
@media(max-width:360px){.track{grid-template-columns:50px minmax(0,1fr);gap:9px}.track-cover{width:50px}.track-title{font-size:14px}.track-meta{font-size:13px}}
.artist-photo{position:relative;isolation:isolate;margin:0;width:100%;align-self:center;padding:76px 0 0}.artist-crop img{position:relative;z-index:1;display:block;width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(0,0,0,.22))}
@media(max-width:650px){.artist-photo{width:100%;max-width:420px}}


.artist-photo > .artist-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0;pointer-events:none}
/* Compact mobile composition: photo first, tracks side by side, CTA in first screen. */
@media(max-width:650px){
 .landing{display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-content:center;justify-items:stretch;min-height:100svh;max-width:480px;padding:16px 18px}
 .content{display:contents}
 .eyebrow{grid-row:1;font-size:10px;line-height:1.4;letter-spacing:.13em;margin:0 0 8px}
 .artist-photo{grid-row:2;justify-self:center;width:245px;max-width:100%;padding:36px 10.5px 0;margin:0 0 9px}
 .lead{grid-row:3;font-size:12px;line-height:1.3;letter-spacing:.23em;margin:0 0 4px}
 h1{grid-row:4;font-size:clamp(25px,7vw,32px);line-height:1.02;margin:0}
 .highlight{grid-row:5;font-size:10px;line-height:1.4;letter-spacing:.14em;margin:9px 0 12px}
 .tracks{grid-row:6;width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:0 0 14px}
 .track{grid-template-columns:34px minmax(0,1fr);gap:7px;align-items:center}
 .track-cover{width:34px}
 .track-title{font-size:12px;line-height:1.2;letter-spacing:-.025em;margin:0 0 4px}
 .track-meta{font-size:11px;line-height:1.2;gap:3px;flex-wrap:wrap}
 .track-meta svg{width:12px;height:12px}
 .event-details{grid-row:7;padding-top:12px}
 .save{font-size:10px;line-height:1.3;margin:0 0 3px}
 .date-row{gap:16px}
 .date-row time{font-size:44px;line-height:1.08}
 .date-row p{font-size:10px;line-height:1.5;padding-left:16px}
 .date-row strong{font-size:17px}
 .venue{font-size:18px;line-height:1.4;margin:7px 0 12px}
 .vip{grid-row:8;min-height:50px;font-size:13px;padding:12px 16px}
 .vip svg{width:22px;height:22px}
 .vip>span{font-size:20px}
 .support{grid-row:9;font-size:11px;line-height:1.4;margin:8px 0 0}
 #vip-status{grid-row:10;margin:8px 0 0;font-size:12px}
 footer{grid-row:11;font-size:9px;line-height:1.4;margin:14px 0 0}
 footer strong{font-size:10px}
}
@media(max-width:650px) and (max-height:700px){
 .landing{padding-top:10px;padding-bottom:10px}
 .artist-photo{width:188px;margin-bottom:6px;padding-top:27px}
 .eyebrow{margin-bottom:5px}
 .highlight{margin:7px 0 10px}
 .tracks{margin-bottom:10px}
 .event-details{padding-top:9px}
 footer{margin-top:10px}
}
@media(max-width:350px){
 .landing{padding-inline:12px}
 .tracks{gap:8px}
 .track{grid-template-columns:28px minmax(0,1fr);gap:5px}
 .track-cover{width:28px}
 .track-meta{font-size:10px}
}

/* Visual finish inspired by the artwork; no changes to element sizes. */
body{background:radial-gradient(ellipse at 83% 48%,rgba(33,66,138,.28),transparent 48%),radial-gradient(ellipse at 15% 100%,rgba(33,64,136,.48),transparent 65%),linear-gradient(160deg,#040b23 0%,#081431 58%,#12234b 100%);background-attachment:fixed}
.page-ornaments{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.page-ornaments:before,.page-ornaments:after{content:'';position:absolute;width:48px;height:70px;opacity:.48}
.page-ornaments:before{top:22px;left:22px;border-top:1px solid var(--gold);border-left:1px solid var(--gold)}
.page-ornaments:after{bottom:22px;right:22px;border-bottom:1px solid var(--gold);border-right:1px solid var(--gold)}
.landing{position:relative;z-index:1}
.eyebrow{color:#f4d797}
.eyebrow:before,.eyebrow:after{background:linear-gradient(90deg,transparent,#ffdb89)}
.lead{color:#e8d9b8;font-weight:600}
h1{color:#fff3d6;text-shadow:0 2px 18px rgba(0,0,0,.18)}
h1 span{color:#ffdc8d}
.highlight{color:#abbddf}
.artist-photo:before{content:'';position:absolute;inset:15% -9% 0;border-radius:50%;background:radial-gradient(ellipse,rgba(56,90,164,.22),transparent 68%);pointer-events:none;z-index:-1}
.artist-photo > .artist-frame{filter:drop-shadow(0 0 3px rgba(255,219,137,.15))}
.track-cover{box-shadow:0 0 0 1px rgba(255,219,137,.17),0 3px 8px rgba(0,0,0,.2)}
.track-title{color:#f2eddf}.track-meta{color:#a9bcdd}
.event-details{border-top-color:transparent;background:linear-gradient(90deg,transparent,rgba(255,219,137,.52),transparent) top center/100% 1px no-repeat}
.date-row time{color:#ffdc8d;text-shadow:0 2px 16px rgba(255,211,111,.06)}
.date-row p{border-left-color:rgba(255,219,137,.27);color:#bbc9e3}
.date-row strong{color:#fff1d1}
.venue{color:#f4e5c5}.venue span{color:#c8a668}
.vip{background:linear-gradient(110deg,#ffe6aa 0%,#ffdb89 48%,#edc778 100%);border-color:#ffe7b5;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 5px 18px rgba(0,0,0,.22);color:#09122d}
.vip:hover{background:linear-gradient(110deg,#fff0ca,#ffe1a0 55%,#f5d28d)}
.support{color:#9fb2d5}footer{color:#92a4c5}footer strong{color:#e7d6b1}
@media(max-width:650px){
 body{background:radial-gradient(ellipse at 50% 27%,rgba(30,55,111,.34),transparent 43%),linear-gradient(165deg,#040b23 0%,#07112e 52%,#142952 100%);background-attachment:fixed}
 .page-ornaments:before,.page-ornaments:after{width:26px;height:43px;opacity:.32}
 .page-ornaments:before{top:14px;left:12px}.page-ornaments:after{bottom:14px;right:12px}
}
/* Center each compact track within its mobile column. */
@media(max-width:650px){.tracks{justify-items:center}.track{width:max-content;max-width:100%;grid-template-columns:34px minmax(0,1fr)}}
@media(max-width:350px){.track{grid-template-columns:28px minmax(0,1fr)}}

.artist-crop{position:relative;z-index:1;width:100%;aspect-ratio:927/920;overflow:hidden}.artist-crop img{width:100%;height:auto;max-width:100%;object-position:center top}
