/* SC Science — page-level styles, ported verbatim from the approved Claude
   Design HTML prototypes' per-page <style> blocks, combined into one file.

   Two class names collided across pages because each prototype page was an
   isolated HTML file with its own <style> block; here they're disambiguated
   with a page suffix (the values differ, so they could not simply merge):
     .hero-split   -> .hero-split-home (Homepage) / .hero-split-custom (Custom Research Systems)
     .detail-split -> .detail-split-product (Product Detail) / .detail-split-project (Project Detail)
   Every other class was identical (or unique) across the pages that used it,
   so it appears once below. */

body{margin:0}
a{color:var(--red-600)}
a:hover{color:var(--red-700)}
.wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter)}

/* Shared split/grid layouts (Homepage, Contact, Custom Research Systems) */
.split-75{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--space-12);align-items:center}
.split-57{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-12);align-items:start}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-8)}
@media (max-width:900px){.split-75,.split-57{grid-template-columns:minmax(0,1fr)}.grid3{grid-template-columns:minmax(0,1fr)}}

/* Shared form grid (all enquiry forms) */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7)}
.form-grid .full{grid-column:1/-1}
@media (max-width:900px){.form-grid{grid-template-columns:minmax(0,1fr)}}

/* Shared "how we work" step flow (Homepage, Custom Research Systems) */
.step-flow{display:flex;align-items:flex-start;gap:var(--space-6);flex-wrap:wrap}
.step-flow__item{flex:1 1 160px;min-width:140px}
.step-flow__arrow{color:var(--ink-200);margin-top:2px;flex:0 0 auto;display:none}
@media (min-width:760px){.step-flow__arrow{display:flex}}

/* Shared "who we serve" row (Homepage, About) */
.who-row{display:flex;flex-wrap:wrap;gap:var(--space-6);align-items:baseline}
.who-item{font-family:var(--font-display);font-size:var(--text-md);font-weight:500;color:var(--ink-800)}
.who-sep{color:var(--ink-200)}

/* ---------- Homepage ---------- */
.hero-split-home{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--space-12);align-items:start}
.pillar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8)}
.pillar-card{display:flex;flex-direction:column;height:100%;border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-page)}
.pillar-card__media{aspect-ratio:3/2;margin:0;border-radius:0;flex:0 0 auto}
.pillar-card__body{padding:var(--pad-card);display:flex;flex-direction:column;gap:var(--space-4);flex:1 1 auto}
.client-logo-grid{--logo-h:56px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--space-6) var(--space-7);align-items:center}
.client-logo-cell{display:flex;align-items:center;justify-content:center;height:var(--logo-h)}
.client-logo-cell--tall{height:calc(var(--logo-h) * 1.5)}
.client-logo-cell--mid{height:calc(var(--logo-h) * 1.25)}
.client-logo-cell img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.hero-figure{aspect-ratio:16/9;margin:0}
.hero-figure__caption{margin-top:var(--space-6)}
.quicklink{display:inline-flex;align-items:center;gap:var(--space-4);height:36px;padding:0 var(--space-6);border-radius:var(--radius-pill);border:1px solid var(--border-default);background:var(--surface-page);color:var(--ink-700);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:500;text-decoration:none;cursor:pointer;transition:var(--transition-control)}
.quicklink:hover{border-color:var(--ink-900);color:var(--ink-900);background:var(--surface-subtle)}
.cat-link{display:inline-flex;align-items:center;gap:var(--space-3);margin-top:auto;font-size:var(--text-sm);font-weight:600;text-decoration:none}
.pillar-card:hover{border-color:var(--ink-150);box-shadow:var(--shadow-md)}
.pillar-card__media-link{display:block;overflow:hidden}
.pillar-card__media-link:focus-visible{outline:2px solid var(--red-500);outline-offset:2px}
.pillar-card__media-link img{transition:transform 180ms var(--ease-precise)}
.pillar-card__media-link:hover img{transform:scale(1.03)}
.pillar-card__title-link{text-decoration:none}
.pillar-card__title-link h3{color:var(--text-primary);transition:color 120ms var(--ease-precise)}
.pillar-card__title-link:hover h3,.pillar-card__title-link:focus-visible h3{color:var(--red-500)}
.pillar-card__title-link:focus-visible{outline:2px solid var(--red-500);outline-offset:2px;border-radius:2px}
.chip-link{display:inline-flex;align-items:center;height:28px;padding:0 var(--space-5);border-radius:var(--radius-pill);border:1px solid var(--border-default);background:var(--surface-page);color:var(--ink-700);font-family:var(--font-sans);font-size:var(--text-2xs);font-weight:500;text-decoration:none;transition:var(--transition-control)}
.chip-link:hover{border-color:var(--ink-900);color:var(--ink-900);background:var(--surface-subtle)}
.chip-link:focus-visible{outline:none;box-shadow:var(--focus-ring)}
@media (max-width:1080px){.hero-split-home{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.client-logo-grid{grid-template-columns:repeat(4,minmax(0,1fr));--logo-h:46px}}
@media (max-width:760px){.pillar-grid{grid-template-columns:minmax(0,1fr)}.hero-figure{aspect-ratio:3/2}}
@media (max-width:640px){.chip-link{min-height:44px;height:auto;white-space:normal;text-align:center;padding:var(--space-4) var(--space-6)}.quicklink{min-height:44px;height:auto;white-space:normal;padding:var(--space-4) var(--space-7)}}
@media (max-width:560px){.client-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5) var(--space-4);--logo-h:34px}}

