/* AFF_BLOCKS_V1 — affiliate blocks (offer list, verdict, compare, duel, scorecard, regulation, risk).
   Tokens: the editorial-journey ones inside the format, the theme ones elsewhere. No hover effect, one surface,
   one call to action. Selectors are (0,2,0)+ so the theme content rules (0,1,1) do not restyle the blocks. */

/* AFFILIATE_STYLE_TOKENS_V1 (demande Julien 07/10) — one look for every affiliation component, services (aff-*) and
   physical products (mi-*). No colour, font or radius of its own: every token reads the site theme (theme.json →
   --color-*, --font-*, --radius*, --style-button-radius, editorial-tokens --wi2-*), the fallbacks only serve a site
   without them. Same block in affiliate-blocks.css and affiliate-surface (style-align); change it in both. */
:root{
  --aff-ui-font:var(--font-body,inherit);
  --aff-ui-font-heading:var(--font-heading,var(--aff-ui-font));
  --aff-ui-ink:var(--color-text,#1d2a2c);
  --aff-ui-heading:var(--color-dark-bg,var(--aff-ui-ink));
  --aff-ui-muted:var(--color-text-muted,color-mix(in srgb,var(--aff-ui-ink) 65%,transparent));
  --aff-ui-paper:var(--color-bg,#fff);
  --aff-ui-accent:var(--color-accent,#166b65);
  --aff-ui-accent-2:var(--color-accent-2,var(--aff-ui-accent));
  --aff-ui-accent-ink:color-mix(in srgb,var(--aff-ui-accent) 72%,var(--aff-ui-heading));
  --aff-ui-line:color-mix(in srgb,var(--aff-ui-ink) 13%,transparent);
  /* cards and panels: the tinted panel of the aff blocks */
  --aff-ui-card-bg:color-mix(in srgb,var(--aff-ui-accent-2) 5%,var(--aff-ui-paper));
  --aff-ui-card-line:color-mix(in srgb,var(--aff-ui-accent-2) 22%,var(--aff-ui-line));
  --aff-ui-card-radius:var(--wi2-card-radius,var(--radius-lg,24px));
  --aff-ui-card-shadow:none;
  --aff-ui-card-hover-line:color-mix(in srgb,var(--aff-ui-accent) 32%,var(--aff-ui-card-line));
  --aff-ui-card-hover-shadow:var(--wi2-card-shadow-hover,var(--shadow-hover,0 12px 28px rgba(0,0,0,.08)));
  --aff-ui-card-lift:translateY(-2px);
  --aff-ui-inner-radius:calc(var(--radius,16px) * .75);
  --aff-ui-media-radius:calc(var(--aff-ui-card-radius) * .7);
  /* buttons: primary filled, secondary outlined, tertiary text link with arrow */
  --aff-btn-radius:var(--wi2-action-radius,var(--cms-ds-action-radius,var(--style-button-radius,12px)));
  --aff-btn-height:46px;
  --aff-btn-height-sm:40px;
  --aff-btn-pad:10px 18px;
  --aff-btn-pad-sm:8px 12px;
  --aff-btn-gap:8px;
  --aff-btn-font:800 14px/1.2 var(--aff-ui-font);
  --aff-btn-font-sm:800 13px/1.2 var(--aff-ui-font);
  --aff-btn-motion:var(--wi2-action-motion,.2s ease);
  --aff-btn-primary-bg:var(--aff-ui-accent-2);
  --aff-btn-primary-ink:var(--color-on-accent-2,var(--color-on-accent,#fff));
  --aff-btn-primary-shadow:0 8px 18px color-mix(in srgb,var(--aff-btn-primary-bg) 22%,transparent);
  --aff-btn-secondary-bg:var(--aff-ui-paper);
  --aff-btn-secondary-ink:var(--aff-ui-heading);
  --aff-btn-secondary-line:color-mix(in srgb,var(--aff-ui-ink) 16%,transparent);
  --aff-btn-tertiary-ink:var(--aff-ui-accent-ink);
  --aff-btn-hover-bg:var(--aff-ui-heading);
  --aff-btn-hover-ink:var(--color-dark-text,#fff);
  --aff-btn-hover-shadow:0 10px 22px color-mix(in srgb,var(--aff-btn-hover-bg) 16%,transparent);
  --aff-focus-ring:color-mix(in srgb,var(--aff-ui-accent) 45%,transparent);
  /* chips (facts), badges, rank medals (gold, silver, bronze are metals, not theme colours) */
  --aff-chip-radius:var(--radius-full,999px);
  --aff-chip-bg:color-mix(in srgb,var(--aff-ui-accent) 8%,var(--aff-ui-paper));
  --aff-chip-ink:var(--aff-ui-muted);
  --aff-chip-font:500 12.5px/1.3 var(--aff-ui-font);
  --aff-badge-bg:color-mix(in srgb,var(--aff-ui-accent) 12%,var(--aff-ui-paper));
  --aff-badge-media-bg:color-mix(in srgb,var(--aff-ui-paper) 92%,transparent);
  --aff-badge-ink:var(--aff-ui-accent-ink);
  --aff-badge-font:800 11px/1.25 var(--aff-ui-font);
  --aff-badge-tracking:.05em;
  --aff-rank-bg:var(--aff-ui-accent);--aff-rank-ink:var(--color-on-accent,var(--aff-ui-heading));
  --aff-medal-1:#f4c64f;--aff-medal-1-ink:#49350a;
  --aff-medal-2:#d5dde5;--aff-medal-2-ink:#34404c;
  --aff-medal-3:#d99a68;--aff-medal-3-ink:#4a2914;
  /* modals */
  --aff-modal-bg:var(--aff-ui-paper);
  --aff-modal-line:var(--aff-ui-card-line);
  --aff-modal-radius:var(--aff-ui-card-radius);
  --aff-modal-shadow:var(--shadow-lg,0 24px 72px rgba(0,0,0,.2));
  --aff-modal-backdrop:color-mix(in srgb,var(--color-dark-bg,#111) 62%,transparent);
  --aff-modal-close-size:40px
}
/* AFFILIATE_STYLE_TOKENS_V1_END */

.aff{
  --aff-accent:var(--ej-accent,var(--color-accent,#166b65));
  --aff-on-accent:var(--color-on-accent,#fff);
  --aff-ink:var(--ej-ink,var(--color-text,#1d2a2c));
  --aff-heading:var(--ej-heading,var(--aff-ink));
  --aff-muted:var(--ej-muted,var(--color-text-muted,#5d6a6d));
  --aff-line:var(--ej-line,var(--color-border,#e2e7e5));
  --aff-paper:var(--ej-paper,var(--color-bg,#fff));
  --aff-card:var(--ej-card,var(--aff-ui-card-bg));
  --aff-card-line:var(--ej-card-line,var(--aff-ui-card-line));
  --aff-note:var(--ej-note,color-mix(in srgb,var(--aff-accent) 7%,var(--aff-paper)));
  --aff-good:var(--ej-good,#1f7a50);
  --aff-bad:var(--ej-bad,#b0472f);
  --aff-good-soft:color-mix(in srgb,var(--aff-good) 9%,var(--aff-paper));
  --aff-bad-soft:color-mix(in srgb,var(--aff-bad) 8%,var(--aff-paper));
  --aff-radius:var(--aff-ui-card-radius);
  --aff-radius-sm:var(--aff-ui-inner-radius);
  color:var(--aff-ink);font-family:var(--aff-ui-font)
}
.aff :where(p,ul,ol,dl,dd,figure){margin:0}
.aff :where(ul){padding:0;list-style:none}
.aff :where(li){margin:0;padding:0;border:0;background:none;list-style:none}
.aff :where(li)::before{content:none}
/* The theme gives content paragraphs and lists vertical margins (0,1,1): the blocks own their rhythm. */
.ej-block.aff :is(p,ul,ol,dl){margin-top:0;margin-bottom:0}
.aff .aff-facts,.aff .aff-proscons ul,.aff .aff-scorecard__dims,.aff .aff-regulation__list{margin:0;padding:0;list-style:none}
.aff .aff-facts>li,.aff .aff-proscons li,.aff .aff-scorecard__dims>li,.aff .aff-regulation__list>li{margin:0;list-style:none}
.aff-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.aff .aff-na{color:var(--aff-muted);font-weight:400}

/* One surface for every panel; variants switch the variables on their parent. */
:where(.aff) :where(.aff-row,.aff-verdict__panel,.aff-decision__panel,.aff-gallery__shots,.aff-compare__scroll,.aff-duel__panel,.aff-scorecard__panel,.aff-regulation__item){
  background:var(--aff-panel-bg,var(--aff-card));border:1px solid var(--aff-panel-line,var(--aff-card-line));border-radius:var(--aff-panel-radius,var(--aff-radius))
}

/* Shared atoms: visual, rank, badge, score, ring, facts, offer, call to action. */
.aff .aff-visual{display:grid;place-items:center;flex:none;width:64px;height:64px;overflow:hidden;border-radius:var(--aff-radius-sm);background:var(--aff-paper);border:1px solid var(--aff-line)}
.aff .aff-visual img{width:100%;height:100%;object-fit:contain}
.aff .aff-visual.is-logo img{width:78%;height:78%}
.aff .aff-visual.is-photo{border-color:transparent}
.aff .aff-visual.is-monogram{font:800 20px/1 var(--aff-ui-font);color:var(--aff-accent);background:var(--aff-note);border-color:transparent}
.aff .aff-visual--lg{width:88px;height:88px}
.aff .aff-visual--sm{width:44px;height:44px;font-size:15px}
.aff .aff-rank{position:relative;display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--aff-note);color:var(--aff-heading);font:800 14px/1 var(--aff-ui-font)}
.aff .aff-rank svg{position:absolute;inset:-2px;width:38px;height:38px;fill:var(--aff-medal,var(--aff-accent));stroke:none;opacity:.38}
.aff .aff-rank b{position:relative}
.aff .aff-row--rank-1{--aff-medal:var(--aff-medal-1)}.aff .aff-row--rank-2{--aff-medal:var(--aff-medal-2)}.aff .aff-row--rank-3{--aff-medal:var(--aff-medal-3)}
.aff .aff-row--podium .aff-rank{background:color-mix(in srgb,var(--aff-medal) 18%,var(--aff-paper));color:color-mix(in srgb,var(--aff-medal) 70%,var(--aff-heading))}
.aff .aff-badge{display:inline-flex;align-items:center;gap:6px;width:fit-content;max-width:100%;padding:5px 10px;border-radius:var(--aff-chip-radius);background:var(--aff-badge-bg);color:var(--aff-badge-ink);font:var(--aff-badge-font);letter-spacing:var(--aff-badge-tracking);text-transform:uppercase;white-space:normal;overflow-wrap:anywhere}
.aff .aff-badge::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:currentColor}
.aff .aff-score{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--aff-muted)}
.aff .aff-score svg{width:15px;height:15px;fill:#e0a526;stroke:none}
.aff .aff-score b{font-size:16px;font-weight:800;color:var(--aff-heading)}
.aff .aff-ring{--aff-ring:0;display:grid;place-items:center;align-content:center;flex:none;width:92px;height:92px;border-radius:50%;background:radial-gradient(closest-side,var(--aff-paper) 82%,transparent 83%),conic-gradient(var(--aff-accent) calc(var(--aff-ring) * 1%),var(--aff-line) 0);line-height:1}
.aff .aff-ring b{font-size:28px;font-weight:800;color:var(--aff-heading)}
.aff .aff-ring small{margin-top:3px;font-size:12px;color:var(--aff-muted)}
/* Facts read as the chips of the physical product cards (AFFILIATE_STYLE_TOKENS_V1). */
.aff .aff-facts{display:flex;flex-wrap:wrap;gap:6px}
.aff .aff-facts li{position:relative;padding:6px 11px 6px 27px;border-radius:var(--aff-chip-radius);background:var(--aff-chip-bg);font:var(--aff-chip-font);color:var(--aff-chip-ink)}
.aff .aff-facts li.is-no b{color:var(--aff-bad)}
.aff .aff-facts li::before{content:"✓";position:absolute;left:11px;top:6px;font-weight:800;color:var(--aff-good)}
.aff .aff-facts li.is-no::before{content:"✕";color:var(--aff-bad)}
.aff .aff-facts b{font-weight:650;color:var(--aff-ink)}
.aff .aff-offer{display:grid;gap:3px;width:100%;margin:0;padding:10px 12px;border:1px dashed color-mix(in srgb,var(--aff-accent) 45%,transparent);border-radius:var(--aff-radius-sm);background:color-mix(in srgb,var(--aff-accent) 6%,var(--aff-paper));text-align:left}
.aff .aff-offer__label{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--aff-accent)}
.aff .aff-offer__label svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.aff .aff-offer b{font-size:14.5px;font-weight:750;line-height:1.35;color:var(--aff-heading)}
.aff .aff-offer small{font-size:12.5px;color:var(--aff-muted)}
.aff .aff-offer--bonus b{color:var(--aff-heading)}
/* Buttons (AFFILIATE_STYLE_TOKENS_V1): the same three buttons as the physical product cards. The official-site
   button (--source) is the same primary button: one call to action per product, whatever the link. */
.aff a.aff-cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--aff-btn-gap);min-height:var(--aff-btn-height);padding:var(--aff-btn-pad);border:1px solid transparent;border-radius:var(--aff-btn-radius);background:var(--aff-btn-primary-bg);color:var(--aff-btn-primary-ink);font:var(--aff-btn-font);text-decoration:none;white-space:nowrap;box-shadow:var(--aff-btn-primary-shadow)}
.aff a.aff-cta svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.aff a.aff-cta--source{background:var(--aff-btn-primary-bg);color:var(--aff-btn-primary-ink);box-shadow:var(--aff-btn-primary-shadow)}
.aff a.aff-cta:focus-visible,.aff a.aff-btn-review:focus-visible,.aff a.aff-review-link:focus-visible{outline:3px solid var(--aff-focus-ring);outline-offset:2px}
.aff a.aff-review-link{display:inline-flex;align-items:center;gap:6px;justify-self:center;font:var(--aff-btn-font-sm);color:var(--aff-btn-tertiary-ink);text-decoration:none;transition:color var(--aff-btn-motion)}
.aff a.aff-review-link::after{content:"→";transition:transform var(--aff-btn-motion)}
.aff a.aff-review-link:hover{color:var(--aff-ui-heading)}.aff a.aff-review-link:hover::after{transform:translateX(3px)}
.aff .aff-reg{display:inline-flex;align-items:center;gap:6px;width:fit-content;max-width:100%;padding:4px 10px;border-radius:var(--aff-chip-radius);font:700 12px/1.3 var(--aff-ui-font);background:var(--aff-note);color:var(--aff-muted)}
.aff .aff-reg::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.aff .aff-reg--authorised{background:var(--aff-good-soft);color:var(--aff-good)}
.aff .aff-reg--refused{background:var(--aff-bad-soft);color:var(--aff-bad)}
.aff .aff-note{margin-top:10px;font-size:13px;line-height:1.55;color:var(--aff-muted)}

/* aff-offer-list (AFF_OFFER_LIST_V1): identity · why · offer. */
.aff-list__rows{display:grid;gap:20px}
.aff .aff-row{display:grid;grid-template-columns:minmax(230px,.85fr) minmax(0,1.8fr) minmax(220px,.8fr);gap:18px 30px;align-items:center;padding:24px 26px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.aff .aff-row--rank-1{--aff-panel-line:color-mix(in srgb,var(--aff-medal-1) 55%,var(--aff-card-line))}
.aff .aff-row__id{display:flex;align-items:center;gap:12px;min-width:0}
.aff .aff-row__name{display:grid;gap:4px;min-width:0}
.aff .aff-row__name strong{font-size:17px;line-height:1.25;color:var(--aff-heading)}
.aff .aff-row__why{display:grid;gap:9px;align-content:center;min-width:0}
.aff .aff-row__reason{font-size:14.5px;font-weight:650;line-height:1.45;color:var(--aff-ink)}
.aff .aff-row__offer{display:grid;gap:8px;justify-items:stretch}
.aff .aff-row__offer .aff-cta{width:100%}

/* aff-verdict (AFF_VERDICT_V1). */
.aff .aff-verdict__panel{display:grid;gap:18px;padding:22px 24px}
.aff .aff-verdict__head{display:flex;align-items:center;gap:18px;min-width:0}
.aff .aff-verdict__name{display:grid;gap:5px;flex:1;min-width:0}
.aff .aff-verdict__name strong{font-size:22px;line-height:1.2;color:var(--aff-heading)}
.aff .aff-verdict__text{font-size:16.5px;line-height:1.6;color:var(--aff-ink)}
.aff .aff-fit{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.aff .aff-fit__item{padding:12px 14px;border-radius:var(--aff-radius-sm);background:var(--aff-good-soft)}
.aff .aff-fit__item.is-no{background:var(--aff-bad-soft)}
.aff .aff-fit dt{margin-bottom:3px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--aff-good)}
.aff .aff-fit .is-no dt{color:var(--aff-bad)}
.aff .aff-fit dd{font-size:14.5px;line-height:1.45}
.aff .aff-proscons{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.aff .aff-proscons__col{display:grid;gap:8px;align-content:start;padding:14px 16px;border-radius:var(--aff-radius-sm);background:var(--aff-good-soft)}
.aff .aff-proscons__col.is-no{background:var(--aff-bad-soft)}
.aff .aff-proscons__col>p{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--aff-good)}
.aff .aff-proscons__col.is-no>p{color:var(--aff-bad)}
.aff .aff-proscons ul{display:grid;gap:6px}
.aff .aff-proscons li{position:relative;padding-left:20px;font-size:14.5px;line-height:1.45}
.aff .aff-proscons li::before{content:"✓";position:absolute;left:0;top:0;font-weight:800;color:var(--aff-good)}
.aff .aff-proscons .is-no li::before{content:"–";left:3px;color:var(--aff-bad)}
.aff .aff-verdict__decide{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 20px;align-items:center;padding-top:16px;border-top:1px solid var(--aff-line)}
.aff .aff-verdict__decide:not(:has(.aff-offer)){grid-template-columns:1fr;justify-items:end}
.aff .aff-verdict__actions{display:grid;gap:8px;justify-items:center}

/* aff-compare (AFF_COMPARE_V1): grid table (the theme restyles every <table>); the label column stays visible when it scrolls. */
.aff .aff-compare__scroll{overflow-x:auto;overscroll-behavior-x:contain}
.aff .aff-compare__scroll:focus-visible{outline:3px solid color-mix(in srgb,var(--aff-accent) 40%,transparent);outline-offset:2px}
.aff .aff-compare__grid{display:grid;min-width:calc(170px + var(--aff-cols,3) * 150px);font-size:14.5px;line-height:1.4}
.aff .aff-compare__row{display:grid;grid-template-columns:minmax(170px,1.1fr) repeat(var(--aff-cols,3),minmax(150px,1fr));border-top:1px solid var(--aff-line)}
.aff .aff-compare__row--head{border-top:0}
.aff .aff-compare__row>span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:12px 14px;text-align:center}
.aff .aff-compare__row>.aff-compare__label{position:sticky;left:0;z-index:1;align-items:flex-start;text-align:left;font-weight:650;color:var(--aff-heading);background:var(--aff-card)}
.aff .aff-compare__row--head>span{background:var(--aff-note)}
.aff .aff-compare__product strong{font-size:15px;line-height:1.25;color:var(--aff-heading)}
.aff .aff-compare__cell.is-best{background:var(--aff-good-soft);color:var(--aff-good);font-weight:750}
.aff .aff-compare__row--cta>span{justify-content:flex-start}
.aff .aff-compare__row--cta .aff-cta{min-height:var(--aff-btn-height-sm);padding:var(--aff-btn-pad-sm);font:var(--aff-btn-font-sm)}

/* aff-duel (AFF_DUEL_V1): A | label | B everywhere, the better side marked. */
.aff .aff-duel__panel{display:grid;gap:20px;padding:22px 24px}
.aff .aff-duel__heads{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}
.aff .aff-duel__side{display:grid;justify-items:center;gap:6px;text-align:center}
.aff .aff-duel__side strong{font-size:19px;line-height:1.2;color:var(--aff-heading)}
.aff .aff-duel__vs{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--aff-heading);color:var(--aff-paper);font:800 15px/1 var(--aff-ui-font)}
.aff .aff-duel__verdict{font-size:16px;line-height:1.6;text-align:center}
.aff .aff-duel__choose{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.aff .aff-duel__choose p{display:grid;gap:4px;padding:12px 14px;border-radius:var(--aff-radius-sm);background:var(--aff-note);font-size:14.5px;line-height:1.45}
.aff .aff-duel__choose span{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--aff-accent)}
.aff .aff-duel__dims,.aff .aff-duel__facts{display:grid}
.aff .aff-duel__dim,.aff .aff-duel__fact{display:grid;grid-template-columns:1fr minmax(120px,auto) 1fr;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--aff-line)}
.aff .aff-duel__label{font-size:13.5px;font-weight:650;text-align:center;color:var(--aff-heading)}
.aff .aff-duel__bar{--aff-v:0%;display:grid;align-items:center;gap:10px}
.aff .aff-duel__bar--a{grid-template-columns:2.2em 1fr}
.aff .aff-duel__bar--b{grid-template-columns:1fr 2.2em}
.aff .aff-duel__bar i{height:12px;border-radius:999px;background:linear-gradient(to var(--aff-dir,right),color-mix(in srgb,var(--aff-muted) 35%,var(--aff-paper)) var(--aff-v),var(--aff-note) 0)}
.aff .aff-duel__bar--a i{--aff-dir:left}
.aff .aff-duel__bar.is-best i{background:linear-gradient(to var(--aff-dir,right),var(--aff-accent) var(--aff-v),var(--aff-note) 0)}
.aff .aff-duel__bar b{font-size:14px;font-weight:800;color:var(--aff-heading);text-align:center}
.aff .aff-duel__bar.is-best b{color:var(--aff-accent)}
.aff .aff-duel__fact>span:not(.aff-duel__label){font-size:14.5px;text-align:center}
.aff .aff-duel__fact>span.is-best{color:var(--aff-good);font-weight:750}
.aff .aff-duel__ctas{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.aff .aff-duel__ctas>div{display:grid;gap:7px;justify-items:center}

/* aff-scorecard (AFF_SCORECARD_V1). */
.aff .aff-scorecard__panel{display:grid;gap:16px;padding:22px 24px}
.aff .aff-scorecard__total{display:flex;align-items:center;gap:16px}
.aff .aff-scorecard__total p{display:grid;gap:2px}
.aff .aff-scorecard__total strong{font-size:18px;color:var(--aff-heading)}
.aff .aff-scorecard__total span{font-size:13px;color:var(--aff-muted)}
.aff .aff-scorecard__dims{display:grid;grid-template-columns:1fr 1fr;gap:12px 28px}
.aff .aff-scorecard__dims li{--aff-v:0%;display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:baseline}
.aff .aff-scorecard__label{font-size:14.5px;font-weight:650;color:var(--aff-heading)}
.aff .aff-scorecard__dims b{font-size:15px;font-weight:800}
.aff .aff-meter{grid-column:1/-1;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--aff-accent) var(--aff-v),var(--aff-line) 0)}
.aff .aff-scorecard__dims small{grid-column:1/-1;font-size:13px;line-height:1.45;color:var(--aff-muted)}

/* aff-regulation (AFF_REGULATION_V1). */
.aff .aff-regulation__list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px}
.aff .aff-regulation__item{display:flex;align-items:flex-start;gap:14px;padding:16px 18px}
.aff .aff-regulation__item>div{display:grid;gap:5px;min-width:0}
.aff .aff-regulation__item strong{font-size:16px;color:var(--aff-heading)}
.aff .aff-regulation__item p{font-size:14px;line-height:1.45}
.aff .aff-regulation__meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px!important;color:var(--aff-muted)}
.aff .aff-regulation__meta a{color:var(--aff-accent)}


/* aff-risk (AFF_RISK_V1): the closing note, quiet but complete. */
.aff.aff-risk{display:grid;gap:8px;padding:16px 18px;border-left:3px solid var(--aff-accent);border-radius:0 var(--aff-radius-sm) var(--aff-radius-sm) 0;background:var(--aff-note)}
.aff.aff-risk p{font-size:13.5px;line-height:1.6;color:var(--aff-ink)}
.aff.aff-risk .aff-risk__title{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--aff-accent)}

@media (max-width:860px){
  .aff .aff-row{grid-template-columns:1fr;gap:14px;padding:16px}
  .aff .aff-row__offer{padding-top:12px;border-top:1px solid var(--aff-line)}
  .aff .aff-verdict__decide{grid-template-columns:1fr}
}
@media (max-width:600px){
  .aff .aff-facts,.aff .aff-fit,.aff .aff-proscons,.aff .aff-scorecard__dims,.aff .aff-duel__choose{grid-template-columns:1fr}
  .aff .aff-verdict__panel,.aff .aff-duel__panel,.aff .aff-scorecard__panel{padding:16px}
  .aff .aff-verdict__head{flex-wrap:nowrap;gap:12px}
  .aff .aff-verdict__head .aff-visual--lg{width:56px;height:56px}
  .aff .aff-ring{width:72px;height:72px}.aff .aff-ring b{font-size:22px}
  .aff .aff-duel__dim,.aff .aff-duel__fact{grid-template-columns:1fr 1fr;gap:6px 10px}
  .aff .aff-duel__dim .aff-duel__label,.aff .aff-duel__fact .aff-duel__label{grid-column:1/-1;grid-row:1}
  .aff .aff-duel__ctas{grid-template-columns:1fr 1fr;gap:8px}
  .aff .aff-duel__ctas :is(.aff-cta,.aff-btn-review){padding-inline:12px}
}
@media print{.aff a.aff-cta{display:none}}

/* Inside the editorial-journey format, the wide blocks take the wide column (their heading stays in the reading column). */
.ej-reader :is(.ej-section,.ej-opening)>.aff:is(.aff-list,.aff-compare,.aff-duel){--ej-col:var(--ej-wide)}

/* AFF_RISK_AUTO_V2: risk paragraphs merged into the format's disclaimer box, under its text. */
.ej-endnote--disclaimer .ej-endnote__text>.ej-endnote__more{grid-column:2;display:block;margin-top:2px}

/* aff-sticky (AFF_STICKY_V1): the review's call to action at hand, at the bottom of the screen. */
.aff.aff-sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--aff-paper) 94%,transparent);backdrop-filter:blur(10px);border-top:4px solid var(--color-accent,var(--aff-accent));box-shadow:0 -10px 30px color-mix(in srgb,var(--aff-ink) 10%,transparent)}
.aff.aff-sticky[hidden]{display:none}
.aff .aff-sticky__inner{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:18px;align-items:center;max-width:1100px;margin:0 auto}
.aff .aff-sticky__id{display:flex;align-items:center;gap:12px;min-width:0}
.aff .aff-sticky__id p{display:grid;gap:1px;min-width:0}
.aff .aff-sticky__id strong{font-size:16px;color:var(--aff-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aff .aff-sticky__offer{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:10px;row-gap:1px;align-items:center;align-self:center;margin:0;padding:7px 14px 7px 10px;border:1px dashed color-mix(in srgb,var(--aff-accent) 45%,transparent);border-radius:var(--aff-radius-sm);background:color-mix(in srgb,var(--aff-accent) 7%,var(--aff-paper));text-align:left}
.aff .aff-sticky__offer svg{grid-row:1 / 3;width:22px;height:22px;fill:none;stroke:var(--aff-accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.aff .aff-sticky__offer span{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--aff-accent)}
.aff .aff-sticky__offer b{font-size:14px;line-height:1.3;color:var(--aff-heading)}
.aff .aff-sticky__id p{margin:0}.aff .aff-sticky .aff-score{gap:4px}
.aff.aff-slidebar{margin:18px auto 0;max-width:var(--ej-measure,760px);padding:14px 18px;border:1px solid var(--aff-card-line);border-radius:var(--aff-radius);background:var(--aff-card)}
.ej-reader:not(.ej-reader--immersive) .aff-slidebar{display:none}
@media (max-width:640px){.aff.aff-slidebar .aff-sticky__inner{grid-template-columns:minmax(0,1fr) auto}.aff.aff-slidebar .aff-sticky__offer{display:grid;grid-column:1 / -1;order:3}}
.aff .aff-sticky a.aff-cta{min-height:var(--aff-btn-height-sm);padding:var(--aff-btn-pad-sm);padding-inline:18px}
@media (max-width:640px){.aff .aff-sticky__inner{grid-template-columns:minmax(0,1fr) auto;gap:10px}.aff .aff-sticky__offer{display:none}.aff .aff-sticky a.aff-cta{padding-inline:14px}}
/* The site back-to-top button rises above the bar while it is shown (no overlap with the call to action). */
body:has(.aff-sticky:not([hidden])) .cms-back-to-top{bottom:calc(24px + 80px + env(safe-area-inset-bottom))}
@media print{.aff.aff-sticky{display:none!important}}
/* aff-decision (AFF_DECISION_V1): the closing « Oui, si / Non, si » of a review, on the pros/cons columns. */
.aff .aff-decision__panel{display:grid;gap:16px;padding:22px 24px}
.aff .aff-decision__panel>.aff-verdict__actions{justify-items:end}
/* aff-gallery (AFF_GALLERY_V1): screenshots of the service in a scroll strip, or one video. */
.aff .aff-gallery__shots{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(170px,210px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:16px;overscroll-behavior-x:contain}
.aff .aff-gallery__shot{margin:0;scroll-snap-align:start;display:grid;gap:6px}
.aff .aff-gallery__shot img{display:block;width:100%;height:auto;aspect-ratio:auto;border-radius:var(--aff-radius-sm);border:1px solid var(--aff-line);background:var(--aff-paper)}
.aff .aff-gallery__shot figcaption{font-size:13px;line-height:1.4;color:var(--aff-muted)}
.aff .aff-gallery__video{position:relative;aspect-ratio:16/9;border-radius:var(--aff-radius);overflow:hidden;background:#000}
.aff .aff-gallery__video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.aff .aff-gallery__note{margin:0;font-size:var(--ej-small,13px);color:var(--aff-muted);text-align:center}
.aff.aff-gallery{display:grid;gap:12px}
@media (max-width:640px){.aff .aff-decision__panel{padding:16px}.aff .aff-decision__panel .aff-proscons{grid-template-columns:1fr}}

/* AFF_OFFER_LIST_V3 (demande Julien 07/10): the ranking card follows the product picks of the physical surfaces —
   a visual tile with its #rank pill and medal, a hover that lifts the card, an offer column with « Voir l'offre »
   and « Avis complet ». The tinted panel background and border stay (they cut with the white page). */
.aff .aff-row{box-shadow:var(--aff-ui-card-shadow)}
.aff .aff-row:hover{transform:var(--aff-ui-card-lift);border-color:var(--aff-ui-card-hover-line);box-shadow:var(--aff-ui-card-hover-shadow)}
.aff .aff-row__id{gap:16px}
.aff .aff-row__tile{position:relative;flex:none}
.aff .aff-row__tile .aff-visual{width:92px;height:92px;border-radius:var(--aff-ui-media-radius)}
/* The #rank pill and its medal: the colours of the physical product picks (rank 1-3 metals, then the site accent). */
.aff .aff-row__tile .aff-rank{position:absolute;z-index:1;top:-9px;left:-9px;display:inline-flex;align-items:center;gap:4px;width:auto;height:auto;min-width:0;padding:6px 10px 6px 8px;border-radius:var(--aff-chip-radius);background:var(--aff-rank-bg);color:var(--aff-rank-ink);font:900 12.5px/1 var(--aff-ui-font);box-shadow:0 7px 16px color-mix(in srgb,var(--aff-ui-heading) 12%,transparent)}
.aff .aff-row__tile .aff-rank svg{position:static;inset:auto;width:15px;height:15px;opacity:1;fill:currentColor}
.aff .aff-row--rank-1 .aff-row__tile .aff-rank{background:var(--aff-medal-1);color:var(--aff-medal-1-ink)}
.aff .aff-row--rank-2 .aff-row__tile .aff-rank{background:var(--aff-medal-2);color:var(--aff-medal-2-ink)}
.aff .aff-row--rank-3 .aff-row__tile .aff-rank{background:var(--aff-medal-3);color:var(--aff-medal-3-ink)}
.aff .aff-row__name strong{font-size:19px;font-family:var(--aff-ui-font-heading)}
.aff .aff-row__offer{align-content:center;gap:10px}
.aff .aff-price{margin:0;text-align:right}.aff .aff-price b{font:700 24px/1.15 var(--aff-ui-font-heading);color:var(--aff-heading)}
.aff .aff-actions{display:grid;gap:8px}
.aff .aff-actions .aff-cta{width:100%}
.aff a.aff-btn-review{display:inline-flex;align-items:center;justify-content:center;gap:var(--aff-btn-gap);min-height:var(--aff-btn-height);padding:var(--aff-btn-pad);border:1px solid var(--aff-btn-secondary-line);border-radius:var(--aff-btn-radius);background:var(--aff-btn-secondary-bg);color:var(--aff-btn-secondary-ink);font:var(--aff-btn-font);text-decoration:none;white-space:nowrap;transition:transform var(--aff-btn-motion),box-shadow var(--aff-btn-motion),border-color var(--aff-btn-motion),color var(--aff-btn-motion),background var(--aff-btn-motion)}
.aff a.aff-btn-review svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.aff a.aff-cta{transition:transform var(--aff-btn-motion),box-shadow var(--aff-btn-motion),background var(--aff-btn-motion),color var(--aff-btn-motion)}
.aff a.aff-cta:hover,.aff a.aff-btn-review:hover{border-color:var(--aff-btn-hover-bg);background:var(--aff-btn-hover-bg);color:var(--aff-btn-hover-ink);transform:translateY(-1px);box-shadow:var(--aff-btn-hover-shadow)}
.aff .aff-verdict__actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-end}
.aff .aff-duel__ctas>div{display:grid;gap:8px}
@media (max-width:760px){
  .aff .aff-row{padding:20px 18px}
  .aff .aff-row__tile .aff-visual{width:72px;height:72px}
  .aff .aff-price{text-align:left}
  .aff .aff-verdict__actions{justify-content:stretch}.aff .aff-verdict__actions>*{flex:1 1 100%}
}
.aff .aff-row__offer .aff-offer{padding:9px 11px}.aff .aff-row__offer .aff-offer b{font-size:13.5px;font-weight:700}

/* SCROLLBARS_SHARED_V1 (demande Julien 07/10) — every horizontal scroll area of the content (tables, matrices,
   comparisons, galleries, rails) shows the same thin rounded bar in the site colours. Same block in
   editorial-journey.css, affiliate-blocks.css and specialized-shared.css (one per page family); rails that hide
   their bar on purpose keep it hidden (zero-specificity fallback). */
:is(.cms-content-table__wrap,.cms-content-matrix__container,.cms-content-matrix__scroll,.pc-table-scroll,.aff-compare__scroll,.aff-gallery__shots,.ej-compare,.cms-pc-std__content pre),
:where(.ej-reader,.aff,.affcmp,.mi-affiliate-surface) :where(*){scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--color-accent,#14a3a8) 55%,#fff) color-mix(in srgb,var(--color-accent,#14a3a8) 9%,transparent)}
:is(.cms-content-table__wrap,.cms-content-matrix__container,.cms-content-matrix__scroll,.pc-table-scroll,.aff-compare__scroll,.aff-gallery__shots,.ej-compare,.cms-pc-std__content pre)::-webkit-scrollbar,
:where(.ej-reader,.aff,.affcmp,.mi-affiliate-surface) :where(*)::-webkit-scrollbar{height:8px;width:8px}
:is(.cms-content-table__wrap,.cms-content-matrix__container,.cms-content-matrix__scroll,.pc-table-scroll,.aff-compare__scroll,.aff-gallery__shots,.ej-compare,.cms-pc-std__content pre)::-webkit-scrollbar-track,
:where(.ej-reader,.aff,.affcmp,.mi-affiliate-surface) :where(*)::-webkit-scrollbar-track{border-radius:999px;background:color-mix(in srgb,var(--color-accent,#14a3a8) 9%,transparent)}
:is(.cms-content-table__wrap,.cms-content-matrix__container,.cms-content-matrix__scroll,.pc-table-scroll,.aff-compare__scroll,.aff-gallery__shots,.ej-compare,.cms-pc-std__content pre)::-webkit-scrollbar-thumb,
:where(.ej-reader,.aff,.affcmp,.mi-affiliate-surface) :where(*)::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--color-accent,#14a3a8) 55%,#fff)}
:is(.cms-content-table__wrap,.cms-content-matrix__container,.cms-content-matrix__scroll,.pc-table-scroll,.aff-compare__scroll,.aff-gallery__shots,.ej-compare,.cms-pc-std__content pre)::-webkit-scrollbar-thumb:hover{background:var(--color-accent,#14a3a8)}

/* AFF_GALLERY_V2: the app screens side by side in phone frames (no scroll strip on desktop), captions under each. */
.aff .aff-gallery__shots--phones{display:grid;grid-auto-flow:row;grid-template-columns:repeat(var(--aff-shots,3),minmax(0,230px));justify-content:center;gap:28px;padding:28px 20px;overflow:visible;scroll-snap-type:none}
.aff .aff-gallery__shots--phones .aff-gallery__shot{gap:12px;justify-items:center;text-align:center}
.aff .aff-gallery__device{display:block;width:100%;padding:8px;border-radius:34px;background:#1d2024;box-shadow:0 18px 36px rgba(22,21,35,.18),inset 0 0 0 1px rgba(255,255,255,.08)}
.aff .aff-gallery__shots--phones .aff-gallery__shot img{border:0;border-radius:27px;aspect-ratio:9/15.5;object-fit:cover;object-position:top}
.aff .aff-gallery__shots--phones figcaption{max-width:220px;font-size:13.5px;font-weight:650;color:var(--aff-heading)}
@media (max-width:760px){.aff .aff-gallery__shots--phones{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:62%;justify-content:start;overflow-x:auto;scroll-snap-type:x mandatory;padding:20px 16px}.aff .aff-gallery__shots--phones .aff-gallery__shot{scroll-snap-align:center}}

/* AFF_TABLE_V1 — the one comparison table (services and physical products): compact grid, criterion column kept
   in view, best value marked, product column heads; beyond --aff-per products, a column carousel with arrows. */
.aff.aff-table{display:grid;gap:12px}
.aff .aff-table__nav{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.aff .aff-table__position{font-size:13px;font-weight:650;color:var(--aff-muted);font-variant-numeric:tabular-nums}
.aff .aff-table__arrow{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--aff-card-line);border-radius:50%;background:var(--aff-paper);color:var(--aff-heading);cursor:pointer}
.aff .aff-table__arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.aff .aff-table__arrow:disabled{opacity:.35;cursor:default}
.aff .aff-table__arrow:not(:disabled):hover{border-color:var(--aff-btn-hover-bg);background:var(--aff-btn-hover-bg);color:var(--aff-btn-hover-ink)}
.aff .aff-table__scroll{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:var(--aff-table-label,170px);background:var(--aff-panel-bg,var(--aff-card));border:1px solid var(--aff-panel-line,var(--aff-card-line));border-radius:var(--aff-panel-radius,var(--aff-radius))}
.aff .aff-table--carousel .aff-table__scroll{scrollbar-width:none}.aff .aff-table--carousel .aff-table__scroll::-webkit-scrollbar{display:none}
.aff .aff-table__grid{--aff-table-label:170px;--aff-table-col:calc((100% - var(--aff-table-label)) / var(--aff-per,4));display:grid;min-width:100%;width:calc(var(--aff-table-label) + var(--aff-cols,3) * max(var(--aff-table-min,150px),var(--aff-table-col)));font-size:14.5px;line-height:1.4}
.aff .aff-table__row{display:grid;grid-template-columns:var(--aff-table-label) repeat(var(--aff-cols,3),minmax(var(--aff-table-min,150px),1fr));border-top:1px solid var(--aff-line)}
.aff .aff-table__row--head{border-top:0}
.aff .aff-table__row>span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:12px 14px;text-align:center;scroll-snap-align:start}
.aff .aff-table__row>.aff-table__label{position:sticky;left:0;z-index:2;align-items:flex-start;text-align:left;font-weight:650;color:var(--aff-heading);background:var(--aff-card);box-shadow:1px 0 0 var(--aff-line)}
.aff .aff-table__row--head>span{background:var(--aff-note);padding-block:16px}
.aff .aff-table__product{position:relative}
.aff .aff-table__product .aff-visual{width:56px;height:56px}
.aff .aff-table__product strong{font-size:15px;line-height:1.25;color:var(--aff-heading)}
.aff .aff-table__brand{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--aff-ui-accent-ink)}
.aff .aff-table__badge{padding:4px 9px;border-radius:var(--aff-chip-radius);background:var(--aff-badge-bg);color:var(--aff-badge-ink);font:var(--aff-badge-font);font-size:10.5px;letter-spacing:var(--aff-badge-tracking);text-transform:uppercase}
.aff .aff-table__cell.is-best{background:var(--aff-good-soft);color:var(--aff-good);font-weight:800}
.aff .aff-table__bool{display:grid;place-items:center;width:28px;height:28px;border-radius:50%}
.aff .aff-table__bool svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.aff .aff-table__bool.is-yes{background:color-mix(in srgb,var(--aff-good) 16%,var(--aff-paper));color:var(--aff-good);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--aff-good) 28%,transparent)}
.aff .aff-table__bool.is-no{background:var(--aff-bad-soft);color:color-mix(in srgb,var(--aff-bad) 80%,var(--aff-muted));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--aff-bad) 18%,transparent)}
.aff .aff-table__row--cta>span{justify-content:flex-start}
.aff .aff-table__row--cta .aff-actions{width:100%}
.aff .aff-table__row--cta :is(.aff-cta,.aff-btn-review){min-height:var(--aff-btn-height-sm);padding:var(--aff-btn-pad-sm);font:var(--aff-btn-font-sm)}
.aff .aff-table__row--cta>.aff-table__cell{align-items:flex-start}
.aff .aff-table__row--cta .aff-actions{grid-template-rows:repeat(2,minmax(var(--aff-btn-height-sm,40px),auto))}
.aff .aff-table__row--cta :is(.aff-cta,.aff-btn-review){width:100%;justify-content:center}
/* No offer for a column: its « Avis complet » stays on the line of the others. */
.aff .aff-table__row--cta .aff-btn-review:only-child{grid-row:2}
@media (max-width:760px){.aff .aff-table__grid{--aff-table-label:96px;--aff-table-min:100px;--aff-per:2;font-size:13px}.aff .aff-table__row>span{padding:10px 8px}.aff .aff-table__product .aff-visual{width:44px;height:44px}}
.ej-reader :is(.ej-section,.ej-opening)>.aff.aff-table{--ej-col:var(--ej-wide)}
/* AFF_TABLE_STANDOUT_V1: a feature only a few models have reads as a strength of theirs. */
.aff .aff-table__cell.is-standout{background:var(--aff-good-soft)}

/* AFF_FAMILY_LINKS_V1 (Julien 2026-10-07) — bottom block of the affiliation pages: full-width band (the background is
   bled to the viewport edges without widening the page), one card family: picture, overlay, type badge, title; a review
   card shows its product over the comparison's picture. Theme colours, fonts and radius. */
.aff.aff-family{position:relative;margin:clamp(48px,7vw,88px) 0 0;padding:clamp(44px,6vw,72px) 0 clamp(52px,7vw,84px);background:var(--aff-family-bg,color-mix(in srgb,var(--color-accent,#14a3a8) 7%,var(--aff-paper)))}
.aff .aff-family__inner{display:grid;gap:clamp(36px,5vw,56px)}
/* Moved before the site footer: full width band, content at the container width, glued to the footer. */
.aff.aff-family.is-bottom{margin:0;width:100%}
.aff.aff-family.is-bottom .aff-family__inner{width:min(var(--container,1220px),100% - 32px);margin-inline:auto}
.aff .aff-family__group{display:grid;gap:22px}
.aff .aff-family__head [data-component="section-heading"]{margin:0}
.aff .aff-family__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;margin:0;padding:0;list-style:none}
.aff .aff-family__item{margin:0;padding:0;list-style:none}
.aff .aff-family__item::before,.aff .aff-family__item::marker{content:none}
.aff .aff-family__card{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:220px;height:100%;box-sizing:border-box;overflow:hidden;padding:18px;border-radius:var(--aff-radius,16px);background:var(--color-dark-bg,#1b2440);color:var(--color-dark-text,#fff);text-decoration:none;box-shadow:0 1px 2px color-mix(in srgb,var(--color-text,#1c2733) 10%,transparent);transition:transform .2s ease,box-shadow .2s ease}
.aff .aff-family__card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--color-dark-bg,#1b2440) 10%,transparent) 0%,color-mix(in srgb,var(--color-dark-bg,#1b2440) 55%,transparent) 48%,color-mix(in srgb,var(--color-dark-bg,#1b2440) 92%,transparent) 100%)}
.aff .aff-family__bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.aff .aff-family__product{position:absolute;z-index:0;top:14px;left:50%;width:auto;height:58%;max-width:70%;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));transition:transform .3s ease}
.aff .aff-family__card.has-product::after{background:linear-gradient(180deg,color-mix(in srgb,var(--color-dark-bg,#1b2440) 38%,transparent) 0%,color-mix(in srgb,var(--color-dark-bg,#1b2440) 62%,transparent) 50%,color-mix(in srgb,var(--color-dark-bg,#1b2440) 94%,transparent) 100%)}
.aff .aff-family__body{position:relative;z-index:1;display:grid;gap:9px;justify-items:start}
.aff .aff-family__badge{padding:4px 10px;border-radius:var(--radius-full,999px);background:var(--color-accent-2,#f2b84b);color:var(--color-on-accent-2,var(--color-dark-bg,#1b2440));font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.aff .aff-family__title{font-family:var(--font-heading,inherit);font-size:clamp(17px,1.5vw,19px);font-weight:800;line-height:1.25;text-wrap:balance}
.aff .aff-family__card:hover{transform:translateY(-3px);box-shadow:0 12px 26px color-mix(in srgb,var(--color-text,#1c2733) 18%,transparent)}
.aff .aff-family__card:hover .aff-family__bg{transform:scale(1.05)}
.aff .aff-family__card:hover .aff-family__product{transform:translateX(-50%) translateY(-4px)}
.aff .aff-family__card:focus-visible{outline:3px solid var(--color-accent,#14a3a8);outline-offset:3px}
/* Mobile: one horizontal rail per group (a card and a half in view), snapped, thin shared scrollbar. */
@media (max-width:640px){.aff .aff-family__grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:68%;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}.aff .aff-family__item{scroll-snap-align:start}.aff .aff-family__card{min-height:190px;padding:14px}.aff .aff-family__title{font-size:16px}}
/* The rail scrolls inside the page width: nested grid items may shrink below their content. */
.aff .aff-family__inner>*,.aff .aff-family__group>*,.aff .aff-family__nav{min-width:0}
.aff .aff-family__inner{grid-template-columns:minmax(0,1fr)}
.aff .aff-family__group{grid-template-columns:minmax(0,1fr)}
/* AFF_STICKY_PRICE_V1: the observed price of a physical product, plain and readable (no promotion box). */
.aff .aff-sticky__price{display:grid;gap:1px;margin:0;line-height:1.1;text-align:right}
.aff .aff-sticky__price span{color:var(--aff-muted);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.aff .aff-sticky__price b{color:var(--aff-heading,var(--color-dark-bg));font-family:var(--font-heading,inherit);font-size:22px;font-weight:800;white-space:nowrap}
@media (max-width:640px){.aff .aff-sticky__price span{display:none}.aff .aff-sticky__price b{font-size:18px}}

/* AFF_FAMILY_SINGLE_V1: 3 cards per row on desktop (6 at most). */
@media (min-width:900px){.aff .aff-family__grid{grid-template-columns:repeat(3,minmax(0,1fr))}.aff .aff-family__card{min-height:240px}}