/* ==========================================================================
   TickShield affiliate sites - static stylesheet
   One stylesheet, four market personalities (see the [data-site] blocks).

   Framework-free on purpose: no Tailwind runtime, no JS-rendered layout, no
   icon font. The page is fully readable with JavaScript disabled.

   Button colour note: the affiliate CTA keeps the client-mandated #2563eb in
   every market (spec 3.3). Market identity is carried by the display face,
   the hero photograph treatment, the accent tone and the card geometry.
   ========================================================================== */

/* ------------------------------------------------------------ foundations */
:root{
  --brand:#2563eb;
  --brand-dark:#1d4ed8;
  --brand-soft:#eff6ff;
  --text:#0e1726;
  --text-2:#33415c;
  --muted:#64748b;
  --border:#e4e8ef;
  --border-2:#cbd5e1;
  --surface:#f7f9fc;
  --bg:#ffffff;
  --radius:8px;
  --radius-lg:14px;
  --radius-xl:20px;
  --card-pad:16px;
  --card-gap:24px;
  --wrap:768px;
  --wrap-wide:1200px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",
         Arial,"Noto Sans",sans-serif;
  --font-display:var(--font);
  --shadow-xs:0 1px 2px rgba(14,23,38,.05);
  --shadow-sm:0 2px 6px -2px rgba(14,23,38,.09);
  --shadow-md:0 12px 30px -14px rgba(14,23,38,.24);
  --shadow-lg:0 26px 60px -28px rgba(14,23,38,.34);
  --tone:#2563eb;
  --tone-soft:#eff6ff;
  --tone-ink:#1e40af;
  --tone-mid:#93b4f5;
  --hero-1:#0b2447;
  --hero-2:#1d4ed8;
  --hero-ink:#ffffff;
  --hero-dim:rgba(255,255,255,.82);
  --radius-hero:0px;
}

/* ------------------------------------------------------- market identities */
/* Germany - authoritative and structured. Cool teal, sharper corners; the
   named public bodies carry the trust rather than promotional colour. */
[data-site="de"]{
  --brand:#0f766e; --brand-dark:#0b4f4a; --brand-soft:#ecfdf5;
  --tone:#0f766e; --tone-soft:#ecfdf5; --tone-ink:#0b4f4a; --tone-mid:#5eead4;
  --hero-1:#04222b; --hero-2:#0f766e;
  --radius:6px; --radius-lg:10px; --radius-xl:14px;
}

/* France - editorial and literary. Serif display face, deep ink blue, softer
   geometry: reads as a magazine rather than a shop. */
[data-site="fr"]{
  --brand:#4338ca; --brand-dark:#312e81; --brand-soft:#eef2ff;
  --tone:#4338ca; --tone-soft:#eef2ff; --tone-ink:#312e81; --tone-mid:#a5b4fc;
  --hero-1:#0e1230; --hero-2:#2f3f8f;
  --font-display:Georgia,"Times New Roman",Times,"Noto Serif",serif;
  --radius:6px; --radius-lg:10px; --radius-xl:14px;
}

/* United Kingdom - understated and practical. Slate blue, tight geometry,
   nothing shouting. */
[data-site="uk"]{
  --brand:#155e75; --brand-dark:#0e4a5c; --brand-soft:#ecfeff;
  --tone:#155e75; --tone-soft:#ecfeff; --tone-ink:#0e4a5c; --tone-mid:#67e8f9;
  --hero-1:#0b1f2e; --hero-2:#155e75;
  --radius:6px; --radius-lg:10px; --radius-xl:14px;
}

/* United States - high contrast and benefit-first. A warm accent against navy
   lifts the stat band and the step numbers off the page. */
[data-site="us"]{
  --brand:#c2410c; --brand-dark:#9a3412; --brand-soft:#fff7ed;
  --tone:#c2410c; --tone-soft:#fff7ed; --tone-ink:#9a3412; --tone-mid:#fdba74;
  --hero-1:#071d33; --hero-2:#1e40af;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--font);font-size:16.5px;line-height:1.66;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{line-height:1.2;margin:1.6em 0 .6em;font-weight:700;letter-spacing:-.018em}
h1{font-size:1.8rem;margin-top:0}
h2{font-size:1.34rem}
h3{font-size:1.06rem}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.25em}
li{margin:.35em 0}
strong{font-weight:700}
code{background:var(--surface);border:1px solid var(--border);border-radius:4px;
     padding:.1em .35em;font-size:.9em}
blockquote{margin:0 0 1.2em;padding:.4em 1em;border-left:3px solid var(--tone-soft);
           color:var(--text-2)}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
         overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* the `hidden` attribute must win over any layout class that sets `display` */
[hidden]{display:none!important}
/* The page shell uses one wide column so header, main and footer line up on
   the same left/right edges. The narrow 768px measure (--wrap) is reserved for
   inner reading columns only. */
