/* Template 06: the reference stylesheet (influencer-websites-templates/templates/06/css/style.css) after its :root block and base reset,
   with `--x` renamed `--t2-x`, white as a token, asset URLs rooted at ../assets/template-06/, and every photo behind a band read through a
   `--photo-*` custom property (the band's own photo is the fallback), so a content-supplied photo keeps the wash in front of it.
   Rules are in the reference's order. */

/* ---------- header ---------- */
.header { position: sticky; top: 0; z-index: 50; margin-bottom: calc(var(--t2-head) * -1); background: transparent; transition: box-shadow var(--t2-t-slow) var(--t2-ease), background-color var(--t2-t-slow) var(--t2-ease), backdrop-filter var(--t2-t-slow) var(--t2-ease), -webkit-backdrop-filter var(--t2-t-slow) var(--t2-ease); }
.header.is-scrolled { background: rgba(var(--t2-white-rgb),0.7); backdrop-filter: blur(32px) saturate(200%); -webkit-backdrop-filter: blur(32px) saturate(200%); box-shadow: 0 10px 30px -14px rgba(var(--t2-ink-rgb),0.4), inset 0 -1px 0 rgba(var(--t2-white-rgb),0.75), inset 0 1px 0 rgba(var(--t2-white-rgb),0.6); }
.header-inner { height: var(--t2-head); display: flex; align-items: center; gap: 16px; }
.logo { display: inline-flex; align-items: center; margin-right: auto; }
.logo-img { display: block; height: 38px; width: auto; }
.header-nav { display: none; gap: 20px; align-items: center; }
.header-nav-link { font-size: 15px; font-weight: 500; letter-spacing: 0.02em; color: var(--t2-soft); padding: 6px 0; transition: color var(--t2-t-fast) var(--t2-ease); white-space: nowrap; }
.header-nav-link:hover { color: var(--t2-primary-deep); }
.header-nav-link.is-current { color: var(--t2-primary-deep); }
.header-cta-group { display: none; align-items: center; gap: 12px; }
.hamburger-button { width: 42px; height: 42px; border-radius: 6px; border: none; background: var(--t2-ink); display: flex; flex-direction: column; gap: 4px; align-items: center; justify-content: center; cursor: pointer; padding: 0; transition: background-color var(--t2-t-fast) var(--t2-ease); }
.hb { width: 18px; height: 2px; background: var(--t2-white); border-radius: 2px; transition: transform var(--t2-t-fast) var(--t2-ease), opacity var(--t2-t-fast) var(--t2-ease); }
.hamburger-button.is-open .hb:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hamburger-button.is-open .hb:nth-child(2) { opacity: 0; }
.hamburger-button.is-open .hb:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.mobile-menu { display: none; background: var(--t2-white); border-top: 1px solid var(--t2-line); padding-bottom: 20px; }
.mobile-menu.is-open { display: block; }
.mobile-menu-nav { display: flex; flex-direction: column; padding-top: 8px; }
.mobile-nav-link { padding: 14px 0; font-weight: 500; letter-spacing: 0.02em; border-bottom: 1px solid var(--t2-line); transition: color var(--t2-t-fast) var(--t2-ease); }
.mobile-nav-link.is-current { font-weight: 800; color: var(--t2-primary-deep); }
.mobile-nav-link:hover { color: var(--t2-primary-deep); }
.mobile-menu-cta { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.mobile-menu .btn-light { border: 1px solid var(--t2-line); box-shadow: none; }
.header-cta-group .btn, .mobile-menu-cta .btn, .btn-sm { white-space: nowrap; }

/* Pages that open with a dark banner: logo and menu button turn light until the bar goes white. */
.header.on-dark:not(.is-scrolled) .hamburger-button { background: rgba(var(--t2-white-rgb),0.18); }

/* Scroll to top: a square button with 6px corners like every other button, bottom right, 15px from the edges. */
.fab { position: fixed; bottom: 15px; right: 15px; z-index: 40; width: 48px; height: 48px; padding: 0; border: 0; background: none; color: var(--t2-white); display: grid; place-items: center; cursor: pointer; isolation: isolate; -webkit-tap-highlight-color: transparent; opacity: 0; visibility: hidden; transform: translateY(12px); pointer-events: none; transition: opacity var(--t2-t-slow) var(--t2-ease), transform var(--t2-t-slow) var(--t2-ease), visibility 0s linear var(--t2-t-slow); }
.fab.is-visible { opacity: 1; visibility: visible; transform: none; pointer-events: auto; transition: opacity var(--t2-t-slow) var(--t2-ease), transform var(--t2-t-slow) var(--t2-ease), visibility 0s; }
.fab::before { content: ''; position: absolute; inset: 7px; z-index: -1; border-radius: 6px; background: var(--t2-ink); transform: none; box-shadow: 0 0 0 1px rgba(var(--t2-white-rgb),0.2), 0 10px 22px -8px rgba(var(--t2-ink-rgb),0.5); transition: background-color var(--t2-t-fast) var(--t2-ease), transform var(--t2-t-fast) var(--t2-ease); }
.fab svg { transition: transform var(--t2-t-fast) var(--t2-ease); }
@media (hover: hover) { .fab:hover::before { background: var(--t2-primary-deep); transform: scale(1.06); } .fab:hover svg { transform: translateY(-2px); } }
.fab:active::before { transform: scale(0.94); }
.fab:focus-visible { outline: none; }
.fab:focus-visible::before { box-shadow: 0 0 0 2px var(--t2-white), 0 0 0 4px var(--t2-primary-deep); }
@media (prefers-reduced-motion: reduce) { .fab, .fab.is-visible { transition: none; transform: none; } }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-family: var(--t2-font-body); font-weight: 600; letter-spacing: 0.02em; font-size: 16.5px; border: none; border-radius: 6px; padding: 13px 22px; cursor: pointer; transition: background-color var(--t2-t-fast) var(--t2-ease), box-shadow var(--t2-t-fast) var(--t2-ease), transform var(--t2-t-fast) var(--t2-ease), color var(--t2-t-fast) var(--t2-ease); }
.btn-cta { background: var(--t2-primary); color: var(--t2-ink); }
.btn-cta:hover { background: var(--t2-primary-deep); color: var(--t2-white); }
.btn-light { background: var(--t2-white); color: var(--t2-ink); box-shadow: 0 8px 20px -10px rgba(var(--t2-ink-rgb),0.35); }
.btn-light:hover { box-shadow: 0 12px 24px -10px rgba(var(--t2-ink-rgb),0.45); }
.btn-sm { padding: 10px 20px; font-size: 15.5px; }
.btn-lg { padding: 13px 26px 13px 28px; font-size: 17.5px; }
.btn-lg .arr { width: auto; height: auto; border-radius: 0; background: none; }
.btn-lg .arr svg { width: 18px; height: 18px; }
.arr { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; }
.btn-cta .arr { color: var(--t2-ink); }
.btn-cta:hover .arr { color: var(--t2-white); }
.promo .btn-cta { background: var(--t2-ink); color: var(--t2-white); }
.promo .btn-cta:hover { background: var(--t2-ink-2); color: var(--t2-white); }
.promo .btn-cta .arr { color: var(--t2-white); }
.btn-light .arr { color: var(--t2-accent-hover); }
.btn .arr svg { transition: transform var(--t2-t-fast) var(--t2-ease); }
@media (hover: hover) { .btn:hover .arr svg { transform: translateX(4px); } }
@media (prefers-reduced-motion: reduce) { .btn .arr svg { transition: none; } .btn:hover .arr svg { transform: none; } }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
/* Shine: a light band sweeps across the button on hover, and by itself at a random moment every 4-7 s per button (js/main.js adds .is-shining). */
.btn-shine { position: relative; overflow: hidden; isolation: isolate; --shine: rgba(var(--t2-white-rgb),0.6); }
.btn-light.btn-shine { --shine: rgba(var(--t2-primary-rgb),0.22); }
.btn-shine::before, .btn-shine::after { content: ''; position: absolute; top: -20%; bottom: -20%; left: 0; width: 45%; z-index: 1; pointer-events: none; background: linear-gradient(100deg, transparent 0%, var(--shine) 50%, transparent 100%); transform: translateX(-160%) skewX(-20deg); }
.btn-shine.is-shining::after { animation: shine-auto 0.85s var(--t2-ease) 1; }
@keyframes shine-auto { 0% { transform: translateX(-160%) skewX(-20deg); } 100% { transform: translateX(340%) skewX(-20deg); } }
@media (hover: hover) { .btn-shine:hover::before { transform: translateX(340%) skewX(-20deg); transition: transform 0.75s var(--t2-ease); } }
@media (prefers-reduced-motion: reduce) { .btn-shine.is-shining::after { animation: none; } .btn-shine:hover::before { transition: none; transform: translateX(-160%) skewX(-20deg); } }

