/* ==========================================================================
   labelsnlanes.com - Layout & Component Styles (v3.0.0)
   Resolves all tokens.css variables. No hard-coded colours or typefaces.
   Scoped under .ll-* classes so no bleed into WordPress admin or other themes.
   ========================================================================== */

/* BASE RESET -------------------------------------------------------------- */
html { font-family: var(--ll-font-serif); font-size: 100%; color: var(--ll-graphite); background: var(--ll-bone); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
body.ll-body { font-family: var(--ll-font-serif); font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); font-weight: var(--ll-fw-regular); color: var(--ll-graphite); background: var(--ll-bone); margin: 0; padding: 0; }
* { box-sizing: border-box; }

/* FOCUS RING — WCAG 2.1 AA ------------------------------------------------ */
a:focus-visible, button:focus-visible, .ll-btn:focus-visible { outline: var(--ll-focus-width) solid var(--ll-focus-ring); outline-offset: var(--ll-focus-offset); }

/* SKIP LINK --------------------------------------------------------------- */
.ll-skip-link { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.ll-skip-link:focus { position: fixed; left: var(--ll-space-4); top: var(--ll-space-4); width: auto; height: auto; padding: var(--ll-space-3) var(--ll-space-5); background: var(--ll-ink-forest); color: var(--ll-bone); z-index: 10000; }

/* HEADER — wordmark + CTA only (per PKN direction) ------------------------- */
.ll-header { background: var(--ll-bone); border-bottom: 1px solid var(--ll-pale-stone); position: sticky; top: 0; z-index: 100; }
.ll-header-inner { max-width: var(--ll-max-wide); margin: 0 auto; padding: var(--ll-space-5) var(--ll-gutter-desktop); display: flex; align-items: center; justify-content: space-between; gap: var(--ll-space-5); }
@media (max-width: 768px) { .ll-header-inner { padding: var(--ll-space-4) var(--ll-gutter-mobile); } }
.ll-wordmark { font-family: var(--ll-font-serif); font-size: var(--ll-fs-21); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); text-decoration: none; letter-spacing: 0; }
.ll-wordmark-dot { color: var(--ll-tobacco); }
.ll-cta-button { display: inline-flex; align-items: center; justify-content: center; font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); font-weight: var(--ll-fw-medium); text-transform: uppercase; letter-spacing: 0.08em; text-decoration: none; background: var(--ll-ink-forest); color: var(--ll-bone); padding: 13px 26px; min-height: 44px; min-width: 44px; border-radius: var(--ll-radius-1); transition: background var(--ll-duration-base) var(--ll-easing-standard); }
.ll-cta-button:hover { background: var(--ll-deep-forest); color: var(--ll-bone); }

/* MAIN -------------------------------------------------------------------- */
.ll-main { min-height: 50vh; }

/* PAGE content wrapper — let wp:html blocks do their own layout ------------ */
.ll-page-content > section { padding: var(--ll-space-11) var(--ll-gutter-desktop); }
@media (max-width: 768px) { .ll-page-content > section { padding: var(--ll-space-9) var(--ll-gutter-mobile); } }
.ll-page-content > section.hero, .ll-page-content > section.pillar-hero { padding-top: var(--ll-space-10); padding-bottom: var(--ll-space-12); background: var(--ll-bone); }
.ll-page-content > section.verticals, .ll-page-content > section.capabilities, .ll-page-content > section.related, .ll-page-content > section.featured { background: var(--ll-paper); }
.ll-page-content > section.advisory-preview, .ll-page-content > section.approach, .ll-page-content > section.approach-strip { background: var(--ll-bone); }
.ll-page-content > section.capability-layer, .ll-page-content > section.closing-band { background: var(--ll-ink-forest); color: var(--ll-bone); }
.ll-page-content > section.longform { background: var(--ll-bone); padding-top: var(--ll-space-10); padding-bottom: var(--ll-space-12); }

/* Container utilities within page content */
.ll-page-content .container-wide { max-width: var(--ll-max-wide); margin: 0 auto; padding: 0 var(--ll-gutter-desktop); }
.ll-page-content .container-page { max-width: var(--ll-max-page); margin: 0 auto; padding: 0 var(--ll-gutter-desktop); }
.ll-page-content .container-content { max-width: var(--ll-max-content); margin: 0 auto; padding: 0 var(--ll-gutter-desktop); }
@media (max-width: 768px) { .ll-page-content .container-wide, .ll-page-content .container-page, .ll-page-content .container-content { padding: 0 var(--ll-gutter-mobile); } }

