/* v15 polish: visual hierarchy, motion and UX */
:root{--ease:cubic-bezier(.2,.75,.25,1)}
@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}
}
.hero{position:relative;overflow:hidden}
.hero-shell{position:relative;min-height:560px;display:flex;align-items:center}
.hero-inner{position:relative;z-index:2;max-width:790px;padding:18px 0}
.hero h1{max-width:790px}.hero-lead{max-width:650px}
.hero-visual{position:absolute;z-index:1;right:0;top:50%;width:min(28vw,350px);height:min(36vw,430px);transform:translateY(-50%);pointer-events:none}
.hero-visual__panel{position:absolute;inset:0;background:var(--pink-surface);border-radius:34px 34px 8px 34px;overflow:hidden}
.hero-visual__ring{position:absolute;width:290px;height:290px;right:-114px;top:62px;border:1px solid rgba(255,255,255,.48);border-radius:50%}
.hero-visual__square{position:absolute;width:132px;height:132px;right:42px;top:178px;background:rgba(255,255,255,.14);transform:rotate(18deg)}
.hero-visual__dot{position:absolute;width:10px;height:10px;left:34px;bottom:34px;border-radius:50%;background:rgba(255,255,255,.92)}
.btn{border-radius:999px;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background-color .2s var(--ease),color .2s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(23,24,29,.10)}.btn:active{transform:translateY(0);box-shadow:none}.btn-primary:hover{background:var(--pink-dark)}.btn-light:hover{background:#fff7fa}
.link-cta{position:relative;transition:color .18s ease,border-color .18s ease,transform .18s var(--ease)}.link-cta:hover{color:var(--pink-dark);border-color:currentColor;transform:translateX(3px)}
.nav a,.footer-nav a,.articles-all{transition:color .18s ease,opacity .18s ease}.nav a:hover,.articles-all:hover{color:var(--pink-dark)}.footer-nav a:hover{color:#EF165D}
.article h3{transition:transform .2s var(--ease),text-decoration-color .2s ease}.article:hover h3{transform:translateX(4px)}
@media(min-width:1024px){.sticky-rail::after{content:"";display:block;width:34px;height:2px;margin-top:18px;background:var(--pink);transform-origin:left center;transform:scaleX(.52);transition:transform .3s var(--ease)}.sticky-rail:hover::after{transform:scaleX(1)}}
@media(prefers-reduced-motion:no-preference){.hero-visual__panel{animation:heroVisualIn .65s var(--ease) both}.hero-visual__ring{animation:ringFloat 7s ease-in-out 1s infinite alternate}.hero-visual__square{animation:squareFloat 6s ease-in-out 1.2s infinite alternate}.hero-inner{animation:heroIn .55s var(--ease) both}}
@keyframes heroVisualIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}@keyframes ringFloat{from{transform:translate3d(0,0,0)}to{transform:translate3d(-8px,6px,0)}}@keyframes squareFloat{from{transform:rotate(18deg) translate3d(0,0,0)}to{transform:rotate(22deg) translate3d(-5px,5px,0)}}@keyframes heroIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
section[id]{scroll-margin-top:88px}:where(p){text-wrap:pretty}
:where(a):focus-visible{border-radius:6px}.nav a{min-height:44px;display:inline-flex;align-items:center}.articles-all{min-height:44px;align-items:center}.article{position:relative}.article:focus-visible{outline-offset:5px}
@media(max-width:1023px){.hero-shell{min-height:0;display:block}.hero-inner{max-width:720px;padding:0}.hero-visual{display:none}}
@media(max-width:640px){.nav a:first-child{display:inline-flex}.nav{gap:15px}.nav a{font-size:12px}.hero h1{font-size:44px;line-height:.95}.hero-lead{max-width:34ch}}
.contact-card{grid-template-columns:minmax(0,720px) minmax(220px,260px);justify-content:space-between;align-items:center;column-gap:56px}.contact-copy{min-width:0}.contact-card .btn{margin-top:0;justify-self:end;align-self:center;width:100%;min-width:0}
.hero-visual__ring{transform-origin:center}.hero-visual__square{transform-origin:center}.hero-visual__square-outline{position:absolute;width:76px;height:76px;right:170px;top:92px;border:1px solid rgba(255,255,255,.52);transform:rotate(-12deg)}.hero-visual__dot{transform-origin:center}
@media(prefers-reduced-motion:no-preference){.hero-visual__ring{animation:ringOrbit 10s cubic-bezier(.45,.05,.55,.95) 1s infinite alternate}.hero-visual__square{animation:squareOrbit 8.6s cubic-bezier(.45,.05,.55,.95) .7s infinite alternate}.hero-visual__square-outline{animation:outlineSquareOrbit 7.8s cubic-bezier(.45,.05,.55,.95) 1.4s infinite alternate}.hero-visual__dot{animation:dotDrift 6.4s ease-in-out .9s infinite alternate}}
@keyframes ringOrbit{0%{transform:translate3d(0,0,0) scale(1)}45%{transform:translate3d(-16px,9px,0) scale(.975)}100%{transform:translate3d(-7px,-10px,0) scale(1.035)}}
@keyframes squareOrbit{0%{transform:translate3d(0,0,0) rotate(18deg)}50%{transform:translate3d(-14px,8px,0) rotate(28deg)}100%{transform:translate3d(7px,-10px,0) rotate(11deg)}}
@keyframes outlineSquareOrbit{0%{transform:translate3d(0,0,0) rotate(-12deg)}50%{transform:translate3d(10px,13px,0) rotate(-4deg)}100%{transform:translate3d(-8px,5px,0) rotate(-20deg)}}
@keyframes dotDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(18px,-10px,0) scale(.72)}}
.hero-visual__panel{transform:translate3d(var(--hero-x,0),var(--hero-y,0),0);transition:transform .55s var(--ease);will-change:transform}
@media(hover:hover){.entry-main .btn-light:hover{transform:translateY(-2px)}.formats-list .format-row,.steps .step{transition:border-color .18s ease}.formats-list .format-row:hover,.steps .step:hover{border-color:#cfd0d6}}
.footer-nav a{min-height:44px;display:inline-flex;align-items:center}.link-cta,.articles-all{padding-block:8px}
@media(max-width:1023px){.contact-card{grid-template-columns:1fr;gap:22px;align-items:start}.contact-card .btn{justify-self:start;width:auto;min-width:220px}}
@media(max-width:640px){.contact-card .btn{width:100%;min-width:0}}

/* Stable proof layout: preserve the editorial grid and prevent metric collisions */
.proof-body{min-width:0}
@media(min-width:1024px){
  .proof-layout{grid-template-columns:260px minmax(0,1fr);gap:48px;align-items:start}
  .proof-head h2{max-width:260px;font-size:32px;line-height:1.06;letter-spacing:-.04em}
  .metrics{grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .metric{min-width:0;padding:28px 24px 30px 0}
  .metric + .metric{padding-left:24px}
  .metric strong{font-size:48px;line-height:.94;letter-spacing:-.045em;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
  .metric p{max-width:250px;margin-top:14px;font-size:14px;line-height:1.55}
  .proof-note{max-width:100%;margin-top:16px}
}
@media(min-width:641px) and (max-width:1023px){
  .proof-layout{grid-template-columns:1fr;gap:28px}
  .proof-head h2{max-width:560px;font-size:34px;line-height:1.04}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metric{min-width:0;padding:26px 24px 28px 0}
  .metric + .metric{padding-left:24px}
  .metric strong{font-size:46px;line-height:.94;white-space:nowrap;font-variant-numeric:tabular-nums}
  .metric:nth-child(3){grid-column:1/-1;margin:0;padding:26px 0 28px;border-left:0;border-top:1px solid var(--line)}
  .metric:nth-child(3) p{max-width:520px}
}
@media(max-width:640px){
  .proof-layout{grid-template-columns:1fr;gap:24px}
  .proof-head h2{max-width:330px;font-size:31px;line-height:1.05}
  .metrics{display:block;border-top:1px solid var(--text)}
  .metric,.metric + .metric,.metric:nth-child(3){display:block;margin:0;padding:22px 0 24px;border-left:0;border-top:0;border-bottom:1px solid var(--line)}
  .metric strong{font-size:42px;line-height:.95;letter-spacing:-.04em;white-space:nowrap;font-variant-numeric:tabular-nums}
  .metric p{max-width:34ch;margin-top:10px}
  .proof-note{margin-top:14px}
}
