:root{
  --orange:#f36a10;
  --orange-bright:#ff8124;
  --orange-deep:#d94a06;
  --red:#d8191c;
  --ink:#17130f;
  --cream:#fff3e6;
  --white:#fff;
  --muted:rgba(255,255,255,.7);
  --shadow:0 30px 80px rgba(33,12,0,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#1a120e}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:#1a120e;color:#fff;overflow-x:hidden}
button,a{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}

.journey{position:fixed;inset:0;z-index:30;overflow:hidden;background:linear-gradient(128deg,#b92708 0%,#e94e09 34%,#f77713 68%,#ed5208 100%);transition:opacity .9s ease,visibility .9s ease}
.journey.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.journey-bg{position:absolute;inset:0;overflow:hidden}
.bg-orb{position:absolute;border-radius:999px;filter:blur(1px);opacity:.35;mix-blend-mode:screen}
.orb-a{width:68vw;height:68vw;left:-22vw;top:-40vw;background:radial-gradient(circle,rgba(255,255,255,.36),transparent 60%);animation:orbFloat 10s ease-in-out infinite alternate}
.orb-b{width:54vw;height:54vw;right:-15vw;bottom:-38vw;background:radial-gradient(circle,rgba(255,195,112,.65),transparent 62%);animation:orbFloat 13s ease-in-out infinite alternate-reverse}
.bg-grid{position:absolute;inset:-20%;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:68px 68px;transform:perspective(800px) rotateX(66deg) translateY(31%);transform-origin:center bottom;mask-image:linear-gradient(to bottom,transparent 12%,#000 78%)}
.bg-grain{position:absolute;inset:0;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E");mix-blend-mode:soft-light;pointer-events:none}
@keyframes orbFloat{from{transform:translate3d(-2%,0,0) scale(1)}to{transform:translate3d(5%,4%,0) scale(1.08)}}

.journey-header,.arrival-header{position:absolute;z-index:8;left:clamp(22px,4vw,64px);right:clamp(22px,4vw,64px);top:clamp(20px,4vh,42px);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand-logo,.arrival-header img{width:clamp(72px,7vw,108px);filter:drop-shadow(0 9px 20px rgba(46,6,0,.16))}
.journey-meta{text-align:right;display:grid;gap:6px;letter-spacing:.18em;text-transform:uppercase}
.journey-meta span{font-size:clamp(9px,.8vw,12px);font-weight:800;color:rgba(255,255,255,.66)}
.journey-meta strong{font-size:clamp(16px,1.5vw,23px);font-weight:850}

.camera{position:absolute;inset:0;overflow:hidden}
.world{position:absolute;width:4600px;height:900px;left:0;top:50%;transform:translate3d(0,-50%,0);will-change:transform}
.route-svg{position:absolute;inset:0;width:4600px;height:900px;overflow:visible}
.route-shadow,.route-base,.route-progress{fill:none;stroke-linecap:round;stroke-linejoin:round}
.route-shadow{stroke:rgba(68,17,0,.18);stroke-width:31}
.route-base{stroke:rgba(255,255,255,.17);stroke-width:7;stroke-dasharray:2 20}
.route-progress{stroke:url(#routeGradient);stroke-width:8;filter:url(#softGlow)}
.traveler-glow{fill:#fff;opacity:.2;filter:url(#softGlow)}
.traveler{fill:#fff;stroke:#ffb35c;stroke-width:4;filter:url(#softGlow)}

.echo{position:absolute;font-weight:950;font-size:132px;letter-spacing:-.055em;color:rgba(255,255,255,.036);white-space:nowrap;user-select:none;text-transform:uppercase}
.echo-1{left:100px;top:150px}.echo-2{left:1040px;top:665px}.echo-3{left:1930px;top:125px}.echo-4{left:2880px;top:650px}.echo-5{left:3860px;top:130px}

.milestone{position:absolute;left:var(--x);top:var(--y);width:460px;transform:translate(-50%,-50%);z-index:3;opacity:.15;filter:saturate(.52) blur(.35px);transition:opacity .9s ease,filter .9s ease,transform 1s cubic-bezier(.22,.72,.12,1)}
.milestone.is-active{opacity:1;filter:none;transform:translate(-50%,-50%) scale(1.04);z-index:7}
.milestone.is-complete{opacity:.46;filter:saturate(.82);transform:translate(-50%,-50%) scale(.97)}
.marker{position:absolute;left:50%;top:50%;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.48);backdrop-filter:blur(14px);transform:translate(-50%,-50%);box-shadow:0 0 0 0 rgba(255,255,255,.22);transition:.5s ease}
.marker span{position:absolute;width:12px;height:12px;border-radius:50%;inset:0;margin:auto;background:#fff;box-shadow:0 0 24px rgba(255,255,255,.95)}
.milestone.is-active .marker{width:60px;height:60px;box-shadow:0 0 0 18px rgba(255,255,255,.08),0 0 58px rgba(255,225,182,.42);animation:markerBreath 2.6s ease-in-out infinite}
@keyframes markerBreath{0%,100%{box-shadow:0 0 0 16px rgba(255,255,255,.065),0 0 46px rgba(255,225,182,.30)}50%{box-shadow:0 0 0 22px rgba(255,255,255,.09),0 0 70px rgba(255,225,182,.48)}}
.milestone-card{position:absolute;left:50%;bottom:68px;width:404px;min-height:158px;padding:26px 28px;display:grid;grid-template-columns:68px 1fr;gap:19px;align-items:center;border-radius:29px;background:linear-gradient(145deg,rgba(31,18,12,.86),rgba(36,15,7,.66));border:1px solid rgba(255,255,255,.16);box-shadow:var(--shadow);backdrop-filter:blur(24px) saturate(135%);transform:translateX(-50%) scale(1);transform-origin:center bottom;overflow:hidden;transition:transform .85s cubic-bezier(.18,.78,.18,1),border-color .8s ease,box-shadow .8s ease,background .8s ease}
.milestone-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#fff5e8,#ff8a29);opacity:0;transform:scaleY(.35);transform-origin:center;transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.milestone-card:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.10),transparent 35%);pointer-events:none}
.milestone.is-active .milestone-card{transform:translateX(-50%) scale(1.14);border-color:rgba(255,255,255,.52);background:linear-gradient(145deg,rgba(28,15,10,.94),rgba(39,17,8,.82));box-shadow:0 44px 110px rgba(41,10,0,.42),0 0 0 1px rgba(255,255,255,.11),0 0 78px rgba(255,176,95,.25)}
.milestone.is-active .milestone-card:before{opacity:1;transform:scaleY(1)}
.milestone:nth-of-type(even) .milestone-card{bottom:auto;top:68px;transform-origin:center top}
.icon-shell{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,#ff8d2b,#e74e0b);box-shadow:0 13px 30px rgba(118,31,0,.34);transition:transform .75s cubic-bezier(.18,.78,.18,1),box-shadow .75s ease}.milestone.is-active .icon-shell{transform:scale(1.08);box-shadow:0 17px 38px rgba(118,31,0,.42),0 0 30px rgba(255,173,104,.16)}
.icon-shell svg{width:36px;height:36px;fill:none;stroke:#fff;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.milestone-card small{display:block;font-weight:900;letter-spacing:.18em;color:#ffad68;font-size:10px;margin-bottom:5px}
.milestone-card h2{margin:0;font-size:34px;line-height:1;letter-spacing:-.04em;font-weight:920;transition:font-size .75s cubic-bezier(.18,.78,.18,1),transform .7s ease,text-shadow .7s ease}
.milestone.is-active .milestone-card h2{font-size:38px;transform:translateX(2px);text-shadow:0 10px 30px rgba(0,0,0,.22)}
.milestone-card p{margin:11px 0 0;font-size:14px;line-height:1.52;color:rgba(255,255,255,.68);max-width:275px;transition:font-size .75s cubic-bezier(.18,.78,.18,1),color .65s ease,line-height .65s ease}.milestone.is-active .milestone-card p{font-size:15.6px;line-height:1.58;color:rgba(255,255,255,.94);font-weight:560;max-width:300px}
.milestone-home .milestone-card{background:linear-gradient(145deg,rgba(255,247,237,.96),rgba(255,222,192,.92));color:#2b160e;border-color:rgba(255,255,255,.62)}
.milestone-home .milestone-card p{color:rgba(43,22,14,.68)}.milestone-home.is-active .milestone-card{background:linear-gradient(145deg,rgba(255,251,246,.99),rgba(255,224,196,.98));box-shadow:0 44px 110px rgba(91,31,0,.31),0 0 0 1px rgba(255,255,255,.55),0 0 82px rgba(255,224,188,.35)}.milestone-home.is-active .milestone-card p{color:rgba(43,22,14,.82)}
.milestone-home .milestone-card small{color:#e04a08}

.journey-progress{position:absolute;z-index:8;left:clamp(22px,4vw,64px);bottom:clamp(26px,5vh,54px);width:min(360px,46vw);height:4px;border-radius:9px;background:rgba(255,255,255,.19);overflow:hidden}
.journey-progress span{display:block;width:0;height:100%;border-radius:9px;background:#fff;box-shadow:0 0 18px rgba(255,255,255,.75);transition:width .1s linear}
.skip-button,.replay-button{border:1px solid rgba(255,255,255,.22);background:rgba(22,12,8,.22);color:#fff;border-radius:999px;padding:10px 16px;font-size:12px;font-weight:800;letter-spacing:.02em;backdrop-filter:blur(12px);transition:.25s ease}
.skip-button{position:absolute;z-index:10;right:clamp(22px,4vw,64px);bottom:clamp(26px,5vh,54px)}
.skip-button:hover,.replay-button:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.52);transform:translateY(-1px)}

.arrival{position:relative;min-height:100svh;overflow:hidden;background:radial-gradient(circle at 20% 15%,#ff9e41 0%,#f36b12 27%,#e8520c 59%,#b92407 100%);opacity:0;visibility:hidden;transition:opacity .9s ease;isolation:isolate}
.arrival.is-visible{opacity:1;visibility:visible}
.arrival-bg{position:absolute;inset:0;overflow:hidden;z-index:-1}
.arrival-ring{position:absolute;border:1px solid rgba(255,255,255,.18);border-radius:50%}
.ring-1{width:72vw;height:72vw;right:-26vw;top:-28vw}.ring-2{width:52vw;height:52vw;left:-30vw;bottom:-35vw}
.arrival-lines{position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 40.1%,transparent 40.8%,transparent 61%,rgba(255,255,255,.06) 61.1%,transparent 61.8%)}
.arrival-flash{position:absolute;inset:0;z-index:20;background:#fff;opacity:0;pointer-events:none}
.arrival.is-visible .arrival-flash{animation:arrivalFlash 1.05s ease-out both}
@keyframes arrivalFlash{0%{opacity:1}18%{opacity:.96}100%{opacity:0}}
.arrival-hero{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);align-items:end;max-width:1500px;margin:0 auto;padding:150px clamp(28px,7vw,110px) 0}
.arrival-copy{align-self:center;padding-bottom:5vh;z-index:3}
.arrival-kicker{margin:0 0 12px;font-size:clamp(11px,1vw,15px);font-weight:900;letter-spacing:.24em;color:rgba(255,255,255,.76)}
.date-lockup{display:flex;align-items:center;gap:clamp(14px,2vw,28px)}
.date-number{font-size:clamp(130px,20vw,315px);line-height:.72;letter-spacing:-.095em;font-weight:950;text-shadow:0 20px 70px rgba(98,17,0,.18)}
.date-month{display:grid;border-left:2px solid rgba(255,255,255,.38);padding-left:clamp(16px,2vw,28px);align-content:center}
.date-month small{font-size:clamp(16px,2vw,26px);font-weight:900;letter-spacing:.2em;color:rgba(255,255,255,.70)}
.date-month strong{font-size:clamp(34px,5.7vw,92px);line-height:.9;letter-spacing:-.055em;font-weight:950}
.arrival-subtitle{margin:30px 0 0;font-size:clamp(24px,2.7vw,44px);font-weight:780;letter-spacing:-.035em}
.scroll-cue{margin-top:34px;display:flex;align-items:center;gap:11px;color:rgba(255,255,255,.72);font-size:12px;font-weight:750;letter-spacing:.04em}
.scroll-cue span{width:28px;height:43px;border:1px solid rgba(255,255,255,.36);border-radius:999px;position:relative}
.scroll-cue span:after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;border-radius:4px;background:#fff;transform:translateX(-50%);animation:scrollDot 1.7s ease-in-out infinite}
@keyframes scrollDot{0%,100%{opacity:.25;transform:translate(-50%,0)}50%{opacity:1;transform:translate(-50%,14px)}}
.ivy-character{width:min(630px,46vw);aspect-ratio:2326/2706;max-height:84svh;justify-self:end;align-self:end;position:relative;transform:translateY(17%) scale(.94);opacity:0;filter:drop-shadow(0 28px 45px rgba(67,17,0,.24));transform-origin:52% 100%}
.arrival.is-visible .ivy-character{animation:ivyEnter 1.35s .55s cubic-bezier(.15,.82,.2,1) forwards}
.ivy-motion{position:absolute;inset:0;transform-origin:52% 91%;will-change:transform}
.arrival.is-visible .ivy-motion{animation:ivyGesture 9.4s 2.15s ease-in-out infinite}
.ivy-celebration{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;user-select:none;pointer-events:none}
@keyframes ivyEnter{from{opacity:0;transform:translateY(17%) scale(.94)}to{opacity:1;transform:translateY(9%) scale(1)}}
/* Movimento deliberadamente mínimo: o corpo quase não se desloca, mas as mãos percorrem mais pixels pela distância do ponto de rotação. */
@keyframes ivyGesture{0%,18%,47%,70%,100%{transform:rotate(0deg) translateY(0) scale(1)}24%{transform:rotate(-.42deg) translateY(-.35%) scale(1.003)}31%{transform:rotate(.36deg) translateY(-.55%) scale(1.004)}38%{transform:rotate(-.18deg) translateY(-.18%) scale(1.002)}76%{transform:rotate(.34deg) translateY(-.32%) scale(1.003)}83%{transform:rotate(-.28deg) translateY(-.48%) scale(1.003)}91%{transform:rotate(.10deg) translateY(-.12%) scale(1.001)}}
.ivy-eyelid{position:absolute;z-index:3;width:3.55%;height:2.25%;border-radius:52% 52% 58% 58%;background:linear-gradient(180deg,#ffad70 8%,#f89455 78%);border-bottom:clamp(1px,.12vw,2px) solid rgba(69,31,17,.84);opacity:0;transform:scaleY(.08);transform-origin:center bottom;pointer-events:none;filter:blur(.15px);animation:ivyBlink 7.2s 3.1s ease-in-out infinite}
.ivy-eyelid-left{left:52.38%;top:28.35%;transform:rotate(4deg) scaleY(.08)}
.ivy-eyelid-right{left:62.06%;top:29.45%;transform:rotate(4deg) scaleY(.08)}
@keyframes ivyBlink{0%,72%,76%,81%,100%{opacity:0}73.2%,74.6%,78.9%,80%{opacity:1;transform:rotate(4deg) scaleY(1)}}
.replay-button{background:rgba(40,17,7,.18)}
.confetti-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5}
.confetti-piece{position:absolute;top:-10vh;width:var(--cw,9px);height:var(--ch,15px);border-radius:var(--radius,2px);animation:confettiFall linear forwards;will-change:transform,opacity;filter:drop-shadow(0 4px 6px rgba(60,15,0,.15))}
@keyframes confettiFall{0%{transform:translate3d(0,-8vh,0) rotate(0deg);opacity:0}8%{opacity:var(--alpha,.9)}82%{opacity:var(--alpha,.9)}100%{transform:translate3d(var(--drift),118vh,0) rotate(var(--spin));opacity:0}}

.details{position:relative;background:#f9f4ee;color:#241710;padding:120px 24px 0}
.details-inner{max-width:1180px;margin:0 auto}
.section-kicker{margin:0 0 15px;color:#e95a0d;font-size:11px;font-weight:950;letter-spacing:.22em}
.details h2{margin:0;max-width:800px;font-size:clamp(40px,6vw,82px);line-height:.96;letter-spacing:-.055em;font-weight:920}
.details h2 span{color:#e95a0d}
.details-intro{max-width:720px;margin:28px 0 56px;font-size:18px;line-height:1.65;color:#6b5a50}
.event-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.event-card{text-decoration:none;color:inherit;display:grid;grid-template-columns:116px 1fr;align-items:center;min-height:190px;padding:25px;border-radius:28px;background:#fff;border:1px solid #eadfd5;box-shadow:0 18px 50px rgba(63,34,18,.08);transition:.28s ease}
.event-card:hover{transform:translateY(-5px);box-shadow:0 28px 70px rgba(63,34,18,.14);border-color:#f2b486}
.event-date{height:112px;border-radius:23px;background:linear-gradient(145deg,#f87d21,#dc4b08);color:#fff;display:grid;place-content:center;text-align:center;box-shadow:0 13px 30px rgba(218,76,8,.22)}
.event-date strong{font-size:55px;line-height:.8;letter-spacing:-.06em}.event-date small{font-weight:900;letter-spacing:.16em;margin-top:10px}
.event-copy{padding-left:25px;display:grid;gap:9px}.event-copy>small{font-size:10px;font-weight:900;letter-spacing:.13em;color:#a18777}.event-copy>strong{font-size:25px;line-height:1.08;letter-spacing:-.03em}.event-copy>span{font-size:13px;font-weight:850;color:#e95a0d}
.countdown-panel{margin:28px 0;min-height:120px;border-radius:28px;padding:28px 34px;background:#241710;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:20px}
.countdown-panel div{display:grid;gap:8px}.countdown-panel small{font-size:10px;letter-spacing:.18em;color:#ffad75;font-weight:900}.countdown-panel strong{font-size:clamp(28px,4vw,52px);letter-spacing:-.04em}.countdown-panel p{margin:0;color:rgba(255,255,255,.58);font-weight:750}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 110px}
.info-grid article{padding:34px;border-radius:28px;background:#f0e7df;border:1px solid #e4d8cf}.info-grid article span{font-size:10px;font-weight:950;letter-spacing:.18em;color:#e95a0d}.info-grid h3{margin:10px 0 12px;font-size:29px;letter-spacing:-.03em}.info-grid p{margin:0;color:#6b5a50;line-height:1.65}
.details footer{padding:28px 24px;text-align:center;border-top:1px solid #e2d7cd;color:#89766a;font-size:12px}

.sound-button{position:fixed;z-index:90;left:18px;bottom:18px;border:1px solid rgba(255,255,255,.2);background:rgba(24,15,11,.55);color:#fff;border-radius:999px;padding:9px 14px;display:flex;align-items:center;gap:7px;backdrop-filter:blur(12px);box-shadow:0 12px 28px rgba(0,0,0,.16)}
.sound-button span{font-size:17px}.sound-button b{font-size:11px;letter-spacing:.05em}.sound-button.is-on{background:#fff;color:#d84d09;border-color:#fff}

@media (max-width:900px){
  .world{height:760px}.route-svg{height:760px}.milestone{transform:translate(-50%,-50%) scale(.82)}.milestone.is-active{transform:translate(-50%,-50%) scale(.91)}.milestone.is-complete{transform:translate(-50%,-50%) scale(.80)}.milestone.is-active .milestone-card{transform:translateX(-50%) scale(1.11)}
  .journey-meta span{display:none}
  .arrival-hero{grid-template-columns:1fr;align-items:center;padding:130px 24px 0;text-align:center}
  .arrival-copy{padding-bottom:0}.date-lockup{justify-content:center}.ivy-character{position:absolute;width:min(540px,74vw);right:-12vw;bottom:-22vh;opacity:.20!important;z-index:-1}.scroll-cue{justify-content:center}
  .event-grid,.info-grid{grid-template-columns:1fr}
}
@media (max-width:620px){
  .journey-header{align-items:flex-start}.brand-logo,.arrival-header img{width:70px}
  .journey-progress{width:48vw}.skip-button{font-size:11px;padding:9px 13px}
  .milestone-card{width:330px;grid-template-columns:54px 1fr;padding:20px;gap:15px;border-radius:22px}.icon-shell{width:52px;height:52px;border-radius:17px}.icon-shell svg{width:29px;height:29px}.milestone-card h2{font-size:27px}.milestone.is-active .milestone-card h2{font-size:30px}.milestone-card p{font-size:12.5px}.milestone.is-active .milestone-card p{font-size:13.7px;line-height:1.55}
  .arrival-header{top:20px}.replay-button{font-size:10px;padding:8px 11px}
  .date-lockup{gap:9px}.date-number{font-size:33vw}.date-month{padding-left:11px}.date-month small{font-size:13px}.date-month strong{font-size:9.3vw}.arrival-subtitle{font-size:26px}.arrival-kicker{font-size:10px}
  .details{padding:90px 16px 0}.details h2{font-size:46px}.details-intro{font-size:16px;margin-bottom:36px}
  .event-card{grid-template-columns:86px 1fr;padding:17px;min-height:156px;border-radius:23px}.event-date{height:91px;border-radius:18px}.event-date strong{font-size:44px}.event-copy{padding-left:17px}.event-copy>strong{font-size:20px}.event-copy>small{font-size:8px}
  .countdown-panel{align-items:flex-start;flex-direction:column;border-radius:23px;padding:26px}.info-grid article{padding:27px;border-radius:23px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.bg-orb,.scroll-cue span:after{animation:none!important}.journey{display:none}.arrival{opacity:1;visibility:visible}.arrival-flash{display:none}.ivy-character{opacity:1;transform:translateY(9%);animation:none!important}.ivy-motion,.ivy-eyelid{animation:none!important}}
