/* ================================================================
   FINIXIA DEDECONS GROUP — "SOVEREIGN MONOLITH"
   Stitch Design System — Navy Primary, Amber Accent
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* ── DESIGN TOKENS ────────────────────────────────────────────── */
:root {
  --navy:          #151b2b;
  --navy-mid:      #1e2d47;
  --navy-light:    #2a3a5c;
  --amber:         #e67e22;
  --amber-dark:    #944a00;
  --amber-light:   #fc8f34;
  --surface:       #faf8ff;
  --surface-low:   #f2f3ff;
  --surface-card:  #ffffff;
  --text-primary:  #151b2b;
  --text-muted:    #45464c;
  --text-subtle:   #76777d;
  --footer:        #0b1120;
  --shadow-card:   0 20px 60px rgba(21,27,43,0.08);
  --shadow-lift:   0 28px 72px rgba(21,27,43,0.14);
  --shadow-float:  0 12px 40px rgba(21,27,43,0.12);
  --divider:       rgba(198,198,205,0.22);
  --divider-light: rgba(21,27,43,0.06);
  --r-btn:  9999px;
  --r-card: 16px;
  --r-sm:   8px;
  --ease:   cubic-bezier(0.2, 0, 0, 1);
}

/* ── RESET ────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  font-family: 'Inter', -apple-system, sans-serif;
  background: var(--surface);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  padding-top: 72px;
}
img { display: block; max-width: 100%; height: auto; }
a   { text-decoration: none; color: inherit; }
button { cursor: pointer; font-family: inherit; }
h1,h2,h3,h4,h5,h6 { color: var(--text-primary); line-height: 1.1; letter-spacing: -0.02em; }

/* ═══════════════════════════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════════════════════════ */
#main-nav-wrapper {
  position: fixed; top: 0; left: 0; right: 0;
  height: 72px;
  background: rgba(250,248,255,0.96);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--divider-light);
  z-index: 1000;
  transition: box-shadow 0.3s var(--ease), background 0.3s var(--ease);
}
#main-nav-wrapper.scrolled {
  background: rgba(255,255,255,0.99);
  box-shadow: 0 2px 24px rgba(21,27,43,0.09);
}
.nav-inner {
  max-width: 1440px; margin: 0 auto;
  padding: 0 52px; height: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
}
#site-logo { display: flex; align-items: center; flex-shrink: 0; text-decoration: none; }
#site-logo img { height: 40px; width: auto; object-fit: contain; display: block; }
#logo-fallback { display: none; flex-direction: column; gap: 1px; }
#logo-fallback .lf-name { font-weight: 800; font-size: 16px; letter-spacing: -0.03em; color: var(--navy); line-height: 1; }
#logo-fallback .lf-sub  { font-size: 9px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--amber); line-height: 1; }

#desktop-nav { display: flex; align-items: center; gap: 4px; flex: 1; justify-content: flex-end; }
.dnav-link {
  font-size: 13.5px; font-weight: 500; color: var(--text-primary);
  padding: 8px 13px; border-radius: 6px;
  letter-spacing: 0.01em; white-space: nowrap; position: relative;
  transition: color 0.2s, background 0.2s;
}
.dnav-link::after {
  content: ''; position: absolute; bottom: 4px; left: 13px; right: 100%;
  height: 1.5px; background: var(--amber); transition: right 0.3s var(--ease);
}
.dnav-link:hover { color: var(--amber); background: rgba(230,126,34,0.05); }
.dnav-link:hover::after { right: 13px; }

