/* UNEq Website Relaunch — base chrome */
*{box-sizing:border-box;}
html,body{margin:0;background:var(--bg-canvas);color:#fff;font-family:var(--font-body);overflow-x:hidden;}
body{scroll-behavior:smooth;}
::selection{background:var(--signal-500);color:#000;}

.uneq-grid-bg{
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:80px 80px;
}
.kit-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.22em;color:var(--fg-4);text-transform:uppercase;}
.kit-eyebrow::before{content:"// ";color:var(--fg-5);}
em.signal{font-style:italic;color:var(--signal-500);font-weight:400;}

/* --- Background canvas layer --- */
#bg-anim{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none;opacity:.85;}
.app-shell{position:relative;z-index:1;}

/* --- Section scaffolding --- */
.sec{position:relative;padding:120px 48px;}
.sec--ink{background:linear-gradient(180deg,transparent,rgba(0,0,0,.5) 40%,rgba(10,10,10,.85) 100%);}
.sec-wrap{max-width:1320px;margin:0 auto;position:relative;z-index:2;}

/* --- Hover micro-anims --- */
.lift{transition:transform 320ms var(--ease-out),border-color 220ms var(--ease-out),box-shadow 320ms var(--ease-out);}
.lift:hover{transform:translateY(-2px);}

.chip-row{position:relative;overflow:hidden;}
.chip-row::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(140px 60px at var(--mx,50%) 50%,rgba(31,203,133,.18),transparent 60%);
  opacity:0;transition:opacity 320ms var(--ease-out);pointer-events:none;
}
.chip-row:hover::after{opacity:1;}

.product-card{position:relative;overflow:hidden;cursor:pointer;}
.product-card .corner{
  position:absolute;top:-1px;right:-1px;width:0;height:0;
  border-style:solid;border-width:0 14px 14px 0;
  border-color:transparent var(--signal-500) transparent transparent;
  opacity:0;transition:opacity 280ms var(--ease-out),transform 280ms var(--ease-out);transform:translate(6px,-6px);
}
.product-card:hover .corner,.product-card.active .corner{opacity:1;transform:translate(0,0);}
.product-card .arrow{display:inline-block;transition:transform 280ms var(--ease-out);}
.product-card:hover .arrow{transform:translateX(6px);}
.product-card .scan{
  position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--signal-500),transparent);
  top:0;opacity:0;transition:opacity 220ms;
}
.product-card:hover .scan{opacity:.7;animation:scan 1.6s linear infinite;}
@keyframes scan{0%{top:0;}100%{top:100%;}}

.phase{transition:background 320ms var(--ease-out),border-color 320ms var(--ease-out);}
.phase:hover{background:rgba(31,203,133,.04);border-color:var(--stroke-accent);}
.phase .num{transition:color 320ms var(--ease-out),letter-spacing 320ms var(--ease-out);}
.phase:hover .num{color:var(--signal-500);letter-spacing:-.04em;}

.case-card{position:relative;overflow:hidden;transition:transform 320ms var(--ease-out),border-color 320ms var(--ease-out);}
.case-card:hover{transform:translateY(-3px);border-color:var(--stroke-accent);}
.case-card .glow{
  position:absolute;inset:0;background:radial-gradient(380px 140px at 80% 0%,rgba(31,203,133,.14),transparent 60%);
  opacity:0;transition:opacity 380ms var(--ease-out);
}
.case-card:hover .glow{opacity:1;}

.agent-tile{position:relative;transition:background 240ms var(--ease-out),border-color 240ms var(--ease-out);}
.agent-tile:hover{background:rgba(31,203,133,.05);border-color:var(--stroke-accent);}
.agent-tile .dot{box-shadow:0 0 0 0 rgba(31,203,133,.6);transition:box-shadow 360ms var(--ease-out);}
.agent-tile:hover .dot{box-shadow:0 0 0 6px rgba(31,203,133,.0);animation:pulse 1.6s ease-out infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(31,203,133,.55);}80%{box-shadow:0 0 0 10px rgba(31,203,133,0);}100%{box-shadow:0 0 0 0 rgba(31,203,133,0);}}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:14px;padding:14px 22px;border-radius:4px;cursor:pointer;border:1px solid transparent;transition:all 240ms var(--ease-out);text-decoration:none;}
.btn-primary{background:var(--signal-500);color:#000;font-weight:500;}
.btn-primary:hover{box-shadow:0 0 0 1px var(--signal-400),0 0 36px -6px var(--signal-glow);transform:translateY(-1px);}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.22);}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.03);}
/* Nav-sized CTA — matches nav-link typography */
.btn-nav{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;padding:9px 14px;border-radius:3px;}

