/*
Theme Name: HWD Recycling
Theme URI: https://hwdrecycling.hu/
Author: HWD Recycling Kft.
Description: Egyedi WordPress classic téma a HWD Recycling újrahasznosított műanyagbeton építőelemeihez.
Version: 1.0.0
Requires PHP: 7.4
Text Domain: hwd
*/

/* ===================================================================
   1. TOKENS
=================================================================== */
:root{
  --green:#1f8a54;
  --green-dark:#166b41;
  --green-darker:#0f3d2a;
  --green-darkest:#0a2a1d;
  --green-hover:#136139;
  --accent:#43b26b;
  --accent-light:#5cc584;
  --accent-lighter:#8fe3ac;
  --bg-tint:#f5f8f6;
  --bg-tint-2:#e4f2e9;
  --border-tint:#e6ece8;
  --border-tint-2:#eef2ef;
  --border-input:#d5ded8;
  --text:#16211c;
  --text-soft:#3c4842;
  --text-softer:#54605a;
  --text-mute:#6b7770;
  --text-faint:#8a968f;
  --footer-bg:#16211c;
  --footer-text:#9fb0a7;
  --footer-text-soft:#83958c;
  --footer-text-faint:#5f7269;
  --footer-legal-bg:#101914;
  --footer-legal-text:#7c8c83;

  --font-head:'Familjen Grotesk',sans-serif;
  --font-mono:'Familjen Grotesk',monospace;
  --font-body:'Hanken Grotesk',system-ui,sans-serif;

  --container-w:1180px;
  --radius-sm:9px;
  --radius-md:14px;
  --radius-lg:18px;
  --radius-pill:20px;

  --section-pad-x:40px;
  --section-pad-y:76px;
}

/* ===================================================================
   2. RESET & BASE
=================================================================== */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:#fff;font-family:var(--font-body);-webkit-font-smoothing:antialiased;color:var(--text);}
img{max-width:100%;}
a{color:var(--green);text-decoration:none;}
a:hover{color:var(--green-hover);}
h1,h2,h3{font-family:var(--font-head);letter-spacing:-.02em;margin:0;}
p{margin:0;}
ul{margin:0;padding:0;}
input,textarea{font-family:var(--font-body);}
input:focus,textarea:focus{outline:none;border-color:var(--green)!important;box-shadow:0 0 0 3px rgba(31,138,84,.14);}
button{font-family:var(--font-body);transition:transform .12s cubic-bezier(.2,.7,.2,1),background .2s ease,border-color .2s ease,box-shadow .2s ease,filter .2s ease;}
button:hover{filter:brightness(1.03);}
button:active{transform:scale(.95);}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px;}

.container{max-width:var(--container-w);margin:0 auto;position:relative;}

