/* ARKHE mobile HQ + real website showroom fixes / November 2 2026
   Responsive by viewport AND containing component width, not fixed desktop min sizes. */
#v-work .floating-hq,
#v-work .floating-hq .fh-grid,
#v-work .floating-hq .fh-center,
#v-work .floating-hq .fh-side,
#v-work .floating-hq .fh-card,
#v-work .floating-hq .fh-viewport{min-width:0;max-width:100%;box-sizing:border-box}
#v-work .floating-hq .fh-viewport{width:100%;overflow:hidden}
#v-work .floating-hq .fh-center{width:100%;min-width:0}
#v-work .floating-hq .fh-grid{width:100%;grid-template-columns:minmax(0,.88fr) minmax(0,1.35fr) minmax(0,.88fr)}
#v-work .floating-hq .fh-card{box-sizing:border-box}
#v-work .fh-center .hq-holo-fallback{width:100%;min-width:0}
@media(max-width:900px){
 #v-work .floating-hq .fh-grid{display:flex!important;flex-direction:column!important;min-height:0!important;gap:12px!important;align-items:stretch!important;perspective:none!important}
 #v-work .floating-hq .fh-center{order:0!important;display:flex!important;flex-direction:column!important;position:relative!important;transform:none!important;grid-column:auto!important;grid-row:auto!important;min-height:320px!important;max-height:450px!important;align-items:center!important;justify-content:space-between!important;padding:16px!important}
 #v-work .floating-hq .fh-viewport{display:flex!important;flex:1 1 auto!important;height:220px!important;min-height:200px!important;max-height:280px!important;max-width:100%!important;overflow:hidden!important;margin:0!important}
 #v-work .floating-hq .fh-side{width:100%!important;max-width:100%!important;min-height:0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:none!important;gap:10px!important;transform:none!important}
 #v-work .floating-hq .fh-left{order:1!important}
 #v-work .floating-hq .fh-right{order:2!important}
 #v-work .floating-hq .fh-card{width:100%!important;min-width:0!important;min-height:166px!important;max-height:230px!important;overflow:hidden!important;transform:none!important;padding:13px!important;justify-content:space-between!important}
 #v-work .floating-hq .fh-card .fh-card-head{min-width:0}
 #v-work .floating-hq .fh-card .fh-card-head strong{overflow-wrap:anywhere}
 #v-work .floating-hq .fh-center-logo{font-size:clamp(23px,5vw,36px)!important;letter-spacing:.19em!important}
 #v-work .floating-hq .fh-center-bottom{font-size:9px}
 #v-work .floating-hq .fh-dock{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 #v-work .floating-hq .fh-dock>*{display:grid;place-items:center;min-height:41px;padding:9px 7px!important;white-space:normal}
}
@media(max-width:520px){
 #v-work .floating-hq{padding:10px!important;gap:9px!important}
 #v-work .floating-hq .fh-head{display:flex!important;flex-wrap:wrap!important;gap:5px!important}
 #v-work .floating-hq .fh-head .fh-status{font-size:8px!important}
 #v-work .floating-hq .fh-grid{gap:8px!important;padding:4px 0!important}
 #v-work .floating-hq .fh-center{min-height:290px!important;height:310px!important;max-height:340px!important;padding:12px!important;border-radius:13px!important}
 #v-work .floating-hq .fh-center .fh-viewport{height:190px!important;min-height:180px!important;max-height:210px!important}
 #v-work .floating-hq .fh-center-logo{font-size:26px!important;margin-top:4px!important}
 #v-work .floating-hq .fh-center-kicker{font-size:7px!important;letter-spacing:.05em!important}
 #v-work .floating-hq .fh-center-intro{font-size:7px!important;letter-spacing:.06em!important}
 #v-work .floating-hq .fh-center-bottom{font-size:7px!important;letter-spacing:0!important;padding-top:9px!important}
 #v-work .floating-hq .fh-side{gap:7px!important}
 #v-work .floating-hq .fh-card{padding:10px!important;min-height:155px!important;height:170px!important;max-height:190px!important}
 #v-work .floating-hq .fh-card-head strong{font-size:7.3px!important}
 #v-work .floating-hq .fh-card-stat{font-size:29px!important;gap:4px!important}
 #v-work .floating-hq .fh-card-stat small{font-size:8px!important}
 #v-work .floating-hq .fh-mini-bars{height:29px!important}
 #v-work .floating-hq .fh-web-preview{min-height:65px!important}
 #v-work .floating-hq .fh-browser-hero{min-height:45px!important;padding:7px 9px!important}
 #v-work .floating-hq .fh-browser-hero b{font-size:16px!important}
 #v-work .floating-hq .fh-line-chart{height:32px!important}
 #v-work .floating-hq .fh-call-display{gap:6px}
 #v-work .floating-hq .fh-card-foot{font-size:7px!important}
 #v-work .floating-hq .fh-dock{grid-template-columns:1fr;gap:7px}
 #v-work .floating-hq .fh-dock>*{min-height:37px}
}
/* Finished previews are immediately visible above the legacy orbit showroom.
   They are explicitly marked independent concepts, never client work. */