.container{width:100%;max-width:var(--wrap-wide);margin:0 auto;padding:0 20px}
.container:has(.grid),.container:has(.card-grid),.container:has(.rgrid){max-width:var(--wrap-wide)}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:8px;top:8px;background:#fff;padding:8px;border:1px solid var(--border);z-index:50}

/* ---------------------------------------------------------------- header */
/* ---------------------------------------------------------------- header */
.site-header{border-bottom:1px solid var(--border);background:rgba(255,255,255,.94);
             -webkit-backdrop-filter:saturate(1.8) blur(10px);
             backdrop-filter:saturate(1.8) blur(10px);
             position:sticky;top:0;z-index:20}
/* The header gets the wide container, not the 768px reading column - otherwise
   brand + nav + language picker overflow and the picker wraps onto its own row.
   Nothing in the row is allowed to wrap any more. */
.site-header .header-inner{display:flex;align-items:center;gap:18px;flex-wrap:nowrap;
                           max-width:var(--wrap-wide);min-height:68px;
                           padding-top:9px;padding-bottom:9px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--text);
       font-size:1.04rem;letter-spacing:-.02em;flex:0 1 auto;min-width:0}
.brand:hover{text-decoration:none}
.brand-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-mark{display:inline-flex;align-items:center;justify-content:center;
            width:32px;height:32px;border-radius:10px;flex:none;color:#fff;
            background:linear-gradient(145deg,var(--hero-2),var(--hero-1));
            box-shadow:var(--shadow-xs)}
.site-nav{display:none;min-width:0}
.site-nav ul{list-style:none;display:flex;gap:22px;margin:0;padding:0}
.site-nav a{color:var(--text-2);font-size:.93rem;font-weight:500;white-space:nowrap}
.site-nav a:hover{color:var(--tone);text-decoration:none}
.header-tools{display:flex;align-items:center;gap:10px;margin-left:auto;flex:none}

/* ------------------------------------------------------ language switcher */
.flag{display:block;border-radius:3px;flex:none;
      box-shadow:0 0 0 1px rgba(14,23,38,.12),0 1px 2px rgba(14,23,38,.1)}
.langs{position:relative}
.langs__toggle{display:inline-flex;align-items:center;gap:8px;list-style:none;cursor:pointer;
               border:1px solid var(--border);border-radius:999px;padding:5px 12px 5px 8px;
               font-size:.86rem;font-weight:600;color:var(--text-2);background:#fff;
               transition:border-color .15s ease,box-shadow .15s ease}
.langs__toggle::-webkit-details-marker{display:none}
.langs__toggle:hover{border-color:var(--border-2);box-shadow:var(--shadow-xs)}
.langs[open] .langs__toggle{border-color:var(--tone);color:var(--tone)}
.langs__market{letter-spacing:.02em}
.langs__chev{color:var(--muted);transition:transform .18s ease}
.langs[open] .langs__chev{transform:rotate(180deg)}
.langs__list{position:absolute;right:0;top:calc(100% + 10px);z-index:30;list-style:none;
             margin:0;padding:7px;min-width:234px;max-width:calc(100vw - 28px);
             background:#fff;border:1px solid var(--border);border-radius:var(--radius-xl);
             box-shadow:var(--shadow-lg)}
.langs__list li{margin:0}
.langs__list a{display:flex;align-items:center;gap:11px;padding:9px 11px;
               border-radius:calc(var(--radius-lg) + 2px);color:var(--text-2);
               transition:background-color .14s ease}
.langs__list a:hover{background:var(--surface);text-decoration:none;color:var(--text)}
.langs__list a[aria-current]{background:var(--tone-soft);color:var(--tone-ink)}
.langs__code{font-size:.72rem;font-weight:700;letter-spacing:.07em;color:var(--tone-ink);
             background:var(--tone-soft);border-radius:5px;padding:2px 7px;flex:none}
.langs__name{font-size:.9rem;flex:1}
.langs__check{color:var(--tone);flex:none}

/* ------------------------------------------------------ mobile disclosure */
/* Small screens get a single tidy row: brand, language, menu button. The
   panel is a native <details> so no JavaScript is required. */
.menu{position:relative}
.menu__toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;
              height:38px;list-style:none;cursor:pointer;background:#fff;color:var(--text);
              border:1px solid var(--border);border-radius:11px;
              transition:border-color .15s ease,box-shadow .15s ease}
.menu__toggle::-webkit-details-marker{display:none}
.menu__toggle:hover{border-color:var(--border-2);box-shadow:var(--shadow-xs)}
.menu[open] .menu__toggle{border-color:var(--tone);color:var(--tone)}
.menu__bars,.menu__bars::before,.menu__bars::after{content:"";display:block;width:17px;
              height:2px;border-radius:2px;background:currentColor;
              transition:transform .2s ease,background-color .2s ease}