/* TYPOGRAPHY — eyebrows, titles, deks inside page content ----------------- */
.ll-page-content .type-eyebrow { font-family: var(--ll-font-sans); font-size: var(--ll-fs-11); font-weight: var(--ll-fw-medium); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ll-tobacco); margin: 0 0 var(--ll-space-2); }
.ll-page-content .hero-eyebrow { color: var(--ll-tobacco); }
.ll-page-content .hero-title, .ll-page-content .pillar-hero-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-52); font-weight: var(--ll-fw-medium); line-height: var(--ll-lh-52); letter-spacing: 0; color: var(--ll-ink-forest); margin: var(--ll-space-5) 0; max-width: 900px; }
.ll-page-content .hero-dek, .ll-page-content .pillar-hero-dek { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); line-height: 1.55; color: var(--ll-graphite); max-width: 720px; margin-bottom: var(--ll-space-7); }
.ll-page-content .type-h2 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-28); font-weight: var(--ll-fw-medium); line-height: var(--ll-lh-28); color: var(--ll-ink-forest); }
.ll-page-content .type-body, .ll-page-content p { font-family: var(--ll-font-serif); font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); }
.ll-page-content .type-body-small { font-size: var(--ll-fs-14); line-height: var(--ll-lh-14); }
.ll-page-content a { color: var(--ll-ink-forest); text-decoration: underline; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
.ll-page-content a:hover { color: var(--ll-tobacco); }

/* HERO actions ------------------------------------------------------------- */
.ll-page-content .hero-actions { display: flex; gap: var(--ll-space-4); flex-wrap: wrap; }

/* BUTTONS ------------------------------------------------------------------ */
.ll-btn, .ll-page-content a.btn, .ll-page-content .btn { display: inline-flex; align-items: center; justify-content: center; font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); font-weight: var(--ll-fw-medium); text-transform: uppercase; letter-spacing: 0.08em; text-decoration: none; border-radius: var(--ll-radius-1); min-height: 44px; min-width: 44px; padding: 13px 26px; cursor: pointer; transition: all var(--ll-duration-base) var(--ll-easing-standard); }
.ll-btn-primary, .ll-page-content .btn-primary { background: var(--ll-ink-forest); color: var(--ll-bone); border: none; }
.ll-btn-primary:hover, .ll-page-content .btn-primary:hover { background: var(--ll-deep-forest); color: var(--ll-bone); text-decoration: none; }
.ll-btn-ghost, .ll-page-content .btn-ghost { background: transparent; color: var(--ll-ink-forest); border: 1px solid var(--ll-ink-forest); }
.ll-btn-ghost:hover, .ll-page-content .btn-ghost:hover { background: var(--ll-ink-forest); color: var(--ll-bone); text-decoration: none; }

/* VERTICALS grid (homepage) ----------------------------------------------- */
.ll-page-content .verticals-header { max-width: 900px; margin-bottom: var(--ll-space-9); }
.ll-page-content .verticals-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--ll-space-6); }
@media (max-width: 1024px) { .ll-page-content .verticals-grid { grid-template-columns: 1fr; gap: var(--ll-space-5); } }
.ll-page-content .vertical-card { background: var(--ll-bone); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-7) var(--ll-space-6); display: flex; flex-direction: column; transition: border-color var(--ll-duration-base); }
.ll-page-content .vertical-card:hover { border-color: var(--ll-tobacco); }
.ll-page-content .vertical-number { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ll-tobacco); margin-bottom: var(--ll-space-4); }
.ll-page-content .vertical-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-24); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-4); }
.ll-page-content .vertical-dek { font-family: var(--ll-font-serif); font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); color: var(--ll-graphite); margin-bottom: var(--ll-space-5); flex: 1; }
.ll-page-content .vertical-link { font-family: var(--ll-font-sans); font-size: var(--ll-fs-14); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); text-decoration: none; margin-top: auto; }
.ll-page-content .vertical-link:hover { color: var(--ll-tobacco); }

/* INTEGRATED ADVISORY preview (homepage + integrated-advisory page) -------- */
.ll-page-content .advisory-preview-header { max-width: 900px; margin-bottom: var(--ll-space-9); }
.ll-page-content .bundles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--ll-space-5); }
@media (max-width: 1024px) { .ll-page-content .bundles-grid { grid-template-columns: 1fr; } }
.ll-page-content .bundle-card { background: var(--ll-bone); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-6); text-decoration: none; display: flex; flex-direction: column; transition: border-color var(--ll-duration-base); }
.ll-page-content .bundle-card:hover { border-color: var(--ll-tobacco); text-decoration: none; }
.ll-page-content .bundle-card.flagship { background: var(--ll-paper); border-left: var(--ll-border-strong) solid var(--ll-tobacco); }
.ll-page-content .bundle-letter { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); font-weight: var(--ll-fw-medium); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ll-tobacco); margin-bottom: var(--ll-space-4); }
.ll-page-content .bundle-flagship-tag { margin-left: var(--ll-space-2); color: var(--ll-ink-forest); font-size: var(--ll-fs-11); }
.ll-page-content .bundle-card h3 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-21); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-3); line-height: 1.35; }
.ll-page-content .bundle-card p { font-size: var(--ll-fs-16); line-height: 1.55; margin-bottom: var(--ll-space-5); flex: 1; }
.ll-page-content .bundle-cta { font-family: var(--ll-font-sans); font-size: var(--ll-fs-14); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); }
.ll-page-content .advisory-preview-foot { display: flex; gap: var(--ll-space-4); flex-wrap: wrap; margin-top: var(--ll-space-8); }

