:root{
  --egg:#F1EAD7; --mah:#523027; --wil:#94C574;
  --white:#fff; --line:#E0D6C2; --muted:#6E5B4E; --ink-soft:#4a3a30;
  --wrap:1120px;
  --disp:"Space Grotesk",system-ui,sans-serif;
  --body:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{overflow-x:clip}
body{background:var(--egg);color:var(--mah);font-family:var(--body);line-height:1.55;-webkit-font-smoothing:antialiased}
/* film grain */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:2000;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--disp);font-weight:700;letter-spacing:-.02em;line-height:1.08}
.mono{font-family:var(--mono);text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--muted)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}

/* nav — floating pill */
.nav{position:sticky;top:12px;z-index:50;display:flex;align-items:center;gap:16px;
  max-width:var(--wrap);margin:12px max(14px,calc((100% - var(--wrap)) / 2)) 0;
  padding:10px 12px 10px 20px;background:rgba(255,251,243,.94);
  border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 32px rgba(55,27,23,.09)}
.logo{font-family:var(--disp);font-weight:700;font-size:1.25rem}
.logo span{color:var(--wil)}
.navlinks{display:flex;gap:20px;margin-left:auto}
.navlinks a{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);transition:color .2s}
.navlinks a:hover{color:var(--mah)}
.nav-tel{display:flex;align-items:center;gap:7px;font-size:.7rem;color:var(--ink-soft);
  border:1px solid var(--line);border-radius:22px;padding:9px 14px;transition:border-color .2s}
.nav-tel:hover{border-color:var(--wil)}
.tel-dot{width:7px;height:7px;border-radius:50%;background:var(--wil)}
.nav-cta{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;
  background:var(--mah);color:var(--egg);padding:11px 18px;border-radius:10px;transition:transform .2s}
.nav-cta:hover{transform:translateY(-1px)}
@media(max-width:960px){.nav-tel{display:none}}
@media(max-width:720px){.navlinks{display:none}.nav-cta{margin-left:auto}}
.cta-mini{display:none}
@media(max-width:460px){.nav{gap:10px;padding:9px 10px 9px 15px;top:8px;margin-top:8px}.logo{font-size:1.05rem}
  .nav-cta{padding:9px 13px;font-size:.66rem;letter-spacing:.05em;white-space:nowrap}
  .cta-full{display:none}.cta-mini{display:inline}}

/* reveal helper (JS toggles .in); per-element offsets via CSS vars */
.reveal{opacity:0;transform:translateY(var(--ry,18px)) rotate(var(--rr,0deg)) scale(var(--rs,1))}
.reveal.in{opacity:1;transform:translateY(0) rotate(0deg) scale(var(--rs,1));
  transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.tilt{--ry:26px;--rr:2deg}
.tilt:nth-child(2){--ry:34px;--rr:-1.5deg}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:translateY(0) rotate(0deg) scale(var(--rs,1));transition:none}}

/* hero */
.hero{padding:56px 0 48px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.kicker{font-family:var(--mono);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);display:flex;align-items:center;gap:8px;margin-bottom:18px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--wil)}
.hero h1{font-size:clamp(2rem,4.6vw,3.2rem);margin-bottom:18px}
/* typed brackets: the void being filled */
.hl-br{color:var(--wil);white-space:nowrap}
.hl-br #typed{color:var(--mah)}
@media(max-width:600px){.hl-br{display:block;white-space:normal}}
.caret{display:inline-block;width:3px;height:.9em;background:var(--wil);margin-left:2px;vertical-align:-.08em;animation:blink 1.1s step-end infinite}
@keyframes blink{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.caret{display:none}}