.menu__bars{position:relative}
.menu__bars::before{position:absolute;top:-6px}
.menu__bars::after{position:absolute;top:6px}
.menu[open] .menu__bars{background:transparent}
.menu[open] .menu__bars::before{transform:translateY(6px) rotate(45deg)}
.menu[open] .menu__bars::after{transform:translateY(-6px) rotate(-45deg)}
.menu__panel{position:absolute;right:0;top:calc(100% + 10px);z-index:30;
             width:min(288px,calc(100vw - 32px));padding:10px;background:#fff;
             border:1px solid var(--border);border-radius:var(--radius-xl);
             box-shadow:var(--shadow-lg)}
.menu__links,.menu__langs{list-style:none;margin:0;padding:0}
.menu__links li,.menu__langs li{margin:0}
.menu__links a{display:block;padding:11px 12px;border-radius:10px;color:var(--text-2);
               font-weight:600;font-size:.95rem}
.menu__links a:hover{background:var(--surface);color:var(--tone);text-decoration:none}
.menu__label{margin:12px 12px 6px;font-size:.71rem;font-weight:700;letter-spacing:.11em;
             text-transform:uppercase;color:var(--muted)}
.menu__langs a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;
               color:var(--text-2);font-size:.92rem}
.menu__langs a:hover{background:var(--surface);color:var(--text);text-decoration:none}
.menu__langs a[aria-current]{background:var(--tone-soft);color:var(--tone-ink)}
.menu__code{margin-left:auto;font-size:.71rem;font-weight:700;color:var(--tone);
            background:var(--tone-soft);border-radius:5px;padding:2px 7px}

/* ------------------------------------------------------------------- hero */
.hero{position:relative;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
      display:flex;align-items:center;overflow:hidden;isolation:isolate;
      min-height:520px;padding:72px 0 66px;
      background:linear-gradient(158deg,var(--hero-1) 0%,var(--hero-2) 100%);
      color:var(--hero-ink);border-radius:var(--radius-hero)}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
/* per-market scrims: keep the headline at AA contrast over every photo */
.hero__scrim{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(102deg,rgba(6,15,30,.95) 0%,rgba(6,15,30,.82) 42%,rgba(6,15,30,.36) 74%,rgba(6,15,30,.2) 100%),
  linear-gradient(180deg,rgba(6,15,30,.3) 0%,rgba(6,15,30,.08) 42%,rgba(6,15,30,.6) 100%)}
[data-site="de"] .hero__scrim{background:
  linear-gradient(102deg,rgba(3,16,22,.95) 0%,rgba(3,22,26,.84) 44%,rgba(3,22,26,.38) 76%,rgba(3,22,26,.22) 100%),
  linear-gradient(180deg,rgba(3,16,22,.32) 0%,rgba(3,16,22,.08) 42%,rgba(3,16,22,.62) 100%)}
[data-site="fr"] .hero__scrim{background:
  linear-gradient(100deg,rgba(8,10,28,.95) 0%,rgba(12,14,38,.82) 44%,rgba(12,14,38,.36) 76%,rgba(12,14,38,.2) 100%),
  linear-gradient(180deg,rgba(8,10,28,.3) 0%,rgba(8,10,28,.06) 42%,rgba(8,10,28,.58) 100%)}
[data-site="uk"] .hero__scrim{background:
  linear-gradient(102deg,rgba(5,16,24,.95) 0%,rgba(6,20,30,.82) 44%,rgba(6,20,30,.38) 76%,rgba(6,20,30,.22) 100%),
  linear-gradient(180deg,rgba(5,16,24,.32) 0%,rgba(5,16,24,.08) 42%,rgba(5,16,24,.6) 100%)}
[data-site="us"] .hero__scrim{background:
  linear-gradient(102deg,rgba(3,13,26,.95) 0%,rgba(4,18,36,.84) 42%,rgba(4,18,36,.38) 74%,rgba(4,18,36,.22) 100%),
  linear-gradient(180deg,rgba(3,13,26,.32) 0%,rgba(3,13,26,.08) 40%,rgba(3,13,26,.62) 100%)}
.hero__inner{position:relative;width:100%;max-width:var(--wrap-wide);margin:0 auto;
             padding:0 24px;display:grid;gap:34px;align-items:center}
.hero__main{max-width:44rem}
.hero__eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 20px;
               font-size:.755rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
               color:var(--hero-dim)}
.hero__eyebrow .dot{width:7px;height:7px;border-radius:50%;background:#4ade80;flex:none;
                    box-shadow:0 0 0 4px rgba(74,222,128,.24)}
.hero__title{font-family:var(--font-display);margin:0 0 20px;max-width:20ch;
             font-size:clamp(2.1rem,5.4vw,3.75rem);line-height:1.05;letter-spacing:-.03em;
             color:var(--hero-ink);text-shadow:0 2px 20px rgba(0,0,0,.3)}
