МОЙ О!

Подарите себеили близким

Оформите подарочную карту в приложении«Мой О!» с кешбэком до 2%

Наведите камеру телефона на QR-код

Открыть в приложении

Откроется приложение «Мой О!»

/* ----- Шрифты и переменные ----- */ @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;700;800&display=swap'); .gc-wrap{ --bg:#0f1115; --card:#171a21; --accent:#ff5a1f; /* фирменный оранжевый O! */ --text:#ffffff; --muted:#9aa0ab; --radius:28px; font-family:'Manrope',system-ui,sans-serif; display:flex;justify-content:center;align-items:center; min-height:560px;padding:40px 16px;box-sizing:border-box; background: radial-gradient(900px 500px at 50% -10%, rgba(255,90,31,.18), transparent 60%), var(--bg); } .gc-card{ position:relative;width:100%;max-width:440px; background:linear-gradient(180deg,#1b1f27,#14171d); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); padding:40px 32px 36px;text-align:center; box-shadow:0 30px 80px -20px rgba(0,0,0,.6); overflow:hidden; } .gc-card::before{ content:"";position:absolute;inset:0; background:radial-gradient(400px 200px at 90% 0%, rgba(255,90,31,.12), transparent 70%); pointer-events:none; } .gc-badge{ display:inline-block;font-size:12px;font-weight:800;letter-spacing:.18em; color:var(--accent);background:rgba(255,90,31,.12); border:1px solid rgba(255,90,31,.3); padding:7px 14px;border-radius:999px;margin-bottom:22px; } .gc-title{ color:var(--text);font-size:34px;line-height:1.1;font-weight:800; margin:0 0 14px;letter-spacing:-.01em; } .gc-sub{ color:var(--muted);font-size:16px;line-height:1.5;margin:0 0 30px; } /* ----- QR (ПК) ----- */ .gc-qr-frame{ display:inline-block;background:#fff;padding:18px;border-radius:20px; box-shadow:0 12px 30px -10px rgba(0,0,0,.5); } #gc-qr{width:200px;height:200px;display:flex;align-items:center;justify-content:center;} #gc-qr img,#gc-qr canvas{display:block;width:200px;height:200px;} /* ----- Кнопка (телефон) ----- */ .gc-btn{ display:inline-block;width:100%;box-sizing:border-box; background:var(--accent);color:#fff;text-decoration:none; font-size:18px;font-weight:700;padding:18px 24px;border-radius:16px; transition:transform .15s ease, box-shadow .2s ease; box-shadow:0 12px 28px -8px rgba(255,90,31,.6); } .gc-btn:active{transform:scale(.98);} .gc-hint{color:var(--muted);font-size:13px;margin:16px 0 0;} /* ----- Переключение ПК / телефон ----- */ .gc-mobile{display:none;} @media (max-width:600px){ .gc-desktop{display:none;} .gc-mobile{display:block;} .gc-title{font-size:28px;} }