/* The home of the work: illustrated, direct and built around real projects. */
#press.home-page .skip:not(:focus){clip-path:inset(50%)}
#press.home-page[data-mode=light]{--pink:#b51a59;--blue:#1b33c4}
#press.visual-page.home-page .nav{--fg:var(--ink)}
#press.home-page :is(h1,h2,h3){font-weight:600}
#press.home-page :is(h1,h2)>span{color:var(--pink)}
#press.home-page .hm-opening{display:grid;grid-template-columns:1fr 1.12fr;column-gap:36px;align-items:center;padding-top:46px}
#press.home-page .hm-hero-copy{min-width:0;padding-bottom:12px}
#press.home-page h1{font-size:clamp(65px,7.4vw,106px);line-height:.97;letter-spacing:-.065em}
#press.home-page h1>span{display:inline-block;white-space:nowrap}
#press.home-page .hm-lead{font-size:23px;line-height:1.5;max-width:33ch;margin-top:30px;color:var(--muted)}
#press.home-page .hm-name{color:var(--ink);border-bottom:1px solid var(--line)}
#press.home-page .hm-name:hover{border-color:var(--pink)}
#press.home-page .hm-actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px 28px;margin-top:30px}
#press.home-page .hm-button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-height:52px;padding:14px 20px;background:#ff3e8f;color:#0e1226;font-size:16px;line-height:1.4;font-weight:600;transition:background .2s,transform .2s,box-shadow .2s}
#press.home-page .hm-button:hover{background:#ffc90a;transform:translateY(-3px);box-shadow:4px 4px 0 var(--ink)}
#press.home-page .hm-link{display:inline-block;width:fit-content;font-size:16px;line-height:1.4;padding-block:8px 5px;border-bottom:1px solid var(--pink)}
#press.home-page a.hm-link:hover{color:var(--pink)}
#press.home-page .hm-small{font-size:13px;line-height:1.6;color:var(--muted);margin-top:24px}
#press.home-page .hm-workshop{min-width:0}
#press.home-page .hm-hero-art{display:block;width:100%;height:auto;overflow:visible}
#press.home-page .hm-bronto-link{cursor:pointer;outline:none}
#press.home-page .hm-bronto-link:focus-visible{outline:2px dashed var(--pink);outline-offset:10px}
#press.home-page .hm-disco-spark{opacity:0;transition:opacity .2s}
#press.home-page .hm-bronto-link:is(:hover,:focus-visible) .hm-disco-spark{opacity:1}
#press.home-page .hm-bronto-link:is(:hover,:focus-visible) .hm-bronto{filter:drop-shadow(0 0 12px #6e86ff33)}
#press.home-page .hm-scope{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-block:24px;border-block:1px solid var(--line);margin-top:46px;color:var(--muted);font:10px/1.6 'Martian Mono',monospace;text-transform:uppercase;letter-spacing:.025em}
#press.home-page .hm-scope-item{display:flex;align-items:center;gap:12px;min-width:0}
#press.home-page .hm-scope-item>svg{display:block;width:38px;height:38px;flex-shrink:0;transform-origin:50% 85%}
#press.home-page .hm-feature-copy>.hm-link{margin-top:20px}
#press.home-page .hm-section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:38px}
#press.home-page .hm-section-heading .eyebrow{font-size:10px;margin-bottom:21px}
#press.home-page .hm-section-heading h2{font-size:clamp(43px,4.8vw,65px);line-height:1.03}
#press.home-page .hm-section-heading>p{font-size:21px;line-height:1.5;color:var(--muted);max-width:29ch}
#press.home-page .hm-work{padding-top:85px;scroll-margin-top:30px}
#press.home-page .hm-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:40px}
#press.home-page .hm-pangea-scene{display:block;min-width:0;background:#10162c;overflow:hidden;padding:22px}
#press.home-page .hm-pangea-art{display:block;width:100%;height:auto}
#press.home-page .hm-feature-copy h3{font-size:clamp(43px,4.7vw,65px);letter-spacing:-.055em;line-height:1}
#press.home-page .hm-feature-lead{font-size:27px;line-height:1.25;letter-spacing:-.025em;margin-top:18px}
#press.home-page .hm-feature-copy>p:not(.eyebrow,.hm-feature-lead){font-size:18px;line-height:1.6;max-width:37ch;color:var(--muted);margin-top:20px}
#press.home-page .hm-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:40px}
#press.home-page .hm-all-projects{margin-top:40px}
#press.home-page .hm-project{display:block;min-width:0}
#press.home-page .hm-project-image{position:relative;aspect-ratio:1.42;background:var(--surface);overflow:hidden;isolation:isolate}
#press.home-page .hm-project-image>img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .4s}
#press.home-page .hm-project:is(:hover,:focus-visible) .hm-project-image>img{transform:scale(1.035)}
#press.home-page .hm-project:is(:hover,:focus-visible) h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
#press.home-page .hm-project .eyebrow{font-size:9px;letter-spacing:.035em;margin:22px 0 12px}
#press.home-page .hm-project h3{font-size:32px}
#press.home-page .hm-project>p:not(.eyebrow){font-size:16px;line-height:1.55;color:var(--muted);margin-top:12px;max-width:35ch}
#press.home-page .hm-project-image--bishop{display:flex;flex-direction:column;background:#141a46}
#press.home-page .hm-project-image--bishop>img{height:calc(100% - 36px);object-fit:cover;flex:1;min-height:0}
#press.home-page .hm-bishop-stack{display:flex;justify-content:space-between;gap:6px;padding:11px 12px;font:8px/1.6 'Martian Mono',monospace;white-space:nowrap;color:#edeae0}
#press.home-page .hm-bishop-stack span:nth-child(2){color:#ffc90a}
#press.home-page .hm-bishop-stack span:nth-child(3){color:#ff3e8f}
#press.home-page .hm-together{padding-top:95px}
#press.home-page .hm-offers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
#press.home-page .hm-offer{min-width:0;display:flex;flex-direction:column;align-items:flex-start;padding:30px 40px 38px;color:var(--offer-ink);background:var(--offer-ground);transition:background-color .35s,color .35s}
#press.home-page .hm-offer--service{--offer-ink:#141a46;--offer-ground:#ffc90a;--offer-muted:#514523}
#press.home-page .hm-offer--course{--offer-ink:#edeae0;--offer-ground:#1b33c4;--offer-muted:#edeae0}
#press.home-page .hm-offer-art{width:100%;height:225px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;overflow:hidden}
#press.home-page .hm-offer-art>svg{display:block;width:100%;height:100%;overflow:visible}
#press.home-page .hm-service-art{transform:rotate(-6deg)}
#press.home-page .hm-offer .eyebrow{font-size:10px;color:var(--offer-ink);margin:0 0 18px}
#press.home-page .hm-offer--course .eyebrow{color:var(--offer-accent,#ffc90a)}
#press.home-page .hm-offer h3{font-size:clamp(34px,3.9vw,52px);line-height:1.04;letter-spacing:-.055em}
#press.home-page .hm-offer>p:not(.eyebrow,.hm-offer-facts){font-size:19px;line-height:1.5;max-width:39ch;color:var(--offer-muted);margin:20px 0 27px;flex:1;transition:color .35s}
#press.home-page .hm-offer-facts{font-size:15px;margin-top:0}
#press.home-page .hm-offer-facts strong{font-size:35px;font-weight:500;letter-spacing:-.045em;margin-right:5px}
#press.home-page .hm-offer-facts>span{display:block;font-size:13px;margin-top:4px}
#press.home-page .hm-offer-link{border-bottom:1px solid currentColor;font-size:16px;padding-block:8px 5px;margin-top:22px}
#press.home-page .hm-offer-link:hover{border-bottom-width:3px;padding-bottom:3px}
#press.home-page .hm-offer a:focus-visible{outline-color:var(--offer-ink)}
#press.home-page .hm-products{padding-top:95px}
#press.home-page .hm-dacha{display:grid;grid-template-columns:1.4fr 1fr;gap:55px;align-items:center}
#press.home-page .hm-dacha-scene{display:block;position:relative;aspect-ratio:1.4;overflow:hidden;background:#181832}
#press.home-page .hm-dacha-room{width:100%;height:100%;object-fit:cover;object-position:33% center;transition:transform .7s}
#press.home-page .hm-dacha-phone{position:absolute;right:6%;bottom:-10%;width:27%;height:auto;border:5px solid #edeae0;border-radius:17px;transform:rotate(7deg);box-shadow:0 8px 35px #0007;transition:transform .5s}
#press.home-page .hm-dacha-scene:is(:hover,:focus-visible) .hm-dacha-room{transform:scale(1.025)}
#press.home-page .hm-dacha-scene:is(:hover,:focus-visible) .hm-dacha-phone{transform:translateY(-8px) rotate(3deg)}
#press.home-page .hm-dacha-copy .eyebrow{font-size:9px;margin-bottom:21px}
#press.home-page .hm-dacha-copy h3{font-size:clamp(40px,4vw,57px)}
#press.home-page .hm-dacha-copy>p:not(.eyebrow){font-size:20px;line-height:1.55;color:var(--muted);margin-top:22px;max-width:27ch}
#press.home-page .hm-dacha-copy .hm-actions{gap:14px 23px;margin-top:23px}
#press.home-page .hm-regolith{display:flex;align-items:center;gap:27px;margin-top:34px;border-block:1px solid var(--line);padding-block:24px}
#press.home-page .hm-regolith>img{width:150px;aspect-ratio:1.7;object-fit:cover}
#press.home-page .hm-regolith .eyebrow{font-size:9px;margin:0 0 8px}
#press.home-page .hm-regolith h3{font-size:29px}
#press.home-page .hm-regolith p:not(.eyebrow){color:var(--muted);font-size:16px;margin-top:7px}
#press.home-page .hm-regolith>.hm-link{margin-left:auto;flex-shrink:0}
#press.home-page .hm-close{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;padding-top:95px;padding-bottom:70px}
#press.home-page .hm-person{display:flex;gap:28px;align-items:center}
#press.home-page .hm-person>img{width:98px;height:123px;object-fit:cover;transform:rotate(-5deg);box-shadow:6px 6px 0 #ffc90a}
#press.home-page .hm-person .eyebrow{font-size:9px;margin-bottom:18px}
#press.home-page .hm-person h2{font-size:clamp(32px,3.2vw,45px)}
#press.home-page .hm-close-copy>p{font-size:18px;line-height:1.55;color:var(--muted);max-width:39ch}
#press.home-page .foot{margin-top:15px;grid-template-columns:1fr auto}
/* Physical, quiet loops. Paused until the scene is visible and motion is allowed. */
#press.home-page .hm-supersaur-canvas{display:block;width:100%;height:100%;pointer-events:none}
#press.home-page .hm-bronto[data-animated=true]>.hm-supersaur-image{opacity:0}
#press.home-page .hm-float{animation:hm-float 6s ease-in-out infinite;animation-play-state:paused}
#press.home-page .hm-float--screen{animation-delay:-3s}
#press.home-page .hm-orbit{animation:hm-orbit 22s linear infinite;transform-origin:310px 250px;animation-play-state:paused}
#press.home-page .hm-signal{animation:hm-signal 8s linear infinite;animation-play-state:paused}
#press.home-page :is(.hm-workshop,.hm-pangea-scene)[data-running=true] :is(.hm-float,.hm-orbit,.hm-signal){animation-play-state:running}
@keyframes hm-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes hm-orbit{to{transform:rotate(360deg)}}
@keyframes hm-signal{to{stroke-dashoffset:-266}}
@media(max-width:1100px){
#press.home-page .hm-opening{column-gap:24px;padding-top:30px}
#press.home-page h1{font-size:clamp(56px,7.3vw,80px)}
#press.home-page .hm-lead{font-size:20px}
#press.home-page .hm-hero-copy .hm-actions{gap:20px;margin-top:25px}
#press.home-page .hm-hero-copy .hm-button{font-size:15px;padding:13px 16px;gap:18px}
#press.home-page .hm-hero-copy .hm-link{font-size:15px}
#press.home-page .hm-feature{gap:40px}
#press.home-page .hm-feature-copy h3{font-size:49px}
#press.home-page .hm-feature-lead{font-size:25px}
#press.home-page .hm-projects{gap:22px}
#press.home-page .hm-offer{padding:24px 30px 32px}
#press.home-page .hm-offer-art{height:200px}
#press.home-page .hm-dacha{gap:35px}
#press.home-page .hm-close{gap:35px;grid-template-columns:1fr 1fr}
#press.home-page .hm-person{display:block}
#press.home-page .hm-person>img{width:72px;height:90px;margin-bottom:28px}
}
@media(max-width:800px){
#press.home-page .hm-opening{grid-template-columns:1fr 1fr;column-gap:12px}
#press.home-page h1{font-size:clamp(48px,7.2vw,58px)}
#press.home-page .hm-lead{font-size:18px;margin-top:23px}
#press.home-page .hm-scope{font-size:8px;gap:15px;margin-top:32px}
#press.home-page .hm-scope-item{gap:10px}
#press.home-page .hm-scope-item>svg{width:32px;height:32px}
#press.home-page .hm-work{padding-top:65px}
#press.home-page .hm-section-heading>p{font-size:18px;max-width:22ch}
#press.home-page .hm-feature{gap:30px;grid-template-columns:1fr 1fr}
#press.home-page .hm-pangea-scene{padding:12px}
#press.home-page .hm-feature-copy h3{font-size:42px}
#press.home-page .hm-feature-lead{font-size:23px}
#press.home-page .hm-feature-copy>p:not(.eyebrow,.hm-feature-lead){font-size:16px}
#press.home-page .hm-projects{grid-template-columns:1fr;gap:30px}
#press.home-page .hm-project{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;align-content:center}
#press.home-page .hm-project-image{grid-column:1;grid-row:1/4}
#press.home-page .hm-project .eyebrow{margin:3px 0 12px;align-self:end}
#press.home-page .hm-project>p:not(.eyebrow){margin-top:10px}
#press.home-page .hm-offers{gap:20px}
#press.home-page .hm-offer{padding:20px 25px 30px}
#press.home-page .hm-offer-art{height:180px;margin-bottom:15px}
#press.home-page .hm-offer h3{font-size:35px}
#press.home-page .hm-offer>p:not(.eyebrow,.hm-offer-facts){font-size:17px}
#press.home-page .hm-offer .eyebrow{font-size:8px}
#press.home-page .hm-together,#press.home-page .hm-products{padding-top:70px}
#press.home-page .hm-dacha{grid-template-columns:1.15fr 1fr;gap:28px}
#press.home-page .hm-dacha-copy h3{font-size:37px}
#press.home-page .hm-dacha-copy>p:not(.eyebrow){font-size:18px}
#press.home-page .hm-dacha-scene{aspect-ratio:1.1}
#press.home-page .hm-dacha-phone{width:34%}
#press.home-page .hm-regolith>img{width:115px}
#press.home-page .hm-regolith{gap:22px}
#press.home-page .hm-regolith>.hm-link{font-size:14px}
#press.home-page .hm-close{padding-top:70px;padding-bottom:45px}
}
@media(max-width:640px){
#press.home-page .hm-opening{grid-template-columns:1fr;padding-top:25px}
#press.home-page h1{font-size:clamp(47px,12.8vw,80px)}
#press.home-page .hm-lead{font-size:20px;max-width:32ch;margin-top:24px}
#press.home-page .hm-hero-copy .hm-actions{gap:20px;margin-top:25px}
#press.home-page .hm-hero-copy .hm-button{font-size:15px;gap:22px}
#press.home-page .hm-small{font-size:12px;margin-top:20px}
#press.home-page .hm-workshop{margin-top:24px}
#press.home-page .hm-hero-art{max-width:475px;margin-inline:auto}
#press.home-page .hm-scope{grid-template-columns:1fr 1fr;font-size:8px;gap:22px 18px;margin-top:10px;padding-block:23px}
#press.home-page .hm-work{padding-top:50px}
#press.home-page .hm-section-heading{display:block;margin-bottom:28px}
#press.home-page .hm-section-heading .eyebrow{font-size:9px;margin-bottom:18px}
#press.home-page .hm-section-heading h2{font-size:45px}
#press.home-page .hm-section-heading>p{max-width:29ch;margin-top:20px}
#press.home-page .hm-feature{grid-template-columns:1fr;gap:29px;padding-bottom:30px}
#press.home-page .hm-pangea-scene{padding:15px}
#press.home-page .hm-feature-copy h3{font-size:49px}
#press.home-page .hm-feature-lead{font-size:27px}
#press.home-page .hm-feature-copy>p:not(.eyebrow,.hm-feature-lead){font-size:18px;margin-top:18px}
#press.home-page .hm-projects{margin-top:30px;gap:35px}
#press.home-page .hm-project{display:block}
#press.home-page .hm-project-image{aspect-ratio:1.55}
#press.home-page .hm-project .eyebrow{margin:20px 0 12px}
#press.home-page .hm-project h3{font-size:33px}
#press.home-page .hm-project>p:not(.eyebrow){font-size:17px;max-width:36ch}
#press.home-page .hm-together,#press.home-page .hm-products{padding-top:60px}
#press.home-page .hm-offers{grid-template-columns:1fr;gap:24px}
#press.home-page .hm-offer{padding:24px 25px 30px}
#press.home-page .hm-offer-art{height:190px;margin-bottom:24px}
#press.home-page .hm-offer .eyebrow{font-size:9px}
#press.home-page .hm-offer h3{font-size:40px}
#press.home-page .hm-offer>p:not(.eyebrow,.hm-offer-facts){font-size:18px;margin-block:19px 24px}
#press.home-page .hm-offer-facts strong{font-size:36px}
#press.home-page .hm-dacha{grid-template-columns:1fr;gap:30px}
#press.home-page .hm-dacha-scene{aspect-ratio:1.25}
#press.home-page .hm-dacha-phone{width:29%;right:7%}
#press.home-page .hm-dacha-copy h3{font-size:45px}
#press.home-page .hm-dacha-copy>p:not(.eyebrow){font-size:19px;max-width:31ch}
#press.home-page .hm-regolith{gap:18px;margin-top:30px}
#press.home-page .hm-regolith>img{width:86px;aspect-ratio:1}
#press.home-page .hm-regolith .eyebrow{font-size:8px}
#press.home-page .hm-regolith h3{font-size:28px}
#press.home-page .hm-regolith p:not(.eyebrow){font-size:15px}
#press.home-page .hm-regolith>.hm-link{display:none}
#press.home-page .hm-close{grid-template-columns:1fr;gap:27px;padding-top:60px;padding-bottom:40px}
#press.home-page .hm-person{display:flex;gap:24px;align-items:flex-start}
#press.home-page .hm-person>img{width:65px;height:82px;margin:5px 0 0}
#press.home-page .hm-person .eyebrow{font-size:8px;margin-bottom:17px}
#press.home-page .hm-person h2{font-size:35px}
#press.home-page .hm-close-copy>p{font-size:18px}
#press.home-page .hm-close .hm-actions{gap:22px;margin-top:25px}
}
@media(prefers-reduced-motion:reduce){
#press.home-page :is(.hm-float,.hm-orbit,.hm-signal,.sv-layer-art,.sv-packet,.hm-course-note,.hm-course-pencil){animation:none!important}
#press.home-page :is(.hm-button,.hm-project-image>img,.hm-dacha-room,.hm-dacha-phone,.hm-disco-spark,.hm-offer,.hm-offer>p){transition:none}
}

