/* ============================================================
   getyoursite system layer
   Shared tokens, shell, navigation, CTA, footer and page headers.
   Loaded last so page-specific styles cannot fragment the system.
   ============================================================ */

:root {
  --sys-white:#fff;
  --sys-paper:#fff;
  --sys-soft:#f4f6fb;
  --sys-soft-blue:#eaf0ff;
  --sys-ink:#0b0c10;
  --sys-ink-2:#242730;
  --sys-muted:#686e7a;
  --sys-blue:#2368f5;
  --sys-blue-dark:#1552cf;
  --sys-line:rgba(11,12,16,.13);
  --sys-line-dark:rgba(255,255,255,.15);
  --sys-gutter:clamp(24px,4.5vw,72px);
  --sys-frame:1440px;
  --sys-section:clamp(88px,9vw,144px);
  --sys-page-title:clamp(46px,5.35vw,76px);
  --sys-section-title:clamp(36px,4.5vw,64px);
  --sys-body-lg:clamp(18px,1.45vw,20px);
  --sys-body:clamp(15px,1.1vw,17px);
  --sys-label:clamp(10px,.72vw,11px);
  --sys-r-sm:8px;
  --sys-r-md:12px;
  --sys-ease:cubic-bezier(.22,.72,.19,1);
  --sys-fast:180ms;
  --sys-normal:280ms;
  --sys-shadow:0 24px 70px rgba(11,12,16,.1);
}

body.site-shell {
  background:var(--sys-paper);
  color:var(--sys-ink);
}

body.site-shell canvas.aurora { display:none; }
.sr-only { 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; }

.site-frame {
  width:min(var(--sys-frame),100%);
  margin-inline:auto;
  padding-inline:var(--sys-gutter);
}

.site-eyebrow,
.site-shell .kicker,
.site-shell .p-eyebrow,
.site-shell .p-section-label {
  font-size:var(--sys-label);
  font-weight:720;
  letter-spacing:.14em;
  line-height:1.25;
  text-transform:uppercase;
}

.site-shell h1,
.site-shell .page-hero h1,
.site-shell .svc-intro h1,
.site-shell .ref-intro h1,
.site-shell .ref-intro h2,
.site-shell .ab-intro h1,
.site-shell .ab-intro h2,
.site-shell .blog-hero h1,
.site-shell .art-hero h1,
.site-shell .contact h1 {
  max-width:1180px;
  font-size:var(--sys-page-title);
  font-weight:540;
  letter-spacing:-.062em;
  line-height:.96;
}

.site-shell h2,
.site-shell .head h2 {
  font-size:var(--sys-section-title);
  letter-spacing:-.052em;
  line-height:.98;
}

.site-shell p,
.site-shell li { text-wrap:pretty; }

.site-shell .title-lock>span { display:block; width:max-content; max-width:100%; white-space:nowrap; }

.site-shell :focus-visible {
  outline:2px solid var(--sys-blue);
  outline-offset:4px;
}

/* Shared navigation */
.site-nav,
.site-shell .site-nav,
.site-shell .site-nav.scrolled {
  position:fixed;
  inset:0 0 auto;
  z-index:1000;
  min-height:72px;
  /* Ultra-Wide: die Leiste bleibt randlos, ihr Inhalt richtet sich aber an
     derselben zentrierten 1440er-Spalte aus wie der Seiteninhalt. Unter
     ~1588px greift weiterhin die Gutter-Breite, das Layout bleibt dort gleich. */
  padding:12px max(var(--sys-gutter), calc((100% - var(--sys-frame)) / 2));
  display:grid;
  grid-template-columns:minmax(165px,.72fr) auto minmax(270px,.92fr);
  align-items:center;
  gap:28px;
  background:#fff;
  border-bottom:1px solid var(--sys-line);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:transform var(--sys-normal) var(--sys-ease),border-color var(--sys-fast) ease;
}

.site-nav.nav-hidden { transform:translateY(calc(-100% - 2px)); }
.site-nav.open,
.site-nav:focus-within { transform:none; }

.site-brand,
.site-shell .site-brand {
  justify-self:start;
  display:inline-flex;
  align-items:center;
  gap:11px;
  color:var(--sys-ink)!important;
  font-size:19px!important;
  font-weight:720!important;
  letter-spacing:-.045em!important;
}

.site-brand img { width:34px; height:34px; flex:0 0 auto; }

.site-nav__links {
  justify-self:center;
  display:flex;
  align-items:center;
  gap:clamp(16px,1.75vw,28px);
}

.site-nav__link,
.site-shell .site-nav__link.nl {
  position:relative;
  padding:10px 0;
  color:var(--sys-ink)!important;
  font-size:10px!important;
  font-weight:720!important;
  letter-spacing:.13em!important;
  line-height:1!important;
  text-transform:uppercase;
}

.site-nav__link::after {
  content:"";
  position:absolute;
  inset:auto 0 3px;
  width:0;
  height:1px;
  background:var(--sys-blue);
  transition:width var(--sys-normal) var(--sys-ease);
}

.site-nav__link:hover::after,
.site-nav__link.is-active::after,
.site-nav__link[aria-current="page"]::after { width:100%; }

.site-nav__actions {
  justify-self:end;
  display:flex;
  align-items:center;
  gap:14px;
}

