/* Nuuch polish layer (11 Oct 2026). Loaded after v2.css. Motion tokens, press feedback, menus that open from their
   trigger, staggered reveals, spacing rhythm, form states. Transform/opacity only; hover gated to mouse devices. */
:root{--ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);--ease-drawer:cubic-bezier(.32,.72,0,1);
  --t-fast:140ms;--t-ui:200ms;--shadow-tint:0 22px 48px -24px rgba(28,84,170,.7)}
h1,h2,h3,.s-head p,.hero2 .lead{text-wrap:balance}
.s-head h2{letter-spacing:-.02em}

/* ---- pressables: instant feedback, hover only where there is a pointer ---- */
.btn{transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t-ui) var(--ease-out),background var(--t-ui) ease,border-color var(--t-ui) ease}
.btn:active{transform:scale(.97)}
.btn-primary:hover{transform:none}
.card,.also a,.filters a,.ftr .soc a,.mainnav>a,.mainnav .dd>button,.dd-menu a,.burger,.price,.point,.feat{transition:transform var(--t-fast) var(--ease-out),border-color var(--t-ui) ease,box-shadow var(--t-ui) var(--ease-out),background var(--t-ui) ease,color var(--t-ui) ease}
.card:active,.also a:active,.filters a:active,.ftr .soc a:active,.dd-menu a:active,.burger:active,.feats a.feat:active{transform:scale(.98)}
.card .art img{transition:transform 400ms var(--ease-out)}
.card .go svg,.learn svg{transition:transform var(--t-fast) var(--ease-out)}
.card:hover,.card:hover .art img,.card:hover .go svg,.btn-primary:hover{transform:none;box-shadow:none}
.card:hover{border-color:var(--line-2)}
@media(hover:hover) and (pointer:fine){
  .btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px -10px rgba(86,166,255,.7)}
  .card:hover{transform:translateY(-2px);border-color:rgba(91,224,255,.42);box-shadow:var(--shadow-tint)}
  .card:hover .art img{transform:scale(1.03)}
  .card:hover .go svg{transform:translateX(4px)}
  .hud::before,.hud::after{transition:border-color var(--t-ui) ease,box-shadow var(--t-ui) ease}
  .hud:hover::before,.hud:hover::after{border-color:var(--cyan);box-shadow:0 0 10px rgba(91,224,255,.45)}
  .price:hover,.point:hover{border-color:rgba(91,224,255,.3)}
}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}

/* ---- services dropdown: scales in from its button, closes faster than it opens ---- */
.dd>button svg{transition:transform var(--t-ui) var(--ease-out)}
.dd-menu{transform-origin:36px top;transform:translateY(-4px) scale(.97);
  transition:opacity var(--t-fast) var(--ease-out),transform var(--t-fast) var(--ease-out),visibility 0s linear var(--t-fast)}
.dd.open .dd-menu{transform:none;transition:opacity var(--t-ui) var(--ease-out),transform var(--t-ui) var(--ease-out),visibility 0s}

/* ---- mobile menu: eases open instead of snapping (browsers without @starting-style just show it) ---- */
#mnav.mnav.open{opacity:1;transform:none;transition:opacity 180ms var(--ease-out),transform 220ms var(--ease-out)}
#mnav.mnav.open{@starting-style{opacity:0;transform:translateY(-8px)}}
.burger svg{transition:transform var(--t-ui) var(--ease-out)}
.burger[aria-expanded=true] svg{transform:rotate(90deg)}

