/* ==============================================================
   Construcciones Ibérica — sistema visual
   Estética: minimalista, profesional, editorial-corporativa
   ============================================================== */

*,*::before,*::after{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  overflow-x:hidden;
}
body{
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px;
  line-height:1.65;
  color:#1a2332;
  background:#fafaf8;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  min-width:320px;
}
img,svg,video,canvas{max-width:100%;height:auto}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
button{font-family:inherit;cursor:pointer}

h1,h2,h3,h4{
  font-family:'Fraunces','Source Serif Pro',Georgia,serif;
  font-weight:500;
  line-height:1.2;
  color:#0d1620;
  letter-spacing:-.015em;
  margin:0 0 .6em;
}
h1{font-size:clamp(2.2rem,4.8vw,3.6rem);font-weight:500;letter-spacing:-.025em;line-height:1.1}
h2{font-size:clamp(1.7rem,3vw,2.3rem)}
h3{font-size:1.18rem;font-weight:600;font-family:'Inter',sans-serif;letter-spacing:-.005em}
h4{font-size:.85rem;font-weight:600;font-family:'Inter',sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#5a6473}
p{margin:0 0 1.05em}
strong{font-weight:600;color:#0d1620}

/* ============ TOKENS ============ */
:root{
  --ink:#0d1620;
  --ink-soft:#1a2332;
  --muted:#5a6473;
  --muted-2:#8a93a3;
  --line:#e4e6ea;
  --line-soft:#eef0f3;
  --bg:#fafaf8;
  --paper:#ffffff;
  --soft:#f4f3ef;
  --primary:#1a4d8c;
  --primary-dark:#143b6e;
  --primary-soft:#eef3fa;
  --accent:#c9a55a;
  --shadow-sm:0 1px 2px rgba(13,22,32,.04), 0 1px 1px rgba(13,22,32,.02);
  --shadow-md:0 8px 24px -8px rgba(13,22,32,.10), 0 2px 6px rgba(13,22,32,.04);
  --shadow-lg:0 24px 60px -20px rgba(13,22,32,.18), 0 8px 16px -8px rgba(13,22,32,.08);
}

/* ============ LAYOUT ============ */
.container{width:100%;max-width:1240px;margin:0 auto;padding:0 28px}
.narrow{max-width:780px;margin:0 auto;padding:0 28px}
.center{text-align:center}
.section{padding:96px 0}
.section--soft{background:var(--soft)}
.section--paper{background:var(--paper)}
.section--ink{background:var(--ink);color:#cdd4de}
.section--ink h2,.section--ink h3,.section--ink h4{color:#fff}
.section--ink p{color:#a9b3c2}
.section--tight{padding:64px 0}

@media(max-width:720px){
  .section{padding:64px 0}
  .section--tight{padding:44px 0}
}

/* ============ HEADER (premium minimalista) ============ */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(250,250,248,.86);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(13,22,32,.06);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  min-height:88px;gap:48px;
}
.logo{
  display:inline-flex;align-items:center;gap:14px;color:var(--ink);
  text-decoration:none;line-height:1;
}
.logo-mark{
  width:42px;height:42px;
  background:var(--ink);color:#fafaf8;
  border:0;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-weight:500;font-size:1rem;
  letter-spacing:.02em;
  transition:background .3s ease;
}
.logo:hover .logo-mark{background:var(--accent)}
.logo-text{
  font-family:'Fraunces',serif;font-weight:500;font-size:1.22rem;
  letter-spacing:-.012em;color:var(--ink);
  display:block;
}
.logo-tagline{
  display:block;
  font-family:'Inter',sans-serif;font-size:.6rem;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;
  color:var(--muted-2);margin-top:4px;
}
.logo--light{color:#fff}
.logo--light .logo-mark{background:#fff;color:var(--ink)}
.logo--light .logo-text{color:#fff}
.logo--light .logo-tagline{color:#5a6473}

.main-nav{display:flex;align-items:center;gap:52px}
.nav-link{
  font-family:'Inter',sans-serif;font-size:.74rem;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;
  color:var(--ink);
  position:relative;padding:34px 0;
  transition:color .3s ease;
}
.nav-link::before{
  content:"";position:absolute;left:50%;bottom:26px;
  width:0;height:1px;background:var(--accent);
  transform:translateX(-50%);
  transition:width .4s cubic-bezier(.2,.7,.2,1);
}
.nav-link:hover::before,.nav-link:focus-visible::before{width:30px}

/* dropdown servicios — caret y panel premium */
.has-dropdown{position:relative}
.has-dropdown > .nav-link::after{
  content:"";display:inline-block;margin-left:9px;width:5px;height:5px;
  border-right:1.2px solid currentColor;border-bottom:1.2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);
  transition:transform .3s ease;opacity:.5;
}
.has-dropdown:hover > .nav-link::after,
.has-dropdown:focus-within > .nav-link::after{transform:rotate(225deg) translateY(0);opacity:.85}

.dropdown{
  position:absolute;top:calc(100% - 4px);left:50%;
  transform:translateX(-50%) translateY(6px);
  background:var(--paper);border:1px solid var(--line);border-radius:2px;
  box-shadow:0 30px 70px -20px rgba(13,22,32,.22), 0 8px 20px -8px rgba(13,22,32,.08);
  padding:22px 26px;min-width:600px;
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px 28px;
  opacity:0;pointer-events:none;
  transition:opacity .25s ease,transform .25s ease;
}
/* En dispositivos con hover real (desktop ratón) abrir con :hover */
@media (hover: hover) and (pointer: fine){
  .has-dropdown:hover .dropdown,
  .has-dropdown:focus-within .dropdown{
    opacity:1;pointer-events:auto;
    transform:translateX(-50%) translateY(0);
  }
}
/* En touch (móvil/tablet) abrir solo cuando JS añade .is-open */
.has-dropdown.is-open .dropdown{
  opacity:1;pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
.has-dropdown.is-open > .nav-link::after{transform:rotate(225deg) translateY(0);opacity:.85}
.dropdown a{
  display:block;padding:10px 6px;font-size:.84rem;
  color:var(--ink-soft);font-weight:500;letter-spacing:-.005em;
  border-bottom:1px solid transparent;
  transition:color .2s ease,border-color .2s ease;
}
.dropdown a:hover{color:var(--ink);border-bottom-color:var(--accent)}

.menu-toggle{
  display:none;background:none;border:0;padding:10px;
  color:var(--ink);cursor:pointer;
}
.menu-toggle svg{width:24px;height:24px}

@media(max-width:920px){
  .header-inner{min-height:64px;gap:16px}
  .logo-mark{width:36px;height:36px;font-size:.9rem}
  .logo-text{font-size:1.05rem}
  .logo-tagline{display:none}

  /* ===== MENÚ MÓVIL OVERLAY (fullscreen real, scroll natural) ===== */
  .main-nav{
    position:fixed;
    top:0;left:0;right:0;
    width:100%;
    height:100vh;             /* fallback */
    height:100dvh;            /* viewport dinámico iOS/Android */
    z-index:70;
    background:#fafaf8;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding-top:72px;
    padding-bottom:env(safe-area-inset-bottom, 24px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    opacity:0;
    visibility:hidden;
    transition:opacity .22s ease, visibility 0s linear .22s;
  }
  .main-nav.is-open{
    opacity:1;visibility:visible;
    transition:opacity .22s ease, visibility 0s linear 0s;
  }

  /* Items principales de nivel 1 */
  .main-nav > .has-dropdown,
  .main-nav > .nav-link{
    display:block;width:100%;
  }
  .nav-link{
    display:block;
    width:100%;
    padding:22px 32px;
    border:0;border-bottom:1px solid #ececea;
    font-family:'Fraunces',serif;font-weight:500;
    font-size:1.6rem;line-height:1.2;letter-spacing:-.018em;
    text-transform:none;text-align:left;
    color:#0d1620;background:transparent;
    -webkit-tap-highlight-color:transparent;
    outline:none;
    cursor:pointer;
    transition:background .15s ease;
  }
  .nav-link::before{display:none}
  .nav-link:hover,
  .nav-link:active,
  .nav-link:focus,
  .nav-link:focus-visible{
    color:#0d1620;background:rgba(13,22,32,.035);outline:none;
  }

  /* Padre con submenú: incluye el caret a la derecha */
  .has-dropdown > .nav-link{
    display:flex;align-items:center;justify-content:space-between;gap:18px;
  }
  .has-dropdown > .nav-link::after{
    content:"";display:block;
    width:10px;height:10px;
    border-right:1.5px solid #0d1620;
    border-bottom:1.5px solid #0d1620;
    transform:rotate(45deg);
    opacity:.55;
    transition:transform .25s ease;
    flex-shrink:0;
  }
  .has-dropdown.is-open > .nav-link::after{
    transform:rotate(225deg);opacity:.85;
  }

  /* Submenú: contenedor con altura animada */
  .dropdown{
    position:static;
    transform:none;
    box-shadow:none;border:0;border-radius:0;
    background:#f1efe8;
    padding:0;
    min-width:0;width:100%;
    display:block;
    grid-template-columns:1fr;gap:0;
    overflow:hidden;
    max-height:0;
    opacity:0;
    pointer-events:none;
    transition:max-height .35s ease, opacity .25s ease, padding .25s ease;
    border-bottom:1px solid #ececea;
  }
  .has-dropdown.is-open .dropdown{
    max-height:1500px;
    opacity:1;
    pointer-events:auto;
    padding:6px 0 14px;
    transform:none;
  }
  .dropdown a{
    display:block;
    padding:14px 48px;
    font-family:'Inter',sans-serif;font-size:1rem;font-weight:500;
    color:#1a2332;text-transform:none;letter-spacing:0;
    border:0;background:transparent;text-align:left;
    -webkit-tap-highlight-color:transparent;
    outline:none;
    transition:background .12s ease, color .12s ease;
  }
  .dropdown a:hover,
  .dropdown a:active,
  .dropdown a:focus,
  .dropdown a:focus-visible{
    color:var(--accent);
    background:rgba(13,22,32,.04);
    outline:none;
  }

  /* Email/info al final del menú (no flotante, parte del flujo) */
  .main-nav .nav-footer{
    padding:36px 32px 24px;
    text-align:center;
    font-family:'Inter',sans-serif;font-size:.72rem;
    letter-spacing:.18em;text-transform:uppercase;
    color:var(--muted-2);
    word-break:break-all;
  }

  /* Botón cerrar (X) cuando está abierto se controla por el SVG del toggle */
  .menu-toggle{
    display:inline-flex;
    position:relative;z-index:80;
    -webkit-tap-highlight-color:transparent;
    background:transparent;
  }
  .menu-toggle:active{background:rgba(13,22,32,.04)}

  /* El header debe quedar por encima del overlay en móvil para mostrar la X */
  .site-header{z-index:75}
}

/* Bloquear scroll del body cuando el menú móvil está abierto */
body.menu-open{overflow:hidden;position:fixed;width:100%}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 26px;font-size:.94rem;font-weight:500;
  border:1px solid transparent;border-radius:2px;
  transition:all .18s ease;
  letter-spacing:-.005em;
}
.btn-primary{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-primary:hover{background:var(--primary);border-color:var(--primary);transform:translateY(-1px)}
.btn-secondary{background:var(--paper);color:var(--ink);border-color:var(--line)}
.btn-secondary:hover{border-color:var(--ink);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--ink);border-color:transparent;padding-left:0;padding-right:0}
.btn-ghost::after{content:"→";margin-left:8px;transition:transform .18s}
.btn-ghost:hover::after{transform:translateX(4px)}
.btn-ghost:hover{color:var(--primary)}
.btn-light{background:#fff;color:var(--ink);border-color:#fff}
.btn-light:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-lg{padding:17px 34px;font-size:1rem}
.btn-block{width:100%}

/* ============ HERO ============ */
.hero{padding:80px 0 80px;background:var(--bg);border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.15fr 460px;gap:80px;align-items:start}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr;gap:48px}}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin-bottom:24px;
}
.hero-eyebrow::before{content:"";width:32px;height:1px;background:var(--accent)}
.hero h1{margin-bottom:22px}
.hero-question{
  font-family:'Fraunces',serif;font-weight:400;font-style:italic;
  font-size:1.25rem;color:var(--ink-soft);margin:0 0 18px;line-height:1.4;max-width:580px;
}
.hero-lead{font-size:1.06rem;color:var(--muted);max-width:580px;margin-bottom:1em}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin:32px 0 28px}
.hero-meta{
  display:flex;flex-wrap:wrap;gap:22px 36px;
  padding-top:24px;border-top:1px solid var(--line);
  font-size:.88rem;color:var(--muted);
}
.hero-meta li{display:flex;align-items:center;gap:8px}
.hero-meta li::before{
  content:"";width:6px;height:6px;background:var(--accent);border-radius:50%;
}

/* ============ FORM CARD ============ */
.form-card{
  background:var(--paper);
  border:1px solid var(--line);
  padding:34px;border-radius:4px;
  box-shadow:var(--shadow-md);
}
.form-title{font-size:1.35rem;margin-bottom:6px}
.form-sub{color:var(--muted);font-size:.92rem;margin-bottom:22px;line-height:1.55}
.lead-form .field{margin-bottom:14px}
.lead-form label{
  display:block;font-size:.78rem;font-weight:500;
  text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);margin-bottom:7px;
}
.lead-form input,.lead-form select,.lead-form textarea{
  width:100%;padding:12px 14px;font-size:.94rem;
  background:var(--paper);color:var(--ink);
  border:1px solid var(--line);border-radius:2px;
  font-family:inherit;
  transition:border-color .15s,box-shadow .15s;
}
.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus{
  outline:0;border-color:var(--primary);
  box-shadow:0 0 0 3px var(--primary-soft);
}
.lead-form textarea{resize:vertical;min-height:104px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:480px){.field-row{grid-template-columns:1fr}}
.form-legal{
  font-size:.76rem;color:var(--muted);
  margin:6px 0 16px;line-height:1.5;
}
.form-note{
  text-align:center;font-size:.8rem;color:var(--muted-2);
  margin:12px 0 0;
}

/* ============ SECTION HEADERS ============ */
.section-head{max-width:720px;margin:0 auto 56px}
.section-head--center{text-align:center}
.section-head .eyebrow{
  display:inline-block;
  font-size:.76rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent);margin-bottom:18px;
}
.section-head h2{margin-bottom:14px}
.section-head p{color:var(--muted);font-size:1.05rem;line-height:1.65}

/* ============ TEXT BLOCK ============ */
.text-block{max-width:720px}
.text-block p{font-size:1.02rem;color:var(--ink-soft);line-height:1.75}
.text-block p:last-child{margin-bottom:0}
.text-block.center{margin:0 auto}

/* ============ SERVICES GRID ============ */
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
@media(max-width:920px){.services{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.services{grid-template-columns:1fr}}
.service-card{
  background:var(--paper);padding:36px 30px;
  display:flex;flex-direction:column;
  transition:background .2s;
}
.service-card:hover{background:var(--soft)}
.card-figure{
  margin:-36px -30px 22px;aspect-ratio:16/10;
  overflow:hidden;background:var(--soft);
}
.card-figure img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.service-card:hover .card-figure img{transform:scale(1.04)}
.services--imaged .service-card{padding-top:0}
.service-card .num{
  font-family:'Fraunces',serif;font-size:.85rem;color:var(--muted-2);
  margin-bottom:16px;letter-spacing:.04em;
}
.service-card h3{font-family:'Fraunces',serif;font-weight:500;font-size:1.3rem;margin-bottom:10px}
.service-card p{color:var(--muted);font-size:.95rem;flex:1;margin-bottom:18px}
.service-card .more{
  font-size:.85rem;font-weight:500;color:var(--ink);
  display:inline-flex;align-items:center;gap:6px;
  border-bottom:1px solid var(--ink);padding-bottom:2px;align-self:flex-start;
  transition:color .15s,border-color .15s;
}
.service-card .more:hover{color:var(--primary);border-color:var(--primary)}

/* ============ SPLIT ============ */
.split{display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:start}
@media(max-width:880px){.split{grid-template-columns:1fr;gap:40px}}
.split--reverse{grid-template-columns:1fr 1.2fr}
.split-side .stat{
  padding:24px 0;border-bottom:1px solid var(--line);
}
.split-side .stat:first-child{border-top:1px solid var(--line)}
.split-side .stat strong{
  display:block;font-family:'Fraunces',serif;font-weight:500;
  font-size:1.5rem;color:var(--ink);margin-bottom:4px;
}
.split-side .stat span{color:var(--muted);font-size:.92rem}

.check-list{margin:20px 0 28px}
.check-list li{
  position:relative;padding:8px 0 8px 28px;
  color:var(--ink-soft);font-size:.96rem;
  border-bottom:1px solid var(--line-soft);
}
.check-list li:last-child{border-bottom:0}
.check-list li::before{
  content:"";position:absolute;left:0;top:16px;
  width:14px;height:1px;background:var(--accent);
}

/* ============ PRESUPUESTO LIST ============ */
.feature-list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid var(--line);
  margin:28px 0 36px;
}
@media(max-width:720px){.feature-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.feature-list{grid-template-columns:1fr}}
.feature-list li{
  padding:18px 22px 18px 0;
  border-bottom:1px solid var(--line);
  color:var(--ink-soft);font-size:.94rem;
  position:relative;padding-left:22px;
}
.feature-list li::before{
  content:"+";position:absolute;left:0;top:18px;
  font-family:'Fraunces',serif;color:var(--accent);font-size:1.05rem;line-height:1;
}

/* ============ TRUST GRID ============ */
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.08);margin-top:48px}
@media(max-width:920px){.trust-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.trust-grid{grid-template-columns:1fr}}
.trust-item{padding:32px 28px;background:var(--ink)}
.trust-item h3{font-family:'Fraunces',serif;font-weight:500;font-size:1.1rem;margin-bottom:10px;color:#fff}
.trust-item p{color:#a9b3c2;font-size:.9rem;margin:0;line-height:1.6}

/* ============ FAQ ============ */
.faq{margin-top:24px;border-top:1px solid var(--line)}
.faq-item{
  border-bottom:1px solid var(--line);
  padding:24px 0;
}
.faq-item summary{
  font-family:'Fraunces',serif;font-weight:500;font-size:1.08rem;color:var(--ink);
  cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:24px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"+";font-family:'Fraunces',serif;font-size:1.4rem;
  color:var(--muted-2);transition:transform .2s;flex-shrink:0;
}
.faq-item[open] summary::after{content:"−"}
.faq-answer{margin-top:16px;color:var(--muted);font-size:.96rem;line-height:1.7}
.faq-answer p{margin:0 0 .8em}
.faq-answer p:last-child{margin-bottom:0}

/* ============ CITIES & ZONES ============ */
.zonas-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:32px}
@media(max-width:720px){.zonas-grid{grid-template-columns:1fr;gap:32px}}
.zonas-grid h3{font-family:'Inter',sans-serif;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:16px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a,.chip-static{
  display:inline-block;padding:8px 14px;
  background:var(--paper);border:1px solid var(--line);border-radius:30px;
  font-size:.85rem;color:var(--ink-soft);
  transition:all .15s;
}
.chips a:hover{border-color:var(--ink);color:var(--ink);background:var(--paper)}

.city-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:0;border-top:1px solid var(--line);margin-top:32px;
}
.city-grid a{
  padding:18px 22px 18px 22px;
  border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);
  font-size:.94rem;color:var(--ink-soft);font-weight:500;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  transition:background .15s,color .15s;
}
.city-grid a::after{content:"→";color:var(--muted-2);transition:transform .15s,color .15s}
.city-grid a:hover{background:var(--soft);color:var(--primary)}
.city-grid a:hover::after{color:var(--primary);transform:translateX(3px)}

/* ============ CLIENTES ============ */
.clients-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:0;
  border-top:1px solid var(--line);margin:28px 0 22px;
}
@media(max-width:560px){.clients-grid{grid-template-columns:1fr}}
.client-item{
  padding:20px 0;border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;gap:4px;
  padding-right:24px;
}
.client-item:nth-child(odd){padding-right:24px}
.client-item:nth-child(even){padding-left:24px;border-left:1px solid var(--line)}
@media(max-width:560px){
  .client-item:nth-child(even){padding-left:0;border-left:0}
}
.client-item strong{font-family:'Fraunces',serif;font-weight:500;font-size:1.05rem;color:var(--ink)}
.client-item span{color:var(--muted);font-size:.9rem}