/* ---------- Product Category ---------- */
.cat-hero{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--space-10);align-items:center}
.filter-row{display:flex;flex-wrap:wrap;gap:var(--space-6);align-items:center;justify-content:space-between}
.search-wrap{min-width:220px;flex:0 1 280px}
.prod-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-7)}
.prod-card__body{padding:var(--pad-card);display:flex;flex-direction:column;gap:var(--space-4);flex:1}
.prod-card__actions{display:flex;gap:var(--space-4);margin-top:auto;padding-top:var(--space-5)}
.prod-thumb{aspect-ratio:4/3;margin:0;background:var(--ink-25)}
.media-pending{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);background:var(--surface-subtle);border:1px dashed var(--border-default);border-radius:var(--radius-md);text-align:center;padding:var(--space-6);color:var(--text-tertiary)}
.media-pending__t{font-family:var(--font-sans);font-size:var(--text-2xs);font-weight:500;color:var(--text-secondary)}
.media-pending__s{font-family:var(--font-sans);font-size:var(--text-3xs);color:var(--text-tertiary)}
.search-hint{margin:var(--space-3) 0 0;font-size:var(--text-3xs);color:var(--text-tertiary)}
.sub-notice{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-6);border:1px solid var(--status-warning-border);background:var(--status-warning-bg);color:var(--status-warning-fg);border-radius:var(--radius-xs);font-size:var(--text-sm);margin-bottom:var(--space-7)}
.badge-row{display:flex;gap:var(--space-3);flex-wrap:wrap}
.prod-list{display:flex;flex-direction:column}
.prod-row{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-8);padding:var(--space-7) 0;border-bottom:1px solid var(--border-subtle)}
.prod-row:last-child{border-bottom:none}
[data-cat-filter] [hidden]{display:none!important}
.prod-row__main{flex:1 1 auto;min-width:0}
.prod-row__name{font-family:var(--font-display);font-size:var(--text-md);font-weight:500;letter-spacing:var(--tracking-tight);margin:var(--space-4) 0 0;color:var(--text-primary)}
.prod-row__use{margin:var(--space-3) 0 0;font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal);max-width:62ch}
.prod-row__actions{display:flex;gap:var(--space-4);flex:0 0 auto}
.mat-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6)}
.mat-card__cta{display:inline-flex;align-items:center;gap:var(--space-3);margin-top:var(--space-5);font-size:var(--text-sm);font-weight:600}
@media (max-width:900px){.cat-hero{grid-template-columns:minmax(0,1fr)}.prod-grid{grid-template-columns:minmax(0,1fr)}.filter-row{flex-direction:column;align-items:stretch}.search-wrap{flex:1 1 auto}.mat-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.prod-row{flex-direction:column;align-items:stretch}.prod-row__actions{margin-top:var(--space-2)}}
@media (max-width:560px){.mat-card-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Product Detail ---------- */
.detail-split-product{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-11);align-items:start}
.detail-media{aspect-ratio:1/1;margin:0}
.config-row{display:flex;flex-wrap:wrap;gap:var(--space-4)}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-7)}
@media (max-width:900px){.detail-split-product{grid-template-columns:minmax(0,1fr)}.related-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Custom Research Systems ---------- */
.hero-split-custom{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--space-11);align-items:center}
.req-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6)}
.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-7)}
@media (max-width:900px){.hero-split-custom{grid-template-columns:minmax(0,1fr)}.req-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.case-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Project Detail ---------- */
.detail-split-project{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--space-11);align-items:start}
.points{list-style:none;margin:var(--space-6) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--space-4)}
.points li{display:flex;gap:var(--space-4);align-items:flex-start;font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal)}
.other-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-7)}
@media (max-width:900px){.detail-split-project{grid-template-columns:minmax(0,1fr)}.other-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- About ---------- */
.narrow{max-width:var(--container-narrow)}
.about-split{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--space-11);align-items:center}
@media (max-width:760px){.about-split{grid-template-columns:minmax(0,1fr)}}

/* ---------- WordPress-environment additions (not in the original prototype) ---------- */
/* Keep the sticky nav below the wp-admin bar for logged-in editors. */
@media screen and (min-width:783px){body.admin-bar .sc-nav{top:32px}}
@media screen and (max-width:782px){body.admin-bar .sc-nav{top:46px}}
.sc-skip-link{position:absolute;left:-9999px;top:auto;z-index:100;background:var(--ink-900);color:#fff;padding:var(--space-5) var(--space-7);border-radius:var(--radius-xs)}
.sc-skip-link:focus{left:var(--gutter);top:var(--space-5)}

/* Burger icon swap (menu <-> close), driven by the .sc-nav--open class main.js toggles */
.sc-nav__burger .icon-close{display:none}
.sc-nav--open .sc-nav__burger .icon-open{display:none}
.sc-nav--open .sc-nav__burger .icon-close{display:block}

/* Enquiry form status / fallback (reuses .sc-alert visuals) */
.sc-enquiry__status{margin-top:var(--space-6)}
.sc-enquiry__status a{color:inherit;text-decoration:underline}
.sc-enquiry__fallback{margin-top:var(--space-6)}
.sc-enquiry__copyfail textarea{margin-top:var(--space-4);width:100%;font-family:var(--font-mono);font-size:var(--text-2xs);padding:var(--space-5);border:1px solid var(--border-default);border-radius:var(--radius-xs);background:var(--surface-subtle)}
.sc-enquiry__note{margin:var(--space-6) 0 0;font-size:var(--text-2xs);color:var(--text-tertiary);line-height:1.6}