[data-site="fr"] .hero__title{letter-spacing:-.012em;font-weight:400;line-height:1.1}
.hero__lead{margin:0 0 30px;max-width:56ch;font-size:clamp(1.03rem,1.5vw,1.2rem);
            line-height:1.62;color:var(--hero-dim);text-shadow:0 1px 14px rgba(0,0,0,.34)}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.hero .btn--ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.42);
                  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero .btn--ghost:hover{background:rgba(255,255,255,.22);color:#fff;border-color:rgba(255,255,255,.7)}
.hero__aside{padding:22px;border-radius:var(--radius-xl);background:rgba(255,255,255,.13);
             border:1px solid rgba(255,255,255,.24);
             -webkit-backdrop-filter:blur(14px) saturate(1.4);
             backdrop-filter:blur(14px) saturate(1.4);
             box-shadow:0 18px 44px -26px rgba(0,0,0,.65)}
.hero__aside-title{margin:0 0 13px;font-size:.735rem;font-weight:700;letter-spacing:.1em;
                   text-transform:uppercase;color:var(--hero-dim)}
.hero__chips{list-style:none;display:flex;flex-direction:column;gap:8px;margin:0;padding:0}
.hero__chips li{margin:0}
.chip{display:block;font-size:.855rem;line-height:1.42;padding:9px 13px;border-radius:10px;
      border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.1);color:#fff}

/* ------------------------------------------------------------ proof / stats */
.proof{padding:38px 0 4px}
.stats{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:0;padding:0}
.stat{display:flex;flex-direction:column;gap:3px;padding:20px;background:var(--surface);
      border:1px solid var(--border);border-radius:var(--radius-lg)}
.stat__value{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.6rem);
             font-weight:700;line-height:1;letter-spacing:-.035em;color:var(--tone)}
.stat__label{font-size:.845rem;color:var(--muted);line-height:1.4}
.stat--accent{border-color:var(--tone);background:var(--tone-soft)}
.stat--accent .stat__value{color:var(--tone-ink)}

/* ---------------------------------------------------------------- section */
.band{padding:56px 0 10px}
.band--legal{padding-bottom:48px}
.band__head{margin:0 0 30px;max-width:72ch}
.band__head h2{margin:0 0 10px;font-family:var(--font-display);
               font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.026em}
.band__lead{margin:0;color:var(--muted);font-size:1.005rem;line-height:1.6}
.band__head--row{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;
                 justify-content:space-between;max-width:none}
.band__more{display:inline-flex;align-items:center;gap:8px;flex:none;font-size:.9rem;
            font-weight:600;color:var(--tone);padding-bottom:4px;
            border-bottom:1px solid transparent}
.band__more:hover{text-decoration:none;border-bottom-color:var(--tone)}
.band__ico{width:15px;height:15px;transition:transform .16s ease}
.band__more:hover .band__ico{transform:translateX(3px)}
.band__note{margin:20px 0 0;font-size:.85rem;color:var(--muted);max-width:82ch}

/* ------------------------------------------------------------- page head */
.page-head{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
           padding:52px 0 46px;color:#fff;
           background:linear-gradient(150deg,var(--hero-1),var(--hero-2))}
.page-head__inner{max-width:var(--wrap-wide);margin:0 auto;padding:0 24px}
.page-head__eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 16px;
                    font-size:.75rem;font-weight:700;letter-spacing:.11em;
                    text-transform:uppercase;color:var(--hero-dim)}
.page-head__eyebrow .dot{width:7px;height:7px;border-radius:50%;background:#4ade80;flex:none}
.page-head__title{font-family:var(--font-display);margin:0 0 14px;color:#fff;
                  font-size:clamp(1.9rem,4.4vw,3rem);letter-spacing:-.03em;max-width:24ch}
.page-head__lead{margin:0;max-width:62ch;color:var(--hero-dim);font-size:1.03rem}

/* --------------------------------------------------------------- pillars */
.pillars{list-style:none;display:grid;grid-template-columns:1fr;gap:16px;margin:0;padding:0}
.pillar{padding:26px 24px;background:#fff;border:1px solid var(--border);
        border-radius:var(--radius-lg);box-shadow:var(--shadow-xs);
        transition:box-shadow .18s ease,transform .18s ease}
.pillar:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.pillar__mark{display:inline-flex;align-items:center;justify-content:center;width:44px;
              height:44px;border-radius:13px;margin-bottom:16px;
              background:var(--tone-soft);color:var(--tone)}
.pillar__ico{width:23px;height:23px}
.pillar__title{margin:0 0 8px;font-size:1.07rem}
.pillar__text{margin:0;font-size:.93rem;color:var(--text-2)}

/* ------------------------------------------------------------ categories */
.cats{list-style:none;display:grid;grid-template-columns:1fr;gap:14px;margin:0;padding:0}
.cat{display:flex;gap:15px;align-items:flex-start;padding:19px;background:#fff;
     border:1px solid var(--border);border-radius:var(--radius-lg);
     box-shadow:var(--shadow-xs);transition:border-color .18s ease}
.cat:hover{border-color:var(--tone)}
.cat__mark{display:inline-flex;align-items:center;justify-content:center;flex:none;
           width:40px;height:40px;border-radius:11px;background:var(--tone-soft);color:var(--tone)}
.cat__ico{width:21px;height:21px}
.cat__title{margin:2px 0 5px;font-size:1.005rem}
.cat__text{margin:0;font-size:.895rem;color:var(--muted);line-height:1.5}

/* ------------------------------------------------------------- card grids */
.grid,.rgrid{list-style:none;display:grid;grid-template-columns:1fr;gap:16px;margin:0;padding:0}
.gcard,.rcard{margin:0}
.gcard__link,.rcard__link{display:flex;flex-direction:column;gap:11px;height:100%;
  padding:23px;background:#fff;border:1px solid var(--border);
  border-radius:var(--radius-lg);color:var(--text);box-shadow:var(--shadow-xs);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.gcard__link:hover,.rcard__link:hover{text-decoration:none;border-color:var(--tone);
  box-shadow:var(--shadow-md);transform:translateY(-3px)}
.gcard__kicker,.rcard__kicker{display:inline-flex;align-items:center;gap:7px;font-size:.715rem;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tone)}
.kicker__dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.gcard__title,.rcard__title{font-family:var(--font-display);
  font-size:clamp(1.03rem,1.6vw,1.18rem);font-weight:600;line-height:1.34;letter-spacing:-.015em}
.gcard__desc,.rcard__desc{font-size:.895rem;color:var(--muted);line-height:1.56}
.gcard__more,.rcard__cta{margin-top:auto;display:inline-flex;align-items:center;gap:8px;
  padding-top:13px;font-size:.86rem;font-weight:600;color:var(--tone)}
.gcard__ico{width:15px;height:15px;transition:transform .16s ease}
.gcard__link:hover .gcard__ico,.rcard__link:hover .gcard__ico{transform:translateX(3px)}
.rcard__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.79rem;
             color:var(--muted);margin-top:2px}