/* ============ CTA FINAL ============ */
.cta-final{
  background:var(--ink);color:#fff;
  padding:96px 0;text-align:center;
}
.cta-final h2{color:#fff;max-width:680px;margin-left:auto;margin-right:auto}
.cta-final p{color:#a9b3c2;font-size:1.05rem;max-width:600px;margin:14px auto 32px;line-height:1.65}
.cta-final .btn-primary{background:#fff;color:var(--ink);border-color:#fff}
.cta-final .btn-primary:hover{background:var(--accent);border-color:var(--accent);color:#fff}

/* ============ BREADCRUMB (premium, centrado, post-footer) ============ */
.breadcrumb{
  background:#0a121b;color:#5a6473;
  padding:34px 0 44px;text-align:center;
  border-top:1px solid #1a2532;
}
.breadcrumb-track{
  display:inline-flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center;
  font-size:.7rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  font-family:'Inter',sans-serif;
}
.breadcrumb a{
  color:#8a93a3;transition:color .2s;
  position:relative;padding:4px 0;
}
.breadcrumb a:hover{color:var(--accent)}
.breadcrumb .sep{
  display:inline-block;width:24px;height:1px;background:#1f2a3a;
  flex-shrink:0;
}
.breadcrumb .current{color:#cdd4de;font-weight:600}
@media(max-width:640px){
  .breadcrumb{padding:26px 0 34px}
  .breadcrumb-track{gap:12px;font-size:.66rem;letter-spacing:.18em}
  .breadcrumb .sep{width:14px}
}

/* ============ FOOTER ============ */
.site-footer{
  background:#0a121b;color:#8a93a3;
  padding:72px 0 28px;font-size:.9rem;
}
.footer-grid{
  display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px;
  padding-bottom:48px;border-bottom:1px solid #1a2532;
}
@media(max-width:880px){.footer-grid{grid-template-columns:1fr 1fr;gap:36px}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr}}
.footer-tag{margin-top:18px;font-size:.92rem;color:#8a93a3;line-height:1.65;max-width:340px}
.site-footer h4{color:#fff;font-size:.78rem;margin-bottom:18px;font-family:'Inter',sans-serif;font-weight:600}
.site-footer ul li{padding:6px 0}
.site-footer a{color:#8a93a3;transition:color .15s}
.site-footer a:hover{color:#fff}
.footer-bottom{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;
  padding-top:28px;font-size:.82rem;color:#5a6473;
}

/* ============ UTIL ============ */
.muted{color:var(--muted)}
.center{text-align:center}
.divider{height:1px;background:var(--line);margin:48px 0}
.eyebrow-mini{
  display:inline-block;font-size:.74rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent);margin-bottom:14px;
}
.tag{display:inline-block;padding:5px 12px;background:var(--primary-soft);color:var(--primary);font-size:.78rem;font-weight:500;border-radius:30px;letter-spacing:.02em}

/* === Imágenes === */
img{max-width:100%;height:auto;display:block}
.figure{
  position:relative;overflow:hidden;border-radius:4px;
  background:var(--soft);
}
.figure-cover{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .6s ease;
}
.figure:hover .figure-cover{transform:scale(1.03)}
.figure--wide{aspect-ratio:16/10}
.figure--tall{aspect-ratio:4/5}
.figure--square{aspect-ratio:1/1}
.figure--banner{aspect-ratio:21/9}

.hero-figure{
  position:relative;border-radius:4px;overflow:hidden;
  background:var(--ink);box-shadow:var(--shadow-lg);
  aspect-ratio:5/4;
}
.hero-figure img{width:100%;height:100%;object-fit:cover}
.hero-figure::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(13,22,32,.4) 100%);
  pointer-events:none;
}
.hero-figure-tag{
  position:absolute;left:20px;bottom:18px;color:#fff;
  font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;
}

.section-hero{
  position:relative;padding:0;border-bottom:1px solid var(--line);
  isolation:isolate;
}
.section-hero-bg{
  position:absolute;inset:0;z-index:-1;overflow:hidden;
}
.section-hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.18}
.section-hero-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,var(--bg) 0%,rgba(250,250,248,.7) 60%,var(--bg) 100%);
}

.split-figure{aspect-ratio:4/5;border-radius:4px;overflow:hidden;background:var(--soft)}
.split-figure img{width:100%;height:100%;object-fit:cover}

.proceso-figure{
  margin:36px 0 0;border-radius:4px;overflow:hidden;
  aspect-ratio:21/9;background:var(--soft);
}
.proceso-figure img{width:100%;height:100%;object-fit:cover}

.cta-bg{position:relative;isolation:isolate;overflow:hidden}
.cta-bg::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(13,22,32,.85),rgba(13,22,32,.95)),
             url(https://images.unsplash.com/photo-1503387762-592deb58ef4e?w=1600&q=70&auto=format&fit=crop) center/cover;
}

@media(max-width:1000px){
  .hero-figure{aspect-ratio:16/10}
}

/* === Skip link === */
.skip-link{
  position:absolute;top:-50px;left:8px;z-index:100;
  background:var(--ink);color:#fff;padding:10px 16px;
  text-decoration:none;border-radius:2px;font-size:.9rem;
  transition:top .15s;
}
.skip-link:focus{top:8px;outline:2px solid var(--accent);outline-offset:2px}

/* === Focus visible global === */
*:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:2px}
.lead-form input:focus-visible,.lead-form select:focus-visible,.lead-form textarea:focus-visible{outline:0}

