/* ==========================================================================
   Qarhami Web 2.5 — the home page (index.html only)
   1. The keyword eyebrow inside the H1
   2. Fleet OS: the two-line note
   3. Fleet sizes: compact numbers, two purple cards
   4. Insurance: Qarhami × partner lockups, the Green Atlas line
   5. How it works: feature spotlights
   6. Founder: the YouTube channel card
   ========================================================================== */

/* ---------- 1. eyebrow inside the H1 (same look as the old p.lbl) ---------- */
.h-display > .lbl{line-height:1.6;margin:0 0 18px;align-items:flex-start}
.h-display > .lbl::before{flex:none;margin-top:.78em}
.hero2__copy .h-display > .lbl{max-width:520px}
@media (max-width:560px){.hero2__copy .h-display > .lbl{font-size:11.5px;letter-spacing:.13em;gap:8px}}

/* ---------- 2. Fleet OS note ---------- */
.wf__note{text-wrap:balance}
@media (min-width:1041px){.wf__note{font-size:11.5px;letter-spacing:-.002em}}
.wf__disc{display:block;margin-top:4px}

/* ---------- 3. fleet sizes ---------- */
.teams .scale__n{font-size:clamp(24px,2.05vw,30px);letter-spacing:-.01em}
.teams .scale__n small{font-size:12.5px;margin-left:5px}
.teams .scale__c--hi{background:linear-gradient(155deg,#5933E5,#311C7E);border-color:transparent!important}
.teams .scale__c--hi .scale__n,.teams .scale__c--hi h4{color:#fff}
.teams .scale__c--hi .scale__n small{color:rgba(255,255,255,.72)}
.teams .scale__c--hi li{color:rgba(255,255,255,.84);border-top-color:rgba(255,255,255,.18)}
.teams .scale__c:nth-child(2).scale__c--hi{background:linear-gradient(205deg,#5933E5,#311C7E)}
/* two columns: a checkerboard, so the purple cards never stack in one column */
@media (min-width:561px) and (max-width:1040px){
  .teams .scale__c:nth-child(3){background:linear-gradient(205deg,#5933E5,#311C7E);border-color:transparent!important}
  .teams .scale__c:nth-child(3) .scale__n,.teams .scale__c:nth-child(3) h4{color:#fff}
  .teams .scale__c:nth-child(3) .scale__n small{color:rgba(255,255,255,.72)}
  .teams .scale__c:nth-child(3) li{color:rgba(255,255,255,.84);border-top-color:rgba(255,255,255,.18)}
  .teams .scale__c:nth-child(4).scale__c--hi{background:#fff;border-color:var(--hair-2)!important}
  .teams .scale__c:nth-child(4).scale__c--hi .scale__n{color:var(--in)}
  .teams .scale__c:nth-child(4).scale__c--hi h4{color:var(--ink)}
  .teams .scale__c:nth-child(4).scale__c--hi .scale__n small{color:var(--grey)}
  .teams .scale__c:nth-child(4).scale__c--hi li{color:var(--muted);border-top-color:var(--hair-2)}
  .teams .scale__n{font-size:30px}
}

/* ---------- 4. insurance ---------- */
#insurance .split__copy .lede{margin-top:18px}
#insurance .ins__c{gap:14px}
.ins__brand{display:flex;align-items:center;gap:14px;min-height:46px;padding-bottom:16px;margin-bottom:2px;border-bottom:1px solid var(--hair-2)}
.ins__brand img{display:block;width:auto;max-width:none}
.ins__q{height:24px}
.ins__x{font-family:var(--pop);font-weight:300;font-size:22px;line-height:1;color:var(--grey)}
.ins__logo--abi{height:36px}
.ins__logo--tint{height:34px}
.ins__ga{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px 18px;margin-top:18px;padding:18px 22px;border-radius:20px;
  background:#fff;border:1px solid var(--hair-2);box-shadow:var(--sh-card);color:var(--muted);font-size:14.5px;line-height:1.55;
  transition:border-color .25s,box-shadow .25s,transform .25s var(--ease)}
.ins__ga:hover{border-color:var(--in-100);box-shadow:0 18px 40px rgba(37,21,96,.12);transform:translateY(-2px)}
.ins__ga:focus-visible{outline:3px solid var(--in-300);outline-offset:3px}
.ins__ga-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--mt-50);color:var(--mt-700)}
.ins__ga-ic svg{width:22px;height:22px}
.ins__ga-t b{color:var(--ink);font-weight:600}
.ins__ga-go{display:inline-flex;align-items:center;gap:8px;color:var(--in);font-weight:500;white-space:nowrap}
.ins__ga-go svg{width:16px;height:16px;transition:transform .25s var(--ease)}
.ins__ga:hover .ins__ga-go svg{transform:translateX(3px)}
@media (max-width:900px){.ins__ga{grid-template-columns:auto minmax(0,1fr)}.ins__ga-go{grid-column:2}}
@media (max-width:480px){
  .ins__brand{gap:10px}
  .ins__q{height:20px}
  .ins__x{font-size:18px}
  .ins__logo--abi{height:30px}
  .ins__logo--tint{height:28px}
  .ins__ga{padding:16px;gap:12px 14px;align-items:start}
  .ins__ga-ic{width:40px;height:40px;border-radius:12px}
}

/* ---------- 5. feature spotlights (#how) ---------- */
.spot{margin-top:clamp(36px,4.6vw,60px)}
.spot__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:18px}
.spot__h{font-family:var(--nexa);font-weight:900;font-size:clamp(22px,2.2vw,28px);line-height:1.15;color:var(--ink)}
.spot__head p{font-size:15px;color:var(--muted)}
.spot__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
a.spot__card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hair-2);border-radius:22px;overflow:hidden;box-shadow:var(--sh-card);color:inherit;text-decoration:none;
  transition:transform .3s var(--ease),box-shadow .3s}
a.spot__card:hover{transform:translateY(-4px);box-shadow:0 24px 50px rgba(37,21,96,.14)}
a.spot__card:focus-visible{outline:3px solid var(--in-300);outline-offset:3px}
.spot__t{position:relative;display:block;aspect-ratio:16/9;background:var(--deep)}
.spot__t img{width:100%;height:100%;object-fit:cover}
.spot__play{position:absolute;right:14px;bottom:14px;display:inline-flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border-radius:999px;
  background:rgba(11,14,22,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-weight:600;font-size:14px;box-shadow:0 10px 26px -10px rgba(0,0,0,.6)}
.spot__play i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;color:var(--in);transition:transform .25s var(--ease)}
.spot__play i svg{width:13px;height:13px;margin-left:2px}
a.spot__card:hover .spot__play i{transform:scale(1.1)}
.spot__b{display:block;padding:16px 20px 20px}
.spot__k{display:block;font-family:var(--arch);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--in)}
.spot__b b{display:block;margin-top:6px;font-family:var(--pop);font-weight:600;font-size:17px;line-height:1.3;color:var(--ink)}
.spot__b b + span{display:block;margin-top:4px;font-size:14px;color:var(--muted)}
@media (max-width:760px){.spot__grid{grid-template-columns:1fr}}

/* ---------- 6. founder: the channel card (replaces the latest-video player) ---------- */
.latest--cta{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3.4vw,48px);padding:clamp(22px,3vw,36px)}
.latest__copy .lbl{margin-bottom:10px}
.latest__copy h3{font-size:clamp(22px,2.2vw,28px)}
.latest__copy p:last-child{max-width:52ch}
a.latest__sub{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;min-height:112px;padding:22px 24px;border-radius:22px;
  background:linear-gradient(135deg,rgba(89,51,229,.62),rgba(49,28,126,.5));border:1px solid rgba(170,150,255,.45);color:#fff;text-decoration:none;overflow:hidden;
  box-shadow:0 22px 50px -26px rgba(89,51,229,.9);transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
a.latest__sub::before{content:"";position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(13,188,147,.22),rgba(13,188,147,0) 65%);pointer-events:none}
a.latest__sub:hover{transform:translateY(-3px);border-color:rgba(205,192,255,.85);box-shadow:0 28px 60px -24px rgba(89,51,229,1)}
a.latest__sub:focus-visible{outline:2px solid var(--mt);outline-offset:3px}
.latest__yt{position:relative;display:grid;place-items:center;width:64px;height:46px;border-radius:14px;background:#FF0033;color:#fff;box-shadow:0 10px 24px -10px rgba(255,0,51,.8)}
.latest__yt svg{width:20px;height:20px;margin-left:3px}
.latest__st{position:relative;min-width:0}
.latest__st b{display:block;font-family:var(--nexa);font-weight:900;font-size:clamp(20px,1.9vw,25px);line-height:1.15;color:#fff}
.latest__st span{display:block;margin-top:5px;font-size:14px;color:rgba(255,255,255,.72)}
.latest__go{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--in)}
.latest__go svg{width:18px;height:18px;transition:transform .25s var(--ease)}
a.latest__sub:hover .latest__go svg{transform:translateX(3px)}
@media (max-width:900px){.latest--cta{grid-template-columns:1fr}}
@media (max-width:420px){a.latest__sub{gap:14px;padding:18px;grid-template-columns:auto minmax(0,1fr)}.latest__yt{width:54px;height:40px}.latest__go{display:none}}

/* ---------- 7. FAQ: links inside answers ---------- */
#faq .a a{color:var(--in);font-weight:500;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
#faq .a a:hover{color:var(--in-700)}