/* ---------- landing (home) ---------- */
.hero { background: linear-gradient(to bottom, var(--t2-white) 0, var(--t2-white) 62%, rgba(var(--t2-white-rgb),0.55) 82%, rgba(var(--t2-white-rgb),0) 100%), var(--t2-ink) var(--photo-hero, url('../assets/template-06/landing.jpg')) 62% bottom / cover no-repeat; position: relative; z-index: 1; display: flex; flex-direction: column; min-height: calc(100vh - var(--t2-notice-h)); min-height: calc(100svh - var(--t2-notice-h)); padding: calc(var(--t2-head) + 16px) 0 0; overflow: clip; }
.hero-logo { display: flex; justify-content: center; margin-top: 8px; }
.hero-logo img { display: block; width: min(210px, 54vw); height: auto; filter: drop-shadow(0 12px 22px rgba(var(--t2-ink-rgb),0.28)); }
.hero-grid { display: grid; gap: 28px; align-items: center; align-content: center; flex: 1 1 auto; padding-bottom: 28px; z-index: 2; }
.pill { display: inline-block; background: var(--t2-mist); border: 1px solid var(--t2-line); border-radius: 999px; padding: 6px 14px; font-size: 14px; font-weight: 600; margin-bottom: 20px; }
.hero-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(40px, 11vw, 66px); line-height: 1.1; letter-spacing: 0.01em; margin-bottom: 18px; }
.hero-hot { color: var(--t2-primary); }
.hero-gold { color: var(--t2-accent); }
.hero-sub { font-size: 18.5px; color: var(--t2-soft); max-width: 480px; margin-bottom: 28px; }
.hero-req { margin-top: 22px; font-size: 14px; color: var(--t2-soft); max-width: 460px; }
.hero .actions .btn-lg { padding: 13px 26px 13px 28px; }
@media (max-width: 480px) { .hero .actions { gap: 10px; } .hero .actions .btn-lg { padding: 13px 20px 13px 22px; font-size: 16.5px; gap: 8px; } }

/* ---------- sections ---------- */
.sec { padding: 56px 0; }
.sec-mist { background: var(--t2-mist); }
/* Home board band: B&W Vegas sign photo on the right, solid white over the left 60%, then fading to a light veil; white fades at top and bottom */
.sec-photo-r { background-color: var(--t2-white); background-image: linear-gradient(to bottom, var(--t2-white) 0, rgba(var(--t2-white-rgb),0) 14%, rgba(var(--t2-white-rgb),0) 82%, var(--t2-white) 100%), linear-gradient(to right, var(--t2-white) 0, var(--t2-white) 60%, rgba(var(--t2-white-rgb),0.84) 72%, rgba(var(--t2-white-rgb),0.52) 86%, rgba(var(--t2-white-rgb),0.2) 100%), var(--photo-picks-band, url('../assets/template-06/vegas-hero.jpg')); background-position: 0 0, 0 0, right center; background-size: 100% 100%, 100% 100%, cover; background-repeat: no-repeat; }
/* Home offers band: B&W Vegas sign photo on the left, fading through to white on the right, white fades at top and bottom */
.sec-photo { background-color: var(--t2-white); background-image: linear-gradient(to bottom, var(--t2-white) 0, rgba(var(--t2-white-rgb),0) 14%, rgba(var(--t2-white-rgb),0) 82%, var(--t2-white) 100%), linear-gradient(to right, rgba(var(--t2-white-rgb),0.58) 0, rgba(var(--t2-white-rgb),0.76) 15%, rgba(var(--t2-white-rgb),0.93) 29%, var(--t2-white) 40%), var(--photo-offers-band, url('../assets/template-06/vegas-aerial.jpg')); background-position: 0 0, 0 0, left center; background-size: 100% 100%, 100% 100%, cover; background-repeat: no-repeat; }
.sec-head { max-width: 600px; }
.sec-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(28px, 7vw, 40px); line-height: 1.08; letter-spacing: -0.005em; }
.rule { display: block; width: 44px; height: 3px; background: var(--t2-ink); margin: 14px 0 16px; border-radius: 2px; }
.sec-text { color: var(--t2-soft); font-size: 17px; }
.sec-text + .sec-text { margin-top: 12px; }
.sec-head + .sec-text { margin-top: 14px; }
.sec-text strong { color: var(--t2-ink); }
.eyebrow { display: block; font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--t2-soft); margin-bottom: 10px; }
.sec-cta { display: flex; justify-content: center; margin-top: 32px; }
.fine { margin-top: 18px; font-size: 14px; line-height: 1.5; color: var(--t2-soft); max-width: 760px; }
.fine-full { max-width: none; }
.sub-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: 24px; margin: 44px 0 14px; }

