/* ==========================================================================
   AJNIFM - Inner pages design system  (2026-10-16)
   --------------------------------------------------------------------------
   Loaded on every page EXCEPT the homepage (see layouts/main.php). Scoped to
   main.ip so the shared header, footer and Useful Links strip - which also
   appear on the homepage - are untouched.

   One typeface (Inter, with Noto Sans Devanagari for Hindi), one type scale,
   one set of surfaces. CMS page bodies are normalised server-side by
   App\Core\Content::clean() into plain semantic HTML that .ip-prose styles.

   Colour tokens follow the CMS theme (Admin -> Settings): --navy is the
   primary (maroon), --gold the accent.
   ========================================================================== */

main.ip {
    --ip-font: Inter, "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --ip-ink: #17222d;          /* body text */
    --ip-head: #10233a;         /* headings - echoes the inner-page header */
    --ip-muted: #59636e;        /* secondary text */
    --ip-rule: #e6e0d6;         /* hairlines, warm to sit with the gold */
    --ip-rule-strong: #d6cdbf;
    --ip-wash: #f7f4ee;         /* table heads, zebra, input fill */
    --ip-surface: #ffffff;
    --ip-primary: var(--navy, #7a1b28);
    --ip-primary-ink: #5e1520;
    --ip-accent: var(--gold, #cda454);
    --ip-accent-ink: #8a6a22;   /* gold dark enough for text on white */
    --ip-radius: 12px;
    --ip-radius-sm: 8px;

    /* Type scale (1rem = 16px; follows the A- / A / A+ controls) */
    --fs-xs: .8125rem;
    --fs-sm: .875rem;
    --fs-base: 1rem;
    --fs-h4: 1.0625rem;
    --fs-h3: 1.1875rem;
    --fs-h2: 1.375rem;
    --fs-h1: clamp(1.75rem, 1.15rem + 1.9vw, 2.5rem);

    display: block;
    font-family: var(--ip-font);
    font-size: var(--fs-base);
    line-height: 1.7;
    color: var(--ip-ink);
    padding-bottom: 3.5rem;
}
main.ip *,
main.ip *::before,
main.ip *::after { box-sizing: border-box; }
main.ip :where(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, figure, blockquote, table) { font-family: var(--ip-font); }
main.ip a { color: var(--ip-primary); text-decoration: none; }
main.ip a:hover { color: var(--ip-primary-ink); text-decoration: underline; text-underline-offset: 3px; }
main.ip :focus-visible { outline: 3px solid var(--ip-accent); outline-offset: 2px; border-radius: 4px; }
main.ip img { max-width: 100%; height: auto; }

/* ---------- Hero ------------------------------------------------------- */
main.ip .ip-hero {
    padding-top: .25rem;
    padding-bottom: 1.6rem;
    margin-bottom: 1.75rem;
    position: relative;
}
/* The one distinctive device: a file-cover rule - a short maroon tab
   sitting on a long gold hairline, like the flap of a government file. */
main.ip .ip-hero::after {
    content: "";
    position: absolute;
    left: calc(var(--bs-gutter-x, 1.5rem) * .5);
    right: calc(var(--bs-gutter-x, 1.5rem) * .5);
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, var(--ip-primary) 0 88px, var(--ip-accent) 88px 100%);
}
main.ip .ip-hero::before {
    content: "";
    position: absolute;
    left: calc(var(--bs-gutter-x, 1.5rem) * .5);
    bottom: 0;
    width: 88px;
    height: 4px;
    background: var(--ip-primary);
}
main.ip .ip-crumbs ol {
    list-style: none;
    margin: 0 0 .7rem;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .15rem .5rem;
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--ip-muted);
}
main.ip .ip-crumbs li { display: inline-flex; align-items: center; gap: .5rem; }
main.ip .ip-crumbs li + li::before { content: "/"; color: var(--ip-rule-strong); }
main.ip .ip-crumbs a { color: var(--ip-muted); }
main.ip .ip-crumbs a:hover { color: var(--ip-primary); }
main.ip .ip-crumbs [aria-current] { color: var(--ip-ink); font-weight: 600; }
main.ip .ip-title {
    font-size: var(--fs-h1);
    font-weight: 750;
    line-height: 1.15;
    letter-spacing: -.015em;
    color: var(--ip-head);
    margin: 0;
    max-width: 30ch;
    text-wrap: balance;
}
main.ip .ip-lead {
    margin: .7rem 0 0;
    max-width: 68ch;
    font-size: 1.0625rem;
    line-height: 1.6;
    color: var(--ip-muted);
}
main.ip .ip-meta {
    list-style: none;
    margin: 1rem 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
main.ip .ip-meta li {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .3rem .75rem;
    border: 1px solid var(--ip-rule);
    border-radius: 999px;
    background: var(--ip-surface);
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--ip-ink);
}
main.ip .ip-meta i { color: var(--ip-accent-ink); font-size: .85em; }

