/* Línea Frontera · base: tokens, reset, botones, formularios */
:root{
  --accent:#FF3B5C;--accent2:#6C4DFF;--accent3:#3DDBB0;--sun:#FFC93C;--sakura:#FF8FB1;--ink:#17112E;--paper:#FFF8F0;
  --ink-2:#4A4466;--ink-3:#7A7596;--line:rgba(23,17,46,.12);--card:#fff;--tint:#FFEFE3;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-io:cubic-bezier(.77,0,.175,1);--ease-drawer:cubic-bezier(.32,.72,0,1);
  --r-s:10px;--r-m:16px;--r-l:24px;--r-xl:32px;
  --sh-1:0 1px 2px rgba(23,17,46,.06),0 4px 14px rgba(23,17,46,.06);
  --sh-2:0 2px 4px rgba(23,17,46,.06),0 18px 44px rgba(23,17,46,.14);
  --f-display:"Bricolage Grotesque","Avenir Next","Segoe UI",system-ui,sans-serif;
  --f-body:"DM Sans","Avenir Next","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-jp:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;
  --safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.08;letter-spacing:-.02em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none}
a,button,summary,label{touch-action:manipulation}
:focus-visible{outline:3px solid var(--accent2);outline-offset:3px;border-radius:6px}
::selection{background:var(--sun);color:var(--ink)}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;z-index:200;transition:top .2s var(--ease-out)}
.skip:focus{top:12px}
.ic{width:1.25em;height:1.25em;flex:none}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* botones */
.btn{--bg:var(--ink);--fg:#fff;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;border:2px solid var(--ink);background:var(--bg);color:var(--fg);font-weight:700;font-size:1rem;text-decoration:none;position:relative;
  box-shadow:4px 4px 0 var(--ink);transition:transform .16s var(--ease-out),box-shadow .16s var(--ease-out),background-color .16s ease,color .16s ease}
.btn .ic{transition:transform .2s var(--ease-out)}
.btn:active{transform:translate(2px,2px) scale(.98);box-shadow:1px 1px 0 var(--ink)}
.btn[disabled]{opacity:.55;pointer-events:none}
.btn-primary{--bg:var(--accent);--fg:#fff}
.btn-ghost{--bg:#fff;--fg:var(--ink)}
.btn-dark{--bg:var(--ink);--fg:#fff}
.btn-light{--bg:#fff;--fg:var(--ink);border-color:#fff;box-shadow:4px 4px 0 var(--sun)}
.btn-sm{min-height:42px;padding:0 18px;font-size:.92rem;box-shadow:3px 3px 0 var(--ink)}
.btn.block{width:100%}
.btn-txt{font-weight:600;text-decoration:none;padding:10px 14px;border-radius:10px}
.btn.danger{--bg:#fff;--fg:#C0102F;border-color:#C0102F;box-shadow:3px 3px 0 #C0102F}
@media (hover:hover) and (pointer:fine){
  .btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
  .btn-light:hover{box-shadow:6px 6px 0 var(--sun)}
  .btn:hover .ic{transform:translateX(3px)}
  .btn-txt:hover{background:rgba(23,17,46,.06)}
}
.mini-link{display:block;text-align:center;margin-top:14px;font-size:.92rem;font-weight:600;color:var(--ink-2);text-underline-offset:4px}
.mini-link.light{color:#fff;text-align:left}

/* formularios (16px = sin zoom en iOS) */
.fld{display:grid;gap:6px;font-weight:600;font-size:.92rem}
.fld>span em{font-weight:400;color:var(--ink-3);font-style:normal}
input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;min-height:48px;padding:12px 14px;border-radius:var(--r-s);border:2px solid var(--line);background:#fff;font-size:16px;font-weight:500;transition:border-color .15s ease,box-shadow .15s ease;appearance:none;-webkit-appearance:none}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%2317112E' stroke-width='2'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
textarea{resize:vertical;min-height:90px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;border-color:var(--accent2);box-shadow:0 0 0 4px rgba(108,77,255,.18)}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:#D6213F}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--ink-2);line-height:1.4}
.check input{width:20px;height:20px;margin-top:1px;accent-color:var(--accent);flex:none}
.form-msg{min-height:1.4em;font-size:.92rem;font-weight:600}
.form-msg.err{color:#C0102F}.form-msg.ok{color:#0A7A5A}

/* movimiento: revelado escalonado, solo transform/opacity */
html.js [data-reveal]{opacity:0;transform:translateY(14px)}
html.js [data-reveal].in{opacity:1;transform:none;transition:opacity .55s var(--ease-out),transform .55s var(--ease-out);transition-delay:calc(var(--i,0)*60ms)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js [data-reveal]{opacity:1;transform:none}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}