/* =============================================================
   David School — Global Theme CSS
   Source of truth: website/styles.css
   Tokens, reset, typography, utilities, animations, buttons,
   all shared component classes. Page-specific overrides live in
   page-school.css / page-study.css / page-courses.css.
   ============================================================= */

/* ---- Design tokens ---- */
:root {
  /* Palette blu — ds- canonical names */
  --ds-blue-950: #071830; --ds-blue-900: #0d2240; --ds-blue-800: #0f2d57;
  --ds-blue-700: #143d70; --ds-blue-600: #1a4f8a; --ds-blue-500: #1e5fa3;
  --ds-blue-400: #2d78c8; --ds-blue-300: #5a9fd4; --ds-blue-200: #a8cce8;
  --ds-blue-100: #deeaf6; --ds-blue-050: #f0f6fc;
  /* Oro */
  --ds-gold:       #c8a84b;
  --ds-gold-light: #dfc06a;
  --ds-gold-pale:  #f5ecd0;
  /* Neutri */
  --ds-cream:  #faf8f4;
  --ds-ink:    #0d1521;
  --ds-ink-70: rgba(13,21,33,.7);
  --ds-ink-50: rgba(13,21,33,.5);
  --ds-ink-25: rgba(13,21,33,.25);
  --ds-white:  #ffffff;
  /* Border radius */
  --ds-r-sm: 4px; --ds-r: 8px; --ds-r-lg: 16px; --ds-r-xl: 24px; --ds-r-2xl: 32px;
  /* Ombre */
  --ds-shadow-sm: 0 1px 3px rgba(13,21,33,.07), 0 1px 2px rgba(13,21,33,.05);
  --ds-shadow:    0 4px 20px rgba(13,21,33,.10), 0 1px 4px rgba(13,21,33,.05);
  --ds-shadow-lg: 0 16px 48px rgba(13,21,33,.14), 0 2px 8px rgba(13,21,33,.06);
  --ds-shadow-xl: 0 32px 80px rgba(13,21,33,.18), 0 4px 16px rgba(13,21,33,.07);
  /* Tipografia */
  --ds-font-serif: 'Playfair Display', Georgia, serif;
  --ds-font-sans:  'DM Sans', system-ui, sans-serif;
  /* Easing */
  --ds-ease: cubic-bezier(.16, 1, .3, 1);

  /* ── Aliases: short names used by page CSS and templates ── */
  --b95: var(--ds-blue-950); --b90: var(--ds-blue-900); --b80: var(--ds-blue-800);
  --b70: var(--ds-blue-700); --b60: var(--ds-blue-600); --b50: var(--ds-blue-500);
  --b40: var(--ds-blue-400); --b30: var(--ds-blue-300); --b20: var(--ds-blue-200);
  --b10: var(--ds-blue-100); --b05: var(--ds-blue-050);
  --gold: var(--ds-gold); --gold-l: var(--ds-gold-light); --gold-p: var(--ds-gold-pale);
  --cream: var(--ds-cream);
  --ink: var(--ds-ink); --ink7: var(--ds-ink-70); --ink5: var(--ds-ink-50); --ink2: var(--ds-ink-25);
  --w: var(--ds-white);
  --r4: var(--ds-r-sm); --r8: var(--ds-r); --r12: 12px; --r16: var(--ds-r-lg);
  --r20: 20px; --r24: var(--ds-r-xl); --r32: var(--ds-r-2xl);
  --sh0: var(--ds-shadow-sm); --sh1: var(--ds-shadow);
  --sh2: var(--ds-shadow-lg); --sh3: var(--ds-shadow-xl);
  --serif: var(--ds-font-serif); --sans: var(--ds-font-sans); --ease: var(--ds-ease);
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { font-family: var(--ds-font-sans); color: var(--ds-ink); background: var(--ds-white); overflow-x: hidden; line-height: 1.72; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font: inherit; color: inherit; }

/* ---- Typography ---- */
h1, h2, h3, h4 { font-family: var(--ds-font-serif); line-height: 1.12; color: var(--ds-blue-900); }
h1 { font-size: clamp(2.8rem, 6vw, 4.4rem); font-weight: 400; }
h1 em { font-style: italic; color: var(--ds-gold-light); font-weight: 400; }
h2 { font-size: clamp(2rem, 3.8vw, 3rem); font-weight: 500; }
h2 em { font-style: italic; color: var(--ds-blue-500); font-weight: 500; }
h3 { font-size: clamp(1.2rem, 2vw, 1.55rem); font-weight: 600; }
h4 { font-size: 1.1rem; font-weight: 600; }
p  { font-size: 1rem; line-height: 1.72; color: var(--ds-ink-70); }

.ds-kicker,
.kicker {
  display: inline-block;
  font-family: var(--ds-font-sans); font-size: .68rem; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--ds-gold); margin-bottom: .6rem; line-height: 1;
}
.kicker--white { color: rgba(255,255,255,.65); }
.kicker--blue  { color: var(--ds-blue-400); }

