/* Version 7 visual upgrade */
:root{
  --v7-glow: 0 0 0 1px rgba(143,217,255,.25), 0 20px 45px rgba(25,110,200,.25);
}
body{background:#050d1b}
.v2-bg{
  background:
    radial-gradient(circle at 12% 15%, rgba(92,173,255,.22), transparent 30%),
    radial-gradient(circle at 82% 20%, rgba(80,232,255,.14), transparent 28%),
    radial-gradient(circle at 50% 120%, rgba(92,118,255,.22), transparent 38%),
    linear-gradient(180deg,#08172f 0%, #050d1b 52%, #040913 100%);
  animation:v7-bg-shift 18s ease-in-out infinite alternate;
}
@keyframes v7-bg-shift{
  0%{filter:saturate(1) brightness(1);transform:scale(1)}
  100%{filter:saturate(1.15) brightness(1.06);transform:scale(1.03)}
}
header{background:rgba(4,11,24,.62);border-bottom-color:rgba(180,225,255,.2)}
.head nav a{position:relative;transition:color .25s ease}
.head nav a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:linear-gradient(90deg,#57a5ff,#62e7ff);transition:width .25s ease}
.head nav a:hover{color:#fff}
.head nav a:hover::after{width:100%}

.hero .img-wrap{box-shadow:0 28px 60px rgba(3,10,20,.55),0 0 0 1px rgba(141,209,255,.24);isolation:isolate}
.hero .img-wrap::before{content:"";position:absolute;inset:-2px;background:conic-gradient(from 180deg at 50% 50%, rgba(93,173,255,.15), rgba(78,241,255,.07), rgba(129,120,255,.12), rgba(93,173,255,.15));z-index:-1;filter:blur(14px)}
.hero-copy h1{background:linear-gradient(180deg,#f3f8ff 0%,#cae7ff 46%,#8fd8ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.hero-copy .eyebrow{letter-spacing:.22em;color:#b8d9ff}
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{content:"";position:absolute;top:-130%;left:-30%;width:36%;height:360%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.46),transparent);transform:rotate(18deg);animation:v7-sheen 3.2s infinite}
@keyframes v7-sheen{0%{left:-35%}40%{left:120%}100%{left:120%}}

.stat,.card,.contact,.review-card,.text-frame{backdrop-filter: blur(6px)}
.stat{box-shadow:var(--v7-glow);transition:transform .28s ease, box-shadow .28s ease}
.stat:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(143,217,255,.32),0 28px 50px rgba(40,130,220,.28)}

.cards{gap:18px}
.card{position:relative;transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% -20%,rgba(100,204,255,.2),transparent 42%);pointer-events:none;opacity:.5}
.card:hover{transform:translateY(-7px);border-color:rgba(151,220,255,.44);box-shadow:0 22px 45px rgba(9,40,90,.35)}
.card img{transition:transform .45s ease, filter .45s ease}
.card:hover img{transform:scale(1.04);filter:saturate(1.12) contrast(1.05)}
.card-media{position:relative;display:block;overflow:hidden;background:#07101e}
.card-media-image,.card-media-video{width:100%;height:250px;object-fit:cover;display:block}
.card-media-video{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .3s ease, transform .55s ease, filter .35s ease;background:#07101e}
.has-mode-video .card-media-image{transition:opacity .28s ease, transform .45s ease, filter .45s ease}
.has-mode-video .card-media::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,12,20,.12),rgba(5,12,20,.04));pointer-events:none;z-index:1;opacity:.9;transition:opacity .3s ease, background .3s ease}
.service-card-link:hover .card-media-image,.service-card-link:hover .card-media-video{transform:scale(1.04)}
.service-card-link{display:block;color:inherit;text-decoration:none;overflow:hidden}
.service-card-link h3,.service-card-link p{color:inherit}
.service-card-link .pad{position:relative;z-index:2}
.service-card-link::after{content:"";position:absolute;inset:auto -12% -28% -12%;height:52%;background:radial-gradient(circle at 50% 0%,rgba(97,213,255,.16),transparent 66%);pointer-events:none;opacity:.36;transition:opacity .28s ease,transform .28s ease}
.service-card-link:hover::after{opacity:.64;transform:translateY(-6px)}

body[data-site-mode="action"] #leistungen .has-mode-video .card-media-video,
body[data-site-mode="chaos"] #leistungen .has-mode-video .card-media-video{opacity:1}
body[data-site-mode="action"] #leistungen .has-mode-video .card-media-image,
body[data-site-mode="chaos"] #leistungen .has-mode-video .card-media-image{opacity:.06}

body[data-site-mode="action"] #leistungen .card{
  border-color:rgba(189,214,233,.42);
  box-shadow:0 24px 48px rgba(10,20,34,.32), inset 0 0 0 1px rgba(210,222,236,.08);
}
body[data-site-mode="action"] #leistungen .card::before{
  background:
    linear-gradient(180deg,rgba(245,247,250,.10),rgba(24,31,39,.02)),
    repeating-linear-gradient(180deg,rgba(245,247,250,.14) 0 3px,rgba(20,24,30,0) 3px 24px),
    radial-gradient(circle at 72% -10%,rgba(196,214,231,.22),transparent 46%);
  opacity:.72;
}
body[data-site-mode="action"] #leistungen .service-card-link::after{
  inset:0 auto 0 -46%;
  width:38%;
  height:auto;
  background:linear-gradient(102deg,transparent,rgba(255,255,255,.22),transparent);
  transform:skewX(-18deg);
  opacity:.78;
  animation:v7-action-card-sheen 2.8s ease-in-out infinite;
}
body[data-site-mode="action"] #leistungen .card img{
  filter:contrast(1.06) saturate(1.02);
}
body[data-site-mode="action"] #leistungen .card-media::before{background:linear-gradient(180deg,rgba(240,244,248,.14),rgba(18,22,28,.06) 36%,rgba(18,22,28,.12));opacity:.88}
body[data-site-mode="action"] #leistungen .card-media-video{filter:saturate(.92) contrast(1.04) brightness(1.02)}

