/* ==========================================================================
   Auto Fleet Hub — Industrial Steel / Safety Amber utility theme
   Namespace: afh-  ·  Fonts: Barlow (display) + Zen Kaku Gothic New (body)
   Weights: 400 / 500 only. Sharp, tabular, modular-bento layout language.
   ========================================================================== */

:root {
    --afh-steel-900: #2C3E50;
    --afh-steel-800: #32495c;
    --afh-steel-700: #34495E;
    --afh-steel-600: #46617a;
    --afh-steel-300: #b9c4cc;
    --afh-steel-100: #e2e7ea;
    --afh-amber: #F39C12;
    --afh-amber-dark: #cf8309;
    --afh-amber-ink: #4a2f00;
    --afh-concrete: #ECF0F1;
    --afh-concrete-200: #dfe5e6;
    --afh-white: #ffffff;
    --afh-ink: #1c252d;
    --afh-muted: #5b6b78;
    --afh-muted-light: rgba(236,240,241,0.72);
    --afh-border: rgba(44,62,80,0.16);
    --afh-border-light: rgba(255,255,255,0.18);
    --afh-font-display: 'Barlow', 'Zen Kaku Gothic New', sans-serif;
    --afh-font-body: 'Zen Kaku Gothic New', 'Barlow', sans-serif;
    --afh-radius-sm: 2px;
    --afh-radius: 4px;
    --afh-container: 1280px;
    --afh-pad: clamp(1.25rem, 4vw, 3rem);
    --afh-section-pad: clamp(3.5rem, 8vw, 6.5rem);
    --afh-header-h: 104px;
}

/* ---------- Reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { scrollbar-width: none; -ms-overflow-style: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar { display: none; width: 0; height: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
    margin: 0;
    font-family: var(--afh-font-body);
    font-weight: 400;
    color: var(--afh-ink);
    background: var(--afh-concrete);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font-family: inherit; cursor: pointer; background: none; border: none; color: inherit; }
address { font-style: normal; }
table { border-collapse: collapse; width: 100%; }
input, textarea { font-family: inherit; font-size: 15px; }

h1, h2, h3 {
    font-family: var(--afh-font-display);
    font-weight: 500;
    margin: 0;
    color: var(--afh-steel-900);
    line-height: 1.28;
    letter-spacing: -0.01em;
}
h1 { font-size: clamp(28px, 4vw, 32px); }
h2 { font-size: clamp(22px, 3.2vw, 26px); }
h3 { font-size: clamp(18px, 2.2vw, 20px); }
p { font-size: clamp(14px, 1.4vw, 16px); line-height: 1.75; color: var(--afh-muted); margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
small, .afh-caption { font-size: 12px; }

.afh-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.afh-skip {
    position: absolute; left: -9999px; top: 0; z-index: 999;
    background: var(--afh-amber); color: var(--afh-steel-900);
    padding: 10px 16px; font-weight: 500;
}
.afh-skip:focus { left: 12px; top: 12px; }

.afh-site { display: flex; flex-direction: column; min-height: 100vh; }
.afh-main { flex: 1; }

/* ---------- Layout helpers ---------- */
.afh-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--afh-font-display);
    font-size: 12px; font-weight: 500; letter-spacing: 0.14em;
    text-transform: uppercase; color: var(--afh-steel-700);
    margin-bottom: 12px;
}
.afh-eyebrow::before {
    content: ''; width: 22px; height: 3px; flex: none;
    background: repeating-linear-gradient(-45deg, var(--afh-amber) 0 4px, transparent 4px 8px);
}
.afh-eyebrow--amber { color: var(--afh-amber); }

.afh-section-head {
    max-width: 760px;
    margin: 0 0 clamp(2rem, 5vw, 3.25rem);
    padding: 0 var(--afh-pad);
}
.afh-section-head h2 { margin-bottom: 12px; }
.afh-section-head p { max-width: 620px; }
.afh-section-head--light h2, .afh-section-head--light .afh-eyebrow:not(.afh-eyebrow--amber) { color: var(--afh-concrete); }
.afh-section-head--light p { color: var(--afh-muted-light); }

.afh-note { font-size: 12px; color: var(--afh-muted); padding: 0 var(--afh-pad); }
.afh-text-link {
    display: inline-flex; gap: 6px; font-weight: 500; color: var(--afh-steel-900);
    border-bottom: 1px solid var(--afh-amber); padding-bottom: 2px; margin: 0 var(--afh-pad);
}

/* ---------- Buttons ---------- */
.afh-btn {
    display: inline-flex; align-items: center; justify-content: center;
    gap: 8px; padding: 13px 26px; font-family: var(--afh-font-display);
    font-weight: 500; font-size: 14px; letter-spacing: 0.02em;
    border-radius: var(--afh-radius-sm); border: 1.5px solid transparent;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
    white-space: nowrap;
}
.afh-btn--amber { background: var(--afh-amber); color: var(--afh-steel-900); }
.afh-btn--amber:hover { background: var(--afh-amber-dark); }
.afh-btn--outline { border-color: var(--afh-steel-700); color: var(--afh-steel-900); }
.afh-btn--outline:hover { background: var(--afh-steel-900); color: var(--afh-white); }
.afh-btn--outline-light { border-color: rgba(255,255,255,0.55); color: var(--afh-white); }
.afh-btn--outline-light:hover { background: rgba(255,255,255,0.14); }
.afh-btn--lg { padding: 15px 30px; font-size: 15px; }
.afh-btn.is-pressed { transform: scale(0.97); }

/* ==========================================================================
   HEADER
   ========================================================================== */