.rcard__dot{width:3px;height:3px;border-radius:50%;background:var(--border-2);flex:none}
.rcard--a .rcard__link{border-top:3px solid var(--tone)}
.rcard--c .rcard__link{border-top:3px solid var(--tone-mid)}
.rcard--b .rcard__link{border-top:3px solid var(--border-2)}

/* ---------------------------------------------------------- quick table */
.tablewrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);
           background:#fff;box-shadow:var(--shadow-xs)}
.qtable{width:100%;border-collapse:collapse;min-width:540px;font-size:.935rem}
.qtable thead th{text-align:left;padding:15px 20px;font-size:.715rem;font-weight:700;
                 letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
                 background:var(--surface);border-bottom:1px solid var(--border);white-space:nowrap}
.qtable tbody th{text-align:left;padding:16px 20px;font-weight:600;color:var(--text);
                 border-bottom:1px solid var(--border);white-space:nowrap}
.qtable tbody td{padding:16px 20px;border-bottom:1px solid var(--border);color:var(--text-2)}
.qtable tbody tr:last-child th,.qtable tbody tr:last-child td{border-bottom:0}
.qtable tbody tr:hover{background:var(--tone-soft)}
.qtable__pick{font-weight:600;color:var(--tone-ink)!important}
.qtable__why{color:var(--muted)!important}

/* ------------------------------------------------------------- scenarios */
.scenarios{list-style:none;display:grid;grid-template-columns:1fr;gap:16px;margin:0;padding:0}
.scenario{position:relative;padding:25px 24px 23px;background:#fff;border:1px solid var(--border);
          border-left:3px solid var(--tone);border-radius:var(--radius-lg);box-shadow:var(--shadow-xs)}
.scenario__pin{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;
               border-radius:50%;margin-bottom:13px;background:var(--tone);color:#fff;
               font-size:.8rem;font-weight:700}
.scenario__title{margin:0 0 8px;font-size:1.03rem}
.scenario__text{margin:0;font-size:.92rem;color:var(--text-2)}

/* ---------------------------------------------------------------- method */
.method{list-style:none;display:grid;grid-template-columns:1fr;gap:0;margin:0;padding:0}
.method__step{position:relative;padding:21px 0 21px 64px;border-top:1px solid var(--border)}
.method__step:last-child{border-bottom:1px solid var(--border)}
.method__num{position:absolute;left:0;top:20px;font-family:var(--font-display);
             font-size:1.18rem;font-weight:700;color:var(--tone);letter-spacing:-.03em}
.method__title{margin:0 0 6px;font-size:1.005rem}
.method__text{margin:0;font-size:.92rem;color:var(--text-2)}

/* ------------------------------------------------------------- cta block */
.cta-block{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
           margin-top:64px;padding:64px 0;
           background:linear-gradient(150deg,var(--hero-1),var(--hero-2));color:#fff}
.cta-block__inner{max-width:var(--wrap-wide);margin:0 auto;padding:0 24px;text-align:center}
.cta-block__title{margin:0 0 13px;font-family:var(--font-display);
                  font-size:clamp(1.6rem,3.6vw,2.4rem);letter-spacing:-.028em;color:#fff}
.cta-block__text{margin:0 auto 28px;max-width:58ch;color:var(--hero-dim);font-size:1.03rem}
.cta-block__actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:0}
.cta-block .btn--ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.42)}
.cta-block .btn--ghost:hover{background:rgba(255,255,255,.22);color:#fff}

/* ----------------------------------------------------------- legal links */
.legal-links{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0}
.legal-links li{margin:0}
.legal-links a{display:inline-block;font-size:.885rem;padding:9px 16px;border:1px solid var(--border);
               border-radius:999px;color:var(--text-2);background:#fff;
               transition:border-color .15s ease,color .15s ease}
.legal-links a:hover{border-color:var(--tone);color:var(--tone);text-decoration:none}
.legal-links--plain li span{font-size:.9rem;color:var(--muted)}

/* -------------------------------------------------------------- breadcrumb */
.breadcrumb{margin:18px auto 0}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;
               font-size:.825rem;color:var(--muted)}
