/* Aerless hardware catalogue.
   A sibling of the software site rather than a copy: the same ink and paper,
   but the optical aqua the theme already uses for this division as the accent,
   and a denser, more technical rhythm because these pages are scanned against
   a specification rather than read. */
.tf-aerless {
  --ae-paper:#f6f9fa;
  --ae-surface:#fff;
  --ae-tint:#eaf3f6;
  --ae-ink:#06161f;
  --ae-ink-raised:#0a2130;
  --ae-line-soft:#e2ecf0;
  --ae-line:#d5e3e9;
  --ae-line-strong:#bed3db;
  --ae-text-strong:#12303d;
  --ae-text-lead:#35525f;
  --ae-text:#4d6772;
  --ae-muted:#63808c;
  --ae-dark-strong:#eefaff;
  --ae-dark:#c2dee9;
  --ae-dark-muted:#9dbecb;
  --ae-aqua:#12798f;
  --ae-aqua-bright:#7fd6ea;
  --ae-aqua-soft:#dff0f5;
  --ae-r-sm:10px; --ae-r-md:16px; --ae-r-lg:22px;
  --ae-shadow:0 12px 30px #0b3d4d14;
  --ae-fade:clamp(112px,14vh,178px);
}
/* position and isolation matter: the hero backdrops sit at z-index -1, and
   without a stacking context here they fall behind this element's own
   background and never appear. */
.ae-main { position:relative; isolation:isolate; padding-top:var(--nav-height); background:var(--ae-paper); }
.ae-main h1,.ae-main h2,.ae-main h3 { font-family:Manrope,Geist,sans-serif; letter-spacing:-.035em; color:var(--ae-text-strong); }
.ae-main h1 { font-size:clamp(38px,4.4vw,62px); line-height:1.07; margin:14px 0 22px; font-weight:650; }
.ae-main h2 { font-size:clamp(25px,2.6vw,38px); line-height:1.18; margin:0 0 18px; }
.ae-main h3 { font-size:20px; line-height:1.3; margin:0; }
.ae-main p { color:var(--ae-text); }
.ae-main .eyebrow { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ae-aqua); }
.ae-lead { font-size:clamp(17px,1.4vw,21px); line-height:1.65; color:var(--ae-text-lead); }
.ae-measure { max-width:62ch; }
.ae-text-link { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--ae-aqua); }
.ae-text-link:hover { text-decoration:underline; text-underline-offset:5px; }
.ae-actions { display:flex; flex-wrap:wrap; gap:20px; align-items:center; margin-top:30px; }
.ae-section { padding-block:78px; }
.ae-section-heading { display:flex; gap:56px; align-items:flex-end; justify-content:space-between; margin-bottom:34px; }
.ae-section-heading h2 { margin-bottom:0; }
.ae-section-heading > p { max-width:44ch; font-size:15px; margin:0; }