/* ---- Layout ---- */
.ds-wrap, .wrap   { max-width: 1180px; margin: 0 auto; padding: 0 1.75rem; }
.ds-sec,  .sec    { padding: 6.5rem 0; }
.ds-sec-sm, .sec-sm { padding: 3.5rem 0; }

/* ---- Accessibility ---- */
.ds-skip-link, .skip {
  position: absolute; top: -100%; left: 1rem;
  background: var(--ds-blue-800); color: var(--ds-white);
  padding: .5rem 1rem; border-radius: var(--ds-r); font-size: .875rem;
  z-index: 9999; transition: top .2s;
}
.ds-skip-link:focus, .skip:focus { top: 1rem; }
:focus-visible { outline: 2px solid var(--ds-gold); outline-offset: 3px; border-radius: 2px; }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---- Keyframes ---- */
@keyframes ds-fade-up  { from { opacity: 0; transform: translateY(36px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ds-fade-in  { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp      { from { opacity: 0; transform: translateY(36px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn      { from { opacity: 0; } to { opacity: 1; } }
@keyframes floatY      { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-13px); } }
@keyframes scrollDrop  { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(36px); opacity: 0; } }

/* ---- Animations — hero load ---- */
.ds-aup, .aup { opacity: 0; animation: fadeUp .75s var(--ds-ease) forwards; }
.ds-ain, .ain  { opacity: 0; animation: fadeIn .65s ease forwards; }
.ds-d1, .d1 { animation-delay: .10s; } .ds-d2, .d2 { animation-delay: .22s; }
.ds-d3, .d3 { animation-delay: .34s; } .ds-d4, .d4 { animation-delay: .46s; }
.ds-d5, .d5 { animation-delay: .60s; }

/* ---- Animations — scroll reveal ---- */
.ds-reveal,       .rev  { opacity: 0; transform: translateY(30px);  transition: opacity .65s var(--ds-ease), transform .65s var(--ds-ease); }
.ds-reveal-left,  .revL { opacity: 0; transform: translateX(-34px); transition: opacity .65s var(--ds-ease), transform .65s var(--ds-ease); }
.ds-reveal-right, .revR { opacity: 0; transform: translateX(34px);  transition: opacity .65s var(--ds-ease), transform .65s var(--ds-ease); }
.ds-reveal.on, .rev.on,
.ds-reveal-left.on, .revL.on,
.ds-reveal-right.on, .revR.on { opacity: 1; transform: none; }

/* ---- Buttons ---- */
.ds-btn, .btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .85rem 2rem; border-radius: 50px;
  font-family: var(--ds-font-sans); font-size: .875rem; font-weight: 600;
  letter-spacing: .015em; line-height: 1; white-space: nowrap; cursor: pointer;
  transition: transform .25s var(--ds-ease), box-shadow .25s var(--ds-ease), background .2s, border-color .2s, color .2s;
}
.ds-btn-gold,  .btn-gold   { background: var(--ds-gold); color: var(--ds-blue-950); }
.ds-btn-gold:hover, .btn-gold:hover  { background: var(--ds-gold-light); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(200,168,75,.32); }
.ds-btn-glass, .btn-glass  { background: rgba(255,255,255,.07); color: var(--ds-white); border: 1.5px solid rgba(255,255,255,.38); backdrop-filter: blur(8px); }
.ds-btn-glass:hover, .btn-glass:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.7); transform: translateY(-2px); }
.ds-btn-line,  .btn-line   { background: transparent; color: var(--ds-blue-700); border: 1.5px solid var(--ds-blue-300); }
.ds-btn-line:hover, .btn-line:hover  { border-color: var(--ds-blue-600); background: var(--ds-blue-050); transform: translateY(-2px); }
.btn-white { background: var(--ds-white); color: var(--ds-blue-900); }
.btn-white:hover { background: var(--ds-gold); transform: translateY(-2px); box-shadow: 0 6px 22px rgba(200,168,75,.32); }

/* ---- Section header ---- */
.ds-s-head, .s-head { text-align: center; margin-bottom: 4rem; }
.ds-s-head h2, .s-head h2 { color: var(--ds-blue-900); margin-bottom: .75rem; }
.ds-s-head p,  .s-head p  { max-width: 540px; margin: 0 auto; }

/* ── HERO ─────────────────────────────────────────────────── */
.hero { min-height: 100svh; position: relative; overflow: hidden; display: flex; align-items: center; background: #06152a; }
.hero-photo { position: absolute; inset: 0; z-index: 0; }
.hero-grad  { position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(138deg, rgba(6,21,42,.92) 0%, rgba(13,42,82,.82) 22%, rgba(15,58,114,.72) 44%, rgba(20,85,160,.62) 62%, rgba(14,48,96,.78) 80%, rgba(7,24,48,.92) 100%); }
.hero-noise { position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: .55; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); }
.h-streak { position: absolute; top: -20%; left: -10%; width: 130%; height: 55%; z-index: 3; pointer-events: none;
  background: linear-gradient(148deg, rgba(255,255,255,.022) 0%, transparent 55%); transform: rotate(-8deg); }
.hero-in { position: relative; z-index: 5; display: grid; grid-template-columns: 1fr; align-items: center; gap: 4rem; max-width: 1180px; margin: 0 auto; padding: 9rem 1.75rem 5rem; min-height: 100svh; }
.h-badge { display: inline-flex; align-items: center; gap: .5rem; background: rgba(200,168,75,.13); border: 1px solid rgba(200,168,75,.32); border-radius: 50px; padding: .38rem 1rem; margin-bottom: 1.4rem; font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ds-gold-light); }
.hero h1  { color: var(--ds-white); margin-bottom: 1.2rem; max-width: 700px; }
.h-desc   { font-size: 1.1rem; line-height: 1.72; color: rgba(255,255,255,.78); max-width: 600px; margin-bottom: 2.25rem; text-shadow: 0 1px 8px rgba(0,0,0,.3); }
.h-acts   { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 2.75rem; }
.h-stats  { display: flex; gap: 2.25rem; flex-wrap: wrap; padding-top: 1.75rem; border-top: 1px solid rgba(255,255,255,.12); }
.sv { font-family: var(--ds-font-serif); font-size: 2rem; font-weight: 300; color: var(--ds-white); line-height: 1; }
.sl { font-size: .68rem; font-weight: 500; color: rgba(255,255,255,.44); letter-spacing: .06em; margin-top: .2rem; }
.h-scroll { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); z-index: 3; display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.sc-line  { width: 1px; height: 44px; background: linear-gradient(to bottom, rgba(255,255,255,.38), transparent); position: relative; overflow: hidden; }
.sc-line::after { content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 55%; background: var(--ds-gold); animation: scrollDrop 2s ease-in-out infinite; }
.h-scroll span { font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.30); }