/* cards */
.cards { display: grid; gap: 14px; }
.card { position: relative; background: var(--t2-white); border: 1px solid var(--t2-line); border-radius: var(--t2-radius); padding: 22px; box-shadow: var(--t2-shadow); display: flex; flex-direction: column; gap: 10px; transition: transform var(--t2-t-slow) var(--t2-ease), box-shadow var(--t2-t-slow) var(--t2-ease); }
@media (hover: hover) { .card.lift:hover { transform: translateY(-3px); box-shadow: 0 14px 28px -10px rgba(var(--t2-ink-rgb),0.2); } }
.card-title { font-family: var(--t2-font-body); font-weight: 700; font-size: 18.5px; line-height: 1.25; }
.card-text { font-size: 15.5px; line-height: 1.55; color: var(--t2-soft); }
.ico { width: 28px; height: 28px; display: grid; place-items: center; color: var(--t2-ink); flex: 0 0 auto; }

/* bars, stat numbers */
.bars { display: flex; align-items: flex-end; gap: 6px; height: 64px; }
.bars i { flex: 1; background: var(--t2-silver); border-radius: 2px 2px 0 0; }
.bars i:last-child { background: var(--t2-accent); }
.t-n { font-family: var(--t2-font-mono); font-weight: 700; font-size: 37.5px; line-height: 1; letter-spacing: -0.04em; }
.t-l { font-weight: 600; font-size: 15.5px; margin-top: 6px; }
.minis { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mini { background: var(--t2-ink); color: var(--t2-white); border-radius: var(--t2-radius); padding: 16px 18px; }
.mini-n { font-family: var(--t2-font-mono); font-weight: 700; font-size: 28.5px; letter-spacing: -0.03em; }
.mini-l { font-size: 14px; margin-top: 6px; color: rgba(var(--t2-white-rgb),0.85); }
.split { display: grid; gap: 28px; align-items: center; }

/* feature rows */
.feats { display: grid; grid-template-columns: 1fr; gap: 18px; padding: 24px 0; margin-top: 28px; border-top: 1px solid var(--t2-line); border-bottom: 1px solid var(--t2-line); }
.feat { display: flex; gap: 14px; align-items: flex-start; }
.feat-ico { width: 26px; height: 26px; flex: 0 0 auto; margin-top: 1px; display: grid; place-items: center; }
.feat-t { font-weight: 700; font-size: 16.5px; }
.feat-x { font-size: 15px; color: var(--t2-soft); }

/* ---------- sportsbook offers ---------- */
.op-grid { display: grid; gap: 16px; }
.op-card { position: relative; background: var(--t2-white); border: 1px solid var(--t2-line); border-radius: var(--t2-radius); padding: 24px; box-shadow: var(--t2-shadow); display: flex; flex-direction: column; gap: 14px; transition: transform var(--t2-t-slow) var(--t2-ease), box-shadow var(--t2-t-slow) var(--t2-ease); }
@media (hover: hover) { .op-card:hover { transform: translateY(-3px); box-shadow: 0 14px 28px -10px rgba(var(--t2-ink-rgb),0.2); } }
.op-head { display: flex; align-items: center; gap: 14px; }
/* Operator logo on a white plate, as on the 04 / tftbets op-list. Placeholder images until the real logos arrive. */
.op-logo { flex: 0 0 auto; display: block; width: 96px; height: 44px; background: var(--t2-white); border: 1px solid var(--t2-line); border-radius: 8px; overflow: hidden; }
.op-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.op-name { font-family: var(--t2-font-body); font-weight: 700; font-size: 21px; letter-spacing: -0.01em; }
.op-offer { font-family: var(--t2-font-body); font-weight: 700; font-size: 21px; line-height: 1.25; letter-spacing: -0.01em; margin-bottom: 7px; }
.op-terms { font-size: 13px; line-height: 1.5; color: var(--t2-soft); }
.op-cta { margin-top: auto; align-self: flex-start; }
@media (max-width: 639px) { .op-cta { align-self: center; } }
.op-featured { background: var(--t2-ink); color: var(--t2-white); border-color: var(--t2-ink); }
.op-featured .op-terms { color: rgba(var(--t2-white-rgb),0.82); }
.op-badge { position: absolute; top: -12px; left: 24px; background: var(--t2-accent); color: var(--t2-ink); font-weight: 700; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }


.fancy-tile { position: relative; isolation: isolate; display: flex; flex-direction: column; gap: 6px; min-height: 300px; padding: 24px; color: var(--t2-white); background-color: var(--t2-ink); background-size: cover; background-position: center; }
.fancy-tile::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgba(var(--t2-ink-rgb),0.8); transition: background-color var(--t2-t-slow) var(--t2-ease); }
@media (hover: hover) { .fancy-tile:hover::before { background: rgba(var(--t2-ink-rgb),0.95); } }
.fc-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.fc-meta { font-weight: 800; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(var(--t2-white-rgb),0.72); }
.fc-emoji { display: grid; color: rgba(var(--t2-white-rgb),0.85); line-height: 0; flex: 0 0 auto; }
.fc-num { font-family: var(--t2-font-mono); font-weight: 700; font-size: 50.5px; line-height: 1; letter-spacing: -0.04em; color: var(--t2-silver); padding-top: 14px; }
.fc-unit { font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(var(--t2-white-rgb),0.72); padding-top: 6px; }
.fc-title { font-weight: 700; font-size: 21px; line-height: 1.25; letter-spacing: -0.01em; padding-top: 12px; }
.fc-text { font-size: 15.5px; line-height: 1.55; color: rgba(var(--t2-white-rgb),0.78); padding-top: 4px; }
.fc-foot { margin-top: auto; padding-top: 14px; display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid rgba(var(--t2-white-rgb),0.18); font-size: 13px; color: rgba(var(--t2-white-rgb),0.7); }
.fc-foot strong { color: var(--t2-white); font-weight: 600; }
/* ---------- picks in the offer template: a big ink tile beside the pick tiles ---------- */
.stage { position: relative; overflow: clip; }
.stage > .sec { position: relative; z-index: 1; }
.stage > .hero { z-index: 2; }
.svc { display: grid; gap: 16px; margin-top: 28px; }
.big-tile { background: var(--t2-ink); color: var(--t2-white); border-radius: var(--t2-radius); padding: 22px; display: flex; align-items: center; gap: 16px; }
.big-tile .big-ico { display: flex; flex: 0 0 auto; }
.big-label br { display: none; }
.big-ico { color: var(--t2-silver); }
.big-label { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(26px, 7.4vw, 34px); line-height: 1.05; letter-spacing: 0.04em; }
.fancy-row { display: grid; gap: 14px; }
.fancy-row .fancy-tile { border-radius: var(--t2-radius); overflow: hidden; }
/* On its own page the tiles sit as separate rounded cards. */
.fancy-grid { display: grid; gap: 14px; }
.fancy-grid .fancy-tile { border-radius: var(--t2-radius); overflow: hidden; }

