/* =====================================================================
   ZIMER — Smart ITAD Solutions
   Bespoke design system. RTL-first (logical properties auto-flip to LTR).
   Brand: navy #082050 · cyan #00D8E0
   ===================================================================== */

/* ---------- Tokens ---------- */
:root {
  /* Brand */
  --navy-900: #050f2e;
  --navy-800: #071634;
  --navy:     #082050;   /* primary */
  --navy-600: #123069;
  --navy-500: #1c437f;
  --cyan:     #00d8e0;   /* accent */
  --cyan-600: #06b6bd;
  --cyan-700: #0a8f96;
  --cyan-050: #e6fbfc;

  /* Neutrals */
  --ink:      #0a1424;
  --ink-soft: #37455c;
  --muted:    #64748b;
  --line:     #e4e9f0;
  --line-2:   #eef2f7;
  --surface:  #ffffff;
  --bg:       #f6f9fc;
  --bg-2:     #eef3f9;

  /* Gradients */
  --grad-brand: linear-gradient(120deg, var(--navy) 0%, var(--navy-600) 45%, var(--cyan-700) 100%);
  --grad-cyan:  linear-gradient(120deg, var(--cyan) 0%, var(--cyan-600) 100%);
  --grad-hero:  linear-gradient(180deg, rgba(5,15,46,.30) 0%, rgba(5,15,46,.55) 45%, rgba(5,15,46,.88) 100%);
  --grad-sheen: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%);

  /* Type */
  --font-display: "Sora", "Heebo", system-ui, -apple-system, sans-serif;
  --font-body:    "Assistant", "Inter", system-ui, -apple-system, sans-serif;

  /* Radius / shadow */
  --r-sm: 10px;
  --r:    16px;
  --r-lg: 24px;
  --r-xl: 32px;
  --shadow-sm: 0 1px 2px rgba(8,32,80,.06), 0 2px 8px rgba(8,32,80,.05);
  --shadow:    0 6px 24px rgba(8,32,80,.08), 0 2px 6px rgba(8,32,80,.05);
  --shadow-lg: 0 24px 60px rgba(8,32,80,.14), 0 8px 24px rgba(8,32,80,.08);
  --shadow-cyan: 0 12px 34px rgba(0,216,224,.28);

  /* Layout */
  --container: 1200px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --nav-h: 76px;
}

/* ---------- Reset ---------- */
*,*::before,*::after { box-sizing: border-box; }
* { margin: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; font-size: 82%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body {
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--bg);
  line-height: 1.65;
  font-size: 1.0625rem;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img,svg,video { display:block; max-width:100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
ul { list-style: none; padding: 0; }
:focus-visible { outline: 3px solid var(--cyan); outline-offset: 2px; border-radius: 4px; }

/* ---------- Typography ---------- */
h1,h2,h3,h4 { font-family: var(--font-display); line-height: 1.12; color: var(--navy); font-weight: 700; letter-spacing: -.01em; }
.display { font-size: clamp(2.4rem, 6vw, 4.5rem); font-weight: 800; letter-spacing: -.02em; }
.h1 { font-size: clamp(2rem, 4.5vw, 3.1rem); }
.h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
.h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); }
.lead { font-size: clamp(1.075rem, 1.5vw, 1.3rem); color: var(--ink-soft); line-height: 1.7; }
.eyebrow {
  display:inline-flex; align-items:center; gap:.55rem;
  font-family: var(--font-display); font-weight:600; font-size:.8rem;
  letter-spacing:.14em; text-transform:uppercase; color: var(--cyan-700);
}
.eyebrow::before { content:""; inline-size:26px; block-size:2px; background: var(--grad-cyan); border-radius:2px; }
[dir="rtl"] .eyebrow { letter-spacing: .04em; }

