/* ===== Tokenek – az evrihome.hu színei (világos alapértelmezés) ===== */
:root{
  --bg:#f6f6f3; --panel:#fff; --panel2:#f1f1ec; --line:#e1e1da;
  --txt:#16161b; --mut:#474750; --faint:#6f6f78;
  --lime:#4b8a12;          /* kiemelő szín: világosban sötétzöld, sötétben lime (mint a főoldalon) */
  --lime-hi:#c6f24e;       /* márka-lime: fejléc, gombfeliratok */
  --ink:#111407;           /* sötét gombháttér */
  --kiemeles:#8cc21f;
  --warn-bg:#fff6df; --warn-line:#b26a00; --danger:#c2403a; --focus:#2f6fd0;
  --radius:14px; --card-r:20px;
  --pattern:#8cc21f; --pattern-op:.22;
  --shadow:0 1px 2px rgba(20,20,25,.04),0 12px 32px -20px rgba(20,20,25,.18);
  --f-body:"Instrument Sans",Inter,Arial,sans-serif; --f-head:Manrope,Inter,Arial,sans-serif;
  color-scheme:light;
}
[data-tema=dark]{
  --bg:#0a0a0b; --panel:#121215; --panel2:#17171b; --line:#26262c;
  --txt:#ededef; --mut:#8a8a93; --faint:#5c5c64;
  --lime:#c6f24e; --kiemeles:#c6f24e;
  --warn-bg:#1f1a0e; --warn-line:#e5b04a; --danger:#f2706a; --focus:#6fb4f2;
  --pattern:#c6f24e; --pattern-op:.06;
  --shadow:inset 0 1px rgba(255,255,255,.03),0 18px 40px -28px rgba(0,0,0,.8);
  color-scheme:dark;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{
  margin:0;color:var(--txt);font:400 1.0625rem/1.55 var(--f-body);
  font-feature-settings:"tnum","cv11";-webkit-font-smoothing:antialiased;
  background:
    radial-gradient(60rem 30rem at 10% -10%,color-mix(in srgb,var(--lime) 10%,transparent),transparent 60%),
    radial-gradient(40rem 24rem at 100% 0%,color-mix(in srgb,var(--lime) 5%,transparent),transparent 60%),
    var(--bg);
}
/* halvány ház-mintázat, mint a főoldalon */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:var(--pattern-op);
  background-color:var(--pattern);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280' viewBox='0 0 280 280'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.5' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M20 110V72L52 46l32 26v38z'/%3E%3Cpath d='M42 110V88h20v22'/%3E%3Cpath d='M150 78V50L174 30l24 20v28z'/%3E%3Cpath d='M162 78V62h12v16'/%3E%3Cpath d='M88 246V204L124 176l36 28v42z'/%3E%3Cpath d='M112 246V222h24v24'/%3E%3Cpath d='M208 200V170L234 148l26 22v30z'/%3E%3Cpath d='M220 200V184h14v16'/%3E%3C/g%3E%3C/svg%3E") 0 0/280px 280px;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280' viewBox='0 0 280 280'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.5' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M20 110V72L52 46l32 26v38z'/%3E%3Cpath d='M42 110V88h20v22'/%3E%3Cpath d='M150 78V50L174 30l24 20v28z'/%3E%3Cpath d='M162 78V62h12v16'/%3E%3Cpath d='M88 246V204L124 176l36 28v42z'/%3E%3Cpath d='M112 246V222h24v24'/%3E%3Cpath d='M208 200V170L234 148l26 22v30z'/%3E%3Cpath d='M220 200V184h14v16'/%3E%3C/g%3E%3C/svg%3E") 0 0/280px 280px;
}
h1,h2,h3{font-family:var(--f-head);font-weight:700;line-height:1.15;margin:0 0 .5em;color:var(--txt)}
h1{font-size:clamp(2.25rem,5vw,3rem);letter-spacing:-.025em;line-height:1.1}
h2{font-size:clamp(1.6rem,3.2vw,2.25rem);letter-spacing:-.02em}
h3{font-size:1.1rem;letter-spacing:-.01em}
p{margin:0 0 1em}
a{color:var(--lime)}
.accent{color:var(--lime)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem}
@media(max-width:480px){.wrap{padding:0 1rem}}
.narrow{max-width:48rem}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;background:var(--panel);padding:8px 12px;z-index:100}
.small{font-size:.92rem;color:var(--mut)}
.mt{margin-top:2.2rem}