/* Nav CTA — NAVY */
.btn-nav {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 22px; margin-left: 10px;
  background: var(--navy);
  color: #fff; font-size: 13px; font-weight: 700; letter-spacing: 0.02em;
  border-radius: var(--r-btn); white-space: nowrap;
  transition: transform 0.2s var(--ease), box-shadow 0.2s, background 0.2s;
}
.btn-nav:hover { background: var(--navy-mid); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(21,27,43,0.28); color: #fff; }

/* Hamburger */
#ham-btn { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 6px; flex-shrink: 0; }
#ham-btn span { display: block; width: 22px; height: 2px; background: var(--navy); border-radius: 2px; transition: all 0.3s; }

/* Search button in nav */
#search-btn { flex-shrink: 0; }


/* ═══════════════════════════════════════════════════════════════
   MOBILE NAV
═══════════════════════════════════════════════════════════════ */
#mobile-nav {
  display: none; position: fixed; inset: 0; z-index: 1050;
  background: #fff; flex-direction: column; overflow-y: auto;
}
#mobile-nav.open { display: flex; }
.mn-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 24px; border-bottom: 1px solid var(--divider-light);
}
.mn-header img { height: 34px; object-fit: contain; }
.mn-close { background: none; border: none; font-size: 26px; line-height: 1; color: var(--text-primary); padding: 4px; }
#mobile-nav nav { display: flex; flex-direction: column; flex: 1; }
#mobile-nav nav a {
  display: block; padding: 17px 24px; font-size: 15px; font-weight: 500;
  color: var(--text-primary); border-bottom: 1px solid var(--divider-light);
  transition: color 0.2s, background 0.2s;
}
#mobile-nav nav a:hover { color: var(--amber); background: var(--surface-low); }
.mn-cta-link {
  margin: 20px 24px 24px !important;
  background: var(--navy) !important;
  color: #fff !important;
  border-radius: var(--r-btn) !important;
  border: none !important;
  text-align: center;
  font-weight: 700 !important;
}
.mn-cta-link:hover { background: var(--navy-mid) !important; color: #fff !important; }

/* ═══════════════════════════════════════════════════════════════
   PDF MODAL
═══════════════════════════════════════════════════════════════ */
#pdf-modal {
  display: none; position: fixed; inset: 0; z-index: 2000;
  background: rgba(11,17,32,0.97);
  flex-direction: column; padding: 28px 32px;
}
#pdf-modal.open { display: flex; }
#pdf-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
#pdf-modal-header h3 { color: rgba(255,255,255,0.7); font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
#pdf-iframe { flex: 1; border: none; border-radius: var(--r-card); background: #fff; }

/* ═══════════════════════════════════════════════════════════════
   BUTTONS — PRIMARY = NAVY
═══════════════════════════════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 32px;
  font-size: 14px; font-weight: 700; letter-spacing: 0.01em;
  border: none; border-radius: var(--r-btn);
  cursor: pointer; transition: all 0.25s var(--ease);
  text-decoration: none; white-space: nowrap;
}
/* Primary = NAVY */
.btn-primary {
  background: var(--navy);
  color: #fff;
}
.btn-primary:hover {
  background: var(--navy-mid);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(21,27,43,0.30);
  color: #fff;
}
/* Amber variant — for hero ghost/dark bg contexts */
.btn-amber {
  background: linear-gradient(135deg, var(--amber-dark) 0%, var(--amber-light) 100%);
  color: #fff;
}
.btn-amber:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(230,126,34,0.35);
  color: #fff;
}
/* Outline */
.btn-outline {
  background: transparent; color: var(--text-primary);
  border: 1.5px solid rgba(21,27,43,0.18);
}
.btn-outline:hover { border-color: var(--navy); color: var(--navy); background: rgba(21,27,43,0.04); }