/* A cursor swipe adds momentum; the spring in home.js brings each icon to rest. */
#press.home-page .hm-scope-item>svg{will-change:transform}
#press.home-page .hm-offer:is(:hover,:focus-within){--offer-ground:#ff3e8f;--offer-ink:#141a46;--offer-muted:#141a46;--offer-accent:#141a46}
#press.home-page .hm-offer .sv-layer-art{animation:hm-layer-lift 4s ease-in-out infinite;animation-play-state:paused;--lift:-6px}
#press.home-page .hm-offer [data-visual-layer=data] .sv-layer-art{--lift:-12px;animation-delay:-.3s}
#press.home-page .hm-offer [data-visual-layer=logic] .sv-layer-art{--lift:-18px;animation-delay:-.6s}
#press.home-page .hm-offer [data-visual-layer=experience] .sv-layer-art{--lift:-24px;animation-delay:-.9s}
#press.home-page .hm-offer .sv-packet{animation:hm-packet 5s linear infinite;animation-play-state:paused}
#press.home-page .hm-course-note{animation:hm-note 4.5s ease-in-out infinite;transform-origin:66px 58px;animation-play-state:paused}
#press.home-page .hm-course-pencil{animation:hm-pencil 3.5s ease-in-out infinite;transform-origin:6px 75px;animation-play-state:paused}
@media(hover:hover) and (pointer:fine){
#press.home-page .hm-offer[data-running=true]:hover :is(.hm-float,.sv-layer-art,.sv-packet,.hm-course-note,.hm-course-pencil){animation-play-state:running}
}
@keyframes hm-layer-lift{0%,100%{transform:translateY(0)}50%{transform:translateY(var(--lift))}}
@keyframes hm-packet{to{stroke-dashoffset:-366}}
@keyframes hm-note{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-9px) rotate(5deg)}}
@keyframes hm-pencil{0%,100%{transform:rotate(0)}30%{transform:rotate(-13deg) translateY(-5px)}65%{transform:rotate(6deg)}}
