/* ============================================================
   DIAMOND D BUILDERS — Industrial theme (2026-10)
   Loaded AFTER style.css. Everything new is prefixed .ix-
   Shared chrome (header, mobile nav, footer, buttons) is
   restyled under body.ix so pages opt in one at a time.
   ============================================================ */

:root {
    --ix-steel:    #262C33;   /* primary dark, painted structural steel */
    --ix-steel-2:  #343C45;   /* raised dark surface */
    --ix-galv:     #8B949D;   /* galvanized mid gray */
    --ix-line:     #CDD1D5;   /* hairlines on light */
    --ix-concrete: #E3E5E6;   /* poured slab */
    --ix-plate:    #F4F5F6;   /* light page */
    --ix-ink:      #1C2126;   /* body text */
    --ix-muted:    #5B646D;   /* secondary text */
    --ix-red:      #C8102E;   /* brand, from the logo */
    --ix-red-dk:   #A00D24;
    --ix-wrap:     1240px;
    --ix-pad:      clamp(20px, 5vw, 56px);
    --ix-wide:     118%;      /* Archivo width axis for display type */
}

/* ---------- base ---------- */
body.ix {
    font-family: 'Archivo', system-ui, sans-serif;
    font-stretch: 100%;
    color: var(--ix-ink);
    background: var(--ix-plate);
    font-size: 17px;
    line-height: 1.6;
}
body.ix h1, body.ix h2, body.ix h3, body.ix h4 {
    font-family: 'Archivo', system-ui, sans-serif;
    font-stretch: var(--ix-wide);
    letter-spacing: -0.01em;
    text-transform: none;
}
body.ix a:focus-visible, body.ix button:focus-visible,
body.ix input:focus-visible, body.ix select:focus-visible, body.ix textarea:focus-visible {
    outline: 3px solid var(--ix-red);
    outline-offset: 2px;
}
.ix-wrap { width: 100%; max-width: var(--ix-wrap); margin: 0 auto; padding: 0 var(--ix-pad); }

