/* Final stability and accessibility layer. No copy or visual direction changes. */
:root{
  --space-1:clamp(8px,1vw,12px);
  --space-2:clamp(14px,2vw,22px);
  --space-3:clamp(24px,4vw,42px);
  --space-4:clamp(42px,7vw,82px);
  --content-max:1280px;
  --focus:#fff;
}

html{scroll-padding-top:84px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
main,header,footer{min-width:0}
section[id]{scroll-margin-top:84px}
img,video{max-width:100%;height:auto}
video{display:block;background:#050305}
h1,h2,h3,p,a,button,label,input,textarea{overflow-wrap:break-word}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
.buy{max-width:100%;text-align:center;line-height:1.15!important}

/* Stable media layout while assets are loading. */
.hero-media img,.portrait-card img,.cover img{object-fit:cover}
.portrait-card img{aspect-ratio:4/5}
.media-video video,.section-image video,.gif-card video{width:100%;height:100%;object-fit:cover}
.ebook-video{max-width:100%}

/* Predictable tap targets and keyboard focus. */
a,button,input,textarea{touch-action:manipulation}
button,.micro-cta,.buy,.social-icon,.contact-links a{min-height:44px}
:where(a,button,input,textarea):focus-visible{
  outline:3px solid var(--focus)!important;
  outline-offset:4px!important;
}
.lang-switch button[aria-pressed="true"],.lang button[aria-pressed="true"]{filter:saturate(1.08)}

/* Safer sticky header on notched phones. */
.topbar{
  padding-top:max(12px,env(safe-area-inset-top));
  padding-left:max(14px,env(safe-area-inset-left));
  padding-right:max(14px,env(safe-area-inset-right));
}

/* Header actions: one visual baseline, controlled deconstruction. */
.top-actions{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
}
.top-actions .micro-cta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  width:auto!important;
  padding:0 14px!important;
  border:1px solid #050305!important;
  clip-path:polygon(3% 0,100% 3%,97% 100%,0 96%)!important;
  transform:none!important;
  font-family:"Space Grotesk",Inter,Arial,sans-serif!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:.055em!important;
  box-shadow:4px 4px 0 #000!important;
}
.top-actions .micro-cta.ebook-top{
  min-width:88px!important;
  background:var(--acid)!important;
  color:#050305!important;
}
.top-actions .micro-cta:not(.ebook-top){
  min-width:148px!important;
  background:var(--pink)!important;
  color:#fff!important;
}
.top-actions .micro-cta:hover{
  transform:translateY(-2px)!important;
}

/* Avoid expensive painting outside the viewport without changing layout. */
main>section:not(.hero),.projector,.instruction{
  content-visibility:auto;
  contain-intrinsic-size:auto 760px;
}

/* Newsletter modal: safer on short screens and notched devices. */
.newsletter-modal{
  padding-top:max(16px,env(safe-area-inset-top));
  padding-bottom:max(16px,env(safe-area-inset-bottom));
}
.newsletter-panel{overscroll-behavior:contain}
.newsletter-field input{font-size:16px}

@media (max-width:620px){
  html{scroll-padding-top:72px}
  section[id]{scroll-margin-top:72px}
  .topbar{padding-bottom:10px}
  .hero h1,.hero-overlay h1{overflow:visible!important}
  .section-title,.contact-title{line-height:.94!important;letter-spacing:-.055em!important}
  .micro-flow{width:100%!important;justify-content:center;flex-wrap:wrap}
  .top-actions{gap:5px!important}
  .top-actions .micro-cta{
    min-height:36px!important;
    padding:0 8px!important;
    font-size:8.5px!important;
    letter-spacing:.035em!important;
    box-shadow:3px 3px 0 #000!important;
  }
  .top-actions .micro-cta.ebook-top{min-width:58px!important}
  .top-actions .micro-cta:not(.ebook-top){min-width:100px!important}
  .newsletter-panel{clip-path:polygon(0 0,98% 1%,100% 97%,3% 100%);box-shadow:7px 7px 0 var(--blue),-5px -5px 0 var(--hot)}
}

@media (max-width:390px){
  .top-actions .micro-cta{padding:0 6px!important;font-size:8px!important}
  .top-actions .micro-cta.ebook-top{min-width:52px!important}
  .top-actions .micro-cta:not(.ebook-top){min-width:88px!important}
}

@media (min-width:1280px){
  main>section:not(.hero),.footer{padding-left:max(6vw,calc((100vw - var(--content-max))/2));padding-right:max(6vw,calc((100vw - var(--content-max))/2))}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

@media (prefers-contrast:more){
  :root{--muted:rgba(255,255,255,.92)}
  .copy p,.benefit p,.tile p,.footer{color:rgba(255,255,255,.9)!important}
}
