
/* OCEANS Brand Identity Redesign 2026
   Navy #0A1929 · Blue #2B74B8 · Orange #F5A623
   Barlow Condensed + Barlow + Noto Kufi Arabic */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:#0A1929;color:#fff;font-family:'Barlow',sans-serif;font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:none;background:none}
:root{
  --navy:#0A1929;--navy-mid:#0D2240;--navy-deep:#0D2C4A;
  --blue:#2B74B8;--blue-light:#4A9EE0;--blue-pale:#D6EAF8;
  --orange:#F5A623;--orange-dk:#D4840A;
  --charcoal:#1C2B3A;
  --b-blue:rgba(43,116,184,.2);--b-blue2:rgba(43,116,184,.12);
  --max:1260px;--nav-h:68px;
}
.wrap{width:min(var(--max),calc(100% - 48px));margin-inline:auto}
.skip-link{position:absolute;top:-100px;left:16px;background:var(--orange);color:var(--navy);padding:10px 18px;font-size:12px;font-weight:600;z-index:9999;transition:top .2s}
.skip-link:focus{top:16px}
#progress-bar{position:fixed;top:0;left:0;height:3px;width:0%;background:linear-gradient(90deg,var(--blue),var(--orange));z-index:1000;pointer-events:none}
/* NAV */
.nav{position:fixed;inset:0 0 auto;height:var(--nav-h);z-index:500;transition:background .4s,backdrop-filter .4s}
.nav.scrolled{background:rgba(10,25,41,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--b-blue)}
.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-brand{flex-shrink:0;display:flex;align-items:center}
.nav-logo{height:40px;width:auto;display:block;transition:filter .4s;filter:brightness(1.05) drop-shadow(0 0 1px rgba(43,116,184,.3))}
.nav-brand:hover .nav-logo{filter:brightness(1.15) drop-shadow(0 0 6px rgba(245,166,35,.4))}
.nav-links{display:flex;align-items:center}
.nav-links a{display:block;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);padding:10px 14px;position:relative;transition:color .3s}
.nav-links a::after{content:'';position:absolute;bottom:4px;left:14px;right:14px;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:center;transition:transform .3s}
.nav-links a:hover,.nav-links a.active{color:#fff}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
.nav-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:14px;color:rgba(255,255,255,.3);direction:rtl}
.nav-cta{flex-shrink:0;background:var(--blue);color:#fff;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:10px 20px;transition:background .3s;min-height:40px;display:flex;align-items:center}
.nav-cta:hover{background:var(--blue-light)}
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:8px;flex-shrink:0}
.nav-burger span{display:block;height:2px;background:#fff;transition:transform .3s,opacity .3s}
.nav-burger span:nth-child(2){width:70%}
.nav-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-drawer{display:none;position:fixed;top:var(--nav-h);left:0;right:0;background:rgba(10,25,41,.98);backdrop-filter:blur(24px);border-bottom:1px solid var(--b-blue);z-index:490;flex-direction:column;padding:4px 0 20px}
.nav-drawer.open{display:flex}
.nav-drawer a{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.45);border-bottom:1px solid rgba(43,116,184,.1);transition:color .25s,background .25s}
.nav-drawer a:hover{color:var(--orange);background:rgba(43,116,184,.06)}
.drawer-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:13px;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.25);direction:rtl}
/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'Barlow',sans-serif;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;padding:13px 24px;min-height:44px;transition:all .3s;cursor:pointer}
.btn:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-light);gap:16px}
.btn-outline{border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.55)}
.btn-outline:hover{border-color:var(--blue);color:var(--blue-light)}
/* TYPOGRAPHY */
.eyebrow{font-size:10px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--orange);display:flex;align-items:center;gap:12px;margin-bottom:18px}
.eyebrow::before{content:'';width:28px;height:2px;background:var(--orange);flex-shrink:0}
.display-1{font-family:'Barlow Condensed',sans-serif;font-size:clamp(40px,6.5vw,86px);font-weight:900;line-height:.95;letter-spacing:-1.5px;color:#fff}
.display-1 em{font-style:italic;font-weight:300;color:var(--orange)}
.h2-bc{font-family:'Barlow Condensed',sans-serif;font-size:clamp(28px,4vw,52px);font-weight:800;letter-spacing:-.5px;line-height:1;color:#fff}
.h2-bc em{font-style:italic;font-weight:300;color:var(--orange)}
.ar{font-family:'Noto Kufi Arabic',sans-serif;direction:rtl}
/* REVEAL */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .75s cubic-bezier(.22,.8,.28,1),transform .75s cubic-bezier(.22,.8,.28,1)}
.reveal.in{opacity:1;transform:none}
/* HERO */
.hero{min-height:100svh;display:grid;align-items:center;padding-top:var(--nav-h);position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 65% at 75% 35%,rgba(43,116,184,.18) 0%,transparent 60%),radial-gradient(ellipse 60% 40% at 20% 80%,rgba(43,116,184,.08) 0%,transparent 55%),linear-gradient(160deg,var(--navy) 0%,#060F1C 100%)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(43,116,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(43,116,184,.07) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(ellipse 70% 70% at 70% 40%,black 10%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse 70% 70% at 70% 40%,black 10%,transparent 70%)}
.hero-wave{position:absolute;top:-60px;right:-100px;width:700px;height:400px;pointer-events:none;opacity:.06}
.hero-layout{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center;padding:80px 0 72px}
.hero-divider{width:48px;height:3px;background:var(--orange);margin:28px 0}
.hero-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:22px;font-weight:600;color:rgba(255,255,255,.55);direction:rtl;text-align:right;line-height:1.6;margin-bottom:16px}
.hero-sub{font-size:14px;font-weight:400;color:rgba(255,255,255,.5);max-width:460px;line-height:1.8;margin-bottom:36px}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap}
/* HERO PANEL */
.hero-panel{background:rgba(13,34,64,.7);border:1px solid var(--b-blue);position:relative;overflow:hidden}
.hero-panel::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--orange))}
.panel-head{padding:22px 24px 16px;border-bottom:1px solid var(--b-blue2)}
.panel-title-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:18px;font-weight:700;color:var(--orange);direction:rtl;text-align:right;display:block;margin-bottom:3px}
.panel-title-en{font-size:9px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.3)}
.metrics{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--b-blue2)}
.metric{background:var(--navy-mid);padding:22px 20px;transition:background .3s}
.metric:hover{background:rgba(43,116,184,.12)}
.metric-n{font-family:'Barlow Condensed',sans-serif;font-size:52px;font-weight:900;color:var(--orange);line-height:1;letter-spacing:-1px;margin-bottom:6px}
.metric-n sup{font-size:22px;vertical-align:super}
.metric-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;font-weight:600;color:rgba(255,255,255,.55);direction:rtl;text-align:right;display:block}
.metric-en{font-size:8.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.25);display:block;margin-top:2px}
.panel-note{padding:16px 24px 20px;border-top:1px solid var(--b-blue2)}
.panel-note-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;color:rgba(255,255,255,.4);direction:rtl;text-align:right;line-height:1.75;display:block;margin-bottom:6px}
.panel-note-en{font-size:12px;color:rgba(255,255,255,.35);line-height:1.75}
/* MARQUEE */
.marquee{overflow:hidden;background:var(--charcoal);border-top:1px solid var(--b-blue);border-bottom:1px solid var(--b-blue);padding:13px 0;user-select:none}
.marquee-track{display:flex;animation:scroll-x 36s linear infinite;width:max-content}
.marquee-track:hover{animation-play-state:paused}
.m-item{display:inline-flex;align-items:center;gap:14px;padding:0 26px;white-space:nowrap;flex-shrink:0}
.m-item .m-en{font-size:9px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.m-item .m-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:11px;color:rgba(255,255,255,.2);direction:rtl}
.m-dot{width:4px;height:4px;background:var(--orange);border-radius:50%;flex-shrink:0;opacity:.7}
@keyframes scroll-x{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* SECTIONS */
.section{padding:92px 0}
.bg-charcoal{background:var(--charcoal);border-top:1px solid var(--b-blue);border-bottom:1px solid var(--b-blue)}
.bg-navy-mid{background:var(--navy-mid)}
.sec-header{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:48px;flex-wrap:wrap}
.sec-header-note{font-size:13px;color:rgba(255,255,255,.4);max-width:240px;text-align:right;line-height:1.7}
.sec-header-note .ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;color:rgba(255,255,255,.35);display:block;margin-bottom:3px}
/* ABOUT CARDS */
.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--b-blue);border:1px solid var(--b-blue)}
.about-card{background:var(--navy-mid);padding:36px 28px;position:relative;overflow:hidden;transition:background .35s}
.about-card:hover{background:rgba(43,116,184,.12)}
.about-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .5s}
.about-card:hover::after{transform:scaleX(1)}
.about-num{font-family:'Barlow Condensed',sans-serif;font-size:80px;font-weight:900;color:rgba(43,116,184,.12);line-height:1;letter-spacing:-2px;margin-bottom:16px}
.about-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:22px;font-weight:700;color:var(--orange);direction:rtl;text-align:right;display:block;margin-bottom:5px}
.about-en{font-size:9px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--blue-light);display:block;margin-bottom:16px}
.about-card p{font-size:13.5px;color:rgba(255,255,255,.55);line-height:1.8}
/* DIVISIONS */
.div-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--b-blue);border:1px solid var(--b-blue)}
.div-cell{background:var(--navy-mid);padding:28px 20px 24px;min-height:260px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:background .35s;color:inherit}
.div-cell::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .5s}
.div-cell:hover{background:rgba(43,116,184,.1)}
.div-cell:hover::before{transform:scaleX(1)}
.div-num{font-family:'Barlow Condensed',sans-serif;font-size:64px;font-weight:900;color:rgba(43,116,184,.14);line-height:1;letter-spacing:-2px;margin-bottom:auto}
.div-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:14px;font-weight:700;color:#fff;direction:rtl;text-align:right;margin-bottom:5px;display:block}
.div-en{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--blue-light);display:block;margin-bottom:9px}
.div-desc{font-size:11.5px;color:rgba(255,255,255,.4);line-height:1.65}
.div-arrow{position:absolute;bottom:20px;right:18px;font-size:16px;color:var(--orange);opacity:0;transform:translate(-4px,4px);transition:opacity .3s,transform .3s}
.div-cell:hover .div-arrow{opacity:1;transform:none}
/* CLIENT WALL */
.client-wall{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--b-blue);border:1px solid var(--b-blue)}
.client-card{background:var(--navy);min-height:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 14px;position:relative;overflow:hidden;transition:background .35s;cursor:default}
.client-card::after{content:'';position:absolute;bottom:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--blue),var(--orange));transition:width .45s}
.client-card:hover{background:rgba(43,116,184,.1)}
.client-card:hover::after{width:100%}
.client-img{max-width:112px;max-height:42px;object-fit:contain;filter:brightness(0) invert(1);opacity:.45;transition:opacity .35s,transform .35s}
.client-card:hover .client-img{opacity:0;transform:translateY(-10px) scale(.85)}
.client-names{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s;pointer-events:none;gap:5px}
.client-card:hover .client-names{opacity:1;transform:none}
.client-name-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:13px;font-weight:700;color:var(--orange);direction:rtl;text-align:center;display:block}
.client-name-en{font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);text-align:center;display:block}
/* TIMELINE */
.timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--b-blue);border:1px solid var(--b-blue)}
.tl-node{background:var(--navy-mid);padding:24px 18px;position:relative;overflow:hidden;transition:background .3s}
.tl-node:hover{background:rgba(43,116,184,.1)}
.tl-node::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .45s}
.tl-node:hover::before{transform:scaleX(1)}
.tl-year{font-family:'Barlow Condensed',sans-serif;font-size:42px;font-weight:900;color:var(--blue);line-height:1;letter-spacing:-1px;margin-bottom:10px}
.tl-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;font-weight:600;color:rgba(255,255,255,.6);direction:rtl;text-align:right;display:block;line-height:1.6}
.tl-en{font-size:11px;color:rgba(255,255,255,.35);line-height:1.6;margin-top:4px}
/* CTA */
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.cta-row{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-top:1px solid var(--b-blue)}
.cta-lbl{font-size:9px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--blue-light)}
.cta-val{font-size:13px;color:rgba(255,255,255,.6);text-align:right}
.cta-val .ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;display:block;margin-bottom:2px}
/* FOOTER */
.footer{background:#06111D;border-top:1px solid var(--b-blue)}
.footer-top{display:grid;grid-template-columns:260px 1fr 1fr 1fr;gap:1px;background:var(--b-blue);border-bottom:1px solid var(--b-blue)}
.footer-col{padding:40px 28px}
.footer-col:first-child{background:var(--navy-mid)}
.footer-col:not(:first-child){background:#060F1C}
.footer-logo{height:32px;width:auto;display:block;margin-bottom:16px;filter:brightness(1.05)}
.footer-tagline-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;color:rgba(255,255,255,.3);direction:rtl;text-align:right;line-height:1.8;display:block;margin-bottom:5px}
.footer-tagline-en{font-size:11px;color:rgba(255,255,255,.2);line-height:1.7}
.footer-col-hd{font-size:9px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--orange);margin-bottom:18px;display:flex;justify-content:space-between;align-items:center}
.footer-col-hd-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:12px;letter-spacing:0;color:var(--orange)}
.footer-links{display:flex;flex-direction:column;gap:10px}
.footer-links a{font-size:12px;color:rgba(255,255,255,.35);display:flex;justify-content:space-between;align-items:center;transition:color .3s}
.footer-links a:hover{color:var(--blue-light)}
.link-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:11px;direction:rtl;color:rgba(255,255,255,.2)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;gap:20px;flex-wrap:wrap}
.footer-copy{font-size:10px;color:rgba(255,255,255,.2);letter-spacing:.12em}
.footer-copy-ar{font-family:'Noto Kufi Arabic',sans-serif;font-size:11px;color:rgba(255,255,255,.2);direction:rtl}
.footer-ext{display:flex;gap:22px}
.footer-ext a{font-size:10px;color:rgba(255,255,255,.25);letter-spacing:.14em;transition:color .3s}
.footer-ext a:hover{color:var(--orange)}
/* RESPONSIVE */
@media(max-width:1100px){.div-grid{grid-template-columns:repeat(3,1fr)}.timeline{grid-template-columns:repeat(3,1fr)}.footer-top{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.nav-links,.nav-ar,.nav-cta{display:none}.nav-burger{display:flex}.hero-layout{grid-template-columns:1fr;gap:44px;padding:60px 0}.about-grid{grid-template-columns:1fr}.cta-grid{grid-template-columns:1fr;gap:40px}}
@media(max-width:640px){:root{--nav-h:62px}.wrap{width:calc(100% - 32px)}.div-grid{grid-template-columns:1fr 1fr}.client-wall{grid-template-columns:1fr 1fr}.timeline{grid-template-columns:repeat(2,1fr)}.footer-top{grid-template-columns:1fr 1fr}.hero-btns{flex-direction:column}.hero-btns .btn{width:100%;justify-content:center}}
@media(max-width:420px){.div-grid{grid-template-columns:1fr}.footer-top{grid-template-columns:1fr}}
a:focus-visible,button:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.marquee-track{animation:none}}