/* ---------- follow-on-X banner (deep primary green) ---------- */
.promo { position: relative; overflow: hidden; border-radius: var(--t2-radius); padding: 32px 24px; display: grid; gap: 24px; align-items: center; box-shadow: var(--t2-shadow); background: linear-gradient(rgba(var(--t2-ink-rgb),0.1), rgba(var(--t2-ink-rgb),0.1)), linear-gradient(color-mix(in srgb, var(--t2-primary-deep) 93%, transparent), color-mix(in srgb, var(--t2-primary-deep) 93%, transparent)), var(--t2-primary-deep); color: var(--t2-white); }
.promo-tag { display: inline-block; background: rgba(var(--t2-white-rgb),0.16); border: 1px solid rgba(var(--t2-white-rgb),0.32); color: var(--t2-white); border-radius: 999px; padding: 6px 14px; font-size: 14px; font-weight: 600; margin-bottom: 16px; }
.promo-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(32px, 8vw, 46px); line-height: 1.05; margin-bottom: 12px; }
.promo-text { color: rgba(var(--t2-white-rgb),0.92); max-width: 520px; font-size: 17.5px; }
.promo .actions { position: relative; }

/* ---------- closing band ---------- */
.news { position: relative; background: linear-gradient(rgba(var(--t2-ink-rgb),0.9), rgba(var(--t2-ink-rgb),0.9)), var(--t2-ink); color: var(--t2-white); }
.news-in { padding: 56px 20px; display: grid; gap: 28px; align-items: center; }
.news-tag { display: inline-block; background: rgba(var(--t2-white-rgb),0.14); border-radius: 999px; padding: 6px 14px; font-size: 14px; font-weight: 600; margin-bottom: 16px; }
.news .promo-title { color: var(--t2-white); }

/* ---------- main pick (picks page) ---------- */
.highlight { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--t2-radius); padding: 32px 24px; color: var(--t2-white); background: var(--t2-ink); box-shadow: var(--t2-shadow); }
.highlight::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(135deg, rgba(var(--t2-ink-rgb),0.92) 0%, color-mix(in srgb, var(--t2-ink-2) 84%, transparent) 100%); }
.highlight-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(28px, 6vw, 40px); line-height: 1.05; margin: 8px 0 14px; max-width: 640px; }
.highlight-text { color: rgba(var(--t2-white-rgb),0.85); font-size: 17.5px; max-width: 640px; }
.highlight .actions { margin-top: 22px; }
.highlight-note { font-size: 14px; color: rgba(var(--t2-white-rgb),0.78); }
.news-actions { display: flex; gap: 12px; flex-wrap: wrap; }
/* Phones under 400px: button groups that wrap onto several rows are centred. */
@media (max-width: 399px) { .actions, .news-actions { justify-content: center; } }
@media (min-width: 960px) { .news-actions { justify-content: flex-end; } .highlight { padding: 44px 48px; } }

