/* Supporting pages: the current HumanAmp system, composed for each purpose. */
.ha-supporting{--support-gutter:clamp(20px,5.5vw,80px);--support-rule:rgba(41,43,47,.16);}
.ha-supporting :is(h1,h2,h3){text-wrap:balance;}
.ha-supporting main p{text-wrap:pretty;}
.ha-supporting .site-header{gap:12px;min-height:72px;padding-block:14px;background:rgba(41,43,47,.94);backdrop-filter:blur(18px);}
.ha-supporting .site-header>.brand{margin-right:auto;}
.ha-supporting .site-header .review-navigation{display:flex!important;gap:12px;flex:none;width:auto;}
.ha-supporting .site-header .review-portal{display:none;}
.ha-supporting .site-header .review-home{display:inline-flex;}
.support-menu{position:relative;color:var(--ha-paper);}
.support-menu summary{display:flex;gap:16px;align-items:center;min-height:44px;padding:0 14px;border:1px solid #ffffff38;border-radius:5px;font-size:14px;font-weight:700;list-style:none;cursor:pointer;}
.support-menu summary::-webkit-details-marker{display:none;}
.support-menu nav{position:absolute;top:calc(100% + 14px);right:0;width:260px;z-index:200;display:grid;padding:12px 22px 20px;background:var(--ha-ink);border:1px solid #ffffff38;box-shadow:0 16px 40px #0004;}
.support-menu nav a{min-height:46px;display:flex;align-items:center;color:var(--ha-paper);font-size:16px;text-decoration:none;border-bottom:1px solid #ffffff25;}
.support-menu :is(summary,a):focus-visible{outline:2px solid var(--ha-bloom);outline-offset:4px;}
.ha-supporting main h1{font-size:clamp(38px,4.5vw,62px)!important;line-height:1.06!important;letter-spacing:-.045em!important;font-weight:800!important;}
.ha-supporting main h2{font-size:clamp(27px,3vw,40px);line-height:1.12;letter-spacing:-.035em;}
.ha-supporting main :is(.work-opening,.session-opening,.amp-opening,.studio-opening,.about-opening,.method-opening,.service-directory-hero){padding-block:clamp(48px,6vw,80px);}
.ha-supporting main :is(.work-opening,.session-opening,.about-opening){gap:clamp(32px,5vw,72px);}
.ha-supporting main :is(.work-opening-copy,.session-opening-copy,.about-opening-copy)>p{max-width:46ch;}
.ha-supporting .ha-footer{padding-block:56px 24px;gap:36px 64px;border-top:1px solid #ffffff20;}
.ha-supporting .ha-footer .footer-partners{grid-column:1/-1;flex-basis:100%;padding-block:24px;margin:0;border-block:1px solid #ffffff25;color:var(--ha-vapour);font-size:16px;line-height:1.6;}
.ha-supporting .ha-footer .footer-partners a{color:var(--ha-paper);text-underline-offset:5px;}
.ha-supporting .ha-footer .footer-legal{grid-column:1/-1;flex-basis:100%;font-size:11px;max-width:90ch;line-height:1.7;margin-top:8px;}
/* A recognisable conversation, with all prompts inside its bubble. */
.ha-supporting main .page-final-conversation{display:grid;grid-template-columns:minmax(210px,.618fr) minmax(0,1fr);align-items:center;gap:clamp(28px,5vw,64px);padding:clamp(64px,7vw,96px) var(--support-gutter);background:var(--ha-ink);color:var(--ha-paper);border-top:1px solid #ffffff22;}
.support-amp-seat{position:relative;aspect-ratio:1;max-width:340px;width:100%;justify-self:center;}
.ha-supporting .page-final-conversation .session-amp-anchor{display:block;position:absolute;inset:0;width:100%;height:100%;margin:0;}
.support-conversation-bubble{position:relative;background:var(--ha-paper);color:var(--ha-ink);padding:clamp(24px,3vw,40px);border-radius:24px;box-shadow:0 2px 0 #ffffff22;}
.support-conversation-bubble::before{content:'';position:absolute;left:-20px;bottom:48px;border-right:22px solid var(--ha-paper);border-top:16px solid transparent;border-bottom:6px solid transparent;}
.ha-supporting .support-conversation-bubble h2{color:var(--ha-ink);font-size:clamp(28px,3vw,40px);margin:0 0 14px;}
.ha-supporting .support-conversation-bubble p{color:var(--ha-support-on-paper);font-size:16px;line-height:1.55;}
.ha-supporting .page-final-conversation .session-amp-panel{padding:0;min-height:0;border:0;}
.ha-supporting .session-amp-panel>p{display:none;}
.ha-supporting .page-final-conversation .session-prompts{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.ha-supporting .page-final-conversation .session-prompts button{font-size:13px;line-height:1.4;min-height:44px;padding:10px 14px;border:1px solid #292b2f40;background:transparent;border-radius:22px;box-shadow:none;}
.ha-supporting .page-final-conversation .session-prompts button:hover{background:var(--ha-ink);color:var(--ha-paper);}
.support-chat-link{display:inline-flex;align-items:center;gap:18px;min-height:48px;padding:10px 20px;margin-top:24px;background:var(--ha-bloom);border-radius:26px;color:var(--ha-ink);font-size:16px;font-weight:800;text-decoration:none;}
/* Services is a visual route into four different kinds of work. */
.ha-supporting .service-directory-hero{display:grid;grid-template-columns:1fr .8fr;gap:64px;align-items:end;background:var(--ha-ink);color:var(--ha-vapour);}
.ha-supporting .service-directory-hero h1{margin:0;color:var(--ha-vapour);}.ha-supporting .service-directory-hero .message-key{color:var(--ha-paper);}
.ha-supporting .service-directory-hero p{margin:0;color:var(--ha-vapour);font-size:19px;max-width:42ch;}
.ha-supporting .support-service-routes{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-block:48px 72px;background:var(--ha-paper);}
.support-service-route{display:grid;grid-template-columns:.8fr 1fr;align-items:center;gap:24px;min-width:0;padding:24px 0;border-bottom:1px solid var(--support-rule);color:var(--ha-ink);text-decoration:none;}
.support-route-art{height:220px;overflow:hidden;background:var(--ha-bone-alt);}
.support-route-art img{display:block;width:100%;height:100%;object-fit:cover;}
.support-route-amp .support-route-art img{object-fit:contain;transform:scale(1.25);}
.support-route-it .support-route-art img{object-position:50% 25%;}
.support-route-label{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ha-support-on-paper);font-weight:800;}
.ha-supporting .support-service-route h2{font-size:clamp(23px,2.2vw,31px);margin:10px 0;}
.support-service-route p{font-size:15px;line-height:1.55;margin:0;}.support-route-arrow{display:block;font-size:26px;margin-top:14px;}
.support-service-route:hover .support-route-arrow{color:var(--ha-bloom-deep);transform:translate(3px,-3px);}.support-service-route:focus-visible{outline:3px solid var(--ha-bloom-deep);outline-offset:8px;}
/* Method: three chapters, not four renamed stages. */
.ha-supporting .support-method{padding-block:48px 64px;background:var(--ha-ink);}
.support-method ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.support-method li{padding:18px;background:var(--ha-phase-mine);border:1px solid #ffffff30;color:var(--ha-paper);}
.support-method li:nth-child(2){background:var(--ha-phase-solve);}.support-method li:nth-child(3){background:var(--ha-bloom);color:var(--ha-ink);}
.support-step-number{display:block;font-size:12px;letter-spacing:.1em;margin:0 0 14px;opacity:.75;}
.support-method img{width:100%;aspect-ratio:1.618;object-fit:cover;display:block;margin-bottom:20px;}
.ha-supporting .support-method h2,.ha-supporting .support-method h3,.ha-supporting .support-method p{color:inherit;}
.ha-supporting .support-method h2{font-size:30px;margin:0 0 16px;}.support-method h3{font-size:17px;margin:0 0 8px;}.support-method p{font-size:15px;line-height:1.6;margin:0;}
.ha-supporting .work-wall-simple{display:grid;grid-template-columns:.618fr 1fr;gap:48px;align-items:center;}
.ha-supporting .work-wall-simple .work-original-sketch{min-width:0;}
.ha-supporting .work-wall-simple .work-wall-intro{margin:0;}
/* IT starts with Dave and the real handover, then the dependable foundations. */
.support-it-scene{display:grid;grid-template-columns:.5fr 1fr;gap:48px;align-items:end;margin-top:44px;padding-top:32px;border-top:1px solid #ffffff28;}
.support-it-person{display:flex;align-items:center;gap:20px;}.support-it-person img{width:112px;aspect-ratio:1;object-fit:cover;object-position:center 25%;clip-path:polygon(0 0,100% 0,100% 85%,85% 100%,0 100%);}
.support-it-person span{font-family:Caveat,cursive;font-size:26px;line-height:1.15;color:var(--ha-paper);}
.support-it-flow>p{font-size:12px;font-weight:700;margin:0 0 18px;color:var(--ha-vapour);}
.support-it-flow ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.support-it-flow li{position:relative;border-top:2px solid var(--ha-bloom);padding-top:14px;}.support-it-flow li>span{font-size:11px;color:var(--ha-vapour);display:block;margin-bottom:10px;}
.support-it-flow strong{font-size:17px;color:var(--ha-paper);line-height:1.4;display:block;}.support-it-flow li p{font-size:13px;line-height:1.5;color:var(--ha-vapour);margin:8px 0 0;}
.ha-supporting .it-start blockquote{font-size:18px;line-height:1.6;border-left:2px solid var(--ha-bloom);padding-left:24px;}
/* Design: actual sketches give the product section an artefact to discuss. */
.support-design-sketch{grid-column:1/-1;max-width:820px;margin:0 auto 24px;transform:rotate(-1deg);}
.support-design-sketch img{display:block;width:100%;aspect-ratio:1.8;object-fit:cover;border:10px solid var(--ha-paper);box-shadow:5px 7px 0 #292b2f18;}
.support-design-sketch figcaption{font:700 25px/1.3 Caveat,cursive;color:var(--ha-support-on-paper);margin:14px 0 0;}
.ha-supporting .studio-showcase{padding-bottom:32px;}.ha-supporting .studio-digital{padding-top:32px;}
/* Founder and utility pages favour clear reading over spectacle. */
.ha-supporting .about-opening{background:var(--ha-ink);color:var(--ha-vapour);}
.ha-supporting .about-opening h1{color:var(--ha-vapour);}.ha-supporting .about-opening .message-key{color:var(--ha-paper);}.ha-supporting .about-opening p{color:var(--ha-vapour);}
.ha-supporting .about-biography{border-top:1px solid var(--support-rule);}.ha-supporting .about-biography h2{max-width:20ch;}
.ha-supporting .about-biography p{max-width:64ch;line-height:1.7;}.ha-supporting .about-background{padding-block:44px;border-top:1px solid var(--support-rule);}
.ha-supporting .contact-founders img{border-radius:0;clip-path:polygon(0 0,100% 0,100% 85%,85% 100%,0 100%);}
.ha-supporting .contact-amp{border-radius:24px;}.ha-supporting .contact-amp-anchor{width:240px;height:240px;}
.ha-supporting .contact-support{border-radius:0;}.ha-supporting .contact-support h2{color:var(--ha-paper)!important;}
.ha-supporting .method-opening{background:var(--ha-ink);color:var(--ha-vapour);}.ha-supporting .method-opening :is(h1,p){color:var(--ha-vapour);}.ha-supporting .method-opening .message-key{color:var(--ha-paper);}
.ha-supporting .method-tools{padding-block:64px;}.ha-supporting .method-into-work{border-top:1px solid var(--support-rule);}
.ha-supporting .privacy-main{max-width:1120px;margin-inline:auto;}.ha-supporting .privacy-main section{scroll-margin-top:96px;}
.ha-chat-entry main h1{font-size:clamp(38px,5vw,62px);letter-spacing:-.04em;}
.not-found-main{min-height:65vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:20px;}
.ha-portal-system .portal-access{border-left:3px solid var(--ha-bloom);}.ha-portal-system .portal-main h1{text-wrap:balance;}
@media(max-width:1000px){
 .support-service-route{grid-template-columns:1fr;gap:16px;}.support-route-art{height:220px;}
 .support-it-scene{grid-template-columns:1fr;}.support-it-person{max-width:400px;}
 .ha-supporting .work-wall-simple{grid-template-columns:1fr;}
}
@media(max-width:760px){
 .ha-supporting .site-header{min-height:60px;gap:8px;padding-block:8px;}.ha-supporting .site-header .brand{font-size:20px;}.ha-supporting .site-header .brand img{width:25px;height:25px;}
 .ha-supporting .site-header .review-navigation .nav-talk{padding:0 12px;}.support-menu summary{padding:0 10px;font-size:13px;gap:10px;}
 .ha-supporting main h1{font-size:clamp(34px,9vw,48px)!important;}
 .ha-supporting main .page-final-conversation{grid-template-columns:1fr;padding-block:64px;gap:24px;}
 .support-amp-seat{max-width:230px;}.support-conversation-bubble::before{left:50%;bottom:100%;border:0;border-bottom:20px solid var(--ha-paper);border-left:15px solid transparent;border-right:6px solid transparent;}
 .ha-supporting .service-directory-hero{grid-template-columns:1fr;gap:24px;}.ha-supporting .service-directory-hero p{font-size:17px;}
 .ha-supporting .support-service-routes{grid-template-columns:1fr;gap:8px;padding-block:20px 44px;}.support-service-route{grid-template-columns:.72fr 1fr;gap:20px;padding-block:24px;}.support-route-art{height:185px;}.ha-supporting .support-service-route h2{font-size:25px;}.support-route-label{font-size:10px;}
 .support-method ol{grid-template-columns:1fr;gap:20px;}.support-method li{display:grid;grid-template-columns:.75fr 1fr;gap:0 20px;}.support-method img{grid-column:1;grid-row:2/6;aspect-ratio:1;height:100%;min-height:155px;margin:0;}.support-method .support-step-number{grid-column:1/-1;}.support-method :is(h2,h3,p){grid-column:2;}.ha-supporting .support-method h2{font-size:27px;margin-bottom:12px;}.support-method h3{font-size:16px;}.support-method p{font-size:14px;}
 .support-it-flow ol{grid-template-columns:1fr;gap:22px;}.support-it-flow li{display:grid;grid-template-columns:30px 1fr;gap:0 14px;}.support-it-flow li p{grid-column:2;}.support-it-flow li>span{grid-row:1/3;}
 .ha-supporting .ha-footer{padding-block:44px 24px;}.ha-supporting .ha-footer .footer-partners{font-size:15px;}
 .support-design-sketch img{aspect-ratio:1.2;}.support-design-sketch figcaption{font-size:22px;}
}
@media(max-width:360px){.support-service-route{grid-template-columns:1fr;}.support-route-art{height:180px;}.support-method li{display:block;}.support-method img{height:auto;aspect-ratio:1.618;margin-bottom:18px;}}
@media(prefers-reduced-motion:reduce){.support-route-arrow{transition:none;}}
/* Keep the pale heading hierarchy legible on the charcoal openings. */
.ha-supporting :is(.about-opening,.method-opening) .message-support{color:var(--ha-vapour);}
.ha-supporting .contact-amp-anchor{max-width:100%;aspect-ratio:1;height:auto;}
@media(max-width:360px){
 .ha-supporting .site-header{flex-wrap:nowrap;gap:6px;}
 .ha-supporting .site-header>.brand{font-size:17px;gap:5px;min-width:0;}
 .ha-supporting .site-header>.brand img{width:22px;height:22px;}
 .ha-supporting .site-header .review-navigation{gap:0;}
 .ha-supporting .site-header .review-navigation .nav-talk{font-size:13px;padding-inline:10px;}
 .support-menu summary{gap:6px;padding-inline:8px;font-size:12px;}
}
.ha-supporting main :is(.about-opening,.method-opening) h1{color:var(--ha-vapour)!important;}
@media(max-width:760px){
 .ha-supporting .contact-amp-stage{flex-direction:column;gap:24px;}
 .ha-supporting .contact-amp-speech::after{top:auto;bottom:-13px;right:30px;transform:none;clip-path:polygon(0 0,100% 0,40% 100%);}
}
.desk-showcase{position:relative;}
.desk-showcase .support-current-screen{position:absolute;left:16.6%;top:10.2%;width:65.2%;height:52.8%;object-fit:fill;border-radius:0;box-shadow:none;}
/* The foreground phone remains in front of the monitor screen. */
.desk-showcase .support-current-screen{clip-path:polygon(0 0,100% 0,100% 63%,97% 63%,96% 65%,94.8% 100%,0 100%);}
/* Chapter starts are magnetic, never mandatory. Utility pages stay free-scrolling. */
html:has(body[data-page-detents]){scroll-snap-type:y proximity;scroll-padding-top:0;}
body[data-page-detents]{scroll-snap-align:start;}
body[data-page-detents] main>section:not(:first-child){scroll-snap-align:start;scroll-snap-stop:normal;scroll-margin-top:0;}
body[data-page-detents] main>section section{scroll-snap-align:none;}
body[data-page-detents] :is(h2,h3,[id]){scroll-margin-top:24px;}
body[data-page-detents] main>section:not(:first-child){scroll-margin-top:0;}
/* Copy and controls never wait for an observer or fade as a whole page panel. */
.ha-supporting .ha-section-reveal{opacity:1!important;transform:none!important;transition:none!important;will-change:auto!important;}
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .ha-supporting :is(.support-route-art,.support-method img,.support-design-sketch img){
   animation:support-art-arrive linear both;animation-timeline:view();animation-range:entry 0% entry 65%;
  }
 }
}
@keyframes support-art-arrive{from{opacity:.7;translate:0 10px;}to{opacity:1;translate:0 0;}}
@media(prefers-reduced-motion:reduce){
 html:has(body.ha-supporting){scroll-snap-type:none;scroll-behavior:auto;}
 .ha-supporting *,.ha-supporting *::before,.ha-supporting *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}

@media(max-width:400px){
 .ha-supporting .site-header{flex-wrap:nowrap;gap:6px;}
 .ha-supporting .site-header>.brand{font-size:15px;gap:4px;min-width:0;}
 .ha-supporting .site-header>.brand img{width:20px;height:20px;}
 .ha-supporting .site-header .review-navigation{flex-wrap:nowrap;gap:4px;}
 .ha-supporting .site-header .review-navigation .nav-talk{font-size:13px;padding-inline:9px;}
 .support-menu summary{padding-inline:8px;gap:6px;font-size:12px;}
}
.ha-supporting .session-note::after,.ha-supporting .evidence-note::after{clip-path:polygon(0 0,100% 0,0 100%);}
.ha-supporting .it-dave-note::before{clip-path:polygon(100% 0,100% 100%,0 0);}
.scene-depth-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 28px;padding:24px clamp(16px,5.5vw,80px);background:var(--ha-paper);color:var(--ha-ink);border-top:1px solid var(--ha-hairline);}
.scene-depth-links a{font-size:15px;font-weight:700;text-underline-offset:4px;color:inherit;}
.scene-depth-links a:focus-visible{outline:2px solid var(--ha-blue);outline-offset:5px;}
/* One recognisable Amp conversation across the supporting marketing pages. */
.ha-supporting main .page-final-conversation{grid-template-columns:170px minmax(0,1fr);gap:32px;background:color-mix(in srgb,var(--ha-bloom) 32%,var(--ha-paper));color:var(--ha-ink);}
.ha-supporting .page-final-conversation .support-amp-seat{width:164px;max-width:none;height:164px;justify-self:start;}
.ha-supporting .support-conversation-bubble{background:var(--ha-card,var(--ha-paper));border:1px solid var(--ha-hairline);border-radius:24px;box-shadow:0 7px 20px #292b2f0a;padding:28px;}
.ha-supporting .support-conversation-bubble::before{box-sizing:border-box;left:-10px;bottom:auto;top:50%;width:18px;height:18px;background:var(--ha-card,var(--ha-paper));border:1px solid var(--ha-hairline);border-top:0;border-right:0;transform:translateY(-50%) rotate(45deg);}
.ha-supporting .support-conversation-bubble h2{font-size:27px;line-height:1.15;letter-spacing:-.03em;margin:0 0 14px;}
.ha-supporting .support-conversation-bubble p{font-size:18px;line-height:1.5;margin:0;}
.ha-supporting .page-final-conversation .session-prompts{gap:12px;margin-top:22px;}
.ha-supporting .page-final-conversation .session-prompts button,.ha-supporting .support-chat-link{font:650 13px/1.4 var(--ha-font-sans,Manrope,sans-serif);border:1px solid var(--ha-hairline);background:transparent;color:var(--ha-ink);border-radius:6px;box-shadow:none;padding:12px 14px;min-height:44px;cursor:pointer;text-decoration:none;}
.ha-supporting .support-chat-link{margin-top:12px;}
.ha-supporting .support-chat-link:focus-visible{outline:3px solid var(--ha-blue);outline-offset:4px;}
@media(max-width:600px){
 .ha-supporting main .page-final-conversation{grid-template-columns:minmax(0,1fr);gap:26px;}
 .ha-supporting .page-final-conversation .support-amp-seat{width:120px;height:120px;}
 .ha-supporting .support-conversation-bubble{padding:24px;}
 .ha-supporting .support-conversation-bubble::before{top:-10px;left:48px;border:1px solid var(--ha-hairline);border-bottom:0;border-right:0;transform:rotate(45deg);}
 .ha-supporting .page-final-conversation .session-prompts{display:grid;grid-template-columns:minmax(0,1fr);}
}