/* === Form: errores + checkbox legal + honeypot === */
.req{color:#c53d2c;font-weight:600;margin-left:2px}
.field-error{display:block;color:#c53d2c;font-size:.8rem;margin-top:6px;min-height:1px}
.lead-form input.is-invalid,.lead-form select.is-invalid,.lead-form textarea.is-invalid{
  border-color:#c53d2c;background:#fff5f3;
}
.lead-form input.is-invalid:focus,.lead-form select.is-invalid:focus,.lead-form textarea.is-invalid:focus{
  box-shadow:0 0 0 3px rgba(197,61,44,.15);border-color:#c53d2c;
}
.field-check{margin:14px 0 16px}
.field-check label{
  display:flex;gap:10px;align-items:flex-start;
  font-size:.84rem;color:var(--muted);line-height:1.55;cursor:pointer;
}
.field-check input[type="checkbox"]{
  margin-top:3px;flex-shrink:0;width:16px;height:16px;
  accent-color:var(--primary);cursor:pointer;
}
.field-check.is-invalid label{color:#c53d2c}
.field-check a{color:var(--primary);text-decoration:underline}
.honeypot{position:absolute!important;left:-9999px!important;opacity:0;pointer-events:none;height:0;width:0}

/* === Cookie banner (sutil, esquina) === */
.cookie-banner{
  position:fixed;bottom:14px;right:14px;z-index:90;
  background:rgba(13,22,32,.94);color:#cdd4de;
  border:1px solid rgba(255,255,255,.08);border-radius:8px;
  box-shadow:0 12px 32px -12px rgba(0,0,0,.35);
  padding:10px 12px;max-width:340px;
  font-size:.78rem;line-height:1.45;
  backdrop-filter:saturate(180%) blur(8px);
}
.cookie-banner-inner{
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;
}
.cookie-text{flex:1;min-width:160px}
.cookie-text strong{display:none}
.cookie-text p{margin:0;font-size:.78rem;color:#cdd4de;line-height:1.4}
.cookie-text a{color:var(--accent);text-decoration:underline}
.cookie-actions{display:flex;gap:4px;flex-wrap:nowrap}
.cookie-banner .btn-sm{padding:5px 10px;font-size:.74rem;border-radius:4px;letter-spacing:0}
.cookie-banner .btn-ghost{color:#8a93a3;border:0;padding:5px 8px}
.cookie-banner .btn-ghost:hover{color:#fff;background:transparent;transform:none}
.cookie-banner .btn-secondary{background:transparent;color:#cdd4de;border:1px solid rgba(255,255,255,.18);padding:5px 10px}
.cookie-banner .btn-secondary:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.3);transform:none}
.cookie-banner .btn-primary{background:#fff;color:var(--ink);border:1px solid #fff;padding:5px 12px}
.cookie-banner .btn-primary:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:none}
@media(max-width:480px){
  .cookie-banner{left:10px;right:10px;bottom:10px;max-width:none}
  .cookie-text{min-width:0;width:100%}
  .cookie-actions{width:100%;justify-content:flex-end}
}

/* === Hidden global (evita que display:flex sobrescriba [hidden]) === */
[hidden]{display:none!important}

/* === Cookie config modal === */
.cookie-config{
  position:fixed;inset:0;z-index:100;
  background:rgba(13,22,32,.6);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  padding:16px;animation:fadeIn .2s ease;
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.cookie-config-card{
  background:var(--paper);max-width:520px;width:100%;
  padding:32px;border-radius:6px;box-shadow:var(--shadow-lg);
}
.cookie-config-card h2{font-size:1.4rem;margin-bottom:6px}
.cookie-config-card .muted{font-size:.9rem;margin-bottom:18px}
.cookie-list{margin:18px 0 24px;border-top:1px solid var(--line)}
.cookie-list li{
  padding:16px 0;border-bottom:1px solid var(--line);
  display:flex;justify-content:space-between;gap:14px;align-items:center;
}
.cookie-list li label{display:contents;cursor:pointer}
.cookie-list strong{display:block;color:var(--ink);font-size:.95rem;margin-bottom:2px}
.cookie-list span{color:var(--muted);font-size:.84rem;line-height:1.45;display:block}
.cookie-toggle.is-on{font-size:.78rem;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.cookie-list input[type="checkbox"]{width:20px;height:20px;accent-color:var(--primary);cursor:pointer;flex-shrink:0}
.cookie-config-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}

/* === Footer extras === */
.footer-contact{margin-top:18px;font-size:.88rem;color:#a9b3c2}
.footer-contact li{padding:4px 0}
.footer-contact a{color:#cdd4de}
.footer-contact a:hover{color:#fff}
.link-btn{
  background:none;border:0;padding:0;color:#8a93a3;cursor:pointer;
  font:inherit;text-decoration:underline;
}
.link-btn:hover{color:#fff}

/* === Header tel === */
.nav-tel{
  display:inline-flex;align-items:center;gap:6px;
  font-weight:600;color:var(--primary);
}
.nav-tel:hover{color:var(--primary-dark)}
.nav-tel svg{flex-shrink:0}
@media(max-width:920px){
  .nav-tel{padding:14px 28px;border-bottom:1px solid var(--line-soft);font-weight:600;color:var(--primary)}
}

/* === Page error / gracias === */
.page-status{padding:120px 0;text-align:center;background:var(--bg)}
.page-status .num{
  font-family:'Fraunces',serif;font-size:7rem;line-height:1;
  color:var(--accent);margin-bottom:14px;font-weight:500;
}
.page-status h1{margin-bottom:14px}
.page-status p{max-width:520px;margin:0 auto 28px;color:var(--muted);font-size:1.05rem}
.page-status .btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* === Página gracias === */
.page-status .icon-ok{
  display:inline-flex;align-items:center;justify-content:center;
  width:80px;height:80px;background:var(--primary-soft);
  border-radius:50%;margin:0 auto 24px;
}
.page-status .icon-ok svg{width:38px;height:38px;color:var(--primary)}

/* === Contacto === */
.contact-blocks{
  display:grid;grid-template-columns:1fr 1fr;gap:0;
  margin-top:32px;border-top:1px solid var(--line);
}
@media(max-width:580px){.contact-blocks{grid-template-columns:1fr}}
.contact-block{
  padding:22px 0;border-bottom:1px solid var(--line);
  padding-right:24px;
}
.contact-block:nth-child(even){padding-left:24px;border-left:1px solid var(--line)}
@media(max-width:580px){.contact-block:nth-child(even){padding-left:0;border-left:0}}
.contact-block h3{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:10px;font-family:'Inter',sans-serif}
.contact-block p{margin:0;color:var(--ink-soft);font-size:.95rem;line-height:1.6}
.contact-big{
  font-family:'Fraunces',serif;font-weight:500;font-size:1.4rem;
  color:var(--ink);display:block;margin-bottom:6px;
  text-decoration:none;letter-spacing:-.01em;
}
.contact-big:hover{color:var(--primary)}

/* === Páginas legales (textos largos) === */
.legal-doc{padding:64px 0 96px}
.legal-doc h1{margin-bottom:8px}
.legal-doc .updated{color:var(--muted);font-size:.85rem;margin-bottom:36px}
.legal-doc h2{font-size:1.35rem;margin:36px 0 12px}
.legal-doc h3{font-size:1.05rem;margin:24px 0 8px}
.legal-doc p,.legal-doc li{color:var(--ink-soft);font-size:.96rem;line-height:1.7}
.legal-doc ul{margin:12px 0 18px;padding-left:0}
.legal-doc ul li{position:relative;padding:4px 0 4px 22px}
.legal-doc ul li::before{content:"";position:absolute;left:0;top:14px;width:8px;height:1px;background:var(--accent)}
.legal-doc table{width:100%;border-collapse:collapse;margin:18px 0;font-size:.92rem}
.legal-doc th,.legal-doc td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.legal-doc th{background:var(--soft);font-weight:600;color:var(--ink)}

/* Proceso list (servicios) */
.proceso-list{counter-reset:none;list-style:none;padding:0;margin:28px 0 0;border-top:1px solid var(--line)}
.proceso-list li{display:flex;gap:24px;padding:22px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.paso-num{font-family:'Fraunces',serif;font-size:1.05rem;color:var(--accent);min-width:36px;font-weight:500}
.paso-text{color:var(--ink-soft);font-size:1rem;line-height:1.6;flex:1}

/* CTA final con form */
.cta-final-form{background:var(--soft);padding:96px 0;border-top:1px solid var(--line)}
.cta-final-form h2{margin-bottom:18px}
@media(max-width:1000px){.cta-final-form .hero-grid{grid-template-columns:1fr;gap:40px}}

/* ============================================================
   ROUNDED THEME — sobrescribe radius para look más amigable
   ============================================================ */
:root{
  --r-xs:8px;
  --r-sm:12px;
  --r-md:18px;
  --r-lg:24px;
  --r-pill:999px;
}

/* Botones: pill */
.btn{border-radius:var(--r-pill)}
.btn-block{border-radius:var(--r-pill)}
.btn-sm{border-radius:var(--r-pill)}

/* Cards e inputs */
.form-card{border-radius:var(--r-md)}
.lead-form input,.lead-form select,.lead-form textarea{border-radius:var(--r-sm)}
.field-check input[type="checkbox"]{border-radius:4px}

/* Service cards: redondear toda la card y el thumb superior */
.services{border-radius:var(--r-md);overflow:hidden}
.service-card{border-radius:0}
.card-figure{border-radius:0}
/* Si la primera/última card está al borde del grid, suaviza esquinas externas vía hijos */
.services .service-card:first-child .card-figure{border-top-left-radius:var(--r-md)}
.services .service-card:nth-child(3) .card-figure{border-top-right-radius:var(--r-md)}
@media(max-width:920px){
  .services .service-card:nth-child(2) .card-figure{border-top-right-radius:var(--r-md)}
  .services .service-card:nth-child(3) .card-figure{border-top-right-radius:0;border-top-left-radius:0}
}

/* Trust grid (bloque oscuro): bordes suaves */
.trust-grid{border-radius:var(--r-md);overflow:hidden}
.trust-item{border-radius:0}

/* Stat blocks */
.stat-block{border-radius:var(--r-sm)}

/* FAQs */
.faq-item{border-radius:var(--r-sm);border:1px solid var(--line);padding:20px 24px;background:var(--paper)}
.faq{border-top:0;display:flex;flex-direction:column;gap:10px}
.section--soft .faq-item{background:#fff}

/* Logo mark redondeado */
.logo-mark{border-radius:10px}

/* Hero figure y banners */
.hero-figure,.figure,.figure--wide,.figure--tall,.figure--square,.figure--banner,
.split-figure,.proceso-figure,.cta-bg,.section-hero-bg{border-radius:var(--r-md)}
.hero-figure img,.figure img,.split-figure img,.proceso-figure img{border-radius:inherit}

/* City grid + chips */
.chips a,.chip-static{border-radius:var(--r-pill)}
.city-grid{border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);border-top:0}
.city-grid a{border-bottom:1px solid var(--line);border-right:1px solid var(--line)}

/* Cookie banner y modal */
.cookie-banner{border-radius:var(--r-md)}
.cookie-config-card{border-radius:var(--r-md)}

/* Skip link */
.skip-link{border-radius:var(--r-xs)}

/* Form card en hero (más generoso) */
@media(min-width:1001px){
  .form-card{border-radius:var(--r-lg)}
}

/* Tags y eyebrows ya son pill */
.tag,.hero-eyebrow{border-radius:var(--r-pill)}

/* Cards de contacto y client items */
.contact-block,.client-item{border-radius:0}

/* CTA final: redondear esquinas superiores */
.cta-final{border-radius:var(--r-lg) var(--r-lg) 0 0}
.cta-final-form{border-radius:var(--r-lg) var(--r-lg) 0 0}

/* Section--ink (trust dark) recuadro flotante */
.section--ink .trust-grid{box-shadow:0 30px 80px -30px rgba(0,0,0,.4)}

/* Page status (404, gracias) */
.page-status .icon-ok{border-radius:var(--r-pill)}

/* Inputs file/select pequeños detalles */
.field-check{border-radius:var(--r-sm)}

/* Dropdown del header un poco más redondo */
.dropdown{border-radius:var(--r-sm)}

/* Header background pill subtle */
.menu-toggle{border-radius:var(--r-xs)}


/* ============================================================
   PÁGINA 404 (editorial, centrada, sobria)
   ============================================================ */
.error-page{
  min-height:calc(100vh - 88px);
  display:flex;align-items:center;justify-content:center;
  background:var(--bg);
  padding:96px 0 120px;text-align:center;
}
.error-mark{
  display:flex;align-items:center;justify-content:center;gap:18px;
  margin-bottom:36px;
}
.error-line{
  display:block;width:46px;height:1px;background:var(--accent);
}
.error-code{
  font-family:'Inter',sans-serif;font-size:.7rem;font-weight:600;
  letter-spacing:.32em;text-transform:uppercase;color:var(--accent);
}
.error-title{
  font-family:'Fraunces',serif;font-weight:500;
  font-size:clamp(2.2rem,5vw,3.6rem);
  line-height:1.1;letter-spacing:-.022em;color:var(--ink);
  margin:0 auto 22px;max-width:600px;
}
.error-lead{
  font-size:1.05rem;color:var(--muted);max-width:520px;
  margin:0 auto 44px;line-height:1.7;
}
.error-ctas{
  display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  margin-bottom:64px;
}
.error-links{
  display:flex;flex-direction:column;align-items:center;gap:18px;
  padding-top:44px;border-top:1px solid var(--line);
  max-width:560px;margin:0 auto;
}
.error-links-label{
  font-family:'Inter',sans-serif;font-size:.66rem;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--muted-2);
}
.error-links ul{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:8px 0;
}
.error-links li{position:relative;padding:0 18px}
.error-links li:not(:last-child)::after{
  content:"";position:absolute;right:-1px;top:50%;
  width:1px;height:14px;background:var(--line);transform:translateY(-50%);
}
.error-links a{
  font-size:.88rem;color:var(--ink-soft);
  position:relative;padding:2px 0;
  transition:color .2s ease;
}
.error-links a::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;
  background:var(--accent);transform:scaleX(0);transform-origin:center;
  transition:transform .25s ease;
}
.error-links a:hover{color:var(--ink)}
.error-links a:hover::after{transform:scaleX(1)}

@media(max-width:640px){
  .error-page{min-height:auto;padding:72px 0 88px}
  .error-line{width:30px}
  .error-ctas{margin-bottom:48px}
  .error-links li{padding:0 12px}
  .error-links li::after{display:none}
}

/* ============================================================
   BOTÓN WHATSAPP FLOTANTE
   ============================================================ */
.whatsapp-fab{
  position:fixed;left:18px;bottom:18px;z-index:80;
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 18px 12px 14px;
  background:#25d366;color:#fff;
  border-radius:var(--r-pill);
  box-shadow:0 14px 32px -10px rgba(37,211,102,.5), 0 4px 10px rgba(0,0,0,.12);
  font-family:'Inter',sans-serif;font-size:.86rem;font-weight:600;
  letter-spacing:.01em;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  text-decoration:none;
}
.whatsapp-fab svg{width:22px;height:22px;flex-shrink:0}
.whatsapp-fab:hover{
  background:#1fbb58;color:#fff;
  transform:translateY(-2px);
  box-shadow:0 18px 40px -12px rgba(37,211,102,.6), 0 6px 14px rgba(0,0,0,.15);
}
.whatsapp-fab:focus-visible{outline:3px solid #fff;outline-offset:2px}
@media(max-width:640px){
  .whatsapp-fab{
    padding:13px;gap:0;left:14px;bottom:14px;
    box-shadow:0 14px 32px -10px rgba(37,211,102,.5);
  }
  .whatsapp-fab span{display:none}
  .whatsapp-fab svg{width:24px;height:24px}
}
/* Cuando el banner de cookies está visible, sube el WhatsApp para no taparlo */
.cookie-banner:not([hidden]) ~ .whatsapp-fab,
body:has(.cookie-banner:not([hidden])) .whatsapp-fab{
  bottom:88px;
}
@media(max-width:640px){
  body:has(.cookie-banner:not([hidden])) .whatsapp-fab{bottom:140px}
}

/* ============================================================
   AJUSTES MOBILE FINALES
   ============================================================ */
@media(max-width:920px){
  /* Header sticky no debe tapar el contenido al saltar a anchors */
  :target{scroll-margin-top:90px}
  /* Banner cookies en mobile no se queda detrás del WhatsApp */
  .cookie-banner{bottom:80px}
}
@media(max-width:480px){
  .hero-eyebrow::before{display:none}
  .hero-eyebrow{margin-bottom:18px}
  .hero{padding:48px 0 56px}
  .form-card{padding:24px 22px}
  .form-title{font-size:1.18rem}
  /* CTAs apilados */
  .hero-ctas{flex-direction:column;align-items:stretch;gap:10px}
  .hero-ctas .btn{width:100%}
  .error-ctas{flex-direction:column;align-items:stretch}
  .error-ctas .btn{width:100%}
}

/* Fix split sin contenedor en CTA final form */
.cta-final-form .form-card{margin-top:0}

/* Asegurar que el footer no quede pegado a los CTA si hay poco contenido */
main:empty + footer{display:none}

/* ============================================================
   PÁGINA GRACIAS (premium)
   ============================================================ */
.gracias-hero{
  min-height:calc(100vh - 88px);
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,var(--bg) 0%,#f1efe8 100%);
  padding:80px 0 100px;text-align:center;
}
.gracias-mark{
  display:flex;align-items:center;justify-content:center;gap:18px;
  margin-bottom:28px;
}
.gracias-line{display:block;width:46px;height:1px;background:#5fa052}
.gracias-code{
  font-family:'Inter',sans-serif;font-size:.7rem;font-weight:600;
  letter-spacing:.32em;text-transform:uppercase;color:#5fa052;
}
.gracias-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:84px;height:84px;border-radius:var(--r-pill);
  background:#e6f4e2;color:#3f8a36;
  margin-bottom:24px;
}
.gracias-icon svg{width:38px;height:38px;stroke-width:2.5}
.gracias-title{
  font-family:'Fraunces',serif;font-weight:500;
  font-size:clamp(2.2rem,5vw,3.6rem);
  line-height:1.08;letter-spacing:-.022em;color:var(--ink);
  margin:0 auto 22px;max-width:660px;
}
.gracias-lead{
  font-size:1.1rem;color:var(--muted);max-width:560px;
  margin:0 auto 60px;line-height:1.7;
}
.gracias-lead strong{color:var(--ink)}

.gracias-steps{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
  max-width:780px;margin:0 auto 60px;text-align:left;
}
@media(max-width:720px){
  .gracias-steps{grid-template-columns:1fr;gap:14px;max-width:420px}
}
.gracias-step{
  background:var(--paper);
  padding:24px 22px;
  border:1px solid var(--line);
  border-radius:var(--r-md);
}
.gracias-step .step-num{
  font-family:'Fraunces',serif;font-size:.85rem;color:var(--accent);
  display:block;margin-bottom:10px;letter-spacing:.04em;
}
.gracias-step h3{
  font-family:'Fraunces',serif;font-weight:500;font-size:1.1rem;
  margin-bottom:6px;color:var(--ink);
}
.gracias-step p{
  color:var(--muted);font-size:.92rem;margin:0;
}

.gracias-direct{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  padding:32px 28px;max-width:620px;margin:0 auto 40px;
}
.gracias-direct-label{
  font-family:'Inter',sans-serif;font-size:.74rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
  margin-bottom:18px;
}
.gracias-actions{
  display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  margin-bottom:18px;
}
.gracias-extras{
  margin:0;font-size:.86rem;color:var(--muted);
}
.gracias-extras a{color:var(--ink);text-decoration:underline}
.gracias-extras .dot{margin:0 10px;color:var(--muted-2)}

.gracias-back{
  display:flex;justify-content:center;gap:24px;flex-wrap:wrap;
  padding-top:24px;
}
.link-arrow{
  font-size:.9rem;color:var(--muted);font-weight:500;
  transition:color .2s ease;
}
.link-arrow:hover{color:var(--ink)}

/* Botón WhatsApp */
.btn-whatsapp{
  background:#25d366;color:#fff;border-color:#25d366;
}
.btn-whatsapp:hover{background:#1fbb58;border-color:#1fbb58;color:#fff}

@media(max-width:640px){
  .gracias-hero{min-height:auto;padding:64px 0 80px}
  .gracias-line{width:30px}
  .gracias-actions{flex-direction:column;align-items:stretch}
  .gracias-actions .btn{width:100%}
  .gracias-icon{width:72px;height:72px}
  .gracias-icon svg{width:32px;height:32px}
}

/* ============================================================
   404 contact links inline
   ============================================================ */
.error-direct{
  display:flex;justify-content:center;gap:0;flex-wrap:wrap;
  margin-bottom:48px;padding-top:8px;
}
.error-contact-link{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 18px;color:var(--ink-soft);font-size:.86rem;font-weight:500;
  border-right:1px solid var(--line);
  transition:color .2s ease;
}
.error-contact-link:last-child{border-right:0}
.error-contact-link:hover{color:var(--accent)}
.error-contact-link svg{flex-shrink:0;opacity:.65}
@media(max-width:480px){
  .error-direct{gap:8px}
  .error-contact-link{border-right:0;padding:8px 12px}
}