/* Signup Here – additions for stand-alone subdomain pages (content/standalone/*.json, e.g. etoro.signup-here.com).
   Loaded only by those pages, after site.css. Uses the tokens from site.css; no new colours except the warning tones
   already used by .callout-warn / .pc .cons. */

/* Header without main navigation: short label on the right instead of the 18+ badge */
.hdr-note{margin:0 0 0 auto;color:#cfd7e2;font-size:.82rem;line-height:1.3;text-align:right}
@media (max-width:980px){.site-header .bar{padding-bottom:12px;flex-wrap:nowrap}}
@media (max-width:560px){.hdr-note .x{display:none}}

/* Risk warning band directly under the header */
.risk-top{background:var(--rust-tint);border-bottom:1px solid #f0d3c2;color:#4a1d0c}
.risk-top-in{display:flex;gap:12px;align-items:flex-start;padding-top:12px;padding-bottom:12px}
.risk-top p{margin:0;font-size:.88rem;line-height:1.5}
.risk-top b{color:#7c2d12}
.risk-ico{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;margin-top:1px;border-radius:50%;
  background:var(--rust);color:#fff;font:800 .85rem/1 var(--head)}
@media (max-width:640px){.risk-top p{font-size:.84rem}}

/* Footer risk block (takes the place of the responsible-gambling block, same .f-rg layout) */
.risk-ico-lg{width:46px;height:46px;margin-top:0;background:transparent;border:2px solid #e9edf3;font-size:1.25rem}
.f-risk p{max-width:88ch}
.f-risk p b{color:#fff}
.f-risk .f-disc{color:#fff;font-weight:600;margin-bottom:0}
.f-risk .f-src{font-size:.84rem;color:#8d99ab}
.f-risk .f-src a{color:var(--mint)}

/* Name as plain text in the place of an operator logo plate */
.name-badge{display:inline-flex;align-items:center;justify-content:center;height:56px;padding:0 18px;border-radius:11px;
  background:var(--paper-2);border:1px solid var(--line);color:var(--ink);font:800 1.45rem/1 var(--head);letter-spacing:-.01em;flex:none}
@media (max-width:520px){.name-badge{height:46px;padding:0 14px;font-size:1.2rem}}

/* "At a glance" panel (no score: these pages do not use the casino rating scheme) */
.panel-h{font-size:1.05rem;margin:0 0 10px;letter-spacing:0}
.glance{margin:0;border-top:1px solid var(--line)}
.glance div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.glance dt{font-size:.84rem;color:var(--muted);line-height:1.4}
.glance dd{margin:0;font-size:.88rem;font-weight:600;color:var(--ink);line-height:1.4;text-align:right}

/* Numbered source citations */
.cite{font-size:.7em;line-height:0;vertical-align:super;margin-left:1px;white-space:nowrap}
.cite a{text-decoration:none;font-weight:650;padding:0 1px}
.cite a:hover{text-decoration:underline}
.sources li{scroll-margin-top:20px}
.sources li:target{background:var(--go-tint);border-radius:6px}
.rv-body .facts dd p{margin:0}

/* Paragraph directly after a facts box */
.rv-body section > .facts + p{margin-top:1.05em}

/* Outline button inside the dark verdict box (".verdict a" would otherwise turn its label mint on white) */
.verdict a.btn-line{color:var(--ink)}
.verdict a.btn-line:hover{color:var(--ink);border-color:var(--mint)}

/* Footer: site.css sets padding shorthands on .f-main/.f-bottom that cancel the .wrap gutter (flush to the screen
   edge on phones). Restored here for these pages only; site.css is left untouched. */
.site-footer .f-main,.site-footer .f-bottom{padding-left:var(--gut);padding-right:var(--gut)}

/* Guide pages (content/standalone/*.json with "kind": "guide", e.g. xtb.signup-here.com): one column under the hero,
   no risk band (the page only explains how registration works), disclosure as a quiet aside at the top of the article. */
.guide{padding-top:34px}
.guide > *{max-width:76ch}
.guide h2{margin-top:1.6em}
.guide > h2:first-of-type{margin-top:0}
.guide .steps{margin:0 0 1.2em}
.guide .callout{margin:1.2em 0}
.guide-disclose{font-size:.9rem;line-height:1.55;color:var(--muted);border-left:3px solid var(--line-2);padding:2px 0 2px 14px;margin:0 0 1.6em}
.f-guide .risk-ico-lg{font-style:italic;font-family:var(--head)}

/* Top-ten list page (content/standalone/*.json with "kind": "toplist", topten.signup-here.com): one column under the hero,
   an overview table, then ten numbered cards with a small facts grid. No risk band, no rating scheme, no logos. */
.toplist{padding-top:34px}
.toplist > *{max-width:76ch}
.toplist h2{margin-top:1.6em}
.toplist > h2:first-of-type{margin-top:0}
.tl-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-s);box-shadow:var(--shadow)}
.tl-table{width:100%;min-width:560px;border-collapse:collapse;font-size:.92rem}
.tl-table th{font:650 .72rem/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left;
  padding:11px 12px;background:#faf9f5;border-bottom:1px solid var(--line)}
.tl-table td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.45}
.tl-table tr:last-child td{border-bottom:0}
.tl-table .n{width:34px;text-align:center;font:800 .9rem/1.45 var(--head);color:var(--ink)}
.tl-table a{font-weight:650;color:var(--ink)}
.tl-criteria{margin:0 0 1.2em}
.tl-list{list-style:none;margin:0;padding:0}
.tl-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);
  padding:22px 24px;margin:0 0 18px;scroll-margin-top:20px}
.tl-head{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.tl-rank{display:inline-grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;
  font:800 1.1rem/1 var(--head)}
.tl-item:first-child .tl-rank{background:var(--go)}
.tl-head h3{margin:0;font-size:1.3rem;line-height:1.2}
.tl-tag{margin:3px 0 0;font-size:.86rem;color:var(--go-hover);font-weight:650}
.tl-glance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 16px;margin:0 0 14px;padding:12px 14px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s)}
.tl-glance div{min-width:0}
.tl-glance dt{font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);line-height:1.3}
.tl-glance dd{margin:2px 0 0;font-size:.88rem;font-weight:600;color:var(--ink);line-height:1.4;overflow-wrap:anywhere}
.tl-item p{margin:0 0 .9em}
.tl-item h4{margin:1em 0 .4em;font-size:.95rem}
.tl-high{margin:0 0 1em;padding-left:1.2em}
.tl-note{font-size:.92rem;color:var(--muted)}
.tl-act{margin:0}
@media (max-width:640px){.tl-item{padding:18px 16px}.tl-glance{grid-template-columns:repeat(2,minmax(0,1fr))}.tl-head h3{font-size:1.18rem}}
/* Phones: the overview table becomes a stack of small cards instead of a sideways-scrolling table */
@media (max-width:640px){
  .tl-wrap{overflow:visible;background:transparent;border:0;box-shadow:none;border-radius:0}
  .tl-table,.tl-table tbody{display:block;min-width:0}
  .tl-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .tl-table tr{display:grid;grid-template-columns:30px minmax(0,1fr);gap:2px 10px;background:var(--surface);border:1px solid var(--line);
    border-radius:var(--r-s);box-shadow:var(--shadow);padding:12px 14px;margin:0 0 10px}
  .tl-table td{display:block;padding:0;border:0}
  .tl-table .n{grid-row:1/span 4;width:auto;text-align:left;line-height:1.5}
  .tl-table td:nth-child(3)::before{content:"Since ";color:var(--muted)}
  .tl-table td:nth-child(4)::before{content:"Based in ";color:var(--muted)}
  .tl-table td:nth-child(5){color:var(--go-hover);font-weight:600}
}

/* Service reviews ("kind": "service"): the brand's own logo file next to the H1, optional one-line legal notice under the hero */
.brand-logo{height:56px;width:auto;max-width:300px;object-fit:contain;flex:none;display:block}   /* object-fit: breite Wortmarken (D&G 10:1) werden im 300x56-Kasten proportional verkleinert, nicht gestaucht */
@media (max-width:520px){.brand-logo{height:44px;max-width:220px}}
.sv-notice{background:var(--paper-2);border-bottom:1px solid var(--line)}
.sv-notice p{margin:0;padding:10px 0;font-size:.88rem;color:var(--muted);max-width:none}
/* Operator 2026-11-02: long brand names (GoldenCrest Metals) next to the logo overflowed 390-px screens - stack logo and H1 */
@media (max-width:520px){.rv-title{flex-wrap:wrap;row-gap:10px}}

/* Call pages ("kind": "call", operator 2026-11-03, e.g. flights.signup-here.com / medicare-plans.signup-here.com): the only
   action is a phone call. Big tel: button in the hero panel and in the next-step box, a sticky bottom bar on phones,
   larger type for an older audience, a plain "Important information" block for the mandated wording. */
.call-points{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.call-points li{font-size:.9rem;font-weight:600;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.call-points li::before{content:"✓";color:var(--go);margin-right:6px;font-weight:800}
.call-panel{text-align:center}
.call-panel .panel-h{font-size:1.15rem}
.call-btn{width:100%;font-size:1.15rem;font-weight:800;gap:10px;flex-wrap:wrap;line-height:1.25;padding:16px 18px}
.call-num{font-variant-numeric:tabular-nums;letter-spacing:.01em;white-space:nowrap}
.call-ico{display:inline-block;width:20px;height:20px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/></svg>") center/contain no-repeat}
.call-hours{margin:10px 0 0;font-size:.92rem;color:var(--muted)}
.call-soon{margin:0;padding:14px;background:var(--paper-2);border:1px dashed var(--line-2);border-radius:var(--r-s);font-size:.95rem;line-height:1.5}
.call-panel .disclose{margin-top:14px;text-align:left}
.call-body{font-size:1.04rem}
.call-body .steps li{font-size:1rem}
.call-legal{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-s);padding:16px 18px;font-size:.94rem;line-height:1.6}
.call-legal p{margin:0 0 .8em}
.call-legal p:last-child{margin:0}
.call-cta{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.call-cta .call-btn{max-width:520px}
.call-cta .call-hours{color:#cfd7e2}
.call-cta .call-soon{color:var(--ink)}
.verdict .call-btn{color:#fff}
.verdict .call-btn:hover{color:#fff}
/* sticky bottom bar on phones (only rendered when a number exists) */
.call-bar{display:none}
@media (max-width:760px){
  .call-bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:20;padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));
    background:rgba(246,244,239,.96);border-top:1px solid var(--line);backdrop-filter:blur(6px)}
  .call-bar-btn{width:100%;min-height:52px;font-size:1.08rem;font-weight:800}
  body:has(.call-bar){padding-bottom:84px}
}
/* auto-dial variant (/hosts/<slug>/call/) */
.call-dial .call-dial-box{max-width:620px;margin:0 auto;padding:36px 0 44px;text-align:center}
.call-dial-kicker{margin:0 0 10px;font:650 .78rem/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--go-hover)}
.call-dial h1{font-size:1.75rem}
.call-dial .call-points{justify-content:center;margin-top:16px}
.call-dial .disclose{text-align:left;margin-top:18px}
.call-dial-btn{margin-top:18px;font-size:1.35rem}
