/* Agenz Foundation V37 — production-readiness polish */
:root{
  --v37-ink:#101735;
  --v37-copy:#59637a;
  --v37-purple:#6847e8;
  --v37-blue:#1978d4;
  --v37-bg:#f6f8fc;
  --v37-card:#fff;
  --v37-border:rgba(16,23,53,.11);
  --v37-shadow:0 18px 52px rgba(35,45,98,.10);
}

html{scroll-behavior:smooth;scroll-padding-top:88px}
body{overflow-x:hidden}
body::selection{color:var(--v37-ink);background:rgba(104,71,232,.18)}
:where(a,button,input,textarea,select):focus-visible{outline:3px solid rgba(25,120,212,.34)!important;outline-offset:3px}
.beta-ribbon,.ai-attention{display:none!important}

/* Stable navigation: one row, no decorative labels behind it. */
.site-header{
  height:76px!important;
  grid-template-columns:minmax(170px,205px) minmax(0,1fr) auto!important;
  gap:clamp(18px,2.4vw,38px)!important;
  padding-inline:clamp(20px,4vw,58px)!important;
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--v37-border)!important;
  box-shadow:0 10px 34px rgba(34,44,93,.065)!important;
  backdrop-filter:blur(18px) saturate(1.25);
}
.site-header.scrolled{height:70px!important;background:rgba(255,255,255,.98)!important}
.brand-lockup{display:flex;align-items:center;min-width:0}
.brand-lockup img,.simple-header img,.dash-topbar img,.social-header img{
  display:block;width:min(190px,100%);height:38px;object-fit:contain;object-position:left center;filter:none!important
}
.desktop-nav{justify-self:center;gap:clamp(14px,1.55vw,25px)!important;min-width:0}
.desktop-nav a{
  display:inline-flex!important;min-width:0!important;padding:26px 0 23px!important;
  color:#5b647b!important;font-size:.67rem!important;line-height:1!important;font-weight:800!important;
  letter-spacing:.035em!important;white-space:nowrap
}
.desktop-nav a:hover,.desktop-nav a[aria-current="page"]{color:var(--v37-ink)!important}
.desktop-nav .nav-icon-shell,.desktop-nav .nav-hover-card{display:none!important}
.header-actions{min-width:max-content;gap:9px!important}
.header-actions .account-entry{font-size:.61rem;white-space:nowrap}
.header-cta{min-height:42px!important;padding:10px 15px!important;font-size:.58rem!important;white-space:nowrap}
.menu-toggle{flex:0 0 auto}
.mobile-menu{top:70px!important;height:calc(100svh - 70px)!important;padding-top:30px!important;overflow-y:auto}
.mobile-menu a{align-items:center;gap:14px;font-size:clamp(1.25rem,6vw,2.2rem)!important}
.mobile-nav-label{flex:1}

/* Public typography: controlled measure and fluid sizes prevent collisions. */
:where(.hero,.page-hero,.section,.brief-shell) h1,
:where(.hero,.page-hero,.section,.brief-shell) h2,
:where(.hero,.page-hero,.section,.brief-shell) h3{overflow-wrap:anywhere;text-wrap:balance}
:where(.hero,.page-hero,.section,.brief-shell) p{overflow-wrap:anywhere}
.hero .hero-title,.page-hero .hero-title{margin:0;font-weight:700;color:var(--v37-ink)}
.hero h1,.hero .hero-title{max-width:760px;font-size:clamp(3.1rem,5.7vw,6rem);line-height:.93;letter-spacing:-.065em}
.page-hero h1,.page-hero .hero-title{max-width:980px;font-size:clamp(2.9rem,6.4vw,6.7rem)!important;line-height:.91!important;letter-spacing:-.064em!important}
.page-lead{max-width:720px!important;font-size:clamp(1rem,1.2vw,1.14rem)!important;line-height:1.72!important}
.section-heading h2{font-size:clamp(2.25rem,4.45vw,4.5rem)!important;line-height:.98!important}
.section-heading>p{max-width:560px}
.button{min-height:46px;display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.25}

/* Preserve the official logo on both light and dark surfaces. */
.site-footer .footer-logo img,.cinema-logo img{filter:none!important}
.site-footer .footer-logo img{content:url('/agenz-logo-white-transparent.png');width:min(270px,100%);height:auto}
.cinema-logo img{content:url('/agenz-logo-white-transparent.png')}

