/* FOCO — Página "Próximamente" (dark, wordmark en blanco roto) */
:root{
  --bg:#141210; --ink:#F2EFE9; --moca:#A18E7B; --madera:#D8C2A1; --burdeos:#7a2b34;
  --line:rgba(242,239,233,.18);
  --sans:"Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --serif:"Fraunces", Georgia, serif;
  --ease-out:cubic-bezier(0.16,1,0.3,1);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans); background:var(--bg); color:var(--ink);
  line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  min-height:100vh; overflow-x:clip;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; border:0; }
em{ font-style:italic; }
::selection{ background:var(--ink); color:var(--bg); }
:focus-visible{ outline:2px solid var(--madera); outline-offset:3px; border-radius:3px; }

.skip-link{ position:fixed; top:-100px; left:1rem; z-index:99; padding:.6rem 1rem;
  background:var(--ink); color:var(--bg); border-radius:6px; font-weight:600; }
.skip-link:focus{ top:1rem; }

.coming{
  position:relative; min-height:100vh; min-height:100dvh;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(4.5rem,7vw,6rem) clamp(1.5rem,6vw,5.5rem) clamp(3rem,5vw,4rem);
  overflow:hidden;
}

/* grano de película */
.coming-grain{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}

/* barra superior (marco de cartel) */
.coming-top{
  position:absolute; top:0; left:0; right:0; z-index:2;
  display:flex; align-items:center; justify-content:space-between;
  padding:clamp(1.1rem,2.4vw,1.6rem) clamp(1.5rem,6vw,5.5rem);
  border-bottom:1px solid var(--line);
}
.ct-brand{ font-weight:800; letter-spacing:-.03em; font-size:1rem; }
.ct-status{
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  font-weight:600; color:rgba(242,239,233,.62);
}

/* marca vertical lateral (solo desktop) */
.coming-side{
  display:none; position:absolute; z-index:2; right:1.4rem; top:50%;
  transform:translateY(-50%) rotate(180deg); writing-mode:vertical-rl;
  font-size:.66rem; letter-spacing:.28em; text-transform:uppercase;
  color:rgba(242,239,233,.32); font-weight:600;
}
@media(min-width:1280px){ .coming-side{ display:block; } }
.coming-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:.06; filter:grayscale(.4) blur(14px) contrast(1.02);
  transform:scale(1.1);
  animation:kenburns 26s ease-in-out infinite alternate;
}
@keyframes kenburns{ from{ transform:scale(1.04) } to{ transform:scale(1.14) translateY(-1.5%) } }

.coming-grid{
  position:relative; z-index:1; width:100%; max-width:1200px; margin:auto;
  display:grid; gap:clamp(2.5rem,5vw,4.5rem); align-items:center;
}
.coming-inner{ max-width:640px; }
@media(min-width:960px){
  .coming-grid{ grid-template-columns:1.05fr .95fr; }
}

.coming-kicker{
  font-size:.72rem; letter-spacing:.24em; text-transform:uppercase;
  font-weight:600; color:var(--madera); margin-bottom:2rem;
}
.coming-brand{
  font-family:var(--sans); font-weight:800; letter-spacing:-.045em;
  font-size:clamp(3.5rem,13vw,7rem); line-height:.92;
  display:flex; flex-direction:column; gap:.6rem;
}
.coming-desc{
  font-family:var(--serif); font-weight:400; font-style:normal;
  font-size:clamp(1rem,2.4vw,1.5rem); letter-spacing:0; color:var(--ink);
}
.coming-desc em{ font-style:italic; }

/* regla fina con datos de casa */
.coming-rule{
  display:flex; align-items:center; gap:1rem; margin-top:1.6rem;
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:600; color:rgba(242,239,233,.5);
}
.coming-rule-line{ flex:0 1 60px; height:1px; background:var(--line); }

.coming-claim{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.5rem,4vw,2.4rem); line-height:1.15; letter-spacing:-.02em;
  margin:2rem 0 1.25rem; max-width:20ch;
}
.coming-claim em{ font-style:italic; color:var(--moca); }

.coming-lead{ color:rgba(242,239,233,.72); max-width:46ch; margin-bottom:2rem; }
.coming-lead a{ color:var(--ink); border-bottom:1px solid var(--madera); }
.coming-lead a:hover{ border-color:var(--ink); }

.coming-formlabel{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  font-weight:600; color:var(--madera); margin-bottom:1rem;
  display:flex; align-items:center; gap:.6rem;
}
.coming-formlabel::before{ content:""; width:16px; height:1px; background:var(--madera); }

