:root{--paper:#f7f5ee;--white:#fff;--ink:#111815;--muted:#68706b;--brand:#1d5b48;--accent:#d6f7c4;--line:rgba(17,24,21,.13);--radius:26px;--container:1240px;--header:72px;--section:clamp(4.5rem,8vw,7.5rem)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 20px)}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"Helvetica Neue",Arial,sans-serif;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}img{display:block;width:100%;height:auto}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.wrap{width:min(calc(100% - 48px),var(--container));margin:auto}.demo-header{height:var(--header);position:sticky;top:0;z-index:20;background:rgba(247,245,238,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.demo-header .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}.demo-brand{font-weight:950;letter-spacing:-.035em;font-size:1.1rem}.back-link{display:inline-flex;align-items:center;min-height:42px;padding:.55rem 1rem;border:1px solid var(--line);border-radius:999px;font-size:.84rem;font-weight:800}.demo-button{min-height:49px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:var(--brand);color:#fff;padding:.8rem 1.35rem;font-weight:850;transition:transform .2s ease}.demo-button:hover{transform:translateY(-2px)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #68ad86;outline-offset:3px}.demo-hero{padding-block:clamp(2rem,4vw,4rem)}.demo-hero-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}.kicker{margin:0 0 1rem;color:var(--brand);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.16em}.demo-hero h1,.demo-section h2{margin:0 0 1.25rem;font-weight:950;line-height:1.02;letter-spacing:-.05em}.demo-hero h1{font-size:clamp(3.5rem,6vw,6.5rem)}.demo-section h2{font-size:clamp(2.5rem,4.5vw,4.5rem)}.demo-hero p,.section-intro{max-width:600px;color:var(--muted);font-size:1.08rem}.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}.text-button{min-height:49px;display:inline-flex;align-items:center;padding:.75rem 1.15rem;font-weight:850}.hero-media{position:relative;overflow:hidden;border-radius:34px;aspect-ratio:1.14}.hero-media img{height:100%;object-fit:cover}.hero-badge{position:absolute;left:22px;bottom:22px;padding:13px 17px;background:rgba(255,255,255,.94);border-radius:16px;font-size:.8rem;font-weight:850}.demo-section{padding-block:var(--section);scroll-margin-top:calc(var(--header) + 20px)}.white-section{background:#fff}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:3rem}.service-card{padding:30px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius)}.white-section .service-card{background:var(--paper)}.service-card span{display:block;color:var(--brand);font-weight:900;margin-bottom:2.5rem}.service-card h3{font-size:1.35rem;line-height:1.15;margin:0 0 .8rem}.service-card p{margin:0;color:var(--muted)}.split-section{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}.split-image{overflow:hidden;border-radius:var(--radius);aspect-ratio:1.35}.split-image img{height:100%;object-fit:cover}.quote{margin:1.5rem 0 0;font-size:clamp(1.7rem,3vw,2.8rem);font-weight:850;line-height:1.25;letter-spacing:-.035em}.package-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:3rem}.package{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.package.featured{background:var(--brand);color:#fff;transform:translateY(-10px)}.package small{font-weight:900;text-transform:uppercase;letter-spacing:.12em}.package h3{font-size:1.4rem;margin:1rem 0 .4rem}.package strong{display:block;font-size:2rem;line-height:1.1}.package p{color:var(--muted)}.package.featured p{color:rgba(255,255,255,.72)}.calculator{margin-top:3rem;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:12px;align-items:end;padding:24px;background:#e7f1e8;border-radius:var(--radius)}.calculator label{display:block;margin-bottom:6px;font-size:.8rem;font-weight:850}.calculator input,.calculator select{width:100%;height:50px;padding:0 14px;border:1px solid var(--line);border-radius:13px;background:#fff}.calc-result{min-width:170px}.calc-result small{display:block}.calc-result strong{font-size:1.4rem}.gallery{display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:260px 260px;gap:16px;margin-top:3rem}.gallery figure{margin:0;overflow:hidden;border-radius:var(--radius)}.gallery figure:first-child{grid-row:1/3}.gallery img{height:100%;object-fit:cover}.before-after{position:relative;overflow:hidden;margin-top:3rem;border-radius:var(--radius);aspect-ratio:2.3}.before-after img{height:100%;object-fit:cover}.ba-labels{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:flex-start;padding:18px}.ba-labels span{background:rgba(255,255,255,.93);padding:8px 12px;border-radius:99px;font-weight:850;font-size:.76rem}.steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:3rem;padding:0;list-style:none;border-top:1px solid var(--line)}.steps li{padding:26px 24px 0 0}.steps li+li{padding-left:24px;border-left:1px solid var(--line)}.steps span{color:var(--brand);font-weight:900}.steps h3{margin:2rem 0 .6rem}.steps p{color:var(--muted)}.contact-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,7vw,7rem);padding:clamp(2rem,5vw,5rem);background:var(--brand);color:#fff;border-radius:34px}.contact-panel>div>p{color:rgba(255,255,255,.72)}.demo-form{display:grid;gap:14px}.demo-form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.demo-form label{display:block;margin-bottom:6px;font-size:.8rem;font-weight:800}.demo-form input,.demo-form textarea{width:100%;border:1px solid rgba(255,255,255,.25);border-radius:13px;background:rgba(255,255,255,.11);color:#fff;padding:13px 14px}.demo-form input{height:50px}.demo-form textarea{min-height:120px;resize:vertical}.demo-form input::placeholder,.demo-form textarea::placeholder{color:rgba(255,255,255,.52)}.demo-form .demo-button{background:var(--accent);color:var(--ink);justify-self:start}.form-status{margin:0;font-size:.84rem;color:var(--accent)}.demo-footer{padding-block:32px;border-top:1px solid var(--line)}.demo-footer .wrap{display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.85rem}.paint{--brand:#174d3f;--accent:#caff9f}.clean{--paper:#f2f7f4;--brand:#225e4d;--accent:#d7ff9f}.build{--paper:#f3f0e9;--brand:#2b3933;--accent:#e3b85c}.build .demo-button{background:#2b3933}.build .kicker{color:#91651d}.clean .hero-media{border-radius:180px 180px 28px 28px}.paint .hero-media{border-radius:28px 28px 160px 28px}
@media(max-width:900px){.demo-hero-grid,.split-section,.contact-panel{grid-template-columns:1fr}.demo-hero{padding-top:3rem}.hero-media{max-height:560px}.service-grid,.package-grid{grid-template-columns:1fr 1fr}.package.featured{transform:none}.calculator{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}.steps li:nth-child(3){border-left:0}.steps li:nth-child(n+3){border-top:1px solid var(--line)}.gallery{grid-template-rows:220px 220px}}
@media(max-width:560px){:root{--header:66px;--section:4.25rem}.wrap{width:calc(100% - 40px)}.demo-brand{font-size:.96rem}.back-link{font-size:.76rem;padding:.5rem .8rem}.demo-hero h1{font-size:clamp(3rem,14vw,4.15rem)}.hero-actions{flex-direction:column}.hero-actions a{width:100%}.hero-media{aspect-ratio:.94;border-radius:24px!important}.service-grid,.package-grid{grid-template-columns:1fr;gap:12px}.service-card{padding:24px}.service-card span{margin-bottom:1.8rem}.calculator{grid-template-columns:1fr;padding:18px}.gallery{grid-template-columns:1fr;grid-template-rows:260px 200px 200px}.gallery figure:first-child{grid-row:auto}.before-after{aspect-ratio:1.15}.steps{grid-template-columns:1fr}.steps li,.steps li+li,.steps li:nth-child(3){padding:22px 0;border-left:0;border-top:0;border-bottom:1px solid var(--line)}.steps h3{margin:1rem 0 .5rem}.contact-panel{padding:24px;border-radius:26px}.demo-form .two{grid-template-columns:1fr}.demo-form .demo-button{width:100%}.demo-footer .wrap{display:block}.demo-footer p{margin:.3rem 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.demo-button{transition:none}}

/* Compact section rhythm, shared by all three demos. */
:root { --section: clamp(2rem, 3.5vw, 3rem); }
.demo-hero { padding-block: 20px; }
.hero-actions { margin-top: 24px; }
.service-grid, .package-grid, .calculator, .gallery, .before-after, .steps { margin-top: 24px; }
.service-card span { margin-bottom: 18px; }
.steps h3 { margin-top: 20px; }
.steps p:last-child, .section-intro:last-child { margin-bottom: 0; }
.contact-panel { padding: clamp(24px, 3vw, 36px); }
.demo-footer { padding-block: 24px; }
.steps { margin-bottom: 0; }
.package p:last-child, .contact-panel > div > p:last-child { margin-bottom: 0; }
@media (max-width: 900px) {
  .demo-hero-grid, .split-section, .contact-panel { gap: 24px; }
}
@media (max-width: 560px) {
  :root { --section: 20px; }
  .demo-hero { padding-block: 16px; }
  .demo-hero-grid, .split-section, .contact-panel { gap: 16px; }
  .demo-hero h1, .demo-section h2 { margin-bottom: 16px; }
  .hero-actions { margin-top: 16px; gap: 8px; }
  .service-grid, .package-grid, .calculator, .gallery, .before-after, .steps { margin-top: 16px; }
  .service-card, .package { padding: 20px; }
  .service-card span { margin-bottom: 12px; }
  .steps li, .steps li + li { padding-block: 14px; }
  .steps h3 { margin-top: 12px; }
  .quote { margin-top: 16px; }
  .kicker { margin-bottom: 12px; }
}

/* Individual palettes: navy / sand, petrol / ice, graphite / copper. */
.paint {
  --paper: #f5f2eb; --ink: #182638; --muted: #606773;
  --brand: #203b5a; --accent: #ead6ad; --tint: #eae5dc;
  --line: rgba(32, 59, 90, .16);
}
.clean {
  --paper: #f1f7f9; --ink: #122d39; --muted: #546b75;
  --brand: #125b70; --accent: #c9edf4; --tint: #e0eff3;
  --line: rgba(18, 91, 112, .16);
}
.build {
  --paper: #f6f2ed; --ink: #292827; --muted: #69615c;
  --brand: #333231; --accent: #edbd96; --tint: #eee1d6;
  --line: rgba(51, 50, 49, .17);
}
.demo-header { background: var(--paper); }
.build .demo-button { background: var(--brand); }
.build .kicker { color: #92522e; }
.calculator { background: var(--tint); }
.demo-form .demo-button { background: var(--accent); color: var(--ink); }
.demo-section { scroll-margin-top: 0; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible { outline-color: var(--brand); }
.contact-panel :focus-visible { outline-color: var(--accent); }
.demo-form select {
  width: 100%; min-height: 50px; padding: 13px 14px;
  border: 1px solid rgba(255, 255, 255, .25); border-radius: 13px;
  background: var(--brand); color: #fff;
}

/* v9: tighter ending across all demo pages. */
.demo-form .form-status:empty { display: none; }
.demo-section#kontakt { padding-bottom: 20px; }
.demo-footer { padding-block: 16px; }
.demo-footer p { margin-block: 0; }
@media (max-width: 560px) {
  .demo-section#kontakt { padding-bottom: 12px; }
  .demo-footer { padding-block: 12px; }
  .demo-footer p + p { margin-top: 4px; }
}