.site-nav__login,
.site-shell .site-nav__login.nav-login {
  width:auto;
  height:auto;
  min-height:36px;
  padding:0 3px;
  border:0;
  border-radius:0;
  color:var(--sys-ink)!important;
  font-size:10px;
  font-weight:720;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.site-nav__contact.is-active,
.site-nav__contact[aria-current="page"] { color:var(--sys-blue)!important; }

.site-button,
.site-shell .site-button.btn {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:48px;
  padding:0 24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid transparent;
  border-radius:999px;
  font-size:14px;
  font-weight:650;
  letter-spacing:-.01em;
  line-height:1;
  transition:color var(--sys-fast) ease,border-color var(--sys-fast) ease,transform var(--sys-normal) var(--sys-ease);
}

.site-button::before,
.site-shell .btn::before,
.site-shell .p-button::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-1px;
  background:var(--sys-ink);
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform 520ms var(--sys-ease);
}
.site-button:hover::before,
.site-button:focus-visible::before,
.site-shell .btn:hover::before,
.site-shell .btn:focus-visible::before,
.site-shell .p-button:hover::before,
.site-shell .p-button:focus-visible::before { transform:scaleX(1); transform-origin:left center; }
.site-shell .btn,
.site-shell .p-button { position:relative; isolation:isolate; overflow:hidden; }
.site-shell .btn>*,
.site-shell .p-button>* { position:relative; z-index:1; }
.site-shell .btn--ghost::before,
.site-shell .btn--primary::before,
.site-shell .site-button--secondary::before { background:var(--sys-blue); }
.site-shell .btn:hover,
.site-shell .p-button:hover { color:#fff; }

.site-shell .btn--brand,
.site-shell .btn--brand *,
.site-shell .btn--primary,
.site-shell .btn--primary *,
.site-shell .p-button--primary,
.site-shell .p-button--primary *,
.site-shell .site-button--primary,
.site-shell .site-button--primary * { color:#fff!important; }

.site-button:hover { transform:translateY(-1px); }
.site-button--small,
.site-shell .site-button--small.btn { min-height:42px; padding-inline:20px; font-size:13px; }
.site-button--primary,
.site-shell .site-button--primary.btn { background:var(--sys-blue); color:#fff; }
.site-button--primary:hover { background:var(--sys-blue); }
.site-button--secondary,
.site-shell .site-button--secondary.btn { background:transparent; border-color:rgba(255,255,255,.34); color:#fff; }
.site-button--secondary:hover { border-color:#fff; }

/* Stable labels, precise motion. Text links receive an underline sweep and
   arrows move just enough to confirm direction. */
.site-shell a.has-link-hover { transition:color var(--sys-fast) ease,transform var(--sys-normal) var(--sys-ease),opacity var(--sys-fast) ease,background-size var(--sys-normal) var(--sys-ease); }
.site-shell a.has-link-hover:not(.site-button):not(.btn):not(.p-button):not(.site-cta__statement):not(.site-nav__link):not(.site-brand):not(.site-footer__brand) {
  background-image:linear-gradient(currentColor,currentColor);
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:0 1px;
}
.site-shell a.has-link-hover:not(.site-button):not(.btn):not(.p-button):not(.site-cta__statement):not(.site-nav__link):not(.site-brand):not(.site-footer__brand):hover,
.site-shell a.has-link-hover:not(.site-button):not(.btn):not(.p-button):not(.site-cta__statement):not(.site-nav__link):not(.site-brand):not(.site-footer__brand):focus-visible { color:var(--link-hover-color, var(--sys-blue)); background-size:100% 1px; }
.site-shell a .arr,
.site-shell a .text-arrow { transition:transform 360ms var(--sys-ease); }
.site-shell a:hover .arr,
.site-shell a:hover .text-arrow { transform:translate(3px,-2px); }
.site-nav .site-brand,
.site-nav .site-brand:hover,
.site-nav .site-brand:focus-visible { background-image:none!important; background-size:0!important; transform:none; }

/* Systemisch: auf dunklen/farbigen Flaechen faerbt der Link-Hover weiss statt blau,
   damit er nie mit dem Hintergrund verschmilzt. Helle Sektionen bleiben beim blauen Standard. */
.site-cta,
.site-footer,
.page-contact-premium .contact-direct,
.page-references-premium,
.page-services-premium .aurora-host:first-of-type,
.comparison-models,
.p-attitude,
.p-work-curtain { --link-hover-color: #fff; }

/* Pfeil ersetzen: Pill-Buttons bekommen die drei Marken-Punkte (Logo-Motiv), Links/Statements zeigen keinen Pfeil */
.site-shell .text-arrow{display:none}
.site-shell .p-button .text-arrow,
.site-shell .btn--brand .arr{
  display:inline-block;width:20px;height:6px;font-size:0;line-height:0;vertical-align:middle;margin:0;
  background-image:
    radial-gradient(circle at 3px 50%,currentColor 2.6px,transparent 3px),
    radial-gradient(circle at 10px 50%,currentColor 2.6px,transparent 3px),
    radial-gradient(circle at 17px 50%,currentColor 2.6px,transparent 3px);
  background-repeat:no-repeat;
  transition:transform 420ms var(--sys-ease);
}
.site-shell .p-button:hover .text-arrow,
.site-shell .btn--brand:hover .arr{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){
  .site-shell .p-button:hover .text-arrow,
  .site-shell .btn--brand:hover .arr{transform:none}
}

.site-nav .burger {
  width:36px;
  height:36px;
  margin:0;
  padding:6px;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.site-nav .burger i { width:25px; height:1.5px; background:var(--sys-ink)!important; }

/* Language switcher overrides injected runtime styles. */
.site-nav #gys-lang { margin:0!important; color:var(--sys-ink)!important; }
.site-nav #gys-lang>button {
  min-height:36px!important;
  padding:0 11px!important;
  border:1px solid var(--sys-line)!important;
  border-radius:999px!important;
  color:var(--sys-ink)!important;
  background:#fff!important;
  font-size:10px!important;
  font-weight:720!important;
  letter-spacing:.1em!important;
}
.site-nav #gys-lang>button:hover { border-color:var(--sys-ink)!important; }
.site-nav #gys-lang ul { top:calc(100% + 12px)!important; border-radius:var(--sys-r-sm)!important; }

/* Shared mobile navigation */
.site-mobile-menu,
.site-shell .site-mobile-menu.mobile-menu {
  position:fixed;
  inset:0;
  z-index:999;
  padding:92px 24px 22px;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto 1fr auto;
  gap:22px;
  overflow:auto;
  background:var(--sys-ink);
  color:#fff;
  overscroll-behavior:contain;
  transform:translateX(100%);
  visibility:hidden;
  pointer-events:none;
  transition:transform 480ms var(--sys-ease),visibility 480ms;
}

.site-mobile-menu.open,
.site-shell .site-mobile-menu.mobile-menu.open { transform:none; visibility:visible; pointer-events:auto; }
.site-mobile-menu__meta { display:flex; justify-content:space-between; color:#7f8798; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.site-mobile-menu__links,
.site-shell .site-mobile-menu__links.mobile-menu__links {
  align-self:start;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border-top:1px solid var(--sys-line-dark);
}

.site-mobile-menu__links a,
.site-shell .site-mobile-menu__links a {
  min-height:56px;
  padding:10px 0;
  display:grid;
  grid-template-columns:24px 1fr;
  align-content:center;
  gap:7px;
  border-bottom:1px solid var(--sys-line-dark);
  color:#fff!important;
  font-size:clamp(21px,5.4vw,27px)!important;
  font-weight:520!important;
  letter-spacing:-.04em!important;
  line-height:1!important;
}
.site-mobile-menu__links a::after { display:none!important; }
.site-mobile-menu__links a.has-link-hover,
.site-shell .site-mobile-menu__links a.has-link-hover { background-image:none!important; }
.site-mobile-menu__links small { align-self:center; color:#727989; font-size:9px; font-weight:700; letter-spacing:.1em; }
.site-mobile-menu__links a.is-active span,
.site-mobile-menu__links a[aria-current="page"] span { color:#78a3ff; }
.site-mobile-menu__actions { position:sticky; bottom:0; display:grid; grid-template-columns:1fr auto; gap:10px; padding-top:12px; background:var(--sys-ink); }
.site-mobile-menu__actions .site-button { width:100%; font-size:13px!important; font-weight:650!important; letter-spacing:-.01em!important; }
.site-mobile-menu__login { min-width:96px; display:inline-flex; align-items:center; justify-content:center; color:#fff!important; border:1px solid rgba(255,255,255,.24); border-radius:999px; font-size:13px!important; font-weight:650!important; letter-spacing:-.01em!important; }

.site-cta {
  padding:clamp(84px,8vw,124px) 0 22px;
  background:var(--sys-ink);
  color:#fff;
}
.site-cta .site-eyebrow { color:#8f96a5; }
.site-cta__statement {
  --cta-x:82%;
  --cta-y:50%;
  position:relative;
  overflow:hidden;
  margin-top:clamp(22px,3vw,42px);
  padding:clamp(24px,2.6vw,38px) 12px clamp(30px,3vw,44px) 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  border-top:1px solid var(--sys-line-dark);
  border-bottom:1px solid var(--sys-line-dark);
  color:#fff;
  font-size:clamp(64px,10.4vw,150px);
  font-weight:500;
  letter-spacing:-.078em;
  line-height:.82;
}
.site-cta__statement::before{content:"";position:absolute;z-index:0;inset:0;background:var(--sys-blue);clip-path:circle(0 at var(--cta-x) var(--cta-y));transition:clip-path 760ms var(--sys-ease)}
.site-cta__statement:hover::before{clip-path:circle(145% at var(--cta-x) var(--cta-y))}
.site-cta__statement>span{position:relative;z-index:1}
.site-cta__statement span:last-child { flex:0 0 auto; color:#79a4ff; font-size:.48em; font-weight:400; transition:transform 420ms var(--sys-ease),color 300ms ease; }
.site-cta__statement:hover span:last-child{color:#fff}
.site-cta__statement:hover span:last-child { transform:translate(5px,-5px); }
.text-arrow{font-family:Arial,sans-serif!important;font-variant-emoji:text!important;font-style:normal}
.site-cta__meta {
  padding-top:20px;
  display:grid;
  grid-template-columns:1fr 1.2fr auto;
  gap:20px 40px;
  color:#8991a0;
  font-size:10px;
  font-weight:700;
  letter-spacing:.11em;
  line-height:1.4;
  text-transform:uppercase;
}
.site-cta__meta a { color:#fff; }

/* Shared compact footer */
.site-footer,
.site-shell .site-footer {
  margin:0!important;
  padding:64px 0 24px;
  background:var(--sys-ink);
  color:#fff;
}
.site-footer__grid { display:grid; grid-template-columns:1.45fr repeat(3,minmax(120px,.65fr)); gap:42px 68px; }
.site-footer__brand { display:inline-flex; align-items:center; gap:11px; color:#fff; font-size:19px; font-weight:720; letter-spacing:-.045em; }
.site-footer__brand img { width:34px; height:34px; }
.site-footer__intro p { max-width:340px; margin:22px 0 0; color:#969dac; font-size:12px; line-height:1.7; }
.site-footer h3 { margin:8px 0 20px; color:#7d8596; font-size:9px; font-weight:720; letter-spacing:.14em; text-transform:uppercase; }
.site-footer__col { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.site-footer__col a,
.site-footer__col span { color:#fff; font-size:11px; line-height:1.45; }
.site-footer__col a { transition:color var(--sys-fast) ease; }
.site-footer__col a:hover { color:#79a4ff; }
.site-footer__bottom { margin-top:64px; padding-top:20px; display:flex; justify-content:space-between; gap:24px; border-top:1px solid var(--sys-line-dark); color:#747c8d; font-size:9px; }
.site-footer__legal { display:flex; gap:24px; }

/* Header types */
.site-shell .page-hero,
.site-shell .ref-intro,
.site-shell .ab-intro,
.site-shell .blog-hero,
.site-shell .art-hero,
.site-shell .contact { border-bottom:1px solid var(--sys-line); }

/* Editorial: text and one meaningful visual signal, not a generic card template. */
.page-services-premium .aurora-host:first-of-type { min-height:82vh; background:var(--sys-ink); }
.page-services-premium .aurora-host:first-of-type::after { background:linear-gradient(90deg,rgba(11,12,16,.08),rgba(11,12,16,.45)); }
.page-services-premium .svc-intro { padding-top:clamp(146px,14vw,190px); padding-bottom:clamp(78px,8vw,110px); grid-template-columns:minmax(0,1fr)!important; }
.page-services-premium .svc-intro .head { max-width:1180px; }
.page-services-premium .svc-intro h1 { font-size:var(--sys-page-title); }
.page-services-premium .svc-stagewrap { height:auto!important; }
.page-services-premium .svc-stage { position:relative!important; top:auto!important; height:auto!important; overflow:visible!important; display:block!important; background:#fff!important; }
.page-services-premium .svc-stage::before { display:none!important; }
.page-services-premium .svc-stage-inner { height:auto!important; }
.page-services-premium .svc-panel {
  position:relative!important;
  inset:auto!important;
  padding:var(--sys-section) 0!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
  border-top:1px solid var(--sys-line)!important;
}
.page-services-premium .svc-panel:first-child { border-top:0!important; }
.page-services-premium .svc-dots { display:none!important; }

.page-about-premium .ab-intro .container,
.page-blog-premium .blog-hero .container { grid-template-columns:minmax(0,1fr)!important; }
.page-about-premium .ab-intro h1 { max-width:1180px; font-size:clamp(46px,4.8vw,68px); }
.page-about-premium .ab-intro .container::after,
.page-blog-premium .blog-hero .container::after { display:none!important; }

/* Collection: concise intro, then work begins immediately. */
.page-references-premium .ref-intro { min-height:70vh; padding-top:clamp(138px,13vw,180px); padding-bottom:clamp(62px,6vw,86px); }
.page-references-premium .ref-intro .container { grid-template-columns:minmax(0,1fr)!important; }
.page-references-premium .ref-intro .container::after { display:none!important; }
.page-references-premium .ref-stage { padding-top:clamp(56px,6vw,88px); }
.page-references-premium .ref-rows { gap:clamp(84px,9vw,132px); }
.page-references-premium .sc-frame { border-radius:var(--sys-r-sm); box-shadow:none; }
.page-references-premium .sc-prev img { width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; object-position:top center; background:#fff; }

/* Decision: action or model, not a decorative generic split. */
.page-pricing-premium .page-hero,
.page-comparison-premium .page-hero { min-height:68vh; padding-top:clamp(142px,13vw,180px); padding-bottom:clamp(68px,7vw,96px); grid-template-columns:minmax(0,1fr)!important; }
.page-pricing-premium .page-hero::after,
.page-comparison-premium .page-hero::after { display:none!important; }
.page-services-premium .svc-intro::after { display:none!important; }
/* Bottom-anchored als Block: Luft sitzt ueber dem Kicker, nicht mitten im Inhalt. */
.page-pricing-premium .page-hero { min-height:92vh; align-content:end; grid-template-rows:auto auto auto; }
.pricing-hero-choice {
  width:100%;
  margin-top:clamp(48px,7vh,84px);
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid var(--sys-line);
}
.pricing-hero-choice a { min-height:132px; padding:22px 24px 20px 0; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto 1fr; gap:10px 24px; border-bottom:1px solid var(--sys-line); color:var(--sys-ink); transition:padding var(--sys-normal) var(--sys-ease),background var(--sys-fast) ease; }
.pricing-hero-choice a + a { padding-left:28px; border-left:1px solid var(--sys-line); }
.pricing-hero-choice a:hover { padding-left:16px; background:var(--sys-soft); }
.pricing-hero-choice span { font-size:clamp(28px,3.4vw,50px); font-weight:540; letter-spacing:-.055em; line-height:1; }
.pricing-hero-choice small { align-self:end; color:var(--sys-muted); font-size:11px; }
.pricing-hero-choice b { align-self:end; color:var(--sys-blue); font-size:clamp(19px,1.9vw,27px); font-weight:640; letter-spacing:-.035em; white-space:nowrap; }
.page-pricing-premium .pricing-detail-noise { display:none; }
.page-contact-premium .contact {
  width:100%;
  max-width:none;
  min-height:100vh;
  margin:0;
  padding:clamp(132px,12vw,174px) var(--sys-gutter) clamp(78px,8vw,118px);
  grid-template-columns:minmax(0,.9fr) minmax(430px,.72fr);
  gap:clamp(46px,8vw,130px);
  background:var(--sys-ink);
  color:#fff;
}
.page-contact-premium .contact-copy { max-width:690px; }
.page-contact-premium .contact h1 { max-width:760px; color:#fff; }
.page-contact-premium .contact .kicker { color:#78a3ff; }
.page-contact-premium .contact .c-sub { max-width:610px; color:#b1b7c3; }
.page-contact-premium .contact-points span { border-color:rgba(255,255,255,.2); color:#d7dbe3; background:transparent; }
.page-contact-premium .contact-direct { margin-top:clamp(34px,5vw,60px); padding:clamp(26px,3vw,42px); border:0; border-radius:0; background:var(--sys-blue); color:#fff; }
.page-contact-premium .contact-direct h3 { margin:20px 0 8px; color:#fff; font-size:clamp(28px,3vw,44px); letter-spacing:-.05em; }
.page-contact-premium .contact-direct p { max-width:430px; color:rgba(255,255,255,.76); }
.page-contact-premium .contact-direct a { display:inline-flex; margin-top:18px; color:#fff; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.contact-route { color:rgba(255,255,255,.72); font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.page-contact-premium .form-card { padding:clamp(30px,4vw,58px); border:0; border-radius:0; background:#fff; box-shadow:none; }
.page-contact-premium .form-card .field input,
.page-contact-premium .form-card .field textarea,
.page-contact-premium .form-card .field select { padding:15px 0; border:0; border-bottom:1px solid var(--sys-line); border-radius:0; box-shadow:none; }
.page-contact-premium .form-card .field input:focus,
.page-contact-premium .form-card .field textarea:focus,
.page-contact-premium .form-card .field select:focus { border-color:var(--sys-blue); box-shadow:none; }
.page-contact-premium .form-card .btn { min-height:54px; border-radius:999px; }
.page-contact-premium .contact-side { grid-column:1; }
.page-contact-premium .c-alt { margin-top:0; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 34px; }
.page-contact-premium .c-alt .row { border-color:rgba(255,255,255,.16); }
.page-contact-premium .c-alt .row .k { color:#747d8f; }
.page-contact-premium .c-alt .row .v { color:#fff; }
.page-contact-premium .contact-fit { display:none; }

/* Work collection hero — an intentional Cipher-style orbit using real project views. */
.page-references-premium .site-nav:not(.scrolled) { background:#050505; border-color:rgba(255,255,255,.14); }
.page-references-premium .site-nav:not(.scrolled) .site-brand,
.page-references-premium .site-nav:not(.scrolled) .site-nav__link,
.page-references-premium .site-nav:not(.scrolled) .site-nav__login { color:#fff!important; }
.page-references-premium .site-nav:not(.scrolled) .site-brand img { filter:brightness(0) invert(1); }
.page-references-premium .site-nav:not(.scrolled) #gys-lang>button { color:#fff!important; background:#050505!important; border-color:rgba(255,255,255,.25)!important; }
.page-references-premium .site-nav:not(.scrolled) .burger i { background:#fff!important; }
.ref-cipher-hero {
  position:relative;
  min-height:100vh;
  overflow:hidden;
  background:#050505;
  color:#fff;
  isolation:isolate;
}

/* The work collection is a viewport interaction, not a document scroll. */
.page-references-premium{height:100dvh;overflow:hidden;background:#050505}
.page-references-premium .ref-stage,
.page-references-premium .site-cta,
.page-references-premium .site-footer,
.page-references-premium #cookie-bar{display:none!important}
.page-references-premium .ref-cipher-hero{height:100dvh;min-height:0}
.ref-cipher-hero__collage [data-cipher-card]{animation:none;transition:none}
/* Die Karten sind Links, aber Teil der animierten Buehne: das globale
   Link-Hover-System (transform/opacity-Transition + Unterstrich-Sweep aus
   has-link-hover) wuerde die per-Frame-Rotation traege nachziehen. */
.site-shell .ref-cipher-hero__collage a.has-link-hover{transition:none;background-image:none!important}
.ref-cipher-hero__collage.is-ready [data-cipher-card]{opacity:1}

/* Services use four different entrance directions in normal document flow. */
@media(min-width:901px){
  .page-services-premium .svc-stagewrap{height:auto!important}
  .page-services-premium .svc-stage{position:relative!important;top:auto!important;height:auto!important;overflow:visible!important;display:block!important}
  .page-services-premium .svc-stage-inner{height:auto!important}
  .page-services-premium .svc-panel{position:relative!important;inset:auto!important;padding:clamp(104px,11vw,168px) 0!important;opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto!important;border-top:1px solid var(--sys-line)!important}
  .page-services-premium .svc-panel:first-child{border-top:0!important}
  .page-services-premium .svc-dots{display:none!important}
}
.page-services-premium .svc-panel .svc-copy,
.page-services-premium .svc-panel .svc-card{opacity:0;transition:opacity 850ms var(--sys-ease),transform 1050ms var(--sys-ease),clip-path 1050ms var(--sys-ease)}
.page-services-premium .svc-panel:nth-child(odd) .svc-copy{transform:translateX(-56px)}
.page-services-premium .svc-panel:nth-child(even) .svc-copy{transform:translateX(56px)}
.page-services-premium .svc-panel .svc-card{transform:translateY(54px);clip-path:inset(12% 0 0 0)}
.page-services-premium .svc-panel.is-motion-in .svc-copy,
.page-services-premium .svc-panel.is-motion-in .svc-card{opacity:1;transform:none;clip-path:inset(0)}
.page-services-premium .svc-panel::after{content:attr(data-n);position:absolute;z-index:-1;right:var(--sys-gutter);top:9%;color:rgba(35,104,245,.055);font-size:clamp(140px,22vw,340px);font-weight:650;letter-spacing:-.09em;line-height:.7;pointer-events:none}
@media(max-width:900px){
  .page-services-premium .svc-panel .svc-copy,
  .page-services-premium .svc-panel .svc-card{opacity:1;transform:none!important;clip-path:none}
  .page-services-premium .svc-panel::after{display:none}
}

/* The founder image grows from a precise focal point into its final frame. */
.page-about-premium .fdr-hero[data-about-grow]{--about-progress:0;transform:scale(calc(.22 + var(--about-progress)*.78));transform-origin:50% 50%;opacity:calc(.25 + var(--about-progress)*.75);border-radius:calc(38px - var(--about-progress)*28px);will-change:transform,opacity,border-radius}
.page-about-premium .fdr-hero[data-about-grow] .fdr-cap{opacity:var(--about-caption,0);transform:translateY(calc((1 - var(--about-progress))*18px));transition:opacity 120ms linear;will-change:opacity,transform}
.brand-highlight{color:var(--sys-blue)}

/* Pricing mode jump, calmer plan assembly and visible add-ons. */
.page-pricing-premium .pricing-addons{display:block!important;background:#fff}
.page-pricing-premium .cmp thead th.col-hot{background:var(--sys-blue)!important;color:#fff!important}
.page-pricing-premium .cmp thead th.col-hot small{color:rgba(255,255,255,.78)!important}
.page-pricing-premium .cmp thead th.col-hot small b{color:#fff!important}
.page-pricing-premium .plans.is-pricing-in .plan{opacity:1;transform:none}
.page-pricing-premium .plans .plan{opacity:0;transform:translateY(34px);transition:opacity 650ms var(--sys-ease),transform 800ms var(--sys-ease)}
.page-pricing-premium .plans .plan:nth-child(2){transition-delay:70ms}
.page-pricing-premium .plans .plan:nth-child(3){transition-delay:140ms}
.page-pricing-premium .plans .plan:nth-child(4){transition-delay:210ms}

/* Journal index: one clear lead story followed by an editorial article index. */
.page-blog-premium .blog-hero{padding:clamp(148px,15vw,210px) 0 clamp(72px,8vw,112px);background:#fff}
.page-blog-premium .blog-hero .container{max-width:1180px;padding-inline:var(--sys-gutter)}
.page-blog-premium .blog-hero .kicker{color:var(--sys-blue)}
.page-blog-premium .blog-hero h1{max-width:980px;margin:28px 0 26px;font-size:var(--sys-page-title);font-weight:540;letter-spacing:-.062em;line-height:.96}
.page-blog-premium .blog-hero p{max-width:640px;color:var(--sys-muted);font-size:var(--sys-body-lg);line-height:1.55}
.page-blog-premium .blog-list{padding:0 0 var(--sys-section);background:#fff}
.page-blog-premium .blog-list .container{max-width:1440px;padding-inline:var(--sys-gutter)}
/* Ein Zeilentyp fuer alle Artikel: Nummer, Vorschaubild, Titel mit Teaser,
   Rubrik und Pfeil. Der Titel laeuft ueber die volle Breite statt in einer
   schmalen Spalte zu zerbrechen, und die Liste bleibt bei wachsendem Journal
   ruhig lesbar. */
.page-blog-premium .blog-index-list{border-top:1px solid var(--sys-line)}
.page-blog-premium .blog-index-row{
  padding:clamp(26px,3vw,42px) 0;
  border-bottom:1px solid var(--sys-line);
  display:grid;
  grid-template-columns:54px clamp(150px,15vw,232px) minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(20px,2.6vw,44px);
  background-image:none!important
}
.page-blog-premium .blog-index-row__number,.page-blog-premium .blog-index-row__meta{color:var(--sys-muted);font-size:9px;font-weight:720;letter-spacing:.1em;text-transform:uppercase}
.page-blog-premium .blog-index-row__number{align-self:start;padding-top:6px}
.page-blog-premium .blog-index-row__media{display:block;overflow:hidden;border-radius:10px;background:#f1f3f7;aspect-ratio:16/10}
.page-blog-premium .blog-index-row__media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform 800ms var(--sys-ease)}
.page-blog-premium .blog-index-row__copy{display:block}
.page-blog-premium .blog-index-row__title{display:block;max-width:760px;font-size:clamp(24px,2.3vw,36px);font-weight:540;letter-spacing:-.045em;line-height:1.05}
.page-blog-premium .blog-index-row__summary{display:block;max-width:620px;margin-top:14px;color:var(--sys-muted);font-size:14px;line-height:1.6}
.page-blog-premium .blog-index-row__meta{align-self:start;padding-top:6px;white-space:nowrap}
/* Rueckmeldung ohne Pfeil (Systemregel: Links tragen keinen Pfeil): der Titel
   nimmt die Link-Hover-Farbe an, das Vorschaubild zieht leicht an. */
.page-blog-premium .blog-index-row:hover .blog-index-row__media img{transform:scale(1.04)}
.page-blog-premium .blog-soon{margin:0;padding:30px 0 0;border:0;border-radius:0;color:var(--sys-muted);text-align:left}
@media(max-width:980px){
  .page-blog-premium .blog-index-row{grid-template-columns:40px clamp(120px,18vw,180px) minmax(0,1fr);gap:20px}
  .page-blog-premium .blog-index-row__meta{grid-column:3;padding-top:0;margin-top:14px}
}
@media(max-width:640px){
  .page-blog-premium .blog-index-row{grid-template-columns:minmax(0,1fr);gap:0;align-items:start}
  .page-blog-premium .blog-index-row__number{padding-top:0}
  .page-blog-premium .blog-index-row__media{margin:16px 0 20px;aspect-ratio:16/9}
  .page-blog-premium .blog-index-row__meta{grid-column:1;margin-top:16px}
}

/* Educational comparison page. Editorial rows replace sales cards. */
.comparison-hero p{max-width:700px!important}
.comparison-story{background:#f7f7f3}
.comparison-head{display:grid;grid-template-columns:minmax(130px,.28fr) minmax(0,1fr);gap:clamp(28px,6vw,100px);align-items:start;margin-bottom:clamp(54px,7vw,100px)}
.comparison-head>span,.comparison-index{padding-top:8px;color:#747b88;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.comparison-head h2,.comparison-after h2{max-width:920px;margin:0;font-size:clamp(44px,5.8vw,82px);font-weight:540;letter-spacing:-.065em;line-height:.96}
.comparison-layer-list{border-top:1px solid var(--sys-line)}
.comparison-layer-list article{display:grid;grid-template-columns:70px minmax(220px,.55fr) minmax(0,1fr);gap:clamp(22px,5vw,80px);padding:clamp(26px,3.4vw,48px) 0;border-bottom:1px solid var(--sys-line)}
.comparison-layer-list article>span{color:var(--sys-blue);font-size:10px;font-weight:700;letter-spacing:.12em}
.comparison-layer-list h3{margin:0;font-size:clamp(22px,2.4vw,34px);font-weight:550;letter-spacing:-.045em}
.comparison-layer-list p{max-width:620px;margin:0;color:var(--sys-muted);font-size:15px;line-height:1.65}
.comparison-models{background:#0b0c10!important;color:#fff}
.comparison-models .comparison-head{margin-bottom:clamp(44px,6vw,76px)}
.comparison-models .comparison-head>span{color:#aeb5c2}
.comparison-models .comparison-head h2{max-width:860px;color:#fff;font-size:clamp(40px,5vw,70px)}
.comparison-models .brand-highlight{color:#79a4ff}
.comparison-table{border-top:1px solid rgba(255,255,255,.18)}
.comparison-table__row{display:grid;grid-template-columns:1.18fr repeat(3,1fr);border-bottom:1px solid rgba(255,255,255,.18)}
.comparison-table__row>*{margin:0;padding:24px clamp(12px,2vw,28px);border-left:1px solid rgba(255,255,255,.18);font-size:14px;line-height:1.5}
.comparison-table__row>*:first-child{padding-left:0;border-left:0}
.comparison-table__row strong{color:#fff;font-size:14px;font-weight:650}
.comparison-table__row span{color:#c4cad4}
.comparison-table__head>*{color:#b4bbc8;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.comparison-table__row .is-gys{background:#2368f5;color:#fff;border-left-color:rgba(255,255,255,.32)}
.comparison-after{background:#eaf0ff}
.comparison-after__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);gap:clamp(48px,9vw,150px);align-items:start}
.comparison-index{display:block;margin-bottom:34px}
.comparison-after__copy{padding-top:44px}
.comparison-after__copy p{margin:0 0 22px;color:#535b69;font-size:16px;line-height:1.65}
.comparison-after__copy .site-button{margin-top:18px}

@media(max-width:820px){
  .comparison-head{grid-template-columns:1fr;gap:22px}
  .comparison-layer-list article{grid-template-columns:38px 1fr;gap:12px 16px}
  .comparison-layer-list article p{grid-column:2}
  .comparison-table{overflow-x:auto}
  .comparison-table__row{min-width:780px}
  .comparison-after__grid{grid-template-columns:1fr}
  .comparison-after__copy{padding-top:0}
}
.ref-cipher-hero__label {
  position:absolute;
  z-index:5;
  inset:112px var(--sys-gutter) auto;
  display:flex;
  justify-content:space-between;
  color:#989898;
  font-size:9px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}
/* Vertikales Wischen gehoert immer dem Scroll, nie der Collage. */
.ref-cipher-hero__collage { position:absolute; inset:0; touch-action:pan-y; }
.ref-cipher-hero__collage [data-cipher-card] {
  position:absolute;
  left:50%;
  top:50%;
  z-index:2;
  width:clamp(190px,20vw,292px);
  aspect-ratio:16/9;
  margin:0;
  display:block;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  background:#181818;
  box-shadow:0 18px 50px rgba(0,0,0,.46);
  transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y)));
  will-change:transform,opacity;
}
.ref-cipher-hero__collage img { width:100%; height:100%; object-fit:contain; object-position:top center; background:#fff; display:block; }
/* Hover-Fokus: im Ruhezustand tragen alle Arbeiten Farbe. Beim Hover bleibt
   die betrachtete farbig (und tritt einen Tick groesser vor, Scale kommt
   frame-basiert aus dem JS), die uebrigen weichen monochrom zurueck. */
.ref-cipher-hero__collage [data-cipher-card] img {
  transition:filter 520ms var(--sys-ease);
}
.ref-cipher-hero__collage.is-hovering [data-cipher-card]:not(.is-hover) img {
  filter:grayscale(1) brightness(.55) contrast(1.04);
}
.ref-cipher-hero__collage [data-cipher-card].is-hover { border-color:rgba(255,255,255,.5); }
/* Case-Vorschau: die Arbeit oeffnet als Overlay im Browser-Rahmen (iframe),
   man bleibt auf getyoursite. Panel hebt sich sanft aus der Buehne. */
body.ref-case-lock { overflow:hidden; }
.ref-case { position:fixed; inset:0; z-index:1400; display:grid; place-items:center; padding:clamp(14px,3vw,44px); }
/* display:grid wuerde das hidden-Attribut ueberstimmen; ohne diese Regel bliebe
   das geschlossene Overlay als unsichtbare Vollbild-Schicht liegen und wuerde
   jeden Klick auf der Seite schlucken. Zusaetzlich ist das Overlay ausserhalb
   von is-open grundsaetzlich durchlaessig: das Verstecken haengt an einem
   Timer (Ausblend-Transition), und bis er feuert darf nichts blockieren. */
.ref-case[hidden] { display:none; }
.ref-case:not(.is-open) { pointer-events:none; }
.ref-case__backdrop { position:absolute; inset:0; background:rgba(5,5,5,.78); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); opacity:0; transition:opacity 380ms var(--sys-ease); }
.ref-case__panel {
  position:relative;
  z-index:1;
  width:min(1240px,100%);
  height:min(86vh,calc(100% - 12px));
  margin:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:#0d0d0f;
  box-shadow:0 42px 120px rgba(0,0,0,.55);
  opacity:0;
  transform:translateY(26px) scale(.965);
  transition:opacity 380ms var(--sys-ease),transform 460ms var(--sys-ease);
}
.ref-case.is-open .ref-case__backdrop { opacity:1; }
.ref-case.is-open .ref-case__panel { opacity:1; transform:none; }
.ref-case__bar { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:13px 18px; border-bottom:1px solid rgba(255,255,255,.12); color:#fff; }
.ref-case__id { display:flex; align-items:baseline; gap:12px; min-width:0; }
.ref-case__id b { font-size:12px; font-weight:720; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap; }
.ref-case__id small { color:#9a9a9a; font-size:9px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap; }
.ref-case__acts { display:flex; align-items:center; gap:16px; }
.ref-case__acts a { color:#fff; font-size:10px; font-weight:720; letter-spacing:.12em; text-transform:uppercase; }
.ref-case__acts button {
  width:34px; height:34px;
  display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.3); border-radius:50%;
  background:transparent; color:#fff;
  font-size:19px; line-height:1; cursor:pointer;
  transition:border-color var(--sys-fast) ease,background var(--sys-fast) ease;
}
.ref-case__acts button:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.ref-case__panel iframe { width:100%; height:100%; border:0; display:block; background:#fff; }
@media(max-width:640px){
  .ref-case { padding:10px; }
  .ref-case__panel { height:calc(100dvh - 20px); border-radius:10px; }
  .ref-case__bar { padding:11px 12px; gap:12px; }
  .ref-case__id { flex-direction:column; gap:3px; }
  .ref-case__id b, .ref-case__id small { white-space:normal; }
  .ref-case__acts { gap:12px; flex:0 0 auto; }
}
.ref-cipher-hero__title {
  position:absolute;
  z-index:5;
  left:50%;
  bottom:26px;
  transform:translateX(-50%);
  margin:0;
  display:grid;
  justify-items:center;
  gap:5px;
  text-align:center;
  color:#fff;
  pointer-events:none;
}
.ref-cipher-hero__title span {
  font-size:12px;
  font-weight:720;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.ref-cipher-hero__title small { color:#9a9a9a; font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
/* Kurzbeschreibung der aktiven Arbeit: nur mobil, dort ersetzt sie die
   fehlende Hover-Ebene des Desktops. */
.ref-cipher-hero__title em { display:none; }
@media(max-width:880px){
  .ref-cipher-hero__title { bottom:30px; width:min(320px,86vw); }
  .ref-cipher-hero__title em { display:block; margin-top:4px; color:#c9c9c9; font-style:normal; font-size:12px; font-weight:400; line-height:1.5; letter-spacing:0; text-transform:none; }
}
.ref-cipher-hero__title.is-swap span,
.ref-cipher-hero__title.is-swap small,
.ref-cipher-hero__title.is-swap em { animation:cipher-title-in 460ms var(--sys-ease); }
@keyframes cipher-title-in {
  from { opacity:0; transform:translateY(9px); }
  to { opacity:1; transform:none; }
}
.ref-cipher-hero__mark {
  position:absolute;
  z-index:6;
  left:50%;
  top:50%;
  width:54px;
  height:54px;
  padding:9px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.55);
  border-radius:50%;
  background:#050505;
  transform:translate(-50%,-50%);
}
.ref-cipher-hero__mark img { width:100%; height:100%; filter:brightness(0) invert(1); }
.ref-cipher-hero__scroll { position:absolute; z-index:5; inset:auto var(--sys-gutter) 28px auto; margin:0; color:#a0a0a0; font-size:9px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
@keyframes cipher-orient {
  from { opacity:0; transform:translate(-50%,-50%) scale(.45) rotate(var(--r,-5deg)); }
  to { opacity:1; transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1) rotate(0); }
}
.page-references-premium .ref-cipher-hero__collage [data-cipher-card] { animation:none!important; }
.page-references-premium .ref-stage { padding-top:clamp(90px,9vw,138px); }
.page-references-premium .ref-row { min-height:100vh; align-items:center; }
.page-references-premium .ref-vis .sc-frame { border:1px solid var(--sys-line); }

/* Comparison: focus on scope, effort and ownership, not a frightening long-term bill. */
.page-comparison-premium .yc { display:none; }
.page-comparison-premium .vs-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.page-comparison-premium .vs-card.builder { background:var(--sys-soft); }
.page-comparison-premium .vs-list li { grid-template-columns:1fr; padding-left:0; }

/* White system background for all public page templates. */
.page-premium-shell,
.page-premium-shell main,
.page-blog-premium .blog-list,
.page-article-premium .prose { background:#fff; }

@media (max-width:1000px) {
  .site-footer__grid { grid-template-columns:1.25fr repeat(3,minmax(100px,.65fr)); gap:38px; }
  .site-nav,
  .site-shell .site-nav,
  .site-shell .site-nav.scrolled { grid-template-columns:150px auto 245px; gap:18px; }
  .site-brand span { display:none; }
  .site-nav__contact { display:none; }
  .site-nav__links { gap:15px; }
  .site-nav__link,
  .site-shell .site-nav__link.nl { font-size:9px!important; }
}

@media (max-width:1120px) {
  .site-nav,
  .site-shell .site-nav,
  .site-shell .site-nav.scrolled { min-height:66px; grid-template-columns:1fr auto; padding:10px 20px; }
  .site-nav__links { display:none; }
  .site-nav__actions { gap:10px; }
  .site-nav__login,
  .site-nav__cta { display:none!important; }
  .site-nav .burger { display:flex; }
  .site-nav #gys-lang { display:inline-flex!important; }
  .site-brand span { display:inline; }
  .page-contact-premium .contact { grid-template-columns:1fr; }
  .page-contact-premium .contact .form-card,
  .page-contact-premium .contact-side { grid-column:auto; grid-row:auto; }
  .site-footer__grid { grid-template-columns:1.2fr repeat(2,minmax(0,1fr)); }
  .site-footer__intro { grid-column:1/-1; }
  .page-comparison-premium .vs-grid { grid-template-columns:1fr; }
}

@media (max-width:700px) {
  :root {
    --sys-gutter:20px;
    --sys-section:78px;
    --sys-page-title:clamp(38px,10.7vw,52px);
    --sys-section-title:clamp(34px,10.8vw,48px);
  }
  .site-brand,
  .site-shell .site-brand { font-size:17px!important; }
  .site-brand img { width:31px; height:31px; }
  .site-shell .p-hero h1 { font-size:clamp(29px,7.7vw,33px); line-height:1.02; letter-spacing:-.052em; }
  .site-shell .title-lock { font-size:clamp(30px,8.25vw,36px)!important; letter-spacing:-.055em; }
  .page-about-premium .ab-intro h1 { font-size:clamp(34px,9.4vw,42px); }
  .site-mobile-menu { padding:82px 20px 14px; gap:14px; }
  .site-mobile-menu__links { gap:0; overflow-y:auto; }
  .site-mobile-menu__links a,
  .site-shell .site-mobile-menu__links a { min-height:52px; font-size:clamp(20px,5.3vw,24px)!important; }
  .site-mobile-menu__actions { grid-template-columns:1fr; }
  .site-mobile-menu__login { min-height:46px; }
  .site-cta { padding-top:78px; }
  .site-cta__statement { font-size:clamp(52px,14.8vw,78px); }
  .site-cta__meta { grid-template-columns:1fr; gap:10px; }
  .site-footer__grid { grid-template-columns:1fr 1fr; gap:36px 24px; }
  .site-footer__intro { grid-column:1/-1; }
  .site-footer__bottom { margin-top:46px; flex-direction:column; gap:12px; }
  .page-services-premium .aurora-host:first-of-type { min-height:0; align-items:flex-start; }
  .page-services-premium .svc-intro { padding-top:104px; padding-bottom:56px; }
  .page-services-premium .svc-intro::after { aspect-ratio:16/10; }
  .page-pricing-premium .page-hero,
  .page-comparison-premium .page-hero { min-height:0; padding-top:118px; display:block; }
  .pricing-hero-choice { grid-template-columns:1fr; }
  .pricing-hero-choice a + a { padding-left:0; border-left:0; }
  .pricing-hero-choice a:hover { padding-left:0; }
  .page-references-premium .ref-intro { min-height:0; padding-top:118px; }
  .page-references-premium .ref-intro .container::after { display:none; }
  .page-contact-premium .contact { min-height:0; padding-top:118px; }
  .page-contact-premium .contact { grid-template-columns:1fr; }
  .page-contact-premium .contact .form-card,
  .page-contact-premium .contact-side { grid-column:auto; grid-row:auto; }
  .page-contact-premium .c-alt { grid-template-columns:1fr; }
  .page-contact-premium .person { grid-template-columns:1fr; gap:18px; padding:16px; }
  .page-contact-premium .p-photo { width:100%; aspect-ratio:4/3; }
  .page-contact-premium .p-photo img { object-position:50% 44%; transform:scale(1.15); }
  .page-contact-premium .person-linkedin,
  .page-contact-premium .person-more { width:100%; justify-content:center; margin-left:0; }
  .ref-cipher-hero__label { inset:94px 20px auto; }
  .ref-cipher-hero__collage [data-cipher-card] { width:clamp(132px,38vw,172px); }
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(1){--x:-43vw!important;--y:-27vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(2){--x:4vw!important;--y:-31vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(3){--x:43vw!important;--y:-17vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(4){--x:46vw!important;--y:16vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(5){--x:20vw!important;--y:32vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(6){--x:-29vw!important;--y:31vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(7){--x:-46vw!important;--y:11vh!important}
  .ref-cipher-hero__collage [data-cipher-card]:nth-child(8){--x:-45vw!important;--y:-12vh!important}
  .ref-cipher-hero__mark { width:46px; height:46px; }
  /* Touch: kein Wheel/Drag -> Hinweis unzutreffend, und er wuerde mit dem
     zentrierten Titel kollidieren. Der Titel traegt die Information. */
  .ref-cipher-hero__scroll { display:none; }
  .page-references-premium .ref-row { min-height:0; }
}

@media (min-width:881px) {
  .page-about-premium .fdr-foot { grid-template-columns:minmax(400px,.9fr) minmax(0,1.1fr); gap:clamp(52px,7vw,104px); }
  .page-about-premium .fdr-statement { max-width:23ch; font-size:clamp(24px,2.15vw,34px); text-wrap:balance; }
}

@media (prefers-reduced-motion:reduce) {
  .site-shell *,
  .site-shell *::before,
  .site-shell *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .ref-cipher-hero__collage [data-cipher-card] { animation:none!important; }
}
