/* Vecom Design – Premium-Look v3 (27.10.2026). Stilschicht über style.css – alle Bereiche und Funktionen bleiben.
   Abschaltbar: Klasse „v3“ am <html> entfernen. Farben/Typo nach dem freigegebenen Entwurf „VECOM Premium Redesign v3“. */
html.v3{--bg:#0c1d33;--fg:#f5f3ee;--mut:#aab2bb;--gold:#e6b967;--gg:linear-gradient(110deg,#f5d394,#ba8845);
 --stk-bg:#0c1d33;--stk-bg2:#081420;--stk-bgf:#0a182b;--stk-r:0px;--stk-rm:0px;--stk-sh:0;
 --shd-a:#e6b967;--hw-a:#e6b967;--h-div:#e6b967;--vg-gold:#e6b967;--card-r:4px;--line:rgba(216,190,142,.19);--g-shadow:none;
 --v3-gold:#e6b967;--v3-gold2:#f6d592;--v3-text:#f5f3ee;--v3-muted:#aab2bb;--v3-line:rgba(216,190,142,.19);--v3-panel:#111d2b;
 --v3-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;--v3-sans:"Montserrat","Helvetica Neue",Arial,sans-serif;
 --v3-btn:linear-gradient(110deg,#f5d394,#ba8845);--v3-gut:3rem}
html.v3 body{background:#0c1d33;color:var(--v3-text)}
html.v3 .grain{opacity:.12}
::selection{background:#e6b967;color:#07111d}

/* ---------- Abschnitte: durchgehende Flächen statt gestapelter Blätter ---------- */
html.v3 .stk .wrap,html.v3 .wrap{position:relative!important;top:auto!important}
html.v3 .stk-sheet{border-radius:0!important;box-shadow:none!important;background:#0c1d33!important}
html.v3 .stk-sheet::before{display:none!important}
html.v3 .wrap>.stk-sheet{border-top:1px solid rgba(255,255,255,.07)!important}
html.v3 .band>.stk-sheet{background:radial-gradient(circle at 20% 10%,rgba(37,49,65,.2),transparent 35%),#081420!important}
html.v3 body>footer>.stk-sheet{background:#0a182b!important;border-top:1px solid var(--v3-line)}
html.v3 .stk-dim,html.v3 .v-sweep{display:none!important}

/* ---------- Abschnittsköpfe: links, Eyebrow mit Linie, Serif zweifarbig ---------- */
html.v3 .shd{text-align:left!important;max-width:none!important;margin:0 0 clamp(2rem,3.4vw,2.8rem)!important}
html.v3 .shd-orn,html.v3 .gr-orn,html.v3 .hw-orn{display:none!important}
html.v3 .shd .shd-k,html.v3 .shd-k,html.v3 .pz-k{display:flex!important;align-items:center;gap:14px;margin:0 0 1rem!important;font:700 11px/1.2 var(--v3-sans)!important;letter-spacing:.32em!important;text-transform:uppercase;color:#d3d7dc!important;font-weight:500!important}
html.v3 .shd-k::after{content:"";width:50px;height:1px;background:var(--v3-gold);flex:0 0 auto}
html.v3 .shd-t,html.v3 .exi-1{font:600 clamp(2.7rem,5vw,4.8rem)/1.04 var(--v3-serif)!important;font-style:normal!important;letter-spacing:-.015em!important;text-align:left!important;
 background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:var(--v3-text)!important;color:var(--v3-text)!important;filter:none!important;text-shadow:none!important}
html.v3 .v3-g{color:var(--v3-gold2)!important;-webkit-text-fill-color:var(--v3-gold2)!important}
html.v3 .shd-s,html.v3 .pv-lead.shd-s{color:var(--v3-muted)!important;max-width:42rem!important;margin:1.1rem 0 0!important;text-align:left!important;font-size:15px!important;line-height:1.75!important}

/* ---------- Karten: feine goldene Linie statt Glas ---------- */
html.v3 .glass,html.v3 .g-card{background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,0))!important;border:1px solid var(--v3-line)!important;border-radius:4px!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
/* Fenster (Leistung, Paket, Fragen): deckende Fläche, damit nichts durchscheint */
html.v3 .sv-panel.glass{background:linear-gradient(180deg,#14263d 0%,#0d1c30 100%)!important;border:1px solid rgba(234,197,129,.22)!important;border-radius:10px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 80px -24px rgba(0,0,0,.85)!important}
html.v3 .sv-panel.glass::after{display:none!important}
html.v3 .g-wide.glass,html.v3 .lv-panel.glass,html.v3 .toolbox.glass{background:none!important;border:0!important;padding-left:0!important;padding-right:0!important}
html.v3 .shim::before,html.v3 .shim::after,html.v3 .lb{display:none!important}

/* ---------- Knöpfe: Gold-Pille und Umriss ---------- */
html.v3 .btn{border-radius:999px!important;background:var(--v3-btn)!important;color:#0a1420!important;-webkit-text-fill-color:#0a1420!important;border:0!important;box-shadow:none!important;
 font:700 13px/1.2 var(--v3-sans)!important;letter-spacing:.02em!important;text-transform:none!important;min-height:50px;padding:0 26px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:12px;transition:transform .25s,filter .25s}
html.v3 .btn::before,html.v3 .btn::after{display:none!important}
html.v3 .btn:hover{transform:translateY(-2px);filter:brightness(1.05)}
html.v3 .btn.ghost,html.v3 .hs-btn2{background:rgba(2,9,16,.32)!important;border:1px solid rgba(234,198,134,.72)!important;color:var(--v3-text)!important;-webkit-text-fill-color:var(--v3-text)!important}

/* ---------- Startbereich: Abendbild Taormina/Ätna mit Original-V auf der Terrasse, Text links ---------- */
html.v3 .hero2{position:relative!important;top:auto!important;min-height:clamp(600px,48vw,92vh)!important;height:auto!important;padding:0!important;display:flex!important;align-items:center;background:#0c1d33 url(assets/v3/hero-scharf-2560.webp) 78% 50%/cover no-repeat!important}
@media(max-width:1600px){html.v3 .hero2{background-image:url(assets/v3/hero-scharf-1600.webp)!important}}
html.v3 .hero2::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(12,29,51,.94) 0%,rgba(12,29,51,.78) 28%,rgba(12,29,51,.18) 58%,rgba(12,29,51,0) 75%),linear-gradient(0deg,#0c1d33 0%,rgba(12,29,51,0) 22%),linear-gradient(180deg,rgba(12,29,51,.55) 0%,rgba(12,29,51,0) 18%)}
html.v3 .hero2 .h-art,html.v3 .hero2 .bgn,html.v3 .hero2 .h-beams,html.v3 .hero2 .h-grid,html.v3 .hero2 .h-glow{display:none!important}
html.v3 .hero2 .h-in{position:relative;z-index:1;display:block!important;padding:clamp(7rem,10vw,9rem) var(--v3-gut) clamp(3rem,5vw,4.5rem)!important;width:100%;max-width:1280px!important;margin:0 auto!important;box-sizing:border-box}
html.v3 .hero2 .h-copy{display:block!important;max-width:none!important;width:auto!important;text-align:left!important;transform:none!important;margin:0!important;padding:0!important}
html.v3 .hero2 .h-wel{background:none!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding:0!important;margin:0!important;text-align:left!important;max-width:44rem!important;display:flex!important;flex-direction:column;align-items:flex-start}
html.v3 .hero2 .hs-e{order:-1;display:flex!important;align-items:center;gap:18px;margin:0 0 1.6rem!important;font:500 12px/1.4 var(--v3-sans)!important;letter-spacing:.3em!important;text-transform:uppercase;color:#d9dde2!important;-webkit-text-fill-color:#d9dde2!important;text-align:left!important}
html.v3 .hero2 .hs-e::after{content:"";width:46px;height:1px;background:var(--v3-gold)}
html.v3 .hero2 .hs-h{font:600 clamp(3.4rem,6.2vw,6.6rem)/1.02 var(--v3-serif)!important;letter-spacing:-.012em!important;text-align:left!important;margin:0 0 1.5rem!important;max-width:9.2em}
html.v3 .hero2 .hs-h .hs-l{display:inline!important;background:none!important;-webkit-text-fill-color:var(--v3-text)!important;color:var(--v3-text)!important;filter:none!important;text-shadow:0 2px 24px rgba(0,0,0,.35)!important;font-style:normal!important;animation:none!important}
html.v3 .hero2 .hs-h .hs-q{-webkit-text-fill-color:#e3c08a!important;color:#e3c08a!important}
html.v3 .hero2 .hs-p{font:400 clamp(16px,1.35vw,20px)/1.6 var(--v3-sans)!important;color:#eef0f2!important;-webkit-text-fill-color:#eef0f2!important;text-align:left!important;max-width:40rem!important;margin:0!important;word-spacing:.05em}
html.v3 .hero2 .hs-b{display:none!important}
html.v3 .hero2 .hs-c{order:5;display:flex!important;flex-wrap:wrap;gap:16px;justify-content:flex-start!important;margin:2.2rem 0 2.4rem!important}
html.v3 .hero2 .hs-t{order:6;font:500 11px/1.4 var(--v3-sans)!important;letter-spacing:.34em!important;text-transform:uppercase;color:#cfd3d8!important;-webkit-text-fill-color:#cfd3d8!important;text-align:left!important;margin:0!important;max-width:none}
html.v3 .hero2 .hs-btn,html.v3 .hero2 .hs-btn2{min-height:58px;padding:0 30px!important;font:600 15px/1 var(--v3-sans)!important;letter-spacing:.01em!important;text-transform:none!important;border-radius:999px!important;gap:16px;display:inline-flex!important;align-items:center}
html.v3 .hero2 .hs-btn::after{content:"→"!important;display:inline!important;position:static!important;background:none!important;font-size:19px;line-height:1;width:auto!important;height:auto!important;opacity:1!important}
html.v3 .hero2 .hs-btn2{background:rgba(12,29,51,.35)!important;border:1px solid rgba(234,198,134,.8)!important;color:#f5f3ee!important;-webkit-text-fill-color:#f5f3ee!important;text-decoration:none!important}
html.v3 .hero2 .hs-btn2::after{content:"▶";display:inline-flex!important;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.14);font-size:9px;padding-left:2px;box-sizing:border-box}
html.v3 .hero2 .h-cta,html.v3 .hero2 .kicker,html.v3 .hero2 .sub,html.v3 .hero2 .hair,html.v3 .hero2 .statement{display:none!important}

/* ---------- Menüleiste wie im Bild: einzeiliger Schriftzug, ruhige Links, DE | IT | EN ---------- */
html.v3 header.nav{padding-left:max(6vw,calc((100vw - 1280px)/2 + var(--v3-gut)))!important;padding-right:max(6vw,calc((100vw - 1280px)/2 + var(--v3-gut)))!important;background:linear-gradient(180deg,rgba(12,29,51,.72),rgba(12,29,51,0))!important;border-bottom:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.v3 header.nav{transition:background-color .24s cubic-bezier(.16,1,.3,1),border-color .24s}
html.v3 header.nav.v3-sc{background:rgba(12,29,51,.94)!important;-webkit-backdrop-filter:blur(14px) saturate(1.2)!important;backdrop-filter:blur(14px) saturate(1.2)!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
html.v3 header.nav.scrolled,html.v3 header.nav.sc,html.v3 header.nav.solid{background:rgba(12,29,51,.92)!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
html.v3 .brandlink .navv,html.v3 .brandlink .bl-w,html.v3 .brandlink .brand{display:none!important}
html.v3 .v3-wm{display:inline-flex;align-items:center;gap:.9rem;white-space:nowrap}
html.v3 .v3-wm img{height:17px;width:auto;display:block}
html.v3 .v3-wm b{font:300 22px/1 var(--v3-sans);letter-spacing:.2em;color:#eceef1}
html.v3 #topnav{gap:clamp(1.6rem,3vw,3.2rem)!important}
html.v3 #topnav a{font:400 15px/1 var(--v3-sans)!important;letter-spacing:.01em!important;text-transform:none!important;color:#f1f2f4!important;-webkit-text-fill-color:#f1f2f4!important}
html.v3 #topnav a::after,html.v3 #topnav a::before{display:none!important}
html.v3 #topnav a:hover,html.v3 #topnav a.tl-on{color:var(--v3-gold2)!important;-webkit-text-fill-color:var(--v3-gold2)!important}
html.v3 #langtop{display:flex!important;align-items:center;gap:0!important}
html.v3 #langtop button{font:400 14px/1 var(--v3-sans)!important;letter-spacing:.04em!important;color:#d4d8dd!important;background:none!important;border:0!important;padding:4px 0!important;text-decoration:none!important;box-shadow:none!important}
html.v3 #langtop button::after{display:none!important}
html.v3 #langtop button[data-l=de]{order:1}html.v3 #langtop button[data-l=it]{order:2}html.v3 #langtop button[data-l=en]{order:3}
html.v3 #langtop button+button::before,html.v3 #langtop button[data-l=it]::before,html.v3 #langtop button[data-l=en]::before{content:"|";margin:0 .7rem;color:#8d949c;font-weight:300}
html.v3 #langtop button[data-l=de]::before{content:none!important}
html.v3 #langtop button.on,html.v3 #langtop button[aria-pressed=true]{color:#fff!important;font-weight:600!important}
@media(min-width:1041px){html.v3 header.nav .burger{display:none!important}}

/* ---------- Gold-Band (neu) ---------- */
html.v3 .v3-manifest{position:relative;padding:42px 0;color:#08121d}
html.v3 .v3-manifest::before{content:"";position:absolute;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);background:linear-gradient(120deg,#bd9b63,#f2d79a 53%,#c29253);z-index:-1}
html.v3 .v3-manifest .in{max-width:1280px;margin:0 auto;padding:0 clamp(1.2rem,4vw,3rem);display:flex;justify-content:space-between;align-items:center;gap:50px}
html.v3 .v3-manifest p{font:600 clamp(28px,3.2vw,44px)/1.15 var(--v3-serif);max-width:870px;margin:0;letter-spacing:-.02em;color:#08121d}
html.v3 .v3-manifest em{font-style:italic}
html.v3 .v3-manifest small{font:700 10px/1.6 var(--v3-sans);letter-spacing:.23em;text-transform:uppercase;min-width:200px;text-align:right;color:#08121d}

/* ---------- Projekte (neu) ---------- */
html.v3 .v3-proj{position:relative;max-width:1280px;margin:0 auto;padding:clamp(4rem,8vw,6.5rem) clamp(1.2rem,4vw,3rem)}
html.v3 .v3-proj::before{content:"";position:absolute;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);background:#0c1d33;z-index:-1}
.v3-proj .v3-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:1.6rem}
.v3-proj .v3-head .shd{margin:0!important}.v3-proj .v3-head .shd-k{margin:0!important}
.v3-proj .v3-more{font:500 11px/1 var(--v3-sans);color:var(--v3-gold);text-transform:uppercase;letter-spacing:.3em;white-space:nowrap;text-decoration:none}
.v3-proj .v3-more i{font-style:normal;font-size:20px;margin-left:10px}
.v3-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.v3-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.v3-card{min-width:0}
.v3-vis{position:relative;aspect-ratio:1.25;overflow:hidden;border:1px solid rgba(234,197,129,.26);border-radius:12px;background:radial-gradient(ellipse at 28% 15%,#304a68 0%,#14283e 40%,#071321 80%)}
.v3-vis.pink{background:radial-gradient(ellipse at 70% 10%,#6b455a 0%,#2f2739 35%,#0b1826 78%)}
.v3-vis::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 25% 97%,rgba(220,175,109,.13),transparent 56%);pointer-events:none}
.v3-lap{position:absolute;top:18%;left:5.5%;width:79%;height:67%;filter:drop-shadow(0 22px 16px rgba(2,6,12,.58))}
.v3-scr{width:100%;height:95%;border:8px solid #11151d;border-bottom-width:9px;border-radius:17px 17px 4px 4px;padding:4px;background:#03070f;box-shadow:0 0 0 1px rgba(119,134,150,.33),inset 0 0 0 1px #657387;overflow:hidden}
.v3-scr div{position:relative;width:100%;height:100%;overflow:hidden;background:#0d1424}
.v3-scr img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;transition:object-position 5s ease}
.v3-vis.pink .v3-scr img{object-position:center 37%}
.v3-card:hover .v3-scr img{object-position:center 32%}
.v3-base{width:105%;height:6%;margin:-1px 0 0 -2.5%;border-radius:1px 1px 55% 55%;background:linear-gradient(#c7cbd3 0%,#778394 42%,#1a2432 90%);box-shadow:inset 0 1px 0 rgba(243,243,245,.63)}
.v3-ph{position:absolute;right:3%;bottom:7%;height:53%;width:20%;border:5px solid #11151d;border-radius:17px;overflow:hidden;background:#15151b;box-shadow:0 8px 22px rgba(0,0,0,.7),0 0 0 1px rgba(137,149,166,.31)}
.v3-ph img{width:100%;height:100%;object-fit:cover;object-position:center top}
.v3-ph i{position:absolute;z-index:2;top:3px;left:30%;width:40%;height:6px;background:#10151d;border-radius:0 0 12px 12px}
.v3-photo{display:block;position:relative;aspect-ratio:1.12;overflow:hidden;background:#10213a;border-radius:10px;border:1px solid rgba(234,197,129,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.v3-photo:focus-visible{outline:2px solid var(--v3-gold);outline-offset:4px}
.v3-soon{flex:none;font:500 10.5px/1 var(--v3-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--v3-gold);border:1px solid rgba(234,197,129,.45);border-radius:999px;padding:9px 14px;white-space:nowrap}
.v3-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.v3-card:hover .v3-photo img{transform:scale(1.03)}
.v3-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 15px;padding:18px 1px 0}.v3-meta>div{flex:1 1 15rem;min-width:0}
html.v3 #projekte .v3-meta h3{font-family:var(--v3-serif)!important;font-weight:600!important;font-size:27px!important;line-height:1.1!important;font-style:normal!important;margin:2px 0 10px!important;color:var(--v3-text)!important;-webkit-text-fill-color:var(--v3-text)!important;background:none!important;letter-spacing:-.01em!important}
.v3-meta p{margin:0;color:#aeb5bd;font:500 10px/1.5 var(--v3-sans);letter-spacing:.3em;text-transform:uppercase}
.v3-meta a{color:#e8eaed;font-size:22px;line-height:1;text-decoration:none;padding:6px}
.v3-link{display:none;margin-top:10px;font:500 12px/1.4 var(--v3-sans);color:#e7bc74;border-bottom:1px solid rgba(185,145,82,.35);text-decoration:none;padding:2px 0}
.v3-link:hover,.v3-meta a:hover,.v3-more:hover{color:#ffe3ae}

/* ---------- Einheitlicher Schreibstil in allen Abschnitten ---------- */
html.v3 :is(#projekte,#leistungen,#schaukasten,#beispiele,#preview,#ablauf,#pakete,#about,#tool,#fragen,#contact) .shd-t{font:600 clamp(2.7rem,5vw,4.8rem)/1.04 var(--v3-serif)!important;font-style:normal!important;letter-spacing:-.015em!important;text-align:left!important;color:var(--v3-text)!important;-webkit-text-fill-color:var(--v3-text)!important;background:none!important}
html.v3 :is(#leistungen,#ablauf,#pakete,#about,#tool,#fragen,#contact) :is(h3,.ab-vh,.lv-hov b){font-family:var(--v3-serif)!important;font-weight:600!important;font-style:normal!important;letter-spacing:0!important;color:var(--v3-text)!important;-webkit-text-fill-color:var(--v3-text)!important;background:none!important;text-shadow:none!important}
html.v3 :is(#leistungen .lv-card,#ablauf .tl li,#pakete .pk) h3{font-size:1.65rem!important;line-height:1.15!important}
html.v3 :is(#pakete .rc,#contact .pz-weg,#contact .wiz,#contact .inq,#about .ab-txt) h3{font-size:1.75rem!important}
html.v3 .pk-price b{font-family:var(--v3-serif)!important;font-weight:600!important;font-size:2.7rem!important;color:var(--v3-gold2)!important;-webkit-text-fill-color:var(--v3-gold2)!important;background:none!important}
html.v3 .lv-card{border-radius:4px!important;border:1px solid var(--v3-line)!important;background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,0))!important;box-shadow:none!important}
html.v3 .lv-card:hover{background:linear-gradient(135deg,rgba(229,182,108,.09),rgba(255,255,255,.01))!important}
html.v3 .lv-n,html.v3 .tl-n{color:#9aa0a6!important}
/* Über mich: große Bildkarte links, Text rechts */
html.v3 #about .ab-media{width:100%!important;max-width:none!important;justify-self:stretch!important;position:relative;margin:0!important}
html.v3 #about .ab-photo{position:relative;margin:0!important;width:100%!important;max-width:none!important;height:auto!important;aspect-ratio:1/1.05;border-radius:8px;overflow:hidden;border:1px solid rgba(237,209,158,.22);box-shadow:none!important;background:#10213a!important;transform:none!important}
html.v3 #about .ab-photo::before,html.v3 #about .ab-photo::after{display:none!important}
html.v3 #about .ab-photo img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;object-position:38% 40%;-webkit-mask-image:none!important;mask-image:none!important;filter:none!important;transform:none!important;opacity:1!important}
html.v3 #about .v3-loc{position:absolute;left:24px;bottom:22px;z-index:2;background:rgba(14,31,53,.85);border:1px solid var(--v3-line);padding:11px 16px;font:500 11px/1 var(--v3-sans);letter-spacing:.14em;text-transform:uppercase;color:#f1f2f4}
html.v3 #about .ab-photo::after{content:"";display:block!important;position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,30,53,.75) 0,rgba(13,30,53,0) 32%);pointer-events:none}
html.v3 #about .ab-sign{font-family:var(--v3-serif)!important;font-weight:600!important;font-size:1.6rem!important}
/* Fragen und Domain-Check: bündig */
html.v3 #fragen .acc{max-width:none!important;margin:0!important}
html.v3 #fragen summary{font:500 16px/1.5 var(--v3-sans)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;letter-spacing:0!important;font-style:normal!important}
html.v3 #tool .toolbox{max-width:none!important;margin:0!important;padding-top:0!important;padding-bottom:0!important}
html.v3 #tool form{max-width:44rem;margin-left:0!important}

/* ---------- Leistungen wie im Bild: nur Eyebrow, großzügige Karten mit goldenen Strich-Symbolen ---------- */
html.v3 #leistungen .shd-t,html.v3 #leistungen .shd-s{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;margin:0!important;padding:0!important}
html.v3 #leistungen .shd{margin-bottom:1.6rem!important}
html.v3 #leistungen .lv-grid{gap:18px!important}
html.v3 .lv-card{border-radius:2px!important;border:1px solid rgba(255,255,255,.11)!important;background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.01))!important;padding:clamp(1.6rem,2.4vw,2.2rem)!important;min-height:0!important}
html.v3 .lv-card .lv-n{display:none!important}
html.v3 .lv-card .lv-ico{width:auto!important;height:auto!important;border:0!important;background:none!important;box-shadow:none!important;border-radius:0!important;color:var(--v3-gold)!important;margin:0 0 1.2rem!important;padding:0!important;display:block!important}
html.v3 .lv-card .lv-ico svg{width:46px!important;height:46px!important;stroke:var(--v3-gold)!important;stroke-width:1.15!important;filter:none!important}
html.v3 .lv-card .lv-ico::before,html.v3 .lv-card .lv-ico::after{display:none!important}
html.v3 #leistungen .lv-card h3{font-size:clamp(1.8rem,2.2vw,2.15rem)!important;font-weight:500!important;margin:0 0 .8rem!important}
html.v3 .lv-card p{font:400 15px/1.65 var(--v3-sans)!important;color:#c9cdd2!important}
html.v3 .lv-more{font:500 14px/1 var(--v3-sans)!important;letter-spacing:.01em!important;text-transform:none!important;color:var(--v3-gold)!important;margin-top:1.2rem!important}
html.v3 .lv-more i{font-style:normal;margin-left:.6rem}
/* ---------- Über mich wie im Bild: Foto links bis an den Rand, weich ins Dunkle; Text rechts ---------- */
html.v3 #about{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(2rem,5vw,5rem);align-items:start}
html.v3 #about>.ab-card{display:contents!important}
html.v3 #about>header.shd{grid-column:2;grid-row:1;margin-bottom:1.4rem!important}
html.v3 #about .ab-txt{grid-column:2;grid-row:2}
html.v3 #about>.services{grid-column:2;grid-row:3}
html.v3 #about .ab-media{grid-column:1;grid-row:1/span 3;align-self:stretch;position:relative;margin:calc(-1 * clamp(4rem,8vw,6.5rem)) 0 calc(-1 * clamp(4rem,8vw,6.5rem)) calc(-1 * var(--v3-abx,166px))!important;width:auto!important;min-height:560px}
html.v3 #about .ab-photo{position:sticky!important;top:0;height:min(100vh,860px)!important;aspect-ratio:auto!important;border:0!important;border-radius:0!important;background:#0c1d33!important}
html.v3 #about .ab-photo img{object-position:36% 40%!important}
html.v3 #about .ab-photo::after{content:"";display:block!important;position:absolute;inset:0;z-index:2!important;background:linear-gradient(90deg,rgba(12,29,51,0) 45%,rgba(12,29,51,.7) 80%,#0c1d33 100%),linear-gradient(0deg,#0c1d33 0,rgba(12,29,51,0) 22%),linear-gradient(180deg,#0c1d33 0,rgba(12,29,51,0) 14%)!important;pointer-events:none}
html.v3 #about .v3-loc{display:none!important}
html.v3 #about .ab-sig{position:absolute!important;z-index:3;left:max(6vw,(100vw - 1280px)/2 + var(--v3-gut));bottom:clamp(2rem,4vw,3.5rem);width:min(210px,40%)!important;margin:0!important;top:auto!important;right:auto!important;transform:none!important}
html.v3 #about .ab-toggle{display:inline-flex!important;align-items:center;gap:12px;margin-top:1.4rem!important;min-height:50px;padding:0 26px!important;border-radius:999px!important;background:var(--v3-btn)!important;color:#0a1420!important;border:0!important;font:600 14px/1 var(--v3-sans)!important;letter-spacing:.01em!important;text-transform:none!important;cursor:pointer}
html.v3 #about .ab-toggle[hidden]{display:none!important}
html.v3 #about .ab-toggle::after{content:"→";font-size:17px}

/* Tablet: Über mich einspaltig, Foto randlos über die volle Breite */
@media(max-width:1040px){html.v3 #about{display:block!important}html.v3 #about .ab-media{margin:0 calc(-1 * var(--v3-abx,6vw)) 2rem!important;min-height:0}html.v3 #about .ab-photo{position:relative!important;height:clamp(420px,62vw,600px)!important}html.v3 #about .ab-sig{left:var(--v3-abx,6vw);bottom:1.2rem}html.v3 #about .ab-txt{max-width:42rem}}
/* Schärfe & Kontrast (27.10.): kein Körnungs-Schleier mehr über der Seite, Fließtext kräftiger und heller, Startbild für 4K/Retina */
html.v3 .grain{display:none!important}
html.v3{--mut:#c6cbd2}
html.v3 body{font-weight:400!important}
html.v3 .shd-s{font-weight:400!important;color:#cfd4da!important;-webkit-text-fill-color:#cfd4da!important}
html.v3 :is(#schaukasten .sk-copy p,#schaukasten .sk-hint,#beispiele .exi p,#preview small,#pakete .pk-d,#pakete .mut,#pakete small,#fragen p,#contact label,#contact .pz-f,#contact .pz-weg p:not(.pz-k),footer p,footer a:not(.btn),footer span:not(.bl-fc),#about .ab-txt p,#ablauf .tl li p,.pane-txt p,.rc-t span,.lv-card p,.sv-panel p,.sv-panel li){color:#d3d7dd!important;-webkit-text-fill-color:#d3d7dd!important}
html.v3 #projekte .v3-meta p{color:#c9ced5!important}
html.v3 .tabbar .tab:not(.on){color:#d6dade!important}
html.v3 :is(.demo-k,.pv-lbl,footer h4){color:var(--v3-gold)!important;-webkit-text-fill-color:var(--v3-gold)!important}
html.v3 :is(.sk.shd-k,small.sk,.demo-k,.ab-tag,.pv-lbl,footer h4,.hw-k,.sv-panel h3){font-weight:500!important}
html.v3 .ex-img{filter:none!important}
html.v3 .hero2{background-image:url(assets/v3/hero-scharf-2560.webp)!important;background-image:-webkit-image-set(url(assets/v3/hero-scharf-2560.webp) 1x,url(assets/v3/hero-scharf-3840.webp) 2x)!important;background-image:image-set(url(assets/v3/hero-scharf-2560.webp) 1x,url(assets/v3/hero-scharf-3840.webp) 2x)!important}
@media(max-width:1600px){html.v3 .hero2{background-image:url(assets/v3/hero-scharf-1600.webp)!important;background-image:-webkit-image-set(url(assets/v3/hero-scharf-1600.webp) 1x,url(assets/v3/hero-scharf-3840.webp) 2x)!important;background-image:image-set(url(assets/v3/hero-scharf-1600.webp) 1x,url(assets/v3/hero-scharf-3840.webp) 2x)!important}}
@media(max-width:750px){
 html.v3{--v3-gut:6vw}
 html.v3 #about{display:block!important}html.v3 #about .ab-media{margin:0 calc(-1 * var(--v3-gut)) 1.5rem!important;min-height:0}html.v3 #about .ab-photo{position:relative!important;height:420px!important}html.v3 #about .ab-sig{left:var(--v3-gut);bottom:1rem}
 html.v3 .hero2{min-height:0!important;background:#0c1d33 url(assets/v3/hero-scharf-900.webp) 88% 100%/auto 430px no-repeat!important}
 html.v3 .hero2{background-image:-webkit-image-set(url(assets/v3/hero-scharf-900.webp) 1x,url(assets/v3/hero-scharf-1600.webp) 2x,url(assets/v3/hero-scharf-2560.webp) 3x)!important;background-image:image-set(url(assets/v3/hero-scharf-900.webp) 1x,url(assets/v3/hero-scharf-1600.webp) 2x,url(assets/v3/hero-scharf-2560.webp) 3x)!important}
 html.v3 .hero2::after{background:linear-gradient(0deg,rgba(12,29,51,.65) 0,rgba(12,29,51,0) 90px,rgba(12,29,51,0) 250px,rgba(12,29,51,.6) 330px,#0c1d33 425px,#0c1d33 100%)!important}
 html.v3 .hero2 .h-in{padding:7.2rem var(--v3-gut) 330px!important}
 html.v3 .hero2 .hs-h{font-size:clamp(2.9rem,12.5vw,3.6rem)!important}
 html.v3 .hero2 .hs-p{font-size:16px!important}
 html.v3 .hero2 .hs-c{gap:12px;margin:1.8rem 0 1.8rem!important}
 html.v3 .hero2 .hs-btn,html.v3 .hero2 .hs-btn2{min-height:54px;font-size:15px!important}
 html.v3 .v3-manifest .in{display:block}html.v3 .v3-manifest p{font-size:27px}html.v3 .v3-manifest small{display:block;text-align:left;margin-top:20px}
 .v3-proj .v3-head{display:block}.v3-proj .v3-more{display:inline-block;margin-top:14px}
 .v3-grid{grid-template-columns:1fr;gap:50px}.v3-vis{aspect-ratio:1.2}.v3-scr{border-width:6px;border-bottom-width:8px}.v3-ph{border-width:4px;border-radius:14px}
}
/* Ablauf: vier Schritte als Glasscheiben wie die Leistungen, klickbar (Fenster mit mehr Erklärung) */
html.v3 #ablauf .tl{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important;padding:0!important;list-style:none}
html.v3 #ablauf .tl::before,html.v3 #ablauf .tl::after{display:none!important}
html.v3 #ablauf .tl li{position:relative;display:flex!important;flex-direction:column;align-items:flex-start;padding:clamp(1.6rem,2.4vw,2.2rem)!important;border-radius:2px;border:1px solid rgba(255,255,255,.11);background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.01));cursor:pointer;transition:background .24s cubic-bezier(.16,1,.3,1),border-color .24s,transform .24s cubic-bezier(.16,1,.3,1)}
html.v3 #ablauf .tl li:hover,html.v3 #ablauf .tl li:focus-visible{background:linear-gradient(135deg,rgba(229,182,108,.09),rgba(255,255,255,.01));border-color:rgba(234,197,129,.32);transform:translateY(-2px)}
html.v3 #ablauf .tl li:focus-visible{outline:2px solid var(--v3-gold);outline-offset:3px}
html.v3 #ablauf .tl li:active{transform:scale(.99)}
html.v3 #ablauf .tl-n{position:static!important;display:grid!important;place-items:center;width:46px!important;height:46px!important;margin:0 0 1.2rem!important;border-radius:50%!important;border:1px solid rgba(234,197,129,.6)!important;background:rgba(12,29,51,.6)!important;color:var(--v3-gold)!important;font:500 13px/1 var(--v3-sans)!important;letter-spacing:.08em!important;box-shadow:none!important}
html.v3 #ablauf .tl li h3{font-size:clamp(1.8rem,2.2vw,2.15rem)!important;font-weight:500!important;margin:0 0 .8rem!important}
html.v3 #ablauf .tl li p{font:400 15px/1.65 var(--v3-sans)!important;color:#c9cdd2!important;margin:0!important;flex:1}
html.v3 #ablauf .tl li .lv-more{display:inline-flex;align-items:center;margin-top:1.2rem!important}
html.v3 #ablauf .tl li .lv-more b{font-weight:500}
@media(prefers-reduced-motion:reduce){html.v3 #ablauf .tl li{transition:none}html.v3 #ablauf .tl li:hover{transform:none}}
@media(max-width:1040px){html.v3 #ablauf .tl{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:600px){html.v3 #ablauf .tl{grid-template-columns:1fr!important;gap:14px!important}html.v3 #ablauf .tl li{padding-left:clamp(1.6rem,2.4vw,2.2rem)!important}}
/* Handy: ruhiger, kompakter Rhythmus – Abschnitte 32 px oben/unten, durchsichtige Glas-Hüllen ohne zusätzlichen Innenabstand */
@media(max-width:750px){
 html.v3 :is(#leistungen,#beispiele,#preview,#ablauf,#pakete,#about,#tool,#fragen,#contact){padding-top:32px!important;padding-bottom:32px!important}
 html.v3 #projekte{padding-top:36px!important;padding-bottom:32px!important}
 html.v3 #schaukasten{padding-top:0!important;padding-bottom:28px!important}
 html.v3 .g-wide.glass{padding-top:0!important;padding-bottom:0!important}
 html.v3 :is(#leistungen,#beispiele,#preview,#ablauf,#pakete,#about,#tool,#fragen,#contact,#schaukasten) .shd{margin-bottom:22px!important}
 html.v3 #lvgrid{margin-top:14px!important;gap:14px!important}
 html.v3 .lv-card,html.v3 #ablauf .tl li{padding:26px 24px!important}
 html.v3 #ablauf .tl{gap:14px!important}
 html.v3 .v3-grid{gap:36px!important}
 html.v3 .v3-proj .v3-head{margin-bottom:18px!important}
 html.v3 .v3-manifest{padding-top:30px!important;padding-bottom:30px!important}
 html.v3 .sk-tabs{margin-top:28px!important}
 html.v3 #exbelt{padding-top:18px!important;padding-bottom:36px!important;margin-top:20px!important}
 html.v3 .exi{margin-bottom:16px!important}
 html.v3 .ba-wrap{margin-top:20px!important}
 html.v3 .rc{margin-top:24px!important}
 html.v3 footer{padding-top:56px!important}
 html.v3 .sk-sticky{padding-top:100px!important;padding-bottom:24px!important;align-items:flex-start!important;min-height:0!important}
 html.v3 .sk-panel{align-items:start!important;align-content:start!important}
}
/* Menü (Handy/Tablet): deckend, Schrift wie die Überschriften */
html.v3 #drawer{background-color:#13253d!important}
html.v3 #dnav a span{font-family:var(--v3-serif)!important;font-weight:600!important;font-style:normal!important;letter-spacing:0!important}
/* Handy: oben nur die aktive Sprache (alle Sprachen stehen im Menü); Tippen öffnet das Menü */
@media(max-width:600px){html.v3 #langtop button:not(.on){display:none!important}html.v3 #langtop button.on::before{content:none!important}html.v3 #langtop button.on{padding:10px 2px!important}}
/* Schmale Handys: Schriftzug kleiner, damit die Sprachauswahl ganz sichtbar bleibt */
@media(max-width:388px){html.v3 .v3-wm{gap:.6rem}html.v3 .v3-wm img{height:14px}html.v3 .v3-wm b{font-size:18px;letter-spacing:.17em}}
@media(max-width:350px){html.v3 .v3-wm img{height:12px}html.v3 .v3-wm b{font-size:15px;letter-spacing:.14em}}
/* Kundenstimme Nadia Bosco: Text im hellen Bildteil rechts (PC), darunter auf Creme-Fläche (Tablet/Handy) */
html.v3 .v3-stimme{position:relative;max-width:1280px;margin:0 auto;padding:clamp(1rem,3vw,2.5rem) clamp(1.2rem,4vw,3rem) clamp(3rem,6vw,5rem)}
html.v3 .v3-stimme::before{content:"";position:absolute;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);background:#0c1d33;z-index:-1}
.v3-st-wrap{position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(234,197,129,.28);background:#efe6dc;box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 30px 70px -40px rgba(0,0,0,.9)}
.v3-st-fig{margin:0}.v3-st-fig img{display:block;width:100%;height:auto}
.v3-st-q{position:absolute;right:2.6%;top:50%;transform:translateY(-50%);width:42%;margin:0;padding:1.6rem 1.8rem 1.3rem;border-radius:8px;background:rgba(246,241,235,.62);-webkit-backdrop-filter:blur(10px) saturate(1.1);backdrop-filter:blur(10px) saturate(1.1);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 18px 40px -28px rgba(60,40,20,.45);color:#232934;font:400 15px/1.62 var(--v3-sans)}
.v3-st-q p{margin:0 0 .7em;color:#2b313b}
.v3-st-q .v3-st-k{display:flex;align-items:center;gap:14px;margin:0 0 .9rem;font:600 11px/1 var(--v3-sans);letter-spacing:.3em;text-transform:uppercase;color:#8a6420}
.v3-st-q .v3-st-k::after{content:"";width:40px;height:1px;background:#b98a35}
.v3-st-stars{display:flex;gap:3px;margin:0 0 .9rem}
.v3-st-stars svg{width:19px;height:19px;fill:#c8962c;filter:drop-shadow(0 1px 0 rgba(120,80,10,.25))}
.v3-st-q .v3-st-lead{font:600 clamp(1.45rem,2.2vw,1.85rem)/1.2 var(--v3-serif);font-style:italic;color:#151a22;margin-bottom:.6em;letter-spacing:-.005em}
.v3-st-q .v3-st-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:1.1rem;padding-top:1rem;border-top:1px solid rgba(138,100,32,.35)}
.v3-st-q cite{display:flex;flex-direction:column;align-items:flex-start;gap:5px;font-style:normal;text-align:left}
.v3-st-q cite b{font:600 1.45rem/1 var(--v3-serif);color:#151a22}
.v3-st-q cite span{font:500 11px/1.3 var(--v3-sans);letter-spacing:.14em;text-transform:uppercase;color:#6d5734}
.v3-st-q .v3-st-foot a{font:500 13px/1 var(--v3-sans);color:#8a6420;text-decoration:none;white-space:nowrap;border-bottom:1px solid rgba(138,100,32,.45);padding-bottom:3px}
.v3-st-q .v3-st-foot a:hover,.v3-st-q .v3-st-foot a:focus-visible{color:#5c420f;border-color:#5c420f}
.v3-st-note{display:block;margin-top:.9rem;font:400 11.5px/1.4 var(--v3-sans);color:#5d626b}
@media(max-width:1180px){
 .v3-st-q{position:static;transform:none;width:auto;padding:clamp(1.6rem,4vw,2.6rem);border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(180deg,#f1e9df,#ebe1d5)}
 .v3-st-fig img{aspect-ratio:16/10;object-fit:cover;object-position:30% 40%}
}
@media(max-width:600px){.v3-st-fig img{aspect-ratio:4/3.4;object-position:28% 30%}.v3-st-q{font-size:14.5px}.v3-st-q .v3-st-foot{flex-direction:column;align-items:flex-start}}
/* Tag/Nacht im Startbild: Tagesfoto (gleiches Motiv) tagsüber, Nachtfoto nachts, weiche Überblendung in der Dämmerung */
html.v3.v3-tag-voll .hero2{background-image:-webkit-image-set(url(assets/v3/hero-tag2-2560.webp) 1x,url(assets/v3/hero-tag2-3840.webp) 2x)!important;background-image:image-set(url(assets/v3/hero-tag2-2560.webp) 1x,url(assets/v3/hero-tag2-3840.webp) 2x)!important}
html.v3 .v3-tag{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity 2s ease;background:no-repeat 78% 50%/cover;background-image:-webkit-image-set(url(assets/v3/hero-tag2-2560.webp) 1x,url(assets/v3/hero-tag2-3840.webp) 2x)!important;background-image:image-set(url(assets/v3/hero-tag2-2560.webp) 1x,url(assets/v3/hero-tag2-3840.webp) 2x)!important}
html.v3.v3-daemm .v3-tag{opacity:var(--v3-tag,0)}
html.v3.v3-tag-voll .v3-tag{display:none}
@media(max-width:1600px){html.v3.v3-tag-voll .hero2,html.v3 .v3-tag{background-image:-webkit-image-set(url(assets/v3/hero-tag2-1600.webp) 1x,url(assets/v3/hero-tag2-3840.webp) 2x)!important;background-image:image-set(url(assets/v3/hero-tag2-1600.webp) 1x,url(assets/v3/hero-tag2-3840.webp) 2x)!important}}
@media(max-width:750px){html.v3.v3-tag-voll .hero2,html.v3 .v3-tag{background-image:-webkit-image-set(url(assets/v3/hero-tag2-900.webp) 1x,url(assets/v3/hero-tag2-1600.webp) 2x,url(assets/v3/hero-tag2-2560.webp) 3x)!important;background-image:image-set(url(assets/v3/hero-tag2-900.webp) 1x,url(assets/v3/hero-tag2-1600.webp) 2x,url(assets/v3/hero-tag2-2560.webp) 3x)!important}html.v3 .v3-tag{background-position:88% 100%;background-size:auto 430px}}
@media(prefers-reduced-motion:reduce){html.v3 .v3-tag{transition:none}}
@media(prefers-reduced-motion:reduce){.v3-scr img{transition:none}html.v3 .btn{transition:none}}
/* Lebendige Bildschirme in "Ausgewaehlte Projekte": Websites scrollen auf Laptop und Handy (nur transform, nur sichtbar, nicht bei reduzierter Bewegung) */
html.v3 .v3-live{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transition:transform .8s cubic-bezier(.16,1,.3,1)}
html.v3 .v3-card:hover .v3-live{transform:scale(1.03)}
html.v3 .v3-stg{position:absolute;left:0;top:0;margin:0;padding:0;border:0;transform-origin:0 0}
html.v3 .v3-bs{position:absolute;left:0;top:0;margin:0;padding:0;border:0;box-sizing:content-box;transform-origin:0 0;overflow:hidden;background:#0c1626}
html.v3 .v3-bs::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(140deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,0) 42%)}
html.v3 .v3-roll{width:100%;background:no-repeat 0 0/100% auto;animation:v3-lesen 26s cubic-bezier(.65,0,.35,1) infinite paused;will-change:transform}
html.v3 .v3-roll.p{animation-name:v3-lesen-h}
html.v3 .v3-live.an .v3-roll{animation-play-state:running}
@keyframes v3-lesen{0%,8%{transform:translateY(0)}20%,28%{transform:translateY(calc(var(--d)*.22))}40%,48%{transform:translateY(calc(var(--d)*.47))}60%,68%{transform:translateY(calc(var(--d)*.73))}80%,87%{transform:translateY(var(--d))}100%{transform:translateY(0)}}
@keyframes v3-lesen-h{0%,9%{transform:translateY(0)}17%,25%{transform:translateY(calc(var(--d)*.28))}33%,39%{transform:translateY(calc(var(--d)*.5))}45%,51%{transform:translateY(calc(var(--d)*.4))}61%,69%{transform:translateY(calc(var(--d)*.78))}78%,86%{transform:translateY(var(--d))}100%{transform:translateY(0)}}
/* Boulevard: Seite "Sito in costruzione" als echte kleine Seite, Elemente blenden nacheinander ein */
html.v3 .v3-bvw,html.v3 .v3-bv{position:absolute;inset:0;margin:0;padding:0;border:0;width:auto;height:auto;box-sizing:border-box}
html.v3 .v3-bv{background:radial-gradient(120% 90% at 50% 10%,#1a2c45 0%,#0d1a2b 55%,#08111d 100%);color:#efe7d6;font-family:Montserrat,sans-serif}
html.v3 .v3-bv .bv-n{position:absolute;left:4%;top:3.2%;font:500 10px/1 "Cormorant Garamond",serif;color:#f1d9a6}
html.v3 .v3-bv .bv-o{position:absolute;right:4%;top:3.6%;font:500 5px/1 Montserrat,sans-serif;font-style:normal;letter-spacing:.32em;text-transform:uppercase;color:#bfb49c}
html.v3 .v3-bv .bv-m{position:absolute;left:0;right:0;top:50%;bottom:auto;height:auto;margin:0;padding:0;transform:translateY(-54%);display:flex;flex-direction:column;align-items:center;text-align:center}
html.v3 .v3-bv .bv-k,html.v3 .v3-bv .bv-a,html.v3 .v3-bv .bv-p,html.v3 .v3-bv small{font-size:5.6px;letter-spacing:.5em;text-transform:uppercase;color:#d8b26a}
html.v3 .v3-bv strong{font:500 54px/1 "Cormorant Garamond",serif;margin:9px 0 6px;background:linear-gradient(180deg,#f6e3b8,#c99a4c);-webkit-background-clip:text;background-clip:text;color:transparent}
html.v3 .v3-bv .bv-a{color:#d9cdb3;font-size:6.4px;letter-spacing:.62em}
html.v3 .v3-bv .bv-l{display:block;width:52px;height:1px;margin:17px 0 14px;background:linear-gradient(90deg,transparent,#d8b26a,transparent)}
html.v3 .v3-bv .bv-s{font:italic 500 15px/1.2 "Cormorant Garamond",serif;color:#efe7d6}
html.v3 .v3-bv .bv-p{margin-top:6px;color:#a99f8a;letter-spacing:.24em;font-size:5.8px}
html.v3 .v3-bv small{position:absolute;right:4%;bottom:4%;font-size:4.6px;letter-spacing:.28em;color:#7f7764}
html.v3 .v3-bv.p .bv-o{display:none}html.v3 .v3-bv.p .bv-n{font-size:9px;top:2.6%;left:7%}
html.v3 .v3-bv.p strong{font-size:46px}html.v3 .v3-bv.p .bv-s{font-size:14px}html.v3 .v3-bv.p small{right:0;left:0;text-align:center;bottom:3%}
html.v3 .v3-bv .bv-m>*{opacity:0;animation:v3-bv var(--t,14s) cubic-bezier(.16,1,.3,1) infinite paused}
html.v3 .v3-live.an .v3-bv .bv-m>*{animation-play-state:running}
html.v3 .v3-bv .bv-m>:nth-child(1){animation-delay:var(--v)}html.v3 .v3-bv .bv-m>:nth-child(2){animation-delay:calc(var(--v) + .35s)}html.v3 .v3-bv .bv-m>:nth-child(3){animation-delay:calc(var(--v) + .7s)}
html.v3 .v3-bv .bv-m>:nth-child(4){animation-delay:calc(var(--v) + 1s)}html.v3 .v3-bv .bv-m>:nth-child(5){animation-delay:calc(var(--v) + 1.4s)}html.v3 .v3-bv .bv-m>:nth-child(6){animation-delay:calc(var(--v) + 1.75s)}
@keyframes v3-bv{0%{opacity:0;transform:translateY(5px)}8%,84%{opacity:1;transform:none}94%,100%{opacity:0;transform:none}}
@media (prefers-reduced-motion:reduce){html.v3 .v3-live{display:none}}
/* Intro: goldenes V in Echtzeit (assets/intro/intro.min.js). html.vi setzt mobile.js vor dem ersten Bild. */
html.vi,html.vi body{overflow:hidden!important}
html.vi::after{content:"";position:fixed;inset:0;z-index:2147483000;background:#0b1a2e url(assets/intro/hinter-quer-1600.webp) 80% 50%/cover no-repeat;animation:vi-not 0s 6.5s forwards}
@media(max-aspect-ratio:1/1){html.vi::after{background-image:url(assets/intro/hinter-hoch-900.webp)}}
@keyframes vi-not{to{visibility:hidden}}
html.vi.vi-run::after{display:none}
#vi{position:fixed;inset:0;z-index:2147483001;background:#0b1a2e url(assets/intro/hinter-quer-1600.webp) 80% 50%/cover no-repeat;transform-origin:50% 50%;transition:opacity .75s cubic-bezier(.4,0,.2,1),transform .9s cubic-bezier(.16,1,.3,1);--vi-wm:0}
@media(max-aspect-ratio:1/1){#vi{background-image:url(assets/intro/hinter-hoch-900.webp)}}
#vi::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 75% 65% at 50% 48%,transparent 55%,rgba(4,10,20,.55) 100%)}
#vi canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .6s cubic-bezier(.16,1,.3,1)}
#vi.an canvas{opacity:1}
#vi .vi-wm{position:absolute;left:50%;transform:translate(-50%,calc((1 - var(--vi-wm))*10px));opacity:var(--vi-wm);height:auto;max-width:86vw;pointer-events:none;z-index:1}
#vi .vi-skip{position:absolute;right:clamp(16px,3vw,36px);bottom:clamp(16px,3.4vh,36px);z-index:2;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(234,198,134,.45);background:rgba(11,26,46,.35);color:#efe7d6;font:500 12px/1 Montserrat,sans-serif;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .2s ease,background-color .2s ease,transform .16s cubic-bezier(.23,1,.32,1)}
#vi .vi-skip i{font-style:normal;font-size:16px;letter-spacing:0}
#vi .vi-skip:hover{border-color:rgba(234,198,134,.85);background:rgba(11,26,46,.6)}
#vi .vi-skip:active{transform:scale(.97)}
#vi .vi-skip:focus-visible{outline:2px solid #eac686;outline-offset:3px}
#vi.weg{opacity:0;transform:scale(1.045);pointer-events:none}
#vi.weg.schnell{transition-duration:.35s,.35s}

/* Projekte: beim Ueberfahren mit der Maus faehrt die "Kamera" naeher an Laptop und Handy heran (Bild und Live-Bildschirme gemeinsam) */
@media (hover:hover) and (pointer:fine){
 html.v3 .v3-photo img,html.v3 .v3-photo .v3-live{transform-origin:var(--z,50% 50%);transition:transform .75s cubic-bezier(.4,0,.2,1)}
 html.v3 .v3-card:hover .v3-photo img,html.v3 .v3-card:hover .v3-photo .v3-live{transform:scale(1.17);transition:transform 1.3s cubic-bezier(.16,1,.3,1)}
}
@media (prefers-reduced-motion:reduce){html.v3 .v3-card:hover .v3-photo img,html.v3 .v3-card:hover .v3-photo .v3-live{transform:none}}

/* Laden ohne Springen: v3.js setzt Abschnitte um; bis dahin sind die Abschnitte unter dem Startbild unsichtbar (Notfall: nach 3 s sichtbar) */
@keyframes v3zeig{to{visibility:visible}}
@media (prefers-reduced-motion:no-preference){html.v3:not(.v3-da) body>section:not(#top){visibility:hidden;animation:v3zeig 0s 3s forwards}}
/* Fußzeile: Leistungsseiten */
html.v3 .f-seo{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px;max-width:1120px;margin:26px auto 0;padding:0 16px;font-size:.82rem;letter-spacing:.03em}
html.v3 .f-seo a{color:var(--muted,#9a988f);text-decoration:none;transition:color .18s}
html.v3 .f-seo a:hover,html.v3 .f-seo a:focus-visible{color:#f0c75e}