/* niche pills */
.niche-pills{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.pills-label{margin-right:4px}
.pill{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;
  background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:20px;
  padding:8px 14px;cursor:pointer;transition:all .2s}
.pill:hover{border-color:var(--mah);color:var(--mah)}
.pill.active{background:var(--mah);border-color:var(--mah);color:var(--egg)}
.pill-other{border-style:dashed;color:var(--muted)}
.pill-other:hover{border-color:var(--wil);color:var(--mah)}
.hero-sub{font-size:clamp(1rem,2vw,1.15rem);max-width:52ch;color:var(--ink-soft);margin-bottom:28px}
.hero-sub b{color:var(--mah)}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;padding:15px 26px;border-radius:9px;font-family:var(--body);font-weight:600;font-size:1rem;transition:transform .18s,box-shadow .18s}
.btn-dark{background:var(--mah);color:var(--egg)}
.btn-dark:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(55,27,23,.28)}
.btn-ghost{border:1.5px solid var(--mah)}
.btn-ghost:hover{background:var(--mah);color:var(--egg)}
.btn-green{background:var(--wil);color:var(--mah)}
.btn-green:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(148,197,116,.4)}

/* hero visual: browser mockup + floating cards */
.hero-visual{position:relative;padding:12px 8px 26px 0}
.browser{display:block;background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:0 18px 44px rgba(55,27,23,.14);position:relative}
.browser-open{position:absolute;right:10px;bottom:10px;background:var(--mah);color:var(--egg);
  padding:7px 12px;border-radius:20px;font-size:.62rem;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s}
.browser-hero:hover .browser-open{opacity:1;transform:none}
@media(hover:none){.browser-open{opacity:1;transform:none}}
.browser-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;color:rgba(255,255,255,.85)}
.browser-bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.4)}
.browser-view{position:relative;overflow:hidden;height:420px}
.browser-view img{width:100%;height:auto}
.browser-hero{transform:rotate(1.6deg)}
.browser-hero .browser-view{height:460px}
/* slow in-frame scroll = "live site" */
.browser-view img{animation:siteScroll 22s ease-in-out infinite alternate}
.browser-hero .browser-view img{animation-duration:30s}
@keyframes siteScroll{from{transform:translateY(0)}to{transform:translateY(calc(-100% + 420px))}}
.browser-hero .browser-view img{animation-name:siteScrollHero}
@keyframes siteScrollHero{from{transform:translateY(0)}to{transform:translateY(calc(-100% + 460px))}}
@media(prefers-reduced-motion:reduce){.browser-view img{animation:none}}
.float-card{position:absolute;display:flex;align-items:center;gap:10px;background:var(--white);
  border:1px solid var(--line);border-radius:12px;padding:12px 16px;box-shadow:0 10px 28px rgba(55,27,23,.16);
  animation:floaty 6s ease-in-out infinite alternate}
