
:root{
  --bg:#0b0d12;
  --bg-soft:#131722;
  --panel:rgba(18,24,35,.72);
  --text:#edf2ff;
  --muted:#b4bfd6;
  --line:rgba(255,255,255,.10);
  --accent:#4fd1ff;
  --accent-2:#8f7dff;
  --glow:0 20px 60px rgba(79,209,255,.16);
  --radius:24px;
  --shadow:0 22px 70px rgba(0,0,0,.38);
  --max:1180px;
}
*,
*::before,
*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:radial-gradient(circle at top, #151b29 0%, var(--bg) 46%, #090b10 100%);
  color:var(--text);
  line-height:1.65;
  min-height:100vh;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--text);text-decoration:none}
p,ul,ol{margin:0 0 1rem}
h1,h2,h3{line-height:1.12;margin:0 0 1rem;text-wrap:balance}
h1{font-size:clamp(2.5rem,6vw,5.2rem);letter-spacing:-.04em}
h2{font-size:clamp(1.6rem,3vw,2.6rem);letter-spacing:-.03em}
h3{font-size:1.15rem}
.container{width:min(calc(100% - 2rem),var(--max));margin-inline:auto}
.narrow{width:min(calc(100% - 2rem), 880px);margin-inline:auto}
.section{padding:4.5rem 0}
.section--soft{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01))}
.site-header{
  position:sticky;top:0;z-index:40;
  backdrop-filter:blur(18px);
  background:rgba(8,10,15,.62);
  border-bottom:1px solid var(--line);
}
.header-row{display:flex;align-items:center;gap:1rem;min-height:92px;padding:.6rem 0}
.brand{display:flex;align-items:center;gap:.8rem;font-weight:700;letter-spacing:.02em;flex:0 0 auto;padding:.35rem 0}
.brand img{width:min(195px,31.5vw);height:auto;display:block;filter:brightness(0) invert(1);opacity:.96}
.site-nav{margin-left:auto}
.site-nav ul{display:flex;gap:1.1rem;list-style:none;margin:0;padding:0}
.site-nav a{color:var(--muted);font-weight:600}
.site-nav a[aria-current="page"], .site-nav a:hover{color:var(--text)}
.menu-toggle{display:none;flex-direction:column;gap:4px;background:none;border:0;padding:0;margin-left:auto}
.menu-toggle span{display:block;width:26px;height:2px;background:var(--text)}
.header-cta{margin-left:1rem}
.mobile-quick-actions{display:none;align-items:center;gap:.5rem;margin-left:auto}
.mobile-quick-action{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);text-decoration:none;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.mobile-quick-action:hover,.mobile-quick-action:focus-visible{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.18);transform:translateY(-1px);outline:none}
.mobile-quick-action--wa{background:rgba(37,211,102,.12);border-color:rgba(37,211,102,.24)}
.mobile-quick-action--wa:hover,.mobile-quick-action--wa:focus-visible{background:rgba(37,211,102,.18);border-color:rgba(37,211,102,.34)}
.mobile-quick-action__icon{width:18px;height:18px;display:block;fill:currentColor}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.4rem}
.trust-card,.process-step,.branch-link-card{padding:1.2rem 1.1rem;border-radius:22px;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}
.trust-card strong,.process-step strong,.branch-link-card strong,.trust-card h3,.process-step h3,.branch-link-card h3{display:block;margin-bottom:.45rem;font-size:1rem}
.trust-card span,.process-step span,.branch-link-card span{display:block;color:var(--muted)}
.process-section{display:grid;gap:1.3rem}
.process-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.branch-links-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.2rem}
.branch-link-card:hover{transform:translateY(-3px);border-color:rgba(79,209,255,.38);background:rgba(22,29,41,.84)}
.section--bottom-showcase{padding-bottom:5.5rem}
.hero{position:relative;overflow:hidden;padding:7rem 0 5rem}
.hero__inner{position:relative;z-index:2}
.hero__kicker{display:inline-flex;padding:.45rem .8rem;border-radius:999px;border:1px solid rgba(79,209,255,.3);background:rgba(79,209,255,.08);color:#bff0ff;font-weight:700;font-size:.92rem;margin-bottom:1.2rem}
.hero__lead{max-width:820px;color:var(--muted);font-size:clamp(1.05rem,2vw,1.25rem)}
.hero__actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.8rem}
.hero__motion{position:absolute;inset:0;pointer-events:none}
.orb{position:absolute;display:block;border-radius:50%;filter:blur(10px);opacity:.9;animation:float 10s ease-in-out infinite}
.orb--a{width:340px;height:340px;top:8%;right:14%;background:radial-gradient(circle, rgba(79,209,255,.25), rgba(79,209,255,0))}
.orb--b{width:260px;height:260px;top:22%;left:-2%;background:radial-gradient(circle, rgba(143,125,255,.24), rgba(143,125,255,0));animation-delay:-3s}
.orb--c{width:220px;height:220px;bottom:8%;right:28%;background:radial-gradient(circle, rgba(111,255,211,.18), rgba(111,255,211,0));animation-delay:-6s}

