/* ============================================================
   ALUBOS SITE DESIGN SYSTEM
   ------------------------------------------------------------
   Approved on the pilot (homepage TR/EN + Louver / Shading) and
   rolled out to every public page. Every rule is scoped under
   body.alx. Pages that load this file load no other stylesheet.

   Design system
   - Type: Archivo (variable, one family). Display set slightly
     condensed (font-stretch 88-92%), body at normal width.
     Tabular figures for codes, weights and section numbers.
   - Colour: cool mineral neutrals (one grey family) and graphite.
     Brand orange #D4622A is a mark colour: focus ring, active
     rule, small indicators. As text it darkens to #A9461A (AA).
   - Shape: radius 0 everywhere. No shadows, except the profile
     dialog and the nav dropdown, where elevation is real.
   - Grid: 12 columns, max 1320px, 24px gutter (16px mobile),
     side padding clamp(16px, 4vw, 56px).
   - Spacing: 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 / 128.
   - Motion: 160-240ms, cubic-bezier(.2,.7,.2,1). One load moment
     per page (hero image / hero drawing reveal). Nothing loops.
     prefers-reduced-motion switches all of it off.
   ============================================================ */

/* Archivo, self-hosted (SIL OFL 1.1, fonts/OFL.txt). The same variable
   files Google Fonts serves (v25: wdth 62-125, wght 100-900), so pages make
   no font request to a third party. latin-ext carries ğ, ş, İ. */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(/fonts/archivo-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(/fonts/archivo-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.alx {
  --paper: #F6F7F7;
  --white: #FFFFFF;
  --panel: #ECEEEE;
  --panel-2: #E2E5E5;
  --rule: #D2D6D7;
  --ink: #1C1F22;
  --ink-2: #4A5157;
  --ink-3: #626A70;
  --accent: #D4622A;
  --accent-ink: #A9461A;
  --graphite: #1C1F22;

  --max: 1320px;
  --pad: clamp(1rem, 4vw, 3.5rem);
  --gap: 1.5rem;
  --sec: clamp(4.5rem, 8vw, 7.5rem);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --font: 'Archivo', 'Helvetica Neue', Arial, sans-serif;

  /* aliases read by js/product-modal.js and js/cookie-consent.js markup */
  --bg-primary: var(--white);
  --bg-border: var(--rule);
  --text-primary: var(--ink);
  --text-secondary: var(--ink-2);
  --text-muted: var(--ink-3);
  --font-display: var(--font);
  --font-body: var(--font);
}

/* ---------- reset ---------- */
.alx *, .alx *::before, .alx *::after { box-sizing: border-box; margin: 0; padding: 0; }
html:has(body.alx) { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 88px; }
body.alx {
  margin: 0;
  font-family: var(--font);
  font-size: 1.0625rem;
  line-height: 1.6;
  font-weight: 400;
  color: var(--ink-2);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
  min-width: 320px;
}
.alx img, .alx svg { display: block; max-width: 100%; }
.alx a { color: inherit; text-decoration: none; }
.alx ul, .alx ol { list-style: none; }
.alx button, .alx input, .alx select { font: inherit; color: inherit; }
.alx :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.alx h1, .alx h2, .alx h3, .alx h4 { color: var(--ink); font-weight: 600; text-wrap: balance; }
.alx p { text-wrap: pretty; }
.alx strong { color: var(--ink); font-weight: 600; }
.alx .vh {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.alx .skip-link {
  position: absolute; left: 1rem; top: -100px; z-index: 1300;
  background: var(--ink); color: var(--white); padding: .75rem 1rem; font-weight: 600;
}
.alx .skip-link:focus { top: 1rem; }

/* ---------- layout primitives ---------- */
.alx .wrap { width: 100%; max-width: calc(var(--max) + 2 * var(--pad)); margin-inline: auto; padding-inline: var(--pad); }
.alx .grid12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }

/* ---------- type ---------- */
.alx .t-h1 {
  font-size: clamp(2.5rem, 1.35rem + 3.1vw, 4rem);
  line-height: 1.03; letter-spacing: -.022em; font-stretch: 88%; font-weight: 600;
}
.alx .t-h2 {
  font-size: clamp(1.75rem, 1.15rem + 1.55vw, 2.5rem);
  line-height: 1.08; letter-spacing: -.016em; font-stretch: 90%; font-weight: 600;
}
.alx .t-h3 { font-size: 1.25rem; line-height: 1.25; letter-spacing: -.005em; font-stretch: 96%; font-weight: 600; }
.alx .t-lead { font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); line-height: 1.55; color: var(--ink-2); max-width: 36em; }
.alx .t-body { max-width: 62ch; }
.alx .t-meta { font-size: .875rem; line-height: 1.45; color: var(--ink-3); }
.alx .t-num { font-variant-numeric: tabular-nums lining-nums; }
.alx .t-code { font-variant-numeric: tabular-nums lining-nums; font-weight: 650; letter-spacing: .01em; font-stretch: 96%; color: var(--ink); }

/* ---------- actions ---------- */
.alx .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  min-height: 3rem; padding: 0 1.375rem; border: 1px solid var(--ink);
  background: var(--ink); color: var(--white);
  font-size: .9375rem; font-weight: 600; line-height: 1; white-space: nowrap;
  cursor: pointer; transition: background-color .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease);
}
.alx .btn:hover { background: var(--accent-ink); border-color: var(--accent-ink); }
.alx .btn:active { transform: translateY(1px); }
.alx .btn--line { background: transparent; color: var(--ink); }
.alx .btn--line:hover { background: var(--ink); border-color: var(--ink); color: var(--white); }
.alx .btn svg { flex: none; }
.alx .btn small { font-size: .8125rem; font-weight: 450; opacity: .72; }
.alx .actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.alx .tlink {
  color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: .28em; text-decoration-color: var(--rule);
  transition: text-decoration-color .18s var(--ease);
}
.alx .tlink:hover { text-decoration-color: var(--accent); }

/* ============================================================
   HEADER (existing markup, restyled)
   ============================================================ */