/* ══════════════════════════════════════════════════
   SHARED PAGE COMPONENTS
══════════════════════════════════════════════════ */

/* Page hero (inner pages) */
.page-hero {
  padding: calc(var(--nav-h) + 72px) 0 64px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--b-blue);
}
.page-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 60% at 75% 40%, rgba(43,116,184,.15), transparent 60%);
  pointer-events: none;
}
.page-hero-inner { position: relative; z-index: 1; }
.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-size: 9px; font-weight: 700; letter-spacing: .24em;
  text-transform: uppercase; color: rgba(255,255,255,.3);
  margin-bottom: 28px;
}
.breadcrumb .sep { color: var(--orange); opacity: .5; }
.breadcrumb a { color: rgba(255,255,255,.3); transition: color .3s; }
.breadcrumb a:hover { color: var(--blue-light); }
.page-hero-ar {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: clamp(20px, 3vw, 38px);
  font-weight: 700;
  direction: rtl; text-align: right;
  color: rgba(255,255,255,.6);
  margin-bottom: 10px;
  display: block;
}
.page-hero-en {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(14px, 1.8vw, 20px);
  font-weight: 300; font-style: italic;
  color: var(--orange);
  margin-bottom: 18px;
  display: block;
}
.page-hero-desc {
  font-size: 14px; color: rgba(255,255,255,.5);
  max-width: 600px; line-height: 1.85; font-weight: 400;
}

