:root { color-scheme:dark; font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --bg:#08110d; --surface:#0e1712; --surface2:#131f18; --text:#eef7f1; --muted:#9fb2a7; --border:rgba(255,255,255,.09); --accent:#31b968; --accent2:#7ee3a4; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 18% 0%,rgba(47,185,103,.11),transparent 32rem),var(--bg); color:var(--text); }
a { color:inherit; }
.public-topbar { width:min(1180px,calc(100% - 32px)); margin:0 auto; min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:18px; border-bottom:1px solid var(--border); }
.public-brand { display:flex; align-items:baseline; gap:12px; text-decoration:none; }
.public-brand strong { font-size:26px; letter-spacing:-.04em; }
.public-brand strong span { color:var(--accent); }
.public-brand small { color:var(--muted); }
.public-top-actions { display:flex; align-items:center; gap:10px; }
.region-pill,.top-chat { display:inline-flex; align-items:center; min-height:38px; padding:8px 12px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.035); text-decoration:none; font-size:13px; font-weight:700; }
.top-chat { background:var(--accent); color:#06110a; border-color:transparent; }
.promotions-public-shell,.promotion-detail-shell { width:min(1180px,calc(100% - 32px)); margin:0 auto; padding:54px 0 90px; }
.public-kicker { display:inline-block; margin-bottom:10px; color:var(--accent2); font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.promotions-hero { max-width:760px; margin-bottom:34px; }
.promotions-hero h1,.promotion-detail-content h1,.public-empty-state h1 { margin:0; font-size:clamp(38px,7vw,72px); line-height:.98; letter-spacing:-.055em; }
.promotions-hero p,.promotion-lead,.public-empty-state p { color:var(--muted); font-size:18px; line-height:1.65; }
.public-promotion-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.public-promotion-card { overflow:hidden; border:1px solid var(--border); border-radius:24px; background:var(--surface); }
.public-promotion-image { display:block; min-height:260px; background:var(--surface2); overflow:hidden; text-decoration:none; }
.public-promotion-image img { display:block; width:100%; height:100%; min-height:260px; object-fit:cover; transition:transform .28s ease; }
.public-promotion-image:hover img { transform:scale(1.015); }
.public-promotion-image > span { min-height:260px; display:grid; place-content:center; text-align:center; background:linear-gradient(145deg,rgba(49,185,104,.14),rgba(49,185,104,.02)); }
.public-promotion-image b { font-size:54px; letter-spacing:-.06em; }
.public-promotion-image small { color:var(--muted); }
.public-promotion-copy { padding:20px; }
.public-promotion-copy > small { color:var(--accent2); font-weight:800; }
.public-promotion-copy h2 { margin:7px 0 8px; font-size:25px; line-height:1.15; }
.public-promotion-copy p { color:var(--muted); line-height:1.58; }
.public-cta { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 16px; border-radius:13px; background:var(--accent); color:#06110a; text-decoration:none; font-weight:900; border:1px solid transparent; }
.public-cta.secondary { background:transparent; color:var(--text); border-color:var(--border); }
.floating-chat { position:fixed; right:20px; bottom:20px; z-index:20; display:grid; place-items:center; min-width:64px; height:52px; padding:0 16px; border-radius:999px; background:var(--accent); color:#06110a; text-decoration:none; font-weight:900; box-shadow:0 16px 40px rgba(0,0,0,.38); }
.back-link { display:inline-flex; margin-bottom:18px; color:var(--muted); text-decoration:none; font-weight:700; }
.promotion-detail-card { overflow:hidden; border:1px solid var(--border); border-radius:28px; background:var(--surface); }
.promotion-detail-hero { display:block; width:100%; max-height:520px; overflow:hidden; background:var(--surface2); }
.promotion-detail-hero img { display:block; width:100%; max-height:520px; object-fit:cover; }
.promotion-detail-content { padding:clamp(22px,4vw,48px); }
.promotion-detail-statusline { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.public-status { display:inline-flex; padding:7px 10px; border-radius:999px; font-size:12px; font-weight:900; background:#315444; }
.public-status.live { background:#157b42; }
.public-status.scheduled { background:#80601b; }
.public-status.expired { background:#575c58; }
.public-status.warning { background:#834a27; }
.promotion-lead { max-width:850px; margin:16px 0 26px; }
.promotion-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:26px 0; }
.promotion-facts span { padding:14px; border:1px solid var(--border); border-radius:16px; background:var(--surface2); min-width:0; }
.promotion-facts small { display:block; color:var(--muted); margin-bottom:5px; }
.promotion-facts strong { display:block; overflow-wrap:anywhere; }
.promotion-text-section { margin-top:30px; }
.promotion-text-section h2 { margin:0 0 12px; font-size:24px; }
.promotion-rich-text,.promotion-terms div { color:#c8d6ce; line-height:1.75; }
.promotion-terms { margin-top:24px; border:1px solid var(--border); border-radius:16px; padding:14px 16px; background:var(--surface2); }
.promotion-terms summary { cursor:pointer; font-weight:900; }
.promotion-terms[open] summary { margin-bottom:12px; }
.promotion-public-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.public-empty-state { padding:40px; border:1px solid var(--border); border-radius:24px; background:var(--surface); text-align:left; }
.public-empty-state.large { max-width:820px; margin:50px auto; }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
@media (max-width:900px) { .public-promotion-grid { grid-template-columns:1fr; } .promotion-facts { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .public-topbar { min-height:70px; } .public-brand small { display:none; } .region-pill { display:none; } .promotions-public-shell,.promotion-detail-shell { padding-top:34px; } .promotion-facts { grid-template-columns:1fr; } .promotion-detail-card { border-radius:20px; } .public-promotion-image,.public-promotion-image img,.public-promotion-image > span { min-height:210px; } }
@media (max-width:480px) { .public-topbar,.promotions-public-shell,.promotion-detail-shell { width:min(100% - 20px,1180px); } .public-brand strong { font-size:22px; } .top-chat { font-size:12px; padding:8px 10px; } .promotion-public-actions { flex-direction:column; } .promotion-public-actions .public-cta { width:100%; } .public-empty-state { padding:26px 20px; } }