/* CAPABILITY LAYER (dark band) -------------------------------------------- */
.ll-page-content section.capability-layer .container-wide { color: var(--ll-bone); }
.ll-page-content section.capability-layer .type-eyebrow { color: var(--ll-tobacco); }
.ll-page-content section.capability-layer h2 { color: var(--ll-bone); font-family: var(--ll-font-serif); font-size: var(--ll-fs-34); font-weight: var(--ll-fw-medium); line-height: var(--ll-lh-34); margin: var(--ll-space-4) 0 var(--ll-space-7); max-width: 900px; }
.ll-page-content .capability-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--ll-space-5); margin-bottom: var(--ll-space-6); }
@media (max-width: 1024px) { .ll-page-content .capability-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ll-page-content .capability-grid { grid-template-columns: 1fr; } }
.ll-page-content .capability-tile { border-top: 1px solid rgba(239, 234, 225, 0.2); padding-top: var(--ll-space-5); }
.ll-page-content .capability-tile h3 { color: var(--ll-bone); font-size: var(--ll-fs-21); font-weight: var(--ll-fw-medium); margin: 0 0 var(--ll-space-3); }
.ll-page-content .capability-tile p { color: rgba(239, 234, 225, 0.8); font-size: var(--ll-fs-15); line-height: 1.6; }
.ll-page-content .capability-layer-foot { color: rgba(239, 234, 225, 0.65); font-style: italic; font-size: var(--ll-fs-14); margin-top: var(--ll-space-6); max-width: 900px; }

/* FIVE-STAGE APPROACH ----------------------------------------------------- */
.ll-page-content .approach-header { max-width: 900px; margin-bottom: var(--ll-space-9); }
.ll-page-content .approach-flow { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); text-transform: uppercase; letter-spacing: 0.1em; color: var(--ll-tobacco); margin-top: var(--ll-space-5); }
.ll-page-content .approach-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--ll-space-4); }
@media (max-width: 1024px) { .ll-page-content .approach-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ll-page-content .approach-grid { grid-template-columns: 1fr; } }
.ll-page-content .approach-stage { border-top: 1px solid var(--ll-pale-stone); padding-top: var(--ll-space-5); }
.ll-page-content .stage-num { font-family: var(--ll-font-mono); font-size: var(--ll-fs-12); color: var(--ll-tobacco); margin-bottom: var(--ll-space-3); display: block; }
.ll-page-content .approach-stage h3 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-2); }
.ll-page-content .approach-stage p { font-size: var(--ll-fs-14); line-height: 1.55; }

/* APPROACH STRIP (hub page variant) ---------------------------------------- */
.ll-page-content ol.approach-stages { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--ll-space-4); margin: var(--ll-space-6) 0 0; }
@media (max-width: 1024px) { .ll-page-content ol.approach-stages { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ll-page-content ol.approach-stages { grid-template-columns: 1fr; } }
.ll-page-content ol.approach-stages li { border-top: 1px solid var(--ll-pale-stone); padding-top: var(--ll-space-5); display: flex; flex-direction: column; gap: var(--ll-space-2); }
.ll-page-content ol.approach-stages .stage-name { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); }
.ll-page-content ol.approach-stages .stage-body { font-family: var(--ll-font-serif); font-size: var(--ll-fs-14); line-height: 1.55; }

/* PERSPECTIVES grid (homepage block) -------------------------------------- */
.ll-page-content .perspectives-header { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: var(--ll-space-5); margin-bottom: var(--ll-space-9); }
.ll-page-content .perspectives-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--ll-space-5); }
@media (max-width: 1024px) { .ll-page-content .perspectives-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ll-page-content .perspectives-grid { grid-template-columns: 1fr; } }
.ll-page-content .perspective-card { background: var(--ll-bone); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-6) var(--ll-space-5); text-decoration: none; display: flex; flex-direction: column; transition: border-color var(--ll-duration-base); }
.ll-page-content .perspective-card:hover { border-color: var(--ll-tobacco); text-decoration: none; }
.ll-page-content .perspective-pillar { font-family: var(--ll-font-sans); font-size: var(--ll-fs-11); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ll-tobacco); margin-bottom: var(--ll-space-4); }
.ll-page-content .perspective-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); line-height: 1.35; margin: 0 0 var(--ll-space-4); }
.ll-page-content .perspective-dek { font-size: var(--ll-fs-15); line-height: 1.55; flex: 1; margin-bottom: var(--ll-space-5); }
.ll-page-content .perspective-meta { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); color: var(--ll-stone); }