/* ── TRUST BAR ────────────────────────────────────────────── */
.trust { background: var(--ds-blue-950); border-bottom: 1px solid rgba(255,255,255,.05); }
.t-in  { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; max-width: 1180px; margin: 0 auto; padding: 0 1.75rem; }
.ti    { display: flex; align-items: center; gap: .6rem; padding: 1.1rem 1.75rem; font-size: .72rem; font-weight: 500; color: rgba(255,255,255,.44); letter-spacing: .04em; border-right: 1px solid rgba(255,255,255,.06); }
.ti:last-child { border-right: none; }
.ti svg { color: var(--ds-gold); flex-shrink: 0; opacity: .75; }

/* ── ABOUT ────────────────────────────────────────────────── */
.about   { background: var(--ds-cream); }
.about-g { display: grid; grid-template-columns: 1fr 1fr; gap: 5.5rem; align-items: center; }
.about h2 { color: var(--ds-blue-900); margin-bottom: 1rem; }
.a-lead   { font-size: 1.1rem; line-height: 1.72; color: var(--ds-ink-70); margin-bottom: .9rem; }
.about p  { margin-bottom: 1.6rem; }
.a-cta    { display: flex; gap: 1rem; flex-wrap: wrap; }
.a-vis    { position: relative; }
.a-frame  { border-radius: var(--ds-r-2xl); overflow: hidden; box-shadow: var(--ds-shadow-xl); aspect-ratio: 4/5;
  background: linear-gradient(150deg, var(--ds-blue-800) 0%, var(--ds-blue-600) 55%, var(--ds-blue-900) 100%);
  display: flex; align-items: flex-end; justify-content: center; position: relative; }
