/* mastergf — shared components (luxury noir)
   Buttons · comparison table · brand-logo card · sponsored-CTA block ·
   rank rows · hero motion layer · FAQ · footer · compliance chrome. */

/* ---------- buttons ---------- */
.btn{display:inline-block;font-size:11px;letter-spacing:.3em;text-transform:uppercase;padding:17px 38px;border:1px solid var(--gold);color:var(--gold);transition:background .35s,color .35s;cursor:pointer;background:none;font-family:var(--sans)}
.btn:hover{background:var(--gold);color:var(--ink)}
.btn-ghost{border-color:transparent;color:var(--ivory-dim);padding:17px 6px}
.btn-ghost:hover{background:none;color:var(--ivory)}
.btn-blush{border-color:var(--blush);color:var(--blush)}
.btn-blush:hover{background:var(--blush);color:var(--ink)}

/* ---------- hero + ambient motion layer ---------- */
.hero{position:relative;padding:clamp(90px,14vh,160px) clamp(20px,6vw,72px) 110px;overflow:hidden}
.hero>*{max-width:1180px;margin-left:auto;margin-right:auto;position:relative;z-index:2}
.hero .ovl{display:block;margin-bottom:34px}
.hero p.lede{margin-top:38px}
.hero-cta{margin-top:56px;display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.hero-motion{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-motion video{width:100%;height:100%;object-fit:cover;opacity:.5;filter:brightness(.7) saturate(.85)}
.hero-motion::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,10,12,.55),rgba(10,10,12,.92))}

/* ---------- marquee ---------- */
.marquee{border-top:1px solid var(--gold-faint);border-bottom:1px solid var(--gold-faint);overflow:hidden;white-space:nowrap;padding:15px 0;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--ivory-dim)}
.marquee span{display:inline-block;padding-right:60px;animation:mq 30s linear infinite}
@keyframes mq{to{transform:translateX(-50%)}}
.marquee i{color:var(--gold);font-style:normal;padding:0 18px}

/* ---------- rank rows (Top-8 reveal) ---------- */
.rank{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:34px;padding:44px 0;border-top:1px solid var(--gold-faint);align-items:center}
.rank:last-child{border-bottom:1px solid var(--gold-faint)}
.rank .no{font-family:var(--serif);font-style:italic;font-weight:300;font-size:54px;color:var(--gold);line-height:1}
.rank h3{font-family:var(--serif);font-weight:400;font-size:27px;letter-spacing:.01em}
.rank .tag{display:inline-block;margin-left:14px;font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:var(--blush);border:1px solid var(--blush-dim);padding:4px 9px;vertical-align:middle}
.rank p{color:var(--ivory-dim);font-size:14px;margin-top:10px;max-width:60ch}
.rank .acts{display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.rank .go{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);border-bottom:1px solid var(--gold-dim);padding-bottom:4px;transition:border-color .3s}
.rank .go:hover{border-color:var(--gold)}
@media(max-width:760px){.rank{grid-template-columns:56px 1fr;gap:20px}.rank .no{font-size:34px}.rank .acts{grid-column:2;flex-direction:row;align-items:center;gap:26px}}

/* ---------- comparison table ---------- */
.cmp-wrap{overflow-x:auto;border:1px solid var(--gold-faint)}
table.cmp{width:100%;border-collapse:collapse;font-size:13px;min-width:680px}
table.cmp th{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);font-weight:400;text-align:left;padding:18px 20px;border-bottom:1px solid var(--gold-dim)}
table.cmp td{padding:20px;border-bottom:1px solid var(--gold-faint);color:var(--ivory-dim);vertical-align:middle}
table.cmp tr:last-child td{border-bottom:0}
table.cmp td.brand{font-family:var(--serif);font-size:19px;color:var(--ivory);white-space:nowrap}
table.cmp td.brand img{height:26px;width:auto;max-width:120px;vertical-align:middle;margin-right:12px;filter:none}
table.cmp .rate{color:var(--ivory)}
table.cmp .note{font-style:italic;font-family:var(--serif);color:var(--ivory-dim)}
table.cmp a.visit{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold-dim);padding:10px 18px;white-space:nowrap;transition:background .3s,color .3s;display:inline-block}
table.cmp a.visit:hover{background:var(--gold);color:var(--ink)}

/* ---------- brand-logo card ---------- */
.logo-card{border:1px solid var(--gold-faint);border-left:1px solid var(--gold);padding:34px 30px;display:flex;flex-direction:column;gap:16px;transition:border-color .3s;background:linear-gradient(160deg,rgba(201,169,98,.04),transparent 55%)}
.logo-card:hover{border-color:var(--gold-dim)}
.logo-card .logo-slot{height:44px;display:flex;align-items:center}
.logo-card .logo-slot img{max-height:44px;max-width:170px;object-fit:contain}
.logo-card h3{font-family:var(--serif);font-weight:400;font-size:24px}
.logo-card .deal{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.logo-card p{color:var(--ivory-dim);font-size:13px}
.logo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}

/* ---------- sponsored-CTA block ---------- */
.cta-sponsored{border:1px solid var(--gold-dim);padding:48px 44px;background:linear-gradient(160deg,rgba(201,169,98,.06),transparent 55%);display:flex;flex-direction:column;gap:18px;position:relative}
.cta-sponsored .ovl{font-size:9px;letter-spacing:.34em;color:var(--ivory-dim)}
.cta-sponsored h3{font-family:var(--serif);font-weight:300;font-size:clamp(28px,3.4vw,40px);line-height:1.08}
.cta-sponsored h3 em{font-style:italic;color:var(--blush)}
.cta-sponsored p{color:var(--ivory-dim);font-size:14px;max-width:48ch}
.cta-sponsored .cta-row{margin-top:12px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}

/* ---------- dossier / article cards ---------- */
.dossiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.dossier{border:1px solid var(--gold-faint);border-left:1px solid var(--gold);padding:30px 30px 26px;transition:border-color .3s;display:block}
.dossier:hover{border-color:var(--gold-dim)}
.dossier .dn{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:14px}
.dossier h3{font-family:var(--serif);font-weight:400;font-size:24px;margin:8px 0 10px;line-height:1.15}
.dossier p{color:var(--ivory-dim);font-size:13px}
.dossier .rd2{display:inline-block;margin-top:16px;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}

/* ---------- FAQ ---------- */
.faq{max-width:760px}
.faq details{border-top:1px solid var(--gold-faint);padding:26px 0}
.faq details:last-child{border-bottom:1px solid var(--gold-faint)}
.faq summary{font-family:var(--serif);font-size:21px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq summary::after{content:"+";color:var(--gold);font-size:22px;font-family:var(--sans);font-weight:300;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{color:var(--ivory-dim);font-size:14px;margin-top:14px;max-width:58ch}

/* ---------- footer + compliance ---------- */
footer{border-top:1px solid var(--gold-faint);padding:64px clamp(20px,6vw,72px);display:grid;grid-template-columns:1fr auto;gap:40px;font-size:12px;color:var(--ivory-dim)}
footer .disc{max-width:58ch;line-height:1.8}
footer .disc b{color:var(--ivory);font-weight:400}
footer nav{display:flex;flex-direction:column;gap:12px;font-size:10px}
footer nav .fn-head{letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
footer nav a:hover{color:var(--ivory)}
@media(max-width:640px){footer{grid-template-columns:1fr}}

.age-gate-note{border:1px solid var(--blush-dim);color:var(--blush);font-size:11px;letter-spacing:.14em;padding:14px 20px;margin:0 clamp(20px,6vw,72px);text-align:center;text-transform:uppercase}