/* =====================================================================
   Layout: header (utility strip + nav), mobile menu, shared tail
   (responsible gambling, help strip, payment methods, footer)
   ===================================================================== */

/* ---------- Utility strip ---------- */
.utility { background: #000; border-bottom: 1px solid var(--c-line); }
.utility__inner { display: flex; justify-content: space-between; align-items: center; height: 35px; }
.utility__left { font: 600 11px/1 var(--f-plex); letter-spacing: 1px; color: var(--c-gray); text-transform: uppercase; white-space: nowrap; }
.utility__right { display: flex; align-items: center; gap: 24px; }
.utility__link { font: 600 11px/1 var(--f-plex); letter-spacing: .5px; color: var(--c-gray); transition: color var(--t-fast); }
.utility__link:hover { color: var(--c-paper); }
.utility__phone { font: 700 11px/1 var(--f-plex); color: var(--c-orange); }

/* ---------- Main nav ---------- */
.nav { position: sticky; top: 0; z-index: 60; background: var(--c-bg); border-bottom: 1px solid var(--c-line); transition: box-shadow var(--t-med); }
.nav.is-scrolled { box-shadow: 0 12px 32px -16px rgba(0,0,0,.9); }
.nav__inner { display: flex; justify-content: space-between; align-items: center; height: 67px; }
.nav__brand { font: 700 32px/1 var(--f-osw); letter-spacing: -1px; color: var(--c-paper); white-space: nowrap; }
.nav__links { display: flex; height: 100%; }
.nav__item { display: flex; border-left: 1px solid var(--c-line); }
.nav__item:last-child { border-right: 1px solid var(--c-line); }
.nav__link { position: relative; display: flex; align-items: center; height: 100%; padding: 0 20px; font: 600 14px/1 var(--f-osw); letter-spacing: 1px; color: var(--c-paper); white-space: nowrap; transition: color var(--t-fast); }
.nav__link::after { content: ''; position: absolute; left: 20px; right: 20px; bottom: 0; height: 2px; background: var(--c-orange); transform: scaleX(0); transform-origin: left; transition: transform var(--t-med) var(--ease-out); }
.nav__link:hover { color: var(--c-orange); }
.nav__link:hover::after, .nav__link--active::after { transform: scaleX(1); }
.nav__link--active { color: var(--c-orange); }
.nav__actions { display: flex; align-items: center; gap: 20px; }
.nav__login { font: 600 14px/1 var(--f-osw); letter-spacing: 1px; color: var(--c-paper); transition: color var(--t-fast); white-space: nowrap; }
.nav__login:hover { color: var(--c-orange); }
.nav__user { font: 700 14px/1 var(--f-osw); letter-spacing: 1px; color: var(--c-orange); white-space: nowrap; }
.nav__burger { display: none; width: 20px; height: 20px; flex-direction: column; justify-content: center; gap: 4px; padding: 0 1px; }
.nav__burger span { display: block; height: 2px; width: 18px; background: var(--c-paper); transition: transform var(--t-med) var(--ease-out), opacity var(--t-fast); }

@media (max-width: 1099px) {
  .nav__link { padding: 0 12px; font-size: 13px; }
  .nav__brand { font-size: 28px; }
}
@media (max-width: 899px) {
  .nav__links { display: none; }
  .nav__burger { display: flex; }
}
@media (max-width: 899px) {
  .utility__inner { flex-direction: column; align-items: stretch; height: auto; gap: 4px; padding-top: 8px; padding-bottom: 8px; }
  .utility__left { font-size: 10px; line-height: 1.3; letter-spacing: .5px; white-space: normal; }
  .utility__right { justify-content: space-between; gap: 8px; }
  .utility__link, .utility__phone { font-size: 10px; }
}
@media (max-width: 767px) {
  .nav__inner { height: 55px; }
  .nav__brand { font-size: 24px; letter-spacing: -.5px; }
  .nav__actions { gap: 16px; }
  .nav__join, .nav__user { display: none; }
}

/* ---------- Mobile menu ---------- */
.mmenu {
  position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; justify-content: space-between;
  background: var(--c-bg); overflow-y: auto; transform: translateX(100%); visibility: hidden;
  transition: transform .45s var(--ease-out), visibility 0s .45s;
}
.mmenu[hidden] { display: flex; }
.mmenu.is-open { transform: translateX(0); visibility: visible; transition: transform .45s var(--ease-out), visibility 0s; }
.mmenu__utility { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; background: #000; padding: 6px 16px; }
.mmenu__utility-text { flex: 1; font: 600 9px/1.3 var(--f-plex); color: var(--c-gray); }
.mmenu__utility-link { font: 600 9px/1.3 var(--f-plex); color: var(--c-gray); }
.mmenu__bar { display: flex; justify-content: space-between; align-items: center; height: 56px; padding: 0 16px; border-bottom: 1px solid var(--c-line); }
.mmenu__brand { font: 700 24px/1 var(--f-osw); color: var(--c-paper); }
.mmenu__close { width: 32px; height: 32px; border: 1px solid var(--c-line); display: flex; align-items: center; justify-content: center; font: 700 18px/1 var(--f-osw); color: var(--c-paper); transition: border-color var(--t-fast), color var(--t-fast); }
.mmenu__close:hover { border-color: var(--c-orange); color: var(--c-orange); }
.mmenu__body { position: relative; padding: 0 16px; }
.mmenu__ghost { position: absolute; left: 12px; top: 120px; font: 700 120px/1 var(--f-osw); color: var(--c-line); opacity: .15; pointer-events: none; user-select: none; }
.mmenu__list { position: relative; z-index: 1; }
.mmenu__item { border-bottom: 1px solid var(--c-line); opacity: 0; transform: translateX(24px); transition: opacity .5s var(--ease-out), transform .5s var(--ease-out); transition-delay: calc(var(--i, 0) * 60ms + .15s); }
.mmenu.is-open .mmenu__item { opacity: 1; transform: none; }
.mmenu__link { display: flex; align-items: center; gap: 12px; padding: 14px 0 13px; }
.mmenu__num { font: 700 18px/var(--lh-osw) var(--f-osw); color: var(--c-orange); width: 24px; }
.mmenu__label { font: 700 22px/var(--lh-osw) var(--f-osw); letter-spacing: .5px; color: var(--c-paper); transition: color var(--t-fast); }
.mmenu__link--active .mmenu__label, .mmenu__link:hover .mmenu__label { color: var(--c-orange); }
.mmenu__actions { display: flex; flex-direction: column; gap: 8px; padding: 16px; }
.mmenu__actions .btn { padding: 12px 0; font-size: 15px; font-weight: 700; }
.mmenu__footer { background: #000; border-top: 1px solid var(--c-line); padding: 16px 16px 20px; display: flex; flex-direction: column; gap: 8px; }
.mmenu__footer-row { display: flex; justify-content: space-between; align-items: flex-start; }
.mmenu__age { font: 700 11px/var(--lh-osw) var(--f-osw); color: var(--c-gray); }
.mmenu__phone { font: 600 10px/1.3 var(--f-plex); color: var(--c-orange); }
.mmenu__footer-text { font: 400 10px/14px var(--f-plex); color: var(--c-gray-2); }
@media (min-width: 900px) { .mmenu { display: none !important; } }

/* ---------- Responsible gambling section (shared) ---------- */
.rg { background: var(--c-paper); color: var(--c-ink); border-top: 1px solid var(--c-ink); border-bottom: 1px solid var(--c-ink); padding: 100px 0; }
.rg__inner { display: flex; gap: 64px; align-items: flex-start; }
.rg__left { width: 480px; flex: none; display: flex; flex-direction: column; gap: 24px; }
.rg__title { font: 700 56px/1.05 var(--f-osw); color: var(--c-ink); }
.rg__title-line { display: block; }
.rg__title-line + .rg__title-line { margin-top: 4px; }
.rg__title-line--accent { color: var(--c-orange); }
.rg__text { font: 400 15px/24px var(--f-plex); color: var(--c-gray-2); }
.rg__list { flex: 1; min-width: 0; }
.rg__row { border-top: 1px solid var(--c-ink); }
.rg__row:last-child { border-bottom: 1px solid var(--c-ink); }
.rg__link { display: flex; align-items: center; padding: 23px 0 24px; transition: padding-left var(--t-med) var(--ease-out); }
.rg__link:hover { padding-left: 8px; }
.rg__num { width: 60px; flex: none; font: 700 32px/1 var(--f-osw); color: var(--c-gray-2); }
.rg__content { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.rg__row-title { font: 700 18px/var(--lh-osw) var(--f-osw); color: var(--c-ink); }
.rg__row-text { font: 400 13px/1.3 var(--f-plex); color: var(--c-gray-2); }
.rg__arrow { width: 40px; flex: none; text-align: right; font: 700 20px/1 var(--f-osw); color: var(--c-ink); transition: transform var(--t-med) var(--ease-out), color var(--t-fast); }
.rg__link:hover .rg__arrow { transform: translateX(4px); color: var(--c-orange); }
@media (max-width: 1099px) {
  .rg { padding: 72px 0; }
  .rg__inner { gap: 40px; }
  .rg__left { width: 40%; }
  .rg__title { font-size: 44px; }
}
@media (max-width: 767px) {
  .rg { padding: 32px 0; }
  .rg__inner { flex-direction: column; gap: 24px; padding-left: 16px; padding-right: 16px; }
  .rg__left { width: auto; gap: 24px; }
  .rg__title { font-size: 36px; line-height: 38px; }
  .rg__title-line + .rg__title-line { margin-top: 4px; }
  .rg__text { font-size: 13px; line-height: 20px; }
  .rg__list { width: 100%; }
  .rg__link { padding: 15px 0 16px; }
  .rg__link:hover { padding-left: 0; }
  .rg__num { width: 36px; font-size: 24px; }
  .rg__content { gap: 2px; }
  .rg__row-title { font-size: 15px; }
  .rg__row-text { font-size: 12px; line-height: 16px; }
  .rg__arrow { width: 24px; font-size: 18px; }
}

/* ---------- Gambling help strip ---------- */
.help-strip { background: var(--c-orange); color: #000; }
.help-strip__inner { display: flex; justify-content: space-between; align-items: center; height: 56px; }
.help-strip__text { font: 700 15px/var(--lh-osw) var(--f-osw); letter-spacing: .5px; }
.help-strip__right { display: flex; align-items: center; gap: 16px; }
.help-strip__badge { background: #000; color: var(--c-orange); font: 700 12px/var(--lh-osw) var(--f-osw); padding: 2px 10px; }
.help-strip__link { font: 700 14px/var(--lh-osw) var(--f-osw); letter-spacing: .5px; color: #000; transition: opacity var(--t-fast); }
.help-strip__link:hover { opacity: .7; }
@media (max-width: 767px) {
  .help-strip__inner { flex-direction: column; align-items: stretch; height: auto; gap: 12px; padding: 16px; }
  .help-strip__text { font-size: 14px; line-height: 18px; letter-spacing: 0; }
  .help-strip__right { justify-content: space-between; }
  .help-strip__badge { font-size: 11px; padding: 2px 8px; }
  .help-strip__link { font-size: 12px; }
}

/* ---------- Payment methods ---------- */
.payment { background: var(--c-surface); border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.payment__inner { display: flex; justify-content: space-between; align-items: center; height: 54px; }
.payment__left { display: flex; align-items: center; gap: 24px; }
.payment__title { font: 700 12px/var(--lh-osw) var(--f-osw); letter-spacing: 1px; color: var(--c-orange); }
.payment__sep { width: 2px; height: 16px; background: var(--c-line); }
.payment__sub { font: 700 13px/var(--lh-osw) var(--f-osw); letter-spacing: .5px; color: var(--c-paper); }
.payment__logos { width: 300px; height: auto; }
@media (max-width: 767px) {
  .payment__inner { flex-direction: column; align-items: flex-start; height: auto; gap: 12px; padding: 16px; }
  .payment__left { flex-direction: column; align-items: flex-start; gap: 2px; }
  .payment__sep { display: none; }
  .payment__title { font-size: 14px; letter-spacing: 0; }
  .payment__sub { font-size: 11px; font-weight: 600; letter-spacing: 0; }
  .payment__logos { width: 180px; }
}

/* ---------- Footer ---------- */
.footer { background: #000; padding: 80px 0 48px; overflow: hidden; }
.footer__inner { display: flex; flex-direction: column; gap: 64px; }
.footer__columns { display: flex; justify-content: space-between; align-items: flex-start; }
.footer__brand-block { width: 400px; flex: none; display: flex; flex-direction: column; gap: 20px; }
.footer__brand { font: 700 32px/var(--lh-osw) var(--f-osw); color: var(--c-orange); }
.footer__text { font: 400 14px/22px var(--f-plex); color: var(--c-gray); }
.footer__small { font: 400 12px/1.3 var(--f-plex); color: var(--c-gray-2); }
.footer__links { display: flex; gap: 48px; }
.footer__col { width: 140px; display: flex; flex-direction: column; gap: 16px; }
.footer__heading { font: 700 12px/var(--lh-osw) var(--f-osw); letter-spacing: 1px; color: var(--c-orange); }
.footer__list { display: flex; flex-direction: column; gap: 16px; }
.footer__link { font: 400 13px/1.3 var(--f-plex); color: var(--c-gray); transition: color var(--t-fast); }
.footer__link:hover { color: var(--c-paper); }
.footer__legal { border-top: 1px solid var(--c-line); padding-top: 23px; display: flex; flex-direction: column; gap: 12px; }
.footer__legal-line { font: 400 11px/16px var(--f-plex); color: var(--c-gray-2); }
.footer__legal-link { color: var(--c-gray); text-decoration: underline; text-underline-offset: 2px; transition: color var(--t-fast); }
.footer__legal-link:hover { color: var(--c-orange); }
.footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.footer__bottom-left { font: 700 12px/var(--lh-osw) var(--f-osw); letter-spacing: .5px; color: var(--c-gray-2); }
.footer__copyright { font: 400 11px/1.3 var(--f-plex); color: var(--c-gray-2); }
@media (max-width: 1099px) {
  .footer__columns { flex-direction: column; gap: 40px; }
  .footer__brand-block { width: auto; max-width: 400px; }
}
@media (max-width: 767px) {
  .footer { padding: 48px 0 40px; }
  .footer__inner { gap: 40px; padding-left: 20px; padding-right: 20px; }
  .footer__columns { gap: 40px; }
  .footer__brand-block { gap: 20px; }
  .footer__brand { font-size: 28px; }
  .footer__text { font-size: 13px; line-height: 18px; }
  .footer__small { font-size: 11px; line-height: 16px; }
  .footer__links { flex-wrap: wrap; gap: 28px 20px; }
  .footer__col { width: calc(50% - 10px); }
  .footer__bottom { flex-direction: column; align-items: flex-start; gap: 10px; }
  .footer__bottom-left { font-size: 11px; }
}