/* KPI strip */
.kpi-strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: var(--b-blue);
  border: 1px solid var(--b-blue); margin-top: 52px;
}
.kpi { background: var(--navy-mid); padding: 20px 18px; }
.kpi-n {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 44px; font-weight: 900;
  color: var(--orange); line-height: 1; letter-spacing: -1px; margin-bottom: 6px;
}
.kpi-n sup { font-size: 20px; vertical-align: super; }
.kpi-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.55); direction: rtl; text-align: right; display: block; }
.kpi-en { font-size: 8.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.25); display: block; margin-top: 2px; }

/* Service cells */
.svc-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue);
}
.svc-cell {
  background: var(--navy-mid); padding: 34px 30px;
  position: relative; overflow: hidden; transition: background .3s;
}
.svc-cell:hover { background: rgba(43,116,184,.12); }
.svc-cell::before {
  content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--blue), var(--orange));
  transform: scaleY(0); transform-origin: top; transition: transform .45s;
}
.svc-cell:hover::before { transform: scaleY(1); }
.svc-num {
  font-size: 9px; font-weight: 700; letter-spacing: .28em;
  text-transform: uppercase; color: var(--blue-light); margin-bottom: 14px;
}
.svc-ar {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 26px; font-weight: 700; color: var(--orange);
  direction: rtl; text-align: right; margin-bottom: 8px; line-height: 1.2; display: block;
}
.svc-en {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 20px; font-weight: 300; font-style: italic;
  color: rgba(255,255,255,.55); margin-bottom: 12px; display: block;
}
.svc-cell p, .svc-cell ul { font-size: 13.5px; color: rgba(255,255,255,.5); line-height: 1.8; }
.svc-cell ul { padding-left: 18px; margin-top: 8px; }
.svc-cell li { margin-bottom: 5px; }
.svc-cell a.svc-link {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 14px;
  font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--blue-light); transition: color .3s, gap .3s;
}
.svc-cell a.svc-link:hover { color: var(--orange); gap: 14px; }