/* ---------- Shell ------------------------------------------------------ */
main.ip .ip-shell { display: block; }
main.ip .ip-shell.has-aside {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    gap: 2rem;
    align-items: start;
}
main.ip .ip-shell.is-narrow .ip-main { max-width: 720px; }
main.ip .ip-main { min-width: 0; }
main.ip .ip-main > * + * { margin-top: 1.75rem; }

/* ---------- Section navigation (aside) ---------------------------------- */
main.ip .ip-aside { display: flex; flex-direction: column; gap: 1rem; position: sticky; top: 1rem; }
main.ip .ip-aside-card {
    background: var(--ip-surface);
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius);
    padding: 1.15rem 1.15rem 1.2rem;
}
main.ip .ip-aside-title {
    font-size: var(--fs-base);
    font-weight: 700;
    line-height: 1.35;
    color: var(--ip-head);
    margin: 0 0 .6rem;
}
main.ip .ip-aside-up {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: var(--fs-sm);
    font-weight: 600;
    margin-bottom: .55rem;
}
main.ip .ip-subnav { display: flex; flex-direction: column; margin: 0 -.35rem; }
main.ip .ip-subnav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem .7rem;
    border-left: 3px solid transparent;
    border-radius: 0 6px 6px 0;
    font-size: var(--fs-sm);
    font-weight: 500;
    line-height: 1.4;
    color: var(--ip-ink);
}
main.ip .ip-subnav a i { font-size: .7rem; color: var(--ip-muted); }
main.ip .ip-subnav a:hover { background: var(--ip-wash); color: var(--ip-primary); text-decoration: none; }
main.ip .ip-subnav a.is-active {
    border-left-color: var(--ip-primary);
    background: #f8eeee;
    color: var(--ip-primary-ink);
    font-weight: 700;
}
main.ip .ip-aside-help p {
    display: flex;
    align-items: baseline;
    gap: .55rem;
    margin: 0 0 .45rem;
    font-size: var(--fs-sm);
    color: var(--ip-muted);
    word-break: break-word;
}
main.ip .ip-aside-help p i { color: var(--ip-accent-ink); width: 14px; flex: none; }
main.ip .ip-aside-help p a { color: inherit; }

/* ---------- Surfaces --------------------------------------------------- */
main.ip .ip-surface {
    background: var(--ip-surface);
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius);
    padding: clamp(1.25rem, 2.6vw, 2.25rem);
}
main.ip .ip-section-title {
    font-size: var(--fs-h2);
    font-weight: 700;
    line-height: 1.3;
    color: var(--ip-head);
    margin: 0 0 1rem;
}
main.ip .ip-section-title small {
    font-size: var(--fs-sm);
    font-weight: 500;
    color: var(--ip-muted);
    margin-left: .4rem;
}
main.ip .ip-group + .ip-group { margin-top: 2.5rem; }

