/* =====================================================================
   Multi-page components (shared by all inner pages)
   ===================================================================== */
.nav-item>a.active{background:rgba(255,255,255,.14);opacity:1}
.mmenu .sub{padding-left:1rem}
.mmenu .sub a{font-size:16px;font-weight:400;opacity:.8}

/* Inner page hero */
.phero{position:relative;color:#fff;padding:10rem 0 5rem;overflow:hidden;isolation:isolate;background:#0b1430}
.phero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(55% 80% at 85% 20%,rgba(11,92,176,.75),transparent 70%),
  radial-gradient(40% 50% at 10% 100%,rgba(239,99,42,.35),transparent 70%),
  linear-gradient(180deg,#0b1430,#132a57)}
.phero.img::before{background:linear-gradient(90deg,rgba(10,20,45,.92) 0%,rgba(10,20,45,.72) 50%,rgba(10,20,45,.35) 100%)}
.phero .pbg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center}
.phero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.phero .h1{max-width:46rem}
.phero .lead{font-size:1.25rem;opacity:.8;max-width:38rem;margin-top:1rem}
.phero .btns{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:2rem}
.phero-img{display:grid;place-items:center;min-height:320px}
.phero-img img{height:clamp(240px,42vh,420px);width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 30px 35px rgba(0,0,0,.4))}
.crumbs{display:flex;gap:.5rem;font-size:14px;opacity:.65;margin-bottom:1.25rem;flex-wrap:wrap}
.crumbs a:hover{text-decoration:underline}
.ptag{display:inline-block;background:rgba(255,255,255,.12);border-radius:.5rem;padding:.2rem .75rem;font-size:13px;font-weight:500;margin-bottom:1rem}
.button.ghost{background:rgba(255,255,255,.1);color:#fff;padding-right:1.25rem}
.button.ghost:hover{background:rgba(255,255,255,.18)}

/* Highlight tiles */
.hl{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.hl div{background:var(--surface-2);border-radius:var(--r-md);padding:1.75rem}
.hl b{display:block;font-size:2rem;font-weight:600;line-height:1.15}
.hl span{color:var(--muted);font-size:15px}
.phero .hl{margin-top:4rem}
.phero .hl div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.phero .hl span{color:rgba(255,255,255,.65)}

/* Section headers */
.shead{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:3rem}
.shead p{max-width:36rem}
.kick{font-size:15px;color:var(--muted);margin-bottom:.5rem;font-weight:500}

/* Feature cards */
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.feat{background:var(--surface-2);border-radius:var(--r-card);padding:2rem}
.feat .fi{width:3rem;height:3rem;border-radius:.875rem;background:#fff;display:grid;place-items:center;margin-bottom:1.5rem}
.feat .fi svg{width:22px;height:22px;color:var(--orange)}
.feat h3{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}
.feat p{color:var(--muted)}

/* Split (image + text) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.split.rev>:first-child{order:2}
.split-img{aspect-ratio:1/1;border-radius:var(--r-card);background:var(--surface-2);display:grid;place-items:center;padding:3rem;overflow:hidden}
.split-img img{max-height:100%;object-fit:contain;filter:drop-shadow(0 25px 25px rgba(0,0,0,.15))}
.split-img.dark{background:radial-gradient(ellipse at 50% 100%,#4f86cf,transparent 60%),linear-gradient(170deg,#132a57,#1f3e7a)}
.split-img.warm{background:radial-gradient(ellipse at 75% 100%,#ffb07c,transparent 55%),linear-gradient(110deg,#c4471a,#ef632a 50%,#f48a4e)}
.split-img.photo{background:url(../hero-bg.png) center 70%/cover}
.split h2{margin-bottom:1rem}
.checks{list-style:none;margin:1.5rem 0 2rem}
.checks li{display:flex;gap:.75rem;padding:.75rem 0;border-top:1px solid var(--stroke)}
.checks li:last-child{border-bottom:1px solid var(--stroke)}
.checks svg{flex:none;width:18px;height:18px;color:var(--orange);margin-top:4px}
.mini-links{display:flex;gap:.5rem;flex-wrap:wrap}

/* Spec table on product page */
.spec-wrap{background:var(--surface-2);border-radius:var(--r-card);padding:.5rem;overflow-x:auto}
.spec-wrap table{width:100%;border-collapse:collapse;background:#fff;border-radius:1rem;overflow:hidden;font-size:15.5px;min-width:520px}
.spec-wrap th,.spec-wrap td{text-align:left;padding:1rem 1.25rem;border-top:1px solid var(--stroke)}
.spec-wrap tr:first-child th,.spec-wrap tr:first-child td{border-top:0}
.spec-wrap tbody th{font-weight:400;color:var(--muted);width:40%}
.spec-wrap td{font-weight:500}
.spec-wrap thead th{background:var(--black);color:#fff;font-weight:500}

/* Variants */
.variants{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.25rem}
.variant{background:var(--surface-2);border-radius:var(--r-md);padding:.5rem .5rem 1.25rem;text-align:center}
.variant div{aspect-ratio:1;background:#fff;border-radius:.5rem;display:grid;place-items:center;padding:1.5rem}
.variant img{max-height:100%;object-fit:contain}
.variant b{display:block;margin-top:1rem;font-weight:600}

/* Compare DC vs AC */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.compare .panel h3{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.compare .panel h3 i{width:28px;height:3px;border-radius:2px;display:inline-block}

/* Wide image card */
.wide-img{background:var(--surface-2);border-radius:var(--r-card);padding:2.5rem;display:grid;place-items:center}

/* Contact */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:1.25rem}
.cinfo{display:grid;gap:1.25rem;align-content:start}
.cbox{background:var(--surface-2);border-radius:var(--r-card);padding:2rem;display:flex;gap:1.25rem}
.cbox .fi{width:3rem;height:3rem;border-radius:.875rem;background:#fff;display:grid;place-items:center;flex:none}
.cbox .fi svg{width:22px;height:22px;color:var(--orange)}
.cbox h3{font-size:1.125rem;font-weight:600}
.cbox p,.cbox a{color:var(--muted)}
.cbox a:hover{color:var(--black)}
.cform{background:var(--surface-2);border-radius:var(--r-card);padding:2.5rem}
.cform h2{font-size:2rem;font-weight:600;line-height:1.2}
.cform input,.cform select,.cform textarea{background:#fff}
.map{border-radius:var(--r-card);overflow:hidden;position:relative;min-height:280px;background:linear-gradient(135deg,#dfe6f1,#eef2f8);display:grid;place-items:center;text-align:center;padding:2rem}
.map::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px);background-size:40px 40px}
.map>*{position:relative}
.pin{width:3.5rem;height:3.5rem;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--orange);display:grid;place-items:center;margin:0 auto 1rem;box-shadow:0 10px 20px rgba(239,99,42,.35)}
.pin i{width:1.1rem;height:1.1rem;border-radius:50%;background:#fff}

/* Featured post */
.post-feat{display:grid;grid-template-columns:1.2fr 1fr;gap:.5rem;background:var(--surface-2);border-radius:var(--r-card);padding:.5rem;margin-bottom:1.25rem}
.post-feat .blog-img{aspect-ratio:16/10;border-radius:1rem}
.post-feat .txt{padding:2.5rem;display:flex;flex-direction:column}
.post-feat h2{font-size:2rem;font-weight:600;line-height:1.25;margin:1rem 0}
.post-feat .button{margin-top:1.5rem;align-self:flex-start}

/* Values */
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.value{border-top:1px solid var(--black);padding-top:1.25rem}
.value span{color:var(--muted)}
.value h3{font-size:1.25rem;font-weight:600;margin:.5rem 0}
.value p{color:var(--muted);font-size:15px}

/* Process (detailed) */
.steps{display:grid;grid-template-columns:repeat(6,1fr);gap:1.25rem}
.stepc{background:var(--surface-2);border-radius:var(--r-md);padding:1.5rem}
.stepc i{width:2.75rem;height:2.75rem;border-radius:.875rem;background:#fff;display:grid;place-items:center;margin-bottom:1.25rem}
.stepc i svg{width:20px;height:20px;color:var(--orange)}
.stepc em{font-style:normal;color:var(--muted);font-size:13px}
.stepc h3{font-size:1.125rem;font-weight:600}
.stepc p{color:var(--muted);font-size:14.5px;margin-top:.25rem}

.notfound{padding:12rem 0 8rem;text-align:center}

@media (max-width:991px){
  .phero{padding:8rem 0 4rem}
  .phero-grid,.split,.compare,.contact-grid,.post-feat{grid-template-columns:1fr}
  .split.rev>:first-child{order:0}
  .split{gap:2.5rem}
  .hl{grid-template-columns:1fr 1fr}
  .feats{grid-template-columns:1fr 1fr}
  .values{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:repeat(3,1fr)}
  .phero-img{min-height:0}.phero-img img{max-height:300px}
}
@media (max-width:600px){
  .feats,.values{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .hl b{font-size:1.5rem}
  .hl div{padding:1.25rem}
  .post-feat .txt,.cform{padding:1.5rem}
  .cbox{padding:1.5rem}
}
