/* Corrected composition: source hero motion, approved four-step workflow. */
.enter-home .enter-source-hero{height:100svh;min-height:720px;padding:0;margin:0;overflow:hidden;background:#fff;display:block;position:relative}
.enter-home .hero__stage{width:min(100%,1440px);height:100%;margin-inline:auto}
.enter-home .hero__content{width:min(780px,calc(100% - 40px));top:51%;left:50%;transform:translate(-50%,-50%)}
.enter-home .hero__headline{font-family:inherit;white-space:normal;font-size:clamp(30px,4.1vw,59px);line-height:1.4;letter-spacing:-.045em;margin:26px 0 0;font-weight:650}
.hero-heading-line{display:block;white-space:nowrap}.hero-heading-char{display:inline-block;opacity:0;will-change:transform,opacity}
.enter-home .hero__prompt-group>p{font-size:15px;line-height:1.9;margin-top:22px;color:#777774}
.enter-home .hero__prompt-group .hero-actions{margin-top:24px;gap:16px}
.enter-home .hero-portal{width:76px;height:104px;color:#141414}
.enter-home .hero-portal :is(.hero-portal__mask,.hero-portal__opening){border-radius:3px}
.enter-home .hero-portal__path{stroke-width:6px}
.enter-home .hero-portal__leaf{transform-origin:100% 50%}
.enter-home .hero-portal__leaf svg,.enter-home .hero-portal__outline{width:100%;height:100%;max-width:none}
.hero-portal__opening{inset:5px!important;width:calc(100% - 10px)!important;height:calc(100% - 10px)!important}
.hero-portal .hero-portal__video{object-fit:cover}
.enter-home .hero-media img{object-position:top}
.enter-home .hero-media--hero-left img{width:100%}
.enter-home .hero-media--hero-art img,.enter-home .hero-media--hero-portrait img{object-fit:cover}
/* The click target is the same sticky scene throughout all four steps. */
.workflow-section{position:relative;margin:0 auto;background:#fff;height:calc(100svh + 240vh);scroll-margin-top:72px}
.workflow-sticky{position:sticky;top:72px;min-height:640px;height:calc(100svh - 72px);display:flex;align-items:center;padding:36px;overflow:clip}
.workflow-shell{width:100%;max-width:1360px;margin:auto;display:grid;grid-template-columns:minmax(290px,.76fr) minmax(0,1.24fr);gap:50px;align-items:center;padding:30px 0}
.workflow-copy-column{align-self:start;padding-top:16px}
.enter-home .workflow-copy-column h2{font-size:clamp(28px,3vw,44px);line-height:1.45;letter-spacing:-.04em}
.workflow-copy-column>p{font-size:13px;line-height:1.8;margin-top:24px;color:#898c83}
.workflow-steps{display:flex;flex-direction:column;gap:8px;margin-top:25px}
.workflow-steps button{display:flex;justify-content:flex-start!important;align-items:center;gap:15px;background:transparent;text-align:left;padding:15px 0;color:#a3aaa0;font-size:clamp(16px,1.6vw,22px);font-weight:650;min-height:54px;white-space:normal;line-height:1.6}
.workflow-steps button[aria-selected=true]{color:#26362c}
.workflow-number{font-size:12px;font-weight:400;min-width:20px}
.workflow-screen{background:#eef1e8;border-radius:18px;padding:16px;min-width:0;height:clamp(500px,calc(100svh - 180px),680px);position:relative;overflow:clip}
.workflow-panel{height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cbd1c4 transparent;border-radius:7px}
.workflow-caption{padding:16px 4px 4px;font-size:12px;line-height:1.8;color:#78816e}
.workflow-panel .product-window{background:#fff;border-radius:8px;box-shadow:none;width:100%;transform:none;max-width:100%}
.workflow-panel .product-chrome{padding:16px;gap:14px;font-size:11px}
.workflow-panel .product-chrome .brand{font-size:16px}
.workflow-panel .discovery-surface{padding:16px;background:#fff}
.workflow-panel .discovery-controls{display:flex;flex-direction:column;align-items:stretch;gap:10px;margin-bottom:16px}
.workflow-panel .search-field{width:100%;background:#f5f5f5;min-width:0}
.workflow-panel .filter-chips{gap:3px}
.workflow-panel .filter-chips button{font-size:11px;padding:7px 10px;min-height:34px}
.workflow-panel .discovery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 12px}
.workflow-panel .work-image{padding:0;aspect-ratio:1.5;border-radius:5px}
.workflow-panel .work-image>img{width:100%;height:100%;object-fit:cover;object-position:top}
.workflow-panel .work-caption strong{font-size:11px}
.workflow-panel .discovery-bottom{gap:10px}
.workflow-panel .journey-grid{display:grid;grid-template-columns:1fr;gap:25px;background:white;padding:16px;border-radius:8px}
.enter-home .workflow-panel .journey-grid>article{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.enter-home .workflow-panel .journey-grid>article .journey-cover{height:360px;width:100%;padding:12px;order:1;margin:0}
.enter-home .workflow-panel .journey-grid h3{font-size:19px;margin:0;order:0;align-self:stretch}
.enter-home .workflow-panel .journey-grid .text-button{order:2;align-self:flex-start;font-size:12px;margin:0}
.workflow-panel .creation-grid{display:grid;gap:18px;grid-template-columns:1fr}
.workflow-panel .creation-grid>article{min-width:0;display:flex;flex-direction:column}
.enter-home .workflow-panel .creation-cover{height:400px;margin:0;border-radius:10px;flex:none;background:white}
.enter-home .workflow-panel .creation-grid h3{font-size:18px;margin:16px 0 8px;text-align:center}
.enter-home .workflow-panel .save-sheet{max-width:360px;width:90%;margin:auto;background:#fff;box-shadow:0 10px 40px #25311e09}
.enter-home .workflow-panel .note-sheet{width:90%;max-width:400px;margin:auto;box-shadow:0 10px 40px #25311e09}
.enter-home .workflow-panel .workflow-saved .creation-cover{height:300px}
.enter-home .workflow-panel .workflow-saved article:last-child .creation-cover{height:230px}
@media(max-width:900px){
 .enter-home .enter-source-hero{min-height:720px}
 .enter-home .hero__content{left:50%;width:calc(100% - 32px);top:49%;transform:translate(-50%,-50%)}
 .enter-home .hero__headline{font-size:clamp(25px,5.8vw,42px);line-height:1.5;max-width:none}
 .enter-home .hero__prompt-group>p{font-size:13px;line-height:1.85;margin-top:20px}
 .enter-home .hero__prompt-group .button{font-size:12px;padding:11px 17px;min-height:44px}
 .enter-home .hero-portal{width:60px;height:82px}
 .workflow-section{height:auto;scroll-margin-top:80px}
 .workflow-sticky{position:relative;top:0;height:auto;min-height:0;padding:70px 22px;overflow:visible}
 .workflow-shell{grid-template-columns:1fr;gap:26px;padding:0}
 .workflow-copy-column{padding:0}.enter-home .workflow-copy-column h2{font-size:30px}
 .workflow-steps{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin-top:20px}
 .workflow-steps button{font-size:16px;gap:8px;padding:10px 0;min-height:48px}
 .workflow-screen{height:580px;padding:12px}
}
@media(max-width:600px){
 .enter-home .hero-media--hero-art{top:12%}.enter-home .hero-media--hero-website{top:10%}
 .enter-home .hero-media--hero-left{bottom:4%}.enter-home .hero-media--hero-right{bottom:6%}
 .enter-home .hero-media--hero-portrait{bottom:-6%}
 .enter-home .hero__headline{font-size:clamp(23px,6.1vw,35px)}
 .enter-home .hero__prompt-group .hero-actions{gap:10px;flex-wrap:wrap}
 .workflow-sticky{padding:65px 16px}.enter-home .workflow-copy-column h2{font-size:28px}
 .workflow-copy-column>p{font-size:12px}.workflow-steps button{font-size:14px}.workflow-number{font-size:10px;min-width:15px}
 .workflow-screen{height:560px;padding:10px}
 .workflow-panel .product-chrome{padding:12px 10px;gap:9px;font-size:9px}.workflow-panel .product-chrome .brand{font-size:13px}
 .workflow-panel .discovery-surface{padding:12px 10px}.workflow-panel .discovery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .workflow-panel .filter-chips button{font-size:9px;padding:7px 8px}.workflow-panel .discovery-bottom .text-button{font-size:10px}
 .enter-home .workflow-panel .journey-grid>article .journey-cover{height:310px}
 .enter-home .workflow-panel .creation-cover{height:360px;padding:18px}
 .workflow-panel .code-sheet{left:22px;right:22px}
 .workflow-panel .copy-toolbar{gap:8px;font-size:11px;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){.hero-heading-char{opacity:1!important;transform:none!important}}
.enter-home .hero-portal .tobira-door-frame{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;overflow:visible}
@media(min-width:901px) and (max-height:740px){
 .workflow-sticky{min-height:0;padding:20px 36px}.workflow-shell{padding:12px 0}
 .workflow-screen{height:calc(100svh - 130px);min-height:350px}
 .enter-home .workflow-copy-column h2{font-size:32px}.workflow-copy-column>p{margin-top:15px}
 .workflow-steps{margin-top:12px;gap:2px}.workflow-steps button{font-size:17px;min-height:46px;padding:10px 0}
}
.workflow-steps button>span:last-child{white-space:nowrap}
@media(max-width:600px){.workflow-steps button{font-size:clamp(12px,3.6vw,14px);gap:6px}}


/* A single opaque leaf rotates on its left hinge; the frame never dissolves. */
.enter-home .hero-portal{perspective:420px}
.enter-home .hero-portal__mask{inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);overflow:visible;transform-style:preserve-3d;border-radius:0;opacity:1;visibility:visible}
.enter-home .hero-portal__leaf{transform-origin:0 50%;will-change:transform;backface-visibility:visible}
.enter-home .hero-portal__leaf::after{content:"";position:absolute;top:0;right:0;width:4px;height:100%;background:#57585a;transform-origin:right center;transform:rotateY(-90deg);backface-visibility:visible}
.enter-home .hero-portal__leaf svg{backface-visibility:visible}
.enter-home .hero-portal__opening{box-shadow:inset 7px 0 12px #0003}
.enter-home .brand img{width:28px;height:28px;object-fit:contain}
.enter-home .public-footer .brand img{filter:none}

/* One stable window for all four recordings. Only its contents change. */
.workflow-screen{position:relative;width:100%;aspect-ratio:1280/900;height:auto;min-height:0;max-height:calc(100svh - 220px);padding:0;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 16px 48px -18px #1820272b,0 3px 12px #1820270a}
.workflow-panel{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;border-radius:inherit}
.workflow-recording{display:block;width:100%;height:100%;max-height:none;object-fit:contain;background:#fff;border-radius:inherit}
@media(max-width:900px){.workflow-screen{height:auto;max-height:none;padding:0}}

/* Show the entire artwork instead of enlarging it beyond its card. */
.enter-home .hero-media img,.enter-home .hero-flyby img,.enter-home .anything__image-base{width:100%;height:100%;object-fit:contain;object-position:center;max-width:100%}
.enter-home .hero-media--hero-left{left:3%;right:auto}
.enter-home .hero-media--hero-right{left:auto;right:3%}
.enter-home .hero-media--hero-portrait{left:auto;right:10%}
.enter-home .hero-media--hero-bottom{bottom:24px}
.hero-portal__site{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:white;opacity:0}
.hero-portal__site[data-visible=true]{opacity:1}
@media(max-width:600px){.enter-home .hero-media--hero-art{left:16px}.enter-home .hero-media--hero-website{left:auto;right:16px}.enter-home .hero-media--hero-left{left:16px;bottom:6%}.enter-home .hero-media--hero-right{right:16px;bottom:6%}.enter-home .hero-media--hero-portrait{bottom:16px;right:12%}}

/* Reserve a stable layout, while each recording's shadow hugs its actual frame. */
.workflow-screen{aspect-ratio:1920/1080;max-height:none;background:transparent;border-radius:0;overflow:visible;box-shadow:none;width:min(100%,calc((100svh - 220px)*1920/1080))}
.workflow-panel{overflow:visible;border-radius:0}
.workflow-recording{width:100%;height:auto;max-height:none;object-fit:contain;border-radius:clamp(8px,1.4vw,16px);box-shadow:0 16px 48px -18px #1820272b,0 3px 12px #1820270a}
@media(max-width:900px){.workflow-screen{width:100%}}

/* Enter's easy-build carousel: 655 × 495 reference canvas, same timing and poses. */
.workflow-panel[data-workflow-state]{transform-origin:50% 50%;transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .42s ease;will-change:transform,opacity}
.workflow-panel[data-workflow-state="active"]{z-index:3;opacity:1;transform:translate3d(0,0,0) scale(1)}
.workflow-panel[data-workflow-state="previous"]{z-index:2;opacity:1;transform:translate3d(30.381679%, -72.020202%,0) scale(.4);pointer-events:none}
.workflow-panel[data-workflow-state="next"]{z-index:1;opacity:1;transform:translate3d(31.236641%,70.727273%,0) scale(.378);pointer-events:none}
.workflow-panel[data-workflow-state="before"]{z-index:0;opacity:0;transform:translate3d(33.587786%,-131.313131%,0) scale(.28);pointer-events:none}
.workflow-panel[data-workflow-state="after"]{z-index:0;opacity:0;transform:translate3d(33.587786%,131.313131%,0) scale(.28);pointer-events:none}
@media(max-width:900px){.workflow-screen{clip-path:inset(-24px -16px -24px -16px)}}

/* Keep the requested workflow carousel motion, including when the OS reduces other motion. */
@media(min-width:901px) and (prefers-reduced-motion:reduce){.enter-home .workflow-panel[data-workflow-state]{transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .42s ease!important}}
/* Extra famous-site icons and first views scattered around the hero (moved by the same hero motion as the original media). */
.enter-home .hero-extra{display:block}
.enter-home .hero-extra img{display:block;width:100%;height:100%}
.enter-home .hero-extra--icon{width:56px;height:56px;overflow:visible}
.enter-home .hero-extra--icon img{object-fit:contain;border-radius:12px}
.enter-home .hero-extra--shot{width:150px;height:94px;border-radius:4px;box-shadow:0 10px 28px rgba(20,20,20,.1)}
.enter-home .hero-extra--shot img{object-fit:cover;object-position:top}
@media (max-width:900px){.enter-home .hero-extra--icon{width:40px;height:40px}.enter-home .hero-extra--icon img{border-radius:9px}.enter-home .hero-extra--shot{width:104px;height:65px}}
@media (max-width:640px){.enter-home .hero-extra--shot{display:none}}
@media (max-width:640px){.enter-home .hero-extra--wide{display:none}}