/* Klaratelier phase 2 – D2 "Resonanz" skin for the subpages (2026-11-13).
   Part 1 (unscoped): latin-ext faces for Hungarian, language switch, legal note – used by the D2 static template (style.css) too.
   Part 2 (html.d2s): re-skin layer for the trade / product pages that keep their own markup, forms and scripts. */
@font-face{font-family:Fraunces;font-style:normal;font-weight:300 700;font-display:swap;src:url(/assets/fonts/fraunces-normal-latinext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Fraunces;font-style:italic;font-weight:300 700;font-display:swap;src:url(/assets/fonts/fraunces-italic-latinext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Instrument Sans;font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/instrument-sans-latinext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

header.top .lang{display:inline-flex;align-items:center;gap:.1rem;font-size:.8rem;font-weight:600;letter-spacing:.08em}
header.top .lang a{display:inline-grid;place-items:center;min-width:2.1rem;min-height:2.75rem;padding:0 .3rem;text-decoration:none;color:rgba(246,242,236,.78)}
header.top .lang a[aria-current]{color:#f6f2ec;text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:1px}
header.top .lang a:hover{color:#fff}
header.top .btn .s{display:none}
@media(max-width:520px){header.top .btn .l{display:none}header.top .btn .s{display:inline}header.top nav{gap:.5rem}}
.prose .ka-legal-note,.prose aside{display:block;margin:0 0 1.6rem;padding:.9rem 1.1rem;border:1px solid rgba(185,160,242,.45);border-radius:16px;background:rgba(185,160,242,.08);color:rgba(246,242,236,.9);font-size:.95rem}
.prose .back{display:inline-flex;align-items:center;min-height:2.75rem;margin-bottom:.6rem;font-size:.92rem;color:rgba(246,242,236,.84);text-decoration:none}
.prose .back:hover{text-decoration:underline}
.prose figure{margin:0 0 1rem}
.prose img{border-radius:12px;height:auto}
.prose code{font-size:.9em;overflow-wrap:anywhere}

/* ================= re-skin layer ================= */
html.d2s:root,html.d2s:root[data-theme],html.d2s:root .hero,html.d2s body.ks{
  --paper:#0d0a14;--paper-2:#120e1b;--card:#15111e;--card-2:#1b1626;
  --ink:#f6f2ec;--ink-2:rgba(246,242,236,.84);--ink2:rgba(246,242,236,.84);--muted:rgba(246,242,236,.74);--line:rgba(255,255,255,.16);
  --violet:#b9a0f2;--violet-2:#b9a0f2;--lilac:#4a2f86;--peach:#f2a076;--apricot:#f7c28c;--copper:#f2a076;--rose:#f2a076;--grad-mid:#d9b3d6;
  --btn-a:#f6f2ec;--btn-b:#f6f2ec;--btn-ink:#17131f;--on-violet:#17131f;--focus:#fff;--accent:#d9c2ff;
  --nav:rgba(13,10,20,.82);--night:#08060d;--night-ink:#f3efe9;--shadow:rgba(0,0,0,.6);
  --ks-paper:#0d0a14;--ks-paper2:#120e1b;--ks-card:#15111e;--ks-card2:#1b1626;--ks-ink:#f6f2ec;--ks-ink2:rgba(246,242,236,.84);--ks-muted:rgba(246,242,236,.74);--ks-line:rgba(255,255,255,.16);
  --ks-violet:#b9a0f2;--ks-violet2:#b9a0f2;--ks-lilac:#4a2f86;--ks-peach:#f2a076;--ks-copper:#f2a076;--ks-gradmid:#d9b3d6;--ks-on:#17131f;--ks-shadow:rgba(0,0,0,.6);
  --d-card:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 26%),rgba(21,17,30,.92);--d-card-line:rgba(255,255,255,.14);
  --gut:clamp(20px,4.6vw,72px);color-scheme:dark}
html.d2s{background:#0d0a14;scroll-padding-top:1rem}
html.d2s body{position:relative;background:#0d0a14!important;color:#f6f2ec;font-family:"Instrument Sans","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}
html.d2s body::before{content:"";position:absolute;inset:0 0 auto;height:min(140vh,1500px);z-index:0;pointer-events:none;background:radial-gradient(120% 70% at 70% -10%,rgba(116,80,184,.30),rgba(13,10,20,0) 60%),radial-gradient(60% 34% at 0% 58%,rgba(207,106,63,.10),rgba(13,10,20,0) 70%)}
html.d2s main,html.d2s header.top,html.d2s footer.d2f{position:relative;z-index:1}
html.d2s .ks-aura,html.d2s .hero>.bgd,html.d2s .hero>.bgl,html.d2s .hero>.aurora,html.d2s #progress{display:none!important}
html.d2s :focus-visible{outline:2px solid #fff;outline-offset:3px;box-shadow:0 0 0 4px #4a2f86}

/* header (D2) */
html.d2s header.top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem var(--gut);margin:0;max-width:none;width:auto;background:none;border:0;border-radius:0;box-shadow:none;top:auto;left:auto;transform:none;-webkit-backdrop-filter:none;backdrop-filter:none}
html.d2s header.top .logo{font-family:Fraunces,Georgia,serif;font-size:1.45rem;font-weight:400;letter-spacing:-.02em;text-decoration:none;line-height:1;color:#f6f2ec}
html.d2s header.top .logo i{font-weight:300;font-style:italic}
html.d2s header.top nav{display:flex;align-items:center;gap:clamp(.7rem,1.8vw,1.7rem);font-size:.95rem;margin:0;padding:0;background:none;border:0}
html.d2s header.top nav a{color:#f6f2ec;text-decoration:none;padding:.5rem 0;font-weight:400}
html.d2s header.top nav a.opt:hover{text-decoration:underline;text-underline-offset:.3em}
html.d2s header.top nav a.btn{display:inline-flex;align-items:center;min-height:2.75rem;padding:.5rem 1rem;font-size:.92rem;font-weight:600;border-radius:999px;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.06);color:#f6f2ec;white-space:nowrap;box-shadow:none}
html.d2s header.top nav a.btn:hover{background:rgba(255,255,255,.14)}
html.d2s header.top .lang a{padding:0 .3rem;font-weight:600}
@media(max-width:900px){html.d2s header.top nav a.opt{display:none}}

/* footer (D2) */
html.d2s footer.d2f{background:#08060d;color:#f3efe9;padding:clamp(3rem,7vw,6rem) 0 calc(2rem + env(safe-area-inset-bottom,0px));overflow:hidden;margin:0;border:0}
html.d2s footer.d2f .wrap{width:min(100% - 2*var(--gut),78rem);margin-inline:auto;padding:0;max-width:none}
html.d2s footer.d2f .big{font-family:Fraunces,Georgia,serif;font-weight:300;font-size:clamp(4.2rem,19.5vw,19rem);line-height:.86;letter-spacing:-.045em;white-space:nowrap;margin:0 0 clamp(1.5rem,4vw,3rem) -.04em;color:#f3efe9}
html.d2s footer.d2f .big i{font-weight:300;font-style:italic}
html.d2s footer.d2f .row{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;justify-content:space-between;font-size:.9rem}
html.d2s footer.d2f p{margin:0;color:#f3efe9}
html.d2s footer.d2f a{color:#f3efe9;text-underline-offset:.25em}
html.d2s footer.d2f ul{display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;list-style:none;margin:0;padding:0}
html.d2s footer.d2f li a{display:inline-flex;align-items:center;min-height:2.75rem}
html.d2s footer.d2f .micro{font-size:.84rem;line-height:1.5;margin-top:1rem;color:rgba(243,239,233,.78)}
@media(max-width:1023px){html.d2s.has-dock footer.d2f{padding-bottom:calc(5.6rem + env(safe-area-inset-bottom,0px))}}

/* orb accent (first child of <main>) */
html.d2s main{position:relative}
html.d2s main>.sub-orb{position:absolute;z-index:0;pointer-events:none;top:4.5rem;right:-12rem;width:26rem;aspect-ratio:1;opacity:.8;margin:0;padding:0}
html.d2s .sub-orb canvas{position:absolute;left:-18%;top:-18%;width:136%;height:136%;opacity:0;transition:opacity .8s ease}
html.d2s .sub-orb.on canvas{opacity:1}
html.d2s main>.sub-orb~*{position:relative;z-index:1}
html.d2s main>.sub-orb+*{background:none!important}
@media(max-width:900px){html.d2s main>.sub-orb{top:-3.4rem;right:-17vw;width:min(64vw,17.5rem);opacity:.8}
  html.d2s main>.sub-orb+*{padding-top:clamp(7.4rem,34vw,9.5rem)!important}
  html.d2s main>.sub-orb+* h1,html.d2s main>.sub-orb+* .eyebrow{text-shadow:0 1px 2px rgba(8,5,14,.95),0 0 12px rgba(8,5,14,.9)}}
@media(prefers-reduced-motion:reduce){html.d2s *,html.d2s *::before,html.d2s *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* type */
html.d2s h1,html.d2s h2,html.d2s h3{font-family:Fraunces,"Iowan Old Style","Palatino Linotype",Georgia,serif;font-weight:400;letter-spacing:-.022em;text-wrap:balance;color:#f6f2ec}
html.d2s h1{line-height:1.04}
html.d2s h1 em,html.d2s h2 em,html.d2s h3 em,html.d2s .grad{font-style:italic;font-weight:300;background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:currentColor!important}
html.d2s h1 em,html.d2s h1 .grad{color:#f6f2ec!important;font-weight:400}
html.d2s h2 em,html.d2s h2 .grad,html.d2s h3 em{color:#b9a0f2!important}
html.d2s .eyebrow{font-family:"Instrument Sans","Segoe UI",system-ui,sans-serif;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:rgba(246,242,236,.84)}
html.d2s .eyebrow::before,html.d2s .eyebrow::after{display:none!important}

/* buttons */
html.d2s .btn,html.d2s .button,html.d2s .vs-alt,html.d2s .wcx-nbtn,html.d2s .text-link{font-family:"Instrument Sans","Segoe UI",system-ui,sans-serif}
html.d2s main .btn,html.d2s main .button,html.d2s main .wcx-btn,html.d2s .sticky .btn,html.d2s .sticky-cta,html.d2s .mobile-cta .btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3rem;padding:.8rem 1.35rem;border-radius:999px;font-weight:600;font-size:1rem;line-height:1.2;text-decoration:none;border:1px solid transparent;transition:transform .25s ease,background-color .25s ease;background-image:none;box-shadow:none;text-shadow:none}
html.d2s main .btn.primary,html.d2s main .ks-primary,html.d2s main .button.ks-primary,html.d2s main .button.submit,html.d2s main button[type=submit].btn,html.d2s main button[type=submit].button{background:#f6f2ec!important;background-image:none!important;color:#17131f!important;border-color:transparent!important;box-shadow:0 10px 34px -12px rgba(160,130,255,.55)!important}
html.d2s main .btn.primary:hover,html.d2s main .button.ks-primary:hover,html.d2s main .button.submit:hover{background:#fff!important;transform:translateY(-1px)}
html.d2s main .btn.primary[disabled],html.d2s main .button[disabled]{opacity:.7}
html.d2s main .btn.ghost,html.d2s main .ks-ghost,html.d2s main .vs-alt,html.d2s main .wcx-nbtn{border:1px solid rgba(255,255,255,.5)!important;background:rgba(20,16,28,.55)!important;color:#f6f2ec!important;box-shadow:none!important}
html.d2s main .btn.ghost:hover,html.d2s main .vs-alt:hover,html.d2s main .wcx-nbtn:hover{background:rgba(255,255,255,.14)!important}
html.d2s .btn::before,html.d2s .btn::after,html.d2s .button::before,html.d2s .button::after{display:none!important}
html.d2s .btn .ks-orb,html.d2s .button .ks-orb,html.d2s .wcx-btn .ks-orb,html.d2s .btn .arr,html.d2s .button .arr{all:unset;display:inline-block;font-size:0}
html.d2s .wcx-btn .ks-orb svg,html.d2s .btn .ks-orb svg,html.d2s .button .ks-orb svg,html.d2s .btn .arr svg,html.d2s .button .arr svg{display:none!important}
html.d2s .wcx-btn .ks-orb::after,html.d2s .btn .ks-orb::after,html.d2s .button .ks-orb::after,html.d2s .btn .arr::after,html.d2s .button .arr::after{content:"→";font-size:1rem;display:inline-block;transition:transform .25s ease}
html.d2s .btn:hover .ks-orb::after,html.d2s .btn:hover .arr::after,html.d2s .button:hover .ks-orb::after{transform:translateX(3px)}

/* mobile dock (existing sticky CTA elements, D2 look) */
@media(max-width:1023px){
  html.d2s .sticky .btn,html.d2s a.sticky-cta,html.d2s .mobile-cta .btn{background:linear-gradient(100deg,#d9c2ff,#f4b48a)!important;color:#1c1230!important;border:0!important;min-height:3rem;box-shadow:0 12px 34px rgba(0,0,0,.5)!important;white-space:nowrap}
}

/* forms (generic) */
html.d2s main input:not([type=radio]):not([type=checkbox]):not([type=range]):not([type=hidden]),html.d2s main select,html.d2s main textarea{min-height:3rem;border-radius:12px!important;border:1px solid rgba(255,255,255,.28)!important;background-color:rgba(255,255,255,.06)!important;color:#fff!important;font-family:inherit;font-size:1rem;box-shadow:none}
html.d2s main select option{color:#17131f;background:#fff}
html.d2s main input::placeholder,html.d2s main textarea::placeholder{color:rgba(246,242,236,.62)!important;opacity:1}
html.d2s main input:focus-visible,html.d2s main select:focus-visible,html.d2s main textarea:focus-visible{outline:2px solid #fff!important;outline-offset:2px;box-shadow:0 0 0 4px #4a2f86!important}
html.d2s main [aria-invalid="true"]{border-color:#ffb4a8!important;box-shadow:0 0 0 1px #ffb4a8!important}
html.d2s main input[type=checkbox],html.d2s main input[type=radio]{accent-color:#b9a0f2}
html.d2s main a:not(.btn):not(.button){text-underline-offset:.22em}

/* header buttons stay readable where the orb glows behind them */
html.d2s header.top nav a.btn{background:rgba(13,10,20,.62)}
html.d2s header.top .lang a,html.d2s header.top .logo{text-shadow:0 1px 2px rgba(8,5,14,.95),0 0 10px rgba(8,5,14,.9)}

/* ---- shared card look (trade pages, product pages) ---- */
html.d2s .ks-landing .ex,html.d2s .ks-landing .tier,html.d2s .ks-landing .who .card,html.d2s .ks-landing .steps li,html.d2s .ks .ks-form,html.d2s .ks-landing .done,html.d2s .form-card{background:var(--d-card)!important;border:1px solid var(--d-card-line)!important;border-radius:22px!important;box-shadow:0 30px 80px -40px rgba(0,0,0,.8)!important}
html.d2s .ks-landing .tier.feat{border-color:rgba(185,160,242,.6)!important}
html.d2s .ks-landing .ex:hover,html.d2s .ks-landing .tier:hover{transform:none}
html.d2s .ks-landing .steps li::before{background:none!important;box-shadow:none!important;border:1px solid rgba(185,160,242,.7);color:#b9a0f2!important;font-family:Fraunces,Georgia,serif;font-weight:400;font-size:1.05rem}
html.d2s .ks-landing .head h2,html.d2s .ks-landing .hero h1{font-weight:400}
html.d2s .ks-landing .faq summary::after{font-family:Fraunces,Georgia,serif;font-weight:300;font-size:1.5rem;color:#b9a0f2}
html.d2s .done .mark,html.d2s .vs-done-mark{background:linear-gradient(100deg,#d9c2ff,#f4b48a)!important;color:#1c1230!important;box-shadow:none!important}
html.d2s .ks .ks-form input[type=checkbox]:checked{background:#b9a0f2!important;border-color:transparent!important}
html.d2s .ks .ks-form input[type=checkbox]{background:rgba(255,255,255,.06)!important;border:1.5px solid rgba(255,255,255,.5)!important;min-height:20px!important;border-radius:6px!important}
html.d2s .ks .ks-form button[type=submit]{justify-content:center!important;padding:.8rem 1.35rem!important}
html.d2s .ks-landing .ex .btn.primary.ks-has-orb,html.d2s .ks-landing .hero .cta .btn.primary.ks-has-orb,html.d2s .ks-landing .sticky .btn.primary{justify-content:center!important;padding:.8rem 1.35rem!important}
html.d2s .ks-landing .trades li{background:rgba(20,16,28,.55);border-color:rgba(255,255,255,.2);color:rgba(246,242,236,.84)}
html.d2s .ks-landing .phone .tag{background:rgba(20,16,28,.9);color:#fff;border:1px solid rgba(255,255,255,.22)}

/* no sideways scroll from the orb; clip keeps position:sticky working */
html.d2s main{overflow-x:clip}
html.d2s .btn .arr,html.d2s .btn .ks-orb,html.d2s .wcx-btn .ks-orb,html.d2s .button .arr,html.d2s .button .ks-orb{background:none!important;box-shadow:none!important;width:auto!important;height:auto!important;overflow:visible!important;border:0!important;transform:none!important;position:static!important}

/* tap targets ≥ 44 px */
html.d2s header.top .logo,header.top .logo{display:inline-flex;align-items:center;min-height:2.75rem}
header.top .lang a{min-width:2.75rem}
html.d2s main .ka-chip,html.d2s main .view-tabs button,html.d2s main summary{min-height:2.75rem}
html.d2s main .wcx-tel,html.d2s main .ka-step-go,html.d2s main .wc-contact-link,html.d2s main .showcase-foot a,html.d2s main .text-link,html.d2s main .more a,html.d2s main .ka-step-alt,html.d2s main .who .contact a{display:inline-flex;align-items:center;min-height:2.75rem}
html.d2s main label.check,html.d2s main .vs-toggle,html.d2s main label.opt,html.d2s main fieldset label{min-height:2.75rem;align-items:center}
html.d2s main label.check{align-items:start}

/* /hu/ home (old long page): calmer D2 surfaces */
html.d2s:root[data-theme="dark"] .ticker{background:none!important;border-block:1px solid rgba(255,255,255,.16)!important;padding-block:2rem!important;margin:0!important}
html.d2s .ticker span::after{background:#b9a0f2!important;border-radius:50%!important;width:8px!important;height:8px!important}
html.d2s .works,html.d2s section.contact,html.d2s .wc-teaser{background:none!important}
html.d2s .promise:has(.promise-n){background:var(--d-card)!important;border:1px solid rgba(185,160,242,.45)!important}
html.d2s .promise .promise-n,html.d2s .promise .ka-facts b{background:none!important;-webkit-text-fill-color:currentColor!important;color:#b9a0f2!important}
html.d2s .tier.feat{background:linear-gradient(180deg,rgba(185,160,242,.16),rgba(185,160,242,.04) 40%),#15111e!important;border:1px solid rgba(185,160,242,.6)!important;color:#f6f2ec!important}
html.d2s .tier.feat::after{display:none!important}
html.d2s .tier,html.d2s .proj{border-color:rgba(255,255,255,.14)}
@media(max-width:1023px){html.d2s a.sticky-cta{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));justify-content:center}
  html.d2s .sticky{left:10px!important;right:10px!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important}
  html.d2s.ka-footer-in-view .sticky,html.d2s.ka-footer-in-view a.sticky-cta,html.d2s.ka-footer-in-view .mobile-cta{opacity:0!important;pointer-events:none!important}}
@media(max-width:400px){header.top{padding-inline:16px!important}header.top .logo{font-size:1.3rem!important}header.top nav{gap:.3rem!important}header.top nav a.btn{padding:.5rem .8rem!important;font-size:.88rem!important}}

/* in-page confirmation (Digitale Rezeption) + status lines */
html.d2s .fdone{padding:1.4rem 1.3rem;border:1px solid rgba(185,160,242,.6);border-radius:20px;background:rgba(185,160,242,.08);display:grid;gap:.6rem;outline:none;align-content:start}
html.d2s .fdone-mark{width:2.6rem;height:2.6rem;border-radius:50%;display:grid;place-items:center;background:linear-gradient(100deg,#d9c2ff,#f4b48a);color:#1c1230;font-size:1.3rem;font-weight:700}
html.d2s .fdone h3{font-size:clamp(1.5rem,3vw,2.1rem);margin:0}
html.d2s .fdone p{color:rgba(246,242,236,.84);margin:0}
html.d2s main [role=status].err,html.d2s main .form-status.err{color:#ffc9bf}
html.d2s main .wcx-pnote{opacity:1!important}
html.d2s .wc-teaser h2{background:none!important;color:#f6f2ec!important;-webkit-text-fill-color:currentColor!important}
/* phones: no backdrop blur / grain overlays (same rule as the D2 homepage) */
@media(max-width:1023px),(pointer:coarse){html.d2s *,html.d2s *::before,html.d2s *::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  html.d2s .grain::before,html.d2s .grain::after{display:none!important}}
/* short phones: smaller orb zone so the headline and the first button stay in the first screen */
@media(max-width:900px) and (max-height:700px){html.d2s main>.sub-orb{top:-3rem;right:-13vw;width:min(50vw,12.5rem)}
  html.d2s main>.sub-orb+*{padding-top:5.4rem!important}}