/* ===========================================================
   LONDON APEX — design tokens
   Palette: cool paper + ink navy + brass, institutional/dossier feel
   Type: Newsreader (serif, display) + IBM Plex Sans (UI/body)
=========================================================== */

:root{
  --navy-950:#071527;
  --navy-900:#0A2240;
  --navy-800:#123058;
  --navy-700:#1B3D6E;
  --navy-600:#27508C;

  --paper:#EEF1F5;
  --paper-flat:#E7EBF1;
  --white:#FFFFFF;

  --brass:#C8902B;
  --brass-deep:#A6741F;
  --brass-light:#E0B563;
  --brass-wash:#F7ECD6;

  --ink:#101522;
  --ink-soft:#454C5C;
  --ink-faint:#6B7382;

  --line:#D3D9E2;
  --line-on-navy:rgba(255,255,255,.16);

  --serif:'Newsreader', Georgia, 'Times New Roman', serif;
  --sans:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;

  --radius:3px;
  --maxw:1180px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:600; margin:0; color:var(--navy-900); }
p{ margin:0; }
button{ font-family:inherit; cursor:pointer; }
input,textarea,select{ font-family:inherit; font-size:1rem; }

.wrap{
  max-width:var(--maxw);
  margin:0 auto;
  padding:0 32px;
}

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