/* Hero, dark like the software site so the two divisions feel related */
.ae-hero { position:relative; display:grid; grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr); gap:54px; align-items:center; padding-block:30px var(--ae-fade); min-height:calc(88svh - var(--nav-height)); }
.ae-hero::before,.ae-hero::after { content:""; position:absolute; z-index:-1; inset-inline:calc(50% - 50vw); pointer-events:none; }
.ae-hero::before { inset-block:calc(var(--nav-height) * -1) 0;
  background:radial-gradient(ellipse 58% 48% at 76% 18%,#12798f4d 0,transparent 64%),
             radial-gradient(ellipse 52% 44% at 4% 6%,#0d4a6b52 0,transparent 68%),
             linear-gradient(180deg,#04121a 0%,var(--ae-ink) 46%,#0a2635 82%,#10323f 100%); }
.ae-hero::after { bottom:0; height:var(--ae-fade);
  background:linear-gradient(180deg,#f6f9fa00 0%,#f6f9fa08 20%,#f6f9fa1f 35%,#f6f9fa42 48%,#f6f9fa73 60%,#f6f9fa9e 70%,#f6f9fac7 80%,#f6f9fae6 88%,#f6f9faf9 95%,var(--ae-paper) 100%); }
.ae-hero-copy { position:relative; z-index:1; }
.ae-hero h1 { color:var(--ae-dark-strong); max-width:none; font-size:clamp(30px,3.1vw,44px); }
.ae-hero h1 span { color:var(--ae-aqua-bright); }
.ae-hero .eyebrow { color:var(--ae-aqua-bright); }
.ae-hero .ae-lead { color:var(--ae-dark); max-width:52ch; }
.ae-hero .ae-text-link { color:var(--ae-aqua-bright); }
.ae-hero-art { position:relative; justify-self:end; width:100%; max-width:520px; }
.ae-hero-art img { display:block; width:100%; height:auto; aspect-ratio:5/4; max-height:416px; object-fit:cover; object-position:50% 45%;
  border-radius:var(--ae-r-lg); border:1px solid #ffffff1a; box-shadow:0 30px 70px #00000059; }
.ae-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin:38px 0 0; padding-top:26px; border-top:1px solid #ffffff1f; }
.ae-facts-claims dt { font-size:clamp(18px,1.6vw,23px); line-height:1.15; min-height:2.3em; text-wrap:balance; color:var(--ae-aqua-bright); }
.ae-facts-claims dd { font-size:12.5px; }
.ae-facts dt { font-family:Manrope,Geist,sans-serif; font-size:clamp(23px,2.1vw,31px); font-weight:650; line-height:1; letter-spacing:-.035em; color:var(--ae-aqua-bright); margin-bottom:9px; }
.ae-facts dd { margin:0; font-size:12.5px; line-height:1.5; color:var(--ae-dark-muted); }

/* Detail heroes share the dark surface */
/* A detail hero holds only a few lines, so it uses a shorter fade than the
   overview. The bottom padding still matches the fade exactly, so copy can
   never sit inside the transition. */
.ae-detail-hero { --ae-fade:clamp(92px,11vh,146px); position:relative; padding-block:40px var(--ae-fade); }
.ae-detail-hero + .ae-section,.ae-hero + .ae-section { padding-top:46px; }
.ae-detail-hero::before,.ae-detail-hero::after { content:""; position:absolute; z-index:-1; inset-inline:calc(50% - 50vw); pointer-events:none; }
.ae-detail-hero::before { inset-block:calc(var(--nav-height) * -1) 0;
  background:radial-gradient(ellipse 56% 56% at 78% 14%,#12798f4d 0,transparent 66%),
             linear-gradient(180deg,#04121a 0%,var(--ae-ink) 48%,#0a2635 80%,#10323f 100%); }
.ae-detail-hero::after { bottom:0; height:var(--ae-fade);
  background:linear-gradient(180deg,#f6f9fa00 0%,#f6f9fa08 20%,#f6f9fa1f 35%,#f6f9fa42 48%,#f6f9fa73 60%,#f6f9fa9e 70%,#f6f9fac7 80%,#f6f9fae6 88%,#f6f9faf9 95%,var(--ae-paper) 100%); }
.ae-detail-hero h1 { color:var(--ae-dark-strong); max-width:20ch; }
.ae-detail-hero .eyebrow { color:var(--ae-aqua-bright); }
.ae-detail-hero .ae-lead { color:var(--ae-dark); }
.ae-hero-partner { display:flex; align-items:center; gap:14px; margin:26px 0 0; }
.ae-hero-partner span { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ae-dark-muted); }
.ae-hero-partner img { display:block; width:auto; height:30px; }

.ae-back { display:inline-block; margin-bottom:22px; font-size:13px; color:var(--ae-dark-muted); }
.ae-back:hover { color:var(--ae-dark); }

/* Categories. Each tile shows the first product in the line that has a
   photograph, so the grid illustrates itself and a buyer recognises the part
   before reading the heading. */
.ae-category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ae-category { display:grid; grid-template-rows:auto 1fr; background:var(--ae-surface); border:1px solid var(--ae-line-soft); border-radius:var(--ae-r-md); overflow:hidden; transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
.ae-category-art { display:grid; place-items:center; height:190px; padding:26px;
  background:radial-gradient(ellipse 66% 78% at 50% 108%,#12798f2b 0,transparent 72%),
             linear-gradient(166deg,#ecf5f8 0%,#d8e8ef 100%);
  border-bottom:1px solid var(--ae-line); }
.ae-category-art img { display:block; width:auto; height:auto; max-width:min(100%,296px); max-height:138px; object-fit:contain;
  filter:drop-shadow(0 16px 24px #0b3d4d2e); transition:transform .32s ease; }
.ae-category-body { display:flex; flex-direction:column; gap:11px; padding:26px 30px 28px; }
.ae-category p { font-size:15px; margin:0; max-width:46ch; }
.ae-category-meta { margin-top:auto; padding-top:16px; font-size:13px; font-weight:600; color:var(--ae-aqua); }
.ae-category:hover { transform:translateY(-4px); box-shadow:var(--ae-shadow); border-color:var(--ae-line-strong); }
.ae-category:hover .ae-category-art img { transform:translateY(-5px) scale(1.045); }

/* Products */
.ae-product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ae-card-shell { display:flex; flex-direction:column; min-width:0; }
.ae-card { display:flex; flex-direction:column; flex:1 1 auto; background:var(--ae-surface); border:1px solid var(--ae-line-soft); border-radius:var(--ae-r-md) var(--ae-r-md) 0 0; border-bottom:0; overflow:hidden; transition:transform .2s,box-shadow .2s,border-color .2s; }
.ae-card-shell:hover .ae-card,.ae-card-shell:hover .ae-card-add { border-color:var(--ae-line-strong); }
.ae-card-add { display:flex; align-items:center; justify-content:center; gap:7px; padding:13px;
  font-size:13px; font-weight:600; letter-spacing:-.005em; text-align:center;
  color:var(--ae-aqua); background:var(--ae-tint); border:1px solid var(--ae-line-soft); border-top:1px solid var(--ae-line-soft);
  border-radius:0 0 var(--ae-r-md) var(--ae-r-md); transition:background-color .18s ease,color .18s ease; }
.ae-card-add::before { content:"+"; font-size:15px; line-height:1; }
.ae-card-add:hover { background:var(--ae-aqua-soft); }
.ae-card-add.is-added { background:var(--ae-aqua); color:#fff; }
.ae-card-add.is-added::before { content:"\2713"; }
.ae-card-shell:hover { transform:translateY(-4px); box-shadow:var(--ae-shadow); border-radius:var(--ae-r-md); transition:transform .2s,box-shadow .2s; }
/* Product shots are cut outs on a transparent background and only a few
   hundred pixels wide, so they sit on a light plate and are contained rather
   than cropped. object-fit cover would both stretch and crop them. */
.ae-card-art { display:grid; place-items:center; height:172px; padding:22px;
  background:radial-gradient(ellipse 72% 88% at 50% 112%,#12798f1f 0,transparent 72%),
             linear-gradient(166deg,#eef6f9 0%,#dceaf0 60%,#d3e4ec 100%); border-bottom:1px solid var(--ae-line); }
.ae-card-art img { display:block; width:auto; height:auto; max-width:100%; max-height:126px; object-fit:contain;
  filter:drop-shadow(0 12px 18px #0b3d4d26); transition:transform .32s ease; }
.ae-card-shell:hover .ae-card-art img { transform:scale(1.055); }
.ae-card-body { display:flex; flex-direction:column; gap:9px; padding:24px; height:100%; }
.ae-part { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11.5px; letter-spacing:.02em; color:var(--ae-aqua); }
.ae-spec { font-size:12px; letter-spacing:.03em; color:var(--ae-muted); }
.ae-card p { font-size:14px; margin:4px 0 0; }
.ae-card-action { margin-top:auto; padding-top:16px; font-size:13px; font-weight:600; color:var(--ae-aqua); }

/* Filters */
.ae-filters { display:flex; flex-wrap:wrap; gap:14px 18px; align-items:end; padding:20px 22px; background:var(--ae-surface); border:1px solid var(--ae-line); border-radius:var(--ae-r-md); margin-bottom:20px; }
.ae-filters label { display:flex; flex-direction:column; gap:6px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ae-muted); }
.ae-filters select { font:inherit; font-size:14px; text-transform:none; letter-spacing:0; padding:9px 11px; min-width:150px; color:var(--ae-text-strong); background:var(--ae-paper); border:1px solid var(--ae-line-strong); border-radius:var(--ae-r-sm); }
.ae-filters select:focus-visible,.ae-main a:focus-visible,.ae-main button:focus-visible { outline:2px solid var(--ae-aqua); outline-offset:3px; }
.ae-filter-clear { align-self:center; font-size:13px; font-weight:600; color:var(--ae-aqua); }
.ae-result-count { font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--ae-muted); margin:0 0 20px; }
.ae-empty { padding:36px; text-align:center; background:var(--ae-surface); border:1px dashed var(--ae-line-strong); border-radius:var(--ae-r-md); }
.ae-empty a { color:var(--ae-aqua); text-decoration:underline; text-underline-offset:3px; }

/* Product detail */
.ae-product-body { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,.85fr); gap:64px; align-items:start; }
.ae-product-art { display:grid; place-items:center; padding:46px; border-radius:var(--ae-r-md);
  background:radial-gradient(ellipse 60% 72% at 50% 106%,#12798f26 0,transparent 72%),
             linear-gradient(166deg,#eef6f9 0%,#d9e9f0 100%);
  border:1px solid var(--ae-line); margin-bottom:38px; }
.ae-product-art img { display:block; width:auto; max-width:min(100%,460px); height:auto; filter:drop-shadow(0 22px 34px #0b3d4d2b); }
.ae-prose { margin-bottom:34px; }
.ae-prose h2 { font-size:22px; margin-bottom:14px; }
.ae-prose p { font-size:16px; line-height:1.8; margin:0 0 14px; }
.ae-check { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; }
.ae-check li { position:relative; padding-left:26px; font-size:15px; color:var(--ae-text); }
.ae-check li::before { content:"✓"; position:absolute; left:0; color:var(--ae-aqua); }
.ae-specs { position:sticky; top:calc(var(--nav-height) + 24px); padding:30px; background:var(--ae-surface); border:1px solid var(--ae-line); border-radius:var(--ae-r-md); }
.ae-specs h2 { font-size:15px; letter-spacing:.12em; text-transform:uppercase; color:var(--ae-muted); margin-bottom:18px; }
.ae-specs dl { margin:0; display:flex; flex-direction:column; }
.ae-specs dl > div { display:grid; grid-template-columns:auto 1fr; gap:16px; padding:11px 0; border-top:1px solid var(--ae-line-soft); }
.ae-specs dl > div:first-child { border-top:0; }
.ae-specs dt { font-size:13px; color:var(--ae-muted); }
.ae-specs dd { margin:0; font-size:14px; text-align:right; color:var(--ae-text-strong); font-weight:500; }
.ae-specs-cta { display:inline-flex; width:100%; justify-content:center; margin-top:22px; }
.ae-specs-note { font-size:12.5px; line-height:1.6; color:var(--ae-muted); margin:14px 0 0; }

@media(max-width:1100px) {
  .ae-hero { grid-template-columns:1fr; gap:34px; min-height:0; }
  .ae-hero-art { justify-self:stretch; max-width:none; }
  .ae-hero-art img { aspect-ratio:16/10; max-height:330px; }
  .ae-facts { gap:18px; }
  .ae-product-body { grid-template-columns:1fr; gap:36px; }
  .ae-specs { position:static; }
  .ae-category-grid,.ae-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:809px) {
  .ae-section { padding-block:52px; }
  .ae-section-heading { display:block; }
  .ae-section-heading > p { margin-top:16px; }
  .ae-category-grid,.ae-product-grid { grid-template-columns:1fr; }
  .ae-filters select { min-width:0; width:100%; }
  .ae-filters label { flex:1 1 140px; }
}

/* The partner band. A dark section between two pale ones, which gives the page
   a rhythm it did not have and puts the strongest proof on a surface that can
   carry it. Full bleed because it is a block child of .ae-main, not a
   container. */
.ae-partners { position:relative; padding-block:86px; overflow:hidden;
  background:radial-gradient(ellipse 54% 60% at 82% 6%,#12798f40 0,transparent 66%),
             radial-gradient(ellipse 48% 54% at 6% 96%,#0d4a6b3d 0,transparent 70%),
             linear-gradient(168deg,#0a2130 0%,var(--ae-ink) 58%,#081d29 100%); }
.ae-partners .ae-section-heading { margin-bottom:44px; }
.ae-partners h2 { color:var(--ae-dark-strong); }
.ae-partners .eyebrow { color:var(--ae-aqua-bright); }
.ae-partners .ae-section-heading > p { color:var(--ae-dark); }
.ae-partner-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(246px,1fr)); gap:16px; }
.ae-partner { padding:26px 24px 24px; }
.ae-partner h3 { font-size:21px; }
.ae-partner { display:flex; flex-direction:column; gap:10px; padding:30px 28px 26px;
  background:#ffffff08; border:1px solid #ffffff1f; border-radius:var(--ae-r-md);
  transition:background-color .22s ease,border-color .22s ease; }
.ae-partner:hover { background:#ffffff0f; border-color:#7fd6ea4d; }
.ae-partners .ae-partner-line { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ae-aqua-bright); margin:0; }
.ae-partner h3 { color:var(--ae-dark-strong); font-size:23px; }
.ae-partners .ae-partner-badge { display:inline-flex; align-items:center; gap:7px; align-self:flex-start;
  margin:2px 0 4px; padding:6px 12px 6px 10px; border-radius:999px; font-size:12px; font-weight:600; letter-spacing:.01em;
  color:#062a33; background:linear-gradient(120deg,var(--ae-aqua-bright) 0%,#a8e6f4 100%); border:1px solid #ffffff40; }
.ae-partners .ae-partner-badge span { font-size:11px; line-height:1; }
.ae-partners .ae-partner-blurb { font-size:14.5px; line-height:1.68; color:var(--ae-dark-muted); margin:0; }
.ae-partner-marks { display:flex; flex-wrap:wrap; gap:7px; list-style:none; margin:14px 0 0; padding:0; }
.ae-partner-marks li { font-size:11.5px; letter-spacing:.04em; padding:5px 10px; border-radius:999px;
  color:var(--ae-dark); background:#ffffff0f; border:1px solid #ffffff1c; }

/* Book a call. Offered next to every quote action, so it has to hold its own
   beside a solid button without competing with it: an outline, not a fill. */
.ae-call { display:inline-flex; align-items:center; gap:12px; padding:11px 16px 11px 13px;
  border:1px solid var(--ae-line-strong); border-radius:999px; background:var(--ae-surface);
  color:var(--ae-text-strong); text-decoration:none;
  transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease,background-color .2s ease; }
.ae-call:hover { border-color:var(--ae-aqua); transform:translateY(-2px); box-shadow:0 10px 24px #0b3d4d1f; }
.ae-call-icon { display:grid; place-items:center; width:32px; height:32px; flex:none; border-radius:50%;
  background:var(--ae-aqua-soft); color:var(--ae-aqua); }
.ae-call-copy { display:flex; flex-direction:column; gap:2px; line-height:1.25; }
.ae-call-copy strong { font-size:14px; font-weight:600; letter-spacing:-.01em; }
.ae-call-copy small { font-size:11.5px; color:var(--ae-muted); }
.ae-call-go { font-size:13px; color:var(--ae-aqua); margin-left:2px; }
.ae-call-compact { padding:10px 15px 10px 12px; gap:10px; }
.ae-call-compact .ae-call-icon { width:26px; height:26px; }

.ae-call-on-dark { background:#ffffff0f; border-color:#ffffff2e; color:var(--ae-dark-strong); }
.ae-call-on-dark:hover { background:#ffffff1a; border-color:#7fd6ea66; box-shadow:0 12px 26px #0006; }
.ae-call-on-dark .ae-call-icon { background:#7fd6ea24; color:var(--ae-aqua-bright); }
.ae-call-on-dark .ae-call-copy small { color:var(--ae-dark-muted); }
.ae-call-on-dark .ae-call-go { color:var(--ae-aqua-bright); }

/* Manufacturer spotlight, on the category pages that are one partner's range.
   Dark, like the overview partner band, so the two read as the same idea. */
.ae-spotlight { position:relative; padding-block:66px; overflow:hidden; margin-bottom:6px;
  background:radial-gradient(ellipse 52% 62% at 84% 8%,#12798f40 0,transparent 66%),
             radial-gradient(ellipse 46% 52% at 8% 94%,#0d4a6b3d 0,transparent 70%),
             linear-gradient(166deg,#0a2130 0%,var(--ae-ink) 60%,#081d29 100%); }
.ae-spotlight-top { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; align-items:start; }
.ae-spotlight h2 { color:var(--ae-dark-strong); max-width:22ch; margin-bottom:16px; }
.ae-spotlight .eyebrow { color:var(--ae-aqua-bright); }
.ae-spotlight .ae-partner-badge { display:inline-flex; align-items:center; gap:7px; margin:2px 0 0;
  padding:6px 12px 6px 10px; border-radius:999px; font-size:12px; font-weight:600;
  color:#062a33; background:linear-gradient(120deg,var(--ae-aqua-bright) 0%,#a8e6f4 100%); border:1px solid #ffffff40; }
.ae-spotlight-logo { display:block; width:auto; height:42px; margin-bottom:20px; }
.ae-spotlight .ae-spotlight-blurb { font-size:15px; line-height:1.72; color:var(--ae-dark-muted); margin:0; max-width:56ch; }
.ae-spotlight-badge { display:flex; align-items:center; gap:16px; margin:22px 0 0; }
.ae-spotlight-badge img { flex:none; display:block; width:auto; height:74px; }
.ae-spotlight-badge figcaption { font-size:12.5px; line-height:1.6; color:var(--ae-dark-muted); max-width:30ch; }
.ae-spotlight-stats { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px; margin:44px 0 0;
  padding-top:30px; border-top:1px solid #ffffff1f; }
.ae-spotlight-stats dt { font-family:Manrope,Geist,sans-serif; font-size:clamp(20px,1.8vw,27px); font-weight:650;
  line-height:1; letter-spacing:-.035em; color:var(--ae-aqua-bright); margin-bottom:8px; }
.ae-spotlight-stats dd { margin:0; font-size:12px; line-height:1.5; color:var(--ae-dark-muted); }
.ae-spotlight-notes { list-style:none; margin:30px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px 28px; }
.ae-spotlight-notes li { position:relative; padding-left:15px; font-size:12.5px; line-height:1.6; color:var(--ae-dark-muted); max-width:52ch; }
.ae-spotlight-notes li::before { content:""; position:absolute; left:0; top:7px; width:5px; height:5px; border-radius:50%; background:var(--ae-aqua-bright); }
.ae-spotlight + .ae-section { padding-top:52px; }

/* Shoto's footprint map. The base image is the manufacturer's dot artwork
   recoloured to the section aqua; markers are positioned from the same deck. */
.ae-map { margin:40px 0 0; }
.ae-map-plot { position:relative; width:100%; aspect-ratio:900/450; }
.ae-map-base { display:block; width:100%; height:100%; object-fit:contain; opacity:.62; }
.ae-map-pin { position:absolute; display:flex; align-items:center; gap:7px; transform:translate(-3px,-50%); white-space:nowrap; }
.ae-map-pin.is-flipped { flex-direction:row-reverse; transform:translate(calc(-100% + 3px),-50%); }
.ae-map-dot { flex:none; width:7px; height:7px; border-radius:50%; background:#6f8fa0; box-shadow:0 0 0 3px #0a213066; }
.ae-map-dot.is-hub,.ae-map-pin.is-hub .ae-map-dot { width:9px; height:9px; background:var(--ae-aqua-bright); box-shadow:0 0 0 4px #7fd6ea24; }
.ae-map-label { font-size:11px; letter-spacing:.01em; line-height:1; color:var(--ae-dark-muted); text-shadow:0 1px 3px #06161fcc; }
.ae-map-pin.is-hub .ae-map-label { color:var(--ae-dark-strong); font-weight:600; }
.ae-map figcaption { display:flex; flex-wrap:wrap; align-items:center; gap:10px 24px; margin-top:16px;
  padding-top:16px; border-top:1px solid #ffffff14; }
.ae-map-key { display:inline-flex; align-items:center; gap:9px; font-size:11.5px; color:var(--ae-dark-muted); }
.ae-map-key .ae-map-dot { position:static; box-shadow:none; }
.ae-map-names { display:none; font-size:11.5px; line-height:1.7; color:var(--ae-dark-muted); }

/* Under a tablet the labels overlap, so the map keeps its markers and the
   names move to a single readable line below it. */
@media(max-width:900px) {
  .ae-map-label { display:none; }
  .ae-map-names { display:block; flex-basis:100%; }
  .ae-map-base { opacity:.5; }
}

/* Compatibility. The answer to the first question anyone asks about a third
   party optic, so it sits above the grid rather than in a footnote. Dark,
   because it is a claim the page is making rather than a listing. */
.ae-coding { position:relative; padding-block:74px; overflow:hidden; margin-bottom:6px;
  background:radial-gradient(ellipse 54% 64% at 12% 6%,#12798f38 0,transparent 66%),
             linear-gradient(168deg,#0a2130 0%,var(--ae-ink) 62%,#081d29 100%); }
.ae-coding .eyebrow { color:var(--ae-aqua-bright); }
.ae-coding h2 { color:var(--ae-dark-strong); margin-bottom:18px; }
.ae-coding-copy { max-width:66ch; }
.ae-coding-copy p { font-size:15.5px; line-height:1.72; color:var(--ae-dark-muted); margin:0 0 14px; }
.ae-coding-support { padding-left:16px; border-left:2px solid var(--ae-aqua-bright); }
.ae-coding-support strong { color:var(--ae-dark-strong); font-weight:600; }
.ae-coding .ae-coding-ask { color:var(--ae-dark); font-weight:500; }

/* Same marquee as the parent site's logo row, with wordmarks in place of
   images. Pauses on hover and on focus so it can be read. */
.ae-coding-marquee { margin-top:32px; overflow:hidden; padding:6px 0;
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); }
.ae-coding-track { display:flex; width:max-content; animation:tf-logo-scroll 54s linear infinite; }
.ae-coding-group { display:flex; align-items:center; gap:12px; list-style:none; margin:0; padding:0 12px 0 0; flex-shrink:0; }
.ae-coding-group li { flex-shrink:0; padding:11px 22px; border-radius:999px; white-space:nowrap;
  font-size:14.5px; font-weight:600; letter-spacing:-.01em; color:var(--ae-dark-strong);
  background:#ffffff0f; border:1px solid #ffffff21; }
.ae-coding-marquee:hover .ae-coding-track,
.ae-coding-marquee:focus-within .ae-coding-track { animation-play-state:paused; }
.ae-coding-marquee:focus-visible { outline:2px solid var(--ae-aqua-bright); outline-offset:4px; border-radius:6px; }
.ae-coding-note { margin:26px 0 0; font-size:11.5px; line-height:1.65; color:#7f9aa8; max-width:92ch; }

/* On a product page it sits inside the main column, so it loses the full bleed
   band and becomes a panel. */
.ae-coding-compact { padding:30px 30px 26px; margin:0 0 34px; border-radius:var(--ae-r-md); }
.ae-coding-compact h2 { font-size:22px; margin-bottom:14px; }
.ae-coding-compact .ae-coding-copy p { font-size:14.5px; }
.ae-coding-compact .ae-coding-marquee { margin-top:24px; }
.ae-coding-compact .ae-coding-group li { font-size:13px; padding:9px 17px; }
.ae-coding-compact .ae-coding-note { font-size:11px; margin-top:20px; }

@media(prefers-reduced-motion:reduce) { .ae-coding-track { animation:none; } }
@media(max-width:809px) { .ae-coding { padding-block:52px; } .ae-coding-compact { padding:24px 22px 22px; } }

/* The closing ask. A panel rather than a band, so the page finishes on the
   paper surface it has been using and the footer still reads as separate. */
.ae-cta-band { padding-block:86px; }
.ae-cta { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:40px; align-items:center;
  padding:56px 60px; border-radius:var(--ae-r-lg); overflow:hidden;
  border:1px solid #bcdde6;
  background:radial-gradient(ellipse 64% 130% at 96% 50%,#12798f1c 0,transparent 66%),
             linear-gradient(112deg,#ecf6f8 0%,#e0eff3 58%,#d9ecf1 100%); }
.ae-cta h2 { margin-bottom:12px; }
.ae-cta p { font-size:16px; color:var(--ae-text-lead); max-width:44ch; margin:0; }
.ae-cta-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }

.ae-card-ask { background:linear-gradient(168deg,#f2f9fb 0%,#e6f2f6 100%); border-style:dashed; border-color:var(--ae-line-strong); }
.ae-card-ask .ae-card-body { justify-content:center; gap:10px; }
.ae-card-ask h3 { font-size:19px; }

/* The list badge in the header. Hidden until something is on the list. */
.ae-basket { display:inline-flex; align-items:center; gap:7px; padding:8px 12px 8px 10px; border-radius:999px;
  border:1px solid var(--ae-line-strong); color:var(--ae-text-strong); font-size:13px; font-weight:600; }
.ae-basket[hidden] { display:none; }
.ae-basket-icon { display:grid; place-items:center; color:var(--ae-aqua); }
.ae-basket:hover { border-color:var(--ae-aqua); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-basket { border-color:#ffffff33; color:var(--ae-dark-strong); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-basket-icon { color:var(--ae-aqua-bright); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-basket:hover { border-color:var(--ae-aqua-bright); background:#ffffff14; }

/* Booking in the header bar. Outlined so it reads as the secondary action
   beside the solid quote button. */
.ae-nav-call { display:inline-flex; align-items:center; gap:8px; padding:9px 14px 9px 11px; border-radius:999px;
  border:1px solid var(--ae-line-strong); color:var(--ae-text-strong); font-size:13px; font-weight:600; white-space:nowrap; }
.ae-nav-call-icon { display:grid; place-items:center; color:var(--ae-aqua); }
.ae-nav-call:hover { border-color:var(--ae-aqua); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-nav-call { border-color:#ffffff33; color:var(--ae-dark-strong); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-nav-call-icon { color:var(--ae-aqua-bright); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-nav-call:hover { border-color:var(--ae-aqua-bright); background:#ffffff14; }
/* Four controls plus the navigation is a lot of bar. The label goes first. */
@media(max-width:1280px) {
  .ae-nav-call-label { display:none; }
  .ae-nav-call { padding:9px 11px; }
}
@media(max-width:1100px) { .ae-nav-call { display:none; } }

/* The quote page. Three inputs and the list, nothing else. */
.ae-honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.ae-quote-form { max-width:640px; display:flex; flex-direction:column; gap:26px; }
.ae-quote-items h2 { font-size:19px; margin:0 0 14px; }
.ae-quote-lines { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.ae-quote-lines li { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:14px;
  padding:14px 16px; background:var(--ae-surface); border:1px solid var(--ae-line-soft); border-radius:var(--ae-r-sm); }
.ae-quote-line-copy { display:flex; flex-direction:column; gap:3px; min-width:0; }
.ae-quote-line-copy strong { font-size:14.5px; font-weight:600; line-height:1.3; color:var(--ae-text-strong); }
.ae-quote-qty { display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ae-muted); }
.ae-quote-qty input { width:74px; font:inherit; font-size:14px; letter-spacing:0; text-transform:none; padding:8px 10px;
  color:var(--ae-text-strong); background:var(--ae-paper); border:1px solid var(--ae-line-strong); border-radius:8px; }
.ae-quote-remove { width:30px; height:30px; border:0; border-radius:50%; cursor:pointer; font-size:17px; line-height:1;
  color:var(--ae-muted); background:var(--ae-tint); transition:color .18s ease,background-color .18s ease; }
.ae-quote-remove:hover { color:#a3323b; background:#f6dfe1; }
.ae-quote-empty { padding:22px; text-align:center; font-size:14px; background:var(--ae-surface);
  border:1px dashed var(--ae-line-strong); border-radius:var(--ae-r-sm); }
.ae-quote-empty a { color:var(--ae-aqua); text-decoration:underline; text-underline-offset:3px; }
.ae-quote-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.ae-quote-form label { display:flex; flex-direction:column; gap:7px; font-size:13px; font-weight:600; color:var(--ae-text-strong); }
.ae-quote-form input:not([type=checkbox]):not([type=number]),.ae-quote-form textarea {
  font:inherit; font-size:15px; font-weight:400; padding:12px 14px; color:var(--ae-text-strong);
  background:var(--ae-surface); border:1px solid var(--ae-line-strong); border-radius:var(--ae-r-sm); }
.ae-quote-form input:focus,.ae-quote-form textarea:focus { outline:0; border-color:var(--ae-aqua); box-shadow:0 0 0 3px #12798f1f; }
.ae-quote-consent { flex-direction:row !important; align-items:flex-start; gap:11px; font-weight:400; font-size:13.5px; color:var(--ae-text); }
.ae-quote-consent input { margin-top:3px; accent-color:var(--ae-aqua); }
.ae-quote-form .button { align-self:flex-start; }
.ae-quote-small { font-size:12px; line-height:1.6; color:var(--ae-muted); margin:0; }
.ae-quote-small a { color:var(--ae-aqua); text-decoration:underline; text-underline-offset:3px; }
.ae-quote-done { max-width:56ch; }
.ae-quote-done h2 { font-size:clamp(25px,2.6vw,36px); margin-bottom:14px; }
.ae-specs-quote { display:block; margin-top:12px; font-size:13px; font-weight:600; color:var(--ae-aqua); text-align:center; }
.ae-specs-quote:hover { text-decoration:underline; text-underline-offset:4px; }
.ae-specs .ae-call { margin-top:16px; width:100%; justify-content:flex-start; }
@media(max-width:560px) {
  .ae-quote-fields { grid-template-columns:1fr; }
  .ae-quote-lines li { grid-template-columns:minmax(0,1fr) auto; }
  .ae-quote-remove { grid-column:2; }
}

/* Catalogue search. Aimed at the part number, so the field is wide and the
   placeholder says so. A plain GET form, linkable and script free. */
.ae-search { display:flex; align-items:center; gap:10px; max-width:560px; margin:0 0 20px;
  padding:6px 6px 6px 16px; background:var(--ae-surface); border:1px solid var(--ae-line-strong);
  border-radius:999px; transition:border-color .18s ease,box-shadow .18s ease; }
.ae-search:focus-within { border-color:var(--ae-aqua); box-shadow:0 0 0 3px #12798f1f; }
.ae-search-icon { display:grid; place-items:center; flex:none; color:var(--ae-muted); }
.ae-search input { flex:1 1 auto; min-width:0; font:inherit; font-size:15px; padding:9px 0;
  color:var(--ae-text-strong); background:none; border:0; outline:none; }
.ae-search input::placeholder { color:var(--ae-muted); }
.ae-search input::-webkit-search-cancel-button { filter:grayscale(1); }
.ae-search button { flex:none; font:inherit; font-size:13.5px; font-weight:600; cursor:pointer;
  padding:10px 20px; border:0; border-radius:999px; color:#fff; background:var(--ae-aqua);
  transition:background-color .18s ease; }
.ae-search button:hover { background:#0e6375; }

/* On the dark hero the field inverts. */
.ae-search-on-dark { margin-top:30px; background:#ffffff12; border-color:#ffffff2e; }
.ae-search-on-dark:focus-within { border-color:var(--ae-aqua-bright); box-shadow:0 0 0 3px #7fd6ea24; }
.ae-search-on-dark .ae-search-icon { color:var(--ae-dark-muted); }
.ae-search-on-dark input { color:var(--ae-dark-strong); }
.ae-search-on-dark input::placeholder { color:var(--ae-dark-muted); }
.ae-search-on-dark button { background:var(--ae-aqua-bright); color:#062a33; }
.ae-search-on-dark button:hover { background:#a8e6f4; }
@media(max-width:560px) { .ae-search button { padding:10px 14px; } }

/* Product type chips. The primary way into a category with several kinds of
   part in it: a dropdown hides what is available, these show it. */
.ae-types { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.ae-type { display:inline-flex; align-items:center; gap:8px; padding:9px 14px; border-radius:999px;
  font-size:13.5px; font-weight:600; letter-spacing:-.005em; color:var(--ae-text-strong);
  background:var(--ae-surface); border:1px solid var(--ae-line);
  transition:border-color .16s ease,background-color .16s ease,color .16s ease; }
.ae-type span { font-size:11.5px; font-weight:600; padding:2px 7px; border-radius:999px;
  color:var(--ae-muted); background:var(--ae-tint); }
.ae-type:hover { border-color:var(--ae-aqua); }
.ae-type.is-on { background:var(--ae-aqua); border-color:var(--ae-aqua); color:#fff; }
.ae-type.is-on span { color:var(--ae-ink); background:var(--ae-aqua-bright); }
@media(max-width:560px) {
  .ae-types { flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; margin-inline:-4px; padding-inline:4px; }
  .ae-type { flex:none; }
}

/* Filters. Native selects keep the keyboard and mobile behaviour; only the
   chrome around them changes. */
.ae-filters { background:linear-gradient(168deg,#fff 0%,#f4fafb 100%); box-shadow:0 1px 2px #0b3d4d0a; }
.ae-filters select { appearance:none; padding-right:32px; background-color:#fff; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='m3 4.5 3 3 3-3' stroke='%2312798f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 11px center;
  transition:border-color .18s ease,box-shadow .18s ease; }
.ae-filters select:hover { border-color:var(--ae-aqua); }
.ae-filters select:focus { border-color:var(--ae-aqua); box-shadow:0 0 0 3px #12798f1f; }

/* Three stacked single column lists read as one long grey run, so the shorter
   ones pair up once there is width for it. */
@media(min-width:900px) { .ae-check { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px 28px; } }

@media(max-width:1100px) {
  .ae-partner-grid { grid-template-columns:1fr; }
  .ae-spotlight-top { grid-template-columns:1fr; gap:28px; }
  .ae-spotlight-stats { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
}
@media(max-width:560px) { .ae-spotlight-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:809px) {
  .ae-partners { padding-block:56px; }
  .ae-cta-band { padding-block:52px; }
  .ae-cta { grid-template-columns:1fr; gap:28px; padding:34px 26px; }
  .ae-category-art { height:160px; }
}

/* Section chrome. The header is light over the dark hero and the footer is the
   division's own, carrying the catalogue rather than the software blog. */
.tf-aerless .ae-site-header { background:transparent; border-bottom:1px solid transparent; box-shadow:none; transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease; }
.tf-aerless .ae-site-header.is-scrolled,.tf-aerless .ae-site-header.is-open { background:#fff; border-bottom-color:var(--ae-line); box-shadow:0 8px 26px #0b3d4d14; }
.tf-aerless .ae-site-header .nav-inner { width:min(100% - 64px,1440px); gap:22px; }
.tf-aerless .ae-site-header .nav-links { gap:10px; }
.tf-aerless .ae-site-header .nav-links > li > a { font-size:14px; padding:10px 9px; }
.tf-aerless .ae-site-header .ae-parent-link { border-left:1px solid var(--ae-line); padding-left:12px; margin-left:4px; }
/* At rest the bar sits on the dark hero, so its text is light. Once .is-scrolled
   turns it white the defaults apply again, which is why every rule is gated. */
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .brand-name,
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .brand-descriptor { color:#eafaff; }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .brand-mark::before { background:var(--ae-aqua-bright); }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .nav-links > li > a { color:#cfe9f1; }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .nav-links > li > a[aria-current=page] { color:#eafaff; background:#ffffff1a; }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .nav-links > li > a:hover { color:#fff; background:#ffffff16; }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .ae-parent-link { border-left-color:#ffffff24; }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .nav-toggle { color:#eafaff; }
.tf-aerless .ae-site-header .nav-links > li > a[aria-current=page] { color:var(--ae-aqua); background:#12798f10; border-radius:8px; }
/* The products dropdown. Same two panel shape as the software site's Services
   menu, but the preview leads with a photograph of the part rather than an
   icon, because this buyer recognises the hardware on sight. */
.tf-aerless .ae-site-header .nav-links .ae-products-menu { width:788px; grid-template-columns:minmax(0,286px) minmax(0,1fr); gap:10px; padding:12px; background:#fff; border-color:var(--ae-line); }
.tf-aerless .ae-site-header .nav-links .ae-products-menu:not([hidden]) { display:grid; }
.ae-menu-list { display:flex; flex-direction:column; gap:2px; list-style:none; margin:0; padding:0; }
.ae-menu-list li { min-width:0; }
.ae-products-menu .ae-menu-choice { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:13px;
  padding:11px 12px; border-radius:var(--ae-r-sm); color:var(--ae-text-strong); white-space:normal;
  transition:background-color .18s ease; }
.ae-products-menu .ae-menu-choice:hover,.ae-products-menu .ae-menu-choice.is-previewed,
.ae-products-menu .ae-menu-choice[aria-current=page] { background:var(--ae-aqua-soft); }
.ae-products-menu .ae-menu-choice:hover,.ae-products-menu .ae-menu-choice:focus-visible,
.ae-products-menu .ae-menu-choice.is-previewed,
.ae-products-menu .ae-menu-choice[aria-current=page] { color:var(--ae-text-strong); }
.ae-menu-thumb { display:grid; place-items:center; height:44px; border-radius:8px; overflow:hidden;
  background:linear-gradient(166deg,#edf5f8 0%,#dae9ef 100%); border:1px solid var(--ae-line); }
.ae-menu-thumb img { display:block; width:auto; height:auto; max-width:38px; max-height:32px; object-fit:contain; }
.ae-menu-copy strong { display:block; font-size:14px; font-weight:600; letter-spacing:-.01em; line-height:1.3; }
.ae-menu-copy small { display:block; margin-top:3px; font-size:11.5px; font-weight:400; color:var(--ae-muted); }
.ae-menu-arrow { font-size:13px; color:var(--ae-aqua); opacity:0; transition:opacity .18s ease,transform .18s ease; }
.ae-products-menu .ae-menu-choice:hover .ae-menu-arrow,.ae-products-menu .ae-menu-choice.is-previewed .ae-menu-arrow { opacity:1; transform:translateX(2px); }
.ae-menu-details { display:grid; }
.ae-menu-preview { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,116px); gap:16px; align-items:center;
  padding:24px 26px; border-radius:var(--ae-r-md);
  background:radial-gradient(ellipse 70% 90% at 96% 50%,#12798f14 0,transparent 70%),
             linear-gradient(150deg,#f7fbfc 0%,#eaf4f7 100%); }
.ae-menu-preview[hidden] { display:none; }
.ae-menu-preview h2 { font-size:21px; line-height:1.22; margin:7px 0 13px; max-width:18ch; }
.ae-menu-highlights { list-style:none; margin:0 0 18px; padding:0; display:flex; flex-direction:column; gap:7px; }
.ae-menu-highlights li { position:relative; padding-left:15px; font-size:13px; color:var(--ae-text); }
.ae-menu-highlights li::before { content:""; position:absolute; left:0; top:7px; width:5px; height:5px; border-radius:50%; background:var(--ae-aqua); }
.ae-products-menu .ae-menu-link { display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:var(--ae-aqua); }
.ae-products-menu .ae-menu-link:hover { text-decoration:underline; text-underline-offset:4px; }
.ae-menu-preview-art { display:grid; place-items:center; }
.ae-menu-preview-art img { display:block; width:auto; height:auto; max-width:100%; max-height:104px; object-fit:contain;
  filter:drop-shadow(0 14px 20px #0b3d4d2b); }
/* On the dark hero the bar is light, and site.js only adds .is-open on the
   mobile nav, so the toggle needs the same gating as the other links. */
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .solutions-toggle { color:#cfe9f1; }
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .solutions-toggle:hover,
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .solutions-toggle[aria-expanded=true],
.tf-aerless .ae-site-header:not(.is-scrolled):not(.is-open) .solutions-toggle.is-current { color:#fff; background:#ffffff16; }
.tf-aerless .ae-site-header .solutions-toggle:hover,
.tf-aerless .ae-site-header .solutions-toggle[aria-expanded=true],
.tf-aerless .ae-site-header .solutions-toggle.is-current { color:var(--ae-aqua); background:#12798f10; }

@media(max-width:1100px) {
  .tf-aerless .ae-site-header .nav-links .ae-products-menu { width:100%; grid-template-columns:1fr; }
  .ae-menu-details { display:none; }
}

.ae-site-footer .footer-brand h3 { display:flex; align-items:center; gap:11px; }
.ae-site-footer .footer-brand h3 .brand-mark { width:36px; height:34px; filter:none; }
.ae-site-footer .footer-brand h3 .brand-mark::before { width:141px; height:34px; background:var(--ae-aqua-bright); mask-size:141px 34px; -webkit-mask-size:141px 34px; }

/* The presence block is shared with the main footer, where the eyebrow is the
   corporate blue. In this division it takes the Aerless aqua. */
.ae-site-footer .presence-heading .eyebrow { color:var(--ae-aqua-bright); }


/* The primary button. `.button` is the corporate blue from site.css and Aerless
   never overrode it, so every Request a quote in this section, in the bar, the
   hero, the closing band, the product pages and the quote page, was the other
   division's colour on an aqua page. The contact page's hardware card had a
   one-off patch for the same reason; this is the rule that should have existed. */
.tf-aerless .button { background:var(--ae-aqua); }
.tf-aerless .button:hover,.tf-aerless .button:focus-visible { background:#0e6375; opacity:1; }

/* The Shoto page. A manufacturer destination rather than a category, so it
   leans on supply terms and certification, the two things a buyer of this
   equipment actually decides on. */
.sh-lead { max-width:58ch; }
.sh-hero-logo { margin-top:26px; }
.sh-supply { padding-bottom:10px; }
.sh-supply-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.sh-supply-grid > div { padding:26px 28px; border-radius:var(--ae-r-md); border:1px solid var(--ae-line);
  background:linear-gradient(168deg,#fff 0%,#f4fafb 100%); }
.sh-supply-grid strong { display:block; font-family:Manrope,Geist,sans-serif; font-size:23px; font-weight:600;
  letter-spacing:-.03em; color:var(--ae-aqua); margin-bottom:10px; }
.sh-supply-grid span { display:block; font-size:14.5px; line-height:1.65; color:var(--ae-muted); }
.sh-supply-note { margin:22px 0 0; font-size:15px; line-height:1.7; color:var(--ae-text-lead); max-width:74ch; }

.sh-proof { padding-block:64px 10px; }
.sh-certs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; list-style:none; margin:0; padding:0; }
.sh-certs li { padding:22px 24px; border-radius:var(--ae-r-sm); background:var(--ae-surface); border:1px solid var(--ae-line); }
.sh-certs strong { display:block; font-size:15px; font-weight:650; color:var(--ae-text-strong); margin-bottom:6px; }
.sh-certs span { display:block; font-size:13.5px; line-height:1.6; color:var(--ae-muted); }
.sh-proof-note { margin:24px 0 0; font-size:14.5px; line-height:1.7; color:var(--ae-muted); max-width:78ch; }

@media(max-width:900px) {
  .sh-supply-grid,.sh-certs { grid-template-columns:1fr; }
  .sh-supply-grid > div { padding:22px; }
}

/* The header is sticky, so a fragment landing would tuck the first line of the
   controls underneath it. Leave it room. */
#catalogue { scroll-margin-top:96px; }

/* Apply is the path for a reader without script, where changing a select can no
   longer submit on its own. With script the selects filter as they change, so
   the button would be a second way to do what already happened. site.js marks
   the document when its navigation script runs, which is a reliable signal that
   scripts are alive. */
.ae-filter-go { align-self:center; font:inherit; font-size:13px; font-weight:600; cursor:pointer;
  padding:9px 16px; border-radius:999px; border:1px solid var(--ae-line-strong);
  background:#fff; color:var(--ae-text-strong); }
.ae-filter-go:hover { border-color:var(--ae-aqua); }
.has-nav-js .ae-filter-go { display:none; }
/* While a filter is being fetched, dim the results rather than blanking them. */
#catalogue[aria-busy="true"] .ae-product-grid { opacity:.45; transition:opacity .12s ease; }