body[data-site-mode="chaos"] #leistungen .card{
  border-color:rgba(255,193,111,.36);
  box-shadow:0 28px 54px rgba(95,24,0,.28),0 0 0 1px rgba(255,194,122,.14), inset 0 0 0 1px rgba(255,244,212,.06);
  animation:v7-chaos-card-drift 4.8s ease-in-out infinite;
}
body[data-site-mode="chaos"] #leistungen .card:nth-child(2n){animation-delay:-1.2s}
body[data-site-mode="chaos"] #leistungen .card:nth-child(3n){animation-delay:-2.4s}
body[data-site-mode="chaos"] #leistungen .card::before{
  background:
    linear-gradient(135deg,rgba(255,132,0,.12),rgba(255,0,140,.08) 44%,rgba(255,228,96,.14) 100%),
    radial-gradient(circle at 80% -20%,rgba(255,188,88,.28),transparent 42%);
  opacity:.9;
}
body[data-site-mode="chaos"] #leistungen .service-card-link::after{
  inset:-10% -20% auto -20%;
  height:62%;
  background:linear-gradient(90deg,rgba(255,105,0,.00),rgba(255,172,51,.24),rgba(255,68,0,.00));
  opacity:.84;
  animation:v7-chaos-card-flare 2.6s ease-in-out infinite;
}
body[data-site-mode="chaos"] #leistungen .card img{
  filter:saturate(1.18) contrast(1.08) brightness(1.02);
  animation:v7-chaos-card-zoom 5.2s ease-in-out infinite;
}
body[data-site-mode="chaos"] #leistungen .card-media::before{background:linear-gradient(135deg,rgba(255,121,0,.18),rgba(255,0,132,.08) 44%,rgba(255,214,74,.12));opacity:.92}
body[data-site-mode="chaos"] #leistungen .card-media-video{filter:saturate(1.28) contrast(1.08) brightness(1.04) hue-rotate(-7deg);animation:v7-chaos-video-pulse 4.6s ease-in-out infinite}

@keyframes v7-action-card-sheen{
  0%{transform:translateX(-8%) skewX(-18deg);opacity:0}
  22%{opacity:.62}
  50%{transform:translateX(280%) skewX(-18deg);opacity:.78}
  78%{opacity:.08}
  100%{transform:translateX(320%) skewX(-18deg);opacity:0}
}
@keyframes v7-chaos-card-drift{
  0%,100%{transform:translateY(-4px) rotateZ(0deg)}
  30%{transform:translateY(-10px) rotateZ(.35deg)}
  60%{transform:translateY(-6px) rotateZ(-.4deg)}
}
@keyframes v7-chaos-card-flare{
  0%,100%{transform:translateY(0) scaleX(.88);opacity:.24}
  45%{transform:translateY(6px) scaleX(1.08);opacity:.82}
  70%{transform:translateY(2px) scaleX(.96);opacity:.54}
}
@keyframes v7-chaos-card-zoom{
  0%,100%{transform:scale(1.01)}
  40%{transform:scale(1.04)}
  70%{transform:scale(1.02)}
}
@keyframes v7-chaos-video-pulse{
  0%,100%{transform:scale(1.02)}
  50%{transform:scale(1.06)}
}

