/* ============================================================
   ANIDA LAB — v2 shared design system (hx.*)
   Scroll-driven editorial language: Anida palette + Riforma.
   Loaded globally; motion in hx-motion.js. Pages compose with
   these classes + data-hx-* hooks.
   ============================================================ */
:root {
  --char:#2B2B2B; --cream:#F2F1ED; --paper:#FFFFFF;
  --muted:#3B3B3B; --soft:#B0B0B0; --line:#A5A5A5; --mauve:#BEADC4;
}
/* v2 is white-grounded (beats tailwind's warm .bg-offwhite body). */
body.bg-offwhite { background:#fff; }
/* Stop the trackpad's horizontal swipe from triggering browser back/forward
   navigation when scrubbing a carousel. */
html, body { overscroll-behavior-x: none; }
.hx-swiper, .hx-tswiper { overscroll-behavior-x: contain; }

/* ---------- Type (tightened, Apple-like scale) ---------- */
.hx-eyebrow { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin:0 0 18px; }
.hx-h1 { font-size:clamp(36px,6.2vw,88px); line-height:1.02; font-weight:500; letter-spacing:-.035em; color:var(--char); margin:0; }
.hx-h2 { font-size:clamp(26px,3.6vw,52px); line-height:1.04; font-weight:500; letter-spacing:-.028em; color:var(--char); margin:0; }
.hx-h3 { font-size:clamp(20px,2.3vw,30px); line-height:1.14; font-weight:500; letter-spacing:-.018em; color:var(--char); margin:0; }
.hx-lead { font-size:clamp(18px,1.9vw,25px); line-height:1.28; font-weight:500; letter-spacing:-.015em; color:var(--char); margin:0; }
.hx-body { font-size:clamp(15px,1.15vw,17px); line-height:1.6; color:var(--muted); margin:0; }
.hx-body + .hx-body { margin-top:18px; }

/* ---------- Sections & layout ---------- */
.hx-sec { padding:14vh 6vw; background:var(--paper); }
.hx-sec--cream { background:var(--cream); }
.hx-sec--dark { background:var(--char); color:var(--cream); }
.hx-sec--dark .hx-h1, .hx-sec--dark .hx-h2, .hx-sec--dark .hx-h3, .hx-sec--dark .hx-lead { color:var(--cream); }
.hx-sec--dark .hx-body { color:#d6d3cc; }
.hx-sec--dark .hx-eyebrow { color:var(--line); }
.hx-sec--tight { padding:9vh 6vw; }
.hx-wrap { max-width:1180px; margin:0 auto; }
.hx-wrap--narrow { max-width:900px; margin:0 auto; }
.hx-center { text-align:center; }

/* ---------- Buttons / links ---------- */
.hx-cta { display:inline-flex; align-items:center; gap:9px; height:48px; padding:0 26px; font-size:15px; text-decoration:none; border-radius:999px; transition:transform .2s ease, background .2s ease, color .2s ease; }
.hx-cta--primary { background:var(--mauve); color:var(--char); }
.hx-cta--primary:hover { background:#b19fba; transform:translateY(-2px); }
.hx-cta--dark { background:var(--char); color:var(--cream); }
.hx-cta--dark:hover { transform:translateY(-2px); }
.hx-cta--secondary { background:transparent; color:var(--char); border:1px solid rgba(43,43,43,.4); }
.hx-cta--secondary:hover { background:var(--char); color:var(--cream); border-color:var(--char); }
.hx-sec--dark .hx-cta--secondary { color:var(--cream); border-color:rgba(242,241,237,.5); }
.hx-sec--dark .hx-cta--secondary:hover { background:var(--cream); color:var(--char); }
.hx-link { display:inline-flex; align-items:center; gap:9px; font-size:16px; color:var(--char); text-decoration:none; border-bottom:1px solid rgba(43,43,43,.4); padding-bottom:3px; transition:gap .25s ease; }
.hx-link:hover { gap:16px; }
.hx-sec--dark .hx-link { color:var(--cream); border-color:rgba(242,241,237,.5); }
.hx-ctas, .hx-hero__ctas { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:30px; }
/* Hero CTAs get a touch more separation (primary + secondary sit clearly apart). */
.hx-hero__ctas { gap:18px; }
.hx-center .hx-ctas { justify-content:center; }

/* ---------- Masked rise (load reveal, pure transform) ---------- */
.hx-mask { display:block; overflow:hidden; }
.hx-mask > * { display:block; transform:translateY(110%); animation:hxrise 1.15s cubic-bezier(.16,1,.3,1) forwards; }
/* Keep the CTA row a flex container (the mask above would force it to block, killing
   the gap between the two hero CTAs). */
.hx-mask > .hx-hero__ctas { display:flex; flex-wrap:wrap; align-items:center; }
.hx-maskgroup .hx-mask:nth-child(2) > *, .hx-hero__inner .hx-mask:nth-child(2) > * { animation-delay:.08s; }
.hx-maskgroup .hx-mask:nth-child(3) > *, .hx-hero__inner .hx-mask:nth-child(3) > * { animation-delay:.16s; }
@keyframes hxrise { to { transform:translateY(0); } }

/* ---------- HERO ---------- */
.hx-hero { position:relative; height:100vh; min-height:660px; overflow:hidden; background:var(--paper); display:flex; flex-direction:column; }
.hx-hero--dark { color:var(--cream); }
.hx-hero__imgwrap { position:absolute; inset:0; z-index:0; overflow:hidden; will-change:transform; }
.hx-hero__img { position:absolute; inset:-8% 0; width:100%; height:116%; object-fit:cover; opacity:.9; }
.hx-hero--dark .hx-hero__img { opacity:1; }
.hx-hero__scrim { position:absolute; inset:0; z-index:1; }
.hx-hero--dark .hx-hero__scrim { background:linear-gradient(to top, rgba(15,15,13,.6) 0%, rgba(15,15,13,.1) 40%, rgba(15,15,13,.35) 100%); }
/* Home hero image is light — stronger scrim + a touch of text-shadow for legibility. */
.hx-hero--home .hx-hero__scrim { background:linear-gradient(to top, rgba(10,10,9,.86) 0%, rgba(10,10,9,.48) 34%, rgba(10,10,9,.12) 60%, rgba(10,10,9,.34) 100%); }
.hx-hero--home .hx-hero__title, .hx-hero--home .hx-hero__sub { text-shadow:0 2px 26px rgba(0,0,0,.42); }
.hx-hero__inner { position:relative; z-index:10; margin-top:auto; padding:0 6vw 8vh; max-width:1180px; }
/* The title sits directly above a fixed-height "foot" holding the sub(s) + CTA, which
   is bottom-anchored — so BOTH the title bottom and the CTA land at the same spot on
   every page; only the empty gap between title and sub flexes with copy length. */
.hx-hero__foot { min-height:210px; display:flex; flex-direction:column; justify-content:flex-end; }
.hx-hero__foot .hx-mask:nth-child(1) > * { animation-delay:.08s; }
.hx-hero__foot .hx-mask:nth-child(2) > * { animation-delay:.16s; }
.hx-hero__foot .hx-mask:nth-child(3) > * { animation-delay:.22s; }
.hx-hero__title { font-size:clamp(36px,5.5vw,70px); line-height:1.08; font-weight:500; letter-spacing:-.035em; color:var(--char); margin:0; padding-bottom:.06em; }
.hx-hero--dark .hx-hero__title { color:var(--cream); }
.hx-hero__sub { font-size:clamp(15px,1.4vw,19px); line-height:1.45; color:var(--muted); max-width:540px; margin:18px 0 0; }
.hx-hero--dark .hx-hero__sub { color:#e5e2db; }
/* Secondary hero CTA rendered as a white underlined link (like "Explore the Lab"). */
.hx-hero__link { display:inline-flex; align-items:center; gap:8px; font-size:16px; color:var(--cream); text-decoration:none; border-bottom:1px solid rgba(242,241,237,.5); padding-bottom:3px; transition:border-color .25s ease; white-space:nowrap; }
.hx-hero__link:hover { border-color:var(--cream); }
.hx-hero__link span { display:inline-block; transition:transform .25s ease; }
.hx-hero__link:hover span { transform:translateX(4px); }
.hx-hero__cue { position:absolute; z-index:10; left:50%; bottom:22px; transform:translateX(-50%); font-size:12px; letter-spacing:.28em; text-transform:uppercase; color:var(--muted); }
.hx-hero--dark .hx-hero__cue { color:#d9d6cf; }
.hx-hero__cue::after { content:""; display:block; width:1px; height:38px; margin:10px auto 0; background:linear-gradient(currentColor,transparent); animation:hxcue 1.9s ease-in-out infinite; transform-origin:top; }
@keyframes hxcue { 0%,100%{transform:scaleY(.35);opacity:.4} 50%{transform:scaleY(1);opacity:1} }

/* ---------- MANIFESTO (scrubbed word light-up) ---------- */
.hx-manifesto { background:var(--paper); padding:24vh 6vw; display:flex; justify-content:center; }
.hx-manifesto__inner { max-width:1120px; width:100%; }
.hx-manifesto__key { display:block; width:42px; height:auto; margin-bottom:22px; filter:brightness(0); opacity:.85; }
.hx-manifesto__title { font-size:16px; letter-spacing:-.005em; text-transform:none; color:var(--soft); margin:0 0 30px; }
.hx-manifesto__p { font-size:clamp(24px,3.6vw,48px); line-height:1.16; font-weight:500; letter-spacing:-.02em; margin:0; color:var(--char); }
.hx-manifesto__p .w { display:inline-block; }
/* Shorter illuminating block (used below page heroes for the second paragraph). */
.hx-manifesto--tight { padding:12vh 6vw 11vh; }
.hx-manifesto--tight .hx-manifesto__inner { max-width:920px; }
.hx-manifesto--tight .hx-manifesto__p { font-size:clamp(16px,1.9vw,24px); line-height:1.45; max-width:none; }

/* ---------- MEDIA ROW (text · image, alternating) ---------- */
/* Full-bleed row: image is exactly 50%, flush to the outer edge; the text column
   fills the rest with reading padding + a gap, and is sticky (follows the scroll
   down to the end of its image). Use inside a .hx-sec--flush (no h-padding). */
.hx-media { display:grid; grid-template-columns:1fr 50%; align-items:start; gap:0; width:100%; }
.hx-media--rev { grid-template-columns:50% 1fr; }
.hx-media__body { max-width:600px; padding:0 5vw 0 7vw; position:sticky; top:15vh; align-self:start; }
.hx-media__body > * + * { margin-top:20px; }
.hx-media__body .hx-eyebrow + .hx-h3, .hx-media__body .hx-eyebrow + .hx-h2 { margin-top:14px; }
.hx-media__fig { overflow:hidden; aspect-ratio:4/5; }
.hx-media__fig img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.6,.2,1); }
.hx-media__fig:hover img { transform:scale(1.04); }
.hx-media--square .hx-media__fig { aspect-ratio:1/1; }
@media (min-width:901px) {
  .hx-media--rev .hx-media__body { order:2; padding:0 7vw 0 5vw; }
  .hx-media--rev .hx-media__fig { order:1; }
}
.hx-sec--flush { padding-left:0; padding-right:0; }

/* ---------- CAROUSEL (offerings) ---------- */
.hx-cards__head { margin:0 0 34px; padding:0 6vw; }
.hx-cards__head--split { display:flex; align-items:baseline; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.hx-cards__link { flex:none; font-size:clamp(15px,1.5vw,18px); color:var(--muted); white-space:nowrap; border-bottom:1px solid var(--line); padding-bottom:2px; transition:color .25s ease, border-color .25s ease; }
.hx-cards__link:hover { color:var(--char); border-color:var(--char); }
.hx-cards__link span { transition:transform .25s ease; display:inline-block; }
.hx-cards__link:hover span { transform:translateX(4px); }
/* Swiper ignores container padding for slide positioning, so edge spacing is set
   via slidesOffsetBefore/After in hx-motion.js (aligned to the heading). */
.hx-swiper { padding:0; }
/* Fixed slide widths + slidesPerView:'auto' (hx-motion.js) → always a peek. */
.hx-swiper .swiper-slide { width:min(84vw,600px); height:auto; }
.hx-swiper--sm .swiper-slide { width:min(82vw,520px); height:auto; }
.hx-slide { position:relative; display:block; height:min(78vh,640px); overflow:hidden; text-decoration:none; background:#e7e5df; }
.hx-slide__img { position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.6,.2,1); }
.hx-slide:hover .hx-slide__img { transform:scale(1.05); }
/* Frosted-glass veil on hover: milky diagonal sheen + edge highlight + blur/saturation
   (reads as glass, not a plain blur). Layered over the image, under the scrim + text. */
.hx-slide::before, .hx-person::before { content:""; position:absolute; inset:0; z-index:1; opacity:0; pointer-events:none;
  background:linear-gradient(122deg, rgba(255,255,255,.32) 0%, rgba(255,255,255,.06) 44%, rgba(255,255,255,.18) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(255,255,255,.14);
  backdrop-filter:blur(2px) saturate(1); -webkit-backdrop-filter:blur(2px) saturate(1);
  transition:opacity .55s cubic-bezier(.2,.6,.2,1), backdrop-filter .55s cubic-bezier(.2,.6,.2,1), -webkit-backdrop-filter .55s cubic-bezier(.2,.6,.2,1); }
.hx-slide:hover::before, .hx-slide:focus-visible::before, .hx-slide.is-open::before,
.hx-person:hover::before, .hx-person:focus-within::before, .hx-person.is-open::before {
  opacity:1; backdrop-filter:blur(9px) saturate(1.55) brightness(1.06); -webkit-backdrop-filter:blur(9px) saturate(1.55) brightness(1.06); }
.hx-slide::after { content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(to top, rgba(20,20,18,.7) 0%, rgba(20,20,18,.05) 48%, rgba(20,20,18,.15) 100%); }
.hx-slide__body { position:absolute; z-index:3; left:0; bottom:0; padding:40px; color:var(--cream); }
.hx-slide__title { font-size:clamp(28px,3.6vw,52px); line-height:1; font-weight:500; letter-spacing:-.028em; margin:0; }
.hx-slide__reveal { display:block; overflow:hidden; margin-top:14px; }
.hx-slide__link { display:inline-flex; align-items:center; gap:9px; font-size:17px; border-bottom:1px solid rgba(242,241,237,.55); padding-bottom:3px; transform:translateY(135%); transition:transform .42s cubic-bezier(.2,.6,.2,1); }
.hx-slide:hover .hx-slide__link, .hx-slide:focus-visible .hx-slide__link, .hx-slide.is-open .hx-slide__link { transform:translateY(0); }
.hx-swiper .swiper-pagination, .hx-tswiper .swiper-pagination { position:static; margin-top:26px; padding:0 6vw; }
.hx-swiper .swiper-pagination-bullet, .hx-tswiper .swiper-pagination-bullet { background:var(--line); opacity:.5; width:7px; height:7px; transition:opacity .2s ease, background .2s ease; }
.hx-swiper .swiper-pagination-bullet-active, .hx-tswiper .swiper-pagination-bullet-active { background:var(--char); opacity:1; }
.hx-sec--dark .hx-swiper .swiper-pagination-bullet-active { background:var(--cream); }

/* ---------- FULL-BLEED SCENE (photo scales to bleed + statement) ---------- */
.hx-space { position:relative; background:var(--paper); }
.hx-space__stage { position:sticky; top:0; height:100vh; overflow:hidden; }
.hx-space__fig { position:absolute; inset:0; will-change:transform; transform-origin:center; }
.hx-space__fig img { width:100%; height:100%; object-fit:cover; }
.hx-space__scrim { position:absolute; inset:0; background:linear-gradient(to top, rgba(18,18,16,.78) 0%, rgba(18,18,16,.12) 46%, rgba(18,18,16,.28) 100%); }
.hx-space__overlay { position:absolute; z-index:2; left:0; right:0; bottom:0; padding:0 6vw 11vh; color:var(--cream); }
.hx-space__overlay .hx-mask { overflow:hidden; }
.hx-space__h { font-size:clamp(36px,6vw,90px); line-height:.98; font-weight:500; letter-spacing:-.035em; margin:0; max-width:14ch; }
.hx-space__lead { font-size:clamp(16px,1.7vw,22px); line-height:1.4; margin:20px 0 0; max-width:640px; color:#e8e6df; }
.hx-space__spacer { height:85vh; }

/* Quick-links list (e.g. under a section) */
.hx-offer-links { list-style:none; margin:0; padding:0; border-top:1px solid rgba(43,43,43,.14); }
.hx-offer-links li { border-bottom:1px solid rgba(43,43,43,.14); }
.hx-offer-links a { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 2px; font-size:clamp(19px,1.9vw,26px); font-weight:500; letter-spacing:-.02em; color:var(--char); text-decoration:none; transition:padding-left .3s cubic-bezier(.2,.6,.2,1); }
.hx-offer-links a .ar { color:var(--soft); transition:transform .3s cubic-bezier(.2,.6,.2,1), color .2s ease; }
.hx-offer-links a:hover { padding-left:12px; }
.hx-offer-links a:hover .ar { transform:translateX(7px); color:var(--char); }

/* ---------- TEAM CAROUSEL (portrait + caption on image) ---------- */
.hx-team__head { margin:0 0 34px; padding:0 6vw; display:flex; align-items:baseline; justify-content:space-between; gap:20px; }
.hx-team__hint { font-family:"Riforma Mono LL",monospace; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--line); }
.hx-tswiper { padding:0; }
.hx-tswiper .swiper-slide { width:min(82vw,520px); height:auto; }
.hx-person { position:relative; display:block; width:100%; height:min(66vh,600px); overflow:hidden; background:#e7e5df; cursor:pointer; }
.hx-person__img { position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.6,.2,1); pointer-events:none; }
.hx-person:hover .hx-person__img { transform:scale(1.05); }
.hx-person::after { content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(to top, rgba(0,0,0,.8) 0%, rgba(0,0,0,.26) 42%, rgba(0,0,0,0) 72%); pointer-events:none; transition:background .5s ease; }
.hx-person:hover::after, .hx-person:focus-within::after, .hx-person.is-open::after { background:linear-gradient(to top, rgba(0,0,0,.86) 0%, rgba(0,0,0,.45) 56%, rgba(0,0,0,.06) 92%); }
.hx-person__cap { position:absolute; z-index:3; left:0; right:0; bottom:0; padding:22px; color:var(--cream); text-align:left; }
/* Match the class-type card titles ("The Classes") exactly — same weight + size. */
.hx-person__cap .n { display:block; font-size:clamp(26px,3.2vw,44px); font-weight:500; line-height:1; letter-spacing:-.028em; }
.hx-person__cap .r { display:block; font-size:15px; color:#dcd9d2; margin-top:6px; }
/* Bio + CTA reveal — hover on desktop, tap/.is-open on touch (no modal, like the class cards). */
.hx-person__reveal { display:block; overflow:hidden; max-height:0; opacity:0; margin-top:0;
  transition:max-height .5s cubic-bezier(.2,.6,.2,1), opacity .38s ease, margin-top .5s ease; }
.hx-person:hover .hx-person__reveal, .hx-person:focus-within .hx-person__reveal, .hx-person.is-open .hx-person__reveal { max-height:300px; opacity:1; margin-top:12px; }
.hx-person__bio { display:block; font-size:13px; line-height:1.5; color:#fff; }
.hx-person__cta { display:inline-flex; align-items:center; gap:7px; margin-top:14px; font-size:14px; color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.6); padding-bottom:2px; transition:gap .25s ease; }
.hx-person__cta:hover { gap:12px; }

/* ---------- Section wrappers used by carousels / team / two-col text ---------- */
.hx-cards { background:var(--paper); padding:8vh 0 12vh; }
/* Guard: a carousel's off-screen slides must never scroll the page sideways. */
.hx-cards, .hx-team { overflow:hidden; }
.hx-cards__h { font-size:clamp(26px,3.4vw,48px); font-weight:500; letter-spacing:-.028em; color:var(--char); margin:0; }
.hx-team { background:var(--paper); padding:12vh 0 16vh; }
/* Match the other section headings (.hx-h3). */
.hx-team__h { font-size:clamp(20px,2.3vw,30px); line-height:1.14; font-weight:500; letter-spacing:-.018em; color:var(--char); margin:0; }
.hx-space__more { background:var(--paper); padding:15vh 6vw; }
.hx-space__more-in { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:.5fr .5fr; gap:8vw; align-items:start; }
.hx-space__more-right { display:flex; flex-direction:column; gap:36px; }
.hx-space__more .lead { font-size:clamp(20px,2.4vw,32px); line-height:1.18; font-weight:500; letter-spacing:-.02em; color:var(--char); margin:0; }
.hx-space__more .sub { font-size:clamp(15px,1.15vw,17px); line-height:1.6; color:var(--muted); margin:0; }

@media (max-width:900px) {
  .hx-space__more-in { grid-template-columns:1fr; gap:26px; }
  .hx-sec { padding:11vh 7vw; }
  .hx-media, .hx-media--rev { grid-template-columns:1fr; gap:26px; }
  .hx-media__body { position:static; top:auto; padding:0 7vw; max-width:none; }
  .hx-media__fig { max-width:none; aspect-ratio:4/3; }
  .hx-hero__inner { padding-bottom:15vh; }
  .hx-manifesto { padding:16vh 7vw; }
  .hx-cta { height:50px; }
}
@media (prefers-reduced-motion:reduce) {
  .hx-mask > * { transform:none; animation:none; }
  .hx-hero__cue::after { animation:none; }
}

/* ============================================================
   RESPONSIVE / TABLET POLISH  (appended — v2 mobile + tablet pass)
   Desktop (≥1281px) is unchanged. Breakpoints introduced here:
   1280 / 1024 / 900(existing) / 834 / 768 / 600 / 430, plus a short-
   viewport (max-height:560) rule for landscape phones.
   Card frames stay a fixed height at every width so rows never desquare;
   long revealed content scrolls inside the frame instead of growing it.
   ============================================================ */

/* Revealed card content never grows the (fixed-height) frame — it scrolls. */
.hx-person__reveal, .hx-slide__reveal { -webkit-overflow-scrolling:touch; }

/* ---- Tablet landscape & below (≤1280) ---- */
@media (max-width:1280px){
  .hx-sec { padding:12vh 5vw; }
  .hx-manifesto { padding:20vh 5vw; }
  .hx-space__more { padding:13vh 5vw; }
  .hx-space__more-in { gap:6vw; }
}

/* ---- Tablet landscape (≤1024, e.g. iPad landscape) ---- */
@media (max-width:1024px){
  .hx-h1 { font-size:clamp(34px,7vw,72px); }
  .hx-sec { padding:11vh 5vw; }
  .hx-space__more-in { grid-template-columns:1fr 1fr; gap:5vw; }
  /* Carousels: slightly narrower slides so a second card always peeks. */
  .hx-swiper .swiper-slide { width:min(70vw,540px); }
  .hx-swiper--sm .swiper-slide { width:min(62vw,460px); }
  .hx-tswiper .swiper-slide { width:min(58vw,430px); }
}

/* ---- Tablet portrait (≤834, iPad Air/Pro portrait) ---- */
@media (max-width:834px){
  .hx-swiper .swiper-slide { width:min(80vw,540px); }
  .hx-swiper--sm .swiper-slide { width:min(76vw,460px); }
  .hx-tswiper .swiper-slide { width:min(72vw,440px); }
  .hx-slide { height:min(66vh,520px); }
  .hx-person { height:min(66vh,540px); }
  .hx-slide__body { padding:32px; }
}

/* ---- 768 portrait tuning (small tablets) ---- */
@media (max-width:768px){
  .hx-space__more-in { grid-template-columns:1fr; gap:24px; }
  .hx-cards { padding:7vh 0 10vh; }
  .hx-team { padding:9vh 0 12vh; }
}

/* ---- Phones (≤600) ---- */
@media (max-width:600px){
  .hx-sec { padding:9vh 6vw; }
  .hx-sec--tight { padding:7vh 6vw; }
  .hx-manifesto { padding:12vh 7vw; }
  .hx-manifesto__p { font-size:clamp(23px,6.6vw,32px); }
  .hx-manifesto__key { width:36px; margin-bottom:18px; }
  /* Heroes: readable title/sub, comfortable bottom padding, shorter min-height. */
  .hx-hero { min-height:80svh; }
  .hx-hero__title { font-size:clamp(40px,11.5vw,60px); line-height:1.0; }
  .hx-hero__sub { font-size:15px; line-height:1.45; margin-top:16px; max-width:none; }
  .hx-hero__inner { padding:0 6vw 14vh; }
  .hx-hero__foot { min-height:150px; }
  .hx-hero__ctas { margin-top:26px; gap:20px; }
  .hx-hero__ctas .hx-cta { width:100%; justify-content:center; margin:0; }
  /* Full-bleed scene overlay. */
  .hx-space__overlay { padding:0 6vw 12vh; }
  .hx-space__h { font-size:clamp(32px,9vw,52px); max-width:none; }
  .hx-space__lead { font-size:16px; }
  /* Carousel cards. */
  .hx-swiper .swiper-slide { width:86vw; }
  .hx-swiper--sm .swiper-slide { width:84vw; }
  .hx-tswiper .swiper-slide { width:82vw; }
  .hx-slide { height:min(72vh,480px); }
  .hx-person { height:min(72vh,500px); }
  .hx-slide__body { padding:26px; }
  .hx-slide__title { font-size:clamp(26px,7.4vw,38px); }
  .hx-person__cap { padding:20px; }
  .hx-offer-links a { font-size:clamp(19px,5.6vw,24px); padding:16px 2px; }
  /* CTAs read better stacked full-width on phones. */
  .hx-ctas .hx-cta { width:100%; justify-content:center; }
}

/* ---- Landscape phones / very short viewports ---- */
@media (max-height:560px) and (max-width:900px){
  .hx-hero { min-height:420px; }
  .hx-hero__inner { padding-bottom:8vh; }
  .hx-hero__cue { display:none; }
}

/* ---- Small phones (≤430) ---- */
@media (max-width:430px){
  .hx-hero__title { font-size:clamp(38px,12vw,50px); }
  .hx-slide__body { padding:22px; }
}