/* Full-width division card (for divisions page) */
.div-full { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue); }
.div-full-cell {
  background: var(--navy-mid); padding: 44px 40px;
  display: grid; grid-template-columns: 80px 1fr; gap: 28px; align-items: start;
  position: relative; overflow: hidden; transition: background .4s;
  color: inherit; text-decoration: none;
}
.div-full-cell:hover { background: rgba(43,116,184,.1); }
.div-full-cell::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--blue), var(--orange));
  transform: scaleX(0); transform-origin: left; transition: transform .5s;
}
.div-full-cell:hover::before { transform: scaleX(1); }
.div-full-cell.full-row { grid-column: 1 / -1; }
.dfc-big-num {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 80px; font-weight: 900;
  color: rgba(43,116,184,.14); line-height: 1; letter-spacing: -2px;
}
.dfc-tag { font-size: 9px; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: var(--blue-light); margin-bottom: 8px; display: block; }
.dfc-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 28px; font-weight: 700; color: var(--orange); direction: rtl; text-align: right; display: block; margin-bottom: 5px; line-height: 1.2; }
.dfc-en { font-family: 'Barlow Condensed', sans-serif; font-size: 22px; font-weight: 300; font-style: italic; color: rgba(255,255,255,.55); display: block; margin-bottom: 14px; }
.dfc-body { font-size: 14px; color: rgba(255,255,255,.5); line-height: 1.8; margin-bottom: 18px; }
.dfc-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.dfc-pill { font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.35); padding: 5px 12px; border: 1px solid var(--b-blue); transition: border-color .3s, color .3s; }
.div-full-cell:hover .dfc-pill { border-color: rgba(43,116,184,.35); color: rgba(255,255,255,.55); }
.dfc-cta { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); transition: gap .3s; }
.div-full-cell:hover .dfc-cta { gap: 14px; }