/* ---- reveals: shorter, stronger curve, and grids cascade instead of fading as one block ---- */
html.js .reveal:not(.now){transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
html.js .reveal:not(.now):not(.in){transform:translateY(16px)}
.svc>.card.reveal:nth-child(2),.feats>.feat.reveal:nth-child(2){transition-delay:60ms}
.svc>.card.reveal:nth-child(3),.feats>.feat.reveal:nth-child(3){transition-delay:120ms}
.feats>.feat.reveal:nth-child(4){transition-delay:180ms}.feats>.feat.reveal:nth-child(5){transition-delay:240ms}
.feats>.feat.reveal:nth-child(6){transition-delay:300ms}.feats>.feat.reveal:nth-child(7){transition-delay:360ms}
/* a revealed wrapper that holds a grid: the wrapper stays put, its grid items cascade */
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc){opacity:1;transform:none;transition:none}
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>*{transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
html.js .reveal:not(.now):not(.in):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>*{opacity:0;transform:translateY(16px)}
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>:nth-child(2){transition-delay:50ms}
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>:nth-child(3){transition-delay:100ms}
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>:nth-child(4){transition-delay:150ms}
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>:nth-child(5){transition-delay:200ms}
html.js .reveal:not(.now):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>:nth-child(6){transition-delay:250ms}

/* ---- rhythm: more air where it matters, tighter where it doesn't ---- */
.s{padding:96px 0}
.hero2+.s{padding-top:88px}
.s-head{margin-bottom:48px}
.s-head p{max-width:600px}
.s-head.center p{margin-left:auto;margin-right:auto}
.svc{gap:24px}.prices{gap:22px}.points{gap:20px}
.final{padding:64px 28px}
.ftr{padding-top:64px}
.hero2 .lead{line-height:1.6}
.hero2 .btn-row{margin-top:.2rem}
@media(max-width:760px){.s{padding:64px 0}.hero2+.s{padding-top:56px}.s-head{margin-bottom:32px}.final{padding:44px 20px}}

/* ---- contact form: busy, invalid and success states ---- */
.form-field input,.form-field textarea,.form-field select{transition:border-color var(--t-ui) ease,box-shadow var(--t-ui) ease}
.form-field input:user-invalid,.form-field textarea:user-invalid{border-color:#ff7070;box-shadow:0 0 0 3px rgba(255,112,112,.12)}
.form-submit{position:relative}
.form-submit.is-busy{pointer-events:none;color:transparent}
.form-submit.is-busy::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
[data-fs-success]:not(:empty){font-family:'Inter',system-ui,sans-serif;font-size:.98rem;padding:1rem 1.1rem;border-radius:12px;display:flex;gap:.6rem;align-items:flex-start;line-height:1.45}
[data-fs-success]:not(:empty)::before{content:"";flex:0 0 18px;height:18px;margin-top:.1rem;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2304070E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/12px no-repeat}
[data-fs-success]:not(:empty),[data-fs-error]:not(:empty){animation:rise .35s var(--ease-out) both}
@keyframes rise{from{opacity:0;transform:translateY(6px)}}
form.is-sent .form-field,form.is-sent .form-submit{display:none}

/* ---- reduced motion: keep the fades, drop the movement ---- */
@media(prefers-reduced-motion:reduce){
  .btn:active,.card:active,.also a:active,.filters a:active,.ftr .soc a:active,.dd-menu a:active,.burger:active,.feats a.feat:active{transform:none}
  html.js .reveal:not(.now):not(.in),html.js .reveal:not(.now):not(.in):has(>.prices,>.points,>.proc,>.gallery,>.svc)>*>*{transform:none}
  .dd-menu,#mnav.mnav.open{transition:opacity 150ms ease}
  .dd-menu{transform:none}
  .form-submit.is-busy::after{animation-duration:1.2s}
}

/* ---- contact form: readable labels, data-use line (audit 11 Oct 2026) ---- */
.form-field label{text-transform:none;font-family:inherit;font-size:.95rem;letter-spacing:0;color:#c3cee2;font-weight:500}
.form-field label span{font-weight:400;color:var(--muted)}
.form-privacy{margin-top:.9rem;font-size:.85rem;color:var(--muted);line-height:1.5}
.form-privacy a{color:var(--blue-hi)}

/* ---- services menu in three groups + coaching (11 Oct 2026) ---- */
.dd-menu.groups{min-width:0;width:760px;max-width:calc(100vw - 40px);display:grid;grid-template-columns:repeat(3,1fr);gap:.25rem .75rem;padding:.9rem;transform-origin:120px top}
.dd-menu.groups .grp{display:flex;flex-direction:column;gap:.1rem}
.dd-menu.groups .grp-h{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);padding:.35rem .85rem .45rem}
.dd-menu.groups .grp-wide{grid-column:1/-1;border-top:1px solid var(--line);margin-top:.35rem;padding-top:.4rem}
.dd-menu.groups .grp-wide a{display:flex;gap:.6rem;align-items:baseline}
.dd-menu.groups .grp-wide a small{margin:0}
#mnav.mnav .sub .lbl2{display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);padding:.9rem .25rem .15rem}
#mnav.mnav .sub a{padding-left:.9rem}
/* ---- hero pulse line: supporting detail, not a banner ---- */
.hero2 .pulse-rule{height:64px;margin:0 0 18px;opacity:.75}
.hero2 .pulse-mark{width:120px;height:64px}
.hero2 .pulse-mark img{width:84px;filter:drop-shadow(0 0 8px rgba(86,166,255,.45))}
.hero2 .pulse-mark::before{inset:-20%}
@media(min-width:1000px){.hero2 .pulse-rule{height:72px;margin-bottom:22px}.hero2 .pulse-mark{width:140px;height:72px}.hero2 .pulse-mark img{width:96px}}
@media(max-width:760px){.hero2 .pulse-rule{height:52px;margin-bottom:14px}.hero2 .pulse-mark{width:100px;height:52px}.hero2 .pulse-mark img{width:68px}}

/* ---- Our Work demos (11 Oct 2026) ---- */
.demo-h{font-size:1.05rem;margin:1.4rem 0 .4rem;display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:baseline}
.demo-tag{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;color:var(--dim);text-transform:uppercase}
.demo-p{color:var(--muted);font-size:.95rem;margin-bottom:.8rem}
.demo-video{display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line-2);background:#000}
.demo-steps{margin:1rem 0 .4rem 1.2rem;display:grid;gap:.5rem;color:var(--muted);font-size:.95rem}
.demo-steps b{color:var(--text)}
@media(min-width:880px){#proof .feats{grid-template-columns:repeat(3,1fr)}}

/* anchors land below the sticky header */
[id]{scroll-margin-top:84px}