.a-frame::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 55%, rgba(7,24,48,.72) 100%); }
.a-cap    { position: absolute; bottom: 1.75rem; left: 1.75rem; right: 1.75rem; z-index: 2; font-family: var(--ds-font-serif); font-size: 1.15rem; color: var(--ds-white); line-height: 1.3; }
.a-badge  { position: absolute; top: -1.25rem; right: -1.25rem; z-index: 3; background: var(--ds-gold); color: var(--ds-blue-950); border-radius: var(--ds-r-xl); padding: 1rem 1.25rem; text-align: center; box-shadow: var(--ds-shadow-lg); }
.a-badge .bn { font-family: var(--ds-font-serif); font-size: 2rem; font-weight: 600; line-height: 1; }
.a-badge .bl { font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-top: .2rem; }
.a-class  { position: relative; z-index: 1; width: 85%; margin: 0 auto 12%; }

/* ── COURSES TRIO ─────────────────────────────────────────── */
.courses { background: var(--ds-white); }
.c-trio  { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-bottom: 3rem; }
.cc      { border-radius: var(--ds-r-xl); overflow: hidden; border: 1px solid var(--ds-blue-100); display: flex; flex-direction: column; background: var(--ds-white); transition: transform .3s var(--ds-ease), box-shadow .3s var(--ds-ease); }
.cc:hover { transform: translateY(-7px); box-shadow: var(--ds-shadow-lg); }
.cc-h    { padding: 2.25rem 2rem 1.75rem; position: relative; overflow: hidden; }
.cc-h.g1 { background: linear-gradient(148deg, #0d2240 0%, #153d72 100%); }
.cc-h.g2 { background: linear-gradient(148deg, #142f5e 0%, #1a5698 100%); }
.cc-h.g3 { background: linear-gradient(148deg, #0f2d57 0%, #143d70 100%); }
.cc-h::before { content: ''; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; border: 1px solid rgba(255,255,255,.07); pointer-events: none; }
.cc-h::after  { content: ''; position: absolute; right: -20px; top: -20px; width: 100px; height: 100px; border-radius: 50%; border: 1px solid rgba(255,255,255,.04); pointer-events: none; }
.cc-ico  { width: 52px; height: 52px; border-radius: var(--ds-r-lg); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin-bottom: 1.25rem; position: relative; z-index: 1; color: rgba(255,255,255,.92); }
.cc-ico svg { width: 26px; height: 26px; }
.cc-h h3 { color: var(--ds-white); font-size: 1.35rem; margin-bottom: .3rem; position: relative; z-index: 1; }
.cc-type { font-size: .72rem; color: rgba(255,255,255,.5); font-weight: 500; letter-spacing: .05em; position: relative; z-index: 1; }
.cc-b    { padding: 1.75rem 2rem; flex: 1; display: flex; flex-direction: column; }
.cc-b p  { font-size: .875rem; line-height: 1.68; flex: 1; margin-bottom: 1.5rem; }
.cc-lnk  { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; font-weight: 600; color: var(--ds-blue-600); letter-spacing: .01em; transition: gap .2s, color .2s; }
.cc:hover .cc-lnk { gap: .8rem; color: var(--ds-blue-800); }

/* ── MORE COURSES BAND ────────────────────────────────────── */
.more-band      { background: var(--ds-blue-050); border-radius: var(--ds-r-2xl); padding: 2.5rem; border: 1px solid var(--ds-blue-100); display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.more-lbl-title { font-family: var(--ds-font-serif); font-size: 1.4rem; color: var(--ds-blue-900); line-height: 1.2; margin-bottom: .75rem; }
.more-lbl-title em { font-style: italic; color: var(--ds-gold); }
.more-lbl p     { font-family: var(--ds-font-sans); font-size: .875rem; color: var(--ds-ink-70); line-height: 1.68; margin: 0; }
.more-links     { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .6rem; }
.ml  { display: flex; align-items: center; gap: .65rem; padding: .65rem .9rem; border-radius: var(--ds-r); background: var(--ds-white); border: 1px solid var(--ds-blue-100); font-size: .8rem; font-weight: 500; color: var(--ds-blue-700); transition: border-color .2s, background .2s, transform .2s; cursor: pointer; }
.ml:hover { border-color: var(--ds-blue-400); background: var(--ds-blue-100); color: var(--ds-blue-900); transform: translateX(3px); }
.ml-d { width: 28px; height: 28px; border-radius: 50%; background: var(--ds-blue-100); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--ds-blue-500); }

/* ── WHY GRID ─────────────────────────────────────────────── */
.why   { background: var(--ds-blue-900); }
.why .s-head h2, .why .ds-s-head h2 { color: var(--ds-white); }
.why .s-head p,  .why .ds-s-head p  { color: rgba(255,255,255,.52); }
.why-g { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.wc    { padding: 2rem 1.75rem; border-radius: var(--ds-r-xl); border: 1px solid rgba(255,255,255,.07); background: rgba(255,255,255,.04); transition: background .3s, border-color .3s, transform .3s var(--ds-ease); }
.wc:hover { background: rgba(255,255,255,.09); border-color: rgba(255,255,255,.15); border-top-color: rgba(200,168,75,.50); transform: translateY(-5px); }
.wc-i  { width: 44px; height: 44px; border-radius: var(--ds-r); background: rgba(200,168,75,.13); border: 1px solid rgba(200,168,75,.20); display: flex; align-items: center; justify-content: center; margin-bottom: 1.2rem; color: var(--ds-gold); }
.wc-i svg { width: 20px; height: 20px; }
.wc h3 { font-size: 1.05rem; color: var(--ds-white); margin-bottom: .5rem; }
.wc p  { font-size: .84rem; color: rgba(255,255,255,.46); line-height: 1.65; }

/* ── REVIEWS ──────────────────────────────────────────────── */
.reviews { background: var(--ds-cream); }
.rev-g   { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-bottom: 2.75rem; }
.rc      { background: var(--ds-white); border-radius: var(--ds-r-xl); padding: 1.75rem; box-shadow: var(--ds-shadow-sm); border: 1px solid rgba(13,21,33,.05); border-top: 2px solid rgba(200,168,75,.22); display: flex; flex-direction: column; transition: box-shadow .3s, transform .3s var(--ds-ease); }
.rc:hover { box-shadow: var(--ds-shadow); transform: translateY(-4px); }
.rc-stars { margin-bottom: 1rem; color: var(--ds-gold); font-size: .9rem; letter-spacing: .1em; }
.rc-txt   { font-size: .875rem; line-height: 1.72; color: var(--ds-ink-70); font-style: italic; flex: 1; margin-bottom: 1.25rem; }
.rc-au    { display: flex; align-items: center; gap: .75rem; }
.rc-av    { width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, var(--ds-blue-600), var(--ds-blue-400)); display: flex; align-items: center; justify-content: center; font-family: var(--ds-font-serif); font-size: 1.1rem; color: var(--ds-white); font-weight: 600; flex-shrink: 0; }
.rc-name  { font-size: .82rem; font-weight: 600; color: var(--ds-ink); }
.rc-src   { font-size: .7rem;  color: var(--ds-ink-50); }
.plats    { display: flex; align-items: center; justify-content: center; gap: 1.25rem; flex-wrap: wrap; }
.plat     { display: flex; align-items: center; gap: .7rem; background: var(--ds-white); border: 1px solid var(--ds-blue-100); border-radius: 50px; padding: .65rem 1.25rem; font-size: .78rem; font-weight: 600; color: var(--ds-ink); box-shadow: var(--ds-shadow-sm); }
.p-stars  { color: var(--ds-gold); font-size: .8rem; letter-spacing: .06em; }
.p-sub    { font-size: .68rem; color: var(--ds-ink-50); }

/* ── RECOGNITIONS ─────────────────────────────────────────── */
.rec   { background: var(--ds-blue-050); }
.rec-g { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; }
.ri    { display: flex; flex-direction: column; align-items: center; gap: .75rem; padding: 1.75rem 1rem; border-radius: var(--ds-r-lg); border: 1px solid var(--ds-blue-100); text-align: center; transition: border-color .2s, box-shadow .2s, transform .25s var(--ds-ease); }
.ri:hover { border-color: var(--ds-blue-300); box-shadow: var(--ds-shadow-sm); transform: translateY(-3px); }
.ri-ico  { width: 52px; height: 52px; color: var(--ds-blue-600); flex-shrink: 0; }
.ri-name { font-size: .72rem; font-weight: 700; color: var(--ds-blue-900); letter-spacing: .04em; line-height: 1.3; }
.ri-desc { font-size: .65rem; color: var(--ds-ink-50); line-height: 1.4; }

/* ── ACCOMMODATION BAR ────────────────────────────────────── */
.acb      { background: var(--ds-blue-050); border-top: 1px solid var(--ds-blue-100); border-bottom: 1px solid var(--ds-blue-100); }
.acb-in   { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; max-width: 1180px; margin: 0 auto; padding: 2.25rem 1.75rem; }
.acb-left { display: flex; align-items: center; gap: 1.25rem; }
.acb-ico  { width: 50px; height: 50px; border-radius: var(--ds-r-lg); background: rgba(200,168,75,.10); border: 1px solid rgba(200,168,75,.22); display: flex; align-items: center; justify-content: center; color: var(--ds-gold); flex-shrink: 0; }
.acb-left strong { display: block; font-family: var(--ds-font-serif); font-size: 1.1rem; color: var(--ds-blue-900); margin-bottom: .2rem; font-weight: 500; }
.acb-left p { font-size: .875rem; margin: 0; color: var(--ds-ink-70); }

/* ── TESTS ────────────────────────────────────────────────── */
.tests   { background: linear-gradient(138deg, var(--ds-blue-800) 0%, var(--ds-blue-600) 48%, var(--ds-blue-900) 100%); }
.tests-g { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.tc      { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: var(--ds-r-xl); padding: 2.5rem 2.25rem; transition: background .3s, transform .3s var(--ds-ease); }
.tc:hover { background: rgba(255,255,255,.12); transform: translateY(-5px); }
.tc-ico  { margin-bottom: 1.5rem; }
.tc-ico svg { width: 52px; height: 52px; color: var(--ds-gold); }
.tc h3   { color: var(--ds-white); font-size: 1.4rem; margin-bottom: .6rem; }
.tc p    { color: rgba(255,255,255,.56); font-size: .9rem; line-height: 1.68; margin-bottom: 1.75rem; }
.btn-t   { display: inline-flex; align-items: center; gap: .5rem; background: var(--ds-white); color: var(--ds-blue-900); padding: .7rem 1.5rem; border-radius: 50px; font-size: .8rem; font-weight: 600; cursor: pointer; transition: all .25s var(--ds-ease); }
.btn-t:hover { background: var(--ds-gold); transform: translateY(-2px); box-shadow: 0 6px 22px rgba(200,168,75,.32); }

/* ── LOCATION / MAP ───────────────────────────────────────── */
.loc     { background: var(--ds-cream); }
.loc-g   { display: grid; grid-template-columns: 5fr 6fr; gap: 4rem; align-items: start; }
.loc h2  { color: var(--ds-blue-900); margin-bottom: 1rem; }
.loc-addr { display: flex; align-items: flex-start; gap: .8rem; background: var(--ds-blue-050); border-radius: var(--ds-r-lg); padding: 1.25rem; margin-bottom: 1.5rem; border: 1px solid var(--ds-blue-100); }
.loc-addr svg    { color: var(--ds-blue-500); flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; }
.loc-addr strong { display: block; font-size: .84rem; color: var(--ds-blue-900); margin-bottom: .2rem; }
.loc-addr span   { font-size: .8rem; color: var(--ds-ink-70); line-height: 1.5; }
.loc-dists { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 2rem; }
.ld        { display: flex; align-items: center; gap: .65rem; font-size: .82rem; color: var(--ds-ink-70); }
.ld svg    { color: var(--ds-gold); opacity: .65; flex-shrink: 0; width: 15px; height: 15px; }
.map-wrap  { border-radius: var(--ds-r-xl); overflow: hidden; box-shadow: var(--ds-shadow-xl); height: 420px; }
.map-wrap iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ── CTA ──────────────────────────────────────────────────── */
.cta { background: linear-gradient(138deg, var(--ds-blue-900) 0%, var(--ds-blue-700) 42%, var(--ds-blue-500) 72%, var(--ds-blue-800) 100%); text-align: center; padding: 7rem 0; position: relative; overflow: hidden; }
.cta::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .55; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); }
.cta > .wrap  { position: relative; z-index: 1; }
.cta h2       { color: var(--ds-white); margin-bottom: 1rem; max-width: 620px; margin-left: auto; margin-right: auto; }
.cta h2 em    { color: var(--ds-gold-light); font-style: italic; }
.cta > .wrap > p { color: rgba(255,255,255,.6); max-width: 480px; margin: 0 auto 2.75rem; }
.cta-acts { display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap; }
.cta-tel  { margin-top: 1.25rem; font-size: .84rem; color: rgba(255,255,255,.48); }
.cta-tel a { color: rgba(255,255,255,.78); font-weight: 600; }
.cta-tel a:hover { color: var(--ds-gold-light); }

/* ── FOOTER ───────────────────────────────────────────────── */
footer.ds-footer { background: var(--ds-blue-950); color: rgba(255,255,255,.52); }
.ft-top      { padding: 4.5rem 0; }
.ft-g        { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3.5rem; }
.ft-brand-name { font-family: var(--ds-font-serif); font-size: 1.15rem; color: var(--ds-white); font-weight: 500; }
.ft-brand p  { font-size: .84rem; line-height: 1.68; margin: 1rem 0 1.5rem; color: rgba(255,255,255,.40); }
.ft-soc      { display: flex; gap: .6rem; }
.soc         { width: 34px; height: 34px; border-radius: var(--ds-r); border: 1px solid rgba(255,255,255,.11); color: rgba(255,255,255,.48); display: flex; align-items: center; justify-content: center; transition: border-color .2s, color .2s, background .2s; cursor: pointer; }
.soc:hover   { border-color: rgba(255,255,255,.32); color: var(--ds-white); background: rgba(255,255,255,.07); }
.ft-ct       { font-family: var(--ds-font-serif); font-size: .95rem; color: var(--ds-white); margin-bottom: 1.1rem; font-weight: 500; }
.ft-lks      { display: flex; flex-direction: column; gap: .55rem; }
.ft-lks a    { font-size: .8rem; transition: color .2s; }
.ft-lks a:hover { color: var(--ds-white); }
.ft-cont     { margin-top: 1.5rem; }
.ft-cl       { font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.28); margin-bottom: .3rem; }
.ft-cont a   { display: block; font-size: .84rem; font-weight: 500; color: rgba(255,255,255,.7); margin-bottom: .3rem; }
.ft-cont a:hover { color: var(--ds-white); }
.ft-bot      { border-top: 1px solid rgba(255,255,255,.06); padding: 1.5rem 0; }
.ft-bot-in   { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.ft-bot p    { font-size: .72rem; }
.ft-leg      { display: flex; gap: 1.25rem; }
.ft-leg a    { font-size: .72rem; transition: color .2s; }
.ft-leg a:hover { color: var(--ds-white); }

/* ── UTILITIES ────────────────────────────────────────────── */
@media (max-width: 768px)  { .hide-mobile  { display: none !important; } }
@media (min-width: 769px)  { .hide-desktop { display: none !important; } }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 1024px) {
  .about-g   { grid-template-columns: 1fr; }
  .a-vis     { display: none; }
  .c-trio    { grid-template-columns: 1fr; }
  .why-g     { grid-template-columns: repeat(2, 1fr); }
  .rev-g     { grid-template-columns: repeat(2, 1fr); }
  .rec-g     { grid-template-columns: repeat(3, 1fr); }
  .loc-g     { grid-template-columns: 1fr; }
  .ft-g      { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .more-band { grid-template-columns: 1fr; gap: 1.5rem; }
  .tests-g   { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .ds-sec, .sec { padding: 4.5rem 0; }
  h1            { font-size: 2.6rem; }
  .h-stats      { gap: 1.5rem; }
  .why-g, .rev-g { grid-template-columns: 1fr; }
  .rec-g        { grid-template-columns: repeat(2, 1fr); }
  .ft-g         { grid-template-columns: 1fr; }
  .t-in         { flex-direction: column; align-items: flex-start; }
  .ti           { border-right: none; border-bottom: 1px solid rgba(255,255,255,.06); width: 100%; }
  .ti:last-child { border-bottom: none; }
}
@media (max-width: 480px) {
  .rec-g      { grid-template-columns: 1fr 1fr; }
  .more-links { grid-template-columns: 1fr; }
}