/* FEATURED card (hub featured perspective) -------------------------------- */
.ll-page-content .featured-card { background: var(--ll-paper); border-left: var(--ll-border-strong) solid var(--ll-tobacco); padding: var(--ll-space-10) var(--ll-space-8); max-width: var(--ll-max-page); margin: 0 auto; }
.ll-page-content .featured-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-34); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); line-height: var(--ll-lh-34); margin: var(--ll-space-4) 0 var(--ll-space-5); }
.ll-page-content .featured-dek { font-size: var(--ll-fs-18); line-height: 1.55; max-width: 900px; }
.ll-page-content .featured-meta { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); color: var(--ll-stone); margin-top: var(--ll-space-5); display: flex; gap: var(--ll-space-2); flex-wrap: wrap; }

/* RELATED grid ------------------------------------------------------------ */
.ll-page-content .related-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--ll-space-6); }
@media (max-width: 768px) { .ll-page-content .related-grid { grid-template-columns: 1fr; } }
.ll-page-content .related-card { background: var(--ll-bone); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-6) var(--ll-space-5); text-decoration: none; display: flex; flex-direction: column; }
.ll-page-content .related-card:hover { border-color: var(--ll-tobacco); text-decoration: none; }
.ll-page-content .related-pillar { font-family: var(--ll-font-sans); font-size: var(--ll-fs-11); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ll-tobacco); margin-bottom: var(--ll-space-4); }
.ll-page-content .related-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-3); line-height: 1.35; }
.ll-page-content .related-dek { font-size: var(--ll-fs-15); line-height: 1.55; margin-bottom: var(--ll-space-4); flex: 1; }
.ll-page-content .related-meta { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); color: var(--ll-stone); }

/* CAPABILITIES grid (hub pages) -------------------------------------------- */
.ll-page-content .capabilities-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--ll-space-6); }
@media (max-width: 1024px) { .ll-page-content .capabilities-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ll-page-content .capabilities-grid { grid-template-columns: 1fr; } }
.ll-page-content .capability { background: var(--ll-bone); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-6) var(--ll-space-5); }
.ll-page-content .capability-number { font-family: var(--ll-font-mono); font-size: var(--ll-fs-12); color: var(--ll-tobacco); margin-bottom: var(--ll-space-4); }
.ll-page-content .capability-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-21); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-4); }
.ll-page-content .capability-body { font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); }

/* CLOSING band (homepage, dark) ------------------------------------------- */
.ll-page-content section.closing-band .container-wide { color: var(--ll-bone); }
.ll-page-content .closing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ll-space-9); max-width: var(--ll-max-wide); margin: 0 auto; }
@media (max-width: 1024px) { .ll-page-content .closing-grid { grid-template-columns: 1fr; } }
.ll-page-content .closing-card { color: var(--ll-bone); }
.ll-page-content .closing-card .type-eyebrow { color: var(--ll-tobacco); }
.ll-page-content .closing-card h3 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-28); font-weight: var(--ll-fw-medium); color: var(--ll-bone); margin: var(--ll-space-4) 0 var(--ll-space-5); line-height: 1.28; }
.ll-page-content .closing-card p { font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); color: rgba(239, 234, 225, 0.82); margin-bottom: var(--ll-space-6); }
.ll-page-content .closing-card a.btn-ghost { background: transparent; color: var(--ll-bone); border-color: var(--ll-bone); }
.ll-page-content .closing-card a.btn-ghost:hover { background: var(--ll-bone); color: var(--ll-ink-forest); }
.ll-page-content .closing-card a.btn-primary { background: var(--ll-bone); color: var(--ll-ink-forest); }
.ll-page-content .closing-card a.btn-primary:hover { background: var(--ll-paper); color: var(--ll-ink-forest); }

/* ADVISORY CTA card ------------------------------------------------------- */
.ll-page-content .cta-card { background: var(--ll-paper); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-10) var(--ll-space-8); max-width: var(--ll-max-page); margin: 0 auto; text-align: center; }
.ll-page-content .cta-card h3 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-28); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-4); }
.ll-page-content .cta-card p { font-size: var(--ll-fs-18); line-height: 1.55; max-width: 720px; margin: 0 auto var(--ll-space-6); }

/* BREADCRUMB -------------------------------------------------------------- */
.ll-page-content nav.breadcrumb { padding: var(--ll-space-5) var(--ll-gutter-desktop) !important; font-family: var(--ll-font-sans); font-size: var(--ll-fs-13); color: var(--ll-stone); background: var(--ll-bone); }
.ll-page-content nav.breadcrumb ol { display: flex; gap: var(--ll-space-3); flex-wrap: wrap; margin: 0; padding: 0; list-style: none; max-width: var(--ll-max-wide); margin: 0 auto; }
.ll-page-content nav.breadcrumb a { color: var(--ll-ink-forest); text-decoration: none; }