.afh-header {
    position: sticky; top: 0; z-index: 60; background: var(--afh-white);
    border-bottom: 1px solid var(--afh-border);
}
.afh-header__bar {
    background: var(--afh-steel-900); color: var(--afh-amber);
    font-family: var(--afh-font-display); font-size: 11px; font-weight: 500;
    letter-spacing: 0.1em; text-align: center; padding: 6px 12px;
}
.afh-header__inner {
    max-width: var(--afh-container); margin: 0 auto;
    display: flex; align-items: center; gap: 24px;
    padding: 14px var(--afh-pad); transition: padding 0.2s ease;
}
.afh-header.is-scrolled .afh-header__inner { padding-top: 9px; padding-bottom: 9px; }
.afh-header.is-scrolled .afh-header__bar { display: none; }

.afh-header__logo { display: flex; align-items: center; gap: 10px; flex: none; }
.afh-header__mark { flex: none; }
.afh-header__brand { display: flex; flex-direction: column; line-height: 1.2; }
.afh-header__name { font-family: var(--afh-font-display); font-weight: 500; font-size: 17px; color: var(--afh-steel-900); }
.afh-header__tag { font-size: 11px; color: var(--afh-muted); letter-spacing: 0.04em; }

.afh-header__nav { flex: 1; display: flex; justify-content: center; }
.afh-header__list { display: flex; gap: 30px; }
.afh-header__link {
    font-size: 14px; font-weight: 500; color: var(--afh-steel-700);
    padding: 6px 0; border-bottom: 2px solid transparent;
}
.afh-header__link:hover, .afh-header__link.is-active { color: var(--afh-steel-900); border-color: var(--afh-amber); }

.afh-header__actions { display: flex; align-items: center; gap: 16px; flex: none; }
.afh-header__phone { font-size: 14px; font-weight: 500; color: var(--afh-steel-900); }
.afh-header__cta { padding: 10px 20px; }

.afh-header__menu { display: none; flex-direction: column; gap: 5px; padding: 8px; flex: none; }
.afh-header__menu span { width: 22px; height: 2px; background: var(--afh-steel-900); }

/* ---------- Drawer ---------- */
.afh-drawer-backdrop {
    position: fixed; inset: 0; background: rgba(28,37,45,0.55); z-index: 80;
    opacity: 0; transition: opacity 0.25s ease;
}
.afh-drawer-backdrop.is-open { opacity: 1; }
.afh-drawer {
    position: fixed; top: 0; right: 0; height: 100%; width: min(84vw, 340px);
    background: var(--afh-white); z-index: 90; padding: 22px;
    transform: translateX(100%); transition: transform 0.3s ease;
    display: flex; flex-direction: column;
}
.afh-drawer.is-open { transform: translateX(0); }
.afh-drawer__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; }
.afh-drawer__title { font-family: var(--afh-font-display); font-weight: 500; font-size: 17px; color: var(--afh-steel-900); }
.afh-drawer__close { padding: 6px; color: var(--afh-steel-900); }
.afh-drawer__list { display: flex; flex-direction: column; gap: 4px; }
.afh-drawer__link {
    display: block; padding: 13px 6px; font-size: 15px; font-weight: 500;
    color: var(--afh-steel-800); border-bottom: 1px solid var(--afh-border);
}
.afh-drawer__link.is-active { color: var(--afh-amber-dark); }
.afh-drawer__link--cta { color: var(--afh-amber-dark); }
.afh-drawer__foot { margin-top: auto; padding-top: 20px; border-top: 1px solid var(--afh-border); }
.afh-drawer__addr { font-size: 13px; color: var(--afh-muted); margin: 0 0 10px; }
.afh-drawer__phone { font-weight: 500; color: var(--afh-steel-900); }
body.afh-drawer-open { overflow: hidden; }

@media (max-width: 980px) {
    .afh-header__nav, .afh-header__phone { display: none; }
    .afh-header__menu { display: flex; }
    .afh-header__inner { padding-top: 12px; padding-bottom: 12px; }
}

/* ==========================================================================
   REVEAL / SCROLL ANIMATION
   ========================================================================== */
[data-rise] { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; transition-delay: calc(var(--d, 0) * 70ms); }
[data-rise].is-in { opacity: 1; transform: translateY(0); }
.afh-mask, [data-mask] { overflow: hidden; }
.afh-mask img, [data-mask] img { transform: scale(1.06); transition: transform 0.9s ease; }
[data-mask].is-in img { transform: scale(1); }
@media (prefers-reduced-motion: reduce) {
    [data-rise], .afh-mask img, [data-mask] img { transition: none !important; transform: none !important; opacity: 1 !important; }
}

/* ==========================================================================
   HERO (full-bleed, brand-first)
   ========================================================================== */
