/* ==========================================================================
   Costa del Sol Websites — base
   Tokens, reset, type, layout, buttons, pills, chips, cards, form fields,
   device frames and motion states. Section styles follow in their own blocks.
   ========================================================================== */

:root{
  /* brand — sampled from the logo */
  --navy-950:#020F22;
  --navy-900:#041A36;
  --navy-800:#07254A;
  --navy:#022D5B;
  --navy-600:#0D4683;
  --navy-300:#8FA6C4;
  --teal:#0CA5B5;
  --teal-700:#06737F;
  --teal-300:#76D2DB;
  --teal-100:#D3EFF2;
  --teal-50:#ECF8F9;
  --sun:#FCB900;
  --sun-600:#E5A700;
  --sun-300:#FFD45C;
  --sun-100:#FFF1C2;

  /* surfaces */
  --paper:#FFFFFF;
  --foam:#EEF5F5;
  --foam-2:#DDEAEA;
  --line:#DCE5E6;
  --line-2:#C5D2D4;
  --line-ctl:#7C8C9C;               /* form-control boundaries: 3:1 on white and foam */

  /* text */
  --ink:#0F2440;
  --ink-2:#34465F;
  --mute:#5A6A7E;
  --on-dark:#FFFFFF;
  --on-dark-2:#BCC9DB;
  --on-dark-3:#8396B2;
  --line-dark:rgba(255,255,255,.13);

  /* status */
  --ok:#1E9E63;
  --err:#C93838;
  --wa:#25D366;

  /* type */
  --f-display:"Bricolage Grotesque","Instrument Sans",system-ui,sans-serif;
  --f-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --fs-xs:13px;
  --fs-sm:15px;
  --fs-base:17px;
  --fs-md:19px;
  --fs-lg:clamp(19px,1.55vw,22px);
  --fs-h3:clamp(22px,2.1vw,28px);
  --fs-h2:clamp(36px,5vw,66px);
  --fs-h1:clamp(46px,7.4vw,108px);

  /* layout */
  --wrap:1240px;
  --wrap-narrow:880px;
  --gutter:clamp(16px,4vw,40px);
  --section-y:clamp(88px,11vw,156px);
  --header-h:76px;

  /* shape */
  --r-xs:8px;
  --r-sm:12px;
  --r:18px;
  --r-lg:28px;
  --r-xl:36px;
  --r-pill:999px;

  /* elevation — only for things that float */
  --sh-float:0 30px 60px -28px rgba(4,26,54,.38),0 8px 22px -12px rgba(4,26,54,.18);
  --sh-lift:0 16px 36px -20px rgba(4,26,54,.32);
  --sh-sun:0 14px 30px -14px rgba(229,167,0,.7);

  /* motion */
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 16px);scroll-padding-bottom:88px}
html:not(.lenis){scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--paper);color:var(--ink);font:400 var(--fs-base)/1.6 var(--f-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
img,svg,video,canvas{display:block;max-width:100%}
img{height:auto}
[hidden]{display:none!important}
a{color:var(--teal-700);text-underline-offset:.18em;text-decoration-thickness:1.5px}
a:hover{color:var(--navy)}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
input,select,textarea{font:inherit;color:inherit}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0}
dialog{color:inherit}
::selection{background:var(--sun-300);color:var(--navy)}
:focus-visible{outline:3px solid var(--teal-700);outline-offset:3px;border-radius:6px}
.section--dark :focus-visible,.on-dark :focus-visible{outline-color:var(--sun)}
/* anchor offset comes from html scroll-padding (also keeps focused elements clear of the fixed header) */

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-smooth iframe{pointer-events:none}
html.is-locked,html.is-locked body{overflow:hidden}

/* cross-document page transitions (supporting browsers) */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.38s;animation-timing-function:var(--ease-out)}