/* Ghost — for dark hero backgrounds */
.btn-ghost {
  background: rgba(255,255,255,0.10);
  border: 1.5px solid rgba(255,255,255,0.30);
  color: #fff;
  backdrop-filter: blur(4px);
}
.btn-ghost:hover { background: rgba(255,255,255,0.20); color: #fff; }

/* Outline light — for dark backgrounds */
.btn-outline-light {
  background: transparent; color: #fff;
  border: 1.5px solid rgba(255,255,255,0.35);
}
.btn-outline-light:hover { background: rgba(255,255,255,0.10); color: #fff; border-color: rgba(255,255,255,0.60); }



/* Text link */
.btn-text {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; color: var(--navy);
  font-weight: 700; font-size: 13.5px; padding: 6px 0;
  border: none; border-radius: 0; position: relative;
}
.btn-text::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 100%;
  height: 2px; background: var(--navy); transition: right 0.3s var(--ease);
}
.btn-text:hover::after { right: 0; }

/* ═══════════════════════════════════════════════════════════════
   LAYOUT HELPERS — CLASS-BASED (no inline styles needed)
═══════════════════════════════════════════════════════════════ */
.grid-2col  { display: grid; grid-template-columns: 1fr 1fr; }
.grid-3col  { display: grid; grid-template-columns: repeat(3, 1fr); }
.grid-4col  { display: grid; grid-template-columns: repeat(4, 1fr); }
.grid-5-7   { display: grid; grid-template-columns: 5fr 7fr; }
.grid-2-5   { display: grid; grid-template-columns: 2fr 5fr; }
.grid-ft    { display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr; }
.gap-sm     { gap: 16px; }
.gap-md     { gap: 24px; }
.gap-lg     { gap: 32px; }
.gap-xl     { gap: 48px; }
.gap-2xl    { gap: 64px; }

/* ═══════════════════════════════════════════════════════════════
   PAGE HERO
═══════════════════════════════════════════════════════════════ */
.page-hero {
  background: var(--surface-card);
  border-bottom: 1px solid var(--divider-light);
  min-height: 40vh; display: flex; align-items: center;
}
.page-hero-inner {
  max-width: 1440px; margin: 0 auto;
  padding: 88px 80px; width: 100%;
}
.accent-bar {
  width: 52px; height: 4px;
  background: linear-gradient(90deg, var(--amber-dark), var(--amber));
  border-radius: 2px; margin-bottom: 28px;
}
.page-hero h1 { font-size: clamp(2.6rem, 5vw, 4rem); font-weight: 800; color: var(--navy); }
.page-hero h1 .light { font-weight: 300; color: rgba(21,27,43,0.30); }
.page-hero .subtitle { font-size: 1.1rem; font-weight: 300; color: var(--text-muted); line-height: 1.75; max-width: 600px; margin-top: 20px; }

/* ═══════════════════════════════════════════════════════════════
   SECTIONS
═══════════════════════════════════════════════════════════════ */
.section       { padding: 96px 0; }
.section-alt   { background: var(--surface-low); }
.section-white { background: var(--surface-card); }
.section-navy  { background: var(--navy); }
.section-inner { max-width: 1440px; margin: 0 auto; padding: 0 80px; }
.section-label {
  font-size: 11px; font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--amber); margin-bottom: 14px; display: block;
}
.section-title { font-size: clamp(2rem, 3.5vw, 2.75rem); font-weight: 800; color: var(--navy); letter-spacing: -0.025em; }
.section-title.on-dark { color: #fff; }
.section-title-bar { width: 52px; height: 4px; background: linear-gradient(90deg, var(--amber-dark), var(--amber)); border-radius: 2px; margin-top: 16px; }
.section-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 52px; flex-wrap: wrap; gap: 20px; }

/* ═══════════════════════════════════════════════════════════════
   CARDS
═══════════════════════════════════════════════════════════════ */
.card { background: var(--surface-card); border-radius: var(--r-card); overflow: hidden; transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease); }
.card-shadow { box-shadow: var(--shadow-card); }
.card:hover  { transform: translateY(-5px); box-shadow: var(--shadow-lift); }
.card:hover .card-top-bar { transform: scaleX(1); }
.card:hover .card-img-zoom { transform: scale(1.05); }
.card-top-bar {
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--amber-dark), var(--amber));
  transform: scaleX(0); transform-origin: left; transition: transform 0.4s var(--ease);
}
.card-img-zoom { transition: transform 0.6s var(--ease); }

/* ═══════════════════════════════════════════════════════════════
   STATS
═══════════════════════════════════════════════════════════════ */
.stats-box { background: var(--surface-card); border-radius: var(--r-card); box-shadow: var(--shadow-float); padding: 40px 48px; }
.stat-item { text-align: center; padding: 0 36px; }
.stat-item + .stat-item { border-left: 1px solid var(--divider); }
.stat-figure { font-size: 3rem; font-weight: 800; color: var(--navy); letter-spacing: -0.04em; line-height: 1; }
.stat-figure span { color: var(--amber); }
.stat-label { font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--amber); margin-top: 10px; display: block; }

/* ═══════════════════════════════════════════════════════════════
   MARQUEE
═══════════════════════════════════════════════════════════════ */
.marquee-track {
  overflow: hidden; white-space: nowrap; background: var(--navy);
  padding: 18px 0; border-top: 1px solid rgba(255,255,255,0.06); border-bottom: 1px solid rgba(255,255,255,0.06);
}
.marquee-inner { display: inline-flex; animation: marqueeScroll 32s linear infinite; }
.marquee-inner:hover { animation-play-state: paused; }
.marquee-item { display: inline-flex; align-items: center; gap: 20px; padding: 0 20px; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.75); }
.marquee-diamond { color: var(--amber); font-size: 8px; }
@keyframes marqueeScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ═══════════════════════════════════════════════════════════════
   DARK SCALE SECTION