.afh-hero { position: relative; min-height: 92vh; display: flex; align-items: flex-end; overflow: hidden; }
.afh-hero__media { position: absolute; inset: 0; }
.afh-hero__img { width: 100%; height: 100%; object-fit: cover; }
.afh-hero__scrim {
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(44,62,80,0.15) 0%, rgba(28,37,45,0.55) 55%, rgba(28,37,45,0.92) 100%);
}
.afh-hero__content {
    position: relative; z-index: 2; width: 100%; max-width: var(--afh-container);
    margin: 0 auto; padding: 0 var(--afh-pad) clamp(3rem, 8vw, 5.5rem);
    border-left: 3px solid var(--afh-amber);
    padding-left: calc(var(--afh-pad) + 22px);
}
.afh-hero__brand { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.afh-hero__brand-name { font-family: var(--afh-font-display); font-weight: 500; font-size: clamp(36px, 7vw, 64px); color: var(--afh-white); letter-spacing: 0.02em; line-height: 1.05; }
.afh-hero__brand-loc { font-size: 12px; color: var(--afh-amber); letter-spacing: 0.08em; text-transform: uppercase; }
.afh-hero__title { color: var(--afh-white); max-width: 720px; margin-bottom: 18px; font-size: clamp(28px, 4vw, 32px); }
.afh-hero__lead { color: var(--afh-muted-light); max-width: 560px; font-size: 16px; margin-bottom: 30px; }
.afh-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- Home intro prose ---------- */
.afh-intro { padding: clamp(3rem, 7vw, 5rem) 0; background: var(--afh-concrete); }
.afh-wrap {
    max-width: var(--afh-container);
    margin: 0 auto;
    padding: 0 var(--afh-pad);
}
.afh-intro__inner { max-width: 720px; }
.afh-intro__inner h2 { color: var(--afh-steel-900); margin-bottom: 1rem; }
.afh-intro__inner p { color: var(--afh-muted); font-size: clamp(14px, 1.4vw, 16px); line-height: 1.85; margin: 0; }

/* ---------- Page hero (about/services/blog/contact) ---------- */
.afh-page-hero { position: relative; min-height: 52vh; display: flex; align-items: flex-end; overflow: hidden; }
.afh-page-hero__media { position: absolute; inset: 0; }
.afh-page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.afh-page-hero__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(28,37,45,0.25) 0%, rgba(28,37,45,0.88) 100%); }
.afh-page-hero__content {
    position: relative; z-index: 2; width: 100%; max-width: var(--afh-container);
    margin: 0 auto; padding: clamp(2.5rem, 6vw, 4rem) var(--afh-pad);
    border-left: 3px solid var(--afh-amber); padding-left: calc(var(--afh-pad) + 22px);
}
.afh-page-hero__content h1 { color: var(--afh-white); max-width: 680px; margin: 10px 0 16px; }
.afh-page-hero__content p { color: var(--afh-muted-light); max-width: 560px; }
.afh-page-hero__actions { display: flex; gap: 14px; margin-top: 22px; flex-wrap: wrap; }

/* ==========================================================================
   TRUST RIBBON (text-only band)
   ========================================================================== */
.afh-ribbon { background: var(--afh-steel-900); padding: clamp(1.75rem, 4vw, 2.5rem) var(--afh-pad); }
.afh-ribbon__track {
    max-width: var(--afh-container); margin: 0 auto; display: flex; flex-wrap: wrap;
    justify-content: space-between; gap: 1.75rem 0;
}
.afh-ribbon__item {
    flex: 1 1 150px; text-align: center; padding: 0 18px;
    border-left: 1px solid var(--afh-border-light);
}
.afh-ribbon__item:first-child { border-left: none; }
.afh-ribbon__value {
    display: block; font-family: var(--afh-font-display); font-weight: 500;
    font-size: clamp(22px, 3vw, 30px); color: var(--afh-amber); margin-bottom: 6px;
}
.afh-ribbon__label { font-size: 12px; color: var(--afh-muted-light); letter-spacing: 0.02em; }

/* ==========================================================================
   BENTO FLEET GRID
   ========================================================================== */
.afh-bento { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-bento__grid {
    max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad);
    display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, minmax(240px, 1fr));
    gap: 3px; background: var(--afh-border);
}
.afh-bento__cell {
    position: relative; background: var(--afh-white); overflow: hidden;
    display: flex; flex-direction: column; justify-content: flex-end; min-height: 240px;
}
.afh-bento__grid > .afh-bento__cell:nth-child(1) { grid-column: 1 / 3; grid-row: 1 / 3; }
.afh-bento__grid > .afh-bento__cell:nth-child(2) { grid-column: 3 / 4; grid-row: 1 / 2; }
.afh-bento__grid > .afh-bento__cell:nth-child(3) { grid-column: 4 / 5; grid-row: 1 / 2; }
.afh-bento__grid > .afh-bento__cell:nth-child(4) { grid-column: 3 / 5; grid-row: 2 / 3; }
.afh-bento__media { position: absolute; inset: 0; z-index: 0; }
.afh-bento__media img { width: 100%; height: 100%; object-fit: cover; }
.afh-bento__cell::after {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(180deg, rgba(28,37,45,0) 30%, rgba(28,37,45,0.86) 100%);
}
.afh-bento__copy { position: relative; z-index: 2; padding: 22px; color: var(--afh-white); }
.afh-bento__code { font-family: var(--afh-font-display); font-size: 12px; color: var(--afh-amber); letter-spacing: 0.1em; }
.afh-bento__copy h3 { color: var(--afh-white); margin: 6px 0 8px; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.afh-bento__copy h3 small { font-size: 12px; font-weight: 400; color: var(--afh-muted-light); }
.afh-bento__copy p { color: var(--afh-muted-light); font-size: 13px; max-width: 420px; margin-bottom: 10px; }
.afh-bento__meta { font-size: 11px; color: var(--afh-amber); letter-spacing: 0.02em; }

.afh-bento__grid--six { grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; gap: 0; background: none; }
.afh-addon-cell {
    background: var(--afh-white); border: 1px solid var(--afh-border); padding: 26px 22px; position: relative;
}
.afh-addon-cell__num { font-family: var(--afh-font-display); font-size: 12px; color: var(--afh-amber-dark); letter-spacing: 0.1em; }
.afh-addon-cell h3 { margin: 10px 0 8px; }

@media (max-width: 900px) {
    .afh-bento__grid { grid-template-columns: 1fr; grid-template-rows: auto; }
    .afh-bento__grid > .afh-bento__cell:nth-child(1),
    .afh-bento__grid > .afh-bento__cell:nth-child(2),
    .afh-bento__grid > .afh-bento__cell:nth-child(3),
    .afh-bento__grid > .afh-bento__cell:nth-child(4) { grid-column: 1 / 2; grid-row: auto; min-height: 300px; }
    .afh-bento__grid--six { grid-template-columns: 1fr; }
}
@media (min-width: 901px) and (max-width: 1180px) {
    .afh-bento__grid--six { grid-template-columns: repeat(2, 1fr); }
}

/* ==========================================================================
   TABLES (capacity / spec / support)
   ========================================================================== */
.afh-spec { padding: var(--afh-section-pad) 0; }
.afh-spec:nth-of-type(even), .afh-process, .afh-lease { background: var(--afh-steel-900); }
.afh-table-wrap { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); overflow-x: auto; }
.afh-table { min-width: 720px; font-family: var(--afh-font-body); }
.afh-table thead th {
    text-align: left; font-family: var(--afh-font-display); font-weight: 500; font-size: 12px;
    letter-spacing: 0.06em; text-transform: uppercase; color: var(--afh-white); background: var(--afh-steel-700);
    padding: 14px 18px;
}
.afh-table tbody th, .afh-table tbody td { padding: 15px 18px; font-size: 14px; border-bottom: 1px solid var(--afh-border); color: var(--afh-ink); }
.afh-table tbody th { text-align: left; font-weight: 500; color: var(--afh-steel-900); background: var(--afh-concrete-200); }
.afh-table tbody tr:hover td, .afh-table tbody tr:hover th { background: rgba(243,156,18,0.08); }
.afh-table--dark thead th { background: var(--afh-steel-600); }
.afh-table--dark tbody th, .afh-table--dark tbody td { color: var(--afh-concrete); border-color: var(--afh-border-light); }
.afh-table--dark tbody th { background: rgba(255,255,255,0.06); }
.afh-table--dark tbody tr:hover td, .afh-table--dark tbody tr:hover th { background: rgba(243,156,18,0.14); }