.bg-canvas-wrap{position:fixed;inset:0;pointer-events:none;overflow:hidden}
.bg-canvas{width:100%;height:100%;display:block;opacity:.72}
.hero::before{
  content:"";position:absolute;inset:-10% -5% auto auto;width:52vw;height:52vw;max-width:900px;max-height:900px;
  background:radial-gradient(circle, rgba(79,209,255,.10), rgba(79,209,255,0) 62%);
  transform:translate3d(0,0,0);animation:pulseGlow 9s ease-in-out infinite;
  pointer-events:none;z-index:0;
}
.bg-grid{animation:gridShift 18s linear infinite}
.bg-glow--one{animation:glowDriftOne 16s ease-in-out infinite}
.bg-glow--two{animation:glowDriftTwo 20s ease-in-out infinite}
.bg-grid{
  position:fixed;inset:0;pointer-events:none;opacity:.23;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(circle at center, black 34%, transparent 82%);
}
.bg-glow{position:fixed;pointer-events:none;border-radius:50%;filter:blur(100px);opacity:.22}
.bg-glow--one{width:320px;height:320px;top:100px;left:-80px;background:#4fd1ff}
.bg-glow--two{width:420px;height:420px;right:-120px;bottom:80px;background:#8f7dff}
.button{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.8rem 1.2rem;border-radius:14px;
  border:1px solid transparent;background:linear-gradient(135deg,var(--accent),#87e0ff);color:#06111a;font-weight:800;box-shadow:var(--glow)
}
.button:hover{transform:translateY(-1px)}
.button--ghost{background:rgba(255,255,255,.03);color:var(--text);border-color:var(--line);box-shadow:none}
.button--small{min-height:42px;padding:.65rem 1rem}
.grid-two{display:grid;grid-template-columns:1.2fr .8fr;gap:1.6rem;align-items:start}
.panel,.card,.legal-card,.cta-box{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
}
.panel,.legal-card{padding:1.5rem}
.panel--accent{background:linear-gradient(180deg, rgba(79,209,255,.08), rgba(255,255,255,.03))}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:1.5rem}
.card{padding:1.4rem;transition:transform .25s ease,border-color .25s ease,background .25s ease}
.card:hover{transform:translateY(-4px);border-color:rgba(79,209,255,.4);background:rgba(22,29,41,.84)}
.check-list,.footer-list{list-style:none;padding:0;margin:0}
.check-list li,.footer-list li{position:relative;padding-left:1.4rem;margin:.8rem 0;color:var(--muted)}
.check-list li::before,.footer-list li::before{content:"";position:absolute;left:0;top:.62rem;width:.48rem;height:.48rem;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.faq-list{display:grid;gap:1rem}
.faq-item{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:0 1rem;overflow:hidden}
.faq-item summary{cursor:pointer;list-style:none;padding:1.1rem 0;font-weight:700}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item div{padding:0 0 1.1rem;color:var(--muted)}
.cta-box{display:flex;justify-content:space-between;gap:1.5rem;padding:1.6rem;align-items:center}
.cta-box__actions{display:flex;gap:1rem;flex-wrap:wrap}
.site-footer{padding:2rem 0 1rem;border-top:1px solid var(--line);background:rgba(0,0,0,.16)}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:1.5rem}
.footer-grid h2{font-size:1.05rem}
.footer-grid p,.footer-grid a,.footer-meta a{color:var(--muted)}
.footer-meta{display:flex;justify-content:space-between;align-items:center;padding-top:1.4rem;margin-top:1rem;border-top:1px solid var(--line);gap:1rem;flex-wrap:wrap}
.footer-meta nav{display:flex;gap:1rem;flex-wrap:wrap}
.breadcrumbs{margin-bottom:1rem}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:.55rem;list-style:none;padding:0;margin:0}
.breadcrumbs li{display:inline-flex;align-items:center;gap:.55rem;color:var(--muted);font-size:.95rem}
.breadcrumbs li:not(:last-child)::after{content:"/";opacity:.55}
.breadcrumbs a{color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes gridShift{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-14px,10px,0)}
  100%{transform:translate3d(0,0,0)}
}
@keyframes glowDriftOne{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(40px,-20px,0) scale(1.08)}
}
@keyframes glowDriftTwo{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-35px,25px,0) scale(1.1)}
}
@keyframes pulseGlow{
  0%,100%{opacity:.55;transform:translate3d(0,0,0) scale(1)}
  50%{opacity:.9;transform:translate3d(-2%,2%,0) scale(1.06)}
}
@keyframes float{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(0,-16px,0) scale(1.04)}
}