/* ===================================================================
   3. ANIMATIONS
=================================================================== */
@keyframes floatUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@keyframes drift{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@keyframes tiltBlk{0%,100%{transform:rotate(-3deg) translateY(0);}50%{transform:rotate(-3deg) translateY(-8px);}}
@keyframes popIn{0%{opacity:0;transform:scale(.4);}60%{transform:scale(1.12);}100%{opacity:1;transform:scale(1);}}
@keyframes ringGrow{from{transform:scale(.4);opacity:.8;}to{transform:scale(2.4);opacity:0;}}
@keyframes confFall{to{transform:translateY(640px) rotate(var(--r));opacity:0;}}

.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal.is-visible{opacity:1;transform:none;}

/* hover-zoom on framed photos (replaces JS-detected object-fit hover in the prototype) */
.usecase-tile img,
.split-card__media img,
.media-box img,
.hero-split__media img,
.step-card__media img{transition:transform .6s cubic-bezier(.2,.7,.2,1);will-change:transform;}
.usecase-tile:hover img,
.split-card__media:hover img,
.media-box:hover img,
.hero-split__media:hover img,
.step-card__media:hover img{transform:scale(1.06);}

/* ===================================================================
   4. DECORATIVE BLOCK GRAPHIC (fixed, per-page position)
=================================================================== */
.concrete-deco{position:fixed;pointer-events:none;z-index:0;filter:grayscale(1);opacity:.12;user-select:none;}
.deco-home{right:-60px;top:40%;width:440px;transform:rotate(-6deg);}
.deco-rolunk{left:-90px;bottom:14%;width:430px;transform:rotate(7deg);}
.deco-termek{right:-45px;top:62%;width:360px;transform:rotate(-10deg);}
.deco-referenciak{left:-75px;top:46%;width:400px;transform:rotate(-8deg);}
.deco-kapcsolat{right:-25px;bottom:22%;width:300px;transform:rotate(8deg);}
.deco-ajanlatkeres{right:-85px;bottom:12%;width:420px;transform:rotate(6deg);}
.deco-koszonjuk{left:-25px;bottom:16%;width:300px;transform:rotate(9deg);}
.deco-404{left:-30px;top:16%;width:300px;transform:rotate(-9deg);}
.deco-kereses{right:-50px;top:52%;width:360px;transform:rotate(-7deg);}
.deco-impresszum{right:-70px;bottom:15%;width:400px;transform:rotate(7deg);}

/* ===================================================================
   5. BUTTONS
=================================================================== */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;padding:14px 26px;border-radius:11px;border:none;cursor:pointer;transition:transform .2s,background .2s,border-color .2s,color .2s;}
.btn-block{display:block;width:100%;text-align:center;}
.btn-sm{padding:11px 22px;font-size:14px;border-radius:var(--radius-sm);}
.btn-green{background:var(--green);color:#fff;}
.btn-green:hover{background:var(--green-hover);color:#fff;transform:translateY(-2px);}
.btn-accent{background:var(--accent);color:var(--green-darkest);box-shadow:0 12px 26px -10px #43b26b99;}
.btn-accent:hover{transform:translateY(-3px);color:var(--green-darkest);}
.btn-accent-flat{background:var(--accent);color:var(--green-darkest);}
.btn-accent-flat:hover{transform:translateY(-3px);color:var(--green-darkest);}
.btn-dark{background:var(--text);color:#fff;}
.btn-dark:hover{color:#fff;transform:translateY(-3px);}
.btn-dark--tint:hover{background:var(--green-darker);}
.btn-outline{background:#fff;color:var(--text);border:1.5px solid var(--border-input);}
.btn-outline:hover{border-color:var(--green);color:var(--green);}
.btn-white{background:#fff;color:var(--green-dark);}
.btn-white:hover{transform:translateY(-3px);color:var(--green-dark);}
.btn-ghost-light{background:#ffffff18;color:#fff;border:1px solid #ffffff44;}
.btn-ghost-light:hover{background:#ffffff2e;color:#fff;}
.btn-ghost-light--soft{background:#ffffff22;}
.btn-ghost-light--soft:hover{background:#ffffff33;}
.btn-footer-accent{background:var(--accent);color:var(--green-darkest);}
.btn-footer-accent:hover{transform:translateY(-3px);color:var(--green-darkest);}
.btn-footer-ghost{background:#ffffff12;color:#fff;border:1px solid #ffffff2b;}
.btn-footer-ghost:hover{background:#ffffff22;color:#fff;}

/* ===================================================================
   6. HEADER / NAV
=================================================================== */
.site-header{display:flex;align-items:center;justify-content:space-between;padding:22px var(--section-pad-x);position:sticky;top:0;background:#ffffffee;backdrop-filter:blur(8px);z-index:50;border-bottom:1px solid var(--border-tint-2);}
.site-header--static{position:static;background:#fff;backdrop-filter:none;}
.site-logo{display:flex;align-items:center;gap:11px;font-family:var(--font-head);font-weight:700;font-size:21px;color:var(--text);letter-spacing:-.02em;}
.site-logo img{height:34px;width:auto;display:block;}

.nav-links{display:flex;align-items:center;gap:30px;font-size:15px;font-weight:600;}
.nav-links a{color:var(--text-soft);transition:color .18s ease;}
.nav-links a:hover{color:var(--green);}
.nav-links a.is-active{color:var(--green);border-bottom:2px solid var(--green);padding-bottom:2px;}

.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;background:none;border:none;cursor:pointer;padding:0;}
.burger span{display:block;width:24px;height:2.5px;background:var(--text);border-radius:2px;}

.mobile-nav{display:none;}
.mobile-nav a{padding:13px 4px;font-size:17px;font-weight:600;color:var(--text);border-bottom:1px solid #f0f3f1;}
.mobile-nav a.cta{margin-top:12px;background:var(--green);color:#fff;border:none;border-radius:10px;text-align:center;padding:14px;}

/* ===================================================================
   7. FOOTER
=================================================================== */
.site-footer{background:var(--footer-bg);color:var(--footer-text);position:relative;overflow:hidden;}
.site-footer .tooth-crown{height:11px;background:repeating-linear-gradient(90deg,var(--green) 0 24px,transparent 24px 44px);}
.site-footer .wordmark{position:absolute;right:26px;bottom:26px;font-family:var(--font-head);font-weight:700;font-size:160px;line-height:1;color:#ffffff08;letter-spacing:-.05em;pointer-events:none;user-select:none;}

.footer-cta{position:relative;padding:50px var(--section-pad-x) 8px;display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;align-items:flex-end;}
.footer-cta-copy{max-width:460px;}
.footer-cta-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-lighter);margin-bottom:14px;}
.footer-cta-title{font-size:32px;font-weight:700;color:#fff;letter-spacing:-.02em;line-height:1.1;margin-bottom:20px;}
.footer-cta-actions{display:flex;gap:12px;flex-wrap:wrap;}

.footer-contact-card{background:var(--green-darker);border:1px solid #1c5638;border-radius:16px;padding:22px 24px;min-width:290px;}
.footer-contact-card .eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-lighter);margin-bottom:14px;}
.footer-contact-list{display:flex;flex-direction:column;gap:12px;font-size:14.5px;}
.footer-contact-list a,.footer-contact-list div{color:#e6f2ea;display:flex;gap:11px;align-items:center;}
.footer-contact-list div.is-muted{color:#9fc0ad;}
.footer-contact-list .dot{width:7px;height:7px;border-radius:2px;background:var(--accent);flex-shrink:0;}

.footer-links{position:relative;display:flex;flex-wrap:wrap;gap:36px 64px;padding:32px var(--section-pad-x) 30px;margin-top:24px;border-top:1px solid #ffffff12;}
.footer-links-brand{margin-right:auto;max-width:260px;}
.footer-links-brand .name{font-family:var(--font-head);font-weight:700;font-size:18px;color:#fff;margin-bottom:9px;}
.footer-links-brand .desc{line-height:1.55;font-size:13.5px;color:var(--footer-text-soft);}
.footer-links-col{display:flex;flex-direction:column;gap:10px;}
.footer-links-col .heading{color:var(--footer-text-faint);font-weight:700;font-size:12px;letter-spacing:.08em;}
.footer-links-col a{color:var(--footer-text);font-size:14px;transition:color .15s;}
.footer-links-col a:hover{color:#fff;}
.footer-links-col a.is-parent{color:var(--accent-lighter);}
.footer-links-col a.is-parent:hover{color:var(--accent-lighter);}

.footer-legal{position:relative;background:var(--footer-legal-bg);color:var(--footer-legal-text);padding:16px var(--section-pad-x);display:flex;justify-content:space-between;align-items:center;font-size:13px;flex-wrap:wrap;gap:8px;}
.footer-legal-links{display:flex;gap:22px;}
.footer-legal-links a{color:var(--footer-text);}

/* ===================================================================
   8. SHARED CONTENT PATTERNS (eyebrow/heading, sizing utilities)
=================================================================== */
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:10px;display:block;}
.eyebrow--light{color:var(--accent-lighter);}
.eyebrow-sm{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--green);letter-spacing:.04em;margin-bottom:14px;display:block;}

.section-head{margin-bottom:44px;}
.section-head--center{text-align:center;}
.section-head h2{font-size:38px;font-weight:700;}
.section-head p{font-size:16px;color:var(--text-mute);margin-top:10px;max-width:560px;}

.media-h-210{min-height:210px;}
.media-h-260{min-height:260px;}
.media-h-280{min-height:280px;}
.media-h-340{min-height:340px;}
.media-h-360{min-height:360px;}
.media-h-400{min-height:400px;}
.media-h-440{min-height:440px;}
.media-h-460{min-height:460px;}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}

/* split-card: two-pane feature block (image + copy), light or dark */
.split-card{border-radius:var(--radius-lg);overflow:hidden;display:grid;}
.split-card--light{background:var(--bg-tint);border:1px solid var(--border-tint);}
.split-card--dark{background:var(--green-darker);color:#fff;}
.split-card--cols-1-1{grid-template-columns:1fr 1fr;}
.split-card--cols-1-1-15{grid-template-columns:1fr 1.15fr;}
.split-card--cols-15-1{grid-template-columns:1.15fr 1fr;}
.split-card--cols-105-95{grid-template-columns:1.05fr .95fr;}
.split-card--cols-95-105{grid-template-columns:.95fr 1.05fr;}
.split-card__media{position:relative;}
.split-card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.split-card__badge{position:absolute;top:18px;left:18px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-darkest);background:var(--accent-lighter);padding:7px 13px;border-radius:var(--radius-pill);}
.split-card__body{padding:40px 42px;display:flex;flex-direction:column;justify-content:center;}
.split-card__body h2{font-size:30px;margin-bottom:14px;line-height:1.12;}
.split-card__body p{font-size:16px;line-height:1.6;color:var(--text-softer);margin-bottom:18px;max-width:460px;}
.split-card--dark .split-card__body p{color:#bcd0c5;}
.split-card__link{font-size:15px;font-weight:700;color:var(--green);}
.split-card--dark .split-card__link{color:var(--accent-lighter);}

/* cta-band: full-width green gradient call to action */
.cta-band{margin:0 var(--section-pad-x) 70px;border-radius:var(--radius-lg);background:linear-gradient(120deg,var(--green-dark),var(--green));padding:54px 48px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;gap:24px;flex-wrap:wrap;}
.cta-band--spaced{margin-top:56px;}
.cta-band__decor{position:absolute;right:-30px;top:-30px;width:180px;height:180px;border-radius:20px;background:#ffffff14;transform:rotate(15deg);}
.cta-band__copy{position:relative;}
.cta-band__copy h2{font-size:34px;color:#fff;margin-bottom:8px;}
.cta-band__copy p{font-size:17px;color:#d6ecdf;max-width:460px;}
.cta-band .btn{position:relative;}

/* section-card: neutral bordered card used for values/misconceptions/faq etc */
.info-card{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-md);padding:30px 26px;}
.info-card h3,.info-card .title{font-family:var(--font-head);font-size:20px;font-weight:700;margin-bottom:8px;}
.info-card p,.info-card .desc{font-size:15px;color:var(--text-softer);line-height:1.55;}

/* ===================================================================
   9. HERO (image + gradient overlay + copy), used on 6 pages
=================================================================== */
.hero-media{position:relative;overflow:hidden;height:var(--hero-h,420px);}
.hero-media--xl{--hero-h:560px;--hero-h-mobile:440px;}
.hero-media--lg{--hero-h:440px;--hero-h-mobile:380px;}
.hero-media--md{--hero-h:420px;--hero-h-mobile:360px;}
.hero-media--sm{--hero-h:280px;--hero-h-mobile:260px;}
.hero-media--xs{--hero-h:260px;--hero-h-mobile:230px;}
.hero-media__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero-media__overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,42,29,.88) 0%,rgba(10,42,29,.55) 42%,rgba(10,42,29,.12) 100%);}
.hero-media__overlay--soft{background:linear-gradient(90deg,rgba(10,42,29,.86) 0%,rgba(10,42,29,.5) 55%,rgba(10,42,29,.18) 100%);}
.hero-media__content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 60px;max-width:720px;animation:floatUp .8s ease both;}
.hero-media__content--wide{max-width:820px;}
.hero-media__badge{display:inline-block;width:fit-content;font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-lighter);border:1px solid #2f9c5e88;background:#0a2a1d55;padding:7px 13px;border-radius:var(--radius-pill);margin-bottom:22px;}
.hero-media__eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-lighter);margin-bottom:18px;}
.hero-media__content h1{font-size:62px;line-height:1.02;font-weight:700;color:#fff;margin-bottom:20px;letter-spacing:-.03em;}
.hero-media__content--lg h1{font-size:54px;line-height:1.03;margin-bottom:16px;}
.hero-media__content--sm h1{font-size:46px;line-height:1.05;margin-bottom:0;}
.hero-media__content p{font-size:19px;line-height:1.6;color:#dbeae1;margin-bottom:30px;max-width:520px;}
.hero-media__actions{display:flex;gap:14px;flex-wrap:wrap;}

.block-cluster{position:absolute;right:40px;bottom:34px;width:380px;height:330px;z-index:2;}
.block-cluster img{position:absolute;transition:transform .5s cubic-bezier(.2,.9,.3,1);will-change:transform;}
.block-cluster img.blk-1{right:0;top:0;width:262px;filter:drop-shadow(0 18px 22px rgba(0,0,0,.45));}
.block-cluster img.blk-2{left:0;bottom:6px;width:206px;filter:drop-shadow(0 24px 26px rgba(0,0,0,.55));}

/* trust strip */
.trust-strip{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 20px;padding:22px var(--section-pad-x);background:var(--footer-bg);color:#c9d3cd;font-size:14px;font-weight:600;}
.trust-strip__label{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;color:#7fae94;}

/* sizes section + accordion cards */
.sizes-section{padding:var(--section-pad-y) var(--section-pad-x);}
.size-card{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-md);padding:26px 22px;transition:transform .25s,box-shadow .25s,border-color .25s;cursor:pointer;}
.size-card:hover{transform:translateY(-6px);box-shadow:0 22px 40px -22px rgba(15,61,42,.35);}
.size-card.is-open{border-color:var(--green);}
.size-card__media{height:104px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;overflow:hidden;}
.size-card__media img{filter:drop-shadow(0 9px 11px rgba(15,61,42,.2));}
.size-card__row{display:flex;align-items:center;justify-content:space-between;}
.size-card__num{font-family:var(--font-head);font-size:30px;font-weight:700;}
.size-card__num span{font-size:15px;color:var(--text-faint);font-weight:600;}
.size-card__chev{width:9px;height:9px;border-right:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(45deg);transition:transform .3s ease;flex-shrink:0;}
.size-card.is-open .size-card__chev{transform:rotate(-135deg);}
.size-card__detail{max-height:0;opacity:0;overflow:hidden;transition:max-height .45s ease,opacity .35s ease,margin-top .35s ease;}
.size-card__detail-inner{border-top:1px solid #e0e7e2;margin-top:14px;padding-top:14px;display:flex;flex-direction:column;gap:9px;}
.size-card__spec{display:flex;justify-content:space-between;font-size:14px;}
.size-card__spec span:first-child{color:var(--text-faint);}
.size-card__spec span:last-child{color:var(--text);font-weight:600;}
.size-card__note{font-size:14px;color:var(--text-softer);line-height:1.5;margin-top:2px;}
.sizes-section__note{text-align:center;margin-top:26px;font-family:var(--font-mono);font-size:13px;color:var(--text-faint);}

/* size grid, static (no accordion) variant used on termék oldal */
.size-card--static .size-card__meta{font-family:var(--font-mono);font-size:13px;color:var(--text-mute);margin-top:6px;}
.size-card--static .size-card__desc{font-size:14px;color:var(--text-softer);margin-top:10px;line-height:1.5;}
.size-card--static:hover{transform:translateY(-6px);box-shadow:0 22px 40px -22px rgba(15,61,42,.35);}

/* usecase gallery (home) */
.usecase-gallery{padding:0 var(--section-pad-x) 76px;}
.usecase-grid{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:auto auto;gap:20px;}
.usecase-tile{border-radius:16px;overflow:hidden;position:relative;}
.usecase-tile--feature{grid-row:span 2;height:440px;}
.usecase-tile--sm{height:210px;}
.usecase-tile img{width:100%;height:100%;object-fit:cover;}
.usecase-tile__overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,42,29,.6),transparent 45%);}
.usecase-tile__overlay--soft{background:linear-gradient(0deg,rgba(10,42,29,.55),transparent 55%);}
.usecase-tile__caption{position:absolute;left:22px;bottom:22px;right:22px;}
.usecase-tile__caption--card{left:30px;bottom:30px;right:auto;background:#ffffffee;padding:18px 22px;border-radius:12px;}
.usecase-tile__caption--card .title{color:var(--text);}
.usecase-tile__caption--card .desc{color:var(--text-softer);}
.usecase-tile__caption .title{font-family:var(--font-head);font-size:19px;font-weight:700;color:#fff;}
.usecase-tile__caption .desc{font-size:13px;color:#d6ecdf;margin-top:2px;}

/* how it works steps */
.how-section{padding:0 var(--section-pad-x) 76px;}
.how-section h2{font-size:34px;font-weight:700;margin-bottom:30px;}
.step-card__media{height:200px;border-radius:14px;overflow:hidden;position:relative;margin-bottom:16px;}
.step-card__media img{width:100%;height:100%;object-fit:cover;}
.step-card__num{position:absolute;top:12px;right:12px;font-family:var(--font-head);font-weight:700;color:#fff;font-size:24px;text-shadow:0 2px 8px rgba(0,0,0,.5);}
.step-card__title{font-family:var(--font-head);font-size:18px;font-weight:700;}
.step-card__desc{font-size:14px;color:var(--text-softer);margin-top:4px;}

/* ===================================================================
   10. HERO SPLIT (termék oldal — szöveg + kép, nincs overlay)
=================================================================== */
.hero-split{display:grid;grid-template-columns:1fr 1fr;background:radial-gradient(120% 120% at 0% 0%,#eef7f1 0%,#ffffff 60%);}
.hero-split__copy{padding:76px 48px;display:flex;flex-direction:column;justify-content:center;animation:floatUp .8s ease both;}
.hero-split__copy h1{font-family:var(--font-head);font-size:50px;line-height:1.04;font-weight:700;margin:0 0 18px;letter-spacing:-.03em;}
.hero-split__copy p{font-size:18px;line-height:1.6;color:var(--text-softer);margin:0 0 28px;max-width:450px;}
.hero-split__actions{display:flex;gap:12px;flex-wrap:wrap;}
.hero-split__media{min-height:460px;}
.hero-split__media img{width:100%;height:100%;object-fit:cover;}

/* generic content sections & swatches */
.content-section{padding:var(--section-pad-y) var(--section-pad-x);}
.content-section--tight-top{padding-top:20px;}
.content-section--tight{padding-top:20px;padding-bottom:20px;}
.content-section--bg{background:var(--bg-tint);}

.swatch{width:40px;height:40px;margin-bottom:18px;}
.swatch--square{border-radius:9px;background:var(--green);}
.swatch--circle{border-radius:50%;background:var(--accent);}
.swatch--diamond{width:40px;height:40px;background:var(--green-dark);transform:rotate(45deg);margin:0 0 18px 8px;}

.checklist{display:flex;flex-direction:column;gap:12px;list-style:none;}
.checklist li{display:flex;gap:12px;align-items:center;font-size:16px;color:var(--text-soft);}
.checklist__marker{width:22px;height:22px;border-radius:6px;flex-shrink:0;}
.swatch-a{background:var(--green);}
.swatch-b{background:var(--accent);}
.swatch-c{background:var(--green-dark);}

/* size grid static variant (termék oldal) */
.size-card__num--lg{font-size:32px;}
.size-card__meta{font-family:var(--font-mono);font-size:13px;color:var(--text-mute);margin-top:6px;}
.size-card__desc{font-size:14px;color:var(--text-softer);margin-top:10px;line-height:1.5;}

/* stat panel (dark, right column of material/spec band) */
.stat-panel{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;gap:22px;background:var(--green-darkest);}
.stat-panel__item{display:flex;align-items:baseline;gap:14px;}
.stat-panel__num{font-family:var(--font-head);font-size:44px;font-weight:700;color:var(--accent-light);letter-spacing:-.03em;}
.stat-panel__label{font-size:14px;color:#a9c6b5;}
.stat-panel__label span{color:#7fae94;}
.stat-panel__divider{height:1px;background:#ffffff18;}

/* tag chips */
.tag-list{display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.tag-row{display:flex;flex-wrap:wrap;gap:8px;}
.tag-row--lg{gap:10px;}
.tag-chip{font-family:var(--font-head);font-size:12.5px;color:#d6ecdf;border:1px solid #2f9c5e;padding:6px 12px;border-radius:var(--radius-pill);}
.tag-chip--lg{padding:7px 14px;}

/* collage grid (fogazás közelről) */
.collage-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:14px;}
.collage-grid__item{border-radius:14px;overflow:hidden;}
.collage-grid__item--wide{grid-column:span 2;height:220px;}
.collage-grid__item--sm{height:170px;}
.collage-grid__item img{width:100%;height:100%;object-fit:cover;}

/* callout box (info flag inside dark or light panels) */
.callout-box{display:flex;gap:14px;align-items:flex-start;background:var(--green-darkest);border:1px solid #1c5638;border-radius:14px;padding:18px 20px;margin-bottom:20px;}
.callout-box--light{background:var(--bg-tint);border-color:var(--border-tint);margin-bottom:0;}
.callout-box__icon{width:26px;height:26px;border-radius:7px;background:#1b5a3c;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--accent-lighter);font-weight:700;}
.callout-box--light .callout-box__icon{background:var(--bg-tint-2);color:var(--green);}
.callout-box__icon--sm{width:24px;height:24px;border-radius:6px;}
.callout-box__text{font-size:15px;color:#d6ecdf;line-height:1.55;}
.callout-box--light .callout-box__text{color:var(--text-softer);font-size:14px;}
.callout-box__text b{color:#fff;}
.callout-box--light .callout-box__text b{color:var(--text);}

/* price panel */
.price-panel{border-radius:var(--radius-lg);overflow:hidden;background:linear-gradient(120deg,var(--green-dark),var(--green));padding:44px 40px;color:#fff;}
.price-panel__eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#c7ecd6;margin-bottom:12px;}
.price-panel__value{display:flex;align-items:baseline;gap:10px;}
.price-panel__value strong{font-family:var(--font-head);font-size:52px;font-weight:700;letter-spacing:-.03em;}
.price-panel__value span{font-size:16px;color:#d6ecdf;}
.price-panel p{font-size:15px;line-height:1.6;color:#d6ecdf;margin:16px 0 22px;}

/* info card size variant */
.info-card--lg{padding:36px 34px;background:#fff;}
.info-card--lg h3{font-size:26px;line-height:1.15;}
.info-card--lg p{font-size:16px;line-height:1.65;}

/* applications / referenciák tile add-ons */
.usecase-tile--app{height:280px;}
.usecase-tile--tall{height:440px;}
.usecase-tile--gallery{height:290px;}
.usecase-tile__eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-lighter);}
.usecase-tile__badge{display:inline-block;font-family:var(--font-head);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--green-darkest);background:var(--accent-lighter);padding:5px 11px;border-radius:var(--radius-pill);margin-bottom:12px;}

.stack-col{display:flex;flex-direction:column;gap:24px;}
.usecase-tile--flex{flex:1;min-height:205px;}

.stat-row{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--border-tint-2);}
.stat-row__item{padding:30px 40px;border-right:1px solid var(--border-tint-2);}
.stat-row__item:last-child{border-right:none;}
.stat-row__num{font-family:var(--font-head);font-size:34px;font-weight:700;letter-spacing:-.03em;}
.stat-row__label{font-size:14px;color:var(--text-mute);margin-top:2px;}

.fine-print{font-size:13px;color:#9aa6a0;margin-top:22px;font-family:var(--font-mono);}

/* ===================================================================
   11. PROSE / STANDALONE MEDIA HELPERS (rólunk, termék copy blocks)
=================================================================== */
.h2-md{font-size:36px;margin-bottom:18px;line-height:1.1;}
.h2-sm{font-size:34px;margin-bottom:16px;line-height:1.12;}
.h2-section{font-size:34px;margin-bottom:34px;}
.body-text--dark{color:#bcd0c5;}
.body-text{font-size:17px;line-height:1.65;color:var(--text-softer);margin-bottom:16px;}
.body-text:last-child{margin-bottom:0;}
.body-text--spaced{margin-bottom:24px;}
.text-dim-dark{font-size:15px;color:#9fc0ad;line-height:1.6;}
.stat-inline-row{display:flex;gap:40px;margin-top:12px;}

.media-box{border-radius:16px;overflow:hidden;}
.media-box img{width:100%;height:100%;object-fit:cover;display:block;}
.media-box.h-260{height:260px;}
.media-box.h-280{height:280px;}
.media-box.h-340{height:340px;}
.media-box.h-360{height:360px;}
.media-box.h-400{height:400px;}
.media-box.h-440{height:440px;}

.split-card--bordered{background:#fff;border:1px solid var(--border-tint);border-radius:var(--radius-lg);overflow:hidden;}
.split-card__body--white{background:#fff;}

.text-dim-dark--spaced{margin-bottom:22px;}
.text-dim-dark--top{margin:16px 0 0;color:#7fae94;}
.body-text--mute{color:var(--text-mute);}
.mt-40{margin-top:40px;}
.grid-2--tight{gap:16px;margin-top:22px;}
.grid-2--gap24{gap:24px;}
.content-section--pb20{padding-bottom:20px;}
.content-section--gallery{padding:40px 40px 20px;}
.grid-featured{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:stretch;}
.usecase-tile__caption--feature .title{font-size:30px;}
.usecase-tile__caption--feature .desc{font-size:15px;max-width:520px;}

/* ===================================================================
   12. CONTACT PAGE
=================================================================== */
.contact-list{display:flex;flex-direction:column;gap:22px;}
.contact-item{display:flex;gap:16px;align-items:flex-start;}
.icon-box{width:42px;height:42px;border-radius:11px;background:var(--bg-tint-2);flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.icon-box__mark{width:16px;height:16px;}
.icon-box__mark--square{border-radius:4px;background:var(--green);}
.icon-box__mark--diamond{background:var(--green-dark);transform:rotate(45deg);}
.icon-box__mark--circle{border-radius:50%;background:var(--accent);}
.icon-box__mark--frame{height:12px;border-radius:2px;border:2px solid var(--green);}
.icon-box__mark--frame-thick{border-radius:4px;border:3px solid var(--green);}
.contact-item__label{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;color:var(--text-faint);text-transform:uppercase;}
.contact-item__value{font-size:17px;font-weight:600;margin-top:3px;}

.contact-promo{margin-top:30px;padding:24px;background:var(--green-darker);border-radius:var(--radius-md);}
.contact-promo .title{font-family:var(--font-head);font-size:19px;font-weight:700;color:#fff;margin-bottom:6px;}
.contact-promo .desc{font-size:14px;color:#bcd0c5;line-height:1.55;margin-bottom:16px;}

.map-frame{border-radius:var(--radius-lg);overflow:hidden;height:100%;min-height:440px;border:1px solid var(--border-tint);}
.map-frame iframe{width:100%;height:100%;border:0;display:block;min-height:440px;}

.faq-list{display:flex;flex-direction:column;gap:12px;max-width:900px;}
.faq-item{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-md);overflow:hidden;cursor:pointer;transition:border-color .25s;}
.faq-item.is-open{border-color:var(--green);}
.faq-item__q{display:flex;align-items:center;justify-content:space-between;padding:22px 26px;}
.faq-item__q span{font-family:var(--font-head);font-size:18px;font-weight:600;color:var(--text);}
.faq-item__chev{width:9px;height:9px;border-right:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(45deg);transition:transform .3s ease;flex-shrink:0;margin-left:16px;}
.faq-item.is-open .faq-item__chev{transform:rotate(-135deg);}
.faq-item__a{max-height:0;opacity:0;overflow:hidden;transition:max-height .4s ease,opacity .3s ease;}
.faq-item__a p{margin:0;padding:0 26px 22px;font-size:15px;line-height:1.6;color:var(--text-softer);}

.content-section--contact{padding-bottom:30px;display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start;}
.content-section--faq{padding:60px var(--section-pad-x) 30px;}
.h2-contact{font-size:26px;margin-bottom:24px;}

/* ===================================================================
   13. AJÁNLATKÉRÉS: kalkulátor, űrlap, fal-építő animáció
=================================================================== */
.section-head--compact{margin-bottom:26px;}
.section-head--compact h2{font-size:34px;margin-bottom:6px;}

.configurator{padding:56px var(--section-pad-x) 20px;}
.configurator__grid{display:grid;grid-template-columns:1.35fr .65fr;gap:24px;align-items:start;}
.qty-rows{display:flex;flex-direction:column;gap:14px;}
.qty-row{display:flex;align-items:center;gap:18px;padding:16px 22px;background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-md);}
.qty-row__media{height:56px;width:74px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.qty-row__media img{filter:drop-shadow(0 6px 8px rgba(15,61,42,.18));}
.qty-row__label{flex:1;}
.qty-row__label .name{font-family:var(--font-head);font-weight:700;font-size:20px;}
.qty-row__label .meta{font-size:12.5px;color:var(--text-mute);font-family:var(--font-head);}
.qty-control{display:flex;align-items:center;gap:10px;}
.qty-btn{width:38px;height:38px;border-radius:10px;font-size:22px;line-height:1;cursor:pointer;}
.qty-btn--dec{border:1.5px solid var(--border-input);background:#fff;color:var(--text);}
.qty-btn--dec:hover{border-color:var(--green);color:var(--green);}
.qty-btn--inc{border:1.5px solid var(--green);background:var(--green);color:#fff;}
.qty-btn--inc:hover{background:var(--green-hover);}
.qty-value{min-width:38px;text-align:center;font-family:var(--font-head);font-weight:700;font-size:20px;}
.configurator__note{font-size:13px;color:var(--text-faint);margin:4px 2px 0;line-height:1.5;}

.calc-summary{position:sticky;top:96px;background:var(--green-darker);border-radius:var(--radius-lg);padding:28px 26px;color:#fff;}
.calc-summary__eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-lighter);margin-bottom:18px;}
.calc-summary__rows{display:flex;flex-direction:column;gap:16px;}
.calc-summary__row{display:flex;justify-content:space-between;align-items:baseline;}
.calc-summary__row .label{font-size:14px;color:#bcd0c5;}
.calc-summary__row .value{font-family:var(--font-head);font-weight:700;font-size:26px;color:#fff;}
.calc-summary__row .value--md{font-size:20px;}
.calc-summary__row .value--price{font-size:24px;color:var(--accent-light);}
.calc-summary__row .sub{font-size:12.5px;color:#7fae94;}
.calc-summary__row .sub-value{font-size:14px;color:#a9c6b5;}
.calc-summary__divider{height:1px;background:#ffffff18;}
.calc-summary__note{margin-top:20px;font-size:12px;color:#7fae94;line-height:1.5;}
.calc-summary .btn{margin-top:18px;}

.process-steps{display:flex;flex-direction:column;gap:20px;}
.process-step{display:flex;gap:14px;align-items:flex-start;}
.process-step__num{font-family:var(--font-head);font-weight:700;color:var(--green);font-size:20px;min-width:28px;}
.process-step__title{font-weight:700;font-size:16px;}
.process-step__desc{font-size:14px;color:var(--text-mute);line-height:1.5;}

.mini-card{border-radius:var(--radius-md);padding:20px 22px;}
.mini-card--light{background:var(--bg-tint);border:1px solid var(--border-tint);}
.mini-card--dark{background:var(--green-darker);color:#fff;}
.mini-card .kicker{font-family:var(--font-head);font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;}
.mini-card--light .kicker{color:var(--text-faint);}
.mini-card--dark .kicker{color:var(--accent-lighter);}
.mini-card__link{font-size:15px;font-weight:600;color:var(--green);}
.mini-card--dark p{font-size:14.5px;line-height:1.55;color:#d6ecdf;margin:0;}
.mini-card--dark p b{color:#fff;}

.wall-anim-label{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:6px;display:block;}
.wall-anim-desc{font-size:13.5px;line-height:1.55;color:var(--text-mute);margin:0 0 16px;max-width:380px;}
.wall-anim-desc b{color:var(--text);}

.wall-anim{position:relative;width:100%;height:160px;overflow:visible;}
.wall-anim__shadow{position:absolute;left:6px;width:398px;bottom:-3px;height:14px;background:radial-gradient(ellipse at center,rgba(15,61,42,.22),transparent 72%);}
.wall-anim__ground{position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent,#c3cec8 10%,#c3cec8 90%,transparent);border-radius:2px;}
.wall-anim__blocks{position:absolute;left:0;bottom:0;width:410px;height:120px;}
.wall-anim__blocks img{position:absolute;filter:drop-shadow(0 8px 10px rgba(15,61,42,.28));}
.wb-1{left:10px;bottom:0;width:130px;z-index:1;}
.wb-2{left:140px;bottom:0;width:130px;z-index:1;}
.wb-3{left:270px;bottom:0;width:130px;z-index:1;}
.wb-4{left:10px;bottom:31px;width:65px;z-index:2;}
.wb-5{left:75px;bottom:31px;width:130px;z-index:2;}
.wb-6{left:205px;bottom:31px;width:130px;z-index:2;}
.wb-7{left:335px;bottom:31px;width:65px;z-index:2;}
.wb-8{left:10px;bottom:62px;width:130px;z-index:3;}
.wb-9{left:140px;bottom:62px;width:130px;z-index:3;}
.wb-10{left:270px;bottom:62px;width:130px;z-index:3;}

.quote-form{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-lg);padding:38px 36px;}
.quote-form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.quote-form label{display:block;font-size:13px;font-weight:600;color:var(--text-soft);margin-bottom:7px;}
.quote-form input,.quote-form textarea{width:100%;padding:13px 15px;border:1.5px solid var(--border-input);border-radius:10px;font-size:15px;background:#fff;}
.quote-form textarea{resize:vertical;}
.quote-form .field-full{margin-bottom:22px;}
.package-recap{background:#fff;border:1px solid var(--border-tint);border-radius:12px;padding:16px 18px;margin-bottom:22px;}
.package-recap .kicker{font-family:var(--font-head);font-size:11px;letter-spacing:.08em;color:var(--text-faint);text-transform:uppercase;margin-bottom:8px;}
.package-recap__pkg{font-size:15px;color:var(--text);font-weight:600;line-height:1.5;}
.package-recap__meta{font-size:13px;color:var(--text-mute);margin-top:4px;}
.package-recap__empty{font-size:14px;color:var(--text-faint);}
.package-recap__filled{display:none;}
.package-recap__filled.is-visible{display:block;}
.package-recap__empty.is-hidden{display:none;}

.quote-section{padding:44px var(--section-pad-x) 70px;display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start;}
.h2-quote{font-size:26px;margin-bottom:18px;}
.mini-card--spaced{margin-top:28px;}
.mini-card--spaced-sm{margin-top:14px;}
.wall-anim-wrap{margin-top:34px;}

/* ===================================================================
   13b. FAL-RAJZ (statikus, nem animált) — pl. kezdőlap, kötésben rakás
   elmagyarázásához. Százalékos pozicionálás + aspect-ratio: JS nélkül is
   mindig arányosan skálázódik és középen marad, bármilyen szélességen.
=================================================================== */
.wall-diagram{position:relative;width:100%;max-width:410px;margin:0 auto;}
.wall-diagram__ground{position:absolute;left:4%;right:4%;bottom:-2px;height:3px;background:linear-gradient(90deg,transparent,#c3cec8 10%,#c3cec8 90%,transparent);border-radius:2px;}
.wall-diagram__blocks{position:relative;width:100%;aspect-ratio:410/120;}
.wall-diagram__blocks img{position:absolute;filter:drop-shadow(0 8px 10px rgba(15,61,42,.28));}
.wd-1{left:2.44%;bottom:0;width:31.71%;z-index:1;}
.wd-2{left:34.15%;bottom:0;width:31.71%;z-index:1;}
.wd-3{left:65.85%;bottom:0;width:31.71%;z-index:1;}
.wd-4{left:2.44%;bottom:25.83%;width:15.85%;z-index:2;}
.wd-5{left:18.29%;bottom:25.83%;width:31.71%;z-index:2;}
.wd-6{left:50%;bottom:25.83%;width:31.71%;z-index:2;}
.wd-7{left:81.71%;bottom:25.83%;width:15.85%;z-index:2;}
.wd-8{left:2.44%;bottom:51.67%;width:31.71%;z-index:3;}
.wd-9{left:34.15%;bottom:51.67%;width:31.71%;z-index:3;}
.wd-10{left:65.85%;bottom:51.67%;width:31.71%;z-index:3;}

/* ===================================================================
   13c. TIKTOK-GALÉRIA — 3 közvetlenül beágyazott TikTok videó
=================================================================== */
.tiktok-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.tiktok-card{display:flex;justify-content:center;background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-md);overflow:hidden;padding:8px;}
.tiktok-card blockquote.tiktok-embed{margin:0;width:100%;}

/* ===================================================================
   14. KÖSZÖNŐ OLDAL: ünneplő hero, fal-építő + pipa + konfetti
=================================================================== */
.celebration-hero{position:relative;overflow:hidden;background:radial-gradient(120% 130% at 50% -10%,var(--green-dark) 0%,var(--green-darker) 48%,var(--green-darkest) 100%);color:#fff;padding:70px var(--section-pad-x) 60px;}
.celebration-hero__confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.celebration-hero__inner{position:relative;max-width:820px;margin:0 auto;text-align:center;}

.celebration-wall-wrap{display:flex;justify-content:center;margin-bottom:8px;}
.celebration-wall{position:relative;width:375px;height:175px;}
.celebration-wall img{position:absolute;filter:drop-shadow(0 10px 14px rgba(0,0,0,.45));}
.cw-1{left:0;bottom:0;width:150px;z-index:1;}
.cw-2{left:150px;bottom:0;width:150px;z-index:1;}
.cw-3{left:300px;bottom:0;width:75px;z-index:1;}
.cw-4{left:0;bottom:37px;width:75px;z-index:2;}
.cw-5{left:75px;bottom:37px;width:150px;z-index:2;}
.cw-6{left:225px;bottom:37px;width:150px;z-index:2;}
.cw-7{left:0;bottom:74px;width:150px;z-index:3;}
.cw-8{left:150px;bottom:74px;width:150px;z-index:3;}
.cw-9{left:300px;bottom:74px;width:75px;z-index:3;}
.cw-10{left:0;bottom:111px;width:75px;z-index:4;}
.cw-11{left:75px;bottom:111px;width:150px;z-index:4;}
.cw-12{left:225px;bottom:111px;width:150px;z-index:4;}

.celebration-check{position:absolute;left:50%;top:96px;transform:translate(-50%,-50%) scale(.4);opacity:0;z-index:6;}
.celebration-check__inner{position:relative;width:96px;height:96px;}
.celebration-check__ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent-light);opacity:0;}
.celebration-check__circle{position:absolute;inset:0;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;box-shadow:0 14px 34px -8px rgba(67,178,107,.85);}
.tick-path{stroke-dasharray:44;stroke-dashoffset:44;transition:stroke-dashoffset .5s ease .1s;}

.celebration-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-lighter);margin-bottom:16px;animation:floatUp .7s ease both .1s;}
.celebration-title{font-family:var(--font-head);font-size:56px;line-height:1.02;font-weight:700;margin:0 0 18px;letter-spacing:-.03em;animation:floatUp .7s ease both .2s;color:#fff;}
.celebration-lead{font-size:19px;line-height:1.6;color:#c7ddce;margin:0 auto 30px;max-width:520px;animation:floatUp .7s ease both .3s;}
.celebration-lead b{color:#fff;}
.celebration-chips{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;animation:floatUp .7s ease both .4s;}
.celebration-chip{display:flex;align-items:center;gap:10px;background:#ffffff14;border:1px solid #ffffff30;border-radius:12px;padding:11px 18px;}
.celebration-chip .k{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-lighter);}
.celebration-chip .v{font-family:var(--font-mono);font-weight:700;font-size:16px;color:#fff;letter-spacing:.04em;}
.celebration-chip--pkg{display:none;}
.celebration-chip--pkg.is-visible{display:flex;}
.celebration-chip--pkg .v{font-weight:600;font-size:15px;font-family:var(--font-body);}

.next-steps{padding:64px var(--section-pad-x) 20px;background:#fff;}
.next-step{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:16px;padding:30px 28px;}
.next-step__num{font-family:var(--font-head);font-weight:700;color:var(--green);font-size:26px;margin-bottom:12px;}
.next-step__title{font-family:var(--font-head);font-weight:700;font-size:19px;margin-bottom:6px;}
.next-step__desc{font-size:15px;color:var(--text-softer);line-height:1.55;}

.meanwhile-section{padding:44px var(--section-pad-x) 70px;background:#fff;}
.cta-band--split{padding:44px 44px;}
.cta-band--flush{margin:0;}
.cta-band__copy--sm h2{font-size:28px;}

/* ===================================================================
   15. 404 OLDAL
=================================================================== */
body.error404{background:var(--green-darkest);}
body.error404 .container{background:#fff;}

.error-hero{padding:80px var(--section-pad-x) 90px;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;min-height:520px;}
.error-hero__copy{animation:floatUp .7s ease both;}
.error-hero__eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:18px;}
.error-hero__title{font-family:var(--font-head);font-size:56px;line-height:1.03;font-weight:700;margin:0 0 18px;letter-spacing:-.03em;}
.error-hero__desc{font-size:18px;line-height:1.6;color:var(--text-softer);margin:0 0 30px;max-width:440px;}
.error-search{display:flex;gap:10px;max-width:420px;margin-bottom:26px;}
.error-search input{flex:1;padding:14px 16px;border:1.5px solid var(--border-input);border-radius:11px;font-size:15px;background:#fff;}
.error-search button{background:var(--green);color:#fff;font-weight:700;font-size:15px;padding:0 22px;border:none;border-radius:11px;cursor:pointer;}
.error-search button:hover{background:var(--green-hover);}
.error-actions{display:flex;gap:12px;flex-wrap:wrap;}

.broken-wall-wrap{display:flex;justify-content:center;align-items:flex-end;}
.broken-wall{position:relative;width:340px;height:210px;}
.broken-wall__ground{position:absolute;left:10px;right:10px;bottom:-2px;height:3px;background:linear-gradient(90deg,transparent,#c3cec8 12%,#c3cec8 88%,transparent);border-radius:2px;}
.broken-wall img{position:absolute;filter:drop-shadow(0 8px 12px rgba(15,61,42,.22));}
.bw-1{left:20px;bottom:0;width:140px;}
.bw-2{left:160px;bottom:0;width:140px;}
.bw-3{left:20px;bottom:34px;width:70px;}
.bw-4{left:230px;bottom:34px;width:70px;}
.bw-5{left:20px;bottom:68px;width:140px;}
.bw-6{left:160px;bottom:68px;width:140px;}
.broken-wall__gap{position:absolute;left:90px;bottom:34px;width:140px;height:30px;border:2px dashed #b9c6bf;border-radius:6px;background:repeating-linear-gradient(45deg,#f5f8f6,#f5f8f6 7px,#eef3f0 7px,#eef3f0 14px);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:11px;color:#9aa6a0;letter-spacing:.06em;}
.broken-wall__toppled{position:absolute;right:-6px;bottom:104px;width:120px;transform-origin:bottom center;animation:tiltBlk 3.2s ease-in-out infinite;filter:drop-shadow(0 14px 16px rgba(15,61,42,.3));}
.broken-wall__404{position:absolute;left:0;right:0;top:-6px;text-align:center;font-family:var(--font-head);font-weight:700;font-size:22px;color:#dbe4de;letter-spacing:.3em;}

.quick-links{padding:0 var(--section-pad-x) 80px;}
.quick-links__label{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);margin-bottom:16px;}
.quick-links__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.quick-link{display:block;background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:14px;padding:22px;transition:transform .2s,box-shadow .2s;}
.quick-link:hover{transform:translateY(-4px);box-shadow:0 18px 34px -20px rgba(15,61,42,.35);}
.quick-link .title{font-family:var(--font-head);font-weight:700;font-size:17px;color:var(--text);}
.quick-link .desc{font-size:13.5px;color:var(--text-mute);margin-top:4px;}

/* ===================================================================
   16. KERESÉS OLDAL
=================================================================== */
.search-head{padding:56px var(--section-pad-x) 30px;animation:floatUp .6s ease both;}
.search-head h1{font-size:40px;font-weight:700;margin:0 0 22px;}
.search-form{display:flex;gap:10px;max-width:560px;}
.search-form input{flex:1;padding:14px 16px;border:1.5px solid var(--border-input);border-radius:11px;font-size:15px;background:#fff;}
.search-form button{background:var(--green);color:#fff;font-weight:700;font-size:15px;padding:0 24px;border:none;border-radius:11px;cursor:pointer;}
.search-form button:hover{background:var(--green-hover);}
.search-meta{font-size:14px;color:var(--text-mute);margin-top:16px;}
.search-meta b{color:var(--text);}

.search-results{padding:6px var(--section-pad-x) 40px;}
.search-result-list{display:flex;flex-direction:column;gap:14px;}
.search-result{display:block;background:#fff;border:1px solid var(--border-tint);border-radius:14px;padding:24px 26px;transition:transform .18s,box-shadow .18s,border-color .18s;}
.search-result:hover{transform:translateY(-3px);box-shadow:0 18px 34px -22px rgba(15,61,42,.4);border-color:#cfe3d7;}
.search-result__url{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);letter-spacing:.04em;margin-bottom:6px;}
.search-result__title{font-family:var(--font-head);font-weight:700;font-size:20px;color:var(--text);margin-bottom:6px;letter-spacing:-.01em;}
.search-result__excerpt{font-size:15px;color:var(--text-softer);line-height:1.55;}
.search-result mark{background:#d5f0e0;color:var(--green-darker);padding:0 2px;border-radius:3px;}

.search-empty{padding:40px 0 20px;}
.search-empty__inner{display:flex;gap:20px;align-items:center;background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:16px;padding:30px 32px;flex-wrap:wrap;}
.search-empty__inner img{width:88px;height:auto;filter:drop-shadow(0 8px 10px rgba(15,61,42,.2));}
.search-empty__title{font-family:var(--font-head);font-weight:700;font-size:20px;margin-bottom:6px;}
.search-empty__desc{font-size:15px;color:var(--text-softer);line-height:1.55;max-width:460px;}
.search-empty__actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;}

.popular-searches{padding:0 var(--section-pad-x) 76px;}
.popular-searches__label{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);margin-bottom:14px;}
.chip-list{display:flex;flex-wrap:wrap;gap:10px;}
.chip-link{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:var(--radius-pill);padding:9px 16px;font-size:14px;font-weight:600;color:var(--text-soft);transition:border-color .15s,color .15s;}
.chip-link:hover{border-color:var(--green);color:var(--green);}

/* ===================================================================
   17. IMPRESSZUM / ADATVÉDELEM
=================================================================== */
.legal-header{padding:56px var(--section-pad-x) 26px;animation:floatUp .6s ease both;}
.legal-header h1{font-size:42px;font-weight:700;margin:0 0 10px;}
.legal-header p{font-size:16px;color:var(--text-mute);max-width:660px;line-height:1.55;}

.legal-layout{padding:20px var(--section-pad-x) 30px;display:grid;grid-template-columns:.4fr .6fr;gap:48px;align-items:start;}
.legal-aside{position:sticky;top:96px;display:flex;flex-direction:column;gap:20px;max-height:calc(100vh - 116px);overflow-y:auto;}

.legal-card{background:var(--green-darker);border-radius:var(--radius-lg);padding:30px 28px;color:#fff;}
.legal-card__eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-lighter);margin-bottom:18px;}
.legal-card__rows{display:flex;flex-direction:column;gap:15px;font-size:15px;}
.legal-card__label{color:#8fb7a2;font-size:12.5px;margin-bottom:2px;}
.legal-card__value{font-weight:600;}
.legal-card__value a{color:#fff;}
.legal-card__value a.is-accent{color:var(--accent-lighter);}
.legal-card__divider{height:1px;background:#ffffff18;}

.legal-toc{border:1px solid var(--border-tint);border-radius:14px;padding:20px 22px;}
.legal-toc__label{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:12px;}
.legal-toc__list{display:flex;flex-direction:column;gap:9px;font-size:14.5px;}
.legal-toc__list a{color:var(--text-soft);}

.leg h2{font-family:var(--font-head);font-size:25px;font-weight:700;margin:0 0 14px;letter-spacing:-.01em;scroll-margin-top:96px;}
.leg h3{font-family:var(--font-head);font-size:18px;font-weight:700;margin:22px 0 8px;}
.leg p{font-size:15.5px;line-height:1.7;color:#3f4b45;margin:0 0 13px;}
.leg ul{margin:0 0 14px;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.leg li{display:flex;gap:11px;align-items:flex-start;font-size:15.5px;line-height:1.6;color:#3f4b45;}
.leg li::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--green);flex-shrink:0;margin-top:8px;}
.leg b,.leg strong{color:var(--text);}
.leg h2.wp-block-heading{margin-top:30px;padding-top:30px;border-top:1px solid var(--border-tint-2);}
.leg > h2.wp-block-heading:first-child{margin-top:0;padding-top:0;border-top:none;}
.leg .legal-box{background:var(--bg-tint);border:1px solid var(--border-tint);border-radius:14px;padding:20px 22px;font-size:15px;color:#3f4b45;line-height:1.7;}
.leg .legal-followup{border-top:1px solid var(--border-tint-2);padding-top:20px;margin-top:20px;}
.leg .legal-followup a{font-size:15px;font-weight:600;color:var(--green);}
.leg .legal-updated{color:var(--text-faint);font-size:14px;}

/* nativ core/details a jogi tartalomban (pl. fogalomtar) */
.leg details{border:1px solid var(--border-tint);border-radius:12px;background:var(--bg-tint);margin:10px 0 14px;overflow:hidden;}
.leg details summary{list-style:none;cursor:pointer;padding:16px 20px;font-family:var(--font-head);font-weight:700;font-size:16px;color:var(--text);display:flex;justify-content:space-between;align-items:center;}
.leg details summary::-webkit-details-marker{display:none;}
.leg details summary::after{content:"+";font-size:22px;color:var(--green);line-height:1;}
.leg details[open] summary::after{content:"–";}
.leg details ul{padding:4px 20px 18px;margin:0;}

/* ===================================================================
   18. MOBIL (max-width:860px) — a Kezdőlap mintája, minden oldalra
   kiterjesztve. Lásd WORDPRESS-atultetes.md „Reszponzivitás — mobil spec".
=================================================================== */
@media (max-width: 860px) {

	:root{ --section-pad-x:20px; --section-pad-y:44px; }

	/* --- Navigáció --- */
	.nav-links,
	[data-navcta]{ display:none !important; }
	.burger{ display:flex !important; }
	.mobile-nav{
		position:fixed;top:62px;left:0;right:0;background:#fff;
		border-bottom:1px solid var(--border-tint-2);flex-direction:column;
		padding:12px 20px 18px;z-index:49;box-shadow:0 22px 30px -22px rgba(0,0,0,.3);
	}
	.mobile-nav.open{ display:flex !important; }
	.site-header{ padding:14px 20px; }
	.site-logo img{ height:30px; }

	/* --- Rácsok és szekciók: minden többoszlopos elrendezés 1 oszlop --- */
	.grid-2,.grid-3,.grid-4,.grid-featured,.configurator__grid,.stat-row,
	.quote-section,.content-section--contact,.legal-layout,.hero-split,
	.split-card,.usecase-grid,.collage-grid,.error-hero,.quick-links__grid,
	.tiktok-grid{
		grid-template-columns:1fr !important;
	}
	.split-card__media{ order:-1; min-height:220px; }
	.media-box.h-340,.media-box.h-360,.media-box.h-400,.media-box.h-440{ height:240px; }
	.stat-row__item{ border-right:none; border-bottom:1px solid var(--border-tint-2); }
	.stat-row__item:last-child{ border-bottom:none; }
	.legal-aside,.calc-summary{ position:static; }

	/* --- Hero --- */
	h1{ font-size:38px !important; line-height:1.06 !important; }
	h2{ font-size:28px !important; }
	.hero-media__content{ padding:52px 22px; max-width:100%; }
	.block-cluster{ display:none !important; }
	.hero-split__copy{ padding:44px 22px; }
	.hero-split__media{ min-height:220px; }

	/* --- Bizalmi sáv és CTA sáv (a Kezdőlap mintája) --- */
	.trust-strip{ flex-wrap:wrap; justify-content:flex-start; gap:6px 18px; font-size:13px; padding:14px 20px; }
	.cta-band{ flex-direction:column; align-items:flex-start; gap:20px; margin:0 20px 50px; padding:34px 24px; }
	.cta-band--flush{ margin:0; }

	/* --- Kalkulátor / tervező sor: a blokk-vizuál a szám alá kerül --- */
	.qty-row{ flex-direction:column; align-items:stretch; gap:10px; }
	.qty-row__media{ order:2; align-self:center; }
	.qty-row__label{ order:1; text-align:center; }
	.qty-control{ order:3; justify-content:center; }

	/* --- Lábléc --- */
	.footer-cta{ padding:40px 20px 6px; }
	.footer-links{ padding:28px 20px; }
	.footer-legal{ padding:14px 20px; }

	/* --- Impresszum / GYIK / egyéb kompakt panelek --- */
	.split-card__body,.stat-panel,.price-panel,.quote-form,.legal-card{ padding:28px 22px; }

	/* --- Fal-építő animációk (ajánlatkérés + köszönő oldal): mindig középen, a
	   képernyőhöz igazított méretben — a --wall-scale értéket a main.js számolja
	   ki futásidőben a rendelkezésre álló szélességből, 1-nél sosem nagyobb. --- */
	.wall-anim__blocks{ left:50%; transform-origin:top center; transform:translateX(-50%) scale(var(--wall-scale, 1)); }
	.wall-anim__shadow{ left:50%; transform:translateX(-50%); }
	.celebration-wall{ transform:scale(var(--wall-scale, 1)); transform-origin:top center; }
}

@media (max-width: 480px) {
	h1{ font-size:30px !important; }
	.hero-media__content,.hero-split__copy,.error-hero,.configurator,.quote-section{ padding-left:16px; padding-right:16px; }
	:root{ --section-pad-x:16px; }
}