/* ==========================================================
   AQUAARON — base: tokens, tipografía, reset, botones, nav
   ========================================================== */
@font-face{font-family:"Bricolage";src:url("../fonts/bricolage.woff2") format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Figtree";src:url("../fonts/figtree.woff2") format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"DM Mono";src:url("../fonts/dm-mono-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DM Mono";src:url("../fonts/dm-mono-500.woff2") format("woff2");font-weight:500;font-display:swap}

:root{
  /* Paleta: tinta de plano técnico + cal andaluza + cobre + agua + chispa */
  --ink:#0b1c28;
  --ink-2:#102a3a;
  --ink-3:#173a4f;
  --line:rgba(245,239,228,.16);
  --cal:#f5efe4;
  --cal-2:#ebe2d0;
  --cal-3:#dcd0b8;
  --water:#3cc8ea;
  --water-deep:#0f86ad;
  --copper:#d0793a;
  --brick:#c4533a;
  --spark:#ffc23c;
  --mint:#5ee0a4;
  --alert:#ff6a4d;
  --text-dark:#0b1c28;
  --text-light:#f5efe4;
  --muted-dark:rgba(11,28,40,.66);
  --muted-light:rgba(245,239,228,.68);

  --f-display:"Bricolage","Arial Narrow",system-ui,sans-serif;
  --f-body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --gutter:clamp(18px,4vw,56px);
  --maxw:1240px;
  --radius:22px;
  --ease:cubic-bezier(.22,1,.36,1);
  --nav-h:68px;
  --bar-h:0px;
}
@media (max-width:820px){:root{--bar-h:66px;--nav-h:60px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px)}
body{margin:0;background:var(--ink);color:var(--text-light);font-family:var(--f-body);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;padding-bottom:var(--bar-h)}
img,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;line-height:1.02;letter-spacing:-.025em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--spark);outline-offset:3px;border-radius:6px}
::selection{background:var(--spark);color:var(--ink)}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:100;background:var(--spark);color:var(--ink);padding:10px 16px;border-radius:10px;font-weight:700;transition:top .2s}
.skip:focus{top:12px}

/* grano de papel — pequeño, estático, barato */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;gap:.7em;color:var(--water)}
.eyebrow::before{content:"";width:28px;height:2px;background:currentColor;border-radius:2px}
.on-light .eyebrow{color:var(--water-deep)}
.mono{font-family:var(--f-mono)}