.section h2{position:relative;display:inline-block}
.section h2::after{content:"";display:block;margin-top:.45rem;height:3px;width:68%;background:linear-gradient(90deg,#5ca7ff,#64ecff);border-radius:99px;opacity:.75}

.review-mini{transition:transform .2s ease,border-color .2s ease}
.review-mini:hover{transform:translateY(-2px);border-color:rgba(151,220,255,.42)}

#googleReviewsList{scrollbar-width:thin;scrollbar-color:#63c9ff rgba(255,255,255,.06)}
#googleReviewsList::-webkit-scrollbar{width:10px}
#googleReviewsList::-webkit-scrollbar-track{background:rgba(255,255,255,.06);border-radius:99px}
#googleReviewsList::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#59a8ff,#62e9ff);border-radius:99px}

.reveal{opacity:0;transform:translateY(12px);transition:opacity .34s ease,transform .34s ease;will-change:opacity,transform}
.reveal.in{opacity:1;transform:none}

.siggi-toggle{background:linear-gradient(120deg,#2f6fff,#58e0ff);box-shadow:0 14px 30px rgba(39,118,225,.4)}

@media (max-width:760px){
  .hero{min-height:auto;padding-top:14px}
  .hero .img-wrap{min-height:620px}
  .hero .img-wrap img{min-height:620px}
  .hero-copy{left:14px;right:14px;bottom:14px;max-width:none}
  .hero-copy h1{font-size:clamp(1.72rem,9.6vw,2.55rem);line-height:1.02;margin:.18rem 0 .55rem}
  .hero-copy p{font-size:1rem;line-height:1.45}
  .hero-copy .eyebrow{font-size:.68rem;letter-spacing:.18em}
  .cards{gap:14px}
}

@media (prefers-reduced-motion: reduce){
  .v2-bg,.btn-primary::after{animation:none!important}
  .reveal,.card,.stat,.card img{transition:none!important}
}

/* 2026-03-17 OS/SO harmonization: remove blue cast, unify to green accents */
body[data-theme="os"] .v2-bg,
body[data-theme="so"] .v2-bg{
  background:
    radial-gradient(circle at 12% 15%, rgba(63,181,96,.22), transparent 30%),
    radial-gradient(circle at 82% 20%, rgba(115,230,145,.14), transparent 28%),
    radial-gradient(circle at 50% 120%, rgba(32,146,77,.22), transparent 38%),
    linear-gradient(180deg,#0a2015 0%, #07170f 52%, #050f0a 100%) !important;
}
body[data-theme="os"] .head nav a::after,
body[data-theme="so"] .head nav a::after,
body[data-theme="os"] .section h2::after,
body[data-theme="so"] .section h2::after{
  background:linear-gradient(90deg,#2aa556,#63df8a) !important;
}
body[data-theme="os"] .hero .img-wrap,
body[data-theme="so"] .hero .img-wrap{
  box-shadow:0 28px 60px rgba(5,18,11,.55),0 0 0 1px rgba(90,220,130,.24) !important;
}
body[data-theme="os"] .hero .img-wrap::before,
body[data-theme="so"] .hero .img-wrap::before{
  background:conic-gradient(from 180deg at 50% 50%, rgba(63,181,96,.18), rgba(115,230,145,.08), rgba(32,146,77,.16), rgba(63,181,96,.18)) !important;
}
body[data-theme="os"] .hero-copy h1,
body[data-theme="so"] .hero-copy h1{
  background:linear-gradient(180deg,#f6fff8 0%,#c9f3d7 46%,#78e39d 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}
body[data-theme="os"] .hero-copy .eyebrow,
body[data-theme="so"] .hero-copy .eyebrow{color:#bfeecf !important}

body[data-theme="os"] .stat,
body[data-theme="so"] .stat{box-shadow:0 0 0 1px rgba(90,220,130,.25),0 20px 45px rgba(18,90,45,.25) !important}
body[data-theme="os"] .stat:hover,
body[data-theme="so"] .stat:hover{box-shadow:0 0 0 1px rgba(90,220,130,.35),0 28px 50px rgba(18,90,45,.3) !important}
body[data-theme="os"] .card::before,
body[data-theme="so"] .card::before{background:radial-gradient(circle at 80% -20%,rgba(90,220,130,.18),transparent 42%) !important}
body[data-theme="os"] .card:hover,
body[data-theme="so"] .card:hover{border-color:rgba(90,220,130,.42) !important;box-shadow:0 22px 45px rgba(8,45,24,.35) !important}

body[data-theme="os"] .review-mini:hover,
body[data-theme="so"] .review-mini:hover{border-color:rgba(90,220,130,.42) !important}
body[data-theme="os"] #googleReviewsList,
body[data-theme="so"] #googleReviewsList{scrollbar-color:#59cf7e rgba(255,255,255,.06) !important}
body[data-theme="os"] #googleReviewsList::-webkit-scrollbar-thumb,
body[data-theme="so"] #googleReviewsList::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#2aa556,#63df8a) !important}

body[data-theme="os"] .siggi-toggle,
body[data-theme="so"] .siggi-toggle,
body[data-theme="os"] .sticky-cta .call,
body[data-theme="so"] .sticky-cta .call,
body[data-theme="os"] .sticky-cta .msg,
body[data-theme="so"] .sticky-cta .msg,
body[data-theme="os"] .review-btn,
body[data-theme="so"] .review-btn{
  background:linear-gradient(120deg,#1f9f56,#37d66b) !important;
  color:#fff !important;
  box-shadow:0 14px 30px rgba(31,159,86,.35) !important;
}