═══════════════════════════════════════════════════════════════ */
.scale-stat { text-align: center; padding: 0 32px; }
.scale-stat + .scale-stat { border-left: 1px solid rgba(255,255,255,0.08); }
.scale-figure { font-size: clamp(2.8rem, 5vw, 4.5rem); font-weight: 900; color: #fff; letter-spacing: -0.04em; line-height: 1; }
.scale-figure span { color: var(--amber); }
.scale-label { font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.45); margin-top: 12px; display: block; }

/* ═══════════════════════════════════════════════════════════════
   FORM INPUTS
═══════════════════════════════════════════════════════════════ */
.inp {
  width: 100%; padding: 13px 18px;
  background: var(--surface-low); border: 1.5px solid transparent;
  border-radius: var(--r-sm); font-size: 14px; color: var(--text-primary);
  outline: none; transition: border-color 0.2s, background 0.2s; appearance: none;
}
.inp:focus { border-color: var(--navy); background: var(--surface-card); }
.inp::placeholder { color: rgba(21,27,43,0.30); }
select.inp { cursor: pointer; }
.field-label { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }

/* ═══════════════════════════════════════════════════════════════
   SCROLL ANIMATIONS
═══════════════════════════════════════════════════════════════ */
.scroll-animate {
  opacity: 0; transform: translateY(28px);
  transition: opacity 0.85s var(--ease), transform 0.85s var(--ease);
}
.scroll-animate.animated { opacity: 1; transform: translateY(0); }
[data-delay="50"]  { transition-delay: 0.05s; }
[data-delay="60"]  { transition-delay: 0.06s; }
[data-delay="80"]  { transition-delay: 0.08s; }
[data-delay="100"] { transition-delay: 0.10s; }
[data-delay="150"] { transition-delay: 0.15s; }
[data-delay="160"] { transition-delay: 0.16s; }
[data-delay="200"] { transition-delay: 0.20s; }
[data-delay="240"] { transition-delay: 0.24s; }
[data-delay="300"] { transition-delay: 0.30s; }
[data-delay="320"] { transition-delay: 0.32s; }
[data-delay="400"] { transition-delay: 0.40s; }
[data-delay="500"] { transition-delay: 0.50s; }

.footer-animate-item { opacity: 0; transform: translateY(20px); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease); }
.footer-animate-item.animated { opacity: 1; transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤1023px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
  .nav-inner       { padding: 0 32px; }
  .section-inner   { padding: 0 40px; }
  .page-hero-inner { padding: 72px 40px; }
  .stats-box       { padding: 32px 32px; }
}