/* ---------- Botones ---------- */
.btn{--bg:var(--spark);--fg:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:.95em 1.5em;border-radius:999px;border:2px solid var(--bg);background:var(--bg);color:var(--fg);font-family:var(--f-body);font-weight:700;font-size:1rem;line-height:1;text-decoration:none;white-space:nowrap;position:relative;overflow:hidden;isolation:isolate;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .25s,color .25s,border-color .25s;-webkit-tap-highlight-color:transparent}
.btn::before{content:"";position:absolute;inset:0;background:var(--fg);transform:translateY(101%);transition:transform .4s var(--ease);z-index:-1}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px -10px rgba(255,194,60,.55)}
.btn:hover::before{transform:translateY(0)}
.btn:hover{color:var(--bg)}
.btn:active{transform:translateY(0) scale(.97);transition-duration:.08s}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn--ghost{--bg:transparent;--fg:var(--text-light);border-color:rgba(245,239,228,.4)}
.btn--ghost::before{background:var(--cal)}
.btn--ghost:hover{color:var(--ink);box-shadow:none;border-color:var(--cal)}
.btn--ink{--bg:var(--ink);--fg:var(--cal)}
.btn--ink::before{background:var(--spark)}
.btn--ink:hover{color:var(--ink);box-shadow:0 12px 30px -12px rgba(11,28,40,.6)}
.btn--sm{padding:.7em 1.15em;font-size:.92rem}
.btn--wa{--bg:#25d366;--fg:#062b16}
.btn--wa::before{background:#062b16}
.btn--wa:hover{color:#25d366;box-shadow:0 12px 30px -10px rgba(37,211,102,.55)}
.link-arrow{font-weight:700;text-decoration:none;display:inline-flex;gap:.5em;align-items:center;border-bottom:2px solid currentColor;padding-bottom:2px}
.link-arrow span{transition:transform .3s var(--ease)}
.link-arrow:hover span{transform:translateY(3px)}

/* ---------- Logo ---------- */
.logo{display:inline-flex;align-items:center;gap:.6em;text-decoration:none;font-family:var(--f-display);font-weight:800;font-size:1.45rem;letter-spacing:-.04em;line-height:1}
.logo svg{width:34px;height:34px;flex:none}
.logo b{color:var(--water);font-weight:800}

/* ---------- Navegación ---------- */
.nav{position:fixed;inset:0 0 auto 0;height:var(--nav-h);z-index:60;display:flex;align-items:center;transition:background .35s,color .35s,box-shadow .35s,transform .4s var(--ease);color:var(--text-light)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav__links{display:flex;gap:clamp(14px,2.2vw,34px);font-weight:600;font-size:.95rem}
.nav__links a{white-space:nowrap;text-decoration:none;position:relative;padding:.4em 0;opacity:.85;transition:opacity .2s}
.nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--spark);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav__links a:hover{opacity:1}
.nav__links a:hover::after,.nav__links a[aria-current="true"]::after{transform:scaleX(1)}
.nav__cta{display:flex;align-items:center;gap:.6rem}
.nav__tel{white-space:nowrap;font-family:var(--f-mono);font-weight:500;font-size:.92rem;text-decoration:none;display:inline-flex;gap:.5em;align-items:center;padding:.5em .2em}
.nav__tel svg{width:16px;height:16px;color:var(--spark)}
.nav.is-solid{background:rgba(11,28,40,.78);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);box-shadow:0 1px 0 var(--line)}
.nav.is-light{background:rgba(245,239,228,.84);color:var(--ink);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);box-shadow:0 1px 0 rgba(11,28,40,.1)}
.nav.is-light .btn--ghost{--fg:var(--ink);border-color:rgba(11,28,40,.35)}
.nav.is-light .nav__tel svg{color:var(--copper)}
.nav.is-light .logo b{color:var(--water-deep)}
.burger{display:none;width:44px;height:44px;border-radius:12px;border:1.5px solid currentColor;background:none;position:relative;opacity:.9}
.burger i{position:absolute;left:12px;right:12px;height:2px;background:currentColor;border-radius:2px;transition:transform .4s var(--ease),top .4s var(--ease)}
.burger i:nth-child(1){top:16px}.burger i:nth-child(2){top:26px}
.menu-open .burger i:nth-child(1){top:21px;transform:rotate(45deg)}
.menu-open .burger i:nth-child(2){top:21px;transform:rotate(-45deg)}
@media (max-width:1180px){.nav__tel span{display:none}}
@media (max-width:1180px){.nav__cta .btn--wa span{display:none}.nav__cta .btn--wa{padding:.7em .8em}}
@media (max-width:980px){.nav__links{display:none}}
@media (max-width:820px){.burger{display:block}.nav__cta .btn{display:none}.nav__tel{display:none}}

/* menú móvil a pantalla completa */
.menu{position:fixed;inset:0;z-index:55;background:var(--ink);color:var(--cal);display:flex;flex-direction:column;justify-content:center;padding:calc(var(--nav-h) + 24px) var(--gutter) calc(var(--bar-h) + 32px);clip-path:circle(0 at calc(100% - 40px) 34px);transition:clip-path .7s var(--ease);visibility:hidden}
.menu-open .menu{clip-path:circle(150% at calc(100% - 40px) 34px);visibility:visible}
.menu a.big{font-family:var(--f-display);font-weight:700;font-size:clamp(2rem,9vw,3.2rem);letter-spacing:-.03em;text-decoration:none;padding:.18em 0;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}
.menu a.big small{font-family:var(--f-mono);font-size:.75rem;color:var(--water);align-self:center;font-weight:400}
.menu .menu__cta{display:grid;gap:.7rem;margin-top:2rem}
@media (min-width:821px){.menu{display:none}}

/* ---------- Barra de contacto móvil ---------- */
.bar{position:fixed;inset:auto 0 0 0;z-index:58;display:none;grid-template-columns:1fr 1fr 1.25fr;gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(11,28,40,.86);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);border-top:1px solid var(--line);transition:transform .45s var(--ease)}
.bar .btn{padding:.85em .5em;font-size:.94rem;border-radius:14px}
.bar.is-hidden{transform:translateY(110%)}
@media (max-width:820px){.bar{display:grid}}

/* botón flotante escritorio */
.fab{position:fixed;right:22px;bottom:22px;z-index:57;display:none;gap:10px;flex-direction:row}
@media (min-width:821px){.fab{display:flex}}
.fab .btn{box-shadow:0 14px 34px -10px rgba(0,0,0,.55)}
.fab{transition:transform .45s var(--ease),opacity .3s}
.fab.is-hidden{transform:translateY(140%);opacity:0;pointer-events:none}

@media (max-width:820px){.hide-m{display:none!important}}