.alx .navbar {
  position: sticky; top: 0; z-index: 1000;
  display: flex; align-items: center; gap: 2.5rem;
  height: 72px; padding-inline: var(--pad);
  background: var(--paper); border-bottom: 1px solid var(--rule);
}
.alx .navbar-brand img { height: 46px !important; width: auto; }
.alx .navbar-nav { flex: 1; }
.alx .navbar-nav > ul { display: flex; align-items: stretch; gap: .25rem; height: 72px; }
.alx .navbar-nav > ul > li { position: relative; display: flex; align-items: stretch; }
.alx .nav-link {
  position: relative; display: inline-flex; align-items: center; padding: 0 .875rem;
  font-size: .9375rem; font-weight: 500; color: var(--ink-2); transition: color .16s var(--ease);
}
.alx .nav-link:hover, .alx .nav-link.active, .alx .nav-link[aria-current="page"] { color: var(--ink); }
.alx .navbar-nav .nav-link::after {
  content: ""; position: absolute; left: .875rem; right: .875rem; bottom: -1px; height: 2px;
  background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .2s var(--ease);
}
.alx .navbar-nav .nav-link.active::after, .alx .navbar-nav .nav-link[aria-current="page"]::after { transform: scaleX(1); }
.alx .nav-item--dropdown > .nav-link { padding-right: 1.75rem; }
.alx .nav-item--dropdown > .nav-link::before {
  content: ""; position: absolute; right: .9rem; top: 50%; width: 6px; height: 6px; margin-top: -5px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg);
}
.alx .nav-dropdown {
  position: absolute; top: 100%; left: 0; z-index: 1001; min-width: 290px;
  background: var(--white); border: 1px solid var(--rule); box-shadow: 0 18px 40px rgba(28, 31, 34, .10);
  opacity: 0; visibility: hidden; transform: translateY(4px);
  transition: opacity .16s var(--ease), transform .16s var(--ease), visibility 0s linear .16s;
}
.alx .nav-item--dropdown:hover .nav-dropdown,
.alx .nav-item--dropdown:focus-within .nav-dropdown {
  opacity: 1; visibility: visible; transform: none; transition-delay: 0s;
}
.alx .nav-dropdown ul { width: auto !important; padding: .5rem !important; }
.alx .nav-dropdown-item, .alx .nav-dropdown-group-btn {
  display: flex !important; align-items: center; justify-content: space-between; width: 100%;
  padding: .55rem .75rem !important; border-radius: 0 !important; border: 0; background: none;
  font-size: .9375rem !important; font-weight: 500 !important; color: var(--ink-2) !important; text-align: left; cursor: pointer;
}
.alx .nav-dropdown-item:hover, .alx .nav-dropdown-group-btn:hover { background: var(--panel); color: var(--ink) !important; }
.alx .nav-dropdown-group-items { display: none; padding-left: .75rem; border-left: 1px solid var(--rule); margin: .125rem 0 .375rem .75rem; }
.alx .nav-dropdown-group.open .nav-dropdown-group-items { display: block; }
.alx .nav-dropdown-group .dd-arrow { transition: transform .18s var(--ease); }
.alx .nav-dropdown-group.open .dd-arrow { transform: rotate(180deg); }
.alx .nav-dropdown li[style*="border-top"] { border-top-color: var(--rule) !important; }
.alx .nav-dropdown-all { color: var(--ink) !important; font-weight: 600 !important; }
.alx .navbar-actions { display: flex; align-items: center; gap: .5rem; margin-left: auto; }
.alx .navbar-actions .nav-link { padding: 0 .5rem; height: 40px; font-weight: 600; font-size: .875rem; }
/* language menu of the locale pages (/de/, /fr/, /it/, /es/: build_locale_pages.py) */
.alx .lang-menu { position: relative; display: flex; align-items: center; }
.alx .lang-menu > button.nav-link { background: none; border: 0; cursor: pointer; font-family: inherit; padding-right: 1.6rem; }
.alx .lang-menu > .nav-link::before { right: .6rem; }
.alx .lang-menu .nav-dropdown { left: auto; right: 0; min-width: 11rem; }
.alx .lang-menu .nav-dropdown ul { list-style: none; margin: 0; }
.alx .lang-menu .nav-dropdown-item[aria-current] { color: var(--ink) !important; font-weight: 600 !important; box-shadow: inset 2px 0 0 var(--accent); }
.alx .mobile-menu-footer .lang-h { font-size: .875rem; color: var(--ink-3); margin-bottom: .5rem; }
.alx .lang-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.alx .lang-list a { display: flex; align-items: center; justify-content: center; min-height: 48px; border: 1px solid var(--rule); font-weight: 600; color: var(--ink); }
.alx .lang-list a[aria-current] { border-color: var(--ink); }
.alx .hamburger {
  display: none; width: 44px; height: 44px; border: 1px solid var(--rule); background: transparent; cursor: pointer;
  flex-direction: column; align-items: center; justify-content: center; gap: 5px;
}
.alx .hamburger span { display: block; width: 18px; height: 1.5px; background: var(--ink); transition: transform .2s var(--ease), opacity .2s; }
.alx .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.alx .hamburger.open span:nth-child(2) { opacity: 0; }
.alx .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* mobile menu */
.alx .mobile-menu {
  position: fixed; inset: 0; z-index: 1100; display: flex; flex-direction: column;
  background: var(--paper); overflow-y: auto; overscroll-behavior: contain;
  transform: translateX(100%); visibility: hidden;
  transition: transform .28s var(--ease), visibility 0s linear .28s;
}
.alx .mobile-menu.open { transform: none; visibility: visible; transition-delay: 0s; }
.alx .mobile-menu-header {
  display: flex; align-items: center; justify-content: space-between; height: 72px; flex: none;
  padding-inline: var(--pad); border-bottom: 1px solid var(--rule);
}
.alx .mobile-menu-header img { height: 36px !important; width: auto; }
.alx .mobile-menu-close {
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--rule); background: transparent; color: var(--ink); cursor: pointer;
}
.alx .mobile-menu nav { padding: .5rem var(--pad) 1.5rem; }
.alx .mobile-nav-link {
  display: flex; align-items: center; min-height: 56px; border-bottom: 1px solid var(--rule);
  font-size: 1.375rem; font-weight: 600; font-stretch: 92%; color: var(--ink);
}
.alx .mobile-nav-link.active { box-shadow: inset 3px 0 0 var(--accent); padding-left: .875rem; }
.alx .mobile-submenu ul { padding: .5rem 0 .75rem; border-bottom: 1px solid var(--rule); columns: 2 14rem; column-gap: 1.5rem; }
.alx .mobile-submenu a {
  display: block; padding: .4rem 0; font-size: 1rem; color: var(--ink-2); break-inside: avoid;
}
.alx .mobile-submenu a:hover { color: var(--ink); }
.alx .mobile-menu-footer { margin-top: auto; padding: 1rem var(--pad) 1.5rem; }
.alx .mobile-menu-footer .btn-outline {
  display: flex; align-items: center; justify-content: center; min-height: 48px;
  border: 1px solid var(--ink); font-weight: 600; color: var(--ink);
}
.alx .mobile-overlay { display: none; }

/* ============================================================
   FOOTER (existing markup, restyled)
   ============================================================ */