.breadcrumb li+li::before{content:"›";margin-right:6px;color:var(--border-2)}
.breadcrumb a{color:var(--muted)}
.breadcrumb span[aria-current]{color:var(--text-2)}

/* ---------------------------------------------------------------- article */
.article{padding:26px 0 48px}
.article__header{margin-bottom:28px}
.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--tone);font-weight:700}
.article__h1{margin-bottom:.4em;font-family:var(--font-display)}
.article__lead{font-size:1.07rem;color:var(--muted)}
.article__meta{font-size:.845rem;color:var(--muted);margin-bottom:.6em}
.article__byline{display:flex;flex-wrap:wrap;gap:.45em 1.1em;align-items:center;
                 margin:0 0 .7em;font-size:.86rem;color:var(--muted)}
.article__author{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:.5em}
.article__author>span[itemprop=name]{color:var(--text);font-weight:650}
.article__author-role{color:var(--muted)}
.article__author-role:before{content:"\00b7";margin-right:.5em;color:var(--border)}
.article__author-link{color:var(--tone);text-decoration:none;border-bottom:1px solid transparent}
.article__author-link:hover,.article__author-link:focus{border-bottom-color:var(--tone)}
.article__review{display:inline-flex;align-items:center;gap:.45em}
.article__review-badge{color:var(--tone);font-weight:650}
.article__review-badge:before{content:"\2713";display:inline-flex;align-items:center;
                              justify-content:center;width:1.15em;height:1.15em;
                              border:1.5px solid var(--tone);border-radius:50%;
                              font-size:.72em;line-height:1;margin-right:.4em}
.article__byline-block{max-width:78ch;margin:34px auto 0;padding:20px 22px;
                       background:var(--surface);border:1px solid var(--border);
                       border-radius:var(--radius-lg)}
.article__byline-block h2{margin-top:0;font-size:1.15rem;color:var(--text)}
.article__byline-author{font-size:1.05rem;color:var(--text)}
.article__byline-author span[itemprop=name]{font-weight:700}
.article__byline-role{color:var(--muted);margin-left:.55em}
.article__byline-cta{margin-bottom:.35em;color:var(--muted)}
.article__byline-tags{list-style:none;display:flex;flex-wrap:wrap;gap:.5em;padding:0;margin:0 0 1em}
.article__byline-tags li{font-size:.82rem;color:var(--tone);background:var(--surface);
                         border:1px solid var(--border);border-radius:999px;padding:.28em .8em}
.article__byline-works{margin-bottom:0;color:var(--muted)}
.article__byline-works span[itemprop=name]{color:var(--text);font-weight:650}
.article__disclosure{font-size:.83rem;color:var(--muted);background:var(--surface);
                     border:1px solid var(--border);border-left:3px solid var(--tone);
                     border-radius:var(--radius);padding:11px 13px}
.article__body{overflow-wrap:break-word;margin:0 auto}
.article__body h2{padding-top:.35em;border-top:1px solid var(--border);font-family:var(--font-display)}
.article__body h2:first-child{border-top:0;padding-top:0}
.article__disclaimer{margin:38px 0 0;padding:19px;background:var(--surface);
                     border:1px solid var(--border);border-radius:var(--radius-lg);
                     font-size:.885rem;color:var(--muted)}
.article__disclaimer h2{font-size:1rem;margin-top:0;color:var(--text)}
.sources{list-style:none;padding:0;margin:.6em 0 0;font-size:.855rem}
.sources li{margin:.2em 0}

/* ------------------------------------------------------------- hub cards */
.hub{padding:22px 0;border-bottom:1px solid var(--border)}
.hub:last-of-type{border-bottom:0}
.hub__sources,.hub__count{font-size:.855rem;color:var(--muted)}
.card-grid{list-style:none;padding:0;margin:0;display:grid;gap:14px;grid-template-columns:1fr}
.hub-card{border:1px solid var(--border);border-radius:var(--radius);padding:15px;background:var(--bg);
          display:flex;flex-direction:column;gap:4px;transition:border-color .15s ease}
.hub-card:hover{border-color:var(--tone)}
.hub-card__tag{font-size:.68rem;font-weight:700;color:var(--tone);background:var(--tone-soft);
               border-radius:4px;padding:1px 6px;align-self:flex-start;text-transform:uppercase}