/* Pullquote */
.pullquote {
  border-left: 3px solid var(--orange);
  padding: 6px 0 6px 28px; margin: 44px 0;
}
.pullquote-ar {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: clamp(16px, 2.2vw, 24px); font-weight: 400;
  color: rgba(255,255,255,.75); direction: rtl; text-align: right;
  line-height: 1.65; display: block; margin-bottom: 8px;
}
.pullquote-en {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(14px, 1.8vw, 20px);
  font-style: italic; font-weight: 300; color: rgba(255,255,255,.4);
}

/* Brand grid (F&B) */
.brand-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue); }
.brand-cell {
  background: var(--navy-mid); padding: 36px 24px;
  min-height: 220px; display: flex; flex-direction: column;
  position: relative; overflow: hidden; transition: background .4s;
}
.brand-cell:hover { background: rgba(43,116,184,.12); }
.brand-cell::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--blue), var(--orange)); transform: scaleX(0); transform-origin: left; transition: transform .5s; }
.brand-cell:hover::before { transform: scaleX(1); }
.brand-initial { font-family: 'Barlow Condensed', sans-serif; font-size: 80px; font-weight: 900; color: rgba(43,116,184,.12); line-height: 1; margin-bottom: auto; letter-spacing: -2px; }
.brand-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 18px; font-weight: 700; color: var(--orange); direction: rtl; text-align: right; display: block; margin-bottom: 4px; }
.brand-en { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 300; font-style: italic; color: rgba(255,255,255,.5); margin-bottom: 8px; display: block; }
.brand-desc { font-size: 12px; color: rgba(255,255,255,.4); line-height: 1.65; }

/* Market grid (Real Estate) */
.market-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue); }
.market-cell { background: var(--navy-deep); padding: 32px 24px; position: relative; overflow: hidden; transition: background .3s; }
.market-cell:hover { background: rgba(43,116,184,.12); }
.market-cell::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--blue), var(--orange)); transform: scaleX(0); transform-origin: left; transition: transform .5s; }
.market-cell:hover::before { transform: scaleX(1); }
.market-name { font-family: 'Barlow Condensed', sans-serif; font-size: 48px; font-weight: 900; color: var(--blue); line-height: 1; letter-spacing: -1px; margin-bottom: 8px; }
.market-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.55); direction: rtl; text-align: right; display: block; margin-bottom: 10px; }
.market-desc { font-size: 13px; color: rgba(255,255,255,.4); line-height: 1.7; }