/* LONGFORM (legal pages + Perspectives body) ------------------------------- */
.ll-longform-wrap { max-width: var(--ll-max-content); margin: 0 auto; padding: 0 var(--ll-gutter-desktop); }
@media (max-width: 768px) { .ll-longform-wrap { padding: 0 var(--ll-gutter-mobile); } }
.ll-page-content .longform-wrap { max-width: var(--ll-max-content); margin: 0 auto; padding: 0 var(--ll-gutter-desktop); }
.ll-page-content .longform-body { font-family: var(--ll-font-serif); font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); color: var(--ll-graphite); }
.ll-page-content .longform-body h2 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-24); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: var(--ll-space-9) 0 var(--ll-space-4); }
.ll-page-content .longform-body h3 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: var(--ll-space-6) 0 var(--ll-space-3); }
.ll-page-content .longform-body p { margin: 0 0 var(--ll-space-5); }
.ll-page-content .longform-signoff { font-family: var(--ll-font-sans); font-size: var(--ll-fs-13); color: var(--ll-stone); margin-top: var(--ll-space-8); border-top: 1px solid var(--ll-pale-stone); padding-top: var(--ll-space-5); }

/* PERSPECTIVE single-page layout ------------------------------------------ */
.ll-perspective-header { background: var(--ll-bone); padding: var(--ll-space-10) 0 var(--ll-space-9); border-bottom: 1px solid var(--ll-pale-stone); }
.ll-breadcrumb { font-family: var(--ll-font-sans); font-size: var(--ll-fs-13); color: var(--ll-stone); margin-bottom: var(--ll-space-6); display: flex; gap: var(--ll-space-3); flex-wrap: wrap; }
.ll-breadcrumb a { color: var(--ll-ink-forest); text-decoration: none; }
.ll-eyebrow { font-family: var(--ll-font-sans); font-size: var(--ll-fs-11); font-weight: var(--ll-fw-medium); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ll-tobacco); margin: 0 0 var(--ll-space-3); }
.ll-perspective-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-42); font-weight: var(--ll-fw-medium); line-height: var(--ll-lh-42); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-5); max-width: 800px; }
.ll-perspective-dek { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); line-height: 1.55; color: var(--ll-graphite); font-style: italic; max-width: 720px; margin-bottom: var(--ll-space-5); }
.ll-perspective-meta { font-family: var(--ll-font-sans); font-size: var(--ll-fs-13); color: var(--ll-stone); display: flex; gap: var(--ll-space-3); flex-wrap: wrap; }
.ll-perspective-body { background: var(--ll-bone); padding: var(--ll-space-10) 0 var(--ll-space-12); }
.ll-perspective-body h2 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-24); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: var(--ll-space-8) 0 var(--ll-space-4); }
.ll-perspective-body h3 { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: var(--ll-space-6) 0 var(--ll-space-3); }
.ll-perspective-body p { font-family: var(--ll-font-serif); font-size: var(--ll-fs-16); line-height: var(--ll-lh-16); margin: 0 0 var(--ll-space-5); }
.ll-perspective-body blockquote { border-left: var(--ll-border-rule) solid var(--ll-tobacco); margin: var(--ll-space-7) 0; padding: var(--ll-space-3) var(--ll-space-6); font-style: italic; font-size: var(--ll-fs-18); color: var(--ll-ink-forest); }

/* ARCHIVE listing --------------------------------------------------------- */
.ll-archive { background: var(--ll-bone); padding: var(--ll-space-10) 0 var(--ll-space-12); }
.ll-archive-inner { max-width: var(--ll-max-wide); margin: 0 auto; padding: 0 var(--ll-gutter-desktop); }
@media (max-width: 768px) { .ll-archive-inner { padding: 0 var(--ll-gutter-mobile); } }
.ll-archive-header { margin-bottom: var(--ll-space-9); }
.ll-archive-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-42); font-weight: var(--ll-fw-medium); line-height: var(--ll-lh-42); color: var(--ll-ink-forest); }
.ll-archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--ll-space-5); }
@media (max-width: 1024px) { .ll-archive-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .ll-archive-grid { grid-template-columns: 1fr; } }
.ll-archive-card { background: var(--ll-paper); border: 1px solid var(--ll-pale-stone); padding: var(--ll-space-6) var(--ll-space-5); text-decoration: none; display: flex; flex-direction: column; transition: border-color var(--ll-duration-base); }
.ll-archive-card:hover { border-color: var(--ll-tobacco); text-decoration: none; }
.ll-card-pillar { font-family: var(--ll-font-sans); font-size: var(--ll-fs-11); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ll-tobacco); margin: 0 0 var(--ll-space-3); }
.ll-card-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-18); font-weight: var(--ll-fw-medium); color: var(--ll-ink-forest); margin: 0 0 var(--ll-space-3); line-height: 1.35; }
.ll-card-dek { font-size: var(--ll-fs-15); line-height: 1.55; margin: 0 0 var(--ll-space-4); flex: 1; color: var(--ll-graphite); }
.ll-card-meta { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); color: var(--ll-stone); margin: 0; }

