/* qa.css: design and UX audit fixes, Oct 22 2026. Loaded last on every page except the homepage. */

/* ---------- Global ---------- */
:root{--water:#1D7686;--air:#1D7686}
html{scroll-padding-top:96px}
.site-header{-webkit-backdrop-filter:none !important;backdrop-filter:none !important;background:#fff !important}

/* No glass panels: flat teal with white text */
.ahero-card,.hero-meta{-webkit-backdrop-filter:none !important;backdrop-filter:none !important;background:#1D7686 !important;border-color:#1D7686 !important;box-shadow:none !important}
.hero-badge,.lhero-badge{-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
.ah-quote{background:rgba(255,255,255,.1) !important}

/* No gradients on the remaining bands */
.cimpact,.sea-darkband{background:#1D7686 !important}
.tmem-bio::after{background:#f5f8f9 !important;height:28px !important;opacity:.0}
.cta-footer-2:not(.huis){background-color:#1D7686 !important;background-image:none !important}
.cta-footer-2.huis{background-image:none !important}

/* Square corners everywhere */
.btn-circ .circ,.btn-getintouch .circ,.f-listed-go,.site-footer .social a,.rs-cta-memb a,.rs-cta-logos a,
.ppg-section.ppg-contact,.cf-legend i,.resin-tag i,.sc-dot,.a11y-panel,.a11y-switch,.a11y-switch::after,.a11y-reset,
.a11y-text-ctl button,.a11y-fab,.btn-white,.hero-btn-copy,.rssct-cta-btn,.image-172,.section-41.secis,.field-2,.submit-button-3,
.div-block-38,.cta-footer-2 .btn-white,.w-button,.w-input,.w-select,.dc-pin,.map-pill{border-radius:0 !important}

/* Accessibility button: smaller on phones, footer never covered */
@media (max-width:640px){
  .a11y-fab{width:44px !important;height:44px !important;right:10px !important;bottom:10px !important}
  .a11y-fab svg{width:24px !important;height:24px !important}
  .site-footer{padding-bottom:72px}
}

/* Tap targets */
.f-legal a,.footer-legal a,.pd-crumbs a,.lhero-crumbs a,.rj-crumbs a{display:inline-block;padding-block:10px}
.pd-cmp td:first-child a{display:inline-block;padding-block:6px}

/* Footer ticker panel on the charcoal footer */
.f-listed{background:transparent !important;border-color:#3a4244 !important}

/* Section rhythm */
.ms-sec{padding-block:clamp(64px,6.6vw,96px) !important}

/* ---------- People and company pages ---------- */
@media (max-width:768px){
  .lhero-badge{position:static !important;margin-top:0 !important;left:auto !important;right:auto !important;bottom:auto !important;width:100% !important;max-width:none !important;box-shadow:none !important}
  .tmem-photo{max-width:none !important;width:100%}
}
.lhero-badge{left:-24px !important;right:auto !important;bottom:-24px !important;max-width:min(360px,90%)}
.careers .roles .role-meta,.role-meta{text-transform:none !important;font-size:14px !important;color:var(--muted) !important;letter-spacing:0 !important}
.role-body p,.role-body li,.role-desc p,.role-desc li{font-size:1rem !important;color:var(--ink-2,#3a4446) !important}
.role-body ul,.role-desc ul{padding-left:18px !important;list-style:square !important}
.tmem-sec + .xa-about-cta{padding-top:clamp(64px,6.6vw,96px) !important;background:#fff}
.rs-cta-memb{display:flex;align-items:center;gap:12px;flex-wrap:nowrap}
.loc-cards,.c-cards{position:relative;z-index:1}
.loc-cards > *,.c-cards > *{background:#fff}

/* ---------- Product pages (SEA-IX) ---------- */
@media (max-width:760px){
  .pd-diagram{overflow-x:auto}
  .pd-diagram svg{min-width:860px}
  .pd-ctas .btn{width:100%;justify-content:center}
  .resin-intro,.crit-sec .x-head,.crit-sec .crit-head{text-align:left !important}
}
.pd-cmp th:first-child,.pd-cmp td:first-child{position:sticky;left:0;background:#fff;z-index:1;min-width:150px}
.pd-cmp thead th:first-child{background:var(--bg-soft)}
.pd-cmp tr.cur td:first-child{background:#ECFFFF}
.pd-cmp td:first-child small{white-space:nowrap}
@media (max-width:1023px){.pd-cmp-wrap{box-shadow:inset -14px 0 12px -12px rgba(0,0,0,.18)}}
.pd-fig b,.pd-fig.long b{font-size:clamp(1.2rem,1.6vw,1.5rem) !important;line-height:1.3 !important}
.pd-figs-grid{grid-template-columns:repeat(auto-fit,minmax(0,1fr)) !important}
@media (max-width:860px){.pd-figs-grid{grid-template-columns:1fr 1fr !important}}
.pd-sec:not(.soft) + .pd-sec:not(.soft){padding-top:0 !important}
.pd-head{grid-template-columns:minmax(0,1.25fr) 1fr !important}
@media (max-width:860px){.pd-head{grid-template-columns:1fr !important}}
.pd-media figcaption span{color:var(--muted) !important}
.pd-supply-body h2 span{display:block}

/* SEA-IX hub */
#nuclear-grade-resins{padding-bottom:48px !important}
#contaminant-selective{padding-top:48px !important}
.hub-page .resin-tag,.resin--sac .resin-tag,.resin--sba .resin-tag,.resin--mb .resin-tag{color:var(--teal) !important}
.resin--sac .resin-tag i,.resin--sba .resin-tag i,.resin--mb .resin-tag i{background:var(--teal) !important}
.resin-applbl{font-size:13px !important;text-transform:none !important;letter-spacing:0 !important;color:var(--muted) !important}
.hub-page .resin-type{min-height:4.4em}
.sc-num,.hub-page .sc-num{font-weight:600 !important}
@media (max-width:760px){.sc-dot{display:none !important}.sc-nav .soltab-btn{grid-template-columns:auto 1fr !important;padding-left:0 !important}}
.ixlp-page .eyebrow::before{content:none !important}

/* ---------- Service pages ---------- */
.section-41 .div-block-155{height:auto !important}
.grid-72{width:100% !important;max-width:1100px;grid-template-columns:repeat(4,minmax(0,1fr)) !important}
@media (max-width:991px){.grid-72{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media (max-width:560px){.grid-72{grid-template-columns:1fr !important}}
.c-pilot-img{background:transparent !important}
.c-pilot-img img{width:100%;height:100%;object-fit:cover}
@media (max-width:767px){
  .c-form-side{order:-1}
  .bt-card p,.bt-tab-panel p,.wti-card p{text-align:left !important}
  .trust-item p{text-align:left !important}
}
.dc-split,.rj-split{align-items:start !important}

/* ---------- Articles and updates ---------- */
.art-prose>p,.art-prose>ul,.art-prose>ol,.art-prose>h2,.art-prose>h3,.art-prose>blockquote,.rd-quote{max-width:680px}
.art-prose figure img{transform:none !important}
.art-prose>p.art-callout::first-letter{all:unset}
.rd-more .x-head h2{font-size:32px !important;line-height:1.2 !important}
.art-detail .art-cat{text-transform:none !important;font-size:13px !important}
.iu-card-thumb{aspect-ratio:1004/435;height:auto !important}
.iu-card-thumb img{object-fit:cover;width:100%;height:100%}
.side-tags span{cursor:default}
@media (max-width:640px){.ix-chart{min-width:0 !important}.ix-chart text{font-size:14px}}

/* Skip link */
.skip-link{position:fixed;top:-10rem;left:1rem;z-index:100000;background:#fff;color:#1D7686;font-weight:600;padding:.85rem 1.2rem;border:2px solid #1D7686;border-radius:0}
.skip-link:focus{top:.75rem}
.section-41{max-width:100% !important;box-sizing:border-box}

/* Conference page uses the site container width */
body .wrap{max-width:var(--container) !important;padding-inline:24px !important}

/* Leadership bios: clamp on a word boundary, no gradient fade */
.tmem:not(.open):not(.is-full) .tmem-bio{max-height:none !important}
.tmem:not(.open):not(.is-full) .tmem-bio p:first-child{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.tmem:not(.open):not(.is-full) .tmem-bio p + p{display:none}
.tmem-bio::after{display:none !important}
#locations .cinfo-card{background:#fff;position:relative;z-index:1}
.lhero h1.h1-long{font-size:clamp(2rem,3.4vw,3.2rem) !important;line-height:1.08}
.iu-page .iu-card-thumb{aspect-ratio:1004/435 !important}
.ms-cap{left:0 !important;right:0 !important;bottom:0 !important;background:#1D7686;padding:10px 14px;text-shadow:none !important;font-size:13px !important}
@media (max-width:860px){
  .ms-sec .ms-card:not(.is-active){display:none !important}
  .ms-gallery{align-content:start}
  .ms-g-main,.ms-g-side{height:auto !important;align-self:start;background:transparent !important}
  .ms-g-main img,.ms-g-side img{aspect-ratio:16/10;height:auto !important}
}