@media (max-width: 768px){
  .hero::before,
  .orb,
  .bg-glow,
  .bg-grid{display:none!important}
  .bg-canvas{opacity:.9}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
@media (max-width: 980px){
  .grid-two,.footer-grid,.card-grid,.cta-box,.trust-grid,.process-steps,.branch-links-grid{grid-template-columns:1fr;display:grid}
  .site-nav{position:absolute;top:84px;left:0;right:0;background:rgba(8,10,15,.96);padding:0 1rem 1rem;border-bottom:1px solid var(--line);display:none}
  .site-nav.is-open{display:block}
  .site-nav ul{flex-direction:column;padding-top:.6rem}
  .menu-toggle{display:flex;order:4;margin-left:.25rem}
  .header-cta{display:none}
  .mobile-quick-actions{display:flex}
  .brand img{width:min(170px,42vw)}
}


.seo-tool-layout{align-items:stretch}
.seo-tool-card{height:100%}
.seo-form{display:grid;gap:1rem;margin-top:1rem}
.seo-label{font-weight:700}
.seo-form__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.9rem}
.seo-input{width:100%;min-height:54px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);padding:0 1rem;font:inherit}
.seo-input::placeholder{color:rgba(237,242,255,.52)}
.seo-input:focus{outline:2px solid rgba(79,209,255,.45);outline-offset:2px}
.seo-note{color:var(--muted);font-size:.96rem}
.seo-result{display:grid;gap:1.25rem}
.seo-empty,.seo-summary,.seo-check-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.seo-empty,.seo-summary{padding:1.6rem}
.seo-summary__top{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;flex-wrap:wrap}
.seo-badge{display:inline-flex;align-items:center;justify-content:center;min-width:96px;padding:.7rem 1rem;border-radius:999px;border:1px solid rgba(79,209,255,.28);background:rgba(79,209,255,.08);font-weight:800;color:#bff0ff}
.seo-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.4rem}
.seo-metric{padding:1rem 1.1rem;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.seo-metric strong{display:block;font-size:1.35rem;line-height:1.1;margin-bottom:.35rem}
.seo-metric span{display:block;color:var(--muted);font-size:.94rem}
.seo-check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.seo-check-card{padding:1.2rem}
.seo-check-card__top{display:flex;justify-content:space-between;gap:.8rem;align-items:flex-start}
.seo-status{display:inline-flex;align-items:center;gap:.45rem;font-weight:700}
.seo-status::before{content:"";width:.72rem;height:.72rem;border-radius:50%;display:inline-block;background:#ff7f7f}
.seo-status.is-ok::before{background:#7fffcb}
.seo-check-card p{color:var(--muted);margin:.65rem 0 0}
.seo-loading{padding:1.6rem;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel)}
.seo-error{padding:1rem 1.2rem;border-radius:18px;border:1px solid rgba(255,127,127,.28);background:rgba(255,80,80,.08);color:#ffd9d9}
@media (max-width: 980px){.seo-metrics,.seo-check-grid,.seo-form__row{grid-template-columns:1fr}}

.seo-cta{margin-top:1.2rem;padding:1.35rem}
.seo-cta p{margin:.65rem 0 1rem;color:var(--muted)}


.seo-check-page .hero{padding-bottom:7rem}
.seo-check-page .hero__actions{margin-top:3.25rem}
.seo-check-page main > .section:first-of-type{position:relative;z-index:3;margin-top:-3.4rem;padding-top:0}
.seo-check-page .seo-tool-layout{align-items:start}
@media (max-width: 980px){
  .seo-check-page .hero{padding-bottom:5.5rem}
  .seo-check-page .hero__actions{margin-top:2.4rem}
  .seo-check-page main > .section:first-of-type{margin-top:-2rem}
}

.seo-bottom-actions{margin-top:2rem}

.section-intro{max-width:900px;color:var(--muted);margin-bottom:1.2rem}
.card-grid--three{grid-template-columns:repeat(3,1fr)}
.demo-card{position:relative;overflow:hidden}
.demo-card::after{content:"";position:absolute;inset:auto -10% -35% auto;width:180px;height:180px;border-radius:50%;filter:blur(10px);opacity:.18;pointer-events:none}
.demo-card--ferienhaus::after{background:#ffb86f}
.demo-card--handwerker::after{background:#ffd34d}
.demo-card--dienstleister::after{background:#65d6ff}
.demo-page .hero{padding-bottom:4.5rem}
.demo-page .hero__kicker{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff}
.demo-split{align-items:stretch}
.demo-showcase,.demo-booking-box{height:100%}
.demo-label{display:inline-flex;padding:.45rem .8rem;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);font-weight:700;margin-bottom:.9rem}
.demo-pills{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1.2rem}
.demo-pills span{display:inline-flex;padding:.55rem .8rem;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid var(--line);color:var(--text);font-weight:700;font-size:.92rem}
.demo-page .card{min-height:100%}
.demo-page{position:relative;overflow-x:hidden}
.demo-page main,.demo-page .site-header,.demo-page .site-footer{position:relative;z-index:1}
@media (max-width: 768px){
  .demo-handwerker::before,.demo-dienstleister::before,.demo-ferienhaus::before{opacity:.18}
  .demo-handwerker .hero::after,.demo-dienstleister .hero::after,.demo-ferienhaus .hero::after{opacity:.18}
}
.demo-ferienhaus{
  --accent:#ffb86f;
  --accent-2:#ffdca8;
  --panel:rgba(44,28,16,.76);
  --bg:#120d08;
  --bg-soft:#20150d;
  --line:rgba(255,240,224,.14);
  --muted:#ead8c9;
  background:
    radial-gradient(circle at 78% 12%, rgba(255,214,145,.22) 0 6%, rgba(255,214,145,0) 7%),
    linear-gradient(180deg, rgba(255,198,124,.08), rgba(255,198,124,0) 28%),
    linear-gradient(180deg, #6d4f37 0%, #2d2117 28%, #16100b 58%, #0c0907 100%);
}
.demo-ferienhaus::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;background:
    radial-gradient(circle at 20% 85%, rgba(36,70,35,.45) 0 12%, rgba(36,70,35,0) 13%),
    radial-gradient(circle at 42% 88%, rgba(57,95,50,.38) 0 15%, rgba(57,95,50,0) 16%),
    radial-gradient(circle at 72% 86%, rgba(47,78,42,.42) 0 14%, rgba(47,78,42,0) 15%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,0));}
.demo-ferienhaus .hero::after{content:"";position:absolute;inset:auto 0 0 0;height:150px;background:linear-gradient(180deg, rgba(26,18,12,0), rgba(16,11,8,.9));pointer-events:none}
.demo-ferienhaus .panel--accent{background:linear-gradient(180deg, rgba(255,184,111,.16), rgba(255,255,255,.04))}
.demo-ferienhaus .hero::before{background:radial-gradient(circle, rgba(255,184,111,.2), rgba(255,184,111,0) 62%)}
.demo-handwerker{
  --accent:#ffd34d;
  --accent-2:#ff9a3d;
  --panel:rgba(23,25,28,.86);
  --bg:#0f1012;
  --bg-soft:#17191d;
  --line:rgba(255,211,77,.18);
  --muted:#dbdbde;
  background:
    linear-gradient(135deg, rgba(255,211,77,.08) 0 12%, transparent 12% 20%, rgba(255,211,77,.06) 20% 32%, transparent 32% 40%, rgba(255,154,61,.05) 40% 52%, transparent 52% 100%),
    linear-gradient(180deg, #2e2a21 0%, #121417 24%, #090b0d 100%);
}
.demo-handwerker::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.28;background:
    repeating-linear-gradient(135deg, rgba(255,211,77,.22) 0 18px, rgba(18,20,23,0) 18px 36px),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));mask:linear-gradient(180deg, rgba(0,0,0,.8), rgba(0,0,0,.15));}
.demo-handwerker .hero::after{content:"";position:absolute;right:-8%;top:12%;width:420px;height:420px;border-radius:32px;border:1px solid rgba(255,211,77,.08);background:
    linear-gradient(180deg, rgba(255,211,77,.08), rgba(255,255,255,0)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.03) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 32px);transform:rotate(14deg);filter:blur(.2px);opacity:.32;pointer-events:none}
.demo-handwerker .panel--accent{background:linear-gradient(180deg, rgba(255,211,77,.16), rgba(255,255,255,.03))}
.demo-handwerker .hero::before{background:radial-gradient(circle, rgba(255,211,77,.18), rgba(255,211,77,0) 62%)}
.demo-dienstleister{
  --accent:#65d6ff;
  --accent-2:#79ffe4;
  --panel:rgba(12,26,34,.78);
  --bg:#081017;
  --bg-soft:#0e1a24;
  --line:rgba(101,214,255,.18);
  --muted:#c8dce6;
  background:
    radial-gradient(circle at 15% 12%, rgba(121,255,228,.08) 0 10%, rgba(121,255,228,0) 11%),
    radial-gradient(circle at 84% 20%, rgba(101,214,255,.12) 0 12%, rgba(101,214,255,0) 13%),
    linear-gradient(180deg, #173243 0%, #0b1720 30%, #061018 100%);
}
.demo-dienstleister::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.32;background:
    radial-gradient(circle at 12% 84%, rgba(101,214,255,.18) 0 18%, rgba(101,214,255,0) 19%),
    radial-gradient(circle at 88% 18%, rgba(121,255,228,.15) 0 14%, rgba(121,255,228,0) 15%),
    linear-gradient(120deg, rgba(255,255,255,.06), rgba(255,255,255,0) 34%),
    linear-gradient(300deg, rgba(101,214,255,.05), rgba(101,214,255,0) 38%);}
.demo-dienstleister .hero::after{content:"";position:absolute;inset:18% -10% auto auto;width:460px;height:220px;border-radius:999px;background:linear-gradient(90deg, rgba(101,214,255,.12), rgba(121,255,228,.06));filter:blur(6px);transform:rotate(-12deg);opacity:.42;pointer-events:none}
.demo-dienstleister .panel--accent{background:linear-gradient(180deg, rgba(101,214,255,.16), rgba(255,255,255,.03))}
.demo-dienstleister .hero::before{background:radial-gradient(circle, rgba(101,214,255,.2), rgba(101,214,255,0) 62%)}

.demo-shell{display:grid;gap:1.4rem}
.demo-hero-card,
.demo-card-large,
.demo-callout-card,
.demo-map-card,
.demo-tabs-panel,
.demo-process-card,
.demo-service-board{padding:1.6rem;border-radius:28px;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--panel)}
.demo-hero-card{display:grid;grid-template-columns:1.15fr .85fr;gap:1.4rem;align-items:center}
.demo-hero-card--ferienhaus{background:linear-gradient(135deg, rgba(255,184,111,.16), rgba(255,255,255,.04))}
.demo-visual{position:relative;min-height:240px;border-radius:24px;background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));overflow:hidden}
.demo-visual--house::before{content:"";position:absolute;inset:auto 14% 0 14%;height:62%;background:linear-gradient(180deg, rgba(255,248,236,.18), rgba(255,248,236,.06));border-radius:24px 24px 0 0;border:1px solid rgba(255,255,255,.16)}
.demo-house-roof{position:absolute;left:10%;right:10%;top:24%;height:110px;background:linear-gradient(180deg, rgba(92,52,30,.9), rgba(56,30,16,.92));clip-path:polygon(50% 0, 100% 100%, 0 100%)}
.demo-house-window{position:absolute;width:54px;height:70px;border-radius:14px;background:linear-gradient(180deg, rgba(255,214,145,.92), rgba(255,184,111,.78));box-shadow:0 0 32px rgba(255,200,132,.38)}
.demo-house-window--a{left:26%;bottom:24%}
.demo-house-window--b{left:46%;bottom:24%}
.demo-house-window--c{left:66%;bottom:24%}
.demo-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.demo-stat-card{padding:1.2rem;border-radius:22px;border:1px solid var(--line);background:rgba(255,255,255,.04);text-align:center}
.demo-stat-card strong{display:block;font-size:clamp(1.8rem,4vw,2.7rem);line-height:1;margin-bottom:.4rem;letter-spacing:-.04em}
.demo-stat-card span{display:block;color:var(--muted);font-size:.95rem}
.demo-grid-alt{align-items:stretch}
.demo-card-large h2,.demo-map-card h2,.demo-process-card h2,.demo-tabs-panel h2{max-width:18ch}
.demo-small-note{color:var(--muted);margin-top:1rem}
.demo-map-card__head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;flex-wrap:wrap}
.demo-chip{display:inline-flex;padding:.5rem .8rem;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--line);font-size:.92rem;font-weight:700}
.mini-map{position:relative;min-height:280px;margin-top:1rem;border-radius:26px;background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.09), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.12);overflow:hidden}
.mini-map::before,.mini-map::after{content:"";position:absolute;border-radius:50%;background:rgba(70,150,90,.14)}
.mini-map::before{width:160px;height:160px;left:-20px;bottom:-40px}
.mini-map::after{width:180px;height:180px;right:-40px;top:-30px}
.mini-map__route{position:absolute;display:block;height:10px;border-radius:999px;background:linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.32));transform-origin:left center}
.mini-map__route--one{left:18%;top:38%;width:42%;transform:rotate(18deg)}
.mini-map__route--two{left:46%;top:52%;width:26%;transform:rotate(-32deg)}
.mini-map__point{position:absolute;display:inline-flex;align-items:center;justify-content:center;min-width:70px;min-height:70px;padding:.4rem;border-radius:999px;background:rgba(255,184,111,.18);border:1px solid rgba(255,220,178,.42);font-size:.78rem;font-weight:800;text-align:center;box-shadow:0 0 0 0 rgba(255,184,111,.25);animation:mapPulse 2.6s ease-in-out infinite}
.mini-map__point--house{left:18%;top:28%}
.mini-map__point--lift{left:58%;top:42%;animation-delay:.4s}
.mini-map__point--town{left:68%;top:18%;animation-delay:.8s}
.mini-map__point--trail{left:34%;top:62%;animation-delay:1.2s}
.mini-map__legend{display:grid;gap:.55rem;margin-top:1rem}
.mini-map__legend span{display:flex;align-items:center;gap:.55rem;color:var(--muted)}
.mini-map__legend i{width:.7rem;height:.7rem;border-radius:50%;display:inline-block;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.demo-alert-bar{display:flex;gap:1rem;flex-wrap:wrap;padding:1rem 1.2rem;border-radius:18px;border:1px solid var(--line);background:linear-gradient(90deg, rgba(255,211,77,.18), rgba(255,154,61,.08))}
.demo-alert-bar span{font-weight:800;color:var(--text)}
.demo-callout-card{display:flex;flex-direction:column;justify-content:space-between;gap:1rem}
.demo-callout-card--soft{background:linear-gradient(180deg, rgba(101,214,255,.16), rgba(255,255,255,.03))}
.process-list{list-style:none;padding:0;margin:0;display:grid;gap:1rem}
.process-list li{display:grid;gap:.25rem;padding:1rem 1rem 1rem 1.2rem;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid var(--line);position:relative}
.process-list li::before{content:"";position:absolute;left:.6rem;top:1.2rem;width:.45rem;height:.45rem;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.process-list span,.service-columns p{color:var(--muted)}
.service-columns{display:grid;gap:1rem}
.service-columns article{padding:1rem;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.04)}
.demo-tabs__nav{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:1rem}
.demo-tab{padding:.8rem 1rem;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);font:inherit;font-weight:700;cursor:pointer}
.demo-tab.is-active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#06111a;border-color:transparent}
.demo-tabs__content{position:relative}
.demo-tab-panel{display:none;padding:1rem 0 0}
.demo-tab-panel.is-active{display:block}
.demo-detail-card{position:relative;overflow:hidden}
.demo-cta-box{background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02))}
.demo-handwerker .demo-card-large,
.demo-handwerker .demo-callout-card,
.demo-handwerker .demo-process-card,
.demo-handwerker .demo-service-board{border-radius:22px}
.demo-handwerker .card,
.demo-handwerker .demo-stat-card{border-radius:18px}
.demo-dienstleister .demo-card-large,
.demo-dienstleister .demo-callout-card,
.demo-dienstleister .demo-tabs-panel{border-radius:30px}
.demo-dienstleister .demo-stat-card{background:linear-gradient(180deg, rgba(101,214,255,.10), rgba(255,255,255,.03))}
@keyframes mapPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,184,111,.22)}50%{box-shadow:0 0 0 12px rgba(255,184,111,0)}}
@media (max-width: 980px){
  .demo-hero-card,.demo-stats{grid-template-columns:1fr}
  .demo-card-large h2,.demo-map-card h2,.demo-process-card h2,.demo-tabs-panel h2{max-width:none}
}


