/* ==========================================================================
   Casa Francia — hoja de estilos
   Paleta replicada de francia/medical/frontend/assets/styles/base/tailwind.css
   ========================================================================== */

:root{
  /* paleta de origen (sin modificar) */
  --teal:#2f80a7;
  --teal-light:#3f9ec4;
  --teal-dark:#256b8d;
  --teal-on-surface:#1f5f7f;
  --green:#45a578;
  --amber:#e5a93a;
  --terracotta:#c95a5a;

  --cream:#e4e2d2;
  --cream-sunken:#d6d3c0;
  --cream-strong:#c9c6b2;
  --charcoal-bg:#4a4e50;
  --charcoal-chrome:#5b5d57;
  --charcoal-chrome-dark:#4c4e49;
  --ink:#2a2a28;
  --ink-muted:#4c6169;

  --radius-sm:4px;
  --radius-md:6px;
  --radius-lg:10px;
  --shadow-sm:0 2px 6px rgba(31,58,70,.08);
  --shadow-md:0 8px 22px rgba(31,58,70,.10);
  --shadow-lg:0 18px 44px rgba(31,58,70,.18);
  --transition:180ms cubic-bezier(.4,0,.2,1);

  --font-display: Georgia, 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', serif;
  --font-body: -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* tema (siempre claro, no depende del dispositivo) */
  --bg: #f6f4ec;
  --surface: var(--cream);
  --surface-sunken: var(--cream-sunken);
  --surface-strong: var(--cream-strong);
  --border: #d8d4c2;
  --text: var(--ink);
  --text-muted: #6b6558;
  --nav-bg: rgba(246,244,236,.9);
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font-family:inherit; }
::selection{ background:var(--teal-light); color:#fff; }

.wrap{ max-width:1180px; margin:0 auto; padding:0 clamp(20px,4vw,48px); }

h1,h2,h3{ font-family:var(--font-display); text-wrap:balance; margin:0 0 14px; }
h2{ font-size:clamp(26px,3.2vw,36px); }
h3{ font-size:20px; }
p{ margin:0 0 12px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-muted);
}
.section-head{ max-width:66ch; margin-bottom:36px; }
.section-head p{ color:var(--text-muted); font-size:15.5px; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 24px; border-radius:var(--radius-sm); border:0; cursor:pointer;
  font-size:13px; font-weight:800; letter-spacing:.02em; text-decoration:none;
  transition:background var(--transition), box-shadow var(--transition), transform var(--transition);
}
.btn:focus-visible{ outline:2px solid var(--teal-light); outline-offset:2px; }
.btn-primary{ background:var(--teal); color:#fff; box-shadow:var(--shadow-md); }
.btn-primary:hover{ background:var(--teal-dark); transform:translateY(-1px); }
.btn-outline{ background:rgba(255,255,255,.08); border:1.5px solid rgba(255,255,255,.7); color:#fff; }
.btn-outline:hover{ background:rgba(255,255,255,.16); }
.btn-block{ width:100%; }

/* ---------------- nav ---------------- */
.site-nav{
  position:sticky; top:0; z-index:80;
  background:var(--nav-bg); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.site-nav-inner{
  max-width:1180px; margin:0 auto; padding:14px clamp(20px,4vw,48px);
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.brand{ display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:19px; text-decoration:none; color:var(--text); }
.brand-mark{ height:32px; width:auto; display:block; }
.nav-links{ display:flex; gap:24px; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  text-decoration:none; color:var(--text-muted); transition:color var(--transition);
}
.nav-links a:hover{ color:var(--teal); }
.nav-cta{ display:none; }
@media (min-width:720px){ .nav-cta{ display:inline-flex; } }
.nav-toggle{
  display:inline-flex; background:none; border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:8px 10px; color:var(--text);
}
@media (min-width:820px){ .nav-toggle{ display:none; } }
.nav-links{ display:none; }
@media (min-width:820px){ .nav-links{ display:flex; } }
.nav-links.is-open{ display:flex; }
@media (max-width:819px){
  .nav-links.is-open{
    position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0;
    background:var(--surface); border-bottom:1px solid var(--border); padding:8px 0;
  }
  .nav-links.is-open a{ padding:12px clamp(20px,4vw,48px); display:block; }
}

/* ---------------- hero ---------------- */
.hero{
  position:relative; min-height:min(88vh,780px); display:flex; flex-direction:column; justify-content:flex-end; align-items:stretch;
  margin-top:-1px; overflow:hidden; color:#fff;
}
.hero-media{ position:absolute; inset:0; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-media::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(38,37,34,.35) 0%, rgba(38,37,34,.15) 40%, rgba(30,29,27,.82) 100%);
}
.hero-content{ position:relative; z-index:2; padding:0 clamp(20px,4vw,48px) 72px; max-width:640px; width:100%; }
.hero-badge{
  display:inline-block; font-size:10.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.4); padding:7px 14px; border-radius:999px; margin-bottom:18px;
}
.hero h1{ font-size:clamp(32px,5.2vw,54px); line-height:1.08; margin:0 0 16px; color:#fff; }
.hero p.lede{ font-size:16px; opacity:.92; max-width:46ch; margin:0 0 26px; }
.hero-ctas{ display:flex; gap:12px; flex-wrap:wrap; }
.hero-stats{ position:absolute; z-index:2; right:clamp(20px,4vw,48px); bottom:32px; display:flex; gap:10px; }
.hero-stat{
  background:rgba(30,29,27,.55); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.22);
  color:#fff; border-radius:var(--radius-md); padding:10px 14px; text-align:center; min-width:66px;
}
.hero-stat b{ display:block; font-size:18px; font-family:var(--font-display); font-variant-numeric:tabular-nums; }
.hero-stat span{ font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; opacity:.82; }
@media (max-width:720px){
  .hero-content{ max-width:100%; text-align:center; }
  .hero-ctas{ justify-content:center; }
  .hero-stats{ position:static; justify-content:center; margin:22px clamp(20px,4vw,48px) 36px; }
}

/* ---------------- descripcion ---------------- */
.about{ padding:72px 0; }
.about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:start; }
@media (max-width:860px){ .about-grid{ grid-template-columns:1fr; gap:32px; } }
.about-copy p{ color:var(--text-muted); font-size:15.5px; }
.stat-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.stat-card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:18px; box-shadow:var(--shadow-sm);
}
.stat-card b{ display:block; font-family:var(--font-display); font-size:26px; font-variant-numeric:tabular-nums; }
.stat-card span{ font-size:11.5px; color:var(--text-muted); font-weight:700; letter-spacing:.03em; }
@media (max-width:600px){
  .stat-card{ text-align:center; }
}