/* ---------- Prose: normalised CMS content -------------------------------- */
main.ip .ip-prose { font-size: var(--fs-base); line-height: 1.7; color: var(--ip-ink); overflow-wrap: break-word; }
main.ip .ip-prose > :first-child { margin-top: 0; }
main.ip .ip-prose > :last-child { margin-bottom: 0; }
main.ip .ip-prose :where(p, ul, ol, dl, blockquote) { max-width: 78ch; }
main.ip .ip-prose p { margin: 0 0 1rem; }
main.ip .ip-prose h2,
main.ip .ip-prose h3,
main.ip .ip-prose h4 { color: var(--ip-head); font-weight: 700; letter-spacing: -.005em; }
main.ip .ip-prose h2 { font-size: var(--fs-h2); line-height: 1.3; margin: 2.25rem 0 .85rem; padding-bottom: .5rem; border-bottom: 1px solid var(--ip-rule); }
main.ip .ip-prose h3 { font-size: var(--fs-h3); line-height: 1.35; margin: 1.9rem 0 .7rem; }
main.ip .ip-prose h4 { font-size: var(--fs-h4); line-height: 1.4; margin: 1.5rem 0 .5rem; }
main.ip .ip-prose :where(h2, h3, h4) + :where(h2, h3, h4) { margin-top: .5rem; }
main.ip .ip-prose strong { font-weight: 650; color: var(--ip-head); }
main.ip .ip-prose ul,
main.ip .ip-prose ol { margin: 0 0 1.1rem; padding-left: 1.35rem; }
main.ip .ip-prose li { margin: .3rem 0; padding-left: .2rem; }
main.ip .ip-prose ul > li::marker { color: var(--ip-accent-ink); }
main.ip .ip-prose ol > li::marker { color: var(--ip-primary); font-weight: 700; }
main.ip .ip-prose li > ul,
main.ip .ip-prose li > ol { margin: .3rem 0 .2rem; }
main.ip .ip-prose blockquote {
    margin: 1.25rem 0;
    padding: .9rem 1.2rem;
    border-left: 4px solid var(--ip-accent);
    background: var(--ip-wash);
    border-radius: 0 var(--ip-radius-sm) var(--ip-radius-sm) 0;
}
main.ip .ip-prose hr { border: 0; border-top: 1px solid var(--ip-rule); margin: 2rem 0; opacity: 1; }
main.ip .ip-prose sup { font-size: .7em; }
main.ip .ip-prose a { text-decoration: underline; text-decoration-color: rgba(122, 27, 40, .35); text-underline-offset: 3px; }
main.ip .ip-prose a:hover { text-decoration-color: currentColor; }
main.ip .ip-prose img { border-radius: var(--ip-radius-sm); }
main.ip .ip-prose p > img:only-child { display: block; margin: 1rem 0; }
main.ip .ip-prose img[data-ip="portrait"] {
    display: block;
    width: 180px;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border: 1px solid var(--ip-rule);
    margin: .25rem 0 1rem;
}
main.ip .ip-prose h2:has(> img:only-child) { border: 0; padding: 0; margin: .5rem 0 1rem; }

