/* ═══ about/firm.css — OWNER: AGENT E (v4 Firm pages). Shared page css for
   /about/, /about/team/, /community/, /locations/ (all four link this file).
   Consumes tokens.css + scenes.css primitives; adds only firm-page layout.
   All media rules live HERE (SPEC: never in responsive.css). ═══ */

/* ── Scene modifiers ── */
.firm-scene-short{min-height:auto;padding-top:calc(140px + env(safe-area-inset-top,0px));padding-bottom:var(--s-7);}

/* ── Hero panel + lede ── */
.firm-panel{max-width:760px;padding:var(--s-6) var(--s-5);}
.firm-lede{font-size:var(--fs-md);color:var(--text);line-height:1.85;max-width:62ch;margin-bottom:var(--s-3);}
.firm-body{font-size:var(--fs-base);color:var(--muted);line-height:1.85;max-width:62ch;margin-bottom:var(--s-3);}

/* ── Definition block (v3 .definition-block migrated — sections.css is not
     loaded on /about/, so the recipe is recreated here for the verbatim copy) ── */
.firm-def{border-left:2px solid var(--gold);background:var(--glass-bg-light);padding:var(--s-3) var(--s-3);margin:var(--s-3) 0;}
.firm-def-term{font-family:'Cormorant Garamond',serif;font-size:var(--fs-lg);font-style:italic;color:var(--gold);margin-bottom:8px;}
.firm-def p{font-size:var(--fs-base);color:var(--text);line-height:1.8;}

/* ── Card grids ── */
.firm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3);margin-top:var(--s-4);}
.firm-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-3);margin-top:var(--s-4);}
@media (max-width:1023px){.firm-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:680px){.firm-grid,.firm-grid-2{grid-template-columns:1fr;}}

/* ── Feature card icon (v3 .feature-icon equivalent) ── */
.firm-ico{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:1.15rem;background:var(--gold-dim);border:1px solid var(--border);margin-bottom:14px;}

/* ── About imagery cell (single image, dimensioned — zero CLS) ── */
.firm-img{position:relative;overflow:hidden;}
.firm-img img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block;filter:brightness(0.85);}
.firm-img::after{content:'';position:absolute;bottom:0;left:0;right:0;height:50px;background:linear-gradient(to top,var(--navy-mid),transparent);}

/* ── HQ card (/locations/) ── */
.firm-hq{max-width:640px;padding:var(--s-5);margin-top:var(--s-4);}
.firm-hq h2{font-family:'Cormorant Garamond',serif;font-size:var(--fs-2xl);color:var(--white);font-weight:600;line-height:1.15;margin-bottom:4px;}
.firm-hq-label{display:inline-block;font-size:0.66rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;}
.firm-hq-addr{font-style:normal;font-size:var(--fs-base);color:var(--text);line-height:1.8;margin-bottom:var(--s-3);}
.firm-hq-addr a{color:var(--muted);text-decoration:none;transition:color var(--dur-micro);}
.firm-hq-addr a:hover{color:var(--gold);}
.firm-hq-actions{display:flex;gap:14px;flex-wrap:wrap;}

/* ── Office chips (v3 offices-grid migrated; sections.css not loaded here,
     so .office/.office-city are restyled as v4 glass chips) ── */
.firm-offices{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s-4);}
.firm-offices .office{
  background:var(--glass-bg);
  backdrop-filter:blur(var(--glass-blur)) saturate(140%);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(140%);
  border:1px solid var(--glass-border);
  padding:14px 22px;
}
.firm-offices .office-city{font-size:0.74rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--text);}
.firm-offices a.office{display:block;text-decoration:none;transition:border-color var(--dur-micro),transform var(--dur-micro);}
.firm-offices a.office:hover,.firm-offices a.office:focus-visible{border-color:var(--glass-border-gold);transform:translateY(var(--lift));}
.firm-offices a.office .office-city{color:var(--gold);}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .firm-offices .office{background:rgba(var(--surface-rgb),0.92);}
}
@media (max-width:600px){.firm-offices{gap:8px 10px;}.firm-offices .office{padding:10px 16px;}.firm-offices .office-city{font-size:0.68rem;letter-spacing:0.12em;}}

/* ── Small footnote line ── */
.firm-note{display:block;font-size:0.74rem;color:var(--muted);line-height:1.7;margin-top:var(--s-3);max-width:62ch;}

/* ── CTA band spacing inside its flow scene ── */
.firm-cta{margin-top:var(--s-2);}

/* ── /about/team/ spliced v3 team block (ORCH:TEAM-BLOCK) ──
   The verbatim v3 section carries .eyebrow/.section-h/.section-sub/.wa-stagger
   reveal targets that tokens.css hides under html.wa-anim, but hero.js (the v2
   revealer) is NOT loaded on this page. firm.js runs a scoped IO revealer for
   legacy blocks outside .wa-scene; this rule is the belt-and-braces fail-open:
   if firm.js never runs, the head-bootstrap safety net force-reveals at
   load+1200ms, and reduced-motion/no-IO never hides anything at all. */