/* form */
.coming-form{ max-width:480px; display:grid; gap:1.1rem; }
.cf-row{ display:grid; gap:1.1rem; }
@media(min-width:480px){ .cf-row{ grid-template-columns:1fr 1fr; } }
.cf-field{ display:grid; gap:.4rem; }
.cf-field > span{
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:600; color:rgba(242,239,233,.55);
}
.cf-field input{
  font:inherit; font-size:1.05rem; color:var(--ink);
  background:rgba(242,239,233,.04);
  border:1px solid var(--line); border-radius:8px; padding:.75rem .9rem;
  transition:border-color .3s, background .3s;
}
.cf-field input::placeholder{ color:rgba(242,239,233,.35); }
.cf-field input:focus{ outline:none; border-color:var(--ink); background:rgba(242,239,233,.07); }
.cf-field input.invalid{ border-color:var(--burdeos); }

.cf-choice{ border:0; padding:0; margin:.2rem 0 .2rem; display:grid; gap:.6rem; }
.cf-choice legend{
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:600; color:rgba(242,239,233,.55); margin-bottom:.5rem; padding:0;
}
.cf-radio{ display:flex; align-items:center; gap:.7rem; cursor:pointer; font-size:1rem; }
.cf-radio input{ accent-color:var(--madera); width:1.05rem; height:1.05rem; }
.cf-radio span em{ font-style:italic; color:var(--moca); }
.cf-choice.invalid legend{ color:#e0989f; }

.cf-submit{
  justify-self:start; margin-top:.4rem;
  background:var(--ink); color:var(--bg); border-radius:100px;
  padding:.8rem 1.8rem; font-weight:600; font-size:.92rem;
  transition:transform .5s var(--ease-out), background .3s, color .3s;
}
.cf-submit:hover{ background:var(--madera); transform:translateY(-2px); }
.cf-submit:disabled{ opacity:.6; cursor:default; transform:none; }

.coming-note{ margin-top:.3rem; font-size:.92rem; min-height:1.3em; color:var(--madera); }
.coming-note.err{ color:#e0989f; }

.coming-foot{
  display:flex; align-items:center; gap:1rem; margin-top:2.5rem;
  font-size:.85rem; letter-spacing:.06em; color:rgba(242,239,233,.7);
}
.coming-foot a{ border-bottom:1px solid var(--line); padding-bottom:2px; transition:border-color .3s; }
.coming-foot a:hover{ border-color:var(--ink); color:var(--ink); }
.coming-foot span{ color:rgba(242,239,233,.35); }

/* aside: mapa + dirección */
.coming-aside{ display:grid; gap:1.25rem; align-content:center; }
.coming-map{
  border-radius:10px; overflow:hidden; border:1px solid var(--line);
  box-shadow:0 40px 80px -50px rgba(0,0,0,.7);
}
.coming-map iframe{
  display:block; width:100%; height:clamp(260px,42vh,420px); border:0;
  filter:grayscale(.35) contrast(1.02);
}
.coming-address{ display:grid; gap:.5rem; }
.coming-addr-title{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  font-weight:600; color:var(--madera);
}
.coming-addr{ font-size:1.02rem; line-height:1.5; color:var(--ink); }
.coming-addr span{ color:rgba(242,239,233,.55); }
.coming-addr-link{
  justify-self:start; margin-top:.2rem; font-size:.9rem; font-weight:600;
  color:var(--ink); border-bottom:1px solid var(--madera); padding-bottom:2px;
  transition:border-color .3s;
}
.coming-addr-link:hover{ border-color:var(--ink); }

.coming-legal{
  position:relative; z-index:1; margin-top:3rem;
  font-size:.75rem; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(242,239,233,.4);
}

/* botón flotante WhatsApp */
.wa-fab{
  position:fixed; z-index:60; right:clamp(1rem,3vw,1.8rem); bottom:clamp(1rem,3vw,1.8rem);
  width:54px; height:54px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--ink); color:var(--bg);
  box-shadow:0 12px 30px -10px rgba(0,0,0,.6);
  transition:transform .5s var(--ease-out), background .3s;
}
.wa-fab:hover{ transform:translateY(-3px); background:var(--madera); }
.wa-fab svg{ width:28px; height:28px; }

/* reveal */
.js .reveal{ opacity:0; transform:translateY(16px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out); }
.js .reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .coming-bg{ animation:none; }
  .js .reveal{ opacity:1 !important; transform:none !important; transition:none; }
}