/* Document links */
main.ip a.ip-file {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
main.ip a.ip-file::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
    font-size: 1em;
    content: "\f15b";
    line-height: 1;
}
main.ip a.ip-file--pdf::before { content: "\f1c1"; color: #b3261e; }
main.ip a.ip-file--doc::before { content: "\f1c2"; color: #1f5fa8; }
main.ip a.ip-file--sheet::before { content: "\f1c3"; color: #1e7a45; }
main.ip a.ip-file:hover { text-decoration: underline; }
main.ip .ip-size {
    display: inline-block;
    margin-left: .35rem;
    padding: 0 .45rem;
    border-radius: 4px;
    background: var(--ip-wash);
    font-size: var(--fs-xs);
    font-weight: 500;
    color: var(--ip-muted);
    white-space: nowrap;
    vertical-align: middle;
}

/* Tables */
main.ip .ip-table {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 1.25rem 0 1.5rem;
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius-sm);
    background: var(--ip-surface);
}
main.ip .ip-table:first-child { margin-top: 0; }
main.ip .ip-table table {
    width: 100%;
    min-width: 520px;
    border-collapse: collapse;
    border-spacing: 0;
    margin: 0;
    font-size: .9375rem;
    line-height: 1.55;
    color: var(--ip-ink);
    background: transparent;
}
main.ip .ip-table--wide table { min-width: 760px; }
main.ip .ip-table th,
main.ip .ip-table td {
    padding: .7rem .9rem;
    border: 0;
    border-bottom: 1px solid var(--ip-rule);
    vertical-align: top;
    text-align: left;
    background: transparent;
    overflow-wrap: break-word;
}
main.ip .ip-table td + td,
main.ip .ip-table th + th { border-left: 1px solid #efeae2; }
main.ip .ip-table thead th {
    background: var(--ip-wash);
    color: var(--ip-head);
    font-size: var(--fs-sm);
    font-weight: 700;
    line-height: 1.4;
    border-bottom: 2px solid var(--ip-rule-strong);
    vertical-align: bottom;
}
main.ip .ip-table thead tr + tr th { border-top: 1px solid var(--ip-rule); }
main.ip .ip-table tbody tr:nth-child(even) > td { background: #fcfbf8; }
main.ip .ip-table tbody tr:hover > td { background: #f8f1e6; }
main.ip .ip-table tbody tr:last-child > td { border-bottom: 0; }
main.ip .ip-table td p,
main.ip .ip-table th p { margin: 0; max-width: none; }
main.ip .ip-table td p + p { margin-top: .35rem; }
main.ip .ip-table td ul,
main.ip .ip-table td ol { margin: 0; }
main.ip .ip-table .ip-sn { width: 4.25rem; text-align: center; color: var(--ip-muted); font-variant-numeric: tabular-nums; }
main.ip .ip-table thead .ip-sn { color: var(--ip-head); }
main.ip .ip-table img { max-width: 140px; }
main.ip .ip-table td[style*="center"] { text-align: center; }

/* Accordions (converted from the old jQuery-UI widgets) */
main.ip .ip-accordion {
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius-sm);
    background: var(--ip-surface);
    margin: 0 0 .75rem;
}
main.ip .ip-accordion > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1.1rem;
    font-size: var(--fs-h4);
    font-weight: 650;
    line-height: 1.4;
    color: var(--ip-head);
}
main.ip .ip-accordion > summary::-webkit-details-marker { display: none; }
main.ip .ip-accordion > summary::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: .8rem;
    color: var(--ip-primary);
    margin-top: .3rem;
    transition: transform .2s ease;
}
main.ip .ip-accordion[open] > summary { border-bottom: 1px solid var(--ip-rule); }
main.ip .ip-accordion[open] > summary::after { transform: rotate(180deg); }
main.ip .ip-accordion > summary:hover { background: var(--ip-wash); }
main.ip .ip-accordion-body { padding: 1rem 1.1rem 1.1rem; }
main.ip .ip-accordion-body > .ip-table { margin: 0; }

/* Column runs (converted from Bootstrap col-md-*) */
main.ip .ip-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 2rem; margin: 0 0 1rem; }
main.ip .ip-col { min-width: 0; }

/* Embeds */
main.ip .ip-embed { position: relative; aspect-ratio: 16 / 9; margin: 1.25rem 0; border-radius: var(--ip-radius-sm); overflow: hidden; background: var(--ip-wash); }
main.ip .ip-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- Hub links under a section page -------------------------------- */
main.ip .ip-hubs { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .9rem; }
main.ip .ip-hub {
    display: flex;
    flex-direction: column;
    gap: .45rem;
    padding: 1rem 1.1rem;
    background: var(--ip-surface);
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius-sm);
    color: var(--ip-ink);
}
main.ip .ip-hub:hover { border-color: var(--ip-primary); text-decoration: none; color: var(--ip-ink); }
main.ip .ip-hub strong { font-size: var(--fs-base); font-weight: 700; line-height: 1.35; color: var(--ip-head); }
main.ip .ip-hub ul { list-style: none; margin: 0; padding: 0; font-size: var(--fs-sm); color: var(--ip-muted); line-height: 1.5; }
main.ip .ip-hub span { margin-top: auto; font-size: var(--fs-sm); font-weight: 600; color: var(--ip-primary); }