/* 404 --------------------------------------------------------------------- */
.ll-404 { background: var(--ll-bone); padding: var(--ll-space-12) var(--ll-gutter-desktop); text-align: center; }
.ll-404-inner { max-width: var(--ll-max-content); margin: 0 auto; }
.ll-404-title { font-family: var(--ll-font-serif); font-size: var(--ll-fs-42); font-weight: var(--ll-fw-medium); line-height: var(--ll-lh-42); color: var(--ll-ink-forest); margin: var(--ll-space-4) 0; }
.ll-404-dek { font-size: var(--ll-fs-18); line-height: 1.55; margin-bottom: var(--ll-space-7); }
.ll-404-actions { display: flex; gap: var(--ll-space-4); justify-content: center; flex-wrap: wrap; }

/* FOOTER ------------------------------------------------------------------ */
.ll-footer { background: var(--ll-deep-forest); color: var(--ll-bone); padding: var(--ll-space-10) var(--ll-gutter-desktop) var(--ll-space-7); }
@media (max-width: 768px) { .ll-footer { padding: var(--ll-space-9) var(--ll-gutter-mobile) var(--ll-space-6); } }
.ll-footer-inner { max-width: var(--ll-max-wide); margin: 0 auto; }
.ll-footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--ll-space-8); margin-bottom: var(--ll-space-8); }
@media (max-width: 1024px) { .ll-footer-grid { grid-template-columns: 1fr 1fr; gap: var(--ll-space-6); } }
@media (max-width: 640px) { .ll-footer-grid { grid-template-columns: 1fr; } }
.ll-footer-col h4 { font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); font-weight: var(--ll-fw-medium); text-transform: uppercase; letter-spacing: 0.08em; color: rgba(239, 234, 225, 0.6); margin: 0 0 var(--ll-space-4); }
.ll-footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--ll-space-2); }
.ll-footer-col a { color: var(--ll-bone); text-decoration: none; font-size: var(--ll-fs-14); }
.ll-footer-col a:hover { color: var(--ll-tobacco); }
.ll-footer-mark { font-family: var(--ll-font-serif); font-size: var(--ll-fs-21); font-weight: var(--ll-fw-medium); margin: 0 0 var(--ll-space-3); }
.ll-footer-tag { font-size: var(--ll-fs-14); line-height: 1.55; color: rgba(239, 234, 225, 0.7); max-width: 340px; }
.ll-footer-legal { border-top: 1px solid rgba(239, 234, 225, 0.1); padding-top: var(--ll-space-5); display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--ll-space-4); font-family: var(--ll-font-sans); font-size: var(--ll-fs-12); color: rgba(239, 234, 225, 0.6); }
.ll-footer-legal a { color: rgba(239, 234, 225, 0.8); text-decoration: none; }
.ll-footer-legal a:hover { color: var(--ll-tobacco); }

/* ==========================================================================
   Premium interactive layer v3.0.0
   ========================================================================== */

.ll-premium {
  background: var(--ll-porcelain);
}

.ll-premium .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.ll-premium .ll-header {
  background: rgba(247, 245, 239, 0.92);
  border-bottom: 1px solid rgba(30, 42, 34, 0.12);
  box-shadow: none;
  backdrop-filter: blur(18px);
}

.ll-premium .ll-header.is-scrolled {
  box-shadow: 0 16px 40px rgba(20, 24, 15, 0.08);
}

.ll-premium .ll-header-inner {
  min-height: 76px;
  padding-top: var(--ll-space-3);
  padding-bottom: var(--ll-space-3);
}

.ll-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--ll-space-3);
  color: var(--ll-ink-forest);
  text-decoration: none;
  min-width: 220px;
}

.ll-brand:hover {
  color: var(--ll-ink-forest);
  text-decoration: none;
}

.ll-brand-mark,
.ll-footer-brand-mark {
  display: block;
  flex: 0 0 auto;
}

.ll-brand-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ll-premium .ll-wordmark {
  font-size: var(--ll-fs-18);
  line-height: 1.1;
  letter-spacing: 0;
}

.ll-brand-line {
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-11);
  line-height: var(--ll-lh-11);
  color: var(--ll-stone);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ll-nav-list {
  display: flex;
  align-items: center;
  gap: var(--ll-space-1);
  list-style: none;
  padding: 0;
  margin: 0;
}

.ll-nav-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 var(--ll-space-3);
  border-radius: var(--ll-radius-2);
  color: var(--ll-graphite);
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-13);
  text-decoration: none;
}

.ll-nav-link:hover,
.ll-nav-link:focus-visible {
  background: rgba(36, 90, 115, 0.08);
  color: var(--ll-ink-forest);
  text-decoration: none;
}

.ll-header-actions {
  display: inline-flex;
  align-items: center;
  gap: var(--ll-space-3);
}

.ll-premium .ll-cta-button {
  border: 1px solid var(--ll-ink-forest);
  box-shadow: 0 10px 28px rgba(30, 42, 34, 0.14);
}

.ll-menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: var(--ll-space-2);
  min-width: 44px;
  min-height: 44px;
  padding: 0 var(--ll-space-3);
  border: 1px solid rgba(30, 42, 34, 0.18);
  border-radius: var(--ll-radius-2);
  background: transparent;
  color: var(--ll-ink-forest);
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-12);
  cursor: pointer;
}

