/* =====================================================================
   HermitMonster - studio.css   (2032 brutalist-editorial top layer)
   Final statement: huge confident type, mono HUD, stark hairline grid,
   high-contrast. Loads last. Reversible (remove the link). Persona-aware.
   ===================================================================== */

/* hairline grid frame on big sections (editorial structure) */
.section { position: relative; }
.section + .section { border-top: 1px solid var(--line); }

/* mono HUD labels become the system signature */
.hud-label { font-family: var(--font-mono); letter-spacing: .24em; opacity: .7; }

/* oversized, tighter section heads with index numerals */
.section-head { display: grid; gap: .4rem; }
.section-head h2 { letter-spacing: -.035em; }

/* cards: flatten to stark editorial blocks with a hover invert */
.work-card, .tile, .cap { transition: transform .4s var(--ease), background .4s var(--ease), color .4s var(--ease); }
.cap:hover { transform: translateY(-4px); }

/* number plates, mono, oversized */
.cap__no, .stat__num { font-family: var(--font-mono); }
.stat__num { font-size: clamp(2.4rem, 6vw, 4rem); font-weight: 600; letter-spacing: -.04em; }

/* footer: turn into a confident sign-off slab */
.site-footer { border-top: 1px solid var(--line-strong); }

/* refined chips/eyebrows: monospace tags */
.chip { font-family: var(--font-mono); letter-spacing: .04em; text-transform: uppercase; font-size: .68rem; }

/* big editorial dividers between work groups */
.index-group + .index-group { margin-top: clamp(3rem, 8vw, 6rem); padding-top: clamp(3rem, 8vw, 6rem); border-top: 1px solid var(--line); }
