/* ==========================================================================
   BridgeNatix — Main Stylesheet
   ========================================================================== */

:root{
  --orange:#F4511E;
  --orange-soft:#FF6A3D;
  --ink:#101114;
  --gray:#5b5e66;
  --bg:#F4F4F2;
  --peach:#F9E4DB;
  --white:#ffffff;
  --radius-xl:48px;
  --radius-lg:28px;
  --radius-md:18px;
  --font-head:'Archivo',sans-serif;
  --font-body:'Inter',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--ink);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--orange);color:#fff}

/* ---------- scroll progress ---------- */
#progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--orange),var(--orange-soft));z-index:1000;transition:width .1s linear}

/* ---------- reveal animations (blur-in for a premium feel) ---------- */
.reveal{opacity:0;transform:translateY(40px);filter:blur(7px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1),filter .85s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none;filter:blur(0)}
.reveal-l{opacity:0;transform:translateX(-50px);filter:blur(7px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1),filter .85s cubic-bezier(.16,1,.3,1)}
.reveal-r{opacity:0;transform:translateX(50px);filter:blur(7px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1),filter .85s cubic-bezier(.16,1,.3,1)}
.reveal-l.in,.reveal-r.in{opacity:1;transform:none;filter:blur(0)}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

/* ---------- nav ---------- */
nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 5vw;
  transition:all .4s ease;
}
nav.scrolled{
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  box-shadow:0 6px 30px rgba(16,17,20,.08);
  padding:14px 5vw;
}
.logo{display:flex;align-items:center;gap:2px;font-family:var(--font-head);font-weight:800;font-size:1.5rem;letter-spacing:-.5px;text-decoration:none;color:var(--ink)}
.logo .bolt{
  width:34px;height:34px;border-radius:9px;background:var(--orange);
  display:grid;place-items:center;color:#fff;font-size:1.15rem;margin-right:6px;
  box-shadow:0 6px 18px rgba(244,81,30,.4);
  transition:transform .35s ease;
}
.logo:hover .bolt{transform:rotate(-12deg) scale(1.08)}
.nav-links{display:flex;gap:34px;list-style:none;align-items:center}
.nav-links a{
  text-decoration:none;color:var(--ink);font-size:.92rem;font-weight:500;position:relative;padding:4px 0;
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:var(--orange);border-radius:2px;transition:width .3s ease;
}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-links a.active{color:var(--orange)}
.burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.burger span{width:26px;height:2.5px;background:var(--ink);border-radius:2px;transition:.3s}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-body);font-weight:600;font-size:.95rem;
  padding:15px 30px;border-radius:999px;cursor:pointer;text-decoration:none;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease,background .3s ease,color .3s ease;
  border:1.5px solid transparent;
}
.btn:active{transform:scale(.96)}
.btn-primary{
  background:var(--orange);color:#fff;
  box-shadow:0 10px 30px rgba(244,81,30,.35);
  position:relative;overflow:hidden;
}
.btn-primary::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);
  transform:translateX(-100%);transition:transform .6s ease;
}
.btn-primary:hover::before{transform:translateX(100%)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(244,81,30,.45)}
.btn-outline{background:transparent;color:var(--ink);border-color:rgba(16,17,20,.35)}
.btn-outline:hover{border-color:var(--ink);background:var(--ink);color:#fff;transform:translateY(-3px)}
.btn .arrow{display:inline-grid;place-items:center;width:22px;height:22px;border:1.5px solid currentColor;border-radius:50%;font-size:.75rem;transition:transform .3s ease}
.btn:hover .arrow{transform:rotate(45deg)}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:100vh;
  display:flex;align-items:center;
  padding:140px 5vw 120px;
  background:
    radial-gradient(1100px 500px at 85% 10%,rgba(244,81,30,.06),transparent 60%),
    linear-gradient(180deg,#f6f6f4 0%,#efefec 100%);
  overflow:hidden;
}
#plexus{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-inner{position:relative;z-index:2;max-width:1280px;margin:0 auto;width:100%}
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  color:var(--orange);font-weight:600;font-size:.92rem;letter-spacing:.5px;margin-bottom:20px;
  background:rgba(244,81,30,.07);border:1px solid rgba(244,81,30,.2);
  padding:9px 20px;border-radius:999px;
}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);animation:labelPulse 2.4s ease infinite}
.hero h1{
  font-family:var(--font-head);
  font-size:clamp(3rem,7.4vw,6.4rem);
  line-height:1.02;font-weight:800;letter-spacing:-2.5px;
  color:var(--ink);
}
.hero h1 .line{display:block;overflow:hidden}
.hero h1 .line span{display:inline-block;transform:translateY(110%);animation:riseUp 1s cubic-bezier(.16,1,.3,1) forwards}
.hero h1 .line:nth-child(2) span{animation-delay:.15s}
@keyframes riseUp{to{transform:translateY(0)}}
.hero h1 .accent{
  background:linear-gradient(100deg,var(--orange) 25%,#ff9a6b 50%,var(--orange) 75%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 7s linear infinite;
}
@keyframes shimmer{to{background-position:-220% 0}}
.hero-sub{max-width:480px;color:var(--gray);font-size:1.05rem;line-height:1.7;margin-top:24px;opacity:0;animation:fadeIn 1s ease .5s forwards}
@keyframes fadeIn{to{opacity:1}}
.hero-cta{display:flex;gap:16px;margin-top:44px;flex-wrap:wrap;opacity:0;animation:fadeIn 1s ease .7s forwards}
.hero-scroll{
  position:absolute;bottom:34px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--gray);font-size:.75rem;letter-spacing:2px;text-transform:uppercase;z-index:2;
}
.hero-scroll .wheel{width:24px;height:38px;border:1.5px solid rgba(16,17,20,.35);border-radius:14px;position:relative}
.hero-scroll .wheel::after{content:"";position:absolute;top:7px;left:50%;width:4px;height:8px;background:var(--orange);border-radius:3px;transform:translateX(-50%);animation:wheel 1.8s ease infinite}
@keyframes wheel{0%{opacity:1;top:7px}70%{opacity:0;top:20px}100%{opacity:0;top:7px}}