/* ---------- accessibility helpers ---------- */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;left:16px;top:-80px;z-index:200;background:var(--navy);color:#fff;padding:12px 18px;border-radius:var(--r-sm);font-weight:600;text-decoration:none;transition:top .25s var(--ease-out)}
.skip-link:focus{top:16px;color:#fff}
.no-scrollbar{scrollbar-width:none}
.no-scrollbar::-webkit-scrollbar{display:none}

/* ---------- type ---------- */
h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--f-display);font-weight:700;line-height:1.05;letter-spacing:-.025em;color:inherit;font-optical-sizing:auto;text-wrap:balance}
.h1{font-size:var(--fs-h1);font-weight:800;line-height:.96;letter-spacing:-.04em}
.h2{font-size:var(--fs-h2);font-weight:750;line-height:1;letter-spacing:-.035em}
.h3{font-size:var(--fs-h3);font-weight:700;line-height:1.12;letter-spacing:-.02em}
h1,.h1,h2,.h2{color:var(--navy)}
.lead{font-size:var(--fs-lg);line-height:1.55;color:var(--ink-2);max-width:36em}
.muted{color:var(--mute)}
.text-teal{color:var(--teal-700)}
.text-sun{color:var(--sun-600)}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:calc(var(--wrap) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.wrap--narrow{max-width:calc(var(--wrap-narrow) + 2 * var(--gutter))}
.section{position:relative;padding-block:var(--section-y);overflow-x:clip}
.section--foam{background:var(--foam)}
.section--dark{background:var(--navy-900);color:var(--on-dark)}
.section--dark h1,.section--dark .h1,.section--dark h2,.section--dark .h2,.section--dark h3,.section--dark .h3{color:#fff}
.section--dark .lead{color:var(--on-dark-2)}
.section--dark .muted{color:var(--on-dark-3)}
.section--dark a:not(.btn){color:var(--teal-300)}
.section--dark a:not(.btn):hover{color:#fff}
.section-head{max-width:820px;margin-bottom:clamp(44px,6vw,80px)}
.section-head .h2+.lead{margin-top:clamp(18px,2vw,26px)}
.section-head--center{margin-inline:auto;text-align:center}
.section-head--center .lead{margin-inline:auto}

/* ---------- icons & flags ---------- */
.i{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.i--fill{fill:currentColor;stroke:none}
.flag{display:inline-block;flex:none;width:24px;height:24px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1.5px rgba(4,26,54,.14);background:#eee}
.flag svg{width:100%;height:100%}

/* ---------- buttons ---------- */
.btn{
  --btn-bg:var(--navy);--btn-fg:#fff;--btn-bd:transparent;
  position:relative;isolation:isolate;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:54px;padding:0 28px;border-radius:var(--r-pill);border:1.5px solid var(--btn-bd);
  background:var(--btn-bg);color:var(--btn-fg);
  font:600 16px/1 var(--f-body);letter-spacing:-.005em;text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:translate .45s var(--ease-out),box-shadow .45s var(--ease-out),background-color .25s,color .25s,border-color .25s;
}
.btn:hover{color:var(--btn-fg);translate:0 -2px}
.btn:active{translate:0 0;scale:.98}
.btn .i{width:19px;height:19px}
.btn--primary{--btn-bg:var(--sun);--btn-fg:var(--navy);box-shadow:var(--sh-sun)}
.btn--primary::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.6) 50%,transparent 65%);translate:-110% 0;transition:translate .9s var(--ease-out)}
.btn--primary:hover::before{translate:110% 0}
.btn--primary:hover{--btn-bg:#FFC21F}
.btn--dark{--btn-bg:var(--navy);--btn-fg:#fff}
.btn--dark:hover{--btn-bg:var(--navy-600)}
.btn--ghost{--btn-bg:transparent;--btn-fg:var(--navy);--btn-bd:var(--line-2)}
.btn--ghost:hover{--btn-bd:var(--navy);--btn-bg:rgba(2,45,91,.04)}
.btn--light{--btn-bg:#fff;--btn-fg:var(--navy)}
.btn--light:hover{--btn-bg:var(--teal-50)}
.btn--ghost-light{--btn-bg:transparent;--btn-fg:#fff;--btn-bd:rgba(255,255,255,.32)}
.btn--ghost-light:hover{--btn-bd:#fff;--btn-bg:rgba(255,255,255,.06)}
.btn--wa{--btn-bg:var(--wa);--btn-fg:#04381C}
.btn--wa:hover{--btn-bg:#3BE07A}
.btn--lg{min-height:62px;padding:0 34px;font-size:17px}
.btn--sm{min-height:42px;padding:0 18px;font-size:14.5px;gap:8px}
.btn--sm .i{width:16px;height:16px}
.btn--block{display:flex;width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
@media (max-width:480px){.btn--block,.btn--lg{white-space:normal;text-align:center;line-height:1.2;padding-block:14px;height:auto}}

/* ---------- pills ---------- */
.pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:var(--r-pill);font:600 13.5px/1.2 var(--f-body);background:var(--foam);color:var(--ink-2);border:1px solid var(--line);white-space:nowrap}
.pill .i{width:15px;height:15px}
.pill--sun{background:var(--sun-100);color:#634500;border-color:#F4D98A}
.pill--teal{background:var(--teal-50);color:var(--teal-700);border-color:var(--teal-100)}
.pill--dark{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.16)}
.pill--glass{background:rgba(255,255,255,.78);border-color:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--sh-lift)}
.live-dot{position:relative;display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:var(--ok)}
.live-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:live-ping 2s var(--ease-out) infinite}
/* paused while off-screen (core.js toggles .is-off) */
.live-dot.is-off::after{animation-play-state:paused}
@keyframes live-ping{0%{transform:scale(1);opacity:.6}80%,100%{transform:scale(2.8);opacity:0}}

/* ---------- chips (selectable) ---------- */
.chip{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r-pill);border:1.5px solid var(--line-2);background:#fff;color:var(--ink-2);font:500 15px/1.1 var(--f-body);cursor:pointer;user-select:none;transition:background-color .25s,border-color .25s,color .25s,scale .35s var(--ease-spring)}
.chip .i{width:17px;height:17px}
.chip:hover{border-color:var(--navy);color:var(--navy)}
.chip:active{scale:.96}
.chip[aria-pressed="true"],.chip[aria-checked="true"],.chip[aria-selected="true"],.chip.is-active{background:var(--navy);border-color:var(--navy);color:#fff}
.section--dark .chip{background:transparent;border-color:rgba(255,255,255,.24);color:var(--on-dark-2)}
.section--dark .chip:hover{border-color:#fff;color:#fff}
.section--dark .chip[aria-pressed="true"],.section--dark .chip[aria-checked="true"],.section--dark .chip[aria-selected="true"],.section--dark .chip.is-active{background:#fff;border-color:#fff;color:var(--navy)}

/* ---------- cards ---------- */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg)}
.section--dark .card{background:rgba(255,255,255,.04);border-color:var(--line-dark)}

/* ---------- forms ---------- */
.field{display:grid;gap:8px;min-width:0}
.field__label{font:600 15px/1.35 var(--f-body);color:var(--navy)}
.field__hint{font-size:14px;color:var(--mute)}
.field__error{font-size:14px;font-weight:500;color:var(--err)}
.input,.select,.textarea{width:100%;min-height:56px;padding:15px 18px;border:1.5px solid var(--line-ctl);border-radius:var(--r-sm);background:#fff;color:var(--ink);font:400 16px/1.4 var(--f-body);transition:border-color .2s,box-shadow .25s,background-color .2s;-webkit-appearance:none;appearance:none}
.input::placeholder,.textarea::placeholder{color:var(--mute);opacity:1}
.input:hover,.select:hover,.textarea:hover{border-color:var(--navy-600)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--teal-700);box-shadow:0 0 0 2px var(--teal-700)}
.select{padding-right:48px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23022D5B' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:20px;cursor:pointer}
.textarea{min-height:128px;resize:vertical}
.field.is-invalid .input,.field.is-invalid .select,.field.is-invalid .textarea{border-color:var(--err);box-shadow:0 0 0 4px rgba(201,56,56,.12)}
.check{display:flex;align-items:flex-start;gap:12px;font-size:15px;line-height:1.45;color:var(--ink-2);cursor:pointer}
.check input{flex:none;width:22px;height:22px;margin:0;border:1.5px solid var(--line-ctl);border-radius:6px;background:#fff;-webkit-appearance:none;appearance:none;display:grid;place-content:center;cursor:pointer;transition:background-color .2s,border-color .2s}
.check input::after{content:"";width:11px;height:6px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:translateY(-1px) rotate(-45deg) scale(0);transition:transform .3s var(--ease-spring)}
.check input:checked{background:var(--navy);border-color:var(--navy)}
.check input:checked::after{transform:translateY(-1px) rotate(-45deg) scale(1)}

/* toggle switch */
.switch{position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer;font-weight:600;color:var(--navy);user-select:none}
.switch input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.switch__track{position:relative;flex:none;width:54px;height:32px;border-radius:var(--r-pill);background:var(--line-ctl);transition:background-color .3s}
.switch__track::after{content:"";position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(4,26,54,.25);transition:translate .45s var(--ease-spring)}
.switch input:checked+.switch__track{background:var(--teal-700)}
.switch input:checked+.switch__track::after{translate:22px 0}
.switch input:focus-visible+.switch__track{outline:3px solid var(--teal-700);outline-offset:3px}

/* ---------- device frames ---------- */
.browser{position:relative;background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid rgba(4,26,54,.1);box-shadow:var(--sh-float)}
.browser__bar{display:flex;align-items:center;gap:12px;height:40px;padding:0 14px;background:#F2F5F6;border-bottom:1px solid var(--line)}
.browser__dots{display:flex;gap:7px;flex:none}
.browser__dots i{display:block;width:10px;height:10px;border-radius:50%;background:#D5DDE0}
.browser__dots i:nth-child(1){background:#FF6159}
.browser__dots i:nth-child(2){background:#FFBD2E}
.browser__dots i:nth-child(3){background:#28C941}
.browser__url{flex:1;min-width:0;max-width:360px;margin-inline:auto;display:flex;align-items:center;justify-content:center;gap:6px;height:26px;padding:0 12px;border-radius:8px;background:#fff;border:1px solid var(--line);font:500 12.5px/1 var(--f-body);color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.browser__url .i{width:12px;height:12px;color:var(--ok);stroke-width:2.4}
.browser__body{position:relative;overflow:hidden}
.phone{--ph-w:250px;position:relative;width:var(--ph-w);aspect-ratio:9/19.2;border-radius:calc(var(--ph-w) * .16);background:#0A1324;padding:calc(var(--ph-w) * .034);box-shadow:var(--sh-float),inset 0 0 0 1.5px rgba(255,255,255,.1)}
.phone__screen{position:relative;width:100%;height:100%;border-radius:calc(var(--ph-w) * .128);overflow:hidden;background:#fff}
.phone__notch{position:absolute;z-index:5;top:calc(var(--ph-w) * .03);left:50%;translate:-50% 0;width:30%;height:calc(var(--ph-w) * .072);border-radius:var(--r-pill);background:#0A1324}

/* ---------- decor ---------- */
.glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.glow--sun{background:radial-gradient(closest-side,rgba(252,185,0,.32),rgba(252,185,0,.1) 55%,transparent)}
.glow--teal{background:radial-gradient(closest-side,rgba(12,165,181,.26),rgba(12,165,181,.08) 55%,transparent)}
.wave-sep{position:absolute;left:0;width:100%;height:clamp(36px,5vw,80px);pointer-events:none;fill:currentColor}

/* ---------- motion states (see core.js) ---------- */
.js:not(.no-motion) [data-reveal]:not(.is-in){opacity:0}
.js:not(.no-motion) [data-reveal-group]:not(.is-in)>*{opacity:0}
.js:not(.no-motion) [data-split]:not(.is-split){opacity:0}
.split-line-mask{padding-bottom:.1em;margin-bottom:-.1em}
.i18n-pending body{opacity:0}
/* visitor paused animations (core.js CSW.setMotionPaused) */
.motion-paused *,.motion-paused *::before,.motion-paused *::after{animation-play-state:paused!important}
body{transition:opacity .2s ease}


/* ==========================================================================
   chrome
   ========================================================================== */
/* Site chrome: header (hd-), mobile menu (mm-), footer (ftr-), floating WhatsApp (wa-), 404 page (nf-).
   Layers: header 100, mobile menu 95, floating WhatsApp 90, footer 3 (its wave edge overlaps the section above). */

/* ---------- header ---------- */
.hd{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--header-h);color:var(--navy);transition:height .4s var(--ease-out),transform .45s var(--ease-out)}
.hd::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.6) blur(16px);backdrop-filter:saturate(1.6) blur(16px);box-shadow:inset 0 -1px 0 rgba(4,26,54,.09);opacity:0;transition:opacity .35s var(--ease-out) .08s}
.is-scrolled .hd::before,.page .hd::before{opacity:1}
.is-scrolled .hd{height:64px}
html.mm-open .hd::before{opacity:0;transition-delay:.3s}
html.mm-open .hd :focus-visible{outline-color:var(--sun)}
@media (max-width:1023.98px){
  html.is-scrolling-down:not(.mm-open) .hd{transform:translate3d(0,-100%,0)}
  html.is-scrolling-down .hd:has(:focus-visible){transform:none}
}

.hd-bar{position:relative;height:100%;display:flex;align-items:center;gap:12px}

.hd-logo{position:relative;flex:none;display:block;border-radius:8px;transform-origin:0 50%;transition:transform .4s var(--ease-out)}
.hd-logo__img{display:block;width:auto;height:36px;transition:opacity .3s var(--ease-out) .08s}
.hd-logo__img--light{position:absolute;top:0;left:0;opacity:0}
.mm-open .hd-logo__img{opacity:0;transition-delay:.3s}
.mm-open .hd-logo__img--light{opacity:1}
.is-scrolled .hd-logo{transform:scale(.92)}

/* desktop nav with the sliding wave */
.hd-nav{display:none}
.hd-nav__list{display:flex;align-items:center;list-style:none}
.hd-nav__link{display:inline-flex;align-items:center;min-height:44px;padding:0 clamp(9px,.95vw,15px);border-radius:var(--r-pill);color:var(--ink-2);font:500 15.5px/1 var(--f-body);letter-spacing:-.005em;text-decoration:none;white-space:nowrap;transition:color .25s}
.hd-nav__link:hover,.hd-nav__link[aria-current="true"]{color:var(--navy)}
.hd-nav__wave{position:absolute;left:0;bottom:1px;width:28px;height:8px;fill:none;stroke:var(--teal);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:0;pointer-events:none;transition:opacity .3s var(--ease-out)}
.is-ready:not(.no-motion) .hd-nav__wave{transition:opacity .3s var(--ease-out),transform .6s var(--ease-out)}
.is-ready:not(.no-motion) .hd-nav__wave--jump{transition:opacity .3s var(--ease-out)}
.hd-nav__wave--on{opacity:1}

.hd-end{display:flex;align-items:center;gap:6px;margin-left:auto}
.hd-lang{transition:opacity .3s var(--ease-out) .1s,visibility 0s linear 0s}
.hd-cta{transition:translate .45s var(--ease-out),box-shadow .45s var(--ease-out),background-color .25s,color .25s,opacity .3s var(--ease-out) .1s,visibility 0s linear 0s}
.mm-open .hd-lang,.mm-open .hd-cta{opacity:0;visibility:hidden;transition:opacity .2s var(--ease-out),visibility 0s linear .2s}

/* language flags: the ring slides to the active one */
.hd-lang{position:relative;display:flex;flex:none}
.hd-lang__btn{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%}
.hd-lang__btn .flag{width:26px;height:26px;transition:opacity .3s,filter .3s,transform .45s var(--ease-spring)}
.hd-lang__btn[aria-pressed="false"] .flag{opacity:.78;transform:scale(.88)}
.hd-lang__btn:hover .flag{opacity:1;filter:none;transform:scale(1.08)}
.hd-lang__ring{position:absolute;top:4px;left:4px;width:36px;height:36px;border:2px solid var(--teal-700);border-radius:50%;pointer-events:none}
.is-ready .hd-lang__ring{transition:transform .55s var(--ease-spring)}
html[lang="es"] .hd-lang__ring{transform:translateX(44px)}

.hd-cta{display:none}
.mm-open .hd-cta{transition:translate .45s var(--ease-out),box-shadow .45s var(--ease-out),background-color .25s,color .25s,opacity .2s var(--ease-out),visibility 0s linear .2s}

/* burger that morphs into an X */
.hd-burger{position:relative;display:grid;place-items:center;flex:none;width:44px;height:44px;margin-right:-8px;border-radius:12px;color:var(--navy);transition:color .3s var(--ease-out) .08s}
.mm-open .hd-burger{color:#fff;transition-delay:.3s}
.hd-burger__lines{position:relative;display:block;width:22px;height:14px}
.hd-burger__lines i{position:absolute;left:0;display:block;width:100%;height:2px;border-radius:2px;background:currentColor;transition:transform .45s var(--ease-out),opacity .25s var(--ease-out)}
.hd-burger__lines i:nth-child(1){top:0}
.hd-burger__lines i:nth-child(2){top:6px}
.hd-burger__lines i:nth-child(3){top:12px}
.mm-open .hd-burger__lines i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.mm-open .hd-burger__lines i:nth-child(2){opacity:0;transform:scaleX(.2)}
.mm-open .hd-burger__lines i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
html:not(.js) .hd-burger{display:none}

/* reading progress along the bottom edge */
.hd-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--teal);transform:scaleX(0);transform-origin:0 50%;pointer-events:none;transition:opacity .3s}
.mm-open .hd-progress{opacity:0}

@media (min-width:480px){
  .hd-end{gap:10px}
  .hd-cta{display:inline-flex}
}
@media (min-width:1024px){
  .hd-logo__img{height:44px}
  .hd-nav{position:relative;display:block;margin-inline:auto}
  .hd-end{margin-left:0;gap:12px}
  .hd-burger{display:none}
}
@media (min-width:1200px){
  .hd-nav{position:absolute;top:50%;left:50%;margin:0;transform:translate(-50%,-50%)}
  .hd-end{margin-left:auto}
}

/* ---------- mobile menu ---------- */
.mm{position:fixed;inset:0;z-index:95;background:var(--navy-900);color:#fff}
.mm-crest{position:absolute;left:0;bottom:calc(100% - 1px);width:100%;height:clamp(28px,6vw,56px);fill:var(--navy-900);pointer-events:none}
.mm-scroll{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.mm-inner{min-height:100%;display:flex;flex-direction:column;padding-top:calc(var(--header-h) + 16px);padding-bottom:calc(24px + env(safe-area-inset-bottom))}
.mm-list{list-style:none}
.mm-link{display:inline-flex;align-items:center;gap:.3em;padding:.12em 0;color:#fff;font-family:var(--f-display);font-weight:700;font-size:clamp(34px,10vw,64px);font-size:clamp(32px,min(10vw,6.3svh),64px);line-height:1.04;letter-spacing:-.035em;text-decoration:none;font-optical-sizing:auto;transition:color .25s}
.mm-link:hover{color:var(--teal-300)}
.mm-link::after{content:"";flex:none;width:.6em;height:.22em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 8' fill='none' stroke='%2376D2DB' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M1.5 4.5Q4.75 1 8 4.5T14.5 4.5T21 4.5T26.5 4.5'/%3E%3C/svg%3E") center/contain no-repeat;opacity:0;transform:translateX(-.25em);transition:opacity .3s var(--ease-out),transform .45s var(--ease-out)}
.mm-link[aria-current="true"]{color:var(--teal-300)}
.mm-link[aria-current="true"]::after{opacity:1;transform:none}

.mm-waves{position:relative;flex:none;height:50px;margin:auto calc(var(--gutter) * -1) clamp(14px,2.6svh,28px);padding-top:clamp(16px,3svh,32px);overflow:hidden;box-sizing:content-box}
.mm-waves__line{position:absolute;left:0;width:200%;max-width:none;height:22px;fill:none;stroke:var(--teal-300);stroke-width:2;stroke-linecap:round}
.mm-waves__line path{vector-effect:non-scaling-stroke}
.mm-waves__line--1{bottom:28px;opacity:.6}
.mm-waves__line--2{bottom:14px;opacity:.36}
.mm-waves__line--3{bottom:0;opacity:.2}

.mm-side{display:grid;gap:14px;width:100%;max-width:520px}
.mm-lang{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;border:1px solid var(--line-dark);border-radius:var(--r-pill);background:rgba(255,255,255,.05)}
.mm-lang__btn{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;border-radius:var(--r-pill);color:var(--on-dark-2);font:600 16px/1 var(--f-body);transition:color .35s var(--ease-out)}
.mm-lang__btn:hover{color:#fff}
.mm-lang__btn[aria-pressed="true"]{color:var(--navy)}
.mm-lang__btn .flag{width:24px;height:24px;box-shadow:0 0 0 1.5px rgba(255,255,255,.2)}
.mm-lang__btn[aria-pressed="true"] .flag{box-shadow:0 0 0 1.5px rgba(4,26,54,.14)}
.mm-lang__thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:var(--r-pill);background:#fff;pointer-events:none}
.is-ready .mm-lang__thumb{transition:transform .55s var(--ease-spring)}
html[lang="es"] .mm-lang__thumb{transform:translateX(100%)}

.mm-contact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;list-style:none}
.mm-contact__link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:66px;padding:8px 4px;border:1px solid var(--line-dark);border-radius:var(--r);color:#fff;font:600 14.5px/1.1 var(--f-body);text-align:center;text-decoration:none;transition:background-color .25s,border-color .25s}
.mm-contact__link:hover{color:#fff;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.3)}
.mm-contact__link .i{width:22px;height:22px;color:var(--teal-300)}
.mm-contact__link--wa .i{color:var(--wa)}
.mm-note{font-size:14px;color:var(--on-dark-3)}

/* entrance: the panel rises like the tide, then the links stagger in */
.is-ready:not(.no-motion) .mm{transform:translate3d(0,calc(100% + 64px),0);transition:transform .55s var(--ease-in-out)}
.is-ready.mm-open:not(.no-motion) .mm{transform:none;transition:transform .8s var(--ease-out)}
.is-ready:not(.no-motion) .mm-item,.is-ready:not(.no-motion) .mm-waves,.is-ready:not(.no-motion) .mm-side{opacity:0;transform:translate3d(0,28px,0);transition:opacity .2s var(--ease-out),transform .4s var(--ease-out)}
.is-ready.mm-open:not(.no-motion) .mm-item{opacity:1;transform:none;transition:opacity .6s var(--ease-out) calc(.2s + var(--i,0) * .055s),transform .9s var(--ease-out) calc(.2s + var(--i,0) * .055s)}
.is-ready.mm-open:not(.no-motion) .mm-waves{opacity:1;transform:none;transition:opacity .9s var(--ease-out) .42s,transform 1s var(--ease-out) .42s}
.is-ready.mm-open:not(.no-motion) .mm-side{opacity:1;transform:none;transition:opacity .7s var(--ease-out) .5s,transform .9s var(--ease-out) .5s}
.is-ready.mm-open:not(.no-motion) .mm-waves__line--1{animation:mm-drift 26s linear infinite}
.is-ready.mm-open:not(.no-motion) .mm-waves__line--2{animation:mm-drift 34s linear infinite reverse}
.is-ready.mm-open:not(.no-motion) .mm-waves__line--3{animation:mm-drift 44s linear infinite}
@keyframes mm-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

@media (max-height:640px){
  .mm-waves{height:34px}
  .mm-note{display:none}
}
@media (min-width:640px){
  .mm-inner{padding-top:calc(var(--header-h) + 40px)}
}
@media (min-width:1024px){
  .mm{display:none!important}
}

/* ---------- footer ---------- */
.ftr{position:relative;z-index:3;background:var(--navy-900);color:var(--on-dark-2)}
.ftr-edge{position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:clamp(44px,6.5vw,104px);overflow:hidden;pointer-events:none}
.ftr-edge__layer{position:absolute;inset:0;width:100%;height:100%}
.ftr-edge__layer--back{fill:var(--teal)}
.ftr-edge__layer--front{fill:var(--navy-900)}

.ftr-cta{display:grid;gap:clamp(28px,4vw,48px);padding-block:clamp(40px,6vw,96px) clamp(56px,7vw,104px)}
.ftr .ftr-cta__title{max-width:9.5em;color:#fff;font-size:clamp(50px,8.4vw,128px);font-weight:800;line-height:.94;letter-spacing:-.045em}
.ftr-cta__line{max-width:30em;margin-top:clamp(16px,2vw,26px);font-size:var(--fs-lg);line-height:1.5;color:var(--on-dark-2)}
.ftr-cta__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(28px,3.4vw,40px)}
.ftr-scene{order:-1;width:100%;aspect-ratio:520/220}
.ftr-scene svg{width:100%;height:100%}

.ftr-main{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"brand brand" "contact contact" "explore legal";gap:40px 24px;padding-block:clamp(44px,5vw,64px);border-top:1px solid var(--line-dark)}
.ftr-brand{grid-area:brand}
.ftr-col--explore{grid-area:explore}
.ftr-col--contact{grid-area:contact}
.ftr-col--legal{grid-area:legal}
.ftr-logo{display:inline-block;border-radius:8px}
.ftr-logo img{width:auto;height:clamp(50px,4.6vw,60px)}
.ftr-tagline{max-width:24ch;margin-top:16px;color:var(--on-dark-2)}
.ftr .ftr-col__title{margin-bottom:8px;color:#fff;font:600 15px/1.3 var(--f-body);letter-spacing:0}
.ftr-links{list-style:none}
.ftr-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--on-dark-2);font-size:16px;line-height:1.3;text-decoration:none;transition:color .25s}
.ftr-link:hover{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.4)}
.ftr-link .i{width:18px;height:18px;color:var(--teal-300)}
.ftr-link--wa .i{color:var(--wa)}
.ftr-area{display:flex;gap:10px;max-width:30ch;margin-top:10px;font-size:15px;line-height:1.45;color:var(--on-dark-3)}
.ftr-area .i{width:18px;height:18px;margin-top:2px}

.ftr-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;padding-block:22px calc(24px + env(safe-area-inset-bottom));border-top:1px solid var(--line-dark);font-size:14px;color:var(--on-dark-3)}

@media (max-width:559.98px){
  .ftr-cta__actions .btn{width:100%}
}
@media (min-width:768px){
  .ftr-main{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr) minmax(0,.8fr);grid-template-areas:"brand brand brand" "explore contact legal"}
}
@media (min-width:900px){
  .ftr-cta{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end}
  .ftr-scene{order:0;align-self:center;aspect-ratio:2/1}
}
@media (min-width:1100px){
  .ftr-main{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr) minmax(0,1.4fr) minmax(0,.7fr);grid-template-areas:"brand explore contact legal"}
}

/* ---------- floating WhatsApp ---------- */
.wa{position:fixed;z-index:90;right:max(16px,calc(env(safe-area-inset-right) + 12px));bottom:max(16px,calc(env(safe-area-inset-bottom) + 12px));display:flex;flex-direction:column;align-items:flex-end;gap:12px;transform-origin:100% 100%;pointer-events:none}
.wa>*{pointer-events:auto}
.wa-armed .wa{transition:opacity .45s var(--ease-out),transform .6s var(--ease-spring),visibility 0s linear 0s}
.wa-armed .wa:not(.wa--shown),.mm-open .wa{opacity:0;visibility:hidden;transform:translate3d(0,20px,0) scale(.85);transition:opacity .25s var(--ease-out),transform .35s var(--ease-out),visibility 0s linear .35s}

.wa-btn{position:relative;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--wa);color:#04381C;text-decoration:none;box-shadow:0 16px 30px -14px rgba(4,56,28,.6),0 6px 16px -8px rgba(4,26,54,.3);transition:transform .45s var(--ease-spring),background-color .25s}
.wa-btn:hover{color:#04381C;background:#3BE07A;transform:scale(1.07)}
.wa-btn:active{transform:scale(.96)}
.wa-btn .i{width:30px;height:30px}
.wa-btn:focus-visible{outline:3px solid var(--navy);outline-offset:3px;border-radius:50%;box-shadow:0 0 0 3px #fff,0 16px 30px -14px rgba(4,56,28,.6)}
.wa-btn::after{content:"";position:absolute;inset:0;border:2px solid var(--wa);border-radius:50%;opacity:0;pointer-events:none}
.is-ready:not(.no-motion) .wa--bubble .wa-btn::after{animation:wa-ping 1.8s var(--ease-out) .3s 2}
@keyframes wa-ping{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.7);opacity:0}}

.wa-bubble{position:relative;max-width:min(256px,calc(100vw - 32px));padding:13px 46px 13px 16px;border:1px solid var(--line);border-radius:18px 18px 6px 18px;background:#fff;color:var(--navy);box-shadow:var(--sh-float);cursor:pointer;visibility:hidden;opacity:0;transform:translate3d(0,10px,0) scale(.92);transform-origin:100% 100%;transition:opacity .25s var(--ease-out),transform .3s var(--ease-out),visibility 0s linear .3s}
.wa--bubble .wa-bubble{visibility:inherit;opacity:1;transform:none;transition:opacity .4s var(--ease-out),transform .6s var(--ease-spring),visibility 0s linear 0s}
.wa-bubble__text{font:600 15px/1.35 var(--f-body)}
.wa-bubble__close{position:absolute;top:0;right:0;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--mute);transition:color .2s}
.wa-bubble__close:hover{color:var(--navy)}
.wa-bubble__close .i{width:18px;height:18px}

@media (min-width:768px){
  .wa{right:max(28px,calc(env(safe-area-inset-right) + 16px));bottom:max(28px,calc(env(safe-area-inset-bottom) + 16px))}
}

/* ---------- 404 ---------- */
.nf{position:relative;background:var(--paper)}
.nf-stage{--nf-f:clamp(150px,36vw,440px);position:relative;overflow:hidden;padding-top:calc(var(--header-h) + clamp(20px,5vw,64px));padding-bottom:calc(var(--nf-f) * .12)}
.nf .nf-glow{top:-24%;right:-20%;width:min(96vw,860px);aspect-ratio:1}
.nf-code-wrap{position:relative;z-index:2}
.nf-code{display:flex;color:var(--navy);font-family:var(--f-display);font-size:var(--nf-f);font-weight:800;line-height:.8;letter-spacing:-.06em;font-optical-sizing:auto;user-select:none}
.nf-digit{display:block;transform-origin:50% 85%}
.nf-sea{position:absolute;left:0;right:0;bottom:0;height:calc(var(--nf-f) * .5);overflow:hidden;pointer-events:none}
.nf-sea--back{z-index:1}
.nf-sea--front{z-index:3}
.nf-wave{position:absolute;left:0;bottom:0;width:200%;height:100%;max-width:none}
.nf-wave--back{fill:var(--teal-300);opacity:.55}
.nf-wave--mid{fill:var(--teal)}
.nf-wave--near{fill:var(--foam)}

.nf-body{position:relative;margin-top:-1px;padding-block:clamp(8px,2vw,24px) clamp(108px,12vw,180px);background:var(--foam)}
.nf-grid{display:grid;gap:20px 64px}
.nf .nf-title{max-width:11em;color:var(--navy);font-size:clamp(38px,5.6vw,80px);font-weight:800;line-height:1;letter-spacing:-.04em}
.nf-line{max-width:28em;font-size:var(--fs-lg);line-height:1.5;color:var(--ink-2)}
.nf-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* the digits surface, then bob; the sea drifts (motion only, paused off-screen) */
.js:not(.no-motion):not(.is-ready) .nf-digit{opacity:0}
.is-ready:not(.no-motion) .nf-digit{animation:nf-rise 1.3s var(--ease-out) both,nf-bob-a 5.6s ease-in-out 1.3s infinite alternate}
.is-ready:not(.no-motion) .nf-digit:nth-child(2){animation-name:nf-rise,nf-bob-b;animation-duration:1.3s,6.4s;animation-delay:.1s,1.4s}
.is-ready:not(.no-motion) .nf-digit:nth-child(3){animation-duration:1.3s,5.9s;animation-delay:.2s,1.5s}
.is-ready:not(.no-motion) .nf-wave--back{animation:nf-drift 36s linear infinite}
.is-ready:not(.no-motion) .nf-wave--mid{animation:nf-drift 26s linear infinite reverse}
.is-ready:not(.no-motion) .nf-wave--near{animation:nf-drift 44s linear infinite}
.is-ready .nf.nf--paused .nf-digit,.is-ready .nf.nf--paused .nf-wave{animation-play-state:paused}
@keyframes nf-rise{from{opacity:0;transform:translate3d(0,46%,0) rotate(6deg)}to{opacity:1;transform:translate3d(0,0,0) rotate(0)}}
@keyframes nf-bob-a{from{transform:translate3d(0,0,0) rotate(0)}to{transform:translate3d(0,4%,0) rotate(-2.5deg)}}
@keyframes nf-bob-b{from{transform:translate3d(0,0,0) rotate(0)}to{transform:translate3d(0,5%,0) rotate(2deg)}}
@keyframes nf-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

@media (max-width:479.98px){
  .nf-actions .btn{flex:1 1 100%}
}
@media (min-width:900px){
  .nf-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:end}
}


/* ==========================================================================
   legal
   ========================================================================== */
/* Legal pages (legal.html, privacy.html, cookies.html): one shared structure.
   Compact sea-foam hero with a sun rising over the waves, a sticky contents rail on desktop
   that fills as you read, a readable article column, and links to the other two pages. */

/* ---------- hero ---------- */
.lg-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--foam);padding:calc(var(--header-h) + clamp(36px,5.4vw,80px)) 0 clamp(84px,9.4vw,136px)}
.lg-hero__glow{width:clamp(560px,72vw,1000px);aspect-ratio:1;top:clamp(-560px,-32vw,-240px);right:clamp(-460px,-20vw,-180px)}
.lg-hero__inner{position:relative;z-index:2;display:grid;gap:40px;align-items:end}
.lg-hero__copy{min-width:0}
.lg-hero__title{font-size:clamp(40px,5.8vw,84px);font-weight:800;line-height:.98;letter-spacing:-.042em;color:var(--navy);max-width:13ch}
.lg-hero__lead{margin-top:clamp(16px,2vw,26px);max-width:32em;font-size:var(--fs-lg);line-height:1.5;color:var(--ink-2)}
.lg-meta{list-style:none;display:flex;flex-wrap:wrap;gap:12px 36px;margin-top:clamp(24px,3vw,40px);font-size:15px;line-height:1.45;color:var(--ink-2)}
.lg-meta__item{display:flex;align-items:flex-start;gap:10px;max-width:30em}
.lg-meta__item .i{width:18px;height:18px;margin-top:1px;color:var(--teal-700)}
.lg-meta time{font-weight:600;color:var(--navy)}
.lg-hero__art{display:none}
.lg-hero__wave{bottom:-1px;color:var(--paper)}

/* sun over the waves (line art; fully drawn without motion) */
.lg-art{width:100%;height:auto;overflow:visible}
.lg-art path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.lg-art .lg-art__disc{fill:var(--sun-100);stroke:none}
.lg-art .lg-art__arc{stroke:var(--sun);stroke-width:3.5}
.lg-art .lg-art__ray{stroke:var(--sun-600);stroke-width:3}
.lg-art .lg-art__wave{stroke:var(--teal);stroke-width:3.5}
.lg-art .lg-art__wave--2{stroke:var(--teal-300)}

@media (min-width:768px){
  .lg-hero__inner{grid-template-columns:minmax(0,1fr) auto;gap:clamp(32px,5vw,80px)}
  .lg-hero__art{display:block;width:clamp(220px,27vw,380px);margin-bottom:clamp(-30px,-1.6vw,-10px)}
}

/* ---------- body: contents + article ---------- */
.lg-body{padding-block:clamp(36px,5.5vw,80px) clamp(88px,10vw,144px)}
.lg-layout{display:grid;gap:clamp(24px,4vw,36px)}
.lg-tocnav{min-width:0}

/* contents: a disclosure on phones and tablets */
.lg-toc{border:1.5px solid var(--line-2);border-radius:var(--r);background:var(--paper)}
.lg-toc__sum{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 18px 0 20px;border-radius:calc(var(--r) - 2px);list-style:none;cursor:pointer;font:600 16px/1.3 var(--f-body);color:var(--navy);-webkit-tap-highlight-color:transparent}
.lg-toc__sum::-webkit-details-marker{display:none}
.lg-toc__sum::marker{content:""}
.lg-toc__sum .i{width:20px;height:20px;color:var(--teal-700);transition:rotate .4s var(--ease-out)}
.lg-toc[open] .lg-toc__sum .i{rotate:180deg}
.lg-toc__list{list-style:none;margin:0;padding:0 10px 12px}
.lg-toc__list li+li{margin-top:2px}
.lg-toc__link{position:relative;display:flex;align-items:baseline;gap:12px;min-height:44px;padding:11px 10px;border-radius:var(--r-sm);font-size:15.5px;line-height:1.35;color:var(--ink-2);text-decoration:none;transition:color .25s,background-color .25s}
.lg-toc__link:hover{color:var(--navy);background:var(--foam)}
.lg-toc__link[aria-current="true"]{color:var(--navy);background:var(--teal-50)}
.lg-toc__n{flex:none;min-width:1.3em;font-weight:600;color:var(--teal-700);font-variant-numeric:tabular-nums}

/* article */
.lg-article{min-width:0;max-width:66ch;font-size:var(--fs-base);line-height:1.72;color:var(--ink-2);overflow-wrap:break-word}
.lg-article a{overflow-wrap:anywhere}
.lg-article strong{font-weight:600;color:var(--navy)}

/* "in plain words" summary */
.lg-short{background:var(--teal-50);border:1px solid var(--teal-100);border-radius:var(--r-lg);padding:clamp(24px,3.6vw,40px)}
.lg-short__title{font-size:clamp(24px,2.3vw,30px);font-weight:700;line-height:1.1;letter-spacing:-.022em;color:var(--navy)}
.lg-short__list{list-style:none;display:grid;gap:16px;margin-top:clamp(18px,2vw,24px)}
.lg-short__list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start}
.lg-short__list p{color:var(--ink);line-height:1.55}
.lg-short__tick{display:grid;place-items:center;width:28px;height:28px;margin-top:-1px;border-radius:50%;background:var(--paper);border:1px solid var(--teal-100);color:var(--teal-700)}
.lg-short__tick .i{width:15px;height:15px;stroke-width:2.8}

/* numbered sections */
.lg-sec{margin-top:clamp(28px,3.4vw,48px);padding-top:28px}
.lg-sec>*+*{margin-top:1em}
.lg-h2{display:flex;align-items:baseline;gap:.55em;font-size:clamp(26px,2.7vw,36px);font-weight:700;line-height:1.12;letter-spacing:-.026em;color:var(--navy)}
.lg-h2+*{margin-top:clamp(14px,1.6vw,20px)}
.lg-num{flex:none;min-width:1.05em;color:var(--teal-700);font-variant-numeric:tabular-nums}
.lg-sec .lg-h3{margin-top:1.9em;font-size:clamp(19px,1.6vw,21px);font-weight:700;line-height:1.25;letter-spacing:-.012em;color:var(--navy)}
.lg-sec .lg-h3+*{margin-top:.5em}
.lg-sec .lg-h2+.lg-h3{margin-top:clamp(14px,1.6vw,20px)}

.lg-list{list-style:none;display:grid;gap:.55em}
.lg-list li{position:relative;padding-left:1.45em}
.lg-list li::before{content:"";position:absolute;left:.2em;top:.64em;width:.44em;height:.44em;border-radius:50%;background:var(--teal)}

/* placeholders the owner still has to fill in */
.lg-todo{padding:.05em .38em;border:1.5px dashed var(--sun-600);border-radius:6px;background:var(--sun-100);color:#5C4100;font-weight:600;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* owner details */
.lg-sec .lg-facts{margin-top:1.3em;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);overflow:hidden}
.lg-facts__row{display:grid;gap:2px 24px;padding:14px 20px;border-top:1px solid var(--line)}
.lg-facts__row:first-child{border-top:0}
.lg-facts dt{font-size:14.5px;font-weight:600;line-height:1.4;color:var(--mute)}
.lg-facts dd{margin:0;line-height:1.5;color:var(--ink)}

/* tables (stack into blocks on phones) */
.lg-sec .lg-tablewrap{margin-top:1.3em}
.lg-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);font-size:15.5px;line-height:1.55;text-align:left}
.lg-table th{padding:13px 18px;background:var(--foam);font-size:14.5px;font-weight:600;line-height:1.35;color:var(--navy);vertical-align:bottom}
.lg-table th:first-child{border-top-left-radius:calc(var(--r) - 1px)}
.lg-table th:last-child{border-top-right-radius:calc(var(--r) - 1px)}
.lg-table td{padding:15px 18px;border-top:1px solid var(--line);vertical-align:top}
.lg-cell-label{display:none}
.lg-cell-title{display:block;font-weight:600;color:var(--navy)}
.lg-cell-note{display:block;margin-top:3px;font-size:14.5px;line-height:1.5;color:var(--mute)}
.lg-code{padding:.1em .45em;border:1px solid var(--teal-100);border-radius:6px;background:var(--teal-50);font:600 .95em/1.4 var(--f-body);color:var(--navy);white-space:nowrap}
.lg-table--storage td:first-child{width:1%;white-space:nowrap}

/* browser help links */
.lg-sec .lg-ext{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:1.2em}
.lg-ext a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1.5px solid var(--line-2);border-radius:var(--r-pill);background:var(--paper);font:600 15px/1.2 var(--f-body);color:var(--navy);text-decoration:none;transition:border-color .25s,background-color .25s}
.lg-ext a:hover{border-color:var(--navy);background:var(--foam);color:var(--navy)}
.lg-ext .i{width:16px;height:16px;color:var(--teal-700)}

@media (min-width:560px){
  .lg-facts__row{grid-template-columns:minmax(140px,32%) minmax(0,1fr);align-items:baseline}
}

@media (max-width:639px){
  .lg-table,.lg-table tbody,.lg-table tr,.lg-table td{display:block}
  .lg-table{border:0;border-radius:0;background:none}
  .lg-table thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .lg-table tr{padding:8px 0;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
  .lg-table tr+tr{margin-top:12px}
  .lg-table td{padding:8px 18px;border:0}
  .lg-table td:first-child{padding-top:12px}
  .lg-table--storage td:first-child{width:auto}
  .lg-cell-label{display:block;margin-bottom:1px;font-size:13.5px;font-weight:600;line-height:1.4;color:var(--mute)}
}

@media (min-width:768px){
  .lg-article{font-size:18px}
}

/* desktop: contents become a sticky rail beside the article */
@media (min-width:1024px){
  .lg-layout{grid-template-columns:clamp(220px,19vw,260px) minmax(0,1fr);column-gap:clamp(56px,6vw,104px);align-items:start}
  .lg-tocnav{position:sticky;top:calc(var(--header-h) + 32px);max-height:calc(100vh - var(--header-h) - 64px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:4px 4px 4px 0}
  .lg-toc{border:0;border-radius:0;background:none}
  .js .lg-toc::details-content{content-visibility:visible}
  .lg-toc__sum{min-height:0;padding:0 0 14px;cursor:default;font-size:15px;color:var(--mute)}
  .js .lg-toc__sum .i{display:none}
  .lg-toc__list{padding:0;border-left:2px solid var(--line)}
  .lg-toc__list li+li{margin-top:0}
  .lg-toc__link{min-height:0;margin-left:-2px;padding:8px 0 8px 18px;border-radius:0;font-size:15px;color:var(--mute)}
  .lg-toc__link::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--teal);transform:scaleY(0);transform-origin:50% 0;transition:transform .5s var(--ease-out),background-color .3s}
  .lg-toc__link:hover{background:none;color:var(--navy)}
  .lg-toc__link.is-read::before{transform:scaleY(1);background:var(--teal-300)}
  .lg-toc__link[aria-current="true"]{background:none;color:var(--navy)}
  .lg-toc__link[aria-current="true"]::before{transform:scaleY(1);background:var(--teal)}
  .lg-toc__link:focus-visible{outline-offset:2px}
}

/* ---------- other legal pages ---------- */
.lg-more{position:relative;background:var(--foam);padding-block:clamp(64px,8vw,112px)}
.lg-more__grid{display:grid;gap:clamp(32px,5vw,72px)}
.lg-more__head{min-width:0}
.lg-more__title{font-size:clamp(34px,4.2vw,56px);font-weight:750;line-height:1.02;letter-spacing:-.036em;color:var(--navy)}
.lg-more__text{margin-top:clamp(14px,1.6vw,20px);max-width:30em;font-size:var(--fs-base);line-height:1.6;color:var(--ink-2)}
.lg-more .lg-more__cta{margin-top:clamp(22px,2.6vw,30px)}
.lg-docs{display:grid;min-width:0;border-top:1px solid var(--line-2)}
.lg-doc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;padding:22px 6px 22px 0;border-bottom:1px solid var(--line-2);color:inherit;text-decoration:none}
.lg-doc__icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--teal-700);transition:background-color .3s,border-color .3s,color .3s}
.lg-doc__icon .i{width:22px;height:22px}
.lg-doc__body{min-width:0}
.lg-doc__title{display:block;font:700 clamp(22px,2.3vw,30px)/1.1 var(--f-display);letter-spacing:-.022em;color:var(--navy);transition:color .25s}
.lg-doc__desc{display:block;margin-top:6px;font-size:16px;line-height:1.45;color:var(--ink-2)}
.lg-doc__chev{width:22px;height:22px;color:var(--mute);transition:translate .45s var(--ease-out),color .25s}
.lg-doc:hover{color:inherit}
.lg-doc:hover .lg-doc__title{color:var(--teal-700)}
.lg-doc:hover .lg-doc__icon{border-color:var(--teal);background:var(--teal);color:var(--paper)}
.lg-doc:hover .lg-doc__chev{translate:4px 0;color:var(--teal-700)}
.lg-doc:focus-visible{outline-offset:4px}

@media (min-width:900px){
  .lg-more__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
}

/* ---------- print: just the text ---------- */
@media print{
  .lg-hero{padding:0 0 16px;background:none}
  .lg-hero__glow,.lg-hero__art,.lg-hero__wave,.lg-tocnav,.lg-more{display:none!important}
  .lg-hero__title{font-size:32px;max-width:none}
  .lg-body{padding:0}
  .lg-layout{display:block}
  .lg-article{max-width:none;font-size:11pt;color:#000}
  .lg-short{border-color:#999;background:none}
  .lg-sec{break-inside:auto}
  .lg-h2{break-after:avoid}
  .lg-todo{background:none}
}