/* ---------- inner page banner ---------- */
.page-hero { position: relative; margin-top: calc(var(--t2-head) * -1); padding: calc(var(--t2-head) + 52px) 0 56px; color: var(--t2-white); background: linear-gradient(to right, rgba(var(--t2-ink-rgb),0.93) 0, rgba(var(--t2-ink-rgb),0.8) 48%, rgba(var(--t2-ink-rgb),0.5) 100%), var(--t2-ink); overflow: hidden; }
/* Photo heroes (Sportsbooks, Casinos, Free Picks): owner photo under an ink veil, fading from dark into the white page at the bottom. The photo is set per page through --hero-photo. */
.page-hero.bg-offers, .page-hero.bg-casinos, .page-hero.bg-picks, .page-hero.bg-about { padding-bottom: 150px; background-image: linear-gradient(to top, rgba(var(--hero-fade, 255,255,255),1) 0, rgba(var(--hero-fade, 255,255,255),0.85) 10%, rgba(var(--hero-fade, 255,255,255),0.45) 26%, rgba(var(--hero-fade, 255,255,255),0) 52%), linear-gradient(to right, rgba(var(--t2-ink-rgb),0.8) 0, rgba(var(--t2-ink-rgb),0.6) 50%, rgba(var(--t2-ink-rgb),0.3) 100%), var(--hero-photo); background-position: 0 0, 0 0, var(--hero-pos, 50% 35%); background-size: 100% 100%, 100% 100%, cover; background-repeat: no-repeat; }
.page-hero.bg-offers { --hero-photo: url('../assets/template-06/vegas-aerial.jpg'); }
.page-hero.bg-about { --hero-photo: url('../assets/template-06/vegas-aerial.jpg'); --hero-pos: 50% 80%; }
.page-hero.bg-casinos { --hero-photo: url('../assets/template-06/landing.jpg'); --hero-pos: 50% 70%; }
.page-hero.bg-picks { --hero-photo: url('../assets/template-06/vegas-hero.jpg'); --hero-pos: 70% 40%; }
.page-hero.bg-legal { background: linear-gradient(135deg, var(--t2-primary) 0%, var(--t2-primary-deep) 100%); }
.page-hero .pill { background: rgba(var(--t2-white-rgb),0.14); border-color: rgba(var(--t2-white-rgb),0.28); color: var(--t2-white); }
.page-hero-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(36px, 9vw, 58px); line-height: 1.1; letter-spacing: 0.01em; margin-bottom: 14px; max-width: 760px; }
.page-hero-sub { font-size: 18.5px; line-height: 1.6; color: rgba(var(--t2-white-rgb),0.8); max-width: 640px; }
.page-hero-sub strong { color: var(--t2-white); }
.age-note { margin-top: 20px; font-size: 15px; font-weight: 500; line-height: 1.4; color: rgba(var(--t2-white-rgb),0.9); }
.age-note strong { font-weight: 800; margin-right: 6px; }
.stats-grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 30px; max-width: 760px; }
.stat-box { background: rgba(var(--t2-white-rgb),0.1); border: 1px solid rgba(var(--t2-white-rgb),0.22); border-radius: var(--t2-radius); padding: 18px 20px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.stat-box .t-n { color: var(--t2-white); font-size: 37.5px; }
.stat-box .t-l { color: var(--t2-silver); font-weight: 600; }

.portrait { margin: 0; width: 100%; max-width: 320px; aspect-ratio: 1 / 1; border-radius: var(--t2-radius); overflow: hidden; background: var(--t2-ink); box-shadow: var(--t2-shadow); }
.portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* ---------- about ---------- */
.timeline { display: flex; flex-direction: column; gap: 10px; margin-top: 26px; }
.tl-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 18px; background: var(--t2-mist); border-radius: var(--t2-radius); font-size: 15.5px; }
.tl-row span:first-child { color: var(--t2-soft); }
.tl-row span:last-child { font-weight: 700; text-align: right; }
.fmt { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 16px; align-items: start; }
.fmt-n { font-family: var(--t2-font-mono); font-weight: 700; font-size: 37.5px; line-height: 1; letter-spacing: -0.04em; grid-row: 1 / span 2; }

/* ---------- responsible gambling + legal ---------- */
.legal-grid { display: grid; gap: 28px; align-items: start; }
.legal-toc { display: none; }
.legal-toc-label { font-size: 13px; font-weight: 700; color: var(--t2-soft); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 14px; }
.legal-toc-nav { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--t2-line); }
.legal-toc-link { padding: 9px 16px; font-size: 15.5px; color: var(--t2-soft); border-left: 2px solid transparent; margin-left: -1px; transition: color var(--t2-t-fast) var(--t2-ease), border-color var(--t2-t-fast) var(--t2-ease); }
.legal-toc-link:hover { color: var(--t2-primary-deep); }
.legal-toc-link.is-active { color: var(--t2-primary-deep); border-left-color: var(--t2-primary-deep); font-weight: 600; }
.legal-body { max-width: 760px; }
.legal-intro { font-size: 18px; line-height: 1.7; color: var(--t2-soft); margin-bottom: 36px; }
.legal-h { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(24px, 5vw, 30px); line-height: 1.1; margin: 8px 0 14px; scroll-margin-top: calc(var(--t2-head) + 24px); }
.legal-text { font-size: 17px; line-height: 1.75; color: var(--t2-soft); margin-bottom: 20px; }
.legal-text a, .legal-intro a, .legal-list a { text-decoration: underline; text-underline-offset: 3px; color: var(--t2-ink); font-weight: 600; }
.legal-text a:hover, .legal-intro a:hover, .legal-list a:hover { color: var(--t2-primary-deep); }
.legal-list { padding-left: 22px; margin: 0 0 20px; display: flex; flex-direction: column; gap: 8px; font-size: 17px; line-height: 1.65; color: var(--t2-soft); }
.legal-block { margin-bottom: 52px; }
.tool-cards { display: grid; gap: 14px; margin: 18px 0 8px; }
.tool-card { background: var(--t2-white); border: 1px solid var(--t2-line); border-radius: var(--t2-radius); padding: 22px; box-shadow: var(--t2-shadow); display: flex; flex-direction: column; gap: 8px; }
.tool-card .ico { margin-bottom: 4px; }
.tool-card-link { margin-top: auto; padding-top: 8px; font-size: 15.5px; font-weight: 700; color: var(--t2-ink); text-decoration: underline; text-underline-offset: 3px; }
.tool-card-link:hover { color: var(--t2-primary-deep); }
.helpline { background: linear-gradient(135deg, var(--t2-ink) 0%, var(--t2-ink-2) 100%); color: var(--t2-white); border-radius: var(--t2-radius); padding: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin: 22px 0 0; }
.helpline-text { flex: 1; min-width: 220px; }
.helpline-label { font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--t2-silver); margin-bottom: 6px; }
.helpline-num { font-family: var(--t2-font-mono); font-weight: 700; font-size: 31px; letter-spacing: -0.03em; color: var(--t2-white); }
.helpline-note { font-size: 15.5px; line-height: 1.55; color: rgba(var(--t2-white-rgb),0.78); max-width: 360px; }

