:root{color-scheme:dark;--navy:#0b1b31;--deep:#071825;--lime:#b7fa37;--paper:#f2f4ef;--muted:#b7c8c7;--hero-shift:0px;--city-shift:0px;font-family:Jost,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--deep);color:white}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}::selection{background:var(--lime);color:var(--navy)}:focus-visible{outline:3px solid var(--lime);outline-offset:4px}
.site-header{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:1600px;margin:auto;padding:28px clamp(24px,5vw,80px)}.brand{display:inline-flex;align-items:center}.brand img{width:176px;height:auto}.site-header nav{display:flex;align-items:center;gap:clamp(20px,3vw,42px);font-size:13px;font-weight:700}.site-header nav>a:not(.nav-cta){transition:color .2s}.site-header nav>a:not(.nav-cta):hover{color:var(--lime)}.nav-cta{border:1px solid rgba(255,255,255,.62);border-radius:10px;padding:13px 17px;transition:background .2s,color .2s}.nav-cta:hover{background:white;color:var(--navy)}
.hero{position:relative;min-height:760px;min-height:100svh;display:flex;align-items:center;isolation:isolate;overflow:hidden;background:#0b1b31}.hero-media,.hero-shade{position:absolute;inset:0;z-index:-2}.hero-media{overflow:hidden}.hero-media video{width:100%;height:100%;object-fit:cover;filter:blur(4px) brightness(.55) saturate(.75);transform:scale(1.035)}.hero-shade{z-index:-1;background:linear-gradient(90deg,rgba(5,18,31,.91),rgba(5,18,31,.58) 55%,rgba(5,18,31,.42)),linear-gradient(0deg,rgba(5,18,31,.73),transparent 35%)}.hero-content{width:min(100%,1600px);margin:0 auto;padding:140px clamp(24px,8vw,128px) 125px}.hero h1{font-size:clamp(3.7rem,7.3vw,7.4rem);line-height:1.03;letter-spacing:-.045em;max-width:980px;margin:0;font-weight:800}.hero h1 em{font-style:normal;color:var(--lime)}.hero-content p{font-size:clamp(16px,1.5vw,19px);line-height:1.7;max-width:530px;color:#e0e9e6;margin:31px 0 33px}.hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:0 23px;border-radius:11px;font-size:14px;font-weight:800;transition:transform .22s,background .22s,border-color .22s}.button:hover{transform:translateY(-3px)}.button:active{transform:translateY(0)}.button-lime{background:var(--lime);color:var(--navy)}.button-lime:hover{background:#d0ff72}.button-outline{border:1px solid rgba(255,255,255,.55);background:rgba(4,18,31,.17);color:white}.button-outline:hover{border-color:white;background:rgba(255,255,255,.11)}.scroll-cue{position:absolute;bottom:31px;left:clamp(24px,8vw,128px);display:flex;gap:22px;align-items:center;font-size:12px;font-weight:700;color:#dce7e4}.scroll-cue span{font-size:20px}.motion-toggle{position:absolute;bottom:30px;right:clamp(24px,5vw,80px);color:white;background:rgba(7,24,37,.35);border:1px solid rgba(255,255,255,.42);border-radius:8px;padding:8px 12px;font-size:12px}
.steps{background:var(--paper);color:var(--navy);padding:clamp(72px,9vw,140px) clamp(24px,8vw,128px);scroll-margin-top:0}.section-intro,.step-list{max-width:1300px;margin:0 auto}.section-intro h2,.city h2,.closing h2{font-size:clamp(2.3rem,4vw,4.6rem);line-height:1.13;letter-spacing:-.035em;margin:0;font-weight:800}.section-intro p{margin:17px 0 0;color:#4d5e65;font-size:17px}.step-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:66px}.step{border-top:1px solid #aebbb4;padding-top:24px}.step-number{color:#138a67;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}.step h3{font-size:22px;letter-spacing:-.02em;margin:23px 0 9px}.step p{font-size:15px;line-height:1.7;color:#4d5e65;max-width:300px;margin:0}
.city{display:grid;grid-template-columns:1.12fr .88fr;min-height:580px;background:#11273a}.city-image{overflow:hidden}.city-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:55% center}.city-copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:64px clamp(32px,6vw,100px)}.city-copy p{color:#d0dfdf;line-height:1.7;font-size:16px;max-width:360px;margin:25px 0}.text-link{border-bottom:1px solid var(--lime);padding:0 0 7px;color:var(--lime);font-weight:800;display:inline-flex;gap:35px;transition:gap .2s}.text-link:hover{gap:48px}.closing{background:var(--lime);color:var(--navy);display:flex;align-items:center;justify-content:space-between;gap:25px;padding:clamp(54px,7vw,94px) clamp(24px,8vw,128px)}.closing .button-lime{background:var(--navy);color:white}.closing .button-lime:hover{background:#223b52}.site-footer{display:flex;align-items:center;gap:26px;padding:28px clamp(24px,8vw,128px);font-size:12px;color:#bccdcc}.site-footer img{width:118px;height:auto}.site-footer a{margin-left:auto}.site-footer a:hover{color:var(--lime)}
.reveal{opacity:1;transform:none}@media(prefers-reduced-motion:no-preference){.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.18,.75,.22,1)}.reveal.is-visible{opacity:1;transform:none}.hero-content{animation:hero-in .8s cubic-bezier(.18,.75,.22,1) both}@keyframes hero-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}}
@media(max-width:850px){.site-header{padding:22px 24px}.nav-how{display:none}.hero-content{padding:145px 32px 120px}.scroll-cue{left:32px}.step-list{gap:22px}.city{grid-template-columns:1fr}.city-image{height:470px}.city-copy{padding:65px 32px 75px}}
@media(max-width:600px){.site-header nav{gap:14px}.site-header nav a{font-size:12px}.site-header .nav-cta{display:none}.brand img{width:132px}.hero{min-height:720px;min-height:100svh}.hero-content{padding:130px 24px 110px}.hero h1{font-size:clamp(3rem,13vw,5.4rem);letter-spacing:-.045em}.hero-content p{margin:22px 0 27px;font-size:15px}.hero-shade{background:linear-gradient(90deg,rgba(5,18,31,.86),rgba(5,18,31,.48)),linear-gradient(0deg,rgba(5,18,31,.68),transparent 55%)}.scroll-cue{left:24px;bottom:25px}.motion-toggle{right:24px;bottom:26px;font-size:0;min-width:36px;height:34px}.motion-toggle::before{content:'Ⅱ';font-size:15px}.motion-toggle[aria-pressed="true"]::before{content:'▶'}.steps{padding:80px 24px}.step-list{grid-template-columns:1fr;gap:30px;margin-top:48px}.step h3{margin-top:15px}.city-image{height:320px}.closing{align-items:flex-start;flex-direction:column}.site-footer{flex-wrap:wrap;gap:12px}.site-footer a{margin-left:0;width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.text-link{transition:none}}

/* Editorial type and restrained motion for the Rodaí landing page. */
body{overflow-x:hidden}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--deep)}::-webkit-scrollbar-thumb{background:#506775;border:2px solid var(--deep);border-radius:10px}
.site-header{padding:29px clamp(24px,6vw,94px)}.brand img{width:162px}.site-header nav{font-size:14px;font-weight:500;letter-spacing:.025em}.nav-cta{border-radius:0;padding:11px 20px}
.hero-media video{filter:blur(3px) brightness(.64) saturate(.8);transform:scale(1.045) translate3d(0,var(--hero-shift),0);will-change:transform}.hero-content{padding-bottom:140px}.hero h1{font-size:clamp(3.35rem,6.7vw,6rem);line-height:1.06;letter-spacing:-.035em;font-weight:600;max-width:1050px}.title-line{display:block;overflow:hidden}.title-line>span{display:block}.hero h1 .title-serif{font-family:'Playfair Display',Georgia,serif;font-weight:400;letter-spacing:-.035em}.hero h1 em{font-weight:400}.hero-content p{font-size:clamp(16px,1.4vw,19px);line-height:1.6;max-width:490px;color:#e3ece9;margin:32px 0 34px}.button{border-radius:0;font-size:15px;font-weight:600;letter-spacing:.02em;min-height:51px;padding:0 28px;gap:0}.scroll-cue{gap:13px;font-size:13px;font-weight:500}.scroll-cue span{width:16px;height:16px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) scale(.6) translateY(-3px)}.motion-toggle{border-radius:0;right:clamp(24px,6vw,94px)}
.steps{padding:clamp(88px,10vw,154px) clamp(24px,8vw,128px)}.section-intro h2,.city h2,.closing h2{font-family:'Playfair Display',Georgia,serif;font-size:clamp(2.65rem,5vw,5.2rem);line-height:1.16;letter-spacing:-.025em;font-weight:400}.section-intro h2 em,.city h2 em{font-weight:400}.section-intro p{margin-top:20px;color:#41545c}.step-list{list-style:none;padding:0;gap:34px;margin-top:74px}.step{display:grid;grid-template-columns:42px 1fr;gap:14px}.step-number{color:#246d50;font-weight:600;padding-top:6px}.step h3{font-weight:600;margin:0 0 13px;font-size:21px}.step p{color:#41545c;font-size:16px;line-height:1.55}
.city{grid-template-columns:1.08fr .92fr;min-height:620px;overflow:hidden}.city-image img{height:calc(100% + 80px);margin-top:-40px;transform:translate3d(0,var(--city-shift),0);will-change:transform}.city h2{font-size:clamp(2.6rem,4.2vw,4.8rem)}.city h2 em{color:var(--lime)}.city-copy p{color:#d8e6e4;font-size:18px}.text-link{font-weight:600;gap:0}.closing h2{font-size:clamp(2.8rem,5vw,5.3rem)}.site-footer{font-size:13px}.site-footer a{text-underline-offset:4px}
@media(prefers-reduced-motion:no-preference){.hero .title-line>span{animation:line-rise 1.05s cubic-bezier(.16,1,.3,1) both}.hero .title-line:nth-child(2)>span{animation-delay:.16s}.hero-content p,.hero-actions{animation:soft-in .85s cubic-bezier(.16,1,.3,1) both}.hero-content p{animation-delay:.3s}.hero-actions{animation-delay:.42s}@keyframes line-rise{from{transform:translateY(110%)}to{transform:translateY(0)}}@keyframes soft-in{from{opacity:.15;transform:translateY(14px)}to{opacity:1;transform:none}}.section-intro[data-reveal]:not(.is-visible){clip-path:inset(0 0 100% 0)}.section-intro[data-reveal]{transition:clip-path .9s cubic-bezier(.16,1,.3,1)}.step[data-reveal]:not(.is-visible){opacity:.1;transform:translateY(18px)}.step[data-reveal]{transition:opacity .7s,transform .7s cubic-bezier(.16,1,.3,1)}.step[data-reveal]:nth-child(2){transition-delay:.09s}.step[data-reveal]:nth-child(3){transition-delay:.18s}.city-copy[data-reveal]:not(.is-visible){opacity:.15;transform:translateX(22px)}.city-copy[data-reveal]{transition:opacity .85s,transform .85s cubic-bezier(.16,1,.3,1)}}
@media(max-width:900px){.city{grid-template-columns:1fr}.step-list{gap:22px}.step{grid-template-columns:1fr;gap:14px}.city-image{height:450px}}
@media(max-width:600px){.brand img{width:132px}.hero-content{padding:130px 24px 115px}.hero h1{font-size:clamp(2.9rem,11.3vw,4.6rem);line-height:1.1;letter-spacing:-.035em}.hero-content p{font-size:16px;margin:26px 0 29px}.steps{padding:90px 24px}.step-list{grid-template-columns:1fr;gap:28px;margin-top:55px}.step{grid-template-columns:34px 1fr;gap:12px}.city-image{height:340px}.city-copy{padding:70px 24px 82px}.site-header .nav-cta,.nav-how{display:none}}
@media(prefers-reduced-motion:reduce){.hero-media video,.city-image img{transform:none}}

/* Observe the section itself; clip only its heading so it remains intersectable. */
@media(prefers-reduced-motion:no-preference){.section-intro[data-reveal]:not(.is-visible){clip-path:none}.section-intro[data-reveal]:not(.is-visible) h2{clip-path:inset(0 0 100% 0)}.section-intro[data-reveal] h2{transition:clip-path .9s cubic-bezier(.16,1,.3,1)}}
.hero h1 em,.section-intro h2 em,.city h2 em{font-style:normal}

/* Light page frame and header, following the supplied Studio reference. */
body{background:#f3f2ed;padding:0 6px 6px}
.site-header{position:relative;z-index:5;max-width:none;min-height:59px;margin:0 -6px;padding:8px clamp(20px,3.2vw,42px);display:grid;grid-template-columns:1fr auto 1fr;gap:24px;background:#f3f2ed;color:#171717}
.site-header .brand{grid-column:1;justify-self:start}
.site-header .brand img{width:118px;filter:none}
.site-header nav{grid-column:2 / 4;display:grid;grid-template-columns:auto auto minmax(160px,1fr);align-items:center;gap:34px;font-size:14px;font-weight:500;letter-spacing:0}
.site-header .nav-how{display:inline}
.site-header nav>a:not(.nav-how):not(.nav-cta){margin-left:0}
.site-header nav>a:not(.nav-cta):hover{color:#47721a}
.site-header .nav-cta{justify-self:end;background:#171717;border-color:#171717;color:white;padding:10px 22px;font-size:12px;font-weight:700;letter-spacing:.04em}
.site-header .nav-cta:hover{background:#354b28;border-color:#354b28;color:white}
.hero{min-height:calc(100svh - 65px);border-radius:28px;overflow:hidden}
.steps,.city,.closing,.site-footer{margin-top:6px}
.site-footer{background:var(--deep)}
@media(max-width:850px){.site-header{grid-template-columns:1fr auto;gap:14px}.site-header nav{grid-column:2;display:flex;gap:14px}.site-header .nav-how{display:none}.site-header .nav-cta{display:none}}
@media(max-width:600px){body{padding:0 5px 5px}.site-header{margin:0 -5px;min-height:58px;padding:8px 20px}.site-header .brand img{width:108px}.hero{min-height:calc(100svh - 63px);border-radius:22px}.hero-content{padding-top:110px}.steps,.city,.closing,.site-footer{margin-top:5px}}

.whatsapp-help{position:fixed;z-index:20;right:24px;bottom:24px;display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 18px;border-radius:26px;background:#25d366;color:#07391d;box-shadow:0 8px 28px rgba(0,0,0,.28);font-size:14px;font-weight:700;line-height:1;transition:transform .2s,background .2s,box-shadow .2s}
.whatsapp-help:hover{background:#35e477;transform:translateY(-3px);box-shadow:0 11px 30px rgba(0,0,0,.3)}
.whatsapp-help svg{flex:none}
@media(max-width:600px){.whatsapp-help{right:16px;bottom:16px;min-height:48px;padding:0 15px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.whatsapp-help{transition:none}}
