/* ============================================================
   Senior Rides Mobile — Elevated Design System
   Builds on tokens.css. Pattern: Trust & Authority + Conversion.
   Style: Accessible & Ethical (high contrast, large text, WCAG).
   Brand: navy / royal / sun. Type: Poppins + Inter.
   ============================================================ */

/* ---------- extra tokens ---------- */
:root{
  --shadow-xs: 0 1px 2px rgba(23,40,75,.06);
  --ring-royal: 0 0 0 4px rgba(44,90,166,.16);
  --glass: rgba(255,255,255,.72);
  --header-h: 74px;
}

/* ---------- reset / base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top: 90px; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:var(--fs-base); line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;
}
img,svg{ max-width:100%; display:block; }
a{ color:var(--royal); text-decoration:none; }
a:hover{ text-decoration:underline; }
::selection{ background:var(--hill-light); color:var(--navy); }

h1,h2,h3,h4{ font-family:var(--font-head); line-height:var(--lh-head); color:var(--navy); margin:0 0 .5em; font-weight:var(--fw-bold); letter-spacing:-.015em; }
h1{ font-size:var(--h1); }
h2{ font-size:var(--h2); }
h3{ font-size:var(--h3); font-weight:var(--fw-semi); letter-spacing:-.01em; }
p{ margin:0 0 1em; color:var(--ink-soft); }
strong{ color:var(--navy); }

/* ---------- layout ---------- */
.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.container--narrow{ max-width:900px; }
.section{ padding-block:var(--section-y); position:relative; }
.section--alt{ background:rgba(244,248,253,.78); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.section--sky{ background:transparent; }
.section--navy{ background:linear-gradient(160deg,var(--navy) 0%, var(--navy-2) 100%); color:#fff; }
.section-head{ max-width:680px; margin-inline:auto; text-align:center; margin-bottom:clamp(36px,5vw,60px); }
.section-head p{ font-size:var(--lead); margin-bottom:0; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--font-head); font-weight:var(--fw-semi);
  font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--royal); margin-bottom:.9em;
}
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--royal); border-radius:2px; display:inline-block; }
.section-head .eyebrow{ justify-content:center; }
.center{ text-align:center; }
.stack-sm > * + *{ margin-top:12px; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-family:var(--font-head); font-weight:var(--fw-semi); font-size:1.05rem;
  border-radius:var(--radius-pill); padding:15px 30px; border:2px solid transparent;
  cursor:pointer; text-align:center; min-height:54px; line-height:1;
  transition:background .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.btn:hover{ text-decoration:none; }
.btn:focus-visible{ outline:none; box-shadow:var(--ring-royal); }
.btn-primary{ background:var(--royal); color:#fff; box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:var(--royal-2); transform:translateY(-2px); box-shadow:var(--shadow); }
.btn-ghost{ background:transparent; color:var(--navy); border-color:var(--line); }
.btn-ghost:hover{ background:#fff; border-color:var(--navy); transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.btn-white{ background:#fff; color:var(--navy); box-shadow:var(--shadow-sm); }
.btn-white:hover{ background:var(--sky); transform:translateY(-2px); box-shadow:var(--shadow); }
.btn-block{ width:100%; }
.btn svg{ width:20px; height:20px; }
.btn-lg{ font-size:1.12rem; padding:17px 34px; min-height:58px; }

/* ---------- announcement bar ---------- */
.topbar{
  background:var(--navy); color:#DCE8F7; font-size:.92rem; text-align:center;
  padding:9px 16px; font-weight:var(--fw-med);
}
.topbar a{ color:#fff; text-decoration:underline; text-underline-offset:2px; }
.topbar .sep{ opacity:.4; margin:0 10px; }
@media (max-width:560px){ .topbar .hide-sm{ display:none; } }

/* ---------- header / nav ---------- */
.site-header{
  position:sticky; top:0; z-index:100; background:var(--glass);
  backdrop-filter:saturate(1.3) blur(12px); -webkit-backdrop-filter:saturate(1.3) blur(12px);
  border-bottom:1px solid transparent;
  transition:box-shadow .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease);
}
.site-header.is-scrolled{ box-shadow:var(--shadow-sm); border-color:var(--line); background:rgba(255,255,255,.9); }
.nav{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:14px; transition:padding .3s var(--ease); }
.site-header.is-scrolled .nav{ padding-block:9px; }
.brand{ display:inline-flex; align-items:center; gap:12px; }
.brand:hover{ text-decoration:none; }
.brand__mark{ width:48px; height:48px; flex:none; filter:drop-shadow(0 2px 4px rgba(23,40,75,.12)); }
.brand__text{ display:flex; flex-direction:column; line-height:1.05; }
.brand__name{ font-family:var(--font-head); font-weight:var(--fw-bold); font-size:1.3rem; color:var(--navy); letter-spacing:-.01em; }
.brand__tag{ font-size:.72rem; color:var(--royal); font-weight:var(--fw-med); letter-spacing:.02em; }

.nav__links{ display:none; align-items:center; gap:2px; list-style:none; margin:0; padding:0; }
.nav__links a{
  display:inline-block; font-family:var(--font-head); font-weight:var(--fw-med);
  color:var(--navy); padding:9px 12px; border-radius:var(--radius-sm); font-size:.96rem;
  white-space:nowrap;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.nav__cta{ white-space:nowrap; }
.nav__links a:hover{ background:var(--sky); text-decoration:none; }
.nav__links a[aria-current="page"]{ color:var(--royal); background:var(--sky); }
.nav__cta{ display:none; }
.nav__toggle{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--royal); color:#fff; border:0; border-radius:var(--radius-pill);
  padding:11px 18px; font-family:var(--font-head); font-weight:var(--fw-semi); font-size:1rem; cursor:pointer; min-height:46px;
}
.nav__toggle svg{ width:18px; height:18px; }
.nav__toggle:focus-visible{ outline:none; box-shadow:var(--ring-royal); }

.mobile-menu{
  position:fixed; inset:0 0 0 auto; width:min(88vw,360px); background:#fff; z-index:200;
  transform:translateX(100%); transition:transform .35s var(--ease); box-shadow:var(--shadow-lg);
  display:flex; flex-direction:column; padding:22px; overflow-y:auto;
}
.mobile-menu.is-open{ transform:translateX(0); }
.mobile-menu__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.mobile-menu__close{ background:var(--sky); border:0; border-radius:50%; width:44px; height:44px; cursor:pointer; color:var(--navy); font-size:1.4rem; line-height:1; }
.mobile-menu a{ display:block; font-family:var(--font-head); font-weight:var(--fw-med); font-size:1.15rem; color:var(--navy); padding:14px 10px; border-bottom:1px solid var(--line); }
.mobile-menu a[aria-current="page"]{ color:var(--royal); }
.mobile-menu .btn{ margin-top:20px; }
.mobile-menu .se-habla{ margin-top:18px; font-size:.95rem; color:var(--ink-soft); }
.backdrop{ position:fixed; inset:0; background:rgba(15,29,58,.5); z-index:150; opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s var(--ease); }
.backdrop.is-open{ opacity:1; visibility:visible; }
@media (min-width:1180px){ .nav__links{ display:flex; } .nav__cta{ display:inline-flex; } .nav__toggle{ display:none; } }
@media (min-width:1180px) and (max-width:1439.98px){
  .brand__tag{ display:none; }
  .nav{ gap:14px; }
  .nav__links a{ padding:9px 9px; font-size:.92rem; }
  .nav__cta{ padding:12px 18px; }
}

/* ---------- HERO ---------- */
.hero{ position:relative; overflow:hidden; background:transparent; }
.hero__inner{ position:relative; display:grid; grid-template-columns:1fr; gap:clamp(32px,5vw,60px); align-items:center; padding-block:clamp(44px,7vw,92px); }
.hero__badge{
  display:inline-flex; align-items:center; gap:9px; background:#fff; color:var(--navy);
  border:1px solid var(--line); border-radius:var(--radius-pill); padding:8px 16px;
  font-weight:var(--fw-med); font-size:.92rem; box-shadow:var(--shadow-sm); margin-bottom:22px;
}
.hero__badge .dot{ width:9px; height:9px; border-radius:50%; background:var(--success); box-shadow:0 0 0 4px rgba(46,125,91,.16); }
.hero h1{ margin-bottom:.38em; }
.hero h1 .accent{ color:var(--royal); }
.hero__lead{ font-size:var(--lead); max-width:44ch; margin-bottom:1.7em; color:var(--ink-soft); }
.hero__ctas{ display:flex; flex-wrap:wrap; gap:14px; }
.hero__trust{ display:flex; flex-wrap:wrap; gap:18px 26px; margin-top:30px; padding-top:26px; border-top:1px solid var(--line); }
.hero__trust li{ display:flex; align-items:center; gap:9px; font-size:.96rem; font-weight:var(--fw-med); color:var(--navy); list-style:none; }
.hero__trust svg{ width:22px; height:22px; color:var(--royal); flex:none; }
.hero__trust ul{ display:contents; margin:0; padding:0; }

/* hero art */
.hero__art{ position:relative; }
.hero__art .art-card{ position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); background:#fff; }
.hero__art svg.scene{ width:100%; height:auto; display:block; }
.float-card{
  position:absolute; background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:13px 16px; display:flex; align-items:center; gap:12px;
}
.float-card .fc-ic{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; flex:none; }
.float-card .fc-ic.green{ background:#E6F5EE; color:var(--success); }
.float-card .fc-ic.blue{ background:var(--sky); color:var(--royal); }
.float-card .fc-ic svg{ width:22px; height:22px; }
.float-card > span:last-child{ display:flex; flex-direction:column; }
.float-card .fc-t{ display:block; font-family:var(--font-head); font-weight:var(--fw-semi); font-size:.9rem; color:var(--navy); line-height:1.2; }
.float-card .fc-s{ display:block; font-size:.78rem; color:var(--muted); margin-top:2px; }
.float-card--tl{ top:18px; left:-14px; }
.float-card--br{ bottom:20px; right:-14px; }
@media (max-width:520px){ .float-card--tl{ left:6px; top:10px; } .float-card--br{ right:6px; bottom:12px; } .float-card .fc-s{ display:none; } }
@media (min-width:920px){ .hero__inner{ grid-template-columns:0.9fr 1.1fr; } }

/* ---------- TRUST STRIP ---------- */
.trust-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.82); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.trust-strip__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; padding-block:30px; list-style:none; margin:0; padding-left:0; padding-right:0; }
.trust-strip__item{ display:flex; align-items:center; gap:12px; font-family:var(--font-head); font-weight:var(--fw-med); font-size:.96rem; color:var(--navy); }
.trust-strip__item .ic{ width:44px; height:44px; border-radius:12px; background:var(--sky); color:var(--royal); display:grid; place-items:center; flex:none; }
.trust-strip__item svg{ width:24px; height:24px; }
@media (min-width:820px){ .trust-strip__grid{ grid-template-columns:repeat(5,1fr); } }

/* ---------- cards / grid ---------- */
.grid{ display:grid; gap:var(--gap); grid-template-columns:1fr; }
.grid--2{ grid-template-columns:1fr; }
.grid--3{ grid-template-columns:1fr; }
@media (min-width:640px){ .grid--2{ grid-template-columns:repeat(2,1fr);} .grid--3{ grid-template-columns:repeat(2,1fr);} }
@media (min-width:980px){ .grid--3{ grid-template-columns:repeat(3,1fr);} }

.card{
  position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:30px; box-shadow:var(--shadow-xs); overflow:hidden;
  transition:transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease);
}
.card::after{ content:""; position:absolute; left:0; top:0; height:4px; width:100%; background:linear-gradient(90deg,var(--royal),var(--sun)); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:var(--hill-light); }
.card:hover::after{ transform:scaleX(1); }
.card__icon{ width:58px; height:58px; border-radius:16px; background:var(--sky); display:inline-flex; align-items:center; justify-content:center; margin-bottom:20px; transition:background .28s var(--ease); }
.card__icon svg{ width:30px; height:30px; color:var(--royal); transition:color .28s var(--ease); }
.card:hover .card__icon{ background:var(--navy); }
.card:hover .card__icon svg{ color:var(--sun); }
.card h3{ margin-bottom:.4em; }
.card p{ margin-bottom:0; }
.card--flat{ box-shadow:none; }
.card--flat:hover{ transform:none; }
.card--flat::after{ display:none; }
.card--feature{ background:linear-gradient(155deg,var(--navy),var(--navy-2)); border-color:transparent; color:#fff; }
.card--feature h3{ color:#fff; }
.card--feature p{ color:#C6D5EC; }
.card--feature .card__icon{ background:rgba(255,255,255,.12); }
.card--feature .card__icon svg{ color:var(--sun); }
.card--feature:hover .card__icon{ background:rgba(255,255,255,.2); }
.tag{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-head); font-weight:var(--fw-semi); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--sun); background:rgba(46,111,208,.14); padding:5px 12px; border-radius:var(--radius-pill); margin-bottom:16px; }

/* ---------- steps ---------- */
.steps{ position:relative; display:grid; gap:24px; grid-template-columns:1fr; counter-reset:step; }
@media (min-width:900px){ .steps{ grid-template-columns:repeat(4,1fr); } }
.step{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px 26px; box-shadow:var(--shadow-xs); z-index:1; }
.step__num{ width:54px; height:54px; border-radius:50%; background:var(--royal); color:#fff; font-family:var(--font-head); font-weight:var(--fw-bold); font-size:1.45rem; display:inline-flex; align-items:center; justify-content:center; margin-bottom:18px; box-shadow:var(--shadow-sm); }
.step h3{ margin-bottom:.3em; }
.step p{ margin-bottom:0; font-size:.98rem; }
.steps--road::before{ content:""; position:absolute; top:60px; left:9%; right:9%; height:3px; background-image:linear-gradient(90deg,var(--hill-med) 58%, transparent 0); background-size:16px 3px; background-repeat:repeat-x; display:none; z-index:0; }
@media (min-width:900px){ .steps--road::before{ display:block; } }

/* ---------- feature list ---------- */
.feature-list{ list-style:none; margin:0; padding:0; display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:720px){ .feature-list{ grid-template-columns:repeat(2,1fr); } }
.feature-list li{ display:flex; align-items:flex-start; gap:14px; font-size:1.05rem; color:var(--navy); font-weight:var(--fw-med); }
.feature-list .fi{ width:28px; height:28px; border-radius:8px; background:#E6F5EE; color:var(--success); display:grid; place-items:center; flex:none; margin-top:1px; }
.feature-list svg{ width:18px; height:18px; }

/* ---------- split (why us) ---------- */
.split{ display:grid; gap:clamp(30px,5vw,56px); grid-template-columns:1fr; align-items:center; }
@media (min-width:900px){ .split{ grid-template-columns:1fr 1fr; } .split--wide-l{ grid-template-columns:1.1fr .9fr; } }
.panel{ background:linear-gradient(155deg,var(--navy),var(--navy-2)); color:#fff; border-radius:var(--radius-lg); padding:clamp(28px,4vw,44px); box-shadow:var(--shadow); }
.panel h2,.panel h3{ color:#fff; }
.panel p{ color:#C6D5EC; }
.quote{ font-family:var(--font-head); font-size:clamp(1.3rem,2.4vw,1.75rem); font-weight:var(--fw-med); color:#fff; line-height:1.35; }

/* ---------- service area ---------- */
.area{ display:grid; gap:clamp(30px,5vw,52px); grid-template-columns:1fr; align-items:center; }
@media (min-width:880px){ .area{ grid-template-columns:1fr 1fr; } }
.city-chips{ display:flex; flex-wrap:wrap; gap:12px; margin-top:10px; }
.city-chip{ display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-pill); padding:10px 18px; font-family:var(--font-head); font-weight:var(--fw-med); color:var(--navy); box-shadow:var(--shadow-xs); }
.city-chip svg{ width:18px; height:18px; color:var(--royal); }
.area__map svg{ width:100%; height:auto; border-radius:var(--radius-lg); box-shadow:var(--shadow); }

/* ---------- CTA band ---------- */
.cta-band{ position:relative; overflow:hidden; background:linear-gradient(135deg,var(--navy) 0%, var(--royal-2) 100%); color:#fff; text-align:center; }
.cta-band::before{ content:""; position:absolute; top:-140px; left:50%; transform:translateX(-50%); width:600px; height:340px; background:radial-gradient(circle, rgba(46,111,208,.4), transparent 62%); pointer-events:none; }
.cta-band h2{ color:#fff; }
.cta-band p{ color:#D6E4F7; font-size:var(--lead); max-width:620px; margin-inline:auto; }
.cta-band__phone{ font-family:var(--font-head); font-weight:var(--fw-bold); font-size:clamp(2rem,5vw,3rem); margin:10px 0 22px; letter-spacing:-.01em; }
.cta-band__phone a{ color:#fff; }
.cta-band__phone a:hover{ color:var(--sky); text-decoration:none; }
.cta-band__row{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

/* ---------- reviews placeholder ---------- */
.reviews-empty{ border:2px dashed var(--hill-med); border-radius:var(--radius-lg); padding:46px 28px; text-align:center; background:#fff; max-width:660px; margin-inline:auto; }
.reviews-empty .ic{ width:56px; height:56px; border-radius:16px; background:var(--sky); color:var(--royal); display:grid; place-items:center; margin:0 auto 16px; }
.reviews-empty svg{ width:30px; height:30px; }
.reviews-empty p{ margin-bottom:0; }
.stars{ display:inline-flex; gap:3px; color:var(--hill-med); margin-bottom:10px; }
.stars svg{ width:22px; height:22px; }

/* ---------- page hero (interior) ---------- */
.page-hero{ position:relative; overflow:hidden; background:transparent; padding-block:clamp(48px,7vw,84px); text-align:center; }
.page-hero--split{ text-align:left; }
.page-hero--split .ph-inner{ display:grid; gap:clamp(28px,5vw,52px); grid-template-columns:1fr; align-items:center; }
.page-hero--split .breadcrumb, .page-hero--split .eyebrow{ justify-content:flex-start; }
.page-hero--split p{ margin-inline:0; }
.page-hero__photo{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:4/3; }
.page-hero__photo img{ width:100%; height:100%; object-fit:cover; }
@media (min-width:880px){ .page-hero--split .ph-inner{ grid-template-columns:1.05fr .95fr; } }
.page-hero .container{ position:relative; }
.page-hero p{ font-size:var(--lead); max-width:660px; margin-inline:auto; margin-bottom:0; }
.breadcrumb{ font-size:.9rem; color:var(--muted); margin-bottom:16px; }
.breadcrumb a{ color:var(--royal); }
.page-hero .eyebrow{ justify-content:center; }

/* ---------- contact ---------- */
.contact-grid{ display:grid; gap:clamp(28px,5vw,48px); grid-template-columns:1fr; }
@media (min-width:900px){ .contact-grid{ grid-template-columns:1fr 1.12fr; } }
.contact-card{ background:linear-gradient(155deg,var(--navy),var(--navy-2)); color:#fff; border-radius:var(--radius-lg); padding:clamp(28px,4vw,40px); box-shadow:var(--shadow); }
.contact-card h2{ color:#fff; }
.contact-card p{ color:#D6E4F7; }
.contact-line{ display:flex; align-items:flex-start; gap:14px; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.contact-line:last-child{ border-bottom:0; }
.contact-line .ic{ width:44px; height:44px; border-radius:12px; background:rgba(255,255,255,.1); color:var(--hill-light); display:grid; place-items:center; flex:none; }
.contact-line svg{ width:22px; height:22px; }
.contact-line .label{ font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; color:var(--hill-light); margin-bottom:2px; }
.contact-line .value{ font-family:var(--font-head); font-weight:var(--fw-semi); font-size:1.18rem; color:#fff; }
.contact-line .value a{ color:#fff; }

.form{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(24px,4vw,38px); box-shadow:var(--shadow-sm); }
.field{ margin-bottom:20px; }
.field label{ display:block; font-family:var(--font-head); font-weight:var(--fw-semi); color:var(--navy); margin-bottom:8px; font-size:1rem; }
.field .req{ color:var(--warning); }
.field input,.field textarea,.field select{ width:100%; font-family:var(--font-body); font-size:1.05rem; color:var(--ink); padding:14px 16px; border:2px solid var(--line); border-radius:var(--radius); background:#fff; transition:border-color .2s var(--ease), box-shadow .2s var(--ease); }
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--royal); box-shadow:var(--ring-royal); }
.field textarea{ min-height:130px; resize:vertical; }
.field .hint{ font-size:.88rem; color:var(--muted); margin-top:6px; }
.form__note{ font-size:.9rem; color:var(--muted); margin-top:6px; margin-bottom:0; }
.form-success{ display:none; align-items:flex-start; gap:12px; background:#E6F5EE; border:1px solid #A9D9C2; color:#1E5E43; border-radius:var(--radius); padding:18px 20px; margin-bottom:22px; }
.form-success.is-visible{ display:flex; }
.form-success svg{ width:24px; height:24px; flex:none; color:var(--success); }

/* ---------- FAQ ---------- */
.faq{ max-width:820px; margin-inline:auto; display:grid; gap:14px; }
.faq details{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:4px 6px; box-shadow:var(--shadow-xs); }
.faq summary{ cursor:pointer; list-style:none; padding:18px 20px; font-family:var(--font-head); font-weight:var(--fw-semi); color:var(--navy); font-size:1.08rem; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-size:1.5rem; color:var(--royal); font-weight:400; transition:transform .25s var(--ease); }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ padding:0 20px 20px; margin:0; }

/* ---------- footer ---------- */
.site-footer{ background:var(--navy-2); color:#C6D5EC; padding-block:clamp(48px,6vw,76px) 28px; }
.footer-grid{ display:grid; gap:34px; grid-template-columns:1fr; }
@media (min-width:720px){ .footer-grid{ grid-template-columns:1.5fr 1fr 1fr; } }
.site-footer h4{ color:#fff; font-size:1rem; letter-spacing:.04em; text-transform:uppercase; margin-bottom:16px; }
.site-footer a{ color:#C6D5EC; }
.site-footer a:hover{ color:#fff; }
.footer-links{ list-style:none; padding:0; margin:0; display:grid; gap:11px; }
.footer-brand .brand__name{ color:#fff; }
.footer-brand .brand__tag{ color:var(--hill-light); }
.footer-brand p{ color:#A9BBD9; margin-top:14px; max-width:36ch; }
.footer-contact{ list-style:none; padding:0; margin:0; display:grid; gap:12px; }
.footer-contact li{ display:flex; align-items:center; gap:10px; }
.footer-contact svg{ width:20px; height:20px; color:var(--hill-light); flex:none; }
.se-habla-badge{ display:inline-flex; align-items:center; gap:8px; background:rgba(127,170,217,.16); border:1px solid rgba(127,170,217,.35); border-radius:var(--radius-pill); padding:8px 16px; color:#EAF2FB; font-weight:var(--fw-med); margin-top:18px; font-size:.95rem; }
.footer-legal{ margin-top:38px; padding-top:24px; border-top:1px solid rgba(255,255,255,.1); font-size:.88rem; color:#90A4C6; }
.footer-legal .disclaimer{ display:block; margin-bottom:8px; color:#A9BBD9; }

/* ---------- sticky mobile call bar ---------- */
.call-bar{ position:fixed; left:0; right:0; bottom:0; z-index:90; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-top:1px solid var(--line); box-shadow:0 -6px 20px rgba(23,40,75,.1); display:block; }
.call-bar .btn{ width:100%; font-size:1.05rem; white-space:nowrap; }
.call-bar .pulse{ position:relative; }
.call-bar .pulse::after{ content:""; position:absolute; inset:0; border-radius:var(--radius-pill); box-shadow:0 0 0 0 rgba(44,90,166,.5); animation:callpulse 2.4s var(--ease) infinite; }
body.has-callbar{ padding-bottom:82px; }
@media (min-width:1180px){ .call-bar{ display:none; } body.has-callbar{ padding-bottom:0; } }
@keyframes callpulse{ 0%{ box-shadow:0 0 0 0 rgba(44,90,166,.45);} 70%{ box-shadow:0 0 0 16px rgba(44,90,166,0);} 100%{ box-shadow:0 0 0 0 rgba(44,90,166,0);} }

/* ---------- scroll reveal + progress ---------- */
.reveal{ opacity:1; transform:none; }
html.js .reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); will-change:opacity,transform; }
html.js .reveal.is-visible{ opacity:1; transform:none; }
[data-stagger] > *{ transition-delay:var(--d,0ms); }
.scroll-progress{ position:fixed; top:0; left:0; height:4px; width:0%; z-index:120; background:linear-gradient(90deg,var(--royal),var(--sun)); transition:width .1s linear; }

/* skip link */
.skip-link{ position:absolute; left:-999px; top:8px; background:#fff; color:var(--navy); padding:10px 16px; border-radius:8px; z-index:999; box-shadow:var(--shadow); font-family:var(--font-head); font-weight:var(--fw-semi); }
.skip-link:focus{ left:12px; }

/* focus visibility */
:focus-visible{ outline:3px solid var(--focus); outline-offset:2px; }

/* ---------- hero scene animation ---------- */
.sun-core{ transform-box:fill-box; transform-origin:center; animation:sun-rise 1.6s var(--ease) both; }
.sun-rays{ transform-box:fill-box; transform-origin:center; animation:rays-pulse 5.5s ease-in-out infinite; }
.wave-back{ animation:drift 16s ease-in-out infinite alternate; }
.wave-front{ animation:drift 11s ease-in-out infinite alternate-reverse; }
.road-dash{ stroke-dasharray:14 12; animation:road-move 2.4s linear infinite; }
.bird{ animation:fly 9s linear infinite; opacity:.75; }
@keyframes sun-rise{ from{ opacity:0; transform:translateY(26px);} to{ opacity:1; transform:translateY(0);} }
@keyframes rays-pulse{ 0%,100%{ opacity:.55; transform:scale(1);} 50%{ opacity:1; transform:scale(1.06);} }
@keyframes drift{ from{ transform:translateX(-14px);} to{ transform:translateX(14px);} }
@keyframes road-move{ to{ stroke-dashoffset:-52; } }
@keyframes fly{ from{ transform:translate(-40px,4px);} to{ transform:translate(560px,-30px);} }

/* ============================================================
   SCROLL JOURNEY BACKGROUND (fixed, parallax, advances on scroll)
   Kept light + low-contrast so text over it stays readable.
   Driven by --sy (0..1 scroll progress) set from JS.
   ============================================================ */
.sky-journey{ position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none;
  background:linear-gradient(180deg, #E4EFFB 0%, #EFF5FC 42%, #FBFDFF 100%); }
.sky-journey .sun{
  position:absolute; left:62%; top:34%; width:340px; height:340px; margin:-170px 0 0 -170px; border-radius:50%;
  background:radial-gradient(circle, rgba(94,147,224,.55) 0%, rgba(94,147,224,.28) 34%, rgba(94,147,224,0) 70%);
  transform:translateY(calc(var(--sy,0) * -150px)); transition:transform .1s linear;
}
.sky-journey .cloud{ position:absolute; background:radial-gradient(closest-side, rgba(255,255,255,.9), rgba(255,255,255,0)); filter:blur(2px); opacity:.75; }
.sky-journey .c1{ width:340px; height:110px; top:16%; left:-10%; animation:cloud-move 60s linear infinite; }
.sky-journey .c2{ width:260px; height:90px;  top:30%; left:-20%; opacity:.6; animation:cloud-move 90s linear infinite; animation-delay:-30s; }
.sky-journey .c3{ width:400px; height:130px; top:9%;  left:-30%; opacity:.5; animation:cloud-move 120s linear infinite; animation-delay:-70s; }
.sky-journey .hill{ position:absolute; left:-5%; width:110%; height:42vh; bottom:0; }
.sky-journey .hill-back{ transform:translateY(calc(var(--sy,0) * 34px)); transition:transform .1s linear; }
.sky-journey .hill-front{ transform:translateY(calc(var(--sy,0) * 60px)); transition:transform .1s linear; }
.sky-journey .bird{ position:absolute; top:22%; left:20%; width:26px; color:#9DBFE6; animation:bird-fly 24s linear infinite; }
@keyframes cloud-move{ from{ transform:translateX(0);} to{ transform:translateX(130vw);} }
@keyframes bird-fly{ 0%{ transform:translate(0,0);} 50%{ transform:translate(50vw,-30px);} 100%{ transform:translate(105vw,10px);} }
body{ background:transparent; }

/* ---------- HERO PHOTO ---------- */
.hero__photo{ position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:5/4; background:var(--sky); }
.hero__photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero__photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(23,40,75,0) 55%, rgba(23,40,75,.22)); }

/* ---------- PHOTO CARDS (who we help) ---------- */
.photo-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-xs);
  transition:transform .28s var(--ease), box-shadow .28s var(--ease); }
.photo-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.photo-card__img{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.photo-card__img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.photo-card:hover .photo-card__img img{ transform:scale(1.05); }
.photo-card__body{ padding:26px 26px 30px; position:relative; }
.photo-card__icon{ position:absolute; top:-28px; left:26px; width:56px; height:56px; border-radius:14px; background:var(--royal); display:grid; place-items:center; box-shadow:var(--shadow-sm); }
.photo-card__icon svg{ width:28px; height:28px; color:#fff; }
.photo-card h3{ margin:14px 0 .4em; }
.photo-card p{ margin-bottom:0; }

/* ---------- language switch (header + mobile menu, light bg) ---------- */
.lang-switch{ display:inline-flex; background:var(--sky); border:1px solid var(--line); border-radius:var(--radius-pill); padding:2px; flex:none; }
.lang-btn{ appearance:none; border:0; background:transparent; color:var(--ink-soft); font-family:var(--font-head); font-weight:600; font-size:.82rem; padding:5px 13px; border-radius:var(--radius-pill); cursor:pointer; letter-spacing:.04em; min-height:30px; transition:background .2s var(--ease), color .2s var(--ease); }
.lang-btn.is-active{ background:var(--royal); color:#fff; }
.lang-btn:not(.is-active):hover{ color:var(--navy); }
.lang-btn:focus-visible{ outline:2px solid var(--royal); outline-offset:1px; }
/* desktop: show in header nav; hidden on mobile (lives in the menu there) */
.nav .lang-switch{ display:none; }
@media (min-width:1180px){ .nav .lang-switch{ display:inline-flex; order:1; } }
/* mobile menu placement */
.mobile-menu__lang{ font-size:.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:.09em; margin:20px 0 8px; font-family:var(--font-head); font-weight:600; }
.mobile-menu .lang-switch{ align-self:flex-start; }
@media (max-width:560px){ .topbar .hide-sm{ display:none; } }

/* ---------- unified photo treatment (integrate with brand) ---------- */
.hero__photo img, .photo-card__img img, .page-hero__photo img{ filter:saturate(1.04) contrast(1.02); }
.page-hero__photo{ position:relative; }
.page-hero__photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(23,40,75,0) 60%, rgba(23,40,75,.16)); pointer-events:none; }
.photo-card__img::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(23,40,75,0) 62%, rgba(23,40,75,.12)); pointer-events:none; }

/* ---------- WhatsApp ---------- */
.btn-whatsapp{ background:#25D366; color:#fff; box-shadow:var(--shadow-sm); }
.btn-whatsapp:hover{ background:#1EBE5B; color:#fff; transform:translateY(-2px); box-shadow:var(--shadow); }
.wa-fab{ position:fixed; right:20px; bottom:22px; z-index:95; width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 8px 22px rgba(37,211,102,.45); transition:transform .25s var(--ease), box-shadow .25s var(--ease); }
.wa-fab:hover{ transform:scale(1.07); box-shadow:0 10px 26px rgba(37,211,102,.55); color:#fff; }
.wa-fab:focus-visible{ outline:3px solid #0d6b57; outline-offset:2px; }
.wa-fab svg{ width:32px; height:32px; }
@media (max-width:1179.98px){ .wa-fab{ bottom:94px; right:16px; width:54px; height:54px; } .wa-fab svg{ width:30px; height:30px; } }

/* form error note */
.form-error{ display:none; align-items:flex-start; gap:12px; background:#FBEAEA; border:1px solid #E6B9B9; color:#9B2C2C; border-radius:var(--radius); padding:16px 18px; margin-bottom:22px; }
.form-error.is-visible{ display:flex; }
.form-error svg{ width:22px; height:22px; flex:none; }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  html.js .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  .call-bar .pulse::after{ animation:none; }
  .sun-core,.sun-rays,.wave-back,.wave-front,.road-dash,.bird{ animation:none; }
  .sky-journey .sun,.sky-journey .hill-back,.sky-journey .hill-front{ transform:none !important; }
  .sky-journey .cloud,.sky-journey .bird{ animation:none !important; }
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; }
}

/* ---------- se-habla icon sizing ---------- */
.se-habla svg{ width:20px; height:20px; vertical-align:-4px; }
.se-habla-badge svg{ width:18px; height:18px; }

/* ---------- mobile overflow fix (contact + general) ---------- */
.contact-grid > *{ min-width:0; }
.contact-card, .form{ min-width:0; max-width:100%; }
.contact-line{ min-width:0; }
.contact-line > div{ min-width:0; }
.contact-line .value, .contact-line .value a, .form__note, .hint{ overflow-wrap:anywhere; }
.btn{ max-width:100%; }