.studio-ending{margin:0;padding:48px 24px 64px;scroll-snap-align:start;scroll-snap-stop:always}
.founder-credit{display:grid;grid-template-columns:1fr 2fr auto;gap:32px;align-items:start;padding:28px 0 36px;border-top:1px solid var(--brand-border)}
.founder-credit .founder-label{margin:4px 0 0;font-size:10px;letter-spacing:.06em;color:var(--brand-text-tertiary)}
.founder-credit h2{font-family:DM,Arial,sans-serif;font-size:18px;line-height:1.4;font-weight:500;letter-spacing:-.02em;margin:0 0 8px}
.founder-credit p{max-width:460px;font-size:13px;line-height:1.65;color:var(--brand-text-tertiary);margin:0}
.founder-credit a{font-size:12px;margin-top:4px;text-decoration:none;white-space:nowrap}
.founder-credit a:hover{text-decoration:underline;text-underline-offset:4px}
.studio-standalone .studio-ending .inline-contact{display:block;max-width:none;margin:0;padding:36px 0 0;scroll-snap-align:none;border-top:1px solid var(--brand-border)}
.studio-ending .contact-heading{font-family:DM,Arial,sans-serif;font-size:clamp(26px,2.5vw,36px);line-height:1.15;font-weight:500;letter-spacing:-.035em;margin:0}
.contact-disclosure{display:inline-flex;align-items:center;min-height:44px;margin-top:16px;padding:0;border:0;background:none;font-family:inherit;font-size:13px;color:var(--brand-text);cursor:pointer}
.contact-disclosure:hover{text-decoration:underline;text-underline-offset:5px}
.contact-panel{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 320ms cubic-bezier(.22,1,.36,1),opacity 200ms ease}
.contact-panel.is-open{grid-template-rows:1fr;opacity:1}
.contact-panel-inner{overflow:hidden;min-height:0;max-width:640px}
.contact-panel .inquiry{padding-top:24px;gap:20px}
.contact-panel [hidden]{display:none!important}
.contact-panel .fields{grid-template-columns:1fr 1fr}
.contact-panel .fields label:has([name=company]){grid-column:1/-1;grid-row:2}
.contact-panel .review{border:0;border-radius:0;padding:24px 0;margin:0}
.contact-panel .field input,.contact-panel .field textarea{box-sizing:border-box}
@media(max-width:850px){
 .studio-ending{padding:28px 0 48px}
 .founder-credit{grid-template-columns:1fr;gap:16px;padding:24px 0 28px}
 .founder-credit a{margin-top:0;justify-self:start}
 .studio-standalone .studio-ending .inline-contact{padding-top:28px}
 .contact-panel .fields{grid-template-columns:1fr}
 .contact-panel .fields label:has([name=company]){grid-row:auto}
}
@media(prefers-reduced-motion:reduce){.contact-panel{transition:none}}

/* Match the services' outer grid and their editorial case footers. */
.studio-ending{width:min(1440px,100vw);position:relative;left:50%;transform:translateX(-50%);box-sizing:border-box;padding:28px 64px 64px}
.founder-credit{grid-template-columns:minmax(0,1fr) auto;gap:12px 40px;padding:24px 0 30px;align-items:center}
.founder-credit .founder-label{grid-column:1/-1;margin:0;font-size:9px;letter-spacing:.04em}
.founder-credit h2{font-family:var(--brand-font-editorial);font-size:20px;line-height:1.25;font-weight:400;letter-spacing:-.035em;margin:0 0 6px}
.founder-credit p{font-size:11px;line-height:1.6;max-width:580px}
.founder-credit a{font-size:11px;margin:0}
.studio-standalone .studio-ending .inline-contact{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:40px;row-gap:0;padding-top:40px}
.studio-ending .contact-heading{font-family:var(--brand-font-editorial);font-weight:400;font-size:clamp(38px,4.2vw,60px);line-height:1.08;letter-spacing:-.045em;max-width:700px}
.contact-disclosure{margin:0;justify-self:end;font-size:12px;border-bottom:1px solid var(--brand-border-strong);min-height:36px}
.contact-disclosure:hover{text-decoration:none;border-color:var(--brand-text)}
.contact-panel{grid-column:1/-1;width:100%}
.contact-panel-inner{width:100%;max-width:640px;justify-self:end}
.contact-panel .inquiry{padding-top:36px}
.contact-panel .field input,.contact-panel .field textarea{border-radius:6px;box-shadow:none;background:transparent}
@media(max-width:850px){
 .studio-ending{padding:20px 24px 40px}
 .founder-credit{grid-template-columns:1fr;gap:10px;padding:22px 0 24px}
 .founder-credit .founder-label{grid-column:auto}
 .founder-credit a{justify-self:start;margin-top:4px}
 .studio-standalone .studio-ending .inline-contact{grid-template-columns:1fr;gap:16px;padding-top:28px}
 .studio-ending .contact-heading{font-size:38px;max-width:350px}
 .contact-disclosure{justify-self:start}
 .contact-panel .inquiry{padding-top:12px}
}

