/* The Selektor · landing provisoria · tokens alineados con diseno/propuesta_shopify_onepager */
@font-face{font-family:"Fraunces Selektor";src:url(/fonts/fraunces-650-latin-sub.woff2) format("woff2");font-weight:650;font-style:normal;font-display:swap}
@font-face{font-family:"Montserrat";src:url(/fonts/montserrat-400-latin-sub.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Montserrat";src:url(/fonts/montserrat-700-latin-sub.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
/* Fallback con métricas ajustadas para que el cambio a Montserrat no mueva el layout (CLS) */
@font-face{font-family:"Montserrat Fallback";src:local("Arial"),local("Helvetica"),local("Liberation Sans");size-adjust:113.4%;ascent-override:85.8%;descent-override:22.3%;line-gap-override:0%}
:root{--red:#E20000;--black:#000;--white:#fff;--cream:#FFFEF2;--gray:#F2F2F2;--ink:#111;--muted:#555;
--serif:"Fraunces Selektor",Georgia,"Times New Roman",serif;
--sans:"Montserrat","Montserrat Fallback",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--r:6px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:400 1rem/1.55 var(--sans);color:var(--ink);background:var(--white);text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}

.bar{margin:0;background:var(--red);color:var(--white);text-align:center;font:700 .7rem/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:.5rem 1rem}

.head{display:flex;justify-content:center;padding:.9rem 1rem 0}
.logo{color:var(--red);width:112px;display:block}
.logo svg{width:100%;height:auto}

.main{max-width:1180px;margin:0 auto;padding:.6rem 1rem 3rem;display:grid;gap:1rem}
.title{font:650 clamp(1.9rem,9vw,4.6rem)/1.02 var(--serif);letter-spacing:-.02em;margin:0 0 .45rem;color:var(--black)}
.sub{font-size:.84rem;line-height:1.45;margin:0 0 .45rem;max-width:44ch}
.lines{margin:0;font:700 .62rem/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--red)}

.photo{display:block;margin:0 -1rem}
.photo img{width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;object-position:50% 55%;background:var(--gray)}

.card{background:var(--cream);border:1px solid #ece9d8;border-radius:var(--r);padding:.85rem .9rem .9rem}
.card-title{font:650 1.3rem/1.1 var(--serif);margin:0 0 .25rem;color:var(--black)}
.card-help{margin:0 0 .6rem;color:var(--muted);font-size:.78rem;line-height:1.4}
.label{display:block;font-weight:700;font-size:.78rem;margin-bottom:.25rem}
.label-gap{margin-top:.55rem}
.choice{border:0;margin:.55rem 0 0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 1.1rem}
.choice legend{padding:0;margin-bottom:.1rem;width:100%}
.radio{display:inline-flex;align-items:center;gap:.4rem;min-height:32px;font-size:.85rem;cursor:pointer}
.radio input{width:1.2rem;height:1.2rem;margin:0;accent-color:var(--red)}
.btn-submit{width:100%;margin-top:.6rem}
.privacy a{color:var(--ink);font-weight:700}
.input{width:100%;min-height:44px;font:inherit;font-size:1rem;padding:.55rem .8rem;border:1.5px solid #222;border-radius:var(--r);background:var(--white);color:var(--ink)}
.input[aria-invalid=true]{border-color:var(--red)}
.check{display:flex;gap:.55rem;align-items:flex-start;margin-top:.45rem;font-size:.76rem;line-height:1.35;cursor:pointer}
.check input{width:1.2rem;height:1.2rem;margin:.1rem 0 0;accent-color:var(--red);flex:none}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.privacy{margin:.3rem 0 0 1.75rem;font-size:.66rem;line-height:1.35;color:var(--muted)}
.msg{min-height:0;margin:.4rem 0 0;font-weight:700;font-size:.95rem}
.msg.is-ok{color:#0a6b2d}.msg.is-err{color:#b00000}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.75rem 1.25rem;border-radius:var(--r);border:2px solid transparent;font:700 .95rem/1.2 var(--sans);letter-spacing:.04em;text-decoration:none;cursor:pointer;transition:transform .15s ease,background-color .15s ease}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.65;cursor:progress}
.btn-red{background:var(--red);color:var(--white)}
.btn-red:hover{background:#c00000}
.btn-black{background:var(--black);color:var(--white)}
.btn-black:hover{background:#262626}
.btn-outline{background:var(--white);color:var(--black);border-color:var(--black)}
.btn-outline:hover{background:var(--gray)}
.btn svg{flex:none}

.contact-title{font:700 .8rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;margin:0 0 .75rem;color:var(--muted)}
.buttons{display:grid;gap:.6rem}

.foot{background:var(--black);color:var(--white);text-align:center;padding:2rem 1.25rem 2.25rem;font-size:.85rem}
.foot p{margin:.25rem 0}
.foot-sign{letter-spacing:.14em;text-transform:uppercase;font-weight:700;font-size:.72rem}
.foot-motto{font:650 1.35rem/1.3 var(--serif);color:var(--white);margin:.5rem 0!important}
.foot-legal{color:#bbb}
.foot a{color:var(--white)}

/* Política de privacidad */
.legal{max-width:720px;margin:0 auto;padding:1rem 1.25rem 3rem}
.legal h1{font:650 clamp(2rem,8vw,3rem)/1.1 var(--serif);margin:.5rem 0 1rem;color:var(--black)}
.legal h2{font:650 1.35rem/1.2 var(--serif);margin:2rem 0 .5rem;color:var(--black)}
.legal p,.legal li{max-width:65ch}
.legal ul{padding-left:1.25rem}
.draft{background:#fff4d6;border:2px dashed #b36b00;color:#5a3600;border-radius:var(--r);padding:.9rem 1rem;font-weight:700;margin:1rem 0}
mark.ph,mark.todo{background:#ffe066;color:#000;padding:0 .2em;border-radius:3px;font-weight:700}

/* 404 / páginas mínimas */
.min{max-width:560px;margin:0 auto;padding:3rem 1.25rem;text-align:center;display:flex;flex-direction:column;align-items:center}
.min .sub{margin-left:auto;margin-right:auto}
.logo-sm{width:130px;margin-bottom:2rem}

@media (min-width:600px){
  .btn-submit{width:auto;min-width:14rem}
  .buttons{grid-template-columns:repeat(2,minmax(0,1fr))}
  .photo{margin:0}
  .photo img{border-radius:var(--r)}
}
@media (min-width:960px){
  .head{padding:2rem 1rem 1rem}
  .logo{width:200px}
  .bar{font-size:.75rem;letter-spacing:.14em;padding:.6rem 1rem}
  .main{padding:2rem 1.25rem 3rem;gap:1.75rem}
  .sub{font-size:1.05rem;line-height:1.55;margin-bottom:1rem;max-width:40ch}
  .lines{font-size:.72rem;letter-spacing:.14em}
  .card{padding:1.4rem 1.25rem}
  .card-title{font-size:1.6rem;margin-bottom:.4rem}
  .card-help{font-size:.9rem;margin-bottom:1rem}
  .label{font-size:.85rem;margin-bottom:.35rem}
  .label-gap,.choice{margin-top:1rem}
  .radio{min-height:40px;font-size:.92rem}
  .check{font-size:.85rem;margin-top:.9rem}
  .privacy{font-size:.75rem;margin-top:.5rem}
  .btn-submit{margin-top:1rem}
  .input{min-height:48px;padding:.7rem .85rem}
  .main{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"intro photo" "card photo" "contact photo";column-gap:4rem;row-gap:1.75rem;align-items:start}
  .intro{grid-area:intro}.card{grid-area:card}.contact{grid-area:contact}
  .photo{grid-area:photo;position:sticky;top:1.5rem}
  .photo img{aspect-ratio:4/5}
  .title{font-size:clamp(3.6rem,5.4vw,5rem);margin-bottom:1rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}