/* ---------- footer ---------- */
.footer { background: var(--t2-ink); color: var(--t2-white); padding: 56px 0 84px; }
.footer-cols { display: grid; gap: 28px; }
.logo-w .logo-img { height: 52px; }
.footer-tag { margin-top: 14px; font-size: 15.5px; color: rgba(var(--t2-white-rgb),0.78); max-width: 280px; }
.footer-h { font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--t2-silver); margin-bottom: 12px; }
.footer-link { display: block; padding: 4px 0; font-size: 16px; color: rgba(var(--t2-white-rgb),0.88); transition: color var(--t2-t-fast) var(--t2-ease); }
.footer-link:hover, .footer-link.is-current { color: var(--t2-accent); text-decoration: none; }
.rg { display: flex; gap: 18px; align-items: flex-start; margin-top: 36px; padding: 22px; border: 1px solid rgba(var(--t2-white-rgb),0.2); border-radius: var(--t2-radius); background: rgba(var(--t2-white-rgb),0.05); }
.rg-badge { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 50%; border: 2px solid var(--t2-white); display: grid; place-items: center; font-weight: 800; font-size: 16.5px; }
.rg-text { font-size: 15px; line-height: 1.6; color: rgba(var(--t2-white-rgb),0.85); }
.rg-text strong { color: var(--t2-white); }
.rg-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 12px; }
.rg-links a { color: var(--t2-silver); text-decoration: underline; font-size: 15px; }
.rg-line { margin-top: 10px; font-size: 15px; color: rgba(var(--t2-white-rgb),0.85); }
.rg-line a { color: var(--t2-white); font-weight: 700; text-decoration: underline; }
.powered-rule { height: 0; margin: 20px 0 0; border: 0; border-top: 1px solid rgba(var(--t2-white-rgb),0.18); }
.powered { display: flex; align-items: center; gap: 12px; margin-top: 16px; font-size: 14.5px; color: rgba(var(--t2-white-rgb),0.7); }
.powered-link { display: inline-flex; border-radius: 4px; transition: opacity var(--t2-t-fast) var(--t2-ease); }
.powered-link:hover { opacity: 0.8; }
.powered-link:focus-visible { outline: 2px solid var(--t2-white); outline-offset: 4px; }
.powered img { display: block; height: 24px; width: auto; }
.disclaimer { margin-top: 24px; font-size: 13px; line-height: 1.6; color: rgba(var(--t2-white-rgb),0.7); max-width: 900px; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(var(--t2-white-rgb),0.15); font-size: 14px; color: rgba(var(--t2-white-rgb),0.7); }


/* ---------- tablet ---------- */
@media (min-width: 640px) {
  .wrap { padding: 0 32px; }
  .mobile-menu { padding-bottom: 32px; }
  .cards-2 { grid-template-columns: 1fr 1fr; }
  .minis { grid-template-columns: repeat(4, 1fr); }
  .feats { grid-template-columns: 1fr 1fr; }
  .footer-cols { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
  .fancy-grid { grid-template-columns: 1fr 1fr; }
  .stats-grid { grid-template-columns: repeat(3, 1fr); }
  .tool-cards { grid-template-columns: 1fr 1fr; }
  .news-in { padding: 72px 32px; }
  .promo { padding: 44px 40px; }
}

@media (min-width: 640px) {
  .fancy-row { grid-template-columns: 1fr 1fr; }
  .fancy-row .fancy-tile:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* ---------- desktop ---------- */
@media (min-width: 960px) {
  .promo { grid-template-columns: minmax(0, 1fr) auto; gap: 40px; }
  .hero { padding-top: 0; background-image: linear-gradient(to top, var(--t2-white) 0, rgba(var(--t2-white-rgb),0.7) 8%, rgba(var(--t2-white-rgb),0) 26%), linear-gradient(to right, var(--t2-white) 0, var(--t2-white) 55%, rgba(var(--t2-white-rgb),0.84) 66%, rgba(var(--t2-white-rgb),0.52) 83%, rgba(var(--t2-white-rgb),0.2) 100%), var(--photo-hero, url('../assets/template-06/landing.jpg')); background-position: 0 0, 0 0, center bottom; background-size: 100% 100%, 100% 100%, cover; background-repeat: no-repeat; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) auto; column-gap: 40px; padding-top: calc(var(--t2-head) + 24px); padding-bottom: 48px; }
  .hero-copy { max-width: min(540px, 40vw); position: relative; z-index: 3; }
  .hero-logo { position: relative; z-index: 3; justify-self: end; }
  .hero-logo img { width: clamp(230px, 21vw, 310px); }
  .hero-title { font-size: clamp(44px, min(4.6vw, 7.6vh), 66px); }

  .sec { padding: 84px 0; }
  .split { grid-template-columns: 1fr 1fr; gap: 56px; }
  .feats-4 { grid-template-columns: repeat(4, 1fr); }
  .feats-3 { grid-template-columns: repeat(3, 1fr); }

  .op-grid { grid-template-columns: 1fr 1fr; }
  .op-featured { grid-column: 1 / -1; display: grid; grid-template-columns: 150px minmax(0, 1fr) 220px; grid-template-areas: "logo name cta" "logo body cta"; column-gap: 28px; row-gap: 4px; align-items: center; padding: 26px 28px; }
  .op-featured .op-head { display: contents; }
  .op-featured .op-logo { grid-area: logo; width: 150px; height: 64px; }
  .op-featured .op-name { grid-area: name; align-self: end; font-size: 23px; }
  .op-featured .op-body { grid-area: body; align-self: start; }
  .op-featured .op-cta { grid-area: cta; margin-top: 0; align-self: center; justify-self: center; }

  /* Stat cards: a full-width band, half text and half a 2 x 2 block of tiles, flush edge to edge. */
  .fancy-grid { grid-template-columns: repeat(2, 1fr); }
  .fancy-grid-3 { grid-template-columns: repeat(3, 1fr); }
  .news-in { grid-template-columns: 1fr 1fr; gap: 56px; max-width: 1180px; margin: 0 auto; padding: 84px 32px; }
  .stats-grid { gap: 14px; }
  .legal-grid { grid-template-columns: 240px minmax(0, 1fr); gap: 64px; }
  .legal-toc { display: block; position: sticky; top: 100px; align-self: start; }
  .tool-cards-4 { grid-template-columns: repeat(2, 1fr); }
  .about-split { grid-template-columns: 0.8fr 1.2fr; gap: 64px; align-items: start; }
  .page-hero { padding: calc(var(--t2-head) + 72px) 0 84px; }
}
@media (min-width: 760px) { .header-cta-group { display: flex; } }
@media (min-width: 1100px) {
  .header-nav { display: flex; margin-left: auto; margin-right: 8px; gap: 20px; }
  .hamburger-button, .mobile-menu, .mobile-menu.is-open { display: none; }
  .logo { margin-right: 0; }
  .logo-img { height: 44px; }
  /* Menu: white over the landing photo, ink once the bar turns white. */
  .header-nav-link { color: var(--t2-ink); }
  .header-nav-link:hover, .header-nav-link.is-current { color: var(--t2-primary-deep); }
  .header.on-dark:not(.is-scrolled) .header-nav-link { color: rgba(var(--t2-white-rgb),0.88); }
  .header.on-dark:not(.is-scrolled) .header-nav-link:hover { color: var(--t2-accent-light); }
  .header.on-dark:not(.is-scrolled) .header-nav-link.is-current { color: var(--t2-accent-light); }
  .header.is-scrolled .header-nav-link { color: var(--t2-ink); }
  .header.is-scrolled .header-nav-link:hover { color: var(--t2-primary-deep); }
  .header.is-scrolled .header-nav-link.is-current { color: var(--t2-primary-deep); }
  .header-nav-link { font-size: 15.5px; }
}
@media (min-width: 1100px) {
  .tool-cards-4 { grid-template-columns: repeat(4, 1fr); }
  .svc { grid-template-columns: 230px minmax(0, 1fr); }
  .svc .big-tile { min-height: 100%; flex-direction: column; align-items: stretch; justify-content: space-between; gap: 22px; }
  .big-label br { display: inline; }
  .fancy-row { grid-template-columns: repeat(3, 1fr); }
  .fancy-row .fancy-tile:last-child:nth-child(odd) { grid-column: auto; }
}
@media (min-width: 1536px) { .wrap { max-width: 1320px; } .news-in { max-width: 1320px; } }

/* The narrowest phones (320 to 359px): a tighter header so the name and the menu button fit on one line. */
@media (max-width: 359px) {
  .header-inner { gap: 8px; }
  .logo { min-width: 0; }
  .logo-img { height: 32px; }
  .hamburger-button { width: 40px; height: 40px; }
}

/* ---------- multi-pick list (a label such as "NFL" followed by team-and-line rows) ---------- */
.pick-list { max-width: 520px; margin-top: 20px; background: var(--t2-white); border: 1px solid var(--t2-line); border-radius: var(--t2-radius); box-shadow: var(--t2-shadow); overflow: hidden; }
.pick-list-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; background: var(--t2-ink); color: var(--t2-white); font-family: var(--t2-font-display); font-weight: 400; font-size: 22px; letter-spacing: 0.04em; text-transform: uppercase; }
.pick-list-tag { font-family: var(--t2-font-body); font-size: 12px; font-weight: 700; letter-spacing: 0.1em; color: var(--t2-ink); background: var(--t2-accent); border-radius: 999px; padding: 4px 10px; }
.pick-list ul { list-style: none; margin: 0; padding: 0; }
.pick-list li { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 12px 20px; border-top: 1px solid var(--t2-line); font-weight: 600; }
.pick-list li:first-child { border-top: 0; }
.pick-list li b { font-family: var(--t2-font-mono); font-weight: 700; color: var(--t2-primary-deep); }
.rg-todo { color: var(--t2-silver); font-size: 15px; }