/* Contact first; founder credential is a quiet page footer. */
.studio-ending .founder-credit{grid-template-columns:minmax(0,1fr) auto;gap:8px 32px;margin-top:48px;padding:20px 0 0;align-items:end}
.studio-ending .founder-credit .founder-label{font-size:8px;letter-spacing:.04em}
.studio-ending .founder-credit h2{font-family:DM,Arial,sans-serif;font-size:11px;font-weight:500;line-height:1.4;letter-spacing:0;margin:0 0 4px}
.studio-ending .founder-credit p{font-size:10px;line-height:1.5;max-width:600px}
.studio-ending .founder-credit a{font-size:10px}
@media(max-width:850px){
 .studio-ending .founder-credit{grid-template-columns:1fr;gap:8px;margin-top:36px;padding-top:18px}
 .studio-ending .founder-credit a{margin-top:2px}
}

/* The fourth scroll stop is one complete screen, including its footer. */
.studio-ending{
 min-height:100svh;display:flex;flex-direction:column;
 padding:64px 64px 32px;scroll-snap-align:start;scroll-snap-stop:always;
}
.studio-standalone .studio-ending .inline-contact{
 margin:0;border-top:0;padding:0;flex:1;align-content:center;
 scroll-margin-top:64px;
}
.studio-ending .founder-credit{flex:none;margin-top:32px}
@media(max-width:850px){
 .studio-ending{min-height:100svh;padding:40px 24px 24px}
 .studio-standalone .studio-ending .inline-contact{padding:0;align-content:center;scroll-margin-top:40px}
 .studio-ending .founder-credit{margin-top:28px}
}

/* Consistent tactile CTAs; arrows are reserved for navigation. */
.studio-standalone .service-case-action,
.studio-ending .contact-disclosure{
 display:inline-flex;align-items:center;justify-content:center;
 min-height:44px;padding:11px 20px;box-sizing:border-box;
 border:1px solid var(--brand-border-strong);border-radius:8px;
 background:var(--wycf-paper,var(--brand-background));
 color:var(--brand-text);box-shadow:0 2px 4px rgba(41,36,26,.06),inset 0 1px 0 rgba(255,255,255,.8);
 font-family:DM,Arial,sans-serif;font-size:12px;line-height:1.4;
 text-decoration:none;white-space:nowrap;
 transition:background-color 160ms ease,border-color 160ms ease;
}
.studio-standalone .service-case-entry:hover .service-case-action,
.studio-ending .contact-disclosure:hover{background:var(--brand-surface-light);border-color:var(--brand-text-tertiary);text-decoration:none}
.studio-ending .founder-credit a{
 display:inline-flex;align-items:center;justify-content:center;
 min-height:32px;padding:6px 10px;border:1px solid var(--brand-border);border-radius:6px;
 text-decoration:none;justify-self:end;
}
.studio-ending .founder-credit a:hover{border-color:var(--brand-text-tertiary)}
@media(max-width:850px){.studio-ending .founder-credit a{justify-self:start}}
@media(prefers-reduced-motion:reduce){.studio-standalone .service-case-action,.studio-ending .contact-disclosure{transition:none}}

