/* Hero portfolio: public storefront previews. */
.hero-content{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(34px,4vw,70px);min-height:675px}
.hero-copy h1{font-size:clamp(44px,4.7vw,78px);white-space:normal}
.project-showcase{min-width:0;width:100%;padding:48px 0 35px;position:relative}
.project-heading{display:flex;align-items:center;justify-content:space-between;padding:0 4px 17px}
.project-heading .eyebrow{font-size:9px;letter-spacing:.16em;color:var(--muted)}
.project-count{font-size:11px;letter-spacing:.1em;color:#8394a9;font-variant-numeric:tabular-nums}
.project-count b{font-weight:600;color:var(--ink)}
.project-frame{position:relative;border:1px solid #cbd7e5;border-radius:14px;background:#fff;box-shadow:0 28px 65px -25px #12356540,0 5px 15px #12356508;isolation:isolate}
.project-frame:before{content:"";position:absolute;inset:13px -12px -13px 12px;border:1px solid #cbd7e599;border-radius:14px;z-index:-1;pointer-events:none}
.project-browser{display:flex;align-items:center;gap:18px;padding:15px 19px;border-bottom:1px solid #e4eaf1;border-radius:14px 14px 0 0;background:#fafcff}
.browser-dots{display:flex;gap:5px;flex-shrink:0}.browser-dots i{width:6px;height:6px;border:1px solid #b6c5d7;border-radius:50%}
.project-address{flex:1;text-align:center;font-size:11px;line-height:1.5;color:#637892;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.project-browser>.project-icon{width:13px;height:13px;color:#8b9eb6}
.project-icon{display:block;flex-shrink:0}
.project-viewport{overflow:hidden;touch-action:pan-y}
.project-track{display:flex;transition:transform .65s cubic-bezier(.22,.68,0,1);will-change:transform}
.project-slide{flex:0 0 100%;min-width:0;background:#fff}
.project-preview{display:block;overflow:hidden;background:#edf1f6;aspect-ratio:1920/911;border-bottom:1px solid #e4eaf1}
.project-preview img{width:100%;height:100%;object-fit:contain;object-position:top;user-select:none}
.project-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 25px 25px}
.project-caption h2{font-size:25px;letter-spacing:-.04em;line-height:1.2}
.project-caption p{font-size:11px;color:var(--muted);margin-top:7px;line-height:1.5}
.project-visit{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;flex-shrink:0;transition:background .2s,color .2s}
.project-visit:hover{background:var(--ink);color:white}
.project-progress{height:2px;margin:0 12px;background:#edf2f8;overflow:hidden}
.project-progress>span{display:block;width:100%;height:100%;background:var(--blue);transform:scaleX(0);transform-origin:left}
.project-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:29px}
.project-pagination,.project-actions{display:flex;align-items:center;gap:3px}
.project-dot{display:grid;place-items:center;width:30px;height:44px;padding:0}
.project-dot>span{display:block;width:6px;height:6px;border-radius:4px;background:#9aadc5;transition:width .25s,background .25s}
.project-dot[aria-current=true]>span{width:24px;background:var(--ink)}
.project-actions{gap:7px}
.project-actions button{width:42px;height:42px;display:grid;place-items:center;border:1px solid #cbd7e5;border-radius:50%;padding:0;transition:background .2s}
.project-actions button:hover{background:#fff}.project-actions .project-play{border-color:transparent;margin-right:5px;color:var(--muted)}
.project-play .play-icon,.project-showcase.is-paused .pause-icon{display:none}
.project-showcase.is-paused .play-icon{display:block}
.project-showcase a:focus-visible,.project-showcase button:focus-visible{outline-offset:3px}
.project-preview:focus-visible{outline-offset:-4px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:1600px){.hero-content{min-height:730px}.project-caption{padding:25px 29px 28px}.project-caption h2{font-size:29px}.project-preview{aspect-ratio:1920/911}}
@media(max-width:1150px){.hero-content{gap:30px;min-height:600px}.hero-copy h1{font-size:clamp(42px,4.7vw,56px)}.project-caption{padding:19px}.project-caption h2{font-size:23px}.project-browser{gap:10px;padding:13px}.project-controls{gap:10px}.project-dot{width:26px}.project-actions{gap:4px}}
@media(max-width:900px){.hero-content{grid-template-columns:1fr;gap:0;min-height:0}.hero-copy{padding:40px 0 0}.hero-copy h1{font-size:clamp(48px,7.5vw,65px)}.hero-copy>p{max-width:540px}.project-showcase{max-width:620px;justify-self:center;padding:40px 0 28px}.project-preview{aspect-ratio:1920/911}}
@media(max-width:650px){.hero-content{display:flex;gap:0}.hero-copy{padding-top:31px}.hero-copy h1{font-size:clamp(39px,9.8vw,63px)}.project-showcase{padding:35px 0 22px;max-width:none}.project-heading{padding-bottom:12px}.project-heading .eyebrow{font-size:8px}.project-frame{border-radius:10px}.project-frame:before{inset:8px -7px -8px 7px;border-radius:10px}.project-browser{border-radius:10px 10px 0 0;padding:12px}.project-address{font-size:10px}.browser-dots{gap:4px}.browser-dots i{width:5px;height:5px}.project-caption{padding:18px}.project-caption h2{font-size:23px}.project-caption p{font-size:10px;max-width:210px}.project-visit{width:36px;height:36px}.project-controls{margin-top:21px}.project-actions button{width:40px;height:40px}.project-dot{width:27px}}
@media(prefers-reduced-motion:reduce){.project-track{transition:none}.project-dot>span{transition:none}}