/* Side by Side MRO — shared shell + content typography for sub-pages.
   Mirrors the v21 homepage palette and type. The homepage keeps its own inline
   styles; this file covers everything sub-pages need. */

:root{
  --orange:#F89048; --orange-d:#e07a32;
  --charcoal:#1c1c1c; --charcoal-2:#161616; --black:#0c0c0c;
  --white:#fff; --mid:#7a7a7a; --light:#cfcfcf; --line:rgba(255,255,255,.10);
  --warm:#f4f1ea; --warm-d:#e9e3d3;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Mulish',sans-serif;background:var(--charcoal);color:var(--white);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
a{text-decoration:none;color:inherit}

body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* HEADER */
header{position:sticky;top:0;z-index:80;background:rgba(12,12,12,.86);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:62px}
.logo{font-family:'Saira Stencil One',cursive;font-size:20px;letter-spacing:.02em}
.logo b{color:var(--orange);font-weight:400}
.nav-links{display:none;gap:30px;font-family:'Barlow',sans-serif;font-weight:600;font-size:13px;
  text-transform:uppercase;letter-spacing:.05em}
.nav-links a{color:var(--light);position:relative;padding:4px 0;transition:color .15s}
.nav-links a:hover, .nav-links a.active{color:var(--white)}
.nav-links a.active{color:var(--orange)}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--orange);transition:width .2s}
.nav-links a:hover::after, .nav-links a.active::after{width:100%}
.nav-cta{display:flex;align-items:center;gap:16px}
.phone-h{display:none;font-family:'Barlow',sans-serif;font-weight:700;font-size:14px;letter-spacing:.02em}

.btn{font-family:'Barlow',sans-serif;font-weight:600;letter-spacing:.01em;cursor:pointer;
  border:none;display:inline-flex;align-items:center;gap:8px;transition:transform .15s,background .15s,border-color .15s,color .15s}
.btn-pri{background:var(--orange);color:#1a1208;padding:13px 22px;border-radius:5px;font-size:14px}
.btn-pri:hover{background:var(--orange-d);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.28);
  padding:12px 18px;border-radius:4px;font-size:13px}
.btn-ghost:hover{border-color:var(--orange);color:var(--orange)}