.alx .site-footer { background: var(--graphite); color: #B9BFC3; font-size: .9375rem; }
.alx .site-footer__inner { max-width: calc(var(--max) + 2 * var(--pad)); margin-inline: auto; padding: 4.5rem var(--pad) 3rem; }
.alx .site-footer__grid { display: grid; grid-template-columns: 2fr 1.4fr 1fr 1fr; gap: 2rem 1.5rem; }
.alx .site-footer__brand-desc { margin-top: 1.25rem; max-width: 30ch; color: #B9BFC3; }
.alx .site-footer__col-heading { display: block; margin-bottom: 1rem; color: #FFFFFF; font-weight: 600; font-size: .9375rem; }
.alx .site-footer__links li + li { margin-top: .45rem; }
.alx .site-footer__links a, .alx .site-footer__bottom-links a { color: #B9BFC3; transition: color .16s var(--ease); }
.alx .site-footer__links a:hover, .alx .site-footer__bottom-links a:hover { color: #FFFFFF; }
.alx .site-footer__grid > div:nth-child(2) .site-footer__links { columns: 2 11rem; column-gap: 1.5rem; }
.alx .site-footer__grid > div:nth-child(2) .site-footer__links li { break-inside: avoid; margin: 0 0 .45rem; }
.alx .site-footer__bottom {
  max-width: calc(var(--max) + 2 * var(--pad)); margin-inline: auto; padding: 1.5rem var(--pad) 2rem;
  display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; font-size: .875rem; position: relative;
}
.alx .site-footer__bottom::before { content: ""; position: absolute; top: 0; left: var(--pad); right: var(--pad); border-top: 1px solid #353A3F; }
.alx .site-footer__brand-logo img { height: 44px !important; width: auto; }
.alx .site-footer__copyright { margin-right: auto; color: #9AA1A6; }
.alx .site-footer__bottom-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.alx .site-footer__bottom > .site-footer__brand-logo { display: none; }

/* ============================================================
   COOKIE BANNER (js/cookie-consent.js markup)
   ============================================================ */
.alx #cookie-consent-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1150;
  background: var(--white); border-top: 1px solid var(--ink); color: var(--ink-2);
  transform: translateY(100%); opacity: 0; transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.alx #cookie-consent-banner.ccb--visible { transform: none; opacity: 1; }
.alx .ccb-inner { max-width: calc(var(--max) + 2 * var(--pad)); margin: 0 auto; padding: 1.125rem var(--pad); display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; }
.alx .ccb-text { flex: 1 1 320px; }
.alx .ccb-title { color: var(--ink); font-weight: 600; margin-bottom: .125rem; }
.alx .ccb-body { font-size: .9375rem; }
.alx .ccb-link { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.alx .ccb-actions { display: flex; gap: .75rem; flex-wrap: wrap; }
.alx .ccb-btn { min-height: 44px; padding: 0 1.25rem; border: 1px solid var(--ink); font-weight: 600; font-size: .9375rem; cursor: pointer; }
.alx .ccb-btn--primary { background: var(--ink); color: var(--white); }
.alx .ccb-btn--secondary { background: transparent; color: var(--ink); }
@media (max-width: 640px) { .alx .ccb-actions { width: 100%; } .alx .ccb-btn { flex: 1; } }
/* per-category settings: only rendered when Google Analytics is configured */
.alx .ccb-prefs { display: grid; gap: .5rem; margin-top: .75rem; }
.alx .ccb-prefs[hidden] { display: none; }
.alx .ccb-opt { display: flex; gap: .625rem; align-items: flex-start; font-size: .9375rem; cursor: pointer; }
.alx .ccb-opt input { width: 18px; height: 18px; margin-top: .125rem; flex: none; accent-color: var(--ink); }
.alx .ccb-opt input:disabled + span { opacity: .75; }
.alx .ccb-opt strong { color: var(--ink); font-weight: 600; }

/* ============================================================
   SHARED SECTION PIECES
   ============================================================ */
.alx .sec { padding-block: var(--sec) calc(var(--sec) + 1rem); }
.alx .sec-head { display: grid; gap: 1rem; margin-bottom: clamp(2.5rem, 4vw, 3.5rem); max-width: 46rem; }
.alx .band { background: var(--panel); }
/* catalogue drawings carry a white ground: multiply lets them sit on any mineral surface */
.alx .dwg { mix-blend-mode: multiply; }

/* definition rows of real facts (no counters, no animation) */
.alx .facts { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); border-top: 1px solid var(--ink); }
.alx .facts > div { padding: .875rem 1.25rem .25rem 0; }
.alx .facts > div + div { padding-left: 1.25rem; border-left: 1px solid var(--rule); }
.alx .facts dt { font-size: .875rem; color: var(--ink-3); }
.alx .facts dd { margin-top: .25rem; font-size: 1.25rem; font-weight: 600; font-stretch: 94%; color: var(--ink); font-variant-numeric: tabular-nums lining-nums; line-height: 1.25; }
.alx .facts dd small { font-size: .9375rem; font-weight: 500; color: var(--ink-2); }

/* ============================================================
   HOMEPAGE
   ============================================================ */
/* --- opening --- */
.alx .h-hero { padding-top: clamp(2.5rem, 5.5vw, 5rem); }
.alx .h-hero .grid12 { align-items: stretch; }
.alx .h-hero-text { grid-column: 1 / 7; display: flex; flex-direction: column; padding-bottom: clamp(2.5rem, 4vw, 4rem); }
.alx .h-hero-text .t-h1 { max-width: 13em; }
.alx .h-hero-text .t-lead { margin-top: 1.5rem; max-width: 31em; }
.alx .h-hero-text .actions { margin-top: 2.25rem; }
.alx .h-hero-text .facts { margin-top: auto; padding-top: 0; }
.alx .h-hero-text .facts-wrap { margin-top: auto; padding-top: 3rem; }
.alx .h-hero-media { grid-column: 7 / 13; position: relative; min-height: 560px; overflow: hidden; background: var(--panel-2); }
.alx .h-hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% 50%; }

/* --- sections drawn from the catalogue --- */
.alx .h-strip { background: var(--panel); border-top: 1px solid var(--rule); }
.alx .h-strip-list {
  display: flex; gap: clamp(1.5rem, 2.4vw, 2.75rem); justify-content: space-between; align-items: flex-end;
  overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: var(--rule) transparent;
  padding: 2.75rem 0 1.75rem;
}
.alx .h-strip-list li { flex: none; scroll-snap-align: start; }
.alx .h-strip-list a { display: grid; gap: .875rem; }
.alx .h-strip-list img { height: 120px; width: auto; max-width: none; transition: transform .24s var(--ease); }
.alx .h-strip-list a:hover img { transform: translateY(-3px); }
.alx .h-strip-list .cap { display: grid; max-width: 9rem; gap: .125rem; border-top: 1px solid var(--rule); padding-top: .625rem; }
.alx .h-strip-list .cap b { font-size: .9375rem; }
.alx .h-strip-list a:hover .cap b { color: var(--accent-ink); }

/* --- product range --- */
.alx .h-plates { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); }
.alx .h-plate { background: var(--panel); display: flex; flex-direction: column; }
.alx .h-plate--std { grid-column: 1 / 8; }
.alx .h-plate--rail { grid-column: 8 / 13; }
.alx .h-plate-fig { display: block; padding: 1.5rem 1.5rem 0; }
.alx .h-plate-fig img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; }
.alx .h-plate-body { padding: 1.25rem 1.75rem 1.75rem; display: grid; gap: .5rem; }
.alx .h-plate-body .t-h3 a:hover { color: var(--accent-ink); }
.alx .h-sub { margin-top: .75rem; display: grid; grid-template-columns: 1fr 1fr; column-gap: 1.75rem; border-top: 1px solid var(--rule); }
.alx .h-plate--rail .h-sub { grid-template-columns: 1fr; }
.alx .h-sub a {
  display: grid; grid-template-columns: 3rem 1fr auto; align-items: baseline; gap: .5rem;
  padding: .625rem 0; border-bottom: 1px solid var(--rule); color: var(--ink); font-weight: 500;
}
.alx .h-sub a:hover span:nth-child(2) { text-decoration: underline; text-underline-offset: .25em; text-decoration-color: var(--accent); }
.alx .h-sub .no, .alx .h-sub .ct { font-size: .875rem; color: var(--ink-3); font-weight: 400; font-variant-numeric: tabular-nums; }

.alx .h-index { margin-top: clamp(3.5rem, 6vw, 5rem); }
.alx .h-index-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ink); }
.alx .h-index-list { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(2rem, 4vw, 4rem); }
.alx .h-index-list a {
  display: grid; grid-template-columns: 2.75rem 5.5rem 1fr 1.25rem; align-items: center; gap: 1rem;
  min-height: 5.5rem; padding: .5rem .5rem .5rem 0; border-bottom: 1px solid var(--rule);
  transition: background-color .18s var(--ease);
}
.alx .h-index-list a:hover { background: var(--panel); }
.alx .h-index-list .no { font-size: .9375rem; color: var(--ink-3); font-variant-numeric: tabular-nums; padding-left: .25rem; }
.alx .h-index-list .th { height: 4rem; display: flex; align-items: center; justify-content: center; }
.alx .h-index-list .th img { max-height: 4rem; max-width: 5.5rem; width: auto; height: auto; }
.alx .h-index-list .nm { display: grid; gap: .1rem; }
.alx .h-index-list .nm b { color: var(--ink); font-weight: 600; font-size: 1.0625rem; }
.alx .h-index-list .nm span { font-size: .875rem; color: var(--ink-3); }
.alx .h-index-list .ar { color: var(--ink-3); transition: transform .2s var(--ease), color .2s var(--ease); }
.alx .h-index-list a:hover .ar { transform: translateX(3px); color: var(--ink); }
.alx .h-index-foot { margin-top: 1.75rem; }

/* --- catalogue --- */
.alx .h-cat .grid12 { align-items: center; row-gap: 2.5rem; }
.alx .h-cat-cover { grid-column: 2 / 5; position: relative; }
.alx .h-cat-cover a { display: block; position: relative; }
.alx .h-cat-cover img { width: 100%; height: auto; aspect-ratio: 496 / 702; box-shadow: 0 1px 0 var(--rule), 18px 18px 0 var(--panel-2); transition: transform .3s var(--ease); }
.alx .h-cat-cover a:hover img { transform: translate(-4px, -4px); }
.alx .h-cat-text { grid-column: 7 / 12; display: grid; gap: 1.25rem; }
.alx .h-cat-text .facts { margin-top: .75rem; }
.alx .h-cat-text .actions { margin-top: .75rem; }

/* --- plant --- */
.alx .h-plant-top { row-gap: 2.5rem; }
.alx .h-plant-intro { grid-column: 1 / 6; display: grid; gap: 1.25rem; align-content: start; }
.alx .h-caps { grid-column: 7 / 13; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; }
.alx .h-caps li { border-top: 1px solid var(--ink); padding-top: 1rem; display: grid; gap: .375rem; align-content: start; }
.alx .h-caps p { font-size: .9375rem; }
.alx .h-film {
  margin-top: clamp(3.5rem, 6vw, 5rem); display: grid; grid-auto-flow: column; grid-auto-columns: minmax(17rem, 22rem);
  gap: var(--gap); overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: 1rem;
  scrollbar-width: thin; scrollbar-color: var(--rule) transparent;
}
.alx .h-film li { scroll-snap-align: start; }
.alx .h-film img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; background: var(--panel-2); filter: saturate(.82); }
.alx .h-film figcaption { display: flex; gap: .75rem; padding-top: .75rem; color: var(--ink); font-weight: 500; font-size: .9375rem; }
.alx .h-film figcaption span { color: var(--ink-3); font-weight: 400; font-variant-numeric: tabular-nums; }

/* --- process --- */
.alx .h-steps-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--gap); counter-reset: step; }
.alx .h-steps-list li { border-top: 1px solid var(--ink); padding-top: 1rem; display: grid; gap: .5rem; align-content: start; }
.alx .h-steps-list .n { font-size: .9375rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.alx .h-steps-list p { font-size: .9375rem; }

/* --- contact --- */
.alx .h-contact { border-top: 1px solid var(--rule); }
.alx .h-contact .grid12 { row-gap: 2rem; align-items: end; }
.alx .h-contact-text { grid-column: 1 / 7; display: grid; gap: 1rem; }
.alx .h-contact-side { grid-column: 8 / 13; display: grid; gap: 1.5rem; }
.alx .h-contact-side dl { display: grid; grid-template-columns: auto 1fr; gap: .5rem 1.5rem; border-top: 1px solid var(--ink); padding-top: 1rem; }
.alx .h-contact-side dt { color: var(--ink-3); font-size: .9375rem; }
.alx .h-contact-side dd a { color: var(--ink); font-weight: 600; }
.alx .h-contact-side dd a:hover { color: var(--accent-ink); }

/* ============================================================
   PRODUCT PAGE (Louver / Shading pilot)
   ============================================================ */
.alx .p-path { border-bottom: 1px solid var(--rule); }
.alx .p-path .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem 2rem; padding-block: .875rem; font-size: .875rem; color: var(--ink-3); }
.alx .p-path ol { display: flex; flex-wrap: wrap; gap: .5rem; }
.alx .p-path li + li::before { content: "/"; margin-right: .5rem; color: var(--rule); }
.alx .p-path a { color: var(--ink-2); }
.alx .p-path a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: .25em; }
.alx .p-path [aria-current] { color: var(--ink); }