@media (max-width: 1023px) {
  #desktop-nav { display: none; }
  #ham-btn     { display: flex; }
  .nav-inner   { padding: 0 24px; }

  .grid-3col  { grid-template-columns: 1fr 1fr; }
  .grid-4col  { grid-template-columns: 1fr 1fr; }
  .grid-ft    { grid-template-columns: 1fr 1fr; }
  .grid-5-7,
  .grid-2-5,
  .grid-2col  { grid-template-columns: 1fr; }

  .stats-box       { flex-direction: column; }
  .stat-item       { padding: 24px 0; border-left: none !important; border-bottom: 1px solid var(--divider); }
  .stat-item:last-child { border-bottom: none; }
  .scale-stat      { padding: 32px 16px; border-left: none !important; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .scale-stat:last-child { border-bottom: none; }

  .section-inner   { padding: 0 32px; }
  .page-hero-inner { padding: 64px 32px; }
  .section         { padding: 72px 0; }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE (≤767px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  body             { padding-top: 64px; }
  #main-nav-wrapper { height: 64px; }
  .nav-inner       { padding: 0 20px; }
  .section-inner   { padding: 0 20px; }
  .page-hero-inner { padding: 52px 20px; }
  .section         { padding: 56px 0; }
  .stats-box       { padding: 28px 20px; }
  .stat-figure     { font-size: 2.5rem; }

  .grid-3col  { grid-template-columns: 1fr; }
  .grid-4col  { grid-template-columns: 1fr 1fr; }
  .grid-ft    { grid-template-columns: 1fr; }

  /* Split panels — stack image first then content on mobile */
  .split-panel-img  { order: -1; min-height: 260px; }
  .split-panel-content { padding: 40px 28px; }

  .page-hero h1   { font-size: clamp(2.2rem,10vw,3rem); }
  .section-title  { font-size: clamp(1.8rem,7vw,2.4rem); }
  .scale-figure   { font-size: clamp(2.2rem,10vw,3rem); }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — SMALL (≤480px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  .section-inner   { padding: 0 16px; }
  .page-hero-inner { padding: 44px 16px; }
  .section         { padding: 48px 0; }
  .grid-4col       { grid-template-columns: 1fr; }
  .btn             { padding: 13px 24px; font-size: 13px; }
  .stats-box       { border-radius: 12px; }
  .hero-cta-row    { flex-direction: column; align-items: flex-start; }

  #site-logo img   { height: 32px; }
  .scale-stat      { padding: 28px 12px; }
  .scale-figure    { font-size: 2.4rem; }
}

/* ═══════════════════════════════════════════════════════════════
   INLINE-STYLE GRID OVERRIDES
   Forces ALL inline style="display:grid; grid-template-columns:..."
   to collapse properly at each breakpoint.
   Uses !important because inline styles have highest specificity.
═══════════════════════════════════════════════════════════════ */

/* ── Tablet (≤1023px) ──────────────────────────────────────── */
@media (max-width: 1023px) {

  /* Any element with inline grid collapses to 1 col by default */
  [style*="display:grid"],
  [style*="display: grid"] {
    grid-template-columns: 1fr !important;
  }

  /* Flex rows become columns */
  [style*="display:flex"][style*="gap:52px"],
  [style*="display:flex"][style*="gap:64px"],
  [style*="display:flex"][style*="gap:80px"] {
    flex-direction: column !important;
  }

  /* Big inline paddings → tablet-safe */
  [style*="padding:64px 68px"],
  [style*="padding:56px 68px"],
  [style*="padding:60px 68px"],
  [style*="padding:56px 64px"] {
    padding: 44px 40px !important;
  }
  [style*="padding:80px 88px"] { padding: 48px 40px !important; }
  [style*="padding:52px 56px"] { padding: 40px 32px !important; }
  [style*="padding:52px 52px"] { padding: 36px 32px !important; }
  [style*="padding:40px 48px"] { padding: 32px 28px !important; }

  /* Stats box inner flex */
  .stats-box { flex-wrap: wrap !important; }
  .stat-item  { flex: 1 1 45% !important; border-left: none !important; border-right: none !important; border-bottom: 1px solid var(--divider) !important; padding: 20px !important; }
  .stat-item:last-child { border-bottom: none !important; }

  /* Scale stats → 2×2 */
  #scale .section-inner > .scroll-animate > div,
  .scale-stat {
    flex: 1 1 45% !important;
    border-left: none !important;
  }

  /* Timeline — full width */
  [id^="timeline-"] {
    justify-content: flex-start !important;
  }
  [id^="timeline-"] > .card {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Split panels on overview cards */
  #tech-overview,
  #logistics-overview,
  #mkt-overview {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }
  #tech-overview > div:last-child,
  #logistics-overview > div:last-child,
  #mkt-overview > div:last-child {
    grid-template-columns: 1fr 1fr !important;
    min-height: auto !important;
  }

  /* Entity cards */
  #ent-finixia, #ent-curozip {
    grid-template-columns: 56px 1fr auto !important;
  }
}

/* ── Mobile (≤767px) ───────────────────────────────────────── */
@media (max-width: 767px) {

  /* All inline grids → single column */
  [style*="display:grid"],
  [style*="display: grid"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* Presence grid (4 cols repeat) stays 2-col on mobile */
  [style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* All large inline paddings → 24px */
  [style*="padding:64px 68px"],
  [style*="padding:60px 68px"],
  [style*="padding:56px 68px"],
  [style*="padding:56px 64px"],
  [style*="padding:52px 56px"],
  [style*="padding:52px 52px"],
  [style*="padding:44px 36px"],
  [style*="padding:40px 32px"],
  [style*="padding:36px 40px"],
  [style*="padding:36px 36px"],
  [style*="padding:32px 40px"],
  [style*="padding:28px 36px"],
  [style*="padding:80px 88px"] {
    padding: 28px 22px !important;
  }

  /* Hero bottom-left anchor padding */
  [style*="padding:0 80px 140px"],
  [style*="padding:0 80px 120px"],
  [style*="padding:0 80px"] {
    padding: 0 20px 80px !important;
  }
  .hero-content-wrap { padding: 0 20px 88px !important; }

  /* Stats → single column */
  .stats-box      { flex-direction: column !important; }
  .stat-item      { flex: 1 1 100% !important; border-left: none !important; border-bottom: 1px solid var(--divider) !important; padding: 20px 0 !important; text-align: center; }
  .stat-item:last-child { border-bottom: none !important; }

  /* Scale → 2-col */
  .scale-stat     { flex: 1 1 47% !important; border-left: none !important; padding: 28px 16px !important; }

  /* Timeline → single col, no center spine */
  [id^="timeline-"] .card {
    width: 100% !important;
    margin: 0 !important;
    padding: 24px 20px !important;
  }
  /* Hide spine on mobile */
  [style*="position:absolute"][style*="left:50%"][style*="width:1px"],
  [style*="position:absolute; left:50%"][style*="width:1px"] {
    display: none !important;
  }
  /* Hide center dot on mobile */
  [style*="position:absolute; left:50%; top:36px"] {
    display: none !important;
  }

  /* Business split panels stack */
  #panel-tech,
  #panel-logistics,
  #panel-marketing,
  #tech-overview,
  #logistics-overview,
  #mkt-overview,
  #md-spotlight,
  .card.grid-2col,
  .card.grid-2-5 {
    grid-template-columns: 1fr !important;
  }

  /* Fix split image heights on mobile */
  .split-panel-img  { min-height: 220px !important; order: 0 !important; }
  .split-panel-content { order: 1 !important; padding: 28px 22px !important; }

  /* Hero H1 scale */
  #hero h1 { font-size: clamp(2.4rem, 10vw, 3.2rem) !important; }

  /* Footer bottom bar stacks */
  #site-footer [style*="display:flex"][style*="justify-content:space-between"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  /* Section header stacks */
  .section-header { flex-direction: column !important; align-items: flex-start !important; gap: 16px !important; }

  /* Entity card 3-col → single */
  #ent-finixia,
  #ent-curozip {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    text-align: left !important;
  }
  #ent-finixia > div:last-child,
  #ent-curozip > div:last-child { text-align: left !important; }

  /* Section nav  header spacing */
  .page-hero-inner { padding: 48px 20px !important; }

  /* Downloads table → stacked */
  #doc-portfolio, #doc-esg, #doc-q1 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  #doc-portfolio > span,
  #doc-esg > span,
  #doc-q1 > span { text-align: left !important; min-width: unset !important; }
  #doc-portfolio > div:last-child,
  #doc-esg > div:last-child,
  #doc-q1 > div:last-child { justify-content: flex-start !important; }

  /* Contact form fields stack */
  #contact-form .grid-2col { grid-template-columns: 1fr !important; }

  /* Investor notify form */
  #investor-notify-form { flex-direction: column !important; }
  #inv-notify-btn { width: 100% !important; }
}

/* ── Small (≤480px) ────────────────────────────────────────── */
@media (max-width: 480px) {
  /* Presence stays 2-col even small */
  [style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }

  .btn { width: 100%; justify-content: center; }
  .hero-cta-row .btn { width: auto !important; }  /* keep hero btns natural */
  .hero-cta-row { gap: 12px !important; }

  /* Downloads action row */
  #doc-portfolio > div:last-child,
  #doc-esg > div:last-child,
  #doc-q1 > div:last-child { flex-wrap: wrap !important; gap: 10px !important; }

  /* Navigation logo shrink */
  #site-logo img { height: 30px !important; }

  /* Sustainability split — full padding reduce */
  .split-panel-content { padding: 24px 18px !important; }

  /* Cards inner padding reduce */
  [style*="padding:44px 32px"] { padding: 32px 22px !important; }
  [style*="padding:40px 32px"] { padding: 28px 20px !important; }
  [style*="padding:36px 36px"] { padding: 24px 20px !important; }
  [style*="padding:36px 40px"] { padding: 24px 20px !important; }
  [style*="padding:28px 32px"] { padding: 20px 18px !important; }

  /* Scale stats single col */
  .scale-stat { flex: 1 1 100% !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; }
  .scale-stat:last-child { border-bottom: none !important; }
}