/* ---------------- galeria ---------------- */
.gallery-section{ padding:72px 0; background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }

.gallery-layout{ display:flex; flex-direction:column; gap:20px; }
.gal-tabs-wrap{ order:1; }
.gal-tabs{
  display:flex; flex-wrap:wrap; gap:8px 10px; padding-bottom:20px; margin-bottom:4px; border-bottom:1px solid var(--surface-strong);
}
#gal-panels{ order:2; min-width:0; }
@media (max-width:919px){
  .gal-tabs{
    flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; gap:7px; padding-bottom:14px;
  }
  .gal-tabs::-webkit-scrollbar{ display:none; }
  .gal-tab{ padding:7px 13px; font-size:11px; }
}
@media (min-width:920px){
  .gallery-layout{ flex-direction:row; align-items:flex-start; gap:28px; }
  .gal-tabs-wrap{ flex:0 0 208px; position:sticky; top:92px; }
  .gal-tabs{
    flex-direction:column; flex-wrap:nowrap; gap:6px;
    padding-bottom:0; margin-bottom:0; border-bottom:0;
  }
  #gal-panels{ order:2; flex:1 1 auto; min-width:0; }
  .gal-tab{ width:100%; text-align:left; border-radius:var(--radius-sm); }
}

/* indicador de desplazamiento horizontal (tabs y tags en móvil) */
.hscroll-wrap{ position:relative; }
.hscroll-wrap::before, .hscroll-wrap::after{
  content:''; position:absolute; top:0; bottom:0; width:28px; pointer-events:none;
  opacity:0; transition:opacity 200ms ease; z-index:2;
}
.hscroll-wrap::before{ left:0; background:linear-gradient(to right, var(--surface) 15%, transparent); }
.hscroll-wrap::after{ right:0; background:linear-gradient(to left, var(--surface) 15%, transparent); }
.hscroll-wrap.can-scroll-left::before{ opacity:1; }
.hscroll-wrap.can-scroll-right::after{ opacity:1; }

