/* ==========================================================================
   Bushnaq Group — Design System
   Palette: deep navy (primary), warm gold (accent), warm off-white (bg)
   Type: Fraunces (display/serif) for headings, Inter for body
   ========================================================================== */

:root{
  --navy-950:#0b1420;
  --navy-900:#0f1b2d;
  --navy-800:#152741;
  --navy-700:#1d3557;
  --navy-600:#2b4a75;
  --gold-500:#c9a227;
  --gold-400:#d9b955;
  --gold-100:#f4e9c9;
  --off-white:#f7f6f2;
  --paper:#ffffff;
  --ink-900:#181b20;
  --ink-700:#3c4149;
  --ink-500:#636972;
  --ink-300:#9ba0a8;
  --line:#e4e1da;
  --radius-sm:6px;
  --radius-md:14px;
  --radius-lg:28px;
  --shadow-sm:0 2px 10px rgba(15,27,45,0.06);
  --shadow-md:0 12px 40px rgba(15,27,45,0.12);
  --shadow-lg:0 24px 70px rgba(15,27,45,0.18);
  --container:1220px;
  --nav-h:84px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color:var(--ink-900);
  background:var(--off-white);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{
  font-family:'Fraunces', Georgia, serif;
  font-weight:600;
  line-height:1.15;
  margin:0 0 .5em;
  letter-spacing:-0.01em;
  color:var(--navy-900);
}
p{ margin:0 0 1em; color:var(--ink-700); }
.container{ max-width:var(--container); margin:0 auto; padding:0 32px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-500); margin-bottom:16px;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--gold-500); display:inline-block; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 30px; border-radius:999px; font-weight:600; font-size:.94rem;
  border:1px solid transparent; cursor:pointer; transition:all .25s ease;
  white-space:nowrap;
}
.btn-primary{ background:var(--navy-900); color:#fff; }
.btn-primary:hover{ background:var(--gold-500); color:var(--navy-950); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-gold{ background:var(--gold-500); color:var(--navy-950); }
.btn-gold:hover{ background:var(--gold-400); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-outline{ background:transparent; border-color:rgba(255,255,255,.5); color:#fff; }
.btn-outline:hover{ background:rgba(255,255,255,.12); border-color:#fff; }
.btn-outline-dark{ background:transparent; border-color:var(--navy-900); color:var(--navy-900); }
.btn-outline-dark:hover{ background:var(--navy-900); color:#fff; }
.btn-sm{ padding:10px 20px; font-size:.82rem; }

/* ---------- Navbar ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--nav-h);
  display:flex; align-items:center;
  background:rgba(11,20,32,0.0);
  transition:background .3s ease, box-shadow .3s ease, height .3s ease;
}
.nav.is-scrolled, .nav.is-solid{
  background:rgba(11,20,32,0.96);
  backdrop-filter:blur(10px);
  box-shadow:0 4px 24px rgba(0,0,0,.12);
  height:72px;
}
.nav .container{ display:flex; align-items:center; justify-content:space-between; width:100%; }
.brand{ display:flex; align-items:center; gap:12px; color:#fff; }
.brand-mark{
  width:40px; height:40px; border-radius:10px;
  background:linear-gradient(135deg,var(--gold-400),var(--gold-500) 60%,var(--navy-700));
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:700; color:var(--navy-950); font-size:1.05rem;
}
.brand-name{ font-family:'Fraunces',serif; font-weight:600; font-size:1.12rem; letter-spacing:.01em; }
.brand-name span{ display:block; font-family:'Inter',sans-serif; font-weight:500; font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-400); margin-top:2px; }

.nav-links{ display:flex; align-items:center; gap:38px; }
.nav-links a{
  color:rgba(255,255,255,.82); font-size:.92rem; font-weight:500; position:relative; padding:6px 0;
}
.nav-links a.active, .nav-links a:hover{ color:#fff; }
.nav-links a.active::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--gold-500);
}
.nav-cta{ display:flex; align-items:center; gap:16px; }
.lang-toggle{
  font-size:.78rem; font-weight:700; color:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.28);
  padding:7px 13px; border-radius:999px;
}
.lang-toggle:hover{ color:#fff; border-color:#fff; }
.nav-burger{ display:none; width:40px; height:40px; border-radius:8px; border:1px solid rgba(255,255,255,.3); color:#fff; align-items:center; justify-content:center; cursor:pointer; }

/* ---------- Hero ---------- */
.hero{
  position:relative; overflow:hidden;
  padding:calc(var(--nav-h) + 120px) 0 120px;
  background:radial-gradient(ellipse 120% 90% at 20% -10%, var(--navy-700) 0%, var(--navy-900) 45%, var(--navy-950) 100%);
  color:#fff;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 82% 18%, rgba(201,162,39,.22), transparent 42%),
    radial-gradient(circle at 95% 85%, rgba(201,162,39,.10), transparent 40%);
  pointer-events:none;
}
.hero-pattern{
  position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(to bottom, black, transparent 85%);
}
.hero .container{ position:relative; z-index:2; }
.hero h1{ color:#fff; font-size:clamp(2.4rem, 4.6vw, 4.1rem); max-width:820px; }
.hero .lead{ color:rgba(255,255,255,.78); font-size:1.18rem; max-width:640px; margin-bottom:36px; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
.hero-sub{ min-height:auto; padding:calc(var(--nav-h) + 84px) 0 90px; }
.hero-sub h1{ font-size:clamp(2rem, 3.6vw, 3rem); }
.breadcrumb{ font-size:.85rem; color:rgba(255,255,255,.6); margin-bottom:18px; }
.breadcrumb a:hover{ color:#fff; }

/* stat strip under hero */
.stat-strip{ background:var(--navy-950); border-top:1px solid rgba(255,255,255,.08); }
.stat-strip .container{ display:flex; flex-wrap:wrap; gap:40px; padding:34px 32px; }
.stat{ color:#fff; }
.stat b{ display:block; font-family:'Fraunces',serif; font-size:1.9rem; color:var(--gold-400); }
.stat span{ font-size:.82rem; color:rgba(255,255,255,.6); }

/* ---------- Sections ---------- */
section{ padding:110px 0; }
.section-tight{ padding:80px 0; }
.section-head{ max-width:680px; margin-bottom:56px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head h2{ font-size:clamp(1.8rem, 3vw, 2.5rem); }
.bg-navy{ background:var(--navy-900); color:#fff; }
.bg-navy h2, .bg-navy h3{ color:#fff; }
.bg-navy p{ color:rgba(255,255,255,.72); }
.bg-paper{ background:var(--paper); }

/* ---------- Sector Grid ---------- */
.sector-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.sector-card{
  position:relative; border-radius:var(--radius-md); overflow:hidden; background:var(--navy-900);
  min-height:340px; display:flex; flex-direction:column; justify-content:flex-end;
  padding:32px; box-shadow:var(--shadow-sm); transition:transform .35s ease, box-shadow .35s ease;
}
.sector-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.sector-card .ph-bg{ position:absolute; inset:0; z-index:0; }
.sector-card .card-overlay{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(11,20,32,0) 20%, rgba(11,20,32,.92) 100%);
}
.sector-card .card-content{ position:relative; z-index:2; color:#fff; }
.sector-card .tag{ font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-400); margin-bottom:8px; display:block;}
.sector-card h3{ color:#fff; font-size:1.35rem; margin-bottom:8px; }
.sector-card p{ color:rgba(255,255,255,.72); font-size:.92rem; margin-bottom:16px; }
.sector-card .card-link{ font-size:.85rem; font-weight:600; color:var(--gold-400); display:inline-flex; align-items:center; gap:6px; }
.sector-card .card-link svg{ transition:transform .25s ease; }
.sector-card:hover .card-link svg{ transform:translateX(4px); }

/* placeholder art backgrounds — one distinct duotone per sector, swap with real photos later */
.ph-business{ background:linear-gradient(135deg,#1d3557 0%,#0f1b2d 60%), repeating-linear-gradient(45deg, rgba(201,162,39,.10) 0 2px, transparent 2px 26px); background-blend-mode:overlay; }
.ph-fuel{ background:linear-gradient(135deg,#20344f 0%,#0b1420 65%), repeating-linear-gradient(90deg, rgba(201,162,39,.10) 0 2px, transparent 2px 22px); background-blend-mode:overlay; }
.ph-agri{ background:linear-gradient(135deg,#2b4a3a 0%,#0f1b2d 60%), radial-gradient(circle at 70% 30%, rgba(154,196,90,.25), transparent 55%); }
.ph-health{ background:linear-gradient(135deg,#1d3557 0%,#0f1b2d 60%), radial-gradient(circle at 75% 25%, rgba(120,190,200,.22), transparent 55%); }
.ph-hotel{ background:linear-gradient(135deg,#3a2f52 0%,#0f1b2d 60%), radial-gradient(circle at 70% 25%, rgba(201,162,39,.28), transparent 55%); }
.ph-generic{ background:linear-gradient(135deg,var(--navy-700),var(--navy-950)); }

.ph-note{
  position:absolute; bottom:10px; right:10px; z-index:2;
  font-size:.62rem; letter-spacing:.06em; text-transform:uppercase;
  color:rgba(255,255,255,.55); background:rgba(0,0,0,.28); padding:4px 8px; border-radius:4px;
  pointer-events:none;
}

/* ---------- Value / Feature list ---------- */
.value-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.value-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-md); padding:34px; }
.value-icon{
  width:52px; height:52px; border-radius:12px; background:var(--navy-900);
  display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--gold-400);
}
.value-card h3{ font-size:1.15rem; margin-bottom:10px; }
.value-card p{ font-size:.94rem; margin-bottom:0; }

/* ---------- Two column ---------- */
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.two-col.reverse{ direction:rtl; }
.two-col.reverse > *{ direction:ltr; }
.media-frame{
  position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:420px;
  box-shadow:var(--shadow-md);
}
.check-list li{ display:flex; gap:12px; margin-bottom:14px; color:var(--ink-700); font-size:.96rem; }
.check-list li svg{ flex:none; color:var(--gold-500); margin-top:3px; }

/* ---------- Feature list (icon rows) ---------- */
.feature-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.feature-row{ display:flex; gap:16px; padding:22px; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-md); }
.feature-row .num{ font-family:'Fraunces',serif; font-size:1.4rem; color:var(--gold-500); flex:none; width:36px; }
.feature-row h4{ font-size:1rem; margin-bottom:6px; }
.feature-row p{ font-size:.9rem; margin:0; }

/* ---------- CTA banner ---------- */
.cta-banner{
  background:linear-gradient(120deg,var(--navy-900),var(--navy-700));
  border-radius:var(--radius-lg); padding:64px; display:flex; align-items:center; justify-content:space-between;
  gap:32px; color:#fff; flex-wrap:wrap;
}
.cta-banner h2{ color:#fff; margin-bottom:8px; }
.cta-banner p{ color:rgba(255,255,255,.7); margin-bottom:0; max-width:480px; }

/* ---------- Team / About ---------- */
.pillar-row{ display:grid; grid-template-columns:repeat(6,1fr); gap:18px; }
.pillar{ text-align:center; padding:26px 14px; border-radius:var(--radius-md); background:var(--paper); border:1px solid var(--line); }
.pillar .value-icon{ margin:0 auto 16px; }
.pillar h4{ font-size:.95rem; margin-bottom:8px; }
.pillar p{ font-size:.82rem; }

/* ---------- Timeline / quote ---------- */
.quote-block{
  border-left:3px solid var(--gold-500); padding-left:28px; margin:0;
}
.quote-block p{ font-family:'Fraunces',serif; font-size:1.5rem; color:var(--navy-900); line-height:1.45; font-style:italic; }
.quote-block cite{ font-style:normal; font-size:.85rem; color:var(--ink-500); font-weight:600; letter-spacing:.02em; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; }
.contact-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-md); padding:30px; margin-bottom:18px; display:flex; gap:18px; }
.contact-card .value-icon{ margin-bottom:0; }
.contact-card h4{ font-size:1rem; margin-bottom:6px; }
.contact-card p{ margin-bottom:0; font-size:.92rem; }
.social-row{ display:flex; gap:12px; margin-top:8px; }
.social-pill{
  width:42px; height:42px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center;
  justify-content:center; color:var(--navy-900); transition:all .2s ease;
}
.social-pill:hover{ background:var(--navy-900); color:#fff; border-color:var(--navy-900); }

.form-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:44px; box-shadow:var(--shadow-sm); }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-group{ margin-bottom:20px; }
.form-group label{ display:block; font-size:.82rem; font-weight:600; color:var(--ink-700); margin-bottom:8px; }
.form-group input, .form-group select, .form-group textarea{
  width:100%; padding:13px 16px; border-radius:10px; border:1px solid var(--line); background:var(--off-white);
  font-family:inherit; font-size:.95rem; color:var(--ink-900);
}
.form-group textarea{ resize:vertical; min-height:120px; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus{
  outline:none; border-color:var(--gold-500); background:#fff;
}
.map-frame{ border-radius:var(--radius-md); overflow:hidden; min-height:220px; margin-top:8px; }

/* ---------- Footer ---------- */
.footer{ background:var(--navy-950); color:rgba(255,255,255,.65); padding:80px 0 30px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:48px; margin-bottom:60px; }
.footer h4{ color:#fff; font-family:'Inter',sans-serif; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:20px; font-weight:700;}
.footer ul li{ margin-bottom:12px; }
.footer ul li a:hover{ color:var(--gold-400); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1); padding-top:26px; display:flex; justify-content:space-between;
  align-items:center; flex-wrap:wrap; gap:14px; font-size:.82rem;
}
.footer-bottom .legal-links{ display:flex; gap:22px; }
.footer-brand p{ color:rgba(255,255,255,.55); font-size:.92rem; max-width:320px; }

/* ---------- Utilities ---------- */
.mb-0{ margin-bottom:0 !important; }
.text-gold{ color:var(--gold-500); }
.badge{
  display:inline-block; background:var(--gold-100); color:var(--navy-900); font-size:.72rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; padding:6px 12px; border-radius:999px; margin-bottom:14px;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .sector-grid{ grid-template-columns:repeat(2,1fr); }
  .value-grid{ grid-template-columns:repeat(2,1fr); }
  .two-col{ grid-template-columns:1fr; gap:40px; }
  .two-col.reverse{ direction:ltr; }
  .pillar-row{ grid-template-columns:repeat(3,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .contact-grid{ grid-template-columns:1fr; }
}
@media (max-width: 760px){
  :root{ --nav-h:72px; }
  .nav-links, .nav-cta .lang-toggle{ display:none; }
  .nav-burger{ display:flex; }
  .sector-grid{ grid-template-columns:1fr; }
  .value-grid{ grid-template-columns:1fr; }
  .feature-list{ grid-template-columns:1fr; }
  .pillar-row{ grid-template-columns:repeat(2,1fr); }
  .form-row{ grid-template-columns:1fr; }
  section{ padding:70px 0; }
  .cta-banner{ padding:40px 28px; }
  .footer-grid{ grid-template-columns:1fr; gap:32px; }
}

/* Scroll reveal: elements are fully visible by default (no-JS / slow-JS safe).
   Only browsers that actually run main.js and add .reveal-ready get the
   fade-up treatment, and only briefly until .is-visible lands. */
[data-reveal].reveal-ready{ opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
[data-reveal].reveal-ready.is-visible{ opacity:1; transform:none; }

/* Mobile nav drawer */
.mobile-drawer{
  position:fixed; inset:0; z-index:1100; background:var(--navy-950); color:#fff;
  display:flex; flex-direction:column; padding:28px 32px; transform:translateX(100%);
  transition:transform .3s ease;
}
.mobile-drawer.open{ transform:translateX(0); }
.mobile-drawer .drawer-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:48px; }
.mobile-drawer a{ font-size:1.3rem; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.08); font-family:'Fraunces',serif; }

/* ---------- 2026 premium refinement ---------- */
body{ overflow-x:hidden; }
body.menu-open{ overflow:hidden; }
::selection{ background:var(--gold-500); color:var(--navy-950); }
:focus-visible{ outline:3px solid var(--gold-400); outline-offset:4px; }

.nav{ backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.nav .container{ position:relative; }
.brand-mark{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 8px 28px rgba(0,0,0,.2); }
.nav-links a::after{ content:""; position:absolute; left:0; right:100%; bottom:-9px; height:1px; background:var(--gold-400); transition:right .25s ease; }
.nav-links a{ position:relative; }
.nav-links a:hover::after,.nav-links a.active::after{ right:0; }

.hero{ min-height:760px; display:flex; align-items:center; isolation:isolate; }
.hero::after{ content:""; position:absolute; width:520px; height:520px; right:-130px; bottom:-170px; border:1px solid rgba(217,185,85,.2); border-radius:50%; box-shadow:0 0 0 70px rgba(217,185,85,.035),0 0 0 140px rgba(217,185,85,.025); z-index:1; }
.hero h1{ max-width:940px; text-wrap:balance; letter-spacing:-.035em; }
.hero .lead{ max-width:720px; line-height:1.75; }
.hero-sub{ min-height:480px; }
.hero-sub::after{ width:380px; height:380px; }
.hero-actions .btn{ min-width:190px; }

.stat-strip .container{ justify-content:space-between; }
.stat{ position:relative; padding-left:20px; }
.stat::before{ content:""; position:absolute; left:0; top:5px; bottom:5px; width:1px; background:linear-gradient(var(--gold-400),transparent); }
.stat b{ letter-spacing:-.04em; }

.ph-note{ display:none !important; }
.ph-bg,.media-frame{ background-color:var(--navy-800); }
.ph-business{ background-image:linear-gradient(0deg,rgba(7,15,25,.25),rgba(7,15,25,.02)),url('../assets/business/BusinessCenter.png'); background-size:cover; background-position:center; }
.ph-fuel{ background-image:radial-gradient(circle at 65% 25%,rgba(255,190,70,.45),transparent 20%),linear-gradient(145deg,#171d29,#3a4b5b 52%,#10161f); }
.ph-health{ background-image:radial-gradient(circle at 76% 28%,rgba(148,220,213,.38),transparent 25%),linear-gradient(145deg,#11313d,#32636a 55%,#101f2a); }
.ph-agri{ background-image:radial-gradient(circle at 70% 25%,rgba(188,211,111,.35),transparent 25%),linear-gradient(145deg,#183428,#3d6540 55%,#14241d); }
.ph-hotel{ background-image:linear-gradient(0deg,rgba(7,15,25,.28),rgba(7,15,25,.02)),url('../assets/hotel/HotelApartments0.png'); background-size:cover; background-position:center; }
.ph-restaurant{ background-image:linear-gradient(0deg,rgba(7,15,25,.42),rgba(7,15,25,.02)),url('../assets/restaurant/TelAlNasbeh1.png'); background-size:cover; background-position:center; }
.ph-generic{ background-image:radial-gradient(circle at 72% 25%,rgba(217,185,85,.3),transparent 22%),linear-gradient(145deg,#14263d,#27445f 55%,#0d1725); }
.sector-card{ min-height:430px; border:1px solid rgba(255,255,255,.08); }
.sector-card::before{ content:""; position:absolute; inset:18px; border:1px solid rgba(255,255,255,.12); border-radius:calc(var(--radius-md) - 4px); z-index:2; pointer-events:none; opacity:0; transform:scale(.98); transition:.35s ease; }
.sector-card:hover::before{ opacity:1; transform:scale(1); }
.sector-card .ph-bg{ transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .4s ease; }
.sector-card:hover .ph-bg{ transform:scale(1.055); filter:saturate(1.1); }
.sector-card .card-overlay{ background:linear-gradient(to top,rgba(7,15,25,.96) 5%,rgba(7,15,25,.28) 72%,rgba(7,15,25,.08)); }
.sector-card p{ max-width:440px; }
.value-card{ transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; }
.value-card:hover{ transform:translateY(-5px); border-color:rgba(201,162,39,.45); box-shadow:var(--shadow-md); }
.value-icon{ transition:transform .3s ease,background .3s ease; }
.value-card:hover .value-icon{ transform:rotate(-5deg) scale(1.08); background:var(--gold-100); }
.cta-banner{ position:relative; overflow:hidden; }
.cta-banner::after{ content:""; position:absolute; width:260px; height:260px; border:1px solid rgba(217,185,85,.2); border-radius:50%; right:-90px; top:-130px; }
.cta-banner>*{ position:relative; z-index:1; }
.form-card,.contact-card{ border:1px solid var(--line); box-shadow:0 14px 40px rgba(15,27,45,.07); }
.project-gallery{ display:grid; grid-template-columns:repeat(12,1fr); gap:18px; }
.project-gallery figure{ margin:0; overflow:hidden; border-radius:var(--radius-md); background:var(--navy-900); min-height:290px; box-shadow:var(--shadow-sm); }
.project-gallery figure:nth-child(4n+1),.project-gallery figure:nth-child(4n+4){ grid-column:span 7; }
.project-gallery figure:nth-child(4n+2),.project-gallery figure:nth-child(4n+3){ grid-column:span 5; }
.project-gallery img{ width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.2,.7,.2,1); }
.project-gallery figure:hover img{ transform:scale(1.035); }
input,select,textarea{ transition:border-color .2s ease,box-shadow .2s ease; }
input:focus,select:focus,textarea:focus{ border-color:var(--gold-500); box-shadow:0 0 0 4px rgba(201,162,39,.12); outline:none; }

@media (max-width:760px){
  .hero{ min-height:680px; }
  .hero-sub{ min-height:420px; }
  .hero::after{ width:300px; height:300px; right:-170px; bottom:-70px; }
  .stat-strip .container{ gap:22px; }
  .stat{ width:calc(50% - 12px); }
  .mobile-drawer{ box-shadow:-30px 0 80px rgba(0,0,0,.35); }
  .project-gallery figure{ grid-column:1/-1 !important; min-height:220px; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}
.drawer-close{ width:40px; height:40px; border:1px solid rgba(255,255,255,.3); border-radius:8px; display:flex; align-items:center; justify-content:center; }