/* Approach grid (Consulting) */
.approach-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue); }
.approach-cell { background: var(--navy-mid); padding: 34px 28px; transition: background .3s; }
.approach-cell:hover { background: rgba(43,116,184,.12); }
.approach-num { font-family: 'Barlow Condensed', sans-serif; font-size: 80px; font-weight: 900; color: rgba(43,116,184,.1); line-height: 1; margin-bottom: 18px; letter-spacing: -2px; }
.approach-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 22px; font-weight: 700; color: var(--orange); direction: rtl; text-align: right; display: block; margin-bottom: 6px; }
.approach-en { font-size: 9px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--blue-light); display: block; margin-bottom: 14px; }
.approach-cell p { font-size: 13.5px; color: rgba(255,255,255,.5); line-height: 1.8; }

/* Pillar cards (About values) */
.pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue); }
.pillar { background: var(--navy-mid); padding: 34px 26px; position: relative; overflow: hidden; transition: background .3s; }
.pillar:hover { background: rgba(43,116,184,.12); }
.pillar::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--blue), var(--orange)); transform: scaleX(0); transform-origin: left; transition: transform .5s; }
.pillar:hover::after { transform: scaleX(1); }
.pillar-num { font-family: 'Barlow Condensed', sans-serif; font-size: 64px; font-weight: 900; color: rgba(43,116,184,.1); line-height: 1; margin-bottom: 22px; letter-spacing: -2px; }
.pillar-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 22px; font-weight: 700; color: var(--orange); direction: rtl; text-align: right; display: block; margin-bottom: 5px; }
.pillar-en { font-size: 9px; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: var(--blue-light); display: block; margin-bottom: 14px; }
.pillar p { font-size: 13px; color: rgba(255,255,255,.5); line-height: 1.8; }

/* Contact layout */
.contact-layout { display: grid; grid-template-columns: 1fr 1.3fr; gap: 1px; background: var(--b-blue); border: 1px solid var(--b-blue); }
.contact-info-panel { background: var(--navy-mid); padding: 48px 36px; }
.contact-form-wrap { background: var(--navy); padding: 48px 36px; }
.contact-title-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 34px; font-weight: 700; color: var(--orange); direction: rtl; text-align: right; display: block; line-height: 1.2; margin-bottom: 6px; }
.contact-title-en { font-family: 'Barlow Condensed', sans-serif; font-size: 26px; font-weight: 300; font-style: italic; color: rgba(255,255,255,.5); margin-bottom: 36px; display: block; }
.contact-row { border-top: 1px solid var(--b-blue); padding: 15px 0; }
.contact-lbl { font-size: 9px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--blue-light); display: block; margin-bottom: 5px; }
.contact-lbl-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 10px; font-weight: 700; color: var(--blue-light); direction: rtl; text-align: right; display: block; margin-bottom: 3px; }
.contact-val { font-size: 13.5px; color: rgba(255,255,255,.6); }
.contact-val a { transition: color .3s; }
.contact-val a:hover { color: var(--orange); }
/* Form */
.f-group { margin-bottom: 14px; }
.f-label { display: flex; justify-content: space-between; align-items: center; margin-bottom: 7px; }
.f-label-en { font-size: 9px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.35); }
.f-label-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 11px; font-weight: 600; color: rgba(255,255,255,.3); direction: rtl; }
.f-input {
  width: 100%; background: rgba(43,116,184,.06);
  border: 1px solid var(--b-blue); color: #fff;
  padding: 13px 16px; font-size: 13px; font-family: 'Barlow', sans-serif;
  outline: none; transition: border-color .3s, background .3s;
  border-radius: 0; appearance: none; min-height: 44px;
}
.f-input:focus { border-color: var(--blue); background: rgba(43,116,184,.1); }
.f-input::placeholder { color: rgba(255,255,255,.25); }
textarea.f-input { min-height: 130px; resize: vertical; }
.f-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hidden { display: none !important; }

/* Industry tags (Consulting) */
.industry-wrap { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.ind-pill { font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.4); padding: 7px 14px; border: 1px solid var(--b-blue); transition: border-color .3s, color .3s, background .3s; }
.ind-pill:hover { border-color: var(--blue); color: var(--blue-light); background: rgba(43,116,184,.08); }