.gal-tab{
  flex:0 0 auto; font-size:12px; font-weight:800; letter-spacing:.02em; padding:9px 16px; border-radius:999px;
  background:var(--surface-sunken); color:var(--text-muted); border:1px solid transparent; cursor:pointer;
  transition:background var(--transition), color var(--transition);
}
.gal-tab:hover{ background:var(--surface-strong); }
.gal-tab.is-active{ background:var(--teal); color:#fff; }
.gal-panel{ display:none; }
.gal-panel.is-active{ display:block; animation:galFadeIn 420ms ease; }
@keyframes galFadeIn{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:translateY(0); }
}
.gal-panel-count{ font-size:12.5px; color:var(--text-muted); margin-bottom:10px; }
.gal-amenities-wrap{ margin-top:18px; }
.gal-amenities{ display:flex; flex-wrap:wrap; gap:6px; }
.gal-amenity-chip{
  font-size:11px; font-weight:700; background:var(--charcoal-chrome); color:var(--cream);
  border:1px solid var(--charcoal-chrome-dark); padding:4px 10px; border-radius:999px;
}
.gal-amenity-more{
  flex:0 0 auto; font-size:11px; font-weight:800; letter-spacing:.02em;
  background:transparent; color:var(--teal-on-surface); border:1px solid var(--teal-on-surface);
  padding:4px 10px; border-radius:999px; cursor:pointer;
  transition:background var(--transition), color var(--transition);
}
.gal-amenity-more:hover{ background:var(--teal-on-surface); color:#fff; }
@media (max-width:600px){
  .gal-amenities-wrap{ margin-top:14px; }
  .gal-amenities{
    flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; gap:5px; padding-bottom:2px;
  }
  .gal-amenities::-webkit-scrollbar{ display:none; }
  .gal-amenity-chip{ font-size:10px; padding:3px 8px; white-space:nowrap; flex:0 0 auto; }
}

.gal-grid{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:8px;
}
@media (max-width:720px){ .gal-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:130px; } }
.gal-cell{
  position:relative; overflow:hidden; border-radius:var(--radius-md); cursor:pointer;
  background:var(--surface-sunken);
}
.gal-cell:first-child{ grid-row:span 2; grid-column:span 2; }
.gal-cell img{
  width:100%; height:100%; object-fit:cover; transition:transform 420ms ease;
}
.gal-cell:hover img{ transform:scale(1.06); }
.gal-cell-caption{
  position:absolute; left:0; right:0; bottom:0; padding:10px 12px;
  background:linear-gradient(180deg, transparent, rgba(20,19,17,.75));
  color:#fff; font-size:11.5px; font-weight:700;
  opacity:0; transform:translateY(6px); transition:opacity var(--transition), transform var(--transition);
}
.gal-cell:hover .gal-cell-caption{ opacity:1; transform:translateY(0); }
.gal-cell-more{
  position:absolute; inset:0; background:rgba(24,23,21,.58); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px;
}

/* lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center;
  background:rgba(18,17,16,.92); padding:20px;
}
.lightbox.is-open{ display:flex; }
.lightbox-figure{ max-width:min(92vw,1100px); max-height:88vh; display:flex; flex-direction:column; gap:12px; align-items:center; }
.lightbox-figure img{ max-width:100%; max-height:74vh; object-fit:contain; border-radius:var(--radius-md); box-shadow:var(--shadow-lg); }
.lightbox-caption{ color:var(--cream); font-size:13.5px; text-align:center; max-width:70ch; }
.lightbox-counter{ color:rgba(228,226,210,.6); font-size:11.5px; letter-spacing:.05em; font-variant-numeric:tabular-nums; }
.lightbox-close, .lightbox-prev, .lightbox-next{
  position:absolute; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.35); color:#fff;
  border-radius:50%; width:42px; height:42px; display:flex; align-items:center; justify-content:center;
  font-size:18px; cursor:pointer;
}
.lightbox-close{ top:18px; right:18px; }
.lightbox-prev{ left:18px; top:50%; transform:translateY(-50%); }
.lightbox-next{ right:18px; top:50%; transform:translateY(-50%); }
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{ background:rgba(255,255,255,.2); }
@media (max-width:640px){
  .lightbox-prev, .lightbox-next{ width:36px; height:36px; font-size:15px; }
}

/* ---------------- amenidades ---------------- */
.amenities-section{ padding:72px 0; }
.am-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:10px; }
.am-item{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:12px; display:flex; flex-direction:column; gap:7px; box-shadow:var(--shadow-sm);
  transition:box-shadow var(--transition), transform var(--transition);
}
.am-item:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); }
.am-icon{
  width:28px; height:28px; border-radius:7px; background:var(--surface-sunken); color:var(--teal-on-surface);
  display:flex; align-items:center; justify-content:center; font-size:13px;
}
.am-icon svg{ width:14px; height:14px; }
.am-item b{ font-size:12px; line-height:1.3; }

