/* Shared visual foundations. Page styles hold service-specific components. */
:root{--sf-ink:#102f32;--sf-paper:#f7f5ef;--sf-accent:#e3bb76;--sf-radius:18px}
html{scroll-padding-top:110px}body{ -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}*,*:before,*:after{box-sizing:border-box}img{max-width:100%}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #218b96;outline-offset:5px}input:not([type=checkbox]):not([type=radio]),select,textarea{min-height:48px}section[id]{scroll-margin-top:110px}.sf-skip{position:fixed;top:10px;left:10px;z-index:10000;padding:14px 20px;background:white;color:#102f32;transform:translateY(-160%)}.sf-skip:focus{transform:none}.sf-menu-toggle{display:none}.reveal{opacity:1;transform:none}
body[data-page=index]{--sand:#f7f5ef;--gold:#e3bb76;--gold-pale:#ffe0a7;--ink:#102f32;--body:#4a5e5e}
[data-page=index] .nav{padding:22px 5vw;background:linear-gradient(#071c24aa,transparent)}
[data-page=index] .nav-links{gap:22px;font-size:10px;letter-spacing:.06em}
[data-page=index] .nav.scrolled{background:#102f32f5}
[data-page=index] .nav-cta{background:var(--gold);color:#102f32;border:0}
[data-page=index] .hero{min-height:850px;min-height:100svh;align-items:center}
[data-page=index] .hero-bg{inset:0;animation:none;background-position:center 58%}
[data-page=index] .hero:before{background:linear-gradient(90deg,#061c28db, #061c2880 48%,#061c2820),linear-gradient(0deg,#061c2880,transparent 40%)}
[data-page=index] .hero-content{max-width:1440px;padding:155px 6vw 120px}
[data-page=index] .hero h1{font-size:clamp(4.5rem,8.8vw,8.5rem);line-height:.94;font-weight:500;letter-spacing:-.055em;max-width:950px}
[data-page=index] .hero-copy{font-size:16px;max-width:445px;line-height:1.8}
[data-page=index] .hero-availability{display:flex;max-width:430px;line-height:1.7;font-weight:400}
[data-page=index] .hero-note{bottom:48px;max-width:215px}
[data-page=index] .button{border-radius:100px;text-transform:none;letter-spacing:0;font-size:13px;padding:0 27px;min-height:54px}
[data-page=index] .intro{padding:95px 6vw 70px}
[data-page=index] .metrics{gap:28px;margin-top:50px}
[data-page=index] .metric-number{font-size:34px}
[data-page=index] .metric-label{font-size:12px;line-height:1.7}
[data-page=index] .experiences{padding:35px 5vw 95px}
[data-page=index] .section-head h2{font-size:clamp(2.6rem,4.3vw,4.4rem);line-height:1.04;max-width:650px}
[data-page=index] .cards{gap:24px}
[data-page=index] .card{border-radius:var(--sf-radius);min-height:540px}
[data-page=index] .card-content{padding:30px}
[data-page=index] .card p{font-size:13px;color:#edf0ec}
[data-page=index] .card-content>img{display:none}
[data-page=index] .card-arrow{border:1px solid #ffffff70;width:42px;height:42px;border-radius:50%;text-align:center}
[data-page=index] .destination-card{border-radius:18px}
[data-page=index] .destinations-system{background:#e7eeea}
[data-page=index] .destination h2,[data-page=index] .health h2,[data-page=index] .imports h2{line-height:1.03}
[data-page=index] .destination-content{padding:65px}
.sf-planning{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:75px max(6vw,24px);background:#102f32;color:#fff}
.sf-planning h2{font:500 clamp(2.8rem,4.5vw,4.7rem)/1.04 'Cormorant Garamond',Georgia,serif;margin-top:18px}
.sf-planning .kicker{color:#e3bb76}.sf-planning ol{list-style:none;margin:0;padding:0}.sf-planning li{display:flex;gap:24px;padding:22px 0;border-bottom:1px solid #ffffff25}.sf-planning li>span{color:#e3bb76;font-size:13px;padding-top:5px}.sf-planning h3{font-size:17px;font-weight:500}.sf-planning li p{font-size:13px;line-height:1.8;color:#c1d1cc;margin-top:8px}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]){--brown-dark:#102f32;--brown:#23474a;--brown-soft:#526d68;--cream:#f7f5ef;--cream-soft:#e8ede5;--text-dark:#163234;--gold:#dfb575;--gold-light:#f2d39b}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa])>nav{background:var(--brown-dark);box-shadow:none;padding:15px 5vw;gap:15px}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa]) .nav-actions{position:static;transform:none;margin-left:auto}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]) .hero-content{max-width:1000px;padding:85px 30px}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]) .hero-content h1{font-size:clamp(2.7rem,5.6vw,5.1rem);line-height:1.12;letter-spacing:-.035em}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]) .section{padding-top:80px;padding-bottom:80px}
body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]) .section h2{font-size:clamp(2rem,3.5vw,3.2rem);letter-spacing:-.025em;line-height:1.2}
.btn-primary,.btn-secondary,.cta-nav,.cta-nav-secondary{min-height:44px;box-shadow:none!important}
.plan-card,.step-card,.treatment-card,.feature-card{border-radius:18px!important;box-shadow:0 12px 32px #102f3209}
.form-section input,.form-section select,.form-section textarea{border-radius:10px!important}
body[data-page=turismo]{background:#f7f5ef;color:#102f32;display:block;min-height:100vh}
[data-page=turismo] .top-bar{background:#102f32;padding:65px 24px 55px;text-align:center}
[data-page=turismo] .top-bar .brand{font-size:clamp(2.8rem,6vw,5rem);line-height:1.08;color:#fff;margin:24px 0;font-weight:500}
[data-page=turismo] .top-bar em{color:#efd0a0}
[data-page=turismo] .kicker{color:#efd0a0;font-size:11px;text-transform:uppercase;letter-spacing:.16em}
[data-page=turismo] .services{max-width:1280px;min-height:0;margin:45px auto;padding:0 24px;gap:24px}
[data-page=turismo] .card{min-height:550px;border-radius:20px;flex:1}
[data-page=turismo] .events-section{padding:15px 24px 35px}
[data-page=turismo] .more-soon{color:#526d68}
[data-page=soirx] .hero-title{letter-spacing:-.04em;line-height:1.1}
[data-page=soirx] .section-title{letter-spacing:-.025em}
[data-page=maleta-usa] .hero-content h1{font-size:clamp(2.7rem,5vw,4.7rem);letter-spacing:-.04em}
[data-page=ruta57] .hero h1{letter-spacing:-.04em}
[data-page=admin] input,[data-page=admin] select,[data-page=admin] button{min-height:44px}
@media(min-width:1600px){body:not([data-page=admin]) .section{padding-left:max(6vw,calc((100vw - 1320px)/2));padding-right:max(6vw,calc((100vw - 1320px)/2))}}
@media(max-width:1000px){[data-page=index] .sf-menu-toggle{display:flex;align-items:center;gap:16px;background:transparent;color:white;border:1px solid #ffffff60;border-radius:50px;padding:10px 16px;min-height:44px;cursor:pointer}[data-page=index] .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#102f32;padding:20px 6vw 30px;flex-direction:column;align-items:stretch;gap:4px}[data-page=index] .nav-links[data-open]{display:flex}[data-page=index] .nav-links a{display:block;padding:14px;font-size:12px}[data-page=index] .nav{overflow:visible}[data-page=index] .nav-inner{gap:20px}[data-page=index] .hero-note{display:none}.sf-planning{gap:35px}}
@media(max-width:640px){html{scroll-padding-top:130px}body{overflow-wrap:break-word}input,select,textarea{font-size:16px!important}[data-page=index] .nav{padding:15px 20px}[data-page=index] .brand-row{font-size:24px}[data-page=index] .hero{min-height:780px;min-height:100svh}[data-page=index] .hero-content{padding:130px 24px 85px}[data-page=index] .hero h1{font-size:clamp(3.65rem,14vw,5.2rem);line-height:.98}[data-page=index] .eyebrow{font-size:9px;letter-spacing:.11em}[data-page=index] .hero-copy{font-size:14px;margin-top:24px}[data-page=index] .hero-actions{gap:10px;margin-top:25px;width:100%}[data-page=index] .hero-availability{font-size:10px;margin-top:18px}[data-page=index] .intro{padding:60px 24px 35px}[data-page=index] .intro-wrap{gap:24px}[data-page=index] .intro-copy{font-size:14px}[data-page=index] .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}[data-page=index] .metric-number{font-size:30px}[data-page=index] .experiences{padding:30px 20px 55px}[data-page=index] .section-head{display:block}[data-page=index] .text-link{display:inline-block;margin-top:20px}[data-page=index] .cards{grid-template-columns:1fr;gap:18px}[data-page=index] .card{min-height:440px}[data-page=index] .card h3{font-size:40px}[data-page=index] .destination-content{padding:50px 24px}[data-page=index] .health-content,[data-page=index] .imports-content{padding:50px 24px}[data-page=index] .mobile-cta{padding-bottom:max(12px,env(safe-area-inset-bottom))}[data-page=index] .mobile-cta a{border-radius:30px}[data-page=index] .whatsapp-fab{bottom:calc(86px + env(safe-area-inset-bottom))}.sf-planning{grid-template-columns:1fr;gap:20px;padding:50px 24px}body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa])>nav{padding:10px 16px;justify-content:space-between}body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa]) .nav-actions{order:3;width:100%;justify-content:center;margin:0}nav a.cta-nav-secondary{font-size:11px;padding:8px 12px}body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]) .hero-content{padding:55px 22px}.hero-ctas{gap:12px}.hero-ctas>a{width:100%;text-align:center}body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote]) .section{padding-top:50px;padding-bottom:50px}[data-page=turismo] .services{display:grid;grid-template-columns:1fr;padding:0 20px;margin:25px auto}[data-page=turismo] .card{min-height:470px}[data-page=turismo] .top-bar{padding:55px 20px 35px}[data-page=admin] .table-wrap{overflow-x:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1!important;transform:none!important}}
/* Compact two-row navigation leaves more room for the experience on phones. */
@media(max-width:640px){body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa])>nav>a.cta-nav{position:absolute;right:16px;top:16px;font-size:11px;padding:9px 13px}body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa])>nav{position:relative}body:is([data-page=bar-flotante],[data-page=planchon],[data-page=bote],[data-page=maleta-usa]) .logo-text{font-size:1.05rem}.hero-content .badge-location{font-size:10px}}