/* Mobile hamburger (hidden on desktop) */
.nav-burger{display:none;background:transparent;border:1px solid var(--stroke-2);border-radius:6px;width:40px;height:40px;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:border-color 220ms var(--ease-out),background 220ms var(--ease-out);}
.nav-burger:hover{border-color:var(--stroke-accent);background:rgba(31,203,133,.05);}
.nav-burger-icon{position:relative;width:18px;height:14px;display:block;}
.nav-burger-icon > span{position:absolute;left:0;right:0;height:1.5px;background:#fff;border-radius:1px;transition:transform 280ms var(--ease-out),opacity 220ms var(--ease-out),top 280ms var(--ease-out);}
.nav-burger-icon > span:nth-child(1){top:0;}
.nav-burger-icon > span:nth-child(2){top:6.25px;}
.nav-burger-icon > span:nth-child(3){top:12.5px;}
.nav-burger-icon.open > span:nth-child(1){top:6.25px;transform:rotate(45deg);background:var(--signal-500);}
.nav-burger-icon.open > span:nth-child(2){opacity:0;}
.nav-burger-icon.open > span:nth-child(3){top:6.25px;transform:rotate(-45deg);background:var(--signal-500);}

/* Mobile sheet (full-viewport drop-down menu) */
.nav-sheet{position:fixed;inset:0;z-index:49;pointer-events:none;opacity:0;visibility:hidden;transition:opacity 280ms var(--ease-out),visibility 0s linear 280ms;}
.nav-sheet.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 280ms var(--ease-out),visibility 0s linear 0s;}
.nav-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);}
.nav-sheet-panel{position:absolute;top:68px;left:0;right:0;background:rgba(10,10,10,0.98);border-bottom:1px solid var(--signal-500);padding:28px 20px 32px;display:flex;flex-direction:column;gap:8px;transform:translateY(-12px);opacity:0;transition:transform 320ms var(--ease-out),opacity 240ms var(--ease-out);}
.nav-sheet.open .nav-sheet-panel{transform:translateY(0);opacity:1;}
.nav-sheet-eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;color:var(--fg-5);text-transform:uppercase;padding-bottom:18px;border-bottom:1px solid var(--rule-color);margin-bottom:8px;}
.nav-sheet-links{display:flex;flex-direction:column;gap:0;}
.nav-sheet-links .nav-link{font-family:var(--font-display);font-size:22px;letter-spacing:-.01em;text-transform:none;color:var(--fg-1);padding:14px 0;border-bottom:1px solid var(--rule-color);}
.nav-sheet-links .nav-link::after{display:none;}
.nav-sheet-links .nav-link.active{color:var(--signal-500);}
.nav-sheet-cta{margin-top:24px;justify-content:center;font-size:14px;letter-spacing:.06em;padding:16px 22px;}
.nav-sheet-secondary{margin-top:10px;justify-content:center;font-size:13px;letter-spacing:.06em;padding:14px 22px;}

/* Nav link */
.nav-link{position:relative;font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--fg-3);cursor:pointer;padding:8px 0;transition:color 220ms var(--ease-out);text-decoration:none;white-space:nowrap;}
.nav-link:hover{color:#fff;}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--signal-500);transform:scaleX(0);transform-origin:left;transition:transform 320ms var(--ease-out);}
.nav-link:hover::after,.nav-link.active::after{transform:scaleX(1);}
.nav-link.active{color:var(--signal-500);}

/* Headlines */
.h-display{font-family:var(--font-display);font-weight:400;letter-spacing:-.01em;line-height:1.04;}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(14px);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out);}
.reveal.in{opacity:1;transform:none;}

/* Code-vibe */
.code-line{font-family:var(--font-mono);font-size:11px;color:var(--fg-5);letter-spacing:.04em;}

