:root{
  --laguna:#0C6964;
  --laguna-hondo:#084B48;
  --laguna-tinta:#F2FAF8;
  --laguna-tinta-2:#B9E0DA;
  --algodon:#F6F8F7;
  --papel:#FFFFFF;
  --tinta:#15201E;
  --tinta-2:#465654;
  --linea:#D5DEDC;
  --fucsia:#CF1C65;
  --fucsia-hondo:#A8124F;
  --fucsia-claro:#FFF1F6;
  --maiz:#F3B51E;
  --maiz-claro:#FFF6DB;
  --naranja:#E8621C;
  --anil:#2B3B97;
  --hoja:#3C9438;
  --rosa:#F7A8CB;
  --brote:#A6DB6E;
  --idle:#C9D3D1;
  --error:#B0103F;

  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);
  --ease-drawer:cubic-bezier(0.32,0.72,0,1);

  --display:"Bricolage Grotesque",ui-sans-serif,sans-serif;
  --text:"Onest",ui-sans-serif,system-ui,sans-serif;

  --gutter:clamp(16px,4vw,48px);
  --max:1240px;
}
*{box-sizing:border-box}
html{scrollbar-color:var(--laguna) var(--algodon);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--algodon);color:var(--tinta);font:400 17px/1.55 var(--text);caret-color:var(--fucsia);-webkit-tap-highlight-color:transparent}
::selection{background:var(--fucsia);color:#fff}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
:focus-visible{outline:2.5px solid var(--fucsia);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--display);font-weight:760;letter-spacing:-.025em;line-height:1.02;text-wrap:balance;margin:0}
p{text-wrap:pretty}
.num{font-variant-numeric:tabular-nums lining-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Botones ---------- */
.btn{--bg:var(--fucsia);--bg-h:var(--fucsia-hondo);--fg:#fff;position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 1.35em;border-radius:999px;border:0;background:var(--bg);color:var(--fg);font:600 1rem/1 var(--text);text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform 160ms var(--ease-out),background-color 200ms ease,box-shadow 240ms var(--ease-out),color 200ms ease;
  box-shadow:0 1px 2px rgba(10,30,28,.18),0 6px 18px -8px rgba(160,18,79,.55)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--bg-h);border-radius:inherit;clip-path:circle(0% at var(--x,50%) var(--y,50%));transition:clip-path 420ms var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn svg{width:18px;height:18px;flex:none}
.btn .flecha{transition:transform 260ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .btn:hover::before{clip-path:circle(150% at var(--x,50%) var(--y,50%))}
  .btn:hover{box-shadow:0 1px 2px rgba(10,30,28,.18),0 12px 26px -10px rgba(160,18,79,.6)}
  .btn:hover .flecha{transform:translateX(4px)}
}
.btn--hueco{--bg:transparent;--bg-h:var(--laguna-tinta);--fg:currentColor;box-shadow:inset 0 0 0 1.5px currentColor}
@media (hover:hover) and (pointer:fine){.btn--hueco:hover{color:var(--laguna);box-shadow:inset 0 0 0 1.5px var(--laguna-tinta)}}
.btn--tinta{--bg:var(--tinta);--bg-h:var(--fucsia);box-shadow:none}
.btn--chico{min-height:40px;padding:0 1em;font-size:.92rem}
.btn[disabled]{--bg:var(--idle);--bg-h:var(--idle);--fg:#5d6b69;box-shadow:none;cursor:not-allowed}
.btn[disabled]:active{transform:none}

/* Ñandutí: hilo que se teje */
.nd .t{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.nd .k{transform-box:fill-box;transform-origin:center}

@media (prefers-reduced-motion:reduce){
  .btn,.btn::before,.btn .flecha{transition-duration:0ms}
}