/* Short, optional cinematic opening shown once per browser. */
.cinematic-intro{transition:opacity .45s ease,visibility .45s ease!important}
.cinema-letterbox{animation:none!important;height:4vh!important}
.cinema-logo img{height:130px!important;animation:v37LogoIn .9s .12s cubic-bezier(.2,.8,.2,1) both!important}
.cinema-kicker{animation:v37CopyIn .55s .06s ease both!important}
.cinema-tagline{animation:v37CopyIn .55s .58s ease both!important}
.cinema-final{font-size:clamp(1.8rem,4.5vw,4.3rem)!important;animation:v37FinalIn .72s 1.05s ease both!important}
.cinema-progress i{animation:v37Progress 2.2s linear forwards!important}
.cinema-skip{right:clamp(16px,3vw,30px)!important;bottom:clamp(16px,3vw,30px)!important}
@keyframes v37LogoIn{from{opacity:0;filter:blur(14px) brightness(2);transform:scale(.96)}to{opacity:1;filter:none;transform:scale(1)}}
@keyframes v37CopyIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes v37FinalIn{0%{opacity:0;transform:translate(-50%,-38%) scale(.97)}35%{opacity:0}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes v37Progress{to{width:100%}}

/* Consistent cards, forms, and feedback. */
.project-brief-form,.design-intake,.analysis-panel,.template-card,.package-grid article,.flow-cards article{
  border-color:var(--v37-border)!important;background:var(--v37-card)!important;color:var(--v37-ink)!important;box-shadow:var(--v37-shadow)!important
}
.project-brief-form input,.project-brief-form select,.project-brief-form textarea,
.design-intake input,.design-intake select,.design-intake textarea{
  color:var(--v37-ink)!important;background:#fff!important;border-color:rgba(16,23,53,.15)!important
}
.form-note,.privacy-notice p{color:var(--v37-copy)!important}
.form-status{min-height:22px;margin:12px 0 0;color:var(--v37-copy);font-size:.72rem;line-height:1.55}
.form-status.success{color:#087653}.form-status.error{color:#b4234f}
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}

/* Design Intelligence is a guided catalogue when live AI is unavailable. */
.design-hero{background:linear-gradient(135deg,#fff 0%,#f2f1ff 55%,#edf6ff 100%)!important}
.design-hero-copy h1{font-size:clamp(2.7rem,5.35vw,5.6rem)!important;line-height:.94!important}
.design-hero-lead{max-width:690px!important;color:var(--v37-copy)!important;line-height:1.72!important}
.design-showcase{min-width:0}
.analysis-panel[data-mode="curated"] .analysis-state{color:var(--v37-purple)}
.analysis-panel[data-mode="curated"] .scan-product{animation:none}
.template-info strong{color:var(--v37-purple)!important;font-size:.67rem!important}
.payment-status{border-color:rgba(104,71,232,.18)!important;background:#f3f1ff!important;color:#534a76!important}

/* Dark modules remain deliberately dark and keep readable contrast. */
.section-dark,.site-footer,.cinematic-intro,.workspace-body,.invoice-body{color:#fff}
.section-dark h1,.section-dark h2,.section-dark h3,.site-footer strong{color:#fff!important}
.section-dark p,.site-footer p,.site-footer a{color:rgba(255,255,255,.72)!important}

/* Media loads only when useful and keeps a predictable frame. */
video,img{max-width:100%}
.video-card video,.portfolio-card video{background:#0c112c}
.video-card,.image-card,.portfolio-card{overflow:hidden}

@media(max-width:1260px){
  .site-header{grid-template-columns:180px minmax(0,1fr) auto!important}
  .desktop-nav{gap:14px!important}
  .desktop-nav a{font-size:.61rem!important}
  .header-actions .account-entry{display:none}
}
@media(max-width:1080px){
  .desktop-nav{display:none!important}.menu-toggle,.mobile-menu{display:block!important}
  .site-header{grid-template-columns:minmax(160px,1fr) auto!important}
  .header-actions{grid-column:2}.header-actions .header-cta{display:none}
}
@media(max-width:760px){
  html{scroll-padding-top:72px}
  .site-header{height:68px!important;padding-inline:16px!important}.site-header.scrolled{height:64px!important}
  .brand-lockup img{width:164px;height:32px}
  .page-hero{padding-top:112px!important}
  .page-hero h1{font-size:clamp(2.55rem,13vw,4.35rem)!important}
  .section-heading{align-items:start!important}
  .design-hero-copy h1{font-size:clamp(2.45rem,12vw,4rem)!important}
  .design-steps{overflow-x:auto;justify-content:flex-start!important;padding-inline:18px}.design-steps span{white-space:nowrap}
  .cinema-kicker,.cinema-tagline{padding-inline:20px;letter-spacing:.18em!important;line-height:1.6}
  .cinema-logo img{height:82px!important}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .cinematic-intro{display:none!important}
}