.alx .p-hero { padding-top: clamp(2.5rem, 5vw, 4.5rem); }
.alx .p-hero .grid12 { align-items: stretch; row-gap: 2.5rem; }
.alx .p-hero-text { grid-column: 1 / 8; display: flex; flex-direction: column; gap: 1.5rem; padding-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.alx .p-hero-text .sec-no { font-size: .9375rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.alx .p-hero-text .sec-no b { color: var(--ink); font-weight: 600; }
.alx .p-hero-text .t-h1 { font-size: clamp(2.75rem, 1.5rem + 3.6vw, 4.5rem); }
.alx .p-hero-text .facts { --n: 4; margin-top: auto; }
.alx .p-hero-text .facts-wrap { margin-top: auto; padding-top: 1.5rem; }
.alx .p-hero-fig {
  grid-column: 8 / 13; position: relative; margin: 0; background: var(--panel);
  display: grid; grid-template-rows: 1fr auto; min-height: 540px;
}
.alx .p-hero-fig .stage { position: relative; display: flex; align-items: center; justify-content: center; padding: 2.5rem 2rem 1rem; }
.alx .p-hero-fig .stage img { height: min(440px, 52vh); width: auto; max-width: 100%; object-fit: contain; }
.alx .p-hero-fig figcaption { display: flex; justify-content: space-between; gap: 1rem; padding: .875rem 1.25rem; border-top: 1px solid var(--rule); font-size: .875rem; color: var(--ink-3); }
.alx .p-hero-fig figcaption b { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }

/* profile index */
.alx .p-index { padding-top: clamp(3.5rem, 6vw, 5.5rem); }
.alx .p-index-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1.5rem 2rem; padding-bottom: 1.25rem; }
.alx .p-index-head .t-h2 { display: flex; align-items: baseline; gap: .75rem; }
.alx .p-index-head .t-h2 small { font-size: 1rem; font-weight: 500; color: var(--ink-3); font-stretch: 100%; letter-spacing: 0; }
.alx .p-tools { display: flex; flex-wrap: wrap; align-items: end; gap: .75rem 1rem; }
.alx .p-field { display: grid; gap: .375rem; }
.alx .p-field label, .alx .p-field .lbl { font-size: .8125rem; color: var(--ink-3); }
.alx .p-search { position: relative; }
.alx .p-search svg { position: absolute; left: .875rem; top: 50%; transform: translateY(-50%); color: var(--ink-3); pointer-events: none; }
.alx .p-search input, .alx .p-field select {
  height: 44px; border: 1px solid var(--rule); background: var(--white); color: var(--ink); border-radius: 0;
  font-size: .9375rem; transition: border-color .16s var(--ease);
}
.alx .p-search input { width: 15.5rem; padding: 0 .875rem 0 2.5rem; font-variant-numeric: tabular-nums; }
.alx .p-search input::placeholder { color: var(--ink-3); }
.alx .p-field select {
  padding: 0 2.25rem 0 .875rem; appearance: none; cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
  background-position: calc(100% - 17px) 50%, calc(100% - 12px) 50%; background-size: 5px 5px; background-repeat: no-repeat;
}
.alx .p-search input:hover, .alx .p-field select:hover { border-color: var(--ink-3); }
.alx .p-search input:focus, .alx .p-field select:focus { outline: 2px solid var(--accent); outline-offset: -1px; border-color: var(--accent); }
.alx .p-view { display: inline-flex; border: 1px solid var(--rule); height: 44px; background: var(--white); }
.alx .p-view button { min-width: 44px; padding: 0 .875rem; border: 0; background: transparent; color: var(--ink-2); cursor: pointer; display: inline-flex; align-items: center; gap: .5rem; font-size: .9375rem; }
.alx .p-view button + button { border-left: 1px solid var(--rule); }
.alx .p-view button[aria-pressed="true"] { background: var(--ink); color: var(--white); }
.alx .p-status { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-top: 1px solid var(--ink); font-size: .875rem; color: var(--ink-3); }

/* gallery: plate grid, cells divided by 1px rules */
.alx .pp-gallery {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px;
  background: var(--rule); border: 1px solid var(--rule);
}
.alx .pp-gcard {
  position: relative; display: grid; grid-template-rows: auto 1fr; background: var(--paper); cursor: pointer;
  transition: background-color .18s var(--ease); outline-offset: -2px;
}
.alx .pp-gcard:hover { background: var(--white); }
.alx .pp-gcard:focus-visible { outline: 2px solid var(--accent); }
.alx .pp-gcard-head { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; padding: .875rem 1rem 0; }
.alx .pp-gcard-no { font-size: 1.0625rem; font-weight: 650; letter-spacing: .01em; color: var(--ink); font-variant-numeric: tabular-nums lining-nums; font-stretch: 96%; white-space: nowrap; }
.alx .pp-gcard-wt { font-size: .875rem; color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.alx .pp-gcard-img { display: flex; align-items: center; justify-content: center; height: 15.5rem; padding: 1rem 1rem 2.25rem; }
.alx .pp-gcard-img img { max-height: 100%; max-width: 100%; width: auto; height: auto; mix-blend-mode: multiply; transition: transform .24s var(--ease); }
.alx .pp-gcard:hover .pp-gcard-img img { transform: scale(1.025); }
.alx .pp-gcard::after {
  content: attr(data-open); position: absolute; left: 1rem; bottom: .75rem; font-size: .8125rem; color: var(--ink-3);
  display: inline-flex; align-items: center; gap: .375rem; transition: color .18s var(--ease);
}
.alx .pp-gcard:hover::after, .alx .pp-gcard:focus-visible::after { color: var(--ink); text-decoration: underline; text-underline-offset: .25em; text-decoration-color: var(--accent); }

/* list view: same cards, rendered as rows */
.alx .pp-gallery.is-list { grid-template-columns: 1fr; }
.alx .pp-gallery.is-list .pp-gcard { grid-template-columns: 6rem 1fr auto; grid-template-rows: none; align-items: center; min-height: 4.75rem; }
.alx .pp-gallery.is-list .pp-gcard-img { order: -1; height: 4.75rem; padding: .375rem .75rem; border-right: 1px solid var(--rule); }
.alx .pp-gallery.is-list .pp-gcard-head { padding: 0 1.25rem; justify-content: flex-start; gap: 2rem; }
.alx .pp-gallery.is-list .pp-gcard-no { min-width: 7.5rem; }
.alx .pp-gallery.is-list .pp-gcard-wt { color: var(--ink-2); font-size: .9375rem; }
.alx .pp-gallery.is-list .pp-gcard::after { position: static; padding-right: 1.25rem; }

.alx .pp-empty { display: none; padding: 3rem 1rem; text-align: center; color: var(--ink-2); border: 1px solid var(--rule); border-top: 0; background: var(--paper); }
.alx .pp-empty button { margin-left: .5rem; }
.alx .pp-tablenote { margin-top: 1.25rem; max-width: 62ch; font-size: .875rem; color: var(--ink-3); padding-left: .875rem; border-left: 2px solid var(--accent); }

/* catalogue section */
.alx .p-cat { margin-top: var(--sec); }
.alx .p-cat .grid12 { align-items: center; row-gap: 2.5rem; padding-block: clamp(3rem, 6vw, 5rem); }
.alx .p-cat-pages { grid-column: 1 / 7; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.alx .p-cat-pages a { display: grid; gap: .5rem; font-size: .8125rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.alx .p-cat-pages img { width: 100%; height: auto; aspect-ratio: 496 / 702; border: 1px solid var(--rule); background: var(--white); transition: transform .24s var(--ease); }
.alx .p-cat-pages a:hover img { transform: translateY(-3px); }
.alx .p-cat-text { grid-column: 8 / 13; display: grid; gap: 1.25rem; }
.alx .p-cat-text .facts { --n: 2; }

/* quote */
.alx .p-quote .grid12 { row-gap: 2rem; align-items: end; padding-block: var(--sec); }
.alx .p-quote-text { grid-column: 1 / 8; display: grid; gap: 1rem; }
.alx .p-quote .actions { grid-column: 9 / 13; justify-content: flex-end; }

/* related */
.alx .p-rel { border-top: 1px solid var(--rule); padding-block: var(--sec) calc(var(--sec) + 1rem); }
.alx .p-rel-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 1rem 2rem; margin-bottom: 2rem; }
.alx .p-rel-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.alx .p-rel-list a { display: grid; grid-template-rows: auto auto 1fr; gap: .375rem; height: 100%; }
.alx .p-rel-list .fig { background: var(--panel); padding: 1.25rem; margin-bottom: .875rem; transition: background-color .2s var(--ease); }
.alx .p-rel-list .fig img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; }
.alx .p-rel-list a:hover .fig { background: var(--panel-2); }
.alx .p-rel-list .no { font-size: .875rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.alx .p-rel-list b { color: var(--ink); font-weight: 600; font-size: 1.125rem; }
.alx .p-rel-list a:hover b { text-decoration: underline; text-underline-offset: .25em; text-decoration-color: var(--accent); }
.alx .p-rel-list p { font-size: .9375rem; }

/* profile dialog (js/product-modal.js), restyled for the pilot */
.alx .ppm-overlay { background: rgba(28, 31, 34, .56); }
.alx .ppm-dialog { border-radius: 0; width: min(920px, 100%); max-height: min(90vh, 680px); box-shadow: 0 30px 80px rgba(28, 31, 34, .28); }
.alx .ppm-head { background: var(--white); border-bottom: 1px solid var(--rule); padding: 1rem 1.25rem 1rem 1.5rem; }
.alx .ppm-head-title { color: var(--ink); font-size: 1.375rem; font-weight: 650; font-variant-numeric: tabular-nums; }
.alx .ppm-head-title small { color: var(--ink-3); font-size: .875rem; font-weight: 500; letter-spacing: 0; text-transform: none; margin-bottom: .125rem; }
.alx .ppm-close { border-radius: 0; background: transparent; color: var(--ink); border: 1px solid var(--rule); width: 44px; height: 44px; }
.alx .ppm-close:hover { background: var(--panel); }
.alx .ppm-fig { background: var(--panel); padding: 2rem; }
.alx .ppm-fig img { mix-blend-mode: multiply; max-height: 420px; }
.alx .ppm-info { border-left: 1px solid var(--rule); padding: 1.5rem; }
.alx .ppm-specs { border-radius: 0; border: 0; border-top: 1px solid var(--ink); }
.alx .ppm-spec { border-color: var(--rule) !important; padding: .75rem .875rem .75rem 0; }
.alx .ppm-spec:nth-child(even) { padding-left: .875rem; }
.alx .ppm-spec small { text-transform: none; letter-spacing: 0; font-size: .8125rem; color: var(--ink-3); }
.alx .ppm-spec b { font-size: 1rem; font-variant-numeric: tabular-nums; }
.alx .ppm-hi li::before { border-radius: 0; width: 6px; height: 6px; background: var(--accent); margin-top: .55em; }
.alx .ppm-foot .btn { width: auto; }
@media (max-width: 720px) {
  .alx .ppm-info { border-left: 0; border-top: 1px solid var(--rule); }
  .alx .ppm-fig img { max-height: 240px; }
}

/* ============================================================
   LOAD MOMENT (one per page)
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  .alx .h-hero-media img { animation: alx-wipe 1.1s var(--ease) .1s both; }
  .alx .p-hero-fig .stage img { animation: alx-plot 1.2s var(--ease) .15s both; }
}
@keyframes alx-wipe { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0 0 0 0); } }
@keyframes alx-plot { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@media (prefers-reduced-motion: reduce) {
  .alx *, .alx *::before, .alx *::after { transition-duration: .01ms !important; animation: none !important; scroll-behavior: auto !important; }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1180px) {
  .alx .pp-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .alx .h-index-list a { grid-template-columns: 2.5rem 4.5rem 1fr 1.25rem; }
  .alx .h-index-list .th img { max-width: 4.5rem; }
}
@media (max-width: 1080px) {
  .alx .navbar { gap: 1.5rem; }
  .alx .nav-link { padding: 0 .625rem; }
  .alx .navbar-nav .nav-link::after { left: .625rem; right: .625rem; }
  .alx .h-steps-list { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 2.5rem; }
  .alx .h-plate--std, .alx .h-plate--rail { grid-column: 1 / -1; }
  .alx .h-plate--rail { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
  .alx .h-plate--rail .h-plate-fig { padding: 1.5rem; }
}
@media (max-width: 960px) {
  .alx .navbar-nav { display: none; }
  .alx .hamburger { display: inline-flex; }
  .alx .h-hero-text, .alx .h-hero-media, .alx .p-hero-text, .alx .p-hero-fig,
  .alx .h-cat-text, .alx .h-plant-intro, .alx .h-caps, .alx .h-contact-text, .alx .h-contact-side,
  .alx .p-cat-pages, .alx .p-cat-text, .alx .p-quote-text, .alx .p-quote .actions { grid-column: 1 / -1; }
  .alx .h-hero-text { padding-bottom: 2.5rem; }
  .alx .h-hero-text .facts-wrap { padding-top: 2.5rem; }
  .alx .h-hero-media { min-height: 0; aspect-ratio: 16 / 9; }
  .alx .h-cat-cover { grid-column: 1 / 6; }
  .alx .h-cat-text { grid-column: 6 / 13; }
  .alx .p-hero-text { padding-bottom: 0; }
  .alx .p-hero-fig { min-height: 0; }
  .alx .p-hero-fig .stage img { height: 360px; }
  .alx .p-quote .actions { justify-content: flex-start; }
  .alx .site-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 820px) {
  .alx .pp-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alx .h-index-list { grid-template-columns: 1fr; }
  .alx .p-rel-list { grid-template-columns: 1fr 1fr; }
  .alx .p-rel-list li:last-child { display: none; }
}
@media (max-width: 680px) {
  .alx { --gap: 1rem; }
  body.alx { font-size: 1rem; }
  .alx .navbar { height: 64px; }
  .alx .navbar-brand img { height: 34px !important; }
  html:has(body.alx) { scroll-padding-top: 76px; }
  .alx .h-hero-media { aspect-ratio: 4 / 3; margin-inline: calc(var(--pad) * -1); }
  .alx .facts > div { padding-right: .75rem; }
  .alx .facts > div + div { padding-left: .75rem; }
  .alx .h-strip-list img { height: 104px; }
  .alx .h-strip-list { justify-content: flex-start; padding-top: 2rem; }
  .alx .h-sub { grid-template-columns: 1fr; }
  .alx .h-plate--rail { display: flex; }
  .alx .h-plate-body { padding: 1.125rem 1.25rem 1.5rem; }
  .alx .h-plate-fig { padding: 1rem 1rem 0; }
  .alx .h-index-list a { grid-template-columns: 2.25rem 4rem 1fr 1rem; gap: .75rem; min-height: 4.75rem; }
  .alx .h-index-list .th { height: 3.25rem; }
  .alx .h-index-list .th img { max-height: 3.25rem; max-width: 4rem; }
  .alx .h-cat-cover { grid-column: 1 / 8; }
  .alx .h-cat-text { grid-column: 1 / -1; }
  .alx .h-caps { grid-template-columns: 1fr; gap: 1.5rem; }
  .alx .h-film { grid-auto-columns: 78vw; margin-inline: calc(var(--pad) * -1); padding-inline: var(--pad); scroll-padding-inline: var(--pad); }
  .alx .h-steps-list { grid-template-columns: 1fr; row-gap: 0; }
  .alx .h-steps-list li { grid-template-columns: 2rem 1fr; column-gap: .75rem; padding: 1rem 0 1.25rem; border-top-color: var(--rule); }
  .alx .h-steps-list li:first-child { border-top-color: var(--ink); }
  .alx .h-steps-list li > * { grid-column: 2; }
  .alx .h-steps-list .n { grid-column: 1; grid-row: 1; }
  .alx .site-footer__grid { grid-template-columns: 1fr; }
  .alx .site-footer__inner { padding-top: 3.5rem; }

  .alx .p-path .wrap > span { display: none; }
  .alx .p-hero-fig { margin-inline: calc(var(--pad) * -1); }
  .alx .p-hero-fig .stage img { height: 300px; }
  .alx .p-tools { width: 100%; }
  .alx .p-field--search { flex: 1 1 100%; }
  .alx .p-search input { width: 100%; }
  .alx .p-field--sort { flex: 1; }
  .alx .p-field--sort select { width: 100%; }
  .alx .pp-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-inline: calc(var(--pad) * -1); border-inline: 0; }
  .alx .pp-gcard-head { flex-direction: column; gap: 0; padding: .75rem .875rem 0; }
  .alx .pp-gcard-img { height: 12.5rem; padding: .75rem .75rem 2rem; }
  .alx .pp-gcard::after { left: .875rem; }
  .alx .pp-gallery.is-list .pp-gcard { grid-template-columns: 4.5rem 1fr auto; }
  .alx .pp-gallery.is-list .pp-gcard-head { flex-direction: row; gap: 1rem; padding: 0 .875rem; }
  .alx .pp-gallery.is-list .pp-gcard-no { min-width: 0; }
  .alx .pp-gallery.is-list .pp-gcard::after { content: none; }
  .alx .p-cat-pages { gap: .5rem; }
  .alx .p-rel-list { grid-template-columns: 1fr; }
  .alx .p-rel-list li:last-child { display: block; }
}
@media (max-width: 400px) {
  .alx .pp-gcard-no { font-size: 1rem; }
  .alx .p-view .lbl-txt { display: none; }
}

/* plate figures: rows of real drawings at one height */
.alx .h-keys, .alx .h-rails { display: grid; align-items: end; gap: 1rem; padding: 2rem 1.75rem .5rem; }
.alx .h-keys { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.alx .h-rails { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.alx .h-keys img { width: 100%; height: auto; aspect-ratio: 330 / 214; }
.alx .h-rails img { height: 132px; width: auto; max-width: 100%; margin-inline: auto; object-fit: contain; }
.alx .h-plate--rail .h-plate-body { margin-top: auto; }
.alx .h-plate--std .h-plate-body { margin-top: auto; }
@media (max-width: 680px) {
  .alx .h-keys { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 1.25rem 1.25rem 0; }
  .alx .h-rails { padding: 1.25rem 1.25rem 0; }
  .alx .h-rails img { height: 96px; }
}

/* product hero facts: weight range needs the widest column */
.alx .p-hero-text .facts { grid-template-columns: .8fr 1.6fr 1fr 1fr; }
@media (max-width: 820px) { .alx .p-hero-text .facts { grid-template-columns: 1fr 1fr; } }
/* card affordance appears on pointer hover / keyboard focus; always shown on touch */
@media (hover: hover) {
  .alx .pp-gallery:not(.is-list) .pp-gcard::after { opacity: 0; transition: opacity .18s var(--ease), color .18s var(--ease); }
  .alx .pp-gallery:not(.is-list) .pp-gcard:hover::after, .alx .pp-gallery:not(.is-list) .pp-gcard:focus-visible::after { opacity: 1; }
}
@media (max-width: 820px) {
  .alx .p-hero-text .facts > div { margin-top: 0; border-top: 0; padding: .875rem 1rem .5rem 0; border-left: 0; }
  .alx .p-hero-text .facts > div:nth-child(even) { padding-left: 1rem; border-left: 1px solid var(--rule); }
  .alx .p-hero-text .facts > div:nth-child(n+3) { border-top: 1px solid var(--rule); }
}
@media (max-width: 680px) {
  .alx .h-hero-text .facts-wrap { padding-top: 1.75rem; }
}
@media (max-width: 960px) {
  .alx .h-strip-list, .alx .h-film { -webkit-mask-image: linear-gradient(to right, #000 82%, transparent); mask-image: linear-gradient(to right, #000 82%, transparent); }
  /* the mask makes the strip list its own blend group, so .dwg multiply only sees
     what the list paints: give it the strip's grey or the drawings show white boxes */
  .alx .h-strip-list { background: var(--panel); }
}
@media (max-width: 680px) { .alx .facts dd { font-size: 1.125rem; } }
@media (max-width: 1180px) and (min-width: 961px) {
  .alx .h-hero-text { grid-column: 1 / 8; }
  .alx .h-hero-media { grid-column: 8 / 13; }
  .alx .h-hero-text .t-h1 { max-width: none; }
}
.alx .navbar-nav .nav-link:focus-visible { outline-offset: -6px; }
/* Turkish headline is ~25% longer than English: one step smaller so it stays at three lines */
html[lang="tr"] .alx .h-hero-text .t-h1 { font-size: clamp(2.25rem, 1.2rem + 2.6vw, 3.5rem); }


/* ============================================================
   ROLLOUT: PRODUCT PAGE EXTRAS
   ============================================================ */
.alx button.tlink { background: none; border: 0; padding: 0; cursor: pointer; font-size: .875rem; }
.alx .pp-empty button.tlink { margin-left: .5rem; font-size: inherit; }

/* facts row: any number of facts, widths follow content */
.alx .p-hero-text .facts { grid-template-columns: repeat(var(--n, 4), minmax(0, auto)); }
@media (max-width: 820px) { .alx .p-hero-text .facts { grid-template-columns: 1fr 1fr; } }

/* catalogue crops are 150 dpi: shown at a modest fixed height, never stretched to the stage */
.alx .p-hero-fig .stage--sm img { height: min(var(--h, 360px), 52vh); }
@media (max-width: 960px) { .alx .p-hero-fig .stage--sm img { height: min(var(--h, 360px), 320px); } }
@media (max-width: 680px) { .alx .p-hero-fig .stage--sm img { height: min(var(--h, 360px), 260px); } }

/* dimension key figure (table groups) */
.alx .p-hero-fig--key .stage img { height: auto; width: min(100%, 480px); }
.alx .p-hero-fig--key figcaption { display: grid; gap: .75rem; justify-content: stretch; }
.alx .p-key { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: .375rem 1.25rem; }
.alx .p-key > div { display: grid; grid-template-columns: 2rem 1fr; align-items: baseline; }
.alx .p-key dt { color: var(--accent-ink); font-weight: 700; font-size: 1rem; }
.alx .p-key dt.i { font-style: italic; }
.alx .p-key dd { color: var(--ink-2); }
@media (max-width: 960px) { .alx .p-hero-fig--key .stage img { width: min(100%, 420px); height: auto; } }

/* single-choice filter: square segments */
.alx .p-seg { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--rule); background: var(--white); }
.alx .p-seg button {
  min-height: 42px; padding: 0 .875rem; border: 0; background: transparent; color: var(--ink-2);
  font-size: .9375rem; cursor: pointer; white-space: nowrap; font-variant-numeric: tabular-nums;
  transition: background-color .16s var(--ease), color .16s var(--ease);
}
.alx .p-seg button + button { box-shadow: inset 1px 0 0 var(--rule); }
.alx .p-seg button:hover { color: var(--ink); background: var(--panel); }
.alx .p-seg button[aria-pressed="true"] { background: var(--ink); color: var(--white); }
.alx .p-seg button:focus-visible { outline-offset: -3px; }

/* dimension table */
.alx .p-table-wrap { border-top: 1px solid var(--ink); }
.alx .p-table { display: table; width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums lining-nums; font-size: .9375rem; }
.alx .p-table th { position: sticky; top: 72px; z-index: 2; background: var(--paper); border-bottom: 1px solid var(--ink); text-align: right; vertical-align: bottom; font-weight: 500; padding: 0; }
.alx .p-table th:first-child, .alx .p-table td:first-child { text-align: left; }
.alx .p-table th button {
  display: inline-flex; flex-direction: column; align-items: inherit; gap: .125rem; width: 100%;
  padding: .75rem .875rem .625rem; border: 0; background: none; cursor: pointer; color: var(--ink); text-align: inherit;
  position: relative;
}
.alx .p-table th:not(:first-child) button { align-items: flex-end; }
.alx .p-table th:first-child button { align-items: flex-start; padding-left: 0; }
.alx .p-table th .pp-dim { font-size: 1.0625rem; font-weight: 700; color: var(--accent-ink); text-transform: none; }
.alx .p-table th .pp-dim--i { font-style: italic; }
.alx .p-table th .nm { font-size: .9375rem; font-weight: 600; }
.alx .p-table th .u { font-size: .8125rem; color: var(--ink-3); font-weight: 400; white-space: nowrap; }
.alx .p-table th button:hover .u { color: var(--ink); }
.alx .p-table th i { position: absolute; bottom: 0; left: .875rem; right: .875rem; height: 2px; background: var(--accent); transform: scaleX(0); transition: transform .18s var(--ease); }
.alx .p-table th:first-child i { left: 0; }
.alx .p-table th[aria-sort="ascending"] i, .alx .p-table th[aria-sort="descending"] i { transform: scaleX(1); }
.alx .p-table th[aria-sort="descending"] .u::after { content: " ↓"; }
.alx .p-table th[aria-sort="ascending"] .u::after { content: " ↑"; }
.alx .p-table th:first-child[aria-sort="descending"] .nm::after { content: " ↓"; }
.alx .p-table th:first-child[aria-sort="ascending"] .nm::after { content: " ↑"; }
.alx .p-table td { padding: .5rem .875rem; border-bottom: 1px solid var(--rule); text-align: right; color: var(--ink-2); }
.alx .p-table td.pp-no { padding-left: 0; color: var(--ink); font-weight: 650; font-stretch: 96%; letter-spacing: .01em; }
.alx .p-table td.pp-wt { color: var(--ink); font-weight: 600; }
.alx .p-table tbody tr:hover td { background: var(--white); }
@media (max-width: 680px) {
  .alx .p-table-wrap { overflow-x: auto; margin-inline: calc(var(--pad) * -1); padding-inline: var(--pad); }
  .alx .p-table { font-size: .875rem; min-width: 30rem; }
  .alx .p-table th { position: static; }
  .alx .p-table th button { padding: .625rem .5rem .5rem; }
  .alx .p-table td { padding: .5rem; }
  .alx .p-field--seg { flex: 1 1 100%; }
}

/* ============================================================
   ROLLOUT: GENERAL PAGES (hubs, company, process, contact, legal)
   ============================================================ */
/* page opening */
.alx .pg-hero { padding-block: clamp(2.5rem, 5vw, 4.5rem) clamp(2.5rem, 5vw, 4rem); }
.alx .pg-hero .grid12 { row-gap: 2rem; align-items: end; }
.alx .pg-hero-text { grid-column: 1 / 9; display: grid; gap: 1.25rem; }
.alx .pg-hero-text .t-h1 { max-width: 15em; }
.alx .pg-hero-text .pg-over { letter-spacing: .08em; font-weight: 600; }
.alx .pg-hero-aside { grid-column: 9 / 13; }
.alx .pg-hero .actions { margin-top: .5rem; }
.alx .pg-hero + .sec { padding-top: 0; }
.alx .pg-figure { margin: 0; position: relative; background: var(--panel-2); overflow: hidden; }
.alx .pg-figure img { width: 100%; height: auto; aspect-ratio: 16 / 7; object-fit: cover; filter: saturate(.85); }
@media (prefers-reduced-motion: no-preference) {
  .alx .pg-figure--load img { animation: alx-wipe 1.1s var(--ease) .1s both; }
}

/* text + photo rows */
.alx .split { row-gap: 2rem; align-items: start; }
.alx .split + .split { margin-top: clamp(3.5rem, 6vw, 5.5rem); }
.alx .split-media { grid-column: 1 / 7; margin: 0; }
.alx .split-media img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; background: var(--panel-2); filter: saturate(.85); }
.alx .split-media figcaption { padding-top: .625rem; font-size: .875rem; color: var(--ink-3); }
.alx .split-text { grid-column: 8 / 13; display: grid; gap: 1rem; align-content: start; }
.alx .split--rev .split-media { grid-column: 7 / 13; grid-row: 1; }
.alx .split--rev .split-text { grid-column: 1 / 6; grid-row: 1; }
.alx .split-text .n { font-size: .9375rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
/* about page: heading left, paragraphs and list right */
.alx .what-head { grid-column: 1 / 6; display: grid; gap: 1rem; align-content: start; }
.alx .what-text { grid-column: 7 / 13; display: grid; gap: 1.25rem; }

/* label / value rows for technical figures */
.alx .spec { display: grid; border-top: 1px solid var(--ink); margin-top: .5rem; }
.alx .spec > div { display: grid; grid-template-columns: minmax(8rem, 2fr) 3fr; gap: 1rem; padding: .625rem 0; border-bottom: 1px solid var(--rule); }
.alx .spec dt { color: var(--ink-3); font-size: .9375rem; }
.alx .spec dd { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums lining-nums; }

/* simple ruled list of statements */
.alx .ticks { display: grid; border-top: 1px solid var(--rule); }
.alx .ticks li { padding: .75rem 0 .75rem 1.25rem; border-bottom: 1px solid var(--rule); position: relative; color: var(--ink-2); }
.alx .ticks li::before { content: ""; position: absolute; left: 0; top: 1.3em; width: 6px; height: 6px; background: var(--accent); }

/* columns of short blocks with a rule on top */
.alx .cols { display: grid; grid-template-columns: repeat(var(--c, 3), minmax(0, 1fr)); gap: 2rem var(--gap); }
.alx .cols > * { border-top: 1px solid var(--ink); padding-top: 1rem; display: grid; gap: .5rem; align-content: start; }
.alx .cols p { font-size: .9375rem; }

/* sources / small print */
.alx .src { font-size: .875rem; color: var(--ink-3); display: grid; gap: .25rem; }
.alx .src li { padding-left: 1rem; position: relative; }
.alx .src li::before { content: "–"; position: absolute; left: 0; }
.alx .src a { color: var(--ink); text-decoration: underline; text-underline-offset: .2em; text-decoration-color: var(--rule); }
.alx .src a:hover { text-decoration-color: var(--accent); }

/* sustainability: heading left, text right; carbon intensity table */
.alx .sus-head { grid-column: 1 / 6; }
.alx .sus-text { grid-column: 7 / 13; display: grid; gap: 1.25rem; align-content: start; }
.alx .co2 { width: 100%; border-collapse: collapse; border-top: 1px solid var(--ink); font-variant-numeric: tabular-nums lining-nums; }
.alx .co2 th, .alx .co2 td { padding: .75rem 0; border-bottom: 1px solid var(--rule); text-align: left; vertical-align: top; }
.alx .co2 thead th { font-size: .875rem; font-weight: 500; color: var(--ink-3); border-bottom-color: var(--ink); }
.alx .co2 tbody th { font-weight: 400; color: var(--ink-2); padding-right: 1.5rem; }
.alx .co2 th:last-child, .alx .co2 td { text-align: right; }
.alx .co2 td { color: var(--ink); font-weight: 600; white-space: nowrap; }
.alx .co2-note { margin-top: 1rem; max-width: 60ch; }
@media (max-width: 960px) { .alx .sus-head, .alx .sus-text { grid-column: 1 / -1; } }

/* legal and long-form text */
.alx .doc { max-width: 46rem; }
.alx .doc > * + * { margin-top: 1rem; }
.alx .doc h2 { font-size: 1.25rem; line-height: 1.3; font-stretch: 96%; margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--rule); }
.alx .doc h3 { font-size: 1.0625rem; margin-top: 1.75rem; }
.alx .doc ul, .alx .doc ol { display: grid; gap: .375rem; }
.alx .doc ul li { padding-left: 1.25rem; position: relative; }
.alx .doc ul li::before { content: ""; position: absolute; left: 0; top: .72em; width: 6px; height: 1.5px; background: var(--ink-3); }
.alx .doc ol { list-style: decimal; padding-left: 1.25rem; }
.alx .doc a { color: var(--ink); text-decoration: underline; text-underline-offset: .2em; text-decoration-color: var(--rule); }
.alx .doc a:hover { text-decoration-color: var(--accent); }
.alx .doc table { display: table; width: 100%; border-collapse: collapse; font-size: .9375rem; }
.alx .doc th, .alx .doc td { text-align: left; padding: .5rem .75rem .5rem 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.alx .doc th { color: var(--ink); font-weight: 600; border-bottom-color: var(--ink); }
.alx .doc code { font-size: .875rem; overflow-wrap: break-word; }
.alx .doc-meta { font-size: .875rem; color: var(--ink-3); }
.alx .doc-wrap { padding-bottom: calc(var(--sec) + 1rem); }

/* contact */
.alx .c-grid { row-gap: 3rem; }
.alx .c-info { grid-column: 1 / 6; display: grid; gap: 2rem; align-content: start; }
.alx .c-info dl { display: grid; border-top: 1px solid var(--ink); }
.alx .c-info dl > div { display: grid; gap: .25rem; padding: 1rem 0; border-bottom: 1px solid var(--rule); }
.alx .c-info dt { font-size: .875rem; color: var(--ink-3); }
.alx .c-info dd { color: var(--ink); font-weight: 600; font-size: 1.0625rem; }
.alx .c-info dd a:hover { color: var(--accent-ink); }
.alx .c-info dd small { display: block; font-weight: 400; font-size: .9375rem; color: var(--ink-2); }
.alx .c-map { aspect-ratio: 4 / 3; background: var(--panel-2); border: 1px solid var(--rule); }
.alx .c-map iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(.6); }
/* consent-gated map: placeholder until js/cookie-consent.js loads the iframe */
.alx .c-map-gate { height: 100%; display: grid; align-content: center; gap: 1.25rem; padding: clamp(1.25rem, 4vw, 2rem); }
.alx .c-map-gate p { font-size: .9375rem; color: var(--ink-2); max-width: 38ch; }
.alx .c-map-gate .actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; }
.alx .c-form { grid-column: 7 / 13; background: var(--white); border: 1px solid var(--rule); padding: clamp(1.5rem, 3vw, 2.5rem); display: grid; gap: 1.25rem; align-content: start; }
.alx .f-field { display: grid; gap: .375rem; }
.alx .f-field label { font-size: .9375rem; color: var(--ink); font-weight: 500; }
.alx .f-field label span { color: var(--accent-ink); }
.alx .f-field input, .alx .f-field textarea {
  width: 100%; border: 1px solid var(--rule); background: var(--paper); color: var(--ink); border-radius: 0;
  font-size: 1rem; padding: .75rem .875rem; transition: border-color .16s var(--ease);
}
.alx .f-field input { height: 48px; }
.alx .f-field textarea { min-height: 9rem; resize: vertical; }
.alx .f-field input:hover, .alx .f-field textarea:hover { border-color: var(--ink-3); }
.alx .f-field input:focus, .alx .f-field textarea:focus { outline: 2px solid var(--accent); outline-offset: -1px; border-color: var(--accent); background: var(--white); }
.alx .form-control--error { border-color: #B42318 !important; }
.alx .field-error, .alx .form-error-global { color: #B42318; font-size: .875rem; }
.alx .c-form .btn { width: 100%; }
.alx .c-ok { display: none; color: var(--ink); font-weight: 600; border-left: 2px solid var(--accent); padding-left: .75rem; }
.alx .c-note { font-size: .875rem; color: var(--ink-3); }
.alx .c-note a { color: var(--ink); text-decoration: underline; text-underline-offset: .2em; }

/* products hub: find a profile by number */
.alx .find { background: var(--panel); padding: clamp(1.5rem, 3vw, 2.25rem); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.5rem var(--gap); align-items: start; }
.alx .find .t-h3 { margin-bottom: .375rem; }
.alx .find .p-search input { width: 100%; height: 48px; font-size: 1rem; }
.alx .find-out { margin-top: .75rem; display: grid; }
.alx .find-out a { display: grid; grid-template-columns: minmax(6rem, auto) 1fr auto; gap: 1rem; align-items: baseline; padding: .625rem 0; border-bottom: 1px solid var(--rule); }
.alx .find-out a:hover { background: var(--white); }
.alx .find-out b { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
.alx .find-out span { color: var(--ink-2); font-size: .9375rem; }
.alx .find-out em { font-style: normal; color: var(--ink-3); font-size: .875rem; font-variant-numeric: tabular-nums; }
.alx .find-msg { font-size: .875rem; color: var(--ink-3); padding-top: .625rem; }
.alx .hub-sec + .hub-sec { margin-top: clamp(3.5rem, 6vw, 5rem); }
.alx .hub-sec .h-index-list { margin-top: 0; }

/* catalogue page: section list */
.alx .cat-tbl td a { color: var(--ink); font-weight: 600; }
.alx .cat-tbl td a:hover { color: var(--accent-ink); text-decoration: underline; text-underline-offset: .2em; }
.alx .cat-tbl .dl { display: inline-flex; align-items: center; gap: .375rem; }
.alx .cat-tbl td { vertical-align: middle; }
.alx .cat-tbl th { position: static; padding: .75rem .875rem .625rem; font-weight: 600; color: var(--ink); }
.alx .cat-tbl th:first-child { padding-left: 0; }

/* thank-you / small notices */
.alx .notice { border-left: 2px solid var(--accent); padding: .25rem 0 .25rem 1rem; color: var(--ink-2); }

@media (max-width: 960px) {
  .alx .pg-hero-text, .alx .pg-hero-aside, .alx .split-media, .alx .split-text,
  .alx .split--rev .split-media, .alx .split--rev .split-text, .alx .c-info, .alx .c-form,
  .alx .what-head, .alx .what-text { grid-column: 1 / -1; grid-row: auto; }
  .alx .cols { --c: 2 !important; }
  .alx .find { grid-template-columns: 1fr; }
  .alx .pg-figure img { aspect-ratio: 16 / 9; }
}
@media (max-width: 680px) {
  .alx .cols { --c: 1 !important; }
  .alx .spec > div { grid-template-columns: 1fr; gap: .125rem; }
  .alx .split-media, .alx .pg-figure { margin-inline: calc(var(--pad) * -1); }
  .alx .find { margin-inline: calc(var(--pad) * -1); }
  .alx .find-out a { grid-template-columns: auto 1fr; }
  .alx .find-out em { grid-column: 2; }
  .alx .cat-tbl { min-width: 0 !important; }
  .alx .cat-tbl .hide-s { display: none; }
}

/* hub lists: one column, with a short description */
.alx .h-index-list--one { grid-template-columns: 1fr; border-top: 1px solid var(--ink); }
.alx .h-index-list--one a { grid-template-columns: 3rem 8rem 1fr 1.25rem; min-height: 7.5rem; gap: 1.5rem; }
.alx .h-index-list--one .th { height: 5.5rem; }
.alx .h-index-list--one .th img { max-height: 5.5rem; max-width: 8rem; }
.alx .h-index-list--one .nm b { font-size: 1.25rem; }
.alx .h-index-list .ds { display: block; margin-top: .25rem; max-width: 62ch; font-size: .9375rem; color: var(--ink-2); }
@media (max-width: 680px) {
  .alx .h-index-list--one a { grid-template-columns: 2.25rem 4.5rem 1fr 1rem; gap: .75rem; }
  .alx .h-index-list--one .th { height: 3.5rem; }
  .alx .h-index-list--one .th img { max-height: 3.5rem; max-width: 4.5rem; }
  .alx .h-index-list .ds { display: none; }
}

/* production page: step jump links */
.alx .steps-nav { display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; padding: 0 0 1rem; margin-bottom: clamp(3rem, 5vw, 4.5rem); border-bottom: 1px solid var(--ink); }
.alx .steps-nav a { display: inline-flex; gap: .5rem; align-items: baseline; color: var(--ink); font-weight: 500; }
.alx .steps-nav a:hover { color: var(--accent-ink); }
.alx .steps-nav .n { color: var(--ink-3); font-variant-numeric: tabular-nums; font-size: .875rem; }
/* production page: standards and certificates. The rule before each item is
   clipped at the start of every line, so a wrapped row never opens with one. */
.alx .certs { display: grid; gap: .875rem; margin-top: clamp(3.5rem, 6vw, 5.5rem); padding-top: 1rem; border-top: 1px solid var(--ink); }
.alx .cert-list { display: flex; flex-wrap: wrap; row-gap: .5rem; margin-left: -.875rem; overflow: hidden; font-weight: 600; font-variant-numeric: tabular-nums lining-nums; }
.alx .cert-list li { padding-inline: .875rem; margin-left: -1px; border-left: 1px solid var(--ink-3); white-space: nowrap; }
.alx .h-steps-list--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1080px) { .alx .h-steps-list--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) { .alx .h-steps-list--3 { grid-template-columns: 1fr; } }
.alx .split-media img[src*="packing"] { aspect-ratio: auto; }
.alx .h-index-list .no { white-space: nowrap; font-size: .875rem; }
.alx .band .p-table th { background: var(--panel); }
.alx .h-index-list .nm small { font-size: inherit; }
@media (max-width: 680px) {
  .alx .p-seg { display: flex; width: 100%; }
  .alx .p-seg button { flex: 1 1 auto; }
}
.alx .cat-tbl small { font-size: .8125rem; }