/* floating orange orbs */
.orb{position:absolute;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--orange-soft),var(--orange));filter:blur(1px);opacity:.85;animation:float 7s ease-in-out infinite;z-index:1}
.orb.o1{width:16px;height:16px;top:24%;left:46%;animation-delay:0s}
.orb.o2{width:10px;height:10px;top:64%;left:38%;animation-delay:1.6s}
.orb.o3{width:22px;height:22px;top:38%;right:8%;animation-delay:.9s}
.orb.o4{width:8px;height:8px;top:16%;right:26%;animation-delay:2.4s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-24px)}}

/* ---------- marquee ---------- */
.press{
  position:relative;z-index:3;
  max-width:1280px;margin:-70px auto 0;
  background:var(--white);
  border-radius:var(--radius-xl);
  padding:44px 30px;
  box-shadow:0 30px 60px rgba(16,17,20,.08);
  overflow:hidden;
}
.marquee{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee-track{display:flex;align-items:center;gap:90px;padding-right:90px;flex-shrink:0;animation:scroll 28s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes scroll{to{transform:translateX(-100%)}}
.press-logo{font-family:'Playfair Display',serif;font-size:1.9rem;font-weight:700;color:#2b2d33;white-space:nowrap;opacity:.75;transition:opacity .3s,transform .3s;cursor:default}
.press-logo:hover{opacity:1;transform:scale(1.06)}
.press-logo.sans{font-family:var(--font-head);letter-spacing:6px;font-weight:600;font-size:1.5rem}
.press-logo.ft{background:#33302e;color:#fff;padding:6px 12px;font-size:1.05rem;letter-spacing:0;font-family:'Playfair Display',serif}

/* ---------- section shell ---------- */
section{position:relative}
.wrap{max-width:1280px;margin:0 auto;padding:110px 5vw}
.sec-label{
  color:var(--orange);font-weight:600;font-size:.86rem;letter-spacing:.5px;
  margin-bottom:16px;display:inline-flex;align-items:center;gap:9px;
  background:rgba(244,81,30,.07);border:1px solid rgba(244,81,30,.2);
  padding:8px 18px;border-radius:999px;
}
.sec-label::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);animation:labelPulse 2.4s ease infinite}
@keyframes labelPulse{0%,100%{box-shadow:0 0 0 0 rgba(244,81,30,.4)}55%{box-shadow:0 0 0 6px rgba(244,81,30,0)}}
h2.sec-title{font-family:var(--font-head);font-size:clamp(2.2rem,4.6vw,3.8rem);font-weight:800;letter-spacing:-1.5px;line-height:1.06}

/* ---------- about ---------- */
.about{background:var(--white);border-radius:var(--radius-xl);max-width:1380px;margin:0 auto}
.about-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.feature{display:flex;gap:22px;margin-top:38px}
.feature .f-icon{
  flex:0 0 58px;height:58px;border-radius:16px;
  background:rgba(244,81,30,.09);color:var(--orange);
  display:grid;place-items:center;
  transition:all .35s ease;
}
.feature:hover .f-icon{background:var(--orange);color:#fff;transform:rotate(-8deg) scale(1.05);box-shadow:0 12px 26px rgba(244,81,30,.35)}
.feature h3{font-family:var(--font-head);font-size:1.25rem;font-weight:700;margin-bottom:8px}
.feature p{color:var(--gray);font-size:.94rem;line-height:1.75}
.about-media{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.about-media .ph{
  border-radius:200px;overflow:hidden;background:#ddd;position:relative;
  box-shadow:0 24px 50px rgba(16,17,20,.16);
  transition:transform .5s cubic-bezier(.16,1,.3,1);
}
.about-media .ph:hover{transform:translateY(-10px)}
.about-media .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s ease}
.about-media .ph:hover img{transform:scale(1.07)}
.about-media .ph.tall{aspect-ratio:3/4.4;margin-top:70px}
.about-media .ph.round{aspect-ratio:3/4;border-radius:190px 190px 190px 24px}
.badge-exp{
  position:absolute;top:-26px;right:-8px;z-index:3;
  background:var(--orange);color:#fff;text-align:center;
  padding:22px 26px;border-radius:26px 26px 26px 8px;
  box-shadow:0 18px 40px rgba(244,81,30,.4);
  animation:float 6s ease-in-out infinite;
}
.badge-exp .num{font-family:var(--font-head);font-weight:800;font-size:2.2rem;line-height:1}
.badge-exp small{font-size:.72rem;opacity:.9}

/* ---------- services ---------- */
.services{
  background:
    radial-gradient(800px 400px at 10% 0%,rgba(244,81,30,.05),transparent 60%),
    var(--bg);
  overflow:hidden;
}
/* geodesic mesh background, as in the PDF design */
.services::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 1000'%3E%3Cg stroke='%23101114' stroke-opacity='.055' stroke-width='1.6' fill='none'%3E%3Cpath d='M140 150L470 70L820 160L1150 90L1370 220M60 430L400 380L760 430L1120 390L1360 480M160 760L520 830L880 740L1240 820M140 150L60 430M470 70L400 380M820 160L760 430M1150 90L1120 390M1370 220L1360 480M60 430L160 760M400 380L520 830M760 430L880 740M1120 390L1240 820M140 150L400 380M820 160L1120 390M760 430L520 830M470 70L760 430M1150 90L1360 480'/%3E%3C/g%3E%3Cg fill='%23101114' fill-opacity='.07'%3E%3Ccircle cx='140' cy='150' r='5'/%3E%3Ccircle cx='470' cy='70' r='7'/%3E%3Ccircle cx='820' cy='160' r='5'/%3E%3Ccircle cx='1150' cy='90' r='6'/%3E%3Ccircle cx='1370' cy='220' r='5'/%3E%3Ccircle cx='60' cy='430' r='6'/%3E%3Ccircle cx='400' cy='380' r='8'/%3E%3Ccircle cx='760' cy='430' r='5'/%3E%3Ccircle cx='1120' cy='390' r='7'/%3E%3Ccircle cx='1360' cy='480' r='5'/%3E%3Ccircle cx='160' cy='760' r='7'/%3E%3Ccircle cx='520' cy='830' r='5'/%3E%3Ccircle cx='880' cy='740' r='6'/%3E%3Ccircle cx='1240' cy='820' r='5'/%3E%3C/g%3E%3Cg stroke='%23101114' stroke-opacity='.05' stroke-width='1.6' fill='none'%3E%3Ccircle cx='470' cy='70' r='16'/%3E%3Ccircle cx='400' cy='380' r='18'/%3E%3Ccircle cx='1120' cy='390' r='15'/%3E%3Ccircle cx='880' cy='740' r='16'/%3E%3C/g%3E%3C/svg%3E");
  background-size:1500px 1080px;background-position:center top;background-repeat:repeat;
  -webkit-mask-image:radial-gradient(1100px 800px at 50% 42%,#000,transparent);
  mask-image:radial-gradient(1100px 800px at 50% 42%,#000,transparent);
}
/* three staggered columns like the design */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;align-items:start;position:relative;z-index:1}
.svc-col{display:flex;flex-direction:column;gap:34px}
.svc-col.offset{padding-top:170px}
.svc-header{margin-bottom:26px}
.svc-viewall{display:flex;justify-content:center;margin-top:30px}
.svc-viewall .btn{padding:20px 54px;font-size:1.05rem}
.svc-card{
  background:var(--white);border:1px solid rgba(16,17,20,.07);
  border-radius:6px 28px 28px 28px;padding:38px 32px;
  position:relative;overflow:hidden;
  transition:background-color .4s ease,border-color .4s ease,
             transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s ease;
}
.svc-card:hover{transform:translateY(-8px)}
/* cursor spotlight — --mx/--my set by JS */
.svc-card::before{
  content:"";position:absolute;inset:0;opacity:0;pointer-events:none;
  transition:opacity .4s ease;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(244,81,30,.09),transparent 65%);
}
.svc-card:hover::before{opacity:1}
.svc-card.featured::before{
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.16),transparent 65%);
}
/* the orange "selection" — JS moves .featured to the hovered card */
.svc-card.featured{
  background-color:var(--orange);
  border-color:transparent;
  box-shadow:0 26px 60px rgba(244,81,30,.4);
}
.s-icon{
  width:62px;height:62px;border-radius:18px;margin-bottom:24px;
  background:rgba(244,81,30,.09);color:var(--orange);
  display:grid;place-items:center;
  transition:transform .4s ease,background-color .35s ease,color .35s ease;
}
.svc-card:hover .s-icon{transform:rotate(-10deg) scale(1.1)}
.svc-card.featured .s-icon{background:rgba(255,255,255,.16);color:#fff}
.svc-card h3{font-family:var(--font-head);font-size:1.35rem;font-weight:700;margin-bottom:16px;letter-spacing:-.4px;transition:color .35s ease}
.svc-card.featured h3{color:#fff}
.svc-card ul{list-style:none;margin-bottom:26px}
.svc-card li{color:var(--gray);font-size:.9rem;padding:5px 0 5px 20px;position:relative;line-height:1.5;transition:color .35s ease}
.svc-card li::before{content:"";position:absolute;left:0;top:13px;width:7px;height:7px;border-radius:50%;background:var(--orange);transition:background-color .35s ease}
.svc-card.featured li{color:rgba(255,255,255,.92)}
.svc-card.featured li::before{background:#fff}
.chip{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--ink);color:#fff;font-size:.83rem;font-weight:600;
  padding:10px 22px;border-radius:999px;text-decoration:none;
  transition:all .3s ease;
}
.chip:hover{background:var(--orange);gap:13px}
.svc-card.featured .chip{background:#fff;color:var(--orange)}
.svc-card.featured .chip:hover{background:var(--ink);color:#fff}

/* ---------- case study ---------- */
.case{background:var(--peach);border-radius:var(--radius-xl);max-width:1380px;margin:110px auto;overflow:hidden;position:relative}
.case::before{
  content:"";position:absolute;right:-140px;top:-140px;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,rgba(244,81,30,.14),transparent 65%);
}
.case-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.case-copy p.lede{color:#6c5a52;max-width:430px;font-size:.98rem;line-height:1.75;margin-top:18px}
.case-item{display:flex;gap:20px;margin-top:44px}
.case-item .f-icon{flex:0 0 54px;height:54px;border-radius:15px;background:rgba(244,81,30,.13);color:var(--orange);display:grid;place-items:center}
.case-item h4{font-family:var(--font-head);font-size:1.2rem;font-weight:700;margin-bottom:8px}
.case-item p{color:#6c5a52;font-size:.92rem;line-height:1.7;margin-bottom:10px}
.case-item ul{list-style:none}
.case-item li{font-size:.88rem;color:#4b3f39;padding:3px 0 3px 18px;position:relative}
.case-item li::before{content:"";position:absolute;left:0;top:10px;width:7px;height:7px;border-radius:50%;background:var(--orange)}
.case-media{position:relative}
.case-media .ph{
  aspect-ratio:1;border-radius:50% 50% 4% 50%;overflow:hidden;
  box-shadow:0 40px 80px rgba(76,42,26,.28);
}
.case-media .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.case-media:hover .ph img{transform:scale(1.06)}
.ring{position:absolute;inset:-26px;border:1.5px dashed rgba(244,81,30,.5);border-radius:50%;animation:spin 30s linear infinite;pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
.stats-row{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  margin-top:80px;padding-top:60px;border-top:1.5px solid rgba(76,42,26,.14);
}
.stat{text-align:center}
.stat .v{font-family:var(--font-head);font-size:clamp(2.2rem,4vw,3.4rem);font-weight:800;letter-spacing:-1.5px}
.stat .v em{font-style:normal;color:var(--orange)}
.stat small{display:block;color:#6c5a52;font-size:.85rem;margin-top:6px;font-weight:500}

/* ---------- testimonials ---------- */
.testi{background:var(--bg);position:relative;overflow:hidden}
.testi .topo{
  position:absolute;inset:0;opacity:.16;pointer-events:none;
  background-image:repeating-radial-gradient(circle at 15% 40%,transparent 0 34px,rgba(16,17,20,.4) 34px 35px),
                   repeating-radial-gradient(circle at 88% 70%,transparent 0 40px,rgba(16,17,20,.35) 40px 41px);
  -webkit-mask-image:linear-gradient(#000,transparent 85%);
  mask-image:linear-gradient(#000,transparent 85%);
}
.center{text-align:center;max-width:640px;margin:0 auto}
.center .sec-label{justify-content:center}
.center p.sub{color:var(--gray);font-size:.96rem;line-height:1.7;margin-top:16px}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:70px}
@media(min-width:1025px){.testi-grid .t-card:nth-child(2){margin-top:-28px}}
.t-card{position:relative}
.t-bubble{
  background:linear-gradient(160deg,var(--orange) 0%,#e8430f 100%);
  color:#fff;border-radius:34px 34px 34px 6px;
  padding:44px 34px 54px;position:relative;
  box-shadow:0 24px 50px rgba(244,81,30,.3);
  transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s ease;
}
.t-card:hover .t-bubble{transform:translateY(-10px) rotate(-1deg);box-shadow:0 34px 70px rgba(244,81,30,.42)}
.t-bubble .q{font-family:'Playfair Display',serif;font-size:3.4rem;line-height:.6;color:rgba(255,255,255,.5);display:block;margin-bottom:22px}
.t-bubble p{font-size:.93rem;line-height:1.75;font-style:italic}
.t-person{display:flex;flex-direction:column;align-items:center;margin-top:-30px;position:relative;z-index:2}
.t-person img{
  width:64px;height:64px;border-radius:20px;object-fit:cover;
  border:4px solid var(--bg);box-shadow:0 10px 24px rgba(16,17,20,.18);
  transition:transform .35s ease;
}
.t-card:hover .t-person img{transform:scale(1.12)}
.t-person b{margin-top:10px;font-size:.95rem}
.t-person small{color:var(--gray);font-size:.8rem}
.t-stars{color:var(--orange);letter-spacing:3px;font-size:.8rem;margin-top:6px}

/* ---------- blog ---------- */
.blog{background:var(--white);border-radius:var(--radius-xl);max-width:1380px;margin:0 auto}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:70px}
.b-card{
  background:var(--bg);border-radius:var(--radius-lg);padding:40px 32px 32px;
  position:relative;overflow:hidden;
  transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s ease,background .45s ease;
}
.b-card:hover{transform:translateY(-12px);box-shadow:0 30px 60px rgba(16,17,20,.13);background:#fff}
.b-card::before{
  content:"";position:absolute;inset:0;opacity:0;pointer-events:none;
  transition:opacity .4s ease;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(244,81,30,.07),transparent 65%);
}
.b-card:hover::before{opacity:1}
.b-num{
  position:absolute;top:18px;right:24px;
  font-family:var(--font-head);font-size:4.6rem;font-weight:900;line-height:1;
  color:transparent;-webkit-text-stroke:1.5px rgba(16,17,20,.14);
  transition:all .45s ease;
}
.b-card:hover .b-num{-webkit-text-stroke:1.5px var(--orange);transform:translateY(-4px)}
.b-tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--orange);margin-bottom:14px}
.b-card h3{font-family:var(--font-head);font-size:1.3rem;font-weight:700;letter-spacing:-.4px;margin-bottom:14px;max-width:75%}
.b-card p{color:var(--gray);font-size:.9rem;line-height:1.75;margin-bottom:24px}
.b-media{border-radius:var(--radius-md);overflow:hidden;aspect-ratio:16/9;margin-bottom:20px}
.b-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.b-card:hover .b-media img{transform:scale(1.08)}
.b-link{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.9rem;color:var(--ink);text-decoration:none;transition:gap .3s,color .3s}
.b-link:hover{color:var(--orange);gap:14px}

/* ---------- CTA / contact ---------- */
.cta{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#ff6a3d 0%,var(--orange) 40%,#d63c0e 100%);
  margin-top:110px;
}
.cta .geo{
  position:absolute;inset:0;opacity:.14;pointer-events:none;
  background:
   linear-gradient(115deg,transparent 42%,#fff 42.15%,transparent 42.6%),
   linear-gradient(115deg,transparent 58%,#fff 58.15%,transparent 58.6%),
   linear-gradient(245deg,transparent 30%,#fff 30.15%,transparent 30.6%);
}
.cta .wrap{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.cta .sec-label{color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3)}
.cta .sec-label::before{background:#fff}
.cta h2{color:#fff}
.cta p.lede{color:rgba(255,255,255,.92);max-width:420px;margin-top:20px;line-height:1.75;font-size:.98rem}
.avail{
  margin-top:40px;display:inline-flex;align-items:center;gap:16px;
  background:#fff;color:var(--ink);border-radius:var(--radius-md);
  padding:18px 26px;box-shadow:0 20px 40px rgba(120,30,0,.3);
}
.avail .ph-icon{width:48px;height:48px;border-radius:14px;background:var(--ink);color:#fff;display:grid;place-items:center;animation:ringring 3s ease infinite}
@keyframes ringring{0%,88%,100%{transform:rotate(0)}90%{transform:rotate(12deg)}92%{transform:rotate(-10deg)}94%{transform:rotate(8deg)}96%{transform:rotate(-6deg)}}
.avail b{display:block;font-size:.95rem}
.avail small{color:var(--gray)}
.quote-panel{
  background:#0c0d10;border-radius:var(--radius-lg);
  padding:46px 42px;box-shadow:0 44px 90px rgba(70,15,0,.45);
  position:relative;overflow:hidden;
}
.quote-panel::before{content:"";position:absolute;top:-70px;right:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(244,81,30,.35),transparent 70%)}
.quote-panel h3{font-family:var(--font-head);color:#fff;font-size:1.7rem;font-weight:700;margin-bottom:30px;letter-spacing:-.5px}
.q-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.quote-panel input,.quote-panel textarea{
  width:100%;background:#fff;border:2px solid transparent;border-radius:16px;
  padding:15px 20px;font-family:var(--font-body);font-size:.92rem;color:var(--ink);
  margin-bottom:14px;outline:none;transition:border .3s,box-shadow .3s;
}
.quote-panel textarea{min-height:120px;resize:vertical;border-radius:18px}
.quote-panel input:focus,.quote-panel textarea:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(244,81,30,.25)}
.quote-panel .btn{width:100%;justify-content:center;letter-spacing:1.5px;text-transform:uppercase;font-size:.85rem}
.map-note{display:flex;align-items:center;gap:10px;margin-top:26px;color:rgba(255,255,255,.9);font-size:.88rem}

/* ---------- footer ---------- */
footer{background:#0c0d10;color:#fff;border-radius:var(--radius-xl) var(--radius-xl) 0 0;margin-top:110px;position:relative;overflow:hidden}
footer::before{content:"";position:absolute;top:-160px;left:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(244,81,30,.18),transparent 70%)}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr .9fr;gap:70px;padding-bottom:60px}
.foot-brand .logo{color:#fff;font-size:1.9rem}
.foot-brand p{color:#9a9da6;font-size:.92rem;line-height:1.75;margin:20px 0 36px;max-width:360px}
.foot-stats{display:grid;grid-template-columns:1fr 1fr;max-width:360px}
.f-stat{padding:22px 26px;border:1px solid rgba(255,255,255,.12)}
.f-stat:nth-child(1){border-radius:18px 0 0 0}
.f-stat:nth-child(2){border-left:none;border-radius:0 18px 0 0}
.f-stat:nth-child(3){border-top:none;border-radius:0 0 0 18px}
.f-stat:nth-child(4){border-left:none;border-top:none;border-radius:0 0 18px 0}
.f-stat .v{font-family:var(--font-head);font-size:2rem;font-weight:800}
.f-stat .v em{font-style:normal;color:var(--orange)}
.f-stat small{color:#9a9da6;font-size:.8rem}
.foot-col h4{color:var(--orange);font-size:1.02rem;font-weight:600;margin-bottom:26px}
.recent{list-style:none}
.recent li{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.recent a{color:#e8e9ec;text-decoration:none;font-size:.92rem;font-weight:500;transition:color .3s,padding-left .3s;display:block}
.recent a:hover{color:var(--orange);padding-left:8px}
.recent small{color:#7c7f88;font-size:.78rem}
.touch{list-style:none}
.touch li{display:flex;gap:14px;align-items:flex-start;margin-bottom:22px;color:#e8e9ec;font-size:.92rem;line-height:1.5}
.touch .t-ic{flex:0 0 20px;color:var(--orange);margin-top:2px}
.socials{display:flex;gap:12px;justify-content:flex-end;padding:10px 0 30px}
.socials a{
  width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(255,255,255,.25);
  display:grid;place-items:center;color:#fff;text-decoration:none;
  transition:all .3s ease;
}
.socials a:hover{background:var(--orange);border-color:var(--orange);transform:translateY(-4px);box-shadow:0 10px 22px rgba(244,81,30,.4)}
.copy{border-top:1px solid rgba(255,255,255,.1);text-align:center;padding:24px;color:#7c7f88;font-size:.83rem}

/* back to top */
#toTop{
  position:fixed;right:26px;bottom:26px;z-index:800;
  width:50px;height:50px;border-radius:50%;border:none;cursor:pointer;
  background:var(--ink);color:#fff;font-size:1.1rem;
  opacity:0;pointer-events:none;transform:translateY(16px);
  transition:all .35s ease;box-shadow:0 12px 28px rgba(16,17,20,.3);
}
#toTop.show{opacity:1;pointer-events:auto;transform:none}
#toTop:hover{background:var(--orange)}

/* ---------- premium polish ---------- */
/* subtle film grain over everything */
body::after{
  content:"";position:fixed;inset:0;z-index:998;pointer-events:none;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* branded scrollbar */
::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--orange),#d63c0e);
  border-radius:8px;border:3px solid var(--bg);
}
/* glowing scroll progress */
#progress{box-shadow:0 0 12px rgba(244,81,30,.55)}
/* visible focus for keyboard users */
a:focus-visible,button:focus-visible{outline:3px solid rgba(244,81,30,.55);outline-offset:3px;border-radius:8px}
.quote-panel input:focus-visible,.quote-panel textarea:focus-visible{outline:none}
/* extra depth on the press strip */
.press{border:1px solid rgba(16,17,20,.05)}
nav.scrolled{border-bottom:1px solid rgba(16,17,20,.05)}
/* drifting glow in the CTA */
.cta::after{
  content:"";position:absolute;width:460px;height:460px;border-radius:50%;
  left:-160px;bottom:-200px;pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.15),transparent 65%);
  animation:float 9s ease-in-out infinite;
}
/* smooth color transition when the featured selection moves */
.svc-card .chip{transition:background-color .35s ease,color .35s ease,gap .3s ease}
/* respect reduced motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .reveal,.reveal-l,.reveal-r{opacity:1!important;transform:none!important;filter:none!important}
}

/* ---------- responsive ---------- */
@media(max-width:1024px){
  .about-grid,.case-grid,.cta .wrap{grid-template-columns:1fr;gap:56px}
  .svc-grid{grid-template-columns:1fr 1fr}
  .svc-col.offset{padding-top:0}
  .testi-grid,.blog-grid{grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto}
  .blog-grid{margin-top:70px}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .nav-links{
    position:fixed;inset:0;background:rgba(255,255,255,.97);backdrop-filter:blur(20px);
    flex-direction:column;justify-content:center;gap:30px;font-size:1.3rem;
    transform:translateY(-100%);transition:transform .45s cubic-bezier(.16,1,.3,1);
  }
  .nav-links.open{transform:none}
  .burger{display:flex;z-index:20}
  .burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .burger.open span:nth-child(2){opacity:0}
  .burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  .svc-grid{grid-template-columns:1fr}
  .svc-viewall{margin-top:6px}
  .stats-row{grid-template-columns:1fr 1fr;gap:36px}
  .q-row{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:50px}
  .socials{justify-content:flex-start}
  .press{margin-top:-40px;padding:30px 16px}
  .wrap{padding:80px 6vw}
  .about-media .ph.tall{margin-top:36px}
}