/* ============================================================
   Lighthouse — site-wide adoption of the IIE hero language
   Rajdhani uppercase display + JetBrains Mono labels, gradient-edge
   glassy panels (replacing the gold-corner brackets), sitewide dot-grid,
   scanline panel texture, status pills, per-word heading rise.
   Loaded last so it wins the cascade.
   ============================================================ */
:root { --rajd: 'Rajdhani', 'JetBrains Mono', sans-serif; }

/* ---- sitewide dot-grid behind everything ---- */
body::before {
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(255,255,255,0.05) 0.5px, transparent 0.5px);
  background-size: 6px 6px;
}
main, footer { position: relative; z-index: 1; }

/* ---- display headings → uppercase Rajdhani everywhere ---- */
.statement p.big, .apps .head h2, .work .wcell h3, .close h2, .howworks h2 {
  font-family: var(--rajd) !important; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0; color: var(--text-primary);
}
.statement p.big { font-size: clamp(28px, 3vw, 40px); line-height: 1.0; max-width: 17ch; }
.statement p.big .accent { color: var(--marigold); font-style: normal; }
.apps .head h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.0; max-width: 17ch; }
.apps .head h2 em { font-style: normal; color: var(--marigold); }
.howworks h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.0; max-width: 20ch; }
.howworks h2 .ac { color: var(--marigold); }
.work .wcell h3 { font-size: clamp(19px, 1.9vw, 25px); line-height: 1.04; }
.close h2 { font-size: clamp(44px, 6.2vw, 88px); line-height: 0.96; letter-spacing: 0; }


/* ---- gold-corner brackets → gradient-edge glassy panel ---- */
.gcbox > .corner { display: none !important; }
.gcbox > .edge { display: none !important; }
.gcbox {
  border: 1px solid transparent;
  background:
    linear-gradient(var(--canvas-2), var(--canvas-2)) padding-box,
    linear-gradient(140deg, rgba(202,169,11,0.55), rgba(202,169,11,0.06) 62%) border-box;
}
/* scanline texture inside framed regions */
.stage, .work .wcell { position: relative; }
.stage::before, .work .wcell::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,0.020) 0 1px, transparent 1px 5px);
}
.stage > *, .work .wcell > * { position: relative; z-index: 1; }

/* §02 rail edge to match */
.show .rail { border-right: 1px solid rgba(202,169,11,0.14); }

/* ---- reusable status pill (from the hero) ---- */
.pill {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 7px 13px; border: 1px solid rgba(202,169,11,0.28); background: rgba(202,169,11,0.07);
  font-family: var(--font-mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--marigold);
}
.pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--marigold); box-shadow: 0 0 10px 1px var(--marigold); animation: pillPulse 3s ease-in-out infinite; }
@keyframes pillPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { .pill .dot { animation: none; } }

/* ---- reusable glassy panel (from the hero cards) ---- */
.panel { position: relative; padding: 0.75px; background: linear-gradient(140deg, rgba(202,169,11,0.55), rgba(202,169,11,0.07)); }
.panel > .panel-in { position: relative; background: var(--canvas-2); border: 1px solid var(--hair); padding: 26px; height: 100%; overflow: hidden; }
.panel > .panel-in::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(255,255,255,0.022) 0 1px, transparent 1px 5px); }
.panel .panel-in > * { position: relative; }

/* ===== §03 work cells: add a corner status tag ===== */
.work .wcell { padding-top: 52px; }
.work .wcell .k { color: var(--periwinkle); font-size: 11px; }
.work .wtag { position: absolute; top: 18px; right: 20px; z-index: 2; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--text-tertiary); }
.how-note { font-family: var(--font-ui); font-size: 13px; letter-spacing: 0.04em; color: var(--text-tertiary); margin: 14px 0 30px; }

/* ===== close: mirror the hero ===== */
#closebeam { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.close .beamfb { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(60% 70% at 50% 50%, rgba(202,169,11,0.12), transparent 62%); }
.close .pill { display: flex; width: max-content; margin: 0 auto 28px; }

/* ---- per-word heading rise (accent-preserving) ---- */
.wr .word { display: inline-block; }
.wr .wsp { display: inline-block; width: 0.28em; }
.wr .word > i { display: inline-block; font-style: normal; }
.wr .word.ac > i { color: var(--marigold); }
html.js .reveal:not(.in) .wr .word > i { opacity: 0; transform: translateY(20px); }
.reveal.in .wr .word > i { animation: secWordUp 0.85s var(--ease-out-expo) both; }
@keyframes secWordUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
body.frozen .wr .word > i { opacity: 1 !important; transform: none !important; animation: none !important; }
@media (prefers-reduced-motion: reduce) { .wr .word > i { opacity: 1 !important; transform: none !important; animation: none !important; } }

@media (max-width: 900px) {

}

/* ============================================================
   Shared primitives for secondary pages (Resources, Company)
   ============================================================ */
/* font-weight pinned so the label renders identically as a heading tag (h2.seclabel, F66) */
.seclabel { display: flex; align-items: baseline; gap: 16px; font-family: var(--font-mono); font-size: 11px; font-weight: 400; letter-spacing: 0.26em; text-transform: uppercase; color: var(--periwinkle); }
.display-h { font-family: var(--rajd); font-weight: 600; text-transform: uppercase; letter-spacing: 0; line-height: 1.0; color: var(--text-primary); }
.display-h .ac { color: var(--marigold); }

