/* ============================================================
   Sunset Bar · stile 2026 (27/09/2026) — base comune delle pagine rifatte.
   Si attiva mettendo class="sb26" sul <body>: le pagine vecchie non cambiano.
   Colori: fondo notte, oro dei punti, arancio del Sunset, verde acqua per le azioni.
   ============================================================ */
@font-face{font-family:AntonT;src:url('/loyalty/fonts/Anton-Regular.ttf');font-display:swap}
:root{--sb-bg:#0b0a16;--sb-card:rgba(255,255,255,.06);--sb-card2:rgba(255,255,255,.03);--sb-line:rgba(255,255,255,.12);
  --sb-testo:#f3f5fb;--sb-piano:#9aa6c2;--sb-oro:#fbbf24;--sb-oro2:#ffb000;--sb-arancio:#f97316;--sb-acqua:#2dd4bf;--sb-rosso:#c8261c}
body.sb26{background:radial-gradient(120% 45% at 50% 0%,rgba(249,115,22,.16),transparent 60%),var(--sb-bg) !important;color:var(--sb-testo)}
.sb26 .sb-titolo{font-family:AntonT,Impact,sans-serif;font-weight:400;letter-spacing:.05em;line-height:1}
.sb26 .sb-card{background:linear-gradient(180deg,var(--sb-card),var(--sb-card2));border:1px solid var(--sb-line);border-radius:20px}
.sb26 .sb-btn{display:block;width:100%;text-align:center;text-decoration:none;border:none;border-radius:14px;padding:.95rem;cursor:pointer;
  background:linear-gradient(135deg,#ffd35c,var(--sb-oro2));color:#1b1300;font-family:AntonT,Impact,sans-serif;font-weight:400;font-size:1.15rem;letter-spacing:.06em;box-shadow:0 8px 22px rgba(255,176,0,.28)}
.sb26 .sb-btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border-radius:12px;padding:.7rem 1rem;border:1px solid var(--sb-line);background:transparent;color:var(--sb-testo);font-weight:700;cursor:pointer;text-decoration:none}
/* marchio (uguale alla home) */
.sb26 .sb-marchio{display:inline-flex;flex-direction:column;align-items:center;gap:.35rem;text-decoration:none}
.sb26 .sb-marchio .n{font-family:'Playfair Display',serif;font-weight:700;font-size:2rem;line-height:1.15;padding:0 .15rem .1rem;
  background:linear-gradient(105deg,#fff 0%,#fff 38%,#fde68a 46%,#fffbeb 50%,#fbbf24 56%,#fff 64%,#fff 100%);background-size:260% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:sbLucciola 7s ease-in-out infinite;filter:drop-shadow(0 0 12px rgba(251,191,36,.25))}
.sb26 .sb-marchio .n em{font-family:'Great Vibes',cursive;font-style:normal;font-size:1.25em}
.sb26 .sb-marchio small{font-size:.58rem;letter-spacing:.22em;color:rgba(251,191,36,.8);font-weight:700;display:flex;align-items:center;gap:.3rem}
.sb26 .sb-marchio small img{height:1.05rem;width:auto;display:block}
@keyframes sbLucciola{0%,55%{background-position:100% 0}85%,100%{background-position:0 0}}
/* piccole reazioni: tutto quello che si tocca si schiaccia un attimo */
.sb26 a,.sb26 button,.sb26 .sb-press{transition:transform .12s ease,filter .12s ease;-webkit-tap-highlight-color:transparent}
.sb26 a:active,.sb26 button:active,.sb26 .sb-press:active{transform:scale(.97);filter:brightness(1.08)}
@media (prefers-reduced-motion:reduce){.sb26 .sb-marchio .n{animation:none}.sb26 a:active,.sb26 button:active{transform:none}}
/* testata unica delle pagine interne: freccia tonda + titolo Anton + riga piccola */
.sb26 .sb-top{display:flex;align-items:center;gap:.8rem;max-width:620px;margin:0 auto;padding:.85rem 1rem .5rem;position:relative;z-index:5}
.sb26 .sb-top .bk{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid var(--sb-line);display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;font-size:1.3rem;flex-shrink:0}
.sb26 .sb-top .t{min-width:0}
.sb26 .sb-top .t b{display:block;font-family:AntonT,Impact,sans-serif;font-weight:400;font-size:clamp(1.1rem,5.6vw,1.5rem);letter-spacing:.05em;line-height:1;white-space:nowrap}
.sb26 .sb-top .t span{display:block;font-size:.74rem;color:#fcd34d;margin-top:.15rem}
.sb26 .sb-top .dx{margin-left:auto}
