:root{
  --paper:#fbf8f2; --ink:#1f2a30; --muted:#5d6a70; --line:#e3ddd1;
  --teal:#1f6f78; --teal-d:#17565d; --teal-soft:#e2f0ef; --coral:#d9644a; --coral-d:#c2533b; --coral-soft:#fbe7e1;
  --ochre:#c8962e; --ochre-soft:#f6ecd4; --white:#fff;
  --serif:"Source Serif 4",Georgia,serif; --display:"Fraunces",Georgia,serif; --sans:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--teal)}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.szuk{max-width:760px;margin:0 auto;padding:60px 20px}
h1,h2,h3{font-family:var(--display);line-height:1.1;margin:0 0 .5em}
h2{font-size:clamp(28px,4.2vw,42px);letter-spacing:-.01em}
h3{font-size:22px}
.kicker{font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--coral)}
.lead{font-size:20px;color:#33434a}
section{padding:84px 0}
.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* sáv és menü */
.sav{background:var(--ink);color:#f4efe6;font-family:var(--sans);font-size:14px;text-align:center;padding:9px 16px}
.sav b{color:#8fd0c9}
.nav{position:sticky;top:0;z-index:20;background:rgba(251,248,242,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:22px;height:64px}
.nav .logo{font-family:var(--display);font-weight:800;font-size:19px;color:var(--ink);text-decoration:none;margin-right:auto}
.nav a.l{font-family:var(--sans);font-size:15px;color:var(--ink);text-decoration:none}
.nav a.l:hover{color:var(--teal)}
@media (max-width:760px){.nav a.l{display:none}}

/* gombok */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:17px;text-decoration:none;border:0;cursor:pointer;border-radius:999px;padding:16px 28px;background:var(--coral);color:#fff;box-shadow:0 12px 26px -12px rgba(217,100,74,.9);transition:transform .15s,background .15s}
.btn:hover{background:var(--coral-d);transform:translateY(-1px)}
.btn.kicsi{padding:10px 18px;font-size:15px;box-shadow:none}
.btn.masod{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--line)}
.btn.masod:hover{background:#fff}

/* hero */
.hero{padding:70px 0 90px;position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(40px,6.4vw,72px);font-weight:800;letter-spacing:-.02em;margin:14px 0 4px}
.hero .avagy{font-family:var(--display);font-style:italic;color:var(--muted);font-size:22px}
.hero .alcim{font-family:var(--display);font-weight:600;font-size:clamp(24px,3.2vw,34px);margin:2px 0 22px}
.hero .gombok{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 18px}
.bizalom{font-family:var(--sans);font-size:14px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 18px}
.bizalom > span::before{content:"✓ ";color:var(--teal);font-weight:700}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.hero .konyv-hely{order:-1}}

/* könyvborító */
.konyv-hely{display:grid;place-items:center;perspective:1600px}
.konyv{position:relative;width:min(340px,80vw);aspect-ratio:3/4.3;transform:rotateY(-14deg) rotateX(3deg);transform-style:preserve-3d;transition:transform .5s}
.konyv:hover{transform:rotateY(-6deg)}
.konyv .elo{position:absolute;inset:0;border-radius:4px 14px 14px 4px;overflow:hidden;background:#f3ead8;box-shadow:24px 34px 60px -24px rgba(31,42,48,.55),inset 6px 0 10px -6px rgba(0,0,0,.35)}
.konyv .elo img{width:100%;height:58%;object-fit:cover}
.konyv .cim{padding:16px 20px;text-align:center}
.konyv .cim .f{font-family:var(--display);font-weight:800;font-size:26px;line-height:1.05}
.konyv .cim .a{font-family:var(--display);font-style:italic;color:var(--muted);font-size:14px;margin:4px 0}
.konyv .cim .s{font-family:var(--display);font-weight:600;font-size:16px}
.konyv .cim .k{font-family:var(--sans);font-size:10px;letter-spacing:.2em;color:var(--coral);margin-top:10px;font-weight:700}
.konyv .gerinc{position:absolute;top:0;bottom:0;left:0;width:16px;background:linear-gradient(90deg,rgba(0,0,0,.25),rgba(255,255,255,.15),rgba(0,0,0,.1));border-radius:4px 0 0 4px}

/* rácsok, kártyák */
.racs{display:grid;gap:18px}
.r4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.r3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.kartya{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 14px 30px -26px rgba(31,42,48,.6)}
.kartya .szam{font-family:var(--display);font-weight:800;font-size:44px;color:var(--coral);line-height:1}
.kartya p{margin:.4em 0 0;font-family:var(--sans);font-size:15.5px;color:var(--muted);line-height:1.55}
.kartya h3{margin:.3em 0 0}

.problem{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.problem img{border-radius:22px}
@media (max-width:900px){.problem{grid-template-columns:1fr}}
ul.pipa{list-style:none;padding:0;margin:16px 0}
ul.pipa li{padding-left:34px;position:relative;margin:10px 0}
ul.pipa li::before{content:"";position:absolute;left:0;top:6px;width:20px;height:20px;border-radius:50%;background:var(--teal-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3 3 7-7' fill='none' stroke='%231f6f78' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
ul.nem li::before{background:var(--coral-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 6l8 8M14 6l-8 8' fill='none' stroke='%23d9644a' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat}

/* minták */
.minta{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 20px 40px -30px rgba(31,42,48,.7)}
.minta img{width:100%}
.minta figcaption{font-family:var(--sans);font-size:14px;color:var(--muted);padding:12px 16px;border-top:1px solid var(--line)}

/* tartalom */
.reszek{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.resz{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 24px}
.resz .rk{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.resz h3{margin:.25em 0 .4em}
.resz ol{margin:0;padding-left:22px;font-family:var(--sans);font-size:15px;color:#33434a}
.resz li{margin:4px 0}

/* szereplők */
.szereplo{text-align:center}
.szereplo img{width:132px;height:132px;border-radius:50%;object-fit:cover;margin:0 auto 12px;border:5px solid #fff;box-shadow:0 10px 24px -14px rgba(31,42,48,.7)}

/* ár */
.ar-doboz{max-width:620px;margin:0 auto;background:#fff;border:2px solid var(--ink);border-radius:28px;padding:38px 34px;text-align:center;box-shadow:0 30px 60px -40px rgba(31,42,48,.8)}
.ar{font-family:var(--display);font-weight:800;font-size:64px;line-height:1;margin:10px 0}
.ar small{font-size:20px;font-weight:600;color:var(--muted)}
.ar-doboz ul{text-align:left;max-width:420px;margin:22px auto}
.fizetes{font-family:var(--sans);font-size:13.5px;color:var(--muted);margin-top:14px}

/* figyelmeztetés, GYIK */
.figy{background:var(--ochre-soft);border-left:6px solid var(--ochre);border-radius:16px;padding:20px 24px;font-family:var(--sans);font-size:15.5px;color:#5a4615}
details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;margin:10px 0}
summary{font-family:var(--sans);font-weight:700;cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:var(--coral);font-size:22px;line-height:1}
details[open] summary::after{content:"–"}
details p{font-family:var(--sans);font-size:15.5px;color:#33434a;margin:.7em 0 0}

/* lábléc */
footer{background:var(--ink);color:#c9d3d6;font-family:var(--sans);font-size:14px;padding:40px 0}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center}
footer a{color:#e8efe9;text-decoration:none}
footer .copy{margin-right:auto}

/* vásárlás előtti ablak */
.ablak{position:fixed;inset:0;background:rgba(31,42,48,.55);display:none;align-items:center;justify-content:center;padding:16px;z-index:50}
.ablak.nyitva{display:flex}
.ablak .belso{background:#fff;border-radius:22px;max-width:520px;width:100%;padding:28px;font-family:var(--sans);font-size:15.5px}
.ablak h3{font-size:24px}
.ablak label{display:flex;gap:12px;align-items:flex-start;margin:14px 0;cursor:pointer}
.ablak input{margin-top:4px;width:18px;height:18px;accent-color:var(--teal)}
.ablak .gombok{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.ablak .btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}

/* jogi oldalak */
.jogi h1{font-size:40px}
.jogi h2{font-size:24px;margin-top:1.6em}
.jogi .hely{background:var(--ochre-soft);padding:2px 6px;border-radius:6px;font-family:var(--sans);font-size:15px}

.kozep{text-align:center}
.halvany{color:var(--muted)}

/* bevezető ár: áthúzott rendes ár és visszaszámláló (a bolt.js kapcsolja ki a határidő után) */
.ar .regi{font-size:34px;font-weight:600;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--coral);text-decoration-thickness:3px;margin-right:16px;vertical-align:middle}
.bevezeto-cimke{display:inline-block;margin-top:14px;background:var(--coral-soft);color:var(--coral-d);font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:.12em;text-transform:uppercase;padding:7px 16px;border-radius:999px}
.ar span,.ar .regi{white-space:nowrap}
.szamlalo{display:flex;justify-content:center;gap:8px;margin:18px 0 10px}
.szamlalo div{flex:1 1 0;max-width:84px;min-width:0;background:var(--ink);color:#fff;border-radius:14px;padding:10px 4px 8px}
.szamlalo b{display:block;font-family:var(--display);font-weight:800;font-size:34px;line-height:1;font-variant-numeric:tabular-nums}
.szamlalo small{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.bevezeto-szoveg{font-family:var(--sans);font-size:14px;color:var(--muted)}
@media (max-width:520px){.ar{font-size:52px}.ar .regi{display:block;margin:0 0 6px;font-size:28px}.szamlalo b{font-size:28px}.szamlalo small{font-size:11px;letter-spacing:.04em}.ar-doboz{padding:32px 20px}}
#ar{scroll-margin-top:72px}
[hidden]{display:none!important}
.kave{font-family:var(--display);font-style:italic;font-size:22px;color:var(--teal);margin:4px 0 2px}