/* ---------- Home only: photos behind the cards and banners (the same photos the bands use), each under an ink or green veil ---------- */
.sec-photo-r .big-tile { background-image: linear-gradient(rgba(var(--t2-ink-rgb),0.78), rgba(var(--t2-ink-rgb),0.78)), var(--photo-big-tile, url('../assets/template-06/vegas-aerial.jpg')); background-size: cover; background-position: 25% center; }
.sec-photo-r .fancy-tile.bg-1 { background-image: var(--photo-home-tile-1, url('../assets/template-06/landing.jpg')); }
.sec-photo-r .fancy-tile.bg-2 { background-image: var(--photo-home-tile-2, url('../assets/template-06/vegas-aerial.jpg')); background-position: 75% 40%; }
.sec-photo-r .fancy-tile.bg-3 { background-image: var(--photo-home-tile-3, url('../assets/template-06/vegas-hero.jpg')); background-position: 75% center; }
.sec-photo-r .fancy-tile::before { background: rgba(var(--t2-ink-rgb),0.7); }
@media (hover: hover) { .sec-photo-r .fancy-tile:hover::before { background: rgba(var(--t2-ink-rgb),0.9); } }
#game .promo { background: linear-gradient(color-mix(in srgb, var(--t2-primary-deep) 88%, transparent), color-mix(in srgb, var(--t2-primary-deep) 88%, transparent)), var(--t2-primary-deep) var(--photo-game, url('../assets/template-06/vegas-aerial.jpg')) center 45% / cover no-repeat; }
.news.news-photo { background: rgb(var(--news-fade, 255,255,255)); }
.news-photo .news-band { background: linear-gradient(to bottom, rgba(var(--news-fade, 255,255,255),1) 0, rgba(var(--news-fade, 255,255,255),0.8) 18%, rgba(var(--news-fade, 255,255,255),0.4) 42%, rgba(var(--news-fade, 255,255,255),0.1) 66%, rgba(var(--news-fade, 255,255,255),0) 82%), linear-gradient(rgba(var(--t2-ink-rgb),0.84), rgba(var(--t2-ink-rgb),0.84)), var(--t2-ink) var(--photo-news, url('../assets/template-06/landing.jpg')) 50% 55% / cover no-repeat;; }
.news-photo .news-in { padding-top: 150px; } /* the top edge fades in from the white page, keep the content below the fade */