.ll-menu-bars,
.ll-menu-bars::before,
.ll-menu-bars::after {
  display: block;
  width: 16px;
  height: 1px;
  background: currentColor;
  content: "";
}

.ll-menu-bars {
  position: relative;
}

.ll-menu-bars::before,
.ll-menu-bars::after {
  position: absolute;
  left: 0;
}

.ll-menu-bars::before {
  top: -5px;
}

.ll-menu-bars::after {
  top: 5px;
}

.ll-mobile-panel {
  border-top: 1px solid rgba(30, 42, 34, 0.12);
  background: var(--ll-porcelain);
}

.ll-mobile-panel nav {
  display: grid;
  gap: 1px;
  max-width: var(--ll-max-wide);
  margin: 0 auto;
  padding: var(--ll-space-3) var(--ll-gutter-mobile) var(--ll-space-5);
}

.ll-mobile-panel a {
  display: flex;
  align-items: center;
  min-height: 48px;
  color: var(--ll-ink-forest);
  border-bottom: 1px solid rgba(30, 42, 34, 0.08);
  font-family: var(--ll-font-sans);
  text-decoration: none;
}

.ll-mobile-panel a:hover {
  color: var(--ll-copper);
}

@media (max-width: 980px) {
  .ll-primary-nav {
    display: none;
  }

  .ll-menu-toggle {
    display: inline-flex;
  }
}

@media (max-width: 520px) {
  .ll-brand-line,
  .ll-menu-toggle-label {
    display: none;
  }

  .ll-brand {
    min-width: 0;
  }
}

.ll-page-content > section.hero {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(36, 90, 115, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(30, 42, 34, 0.06) 1px, transparent 1px),
    linear-gradient(180deg, var(--ll-porcelain), var(--ll-bone));
  background-size: 56px 56px, 56px 56px, auto;
}

.ll-js-ready .ll-page-content .hero .container-wide.ll-hero-enhanced {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 520px);
  align-items: center;
  gap: var(--ll-space-9);
}

.ll-hero-copy {
  max-width: 760px;
}

.ll-page-content .hero-title,
.ll-page-content .pillar-hero-title,
.ll-perspective-title,
.ll-archive-title {
  font-size: var(--ll-fs-52);
  line-height: var(--ll-lh-52);
  letter-spacing: 0;
}

.ll-page-content .type-h2,
.ll-page-content section.capability-layer h2,
.ll-page-content .featured-title {
  font-size: var(--ll-fs-34);
  line-height: var(--ll-lh-34);
  letter-spacing: 0;
}

@media (max-width: 960px) {
  .ll-js-ready .ll-page-content .hero .container-wide.ll-hero-enhanced {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .ll-page-content .hero-title,
  .ll-page-content .pillar-hero-title,
  .ll-perspective-title,
  .ll-archive-title {
    font-size: var(--ll-fs-34);
    line-height: var(--ll-lh-34);
  }

  .ll-page-content .type-h2,
  .ll-page-content section.capability-layer h2,
  .ll-page-content .featured-title {
    font-size: var(--ll-fs-24);
    line-height: var(--ll-lh-24);
  }
}

.ll-hero-visual {
  position: relative;
  border: 1px solid rgba(30, 42, 34, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.58), rgba(239, 234, 225, 0.72)),
    repeating-linear-gradient(90deg, rgba(30, 42, 34, 0.08) 0 1px, transparent 1px 24px);
  box-shadow: var(--ll-shadow-raised);
  min-height: 440px;
  padding: var(--ll-space-6);
  overflow: hidden;
}

.ll-hero-visual::before {
  position: absolute;
  inset: var(--ll-space-5);
  border: 1px solid rgba(178, 138, 68, 0.35);
  border-radius: 6px;
  content: "";
  pointer-events: none;
}

.ll-triad-kicker {
  position: relative;
  z-index: 2;
  margin: 0;
  color: var(--ll-cabernet);
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-11);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ll-triad-plane {
  position: relative;
  z-index: 1;
  min-height: 270px;
  margin-top: var(--ll-space-4);
}

.ll-triad-svg {
  position: absolute;
  inset: 10px 0 0;
  width: 100%;
  height: 240px;
}

.ll-triad-svg path {
  fill: none;
  stroke: rgba(30, 42, 34, 0.34);
  stroke-width: 1.4;
}

.ll-triad-svg path:nth-child(2) {
  stroke: rgba(36, 90, 115, 0.34);
}

.ll-triad-svg path:nth-child(3) {
  stroke: rgba(94, 37, 55, 0.32);
}

.ll-triad-node {
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 118px;
  min-height: 54px;
  border: 1px solid rgba(30, 42, 34, 0.18);
  border-radius: 6px;
  background: rgba(247, 245, 239, 0.9);
  color: var(--ll-ink-forest);
  box-shadow: var(--ll-shadow-soft);
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-12);
  font-weight: var(--ll-fw-medium);
  cursor: pointer;
  transition: transform var(--ll-duration-base) var(--ll-easing-standard), border-color var(--ll-duration-base) var(--ll-easing-standard), background var(--ll-duration-base) var(--ll-easing-standard);
}

