
/* ==========================================================================
   ALPENOL DESIGN SYSTEM  (content sections only)
   Generated from Figma "Alpenol — Website Style Tile". Do not hand-edit.
   Header/footer are Theme Builder templates and are deliberately untouched.
   ========================================================================== */

:root {
  --al-blue:#1263C3; --al-green:#009E4A; --al-ink:#232020;
  --al-n50:#FBFAF7; --al-n100:#E4E0D8; --al-n500:#7A756B; --al-n700:#4A463F;
  --al-blue50:#EAF1FB; --al-green50:#E9F7EE;
  --al-serif:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; --al-sans:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ---- section shells ---------------------------------------------------- */
.al-sec { background:var(--al-n50); }
.al-sec--white { background:#fff; }
.al-sec--ink   { background:var(--al-ink); }
.al-sec--tint  { background:var(--al-blue50); }
.al-sec .et_pb_row { width:1312px!important; max-width:calc(100% - 48px)!important; padding:0!important; }

/* ---- type -------------------------------------------------------------- */
.al-eyebrow {
  font-family:var(--al-sans); font-weight:700; font-size:11px;
  letter-spacing:1px; text-transform:uppercase; color:var(--al-n500);
  margin:0 0 14px;
}
.al-eyebrow--green { color:var(--al-green); }
.al-eyebrow-pill {
  display:inline-flex; align-items:center; gap:10px;
  background:var(--al-green50); border-radius:20px; padding:6px 16px;
  font-family:var(--al-sans); font-weight:700; font-size:11px;
  letter-spacing:1px; text-transform:uppercase; color:var(--al-green);
}
.al-eyebrow-pill::before {
  content:""; width:6px; height:6px; border-radius:50%; background:var(--al-green);
}
.al-eyebrow-pill--plain { background:var(--al-blue50); color:var(--al-blue); }
.al-eyebrow-pill--plain::before { display:none; }

.al-h1 {
  font-family:var(--al-serif); font-weight:700; font-size:68px;
  line-height:1.04; letter-spacing:-1.7px; color:var(--al-ink); margin:0;
}
.al-h2 {
  font-family:var(--al-serif); font-weight:700; font-size:40px;
  line-height:1.15; letter-spacing:-0.8px; color:var(--al-ink); margin:0;
}
.al-h3 {
  font-family:var(--al-serif); font-weight:700; font-size:24px;
  line-height:1.3; color:var(--al-ink); margin:0;
}
.al-lead {
  font-family:var(--al-sans); font-size:18px; line-height:1.6;
  color:var(--al-n700); margin:0;
}
.al-body {
  font-family:var(--al-sans); font-size:16px; line-height:1.65;
  color:var(--al-n700); margin:0;
}
.al-small { font-family:var(--al-sans); font-size:15px; color:var(--al-n500); }
.al-sec--ink .al-h2, .al-sec--ink .al-h3 { color:#fff; }
.al-sec--ink .al-body, .al-sec--ink .al-lead { color:rgba(255,255,255,.78); }

/* ---- section header (eyebrow + serif heading left, support line right) -- */
.al-sechead { display:flex; justify-content:space-between; align-items:flex-end; gap:64px; }
.al-sechead__l { flex:0 1 700px; }
.al-sechead__r { flex:0 0 500px; padding-bottom:6px; }
.al-rule { height:1px; background:var(--al-n100); border:0; margin:34px 0 0; }
.al-sec--ink .al-rule { background:rgba(255,255,255,.16); }

/* ---- buttons ----------------------------------------------------------- */
.al-btn {
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--al-sans); font-weight:600; font-size:13px;
  height:44px; padding:0 22px; border-radius:4px;
  text-decoration:none!important; transition:.18s ease;
}
.al-btn--primary { background:var(--al-blue); color:#fff!important; }
.al-btn--primary:hover { background:#0f55a8; }
.al-btn--secondary { background:#fff; color:var(--al-ink)!important; border:1px solid var(--al-n100); }
.al-btn--secondary:hover { border-color:var(--al-ink); }
.al-btn--white { background:#fff; color:var(--al-ink)!important; height:42px; }
.al-btnrow { display:flex; gap:12px; flex-wrap:wrap; }

/* ---- chips ------------------------------------------------------------- */
.al-chip {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--al-sans); font-size:13px; color:var(--al-n700);
  background:#fff; border:1px solid var(--al-n100);
  border-radius:4px; padding:0 12px; height:36px;
}
.al-chip__dot { width:20px; height:20px; border-radius:50%; background:var(--al-green50);
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--al-green); font-size:11px; font-weight:700; }
.al-chip--spec { height:27px; font-size:12px; background:var(--al-n50); }
.al-chiprow { display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }

/* ---- cards ------------------------------------------------------------- */
.al-card {
  background:#fff; border:1px solid var(--al-n100); border-radius:4px;
  position:relative; overflow:hidden; height:100%;
}
.al-card--accent::before {
  content:""; position:absolute; inset:0 0 auto 0; height:3px; background:var(--al-blue);
}
.al-card__pad { padding:30px 24px 24px; }

/* ---- stats ------------------------------------------------------------- */
.al-stats { display:flex; justify-content:space-between; }
.al-stat { flex:0 0 190px; position:relative; }
.al-stat + .al-stat::before {
  content:""; position:absolute; left:-186px; top:0; bottom:0; width:1px; background:var(--al-n100);
}
.al-stat__n { font-family:var(--al-serif); font-weight:700; font-size:72px;
  line-height:1; color:var(--al-blue); letter-spacing:-2px; }
.al-stat__l { font-family:var(--al-sans); font-size:14px; line-height:1.5;
  color:var(--al-n700); margin-top:16px; }

/* ---- image placeholder (swapped for real photography later) ------------ */
.al-ph {
  background:#F1EEE8; border:1.5px dashed #C9C3B6; border-radius:16px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-family:var(--al-sans); color:var(--al-n500); text-align:center; gap:4px;
}
.al-ph__t { font-size:14px; font-weight:600; }
.al-ph__s { font-size:12px; opacity:.75; }

/* ---- link with arrow --------------------------------------------------- */
.al-more {
  font-family:var(--al-sans); font-weight:600; font-size:15px;
  color:var(--al-blue)!important; text-decoration:none!important;
  display:inline-flex; align-items:center; gap:8px;
}
.al-more::after { content:"\2192"; transition:transform .18s ease; }
.al-more:hover::after { transform:translateX(4px); }

/* ---- responsive -------------------------------------------------------- */
@media (max-width:1100px) {
  .al-h1 { font-size:48px; letter-spacing:-1.1px; }
  .al-h2 { font-size:32px; }
  .al-sechead { flex-direction:column; align-items:flex-start; gap:20px; }
  /* flex-basis is measured along the MAIN axis, so the moment this flips to
     column the 700px basis on __l stops being a width and becomes a HEIGHT.
     That put a 700px empty box under every section heading on mobile, which
     is the run of blank screens the client sent screenshots of on 2026-09-30.
     Both children must be reset, not just __r. */
  .al-sechead__l, .al-sechead__r { flex:1 1 auto; width:100%; }
  /* Heading sizes are set inline per section, and an inline style outranks a
     media query, so these never took effect and mobile kept the 44px desktop
     size. !important is the only lever that reaches an inline style. */
  .al-h1 { font-size:40px!important; letter-spacing:-.9px; }
  .al-h2, .al-h-lg, .al-h-md { font-size:30px!important; letter-spacing:-.5px; }
  .al-stats { gap:32px; flex-wrap:wrap; }
  .al-stat + .al-stat::before { display:none; }
}
@media (max-width:767px) {
  .al-h1 { font-size:34px; letter-spacing:-0.6px; }
  .al-h2 { font-size:26px; }
  .al-lead { font-size:16px; }
  .al-stat { flex:1 1 100%; }
  .al-btnrow .al-btn { width:100%; }
}

/* ---- process film -------------------------------------------------------- */
.al-film { width:100%; margin:0 auto; }
.al-film__v { display:block; width:100%; height:auto; background:#000;
  border:1px solid rgba(255,255,255,.10); }

/* ---- hero -------------------------------------------------------------- */
.al-hero { position:relative; overflow:hidden; }
.al-hero__media { position:relative; }
.al-hero__media::before {
  content:""; position:absolute; left:-16px; top:-16px; right:16px; bottom:16px;
  background:#EAF1FB; border-radius:16px;
}
.al-hero__media--light::before { background:#FBFAF7; }
.al-hero__media .al-ph, .al-hero__media .al-img { position:relative; z-index:1; }
/* The hero slot is near-square and the film is 16:9, so it is cropped to
   fill rather than letterboxed into a band of black. */
.al-hero__media--film .al-film { position:relative; z-index:1; }
.al-hero__media--film .al-film__v { height:500px; object-fit:cover; }
@media (max-width:1100px) {
  .al-hero__media--film .al-film__v { height:360px; }
}
@media (max-width:767px) {
  .al-hero__media--film .al-film__v { height:260px; }
}

/* ---- dark bands: stats + process --------------------------------------- */
.al-sec--ink .al-stat__n { color:#fff; }
.al-sec--ink .al-stat__l { color:rgba(255,255,255,.66); }
.al-sec--ink .al-stat + .al-stat::before { background:rgba(255,255,255,.16); }
.al-sec--ink .al-eyebrow { color:rgba(255,255,255,.55); }

/* process: 7 columns, rule + auto number + title + copy */
.al-proc { counter-reset:al-step; display:grid; grid-template-columns:repeat(8,1fr); gap:16px; }
.al-proc__i { counter-increment:al-step; }
.al-proc__i::before {
  content:""; display:block; height:2px; width:100%; background:#1263C3; margin-bottom:20px;
}
.al-proc__n {
  font-family:var(--al-serif); font-weight:700; font-size:26px; color:#1263C3;
  display:block; margin-bottom:22px;
}
.al-proc__t { font-family:var(--al-sans); font-weight:600; font-size:16px; color:#fff; margin:0 0 10px; }
.al-proc__d { font-family:var(--al-sans); font-size:13px; line-height:1.55; color:rgba(255,255,255,.62); margin:0; }

/* DiviFlash timeline, restyled to the Alpenol process look */
.al-timeline .df_timeline_title { font-family:var(--al-sans)!important; font-weight:600!important;
  font-size:16px!important; color:#fff!important; }
.al-timeline .df_timeline_desc { font-family:var(--al-sans)!important; font-size:13px!important;
  line-height:1.55!important; color:rgba(255,255,255,.62)!important; }

/* ---- mill logo strip --------------------------------------------------- */
/* auto-fit so the strip stays balanced as mills are added. */
.al-mills { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:16px; align-items:stretch; }
.al-mill { min-height:66px; border:1px dashed #C9C3B6; border-radius:4px; background:#F1EEE8;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--al-sans); font-size:11px; letter-spacing:1px; color:#7A756B; }

/* ---- product range ----------------------------------------------------- */
.al-pgrid { display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:start; }
.al-pcard { background:#fff; border:1px solid #E4E0D8; border-radius:14px; overflow:hidden; }
.al-pcard__media .al-ph, .al-pcard__media .al-img { border-radius:0; border-left:0; border-right:0; border-top:0; }
.al-pcard__b { padding:22px 24px 26px; }
.al-tag { display:inline-block; background:#fff; border-radius:6px; padding:5px 10px;
  font-family:var(--al-sans); font-weight:600; font-size:11px; color:#1263C3; }
.al-tag--tint { background:#EAF1FB; }
.al-tag--green { background:#E9F7EE; color:#009E4A; }
.al-pcard__t { font-family:var(--al-sans); font-weight:600; font-size:26px; line-height:1.25;
  letter-spacing:-.26px; color:#232020; margin:12px 0 10px; }
.al-pcard__d { font-family:var(--al-sans); font-size:15px; line-height:1.5; color:#7A756B; margin:0; }
.al-prow { display:flex; gap:16px; background:#fff; border:1px solid #E4E0D8;
  border-radius:14px; padding:11px; align-items:flex-start; }
.al-prow + .al-prow { margin-top:14px; }
.al-prow__m { flex:0 0 140px; }
.al-prow__m .al-ph, .al-prow__m .al-img { width:140px; height:140px; border-radius:10px; }
.al-prow__b { flex:1 1 auto; padding:4px 0; }
.al-prow__t { font-family:var(--al-sans); font-weight:600; font-size:18px; line-height:1.3;
  color:#232020; margin:10px 0 8px; }
.al-prow__d { font-family:var(--al-sans); font-size:14px; line-height:1.5; color:#7A756B; margin:0; }
.al-prow__s { font-family:var(--al-sans); font-weight:500; font-size:12px; color:#7A756B; margin:12px 0 0; }

/* ---- applications ------------------------------------------------------ */
/* Five application cards since the 2026-09-30 regrouping, not four. auto-fit
   keeps them on one row on a wide screen and steps down on its own, so the
   count can change again without another breakpoint edit. */
.al-appgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:20px; }
.al-fibres { font-family:var(--al-sans); font-size:16px; color:#4A463F; margin:0; }

/* ---- sustainability banner --------------------------------------------- */
.al-banner { position:relative; min-height:340px; display:flex; align-items:center;
  background:#F1EEE8; border:1.5px dashed #C9C3B6; overflow:hidden; }
.al-banner::after { content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(35,32,32,.82) 0%, rgba(35,32,32,.55) 55%, rgba(35,32,32,.35) 100%); }
.al-banner__c { position:relative; z-index:2; padding:56px 0; width:100%;
  max-width:1312px; margin:0 auto; }
.al-banner__c > * { max-width:620px; }
.al-banner__h { font-family:var(--al-serif); font-weight:700; font-size:44px; line-height:1.12;
  letter-spacing:-.66px; color:#fff; margin:16px 0 26px; }

/* ---- markets ----------------------------------------------------------- */
.al-mkt { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.al-mktcard { border:1px solid #E4E0D8; border-radius:8px; padding:20px; background:#fff; }
.al-mktcard__n { font-family:var(--al-sans); font-weight:600; font-size:17px; color:#232020; margin:0 0 12px; }
.al-mkttables { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin-top:52px; }
.al-mkttable h4 { font-family:var(--al-sans); font-weight:700; font-size:11px; letter-spacing:1px;
  text-transform:uppercase; color:#7A756B; margin:0 0 14px; }
.al-mktrow { display:flex; justify-content:space-between; align-items:center;
  border-top:1px solid #E4E0D8; padding:11px 0; }
.al-mktrow span:first-child { font-family:var(--al-sans); font-size:15px; color:#232020; }
.al-mktrow span:last-child { font-family:var(--al-sans); font-size:13px; color:#7A756B; }

/* ---- testimonial ------------------------------------------------------- */
/* Three testimonials since 2026-10-01, so the quote is a card in a row
   rather than one wide pull-out. */
.al-quotes { display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  align-items:stretch; }
.al-quote--card { background:#FFFFFF; border:1px solid #E4E0D8; border-radius:14px;
  padding:28px 26px 26px; display:flex; flex-direction:column; }
.al-quote--card .al-quote__t { font-size:19px; line-height:1.5; flex:1 1 auto; }
.al-quote--card .al-quote__m { font-size:44px; }
@media (max-width:1100px) { .al-quotes { grid-template-columns:1fr; } }
.al-quote { position:relative; }
.al-quote__m { font-family:var(--al-serif); font-weight:700; font-size:64px; line-height:1;
  color:rgba(0,158,74,.35); display:block; }
.al-quote__t { font-family:var(--al-serif); font-size:30px; line-height:1.4; letter-spacing:-.15px;
  color:#232020; margin:14px 0 26px; max-width:1000px; }
.al-quote__a { display:flex; align-items:center; gap:12px; }
.al-quote__av { width:36px; height:36px; border-radius:18px; background:#EAF1FB; color:#1263C3;
  font-family:var(--al-sans); font-weight:700; font-size:12px;
  display:flex; align-items:center; justify-content:center; }
.al-quote__n { font-family:var(--al-sans); font-weight:600; font-size:13px; color:#4A463F; }

/* ---- resources --------------------------------------------------------- */
.al-arts { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.al-art { background:#fff; border:1px solid #E4E0D8; border-radius:14px; overflow:hidden; position:relative; }
.al-art__m { position:relative; }
.al-art__m .al-ph, .al-art__m .al-img { border-radius:0; border-left:0; border-right:0; border-top:0; height:230px; }
.al-art__tag { position:absolute; left:17px; top:17px; z-index:2; }
.al-art__b { padding:20px 17px 24px; }
.al-art__t { font-family:var(--al-sans); font-weight:600; font-size:19px; line-height:1.35;
  letter-spacing:-.095px; color:#232020; margin:0 0 18px; }
.al-art__d { font-family:var(--al-sans); font-size:13px; color:#7A756B; }

/* ---- FAQ (DiviFlash difl_faq restyled) --------------------------------- */
.al-faq .faq_question_title { font-family:var(--al-sans)!important; font-weight:600!important;
  font-size:19px!important; color:#232020!important; }
.al-faq .faq_answer { font-family:var(--al-sans)!important; font-size:15px!important;
  line-height:1.6!important; color:#4A463F!important; }
.al-faq .df_faq_item { border-top:1px solid #E4E0D8; padding:6px 0; }

/* ---- contact CTA ------------------------------------------------------- */
.al-ctaform { background:#fff; border:1px solid #E4E0D8; border-radius:12px; padding:32px; }
.al-ctaform label { display:block; font-family:var(--al-sans); font-weight:600; font-size:11px;
  letter-spacing:1px; text-transform:uppercase; color:#7A756B; margin:0 0 8px; }
.al-ctaform input, .al-ctaform textarea {
  width:100%; border:1px solid #E4E0D8; border-radius:6px; background:#FBFAF7;
  padding:14px; font-family:var(--al-sans); font-size:15px; color:#232020;
}
.al-ctaform .al-f2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.al-ctaform .al-fld { margin-bottom:20px; }
.al-cta__meta { font-family:var(--al-sans); font-size:15px; color:#4A463F; margin:6px 0 0; }

@media (max-width:1100px) {
  .al-proc { grid-template-columns:repeat(3,1fr); gap:28px; }
  .al-pgrid, .al-mkttables { grid-template-columns:1fr; }
  .al-mkt { grid-template-columns:repeat(2,1fr); }
  .al-arts { grid-template-columns:1fr; }

  .al-banner__h { font-size:32px; }
  .al-quote__t { font-size:22px; }
}
@media (max-width:767px) {
  .al-proc { grid-template-columns:1fr 1fr; }
  .al-appgrid { grid-template-columns:1fr; }
  .al-mkt { grid-template-columns:1fr; }
  .al-prow { flex-direction:column; }
  .al-prow__m { flex:1 1 auto; }
  .al-ctaform .al-f2 { grid-template-columns:1fr; }
  .al-banner__c { padding:40px 24px; }
}

/* ---- shared inner-page blocks ------------------------------------------ */
.al-prose { font-family:var(--al-sans); font-size:17px; line-height:1.7;
  color:#7A756B; margin:0 0 24px; }
.al-prose:last-child { margin-bottom:0; }

.al-split { display:flex; gap:96px; align-items:flex-start; }
.al-split__l { flex:0 0 560px; }
.al-split__r { flex:1 1 auto; max-width:616px; }

.al-h-lg { font-family:var(--al-serif); font-weight:700; font-size:58px;
  line-height:1.06; letter-spacing:-1.45px; color:#232020; margin:0; }
.al-h-md { font-family:var(--al-serif); font-weight:700; font-size:44px;
  line-height:1.08; letter-spacing:-.66px; color:#232020; margin:0; }
.al-h-sm { font-family:var(--al-serif); font-weight:700; font-size:42px;
  line-height:1.1; letter-spacing:-.63px; color:#232020; margin:0; }

/* dark stat band */
.al-dstats { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.al-dstat { position:relative; padding-left:0; }
.al-dstat + .al-dstat { border-left:1px solid rgba(255,255,255,.16); padding-left:32px; }
.al-dstat__n { font-family:var(--al-serif); font-weight:700; font-size:56px;
  line-height:1; letter-spacing:-1.12px; color:#fff; }
.al-dstat__l { font-family:var(--al-sans); font-size:14px; line-height:1.55;
  color:rgba(228,224,216,.72); margin-top:20px; max-width:288px; }

/* numbered QA cards */
.al-numgrid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.al-numcard { background:#fff; border:1px solid #E4E0D8; border-radius:14px;
  padding:27px 23px; position:relative; overflow:hidden; }
.al-numcard::before { content:""; position:absolute; inset:0 0 auto 0; height:3px; background:#1263C3; }
.al-numcard__n { font-family:var(--al-serif); font-weight:700; font-size:26px;
  line-height:1; color:#1263C3; display:block; margin-bottom:16px; }
.al-numcard__t { font-family:var(--al-sans); font-weight:600; font-size:17px;
  line-height:1.3; color:#232020; margin:0 0 10px; }
.al-numcard__d { font-family:var(--al-sans); font-size:14px; line-height:1.58;
  color:#7A756B; margin:0; }

/* CTA band */
.al-ctaband { display:flex; align-items:center; justify-content:space-between; gap:64px; }
.al-ctaband__l { flex:1 1 auto; max-width:720px; }
.al-ctaband__h { font-family:var(--al-serif); font-weight:700; font-size:38px;
  line-height:1.12; letter-spacing:-.57px; color:#232020; margin:0 0 20px; }
.al-ctaband__s { font-family:var(--al-sans); font-size:16px; line-height:1.55;
  color:#7A756B; margin:0; max-width:620px; }
.al-ctaband__r { flex:0 0 auto; }
.al-ctaband__r .al-btn { height:48px; border-radius:8px; font-size:14px; padding:0 28px; }

/* two-column media + prose */
.al-media2 { display:flex; gap:72px; align-items:flex-start; }
.al-media2__m { flex:0 0 600px; }
.al-media2__b { flex:1 1 auto; max-width:600px; }

@media (max-width:1100px) {
  .al-split, .al-media2 { flex-direction:column; gap:32px; }
  .al-split__l, .al-media2__m { flex:1 1 auto; width:100%; }
  .al-dstats, .al-numgrid { grid-template-columns:repeat(2,1fr); }
  .al-dstat + .al-dstat { border-left:0; padding-left:0; }
  .al-ctaband { flex-direction:column; align-items:flex-start; gap:28px; }
  .al-h-lg { font-size:40px; letter-spacing:-.9px; }
  .al-h-md, .al-h-sm { font-size:32px; }
}
@media (max-width:767px) {
  .al-dstats, .al-numgrid { grid-template-columns:1fr; }
  .al-h-lg { font-size:32px; }
  .al-h-md, .al-h-sm { font-size:26px; }
  .al-ctaband__h { font-size:26px; }
}

/* ---- product family cards ---------------------------------------------- */
.al-famgrid { display:grid; grid-template-columns:1fr 1fr; gap:36px; }
.al-fam { background:#fff; border:1px solid #E4E0D8; border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column; }
.al-fam__m .al-ph, .al-fam__m .al-img { border-radius:0; border-left:0; border-right:0; border-top:0; }
.al-fam__b { padding:28px 27px 30px; display:flex; flex-direction:column; flex:1 1 auto; }
.al-fam__t { font-family:var(--al-serif); font-weight:700; font-size:30px; line-height:1.2;
  letter-spacing:-.3px; color:#232020; margin:0 0 14px; }
.al-fam__d { font-family:var(--al-sans); font-size:16px; line-height:1.65; color:#7A756B; margin:0 0 24px; }
.al-fam__l { list-style:none; padding:0; margin:0 0 26px; }
.al-fam__l li { position:relative; padding-left:18px; margin-bottom:14px;
  font-family:var(--al-sans); font-size:15px; line-height:1.6; color:#7A756B; }
.al-fam__l li::before { content:""; position:absolute; left:0; top:9px; width:5px; height:5px;
  border-radius:50%; background:#1263C3; }
.al-fam__b .al-more { margin-top:auto; }

/* ---- comparison table --------------------------------------------------- */
.al-cmp { margin-top:40px; }
.al-cmp__h, .al-cmp__r { display:grid; grid-template-columns:440px 400px 1fr; gap:56px; }
.al-cmp__h { padding-bottom:12px; }
.al-cmp__ha, .al-cmp__hb { font-family:var(--al-sans); font-weight:700; font-size:11px;
  letter-spacing:.66px; text-transform:uppercase; }
.al-cmp__ha { color:#1263C3; }
.al-cmp__hb { color:#7A756B; }
.al-cmp__r { border-top:1px solid #E4E0D8; padding:22px 0; align-items:start; }
.al-cmp__k { font-family:var(--al-sans); font-weight:600; font-size:16px; line-height:1.5; color:#232020; }
.al-cmp__a, .al-cmp__b { font-family:var(--al-sans); font-size:15px; line-height:1.6; color:#7A756B; }

/* ---- dark numbered features -------------------------------------------- */
.al-dnums { display:grid; grid-template-columns:repeat(3,1fr); gap:48px; }
.al-dnum { min-width:0; }
.al-dnum__n { font-family:var(--al-serif); font-weight:700; font-size:28px; line-height:1;
  color:#009E4A; display:block; margin-bottom:26px; }
.al-dnum__t { font-family:var(--al-sans); font-weight:600; font-size:20px; line-height:1.3;
  color:#fff; margin:0 0 14px; }
.al-dnum__d { font-family:var(--al-sans); font-size:15px; line-height:1.65;
  color:rgba(228,224,216,.72); margin:0; }

@media (max-width:1100px) {
  .al-famgrid { grid-template-columns:1fr; }
  .al-cmp__h, .al-cmp__r { grid-template-columns:1fr; gap:6px; }
  .al-cmp__h { display:none; }
  .al-cmp__a::before { content:"Compound sizing: "; font-weight:600; color:#1263C3; }
  .al-cmp__b::before { content:"Conventional: "; font-weight:600; color:#7A756B; }
  .al-dnums { grid-template-columns:1fr; gap:36px; }
}

/* ---- grade table -------------------------------------------------------- */
.al-grade { margin-top:40px; }
.al-grade__h, .al-grade__r {
  display:grid; grid-template-columns:456px 380px 280px 1fr; gap:0; align-items:start; }
.al-grade__h { padding-bottom:12px; }
.al-grade__h span { font-family:var(--al-sans); font-weight:700; font-size:11px;
  letter-spacing:.66px; text-transform:uppercase; color:#7A756B; }
.al-grade__r { border-top:1px solid #E4E0D8; padding:24px 0; }
.al-grade__n { font-family:var(--al-sans); font-weight:600; font-size:17px;
  line-height:1.45; color:#232020; padding-right:24px; }
.al-grade__c { font-family:var(--al-sans); font-size:15px; line-height:1.6;
  color:#7A756B; padding-right:24px; }
.al-grade__tds { font-family:var(--al-sans); font-weight:600; font-size:14px;
  color:#1263C3!important; text-decoration:none!important; white-space:nowrap; }
.al-grade > .al-grade__r:last-child { border-bottom:1px solid #E4E0D8; }

/* ---- labelled chip groups ---------------------------------------------- */
.al-chipgrp + .al-chipgrp { margin-top:38px; }
.al-chipgrp__r { display:flex; flex-wrap:wrap; gap:10px; }
.al-chip2 { display:inline-flex; align-items:center; background:#fff;
  border:1px solid #E4E0D8; border-radius:7px; padding:7px 12px;
  font-family:var(--al-sans); font-weight:500; font-size:13px; color:#7A756B; }

/* ---- compact process strip --------------------------------------------- */
.al-pstrip { display:grid; grid-template-columns:repeat(7,1fr); gap:12px; margin-top:50px; }
.al-pstrip__i::before { content:""; display:block; height:2px; width:100%;
  background:#1263C3; margin-bottom:18px; }
.al-pstrip--green .al-pstrip__i::before { background:#009E4A; }
.al-pstrip--blue .al-pstrip__i::before { background:#1263C3; }
.al-pstrip__t { font-family:var(--al-sans); font-weight:600; font-size:14px;
  line-height:1.4; color:#fff; }
.al-more--green { color:#009E4A!important; }

@media (max-width:1100px) {
  .al-grade__h { display:none; }
  .al-grade__r { grid-template-columns:1fr; gap:8px; }
  .al-pstrip { grid-template-columns:repeat(4,1fr); gap:20px; }
}
@media (max-width:767px) {
  .al-pstrip { grid-template-columns:repeat(2,1fr); }
}

/* ---- dark specification grid ------------------------------------------- */
.al-spec { display:grid; grid-template-columns:repeat(3,1fr); gap:48px 48px; margin-top:52px; }
.al-spec__i { min-width:0; border-bottom:1px solid rgba(255,255,255,.12); padding-bottom:22px; }
.al-spec__k { display:block; font-family:var(--al-sans); font-weight:700; font-size:11px;
  letter-spacing:.66px; text-transform:uppercase; color:rgba(228,224,216,.6); margin-bottom:12px; }
.al-spec__v { display:block; font-family:var(--al-sans); font-weight:600; font-size:20px;
  line-height:1.4; color:#fff; }
@media (max-width:1100px) { .al-spec { grid-template-columns:repeat(2,1fr); gap:32px; } }
@media (max-width:767px)  { .al-spec { grid-template-columns:1fr; } }

/* green card accent + dark practice list */
.al-appgrid--green .al-card--accent::before { background:#009E4A; }

/* filter pills (visual only; filtering is a later enhancement) */
.al-pills { display:flex; flex-wrap:wrap; gap:10px; }
.al-pill { display:inline-flex; align-items:center; background:#fff;
  border:1px solid #E4E0D8; border-radius:20px; padding:9px 16px;
  font-family:var(--al-sans); font-weight:500; font-size:13px; color:#7A756B; }
.al-pill--on { background:#232020; border-color:#232020; color:#fff; }
.al-btn--green { background:#009E4A; color:#fff!important; height:48px;
  border-radius:8px; font-size:14px; padding:0 28px; }
.al-btn--green:hover { background:#00833d; }
.al-sec--ink .al-faq .faq_question_title { color:#fff!important; }
.al-sec--ink .al-faq .faq_answer { color:rgba(228,224,216,.72)!important; }

/* ---- certificate cards -------------------------------------------------- */
.al-certgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.al-cert { background:#fff; border:1px solid #E4E0D8; border-radius:14px;
  padding:35px 27px 30px; position:relative; overflow:hidden;
  display:flex; flex-direction:column; }
.al-cert::before { content:""; position:absolute; inset:0 0 auto 0; height:3px; background:#009E4A; }
.al-cert__m { margin-bottom:26px; }
.al-cert__m .al-ph, .al-cert__m .al-img { width:120px; height:72px; }
.al-cert__t { font-family:var(--al-serif); font-weight:700; font-size:26px; line-height:1.2;
  letter-spacing:-.26px; color:#232020; margin:0 0 14px; }
.al-cert__d { font-family:var(--al-sans); font-size:15px; line-height:1.65;
  color:#7A756B; margin:0 0 20px; }
.al-cert__r { display:flex; justify-content:space-between; gap:16px; align-items:baseline;
  border-top:1px solid #E4E0D8; padding:14px 0; }
.al-cert__k { font-family:var(--al-sans); font-weight:700; font-size:10px; letter-spacing:.6px;
  text-transform:uppercase; color:#7A756B; flex:0 0 auto; }
.al-cert__v { font-family:var(--al-sans); font-weight:500; font-size:14px; color:#232020;
  text-align:right; }
.al-cert .al-more { margin-top:auto; padding-top:22px; }

/* ---- documentation table ------------------------------------------------ */
.al-doc { margin-top:40px; }
.al-doc__h, .al-doc__r { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,1.2fr) minmax(0,.8fr); gap:24px; }
.al-doc__h { padding-bottom:12px; }
.al-doc__h span { font-family:var(--al-sans); font-weight:700; font-size:11px;
  letter-spacing:.66px; text-transform:uppercase; color:#7A756B; }
.al-doc__r { border-top:1px solid #E4E0D8; padding:24px 0; align-items:center; }
.al-doc__r:last-child { border-bottom:1px solid #E4E0D8; }
.al-doc__n { font-family:var(--al-sans); font-weight:600; font-size:17px; color:#232020; }
.al-doc__f { font-family:var(--al-sans); font-size:15px; color:#7A756B; }
.al-doc__a { text-align:right; }
.al-doc__r span:nth-child(3) {
  font-family:var(--al-sans); font-weight:600; font-size:14px; color:#1263C3; }

@media (max-width:1100px) {
  .al-certgrid { grid-template-columns:1fr; }
  .al-doc__h { display:none; }
  .al-doc__r { grid-template-columns:1fr; gap:6px; padding:18px 0; }
  .al-doc__a { text-align:left; margin-top:4px; }
}

/* ---- enquiry form ------------------------------------------------------- */
.al-enq { background:#fff; border:1px solid #E4E0D8; border-radius:14px; padding:31px; }
.al-enq label, .al-enq .al-enq__lab { display:block; font-family:var(--al-sans);
  font-weight:500; font-size:12px; letter-spacing:.24px; text-transform:uppercase;
  color:#7A756B; margin:0 0 8px; }
.al-enq input, .al-enq textarea, .al-enq select {
  width:100%; height:48px; border:1px solid #E4E0D8; border-radius:8px; background:#fff;
  padding:0 13px; font-family:var(--al-sans); font-size:14px; color:#232020; }
.al-enq textarea { height:110px; padding:13px; resize:vertical; }
.al-enq input::placeholder, .al-enq textarea::placeholder { color:#7A756B; }
.al-enq input:focus, .al-enq textarea:focus { outline:none; border-color:#1263C3; }
.al-enq__fld { margin-bottom:22px; }
.al-enq__2 { display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.al-enq__opts { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:22px; }
.al-enq__opt { display:inline-flex; align-items:center; cursor:pointer;
  border:1px solid #E4E0D8; border-radius:8px; padding:11px 16px; background:#fff;
  font-family:var(--al-sans); font-weight:500; font-size:14px; color:#7A756B; }
.al-enq__opt--on { background:#EAF1FB; border-color:#1263C3; color:#1263C3; }
.al-enq input.al-enq__submit { width:100%; height:50px; border:0; border-radius:8px; background:#1263C3;
  color:#fff; font-family:var(--al-sans); font-weight:600; font-size:15px; cursor:pointer; }
.al-enq__submit:hover { background:#0f55a8; }

.al-contact { display:grid; grid-template-columns:768px 1fr; gap:64px; align-items:start; }
.al-direct__v { font-family:var(--al-sans); font-weight:600; font-size:20px;
  line-height:1.4; color:#232020; margin:0 0 12px; }
.al-direct__l { font-family:var(--al-sans); font-size:16px; line-height:1.7;
  color:#7A756B; margin:0; }
.al-direct__h { font-family:var(--al-sans); font-weight:600; font-size:18px;
  line-height:1.4; color:#232020; margin:0 0 12px; }

.al-offices { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.al-office { background:#fff; border:1px solid #E4E0D8; border-radius:14px;
  padding:29px 23px; position:relative; overflow:hidden; }
.al-office::before { content:""; position:absolute; inset:0 0 auto 0; height:3px; background:#1263C3; }
.al-office__k { font-family:var(--al-sans); font-weight:700; font-size:10px;
  letter-spacing:.6px; text-transform:uppercase; color:#7A756B; margin:0 0 10px; }
.al-office__n { font-family:var(--al-serif); font-weight:700; font-size:26px;
  line-height:1.2; letter-spacing:-.26px; color:#232020; margin:0 0 14px; }
.al-office__a { font-family:var(--al-sans); font-size:15px; line-height:1.65;
  color:#7A756B; margin:0; }

@media (max-width:1100px) {
  .al-contact { grid-template-columns:1fr; gap:40px; }
  .al-offices { grid-template-columns:1fr; }
  .al-enq__2 { grid-template-columns:1fr; gap:0; }
}

/* ---- thank you ---------------------------------------------------------- */
.al-tick { width:64px; height:64px; border-radius:50%; background:#009E4A;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--al-sans); font-weight:700; font-size:30px; color:#fff; }
.al-steps3 { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.al-step3 { min-width:0; }
.al-step3::before { content:""; display:block; height:2px; width:100%;
  background:#1263C3; margin-bottom:22px; }
.al-step3__n { font-family:var(--al-serif); font-weight:700; font-size:26px;
  line-height:1; color:#1263C3; display:block; margin-bottom:18px; }
.al-step3__t { font-family:var(--al-sans); font-weight:600; font-size:19px;
  line-height:1.3; color:#232020; margin:0 0 12px; }
.al-step3__d { font-family:var(--al-sans); font-size:15px; line-height:1.65;
  color:#7A756B; margin:0; }
.al-wide { display:flex; gap:22px; background:#fff; border:1px solid #E4E0D8;
  border-radius:14px; padding:13px; align-items:center; max-width:848px; }
.al-wide__m { flex:0 0 152px; }
.al-wide__m .al-ph, .al-wide__m .al-img { width:152px; height:152px; border-radius:12px; }
.al-wide__t { font-family:var(--al-sans); font-weight:600; font-size:20px;
  line-height:1.35; letter-spacing:-.1px; color:#232020; margin:0 0 10px; }
.al-wide__d { font-family:var(--al-sans); font-size:15px; line-height:1.6;
  color:#7A756B; margin:0; }
@media (max-width:1100px) {
  .al-steps3 { grid-template-columns:1fr; gap:36px; }
  .al-wide { flex-direction:column; align-items:flex-start; }
}

/* ---- article grid ------------------------------------------------------- */
.al-grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:32px 32px; }
.al-acard { background:#fff; border:1px solid #E4E0D8; border-radius:14px;
  overflow:hidden; position:relative; display:flex; flex-direction:column; }
.al-acard__m { position:relative; }
.al-acard__m .al-ph, .al-acard__m .al-img { border-radius:0; border-left:0; border-right:0; border-top:0; height:230px; }
.al-acard__tag { position:absolute; left:18px; top:18px; z-index:2; }
.al-acard__b { padding:26px 18px 24px; display:flex; flex-direction:column; flex:1 1 auto; }
.al-acard__t { font-family:var(--al-sans); font-weight:600; font-size:19px;
  line-height:1.35; letter-spacing:-.095px; color:#232020; margin:0 0 14px; }
.al-acard__d { font-family:var(--al-sans); font-size:13px; color:#7A756B; margin:0 0 22px; }
.al-acard .al-more { margin-top:auto; font-size:14px; }

.al-pager { display:flex; gap:8px; justify-content:center; }
.al-pager span { display:inline-flex; align-items:center; justify-content:center;
  min-width:40px; height:40px; padding:0 12px; border:1px solid #E4E0D8; border-radius:8px;
  background:#fff; font-family:var(--al-sans); font-size:14px; color:#7A756B; }
.al-pager span.al-pager--on { background:#232020; border-color:#232020; color:#fff; }

/* dark inline subscribe */
.al-sub { display:flex; gap:12px; }
.al-sub input { width:340px; height:48px; border:1px solid rgba(255,255,255,.2);
  border-radius:8px; background:rgba(255,255,255,.06); padding:0 13px;
  font-family:var(--al-sans); font-size:14px; color:#fff; }
.al-sub input::placeholder { color:rgba(228,224,216,.6); }
.al-sub button { height:48px; border:0; border-radius:8px; background:#009E4A; color:#fff;
  padding:0 28px; font-family:var(--al-sans); font-weight:600; font-size:14px; cursor:pointer; }
@media (max-width:1100px) {
  .al-grid3 { grid-template-columns:1fr; }
  .al-sub { flex-direction:column; }
  .al-sub input { width:100%; }
}

/* ---- single article ----------------------------------------------------- */
.al-byline { display:flex; align-items:center; gap:18px; margin-top:44px; }
.al-byline__av { width:40px; height:40px; border-radius:50%; background:#EAF1FB;
  color:#1263C3; font-family:var(--al-sans); font-weight:700; font-size:13px;
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.al-byline__n { font-family:var(--al-sans); font-weight:600; font-size:15px;
  color:#232020; margin:0 0 4px; }
.al-byline__m { font-family:var(--al-sans); font-size:14px; color:#7A756B; margin:0; }

.al-article { display:grid; grid-template-columns:304px 1fr; gap:112px; align-items:start; }
.al-toc { background:#FBFAF7; border:1px solid #E4E0D8; border-radius:14px; padding:23px;
  position:sticky; top:24px; }
.al-toc__k { font-family:var(--al-sans); font-weight:700; font-size:11px; letter-spacing:.66px;
  text-transform:uppercase; color:#7A756B; margin:0 0 20px; }
.al-toc a { display:block; font-family:var(--al-sans); font-weight:500; font-size:14px;
  line-height:1.5; color:#7A756B!important; text-decoration:none!important; margin-bottom:17px; }
.al-toc a:first-of-type, .al-toc a:hover { color:#1263C3!important; }
.al-toc a:last-child { margin-bottom:0; }

.al-body h2 { font-family:var(--al-serif); font-weight:700; font-size:30px; line-height:1.25;
  letter-spacing:-.3px; color:#232020; margin:48px 0 22px; }
.al-body h2:first-child { margin-top:0; }
.al-body p { font-family:var(--al-sans); font-size:17px; line-height:1.78;
  color:#7A756B; margin:0 0 26px; }
.al-pull { border-left:3px solid #1263C3; padding-left:40px; margin:44px 0; }
.al-pull p { font-family:var(--al-serif); font-size:24px; line-height:1.5;
  letter-spacing:-.12px; color:#232020; margin:0; }

/* Everything the WordPress editor can emit, styled by element inside .al-body.
   Added 2026-09-24. The Figma reference page hand-built its article, so only h2
   and p were ever covered; a real post also has headings, lists, quotes,
   tables and images, and an author should not have to remember class names for
   any of it. The Theme Builder Post Content module carries .al-body, and
   anything written in the editor is styled by being written. */
.al-body h3 { font-family:var(--al-serif); font-weight:700; font-size:22px;
  line-height:1.3; letter-spacing:-.2px; color:#232020; margin:38px 0 16px; }
.al-body h4 { font-family:var(--al-sans); font-weight:700; font-size:16px;
  letter-spacing:.2px; color:#232020; margin:32px 0 12px; }
.al-body a { color:#1263C3; text-decoration:underline; text-underline-offset:2px; }
.al-body strong { color:#232020; font-weight:600; }
.al-body ul, .al-body ol { margin:0 0 26px; padding-left:22px; }
.al-body li { font-family:var(--al-sans); font-size:17px; line-height:1.78;
  color:#7A756B; margin-bottom:10px; }
.al-body li::marker { color:#1263C3; }
.al-body blockquote { border-left:3px solid #1263C3; padding:2px 0 2px 34px;
  margin:40px 0; }
.al-body blockquote p { font-family:var(--al-serif); font-size:23px;
  line-height:1.5; letter-spacing:-.12px; color:#232020; margin:0; }
.al-body img, .al-body figure img { display:block; width:100%; height:auto;
  border-radius:16px; margin:8px 0; }
.al-body figure { margin:38px 0; }
.al-body figcaption { font-family:var(--al-sans); font-size:13.5px;
  line-height:1.5; color:#7A756B; margin-top:12px; }
.al-body table { width:100%; border-collapse:collapse; margin:34px 0;
  font-family:var(--al-sans); font-size:15px; }
.al-body th { text-align:left; font-weight:600; font-size:11px; letter-spacing:.8px;
  text-transform:uppercase; color:#7A756B; border-bottom:1px solid #E4E0D8;
  padding:0 16px 12px 0; }
.al-body td { color:#4A463F; line-height:1.6; border-bottom:1px solid #E4E0D8;
  padding:14px 16px 14px 0; vertical-align:top; }
.al-body hr { border:0; border-top:1px solid #E4E0D8; margin:44px 0; }
.al-body > *:first-child { margin-top:0; }
.al-body > *:last-child { margin-bottom:0; }
@media (max-width:1100px) {
  .al-article { grid-template-columns:1fr; gap:40px; }
  .al-toc { position:static; }
  .al-body h2 { font-size:24px; }
  .al-pull { padding-left:24px; }
  .al-pull p { font-size:20px; }
}
@media (max-width:720px) {
  /* 15 of the 48 articles carry a 4 or 5 column comparison table. A table
     cannot reflow, so at 390px the cells hold their minimum width, the table
     runs to 422px inside a 350px column, and the WHOLE PAGE gains horizontal
     scroll: measured on what-is-alpenol 2026-10-06, scrollWidth 442 against a
     390 viewport. Letting the table scroll inside its own box keeps it
     readable by swiping and leaves the page still. overflow-x on a table needs
     display:block to take effect, which drops the table formatting context,
     so the inner table element has to be re-widened per row. */
  .al-body table { display:block; width:100%; overflow-x:auto;
    -webkit-overflow-scrolling:touch; }
  .al-body thead, .al-body tbody { display:table; width:100%;
    min-width:max-content; }
  .al-body th, .al-body td { padding-right:14px; }
  .al-body td { font-size:14px; }
}

/* ---- fabric card: swatch + the grades that run on it -------------------- */
.al-fabgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.al-fab { border:1px solid #E4E0D8; border-radius:16px; background:#FFFFFF;
  overflow:hidden; display:flex; flex-direction:column; }
.al-fab__m { line-height:0; }
.al-fab__m .al-ph, .al-fab__m .al-img { border-radius:0; width:100%; height:190px; }
.al-fab__b { padding:26px 26px 28px; display:flex; flex-direction:column; flex:1; }
.al-fab__t { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-size:26px; font-weight:700; color:#232020;
  margin:0; letter-spacing:-.4px; }
.al-fab__d { font-size:15px; line-height:1.55; color:#4A463F; margin:10px 0 0; }
.al-fab__gs { margin-top:20px; display:flex; flex-direction:column; gap:12px; }
.al-fab__g { border-top:1px solid #E4E0D8; padding-top:14px; }
.al-fab__code { display:inline-block; font-size:12px; font-weight:700;
  letter-spacing:.9px; color:#1263C3; background:#EAF1FB; border-radius:3px;
  padding:4px 9px; margin-bottom:10px; }
.al-fab__spec { display:block; font-size:13.5px; line-height:1.5; color:#4A463F;
  margin-top:4px; }
.al-fab__spec em { display:inline-block; min-width:92px; font-style:normal;
  font-size:11px; font-weight:600; letter-spacing:.7px; text-transform:uppercase;
  color:#7A756B; }
.al-fab__note { margin:18px 0 0; padding:14px 16px; border-radius:4px;
  background:#E9F7EE; font-size:13.5px; line-height:1.55; color:#4A463F; }

/* ---- spec card: one named grade on a product page ----------------------- */
.al-spcgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.al-spcgrid--1 { grid-template-columns:1fr; max-width:660px; }
.al-spc { border:1px solid #E4E0D8; border-radius:16px; background:#FFFFFF;
  padding:30px 30px 32px; }
.al-spc__h { border-bottom:1px solid #E4E0D8; padding-bottom:18px; margin-bottom:6px; }
.al-spc__code { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-size:28px; font-weight:700; color:#232020;
  letter-spacing:-.5px; }
.al-spc__claim { margin:8px 0 0; font-size:13px; font-weight:600; color:#009E4A;
  letter-spacing:.2px; }
.al-spc__r { display:grid; grid-template-columns:132px 1fr; gap:16px;
  padding:13px 0; border-bottom:1px solid #E4E0D8; }
.al-spc__r:last-of-type { border-bottom:0; }
.al-spc__k { font-size:11px; font-weight:600; letter-spacing:.8px;
  text-transform:uppercase; color:#7A756B; padding-top:2px; }
.al-spc__v { font-size:14.5px; line-height:1.55; color:#232020; }
.al-spc__l { margin:16px 0 0; padding:0 0 0 18px; }
.al-spc__l li { font-size:14px; line-height:1.6; color:#4A463F; margin-top:7px; }

/* The advantages list is reused inside the dark band on the product pages.
   Without this it inherits the card colour and lands at 1.72:1 on ink, which
   is unreadable. Caught on a rendered page, not in review. */
.al-sec--ink .al-spc__l li { color:rgba(255,255,255,.82); }
.al-sec--ink .al-spc__l li::marker { color:rgba(255,255,255,.45); }

@media (max-width:980px) {
  .al-fabgrid, .al-spcgrid { grid-template-columns:1fr; }
  .al-spc__r { grid-template-columns:1fr; gap:4px; }
  .al-sec--ink .al-spc__l { column-count:1 !important; }
}

/* ---- Master Post -------------------------------------------------------- */
.al-ptitle h1 { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:700; font-size:52px;
  line-height:1.1; letter-spacing:-1.04px; color:#232020; max-width:900px;
  margin:22px 0 0; }
/* The Master Post template has Source Serif 4 saved on its Post Title module,
   and Divi prints that as inline critical CSS at a specificity this sheet
   cannot beat without matching it. The site moved to Open Sans on 2026-09-30,
   so post headings were the last serif left. The permanent fix is to change
   the font on that module in the Theme Builder, which also stops Divi loading
   the Source Serif webfont nothing else uses. Until then, this. */
.al-ptitle h1.entry-title,
.al-ptitle .et_pb_title_container h1.entry-title {
  font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif!important; }
.al-peyebrow { margin-bottom:0; }
.al-pexcerpt p { font-size:19px; line-height:1.6; margin:26px 0 0;
  max-width:700px; color:#7A756B; }
.al-pbyline { margin-top:6px; }
.al-pfeatwrap { margin-top:8px; }
.al-pfeat img { width:100%; height:auto; max-height:460px; object-fit:cover;
  border-radius:16px; display:block; }
.al-body { max-width:760px; }

/* Divi's blog module, restyled as the article cards the design uses. */
.al-relgrid .et_pb_salvattore_content { display:grid;
  grid-template-columns:repeat(3,1fr); gap:28px; margin-top:38px; }
.al-relgrid .et_pb_salvattore_content .column { display:contents; }
.al-relgrid .et_pb_post { margin:0!important; flex-direction:column; padding:0; border:1px solid #E4E0D8;
  border-radius:16px; background:#FFFFFF; overflow:hidden;
  display:flex; flex-direction:column; }
.al-relgrid .et_pb_image_container { margin:0; line-height:0; }
.al-relgrid .et_pb_image_container img { width:100%; height:180px;
  object-fit:cover; border-radius:0; display:block; }
.al-relgrid .entry-title { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:700; font-size:19px;
  line-height:1.32; letter-spacing:-.2px; padding:22px 22px 0; margin:0; }
.al-relgrid .entry-title a { color:#232020; text-decoration:none; }
.al-relgrid .entry-title a:hover { color:#1263C3; }
.al-relgrid .post-content { padding:10px 22px 22px; }
.al-relgrid .post-content p { font-size:14.5px; line-height:1.6; color:#7A756B;
  margin:0; }
.al-relgrid .published, .al-relgrid .post-meta { font-size:12.5px;
  color:#7A756B; padding:0 22px; }
.al-relgrid .pagination { display:none; }

/* ---- Master Blog (archive) ---------------------------------------------- */
.al-bloggrid .et_pb_salvattore_content { display:grid;
  grid-template-columns:repeat(3,1fr); gap:28px; }
.al-bloggrid .et_pb_salvattore_content .column { display:contents; }
.al-bloggrid .et_pb_post { margin:0!important; flex-direction:column; border:1px solid #E4E0D8;
  border-radius:16px; background:#FFFFFF; overflow:hidden;
  display:flex; flex-direction:column; }
.al-bloggrid .et_pb_image_container { margin:0; line-height:0; }
.al-bloggrid .et_pb_image_container img { width:100%; height:200px;
  object-fit:cover; border-radius:0; display:block; }
.al-bloggrid .entry-title { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:700; font-size:20px;
  line-height:1.32; letter-spacing:-.2px; padding:22px 24px 0; margin:0; }
.al-bloggrid .entry-title a { color:#232020; text-decoration:none; }
.al-bloggrid .entry-title a:hover { color:#1263C3; }
.al-bloggrid .post-content { padding:10px 24px 24px; }
.al-bloggrid .post-content p { font-size:14.5px; line-height:1.62;
  color:#7A756B; margin:0; }
.al-bloggrid .post-meta { font-size:12.5px; color:#7A756B; padding:12px 24px 0; }
.al-bloggrid .post-meta a { color:#1263C3; text-decoration:none; }
.al-bloggrid .pagination { margin-top:36px; }

/* A post with no featured image must not collapse the card. */
.al-bloggrid .et_pb_post:not(.has-post-thumbnail) .entry-title,
.al-relgrid .et_pb_post:not(.has-post-thumbnail) .entry-title {
  padding-top:26px; border-top:4px solid #1263C3; }

@media (max-width:980px) {
  .al-relgrid .et_pb_salvattore_content,
  .al-bloggrid .et_pb_salvattore_content { grid-template-columns:1fr; }
  .al-ptitle h1 { font-size:36px; letter-spacing:-.7px; }
}

/* ---- customer story hero ----------------------------------------------- */
.al-cshero { max-width:860px; }
.al-cshero__mark { width:132px; height:64px; background:#FFFFFF;
  border:1px solid #E4E0D8; border-radius:4px; display:flex;
  align-items:center; justify-content:center; padding:10px 14px;
  margin-bottom:30px; }
.al-cshero__mark img { max-width:100%; max-height:100%; width:auto;
  height:auto; object-fit:contain; display:block; }
.al-cshero__t { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:700; font-size:52px;
  line-height:1.08; letter-spacing:-1.1px; color:#232020; margin:20px 0 0; }
.al-cshero__s { font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:19px; line-height:1.6;
  color:#7A756B; margin:26px 0 0; max-width:700px; }

.al-csstats { display:flex; flex-wrap:wrap; gap:0; margin-top:48px;
  border-top:1px solid #E4E0D8; padding-top:32px; }
.al-csstat { padding-right:56px; margin-right:56px;
  border-right:1px solid #E4E0D8; }
.al-csstat:last-child { border-right:0; margin-right:0; padding-right:0; }
.al-csstat__v { display:block; font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:700;
  font-size:46px; line-height:1; letter-spacing:-1.2px; color:#1263C3; }
.al-csstat__l { display:block; font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:14px;
  line-height:1.45; color:#4A463F; margin-top:12px; max-width:190px; }
.al-csstat__n { display:block; font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:12px;
  color:#7A756B; margin-top:6px; max-width:190px; }

/* ---- challenge / solution / result -------------------------------------- */
.al-csrgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px;
  margin-top:44px; }
.al-csr { border-top:3px solid #1263C3; padding-top:22px; }
.al-csr:nth-child(2) { border-top-color:#7A756B; }
.al-csr:nth-child(3) { border-top-color:#009E4A; }
.al-csr__k { display:block; font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.9px; text-transform:uppercase; color:#7A756B;
  margin-bottom:14px; }
.al-csr__b { font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:15.5px; line-height:1.65;
  color:#4A463F; margin:0; }

/* ---- pull quote ---------------------------------------------------------- */
.al-csq { margin:0; padding:44px 0 0; }
.al-csq__q { font-family:'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:400; font-size:27px;
  line-height:1.45; letter-spacing:-.3px; color:#232020; margin:0;
  border-left:3px solid #1263C3; padding-left:36px; max-width:840px; }
.al-csq__a { display:flex; flex-direction:column; gap:3px;
  margin:24px 0 0 39px; }
.al-csq__n { font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-weight:600; font-size:15px; color:#232020; }
.al-csq__r { font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:14px; color:#7A756B; }

/* ---- about panel --------------------------------------------------------- */
.al-csabout { background:#FBFAF7; border:1px solid #E4E0D8;
  border-radius:16px; padding:38px 40px 34px; }
.al-csabout__b { font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:15.5px; line-height:1.7;
  color:#4A463F; margin:16px 0 0; max-width:760px; }
.al-csfacts { display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  margin-top:30px; border-top:1px solid #E4E0D8; padding-top:26px; }
.al-csf { min-width:0; }
.al-csf__k { display:block; font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:11px; font-weight:600;
  letter-spacing:.8px; text-transform:uppercase; color:#7A756B; }
.al-csf__v { display:block; font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif; font-size:15px; color:#232020;
  margin-top:7px; line-height:1.5; }

@media (max-width:980px) {
  .al-cshero__t { font-size:34px; letter-spacing:-.7px; }
  .al-csrgrid, .al-csfacts { grid-template-columns:1fr; }
  .al-csstat { padding-right:0; margin-right:0; border-right:0;
    border-bottom:1px solid #E4E0D8; padding-bottom:20px; margin-bottom:20px;
    width:100%; }
  .al-csstat:last-child { border-bottom:0; }
  .al-csstat__l, .al-csstat__n { max-width:none; }
}

.al-mktcard__soon { font-family:var(--al-sans); font-size:13px; color:#7A756B;
  font-style:italic; }
.al-note { font-family:var(--al-sans); font-size:14px; color:#7A756B; margin:0; }

.al-img { display:block; width:100%; height:auto; max-width:100%; }
.al-mill--real { background:#fff; border:1px solid #E4E0D8; border-style:solid;
  padding:8px 12px; gap:10px; }
.al-mill--real img { max-width:100%; max-height:100%; width:auto; height:auto;
  object-fit:contain; filter:grayscale(1); opacity:.72; transition:.2s ease; }
.al-mill--real:hover img { filter:grayscale(0); opacity:1; }
/* Mark + name, the name as text so one rule sets it for every mill.
   The selector has to out-specify ".al-mill--real img" above, which sets
   max-width:100% and would otherwise let the mark fill the card. */
.al-mill--real .al-mill__m { flex:0 0 42px; width:42px; height:42px;
  max-width:42px; max-height:42px; }
.al-mill__n { flex:1 1 auto; min-width:0; font-family:var(--al-sans);
  font-weight:700; font-size:13px; line-height:1.3; letter-spacing:-.1px;
  color:#009E4A; text-align:left; opacity:.78;
  transition:opacity .2s ease; }
.al-mill--real:hover .al-mill__n { opacity:1; }