/* ===== gombok (főoldal: sötét alap, lime felirat, 14px sarok) ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:48px;padding:.75em 1.4em;border-radius:var(--radius);border:1px solid var(--ink);background:var(--ink);color:var(--lime-hi);font:600 1rem var(--f-body);text-decoration:none;cursor:pointer;transition:transform .15s,border-color .2s}
.btn:hover{transform:translateY(-1px)}
.btn-small{min-height:40px;padding:.5em 1em;font-size:.95rem}
.btn-ghost{background:transparent;color:var(--txt);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--mut)}
.btn-full{width:100%}
.btn[disabled]{opacity:.6;cursor:wait}
[data-tema=dark] .btn:not(.btn-ghost){background:var(--lime-hi);color:var(--ink);border-color:var(--lime-hi)}

/* ===== fejléc (lime sáv, logó sötét dobozban) ===== */
.site-header{position:sticky;top:0;z-index:20;background:var(--lime-hi);color:var(--ink)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo img{height:48px;width:48px;object-fit:contain;display:block;background:#15151b;border-radius:12px;padding:4px}
.site-header .btn,[data-tema=dark] .site-header .btn{background:var(--ink);color:var(--lime-hi);border-color:var(--ink)}

/* ===== hero ===== */
.hero{padding:4.5rem 0 4rem}
.hero-grid{display:grid;gap:3rem;align-items:center}
@media(min-width:960px){.hero-grid{grid-template-columns:1.35fr 1fr}}
.eyebrow{display:inline-block;background:var(--lime-hi);color:var(--ink);font-weight:600;font-size:.85rem;padding:.35em .85em;border-radius:999px}
.lead{font-size:1.15rem;color:var(--mut);max-width:40em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:1.6em 0}
.hero-note{font-size:.9rem;color:var(--faint);max-width:40em}
.hero-stats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hero-stats li{background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--card-r);padding:1.25rem;box-shadow:var(--shadow)}
.hero-stats strong{display:block;font:700 1.8rem var(--f-head);letter-spacing:-.02em;color:var(--lime)}
.hero-stats span{font-size:.9rem;color:var(--mut)}

/* ===== szekciók ===== */
.section{padding:4.5rem 0}
.section.alt{background:color-mix(in srgb,var(--panel2) 70%,transparent)}
.section.dark{background:#111407;color:#ededef}
.section.dark h2,.section.dark h3{color:#fff}
.section-lead{font-size:1.1rem;color:var(--mut);max-width:46em}
.dark .section-lead{color:#c9c9cf}
.on-dark{color:#a9a9b0}

.card,.work,.steps li,.bars,.form,.thanks,details{background:var(--panel);border:1px solid var(--line);border-radius:var(--card-r);box-shadow:var(--shadow)}
[data-tema=dark] .card,[data-tema=dark] .work,[data-tema=dark] .steps li,[data-tema=dark] .bars,[data-tema=dark] .form,[data-tema=dark] .thanks{background:linear-gradient(160deg,#15151a,var(--panel))}

.cards4{display:grid;gap:12px;grid-template-columns:repeat(2,1fr);margin-top:1.5rem}
@media(min-width:800px){.cards4{grid-template-columns:repeat(4,1fr)}}
.card{padding:1.25rem}
.card-num{display:block;font:700 1.7rem var(--f-head);letter-spacing:-.02em}
.card p{margin:0;color:var(--mut);font-size:.95rem}

/* ===== sáv-grafikon ===== */
.bars{padding:1.25rem;display:grid;gap:14px;margin-bottom:1rem}
.bar-row{display:grid;grid-template-columns:48px 1fr;gap:6px 12px;align-items:center}
.bar-label{font:700 1rem var(--f-head)}
.bar-track{height:18px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;overflow:hidden}
.bar{display:block;height:100%;width:var(--w);background:var(--kiemeles);border-radius:999px}
.bar-strong{background:var(--lime)}
.bar-val{grid-column:2;font-size:.95rem}
@media(min-width:700px){.bar-row{grid-template-columns:60px 1fr 220px}.bar-val{grid-column:auto}}

/* ===== mire használható ===== */
.works{list-style:none;padding:0;margin:1.75rem 0;display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:600px){.works{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.works{grid-template-columns:repeat(4,1fr)}}
.work{padding:1.35rem;display:flex;flex-direction:column;gap:.6rem;transition:border-color .2s,box-shadow .2s}
.work:hover{border-color:color-mix(in srgb,var(--lime) 45%,var(--line))}
.work-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ico{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--lime) 12%,var(--panel));color:var(--lime);border:1px solid color-mix(in srgb,var(--lime) 25%,var(--line))}
.ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.chip{font-size:.72rem;font-weight:600;padding:.2em .6em;border-radius:999px;background:var(--lime-hi);color:var(--ink)}
.work h3{margin:.2rem 0 0;font-size:1.05rem}
.work p{margin:0;font-size:.93rem;color:var(--mut);line-height:1.5}
.warn{background:var(--warn-bg);border-left:4px solid var(--warn-line);padding:12px 16px;border-radius:12px}

/* ===== lépések ===== */
.steps{list-style:none;counter-reset:s;padding:0;margin:1.5rem 0 0;display:grid;gap:12px}
.steps li{counter-increment:s;display:grid;gap:8px;padding:18px 18px 18px 72px;position:relative}
.steps li::before{content:counter(s);position:absolute;left:18px;top:16px;width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--lime-hi);font:700 1.1rem/38px var(--f-head);text-align:center}
[data-tema=dark] .steps li::before{background:var(--lime-hi);color:var(--ink)}
.steps h3{margin:0;padding-top:6px}
.step-help{font-size:.95rem;color:var(--mut)}
@media(min-width:800px){.steps li{grid-template-columns:1fr 1fr;align-items:center}}
.tag{display:inline-block;background:color-mix(in srgb,var(--lime) 14%,var(--panel));color:var(--lime);font-weight:600;font-size:.78rem;padding:.15em .6em;border-radius:999px;margin-right:.4em}

/* ===== szolgáltatások (sötét blokk) ===== */
.services{list-style:none;padding:0;margin:1.5rem 0;display:grid;gap:12px}
@media(min-width:700px){.services{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.services{grid-template-columns:repeat(5,1fr)}}
.services li{background:linear-gradient(160deg,#1b1f10,#141709);border:1px solid #2c3119;border-radius:var(--card-r);padding:1.25rem}
.services h3{color:var(--lime-hi)!important}
.services p{margin:0;color:#c9c9cf;font-size:.95rem}

/* ===== űrlap ===== */
.form-wrap{display:grid;gap:2rem}
@media(min-width:900px){.form-wrap{grid-template-columns:1fr 1.4fr;align-items:start}.form-intro{position:sticky;top:100px}}
.form,.thanks{padding:1.5rem}
@media(min-width:600px){.form,.thanks{padding:2rem}}
.req-note{font-size:.9rem;color:var(--mut)}
.field{margin:0 0 20px;border:0;padding:0;min-width:0}
.field label,.field legend{display:block;font-weight:600;margin-bottom:6px;padding:0}
input[type=text],input[type=email],input[type=tel],select{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--faint);border-radius:var(--radius);font:inherit;background:var(--panel);color:var(--txt)}
input[aria-invalid=true]{border-color:var(--danger)}
.checks,.radios{display:grid;gap:6px}
@media(min-width:600px){.checks{grid-template-columns:1fr 1fr}}
.checks label,.radios label,.consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;cursor:pointer;padding:4px 0}
input[type=checkbox],input[type=radio]{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--lime)}
.consents{border-top:1px solid var(--line);padding-top:16px;margin-bottom:16px}
.consent{margin-bottom:6px}
.err{color:var(--danger);font-size:.92rem;margin:6px 0 0}
.form-err{margin-bottom:12px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ===== fontos tudnivalók ===== */
.notice{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--card-r);padding:1.5rem}
.notice ul{padding-left:1.2em}
.notice li{margin-bottom:.5em}

/* ===== GYIK ===== */
details{margin-bottom:10px;box-shadow:none}
summary{cursor:pointer;padding:16px 20px;font-weight:600;list-style:none;position:relative;padding-right:48px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:20px;top:12px;font-size:1.4rem;color:var(--lime)}
details[open] summary::after{content:"–"}
details p{padding:0 20px 16px;margin:0;color:var(--mut)}

/* ===== lábléc ===== */
.site-footer{background:#111407;color:#c9c9cf;padding:28px 0 120px;font-size:.92rem}
.site-footer a,.linklike{color:var(--lime-hi)}
.linklike{background:none;border:0;padding:0;font:inherit;text-decoration:underline;cursor:pointer}

/* ===== témaváltó – a főoldal .tema-valto stílusa ===== */
.tema-valto{position:fixed;right:1rem;bottom:calc(var(--suti-sav,0px) + 1rem);z-index:30;display:flex;gap:2px;padding:3px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(8px);border-radius:999px;font-size:.75rem;box-shadow:0 6px 20px -12px rgba(0,0,0,.35)}
.tema-valto button{background:none;border:0;color:var(--mut);font:600 .75rem var(--f-body);padding:.3rem .8rem;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.tema-valto button:hover{color:var(--txt)}
.tema-valto button[aria-pressed=true]{background:var(--lime);color:var(--bg)}
@media print{.tema-valto{display:none}}

/* ===== süti-sáv (főoldal: panel-kártya alul) ===== */
.cookie{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:50;max-width:44rem;margin:0 auto;background:var(--panel);color:var(--txt);border:1px solid var(--line);border-radius:var(--card-r);padding:1.25rem;box-shadow:0 18px 50px -20px rgba(0,0,0,.45)}
.cookie h2{font-size:1.05rem}
.cookie p{font-size:.92rem;color:var(--mut)}
.cookie-opts{display:flex;gap:20px;margin-bottom:12px}
.cookie-opts label{display:flex;gap:8px;align-items:center}
.cookie-btns{display:flex;flex-wrap:wrap;gap:8px}
.cookie-btns .btn{min-height:44px;flex:1 1 auto;font-size:.92rem}
.btn-ghost-dark{background:transparent!important;color:var(--txt)!important;border-color:var(--line)!important}