/* ==========================================================================
   Minimal CSS v7 — Jewel Luxe (Bold, Modern, Premium)
   Mobile-first · Dark-mode aware · Zero webfonts · AA contrast
   ========================================================================== */

:root{
  color-scheme: light dark;

  /* Neutrals */
  --bg: #fbfaf7;                 /* paper */
  --bg-elev: #ffffff;
  --text: #0b1222;               /* deep ink */
  --muted: #535f73;              /* AA on light */
  --border: #e6e1d7;

  /* Jewel accents (bolder) */
  --sapphire: #1a4dff;           /* vivid primary */
  --navy:     #0a1638;           /* very deep */
  --ink:      #0e286f;           /* sapphire ink */
  --emerald:  #00c4a4;           /* electric viridian */
  --gold:     #e2c675;           /* brass gold */
  --gold-soft:#efdca7;           /* lighter gold */

  /* Depth */
  --shadow: 0 10px 30px rgba(14,40,111,.10), 0 2px 8px rgba(14,40,111,.06);

  /* Type / rhythm */
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
               Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  --font-serif: Georgia, "Book Antiqua", "Palatino Linotype", Palatino, "Iowan Old Style", serif;
  --base-font-size: 16px;
  --lh: 1.72;
  --container: 72rem;
  --radius: 16px;

  /* Stronger background glow */
  --glow:
    radial-gradient(1200px 600px at 10% -15%, rgba(26,77,255,.10), transparent 60%),
    radial-gradient(900px 450px at 95% -5%, rgba(226,198,117,.12), transparent 60%);

  /* Reveal offsets */
  --reveal-offset: 18px;
  --reveal-offset-gentle: 10px;
}

@media (prefers-color-scheme: dark){
  :root{
    --bg: #0b0d12;
    --bg-elev: #0f1217;
    --text: #e7eaf0;
    --muted: #a8b1be;
    --border: #1a2230;

    --sapphire: #b7c7ff;
    --navy:     #0a1228;
    --ink:      #8bb1ff;
    --emerald:  #67e6d7;
    --gold:     #d9c392;
    --gold-soft:#e7d9b8;

    --shadow: 0 10px 30px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.35);
    --glow:
      radial-gradient(1200px 600px at 10% -15%, rgba(139,177,255,.14), transparent 60%),
      radial-gradient(900px 450px at 95% -5%, rgba(217,195,146,.12), transparent 60%);
  }
}

/* Reset */
*,*::before,*::after{ box-sizing:border-box; }
html{ font-size:100%; -webkit-text-size-adjust:100%; text-rendering:optimizeLegibility; }
body{
  margin:0;
  font-family:var(--font-sans);
  font-size:var(--base-font-size);
  line-height:var(--lh);
  color:var(--text);
  background: var(--glow), var(--bg);
  background-attachment: fixed;
}

/* Focus */
:focus-visible{ outline:2px solid var(--sapphire); outline-offset:3px; border-radius:6px; }

