/* Nuance motion, recreated with native browser APIs. See MOTION-REFERENCE.md.
   No content is hidden while JavaScript is loading or unavailable. */
.home-hero h1 > .home-title-static { color: var(--ink); }
.hp-typewriter { display: inline-flex; min-height: 1.2em; min-width: 8ch; white-space: nowrap; }
.hp-typecursor { margin-left: 2px; }
.hp-token-word { display: inline-block; white-space: nowrap; }
.hp-token { display: inline-block; }
.hp-motion-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.hp-motion-toggle { position: fixed; right: 16px; bottom: 16px; z-index: 120; min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); color: var(--ink); font-size: 12px; box-shadow: 0 2px 12px #00000012; }
.hp-motion-toggle::before { content: 'Ⅱ'; margin-right: 8px; }
.hp-motion-toggle[aria-pressed=true]::before { content: '▷'; }
.hp-motion-ready .hp-typecursor { animation: hp-blink 1s step-end infinite; }
@keyframes hp-blink { 50% { opacity: 0; } }

/* Keep each accessible original strip and one inert visual repeat. */
.hp-marquee { display: block; }
.hp-marquee-track, .hp-marquee-group { display: flex; width: max-content; align-items: stretch; }
.hp-marquee-group { flex: none; gap: var(--marquee-gap, 0px); padding-right: var(--marquee-gap, 0px); }
.hp-marquee-track { animation: hp-marquee var(--marquee-duration, 30s) linear infinite; }
.hp-marquee-reverse .hp-marquee-track { animation-direction: reverse; }
@keyframes hp-marquee { to { transform: translateX(-50%); } }
.hp-marquee:hover .hp-marquee-track, .hp-loop-offscreen { animation-play-state: paused !important; }
.hp-marquee:focus-within .hp-marquee-track, .hp-motion-paused .hp-marquee-track { animation: none; transform: none; }
.hp-marquee:focus-within .hp-marquee-clone, .hp-motion-paused .hp-marquee-clone { display: none; }
.home-capabilities .hp-marquee-group > span { flex: none; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 24px; font: 500 28px/1.2 Merriweather,serif; letter-spacing: -.56px; border-right: 1px solid var(--line); white-space: nowrap; }
.home-capabilities .hp-marquee-group > span::before { content: ''; width: 12px; height: 12px; flex: none; border-radius: 50%; background: #e32e25; }
.home-tool-strip .hp-marquee-group > span { display: grid; place-items: center; flex: none; width: 90px; height: 90px; border-radius: 8px; background: #bfbfbf; }
.home-brand-strip .hp-marquee-group > div { flex: none; text-align: center; width: 99px; }
.home-testimonials .home-testimonial { width: 328px; }
.home-ribbon > .hp-ribbon-track { display: block; width: max-content; animation: hp-marquee var(--marquee-duration, 28s) linear infinite; }
.home-ribbon-two > .hp-ribbon-track { animation-direction: reverse; }

/* The original reference pins successive work cards, allowing them to overlap. */
.hp-motion-ready .home-works { overflow: clip; }
.hp-motion-ready .home-projects { position: relative; }
.hp-motion-ready .home-project { position: sticky; top: 60px; height: max(650px, calc(100svh - 60px)); min-height: 0; }
.hp-motion-ready .home-project-0 { z-index: 1; }
.hp-motion-ready .home-project-1 { z-index: 2; }
.hp-motion-ready .home-project-2 { z-index: 3; }
.hp-motion-ready .home-project-3 { z-index: 4; }
.hp-motion-ready .home-project-card { rotate: var(--stack-rotate, 0deg); transition: rotate .3s cubic-bezier(.22,1,.36,1); }
.hp-motion-ready .home-ribbon-one { top: calc(50% - 60px); }
.hp-motion-ready .home-ribbon-two { top: calc(50% + 50px); }
.hp-motion-ready .home-project:focus-within { z-index: 6; }
body.admin-bar .hp-motion-ready .home-project { top: 92px; }
.hp-motion-ready body.admin-bar .home-project { top: 92px; }

/* Mirror/repeating decorations: isolated properties preserve layout transforms. */
.hp-motion-ready .home-pyramid { animation: hp-pyramid 2s cubic-bezier(.44,0,.56,1) infinite alternate; }
.hp-motion-ready .home-cylinder { animation: hp-cylinder 3s cubic-bezier(.44,0,.56,1) infinite alternate; }
@keyframes hp-pyramid { to { translate: 0 -25px; rotate: 3deg; } }
@keyframes hp-cylinder { to { translate: 0 15px; rotate: -9deg; } }
.hp-motion-ready .home-label-brand { animation: hp-cursor-brand 2s cubic-bezier(.7,-.35,.3,1.35) infinite alternate; }
.hp-motion-ready .home-label-growth { animation: hp-cursor-growth 2.8s cubic-bezier(.7,-.35,.3,1.35) infinite alternate; }
@keyframes hp-cursor-brand { to { translate: -23px 38px; } }
@keyframes hp-cursor-growth { to { translate: 45px 20px; } }
.hp-motion-ready .home-bento-purpose { animation: hp-purpose 3.5s cubic-bezier(.44,0,.56,1) infinite; }
@keyframes hp-purpose { 0%,28.57%,100% { translate: 12px -12px; } 42.86%,85.71% { translate: 0 0; } }
.home-impact { isolation: isolate; background: var(--paper); }
.home-impact::before { content: ''; position: absolute; width: 150%; height: 260%; background: conic-gradient(from 90deg,var(--paper),#d6d3cb 49.6%,#b2ada1 99.2%,#d6d3cb 99.6%,var(--paper)); z-index: -1; }
.hp-motion-ready .home-impact::before { animation: hp-spin 5s linear infinite; }
.hp-motion-ready .home-impact.hp-loop-offscreen::before { animation-play-state: paused; }
@keyframes hp-spin { to { rotate: 360deg; } }
.home-focus-bars i { transform-origin: left center; }
.hp-motion-ready .home-bento-process li { animation: hp-process-two 4s step-end infinite; }
.hp-motion-ready .home-bento-process li:first-child { animation: none; }
.hp-motion-ready .home-bento-process li:nth-child(3) { animation-name: hp-process-three; }
.hp-motion-ready .home-bento-process li:nth-child(4) { animation-name: hp-process-four; }
.hp-motion-ready .home-bento-process li:nth-child(5) { animation-name: hp-process-five; }
.hp-motion-ready .home-bento-process li span { transition: background .4s; }
@keyframes hp-process-two { 0% { opacity: .35; } 12.5%,100% { opacity: 1; } }
@keyframes hp-process-three { 0% { opacity: .35; } 25%,100% { opacity: 1; } }
@keyframes hp-process-four { 0% { opacity: .35; } 37.5%,100% { opacity: 1; } }
@keyframes hp-process-five { 0% { opacity: .35; } 50%,100% { opacity: 1; } }
.hp-motion-ready .hp-works-backdrop img { animation: hp-color-drift 12s ease-in-out infinite alternate; }
.hp-motion-ready .home-hero::after { background-size: 115% 100%; animation: hp-hero-glow 10s ease-in-out infinite alternate; }
@keyframes hp-color-drift { from { scale: 1.06; translate: -1% 0; } to { scale: 1.2; translate: 2% 3%; } }
@keyframes hp-hero-glow { to { background-position: 100% 100%; opacity: .7; } }
.hp-footer-cycle { display: inline-grid; vertical-align: bottom; overflow: hidden; height: 1.2em; min-width: 4.6em; }
.hp-footer-cycle > span { grid-area: 1 / 1; }
.hp-footer-cycle > span:not(:first-child) { visibility: hidden; }

/* Native disclosures retain their no-script behavior and keyboard semantics. */
.home-faq details { transition: background .4s cubic-bezier(.22,1,.36,1); }
.home-faq details[open] { background: #f4f3ee; }
.home-faq summary img { transition: transform .4s cubic-bezier(.22,1,.36,1); }
.hp-skills-list summary img { transition: transform .3s cubic-bezier(.4,0,.2,1); }
.hp-case-sidebar a { transition: color .12s, background .12s; }
.hp-case-sidebar a[aria-current=location] { color: var(--accent); background: #ffeddf; box-shadow: -3px 0 var(--accent); padding-left: 10px; }
.hp-case-menu-toggle { display: none; }
.hp-menu-toggle { position: relative; }
.hp-menu-line { position: absolute; left: calc(50% - 10px); top: calc(50% - 5px); width: 20px; height: 2px; background: var(--ink); transition: rotate .4s cubic-bezier(.22,1,.36,1), translate .4s cubic-bezier(.22,1,.36,1); }
.hp-menu-line + .hp-menu-line { top: calc(50% + 5px); }
.hp-menu-toggle[aria-expanded=true] .hp-menu-line { rotate: 45deg; translate: 0 5px; }
.hp-menu-toggle[aria-expanded=true] .hp-menu-line + .hp-menu-line { rotate: -45deg; translate: 0 -5px; }
.hp-motion-ready .hp-availability > span { animation: hp-availability 1.5s cubic-bezier(.44,0,.56,1) infinite alternate; }
@keyframes hp-availability { to { scale: 1.5; } }
.hp-case-menu-sheet { inset: auto 0 0; width: 100%; max-width: none; max-height: 75svh; margin: 0; padding: 24px; border: 1px solid var(--line); border-radius: 20px 20px 0 0; color: var(--ink); background: var(--paper); transform: translateY(100%); transition: transform .5s cubic-bezier(.32,.72,0,1), display .5s allow-discrete, overlay .5s allow-discrete; }
.hp-case-menu-sheet[open] { transform: translateY(0); }
@starting-style { .hp-case-menu-sheet[open] { transform: translateY(100%); } }
.hp-case-menu-sheet::backdrop { background: rgb(0 0 0 / .5); }
.hp-case-menu-sheet header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.hp-case-menu-sheet h2 { font-size: 24px; }
.hp-case-menu-close { flex: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: white; }
.hp-case-menu-sheet nav { display: grid; gap: 4px; }
.hp-case-menu-sheet nav a { padding: 12px; min-height: 44px; border-bottom: 1px solid var(--line); }
.hp-case-menu-sheet a[aria-current=location] { color: var(--accent); }
body:has(.hp-case-menu-sheet[open]), body:has(.hp-lightbox[open]) { overflow: hidden; }
.hp-lightbox { width: min(840px,calc(100vw - 32px)); max-width: none; max-height: calc(100svh - 40px); padding: 20px; border: 0; border-radius: 8px; background: var(--paper); color: var(--ink); }
.hp-lightbox::backdrop { background: rgb(0 0 0 / .8); }
.hp-lightbox img { width: 100%; height: auto; max-height: calc(100svh - 180px); object-fit: contain; }
.hp-lightbox header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.hp-lightbox button { width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: white; }
.hp-lightbox a { font-size: 14px; text-decoration: underline; }
.hp-motion-paused *, .hp-motion-paused *::before, .hp-motion-paused *::after { animation-play-state: paused !important; }
.hp-motion-paused .home-project { position: relative; top: auto !important; }
.hp-motion-paused .home-project-card { rotate: none; transition: none; }
.hp-motion-paused .home-ribbon > .hp-ribbon-track { animation: none; transform: none; }
.hp-motion-paused { scroll-behavior: auto; }
@media (hover: hover) and (pointer: fine) {
 .home-faq details:not([open]):hover { background: rgb(255 237 230 / .3); }
 .home-service-card:hover .home-service-icon { border-color: #1c6ffa; }
 .home-project-card .home-project-arrow, .home-button img, .hp-footer-top nav img { transition: translate .3s cubic-bezier(.22,1,.36,1); }
 .home-project-card:hover .home-project-arrow { translate: 3px -3px; }
 .home-button:hover img, .hp-footer-top nav a:hover img { translate: 3px -3px; }
 .hp-skills-list summary:hover { color: var(--accent); }
}
@media (max-width: 782px) { .hp-motion-ready body.admin-bar .home-project { top: 106px; } }
@media (max-width: 768px) { .hp-case-menu-toggle { display: inline-flex; align-items: center; position: fixed; left: 12px; bottom: 12px; z-index: 120; border: 1px solid var(--line); border-radius: 24px; min-height: 44px; padding: 10px 14px; background: var(--paper); color: var(--ink); font-size: 12px; box-shadow: 0 2px 12px #00000012; } }
@media (max-width: 767px) { .hp-nav.is-open { height: calc(100svh - 60px); align-items: stretch; justify-content: center; gap: 12px; padding: 24px; box-shadow: none; } .hp-nav.is-open > a { font: 500 36px/1.2 Merriweather,serif; min-height: 88px; padding-inline: 0; } body:has(.hp-nav.is-open) { overflow: hidden; } }
@media (max-width: 700px) {
 .home-capabilities .hp-marquee-group > span { padding: 16px; font-size: 20px; gap: 12px; }
 .home-capabilities .hp-marquee-group > span::before { width: 8px; height: 8px; }
 .home-tool-strip .hp-marquee-group > span { width: 64px; height: 64px; }
 .home-brand-strip .hp-marquee-group > div { width: 88px; }
 .home-testimonials .home-testimonial { flex: none; width: var(--testimonial-width,328px); }
 .hp-motion-ready .home-project { height: max(620px, calc(100svh - 60px)); }
 .hp-motion-ready .home-bento-purpose { animation: none; }
 @keyframes hp-cursor-brand { to { translate: -12px 0; } }
 @keyframes hp-cursor-growth { to { translate: -18px 0; } }
 .hp-motion-toggle { right: 12px; bottom: 12px; }
}
@media (max-width: 600px) { .hp-motion-ready body.admin-bar .home-project { top: 60px; } }
@media (prefers-reduced-motion: reduce) {
 .hp-motion-ready:not(.hp-motion-override) *, .hp-motion-ready:not(.hp-motion-override) *::before, .hp-motion-ready:not(.hp-motion-override) *::after { animation: none !important; transition: none !important; }
 .hp-motion-ready:not(.hp-motion-override) .home-project { position: relative; top: auto !important; }
 html:not(.hp-motion-override) .hp-marquee-clone { display: none; }
 html:not(.hp-motion-override) .hp-marquee-track { transform: none !important; }
 html:not(.hp-motion-override) .home-project-card { rotate: none !important; }
}