/* Tabs */
.tab{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--fg-4);padding:14px 4px;cursor:pointer;border-bottom:1px solid transparent;transition:color 220ms,border-color 220ms;}
.tab:hover{color:#fff;}
.tab.active{color:var(--signal-500);border-bottom-color:var(--signal-500);}

/* Pulse green dot */
.gdot{width:8px;height:8px;border-radius:50%;background:var(--signal-500);box-shadow:0 0 10px var(--signal-500);}
.gdot.live{animation:bsoft 1.8s ease-in-out infinite;}
@keyframes bsoft{0%,100%{opacity:.5;}50%{opacity:1;}}

/* Booking iframe placeholder */
.booking-frame{width:100%;height:720px;border:1px solid var(--stroke-2);border-radius:8px;background:var(--bg-surface);}

/* Helpers */
.flex{display:flex;}
.row{display:flex;gap:18px;flex-wrap:wrap;}
.col{display:flex;flex-direction:column;}
.divider{height:1px;background:var(--rule-color);width:100%;}

/* Back-to-top floating button */
.to-top{
  position:fixed;right:28px;bottom:28px;z-index:60;
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 16px;border-radius:999px;
  background:var(--signal-500);color:#000;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;
  border:1px solid var(--signal-400);cursor:pointer;
  box-shadow:0 6px 24px -8px rgba(0,0,0,.6),0 0 32px -8px var(--signal-glow);
  opacity:0;transform:translateY(12px) scale(.96);pointer-events:none;
  transition:opacity 280ms var(--ease-out),transform 280ms var(--ease-out),box-shadow 280ms var(--ease-out);
}
.to-top.show{opacity:1;transform:none;pointer-events:auto;}
.to-top:hover{box-shadow:0 8px 28px -8px rgba(0,0,0,.7),0 0 44px -6px var(--signal-glow);transform:translateY(-2px);}
.to-top svg{display:block;}
@media (max-width:900px){
  .to-top{right:16px;bottom:16px;padding:10px 12px;}
  .to-top span{display:none;}
}

/* --- Outcomes / Counter --- */
.outcome-counter{min-width:0;}
.outcome-num{font-size:88px;white-space:nowrap;}
.outcome-pre,.outcome-suf{font-size:36px;}

/* --- Site footer --- */
.site-footer{padding:40px 48px;}

/* --- Mobile tuning --- */
@media (max-width:900px){
  .sec{padding:72px 20px;}
  .hide-sm{display:none !important;}

  /* Nav: tighten padding, shrink logo, hide desktop links + CTA, show burger */
  .site-nav{padding:12px 16px !important;}
  .site-nav-logo img{height:32px !important;}
  .nav-burger{display:inline-flex;}

  /* Hero: stack copy / pills, tighten meta row, ditch over-wide right label */
  .hero-sec{padding-top:64px !important;padding-bottom:80px !important;}
  .hero-sec h1{font-size:clamp(36px,10vw,56px) !important;white-space:normal !important;}
  .hero-sec p{font-size:16px !important;}
  .hero-meta{margin-bottom:40px !important;}
  .hero-meta-right{display:none;}
  .hero-grid{grid-template-columns:1fr !important;gap:40px !important;align-items:start !important;}
  .hero-ctas .btn{flex:1 1 auto;justify-content:center;}

  /* Cases: stack title / body / results vertically inside each card */
  .case-card{padding:28px 24px !important;grid-template-columns:1fr !important;gap:28px !important;}
  .case-card h3{font-size:22px !important;}
  .case-results{border-left:none !important;padding-left:0 !important;border-top:1px solid var(--rule-color);padding-top:24px !important;flex-direction:row !important;flex-wrap:wrap;justify-content:flex-start !important;gap:32px !important;}

  /* Outcomes: stack cleanly, shrink display digits */
  #nutzen .sec-wrap > div:last-child{grid-template-columns:repeat(2,minmax(0,1fr)) !important;column-gap:20px;}
  .outcome-counter{padding:28px 16px 28px 0 !important;border-right-color:var(--rule-color);}
  .outcome-counter:nth-child(2n){padding-right:0 !important;border-right:none !important;}
  .outcome-counter:nth-child(n+3){border-top:1px solid var(--rule-color);}
  .outcome-num{font-size:56px;}
  .outcome-pre,.outcome-suf{font-size:24px;}

  /* Booking: stack columns; form fields wrap */
  .booking-grid{grid-template-columns:1fr !important;gap:40px !important;}
  .booking-frame{height:560px;}

  /* Footer: vertical stack, less padding */
  .site-footer{padding:32px 20px;}
  .site-footer-inner{flex-direction:column;align-items:flex-start;gap:20px;}
  .site-footer-links{flex-wrap:wrap;row-gap:12px;}
}

@media (max-width:560px){
  .sec{padding:64px 18px;}

  /* Outcomes: single column on phone */
  #nutzen .sec-wrap > div:last-child{grid-template-columns:1fr !important;}
  .outcome-counter{padding:28px 0 !important;border-right:none !important;border-bottom:1px solid var(--rule-color);}
  .outcome-counter:last-child{border-bottom:none;}
  .outcome-num{font-size:56px;}
  .outcome-pre,.outcome-suf{font-size:24px;}

  /* Booking form: stack fields */
  .booking-form{grid-template-columns:1fr !important;}
}

/* Legal pages (Impressum / Datenschutz) */
.legal-prose a{color:var(--signal-500);text-decoration:none;border-bottom:1px solid rgba(31,203,133,.5);transition:border-color 220ms var(--ease-out);}
.legal-prose a:hover{border-bottom-color:var(--signal-500);}
.legal-prose ul{margin:8px 0 4px;}
.legal-prose ul li{margin-bottom:4px;}
.legal-prose p strong{color:var(--fg-1);font-weight:500;}