/* ---------- Buttons ------------------------------------------------------ */
main.ip .ip-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 2.6rem;
    padding: .55rem 1.15rem;
    border: 1px solid var(--ip-primary);
    border-radius: var(--ip-radius-sm);
    background: var(--ip-primary);
    color: #fff;
    font-family: var(--ip-font);
    font-size: var(--fs-sm);
    font-weight: 650;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
main.ip .ip-btn:hover { background: var(--ip-primary-ink); border-color: var(--ip-primary-ink); color: #fff; text-decoration: none; }
main.ip .ip-btn--ghost { background: transparent; color: var(--ip-primary); }
main.ip .ip-btn--ghost:hover { background: #f8eeee; color: var(--ip-primary-ink); }
main.ip .ip-btn--gold { background: var(--ip-accent); border-color: var(--ip-accent); color: #2a1d05; }
main.ip .ip-btn--gold:hover { background: #b98f3f; border-color: #b98f3f; color: #1d1403; }
main.ip .ip-btn--sm { min-height: 2.1rem; padding: .35rem .8rem; font-size: var(--fs-xs); }
main.ip .ip-btn--block { width: 100%; }
main.ip .ip-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.25rem; }
main.ip .ip-back { display: inline-flex; align-items: center; gap: .45rem; font-size: var(--fs-sm); font-weight: 600; }

/* ---------- Forms -------------------------------------------------------- */
main.ip .ip-form { display: grid; gap: 1rem; }
main.ip .ip-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
main.ip .ip-field { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
main.ip .ip-label { font-size: var(--fs-sm); font-weight: 600; color: var(--ip-head); }
main.ip .ip-label .ip-req { color: #b3261e; margin-left: .15rem; }
main.ip .ip-hint { font-size: var(--fs-xs); color: var(--ip-muted); }
main.ip .ip-input,
main.ip .ip-select,
main.ip .ip-textarea {
    width: 100%;
    min-height: 2.75rem;
    margin: 0;
    padding: .6rem .8rem;
    border: 1px solid var(--ip-rule-strong);
    border-radius: var(--ip-radius-sm);
    background: #fff;
    color: var(--ip-ink);
    font-family: var(--ip-font);
    font-size: var(--fs-base);
    line-height: 1.4;
    transition: border-color .15s ease, box-shadow .15s ease;
}
main.ip .ip-textarea { min-height: 9rem; resize: vertical; }
main.ip .ip-select { appearance: auto; }
main.ip .ip-input:focus,
main.ip .ip-select:focus,
main.ip .ip-textarea:focus { outline: 0; border-color: var(--ip-primary); box-shadow: 0 0 0 3px rgba(122, 27, 40, .14); }
main.ip .ip-input[type="file"] { padding: .45rem .6rem; }
main.ip .ip-check { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--fs-sm); font-weight: 500; color: var(--ip-ink); cursor: pointer; }
main.ip .ip-check input { width: 1.05rem; height: 1.05rem; accent-color: var(--ip-primary); margin: 0; }
main.ip .ip-form-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin-top: .25rem; font-size: var(--fs-sm); }

/* Toolbar: search + filters above listings */
main.ip .ip-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: .75rem;
    padding: 1rem;
    background: var(--ip-surface);
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius);
}
main.ip .ip-toolbar .ip-field { flex: 1 1 180px; }
main.ip .ip-toolbar .ip-field--grow { flex: 3 1 280px; }
main.ip .ip-toolbar .ip-check { min-height: 2.75rem; }
main.ip .ip-toolbar .ip-btn { min-height: 2.75rem; }
main.ip .ip-filter-note { font-size: var(--fs-sm); color: var(--ip-muted); margin: .75rem 0 0; }

/* Pill tabs (faculty categories, albums) */
main.ip .ip-tabs { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0; padding: 0; list-style: none; }
main.ip .ip-tabs a {
    display: inline-block;
    padding: .4rem .9rem;
    border: 1px solid var(--ip-rule-strong);
    border-radius: 999px;
    background: var(--ip-surface);
    color: var(--ip-ink);
    font-size: var(--fs-sm);
    font-weight: 600;
    line-height: 1.4;
}
main.ip .ip-tabs a:hover { border-color: var(--ip-primary); color: var(--ip-primary); text-decoration: none; }
main.ip .ip-tabs a.is-active { background: var(--ip-primary); border-color: var(--ip-primary); color: #fff; }

/* ---------- Cards & grids -------------------------------------------------- */
main.ip .ip-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
main.ip .ip-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
main.ip .ip-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--ip-surface);
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius);
    padding: 1.25rem;
}
main.ip .ip-card--media { padding: 0; overflow: hidden; }
main.ip .ip-card--media .ip-card-body { padding: 1.15rem 1.25rem 1.25rem; display: flex; flex-direction: column; flex: 1; }
main.ip .ip-card-media { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: var(--ip-wash); border-bottom: 1px solid var(--ip-rule); }
main.ip .ip-card-tag {
    align-self: flex-start;
    margin: 0 0 .55rem;
    padding: .15rem .55rem;
    border-radius: 4px;
    background: #f6eedc;
    color: var(--ip-accent-ink);
    font-size: var(--fs-xs);
    font-weight: 650;
    line-height: 1.5;
}
main.ip .ip-card-date { font-size: var(--fs-sm); color: var(--ip-muted); margin: 0 0 .35rem; }
main.ip .ip-card-title { font-size: var(--fs-h4); font-weight: 700; line-height: 1.35; color: var(--ip-head); margin: 0 0 .5rem; }
main.ip .ip-card-title a { color: inherit; }
main.ip .ip-card-title a:hover { color: var(--ip-primary); }
main.ip .ip-card-text { font-size: var(--fs-sm); line-height: 1.6; color: var(--ip-muted); margin: 0 0 1rem; }
main.ip .ip-card .ip-actions { margin-top: auto; padding-top: .25rem; }
main.ip .ip-card-icon {
    width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    border-radius: var(--ip-radius-sm);
    background: #f8eeee;
    color: var(--ip-primary);
    font-size: 1.15rem;
    margin-bottom: .9rem;
}
main.ip .ip-dl { margin: 0 0 1rem; display: grid; gap: 0; font-size: var(--fs-sm); }
main.ip .ip-dl > div { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: .75rem; padding: .45rem 0; border-top: 1px solid var(--ip-rule); }
main.ip .ip-dl dt { font-weight: 600; color: var(--ip-head); }
main.ip .ip-dl dd { margin: 0; color: var(--ip-ink); }