/* ---------- Top bar ---------- */
.topbar{
  background:var(--navy-950);
  color:#CBD3E0;
  font-size:.8rem;
  border-bottom:1px solid var(--line-on-navy);
}
.topbar .wrap{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:8px;
  padding-bottom:8px;
  gap:16px;
  flex-wrap:wrap;
}
.topbar-info{ display:flex; gap:22px; flex-wrap:wrap; }
.topbar-info a{ color:#CBD3E0; }
.topbar-info a:hover{ color:var(--brass-light); }
.topbar-locations{ letter-spacing:.02em; color:#8B96AC; }

/* ---------- Header / nav ---------- */
header.site-header{
  background:var(--navy-900);
  position:sticky; top:0; z-index:50;
  border-bottom:1px solid var(--line-on-navy);
}
.nav-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 0;
  gap:24px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  line-height:1.1;
  color:var(--white);
}
.brand-mark{ flex:none; border-radius:3px; }
.brand-text{ display:flex; flex-direction:column; }
.brand .mark{
  font-family:var(--serif);
  font-size:1.55rem;
  font-weight:600;
  letter-spacing:.01em;
}
.brand .mark em{ font-style:normal; color:var(--brass-light); }
.brand .sub{
  font-size:.62rem;
  letter-spacing:.14em;
  color:#8B96AC;
  margin-top:4px;
}
nav.main-nav{ display:flex; align-items:center; gap:22px; }
nav.main-nav a{
  color:#D6DCE7;
  font-size:.88rem;
  padding:8px 2px;
  border-bottom:2px solid transparent;
  white-space:nowrap;
}
nav.main-nav a:hover, nav.main-nav a.active{
  color:var(--white);
  border-bottom-color:var(--brass);
}
.has-dropdown.active > .dd-trigger{ color:var(--white); border-bottom-color:var(--brass); }
.nav-cta{
  background:var(--brass);
  color:var(--navy-950) !important;
  padding:10px 20px !important;
  border-radius:2px;
  font-weight:600;
  border-bottom:none !important;
}
.nav-cta:hover{ background:var(--brass-light) !important; color:var(--navy-950) !important; }

.nav-toggle{
  display:none;
  background:none; border:1px solid var(--line-on-navy); color:var(--white);
  padding:8px 12px; border-radius:2px;
}

@media (max-width:1080px){
  .topbar-locations{ display:none; }
  nav.main-nav{
    position:absolute; top:100%; left:0; right:0;
    background:var(--navy-900);
    flex-direction:column; align-items:flex-start;
    padding:8px 32px 22px;
    gap:4px;
    display:none;
    border-bottom:1px solid var(--line-on-navy);
    max-height:80vh;
    overflow-y:auto;
  }
  nav.main-nav.open{ display:flex; }
  nav.main-nav > a{ width:100%; padding:12px 0; border-bottom:1px solid var(--line-on-navy); }
  nav.main-nav a.active{ border-bottom-color:var(--brass); }
  .has-dropdown{ width:100%; }
  .has-dropdown > .dd-trigger{ padding:12px 0; border-bottom:1px solid var(--line-on-navy); justify-content:space-between; width:100%; }
  .nav-cta{ border:none !important; margin-top:10px; text-align:center; width:100%; justify-content:center; }
  .nav-toggle{ display:block; }
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:13px 26px;
  border-radius:2px;
  font-size:.92rem;
  font-weight:600;
  border:1px solid transparent;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.btn-brass{ background:var(--brass); color:var(--navy-950); }
.btn-brass:hover{ background:var(--brass-light); }
.btn-outline-light{ border-color:rgba(255,255,255,.4); color:var(--white); }
.btn-outline-light:hover{ border-color:var(--white); background:rgba(255,255,255,.06); }
.btn-outline-dark{ border-color:var(--navy-800); color:var(--navy-900); }
.btn-outline-dark:hover{ background:var(--navy-900); color:var(--white); }
.btn-ghost{ color:var(--navy-800); padding-left:0; padding-right:0; }
.btn-ghost::after{ content:'›'; margin-left:2px; font-family:var(--serif); }

/* ---------- Hero (home) ---------- */
.hero{
  background:var(--navy-900);
  color:var(--white);
  padding:76px 0 56px;
  overflow:hidden;
  position:relative;
}
.hero .wrap{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:56px;
  align-items:end;
  padding-bottom:60px;
}
.hero-eyebrow{
  font-size:.82rem;
  color:var(--brass-light);
  margin-bottom:18px;
  letter-spacing:.02em;
}
.hero h1{
  font-size:clamp(2.3rem, 4.4vw, 3.4rem);
  color:var(--white);
  line-height:1.12;
  font-weight:600;
  max-width:14ch;
}
.hero h1 .accent{ color:var(--brass-light); }
.hero-lede{
  margin-top:22px;
  font-size:1.08rem;
  color:#C4CCDB;
  max-width:46ch;
  line-height:1.6;
}
.hero-ctas{ display:flex; gap:16px; margin-top:32px; flex-wrap:wrap; }

.hero-panel{
  background:var(--navy-800);
  border:1px solid var(--line-on-navy);
  padding:30px 30px 8px;
}
.hero-panel-title{
  font-family:var(--serif);
  font-size:1.05rem;
  color:var(--white);
  border-bottom:1px solid var(--line-on-navy);
  padding-bottom:16px;
  margin-bottom:4px;
}
.hero-stat{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:16px 0;
  border-bottom:1px solid var(--line-on-navy);
}
.hero-stat:last-child{ border-bottom:none; }
.hero-stat .num{ font-family:var(--serif); font-size:1.5rem; color:var(--brass-light); }
.hero-stat .label{ font-size:.85rem; color:#B7C0D1; text-align:right; max-width:20ch; }

.hero-strip{
  border-top:1px solid var(--line-on-navy);
  background:var(--navy-950);
}
.hero-strip .wrap{
  display:flex;
  padding:14px 32px;
  gap:0;
  justify-content:space-between;
  flex-wrap:wrap;
}
.hero-strip span{ color:#8B96AC; font-size:.82rem; }
.hero-strip strong{ color:#D6DCE7; font-weight:500; }

/* ---------- Section basics ---------- */
section{ padding:84px 0; }
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  margin-bottom:44px;
  border-bottom:1px solid var(--line);
  padding-bottom:24px;
}
.section-head h2{ font-size:clamp(1.6rem,3vw,2.1rem); max-width:20ch; }
.section-head p{ color:var(--ink-soft); max-width:38ch; }
.section-kicker{
  font-size:.78rem;
  color:var(--brass-deep);
  margin-bottom:10px;
  font-weight:600;
}
.section-navy{ background:var(--navy-900); color:var(--white); }
.section-navy h2, .section-navy h3{ color:var(--white); }
.section-navy .section-head{ border-bottom-color:var(--line-on-navy); }
.section-navy .section-head p{ color:#B7C0D1; }
.section-flat{ background:var(--white); }

/* ---------- Directory / category list (home) ---------- */
.directory{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  border-top:1px solid var(--line);
}
.directory-item{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:22px 24px;
  border-bottom:1px solid var(--line);
  transition:background .12s ease;
}
.directory-item:nth-child(odd){ border-right:1px solid var(--line); }
.directory-item:hover{ background:var(--white); }
.directory-item .di-name{ font-family:var(--serif); font-size:1.08rem; color:var(--navy-900); }
.directory-item .di-blurb{ color:var(--ink-soft); font-size:.9rem; margin-top:6px; max-width:42ch; }
.directory-item .di-count{
  font-size:.78rem; color:var(--brass-deep); white-space:nowrap; font-weight:600;
  border:1px solid var(--brass-wash);
  background:var(--brass-wash);
  padding:4px 10px;
  height:fit-content;
  border-radius:20px;
}
@media (max-width:760px){
  .directory{ grid-template-columns:1fr; }
  .directory-item:nth-child(odd){ border-right:none; }
  .hero .wrap{ grid-template-columns:1fr; }
}

/* ---------- Pillars (services) ---------- */
.pillars{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); }
.pillar{ padding:30px 26px; border-right:1px solid var(--line); }
.pillar:last-child{ border-right:none; }
.pillar .pillar-index{ font-family:var(--serif); color:var(--brass); font-size:.85rem; margin-bottom:14px; }
.pillar h3{ font-size:1.08rem; margin-bottom:10px; }
.pillar p{ color:var(--ink-soft); font-size:.9rem; }
@media (max-width:900px){
  .pillars{ grid-template-columns:1fr 1fr; }
  .pillar{ border-bottom:1px solid var(--line); }
  .pillar:nth-child(odd){ border-right:1px solid var(--line); }
}
@media (max-width:560px){
  .pillars{ grid-template-columns:1fr; }
  .pillar{ border-right:none !important; }
}

/* ---------- Course cards / grid ---------- */
.filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:34px;
}
.filter-pill{
  border:1px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  padding:8px 16px;
  border-radius:20px;
  font-size:.85rem;
  transition:all .12s ease;
}
.filter-pill:hover{ border-color:var(--brass); color:var(--navy-900); }
.filter-pill.active{ background:var(--navy-900); border-color:var(--navy-900); color:var(--white); }

.search-row{
  display:flex; gap:14px; margin-bottom:22px; flex-wrap:wrap; align-items:center;
}
.search-input{
  flex:1; min-width:240px;
  padding:13px 16px;
  border:1px solid var(--line);
  border-radius:2px;
  background:var(--white);
  font-size:.95rem;
}
.results-count{ font-size:.85rem; color:var(--ink-faint); white-space:nowrap; }

.course-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.course-card{
  background:var(--white);
  padding:24px 24px 20px;
  display:flex;
  flex-direction:column;
  gap:12px;
  cursor:pointer;
}
.course-card:hover{ background:#FBFAF7; }
.course-card .cc-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.course-card .cc-code{ font-size:.72rem; color:var(--brass-deep); font-weight:600; letter-spacing:.04em; }
.course-card .cc-cat{ font-size:.72rem; color:var(--ink-faint); }
.course-card h3{ font-size:1.12rem; line-height:1.3; }
.course-card .cc-intro{ font-size:.87rem; color:var(--ink-soft); flex:1; }
.course-card .cc-meta{ display:flex; justify-content:space-between; align-items:center; font-size:.82rem; color:var(--ink-faint); border-top:1px solid var(--line); padding-top:12px; margin-top:2px; }
.course-card .cc-from{ color:var(--navy-900); font-weight:600; }

.empty-state{ padding:60px 20px; text-align:center; color:var(--ink-faint); }

/* ---------- Course detail (expanded panel) ---------- */
#detailZone{ scroll-margin-top:100px; }
.course-detail{
  background:var(--white);
  border:1px solid var(--line);
  border-top:3px solid var(--brass);
  padding:40px;
  margin:0 0 40px;
}

.cd-head{ display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:24px; margin-bottom:28px;}
.cd-head .cd-tag{ font-size:.78rem; color:var(--brass-deep); font-weight:600; margin-bottom:10px; }
.cd-head h2{ font-size:1.7rem; max-width:24ch; }
.cd-head .cd-langs{ color:var(--ink-faint); font-size:.88rem; margin-top:10px; }
.cd-close{ background:none; border:1px solid var(--line); border-radius:20px; padding:6px 16px; font-size:.82rem; color:var(--ink-soft); height:fit-content; }
.cd-close:hover{ border-color:var(--navy-800); color:var(--navy-900); }

.cd-grid{ display:grid; grid-template-columns:2fr 1fr; gap:44px; }
@media (max-width:820px){ .cd-grid{ grid-template-columns:1fr; } }

.cd-block{ margin-bottom:30px; }
.cd-block h4{ font-size:.8rem; text-transform:none; letter-spacing:.03em; color:var(--navy-800); margin-bottom:12px; padding-bottom:8px; border-bottom:1px solid var(--line); }
.cd-block p{ color:var(--ink-soft); font-size:.95rem; }
.cd-list{ display:flex; flex-direction:column; gap:8px; }
.cd-list li{ color:var(--ink-soft); font-size:.92rem; padding-left:16px; position:relative; }
.cd-list li::before{ content:'—'; position:absolute; left:0; color:var(--brass); }

.outline-day{ margin-bottom:18px; }
.outline-day .od-title{ font-family:var(--serif); font-size:1rem; color:var(--navy-900); margin-bottom:8px; }

.price-table{ border:1px solid var(--line); }
.price-row{ display:flex; justify-content:space-between; padding:13px 16px; border-bottom:1px solid var(--line); font-size:.9rem; }
.price-row:last-child{ border-bottom:none; }
.price-row .pr-fmt{ color:var(--ink-soft); }
.price-row .pr-fee{ font-weight:600; color:var(--navy-900); font-family:var(--serif); font-size:1.02rem; }
.price-note{ font-size:.8rem; color:var(--ink-faint); margin-top:12px; }

.cd-sidecard{ background:var(--paper); border:1px solid var(--line); padding:22px; margin-bottom:20px; }
.cd-sidecard h4{ font-size:.8rem; color:var(--navy-800); margin-bottom:10px; }
.cd-sidecard p{ font-size:.88rem; color:var(--ink-soft); }
.cd-enquire{ display:flex; flex-direction:column; gap:10px; }

/* ---------- Testimonials ---------- */
.quote-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-navy); border:1px solid var(--line-on-navy); margin-top:10px;}
.quote-card{ background:var(--navy-800); padding:28px 26px; }
.quote-card p.qtext{ font-family:var(--serif); font-style:italic; color:#E4E8F0; font-size:1.02rem; line-height:1.6; }
.quote-card .qattr{ margin-top:18px; font-size:.82rem; color:var(--brass-light); }
.quote-card .qrole{ color:#8B96AC; font-size:.8rem; margin-top:2px; }
@media (max-width:820px){ .quote-grid{ grid-template-columns:1fr; } }

/* ---------- Stats bar ---------- */
.stats-bar{ display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); }
.stat-cell{ padding:26px; border-right:1px solid var(--line); }
.stat-cell:last-child{ border-right:none; }
.stat-cell .snum{ font-family:var(--serif); font-size:2rem; color:var(--navy-900); }
.stat-cell .slabel{ font-size:.82rem; color:var(--ink-soft); margin-top:4px; }
@media (max-width:760px){ .stats-bar{ grid-template-columns:1fr 1fr; } .stat-cell{ border-bottom:1px solid var(--line); } }

/* ---------- Delivery model / accordion ---------- */
.model-list{ border-top:1px solid var(--line); }
.model-item{ border-bottom:1px solid var(--line); padding:26px 0; display:grid; grid-template-columns:220px 1fr; gap:30px; }
.model-item h3{ font-size:1.15rem; }
.model-item .mi-tag{ font-size:.78rem; color:var(--brass-deep); font-weight:600; margin-bottom:8px; }
.model-item p{ color:var(--ink-soft); font-size:.95rem; }
@media (max-width:700px){ .model-item{ grid-template-columns:1fr; gap:10px; } }

/* ---------- About page ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
@media (max-width:820px){ .split{ grid-template-columns:1fr; gap:36px; } }
.figure-block{ background:var(--navy-900); color:var(--white); padding:40px; }
.figure-block .fb-num{ font-family:var(--serif); font-size:2.4rem; color:var(--brass-light); }
.figure-block .fb-label{ font-size:.85rem; color:#B7C0D1; margin-top:6px; }
.figure-block + .figure-block{ margin-top:1px; }

.timeline{ border-left:2px solid var(--line); padding-left:28px; display:flex; flex-direction:column; gap:30px; }
.timeline-item .tl-loc{ font-family:var(--serif); color:var(--navy-900); font-size:1.1rem; }
.timeline-item p{ color:var(--ink-soft); font-size:.92rem; margin-top:6px; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--line); }
.contact-form{ padding:44px; }
.contact-info{ padding:44px; background:var(--navy-900); color:var(--white); }
.contact-info h3{ color:var(--white); font-size:1.2rem; margin-bottom:6px; }
.contact-info .ci-block{ margin-bottom:26px; }
.contact-info .ci-label{ font-size:.75rem; color:var(--brass-light); margin-bottom:6px; }
.contact-info a, .contact-info p{ color:#D6DCE7; font-size:.95rem; }
.map-embed{ width:100%; height:220px; border:0; margin-top:20px; filter:grayscale(.3) contrast(1.05); }
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } }

.field{ margin-bottom:18px; display:flex; flex-direction:column; gap:6px; }
.field label{ font-size:.82rem; color:var(--ink-soft); }
.field input, .field select, .field textarea{
  padding:12px 14px; border:1px solid var(--line); border-radius:2px; background:var(--white);
}
.field textarea{ resize:vertical; min-height:110px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:520px){ .field-row{ grid-template-columns:1fr; } }
.form-note{ font-size:.8rem; color:var(--ink-faint); margin-top:8px; }

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--brass-wash);
  border-top:1px solid var(--brass);
  border-bottom:1px solid var(--brass);
  padding:52px 0;
}
.cta-band .wrap{ display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.cta-band h2{ font-size:1.5rem; max-width:24ch; }

/* ---------- Footer ---------- */
footer.site-footer{ background:var(--navy-950); color:#8B96AC; padding:60px 0 0; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid var(--line-on-navy); }
.footer-grid h4{ color:#CBD3E0; font-size:.82rem; margin-bottom:16px; font-weight:600; }
.footer-grid ul li{ margin-bottom:10px; }
.footer-grid a:hover{ color:var(--brass-light); }
.footer-brand .mark{ font-family:var(--serif); color:var(--white); font-size:1.3rem; }
.footer-brand p{ margin-top:14px; font-size:.88rem; line-height:1.6; max-width:36ch; }
.footer-bottom{ display:flex; justify-content:space-between; padding:22px 0; font-size:.8rem; flex-wrap:wrap; gap:10px; }
.footer-grid-5{ grid-template-columns:1.3fr 1fr 1fr 1.1fr 1fr; }
.footer-learn-more{ display:inline-block; margin-top:14px; color:var(--brass-light); font-size:.88rem; }
.newsletter-form{ display:flex; gap:8px; margin-bottom:16px; }
.newsletter-form input{
  flex:1; min-width:0; padding:10px 12px; border:1px solid var(--line-on-navy); border-radius:2px;
  background:var(--navy-900); color:var(--white); font-size:.85rem;
}
.newsletter-form input::placeholder{ color:#8B96AC; }
.newsletter-form .btn{ padding:10px 16px; font-size:.82rem; white-space:nowrap; }
.social-row{ display:flex; gap:10px; }
.social-row a{
  width:34px; height:34px; border-radius:50%; border:1px solid var(--line-on-navy);
  display:flex; align-items:center; justify-content:center; font-size:.8rem; font-weight:600; color:#D6DCE7;
}
.social-row a:hover{ border-color:var(--brass); color:var(--brass-light); }
.footer-legal-links a:hover{ color:var(--brass-light); }
@media (max-width:1080px){ .footer-grid-5{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer-grid-5{ grid-template-columns:1fr; } }

/* ---------- Phase badges (Flagship / Add soon / On request) ---------- */
.phase-badge{
  font-size:.68rem; font-weight:600; letter-spacing:.03em;
  padding:3px 9px; border-radius:20px; white-space:nowrap;
}
.phase-flagship{ background:var(--brass); color:var(--navy-950); }
.phase-addsoon{ background:var(--brass-wash); color:var(--brass-deep); border:1px solid var(--brass); }
.phase-hold{ background:transparent; color:var(--ink-faint); border:1px solid var(--line); }
.cd-tag .phase-badge{ margin-left:6px; vertical-align:middle; }
.phase-pill{ font-size:.8rem; }

.dropdown-menu a.dd-view-all{ border-top:1px solid var(--line-on-navy); margin-top:6px; padding-top:13px; color:var(--brass-light); font-weight:600; }

/* ---------- Nav search ---------- */
.nav-search-toggle{
  background:none; border:none; color:#D6DCE7; padding:6px; display:flex; align-items:center;
  border-radius:50%; transition:background .15s ease, color .15s ease;
}
.nav-search-toggle:hover, .nav-search-toggle[aria-expanded="true"]{ background:rgba(255,255,255,.08); color:var(--brass-light); }
.nav-search-panel{
  display:none; align-items:center; gap:10px;
  padding:14px 0 18px;
}
.nav-search-panel.open{ display:flex; }
.nav-search-panel input{
  flex:1; padding:11px 16px; border:1px solid var(--line-on-navy); border-radius:2px;
  background:var(--navy-800); color:var(--white); font-size:.92rem;
}
.nav-search-panel input::placeholder{ color:#8B96AC; }
@media (max-width:1080px){
  .nav-search-toggle{ display:none; }
  .nav-search-panel{ display:none !important; }
}

/* ---------- Home: category tile grid ---------- */
.cat-tile-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.cat-tile{
  background:var(--white); padding:28px; display:flex; flex-direction:column; gap:8px;
  position:relative; min-height:150px; transition:background .15s ease;
}
.cat-tile:hover{ background:#FBFAF7; }
.cat-tile .ct-count{ font-family:var(--serif); font-size:1.6rem; color:var(--brass-deep); }
.cat-tile h3{ font-size:1.05rem; }
.cat-tile p{ font-size:.85rem; color:var(--ink-soft); }
.cat-tile .ct-link{ margin-top:auto; padding-top:10px; font-size:.85rem; color:var(--navy-800); }
.cat-tile:hover .ct-link{ color:var(--brass-deep); }
.ct-flag{
  position:absolute; top:20px; right:20px; font-size:.66rem; font-weight:600; letter-spacing:.03em;
  background:var(--brass-wash); color:var(--brass-deep); border:1px solid var(--brass); border-radius:20px; padding:3px 10px;
}
.ct-flag-phd{ background:var(--navy-900); color:var(--brass-light); border-color:var(--navy-900); }
.cat-tile.ct-more{ background:var(--paper); }
.cat-tile.ct-more h3{ color:var(--navy-900); }
@media (max-width:900px){ .cat-tile-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .cat-tile-grid{ grid-template-columns:1fr; } }

/* ---------- Home: filter bar ---------- */
.filter-bar{
  margin-top:34px; padding:24px; background:var(--paper); border:1px solid var(--line);
  display:flex; align-items:flex-end; gap:18px; flex-wrap:wrap;
}
.filter-bar-field{ display:flex; flex-direction:column; gap:6px; flex:1; min-width:150px; }
.filter-bar-field label{ font-size:.76rem; color:var(--ink-soft); font-weight:600; }
.filter-bar-field select{
  padding:11px 12px; border:1px solid var(--line); border-radius:2px; background:var(--white); font-size:.88rem;
}
@media (max-width:700px){ .filter-bar{ flex-direction:column; align-items:stretch; } .filter-bar-field{ width:100%; } }

/* ---------- Research services carousel ---------- */
.services-carousel{
  display:flex; gap:14px; overflow-x:auto; padding-bottom:10px; scrollbar-width:thin;
}
.service-chip{
  flex:none; background:var(--navy-800); border:1px solid var(--line-on-navy); color:#D6DCE7;
  padding:16px 20px; border-radius:2px; font-size:.88rem; white-space:nowrap; transition:background .15s ease, color .15s ease;
}
.service-chip:hover{ background:var(--brass); color:var(--navy-950); border-color:var(--brass); }

/* ---------- Text-based stats bar (no fabricated numbers) ---------- */
.stats-bar-text .snum-sm{ font-family:var(--serif); font-size:1.15rem; color:var(--navy-900); line-height:1.3; }

/* ---------- Duration banner ---------- */
.duration-banner{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  background:var(--brass-wash); border:1px solid var(--brass); padding:14px 20px; margin-bottom:22px; font-size:.88rem; color:var(--brass-deep);
}
.duration-banner .db-clear{ color:var(--navy-800); font-weight:600; text-decoration:underline; }

/* ---------- Pull quote ---------- */
.pull-quote{
  background:var(--navy-900); color:var(--white); padding:36px 34px;
  border-left:3px solid var(--brass);
}
.pull-quote p{ font-family:var(--serif); font-style:italic; font-size:1.3rem; line-height:1.5; color:#EAF0FA; }

/* ---------- Ethical/notice band ---------- */
.notice-band{ background:var(--navy-900); padding:0; }
.notice-band-inner{
  display:flex; align-items:flex-start; gap:22px;
  padding:28px 0; border-top:1px solid var(--line-on-navy); border-bottom:1px solid var(--line-on-navy);
}
.notice-band-icon{
  flex:none; width:38px; height:38px; border-radius:50%; background:var(--brass);
  color:var(--navy-950); font-family:var(--serif); font-weight:700; font-size:1.1rem;
  display:flex; align-items:center; justify-content:center;
}
.notice-band h3{ color:var(--white); font-size:1.05rem; margin-bottom:8px; }
.notice-band p{ color:#C4CCDB; font-size:.92rem; max-width:70ch; }
.notice-band p strong{ color:var(--brass-light); }

/* ---------- Service cards (Research Consultancy) ---------- */
.service-detail-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.service-card{ background:var(--white); padding:28px; display:flex; flex-direction:column; gap:12px; }
.service-card h3{ font-size:1.08rem; }
.service-card p{ color:var(--ink-soft); font-size:.9rem; }
.service-fee-row{
  margin-top:auto; padding-top:14px; border-top:1px solid var(--line);
  display:flex; flex-direction:column; gap:4px; font-size:.85rem;
}
.service-fee-row span{ color:var(--ink-faint); }
.service-fee-row strong{ color:var(--navy-900); font-family:var(--serif); font-size:.98rem; }

/* ---------- Legal pages ---------- */
.legal-copy{ max-width:760px; }
.legal-copy h2{ font-size:1.15rem; margin-top:34px; margin-bottom:10px; }
.legal-copy h2:first-child{ margin-top:0; }
.legal-copy p{ color:var(--ink-soft); font-size:.95rem; }

/* ---------- Utility ---------- */
.mt-0{ margin-top:0; }
.mono-tag{ font-family:var(--sans); font-size:.72rem; letter-spacing:.06em; color:var(--brass-deep); }
.hide{ display:none !important; }

/* ===========================================================
   MOTION, FLOATING ELEMENTS & DEPTH LAYER
=========================================================== */

/* ---- scroll reveal ---- */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s cubic-bezier(.16,.8,.3,1), transform .7s cubic-bezier(.16,.8,.3,1);
}
.reveal.in-view{ opacity:1; transform:none; }
.reveal-1{ transition-delay:.06s; }
.reveal-2{ transition-delay:.14s; }
.reveal-3{ transition-delay:.22s; }
.reveal-4{ transition-delay:.30s; }

/* ---- float keyframes ---- */
@keyframes floatY{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}
@keyframes floatYSmall{
  0%,100%{ transform:translateY(0) rotate(var(--r,0deg)); }
  50%{ transform:translateY(-6px) rotate(var(--r,0deg)); }
}
.float-el{ animation:floatY 6s ease-in-out infinite; }
.float-el-slow{ animation:floatY 8.5s ease-in-out infinite; }
.float-el-delay{ animation-delay:1.4s; }

/* floating chips scattered near hero */
.hero-floaters{ position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.floater-chip{
  position:absolute;
  background:var(--navy-800);
  border:1px solid var(--line-on-navy);
  color:#D6DCE7;
  font-size:.76rem;
  padding:10px 16px;
  border-radius:3px;
  display:flex; align-items:center; gap:8px;
  box-shadow:0 18px 40px rgba(0,0,0,.35);
  animation:floatY 7s ease-in-out infinite;
}
.floater-chip .dot{ width:6px; height:6px; border-radius:50%; background:var(--brass-light); flex:none; }
.floater-chip.c1{ top:2%; right:6%; animation-delay:.2s; }
.floater-chip.c2{ top:47%; right:1%; animation-delay:1.6s; animation-duration:8s; }
.floater-chip.c3{ bottom:4%; right:20%; animation-delay:.9s; animation-duration:6.5s; }
@media (max-width:1180px){ .hero-floaters{ display:none; } }

/* ---- scroll cue ---- */
.scroll-cue{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:#8B96AC; font-size:.7rem; letter-spacing:.08em;
}
.scroll-cue .chev{
  width:9px; height:9px;
  border-right:2px solid var(--brass-light);
  border-bottom:2px solid var(--brass-light);
  transform:rotate(45deg);
  animation:chevBounce 1.8s ease-in-out infinite;
}
@keyframes chevBounce{
  0%,100%{ transform:rotate(45deg) translateY(0); opacity:.5; }
  50%{ transform:rotate(45deg) translateY(6px); opacity:1; }
}

/* ---- animated counters ---- */
.counter-value{ font-variant-numeric:tabular-nums; }

/* ---- trust marquee ---- */
.trust-strip{ border-top:1px solid var(--line-on-navy); border-bottom:1px solid var(--line-on-navy); background:var(--navy-950); overflow:hidden; }
.trust-strip .marquee{ display:flex; width:max-content; animation:marquee 32s linear infinite; }
.trust-strip:hover .marquee{ animation-play-state:paused; }
.trust-track{ display:flex; align-items:center; gap:48px; padding:20px 24px; }
.trust-track span{ color:#6E7A90; font-size:.78rem; letter-spacing:.14em; white-space:nowrap; }
.trust-track span strong{ color:#AEB8C9; font-weight:600; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---- floating CTA + back to top ---- */
.floating-cta{
  position:fixed; right:26px; bottom:26px; z-index:80;
  display:flex; align-items:center; gap:10px;
  background:var(--brass); color:var(--navy-950);
  padding:14px 22px; border-radius:40px;
  font-size:.86rem; font-weight:600;
  box-shadow:0 16px 40px rgba(0,0,0,.35);
  transform:translateY(140%); opacity:0;
  transition:transform .35s cubic-bezier(.16,.8,.3,1), opacity .35s ease, background .15s ease;
}
.floating-cta.show{ transform:translateY(0); opacity:1; }
.floating-cta:hover{ background:var(--brass-light); }
.back-to-top{
  position:fixed; left:26px; bottom:26px; z-index:80;
  width:44px; height:44px; border-radius:50%;
  background:var(--navy-900); border:1px solid var(--line-on-navy);
  color:#D6DCE7; display:flex; align-items:center; justify-content:center;
  transform:translateY(140%); opacity:0;
  transition:transform .35s cubic-bezier(.16,.8,.3,1), opacity .35s ease, border-color .15s ease;
}
.back-to-top.show{ transform:translateY(0); opacity:1; }
.back-to-top:hover{ border-color:var(--brass); color:var(--brass-light); }
@media (max-width:640px){
  .floating-cta span{ display:none; }
  .floating-cta{ padding:14px; border-radius:50%; }
  .back-to-top{ width:40px; height:40px; }
}

/* ---- nav dropdown ---- */
.has-dropdown{ position:relative; }
.has-dropdown > .dd-trigger{ display:flex; align-items:center; gap:5px; }
.has-dropdown > .dd-trigger::after{
  content:''; width:6px; height:6px;
  border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform:rotate(45deg); margin-top:-4px; opacity:.7;
}
.dropdown-menu{
  position:absolute; top:calc(100% + 14px); left:50%; transform:translateX(-50%);
  background:var(--navy-800); border:1px solid var(--line-on-navy);
  min-width:230px; padding:8px 0;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .15s ease, transform .15s ease;
  box-shadow:0 20px 44px rgba(0,0,0,.4);
}
.has-dropdown:hover .dropdown-menu,
.has-dropdown.open .dropdown-menu{
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
.dropdown-menu a{
  display:block; padding:11px 20px; color:#D6DCE7; font-size:.88rem; border-bottom:none !important;
}
.dropdown-menu a:hover{ background:var(--navy-700); color:var(--white); }
@media (max-width:1080px){
  .dropdown-menu{ position:static; transform:none; opacity:1; visibility:visible; pointer-events:auto; display:none; box-shadow:none; border:none; background:var(--navy-950); min-width:0; padding:0 0 6px 14px; }
  .has-dropdown.open .dropdown-menu{ display:block; transform:none; }
  .has-dropdown > .dd-trigger::after{ float:right; margin-top:6px; }
}

/* ---- pulse dot (used sparingly for "live" indicators) ---- */
.pulse-dot{ position:relative; width:8px; height:8px; border-radius:50%; background:var(--brass-light); display:inline-block; }
.pulse-dot::after{
  content:''; position:absolute; inset:-4px; border-radius:50%;
  border:1px solid var(--brass-light); animation:pulseRing 2.2s ease-out infinite;
}
@keyframes pulseRing{
  0%{ transform:scale(.6); opacity:.8; }
  100%{ transform:scale(1.8); opacity:0; }
}

/* ---- accordion (FAQ / insights / case study extra detail) ---- */
details.acc{ border-bottom:1px solid var(--line); }
details.acc summary{
  list-style:none; cursor:pointer; padding:22px 0;
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  font-family:var(--serif); font-size:1.05rem; color:var(--navy-900);
}
details.acc summary::-webkit-details-marker{ display:none; }
details.acc summary .acc-icon{
  width:26px; height:26px; border:1px solid var(--line); border-radius:50%; flex:none;
  display:flex; align-items:center; justify-content:center; position:relative; transition:transform .25s ease, border-color .25s ease;
}
details.acc summary .acc-icon::before, details.acc summary .acc-icon::after{
  content:''; position:absolute; background:var(--navy-800);
}
details.acc summary .acc-icon::before{ width:10px; height:1.5px; }
details.acc summary .acc-icon::after{ width:1.5px; height:10px; transition:opacity .2s ease; }
details.acc[open] summary .acc-icon{ border-color:var(--brass); transform:rotate(180deg); }
details.acc[open] summary .acc-icon::after{ opacity:0; }
.acc-body{ padding:0 0 26px; color:var(--ink-soft); font-size:.95rem; max-width:74ch; }
.acc-body p + p{ margin-top:12px; }
details.acc[open] summary{ color:var(--brass-deep); }

/* ---- industry / case / insight cards ---- */
.tile-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.tile-card{ background:var(--white); padding:28px; display:flex; flex-direction:column; gap:12px; transition:background .15s ease, transform .2s ease; }
.tile-card:hover{ background:#FBFAF7; }
.tile-index{ font-family:var(--serif); color:var(--brass); font-size:.85rem; }
.tile-card h3{ font-size:1.12rem; }
.tile-card p{ color:var(--ink-soft); font-size:.9rem; }
.tile-links{ margin-top:auto; padding-top:14px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:6px; }
.tile-links a{ font-size:.84rem; color:var(--navy-800); }
.tile-links a:hover{ color:var(--brass-deep); }

.case-card{ border:1px solid var(--line); background:var(--white); padding:32px; margin-bottom:1px; }
.case-tag{ font-size:.76rem; color:var(--brass-deep); font-weight:600; margin-bottom:10px; }
.case-card h3{ font-size:1.3rem; max-width:36ch; }
.case-meta{ color:var(--ink-faint); font-size:.85rem; margin-top:8px; }
.case-metrics{ display:flex; gap:0; margin:22px 0; border:1px solid var(--line); }
.case-metric{ flex:1; padding:18px 20px; border-right:1px solid var(--line); }
.case-metric:last-child{ border-right:none; }
.case-metric .cm-num{ font-family:var(--serif); font-size:1.5rem; color:var(--navy-900); }
.case-metric .cm-label{ font-size:.78rem; color:var(--ink-faint); margin-top:2px; }
@media (max-width:640px){ .case-metrics{ flex-direction:column; } .case-metric{ border-right:none; border-bottom:1px solid var(--line); } .case-metric:last-child{ border-bottom:none; } }
.case-section{ margin-bottom:16px; }
.case-section .cs-label{ font-size:.78rem; font-weight:600; color:var(--navy-800); margin-bottom:6px; }
.case-section p{ color:var(--ink-soft); font-size:.92rem; }

.insight-card{ border:1px solid var(--line); background:var(--white); padding:30px; }
.insight-tag{ font-size:.74rem; color:var(--brass-deep); font-weight:600; }
.insight-card h3{ font-size:1.2rem; margin-top:10px; }
.insight-meta{ font-size:.8rem; color:var(--ink-faint); margin-top:8px; }
.insight-excerpt{ color:var(--ink-soft); font-size:.92rem; margin-top:14px; }

/* ---- page hero (secondary pages, lighter than home) ---- */
.page-hero{ position:relative; overflow:hidden; }
.page-hero .wrap{ position:relative; z-index:2; }
.page-hero-bg-num{
  position:absolute; right:-40px; top:-40px; font-family:var(--serif); font-size:16rem; color:rgba(16,25,43,.04);
  line-height:1; z-index:1; pointer-events:none; user-select:none;
}

/* ---- notice / disclaimer strip ---- */
.notice-strip{ background:var(--brass-wash); border:1px solid var(--brass); padding:16px 22px; font-size:.85rem; color:var(--brass-deep); margin-bottom:34px; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation:none !important; transition:none !important; }
  .reveal{ opacity:1; transform:none; }
}