/* High-end demo refinements */
.demo-visual--sunset{background:linear-gradient(180deg, rgba(255,215,154,.28), rgba(255,150,91,.08) 42%, rgba(19,14,11,.24) 100%)}
.demo-mountain{position:absolute;bottom:0;filter:blur(.2px);opacity:.88}
.demo-mountain--one{left:-5%;width:65%;height:42%;background:linear-gradient(180deg, rgba(57,79,59,.92), rgba(32,45,33,.98));clip-path:polygon(0 100%, 18% 62%, 28% 72%, 45% 38%, 59% 64%, 78% 30%, 100% 100%)}
.demo-mountain--two{right:-6%;width:58%;height:38%;background:linear-gradient(180deg, rgba(75,98,76,.88), rgba(42,58,44,.98));clip-path:polygon(0 100%, 16% 58%, 36% 72%, 58% 36%, 76% 66%, 100% 100%)}
.booking-form,.quote-form,.appointment-form{display:grid;gap:1rem}
.booking-grid,.quote-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem}
.booking-form label,.quote-form label,.appointment-form label{display:grid;gap:.45rem}
.booking-form span,.quote-form span,.appointment-form span{font-weight:700}
.booking-form input,.booking-form select,.quote-form select,.appointment-form select{min-height:52px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);padding:0 .95rem;font:inherit}
.booking-result,.quote-result,.appointment-result{display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap;padding:1rem 1.1rem;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.04)}
.booking-result strong,.quote-result strong,.appointment-result strong{display:block;font-size:1.6rem;line-height:1.05;letter-spacing:-.03em}
.booking-result span,.quote-result span{color:var(--muted);display:block;font-size:.94rem;margin-top:.25rem}
.availability-calendar{margin-top:1rem;display:grid;gap:.75rem}
.availability-calendar__header,.availability-calendar__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem}
.availability-calendar__header span{padding:.35rem 0;text-align:center;color:var(--muted);font-size:.82rem;font-weight:700}
.availability-day{min-height:44px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);font:inherit;font-weight:700;cursor:pointer}
.availability-day.is-booked{background:rgba(255,108,90,.16);border-color:rgba(255,108,90,.36);color:#ffd7d2;cursor:not-allowed}
.availability-day.is-highlight{background:rgba(255,184,111,.12)}
.availability-day.is-selected{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#1a120b;border-color:transparent}
.guest-highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1rem}
.guest-highlights article{padding:1rem;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.guest-highlights strong{display:block;margin-bottom:.35rem}
.guest-highlights span{color:var(--muted);font-size:.94rem}
.demo-before-after-card{padding:1.6rem;border-radius:24px;border:1px solid var(--line);background:var(--panel)}
.before-after{position:relative;min-height:320px;margin-top:1rem;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(135deg, #3a342a, #191b1f)}
.before-after__before,.before-after__after{position:absolute;inset:0;display:flex;align-items:flex-start;justify-content:flex-start;padding:1rem;font-weight:800}
.before-after__before{background:
 linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)),
 repeating-linear-gradient(90deg, rgba(255,211,77,.12) 0 22px, rgba(0,0,0,0) 22px 44px),
 linear-gradient(135deg,#544536,#22262b)}
.before-after__after{background:
 linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0)),
 linear-gradient(135deg,#ffd34d,#ff9a3d 45%,#55483a 100%);justify-content:flex-end}
.before-after__before span,.before-after__after span{padding:.45rem .7rem;border-radius:999px;background:rgba(0,0,0,.26);backdrop-filter:blur(6px)}
.before-after__range{position:absolute;left:1rem;right:1rem;bottom:1rem;width:calc(100% - 2rem)}
.service-badges{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1rem}
.service-badges span{display:inline-flex;padding:.55rem .8rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line);font-weight:700}
.testimonial-panel{display:grid;gap:1rem;padding:1.6rem;border-radius:30px;border:1px solid var(--line);background:linear-gradient(180deg, rgba(101,214,255,.12), rgba(255,255,255,.03))}
.testimonial{display:none;padding:1.2rem;border-radius:22px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.testimonial.is-active{display:block}
.testimonial p{font-size:1.08rem;margin:0 0 .9rem}
.testimonial footer{color:var(--muted);font-weight:700}
.testimonial-dots{display:flex;gap:.45rem}
.testimonial-dots span{width:.7rem;height:.7rem;border-radius:50%;background:rgba(255,255,255,.2)}
.testimonial-dots span.is-active{background:var(--accent)}
.process-timeline,.appointment-card{padding:1.6rem;border-radius:28px;border:1px solid var(--line);background:var(--panel)}
.timeline-list{display:grid;gap:.85rem;margin-top:.8rem}
.timeline-list article{display:grid;gap:.25rem;padding:1rem 1rem 1rem 1.1rem;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid var(--line);position:relative}
.timeline-list article::before{content:"";position:absolute;left:.55rem;top:1.18rem;width:.42rem;height:.42rem;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.timeline-list span{color:var(--muted)}
.appointment-result{align-items:flex-start}
.demo-dienstleister .hero__lead{max-width:840px}
.demo-ferienhaus .hero__lead{max-width:840px}
.demo-handwerker .hero__lead{max-width:840px}
@media (max-width: 980px){
  .booking-grid,.quote-grid,.guest-highlights{grid-template-columns:1fr}
  .before-after{min-height:260px}
}


/* Demo icons and stronger differentiation */
.demo-icon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem;margin-top:1.2rem}
.demo-icon-card{display:flex;gap:.85rem;align-items:flex-start;padding:1rem;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.045);backdrop-filter:blur(10px)}
.demo-icon-card img{width:44px;height:44px;flex:0 0 44px;filter:drop-shadow(0 10px 18px rgba(0,0,0,.22))}
.demo-icon-card strong{display:block;margin-bottom:.2rem;font-size:.98rem}
.demo-icon-card span{display:block;color:var(--muted);font-size:.92rem;line-height:1.45}
.demo-icon-grid--ferienhaus .demo-icon-card{background:linear-gradient(180deg, rgba(255,205,150,.11), rgba(255,255,255,.035))}
.demo-icon-grid--handwerker .demo-icon-card{background:linear-gradient(180deg, rgba(255,211,77,.12), rgba(255,255,255,.03))}
.demo-icon-grid--dienstleister .demo-icon-card{background:linear-gradient(180deg, rgba(101,214,255,.12), rgba(255,255,255,.03))}
.demo-ferienhaus .bg-grid{opacity:.06;background-size:110px 110px;background-image:linear-gradient(rgba(255,240,220,.06) 1px, transparent 1px),linear-gradient(90deg, rgba(255,240,220,.05) 1px, transparent 1px)}
.demo-handwerker .bg-grid{opacity:.14;background-size:34px 34px;background-image:linear-gradient(rgba(255,211,77,.07) 1px, transparent 1px),linear-gradient(90deg, rgba(255,211,77,.07) 1px, transparent 1px)}
.demo-dienstleister .bg-grid{opacity:.08;background-size:72px 72px;background-image:linear-gradient(rgba(101,214,255,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(101,214,255,.05) 1px, transparent 1px)}
.demo-ferienhaus .bg-glow--one{background:radial-gradient(circle, rgba(255,184,111,.28), rgba(255,184,111,0) 62%)}
.demo-ferienhaus .bg-glow--two{background:radial-gradient(circle, rgba(126,179,123,.18), rgba(126,179,123,0) 62%)}
.demo-handwerker .bg-glow--one{background:radial-gradient(circle, rgba(255,211,77,.22), rgba(255,211,77,0) 58%)}
.demo-handwerker .bg-glow--two{background:radial-gradient(circle, rgba(255,154,61,.15), rgba(255,154,61,0) 60%)}
.demo-dienstleister .bg-glow--one{background:radial-gradient(circle, rgba(101,214,255,.24), rgba(101,214,255,0) 60%)}
.demo-dienstleister .bg-glow--two{background:radial-gradient(circle, rgba(121,255,228,.14), rgba(121,255,228,0) 62%)}
@media (max-width:980px){.demo-icon-grid{grid-template-columns:1fr}}

@media (max-width: 1100px){
  .card-grid--three{grid-template-columns:1fr !important;}
}
@media (max-width: 1100px){
  .demo-card{min-height:auto;}
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
}

.stats-panel {
  display: grid;
  gap: 1rem;
}

.stats-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}

.stats-kpis div,
.stats-category-card {
  padding: 1rem;
  border-radius: 16px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
}

.stats-kpis strong,
.stats-category-card strong {
  display: block;
  font-size: 1.5rem;
  line-height: 1.1;
}

.stats-kpis span,
.stats-category-card span {
  display: block;
  margin-top: 0.35rem;
  color: rgba(255,255,255,0.74);
  font-size: 0.95rem;
}

.stats-category-grid,
.stats-lists-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}

.stats-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.stats-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.7rem 0.9rem;
  border-radius: 14px;
  background: rgba(255,255,255,0.03);
}

.table-panel {
  overflow: hidden;
}

.table-wrap {
  overflow-x: auto;
}

.stats-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
}

.stats-table th,
.stats-table td {
  text-align: left;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  vertical-align: top;
}

.stats-table th {
  color: rgba(255,255,255,0.78);
  font-size: 0.95rem;
}

.url-cell {
  max-width: 320px;
  word-break: break-word;
}

.muted {
  color: rgba(255,255,255,0.6);
}

@media (max-width: 800px) {
  .stats-category-grid,
  .stats-lists-grid,
  .stats-kpis {
    grid-template-columns: 1fr;
  }

  .stats-table {
    min-width: 640px;
  }
}

.trust-card h3,.process-step h3,.branch-link-card h3{margin-top:0;margin-bottom:.45rem;line-height:1.35}
