/* Post-launch polish, October 15, 2026. Everything added after launch lives here. */

/* Pass 1 - Privacy: a short legal page; its heading and subheads were set at the full
   page/section sizes (68/42px). Step each down one level on the existing 5-size scale. */
main .privacy-intro h1 { font-size: var(--pa-h2) !important; }
main .privacy-content h2 { font-size: var(--pa-h3) !important; line-height: 1.3; margin-bottom: .5rem; }
main .privacy-content section { padding-block: 1.4rem; }

/* Pass 2 - Alive. Transform/opacity animation only. Colours stay on with reduced motion;
   every movement stops. Nothing here hides content. */

/* A. Hero depth: drifting stage-colour light, a breathing glow behind the art, a slow float. */
.sculpt-hero{isolation:isolate;overflow:clip}
.sculpt-hero>.wrap{position:relative;z-index:1}
.hero-light{position:absolute;inset:-25% -10%;z-index:0;pointer-events:none}
.hero-light i{position:absolute;width:55vmax;height:55vmax;border-radius:50%}
.hero-light i:nth-child(1){left:-18%;top:5%;background:radial-gradient(closest-side,#b9b6d83d,transparent)}
.hero-light i:nth-child(2){right:-14%;top:-22%;background:radial-gradient(closest-side,#bdcdd733,transparent)}
.hero-light i:nth-child(3){right:12%;bottom:-38%;background:radial-gradient(closest-side,#e8b53f24,transparent)}
.hero-object{position:relative;transform:translate(var(--lx,0px),var(--ly,0px));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.hero-object picture{position:relative;z-index:1;display:block}
.hero-glow{position:absolute;right:4%;top:30%;width:48%;aspect-ratio:1;border-radius:50%;z-index:0;pointer-events:none;background:radial-gradient(circle,#e8b53f4d 0%,#e8b53f1a 42%,transparent 70%)}

/* B. Painted edges: the hero meets the cream page, and every page meets the footer, with a brush stroke. */
.brush-edge{position:absolute;left:0;width:100%;display:block;pointer-events:none}
.brush-edge--hero{bottom:-1px;height:56px;z-index:2;fill:var(--paper,#fbf8ef)}
.foot{position:relative}
.brush-edge--foot{top:-47px;height:48px;fill:#232f47}
@media(max-width:768px){.brush-edge--hero{height:30px}.brush-edge--foot{top:-25px;height:26px}}

/* C. Stage colour that moves, and cards that answer the pointer. */
.stage-section{position:relative;isolation:isolate;overflow:clip}
.stage-section>.wrap{position:relative;z-index:1}
.stage-light{position:absolute;inset:-20%;z-index:0;pointer-events:none}
.stage-light i{position:absolute;width:42vmax;height:42vmax;border-radius:50%}
.stage-light i:nth-child(1){left:-12%;top:10%;background:radial-gradient(closest-side,#dbe8efcc,transparent)}
.stage-light i:nth-child(2){left:24%;bottom:-24%;background:radial-gradient(closest-side,#f3efdfee,transparent)}
.stage-light i:nth-child(3){right:6%;top:8%;background:radial-gradient(closest-side,#e7e5f3dd,transparent)}
.stage-light i:nth-child(4){right:-14%;bottom:-16%;background:radial-gradient(closest-side,#e9ebdcdd,transparent)}
.stage-band{position:relative;isolation:isolate;overflow:clip}
.stage-band::before{content:"";position:absolute;inset:-30%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side at 28% 38%,#ffffff70,transparent 70%),radial-gradient(closest-side at 76% 72%,#ffffff4d,transparent 70%)}
main :is(.form-card,.selected-grid article,.approach-story li,.service-guide):is(:hover,:focus-within){box-shadow:0 22px 40px -22px var(--accent,#232f47),0 12px 24px #232f4714,inset 0 2px 0 #ffffff88!important}
main .stage-band .sv-card:is(:hover,:focus-within){box-shadow:0 18px 34px -20px #232f4766,inset 0 2px 0 #ffffffdd!important}
:is(.form-card,.selected-grid article,.approach-story li,.service-guide) img{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
:is(.form-card,.selected-grid article,.approach-story li,.service-guide):is(:hover,:focus-within) img{transform:translateY(-6px) scale(1.03)}

@media (prefers-reduced-motion:no-preference){
 .hero-object picture{animation:ampl-float 7s ease-in-out infinite}
 .hero-glow{animation:ampl-breathe 6s ease-in-out infinite}
 .hero-light i{animation:ampl-drift 28s ease-in-out infinite alternate}
 .hero-light i:nth-child(2){animation-duration:34s;animation-delay:-9s}
 .hero-light i:nth-child(3){animation-duration:24s;animation-delay:-5s}
 .stage-light i{animation:ampl-drift 30s ease-in-out infinite alternate}
 .stage-light i:nth-child(2n){animation-duration:38s;animation-delay:-11s}
 .stage-band::before{animation:ampl-drift-sm 26s ease-in-out infinite alternate}
}
@media (prefers-reduced-motion:reduce){
 .hero-object{transform:none;transition:none}
 :is(.form-card,.selected-grid article,.approach-story li,.service-guide):is(:hover,:focus-within) img{transform:none}
}
@keyframes ampl-float{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes ampl-breathe{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.08);opacity:1}}
@keyframes ampl-drift{from{transform:translate(0,0)}to{transform:translate(7vmax,5vmax)}}
@keyframes ampl-drift-sm{from{transform:translate(0,0)}to{transform:translate(6%,4%)}}
/* The painted edge replaces the old hairline between the hero and the stages section. */
.sculpt-hero + .stage-section{border-top:0}

/* Pass 3 - Diagrams draw themselves (assets/diagram-draw.js). SVG children animate around their own box. */
svg.sv-dg > *{transform-box:fill-box}

/* E. Pass 4 (Home): "Why AMPL exists" with a photograph that bleeds to the right edge, a dot field behind it
   and a small floating glass card with a mini process flow (same base-attached arrow geometry as the diagrams).
   Scoped to .why-teaser--photo. Indigo/navy only; stage colours stay reserved. */
.why-teaser--photo{position:relative;isolation:isolate;overflow:clip}
.why-teaser--photo>.wrap{position:relative;z-index:1;max-width:var(--wrap)}
.why-teaser__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.why-teaser__copy{min-width:0}
.why-teaser__copy .lede{max-width:34rem}
.why-teaser__photo{position:relative;margin:0;min-width:0;isolation:isolate;
  margin-right:calc(-1 * ((100vw - min(var(--wrap), 100vw)) / 2 + var(--gutter)))}
.why-teaser__photo picture{position:relative;z-index:1;display:block}
.why-teaser__photo img{display:block;width:100%;height:auto;aspect-ratio:960/717;object-fit:cover;object-position:35% 50%;
  border-radius:28px 0 0 28px;box-shadow:0 30px 60px -30px #232f4773,0 8px 20px -12px #232f4740}
/* dot field behind the photo, fading out toward the text */
.why-teaser__dots{position:absolute;z-index:0;top:-48px;right:0;bottom:-48px;left:-34%;pointer-events:none;
  background-image:radial-gradient(circle,#3d4a78 1.2px,transparent 1.6px);background-size:22px 22px;opacity:.3;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%,#000 70%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 40%,#000 70%,transparent 100%)}
/* floating glass card with a mini process flow */
.why-teaser__flow{position:absolute;z-index:2;left:-28px;bottom:-26px;padding:14px 16px;border-radius:16px;
  background:#fbf8efd9;-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);
  border:1px solid #ffffffb3;box-shadow:0 18px 36px -18px #232f4766,0 2px 6px -2px #232f4726}
.why-teaser__flow svg{display:block;width:176px;height:auto}
.why-teaser__flow .n{fill:#fffdf7;stroke:#3d4a78;stroke-width:1.5}
.why-teaser__flow .n2{fill:#e4e8f3}
.why-teaser__flow .n3{fill:#232f47;stroke:#232f47}
.why-teaser__flow .c{fill:none;stroke:#3d4a78;stroke-width:1.5;stroke-linecap:butt}
.why-teaser__flow .h{fill:#3d4a78}
.why-teaser__flow .t{fill:none;stroke:#fbf8ef;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:899px){
  .why-teaser--photo{padding-bottom:calc(var(--sec-gap) + 1.75rem)}
  .why-teaser__grid{grid-template-columns:minmax(0,1fr);gap:2.25rem}
  .why-teaser__photo{margin-right:calc(-1 * var(--gutter))}
  .why-teaser__photo img{border-radius:22px 0 0 22px}
  .why-teaser__dots{top:-28px;bottom:-28px;left:-10%}
  .why-teaser__flow{left:-8px;bottom:-22px;padding:10px 12px;border-radius:14px}
  .why-teaser__flow svg{width:140px}
}
@media(prefers-reduced-motion:no-preference){
  .why-teaser__dots{animation:ampl-dots 40s ease-in-out infinite alternate}
  .why-teaser__flow{animation:ampl-bob 7s ease-in-out infinite alternate}
}
@keyframes ampl-dots{from{transform:translate(0,0)}to{transform:translate(-22px,11px)}}
@keyframes ampl-bob{from{transform:translateY(0)}to{transform:translateY(-6px)}}