/* People */
main.ip .ip-person { flex-direction: row; gap: 1rem; align-items: flex-start; }
main.ip .ip-person-photo {
    flex: none;
    width: 88px;
    height: 104px;
    object-fit: cover;
    border-radius: var(--ip-radius-sm);
    border: 1px solid var(--ip-rule);
    background: var(--ip-wash);
}
main.ip .ip-person-body { min-width: 0; }
main.ip .ip-person-role { font-size: var(--fs-sm); font-weight: 600; color: var(--ip-primary); margin: 0 0 .5rem; }
main.ip .ip-person-line { font-size: var(--fs-sm); color: var(--ip-muted); margin: 0 0 .3rem; line-height: 1.5; }
main.ip .ip-person-line i { color: var(--ip-accent-ink); width: 1rem; }
main.ip .ip-person a[href^="mailto"] { font-size: var(--fs-sm); word-break: break-all; }

/* Gallery */
main.ip .ip-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
main.ip .ip-gallery figure { margin: 0; background: var(--ip-surface); border: 1px solid var(--ip-rule); border-radius: var(--ip-radius); overflow: hidden; }
main.ip .ip-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--ip-wash); }
main.ip .ip-gallery figcaption { padding: .7rem .9rem; font-size: var(--fs-sm); font-weight: 600; color: var(--ip-head); line-height: 1.45; }