.float-card b{font-family:var(--disp);font-size:.92rem;display:block;line-height:1.2}
.float-card small{font-size:.78rem;color:var(--muted)}
.fc-1{left:-26px;bottom:44px}
.fc-2{right:-14px;top:52px;animation-delay:1.6s}
.fc-dot{width:10px;height:10px;border-radius:50%;background:var(--wil);box-shadow:0 0 0 4px rgba(148,197,116,.25);flex:none}
.fc-stars{color:#E8A33D;font-size:.85rem;letter-spacing:.08em;flex:none}
@keyframes floaty{from{transform:translateY(0)}to{transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.float-card{animation:none}}
@media(max-width:880px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-visual{max-width:440px;padding:0 0 20px}
  .fc-1{left:-8px}
  .fc-2{right:-6px}
}

/* stats */
.stats{padding:8px 0 40px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.stat{border-top:2px solid var(--wil);padding-top:12px}
.stat b{font-family:var(--disp);font-size:clamp(1.8rem,4vw,2.6rem);display:block;line-height:1}
.stat b small{font-size:.5em;color:var(--wil)}
.stat span{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
@media(max-width:640px){.stats-grid{grid-template-columns:1fr 1fr}}

/* marquee (pure CSS, seamless) */
.marquee{overflow:hidden;background:var(--mah);color:var(--egg);padding:14px 0;white-space:nowrap}
.marquee-track{display:inline-flex;width:max-content;will-change:transform;animation:scroll 30s linear infinite;font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;font-size:.82rem}
.marquee-track span{flex:none}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* pain segmentation */
.pains{padding:56px 0 8px}
.void-line{margin-bottom:38px}
.void-line h2{font-size:clamp(1.35rem,3.2vw,2rem);max-width:30ch}
.voidbr{color:var(--wil);white-space:nowrap}
.void-line p{color:var(--ink-soft);margin-top:8px}
.pain{border-left:3px solid var(--wil);padding:6px 0 6px 20px}
.pain h3{font-size:1.25rem;margin-bottom:8px}
.pain p{color:var(--ink-soft);font-size:.95rem;margin-bottom:12px}
.pain a{font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;font-weight:600;color:var(--mah);border-bottom:2px solid var(--wil);padding-bottom:2px;transition:color .2s}
.pain a:hover{color:var(--wil)}

/* generic section */
.sec{padding:72px 0}
.sec-dark{background:var(--mah);color:var(--egg)}
.sec-num{margin-bottom:12px}
.sec-num::before{content:"[ ";color:var(--wil);font-weight:600}
.sec-num::after{content:" ]";color:var(--wil);font-weight:600}
.sec-dark .sec-num{color:rgba(241,234,215,.75)}
.sec-title{font-size:clamp(1.6rem,4vw,2.6rem);margin-bottom:12px}
.sec-lead{max-width:52ch;color:var(--ink-soft)}
.sec-dark .sec-lead{color:rgba(241,234,215,.75)}
.sec-head{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:end;margin-bottom:40px}
.sec-head .sec-title{margin-bottom:0}
.sec-head .sec-lead{margin-bottom:6px;justify-self:end;text-align:left}
@media(max-width:760px){.sec-head{grid-template-columns:1fr;gap:12px;align-items:start}.sec-head .sec-lead{justify-self:start}}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media(max-width:900px){.grid-3{grid-template-columns:1fr 1fr}.grid-4{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.grid-3,.grid-4{grid-template-columns:1fr}}

/* sluzby: 2 featured + 4 rows */
.sluzby-grid{display:grid;grid-template-columns:1fr 1fr 1.1fr;gap:22px;align-items:stretch}
.feat{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:24px}
.feat h3{font-size:1.3rem;margin-bottom:10px}
.feat p{color:var(--ink-soft);font-size:.95rem}
.feat-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.feat-chips .mono{border:1px solid var(--line);border-radius:20px;padding:4px 12px;font-size:.62rem}
.feat-rows{display:flex;flex-direction:column;justify-content:space-between}
.feat-row{padding:14px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:3px}
.feat-row:first-child{border-top:none;padding-top:2px}
.feat-row b{font-family:var(--disp);font-size:1.02rem}
.feat-row span{color:var(--ink-soft);font-size:.88rem}
@media(max-width:900px){.sluzby-grid{grid-template-columns:1fr 1fr}.feat-rows{grid-column:1/-1}}
@media(max-width:560px){.sluzby-grid{grid-template-columns:1fr}}

/* postup */
.step{padding-top:16px;border-top:2px solid var(--wil);position:relative}
.step-top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.step-n{font-family:var(--mono);font-size:1.4rem;color:var(--wil)}
.step-free{background:var(--wil);color:var(--mah);padding:3px 10px;border-radius:20px;font-size:.6rem;font-weight:600}
.step h3{font-size:1.15rem;margin-bottom:8px}
.step p{color:rgba(241,234,215,.8);font-size:.95rem}
@media(min-width:901px){
  .steps .step:not(:last-child)::after{content:"→";position:absolute;right:-19px;top:14px;color:var(--wil);opacity:.6;font-size:1.1rem}
}

/* ukážky */
.shots-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:980px){.shots-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.shots-grid{grid-template-columns:1fr}}
.shot{margin:0;display:block}
.shot figure{margin:0}
.shot .browser{transition:transform .25s,box-shadow .25s;box-shadow:0 8px 22px rgba(55,27,23,.1)}
.shot:hover .browser{transform:translateY(-5px);box-shadow:0 16px 36px rgba(55,27,23,.18)}
.shot .browser-view{height:300px}
.shot .browser-view img{animation-name:shotScroll}
@keyframes shotScroll{from{transform:translateY(0)}to{transform:translateY(calc(-100% + 300px))}}
.shot:nth-child(1) .browser-view img{animation-delay:0s}
.shot:nth-child(2) .browser-view img{animation-delay:-5s}
.shot:nth-child(3) .browser-view img{animation-delay:-10s}
.shot:nth-child(4) .browser-view img{animation-delay:-15s}
.shot:nth-child(5) .browser-view img{animation-delay:-20s}
/* void tile — the empty spot that could be yours */
.browser-void{border:1.5px dashed #C9B99F;background:transparent;box-shadow:none}
.shot-void:hover .browser-void{border-color:var(--wil)}
.browser-void .browser-bar{background:transparent;border-bottom:1px dashed #C9B99F}
.browser-void .browser-bar i{background:#C9B99F}
.void-view{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px}
.void-big{font-family:var(--disp);font-weight:700;font-size:1.5rem;color:var(--wil)}
.void-view>span:not(.shot-go){font-size:.9rem;color:var(--muted);max-width:24ch}
.void-view .shot-go{margin-top:4px}
/* hover reveal: demo identity over the screenshot */
.shot-over{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  color:#fff;opacity:0;transition:opacity .25s;text-align:center;padding:16px}
.shot:hover .shot-over,.shot:focus-visible .shot-over{opacity:1}
.shot-over b{font-family:var(--disp);font-size:1.9rem;letter-spacing:.02em}
.shot-over b::before{content:"[ ";color:var(--wil)}
.shot-over b::after{content:" ]";color:var(--wil)}
.shot-over .mono{color:rgba(255,255,255,.75);font-size:.64rem}
.shot-go{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;
  background:var(--wil);color:var(--mah);font-weight:600;padding:9px 16px;border-radius:22px;margin-top:6px}
@media(hover:none){.shot-over{display:none}}
.shots-note{margin-top:18px;font-size:.62rem;letter-spacing:.1em;color:var(--muted);opacity:.85}
.shot figcaption{padding:12px 4px 0;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.shot figcaption b{font-family:var(--disp);font-size:1rem}
.shot-link{color:var(--mah);border-bottom:2px solid var(--wil);padding-bottom:1px;font-weight:600;margin-left:auto}
@media(hover:hover){.shot-link{display:none}.shot figcaption .mono:not(.shot-link){margin-left:auto}}

/* unsure plaque */
.unsure{padding:0 0 8px}
.unsure-in{background:var(--white);border:1px solid var(--line);border-radius:16px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 30px;flex-wrap:wrap}
.unsure-in h3{font-size:1.25rem;margin-bottom:4px}
.unsure-in p{color:var(--ink-soft);font-size:.95rem}
@media(max-width:640px){.unsure-in{flex-direction:column;align-items:flex-start}}

/* cenník */
.sec-alt{background:#EAE0C9}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.tier{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:26px 22px;position:relative;display:flex;flex-direction:column;gap:12px}
.tier-hot{background:var(--mah);color:var(--egg);border-color:var(--mah);--rs:1.04;transform:scale(var(--rs))}
/* bracket corners on the highlighted tier */
.tier-hot::before,.tier-hot::after{content:"";position:absolute;width:22px;height:22px;border:2px solid var(--wil)}
.tier-hot::before{top:10px;left:10px;border-right:none;border-bottom:none;border-radius:6px 0 0 0}
.tier-hot::after{bottom:10px;right:10px;border-left:none;border-top:none;border-radius:0 0 6px 0}
.tier-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--wil);color:var(--mah);padding:5px 12px;border-radius:20px;font-size:.62rem;font-weight:600;white-space:nowrap}
.tier-name{letter-spacing:.14em}
.tier-hot .tier-name{color:var(--wil)}
.tier-for{font-size:.85rem;color:var(--muted);margin-top:-8px}
.tier-hot .tier-for{color:rgba(241,234,215,.65)}
.tier-price{font-family:var(--disp);font-weight:700;font-size:2.2rem;line-height:1}
.tier-price span{display:block;font-family:var(--mono);font-size:.8rem;font-weight:500;color:var(--muted);margin-top:6px}
.tier-hot .tier-price span{color:rgba(241,234,215,.7)}
.tier ul{list-style:none;display:flex;flex-direction:column;gap:9px;font-size:.92rem}
.tier li{padding-left:22px;position:relative}
.tier li::before{content:"✦";position:absolute;left:0;color:var(--wil);font-size:.8rem}
/* Štart — «šablóna»: лёгкий, пунктирный, воздушный */
.tier-start{background:#FFFDF6;border:1.5px dashed #C9B99F;box-shadow:none}
.tier-start .tier-name{color:var(--muted)}
.tier-start li::before{color:#C9B99F}
.tier-start:hover{border-color:var(--wil)}
/* Prémium — «na mieru»: плотная рама, ателье */
.tier-prem{background:linear-gradient(180deg,var(--white),#F8F1E1);border:2px solid var(--mah)}
.tier-prem::before,.tier-prem::after{content:"";position:absolute;width:22px;height:22px;border:2px solid var(--wil)}
.tier-prem::before{top:10px;right:10px;border-left:none;border-bottom:none;border-radius:0 6px 0 0}
.tier-prem::after{bottom:10px;left:10px;border-right:none;border-top:none;border-radius:0 0 0 6px}
.tier-prem .tier-name{color:var(--mah);font-weight:600}
.tier-prem .tier-price{font-size:2.4rem}
.tier-prem .tier-price::after{content:"";display:block;width:44px;height:1px;background:var(--mah);margin-top:12px;box-shadow:0 3px 0 var(--wil)}
.tier-prem .btn-ghost{border-width:2px}
.tier-plus{font-size:.62rem;color:var(--wil);margin-bottom:-4px}
.tier-cta{text-align:center;margin-top:auto}
.tier-hot .btn-ghost{border-color:var(--egg);color:var(--egg)}
.tiers-common{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin-top:30px}
.tiers-common .tc-label{color:var(--muted)}
.tiers-common span:not(.tc-label){background:var(--white);border:1px solid var(--line);border-radius:20px;padding:7px 15px;font-size:.85rem}
.tiers-pay{text-align:center;margin-top:34px;font-family:var(--disp);font-weight:700;font-size:clamp(1.15rem,2.6vw,1.5rem)}
.tiers-pay::before,.tiers-pay::after{color:var(--wil);font-weight:700}
.tiers-pay::before{content:"[ "}
.tiers-pay::after{content:" ]"}
.tiers-note{text-align:center;margin-top:10px;letter-spacing:.08em}
@media(max-width:860px){.tiers{grid-template-columns:1fr;max-width:420px;margin:0 auto}.tier-hot{--rs:1;transform:scale(1);order:-1}}

/* faq */
.faq-grid{display:grid;grid-template-columns:1.4fr .7fr;gap:44px;align-items:start}
@media(max-width:820px){.faq-grid{grid-template-columns:1fr}}
.faq-side{background:var(--mah);color:var(--egg);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:12px;position:sticky;top:90px}
.faq-side .mono{color:var(--wil)}
.faq-side h3{font-size:1.3rem}
.faq-side-p{font-size:.92rem;color:rgba(241,234,215,.78)}
.faq-side .btn{text-align:center;margin-top:6px}
.faq-side-tel{font-family:var(--mono);font-size:.74rem;color:rgba(241,234,215,.65);text-align:center}
.faq-side-tel:hover{color:var(--wil)}
.faq details{border-top:1px solid var(--line);padding:16px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{font-family:var(--disp);font-weight:700;font-size:1.1rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--wil);font-size:1.4rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--ink-soft);padding-top:12px;max-width:64ch}

/* kontakt */
.kontakt{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}
.kontakt-left .sec-lead{margin-bottom:0}
.k-steps{list-style:none;margin-top:30px;display:flex;flex-direction:column}
.k-steps li{display:flex;gap:16px;align-items:flex-start;padding:14px 0;border-top:1px solid rgba(241,234,215,.14)}
.k-steps li:last-child{border-bottom:1px solid rgba(241,234,215,.14)}
.k-steps .mono{color:var(--wil);font-size:.95rem;padding-top:2px}
.k-steps b{font-family:var(--disp);font-size:1.02rem;display:block}
.k-steps small{color:rgba(241,234,215,.65);font-size:.85rem}
.kontakt-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.kchip{border:1px solid rgba(241,234,215,.28);border-radius:24px;padding:9px 16px;font-size:.9rem;transition:border-color .2s,color .2s}
.kchip:hover{border-color:var(--wil);color:var(--wil)}
.kchip-loc{color:rgba(241,234,215,.6);border-style:dashed}
.kontakt-form{background:var(--white);color:var(--mah);border-radius:18px;padding:30px 28px;display:flex;flex-direction:column;gap:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.28)}
.form-kicker{color:var(--wil);font-weight:600}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.kontakt-form label{display:flex;flex-direction:column;gap:7px;font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.kontakt-form input,.kontakt-form select,.kontakt-form textarea{
  font-family:var(--body);font-size:16px;color:var(--mah);background:transparent;
  border:none;border-bottom:1.5px solid var(--line);border-radius:0;padding:8px 2px;width:100%;transition:border-color .2s}
.kontakt-form select{cursor:pointer}
.kontakt-form ::placeholder{color:#B9AA96;opacity:1}
.kontakt-form input:focus,.kontakt-form select:focus,.kontakt-form textarea:focus{outline:none;border-bottom-color:var(--wil);box-shadow:0 1.5px 0 var(--wil)}
.kontakt-form textarea{resize:vertical;min-height:84px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.form-foot .btn{flex:none}
.status{min-height:1.1rem;font-size:.9rem;font-family:var(--mono)}
.status.ok{color:#2f7d32}.status.err{color:#b3261e}
.form-note{font-size:.8rem;color:var(--muted)}
@media(max-width:820px){.kontakt{grid-template-columns:1fr}.row2{grid-template-columns:1fr}}

/* footer */
.foot{background:var(--mah);color:var(--egg);padding:48px 20px 30px;overflow:hidden}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:24px;max-width:var(--wrap);margin:0 auto}
.foot-brand{font-family:var(--disp);font-weight:700;font-size:1.4rem}
.foot-brand span{color:var(--wil)}
.foot-col{display:flex;flex-direction:column;gap:6px;font-size:.9rem}
.foot-col .mono{color:var(--wil);margin-bottom:4px}
.foot-col a:hover{color:var(--wil)}
.foot-water{font-family:var(--disp);font-weight:700;font-size:clamp(3.2rem,13vw,10.5rem);line-height:1;
  text-align:center;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1.5px rgba(241,234,215,.13);
  user-select:none;margin:44px 0 18px;white-space:nowrap}
@supports not (-webkit-text-stroke:1px black){.foot-water{color:rgba(241,234,215,.07)}}
.foot-copy{max-width:var(--wrap);margin:0 auto;font-size:.8rem;opacity:.6;text-align:center}
@media(max-width:720px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