/* ---------- buttons ---------- */
body.ix .btn {
    font-family: 'Archivo', sans-serif;
    font-stretch: 110%;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0;
    text-transform: none;
    border-radius: 2px;
    padding: 15px 26px;
}
body.ix .btn-red { background: var(--ix-red); border-color: var(--ix-red); color: #fff; }
body.ix .btn-red:hover { background: var(--ix-red-dk); border-color: var(--ix-red-dk); }
body.ix .btn-outline-white { border: 2px solid rgba(255,255,255,0.55); color: #fff; background: transparent; }
body.ix .btn-outline-white:hover { background: #fff; color: var(--ix-steel); border-color: #fff; }
.ix-btn-line {
    display: inline-flex; align-items: center; gap: 10px;
    font-weight: 700; font-stretch: 110%; color: var(--ix-ink);
    text-decoration: none; border-bottom: 2px solid var(--ix-red); padding-bottom: 3px;
}
.ix-btn-line:hover { color: var(--ix-red); }

/* ---------- header ---------- */
body.ix .navbar-top { background: var(--ix-steel); }
body.ix .navbar-top a { color: rgba(255,255,255,0.72); font-size: 13px; text-transform: none; letter-spacing: 0; }
body.ix .navbar-main { background: #fff; border-bottom: 1px solid var(--ix-line); box-shadow: none; }
body.ix .nav-links > li > a {
    font-family: 'Archivo', sans-serif; font-stretch: 105%;
    font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0;
    color: var(--ix-ink);
}
body.ix .nav-links > li > a:hover, body.ix .nav-links > li > a.active { color: var(--ix-red); }
body.ix .dropdown { border-radius: 2px; border-top: 3px solid var(--ix-red); }
body.ix .dropdown a { font-size: 14px; text-transform: none; letter-spacing: 0; }
body.ix .mobile-nav { background: var(--ix-steel); }
body.ix .mobile-nav a { font-family: 'Archivo', sans-serif; font-stretch: 112%; text-transform: none; letter-spacing: 0; }

/* ---------- HERO: the structural grid ---------- */
.ix-hero {
    position: relative;
    background:
        linear-gradient(90deg, rgba(38,44,51,0.94) 0%, rgba(38,44,51,0.82) 48%, rgba(38,44,51,0.45) 100%),
        url('https://images.unsplash.com/photo-1649587345666-0f4ad68aa723?w=2000&q=80') center 60% / cover no-repeat;
    color: #fff;
    padding-top: clamp(150px, 18vw, 190px);
    overflow: hidden;
}
.ix-hero-body { position: relative; z-index: 2; max-width: 820px; padding-bottom: clamp(56px, 8vw, 96px); }
.ix-hero h1 {
    font-size: clamp(40px, 6.4vw, 84px);
    font-weight: 800;
    line-height: 0.98;
    color: #fff;
    margin: 0 0 28px;
}
.ix-hero p { font-size: clamp(17px, 1.6vw, 20px); color: rgba(255,255,255,0.80); max-width: 60ch; margin: 0 0 36px; }
.ix-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }


/* numbered service strip at the foot of the hero */
.ix-grid { position: relative; z-index: 2; border-top: 1px solid rgba(139,148,157,0.35); }
.ix-grid-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }

.ix-gridcell {
    display: block; text-decoration: none; color: #fff;
    padding: 0 20px 34px 0;
    transition: background-color .2s;
}
.ix-gridcell:hover .ix-bubble { background: var(--ix-red); }
.ix-gridcell strong { display: block; font-stretch: var(--ix-wide); font-size: 18px; font-weight: 700; line-height: 1.2; margin: 14px 0 6px; }
.ix-gridcell em { display: block; font-style: normal; font-size: 14px; color: rgba(255,255,255,0.62); }

.ix-bubble {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 50%;
    border: 2px solid var(--ix-red); background: var(--ix-steel);
    font-stretch: 100%; font-weight: 800; font-size: 17px; color: #fff;
    margin-top: -22px; transition: background-color .2s;
    flex-shrink: 0;
}
.ix-bubble.on-light { background: #fff; color: var(--ix-ink); }

/* ---------- section scaffolding ---------- */
.ix-section { padding: clamp(72px, 9vw, 120px) 0; }
.ix-section.light { background: #fff; }
.ix-section.dark { background: var(--ix-steel); color: #fff; }
.ix-section.slab { background: var(--ix-concrete); }
.ix-h2 { font-size: clamp(30px, 3.8vw, 48px); font-weight: 800; line-height: 1.05; margin: 0 0 20px; color: inherit; }
.ix-lede { font-size: 19px; color: var(--ix-muted); max-width: 62ch; margin: 0; }
.dark .ix-lede { color: rgba(255,255,255,0.72); }
.ix-intro { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(24px, 5vw, 80px); align-items: end; margin-bottom: clamp(48px, 6vw, 80px); }

/* ---------- service rows keyed to grid letters ---------- */
.ix-svc { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 64px); align-items: center; padding: clamp(36px, 4vw, 56px) 0; border-top: 1px solid var(--ix-line); }
.ix-svc:last-of-type { border-bottom: 1px solid var(--ix-line); }
.ix-svc.flip { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.ix-svc.flip .ix-svc-media { order: 2; }
.ix-svc-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 2px; background: var(--ix-concrete); }
.ix-svc-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ix-svc-head { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.ix-svc-head .ix-bubble { margin-top: 0; }
.ix-svc h3 { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; line-height: 1.1; margin: 0; }
.ix-svc p { color: var(--ix-muted); margin: 0 0 20px; max-width: 54ch; }
.ix-svc ul { list-style: none; padding: 0; margin: 0 0 26px; display: grid; gap: 8px; }
.ix-svc li { position: relative; padding-left: 22px; font-size: 16px; }
.ix-svc li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 10px; height: 3px; background: var(--ix-red); }

.ix-also { display: grid; grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 3fr)); gap: 24px; padding-top: 40px; align-items: start; }
.ix-also h3 { font-size: 20px; font-weight: 700; margin: 0; }
.ix-also a { display: block; text-decoration: none; color: var(--ix-ink); padding: 18px 0 0; border-top: 3px solid var(--ix-ink); }
.ix-also a:hover { border-top-color: var(--ix-red); }
.ix-also a strong { display: block; font-stretch: var(--ix-wide); font-size: 17px; margin-bottom: 4px; }
.ix-also a span { color: var(--ix-muted); font-size: 15px; }

/* ---------- process: a beam with four connections ---------- */
.ix-beam { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; margin-top: 56px; }
.ix-beam::before { content: ""; position: absolute; left: 0; right: 0; top: 21px; height: 6px; background: var(--ix-galv); opacity: .5; }
.ix-step { position: relative; }
.ix-step-num {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; background: var(--ix-red); color: #fff;
    font-weight: 800; font-size: 18px; border-radius: 2px; margin-bottom: 22px;
}
.ix-step h3 { font-size: 20px; font-weight: 700; margin: 0 0 8px; color: #fff; }
.ix-step p { color: rgba(255,255,255,0.70); font-size: 15.5px; margin: 0; }

/* ---------- credentials: a submittal sheet ---------- */
.ix-sheet { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.ix-sheet table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--ix-line); }
.ix-sheet th, .ix-sheet td { text-align: left; padding: 16px 20px; border-bottom: 1px solid var(--ix-line); vertical-align: top; font-size: 16px; }
.ix-sheet th { width: 34%; font-weight: 700; font-stretch: 108%; color: var(--ix-ink); background: var(--ix-plate); }
.ix-sheet td { color: var(--ix-muted); }
.ix-sheet tr:last-child th, .ix-sheet tr:last-child td { border-bottom: none; }
.ix-sheet a { color: var(--ix-ink); }

/* ---------- testimonials ---------- */
.ix-quotes { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 56px); }
.ix-quote-main blockquote { margin: 0; font-stretch: 108%; font-size: clamp(24px, 2.6vw, 34px); font-weight: 600; line-height: 1.3; color: var(--ix-ink); }
.ix-quote-main figcaption, .ix-quote-side figcaption { margin-top: 22px; font-size: 15px; color: var(--ix-muted); }
.ix-quote-main figcaption strong, .ix-quote-side figcaption strong { color: var(--ix-ink); display: block; font-size: 16px; }
.ix-quote-main { border-left: 6px solid var(--ix-red); padding-left: clamp(20px, 3vw, 40px); margin: 0; }
.ix-quote-side { display: grid; gap: 28px; }
.ix-quote-side figure { margin: 0; padding: 24px 0 0; border-top: 1px solid var(--ix-line); }
.ix-quote-side blockquote { margin: 0; font-size: 17px; color: var(--ix-ink); }

/* ---------- bid form ---------- */
.ix-bid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.ix-contact { list-style: none; padding: 0; margin: 32px 0 0; display: grid; gap: 18px; }
.ix-contact li { display: flex; gap: 14px; align-items: baseline; }
.ix-contact i { color: var(--ix-red); width: 18px; }
.ix-contact a { color: var(--ix-ink); font-weight: 600; text-decoration: none; }
.ix-contact span { display: block; font-size: 14px; color: var(--ix-muted); font-weight: 400; }
.ix-form { background: #fff; border-top: 6px solid var(--ix-red); padding: clamp(24px, 4vw, 44px); }
.ix-form h3 { font-size: 26px; font-weight: 800; margin: 0 0 6px; }
.ix-form > p { color: var(--ix-muted); margin: 0 0 26px; font-size: 15px; }
.ix-form .form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ix-form .form-group { margin-bottom: 16px; }
.ix-form label { display: block; font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--ix-ink); margin-bottom: 6px; }
.ix-form input, .ix-form select, .ix-form textarea {
    width: 100%; font: inherit; font-size: 16px; color: var(--ix-ink);
    background: var(--ix-plate); border: 1px solid var(--ix-line); border-radius: 2px; padding: 13px 14px;
}
.ix-form textarea { min-height: 120px; resize: vertical; }
.ix-form input:focus, .ix-form select:focus, .ix-form textarea:focus { border-color: var(--ix-steel); background: #fff; outline: none; }
.ix-form button { width: 100%; justify-content: center; }

/* ---------- footer ---------- */
body.ix .footer { background: var(--ix-steel); }
body.ix .footer-main { border-top: 6px solid var(--ix-red); }
body.ix .footer-brand-name, body.ix .footer-col h4 { font-family: 'Archivo', sans-serif; font-stretch: var(--ix-wide); text-transform: none; letter-spacing: 0; }
body.ix .footer-tagline { text-transform: none; letter-spacing: 0; }
body.ix .footer-bottom { background: #1E2329; }

/* ---------- responsive ---------- */
@media (max-width: 960px) {
    .ix-intro, .ix-svc, .ix-svc.flip, .ix-sheet, .ix-quotes, .ix-bid { grid-template-columns: minmax(0, 1fr); }
    .ix-svc.flip .ix-svc-media { order: 0; }
    .ix-also { grid-template-columns: minmax(0, 1fr); }
    .ix-beam { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
    .ix-beam::before { display: none; }
}
@media (max-width: 760px) {
    
    .ix-grid-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ix-gridcell { padding-bottom: 28px; }
    .ix-grid-row .ix-gridcell:nth-child(n+3) { border-top: 1px solid rgba(139,148,157,0.35); }
}
@media (max-width: 560px) {
    .ix-beam { grid-template-columns: minmax(0, 1fr); }
    .ix-form .form-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .ix-sheet th, .ix-sheet td { display: block; width: auto; }
    .ix-sheet th { border-bottom: none; padding-bottom: 4px; }
    .ix-sheet td { padding-top: 0; }
}

/* ============================================================
   Interior pages (About section, 2026-10-06)
   ============================================================ */
/* interior hero: split panel (chosen 2026-10-06, option 1) */
@media (max-width: 960px) { :root { --ix-nav-h: 77px; } }  /* style.css hides the top bar below 960px */
.ix-pagehero {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: clamp(380px, 34vw, 500px);
    margin-top: var(--ix-nav-h, 116px);
    background: var(--ix-steel); color: #fff;
}
.ix-pagehero-text {
    display: flex; flex-direction: column; justify-content: center;
    padding: clamp(40px, 5vw, 72px) clamp(20px, 4vw, 64px) clamp(40px, 5vw, 72px) max(var(--ix-pad), calc((100vw - var(--ix-wrap)) / 2 + var(--ix-pad)));
    border-right: 8px solid var(--ix-red);
}
.ix-pagehero h1 { font-size: clamp(34px, 4.2vw, 56px); font-weight: 800; line-height: 1.02; color: #fff; margin: 0 0 20px; }
.ix-pagehero p { font-size: clamp(17px, 1.4vw, 18px); color: rgba(255,255,255,0.78); max-width: 52ch; margin: 0; }
.ix-pagehero-photo { background-size: cover; background-position: center; min-height: 260px; }
@media (max-width: 860px) {
    .ix-pagehero { grid-template-columns: minmax(0, 1fr); min-height: 0; }
    .ix-pagehero-text { border-right: none; border-bottom: 8px solid var(--ix-red); padding-left: var(--ix-pad); }
    .ix-pagehero-photo { height: clamp(220px, 56vw, 380px); }
}
.ix-crumbs { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 26px; font-size: 14px; }
.ix-crumbs li { color: rgba(255,255,255,0.6); }
.ix-crumbs li + li::before { content: "/"; margin-right: 8px; color: rgba(255,255,255,0.35); }
.ix-crumbs a { color: rgba(255,255,255,0.85); text-decoration: none; }
.ix-crumbs a:hover { color: #fff; text-decoration: underline; }

/* section sub-nav: About / History / Team / FAQs */
.ix-subnav { background: #fff; border-bottom: 1px solid var(--ix-line); }
.ix-subnav ul { display: flex; flex-wrap: wrap; gap: 0 32px; list-style: none; margin: 0; padding: 0; }
.ix-subnav a { display: block; padding: 18px 0 15px; font-weight: 600; font-stretch: 105%; color: var(--ix-muted); text-decoration: none; border-bottom: 3px solid transparent; }
.ix-subnav a:hover { color: var(--ix-ink); }
.ix-subnav a[aria-current="page"] { color: var(--ix-ink); border-bottom-color: var(--ix-red); }

/* prose blocks */
.ix-prose { max-width: 68ch; }
.ix-prose p { margin: 0 0 18px; color: var(--ix-ink); }
.ix-prose p.muted { color: var(--ix-muted); }
.ix-prose a, .ix-cols a, .ix-faq a, .ix-timeline a { color: var(--ix-ink); text-decoration: underline; text-decoration-color: var(--ix-red); text-underline-offset: 3px; }
.dark .ix-prose p { color: rgba(255,255,255,0.80); }
.ix-split { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.ix-split-media { aspect-ratio: 4 / 5; overflow: hidden; border-radius: 2px; background: var(--ix-concrete); }
.ix-split-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* plain columns of short items */
.ix-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 56px; margin-top: 48px; }
.ix-cols.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ix-cols > div { border-top: 3px solid var(--ix-ink); padding-top: 18px; }
.dark .ix-cols > div { border-top-color: var(--ix-red); }
.ix-cols h3 { font-size: 20px; font-weight: 700; margin: 0 0 8px; }
.ix-cols p { margin: 0; color: var(--ix-muted); font-size: 16px; }
.dark .ix-cols h3 { color: #fff; }
.dark .ix-cols p { color: rgba(255,255,255,0.72); }
.dark .ix-cols a, .dark .ix-prose a { color: #fff; }

/* timeline: dated, so it reads top to bottom */
.ix-timeline { list-style: none; margin: 48px 0 0; padding: 0; border-left: 6px solid var(--ix-concrete); }
.ix-timeline li { display: grid; grid-template-columns: minmax(90px, 160px) minmax(0, 1fr); gap: 24px; padding: 0 0 40px 28px; position: relative; }
.ix-timeline li::before { content: ""; position: absolute; left: -12px; top: 10px; width: 18px; height: 18px; background: var(--ix-red); border: 4px solid var(--ix-plate); border-radius: 50%; }
.ix-timeline .yr { font-stretch: var(--ix-wide); font-weight: 800; font-size: clamp(26px, 2.6vw, 34px); line-height: 1; color: var(--ix-ink); }
.ix-timeline h3 { font-size: 20px; font-weight: 700; margin: 2px 0 8px; }
.ix-timeline p { margin: 0; color: var(--ix-muted); max-width: 60ch; }
.ix-timeline li.now .yr { color: var(--ix-red); }

/* people */
.ix-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 36px); margin-top: 48px; }
.ix-person { background: #fff; border: 1px solid var(--ix-line); }
.ix-person-photo { aspect-ratio: 4 / 3; background: var(--ix-concrete); display: flex; align-items: center; justify-content: center; font-stretch: var(--ix-wide); font-weight: 800; font-size: 44px; color: var(--ix-galv); }
.ix-person-body { padding: 22px 22px 26px; }
.ix-person-role { font-size: 14px; font-weight: 600; color: var(--ix-red); margin: 0 0 4px; }
.ix-person h3 { font-size: 22px; font-weight: 800; margin: 0 0 10px; }
.ix-person p { margin: 0; font-size: 15.5px; color: var(--ix-muted); }

/* CTA band */
.ix-cta { background: var(--ix-steel-2); color: #fff; padding: clamp(56px, 7vw, 88px) 0; }
.ix-cta .ix-wrap { display: flex; flex-wrap: wrap; gap: 28px 48px; align-items: center; justify-content: space-between; }
.ix-cta h2 { font-size: clamp(26px, 3vw, 38px); font-weight: 800; margin: 0 0 8px; color: #fff; }
.ix-cta p { margin: 0; color: rgba(255,255,255,0.75); max-width: 56ch; }
.ix-cta-actions { display: flex; flex-wrap: wrap; gap: 14px; }

/* FAQ: native details/summary, no JS needed */
.ix-faq-layout { display: grid; grid-template-columns: minmax(180px, 3fr) minmax(0, 9fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.ix-faq-nav { position: sticky; top: 140px; }
.ix-faq-nav h2 { font-size: 15px; font-weight: 700; font-stretch: 100%; margin: 0 0 12px; color: var(--ix-muted); }
.ix-faq-nav ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--ix-line); }
.ix-faq-nav a { display: block; padding: 8px 0 8px 16px; margin-left: -1px; border-left: 3px solid transparent; color: var(--ix-ink); text-decoration: none; font-size: 15px; }
.ix-faq-nav a:hover { border-left-color: var(--ix-red); }
.ix-faq-group { margin-bottom: 56px; scroll-margin-top: 140px; }
.ix-faq-group > h2 { font-size: clamp(24px, 2.4vw, 30px); font-weight: 800; margin: 0 0 16px; }
.ix-faq details { border-top: 1px solid var(--ix-line); }
.ix-faq details:last-child { border-bottom: 1px solid var(--ix-line); }
.ix-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; padding: 20px 0; font-weight: 700; font-stretch: 105%; font-size: 17.5px; }
.ix-faq summary::-webkit-details-marker { display: none; }
.ix-faq summary::after { content: "+"; font-weight: 400; font-size: 26px; line-height: 1; color: var(--ix-red); flex-shrink: 0; }
.ix-faq details[open] summary::after { content: "\2212"; }
.ix-faq .ans { padding: 0 0 22px; max-width: 68ch; color: var(--ix-muted); }
.ix-faq .ans p { margin: 0 0 12px; }
.ix-faq .ans ul { margin: 0 0 12px; padding-left: 20px; }

@media (max-width: 960px) {
    .ix-split, .ix-faq-layout { grid-template-columns: minmax(0, 1fr); }
    .ix-split-media { aspect-ratio: 16 / 10; }
    .ix-people { grid-template-columns: minmax(0, 1fr); max-width: 520px; }
    .ix-cols.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ix-faq-nav { position: static; }
    .ix-faq-nav ul { display: flex; flex-wrap: wrap; gap: 4px 18px; border-left: none; }
    .ix-faq-nav a { padding: 6px 0; border-left: none; margin: 0; text-decoration: underline; text-decoration-color: var(--ix-red); }
}
@media (max-width: 560px) {
    .ix-cols, .ix-cols.three { grid-template-columns: minmax(0, 1fr); }
    .ix-timeline li { grid-template-columns: minmax(0, 1fr); gap: 6px; }
    .ix-subnav ul { gap: 0 20px; }
}

/* subnav: one scrolling row on phones instead of wrapping (2026-10-06) */
@media (max-width: 760px) {
    .ix-subnav .ix-wrap { padding-right: 0; }
    .ix-subnav ul { flex-wrap: nowrap; overflow-x: auto; gap: 0 22px; padding-right: var(--ix-pad); scrollbar-width: none; -webkit-overflow-scrolling: touch; }
    .ix-subnav ul::-webkit-scrollbar { display: none; }
    .ix-subnav li { flex: 0 0 auto; }
    .ix-subnav a { white-space: nowrap; }
}