/** Shopify CDN: Minification failed

Line 415:3 Unexpected "("

**/
/* =========================================================
   clone-ferosi-001 — Ferosi homepage redesign styles
   Design source: ferosi-homepage-redesign (Claude Design export)
   Namespace: .fer-* / --fer-* (isolated from Debutify + carme clone pack)
   Scoped via #shopify-section-* and .fer-root so the theme shell stays untouched.
   Per-section colours are injected as CSS custom properties in each section's
   inline <style> (e.g. --fer-accent), consumed here with design-matching fallbacks.
   ========================================================= */

/* ---- design tokens (scoped to .fer-root so globals aren't poisoned) ---- */
.fer-root{
  --fer-blue:#1377FF;
  --fer-blue-hover:#0F5FD6;
  --fer-accent:#1377FF;          /* overridable per section */
  --fer-ink:#0E1526;
  --fer-body:#5B6472;
  --fer-muted:#9AA2AE;
  --fer-bg:#F5F7FA;
  --fer-soft:#E8F1FF;
  --fer-surface:#ffffff;
  --fer-hair:rgba(14,21,38,0.07);
  --fer-hair-2:rgba(14,21,38,0.14);
  --fer-amber:#F5A623;
  --fer-tp:#00B67A;
  --fer-container:1260px;
  --fer-pad:clamp(20px,5vw,48px);
  --fer-radius:22px;
  --fer-ff:'Archivo',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

/* ---- scoped reset (only inside .fer-root containers) ---- */
.fer-root, .fer-root *{ box-sizing:border-box; }
.fer-root{
  font-family:var(--fer-ff);
  color:var(--fer-ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.6;
}
.fer-root img{ max-width:100%; display:block; }
.fer-root a{ color:inherit; text-decoration:none; transition:color .18s ease; }
.fer-root button{ font-family:inherit; cursor:pointer; }
.fer-root svg{ display:block; }

/* ---- shared layout ---- */
.fer-wrap{ max-width:var(--fer-container); margin:0 auto; padding:0 var(--fer-pad); }
.fer-ph{ display:grid; place-items:center; background:linear-gradient(135deg,#eef3fb,#dde7f6); color:#9aafce; }
.fer-ph svg{ width:44px; height:44px; }
.fer-center{ text-align:center; margin-left:auto; margin-right:auto; }

/* ---- eyebrow ---- */
.fer-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12px; font-weight:700; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--fer-accent);
}
.fer-eyebrow__line{ width:22px; height:2px; background:var(--fer-accent); display:inline-block; border-radius:2px; }
.fer-center .fer-eyebrow{ justify-content:center; }

/* ---- headings (Archivo italic uppercase, two-tone via .ac) ---- */
.fer-h1{
  font-family:var(--fer-ff); font-style:italic; font-weight:900; text-transform:uppercase;
  font-size:clamp(42px,6.2vw,76px); line-height:0.96; letter-spacing:-0.025em;
  color:var(--fer-ink); margin:20px 0 0;
}
.fer-h2{
  font-family:var(--fer-ff); font-style:italic; font-weight:800; text-transform:uppercase;
  font-size:clamp(30px,4.4vw,52px); line-height:1.0; letter-spacing:-0.02em;
  color:var(--fer-ink); margin:16px 0 0;
}
.fer-h3{ font-size:19px; font-weight:700; margin:0; color:var(--fer-ink); }
.fer-root .ac{ color:var(--fer-accent); }
.fer-lead{ font-size:clamp(16px,1.35vw,19px); line-height:1.62; color:var(--fer-body); margin:16px 0 0; }

/* ---- buttons ---- */
.fer-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-weight:700; font-size:14px; letter-spacing:0.03em; text-transform:uppercase;
  padding:16px 28px; border-radius:999px; border:1px solid transparent; cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.fer-btn--primary{ background:var(--fer-accent); color:#fff; box-shadow:0 14px 30px -10px rgba(19,119,255,0.55); }
.fer-btn--primary:hover{ background:var(--fer-blue-hover); color:#fff; }
.fer-btn--ghost{ background:transparent; color:var(--fer-ink); border-color:var(--fer-hair-2); }
.fer-btn--ghost:hover{ border-color:var(--fer-ink); background:#fff; }
.fer-btn svg{ width:17px; height:17px; }

/* ---- inline arrow link ---- */
.fer-link{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14.5px; color:var(--fer-accent); }
.fer-link svg{ width:16px; height:16px; }

/* ---- stars ---- */
.fer-stars{ color:var(--fer-amber); letter-spacing:1px; }

/* keyframes */
@keyframes fer-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@keyframes fer-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }

/* =========================================================
   1. ANNOUNCEMENT (marquee)
   ========================================================= */
.fer-anno{ overflow:hidden; background:var(--fer-anno-bg,var(--fer-blue)); color:var(--fer-anno-fg,#fff); }
.fer-anno__track{ display:inline-flex; white-space:nowrap; animation:fer-marquee var(--fer-anno-speed,34s) linear infinite; }
.fer-anno__track:hover{ animation-play-state:paused; }
.fer-anno__group{
  display:inline-flex; align-items:center; padding:9px 0;
  font-size:var(--fer-anno-size,12.5px); font-weight:600; letter-spacing:0.09em; text-transform:uppercase;
}
.fer-anno--nocaps .fer-anno__group{ text-transform:none; }
.fer-anno__sep{ padding:0 26px; opacity:0.55; }

/* =========================================================
   2. HEADER
   ========================================================= */
.fer-hdr{ background:var(--fer-hdr-bg,rgba(245,247,250,0.82)); border-bottom:1px solid var(--fer-hair); }
.fer-hdr--sticky{ position:sticky; top:0; z-index:50; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.fer-hdr__bar{
  max-width:var(--fer-container); margin:0 auto; padding:0 var(--fer-pad); height:74px;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
}
.fer-hdr__left{ display:flex; align-items:center; }
.fer-hdr__logo{ justify-self:center; font-family:var(--fer-ff); font-weight:800; font-size:clamp(23px,5vw,27px); letter-spacing:-0.035em; color:var(--fer-ink); }
.fer-hdr__logo img{ max-height:34px; width:auto; }
.fer-hdr__right{ display:flex; justify-content:flex-end; align-items:center; }
.fer-nav{ display:flex; align-items:center; gap:30px; }
.fer-nav__link{ font-size:14.5px; font-weight:600; color:var(--fer-ink); }
.fer-nav__link:hover{ color:var(--fer-accent); }
.fer-nav__link--active{ font-weight:700; color:var(--fer-accent); }
.fer-hdr__util{ display:flex; align-items:center; gap:20px; }
.fer-hdr__track{ font-size:13px; font-weight:600; color:var(--fer-body); }
.fer-hdr__track:hover{ color:var(--fer-accent); }
.fer-icon{ display:inline-flex; color:var(--fer-ink); }
.fer-icon:hover{ color:var(--fer-accent); }
.fer-icon svg{ width:20px; height:20px; }
.fer-cart{ position:relative; display:inline-flex; color:var(--fer-ink); }
.fer-cart__count{
  position:absolute; top:-7px; right:-9px; background:var(--fer-accent); color:#fff;
  font-size:10px; font-weight:800; min-width:16px; height:16px; border-radius:9px;
  display:flex; align-items:center; justify-content:center; padding:0 4px;
}
.fer-burger{ display:none; align-items:center; justify-content:center; width:42px; height:42px; margin-left:-9px; background:transparent; border:none; color:var(--fer-ink); }
.fer-burger svg{ width:24px; height:24px; }
.fer-hdr__mobnav{ display:none; }
.fer-hdr__mobile{ display:none; border-top:1px solid var(--fer-hair); background:rgba(245,247,250,0.98); }
.fer-hdr.is-open .fer-hdr__mobile{ display:block; }
.fer-hdr__mobile-inner{ max-width:var(--fer-container); margin:0 auto; padding:6px var(--fer-pad) 18px; display:flex; flex-direction:column; }
.fer-hdr__mobile-link{ padding:15px 2px; font-size:16px; font-weight:600; color:var(--fer-ink); border-bottom:1px solid var(--fer-hair); }
.fer-hdr__mobile-link:last-child{ border-bottom:none; }
.fer-hdr__mobile-link--active{ font-weight:700; color:var(--fer-accent); }

/* =========================================================
   3. HERO
   ========================================================= */
.fer-hero{ background:var(--fer-bg); padding:clamp(30px,4vw,60px) 0 clamp(20px,3vw,36px); }
.fer-hero__grid{
  max-width:var(--fer-container); margin:0 auto; padding:0 var(--fer-pad);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));
  gap:clamp(36px,5vw,76px); align-items:center;
}
.fer-hero__media{ order:1; }
.fer-hero--imgleft .fer-hero__media{ order:-1; }
.fer-hero__price{ display:flex; align-items:baseline; gap:12px; margin-top:28px; }
.fer-hero__now{ font-size:32px; font-weight:800; letter-spacing:-0.02em; color:var(--fer-ink); }
.fer-hero__was{ text-decoration:line-through; color:var(--fer-muted); font-size:18px; font-weight:500; }
.fer-hero__off{ background:var(--fer-soft); color:var(--fer-accent); font-size:13px; font-weight:800; padding:5px 10px; border-radius:8px; }
.fer-hero__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:26px; }
.fer-hero__trust{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:30px; color:var(--fer-body); font-size:13.5px; }
.fer-hero__trust-item{ display:inline-flex; align-items:center; gap:8px; }
.fer-hero__trust-item strong{ color:var(--fer-ink); }
.fer-hero__trust-item svg{ width:18px; height:18px; }
.fer-hero__divider{ width:1px; height:16px; background:var(--fer-hair-2); }
.fer-hero__panel{
  position:relative; border-radius:30px;
  background:var(--fer-hero-panel,radial-gradient(120% 110% at 50% 22%,#D9EAFF 0%,#EAF2FC 52%,#F2F6FB 100%));
  padding:clamp(24px,4vw,48px); aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
  overflow:hidden; box-shadow:0 40px 90px -34px rgba(19,119,255,0.42);
}
.fer-hero__glow{ position:absolute; width:66%; height:66%; border-radius:50%; background:radial-gradient(circle,rgba(19,119,255,0.20),transparent 70%); }
.fer-hero__img{ position:relative; width:80%; max-width:420px; filter:drop-shadow(0 34px 44px rgba(14,21,38,0.30)); animation:fer-float 6.5s ease-in-out infinite; }
.fer-hero__img.fer-ph{ width:80%; aspect-ratio:1/1; border-radius:20px; }
.fer-hero__ribbon{
  position:absolute; top:24px; right:24px; background:var(--fer-accent); color:#fff; font-weight:800;
  font-size:15px; width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 26px rgba(19,119,255,0.45); text-align:center; line-height:1.1;
}
.fer-hero__sold{
  position:absolute; left:24px; bottom:24px; background:#fff; border-radius:14px; padding:10px 14px;
  display:flex; align-items:center; gap:9px; box-shadow:0 12px 34px rgba(14,21,38,0.14);
}
.fer-hero__sold span:last-child{ font-size:12.5px; font-weight:700; color:var(--fer-ink); }
.fer-hero__sold .fer-stars{ font-size:13px; }

/* =========================================================
   4. USP BAR
   ========================================================= */
.fer-usps-sec{ background:var(--fer-bg); padding:8px 0 0; }
.fer-usps{
  background:var(--fer-usp-bg,#fff); border:1px solid var(--fer-hair); border-radius:var(--fer-radius);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); overflow:hidden;
  box-shadow:0 1px 2px rgba(14,21,38,0.04),0 24px 50px -34px rgba(14,21,38,0.16);
}
.fer-usp{ padding:24px 26px; display:flex; gap:14px; align-items:flex-start; border-right:1px solid var(--fer-hair); }
.fer-usp:last-child{ border-right:none; }
.fer-usp__ic{ flex-shrink:0; margin-top:1px; color:var(--fer-accent); }
.fer-usp__ic svg{ width:22px; height:22px; }
.fer-usp__title{ font-size:15px; font-weight:700; color:var(--fer-ink); }
.fer-usp__sub{ font-size:13px; color:var(--fer-body); margin-top:2px; }

/* =========================================================
   5. WHY
   ========================================================= */
.fer-why{ background:var(--fer-bg); padding:clamp(72px,9vw,132px) 0; }
.fer-why__grid{
  max-width:var(--fer-container); margin:0 auto; padding:0 var(--fer-pad);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));
  gap:clamp(36px,5vw,76px); align-items:center;
}
.fer-why__media{ position:relative; aspect-ratio:4/5; border-radius:26px; overflow:hidden; box-shadow:0 30px 70px -30px rgba(14,21,38,0.28); background:#EAF0F7; order:-1; }
.fer-why--imgright .fer-why__media{ order:1; }
.fer-why__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fer-why__media .fer-ph{ position:absolute; inset:0; }
.fer-why__list{ display:flex; flex-direction:column; gap:14px; margin-top:26px; }
.fer-why__item{ display:flex; gap:12px; align-items:flex-start; }
.fer-why__tick{ flex-shrink:0; width:24px; height:24px; border-radius:50%; background:var(--fer-soft); display:flex; align-items:center; justify-content:center; margin-top:1px; color:var(--fer-accent); }
.fer-why__tick svg{ width:14px; height:14px; }
.fer-why__item span:last-child{ font-size:15.5px; line-height:1.5; color:var(--fer-ink); }
.fer-why .fer-link{ margin-top:28px; }

/* =========================================================
   6. STEPS
   ========================================================= */
.fer-steps{ padding:clamp(72px,9vw,128px) 0; background:var(--fer-steps-bg,linear-gradient(180deg,#EFF4FC 0%,#F5F7FA 100%)); border-top:1px solid var(--fer-hair); }
.fer-steps__head{ text-align:center; max-width:640px; margin:0 auto; }
.fer-steps__head .fer-eyebrow{ justify-content:center; }
.fer-steps__intro{ font-size:17px; line-height:1.6; color:var(--fer-body); margin:16px 0 0; }
.fer-steps__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; margin-top:clamp(40px,5vw,64px); }
.fer-step{ background:#fff; border:1px solid var(--fer-hair); border-radius:var(--fer-radius); padding:34px 32px; box-shadow:0 1px 2px rgba(14,21,38,0.04); }
.fer-step__num{ font-family:var(--fer-ff); font-style:italic; font-weight:900; font-size:46px; color:var(--fer-accent); line-height:1; letter-spacing:-0.03em; }
.fer-step__title{ font-size:19px; font-weight:700; margin:18px 0 9px; color:var(--fer-ink); }
.fer-step__body{ font-size:15px; line-height:1.6; color:var(--fer-body); margin:0; }
.fer-steps__cta{ text-align:center; margin-top:clamp(36px,5vw,52px); }

/* =========================================================
   7. PRODUCTS
   ========================================================= */
.fer-prods{ background:var(--fer-bg); padding:clamp(72px,9vw,132px) 0; }
.fer-prods__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:clamp(32px,4vw,48px); }
.fer-prods__viewall{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14.5px; color:var(--fer-ink); }
.fer-prods__viewall:hover{ color:var(--fer-accent); }
.fer-prods__viewall svg{ width:16px; height:16px; }
.fer-prods__grid{ display:grid; gap:24px; grid-template-columns:repeat(2,1fr); }
.fer-card{ background:#fff; border:1px solid rgba(14,21,38,0.06); border-radius:var(--fer-radius); overflow:hidden; box-shadow:0 1px 2px rgba(14,21,38,0.04); transition:transform .25s ease,box-shadow .25s ease; display:block; }
.fer-card:hover{ transform:translateY(-6px); box-shadow:0 26px 54px -22px rgba(14,21,38,0.20); }
.fer-card__media{ position:relative; aspect-ratio:1/1; background:linear-gradient(160deg,#EAF2FC,#EEF3FA); }
.fer-card__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:22px; }
.fer-card__badge{ position:absolute; top:12px; left:12px; z-index:2; background:var(--fer-badge-bg,var(--fer-accent)); color:var(--fer-badge-fg,#fff); font-size:12px; font-weight:800; padding:5px 9px; border-radius:8px; pointer-events:none; }
.fer-card__wish{ position:absolute; top:12px; right:12px; z-index:2; width:32px; height:32px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; color:var(--fer-ink); box-shadow:0 4px 12px rgba(14,21,38,0.10); }
.fer-card__wish svg{ width:16px; height:16px; }
.fer-card__body{ padding:16px 18px 20px; }
.fer-card__rating{ color:var(--fer-amber); font-size:12px; letter-spacing:0.5px; }
.fer-card__rating span{ color:var(--fer-body); }
.fer-card__title{ font-size:15.5px; font-weight:600; margin:9px 0 10px; line-height:1.35; color:var(--fer-ink); }
.fer-card__price{ display:flex; align-items:baseline; gap:8px; }
.fer-card__now{ font-size:17px; font-weight:800; color:var(--fer-price,var(--fer-accent)); }
.fer-card__was{ text-decoration:line-through; color:var(--fer-muted); font-size:13px; }

/* =========================================================
   8. REVIEWS
   ========================================================= */
.fer-reviews{ background:var(--fer-reviews-bg,#fff); padding:clamp(72px,9vw,128px) 0; border-top:1px solid var(--fer-hair); border-bottom:1px solid var(--fer-hair); }
.fer-reviews__head{ text-align:center; max-width:680px; margin:0 auto clamp(40px,5vw,60px); }
.fer-reviews__head .fer-eyebrow{ justify-content:center; }
.fer-reviews__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(288px,1fr)); gap:22px; }
.fer-review{ border:1px solid rgba(14,21,38,0.08); border-radius:var(--fer-radius); padding:30px; background:var(--fer-review-bg,#F8FAFC); }
.fer-review__stars{ color:var(--fer-star,var(--fer-amber)); font-size:15px; letter-spacing:1px; }
.fer-review__text{ font-size:17px; line-height:1.55; margin:16px 0 24px; color:var(--fer-ink); }
.fer-review__who{ display:flex; align-items:center; gap:12px; }
.fer-review__avatar{ width:42px; height:42px; border-radius:50%; background:var(--fer-soft); color:var(--fer-accent); font-weight:800; font-size:15px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.fer-review__name{ font-size:14px; font-weight:700; color:var(--fer-ink); }
.fer-review__sub{ font-size:12.5px; color:var(--fer-body); }

/* =========================================================
   9. TRUSTPILOT
   ========================================================= */
.fer-tp{ background:var(--fer-bg); padding:clamp(64px,8vw,104px) 0; }
.fer-tp__card{
  background:#fff; border:1px solid var(--fer-hair); border-radius:24px; padding:clamp(30px,4vw,52px);
  box-shadow:0 1px 2px rgba(14,21,38,0.04),0 24px 50px -34px rgba(14,21,38,0.16);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:clamp(28px,4vw,56px); align-items:center;
}
.fer-tp__summary{ border-right:1px solid rgba(14,21,38,0.08); }
.fer-tp__logo{ display:inline-flex; align-items:center; gap:8px; margin-bottom:16px; }
.fer-tp__logo svg{ width:22px; height:22px; }
.fer-tp__logo span{ font-family:var(--fer-ff); font-weight:800; font-size:21px; letter-spacing:-0.02em; color:#191919; }
.fer-tp__stars{ position:relative; display:inline-flex; gap:5px; margin-bottom:16px; }
.fer-tp__stars-fill{ position:absolute; top:0; left:0; height:100%; overflow:hidden; display:inline-flex; gap:5px; white-space:nowrap; }
.fer-tp__sq{ width:34px; height:34px; border-radius:5px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.fer-tp__sq--bg{ background:#DCDCE6; }
.fer-tp__sq--fg{ background:var(--fer-tp); }
.fer-tp__sq svg{ width:21px; height:21px; }
.fer-tp__score{ font-size:15px; color:var(--fer-body); }
.fer-tp__score strong{ color:#191919; }
.fer-tp__link{ display:inline-flex; align-items:center; gap:7px; margin-top:18px; font-weight:700; font-size:14px; color:var(--fer-tp); }
.fer-tp__link svg{ width:15px; height:15px; }
.fer-tp__reviews{ display:flex; flex-direction:column; gap:20px; }
.fer-tp__review + .fer-tp__review{ border-top:1px solid rgba(14,21,38,0.08); padding-top:20px; }
.fer-tp__rev-stars{ display:flex; gap:3px; margin-bottom:10px; }
.fer-tp__rev-stars .fer-tp__sq{ width:20px; height:20px; border-radius:3px; background:var(--fer-tp); }
.fer-tp__rev-stars .fer-tp__sq svg{ width:13px; height:13px; }
.fer-tp__rev-text{ font-size:15px; line-height:1.5; color:var(--fer-ink); margin:0 0 8px; }
.fer-tp__rev-meta{ font-size:13px; color:var(--fer-body); display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }
.fer-tp__rev-meta strong{ color:var(--fer-ink); }
.fer-tp__verified{ color:var(--fer-tp); font-weight:700; display:inline-flex; align-items:center; gap:4px; }
.fer-tp__verified svg{ width:13px; height:13px; }

/* =========================================================
   10. GUARANTEE (service row)
   ========================================================= */
.fer-guar{ background:var(--fer-bg); padding:clamp(56px,7vw,96px) 0; }
.fer-guar__card{
  background:var(--fer-guar-bg,#fff); border:1px solid var(--fer-hair); border-radius:24px;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); overflow:hidden;
  box-shadow:0 1px 2px rgba(14,21,38,0.04);
}
.fer-guar__cell{ padding:38px 34px; text-align:center; border-right:1px solid var(--fer-hair); }
.fer-guar__cell:last-child{ border-right:none; }
.fer-guar__ic{ width:52px; height:52px; border-radius:50%; background:var(--fer-soft); display:inline-flex; align-items:center; justify-content:center; margin-bottom:16px; color:var(--fer-accent); }
.fer-guar__ic svg{ width:24px; height:24px; }
.fer-guar__title{ font-size:15px; font-weight:800; letter-spacing:0.04em; text-transform:uppercase; margin:0 0 8px; color:var(--fer-ink); }
.fer-guar__text{ font-size:14px; line-height:1.55; color:var(--fer-body); margin:0; }

/* =========================================================
   11. NEWSLETTER
   ========================================================= */
.fer-news{ background:var(--fer-bg); padding:0 0 clamp(72px,9vw,120px); }
.fer-news-sec--pt{ padding-top:clamp(56px,7vw,96px); }
.fer-news__panel{ position:relative; background:var(--fer-news-bg,var(--fer-blue)); border-radius:30px; padding:clamp(44px,6vw,80px) clamp(24px,5vw,48px); text-align:center; color:var(--fer-news-fg,#fff); overflow:hidden; }
.fer-news__blob{ position:absolute; border-radius:50%; background:rgba(255,255,255,0.10); }
.fer-news__blob--a{ top:-80px; right:-60px; width:280px; height:280px; }
.fer-news__blob--b{ bottom:-100px; left:-70px; width:320px; height:320px; background:rgba(255,255,255,0.08); }
.fer-news__inner{ position:relative; }
.fer-news__eyebrow{ font-size:12px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:rgba(255,255,255,0.8); }
.fer-news__title{ font-family:var(--fer-ff); font-style:italic; font-weight:800; text-transform:uppercase; font-size:clamp(28px,4.2vw,48px); line-height:1.02; letter-spacing:-0.02em; margin:14px 0 0; color:inherit; }
.fer-news__title .ac{ color:#fff; opacity:.85; }
.fer-news__body{ font-size:16.5px; line-height:1.55; color:rgba(255,255,255,0.88); max-width:34em; margin:16px auto 0; }
.fer-news__form{ margin:28px auto 0; max-width:460px; display:flex; gap:8px; background:#fff; padding:8px; border-radius:999px; box-shadow:0 20px 40px -18px rgba(0,0,0,0.35); }
.fer-news__input{ flex:1; min-width:0; border:none; background:transparent; padding:0 18px; font-size:15px; color:var(--fer-ink); outline:none; font-family:var(--fer-ff); }
.fer-news__input::placeholder{ color:var(--fer-muted); }
.fer-news__btn{ flex-shrink:0; background:var(--fer-ink); color:#fff; border:none; border-radius:999px; padding:14px 26px; font-weight:700; font-size:14px; letter-spacing:0.02em; }
.fer-news__btn:hover{ background:#1A2740; }
.fer-news__ok{ margin:28px auto 0; max-width:460px; background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.3); border-radius:999px; padding:16px 24px; font-size:15px; font-weight:600; display:flex; align-items:center; justify-content:center; gap:10px; }
.fer-news__ok svg{ width:18px; height:18px; }
.fer-news__err{ margin:14px auto 0; max-width:460px; color:#fff; font-size:13.5px; opacity:.9; }

/* =========================================================
   12. FOOTER
   ========================================================= */
.fer-foot{ background:var(--fer-foot-bg,#0E1526); color:rgba(255,255,255,0.72); padding:clamp(56px,7vw,88px) 0 32px; }
.fer-foot__grid{ max-width:var(--fer-container); margin:0 auto; padding:0 var(--fer-pad); display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:44px 40px; }
.fer-foot__wrap{ max-width:var(--fer-container); margin:0 auto; padding:0 var(--fer-pad); }
.fer-foot__brand{ min-width:220px; }
.fer-foot__logo{ font-family:var(--fer-ff); font-weight:800; font-size:26px; letter-spacing:-0.035em; color:#fff; }
.fer-foot__logo img{ max-height:34px; width:auto; }
.fer-foot__tag{ font-size:14.5px; line-height:1.6; margin:16px 0 18px; max-width:26em; }
.fer-foot__mail{ font-size:14px; color:rgba(255,255,255,0.72); display:inline-flex; align-items:center; gap:8px; }
.fer-foot__mail:hover{ color:#fff; }
.fer-foot__mail svg{ width:17px; height:17px; }
.fer-foot__socials{ display:flex; gap:12px; margin-top:22px; }
.fer-foot__soc{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.8); }
.fer-foot__soc:hover{ background:var(--fer-accent); border-color:var(--fer-accent); color:#fff; }
.fer-foot__soc svg{ width:18px; height:18px; }
.fer-foot__h4{ font-size:12.5px; font-weight:800; letter-spacing:0.12em; text-transform:uppercase; color:#fff; margin:0 0 16px; }
.fer-foot__links{ display:flex; flex-direction:column; gap:11px; font-size:14.5px; }
.fer-foot__links a{ color:rgba(255,255,255,0.72); }
.fer-foot__links a:hover{ color:#fff; }
.fer-foot__col p{ font-size:14px; line-height:1.6; margin:0 0 16px; }
.fer-foot__col .fer-link{ color:#fff; }
.fer-foot__col .fer-link:hover{ color:var(--fer-accent); }
.fer-foot__pay{ display:flex; flex-wrap:wrap; gap:8px; margin-top:44px; padding-top:28px; border-top:1px solid rgba(255,255,255,0.10); }
.fer-foot__badge{ font-size:11px; font-weight:700; letter-spacing:0.02em; color:rgba(255,255,255,0.82); background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.14); border-radius:6px; padding:6px 11px; }
.fer-foot__bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; margin-top:24px; font-size:12.5px; color:rgba(255,255,255,0.55); }
.fer-foot__legal{ display:flex; flex-wrap:wrap; gap:18px; }
.fer-foot__legal a{ color:rgba(255,255,255,0.55); }
.fer-foot__legal a:hover{ color:#fff; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:980px){
  .fer-usp{ border-right:none; border-bottom:1px solid var(--fer-hair); }
  .fer-usp:last-child{ border-bottom:none; }
  .fer-guar__cell{ border-right:none; border-bottom:1px solid var(--fer-hair); }
  .fer-guar__cell:last-child{ border-bottom:none; }
  .fer-tp__summary{ border-right:none; border-bottom:1px solid rgba(14,21,38,0.08); padding-bottom:28px; }
}
@media(min-width:821px){
  .fer-prods__grid{ grid-template-columns:repeat(var(--fer-cols,4),1fr); }
}
@media(max-width:820px){
  .fer-nav, .fer-hdr__util{ display:none; }
  .fer-burger, .fer-hdr__mobnav{ display:inline-flex; }
  .fer-hdr__mobnav{ display:flex; align-items:center; gap:18px; }
}
@media(max-width:520px){
  .fer-prods__grid{ grid-template-columns:1fr; }
  .fer-hero__now{ font-size:28px; }
}

   PAGES ADD-ON — page-hero, contact, faq, legal
   (Contact/FAQ/Beleid design; reuses .fer-root tokens)
   ========================================================= */

/* ---- page hero band ---- */
.fer-phero{ background:var(--fer-phero-bg,linear-gradient(180deg,#EFF4FC 0%,#F5F7FA 100%)); border-bottom:1px solid var(--fer-hair); padding:clamp(38px,6vw,68px) 0 clamp(30px,4vw,46px); }
.fer-phero__wrap{ max-width:var(--fer-phero-w,900px); margin:0 auto; padding:0 var(--fer-pad); }
.fer-phero__crumb{ font-size:13px; font-weight:600; color:var(--fer-body); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.fer-phero__crumb a{ color:var(--fer-body); }
.fer-phero__crumb a:hover{ color:var(--fer-accent); }
.fer-phero__crumb .sep{ opacity:0.5; }
.fer-phero__crumb .cur{ color:var(--fer-ink); }
.fer-phero__h1{ font-family:var(--fer-ff); font-style:italic; font-weight:900; text-transform:uppercase; font-size:clamp(32px,5.2vw,60px); line-height:0.98; letter-spacing:-0.025em; color:var(--fer-ink); margin:16px 0 0; }
.fer-phero__h1 .ac{ color:var(--fer-accent); }
.fer-phero__sub{ font-size:clamp(16px,1.3vw,18px); line-height:1.6; color:var(--fer-body); max-width:46ch; margin:16px 0 0; }
.fer-phero__updated{ font-size:13.5px; color:#8A93A1; margin-top:14px; }

/* ---- contact ---- */
.fer-contact{ background:var(--fer-bg); padding:clamp(40px,5vw,72px) 0 clamp(64px,8vw,110px); }
.fer-contact__wrap{ max-width:var(--fer-contact-w,1120px); margin:0 auto; padding:0 var(--fer-pad); display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:clamp(28px,4vw,52px); align-items:start; }
.fer-contact__card{ background:#fff; border:1px solid var(--fer-hair); border-radius:24px; padding:clamp(26px,3vw,40px); box-shadow:0 1px 2px rgba(14,21,38,0.04),0 24px 50px -34px rgba(14,21,38,0.16); }
.fer-contact__h2{ font-size:20px; font-weight:800; letter-spacing:-0.01em; margin:0 0 22px; color:var(--fer-ink); }
.fer-form{ display:flex; flex-direction:column; gap:16px; }
.fer-field{ display:block; }
.fer-field__label{ display:block; font-size:13px; font-weight:700; color:var(--fer-ink); margin-bottom:7px; }
.fer-input, .fer-textarea, .fer-select{ width:100%; border:1px solid rgba(14,21,38,0.15); background:#F8FAFC; border-radius:12px; padding:13px 15px; font-size:15px; font-family:var(--fer-ff); color:var(--fer-ink); outline:none; }
.fer-input::placeholder, .fer-textarea::placeholder{ color:var(--fer-muted); }
.fer-input:focus, .fer-textarea:focus, .fer-select:focus{ border-color:var(--fer-accent); background:#fff; }
.fer-textarea{ resize:vertical; line-height:1.55; }
.fer-select{ cursor:pointer; }
.fer-form .fer-btn{ margin-top:4px; align-self:flex-start; }
.fer-contact__ok{ text-align:center; padding:24px 8px; }
.fer-contact__ok-ic{ width:64px; height:64px; border-radius:50%; background:var(--fer-soft); display:inline-flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--fer-accent); }
.fer-contact__ok-ic svg{ width:30px; height:30px; }
.fer-contact__ok h2{ font-size:22px; font-weight:800; margin:0 0 10px; color:var(--fer-ink); }
.fer-contact__ok p{ font-size:15.5px; line-height:1.6; color:var(--fer-body); max-width:36ch; margin:0 auto; }
.fer-contact__err{ margin-top:12px; font-size:13.5px; color:#d72d27; }
.fer-contact__side{ display:flex; flex-direction:column; gap:16px; }
.fer-info{ background:#fff; border:1px solid var(--fer-hair); border-radius:20px; padding:26px 28px; box-shadow:0 1px 2px rgba(14,21,38,0.04); }
.fer-info__row{ display:flex; gap:14px; align-items:flex-start; }
.fer-info__ic{ flex-shrink:0; width:44px; height:44px; border-radius:12px; background:var(--fer-soft); display:flex; align-items:center; justify-content:center; color:var(--fer-accent); }
.fer-info__ic svg{ width:21px; height:21px; }
.fer-info__title{ font-size:15px; font-weight:700; margin-bottom:3px; color:var(--fer-ink); }
.fer-info__text{ font-size:14px; color:var(--fer-body); line-height:1.55; }
.fer-info__text a{ color:var(--fer-accent); font-weight:600; }
.fer-ctacard{ background:var(--fer-ink); color:#fff; border-radius:20px; padding:26px 28px; }
.fer-ctacard__title{ font-size:15px; font-weight:700; margin-bottom:6px; }
.fer-ctacard__text{ font-size:14px; line-height:1.6; color:rgba(255,255,255,0.75); margin:0 0 16px; }
.fer-ctacard__btns{ display:flex; flex-wrap:wrap; gap:10px; }
.fer-ctacard__btn{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700; padding:11px 17px; border-radius:999px; }
.fer-ctacard__btn--solid{ background:var(--fer-accent); color:#fff; }
.fer-ctacard__btn--solid:hover{ background:var(--fer-blue-hover); color:#fff; }
.fer-ctacard__btn--ghost{ background:rgba(255,255,255,0.1); color:#fff; border:1px solid rgba(255,255,255,0.2); }
.fer-ctacard__btn--ghost:hover{ background:rgba(255,255,255,0.18); color:#fff; }

/* ---- faq ---- */
.fer-faq{ background:var(--fer-bg); padding:clamp(36px,5vw,64px) 0 clamp(64px,8vw,110px); }
.fer-faq__wrap{ max-width:var(--fer-faq-w,900px); margin:0 auto; padding:0 var(--fer-pad); }
.fer-faq__card{ background:#fff; border:1px solid var(--fer-hair); border-radius:24px; padding:clamp(10px,2vw,26px) clamp(20px,3vw,38px); box-shadow:0 1px 2px rgba(14,21,38,0.04),0 24px 50px -36px rgba(14,21,38,0.14); }
.fer-faq__cat{ font-size:12px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--fer-accent); padding:22px 0 6px; }
.fer-faq__item{ border-top:1px solid rgba(14,21,38,0.08); }
.fer-faq__q{ width:100%; display:flex; justify-content:space-between; align-items:center; gap:18px; background:transparent; border:none; cursor:pointer; padding:19px 2px; text-align:left; font-family:var(--fer-ff); }
.fer-faq__q:hover{ opacity:0.72; }
.fer-faq__q span:first-child{ font-size:16.5px; font-weight:600; color:var(--fer-ink); line-height:1.4; }
.fer-faq__icon{ flex-shrink:0; width:28px; height:28px; border-radius:50%; background:#EEF3FA; display:flex; align-items:center; justify-content:center; color:var(--fer-accent); }
.fer-faq__icon svg{ width:15px; height:15px; }
.fer-faq__icon .minus{ display:none; }
.fer-faq__item.is-open .fer-faq__icon .minus{ display:block; }
.fer-faq__item.is-open .fer-faq__icon .plus{ display:none; }
.fer-faq__a{ display:none; padding:0 2px 20px; }
.fer-faq__item.is-open .fer-faq__a{ display:block; }
.fer-faq__a p, .fer-faq__a{ margin:0; font-size:15.5px; line-height:1.72; color:#46505F; max-width:62ch; }
.fer-faq__a a{ color:var(--fer-accent); font-weight:600; }
.fer-faq__cta{ margin-top:28px; background:var(--fer-ink); border-radius:24px; padding:clamp(28px,4vw,44px); text-align:center; color:#fff; }
.fer-faq__cta h2{ font-family:var(--fer-ff); font-style:italic; font-weight:800; text-transform:uppercase; font-size:clamp(22px,3vw,32px); letter-spacing:-0.01em; margin:0; }
.fer-faq__cta p{ font-size:15.5px; line-height:1.6; color:rgba(255,255,255,0.78); max-width:44ch; margin:12px auto 22px; }

/* ---- legal / policy ---- */
.fer-legal{ background:var(--fer-bg); padding:clamp(36px,5vw,60px) 0 clamp(64px,8vw,110px); }
.fer-legal__wrap{ max-width:var(--fer-legal-w,720px); margin:0 auto; padding:0 var(--fer-pad); }
.fer-legal__note{ display:flex; gap:12px; align-items:flex-start; background:#EEF3FA; border:1px solid rgba(19,119,255,0.16); border-radius:14px; padding:16px 18px; margin-bottom:36px; }
.fer-legal__note svg{ flex-shrink:0; margin-top:1px; color:var(--fer-accent); }
.fer-legal__note p{ margin:0; font-size:13.5px; line-height:1.6; color:#46505F; }
.fer-legal__h2{ font-family:var(--fer-ff); font-style:italic; font-weight:800; text-transform:uppercase; font-size:clamp(20px,2.6vw,27px); letter-spacing:-0.01em; color:var(--fer-ink); line-height:1.1; margin:0 0 12px; }
.fer-legal__body{ font-size:16px; line-height:1.75; color:#46505F; margin:0 0 28px; }
.fer-legal__body:last-child{ margin-bottom:0; }
.fer-legal__body p{ margin:0 0 12px; }
.fer-legal__body p:last-child{ margin-bottom:0; }
.fer-legal__body ul, .fer-legal__body ol{ margin:0 0 4px; padding-left:20px; }
.fer-legal__body li{ margin-bottom:6px; }
.fer-legal__body a{ color:var(--fer-accent); font-weight:600; }
.fer-legal__body strong{ color:var(--fer-ink); }

@media(max-width:600px){
  .fer-form .fer-btn, .fer-ctacard__btn{ width:100%; justify-content:center; }
}

/* =========================================================
   VOLG JE BESTELLING ADD-ON — track (publiek) + order (ingelogd)
   Hergebruikt de bestaande .fer-root tokens (--fer-accent, --fer-ink,
   --fer-body, --fer-muted, --fer-bg, --fer-soft, --fer-hair, --fer-ff …).
   Voeg dit blok ONDERAAN clone-ferosi-001-styles.css toe.
   ========================================================= */

/* ---- gedeelde helpers ---- */
.fer-eyebrow2{ display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--fer-accent); }
.fer-card{ background:#fff; border:1px solid var(--fer-hair); border-radius:24px; padding:clamp(22px,3vw,34px); box-shadow:0 1px 2px rgba(14,21,38,0.04); }

/* ---- hero-band van de trackpagina ---- */
.fer-track{ background:var(--fer-track-bg,linear-gradient(180deg,#EFF4FC 0%,#F5F7FA 100%)); padding:clamp(38px,6vw,68px) 0 clamp(60px,8vw,104px); }
.fer-track__wrap{ max-width:var(--fer-track-w,1120px); margin:0 auto; padding:0 var(--fer-pad); }
.fer-track__crumb{ font-size:13px; font-weight:600; color:var(--fer-body); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.fer-track__crumb a{ color:var(--fer-body); }
.fer-track__crumb a:hover{ color:var(--fer-accent); }
.fer-track__crumb .sep{ opacity:0.5; }
.fer-track__crumb .cur{ color:var(--fer-ink); }
.fer-track__head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px; margin-top:16px; }
.fer-track__intro{ max-width:40ch; }
.fer-track__eyebrow{ display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--fer-accent); }
.fer-track__eyebrow .bar{ width:22px; height:2px; background:var(--fer-accent); display:inline-block; border-radius:2px; }
.fer-track__h1{ font-family:var(--fer-ff); font-style:italic; font-weight:900; text-transform:uppercase; font-size:clamp(34px,5.2vw,60px); line-height:0.98; letter-spacing:-0.025em; color:var(--fer-ink); margin:14px 0 0; }
.fer-track__h1 .ac{ color:var(--fer-accent); }
.fer-track__sub{ font-size:clamp(16px,1.3vw,18px); line-height:1.6; color:var(--fer-body); margin:14px 0 0; }
.fer-track__stats{ display:flex; align-items:center; gap:22px; color:var(--fer-body); font-size:13.5px; }
.fer-track__stat{ display:flex; flex-direction:column; gap:2px; }
.fer-track__stat .num{ font-family:var(--fer-ff); font-style:italic; font-weight:900; font-size:26px; color:var(--fer-ink); line-height:1; }
.fer-track__stat-div{ width:1px; height:34px; background:var(--fer-hair-2); }

/* ---- zoekformulier ---- */
.fer-track__formcard{ margin-top:clamp(26px,3vw,38px); background:#fff; border:1px solid var(--fer-hair); border-radius:24px; padding:clamp(22px,3vw,34px); box-shadow:0 1px 2px rgba(14,21,38,0.04),0 24px 50px -34px rgba(14,21,38,0.16); max-width:820px; }
.fer-track__fields{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.fer-track__hint{ font-size:12.5px; color:var(--fer-muted); margin-top:9px; }
.fer-track__error{ margin-top:14px; display:flex; align-items:center; gap:9px; color:#C0392B; font-size:13.5px; font-weight:600; }
.fer-track__error svg{ flex-shrink:0; }
.fer-track__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:20px; }
.fer-track__demo{ background:transparent; border:none; cursor:pointer; font-family:var(--fer-ff); font-weight:700; font-size:14px; color:var(--fer-accent); display:inline-flex; align-items:center; gap:7px; }
.fer-track__demo:hover{ color:var(--fer-blue-hover); }

/* ---- resultaat ---- */
/* zorg dat het HTML 'hidden'-attribuut wint van de display-regels hieronder */
.fer-track [hidden]{ display:none !important; }
.fer-track__result{ margin-top:clamp(24px,3vw,36px); display:flex; flex-direction:column; gap:24px; }
.fer-track__back{ align-self:flex-start; display:inline-flex; align-items:center; gap:8px; background:transparent; border:none; cursor:pointer; font-family:var(--fer-ff); font-weight:700; font-size:14px; color:var(--fer-body); padding:0; }
.fer-track__back:hover{ color:var(--fer-accent); }

/* status banner */
.fer-banner{ background:radial-gradient(130% 130% at 82% 0%,#DCEBFF 0%,#EFF4FC 60%); border:1px solid rgba(19,119,255,0.16); border-radius:24px; padding:clamp(24px,3vw,34px); overflow:hidden; }
.fer-banner__row{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px; align-items:flex-start; }
.fer-banner__pill{ display:inline-flex; align-items:center; gap:9px; background:var(--fer-accent); color:#fff; font-size:12px; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; padding:7px 13px; border-radius:999px; }
.fer-banner__h{ font-family:var(--fer-ff); font-style:italic; font-weight:900; text-transform:uppercase; font-size:clamp(28px,3.8vw,42px); line-height:1; letter-spacing:-0.02em; color:var(--fer-ink); margin:16px 0 0; }
.fer-banner__sub{ font-size:15.5px; color:#46505F; margin-top:8px; }
.fer-banner__sub strong{ color:var(--fer-ink); }
.fer-banner__ic{ width:56px; height:56px; border-radius:16px; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 24px -10px rgba(19,119,255,0.5); flex-shrink:0; color:var(--fer-accent); }
.fer-banner__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:22px; }
.fer-banner__btn{ display:inline-flex; align-items:center; gap:9px; background:var(--fer-ink); color:#fff; font-weight:700; font-size:13.5px; letter-spacing:0.02em; padding:13px 22px; border-radius:999px; }
.fer-banner__btn:hover{ background:#1A2740; color:#fff; }
.fer-banner__meta{ font-size:13.5px; color:var(--fer-body); }
.fer-banner__meta strong{ color:var(--fer-ink); letter-spacing:0.02em; }

/* stepper – horizontaal (desktop) */
.fer-stepper{ display:flex; align-items:flex-start; margin-top:24px; }
.fer-stepper__step{ flex:1; display:flex; flex-direction:column; align-items:center; text-align:center; }
.fer-stepper__track{ display:flex; align-items:center; width:100%; }
.fer-stepper__line{ flex:1; height:3px; background:#E3E9F1; }
.fer-stepper__step.is-done .fer-stepper__line, .fer-stepper__step.is-active .fer-stepper__line--l{ background:var(--fer-accent); }
.fer-stepper__step.is-first .fer-stepper__line--l, .fer-stepper__step.is-last .fer-stepper__line--r{ background:transparent; }
.fer-stepper__dot{ flex-shrink:0; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fff; border:2px solid #D8DFEA; color:#B4BCC8; }
.fer-stepper__step.is-done .fer-stepper__dot{ background:var(--fer-accent); border-color:var(--fer-accent); color:#fff; box-shadow:0 6px 14px -4px rgba(19,119,255,0.6); }
.fer-stepper__step.is-active .fer-stepper__dot{ background:var(--fer-accent); border-color:var(--fer-accent); color:#fff; animation:ferosi-pulse 2s ease-out infinite; }
.fer-stepper__ttl{ font-size:12.5px; font-weight:700; color:var(--fer-ink); margin-top:12px; line-height:1.3; }
.fer-stepper__step.is-active .fer-stepper__ttl{ font-weight:800; color:var(--fer-accent); }
.fer-stepper__step.is-todo .fer-stepper__ttl{ font-weight:600; color:var(--fer-muted); }
.fer-stepper__time{ font-size:11px; color:#8A93A1; margin-top:3px; }

/* stepper – verticaal (mobiel) */
.fer-vstep{ display:none; flex-direction:column; margin-top:22px; }
.fer-vstep__row{ display:flex; gap:15px; }
.fer-vstep__rail{ display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
.fer-vstep__dot{ width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fff; border:2px solid #D8DFEA; color:#B4BCC8; }
.fer-vstep__row.is-done .fer-vstep__dot, .fer-vstep__row.is-active .fer-vstep__dot{ background:var(--fer-accent); border-color:var(--fer-accent); color:#fff; box-shadow:0 4px 10px -3px rgba(19,119,255,0.55); }
.fer-vstep__row.is-active .fer-vstep__dot{ animation:ferosi-pulse 2s ease-out infinite; }
.fer-vstep__line{ flex:1; width:2px; min-height:16px; background:#E3E9F1; margin-top:3px; }
.fer-vstep__row.is-done .fer-vstep__line{ background:var(--fer-accent); }
.fer-vstep__row.is-last .fer-vstep__line{ display:none; }
.fer-vstep__body{ padding-bottom:22px; }
.fer-vstep__row.is-last .fer-vstep__body{ padding-bottom:0; }
.fer-vstep__ttl{ font-size:15.5px; font-weight:700; color:var(--fer-ink); }
.fer-vstep__row.is-active .fer-vstep__ttl{ font-weight:800; color:var(--fer-accent); }
.fer-vstep__row.is-todo .fer-vstep__ttl, .fer-vstep__row.is-todo .fer-vstep__desc{ color:var(--fer-muted); }
.fer-vstep__desc{ font-size:13px; line-height:1.5; color:var(--fer-body); margin-top:2px; }
.fer-vstep__time{ font-size:12px; color:#8A93A1; margin-top:5px; }

/* live 17TRACK-container */
.fer-track__ot{ margin-top:18px; min-height:120px; border-radius:14px; overflow:hidden; }
.fer-track__ot iframe{ width:100%; border:0; border-radius:14px; }
.fer-track__otnote{ font-size:12.5px; color:var(--fer-muted); margin-top:12px; line-height:1.5; }

/* order-CTA (verschijnt als een bestelnummer is ingevuld) */
.fer-track__ordercta{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; background:var(--fer-soft); border:1px solid rgba(19,119,255,0.16); border-radius:18px; padding:18px 22px; }
.fer-track__ordercta-txt{ font-size:14.5px; color:#46505F; }
.fer-track__ordercta-txt strong{ color:var(--fer-ink); }

/* ---- "zo werkt het" + levertijden ---- */
.fer-tsteps{ background:var(--fer-bg); padding:clamp(48px,7vw,88px) 0 clamp(20px,3vw,30px); }
.fer-tsteps__wrap{ max-width:var(--fer-tsteps-w,1120px); margin:0 auto; padding:0 var(--fer-pad); }
.fer-tsteps__h2{ font-family:var(--fer-ff); font-style:italic; font-weight:800; text-transform:uppercase; font-size:clamp(28px,4vw,46px); line-height:1; letter-spacing:-0.02em; color:var(--fer-ink); margin:16px 0 0; }
.fer-tsteps__h2 .ac{ color:var(--fer-accent); }
.fer-tsteps__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; margin-top:clamp(32px,4vw,48px); }
.fer-tstep{ background:#fff; border:1px solid var(--fer-hair); border-radius:22px; padding:32px 30px; box-shadow:0 1px 2px rgba(14,21,38,0.04); }
.fer-tstep__num{ font-family:var(--fer-ff); font-style:italic; font-weight:900; font-size:44px; color:var(--fer-accent); line-height:1; letter-spacing:-0.03em; }
.fer-tstep__ttl{ font-size:18px; font-weight:700; color:var(--fer-ink); margin:16px 0 8px; }
.fer-tstep__txt{ font-size:14.5px; line-height:1.6; color:var(--fer-body); margin:0; }
.fer-tinfo{ margin-top:clamp(30px,4vw,48px); background:#fff; border:1px solid var(--fer-hair); border-radius:22px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); overflow:hidden; box-shadow:0 1px 2px rgba(14,21,38,0.04); }
.fer-tinfo__cell{ padding:28px 30px; border-right:1px solid var(--fer-hair); }
.fer-tinfo__cell:last-child{ border-right:none; }
.fer-tinfo__ic{ width:44px; height:44px; border-radius:12px; background:var(--fer-soft); display:flex; align-items:center; justify-content:center; margin-bottom:15px; color:var(--fer-accent); }
.fer-tinfo__ttl{ font-size:15px; font-weight:700; color:var(--fer-ink); margin-bottom:5px; }
.fer-tinfo__txt{ font-size:14px; color:var(--fer-body); line-height:1.55; }

/* ---- ingelogde orderpagina (Ferosi-design) ---- */
.fer-order{ background:var(--fer-bg); padding:clamp(30px,4vw,56px) 0 clamp(56px,8vw,96px); }
.fer-order__wrap{ max-width:var(--fer-order-w,1120px); margin:0 auto; padding:0 var(--fer-pad); }
.fer-order__top{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:8px; }
.fer-order__title{ font-family:var(--fer-ff); font-style:italic; font-weight:900; text-transform:uppercase; font-size:clamp(26px,3.4vw,40px); letter-spacing:-0.02em; color:var(--fer-ink); margin:0; }
.fer-order__back{ font-size:14px; font-weight:700; color:var(--fer-body); display:inline-flex; align-items:center; gap:7px; }
.fer-order__back:hover{ color:var(--fer-accent); }
.fer-order__date{ font-size:13.5px; color:var(--fer-muted); margin:0 0 clamp(22px,3vw,30px); }
.fer-order__cols{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.fer-order__main{ flex:2 1 440px; min-width:0; display:flex; flex-direction:column; gap:24px; }
.fer-order__side{ flex:1 1 300px; min-width:0; display:flex; flex-direction:column; gap:20px; }
.fer-scard{ background:#fff; border:1px solid var(--fer-hair); border-radius:22px; padding:26px; box-shadow:0 1px 2px rgba(14,21,38,0.04); }
.fer-scard__eyebrow{ font-size:12px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--fer-accent); }
.fer-scard__hr{ height:1px; background:rgba(14,21,38,0.08); margin:20px 0; }
.fer-oline{ display:flex; gap:14px; align-items:center; margin-top:16px; }
.fer-oline:first-of-type{ margin-top:0; }
.fer-oline__thumb{ width:56px; height:56px; border-radius:12px; background:#EEF3FA; flex-shrink:0; overflow:hidden; display:flex; align-items:center; justify-content:center; color:var(--fer-accent); }
.fer-oline__thumb img{ width:100%; height:100%; object-fit:contain; padding:7px; }
.fer-oline__body{ flex:1; min-width:0; }
.fer-oline__ttl{ font-size:14px; font-weight:600; color:var(--fer-ink); line-height:1.35; }
.fer-oline__meta{ font-size:12.5px; color:#8A93A1; margin-top:2px; }
.fer-oline__price{ font-size:14px; font-weight:700; color:var(--fer-ink); white-space:nowrap; }
.fer-orow{ display:flex; justify-content:space-between; font-size:13.5px; color:var(--fer-body); margin-bottom:9px; }
.fer-orow span:last-child{ color:var(--fer-ink); }
.fer-orow--free span:last-child{ color:#1F8A5B; font-weight:700; }
.fer-orow--total{ font-size:16px; font-weight:800; color:var(--fer-ink); margin-top:6px; margin-bottom:0; }
.fer-orow--total span:last-child{ color:var(--fer-ink); }
.fer-addr{ display:flex; gap:13px; align-items:flex-start; }
.fer-addr svg{ flex-shrink:0; margin-top:2px; color:var(--fer-accent); }
.fer-addr__body{ font-size:14.5px; line-height:1.6; color:#46505F; }
.fer-addr__body p{ margin:0; }
.fer-addr__body strong{ color:var(--fer-ink); }
.fer-scard__label{ font-size:12.5px; color:#8A93A1; }
.fer-scard__val{ font-size:14.5px; font-weight:600; color:var(--fer-ink); margin-top:3px; }
.fer-scard--dark{ background:var(--fer-ink); color:#fff; }
.fer-scard--dark .fer-scard__val,.fer-scard--dark .fer-scard__label{ color:#fff; }
.fer-scard__btn{ display:inline-flex; align-items:center; gap:8px; background:var(--fer-accent); color:#fff; font-weight:700; font-size:13.5px; padding:12px 20px; border-radius:999px; margin-top:14px; }
.fer-scard__btn:hover{ background:var(--fer-blue-hover); color:#fff; }
.fer-order__note{ font-size:13.5px; line-height:1.6; color:rgba(255,255,255,0.75); margin:6px 0 0; }

/* ---- mobiel (< 820px): wissel stepper horizontaal → verticaal ---- */
@media(max-width:820px){
  .fer-stepper{ display:none; }
  .fer-vstep{ display:flex; }
}
@media(max-width:600px){
  .fer-track__actions .fer-btn{ width:100%; justify-content:center; }
  .fer-track__stats{ width:100%; }
}