/* Quiet case links; the contact action is the sole primary button. */
.studio-standalone .service-case-entry:hover .service-case-name{text-decoration:underline;text-underline-offset:4px}
.studio-ending .contact-disclosure{background:var(--brand-surface-light);color:var(--brand-text);border-color:var(--brand-border);box-shadow:none;border-radius:6px;padding:11px 20px}
.studio-ending .contact-disclosure:hover{background:var(--brand-background);color:var(--brand-text);border-color:var(--brand-text-tertiary)}
.studio-ending .founder-credit{grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:center}
.founder-avatar{display:block;width:44px;height:44px;border-radius:50%;object-fit:cover}
.studio-ending .founder-credit a{border:0;padding:0;min-height:32px;box-shadow:none;background:none}
.studio-ending .founder-credit a:hover{text-decoration:underline;text-underline-offset:4px}
.screen-progress{position:fixed;right:10px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column}
.screen-progress a{width:28px;height:32px;display:grid;place-items:center;position:relative;color:var(--brand-text,#292720)}
.screen-mark{width:3px;height:13px;border-radius:3px;background:currentColor;opacity:.18;transition:opacity 180ms ease}
.screen-progress a[aria-current] .screen-mark{opacity:.85}
.screen-progress a:hover .screen-mark{opacity:.6}
.screen-tip{position:absolute;right:34px;white-space:nowrap;font:10px/1.4 DM,Arial,sans-serif;opacity:0;pointer-events:none;background:var(--brand-background);padding:4px 6px;border-radius:3px}
.screen-progress a:hover .screen-tip,.screen-progress a:focus-visible .screen-tip{opacity:1}
.screen-progress a:focus-visible{outline:1px solid currentColor;outline-offset:0;border-radius:4px}
html.flagship-open .screen-progress{display:none}
@media(max-width:850px){
 .screen-progress{right:auto;top:auto;bottom:max(8px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);flex-direction:row}
 .screen-progress a{width:32px;height:28px}
 .screen-mark{width:13px;height:3px}
 .screen-tip{display:none}
 .studio-ending{padding-bottom:56px}
 .studio-ending .founder-credit{grid-template-columns:40px minmax(0,1fr);gap:8px 12px}
 .founder-avatar{width:40px;height:40px;grid-row:1/3}
 .studio-ending .founder-credit a{grid-column:2;justify-self:start;margin:0;min-height:24px}
}
@media(prefers-reduced-motion:reduce){.screen-mark{transition:none}}

/* Case actions stay explicit, with a flat secondary button treatment. */
.studio-standalone .service-case-action{
 min-height:36px;padding:8px 14px;border:1px solid var(--brand-border);
 border-radius:6px;background:transparent;box-shadow:none;
 font-size:11px;font-weight:400;
}
.studio-standalone .service-case-entry:hover .service-case-action{
 background:transparent;border-color:var(--brand-text-tertiary);box-shadow:none;
}
.studio-standalone .service-case-entry:hover .service-case-name{text-decoration:none}

/* Keep the focus treatment inside each field, clear of the disclosure's clipping edge. */
.contact-panel .field input:focus,
.contact-panel .field textarea:focus{
 outline:2px solid var(--brand-text-secondary);outline-offset:-2px;
 border-color:var(--brand-text-secondary);box-shadow:none;
}
.contact-panel .inquiry{padding-bottom:6px}
@media(max-width:850px){
 .contact-panel .field input,.contact-panel .field textarea{font-size:16px}
 .studio-ending:has(.contact-panel.is-open){padding-bottom:72px}
}

.service-screen{position:relative}
.service-scroll-cue{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);display:grid;place-items:center;width:44px;height:36px;color:var(--brand-text-tertiary);text-decoration:none}
.service-scroll-cue svg{animation:service-chevron-drift 2.8s ease-in-out infinite;opacity:.65}
.service-scroll-cue:hover svg{opacity:1}
.service-scroll-cue:focus-visible{outline:1px solid var(--brand-text-tertiary);outline-offset:0;border-radius:4px}
@keyframes service-chevron-drift{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@media(max-width:850px){.service-scroll-cue{bottom:32px}.service-screen{padding-bottom:76px}}
@media(prefers-reduced-motion:reduce){.service-scroll-cue svg{animation:none}}

/* A gentle, legible pulse rather than an abrupt blink. */
.service-scroll-cue{color:var(--brand-text-secondary)}
.service-scroll-cue svg{animation:service-chevron-pulse 3.2s ease-in-out infinite}
.service-scroll-cue:hover svg,.service-scroll-cue:focus-visible svg{animation:none;opacity:1}
@keyframes service-chevron-pulse{
 0%,100%{opacity:.28;transform:translateY(-2px)}
 35%,55%{opacity:.85;transform:translateY(2px)}
 80%{opacity:.28;transform:translateY(3px)}
}
@media(prefers-reduced-motion:reduce){.service-scroll-cue svg{animation:none;opacity:.7}}

/* One navigation location across desktop and mobile. */
.screen-progress{right:auto;top:auto;bottom:max(8px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);flex-direction:row}
.screen-progress a{width:32px;height:28px}
.screen-mark{width:13px;height:3px}
.screen-tip{right:auto;left:50%;bottom:32px;transform:translateX(-50%)}
.service-scroll-cue{bottom:38px}
@media(min-width:851px){.service-screen{padding-bottom:80px}.studio-ending{padding-bottom:56px}}

/* A single continuous progress track, with four accessible navigation targets. */
.screen-progress{width:128px;height:28px;isolation:isolate}
.screen-progress::before,.screen-progress::after{content:"";position:absolute;left:0;right:0;top:13px;height:2px;border-radius:2px;background:var(--brand-text,#292720);pointer-events:none}
.screen-progress::before{opacity:.14}
.screen-progress::after{opacity:.7;transform-origin:left;transform:scaleX(var(--screen-progress,.25))}
.screen-progress a{flex:1;min-width:0}
.screen-progress .screen-mark{display:none}
.service-scroll-cue{display:none}

/* A quiet completion cue on the final screen, reversible when scrolling back. */
.screen-complete{position:absolute;left:calc(100% + 8px);top:7px;width:14px;height:14px;color:var(--brand-text);opacity:0;transform:translateY(3px);pointer-events:none;transition:opacity 240ms ease,transform 320ms cubic-bezier(.22,1,.36,1)}
.screen-complete path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 380ms ease}
.screen-progress.is-complete .screen-complete{opacity:.75;transform:translateY(0);transition-delay:160ms}
.screen-progress.is-complete .screen-complete path{stroke-dashoffset:0;transition-delay:220ms}
@media(prefers-reduced-motion:reduce){.screen-complete,.screen-complete path{transition:none}}

/* Completion replaces the progress track in the same position. */
.screen-progress::before,.screen-progress::after{transition:opacity 220ms ease}
.screen-complete{left:50%;top:0;width:28px;height:28px;box-sizing:border-box;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;transform:translateX(-50%) scale(.85);opacity:0;transition:opacity 240ms ease,transform 320ms cubic-bezier(.22,1,.36,1)}
.screen-progress.is-complete::before,.screen-progress.is-complete::after{opacity:0}
.screen-progress.is-complete .screen-complete{opacity:.7;transform:translateX(-50%) scale(1);transition-delay:140ms}
.screen-progress.is-complete a{visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){.screen-progress::before,.screen-progress::after,.screen-complete{transition:none}}

/* The hero has its own invitation; progress begins with the service chapters. */
.screen-progress{transition:opacity 220ms ease,visibility 220ms ease}
.screen-progress.is-on-hero{opacity:0;visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){.screen-progress{transition:none}}

/* Founder link uses the same flat secondary action as the case footers. */
.studio-ending .founder-credit a{
 display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;
 min-height:36px;padding:8px 14px;margin:0;
 border:1px solid var(--brand-border);border-radius:6px;
 background:transparent;box-shadow:none;color:var(--brand-text);
 font-family:DM,Arial,sans-serif;font-size:11px;font-weight:400;line-height:1.4;
 text-decoration:none;white-space:nowrap;
 transition:border-color 240ms var(--studio-ease),scale 220ms var(--studio-ease);
}
.studio-ending .founder-credit a:hover{border-color:var(--brand-text-tertiary);text-decoration:none;background:transparent}
.studio-ending .founder-credit a:active{scale:.97}
.studio-ending .founder-credit a:focus-visible{outline:2px solid var(--brand-text-secondary);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.studio-ending .founder-credit a{transition:none}}

/* One invitation: heading, action, then the expanding form. */
.studio-standalone .studio-ending .inline-contact{grid-template-columns:minmax(0,1fr);row-gap:0}
.studio-ending .contact-disclosure{justify-self:start;margin-top:24px}
.studio-ending .contact-panel-inner{justify-self:start}