/* Social tiles */
main.ip .ip-social { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .75rem; }
main.ip .ip-social a {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .9rem 1rem;
    background: var(--ip-surface);
    border: 1px solid var(--ip-rule);
    border-radius: var(--ip-radius-sm);
    color: var(--ip-ink);
    font-weight: 600;
    font-size: var(--fs-sm);
}
main.ip .ip-social a i { font-size: 1.25rem; color: var(--ip-primary); width: 1.5rem; text-align: center; }
main.ip .ip-social a:hover { border-color: var(--ip-primary); text-decoration: none; }

/* Contact */
main.ip .ip-contact { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
main.ip .ip-contact-list { list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; gap: .9rem; }
main.ip .ip-contact-list li { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: .75rem; align-items: start; }
main.ip .ip-contact-list i {
    width: 2.25rem; height: 2.25rem; display: grid; place-items: center;
    border-radius: var(--ip-radius-sm); background: #f8eeee; color: var(--ip-primary); font-size: .95rem;
}
main.ip .ip-contact-list strong { display: block; font-size: var(--fs-sm); color: var(--ip-head); }
main.ip .ip-contact-list span { font-size: var(--fs-sm); color: var(--ip-muted); }
main.ip .ip-map { width: 100%; height: 300px; border: 0; border-radius: var(--ip-radius-sm); display: block; background: var(--ip-wash); }

/* Search results */
main.ip .ip-results { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
main.ip .ip-results li { background: var(--ip-surface); border: 1px solid var(--ip-rule); border-radius: var(--ip-radius-sm); padding: 1rem 1.15rem; }
main.ip .ip-results a { font-size: var(--fs-h4); font-weight: 700; line-height: 1.35; }
main.ip .ip-results p { margin: .35rem 0 0; font-size: var(--fs-sm); color: var(--ip-muted); line-height: 1.6; }
main.ip .ip-results .ip-results-url { display: block; font-size: var(--fs-xs); color: var(--ip-accent-ink); margin-top: .15rem; }
main.ip .ip-count { font-size: var(--fs-sm); color: var(--ip-muted); margin: 0 0 .75rem; }

/* Timeline (grievance tracking) */
main.ip .ip-timeline { list-style: none; margin: 0; padding: 0 0 0 1.25rem; border-left: 2px solid var(--ip-rule); }
main.ip .ip-timeline li { position: relative; padding: 0 0 1.1rem .5rem; }
main.ip .ip-timeline li::before {
    content: ""; position: absolute; left: -1.25rem; top: .45rem; transform: translateX(-6px);
    width: 10px; height: 10px; border-radius: 50%; background: var(--ip-primary); box-shadow: 0 0 0 3px #fff;
}
main.ip .ip-timeline strong { display: block; font-size: var(--fs-sm); color: var(--ip-head); }
main.ip .ip-timeline span { font-size: var(--fs-sm); color: var(--ip-muted); }
main.ip .ip-status {
    display: inline-block; padding: .15rem .6rem; border-radius: 999px;
    background: #f6eedc; color: var(--ip-accent-ink); font-size: var(--fs-xs); font-weight: 700;
}

/* Alerts & empty states */
main.ip .ip-alert {
    display: flex; gap: .75rem; align-items: flex-start;
    padding: .85rem 1rem; border-radius: var(--ip-radius-sm); border: 1px solid;
    font-size: var(--fs-sm); line-height: 1.55;
}
main.ip .ip-alert i { margin-top: .2rem; }
main.ip .ip-alert--success { background: #eef6f0; border-color: #b9d9c2; color: #1d5a33; }
main.ip .ip-alert--error { background: #fbeeee; border-color: #e7bcbc; color: #7d1f1f; }
main.ip .ip-alert--info { background: #f4f1ea; border-color: var(--ip-rule-strong); color: var(--ip-ink); }
main.ip .ip-empty {
    padding: 2rem 1.5rem; text-align: center; color: var(--ip-muted);
    background: var(--ip-surface); border: 1px dashed var(--ip-rule-strong); border-radius: var(--ip-radius);
    font-size: var(--fs-sm);
}
main.ip .ip-empty i { display: block; font-size: 1.5rem; color: var(--ip-accent-ink); margin-bottom: .5rem; }
main.ip .ip-empty p { margin: 0 auto; max-width: 52ch; }
main.ip .ip-empty a { font-weight: 600; }

/* Dashboard */
main.ip .ip-linklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
main.ip .ip-linklist a {
    display: flex; align-items: center; gap: .6rem; padding: .75rem .9rem;
    border: 1px solid var(--ip-rule); border-radius: var(--ip-radius-sm); color: var(--ip-ink); font-weight: 600; font-size: var(--fs-sm);
}
main.ip .ip-linklist a i { color: var(--ip-primary); }
main.ip .ip-linklist a:hover { border-color: var(--ip-primary); text-decoration: none; }

/* ---------- Responsive ----------------------------------------------------- */
@media (max-width: 1100px) {
    main.ip .ip-shell.has-aside { grid-template-columns: minmax(0, 1fr) 250px; gap: 1.5rem; }
}
@media (max-width: 991.98px) {
    main.ip .ip-shell.has-aside { grid-template-columns: 1fr; }
    main.ip .ip-aside { position: static; order: 2; }
    main.ip .ip-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    main.ip .ip-contact { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    main.ip { --fs-base: .975rem; padding-bottom: 2.5rem; }
    main.ip .ip-hero { margin-bottom: 1.25rem; padding-bottom: 1.25rem; }
    main.ip .ip-grid--3 { grid-template-columns: 1fr; }
    main.ip .ip-form-row { grid-template-columns: 1fr; }
    main.ip .ip-linklist { grid-template-columns: 1fr; }
    main.ip .ip-person { flex-direction: column; }
    main.ip .ip-toolbar .ip-btn { width: 100%; }
    main.ip .ip-table th, main.ip .ip-table td { padding: .6rem .7rem; }
}
@media (prefers-reduced-motion: reduce) {
    main.ip * { transition: none !important; }
}

/* ---------- High contrast (A / A toggle) ----------------------------------- */
.high-contrast main.ip { --ip-ink: #fff; --ip-head: #fff; --ip-muted: #e6e6e6; --ip-rule: #fff; --ip-rule-strong: #fff; --ip-wash: #000; --ip-surface: #000; --ip-primary: #ffff00; --ip-primary-ink: #ffff00; --ip-accent-ink: #ffff00; }
.high-contrast main.ip :where(.ip-surface, .ip-card, .ip-aside-card, .ip-table, .ip-accordion, .ip-hub, .ip-toolbar, .ip-results li, .ip-gallery figure, .ip-social a, .ip-empty, .ip-meta li, .ip-input, .ip-select, .ip-textarea, .ip-subnav a.is-active, td, th) { background: #000 !important; color: #fff !important; border-color: #fff !important; }
.high-contrast main.ip a, .high-contrast main.ip a * { color: #ffff00 !important; }
.high-contrast main.ip .ip-btn { background: #000 !important; color: #ffff00 !important; border-color: #ffff00 !important; }

/* ---------- Print ---------------------------------------------------------- */
@media print {
    .access-shell, .site-ticker, header.container, .gov-links-section, footer, main.ip .ip-aside, main.ip .ip-crumbs, main.ip .ip-toolbar { display: none !important; }
    main.ip .ip-shell.has-aside { display: block; }
    main.ip .ip-surface, main.ip .ip-card, main.ip .ip-table { border-color: #999; }
    main.ip .ip-table { overflow: visible; }
    main.ip .ip-table table { min-width: 0; }
    main.ip a { color: #000; }
    main.ip .ip-accordion:not([open]) > .ip-accordion-body { display: block; }
}