#v-show .sr-signature-collection{position:relative;z-index:5;display:grid;gap:14px;margin:14px 0 18px;padding:clamp(14px,3vw,24px);border:1px solid #638ee67a;border-radius:19px;background:radial-gradient(ellipse at 85% 5%,#21477d5c,transparent 50%),linear-gradient(138deg,#0b1e37,#081224);color:#ecf8ff;box-shadow:inset 0 1px #a3dcff24,0 18px 42px #0006}
#v-show .sr-signature-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}
#v-show .sr-signature-heading>div{display:grid;gap:6px}
#v-show .sr-signature-heading span{font:750 9px var(--f-mono),monospace;letter-spacing:.14em;color:#76d6fc}
#v-show .sr-signature-heading h2{font:800 clamp(20px,2.8vw,32px)/1.14 var(--f-head),sans-serif;color:#f2faff;letter-spacing:-.035em;margin:0}
#v-show .sr-signature-heading p{font:500 11px/1.55 var(--f-body),sans-serif;color:#9cbbd2;max-width:550px;margin:0}
#v-show .sr-signature-heading>a{display:inline-flex;flex:none;align-items:center;padding:11px 13px;border:1px solid #81c7fa68;border-radius:8px;background:#153e61;color:#d9f3ff;font:750 10px var(--f-head),sans-serif;text-decoration:none}
#v-show .sr-signature-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
#v-show .sr-signature-card{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;min-height:205px;padding:18px;overflow:hidden;border-radius:12px;border:1px solid #8cb8e269;background:radial-gradient(ellipse at 75% 32%,#4a88a668,transparent 62%),linear-gradient(110deg,#102743,#0d122c);box-shadow:inset 0 1px #b4d9fb42;color:#f6faff;text-decoration:none;transition:transform .18s,border-color .18s}
#v-show .sr-signature-card:before{content:'';position:absolute;inset:0;z-index:-2;background-position:center;background-size:cover;opacity:.62}
#v-show .sr-signature-card:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#050d1c 7%,#091831b2 52%,#05102123)}
#v-show .sr-signature-upstar:before{background-image:url('https://images.unsplash.com/photo-1541888946425-d81bb19240f5?auto=format&fit=crop&w=900&q=75')}
#v-show .sr-signature-crawford:before{background-image:url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?auto=format&fit=crop&w=900&q=75')}
#v-show .sr-signature-peachline:before{background-image:url('https://images.squarespace-cdn.com/content/v1/685af9db4334844eff198903/76e64176-2568-4de4-97f1-6554e3e5b882/mercedes-peachline-van.jpg?format=750w')}
#v-show .sr-signature-card:hover{transform:translateY(-3px);border-color:#a3eaff}
#v-show .sr-signature-number{font:750 9px var(--f-mono),monospace;letter-spacing:.1em;color:#99dbff;margin-bottom:auto}
#v-show .sr-signature-card strong{font:750 clamp(17px,2vw,24px)/1.15 var(--f-head),sans-serif;letter-spacing:-.028em;text-shadow:0 3px 10px #000}
#v-show .sr-signature-card small{font:550 10px var(--f-body),sans-serif;color:#bad4e5}
#v-show .sr-signature-go{display:inline-flex;align-self:start;align-items:center;margin-top:7px;padding:8px 10px;border:1px solid #84dfff7d;border-radius:6px;background:#163453e3;color:#b5edff;font:750 10px var(--f-head),sans-serif}
@media(max-width:750px){
 #v-show .sr-signature-heading{flex-wrap:wrap}
 #v-show .sr-signature-heading>a{font-size:9px}
 #v-show .sr-signature-items{display:flex;gap:9px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:3px 2px 10px;scrollbar-width:thin}
 #v-show .sr-signature-card{flex:0 0 min(72vw,260px);min-width:0;min-height:200px;scroll-snap-align:start}
}
@media(max-width:420px){
 #v-show .sr-signature-collection{padding:12px;margin:10px 0 14px}
 #v-show .sr-signature-heading h2{font-size:22px}
 #v-show .sr-signature-heading p{font-size:10px}
 #v-show .sr-signature-card{flex-basis:min(72vw,235px);min-height:185px;padding:12px}
 #v-show .sr-signature-card strong{font-size:18px}
}
@media(prefers-reduced-motion:reduce){#v-show .sr-signature-card{transition:none}}