.hub-card__link{font-weight:600;font-size:.98rem;color:var(--text)}
.hub-card__link:hover{color:var(--tone)}
.hub-card__desc{font-size:.855rem;color:var(--muted);margin:0}
.hub-card__meta{font-size:.75rem;color:var(--muted);margin-top:auto}
.empty{color:var(--muted);font-size:.93rem}

/* ------------------------------------------------------------ product card */
.product-card{display:grid;grid-template-columns:112px 1fr;gap:var(--card-pad);background:#fff;
  border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--card-pad);
  margin:var(--card-gap) 0;align-items:start;box-shadow:var(--shadow-sm)}
.pc-media{background:var(--surface);border-radius:var(--radius);overflow:hidden;aspect-ratio:1/1;
          display:flex;align-items:center;justify-content:center}
.pc-media img{width:100%;height:100%;object-fit:contain}
.pc-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.pc-brand{font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0}
.pc-title{font-size:1rem;margin:0;font-weight:700}
.pc-reason{font-size:.885rem;color:var(--muted);margin:0}
.pc-price{margin:.2em 0 0;font-weight:700;font-size:1.03rem}
.pc-price__old{font-weight:400;color:var(--muted);font-size:.86rem;margin-left:8px}
.pc-cta{display:inline-block;text-align:center;background:var(--brand);color:#fff;
  border-radius:var(--radius);padding:11px 19px;font-weight:600;font-size:.95rem;
  margin-top:6px;align-self:flex-start;min-width:152px}
.pc-cta:hover{background:var(--brand-dark);text-decoration:none;color:#fff}
.pc-disclosure{font-size:.72rem;color:var(--muted);margin:2px 0 0}

/* --------------------------------------------------------------------- FAQ */
.faq{margin:0 0 1.2em}
.faq__item{border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:10px;
           background:#fff;overflow:hidden}
.faq__q{cursor:pointer;padding:16px 48px 16px 19px;font-weight:600;font-size:.985rem;
        list-style:none;position:relative}
.faq__q::-webkit-details-marker{display:none}
.faq__q::after{content:"";position:absolute;right:19px;top:50%;width:11px;height:11px;margin-top:-6px;
               border-right:2px solid var(--tone);border-bottom:2px solid var(--tone);
               transform:rotate(45deg);transition:transform .18s ease}
.faq__item[open] .faq__q::after{transform:rotate(-135deg)}
.faq__item[open] .faq__q{border-bottom:1px solid var(--border)}
.faq__a{padding:15px 19px;font-size:.94rem;color:var(--text-2)}
.faq__a p{margin:0}

/* ---------------------------------------------------------------- related */
.related{margin:38px 0 0;padding-top:20px;border-top:1px solid var(--border)}
.related__list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.related__item{border-left:3px solid var(--tone-soft);padding-left:12px}
.related__item--a{border-left-color:var(--tone)}
.related__link{font-weight:600}
.related__reason{display:block;font-size:.76rem;color:var(--muted)}

/* ------------------------------------------------------------------ legal */
.legal{padding:22px 0 44px}
.legal__body{max-width:78ch;margin:0 auto}
.legal__body h2{font-size:1.1rem;font-family:var(--font-display)}
.legal-note{font-size:.83rem;color:var(--muted);background:var(--surface);
            border-left:3px solid var(--tone-soft);padding:11px 13px}
.legal__footer-note{margin-top:30px;font-size:.9rem}

/* ----------------------------------------------------------------- footer */
.site-footer{border-top:1px solid var(--border);background:var(--surface);
             padding:44px 0 24px;font-size:.885rem}
.site-footer .container{max-width:var(--wrap-wide)}
.footer-grid{display:grid;gap:28px;grid-template-columns:1fr}
.footer-brand{display:flex;flex-direction:column;gap:2px}
.footer-mark{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
             border-radius:9px;margin-bottom:10px;color:#fff;
             background:linear-gradient(145deg,var(--hero-2),var(--hero-1))}
.footer-title{font-size:.735rem;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);
              margin:0 0 .8em;font-weight:700}
.footer-title--brand{font-size:.95rem;letter-spacing:-.01em;text-transform:none;color:var(--text);
                     margin-bottom:.4em}
.footer-note{color:var(--text-2);margin:0 0 .7em;max-width:42ch}
.footer-note--fine{color:var(--muted);font-size:.835rem}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{margin:.3em 0}
.footer-links a{color:var(--text-2)}
.footer-links a:hover{color:var(--tone)}
.footer-links--plain li{color:var(--muted);font-size:.855rem}
.footer-links--inline{display:flex;flex-wrap:wrap;gap:14px}
.footer-bottom{margin-top:30px;padding-top:18px;border-top:1px solid var(--border);display:flex;
               flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.footer-copy{margin:0;color:var(--muted);font-size:.8rem}
.footer-langs{list-style:none;display:flex;gap:14px;margin:0;padding:0}
.footer-langs li{margin:0}
.footer-langs a{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--muted);
                font-weight:600}
.footer-langs a:hover{color:var(--tone);text-decoration:none}

/* ------------------------------------------------------------ consent bar */
.consent{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--border);
         box-shadow:0 -2px 22px rgba(14,23,38,.11);z-index:60;padding:15px 0}