/* PAGE HEADER (sub-page hero) */
.ph-hero{position:relative;padding:78px 0 64px;background:linear-gradient(180deg,var(--black),var(--charcoal));border-bottom:1px solid var(--line);overflow:hidden}
.ph-hero::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:54px 54px;-webkit-mask:radial-gradient(70% 60% at 20% 40%,#000,transparent);mask:radial-gradient(70% 60% at 20% 40%,#000,transparent)}
.ph-hero::after{content:attr(data-num);position:absolute;right:-10px;top:8px;font-family:'Saira Stencil One',cursive;
  font-size:clamp(140px,28vw,260px);color:var(--white);opacity:.04;line-height:1;letter-spacing:-.02em;pointer-events:none}
.ph-inner{position:relative;z-index:2;max-width:780px}
.eyebrow{font-family:'Saira Stencil One',cursive;font-size:13px;letter-spacing:.06em;color:var(--orange);margin-bottom:14px}
.accentbar{width:46px;height:5px;background:var(--orange);margin-bottom:22px;border-radius:2px}
h1{font-family:'Barlow',sans-serif;font-weight:700;line-height:1.06;letter-spacing:-.01em;
  text-transform:uppercase;font-size:clamp(30px,6vw,48px);margin-bottom:18px}
h1 .o{color:var(--orange)}
.ph-sub{font-size:clamp(15px,3.2vw,18px);line-height:1.6;color:var(--light);max-width:62ch;font-weight:500}
.ph-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.ph-cta .btn{padding:14px 22px;font-size:14px}

/* CERT STRIP */
.certbar{display:flex;align-items:stretch;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  max-width:760px;overflow:hidden;margin-top:34px}
.certbar .tag{flex:none;display:flex;align-items:center;background:var(--orange);color:#1a1208;
  font-family:'Saira Stencil One',cursive;font-size:11px;letter-spacing:.04em;padding:0 14px}
.certbar .items{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;padding:11px 0 11px 14px}
.certbar .ci{font-family:'Barlow',sans-serif;font-weight:700;text-transform:uppercase;font-size:11.5px;
  letter-spacing:.06em;color:var(--light);padding:0 13px;position:relative;white-space:nowrap}
.certbar .ci+.ci::before{content:"";position:absolute;left:-1px;top:50%;transform:translateY(-50%);
  width:5px;height:5px;background:var(--orange);rotate:45deg}

/* CONTENT SECTIONS */
section.body{padding:64px 0;border-bottom:1px solid var(--line)}
section.body.warm{background:var(--warm);color:#1a1208;border-bottom-color:rgba(0,0,0,.08)}
section.body.warm h2, section.body.warm .kick{color:#1a1208}
section.body.warm p, section.body.warm li{color:#3a2a1a}
section.body.dark{background:var(--charcoal-2)}

.kick{font-family:'Saira Stencil One',cursive;font-size:12px;letter-spacing:.05em;color:var(--orange)}
h2{font-family:'Barlow',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;
  font-size:clamp(24px,5vw,34px);margin:8px 0 22px;line-height:1.1}
h3{font-family:'Barlow',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.01em;
  font-size:clamp(17px,2.8vw,21px);margin:24px 0 10px}
p{font-size:16px;line-height:1.7;color:var(--light);margin-bottom:14px;max-width:68ch}
p b, p strong{color:var(--white);font-weight:700}
section.body.warm p b, section.body.warm p strong{color:#1a1208}
ul, ol{margin:0 0 18px 22px;color:var(--light)}
section.body.warm ul, section.body.warm ol{color:#3a2a1a}
li{font-size:16px;line-height:1.65;margin-bottom:6px;max-width:64ch}
li b, li strong{color:var(--white);font-weight:700}
section.body.warm li b, section.body.warm li strong{color:#1a1208}
a.inline{color:var(--orange);border-bottom:1px solid rgba(248,144,72,.4);padding-bottom:1px;transition:border-color .15s,color .15s}
a.inline:hover{color:var(--orange-d);border-bottom-color:var(--orange-d)}
section.body.warm a.inline{color:#b3500e;border-bottom-color:rgba(179,80,14,.4)}
section.body.warm a.inline:hover{color:#8a3d0a;border-bottom-color:#8a3d0a}

.lead{font-size:18px;line-height:1.65;color:var(--white);margin-bottom:22px;max-width:64ch;font-weight:500}
section.body.warm .lead{color:#1a1208}

/* PROCESS STEPS */
.steps{display:grid;grid-template-columns:1fr;gap:14px;margin:8px 0 6px}
.step{position:relative;background:rgba(255,255,255,.025);border:1px solid var(--line);
  border-radius:6px;padding:22px 22px 22px 78px;min-height:88px}
section.body.warm .step{background:rgba(0,0,0,.025);border-color:rgba(0,0,0,.1)}
.step .n{position:absolute;left:18px;top:18px;width:44px;height:44px;display:flex;align-items:center;
  justify-content:center;background:var(--orange);color:#1a1208;font-family:'Saira Stencil One',cursive;
  font-size:20px;border-radius:6px}
.step h3{margin:0 0 6px;font-size:17px;color:var(--white);text-transform:uppercase}
section.body.warm .step h3{color:#1a1208}
.step p{margin:0;color:var(--light);max-width:none}
section.body.warm .step p{color:#3a2a1a}

/* PRICING / PILL CALLOUTS */
.pillrow{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 8px}
.pill{display:inline-flex;align-items:center;gap:8px;background:rgba(248,144,72,.12);
  border:1px solid rgba(248,144,72,.35);color:var(--orange);padding:8px 14px;border-radius:30px;
  font-family:'Barlow',sans-serif;font-weight:700;text-transform:uppercase;font-size:12.5px;letter-spacing:.05em}
.pricecard{background:var(--charcoal-2);border:1px solid var(--line);border-radius:8px;padding:24px;margin:20px 0;
  display:flex;flex-wrap:wrap;align-items:center;gap:18px;justify-content:space-between}
.pricecard .big{font-family:'Barlow',sans-serif;font-weight:800;font-size:32px;color:var(--orange);line-height:1}
.pricecard .vs{color:var(--mid);text-transform:uppercase;font-family:'Barlow',sans-serif;font-weight:700;font-size:12px;letter-spacing:.07em}
.pricecard .ref{font-family:'Barlow',sans-serif;font-weight:700;font-size:20px;color:var(--light);text-decoration:line-through;text-decoration-color:var(--mid)}

/* FAQ */
.faq{margin-top:8px}
.faq details{border:1px solid var(--line);border-radius:6px;padding:0;margin-bottom:10px;background:rgba(255,255,255,.02)}
section.body.warm .faq details{background:rgba(0,0,0,.02);border-color:rgba(0,0,0,.08)}
.faq summary{cursor:pointer;list-style:none;padding:16px 20px;font-family:'Barlow',sans-serif;font-weight:700;
  font-size:15.5px;color:var(--white);position:relative;padding-right:48px;text-transform:uppercase;letter-spacing:.01em}
section.body.warm .faq summary{color:#1a1208}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);
  font-size:22px;color:var(--orange);font-weight:300;transition:transform .2s}
.faq details[open] summary::after{content:"−"}
.faq .ans{padding:0 20px 18px;color:var(--light);font-size:15.5px;line-height:1.65}
section.body.warm .faq .ans{color:#3a2a1a}

/* FORM */
.formcard{background:var(--charcoal-2);border:1px solid var(--line);border-radius:8px;padding:28px;max-width:620px;margin-top:10px}
.formrow{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:14px}
@media(min-width:640px){.formrow.two{grid-template-columns:1fr 1fr}}
.fld label{display:block;font-family:'Barlow',sans-serif;font-weight:700;text-transform:uppercase;
  font-size:11.5px;letter-spacing:.06em;color:var(--light);margin-bottom:6px}
.fld input, .fld select, .fld textarea{width:100%;background:#0c0c0c;border:1px solid var(--line);
  color:var(--white);padding:11px 13px;border-radius:5px;font-family:'Mulish',sans-serif;font-size:14.5px;
  transition:border-color .15s}
.fld input:focus, .fld select:focus, .fld textarea:focus{outline:none;border-color:var(--orange)}
.fld textarea{min-height:110px;resize:vertical}
.formcard .btn{width:100%;justify-content:center;padding:14px 22px;font-size:15px}
.formcard .note{margin-top:12px;font-size:12.5px;color:var(--mid);text-align:center}

/* TRUST GRID (beside form / inline) */
.trustgrid{display:grid;grid-template-columns:1fr;gap:12px;margin:18px 0 8px}
@media(min-width:720px){.trustgrid{grid-template-columns:1fr 1fr}}
.trustcell{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--line);
  border-radius:6px;background:rgba(255,255,255,.02)}
section.body.warm .trustcell{background:rgba(0,0,0,.02);border-color:rgba(0,0,0,.08)}
.trustcell .tk{flex:none;width:30px;height:30px;background:var(--orange);border-radius:4px;display:flex;
  align-items:center;justify-content:center;color:#1a1208;font-family:'Saira Stencil One',cursive;font-size:14px}
.trustcell .tt{font-family:'Barlow',sans-serif;font-weight:700;text-transform:uppercase;font-size:12.5px;
  letter-spacing:.05em;color:var(--white);margin-bottom:4px}
section.body.warm .trustcell .tt{color:#1a1208}
.trustcell p{margin:0;font-size:13.5px;line-height:1.55;color:var(--light)}
section.body.warm .trustcell p{color:#3a2a1a}

/* CTA STRIP */
.cta-strip{padding:54px 0;background:linear-gradient(135deg,#1d1003 0%,#2a1808 60%);position:relative;text-align:center;border-bottom:1px solid var(--line)}
.cta-strip h2{margin-bottom:14px;color:var(--white)}
.cta-strip p{color:var(--light);max-width:54ch;margin:0 auto 22px}
.cta-strip .ph-cta{justify-content:center}

/* FOOTER */
footer{background:var(--black);padding:48px 0 30px;border-top:1px solid var(--line)}
footer .top{display:grid;grid-template-columns:1fr;gap:30px;padding-bottom:28px;border-bottom:1px solid var(--line)}
@media(min-width:760px){footer .top{grid-template-columns:1.5fr 1fr 1fr 1fr}}
.flogo{font-family:'Saira Stencil One',cursive;font-size:22px;margin-bottom:10px}
.flogo b{color:var(--orange);font-weight:400}
.blurb{font-size:14px;color:var(--mid);line-height:1.55;max-width:38ch}
footer .col h4{font-family:'Barlow',sans-serif;font-weight:800;text-transform:uppercase;font-size:12px;
  letter-spacing:.08em;margin-bottom:14px;color:var(--white)}
footer .col a, footer .col p{display:block;font-size:13.5px;color:var(--mid);margin-bottom:8px;transition:color .15s}
footer .col a:hover{color:var(--orange)}
.fbottom{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;padding-top:22px;font-size:12px;color:var(--mid)}
.creds{display:flex;flex-wrap:wrap;gap:10px}
.creds span{padding:5px 9px;border:1px solid var(--line);border-radius:3px;font-family:'Barlow',sans-serif;
  font-weight:700;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase}

/* BREADCRUMB */
.crumb{padding:14px 0 0;font-family:'Barlow',sans-serif;font-weight:600;font-size:12px;letter-spacing:.04em;color:var(--mid);text-transform:uppercase}
.crumb a{color:var(--mid)}
.crumb a:hover{color:var(--orange)}
.crumb .sep{margin:0 8px;color:var(--line)}

@media (min-width:880px){
  .nav-links{display:flex}
  .phone-h{display:inline}
  .steps{grid-template-columns:1fr 1fr}
}
@media (min-width:1100px){
  .steps.cols-5{grid-template-columns:repeat(5,1fr)}
}

/* ---- TIMELINE STEPS (replaces .steps.cols-5 grid) ---- */
/* Big stencil numerals + dashed connector line. Reads as a marked-up workflow,
   not 5 identical cards. */
.steps.cols-5{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:30px;
  margin:32px 0 18px;
}
.steps.cols-5 .step{
  position:relative;
  background:transparent;
  border:0;
  min-height:0;
  padding:0 0 0 64px;
  display:block;
}
.steps.cols-5 .step::before{
  content:"";position:absolute;left:21px;top:46px;bottom:-30px;
  width:2px;background:repeating-linear-gradient(180deg,var(--orange) 0 6px,transparent 6px 11px);
  opacity:.55
}
.steps.cols-5 .step:last-child::before{display:none}
.steps.cols-5 .step .n{
  position:absolute;left:0;top:0;
  width:44px;height:44px;
  background:transparent;color:var(--orange);
  font-family:'Saira Stencil One',cursive;
  font-size:38px;line-height:1;letter-spacing:-.02em;
  display:flex;align-items:flex-start;justify-content:center;
  border-radius:0;
  border-bottom:3px solid var(--orange)
}
.steps.cols-5 .step h3{
  margin:0 0 6px;
  font-family:'Barlow',sans-serif;font-weight:700;
  font-size:17px;line-height:1.2;color:var(--white);
  text-transform:none;letter-spacing:-.005em
}
section.body.warm .steps.cols-5 .step h3{color:#1a1208}
.steps.cols-5 .step p{
  margin:0;color:var(--light);max-width:48ch;font-size:15px;line-height:1.6
}
section.body.warm .steps.cols-5 .step p{color:#3a2a1a}

@media(min-width:880px){
  .steps.cols-5{
    grid-template-columns:repeat(5,1fr);
    gap:24px;
    padding-top:14px
  }
  .steps.cols-5::before{
    content:"";position:absolute;left:0;right:0;top:36px;height:2px;
    background:repeating-linear-gradient(90deg,var(--orange) 0 8px,transparent 8px 14px);
    opacity:.4;z-index:0
  }
  .steps.cols-5 .step{
    padding:62px 0 0;text-align:left;z-index:1
  }
  .steps.cols-5 .step::before{display:none}
  .steps.cols-5 .step .n{
    left:0;top:0;width:54px;height:48px;
    font-size:42px;
    background:var(--charcoal-2);border-bottom:3px solid var(--orange);
    padding:0 8px
  }
  section.body.warm .steps.cols-5 .step .n{background:var(--warm)}
  .steps.cols-5 .step h3{font-size:15px;line-height:1.25}
  .steps.cols-5 .step p{font-size:14px;line-height:1.55;max-width:none;padding-right:8px}
}

/* ---- DE-SLOP VARIATIONS ---- */
/* Hero variant: no stencil watermark, no grid texture (for reference / non-service pages) */
.ph-hero.bare::before, .ph-hero.bare::after{display:none}
.ph-hero.bare{padding:64px 0 44px;background:linear-gradient(180deg,var(--black),var(--charcoal))}

/* Hero variant: scrappier, utility-feel (for maintenance) */
.ph-hero.utility::before{opacity:.25;background-size:32px 32px}
.ph-hero.utility::after{display:none}
.ph-hero.utility{background:
  repeating-linear-gradient(135deg,rgba(248,144,72,.06) 0 14px,transparent 14px 32px),
  linear-gradient(180deg,#0a0a0a,#1a1a1a)}

/* DOC PAGE — for the compliance hub. Narrower column, denser type, no FAQ accordion in main flow.
   Reads as a reference/document, not a marketing page. */
body.docpage .ph-inner{max-width:720px}
body.docpage h1{font-size:clamp(28px,4.8vw,38px);text-transform:none;letter-spacing:-.005em;line-height:1.15}
body.docpage h1 .o{color:var(--orange)}
body.docpage section.body{padding:48px 0;border-bottom:1px solid var(--line)}
body.docpage section.body .wrap{max-width:740px}
body.docpage h2{font-size:clamp(20px,3.4vw,26px);text-transform:none;font-weight:700;letter-spacing:-.005em;margin:6px 0 14px}
body.docpage h3{font-size:16px;text-transform:none;letter-spacing:0;font-weight:700;margin:22px 0 8px;color:var(--white)}
body.docpage p, body.docpage li{font-size:15.5px;line-height:1.7;max-width:none}
body.docpage .kick{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-family:'Barlow',sans-serif;font-weight:700;color:var(--mid);margin-bottom:6px}
body.docpage .accentbar{display:none}
/* TOC sticky in docpage */
.toc{position:sticky;top:78px;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:6px;padding:16px 18px;margin-bottom:24px;font-size:13.5px}
.toc h4{font-family:'Barlow',sans-serif;font-weight:800;text-transform:uppercase;font-size:11px;letter-spacing:.08em;color:var(--mid);margin-bottom:10px}
.toc a{display:block;color:var(--light);padding:4px 0;border-bottom:1px dashed rgba(255,255,255,.05);transition:color .15s}
.toc a:last-child{border-bottom:none}
.toc a:hover{color:var(--orange)}

/* WORKFLOW (prose-style alternative to .steps for pages where a 5-step grid feels too uniform) */
.workflow{margin-top:8px;border-left:2px solid var(--orange);padding-left:22px}
.workflow .wfitem{margin-bottom:24px}
.workflow .wfitem:last-child{margin-bottom:0}
.workflow h3{font-family:'Barlow',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.01em;
  font-size:16px;margin:0 0 6px;color:var(--white);position:relative}
section.body.warm .workflow h3{color:#1a1208}
.workflow h3 .wftag{font-family:'Saira Stencil One',cursive;color:var(--orange);font-size:13px;letter-spacing:.04em;margin-right:10px;text-transform:none}
.workflow p{margin:0;color:var(--light);max-width:62ch}
section.body.warm .workflow p{color:#3a2a1a}

/* PEN UNDERLINE — for headlines that need a hand-drawn beat. SVG-as-bg, slightly skewed. */
.pen-u{position:relative;display:inline-block}
.pen-u::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-6px;height:10px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 10' preserveAspectRatio='none'%3E%3Cpath d='M2 7 Q 40 2, 80 6 T 160 5 T 198 7' stroke='%23F89048' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  pointer-events:none}

/* STAMPED CALLOUT — feels rubber-stamped onto the page, not a polished card */
.stamp{display:inline-flex;align-items:center;gap:10px;border:2px solid var(--orange);
  padding:8px 14px;font-family:'Saira Stencil One',cursive;font-size:14px;letter-spacing:.04em;
  color:var(--orange);transform:rotate(-1.5deg);background:rgba(248,144,72,.06)}
section.body.warm .stamp{background:rgba(248,144,72,.1)}

/* PULL QUOTE — for occasional emphasis without a uniform card */
.pull{font-family:'Barlow',sans-serif;font-weight:600;font-size:clamp(18px,3.4vw,24px);line-height:1.35;
  color:var(--white);padding:14px 0 14px 22px;border-left:3px solid var(--orange);margin:18px 0;max-width:42ch}
section.body.warm .pull{color:#1a1208}

/* Hide .kick when empty (so we can drop the eyebrow on selected sections without restyling) */
.kick:empty{display:none}

/* SCRAPPY PAGE — for maintenance. Looser, more workshop-y. */
body.scrappy section.body{padding:54px 0}
body.scrappy h2{font-weight:700}
body.scrappy .pricecard, body.scrappy .formcard{border-color:rgba(255,255,255,.14)}
body.scrappy .ph-cta .btn-pri{background:var(--orange)}

/* ---- NAV DROPDOWN ---- */
.nav-drop{position:relative;font-family:'Barlow',sans-serif;font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.nav-drop-toggle{color:var(--light);padding:4px 0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font:inherit;background:transparent;border:0;text-transform:inherit;letter-spacing:inherit;position:relative;transition:color .15s}
.nav-drop-toggle:hover, .nav-drop.active .nav-drop-toggle{color:var(--white)}
.nav-drop.active .nav-drop-toggle{color:var(--orange)}
.nav-drop-toggle::after{content:"";display:inline-block;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:2px;transition:transform .18s}
.nav-drop:hover .nav-drop-toggle::after, .nav-drop:focus-within .nav-drop-toggle::after{transform:rotate(-135deg) translateY(2px)}
.nav-drop-toggle::before{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--orange);transition:width .2s}
.nav-drop.active .nav-drop-toggle::before, .nav-drop:hover .nav-drop-toggle::before{width:calc(100% - 11px)}
.nav-drop-menu{position:absolute;top:calc(100% + 14px);right:-8px;min-width:220px;background:#0a0a0a;border:1px solid var(--line);border-radius:6px;padding:8px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s,visibility .18s,transform .18s;z-index:90;box-shadow:0 12px 32px rgba(0,0,0,.5)}
.nav-drop:hover .nav-drop-menu, .nav-drop:focus-within .nav-drop-menu{opacity:1;visibility:visible;transform:none}
.nav-drop-menu::before{content:"";position:absolute;top:-12px;right:30px;border:6px solid transparent;border-bottom-color:var(--line)}
.nav-drop-menu::after{content:"";position:absolute;top:-10px;right:31px;border:5px solid transparent;border-bottom-color:#0a0a0a}
.nav-drop-menu a{display:block;padding:11px 14px;font-family:'Barlow',sans-serif;font-weight:600;font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--light);border-radius:4px;transition:background .15s,color .15s;position:relative}
.nav-drop-menu a:hover{background:rgba(248,144,72,.1);color:var(--orange)}
.nav-drop-menu a.active{color:var(--orange);background:rgba(248,144,72,.08)}
.nav-drop-menu a::after{display:none}
.nav-drop-menu .menu-meta{display:block;font-family:'Mulish',sans-serif;font-weight:500;font-size:11px;text-transform:none;letter-spacing:0;color:var(--mid);margin-top:2px}
@media(max-width:879px){.nav-drop{display:none}}