/* ==========================================================================
   PROCESS — horizontal numbered steps (one row)
   ========================================================================== */
.afh-process { padding: var(--afh-section-pad) 0; }
.afh-process__row {
    max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad);
    display: flex; gap: 0; position: relative;
}
.afh-process__step {
    flex: 1; position: relative; padding: 0 20px 0 0; border-top: 2px solid var(--afh-border-light);
    padding-top: 22px;
}
.afh-process__step:not(:last-child)::after { content: ''; }
.afh-process__num {
    display: block; font-family: var(--afh-font-display); font-weight: 500;
    font-size: 26px; color: var(--afh-amber); margin-bottom: 10px;
}
.afh-process__step h3 { color: var(--afh-white); margin-bottom: 8px; }
.afh-process__step p { color: var(--afh-muted-light); font-size: 13px; }
.afh-process__row--three .afh-process__step { flex: 1 1 30%; }

@media (max-width: 900px) {
    .afh-process__row { flex-direction: column; gap: 28px; }
    .afh-process__step { padding-right: 0; }
}

/* ==========================================================================
   WORKSITE — full-bleed photo, caption bar bottom
   ========================================================================== */
.afh-worksite { position: relative; height: clamp(320px, 52vw, 560px); }
.afh-worksite__media { position: absolute; inset: 0; }
.afh-worksite__media img { width: 100%; height: 100%; object-fit: cover; }
.afh-worksite__caption {
    position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
    background: rgba(28,37,45,0.92); border-top: 3px solid var(--afh-amber);
    padding: 18px var(--afh-pad); display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
}
.afh-worksite__caption span {
    font-family: var(--afh-font-display); font-size: 12px; letter-spacing: 0.1em;
    text-transform: uppercase; color: var(--afh-amber); flex: none;
}
.afh-worksite__caption p { color: var(--afh-white); margin: 0; font-size: 14px; }

/* ==========================================================================
   CASE STUDIES — stacked full-width rows
   ========================================================================== */