.consent__inner{display:grid;gap:12px;align-items:center}
.consent__text strong{display:block;margin-bottom:2px}
.consent__text p{margin:0;font-size:.855rem;color:var(--muted)}
.consent__actions{display:flex;gap:10px;flex-wrap:wrap}

/* --------------------------------------------------------------- buttons */
.btn{display:inline-block;border-radius:var(--radius);padding:10px 18px;font-weight:600;
     font-size:.93rem;border:1px solid transparent;cursor:pointer;font-family:inherit;
     transition:background-color .15s ease,border-color .15s ease,color .15s ease,
                box-shadow .15s ease,transform .15s ease}
.btn--lg{padding:14px 27px;font-size:1rem;border-radius:calc(var(--radius) + 3px)}
.btn--primary{background:var(--brand);color:#fff;box-shadow:0 8px 20px -10px rgba(37,99,235,.7)}
.btn--primary:hover{background:var(--brand-dark);text-decoration:none;color:#fff;transform:translateY(-1px)}
.btn--ghost{background:#fff;color:var(--text);border-color:var(--border-2)}
.btn--ghost:hover{border-color:var(--tone);color:var(--tone);text-decoration:none}

/* ------------------------------------------------------------- 404 variant */
.hero--404{text-align:center;min-height:440px}
.hero--404 .hero__inner{grid-template-columns:1fr}
.hero--404 .hero__main{max-width:none;margin:0 auto}
.hero--404 .hero__title{max-width:none;font-size:clamp(3.4rem,9vw,5.4rem)}
.hero--404 .hero__lead{margin-left:auto;margin-right:auto;max-width:54ch}
.hero--404 .hero__actions{justify-content:center}

/* ------------------------------------------------------------ responsive */
/* phones first: the hero must not eat the whole viewport when the trust panel
   stacks underneath the headline */
@media (max-width:639px){
  .hero{min-height:0;padding:54px 0 50px}
  .hero__inner{gap:26px;padding:0 20px}
  .hero__aside{padding:18px;border-radius:var(--radius-lg)}
  .hero__lead{margin-bottom:24px}
  .page-head{padding:40px 0 36px}
  .band{padding:44px 0 8px}
  .cta-block{margin-top:48px;padding:52px 0}
  .footer-bottom{flex-direction:column;align-items:flex-start}
}
@media (min-width:640px){
  body{font-size:17px}
  h1{font-size:2.15rem}
  h2{font-size:1.46rem}
  .stats{grid-template-columns:repeat(4,1fr)}
  .pillars{grid-template-columns:repeat(3,1fr)}
  .cats{grid-template-columns:repeat(2,1fr)}
  .grid,.rgrid{grid-template-columns:repeat(2,1fr)}
  .scenarios{grid-template-columns:repeat(3,1fr)}
  .method{grid-template-columns:repeat(2,1fr)}
  .method__step{padding-right:26px}
  .card-grid{grid-template-columns:repeat(2,1fr)}
  .product-card{grid-template-columns:150px 1fr;gap:20px}
  .consent__inner{grid-template-columns:1fr auto}
  .footer-grid{grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:36px}
}
/* Below 1000px the horizontal nav can no longer sit on one row together with
   the brand and the language picker (the German labels are the longest), so it
   collapses into the disclosure menu instead of wrapping. */
@media (max-width:999px){
  .langs__market,.langs__chev{display:none}
  .langs__toggle{padding:8px 10px;gap:0}
  .brand{font-size:.99rem}
}
@media (min-width:1000px){
  .site-nav{display:block}
  .menu{display:none}
}
@media (min-width:960px){
  /* The shell container stays on the wide measure (--wrap-wide) so header,
     main and footer keep one aligned edge; the reading column is the inner
     .article__body / .legal__body which carry their own 78ch measure. */
  .container{max-width:var(--wrap-wide)}
  .container:has(.grid),.container:has(.card-grid),.container:has(.rgrid){max-width:var(--wrap-wide)}
  .card-grid{grid-template-columns:repeat(3,1fr)}
  .grid{grid-template-columns:repeat(3,1fr)}
  .rgrid{grid-template-columns:repeat(2,1fr)}
  .cats{grid-template-columns:repeat(4,1fr)}
  .method{grid-template-columns:repeat(3,1fr)}
  .hero__inner{grid-template-columns:minmax(0,1fr) 340px;gap:56px}
  .hero{min-height:600px}
}
@media (min-width:1180px){
  .hero{padding:96px 0 88px}
  .band{padding:68px 0 12px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}
@media (prefers-color-scheme:dark){
  /* The public sites stay light on purpose: affiliate imagery and price cards
     are shot on white and the client brand palette is light-first. */
}
@media print{
  .site-header,.site-footer,.consent,.related,.cta-block,.langs,.hero__aside{display:none}
}