/* ---------- Layout ---------- */
.container { inline-size: min(100% - 2*var(--gutter), var(--container)); margin-inline: auto; }
.section { padding-block: clamp(4rem, 8vw, 7rem); }
.section--tight { padding-block: clamp(3rem, 5vw, 4.5rem); }
.section-head { max-inline-size: 60ch; margin-bottom: clamp(2rem,4vw,3.25rem); }
.section-head.center { margin-inline: auto; text-align: center; max-inline-size: 66ch; }
.text-cyan { color: var(--cyan-700); }
.grad-text { background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- Buttons ---------- */
.btn {
  --btn-bg: var(--navy); --btn-fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding: .95rem 1.6rem; border-radius: 999px; border:1px solid transparent;
  font-family: var(--font-display); font-weight:600; font-size:1rem;
  background: var(--btn-bg); color: var(--btn-fg); position:relative;
  transition: transform .2s ease, box-shadow .25s ease, background .25s ease, color .2s ease, border-color .2s ease;
  will-change: transform;
}
.btn svg { inline-size:1.15em; block-size:1.15em; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--primary { background: var(--grad-cyan); color: var(--navy-900); box-shadow: var(--shadow-cyan); font-weight:700; }
.btn--primary:hover { box-shadow: 0 18px 44px rgba(0,216,224,.42); }
.btn--dark { background: var(--navy); color:#fff; box-shadow: var(--shadow); }
.btn--dark:hover { background: var(--navy-600); }
.btn--ghost { background: transparent; color: var(--navy); border-color: var(--line); }
.btn--ghost:hover { border-color: var(--navy); background: #fff; }
.btn--on-dark { background: rgba(255,255,255,.08); color:#fff; border-color: rgba(255,255,255,.28); backdrop-filter: blur(6px); }
.btn--on-dark:hover { background: rgba(255,255,255,.16); border-color:#fff; }
.btn--lg { padding: 1.1rem 2rem; font-size:1.075rem; }
.btn-row { display:flex; flex-wrap:wrap; gap: .9rem; }

.arrow-i { transition: transform .25s ease; }
[dir="rtl"] .arrow-i { transform: scaleX(-1); }
[dir="ltr"] .btn:hover .arrow-i { transform: translateX(4px); }
[dir="rtl"] .btn:hover .arrow-i { transform: scaleX(-1) translateX(4px); }

/* ---------- Header / Nav ---------- */
.site-header {
  position: sticky; inset-block-start: 0; z-index: 100;
  background: rgba(255,255,255,.92); backdrop-filter: blur(16px) saturate(1.4);
  border-block-end: 1px solid var(--line);
  transition: box-shadow .3s ease, background .3s ease;
}
.site-header.is-solid { box-shadow: 0 6px 24px rgba(8,32,80,.09); background: rgba(255,255,255,.96); }
.nav { display:flex; align-items:center; gap: 1.25rem; block-size: var(--nav-h); }
.nav__logo { display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:800; color:var(--navy); }
.nav__logo img { block-size: 54px; inline-size:auto; }
.nav__links { display:flex; align-items:center; gap: .35rem; margin-inline-start: 1.5rem; }
.nav__links a {
  padding: .55rem .85rem; border-radius: 999px; font-weight:600; font-size:.98rem; color: var(--navy-800);
  transition: background .2s, color .2s;
}
.nav__links a:hover { background: var(--bg-2); color: var(--navy); }
.nav__links a.active { color: var(--cyan-700); }
.nav__actions { display:flex; align-items:center; gap:.6rem; margin-inline-start: auto; }
.lang-toggle {
  display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .8rem; border-radius:999px;
  border:1px solid var(--line); background:#fff; font-family:var(--font-display); font-weight:600; font-size:.9rem; color:var(--navy);
  transition: border-color .2s, background .2s;
}
.lang-toggle:hover { border-color: var(--navy); }
.nav__burger { display:none; inline-size:46px; block-size:46px; border-radius:12px; border:1px solid var(--line); background:#fff; align-items:center; justify-content:center; }
.nav__burger span, .nav__burger span::before, .nav__burger span::after{
  content:""; display:block; inline-size:20px; block-size:2px; background:var(--navy); border-radius:2px; position:relative; transition:.25s;
}
.nav__burger span::before{ position:absolute; inset-block-start:-6px; }
.nav__burger span::after { position:absolute; inset-block-start:6px; }
body.menu-open .nav__burger span{ background:transparent; }
body.menu-open .nav__burger span::before{ inset-block-start:0; transform:rotate(45deg); }
body.menu-open .nav__burger span::after { inset-block-start:0; transform:rotate(-45deg); }

@media (max-width: 960px){
  .nav__burger{ display:inline-flex; order:3; }
  .nav__links{
    position: fixed; inset-block-start: var(--nav-h); inset-inline: 0; flex-direction:column; align-items:stretch;
    background:#fff; padding: 1rem var(--gutter) 2rem; gap:.25rem; margin:0;
    box-shadow: var(--shadow-lg); transform: translateY(-120%); transition: transform .35s cubic-bezier(.4,0,.2,1);
    border-block-start:1px solid var(--line); max-block-size: calc(100dvh - var(--nav-h)); overflow:auto;
  }
  body.menu-open .nav__links{ transform: translateY(0); }
  .nav__links a{ padding:.9rem 1rem; font-size:1.1rem; }
  .nav__cta-desktop{ display:none; }
}

/* ---------- Hero (compact banner + form bar over video) ---------- */
.hero { position: relative; min-block-size: clamp(440px, 62vh, 580px); display:flex; flex-direction:column; overflow:hidden; color:#fff; background:#050f2e; }
.hero__media { position:absolute; inset:0; z-index:0; }
.hero__media video, .hero__media img { inline-size:100%; block-size:100%; object-fit:cover; object-position:center; }
.hero__scrim { position:absolute; inset:0; z-index:1; background: var(--grad-hero); }
.hero__scrim::after{ content:""; position:absolute; inset:0; background: radial-gradient(120% 80% at 85% 12%, rgba(0,216,224,.18), transparent 60%); }
.hero__content { position:relative; z-index:2; flex:1 1 auto; display:flex; align-items:center; padding-block: clamp(2rem,4.5vw,3.25rem); }
.hero__copy { max-inline-size: 44rem; }
.hero .eyebrow { color: var(--cyan); }
.hero .eyebrow::before{ background: var(--cyan); }
.hero h1 { color:#fff; margin-block: .9rem 1rem; text-shadow: 0 2px 30px rgba(0,0,0,.25); }
/* rich, legible ITAD gradient on the dark hero */
.hero .grad-text{ background: linear-gradient(100deg,#22e0e8 0%, #37acf2 55%, #6d86f5 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero .lead { color: rgba(255,255,255,.9); margin-bottom: 1.4rem; max-inline-size: 40rem; }
.hero__tagline{ display:inline-flex; align-items:center; gap:.6rem; margin-block-end:1.1rem; font-family:var(--font-display); font-weight:600; color:#fff; font-size:1.05rem; }
.hero__tagline::before{ content:""; inline-size:8px; block-size:8px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 4px rgba(0,216,224,.25); }

/* Hero lead form bar (overlays bottom of the video, Shuru-style) */
.hero__formbar{ position:relative; z-index:2; padding-block-end: clamp(1rem,2.4vw,1.6rem); }
.lead-bar{ background: rgba(255,255,255,.97); border-radius: var(--r); box-shadow: var(--shadow-lg); border:1px solid rgba(255,255,255,.6); padding: .85rem 1rem; display:grid; grid-template-columns: auto 1fr; gap: 1rem 1.25rem; align-items:center; }
.lead-bar__title strong{ display:block; color:var(--navy); font-family:var(--font-display); font-size:1.02rem; line-height:1.25; }
.lead-bar__title span{ font-size:.84rem; color:var(--ink-soft); }
.lead-bar__fields{ display:flex; gap:.6rem; align-items:center; }
.lead-bar__fields input{ min-inline-size:0; flex:1 1 150px; padding:.8rem .9rem; border:1px solid var(--line); border-radius: var(--r-sm); font:inherit; background:var(--bg); color:var(--ink); direction: inherit; text-align: start; }
.lead-bar__fields input:focus{ outline:none; border-color: var(--cyan); background:#fff; box-shadow:0 0 0 4px rgba(0,216,224,.14); }
.lead-bar__fields .btn{ flex:0 0 auto; white-space:nowrap; }
.lead-bar__ok{ display:none; grid-column:1 / -1; text-align:center; color: var(--cyan-700); font-weight:700; font-family: var(--font-display); padding:.5rem; }
.lead-bar.sent .lead-bar__title, .lead-bar.sent .lead-bar__fields{ display:none; }
.lead-bar.sent .lead-bar__ok{ display:block; }
@media (max-width: 880px){
  .lead-bar{ grid-template-columns:1fr; gap:.7rem; }
  .lead-bar__fields{ flex-wrap:wrap; }
  .lead-bar__fields .btn{ inline-size:100%; }
}
.hero__stats { display:flex; flex-wrap:wrap; gap: clamp(1.25rem,3vw,2.5rem); margin-block-start: 2.75rem; padding-block-start:2rem; border-block-start:1px solid rgba(255,255,255,.18); }
.hero__stat b { font-family:var(--font-display); font-weight:800; font-size: clamp(1.6rem,3vw,2.2rem); color:#fff; display:block; line-height:1; }
.hero__stat span { font-size:.9rem; color: rgba(255,255,255,.72); }
.hero__scroll { position:absolute; inset-block-end:1.5rem; inset-inline-start:50%; transform:translateX(-50%); z-index:2; color:rgba(255,255,255,.7); display:flex; flex-direction:column; align-items:center; gap:.4rem; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.hero__scroll .mouse{ inline-size:22px; block-size:36px; border:2px solid rgba(255,255,255,.5); border-radius:12px; position:relative; }
.hero__scroll .mouse::after{ content:""; position:absolute; inset-block-start:6px; inset-inline-start:50%; transform:translateX(-50%); inline-size:3px; block-size:7px; background:#fff; border-radius:2px; animation: wheel 1.6s infinite; }
@keyframes wheel { 0%{opacity:1; transform:translate(-50%,0)} 100%{opacity:0; transform:translate(-50%,10px)} }

/* video controls chip */
.hero__vidctl{ position:absolute; z-index:3; inset-block-end:1.5rem; inset-inline-end:1.5rem; display:flex; gap:.5rem; }
.hero__vidctl button{ inline-size:44px; block-size:44px; border-radius:50%; border:1px solid rgba(255,255,255,.3); background:rgba(5,15,46,.4); backdrop-filter:blur(8px); color:#fff; display:flex; align-items:center; justify-content:center; transition:.2s; }
.hero__vidctl button:hover{ background:rgba(5,15,46,.7); border-color:#fff; }

/* ---------- Trust marquee (two opposing rows -> flows outward from centre) ---------- */
.trust { background:#fff; border-block: 1px solid var(--line); padding-block: 2.25rem; }
.trust__label { text-align:center; color:var(--muted); font-size:.85rem; letter-spacing:.06em; margin-bottom:1.6rem; font-weight:600; }
.marquee-2{ display:flex; flex-direction:column; gap:1.5rem; }
.marquee { position:relative; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
.marquee__track { display:flex; gap: 3.25rem; inline-size:max-content; align-items:center; }
.marquee--ltr .marquee__track { animation: mq-left 42s linear infinite; }
.marquee--rtl .marquee__track { animation: mq-right 42s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__track img { block-size:auto; max-block-size: 30px; max-inline-size: 104px; object-fit:contain; filter: grayscale(1); opacity:.6; transition:.3s; }
.marquee__track img:hover{ filter:grayscale(0); opacity:1; }
.marquee__track img[src$="velox.png"]{ max-block-size: 18px; }
.marquee__track img[src$="beefree.jpg"]{ max-block-size: 26px; }
@keyframes mq-left  { from{ transform:translateX(0) }    to{ transform:translateX(-50%) } }
@keyframes mq-right { from{ transform:translateX(-50%) } to{ transform:translateX(0) } }
@media (prefers-reduced-motion: reduce){ .marquee__track{ animation:none; flex-wrap:wrap; justify-content:center; } .marquee{ mask-image:none; -webkit-mask-image:none; } }

/* ---------- Cards / services ---------- */
.grid { display:grid; gap: clamp(1rem,2.4vw,1.6rem); }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(290px,1fr)); }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(340px,1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); }

.card {
  background: var(--surface); border:1px solid var(--line); border-radius: var(--r-lg);
  padding: clamp(1.5rem,2.5vw,2rem); position:relative; overflow:hidden;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: transparent; }
.card__ic { inline-size:56px; block-size:56px; border-radius:16px; display:grid; place-items:center; background: var(--cyan-050); color: var(--cyan-700); margin-bottom:1.25rem; transition:.3s; }
.card__ic svg{ inline-size:28px; block-size:28px; }
.card:hover .card__ic{ background: var(--grad-brand); color:#fff; }
.card h3 { margin-bottom:.6rem; }
.card p { color: var(--ink-soft); font-size:1rem; }
.card__link { display:inline-flex; align-items:center; gap:.4rem; margin-block-start:1.1rem; color:var(--cyan-700); font-weight:700; font-family:var(--font-display); font-size:.95rem; }
.card__num { position:absolute; inset-block-start:1rem; inset-inline-end:1.25rem; font-family:var(--font-display); font-weight:800; font-size:2.4rem; color:var(--line-2); line-height:1; }

/* feature list with checks */
.checklist li { display:flex; gap:.75rem; align-items:flex-start; padding-block:.5rem; color:var(--ink-soft); }
.checklist svg{ flex:0 0 auto; inline-size:22px; block-size:22px; color:var(--cyan-700); margin-block-start:.15rem; }

/* ---------- Split feature ---------- */
.split { display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem,5vw,4rem); align-items:center; }
@media (max-width: 900px){ .split{ grid-template-columns:1fr; } }
.split__visual { border-radius: var(--r-xl); overflow:hidden; box-shadow: var(--shadow-lg); position:relative; background:var(--grad-brand); aspect-ratio: 4/3; }

/* ---------- Stats band ---------- */
.stats-band { background: var(--navy); color:#fff; position:relative; overflow:hidden; }
.stats-band::before{ content:""; position:absolute; inset:0; background: radial-gradient(80% 120% at 100% 0%, rgba(0,216,224,.16), transparent 55%); }
.stats-band .stat { text-align:center; padding: 1rem; }
.stats-band .stat b{ font-family:var(--font-display); font-weight:800; font-size: clamp(2.8rem,5.5vw,4.2rem); background:var(--grad-cyan); -webkit-background-clip:text; background-clip:text; color:transparent; display:block; line-height:1; }
.stats-band .stat span{ color:rgba(255,255,255,.8); font-size:1.12rem; margin-block-start:.6rem; display:block; }
.stats-band .stat i{ font-style:normal; color:var(--cyan); }

/* ---------- Process illustration ---------- */
.process-wrap { position:relative; }
.proc-illustration { inline-size:100%; block-size:auto; }

/* ---------- CTA band ---------- */
.cta-band { position:relative; overflow:hidden; border-radius: var(--r-xl); background: var(--grad-brand); color:#fff; padding: clamp(2.5rem,6vw,4.5rem); text-align:center; box-shadow: var(--shadow-lg); }
.cta-band::before{ content:""; position:absolute; inset:0; background: radial-gradient(60% 120% at 0% 0%, rgba(0,216,224,.28), transparent 55%); }
.cta-band > * { position:relative; z-index:1; }
.cta-band h2{ color:#fff; }
.cta-band .lead{ color:rgba(255,255,255,.88); margin-inline:auto; max-inline-size:52ch; }

/* ---------- FAQ ---------- */
.faq-item { border:1px solid var(--line); border-radius: var(--r); background:#fff; margin-bottom:.85rem; overflow:hidden; transition:border-color .2s, box-shadow .2s; }
.faq-item[data-open="true"]{ border-color: var(--cyan); box-shadow: var(--shadow); }
.faq-q { inline-size:100%; text-align:start; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding: 1.2rem 1.4rem; font-family:var(--font-display); font-weight:600; font-size:1.08rem; color:var(--navy); background:none; border:none; }
.faq-ic { flex:0 0 auto; inline-size:28px; block-size:28px; border-radius:50%; background:var(--cyan-050); color:var(--cyan-700); display:grid; place-items:center; transition:.3s; }
.faq-item[data-open="true"] .faq-ic{ background:var(--grad-cyan); color:var(--navy-900); transform:rotate(180deg); }
.faq-a { display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease; }
.faq-item[data-open="true"] .faq-a{ grid-template-rows:1fr; }
.faq-a > div{ overflow:hidden; }
.faq-a p{ padding: 0 1.4rem 1.3rem; color:var(--ink-soft); }

/* ---------- Forms ---------- */
.form-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding: clamp(1.5rem,3vw,2.5rem); box-shadow:var(--shadow); }
.field{ margin-bottom:1.1rem; }
.field label{ display:block; font-weight:600; color:var(--navy); margin-bottom:.4rem; font-size:.95rem; }
.field input, .field textarea, .field select{
  inline-size:100%; padding:.85rem 1rem; border:1px solid var(--line); border-radius:var(--r-sm);
  font:inherit; color:var(--ink); background:var(--bg); transition:border-color .2s, box-shadow .2s, background .2s;
}
.field input:focus, .field textarea:focus, .field select:focus{ outline:none; border-color:var(--cyan); background:#fff; box-shadow:0 0 0 4px rgba(0,216,224,.14); }
.field .req{ color:#dc2626; }
.form-note{ font-size:.85rem; color:var(--muted); }

/* contact info tiles */
.info-tile{ display:flex; gap:1rem; align-items:flex-start; padding:1.1rem 0; border-block-end:1px solid var(--line); }
.info-tile:last-child{ border:none; }
.info-tile .ic{ flex:0 0 auto; inline-size:48px; block-size:48px; border-radius:14px; background:var(--cyan-050); color:var(--cyan-700); display:grid; place-items:center; }
.info-tile b{ display:block; color:var(--navy); font-family:var(--font-display); }
.info-tile a, .info-tile span{ color:var(--ink-soft); }

/* ---------- Footer ---------- */
.site-footer{ background: var(--navy-900); color: rgba(255,255,255,.72); padding-block: clamp(3rem,6vw,4.5rem) 2rem; }
.site-footer a{ color: rgba(255,255,255,.72); transition:color .2s; }
.site-footer a:hover{ color: var(--cyan); }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 2.5rem; }
@media (max-width:820px){ .footer-grid{ grid-template-columns: 1fr 1fr; gap:2rem; } }
@media (max-width:520px){ .footer-grid{ grid-template-columns: 1fr; } }
.footer-brand img{ block-size:46px; margin-bottom:1rem; filter: brightness(0) invert(1); opacity:.95; }
.footer-col h4{ color:#fff; font-size:1rem; margin-bottom:1rem; letter-spacing:.02em; }
.footer-col li{ margin-bottom:.6rem; }
.footer-bottom{ margin-block-start: 2.5rem; padding-block-start:1.5rem; border-block-start:1px solid rgba(255,255,255,.12); display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; font-size:.85rem; }
.badge-row{ display:flex; flex-wrap:wrap; gap:.6rem; margin-block-start:1rem; }
.cert-badge{ display:inline-flex; align-items:center; gap:.45rem; padding:.4rem .8rem; border:1px dashed rgba(255,255,255,.3); border-radius:999px; font-size:.8rem; color:rgba(255,255,255,.85); }
.cert-badge .dot{ inline-size:7px; block-size:7px; border-radius:50%; background:var(--cyan); }

/* placeholder marker */
.ph{ background: rgba(0,216,224,.12); border-bottom:1px dashed var(--cyan-600); border-radius:3px; padding:0 .15em; }

/* ---------- Reveal animations ---------- */
.reveal{ opacity:0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.08s; }
.reveal[data-delay="2"]{ transition-delay:.16s; }
.reveal[data-delay="3"]{ transition-delay:.24s; }
.reveal[data-delay="4"]{ transition-delay:.32s; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ---------- Helpers ---------- */
.text-center{ text-align:center; }
.mt-1{ margin-block-start:1rem; } .mt-2{ margin-block-start:2rem; }
.badge{ display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .75rem; border-radius:999px; background:var(--cyan-050); color:var(--cyan-700); font-weight:600; font-size:.85rem; font-family:var(--font-display); }
.divider-tint{ background: linear-gradient(180deg, var(--bg) 0%, #fff 100%); }
.bg-alt{ background:#fff; }
.bg-tint{ background: var(--bg-2); }

/* ---------- Process timeline (alternating, premium) ---------- */
.timeline{ position:relative; max-inline-size: 980px; margin-inline:auto; padding-block:.5rem; }
.timeline::before{
  content:""; position:absolute; inset-block: 8px 8px; inset-inline-start:50%; transform:translateX(-50%);
  inline-size:3px; border-radius:3px;
  background: linear-gradient(180deg, var(--navy) 0%, var(--cyan-700) 50%, var(--cyan) 100%); opacity:.28;
}
/* travelling pulse */
.timeline::after{
  content:""; position:absolute; inset-inline-start:50%; transform:translateX(-50%); inset-block-start:0;
  inline-size:11px; block-size:11px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 6px rgba(0,216,224,.25);
  animation: tl-pulse 6s ease-in-out infinite;
}
@keyframes tl-pulse{ 0%{ inset-block-start:0; opacity:0 } 8%{opacity:1} 92%{opacity:1} 100%{ inset-block-start:100%; opacity:0 } }
@media (prefers-reduced-motion: reduce){ .timeline::after{ display:none; } }

.tl-step{ position:relative; display:grid; grid-template-columns: 1fr 92px 1fr; align-items:center; margin-block-end: 1.4rem; }
.tl-step:last-child{ margin-block-end:0; }
.tl-node{
  grid-column:2; justify-self:center; inline-size:76px; block-size:76px; border-radius:22px;
  background: var(--grad-brand); color:#fff; display:grid; place-items:center; position:relative; z-index:1;
  box-shadow: var(--shadow); transition: transform .3s ease, box-shadow .3s ease;
}
.tl-node svg{ inline-size:34px; block-size:34px; }
.tl-num{
  position:absolute; inset-block-start:-11px; inset-inline-end:-11px; inline-size:30px; block-size:30px;
  border-radius:50%; background:#fff; color:var(--navy); border:2px solid var(--cyan);
  font-family:var(--font-display); font-weight:800; font-size:.95rem; display:grid; place-items:center;
  box-shadow: 0 4px 12px rgba(8,32,80,.15);
}
.tl-card{
  background:#fff; border:1px solid var(--line); border-radius: var(--r-lg); padding: 1.35rem 1.6rem;
  box-shadow: var(--shadow-sm); position:relative; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.tl-card::after{ /* little connector to the spine */
  content:""; position:absolute; inset-block-start:50%; transform:translateY(-50%);
  inline-size:26px; block-size:2px; background: var(--cyan); opacity:.4;
}
.tl-step:hover .tl-card{ box-shadow: var(--shadow-lg); transform: translateY(-4px); border-color:transparent; }
.tl-step:hover .tl-node{ transform: scale(1.06); box-shadow: var(--shadow-lg); }
.tl-card h4{ font-size:1.12rem; margin-bottom:.35rem; }
.tl-card p{ font-size:.95rem; color:var(--ink-soft); line-height:1.55; }
.tl-stage{ font-family:var(--font-display); font-weight:700; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--cyan-700); display:block; margin-bottom:.3rem; }

/* odd -> card on inline-start side; even -> card on inline-end side */
.tl-step:nth-child(odd) .tl-card{ grid-column:1; text-align:end; }
.tl-step:nth-child(odd) .tl-card::after{ inset-inline-end:-26px; }
.tl-step:nth-child(even) .tl-card{ grid-column:3; text-align:start; }
.tl-step:nth-child(even) .tl-card::after{ inset-inline-start:-26px; }

@media (max-width: 760px){
  .timeline::before{ inset-inline-start:38px; }
  .timeline::after{ inset-inline-start:38px; }
  .tl-step{ grid-template-columns: 76px 1fr; gap:1.1rem; margin-block-end:1.1rem; }
  .tl-node{ grid-column:1 !important; }
  .tl-card{ grid-column:2 !important; text-align:start !important; }
  .tl-card::after{ display:none; }
}

/* ---------- Process flow (horizontal — preferred) ---------- */
.flow{ position:relative; }
.flow__track{ display:grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; position:relative; }
.flow__track::before{ content:""; position:absolute; inset-block-start:38px; inset-inline: 9%; block-size:3px; background: linear-gradient(90deg, var(--navy), var(--cyan)); border-radius:3px; opacity:.3; z-index:0; }
.flow__step{ position:relative; z-index:1; text-align:center; }
.flow__node{ inline-size:76px; block-size:76px; margin-inline:auto; border-radius:22px; background:#fff; border:1px solid var(--line); box-shadow: var(--shadow); display:grid; place-items:center; color:var(--navy); position:relative; transition: transform .3s ease, box-shadow .3s ease, background .3s, color .3s; }
.flow__node svg{ inline-size:34px; block-size:34px; }
.flow__step:hover .flow__node{ transform: translateY(-6px); background: var(--grad-brand); color:#fff; box-shadow: var(--shadow-lg); }
.flow__num{ position:absolute; inset-block-start:-10px; inset-inline-end:-10px; inline-size:28px; block-size:28px; border-radius:50%; background: var(--grad-cyan); color: var(--navy-900); font-family: var(--font-display); font-weight:800; font-size:.9rem; display:grid; place-items:center; box-shadow: 0 4px 12px rgba(0,216,224,.4); border:2px solid #fff; }
.flow__step h4{ font-size:1rem; margin-block: 1.1rem .4rem; }
.flow__step p{ font-size:.88rem; color: var(--ink-soft); line-height:1.5; }
@media (max-width:1000px){ .flow__track{ grid-template-columns: repeat(3,1fr); gap: 1.9rem 1rem; } .flow__track::before{ display:none; } }
@media (max-width:560px){ .flow__track{ grid-template-columns: 1fr; gap:1.25rem; } .flow__step{ text-align:start; display:grid; grid-template-columns:64px 1fr; gap:1rem; align-items:center; } .flow__node{ margin-inline:0; inline-size:64px; block-size:64px; } .flow__step h4{ margin-block:0 .25rem; } }

/* ---------- Testimonials ---------- */
.tst-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding: clamp(1.5rem,3vw,2.25rem); position:relative; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; block-size:100%; }
.tst-card::before{ content:"“"; position:absolute; inset-block-start:.2rem; inset-inline-start:1.25rem; font-family:var(--font-display); font-size:4.5rem; line-height:1; color:var(--cyan); opacity:.28; }
[dir="rtl"] .tst-card::before{ content:"”"; }
.tst-card p{ font-size:1.08rem; color:var(--ink); position:relative; z-index:1; margin-block: .5rem 1.25rem; }
.tst-card .tst-author{ display:flex; align-items:center; gap:.8rem; margin-block-start:auto; }
.tst-card .tst-avatar{ inline-size:46px; block-size:46px; border-radius:50%; background:var(--grad-brand); color:#fff; display:grid; place-items:center; font-family:var(--font-display); font-weight:700; }
.tst-card .tst-author b{ color:var(--navy); font-family:var(--font-display); font-size:.98rem; display:block; }
.stars{ display:flex; gap:.15rem; color:#f5b301; }
.stars svg{ inline-size:18px; block-size:18px; }

/* client logos grid */
.logos-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:1rem; }
@media (max-width:720px){ .logos-grid{ grid-template-columns: repeat(2,1fr); } }
.logo-tile{ background:#fff; border:1px solid var(--line); border-radius:var(--r); block-size:110px; display:grid; place-items:center; padding:1.25rem; transition:.3s; }
.logo-tile:hover{ box-shadow:var(--shadow); transform:translateY(-4px); border-color:transparent; }
.logo-tile img{ max-block-size:40px; max-inline-size:60%; object-fit:contain; filter:grayscale(1); opacity:.72; transition:.3s; }
.logo-tile:hover img{ filter:grayscale(0); opacity:1; }
.logo-tile img[src$="velox.png"]{ max-block-size:24px; }
.logo-tile img[src$="beefree.jpg"]{ max-block-size:34px; }

/* section intro helper */
.intro-flex{ display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; flex-wrap:wrap; margin-bottom: clamp(2rem,4vw,3rem); }
.intro-flex .section-head{ margin-bottom:0; }

/* ---------- Nav mega-menu (Services on hover) ---------- */
.nav__item{ position:relative; display:flex; align-items:center; }
.nav__item.has-menu > a{ display:inline-flex; align-items:center; gap:.25rem; }
.nav__caret{ transition: transform .25s ease; }
.nav__item.has-menu:hover .nav__caret{ transform: rotate(180deg); }
.nav__menu{
  position:absolute; inset-block-start: calc(100% + 10px); inset-inline-start:0;
  transform: translateY(8px);
  inline-size: 500px; max-inline-size: 92vw; background:#fff; border:1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: .8rem;
  opacity:0; visibility:hidden; transition: opacity .22s ease, transform .22s ease, visibility .22s;
  z-index:120; display:grid; grid-template-columns: 1fr 1fr; gap:.2rem;
}
.nav__menu::before{ content:""; position:absolute; inset-block-start:-14px; inset-inline:0; block-size:14px; }
.nav__item.has-menu:hover .nav__menu,
.nav__item.has-menu:focus-within .nav__menu{ opacity:1; visibility:visible; transform: translateY(0); }
.nav__menu a{ display:flex; gap:.8rem; align-items:flex-start; padding:.7rem .8rem; border-radius: var(--r-sm); }
.nav__menu a:hover{ background: var(--bg-2); }
.nav__menu .mi-ic{ inline-size:40px; block-size:40px; border-radius:11px; background: var(--cyan-050); color:var(--cyan-700); display:grid; place-items:center; flex:0 0 auto; transition:.25s; }
.nav__menu a:hover .mi-ic{ background: var(--grad-brand); color:#fff; }
.nav__menu .mi-ic svg{ inline-size:20px; block-size:20px; }
.nav__menu b{ display:block; color:var(--navy); font-family:var(--font-display); font-size:.94rem; margin-bottom:.1rem; }
.nav__menu span{ font-size:.8rem; color:var(--muted); line-height:1.4; }
@media (max-width: 960px){
  .nav__caret{ display:none; }
  .nav__menu{ display:none; }
  .nav__item{ display:block; }
}

/* ---------- Accessibility widget ---------- */
.a11y-fab{ position:fixed; inset-block-end:1.25rem; inset-inline-end:1.25rem; z-index:200; inline-size:56px; block-size:56px; border-radius:50%; background:var(--navy); color:#fff; border:none; box-shadow:var(--shadow-lg); display:grid; place-items:center; transition:.2s; }
.a11y-fab:hover{ background:var(--navy-600); transform: translateY(-2px); }
.a11y-fab svg{ inline-size:30px; block-size:30px; }
.a11y-panel{ position:fixed; inset-block-end:5.6rem; inset-inline-end:1.25rem; z-index:201; inline-size:310px; max-inline-size:calc(100vw - 2rem); background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); padding:1.15rem 1.25rem 1.25rem; opacity:0; visibility:hidden; transform: translateY(12px); transition:.25s; }
.a11y-panel.open{ opacity:1; visibility:visible; transform:none; }
.a11y-panel h4{ font-size:1.05rem; margin-bottom:.9rem; display:flex; align-items:center; justify-content:space-between; }
.a11y-panel h4 .a11y-close{ background:none; border:none; color:var(--muted); padding:.2rem; line-height:1; }
.a11y-actions{ display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }
.a11y-actions button{ display:flex; flex-direction:column; align-items:center; gap:.4rem; padding:.75rem .5rem; border:1px solid var(--line); border-radius: var(--r-sm); background:var(--bg); font-family:var(--font-body); font-size:.8rem; font-weight:600; color:var(--navy); text-align:center; transition:.2s; }
.a11y-actions button:hover{ border-color: var(--cyan); background:#fff; }
.a11y-actions button.active{ border-color: var(--cyan); background: var(--cyan-050); color: var(--cyan-700); }
.a11y-actions button svg{ inline-size:22px; block-size:22px; }
.a11y-reset{ inline-size:100%; margin-block-start:.65rem; }
.a11y-state{ font-size:.78rem; color:var(--muted); text-align:center; margin-block-start:.7rem; }
.a11y-panel a.a11y-statement{ display:block; text-align:center; margin-block-start:.5rem; font-size:.82rem; color:var(--cyan-700); font-weight:600; }

/* Accessibility state modes (toggled on <html>) */
html.a11y-contrast{ filter: contrast(1.32) saturate(1.15); }
html.a11y-links a{ text-decoration: underline !important; text-underline-offset:3px; }
html.a11y-links a:focus, html.a11y-links a:hover{ outline:2px solid var(--cyan); outline-offset:2px; }
html.a11y-readable, html.a11y-readable *{ font-family: Arial, "Assistant", "Heebo", sans-serif !important; letter-spacing:.01em !important; }
html.a11y-bigcursor, html.a11y-bigcursor *{ cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'%3E%3Cpath fill='%23082050' stroke='white' stroke-width='1' d='M4 2l16 8-6 2-2 6z'/%3E%3C/svg%3E") 4 4, auto !important; }

/* ---------- Inner page hero ---------- */
.page-hero{ position:relative; background: var(--grad-brand); color:#fff; padding-block: clamp(3rem,7vw,5.5rem); overflow:hidden; }
.page-hero::before{ content:""; position:absolute; inset:0; background: radial-gradient(70% 120% at 90% 0%, rgba(0,216,224,.22), transparent 55%); }
.page-hero__inner{ position:relative; z-index:1; max-inline-size: 54rem; }
.page-hero .eyebrow{ color: var(--cyan); }
.page-hero .eyebrow::before{ background: var(--cyan); }
.page-hero h1{ color:#fff; margin-block: 1rem .9rem; }
.page-hero .lead{ color: rgba(255,255,255,.9); }
.breadcrumb{ display:flex; gap:.5rem; align-items:center; font-size:.85rem; color: rgba(255,255,255,.72); margin-bottom:.4rem; }
.breadcrumb a{ color: rgba(255,255,255,.72); } .breadcrumb a:hover{ color:#fff; }
.breadcrumb svg{ inline-size:14px; block-size:14px; opacity:.6; }
[dir="rtl"] .breadcrumb svg{ transform: scaleX(-1); }

/* ---------- Prose ---------- */
.prose{ max-inline-size: 70ch; }
.prose p{ margin-bottom: 1.1rem; color: var(--ink-soft); }
.prose h3{ margin-block: 1.6rem .6rem; }
.prose strong{ color: var(--navy); }

/* ---------- Callout / highlight ---------- */
.callout{ display:flex; gap: 1.5rem; align-items:flex-start; background: var(--navy); color:#fff; border-radius: var(--r-lg); padding: clamp(1.6rem,3.2vw,2.4rem); position:relative; overflow:hidden; }
.callout::before{ content:""; position:absolute; inset:0; background: radial-gradient(60% 130% at 0% 0%, rgba(0,216,224,.26), transparent 55%); }
.callout > *{ position:relative; z-index:1; }
.callout__ic{ flex:0 0 auto; inline-size:60px; block-size:60px; border-radius:16px; background: var(--grad-cyan); color: var(--navy-900); display:grid; place-items:center; }
.callout__ic svg{ inline-size:30px; block-size:30px; }
.callout h3{ color:#fff; margin-bottom:.5rem; }
.callout p{ color: rgba(255,255,255,.86); }
@media (max-width:600px){ .callout{ flex-direction:column; } }

/* ---------- Service visual panel (replaces the plain box) ---------- */
.svc-visual{ border-radius: var(--r-xl); background: var(--grad-brand); aspect-ratio: 4/3; display:grid; place-items:center; position:relative; overflow:hidden; box-shadow: var(--shadow-lg); }
.svc-visual::before{ content:""; position:absolute; inset:0; background: radial-gradient(60% 80% at 72% 22%, rgba(0,216,224,.42), transparent 60%); }
.svc-visual::after{ content:""; position:absolute; inset-block-end:-25%; inset-inline-start:-12%; inline-size:70%; block-size:70%; border-radius:50%; background: radial-gradient(circle, rgba(255,255,255,.10), transparent 70%); }
.svc-visual svg{ inline-size: clamp(96px, 26%, 168px); block-size:auto; color:#fff; opacity:.96; position:relative; z-index:1; filter: drop-shadow(0 10px 26px rgba(0,0,0,.28)); }

/* ---------- Detailed service blocks ---------- */
.svc-block{ padding-block: clamp(2.5rem,5vw,4rem); border-block-end:1px solid var(--line); scroll-margin-block-start: 92px; }
.svc-block:last-child{ border-block-end:none; }
.svc-head{ display:flex; align-items:center; gap:1rem; margin-bottom:1.25rem; }
.svc-head .card__ic{ margin:0; }
.svc-head h2{ font-size: clamp(1.5rem,3vw,2rem); }

/* ---------- Map ---------- */
.map-card{ border-radius: var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow: var(--shadow); background:#fff; }
.map-card iframe{ inline-size:100%; block-size:360px; border:0; display:block; }

/* ---------- Numbered pillars ---------- */
.pillar-num{ font-family: var(--font-display); font-weight:800; font-size:2.4rem; background: var(--grad-brand); -webkit-background-clip:text; background-clip:text; color:transparent; line-height:1; margin-bottom:.4rem; }

/* footer contact tiles — bright on the dark footer (not navy-on-navy) */
.site-footer .info-tile b{ color: var(--cyan); font-weight:700; }
.site-footer .info-tile a, .site-footer .info-tile span{ color: rgba(255,255,255,.85); }
.site-footer .info-tile a:hover{ color: var(--cyan); }

/* ---------- Blog / article cards ---------- */
.post-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(320px,1fr)); gap: clamp(1.25rem,2.5vw,1.75rem); }
.post-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; transition: transform .3s, box-shadow .3s, border-color .3s; block-size:100%; }
.post-card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color:transparent; }
.post-thumb{ aspect-ratio:16/9; background:var(--grad-brand); display:grid; place-items:center; position:relative; overflow:hidden; }
.post-thumb::before{ content:""; position:absolute; inset:0; background:radial-gradient(70% 90% at 75% 15%, rgba(0,216,224,.4), transparent 60%); }
.post-thumb svg{ inline-size:56px; block-size:56px; color:#fff; opacity:.95; position:relative; z-index:1; filter:drop-shadow(0 6px 16px rgba(0,0,0,.25)); }
.post-thumb .illus, .article-feature .illus{ position:absolute; inset:0; inline-size:100%; block-size:100%; display:block; filter:none; opacity:1; }
.post-thumb::before, .article-feature::before{ display:none; }
.post-body{ padding:1.35rem 1.5rem 1.5rem; display:flex; flex-direction:column; flex:1; }
.post-cat{ display:inline-block; align-self:flex-start; font-family:var(--font-display); font-weight:700; font-size:.72rem; letter-spacing:.06em; color:var(--cyan-700); background:var(--cyan-050); padding:.3rem .7rem; border-radius:999px; margin-bottom:.75rem; }
.post-card h3{ font-size:1.18rem; line-height:1.3; margin-bottom:.5rem; }
.post-card p{ color:var(--ink-soft); font-size:.98rem; flex:1; }
.post-meta{ display:flex; gap:.6rem; align-items:center; margin-block-start:1rem; font-size:.85rem; color:var(--muted); }
.post-meta .dot{ inline-size:4px; block-size:4px; border-radius:50%; background:var(--muted); }

/* ---------- Article page ---------- */
.article-hero{ background:var(--grad-brand); color:#fff; padding-block: clamp(2.5rem,6vw,4rem); position:relative; overflow:hidden; }
.article-hero::before{ content:""; position:absolute; inset:0; background:radial-gradient(70% 120% at 88% 0%, rgba(0,216,224,.22), transparent 55%); }
.article-hero__inner{ position:relative; z-index:1; max-inline-size:64ch; }
.article-hero h1{ color:#fff; margin-block:.6rem .8rem; font-size:clamp(1.8rem,4vw,2.8rem); }
.article-meta{ display:flex; gap:.7rem; align-items:center; color:rgba(255,255,255,.82); font-size:.9rem; flex-wrap:wrap; }
.article-meta .dot{ inline-size:4px; block-size:4px; border-radius:50%; background:rgba(255,255,255,.5); }
.article-cat{ display:inline-block; font-family:var(--font-display); font-weight:700; font-size:.75rem; letter-spacing:.06em; color:var(--navy-900); background:var(--cyan); padding:.32rem .8rem; border-radius:999px; }
.article-feature{ aspect-ratio:21/8; min-block-size:160px; background:var(--grad-brand); border-radius:var(--r-xl); display:grid; place-items:center; position:relative; overflow:hidden; box-shadow:var(--shadow-lg); margin-block-end:2.5rem; }
.article-feature::before{ content:""; position:absolute; inset:0; background:radial-gradient(60% 90% at 75% 20%, rgba(0,216,224,.4), transparent 60%); }
.article-feature svg{ inline-size:clamp(72px,12%,120px); block-size:auto; color:#fff; opacity:.95; position:relative; z-index:1; filter:drop-shadow(0 8px 22px rgba(0,0,0,.25)); }
.article-body{ max-inline-size:74ch; margin-inline:auto; }
.article-body > .lead{ font-size:1.2rem; color:var(--ink); margin-bottom:1.4rem; }
.article-body h2{ font-size:clamp(1.4rem,2.4vw,1.8rem); margin-block:2rem .8rem; }
.article-body h3{ font-size:1.2rem; margin-block:1.4rem .5rem; }
.article-body p{ color:var(--ink-soft); margin-bottom:1.1rem; line-height:1.75; }
.article-body ul{ margin-bottom:1.2rem; display:grid; gap:.5rem; padding:0; }
.article-body ul li{ position:relative; padding-inline-start:1.6rem; color:var(--ink-soft); }
.article-body ul li::before{ content:""; position:absolute; inset-inline-start:0; inset-block-start:.6em; inline-size:8px; block-size:8px; border-radius:2px; background:var(--grad-cyan); }
.article-body strong{ color:var(--navy); }

/* footer contact tiles — bright on the dark footer (not navy-on-navy) */
.site-footer .info-tile b{ color: var(--cyan); font-weight:700; }
.site-footer .info-tile a, .site-footer .info-tile span{ color: rgba(255,255,255,.85); }
.site-footer .info-tile a:hover{ color: var(--cyan); }

/* language visibility */
[data-lang-hide="true"]{ display:none !important; }