/* Feature row inside the photo band: white text on the dark photo, under the CTA */
.news-photo .news-band.has-feats .news-in { padding-top: 40px; }
.news-feats { max-width: 1180px; margin: 0 auto; padding: 150px 20px 0; color: var(--t2-white); } /* the top padding keeps the row below the white fade */
.news-feats .feats { margin-top: 0; border-top-color: rgba(var(--t2-white-rgb),0.28); border-bottom-color: rgba(var(--t2-white-rgb),0.28); }
.news-feats .feat-ico { color: var(--t2-white); }
.news-feats .feat-t { color: var(--t2-white); }
.news-feats .feat-x { color: rgba(var(--t2-white-rgb),0.82); }
@media (min-width: 760px) { .news-feats { padding-left: 32px; padding-right: 32px; } }
@media (min-width: 1536px) { .news-feats { max-width: 1320px; } }
.news-photo .news-band.has-feats { background: linear-gradient(to bottom, rgba(var(--news-fade, 255,255,255),1) 0, rgba(var(--news-fade, 255,255,255),0.8) 11%, rgba(var(--news-fade, 255,255,255),0.4) 24%, rgba(var(--news-fade, 255,255,255),0.1) 38%, rgba(var(--news-fade, 255,255,255),0) 48%), linear-gradient(rgba(var(--t2-ink-rgb),0.88), rgba(var(--t2-ink-rgb),0.88)), var(--t2-ink) var(--photo-news, url('../assets/template-06/landing.jpg')) 50% 55% / cover no-repeat; } /* taller band: the fade is shorter so the feature row stays on dark */
.portrait-logo { aspect-ratio: auto; background: none; box-shadow: none; overflow: visible; border-radius: 0; }
.portrait-logo img { height: auto; object-fit: contain; }
.portrait-logo { align-self: center; justify-self: center; } /* centred vertically against the text column; centred horizontally while the grid is one column */
@media (min-width: 760px) { .portrait-logo { justify-self: start; } }
.promo.promo-photo { background: linear-gradient(color-mix(in srgb, var(--t2-primary-deep) 88%, transparent), color-mix(in srgb, var(--t2-primary-deep) 88%, transparent)), var(--t2-primary-deep) var(--photo-promo, url('../assets/template-06/landing.jpg')) center 55% / cover no-repeat; }
/* About hero holds the stat boxes, so its fade has a fixed height (in px) and the boxes stay clear of it on every width */
.page-hero.bg-about { padding-bottom: 210px; background-image: linear-gradient(to top, var(--t2-white) 0, rgba(var(--t2-white-rgb),0.85) 45px, rgba(var(--t2-white-rgb),0.45) 115px, rgba(var(--t2-white-rgb),0) 200px), linear-gradient(to right, rgba(var(--t2-ink-rgb),0.8) 0, rgba(var(--t2-ink-rgb),0.6) 50%, rgba(var(--t2-ink-rgb),0.3) 100%), var(--hero-photo); }

/* ---------- Free Picks: the list format as one green panel (photo under green), rows as translucent bars ---------- */
.list-card { margin-top: 56px; padding: 28px 20px; border-radius: var(--t2-radius); color: var(--t2-white); box-shadow: var(--t2-shadow); background: linear-gradient(color-mix(in srgb, var(--t2-primary-deep) 90%, transparent), color-mix(in srgb, var(--t2-primary-deep) 90%, transparent)), var(--t2-primary-deep) var(--photo-list, url('../assets/template-06/landing.jpg')) center 55% / cover no-repeat; }
.list-card-title { font-family: var(--t2-font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(28px, 7vw, 40px); line-height: 1.08; letter-spacing: 0.01em; margin-bottom: 12px; }
.list-card-text { color: rgba(var(--t2-white-rgb),0.92); font-size: 17px; max-width: 980px; }
.list-card-pill { display: inline-block; margin: 16px 0 14px; padding: 8px 16px; border-radius: 999px; background: var(--t2-ink); color: var(--t2-white); font-size: 14.5px; font-weight: 700; letter-spacing: 0.02em; }
.list-card-rows { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 8px; }
.list-card-rows li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 18px; border-radius: 10px; background: rgba(var(--t2-white-rgb),0.14); border: 1px solid rgba(var(--t2-white-rgb),0.3); font-weight: 700; font-size: 17px; }
.list-card-rows li b { font-weight: 700; }
.list-card-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 18px; margin-top: 20px; }
.list-card-note { font-size: 14px; color: rgba(var(--t2-white-rgb),0.85); }
@media (min-width: 760px) { .list-card { padding: 36px 32px; } }

/* ---------- Free Picks: photos behind the main pick and the three tiles (same photos as home, other order), always under a veil ---------- */
.picks-photo .highlight { background-image: var(--photo-main-pick, url('../assets/template-06/vegas-aerial.jpg')); background-position: 50% 60%; background-size: cover; background-repeat: no-repeat; }
.picks-photo .highlight::before { background: linear-gradient(135deg, rgba(var(--t2-ink-rgb),0.9) 0%, color-mix(in srgb, var(--t2-ink-2) 78%, transparent) 100%); }
.picks-photo .fancy-tile.bg-1 { background-image: var(--photo-pick-tile-1, url('../assets/template-06/vegas-hero.jpg')); background-position: 78% center; }
.picks-photo .fancy-tile.bg-2 { background-image: var(--photo-pick-tile-2, url('../assets/template-06/landing.jpg')); }
.picks-photo .fancy-tile.bg-3 { background-image: var(--photo-pick-tile-3, url('../assets/template-06/vegas-aerial.jpg')); background-position: 75% 40%; }
.picks-photo .fancy-tile::before { background: rgba(var(--t2-ink-rgb),0.7); }
@media (hover: hover) { .picks-photo .fancy-tile:hover::before { background: rgba(var(--t2-ink-rgb),0.9); } }

/* ---------- Not in the reference: the text wordmark shown until a logo picture is uploaded ---------- */
.logo-wordmark { font-family: var(--t2-font-display); font-weight: 400; font-size: 26px; line-height: 1; letter-spacing: 0.02em; text-transform: uppercase; color: var(--t2-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: min(60vw, 320px); }
.header.on-dark:not(.is-scrolled) .logo-wordmark, .logo-w .logo-wordmark { color: var(--t2-white); }
@media (max-width: 479px) { .logo-wordmark { font-size: 20px; } }