/* Sticky aside nav (About) */
.content-layout { display: grid; grid-template-columns: 200px 1fr; gap: 64px; align-items: start; }
.sticky-nav { position: sticky; top: 96px; border-left: 3px solid var(--orange); padding-left: 20px; }
.sticky-nav a { display: block; padding: 10px 0; font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.3); transition: color .3s; }
.sticky-nav a:hover { color: var(--orange); }
.sticky-nav .snav-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 12px; letter-spacing: 0; text-transform: none; color: rgba(255,255,255,.2); direction: rtl; margin-top: 2px; display: block; }
.editorial h2 { font-family: 'Barlow Condensed', sans-serif; font-size: 44px; font-weight: 800; letter-spacing: -.5px; margin: 0 0 20px; }
.editorial .ar-lead { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 26px; font-weight: 600; direction: rtl; text-align: right; color: rgba(255,255,255,.5); line-height: 1.5; display: block; margin-bottom: 8px; }
.editorial h3 { font-size: 9px; font-weight: 700; letter-spacing: .32em; text-transform: uppercase; color: var(--orange); margin: 44px 0 16px; }
.editorial p { font-size: 14px; color: rgba(255,255,255,.5); line-height: 1.85; margin-bottom: 16px; }
.reg-box { direction: rtl; text-align: right; padding: 20px 24px; border: 1px solid rgba(245,166,35,.2); background: rgba(245,166,35,.04); margin: 28px 0; }
.reg-ar { font-family: 'Noto Kufi Arabic', sans-serif; font-size: 18px; font-weight: 700; color: #fff; line-height: 1.7; display: block; }
.reg-en { font-size: 11px; color: rgba(255,255,255,.3); letter-spacing: .1em; margin-top: 6px; display: block; }

/* Extra responsive for inner pages */
@media (max-width: 900px) {
  .contact-layout { grid-template-columns: 1fr; }
  .svc-grid { grid-template-columns: 1fr; }
  .brand-grid { grid-template-columns: 1fr 1fr; }
  .market-grid { grid-template-columns: 1fr; }
  .approach-grid { grid-template-columns: 1fr; }
  .pillars { grid-template-columns: 1fr 1fr; }
  .div-full { grid-template-columns: 1fr; }
  .div-full-cell.full-row { grid-column: auto; }
  .div-full-cell { grid-template-columns: 52px 1fr; padding: 32px 24px; }
  .content-layout { grid-template-columns: 1fr; }
  .sticky-nav { position: static; display: flex; flex-wrap: wrap; gap: 0; margin-bottom: 32px; border-left: none; border-top: 3px solid var(--orange); padding: 16px 0 0; }
  .kpi-strip { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .pillars { grid-template-columns: 1fr; }
  .brand-grid { grid-template-columns: 1fr; }
  .f-2col { grid-template-columns: 1fr; }
  .kpi-strip { grid-template-columns: 1fr 1fr; }
  .dfc-big-num { font-size: 52px; }
}

/* ══════════════════════════════════════════════════
   SERVICES SPOTLIGHT (index — cleaning & security)
══════════════════════════════════════════════════ */
.services-spotlight {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--b-blue);
  border: 1px solid var(--b-blue);
  margin-top: 48px;
}
.spotlight-card {
  position: relative;
  min-height: 380px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.spotlight-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.22,.8,.28,1), filter .7s;
  filter: brightness(.45) saturate(.7);
}
.spotlight-card:hover .spotlight-img {
  transform: scale(1.04);
  filter: brightness(.55) saturate(.9);
}
.spotlight-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(10,25,41,.95) 0%, rgba(10,25,41,.5) 50%, transparent 100%);
  pointer-events: none;
}
/* Blue tint overlay per card */
.spotlight-card.cleaning .spotlight-overlay {
  background: linear-gradient(0deg, rgba(10,25,41,.96) 0%, rgba(13,44,74,.55) 55%, transparent 100%);
}
.spotlight-card.security .spotlight-overlay {
  background: linear-gradient(0deg, rgba(10,25,41,.96) 0%, rgba(43,116,184,.25) 55%, transparent 100%);
}
.spotlight-content {
  position: relative; z-index: 2;
  padding: 32px 32px 36px;
}
.spotlight-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--orange);
  background: rgba(245,166,35,.1);
  border: 1px solid rgba(245,166,35,.25);
  padding: 5px 12px;
  margin-bottom: 14px;
}
.spotlight-badge.sec {
  color: var(--blue-light);
  background: rgba(43,116,184,.1);
  border-color: rgba(43,116,184,.3);
}
.spotlight-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(28px, 3.5vw, 46px);
  font-weight: 900;
  letter-spacing: -.5px;
  line-height: 1;
  color: #fff;
  margin-bottom: 10px;
}
.spotlight-ar {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: rgba(255,255,255,.5);
  direction: rtl;
  text-align: right;
  display: block;
  margin-bottom: 14px;
}
.spotlight-desc {
  font-size: 13.5px;
  color: rgba(255,255,255,.6);
  line-height: 1.75;
  margin-bottom: 22px;
  max-width: 400px;
}
.spotlight-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 22px;
}
.spotlight-pill {
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  padding: 4px 10px;
  border: 1px solid rgba(255,255,255,.15);
}
.spotlight-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--orange);
  transition: gap .3s;
}
.spotlight-link.sec { color: var(--blue-light); }
.spotlight-card:hover .spotlight-link { gap: 15px; }