.afh-cases { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-cases__list { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-case {
    display: grid; grid-template-columns: 340px 1fr; gap: 40px; align-items: center;
    padding: 34px 0; border-top: 1px solid var(--afh-border);
}
.afh-case:last-child { border-bottom: 1px solid var(--afh-border); }
.afh-case--flip { direction: rtl; }
.afh-case--flip .afh-case__body { direction: ltr; }
.afh-case__media { aspect-ratio: 4/3; }
.afh-case__media img { width: 100%; height: 100%; object-fit: cover; }
.afh-case__tag {
    display: inline-block; font-family: var(--afh-font-display); font-size: 11px;
    letter-spacing: 0.08em; text-transform: uppercase; color: var(--afh-amber-dark); margin-bottom: 10px;
}
.afh-case__body h3 { margin-bottom: 10px; }
.afh-case__result {
    display: inline-block; margin-top: 14px; font-family: var(--afh-font-display); font-weight: 500;
    font-size: 14px; color: var(--afh-steel-900); border-top: 1px solid var(--afh-border); padding-top: 12px;
}
@media (max-width: 820px) {
    .afh-case, .afh-case--flip { grid-template-columns: 1fr; direction: ltr; }
}

/* ==========================================================================
   FAQ — two-column definition list
   ========================================================================== */
.afh-faq { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-faq:nth-of-type(even) { background: var(--afh-steel-900); }
.afh-dl-grid { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-dl-grid__row {
    display: grid; grid-template-columns: minmax(220px, 34%) 1fr; gap: 30px;
    padding: 22px 0; border-top: 1px solid var(--afh-border);
}
.afh-dl-grid__row:last-child { border-bottom: 1px solid var(--afh-border); }
.afh-dl-grid__row dt { font-family: var(--afh-font-display); font-weight: 500; color: var(--afh-steel-900); font-size: 15px; }
.afh-dl-grid__row dd { margin: 0; color: var(--afh-muted); font-size: 14px; line-height: 1.75; }
.afh-faq:nth-of-type(even) .afh-dl-grid__row { border-color: var(--afh-border-light); }
.afh-faq:nth-of-type(even) .afh-dl-grid__row dt { color: var(--afh-white); }
.afh-faq:nth-of-type(even) .afh-dl-grid__row dd { color: var(--afh-muted-light); }
@media (max-width: 700px) {
    .afh-dl-grid__row { grid-template-columns: 1fr; gap: 8px; }
}

/* ==========================================================================
   RESOURCES — compact list with dates
   ========================================================================== */
.afh-reslist { padding: var(--afh-section-pad) 0; background: var(--afh-steel-900); }
.afh-reslist__list { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-reslist__list li { border-top: 1px solid var(--afh-border-light); }
.afh-reslist__list li:last-child { border-bottom: 1px solid var(--afh-border-light); }
.afh-reslist__list a {
    display: flex; align-items: center; gap: 22px; padding: 17px 4px;
    border-left: 3px solid transparent; transition: border-color 0.2s ease, background 0.2s ease;
}
.afh-reslist__list a:hover { border-color: var(--afh-amber); background: rgba(243,156,18,0.06); padding-left: 16px; }
.afh-reslist__list time { font-size: 12px; color: var(--afh-muted-light); flex: none; width: 92px; }
.afh-reslist__cat {
    font-family: var(--afh-font-display); font-size: 11px; letter-spacing: 0.05em; color: var(--afh-amber);
    flex: none; width: 108px;
}
.afh-reslist__title { flex: 1; color: var(--afh-white); font-size: 14px; font-weight: 500; }
.afh-reslist__arrow { color: var(--afh-amber); flex: none; }
.afh-reslist .afh-text-link { color: var(--afh-white); border-color: var(--afh-amber); margin-top: 24px; }

@media (max-width: 700px) {
    .afh-reslist__list a { flex-wrap: wrap; gap: 6px 16px; }
    .afh-reslist__title { width: 100%; order: 3; }
}

/* ==========================================================================
   CONTACT CTA (Osaka address + phone)
   ========================================================================== */
.afh-contact-cta {
    background: var(--afh-steel-900); display: grid; grid-template-columns: 1.4fr 1fr;
}
.afh-contact-cta__body { padding: var(--afh-section-pad) var(--afh-pad); }
.afh-contact-cta__body h2 { color: var(--afh-white); max-width: 460px; margin-bottom: 14px; }
.afh-contact-cta__body p { color: var(--afh-muted-light); max-width: 460px; margin-bottom: 22px; }
.afh-contact-cta__perks { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-bottom: 28px; }
.afh-contact-cta__perks li { font-size: 13px; color: var(--afh-concrete); position: relative; padding-left: 16px; }
.afh-contact-cta__perks li::before { content: ''; position: absolute; left: 0; top: 7px; width: 8px; height: 2px; background: var(--afh-amber); }
.afh-contact-cta__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.afh-contact-cta__address {
    background: var(--afh-steel-700); border-left: 3px solid var(--afh-amber);
    padding: var(--afh-section-pad) var(--afh-pad); display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.afh-contact-cta__address address { color: var(--afh-white); font-size: 14px; margin: 4px 0 20px; line-height: 1.7; }
.afh-contact-cta__address p { color: var(--afh-concrete); margin: 4px 0 0; font-size: 14px; }
@media (max-width: 900px) { .afh-contact-cta { grid-template-columns: 1fr; } }

/* ==========================================================================
   CHIPS — icon-free text chips wrap
   ========================================================================== */
.afh-chips-section { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-chips-section:nth-of-type(even) { background: var(--afh-steel-900); }
.afh-chips { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); display: flex; flex-wrap: wrap; gap: 10px; }
.afh-chips li {
    border: 1px solid var(--afh-border); border-radius: var(--afh-radius-sm);
    padding: 9px 16px; font-size: 13px; color: var(--afh-steel-800); transition: background 0.2s ease, border-color .2s ease;
}
.afh-chips li:hover { background: var(--afh-concrete-200); border-color: var(--afh-steel-600); }
.afh-chips--light li, .afh-chips-section:nth-of-type(even) .afh-chips li { border-color: var(--afh-border-light); color: var(--afh-concrete); }
.afh-chips--light li:hover, .afh-chips-section:nth-of-type(even) .afh-chips li:hover { background: rgba(243,156,18,0.12); border-color: var(--afh-amber); }

/* ==========================================================================
   SPLIT (text + image) — about / blog
   ========================================================================== */
.afh-split {
    max-width: var(--afh-container); margin: 0 auto; padding: var(--afh-section-pad) var(--afh-pad);
    display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center;
}
.afh-split--reverse { direction: rtl; }
.afh-split--reverse .afh-split__copy { direction: ltr; }
.afh-split__media img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 4/3.4; }
.afh-split__copy p { margin-bottom: 1.1em; }
.afh-quote {
    margin: 22px 0 0; padding: 18px 20px; border-left: 3px solid var(--afh-amber);
    background: var(--afh-concrete); font-style: normal; font-size: 15px; color: var(--afh-steel-900);
}
@media (max-width: 860px) { .afh-split, .afh-split--reverse { grid-template-columns: 1fr; direction: ltr; } }

/* ==========================================================================
   PRINCIPLES / GUIDES — numbered stacked rows
   ========================================================================== */
.afh-principles { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-principles__list { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-principles__list li { display: flex; gap: 28px; padding: 26px 0; border-top: 1px solid var(--afh-border); align-items: flex-start; }
.afh-principles__list li:last-child { border-bottom: 1px solid var(--afh-border); }
.afh-principles__num { font-family: var(--afh-font-display); font-weight: 500; font-size: 34px; color: var(--afh-amber); flex: none; width: 64px; }
.afh-principles__list h3 { margin-bottom: 8px; }
@media (max-width: 640px) { .afh-principles__list li { gap: 16px; } .afh-principles__num { font-size: 26px; width: 46px; } }

/* ==========================================================================
   TIMELINE (vertical) — about history
   ========================================================================== */
.afh-timeline-v { padding: var(--afh-section-pad) 0; background: var(--afh-concrete); }
.afh-timeline-v__list { max-width: 880px; margin: 0 auto; padding: 0 var(--afh-pad); position: relative; }
.afh-timeline-v__list::before { content: ''; position: absolute; left: calc(var(--afh-pad) + 46px); top: 0; bottom: 0; width: 1px; background: var(--afh-border); }
.afh-timeline-v__list li { display: flex; gap: 30px; padding: 24px 0; position: relative; }
.afh-timeline-v__year {
    flex: none; width: 92px; font-family: var(--afh-font-display); font-weight: 500;
    font-size: 20px; color: var(--afh-steel-900); position: relative; padding-left: 22px;
}
.afh-timeline-v__year::before {
    content: ''; position: absolute; left: 0; top: 8px; width: 10px; height: 10px;
    background: var(--afh-amber); border: 2px solid var(--afh-concrete);
}
.afh-timeline-v__body h3 { margin-bottom: 6px; }

/* ==========================================================================
   STAFF — compact rows (not cards)
   ========================================================================== */
.afh-staff { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-staff__list { max-width: 880px; margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-staff__list li { display: flex; gap: 22px; padding: 22px 0; border-top: 1px solid var(--afh-border); align-items: center; }
.afh-staff__list li:last-child { border-bottom: 1px solid var(--afh-border); }
.afh-staff__media { flex: none; width: 76px; height: 76px; border-radius: 50%; overflow: hidden; }
.afh-staff__media img { width: 100%; height: 100%; object-fit: cover; }
.afh-staff__body h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.afh-staff__body h3 span { font-family: var(--afh-font-body); font-size: 12px; font-weight: 400; color: var(--afh-amber-dark); }
@media (max-width: 560px) { .afh-staff__list li { gap: 14px; } .afh-staff__media { width: 58px; height: 58px; } }

/* ==========================================================================
   CHECKLIST — certifications text list
   ========================================================================== */
.afh-checklist { padding: var(--afh-section-pad) 0; background: var(--afh-steel-900); }
.afh-checklist__list { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 40px; }
.afh-checklist__list li { position: relative; padding-left: 26px; font-size: 14px; color: var(--afh-concrete); padding-bottom: 14px; border-bottom: 1px solid var(--afh-border-light); }
.afh-checklist__list li::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--afh-amber); font-weight: 500; }
@media (max-width: 700px) { .afh-checklist__list { grid-template-columns: 1fr; } }

/* ==========================================================================
   TWO-COL — commitments
   ========================================================================== */
.afh-two-col { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-two-col__grid { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; background: var(--afh-border); }
.afh-two-col__grid article { background: var(--afh-white); padding: 26px 24px; border-left: 3px solid var(--afh-amber); }
.afh-two-col__grid h3 { margin-bottom: 8px; }
@media (max-width: 700px) { .afh-two-col__grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   BAND CTA
   ========================================================================== */
.afh-band-cta { background: var(--afh-steel-900); padding: clamp(2.5rem, 6vw, 3.5rem) var(--afh-pad); }
.afh-band-cta__inner {
    max-width: var(--afh-container); margin: 0 auto; display: flex; justify-content: space-between;
    align-items: center; gap: 24px; flex-wrap: wrap;
}
.afh-band-cta__inner h2 { color: var(--afh-white); margin-bottom: 8px; }
.afh-band-cta__inner p { color: var(--afh-muted-light); max-width: 480px; }
.afh-band-cta__actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ==========================================================================
   SERVICES — overview
   ========================================================================== */
.afh-overview { max-width: var(--afh-container); margin: 0 auto; padding: var(--afh-section-pad) var(--afh-pad); }
.afh-overview > .afh-eyebrow, .afh-overview > h2 { display: block; }
.afh-overview > h2 { margin: 6px 0 26px; max-width: 640px; }
.afh-overview__cols { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1.5rem, 4vw, 3rem); }
@media (max-width: 800px) { .afh-overview__cols { grid-template-columns: 1fr; } }

/* ==========================================================================
   LEASE — comparison rows
   ========================================================================== */
.afh-lease { padding: var(--afh-section-pad) 0; }
.afh-lease__rows { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-lease__row {
    display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 28px; align-items: center;
    padding: 26px 22px; border-top: 1px solid var(--afh-border-light);
}
.afh-lease__row:last-child { border-bottom: 1px solid var(--afh-border-light); }
.afh-lease__row-head h3 { color: var(--afh-white); margin-bottom: 6px; }
.afh-lease__row-head p { color: var(--afh-muted-light); font-size: 13px; }
.afh-lease__items { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.afh-lease__items li { font-size: 13px; color: var(--afh-concrete); position: relative; padding-left: 16px; }
.afh-lease__items li::before { content: ''; position: absolute; left: 0; top: 7px; width: 8px; height: 2px; background: var(--afh-amber); }
.afh-lease__row-price { text-align: right; }
.afh-lease__row-price strong { display: block; font-family: var(--afh-font-display); font-weight: 500; color: var(--afh-amber); font-size: 17px; }
.afh-lease__row-price span { display: block; font-size: 11px; color: var(--afh-muted-light); margin-top: 4px; }
.afh-lease__rows--simple .afh-lease__row { grid-template-columns: 1fr; }
@media (max-width: 780px) {
    .afh-lease__row { grid-template-columns: 1fr; text-align: left; }
    .afh-lease__row-price { text-align: left; }
}

/* ==========================================================================
   MAP FEATURE (contact) — large embed
   ========================================================================== */
.afh-map-feature { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-map-feature__frame {
    max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad);
}
.afh-map-feature__frame iframe {
    width: 100%; height: clamp(340px, 52vw, 520px); border: 1px solid var(--afh-border); display: block;
}
.afh-map-feature__addr { max-width: var(--afh-container); margin: 18px auto 0; padding: 0 var(--afh-pad); font-size: 13px; color: var(--afh-muted); }

/* ==========================================================================
   CONTACT GRID — form + office
   ========================================================================== */
.afh-contact-grid {
    max-width: var(--afh-container); margin: 0 auto; padding: var(--afh-section-pad) var(--afh-pad);
    display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(2rem, 5vw, 4rem);
}
.afh-contact-form > .afh-eyebrow { display: block; }
.afh-contact-form h2 { margin: 6px 0 12px; }
.afh-contact-form form { margin-top: 22px; display: flex; flex-direction: column; gap: 18px; }
.afh-field { display: flex; flex-direction: column; gap: 6px; }
.afh-field label { font-size: 13px; font-weight: 500; color: var(--afh-steel-800); }
.afh-field input, .afh-field textarea {
    border: 1px solid var(--afh-border); border-radius: var(--afh-radius-sm); padding: 12px 14px;
    background: var(--afh-white); color: var(--afh-ink);
}
.afh-field input:focus, .afh-field textarea:focus { outline: 2px solid var(--afh-amber); outline-offset: 1px; }
.afh-field__err { font-size: 12px; color: #b3341c; }
.afh-alert { padding: 12px 16px; border-radius: var(--afh-radius-sm); font-size: 13px; margin: 0 0 4px; }
.afh-alert--ok { background: rgba(46,125,50,0.12); color: #2e7d32; }
.afh-alert--err { background: rgba(179,52,28,0.12); color: #b3341c; }

.afh-contact-office { background: var(--afh-steel-900); padding: 30px 26px; border-left: 3px solid var(--afh-amber); align-self: start; }
.afh-contact-office h2 { color: var(--afh-white); margin-bottom: 10px; }
.afh-contact-office p { color: var(--afh-muted-light); margin-bottom: 20px; }
.afh-dl { display: flex; flex-direction: column; gap: 14px; }
.afh-dl div { display: flex; flex-direction: column; gap: 3px; border-top: 1px solid var(--afh-border-light); padding-top: 12px; }
.afh-dl dt { font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--afh-amber); }
.afh-dl dd { margin: 0; font-size: 14px; color: var(--afh-white); }
.afh-dl dd a { border-bottom: 1px solid transparent; }
.afh-dl dd a:hover { border-color: var(--afh-amber); }
@media (max-width: 900px) { .afh-contact-grid { grid-template-columns: 1fr; } }

.afh-news-form { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.afh-news-form input {
    flex: 1; min-width: 200px; border: 1px solid var(--afh-border); border-radius: var(--afh-radius-sm);
    padding: 12px 14px;
}

/* ==========================================================================
   HOURS BAND
   ========================================================================== */
.afh-hours-band {
    background: var(--afh-concrete-200); padding: clamp(2.5rem, 6vw, 3.5rem) var(--afh-pad);
    text-align: center; max-width: var(--afh-container); margin: 0 auto;
}
.afh-hours-band__text { font-family: var(--afh-font-display); font-size: 20px; color: var(--afh-steel-900); font-weight: 500; margin: 10px 0; }
.afh-hours-band__extra { max-width: 560px; margin: 0 auto; }

/* ==========================================================================
   CONNECT (contact social)
   ========================================================================== */
.afh-connect { max-width: var(--afh-container); margin: 0 auto; padding: var(--afh-section-pad) var(--afh-pad); display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; background: var(--afh-border); }
.afh-connect__card { background: var(--afh-white); padding: 30px 26px; border-left: 3px solid var(--afh-steel-700); }
.afh-connect__card--alt { border-left-color: var(--afh-amber); }
.afh-connect__card h2 { margin-bottom: 10px; }
.afh-connect__card p { margin-bottom: 18px; }
@media (max-width: 760px) { .afh-connect { grid-template-columns: 1fr; } }

/* ==========================================================================
   BLOG — featured, timeline, catlist, spotlight, fieldnotes
   ========================================================================== */
.afh-featured {
    max-width: var(--afh-container); margin: 0 auto; padding: var(--afh-section-pad) var(--afh-pad);
    display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 3.5rem); align-items: center;
}
.afh-featured__media img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.afh-featured__body time { font-size: 12px; color: var(--afh-muted); }
.afh-featured__body h2 { margin: 10px 0 14px; }
.afh-featured__body p { margin-bottom: 16px; }
@media (max-width: 860px) { .afh-featured { grid-template-columns: 1fr; } }

.afh-blog-timeline { padding: var(--afh-section-pad) 0; background: var(--afh-steel-900); }
.afh-blog-timeline__list { max-width: 920px; margin: 0 auto; padding: 0 var(--afh-pad); position: relative; }
.afh-blog-timeline__list::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: var(--afh-border-light); }
.afh-blog-timeline__item { position: relative; width: 50%; padding: 0 40px 44px; }
.afh-blog-timeline__item:nth-child(odd) { margin-left: 0; text-align: right; }
.afh-blog-timeline__item:nth-child(even) { margin-left: 50%; text-align: left; }
.afh-blog-timeline__marker { position: absolute; top: 4px; width: 10px; height: 10px; background: var(--afh-amber); }
.afh-blog-timeline__item:nth-child(odd) .afh-blog-timeline__marker { right: -5px; }
.afh-blog-timeline__item:nth-child(even) .afh-blog-timeline__marker { left: -5px; }
.afh-blog-timeline__card time { font-size: 12px; color: var(--afh-amber); }
.afh-blog-timeline__cat { font-size: 11px; color: var(--afh-muted-light); margin-left: 8px; }
.afh-blog-timeline__card h3 { color: var(--afh-white); margin: 8px 0; }
.afh-blog-timeline__card p { color: var(--afh-muted-light); font-size: 13px; }
@media (max-width: 760px) {
    .afh-blog-timeline__list::before { left: 6px; }
    .afh-blog-timeline__item, .afh-blog-timeline__item:nth-child(even) { width: 100%; margin-left: 0; text-align: left; padding: 0 0 36px 30px; }
    .afh-blog-timeline__item:nth-child(odd) .afh-blog-timeline__marker,
    .afh-blog-timeline__item:nth-child(even) .afh-blog-timeline__marker { left: 1px; right: auto; }
}

.afh-catlist { padding: var(--afh-section-pad) 0; background: var(--afh-white); }
.afh-catlist__list { max-width: 760px; margin: 0 auto; padding: 0 var(--afh-pad); }
.afh-catlist__list li { display: flex; justify-content: space-between; padding: 16px 0; border-top: 1px solid var(--afh-border); font-size: 14px; }
.afh-catlist__list li:last-child { border-bottom: 1px solid var(--afh-border); }
.afh-catlist__list em { font-family: var(--afh-font-display); font-style: normal; color: var(--afh-amber-dark); font-weight: 500; }

.afh-spotlight {
    max-width: var(--afh-container); margin: 0 auto; padding: var(--afh-section-pad) var(--afh-pad);
    display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 3.5rem); align-items: center;
}
.afh-spotlight__media img { width: 100%; aspect-ratio: 5/4; object-fit: cover; }
.afh-spotlight__copy h2 { margin: 8px 0 14px; }
.afh-spotlight__copy p { margin-bottom: 20px; }
@media (max-width: 860px) { .afh-spotlight { grid-template-columns: 1fr; } }

.afh-fieldnotes { max-width: var(--afh-container); margin: 0 auto; padding: 0 var(--afh-pad) var(--afh-section-pad); }
.afh-fieldnotes__head h2 { margin: 6px 0 20px; }
.afh-fieldnotes__list { display: flex; flex-direction: column; gap: 12px; counter-reset: fn; }
.afh-fieldnotes__list li {
    counter-increment: fn; position: relative; padding: 14px 18px 14px 46px; background: var(--afh-concrete);
    border-left: 3px solid var(--afh-steel-700); font-size: 14px; color: var(--afh-steel-800);
}
.afh-fieldnotes__list li::before {
    content: counter(fn, decimal-leading-zero); position: absolute; left: 16px; top: 14px;
    font-family: var(--afh-font-display); font-weight: 500; color: var(--afh-amber-dark); font-size: 13px;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.afh-footer { background: var(--afh-ink); color: var(--afh-concrete); }
.afh-footer__inner { max-width: var(--afh-container); margin: 0 auto; padding: clamp(2.5rem, 6vw, 4rem) var(--afh-pad) 1.5rem; }
.afh-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--afh-border-light); }
.afh-footer__name { font-family: var(--afh-font-display); font-weight: 500; font-size: 18px; color: var(--afh-white); }
.afh-footer__brand p { margin-top: 12px; color: var(--afh-muted-light); font-size: 13px; max-width: 300px; }
.afh-footer__col h3 { color: var(--afh-white); font-size: 13px; letter-spacing: 0.04em; margin-bottom: 14px; }
.afh-footer__col ul { display: flex; flex-direction: column; gap: 9px; }
.afh-footer__col a { font-size: 13px; color: var(--afh-muted-light); }
.afh-footer__col a:hover { color: var(--afh-amber); }
.afh-footer address p { font-size: 13px; color: var(--afh-muted-light); margin: 0 0 8px; }
.afh-footer address a:hover { color: var(--afh-amber); }
.afh-footer__bar { display: flex; justify-content: space-between; align-items: center; padding-top: 1.5rem; flex-wrap: wrap; gap: 12px; }
.afh-footer__social { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--afh-muted-light); }
.afh-footer__social ul { display: flex; gap: 14px; }
.afh-footer__social a:hover { color: var(--afh-amber); }
.afh-footer__bottom { display: flex; align-items: center; gap: 16px; font-size: 12px; color: var(--afh-muted-light); }
.afh-top { border: 1px solid var(--afh-border-light); padding: 8px; border-radius: 50%; color: var(--afh-concrete); }
.afh-top:hover { border-color: var(--afh-amber); color: var(--afh-amber); }
@media (max-width: 900px) { .afh-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .afh-footer__grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   Small print helpers reused across pages
   ========================================================================== */
.afh-section-head + .afh-note { margin-top: -1rem; }