/*
Theme Name: Pandowe Tłumaczenia
Description: Elegancki motyw członkowski z konfigurowalnym przyciskiem płatności.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: pandowe-tlumaczenia
License: GNU General Public License v2 or later
*/
:root { --bg:#0b0910; --panel:#1a111b; --cream:#f5e8d3; --muted:#cdbdac; --coral:#e96e67; --line:#71534e; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--cream); background:radial-gradient(circle at 50% 15%,#2b1626 0,#100b14 42%,#07070c 100%); font-family:"DM Sans",sans-serif; min-height:100vh; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.13; background-image:linear-gradient(30deg,transparent 49%,#df7467 50%,transparent 51%); background-size:74px 74px; mask-image:linear-gradient(to bottom,transparent,#000 70%); }
.nav { height:86px; padding:0 clamp(22px,5vw,82px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.08); background:rgba(8,7,12,.7); backdrop-filter:blur(14px); position:relative; z-index:5; }
.brand { display:flex; gap:12px; align-items:center; font:600 clamp(18px,2vw,25px)/1 "Playfair Display",serif; color:var(--cream); text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:45px; aspect-ratio:1; border:1px solid var(--line); border-radius:50%; background:#21131d; }
nav { display:flex; gap:34px; }
nav a, footer a { color:var(--muted); text-decoration:none; } nav a:hover,nav a:focus-visible,footer a:hover { color:var(--coral); }
.hero { max-width:880px; margin:auto; padding:58px 24px 88px; text-align:center; }
.panda { display:grid; place-items:center; margin:0 auto 18px; width:122px; aspect-ratio:1; border-radius:50%; font-size:70px; background:radial-gradient(circle,#3c2331,#171019 72%); border:1px solid #805651; box-shadow:0 0 70px rgba(233,110,103,.15); }
.eyebrow { letter-spacing:.22em; color:var(--coral); font-size:12px; font-weight:700; }
h1,h2,h3 { font-family:"Playfair Display",serif; }
h1 { margin:10px 0 16px; font-size:clamp(56px,8vw,94px); line-height:.86; letter-spacing:-.04em; } h1 span { color:var(--coral); }
.lead { max-width:650px; margin:26px auto 34px; color:var(--muted); font-size:clamp(17px,2vw,21px); line-height:1.6; }
.price-card { max-width:600px; margin:auto; padding:34px; border:1px solid #9a6d64; border-radius:24px; background:linear-gradient(145deg,rgba(50,31,44,.92),rgba(21,15,25,.95)); box-shadow:0 30px 80px rgba(0,0,0,.35); }
.plan-label { margin:0; color:var(--coral); letter-spacing:.14em; font-size:12px; font-weight:700; }
.price-card h2 { margin:10px 0 22px; font-size:55px; } .price-card h2 small { font:500 15px "DM Sans",sans-serif; color:var(--muted); }
.price-card ul { list-style:none; padding:0; display:flex; justify-content:center; flex-wrap:wrap; gap:8px 20px; margin:0 0 26px; color:var(--muted); font-size:14px; }
.price-card li::before { content:"✓ "; color:var(--coral); font-weight:700; }
.pay-button,.dialog-ok { width:100%; border:0; border-radius:13px; background:linear-gradient(135deg,#ef7d72,#cf555e); color:white; padding:17px 24px; font:700 17px "DM Sans",sans-serif; cursor:pointer; box-shadow:0 12px 30px rgba(216,84,91,.22); transition:.2s ease; }
.pay-button:hover,.pay-button:focus-visible,.dialog-ok:hover { transform:translateY(-2px); filter:brightness(1.08); }
.payment-note { color:#a99898; font-size:12px; line-height:1.5; margin:18px 16px 0; }
.steps { max-width:1100px; margin:auto; padding:84px 24px 110px; text-align:center; border-top:1px solid rgba(255,255,255,.08); }
.steps>h2 { font-size:44px; margin:10px 0 35px; }
.step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; text-align:left; }
.step-grid article { padding:27px; border:1px solid rgba(255,255,255,.09); border-radius:18px; background:rgba(255,255,255,.035); }
.step-grid span { color:var(--coral); font-weight:700; } .step-grid h3 { font-size:23px; margin:14px 0 8px; } .step-grid p { color:var(--muted); line-height:1.55; margin:0; }
footer { display:flex; justify-content:space-between; gap:20px; padding:26px clamp(22px,5vw,82px); border-top:1px solid rgba(255,255,255,.08); color:#9f9299; font-size:13px; }
.wp-content { max-width:900px; margin:0 auto; padding:70px 24px 110px; line-height:1.75; }.wp-content a { color:var(--coral); }.wp-content h1 { font-size:clamp(42px,7vw,72px); line-height:1; }
dialog { max-width:460px; color:var(--cream); background:#1b131d; border:1px solid #8b625d; border-radius:20px; padding:34px; text-align:center; box-shadow:0 30px 100px #000; } dialog::backdrop { background:rgba(3,3,7,.78); backdrop-filter:blur(5px); }
.dialog-icon { font-size:52px; } dialog h2 { margin:10px 0; } dialog p { color:var(--muted); line-height:1.55; } dialog code { color:var(--coral); }
.dialog-close { position:absolute; right:16px; top:12px; border:0; background:none; color:var(--muted); font-size:28px; cursor:pointer; }.dialog-ok { margin-top:10px; }
@media (max-width:720px) { .nav { height:72px; } nav { display:none; } .brand { font-size:18px; } .hero { padding-top:42px; } .price-card { padding:26px 20px; } .price-card h2 { font-size:46px; } .step-grid { grid-template-columns:1fr; } footer { flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }