/* Hallmark · existing brand · scope: public-site motion · signature: report journey · palette: preserved */
/* Critique: prioritize a legible process, purposeful movement and a complete static fallback. */
.hero{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);padding-block:var(--space-2xl);gap:var(--space-2xl)}
.hero h1{font-size:clamp(3.25rem,5.3vw,5.2rem);max-width:15ch;line-height:1.06}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-lg);margin-top:var(--space-xl)}
.hero-actions .button{margin-top:0}
.hero-actions .button>svg{display:block;transition:transform var(--dur-short) var(--ease-out)}
.hero-actions .button:hover>svg{transform:translate(2px,-2px)}
.button.btn:hover{transform:translateY(-3px)}
.button.btn:active{transform:translateY(1px)}
.process-link{display:inline-flex;align-items:center;min-height:44px;font-size:var(--text-sm);text-decoration-thickness:1px;transition:transform var(--dur-short) var(--ease-out)}
.process-link:hover{transform:translateX(3px)}
.header .nav-link{position:relative;transition:transform var(--dur-short) var(--ease-out)}
.header.navbar,.service,.flow-list li,.monthly-note,.quote-stub,.faq-list details,.faq-list details:last-child{border:0}
.acuse-image,.client-preview img{border:0}
.faq-list{gap:var(--space-xs) var(--space-lg)}
.faq-list details{padding:var(--space-md) var(--space-lg);background:var(--color-paper-2);border-radius:var(--radius-input)}
.header .nav-link::after{content:"";position:absolute;inset:auto 0 3px;height:2px;background:var(--color-accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-short) var(--ease-out)}
.header .nav-link:hover::after,.header .nav-link:focus-visible::after{transform:scaleX(1)}
.brand img{transition:transform var(--dur-short) var(--ease-out)}
.brand:hover img{transform:rotate(-7deg) scale(1.08)}
.process-demo{min-width:0;width:100%;padding:var(--space-lg);background:var(--color-paper-2);border-radius:var(--radius-card)}
.process-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);min-height:44px}
.process-heading>p{font-size:var(--text-lg);font-weight:600;color:var(--color-ink)}
.process-toggle,.process-restart{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-xs);min-height:44px;padding:var(--space-xs) var(--space-sm);border:0;border-radius:var(--radius-input);background:var(--color-paper-3);color:var(--color-ink-2);font-size:var(--text-sm);font-weight:500;transition:transform var(--dur-short) var(--ease-out)}
.process-toggle:hover,.process-restart:hover{background:var(--color-paper);transform:translateY(-2px)}
.process-toggle:active,.process-restart:active{transform:translateY(1px)}
.process-toggle .play-symbol{display:none}
.process-toggle[data-paused="true"] .pause-symbol{display:none}
.process-toggle[data-paused="true"] .play-symbol{display:block}
.process-map{display:block;width:100%;height:auto;margin-block:var(--space-sm);overflow:visible}
.process-map text{font-family:var(--font-body);fill:var(--color-ink)}
.process-routes path{stroke:var(--color-rule);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.process-routes path.is-current{stroke:var(--color-accent)}
.process-arrow{fill:var(--color-accent)}
.node-ground{fill:var(--color-paper)}
.node-title{font-size:18px;font-weight:600}
.node-caption{font-size:14px;fill:var(--color-muted)!important}
.node-symbol{fill:none;stroke:var(--color-accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.component-title{font-size:27px;font-weight:600}
.component-node>.node-ground{fill:var(--color-paper-3)}
.signature-node>.node-ground{fill:var(--color-accent)}
.signature-title{font-size:15px;font-weight:500;fill:var(--color-accent-ink)!important}
.signature-mark{fill:none;stroke:var(--color-accent-ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.process-node.is-current>.node-ground{fill:var(--color-paper-3);stroke:var(--color-accent);stroke-width:2}
.signature-node.is-current>.node-ground{fill:var(--color-accent-hover);stroke:var(--color-accent-hover)}
.process-node.is-current>.node-symbol{animation:process-highlight 800ms var(--ease-out) both}
.receipts-node.is-current .receipt-initial{animation:receipt-arrival 600ms var(--ease-out) both}
.receipts-node.is-current .receipt-final{animation:receipt-arrival 600ms 360ms var(--ease-out) both}
.report-packet{opacity:0;fill:var(--color-paper);stroke:var(--color-accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.report-packet.is-travelling{opacity:1}
.process-caption{font-size:var(--text-sm)}
.process-caption>p{min-height:3.3em;line-height:1.65;color:var(--color-ink-2)}
.process-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-xs)}
.process-controls>span{color:var(--color-muted);font-size:var(--text-xs)}
.process-restart{padding-inline:0;background:none}
.process-restart:hover{background:none}
.process-restart svg{transition:transform var(--dur-long) var(--ease-out)}
.process-restart:hover svg{transform:rotate(-35deg)}
.process-mobile{display:none}
.service-copy .client-preview{margin-top:var(--space-xl)}
.service-evidence .receipt-stages{margin-top:var(--space-xl);margin-bottom:0}
.service-evidence{align-self:start}
.flow-list li{transition:transform var(--dur-short) var(--ease-out)}
.flow-list li:hover{transform:translateX(8px)}
.faq-list details[open]>p{animation:answer-arrival 350ms var(--ease-out) both}
.number-control .btn{transition:transform var(--dur-micro) var(--ease-out)}
.number-control .btn:hover:not(:disabled){transform:scale(1.12)}
.number-control .btn:active:not(:disabled){transform:scale(.94)}
@keyframes headline-arrival{from{opacity:.25;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes process-arrival{from{opacity:.45;transform:translateY(24px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes process-symbol{from{transform:scale(.88)}to{transform:scale(1)}}
@keyframes process-highlight{from{opacity:.35}to{opacity:1}}
@keyframes receipt-arrival{from{opacity:.15;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes heading-arrival{from{opacity:.3;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes document-arrival{from{opacity:.4;transform:translateY(18px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes row-arrival{from{opacity:.4;transform:translateX(-22px)}to{opacity:1;transform:translateX(0)}}
@keyframes answer-arrival{from{opacity:.3;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
 .title-line>span{animation:headline-arrival 800ms var(--ease-out) both}
 .title-line:nth-child(2)>span{animation-delay:100ms}
 .process-demo{animation:process-arrival 900ms var(--ease-out) both}
 .motion-heading{animation:heading-arrival 650ms var(--ease-out) both}
 .motion-document{animation:document-arrival 850ms var(--ease-out) both}
 .motion-row{animation:row-arrival 650ms var(--ease-out) both}
 .flow-list li:nth-child(2){animation-delay:80ms}
 .flow-list li:nth-child(3){animation-delay:160ms}
 .motion-form{animation:heading-arrival 650ms 80ms var(--ease-out) both}
}
@media(max-width:1000px){
 .hero{grid-template-columns:minmax(0,1fr);padding-block:var(--space-2xl) var(--space-3xl)}
 .hero h1{font-size:clamp(3.25rem,7vw,4.75rem)}
 .lead-column .lead{max-width:48ch}
 .hero-note{max-width:52ch}
 .process-demo{max-width:780px;justify-self:center}
}
@media(max-width:600px){
 .hero{gap:var(--space-xl);padding-top:var(--space-xl)}
 .hero h1{font-size:clamp(2.65rem,11.8vw,4rem)}
 .hero-actions{gap:var(--space-md);margin-top:var(--space-lg)}
 .hero-actions .button{margin-top:0}
 .hero-note{margin-top:var(--space-md);font-size:var(--text-sm)}
 .process-demo{padding:var(--space-lg) var(--space-md)}
 .process-heading>p{font-size:var(--text-md)}
 .process-toggle{padding-inline:var(--space-xs);font-size:var(--text-xs)}
 .process-map{display:none}
 .process-mobile{display:flex;flex-direction:column;list-style:none;margin:var(--space-lg) 0;padding:0;gap:var(--space-md);position:relative}
 .process-mobile::before{content:"";position:absolute;inset:20px auto 20px 14px;width:2px;background:var(--color-rule)}
 .process-mobile li{display:flex;align-items:flex-start;gap:var(--space-md);position:relative;min-height:58px}
 .process-mobile li>svg{flex:none;width:29px;height:29px;padding:3px;fill:none;stroke:var(--color-accent);stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round;background:var(--color-paper-2)}
 .process-mobile strong{display:block;font-size:var(--text-md);font-weight:600;line-height:1.4}
 .process-mobile span{display:block;margin-top:var(--space-2xs);font-size:var(--text-sm);line-height:1.5;color:var(--color-muted)}
 .process-mobile .is-current strong{color:var(--color-accent)}
 .process-mobile .is-current>svg{animation:process-symbol 800ms var(--ease-out) both;background:var(--color-paper-3);border-radius:var(--radius-input)}
 .process-mobile .commission-node{padding-left:calc(29px + var(--space-md))}
 .process-mobile .commission-logo{display:block;width:min(100%,220px);height:auto}
 .process-mobile .is-current .commission-logo{animation:process-symbol 800ms var(--ease-out) both}
 .process-caption>p{min-height:5em}
 .process-controls{gap:var(--space-sm)}
 .process-restart{font-size:var(--text-xs)}
 .service-evidence .receipt-stages{grid-template-columns:repeat(2,minmax(0,1fr))}
 .header.navbar{border:0}
 .faq-list details{padding:var(--space-md)}
 .header nav:not(.menu-closed){animation:answer-arrival 250ms var(--ease-out) both}
}
@media(prefers-reduced-motion:reduce){
 .process-demo,.process-node,.process-mobile li>svg,.process-mobile .commission-logo,.report-packet,.motion-heading,.motion-document,.motion-row,.motion-form{animation:none!important;transition:none!important}
 .report-packet{display:none}
 .button.btn:hover,.flow-list li:hover,.brand:hover img,.process-link:hover,.number-control .btn:hover:not(:disabled){transform:none}
}