/* ------------------------------------------------------------
   agency.css — the front page of an agency's own subdomain.

   Loaded by index.html on every host, but only ever visible on a
   tenant. The colors come from the agency's stored theme, written
   onto :root by tenant.js; the fallbacks below are LicenseFlow's own,
   so an agency with no theme still gets a coherent page rather than
   an unstyled one.
------------------------------------------------------------ */

/* Which of the two documents in index.html is allowed to show. Set from
   the hostname before first paint, so neither one flashes. */
html.is-tenant #lfSite,
html.is-tenant #lfFoot { display: none !important; }
html.is-platform #agencyHome { display: none !important; }

#agencyHome{
  --ag:        var(--brand, #0C3D82);
  --ag-600:    var(--brand-600, #082C5F);
  --ag-050:    var(--accent-050, #EAF0F8);
  --ag-gold:   var(--agency-gold, #0C3D82);
  --ag-gold-i: var(--agency-gold-ink, #0C3D82);
  --ag-gold-0: var(--agency-gold-050, #EAF0F8);
  --ag-ink:    #0F1620;
  --ag-ink2:   #39465C;
  --ag-mut:    #5A6678;
  --ag-line:   #DDE3EC;
  --ag-line2:  #EEF1F6;
  --ag-disp:   var(--ff-display, "Libre Franklin", Inter, sans-serif);
  display:block;background:#F3F6FA;color:var(--ag-ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-weight:400;line-height:1.62;
}
#agencyHome *{box-sizing:border-box}
#agencyHome a{text-decoration:none}

/* ---------- bar ---------- */
.ah-bar{display:flex;align-items:center;gap:12px;padding:0 26px;height:62px;background:var(--ag)}
.ah-logo{display:flex;align-items:center;gap:9px}
.ah-mark{width:30px;height:30px;border-radius:8px;flex:none;display:grid;place-items:center;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:var(--ag-gold)}
.ah-word{line-height:1.06}
.ah-word b{display:block;font-family:var(--ag-disp);font-weight:600;font-size:1.02rem;
  letter-spacing:-.008em;color:#fff}
.ah-word span{display:block;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;
  color:#A9C0E0;font-weight:500}
.ah-tag{margin-right:auto;font-size:.73rem;font-weight:600;padding:.18rem .58rem;border-radius:999px;
  background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.26)}
html.themed .ah-tag{background:var(--ag-gold-0);color:var(--ag-gold-i);border-color:transparent}
.ah-nav{display:flex;gap:16px;align-items:center;font-size:.85rem}
.ah-nav a{color:#C6D3E8}
.ah-nav a:hover{color:#fff;text-decoration:underline}

/* ---------- hero ---------- */
.ah-hero{position:relative;overflow:hidden;background:var(--brand-600,#082C5F);min-height:460px;
  display:flex;align-items:center}
.ah-scene{position:absolute;inset:0;width:100%;height:100%;display:block}

/* ---- an agency's own photograph ----------------------------------
   The picture bleeds off the right and is masked into the navy rather
   than butting against it, so there is no vertical seam where the
   image ends. The scrim then does the reading work: everything under
   the words stays dark enough for white type at any window width. */
.ah-hero.ah-photo{background:#04122C}
.ah-shot{position:absolute;inset:0 0 0 30%;background-repeat:no-repeat;
  background-position:right top;background-size:cover;
  -webkit-mask-image:linear-gradient(100deg,transparent 0%,rgba(0,0,0,.30) 16%,#000 44%);
  mask-image:linear-gradient(100deg,transparent 0%,rgba(0,0,0,.30) 16%,#000 44%)}
.ah-scrim.shot{background:
  linear-gradient(101deg,rgba(3,13,32,.97) 0%,rgba(4,17,42,.93) 26%,rgba(5,22,54,.68) 46%,
    rgba(6,28,66,.28) 64%,rgba(6,32,74,.06) 80%,rgba(6,34,79,0) 92%),
  radial-gradient(115% 85% at 76% 34%,rgba(255,238,200,.14),transparent 60%),
  radial-gradient(140% 120% at 50% 50%,transparent 55%,rgba(2,9,24,.42) 100%)}
.ah-sweep{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.ah-sweep .sw-gold{fill:var(--ag-gold)}
.ah-sweep .sw-navy{fill:var(--ag-600)}
.ah-hero.ah-photo .ah-in{padding-bottom:104px}
.ah-hero.ah-photo h1{text-shadow:0 1px 20px rgba(2,9,24,.55)}
/* On a narrow window the picture would sit behind the words. Drop it to
   a band across the top instead of fighting the text for the same space. */
@media (max-width:820px){
  .ah-shot{inset:0 0 46% 0;-webkit-mask-image:none;mask-image:none}
  .ah-scrim.shot{background:linear-gradient(180deg,rgba(3,13,32,.62) 0%,rgba(4,17,42,.86) 44%,
    rgba(4,17,42,.97) 60%,#04122C 74%)}
  .ah-hero.ah-photo .ah-in{padding-top:220px}
}
.ah-scrim{position:absolute;inset:0;background:linear-gradient(100deg,
  rgba(4,17,42,.92) 0%, rgba(5,20,48,.74) 32%, rgba(6,28,66,.30) 58%,
  rgba(6,34,79,.06) 78%, transparent 92%)}
.ah-in{position:relative;z-index:2;padding:56px 26px;width:100%;max-width:1180px;margin:0 auto}
.ah-kicker{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:#E7C66B;margin:0}
html.themed .ah-kicker{color:var(--ag-gold)}
.ah-hero h1{font-family:var(--ag-disp);font-weight:500;font-size:clamp(1.9rem,3.6vw,2.55rem);
  letter-spacing:-.014em;line-height:1.14;margin:14px 0;color:#fff;max-width:19ch;
  text-wrap:balance}
.ah-hero h1 em{font-style:italic;color:#E7C66B}
html.themed .ah-hero h1 em{color:var(--ag-gold)}
.ah-lede{color:#CFDCEC;font-size:1.02rem;font-weight:400;max-width:52ch;margin:0 0 28px;
  line-height:1.66}
.ah-doors{display:flex;gap:12px;flex-wrap:wrap}
.ah-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.82rem 1.5rem;border-radius:11px;
  font-weight:600;font-size:.96rem;border:1px solid transparent;cursor:pointer}
.ah-btn.gold{background:#fff;color:var(--ag)}
html.themed .ah-btn.gold{background:var(--ag-gold);color:#231A08}
.ah-btn.gold:hover{filter:brightness(1.06)}
.ah-btn.ghost{background:rgba(255,255,255,.07);color:#fff;border-color:rgba(255,255,255,.38)}
.ah-btn.ghost:hover{background:rgba(255,255,255,.15)}
/* Says what the second door costs before anyone walks through it. */
.ah-note{margin:14px 0 0;font-size:.85rem;font-weight:300;color:rgba(255,255,255,.72)}

/* ---------- mission ---------- */
.ah-mission{background:#fff;border-bottom:1px solid var(--ag-line);padding:40px 26px;
  text-align:center}
.ah-quote{font-family:var(--ag-disp);font-style:italic;font-weight:400;
  font-size:clamp(1.3rem,2.4vw,1.72rem);letter-spacing:-.012em;color:var(--ag);margin:0}
.ah-rule{width:52px;height:2px;background:var(--ag-gold);margin:16px auto 14px;border-radius:2px}
.ah-mission p{margin:0 auto;color:var(--ag-mut);font-size:.97rem;max-width:62ch}

/* ---------- coverage rails ---------- */
.ah-band{background:#F3F6FA;border-bottom:1px solid var(--ag-line);padding:22px 0 24px}
.ah-lab{display:flex;gap:16px;align-items:baseline;justify-content:center;margin-bottom:14px;
  font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#6B7686;font-weight:600}
.ah-lab b{color:var(--ag-gold-i);font-weight:600}
.ah-rail{position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.ah-rail + .ah-rail{margin-top:9px}
.ah-track{display:flex;gap:9px;width:max-content;will-change:transform}
.ah-track.a{animation:ahSlideL 46s linear infinite}
.ah-track.b{animation:ahSlideR 52s linear infinite}
@keyframes ahSlideL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ahSlideR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.ah-rail:hover .ah-track{animation-play-state:paused}
.ah-tile{flex:0 0 auto;background:#fff;border:1px solid var(--ag-line);border-radius:7px;
  padding:8px 14px;font-size:.78rem;font-weight:500;color:var(--ag-mut);letter-spacing:.06em}
.ah-tile.on{border-color:var(--ag-gold);color:var(--ag-gold-i);background:var(--ag-gold-0)}

/* ---------- the CEO ---------- */
.ah-leader{background:#fff;padding:44px 26px;display:grid;
  grid-template-columns:auto minmax(0,1fr);gap:32px;align-items:start;
  border-bottom:1px solid var(--ag-line);max-width:1180px;margin:0 auto}
.ah-face{width:132px;height:158px;border-radius:14px;flex:none;display:grid;place-items:center;
  background:linear-gradient(160deg,var(--ag),var(--ag-600));border:1px solid var(--ag-line);
  box-shadow:0 8px 22px rgba(8,43,99,.16)}
.ah-face b{font-family:var(--ag-disp);font-size:2.4rem;font-weight:500;color:#fff}
html.themed .ah-face b{color:var(--ag-gold)}
.ah-eye{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ag-gold-i);
  font-weight:600}
.ah-leader h2{font-family:var(--ag-disp);font-size:clamp(1.35rem,2.4vw,1.6rem);font-weight:500;
  color:var(--ag);margin:8px 0 2px;letter-spacing:-.014em}
.ah-role{font-size:.9rem;color:var(--ag-mut);margin-bottom:14px}
.ah-leader p{font-size:.98rem;color:var(--ag-ink2);line-height:1.68;max-width:66ch;margin:0 0 18px}
.ah-stats{display:flex;gap:34px;flex-wrap:wrap}
.ah-stats b{display:block;font-family:var(--ag-disp);font-size:1.42rem;font-weight:500;
  color:var(--ag);line-height:1.1}
.ah-stats span{font-size:.79rem;color:var(--ag-mut)}

/* ---------- what you'll do here ---------- */
.ah-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ag-line)}
.ah-strip > div{background:#fff;padding:22px 26px}
.ah-strip b{display:block;font-family:var(--ag-disp);font-size:1rem;font-weight:600;
  color:var(--ag);margin-bottom:5px}
.ah-strip p{margin:0;font-size:.89rem;color:#4E5A6B;line-height:1.6}

.ah-foot{padding:20px 26px;font-size:.82rem;color:var(--ag-mut);display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;background:#F3F6FA;
  border-top:1px solid var(--ag-line)}
.ah-foot a{color:var(--ag-mut);text-decoration:underline}

.ah-fallback{max-width:520px;margin:0 auto;padding:80px 26px;text-align:center}
.ah-fallback h1{font-family:var(--ag-disp);font-weight:600;font-size:1.6rem;color:var(--ag);
  margin:0 0 10px}
.ah-fallback p{color:var(--ag-mut)}

@media (max-width:820px){
  .ah-leader{grid-template-columns:1fr;gap:20px}
  .ah-strip{grid-template-columns:1fr}
  .ah-nav{display:none}
}
@media (prefers-reduced-motion:reduce){
  .ah-track.a,.ah-track.b{animation:none}
}

/* ============================================================
   NO THEME, NO BORROWED IDENTITY

   An agency row with an empty theme was inheriting the design built for
   Pacific Ridgeway -- their dawn, their dark hero, their editorial type
   -- because that page had quietly become the default for everybody.
   LicenseFlow's own demo wore a customer's clothes.

   An unthemed agency now gets LicenseFlow's house style: white ground,
   navy type, the plain hero from the marketing site.
   ============================================================ */
html.plain .ah-bar{background:#fff;border-bottom:1px solid #DCE3EC;height:66px}
html.plain .ah-mark{background:var(--ag,#0C3D82);border-color:transparent;color:#fff}
html.plain .ah-word b{font-family:Inter,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-weight:700;color:#061223;letter-spacing:-.02em}
html.plain .ah-word span{color:#8293A8}
html.plain .ah-tag{background:#EAF0F8;color:#0C3D82;border-color:transparent}
html.plain .ah-nav a{color:#51637A}
html.plain .ah-nav a:hover{color:#061223}

html.plain .ah-hero{background:#fff;min-height:0;border-bottom:1px solid #EDF1F6}
html.plain .ah-in{padding:82px 26px 74px}
/* The short rule before the eyebrow is the marketing page's own mark. */
html.plain .ah-kicker{color:#0C3D82;display:flex;align-items:center;gap:12px}
html.plain .ah-kicker::before{content:"";width:22px;height:2px;background:#0C3D82;flex:none}
html.plain .ah-hero h1{font-family:"Libre Franklin",Inter,sans-serif;font-weight:800;
  color:#061223;letter-spacing:-.028em;font-size:clamp(2rem,4vw,2.9rem);max-width:17ch}
html.plain .ah-hero h1 em{font-style:normal;color:#0C3D82}
html.plain .ah-lede{color:#51637A}
html.plain .ah-btn.gold{background:#0C3D82;color:#fff}
html.plain .ah-btn.gold:hover{background:#082C5F;filter:none}
html.plain .ah-btn.ghost{background:#fff;color:#061223;border-color:#DCE3EC}
html.plain .ah-btn.ghost:hover{background:#F4F7FA;border-color:#C6D2E2}
html.plain .ah-note{color:#51637A}

/* the rest of the page, in the house palette rather than an agency's */
html.plain .ah-quote{color:#061223;font-family:"Libre Franklin",Inter,sans-serif;
  font-style:normal;font-weight:700;letter-spacing:-.024em}
html.plain .ah-rule{background:#0C3D82}
html.plain .ah-lab b{color:#0C3D82}
html.plain .ah-tile.on{border-color:#0C3D82;color:#0C3D82;background:#EAF0F8}