/* ══════════════════════════════════════════════════
   TESTIMONIALS STRIP
══════════════════════════════════════════════════ */
.testimonials {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--b-blue);
  border: 1px solid var(--b-blue);
}
.testi-card {
  background: var(--navy-mid);
  padding: 32px 28px;
  position: relative;
  transition: background .3s;
}
.testi-card:hover { background: rgba(43,116,184,.1); }
.testi-quote {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 64px;
  font-weight: 900;
  color: var(--orange);
  opacity: .25;
  line-height: .7;
  margin-bottom: 16px;
}
.testi-text {
  font-size: 14px;
  color: rgba(255,255,255,.65);
  line-height: 1.8;
  font-style: italic;
  margin-bottom: 20px;
}
.testi-divider {
  width: 32px; height: 2px;
  background: var(--orange);
  margin-bottom: 14px;
}
.testi-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  display: block;
  margin-bottom: 3px;
}
.testi-company {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--blue-light);
}

/* ══════════════════════════════════════════════════
   INSTAGRAM EMBED STRIP
══════════════════════════════════════════════════ */
.insta-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: 28px 32px;
  background: var(--navy-mid);
  border: 1px solid var(--b-blue);
  margin-top: 48px;
  flex-wrap: wrap;
}
.insta-left {
  display: flex;
  align-items: center;
  gap: 16px;
}
.insta-icon {
  width: 44px; height: 44px;
  background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  display: grid; place-items: center;
  flex-shrink: 0;
  font-size: 20px;
}
.insta-handle {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  display: block;
}
.insta-sub {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.35);
}
.insta-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  background: linear-gradient(135deg, #f09433, #dc2743, #bc1888);
  color: #fff;
  padding: 12px 22px;
  min-height: 44px;
  transition: opacity .3s, gap .3s;
}
.insta-cta:hover { opacity: .88; gap: 15px; }

/* ══════════════════════════════════════════════════
   SOCIAL ICONS (contact page)
══════════════════════════════════════════════════ */
.social-row {
  display: flex;
  gap: 10px;
  margin-top: 24px;
  flex-wrap: wrap;
}
.social-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 10px 16px;
  border: 1px solid var(--b-blue);
  color: rgba(255,255,255,.5);
  transition: all .3s;
  min-height: 40px;
}
.social-btn:hover { border-color: var(--blue); color: #fff; }
.social-btn.insta:hover {
  border-color: #dc2743;
  background: rgba(220,39,67,.08);
  color: #fff;
}
.social-btn.wa:hover {
  border-color: #25d366;
  background: rgba(37,211,102,.08);
  color: #fff;
}
.social-btn.li:hover {
  border-color: #0a66c2;
  background: rgba(10,102,194,.08);
  color: #fff;
}
.social-icon { width: 16px; height: 16px; flex-shrink: 0; }

/* ══════════════════════════════════════════════════
   EMAIL ICON (contact — obfuscated)
══════════════════════════════════════════════════ */
.email-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 13px;
  color: var(--orange);
  padding: 8px 0;
  transition: opacity .3s;
}
.email-btn:hover { opacity: .78; }
.email-btn svg { flex-shrink: 0; }

/* ══════════════════════════════════════════════════
   HERO — Kuwait image bg option
══════════════════════════════════════════════════ */
.hero-img-bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(.22) saturate(.6);
  z-index: 0;
}

/* ══════════════════════════════════════════════════
   SELECT STYLING (form — blue font)
══════════════════════════════════════════════════ */
select.f-input { color: var(--blue-light); }
select.f-input option { color: #fff; background: var(--navy-mid); }

/* ══════════════════════════════════════════════════
   RESPONSIVE additions
══════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .services-spotlight { grid-template-columns: 1fr; }
  .testimonials { grid-template-columns: 1fr; }
  .spotlight-card { min-height: 320px; }
}
@media (max-width: 640px) {
  .insta-strip { flex-direction: column; align-items: flex-start; }
}