/* ---------------- cotizador ---------------- */
.quote-section{ padding:72px 0; background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.quote-grid{ display:grid; grid-template-columns:1fr 480px; gap:48px; align-items:start; }
@media (max-width:980px){ .quote-grid{ grid-template-columns:1fr; } }
.quote-rules{ display:flex; flex-direction:column; gap:14px; }
.rule-item{ display:flex; gap:12px; }
.rule-icon{
  flex:0 0 auto; width:34px; height:34px; border-radius:50%; background:var(--surface-sunken); color:var(--teal-on-surface);
  display:flex; align-items:center; justify-content:center; font-size:15px;
}
.rule-item p{ margin:0; font-size:13.5px; color:var(--text-muted); }
.rule-item b{ display:block; color:var(--text); font-size:14px; margin-bottom:2px; }

.quote-card{
  background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg); overflow:hidden; position:sticky; top:92px;
}
.quote-card-head{ padding:20px 22px; border-bottom:1px solid var(--border); }
.quote-price{ font-family:var(--font-display); font-size:26px; }
.quote-price small{ font-family:var(--font-body); font-size:12px; color:var(--text-muted); font-weight:700; }

.quote-season{ padding:16px 22px; border-bottom:1px solid var(--border); }
.qs-toggle{ display:flex; gap:8px; margin-bottom:10px; }
.qs-btn{
  flex:1; padding:9px 10px; border:1px solid var(--border); border-radius:var(--radius-sm);
  background:var(--surface); color:var(--text-muted); font:inherit; font-weight:800; font-size:12px;
  cursor:pointer; transition:background var(--transition), color var(--transition), border-color var(--transition);
}
.qs-btn:hover{ border-color:var(--teal-light); }
.qs-btn.is-active{ background:var(--teal); border-color:var(--teal); color:#fff; }
.quote-season .qf-period{ border:1px solid var(--border); border-radius:var(--radius-sm); margin-bottom:10px; }
.quote-season-note{ font-size:11.5px; color:var(--text-muted); margin:0; }

.quote-packages{ display:flex; flex-direction:column; gap:8px; padding:14px 22px; border-bottom:1px solid var(--border); }
.qp-item{
  display:block; border:1px solid var(--border); border-radius:var(--radius-md); padding:10px 12px;
  cursor:pointer; transition:border-color var(--transition), background var(--transition); position:relative;
}
.qp-item:hover{ border-color:var(--teal-light); }
.qp-item.is-selected{ border-color:var(--teal); background:var(--surface-sunken); }
.qp-item input{ position:absolute; opacity:0; pointer-events:none; }
.qp-head{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.qp-name{ font-weight:800; font-size:13px; }
.qp-price{ font-weight:800; font-size:13.5px; color:var(--teal-on-surface); font-variant-numeric:tabular-nums; white-space:nowrap; }
.qp-desc{ margin:4px 0 0; font-size:12px; color:var(--text-muted); line-height:1.4; }

.quote-fields{ display:grid; grid-template-columns:1fr 1fr; }
.qf{ padding:0; border-bottom:1px solid var(--border); border-right:1px solid var(--border); }
.qf.qf-full{ grid-column:1/-1; border-right:0; }
.qf.qf-last{ border-right:0; }
.qf label{ display:block; font-size:9.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); padding:10px 14px 0; }
.qf input, .qf select{
  width:100%; border:0; background:transparent; font:inherit; font-weight:700; font-size:13.5px; color:var(--text);
  padding:4px 14px 10px; font-family:var(--font-body);
}
.qf input:focus, .qf select:focus{ outline:none; }
.qf input[type="date"]{ font-variant-numeric:tabular-nums; }
.qf input[type="date"]::-webkit-calendar-picker-indicator{
  cursor:pointer; padding:4px; margin-right:-4px; border-radius:var(--radius-sm);
  opacity:.75;
}

.quote-msg{ padding:12px 22px; font-size:12.5px; color:var(--terracotta); display:none; border-bottom:1px solid var(--border); }
.quote-msg.is-visible{ display:block; }
.quote-msg.is-success{ color:var(--green); }

.quote-breakdown{ padding:18px 22px; display:flex; flex-direction:column; gap:9px; }
.qb-row{ display:flex; justify-content:space-between; font-size:12.5px; color:var(--text-muted); font-variant-numeric:tabular-nums; }
.qb-row.total{ color:var(--text); font-weight:800; font-size:15px; border-top:1px dashed var(--border); padding-top:12px; margin-top:4px; }
.quote-note{ padding:0 22px 18px; font-size:11.5px; color:var(--text-muted); }
.quote-cta{ padding:0 22px 22px; }

/* ---------------- contrato y firma ---------------- */
.contract-section{ padding:72px 0; }
.contract-locked{
  background:var(--surface); border:1px dashed var(--border); border-radius:var(--radius-lg);
  padding:22px 24px; color:var(--text-muted); font-size:14px;
}
.contract-locked a{ color:var(--teal-on-surface); font-weight:700; text-decoration:none; }
.contract-locked a:hover{ text-decoration:underline; }

.contract-grid{ display:flex; flex-direction:column; gap:28px; max-width:920px; margin:0 auto; }

.contract-summary{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:20px 24px; box-shadow:var(--shadow-sm);
  display:flex; align-items:center; justify-content:space-between; gap:20px 32px; flex-wrap:wrap;
}
.contract-summary h3{
  margin:0; flex:0 0 auto; font-size:14px; padding-right:20px; border-right:1px solid var(--border);
}
.summary-list{ margin:0; display:flex; flex-wrap:wrap; gap:18px 32px; flex:1 1 auto; min-width:0; }
.summary-list div{ display:flex; flex-direction:column; gap:2px; font-size:13.5px; font-variant-numeric:tabular-nums; }
.summary-list dt{ color:var(--text-muted); font-size:10.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.summary-list dd{ margin:0; font-weight:800; }
.contract-hint{ font-size:12px; color:var(--text-muted); margin:0; flex:1 1 220px; }
.cf-uploads + .contract-hint{ margin-top:14px; }
@media (max-width:640px){
  .contract-summary h3{ border-right:0; padding-right:0; flex-basis:100%; }
}

.link-btn{
  display:inline-flex; align-items:center; gap:6px;
  background:none; border:0; padding:0; color:var(--teal-on-surface); font-weight:800; font-size:12.5px;
  cursor:pointer; text-decoration:underline; text-underline-offset:2px; white-space:nowrap;
}
.link-btn svg{ flex:0 0 auto; text-decoration:none; }

.cf-columns{ display:grid; grid-template-columns:1.3fr 1fr; gap:32px; align-items:start; }
@media (max-width:760px){ .cf-columns{ grid-template-columns:1fr; gap:0; } }

.contract-form h3{ margin-top:28px; }
.contract-form h3:first-child{ margin-top:0; }
.cf-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:480px){ .cf-grid{ grid-template-columns:1fr; } }
.cf-span2{ grid-column:span 2; }
@media (max-width:480px){ .cf-span2{ grid-column:1/-1; } }
.cf-field-row{ display:flex; gap:14px; min-width:0; }
@media (max-width:420px){ .cf-field-row{ flex-wrap:wrap; } }
.cf-field-row .cf-field{ flex:1 1 0; min-width:0; }
.cf-field-row .cf-narrow{ flex:0 0 110px; }
.cf-field{ display:flex; flex-direction:column; gap:6px; font-size:11.5px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:var(--text-muted); }
.cf-field input{
  font:inherit; font-weight:600; font-size:14px; text-transform:none; letter-spacing:normal; color:var(--text);
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:11px 12px;
}
.cf-field input:focus{ outline:2px solid var(--teal-light); outline-offset:1px; }
.cf-field input:invalid.touched{ border-color:var(--terracotta); }

.cf-checks{ display:flex; flex-direction:column; gap:12px; }
.cf-check{ display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--text-muted); cursor:pointer; }
.cf-check input{ margin-top:3px; flex:0 0 auto; width:16px; height:16px; accent-color:var(--teal); }