.ll-triad-node:hover,
.ll-triad-node.is-active {
  transform: translateY(-3px);
  border-color: var(--ll-brass);
  background: var(--ll-ink-forest);
  color: var(--ll-bone);
}

.ll-node-capital {
  top: 0;
  left: 50%;
  margin-left: -59px;
}

.ll-node-spaces {
  left: 3%;
  bottom: 18px;
}

.ll-node-brands {
  right: 3%;
  bottom: 18px;
}

.ll-triad-readout {
  position: relative;
  z-index: 2;
  border-top: 1px solid rgba(30, 42, 34, 0.14);
  padding-top: var(--ll-space-4);
}

.ll-triad-readout h3 {
  margin: 0 0 var(--ll-space-2);
  color: var(--ll-ink-forest);
  font-size: var(--ll-fs-21);
  letter-spacing: 0;
}

.ll-triad-readout p {
  margin: 0;
  color: var(--ll-graphite);
  font-size: var(--ll-fs-14);
  line-height: var(--ll-lh-14);
}

.ll-page-content .vertical-card,
.ll-page-content .bundle-card,
.ll-page-content .perspective-card,
.ll-page-content .related-card,
.ll-page-content .capability,
.ll-page-content .approach-stage,
.ll-archive-card {
  border-radius: 8px;
  box-shadow: var(--ll-shadow-soft);
  transform: translateY(0);
  transition: transform var(--ll-duration-base) var(--ll-easing-standard), box-shadow var(--ll-duration-base) var(--ll-easing-standard), border-color var(--ll-duration-base) var(--ll-easing-standard);
}

.ll-page-content .vertical-card:hover,
.ll-page-content .bundle-card:hover,
.ll-page-content .perspective-card:hover,
.ll-page-content .related-card:hover,
.ll-page-content .capability:hover,
.ll-archive-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--ll-shadow-raised);
}

.ll-page-content .bundle-card.flagship,
.ll-page-content .featured-card {
  background:
    linear-gradient(90deg, rgba(178, 138, 68, 0.12), transparent 34%),
    var(--ll-paper);
}

.ll-page-content section.capability-layer,
.ll-page-content section.closing-band {
  background:
    linear-gradient(90deg, rgba(36, 90, 115, 0.18) 1px, transparent 1px),
    linear-gradient(180deg, var(--ll-ink-forest), var(--ll-deep-forest));
  background-size: 64px 64px, auto;
}

.ll-page-content .approach-stage {
  background: rgba(247, 245, 239, 0.7);
  border: 1px solid rgba(30, 42, 34, 0.12);
  padding: var(--ll-space-5);
}

.ll-js-ready [data-ll-reveal] {
  opacity: 0;
  transform: translateY(18px);
}

.ll-js-ready [data-ll-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

.ll-footer {
  background:
    linear-gradient(90deg, rgba(178, 138, 68, 0.14) 1px, transparent 1px),
    var(--ll-deep-forest);
  background-size: 68px 68px, auto;
}

.ll-footer-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: var(--ll-space-6);
  margin-bottom: var(--ll-space-9);
  padding: var(--ll-space-7);
  border: 1px solid rgba(239, 234, 225, 0.16);
  border-radius: 8px;
  background: rgba(239, 234, 225, 0.05);
}

.ll-footer-cta-kicker {
  grid-column: 1 / -1;
  margin: 0 0 calc(var(--ll-space-3) * -1);
  color: var(--ll-brass);
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-11);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ll-footer-cta h2 {
  max-width: 760px;
  margin: 0;
  color: var(--ll-bone);
  font-size: var(--ll-fs-34);
  line-height: var(--ll-lh-34);
  letter-spacing: 0;
}

.ll-footer-cta-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 var(--ll-space-5);
  border-radius: var(--ll-radius-2);
  background: var(--ll-bone);
  color: var(--ll-ink-forest);
  font-family: var(--ll-font-sans);
  font-size: var(--ll-fs-12);
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}

.ll-footer-cta-link:hover {
  background: var(--ll-brass);
  color: var(--ll-deep-forest);
}

.ll-footer-mark {
  display: inline-flex;
  align-items: center;
  gap: var(--ll-space-3);
}

@media (max-width: 820px) {
  .ll-footer-cta {
    grid-template-columns: 1fr;
    padding: var(--ll-space-5);
  }

  .ll-footer-cta h2 {
    font-size: var(--ll-fs-24);
    line-height: var(--ll-lh-24);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ll-triad-node,
  .ll-page-content .vertical-card,
  .ll-page-content .bundle-card,
  .ll-page-content .perspective-card,
  .ll-page-content .related-card,
  .ll-page-content .capability,
  .ll-page-content .approach-stage,
  .ll-archive-card,
  .ll-js-ready [data-ll-reveal] {
    transition-duration: 1ms;
    transform: none;
  }
}