/* Links — sapphire→gold underline (thicker, luxe) */
a{ color:inherit; text-decoration:none; position:relative; }
a::after{
  content:""; position:absolute; inset-inline:0; bottom:-2px; height:2px;
  background:linear-gradient(90deg, var(--sapphire), var(--gold));
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
a:hover::after{ transform:scaleX(1); }

/* Type */
h1,h2,h3{ margin:0 0 .25rem 0; line-height:1.16; letter-spacing:-0.01em; }
h1{ font-family:var(--font-serif); font-weight:700; font-size:clamp(2.25rem, 3.2vw + 1rem, 3.6rem); }
h2{ font-weight:750; font-size:clamp(1.35rem, 1.35vw + 1rem, 2.05rem); }
h3{ font-weight:600; font-size:1.125rem; }
p{ margin:0; font-size:1.02rem; }
.text-muted{ color:var(--muted); }

/* Lists */
ul{ margin:0; padding-left:1.25rem; }
li{ margin:0; }

/* Media */
img{ max-width:100%; height:auto; display:block; }

/* Layout */
.container{ max-width:var(--container); margin-inline:auto; padding-inline:1rem; }
.py-6{ padding-block:1.5rem; } .pb-8{ padding-bottom:2rem; }
.mt-1{margin-top:.25rem;} .mt-2{margin-top:.5rem;} .mt-3{margin-top:.75rem;}
.mt-4{margin-top:1rem;} .mt-6{margin-top:1.5rem;} .mt-10{margin-top:2.5rem;}
.mt-12{margin-top:3rem;} .mt-16{margin-top:4rem;}
.mb-6{margin-bottom:1.5rem;} .mb-8{margin-bottom:2rem;}
.max-w-2xl{ max-width:42rem; }

/* Utilities */
.text-3xl{ font-size:clamp(2.25rem, 2.9vw + 1rem, 3.5rem); font-weight:700; }
.text-xl{ font-size:1.25rem; font-weight:750; }
.text-lg{ font-size:1.125rem; } .text-base{ font-size:1rem; } .text-sm{ font-size:.9rem; }
.font-serif{ font-family:var(--font-serif); } .font-medium{ font-weight:600; }
.leading-relaxed{ line-height:1.8; } .underline{ text-decoration:underline; text-underline-offset:2px; }

/* Grid */
.grid{ display:grid; } .gap-6{ gap:1.25rem; }
@media (min-width:768px){ .md\:grid-cols-2{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Cards — vivid gradient stroke + reveal sheen */
.p-5{ padding:1.25rem; } .bg-white{ background:var(--bg-elev); }
.rounded{ border-radius:var(--radius); }
.shadow-sm{
  box-shadow:var(--shadow);
  border:1px solid var(--border);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease;
  will-change:transform;
}
.fx-card{
  position:relative; z-index:0; overflow:hidden; background:var(--bg-elev);
}
.fx-card::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; z-index:-1;
  background:linear-gradient(135deg,
    color-mix(in oklab, var(--sapphire) 70%, transparent),
    var(--gold)
  );
  background-size:200% 100%;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.fx-card::after{
  /* sheen */
  content:""; position:absolute; inset:-20% -60% auto -60%; height:50%;
  transform: translateY(140%) rotate(8deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  pointer-events:none;
}
.fx-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 44px rgba(14,40,111,.16), 0 6px 14px rgba(14,40,111,.1);
  border-color: color-mix(in oklab, var(--emerald) 26%, var(--border));
}
.fx-card:hover::after{ transform: translateY(20%) rotate(8deg); transition: transform .6s ease; }

/* Section spacing: only inside inner sections */
section + section{ margin-top:0; }
.section-inner > section + section{ margin-top:2rem; }
.section{ position:relative; }

/* Banner accent — animated unfurl on reveal (bolder width) */
header[role="banner"]{ position:relative; }
header[role="banner"]::after{
  content:""; display:block; height:3px; width:132px; margin-top:1.1rem;
  background:linear-gradient(90deg, var(--sapphire), var(--gold));
  border-radius:2px; opacity:.98; transform-origin:left;
}
.js .reveal-group.reveal-init header[role="banner"]::after{ transform:scaleX(0); }
.js .reveal-group.is-visible header[role="banner"]::after{ transform:scaleX(1); transition: transform .65s ease .1s; }

/* Service heading marker (brighter, slightly larger) */
[aria-label="Services"] h2{ position:relative; padding-left:1rem; }
[aria-label="Services"] h2::before{
  content:""; position:absolute; left:0; top:0.52em; width:10px; height:10px; border-radius:3px;
  background: conic-gradient(from 0deg, var(--emerald), var(--sapphire), var(--gold), var(--emerald));
  box-shadow:0 0 0 1px color-mix(in oklab, var(--ink) 30%, transparent);
}

/* Approach list bullets — sapphire/gold square */
.space-y-2 > * + *{ margin-top:.6rem; }
[aria-label="Approach"] li{
  list-style:none; position:relative; padding-left:1.25rem;
}
[aria-label="Approach"] li::before{
  content:""; position:absolute; left:0; top:.55em; width:.55rem; height:.55rem; border-radius:2px;
  background:linear-gradient(135deg, var(--gold), var(--sapphire));
  box-shadow:0 0 0 1px color-mix(in oklab, var(--gold) 28%, transparent);
}

/* ===================== Section colour blocks ====================== */
.section { padding-block: clamp(2.5rem, 6vw, 5rem); }
.section-inner { max-width: var(--container); margin-inline: auto; padding-inline: 1rem; }

/* Bolder, gradient-backed blocks (no HTML change needed) */
.bg-ivory{
  background:
    radial-gradient(1000px 500px at 5% -10%, rgba(26,77,255,.08), transparent 60%),
    radial-gradient(800px 400px at 95% -5%, rgba(226,198,117,.10), transparent 60%),
    #fbfaf7;
}
.bg-shell{
  background:
    linear-gradient(180deg, #f7efe2 0%, #efe6da 100%);
}
.bg-porcelain{
  background:
    radial-gradient(1200px 600px at 10% -15%, rgba(26,77,255,.12), transparent 55%),
    linear-gradient(180deg, #edf3ff 0%, #e8fff7 100%);
}
.bg-ink{
  color:#e8edf7;
  background:
    radial-gradient(1200px 600px at 105% -10%, rgba(226,198,117,.14), transparent 55%),
    radial-gradient(1200px 700px at -5% 110%, rgba(0,196,164,.16), transparent 55%),
    linear-gradient(180deg, #08122a 0%, #0b1f4a 100%);
}
.bg-ink .text-muted { color:#c2cad9; }
.bg-ink .shadow-sm { border-color: rgba(232,237,247,.12); box-shadow:none; background: rgba(255,255,255,.03); }
.bg-ink a::after { background:linear-gradient(90deg, var(--sapphire), var(--gold)); }

/* Dark mode (keep strong contrast, soften gradients) */
@media (prefers-color-scheme: dark){
  .bg-ivory { background: #0c1015; }
  .bg-shell { background: #0f1217; }
  .bg-porcelain { background: #0b1118; }
  .bg-ink { background: linear-gradient(180deg, #0b0f19 0%, #0b1525 100%); color:#e7eaf0; }
}

/* ===================== Reveal-on-scroll (progressive enhancement) ======= */
/* Visible by default (ens*