.cf-optional{ font-size:12px; font-weight:600; text-transform:none; letter-spacing:normal; color:var(--text-muted); font-family:var(--font-body); }
.cf-uploads{ display:flex; flex-direction:column; gap:14px; }
.cf-upload{ display:flex; flex-direction:column; gap:8px; font-size:12.5px; font-weight:700; color:var(--text); cursor:default; }
.cf-upload-row{ position:relative; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.cf-upload-row input[type="file"]{ position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.cf-upload-btn{
  flex:0 0 auto; background:var(--surface-sunken); border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:9px 16px; font-size:12px; font-weight:800; color:var(--text);
}
.cf-upload-row:hover .cf-upload-btn{ background:var(--surface-strong); }
.cf-upload-status{ font-size:12px; font-weight:600; color:var(--text-muted); }
.cf-upload-status.has-file{ color:var(--green); font-weight:800; }

.signature-pad-wrap{
  border:1.5px dashed var(--border); border-radius:var(--radius-md); background:var(--surface); padding:8px;
}
#signature-pad{ width:100%; height:180px; display:block; border-radius:var(--radius-sm); background:var(--bg-alt,#fff); touch-action:none; cursor:crosshair; }
.signature-pad-actions{ display:flex; align-items:center; justify-content:space-between; margin-top:8px; gap:10px; flex-wrap:wrap; }
.signature-hint{ font-size:11.5px; color:var(--text-muted); }

.contract-actions{ margin:22px 0 10px; display:flex; justify-content:flex-end; }
@media (max-width:640px){
  .contract-actions{ justify-content:center; }
}

/* ---- diálogo del contrato completo (no desplaza la página) ----
   Header en el gris del sistema (charcoal-chrome, igual que el footer);
   cuerpo en la crema clara del resto del sitio. */
.legal-modal{
  position:fixed; inset:0; z-index:210; display:none; align-items:center; justify-content:center;
  background:rgba(18,17,16,.6); padding:20px;
}
.legal-modal.is-open{ display:flex; }
.legal-modal-panel{
  background:var(--cream); color:var(--ink); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  width:min(720px, 100%); max-height:86vh; display:flex; flex-direction:column; overflow:hidden;
}
.legal-modal-header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 24px; border-bottom:1px solid var(--charcoal-chrome-dark); flex:0 0 auto;
  background:var(--charcoal-chrome); color:var(--cream);
}
.legal-modal-header h3{ margin:0; font-size:18px; color:var(--cream); }
.legal-modal-close{
  flex:0 0 auto; width:32px; height:32px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  background:var(--charcoal-chrome-dark); color:var(--cream); font-size:15px; cursor:pointer;
}
.legal-modal-close:hover{ background:var(--charcoal-bg); }
.legal-modal-body{ padding:22px 24px; overflow-y:auto; flex:1 1 auto; }
.legal-modal-body h4{ font-family:var(--font-display); font-size:17px; margin:22px 0 10px; color:var(--charcoal-bg); }
.legal-modal-body h4:first-child{ margin-top:0; }
.legal-modal-body p{ font-size:13.5px; color:#6b6b66; margin:0 0 12px; }
.legal-modal-body .clause b{ color:var(--ink); }
.legal-modal-body .cft-intro{ font-size:14px; color:var(--ink); margin-bottom:20px; }
@media (max-width:600px){
  .legal-modal{ padding:0; }
  .legal-modal-panel{ width:100%; height:100%; max-height:100%; border-radius:0; }
}

/* ---------------- ubicacion ---------------- */
.location-section{ padding:72px 0; background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.location-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
@media (max-width:860px){ .location-grid{ grid-template-columns:1fr; } }
.location-map{
  border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--border); box-shadow:var(--shadow-md);
  aspect-ratio:4/3; background:var(--surface-sunken);
}
.location-map iframe{ width:100%; height:100%; border:0; display:block; }

/* ---------------- footer ---------------- */
.site-footer{
  background:linear-gradient(180deg, var(--charcoal-chrome) 0%, var(--charcoal-chrome-dark) 100%);
  color:var(--cream); padding:56px 0 26px;
}
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:32px; margin-bottom:32px; }
@media (max-width:720px){
  .footer-grid{ grid-template-columns:1fr; gap:24px; }
  .footer-grid > div:first-child{ text-align:center; }
  .footer-logo-plate{ margin-left:auto; margin-right:auto; }
}
.site-footer h5{ font-size:12px; margin:0 0 12px; letter-spacing:.06em; text-transform:uppercase; opacity:.85; }
.footer-logo-plate{
  display:inline-flex; background:var(--cream); border-radius:var(--radius-md);
  padding:10px 16px; margin-bottom:14px;
}
.footer-logo{ height:36px; width:auto; display:block; }
.site-footer p{ margin:0 0 8px; font-size:13.5px; opacity:.78; line-height:1.6; }
.site-footer a.footer-link{ color:var(--cream); text-decoration:none; opacity:.85; }
.site-footer a.footer-link:hover{ opacity:1; text-decoration:underline; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12); padding-top:18px; font-size:12px; opacity:.6;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
}

.reveal{ opacity:0; transform:translateY(14px); transition:opacity 560ms ease, transform 560ms ease; }
.reveal.is-visible{ opacity:1; transform:none; }