footer { border-top: 1px solid var(--hair); padding: 38px 0 calc(38px + env(safe-area-inset-bottom)); position: relative; z-index: 1; }
footer .wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; row-gap: 14px; }
footer .fl { display: flex; align-items: center; gap: 12px; }
footer .muted { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-tertiary); white-space: nowrap; } /* subtext aligned to the 11px micro tier */
footer .links { display: flex; gap: 26px; flex-wrap: wrap; row-gap: 12px; }
@media (max-width: 560px) {
  /* D157: the single edge-to-edge row ran the five labels together with no gap
     ("HOMELIGHTHOUSECOMPANY...") and the nowrap copyright overflowed the screen.
     Recut as a filed two-column index: hairline-separated rows, full-width tap
     targets, Contact spanning the last row, copyright centred and free to wrap. */
  footer { padding: 30px 0 calc(30px + env(safe-area-inset-bottom)); }
  footer .wrap { flex-direction: column; align-items: stretch; gap: 0; row-gap: 0; }
  footer .links {
    order: 1; width: 100%;
    display: grid; grid-template-columns: 1fr 1fr;
    column-gap: 20px; row-gap: 0;
  }
  footer .links a {
    padding: 15px 0; margin: 0;
    border-bottom: 1px solid var(--hair);
    font-size: 12px; letter-spacing: 0.14em;
  }
  footer .links a:nth-child(5) { grid-column: 1 / -1; }
  footer .fl { order: 2; justify-content: center; margin-top: 22px; padding-top: 0; border-top: 0; }
  footer .muted { font-size: 11px; letter-spacing: 0.1em; opacity: 0.85; white-space: normal; text-align: center; }
}
footer .links a { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-tertiary); transition: color 140ms; padding: 14px 8px; margin: -14px -8px; }
footer .links a:hover { color: var(--text-primary); }

body.frozen .reveal { opacity: 1 !important; transform: none !important; animation: none !important; }
.nav .navlinks a.cur { color: var(--marigold); }

/* reveal container — animation-based (not transition) so it survives paint
   throttling and the body.frozen failsafe can snap it visible. Homepage
   defines the same inline; this covers the secondary pages. */
.reveal { opacity: 1; transform: none; transition: none; }
html.js .reveal:not(.in) { opacity: 0; transform: translateY(22px); }
.reveal.in { animation: revealRise 820ms var(--ease-out-quint) both; }
@keyframes revealRise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal.in { opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; }
}

/* ROUND-7 (C8.9/D138): chrome numerals replaced by stroke icons sitewide -
   .nic inherits its container's color (the M26/didx lighting transfers via
   currentColor); decorative only, aria-hidden, numbers survive in aria refs. */
.nic { display: inline-block; vertical-align: middle; }

/* ============================================================
   POST-TRANSPLANT ADDITIONS (dev-scope — not part of the verbatim
   sheet above; keep appended, never interleave).
   D175 (owner, 2026-07-24): the D157 mobile footer read as
   disorganized. Root cause: the sheet's negative-margin tap-target
   trick (padding 14px 8px; margin -14px -8px) compresses the
   two-column grid to a 16px row pitch with heavily overlapping
   tap boxes. On phones the trick is released in favor of REAL
   44px index rows (the site's own D159 target rule) with hairline
   separators (the mnav grammar). Contact keeps its authored
   full-width final row (:nth-child(5) rule above); the © line
   keeps its authored centered 11px mono treatment untouched.
   Desktop keeps the original compact trick.
   ============================================================ */
@media (max-width: 760px) {
  #pagefoot .links { row-gap: 0; }
  #pagefoot .links a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 8px;
    margin: 0; /* release the negative-margin trick — the rows are real now */
    border-bottom: 1px solid var(--hair);
  }
}

/* D176 (owner, 2026-07-24): the mobile close read as unlit — D23 removes the
   beam canvas on phones, and the 0.12-alpha centered fallback whispered too
   quietly to carry the overhead-glow intent. The fallback now speaks the
   desktop beam's own language (beam.js overhead mode: warm core near the top,
   gold washing downward, its exact three color stops, glowA-scale alpha) —
   still pure CSS, so D23's no-canvas phone budget holds. The unbooted canvas
   is also explicitly hidden on phones: it rendered display:block at the
   300×150 default (transparent, harmless) but would also keep a
   desktop-booted canvas alive after a shrink past 760. Applies to all three
   closes (Home / LightHouse / Company) via this shared sheet. */
@media (max-width: 760px) {
  .close canvas { display: none; }
  .close .beamfb {
    background:
      radial-gradient(95% 60% at 50% 0%, rgba(255, 243, 200, 0.10), rgba(0, 0, 0, 0) 34%),
      radial-gradient(85% 80% at 50% 8%, rgba(230, 207, 4, 0.20), rgba(202, 169, 11, 0.09) 48%, rgba(0, 0, 0, 0) 72%);
  }
}

/* D191 (2026-07-24): the footer gained Privacy + Terms, so `.links` carries SEVEN
   items instead of five. The carried rule
       footer .links a:nth-child(5) { grid-column: 1 / -1; }
   was authored when Contact was the fifth AND last link, expressing "the odd one
   out spans the final row". With seven it fires on Privacy instead, stranding
   Contact alone in a half row and pushing Terms to a row of its own.
   Neutralised and re-expressed against :last-child, which is what the rule always
   meant. The carried declaration above is left untouched and diffable (D168);
   `#pagefoot` out-specifies `footer`, so this wins without !important. */
@media (max-width: 760px) {
  #pagefoot .links a:nth-child(5) { grid-column: auto; }
  #pagefoot .links a:last-child { grid-column: 1 / -1; }
}