/* The gallery is the stage. Contact is a drawer, never a permanent column. */
.gallery-study .g-workspace{grid-template-columns:minmax(0,1fr);position:relative;isolation:isolate}
.gallery-study .g-gallery{grid-column:1}
.gallery-study .g-picker{gap:10px;position:relative;z-index:85;align-items:center}
.gallery-study .g-picker button{position:relative;display:inline-flex;flex-direction:column;justify-content:center;width:64px;min-width:64px;min-height:66px;padding:7px 4px;border:1px solid color-mix(in srgb,var(--blue) 55%,transparent);color:var(--blue);border-radius:var(--card-radius,4px);background:transparent;gap:4px}
.gallery-study .g-picker button[aria-selected=true]{border-color:var(--blue);background:var(--g-surface)}
.gallery-study .g-picker button>span:not(.g-icon){max-width:100%;overflow-wrap:anywhere;text-align:center;font-size:.75rem;line-height:1.2;color:var(--g-text)}
.gallery-study .g-picker .g-icon{width:21px;height:21px}
.tippy-box[data-theme~=nav]{text-align:center;transform-origin:50% 0}
.tippy-box[data-animation=nav-pop][data-state=hidden]{opacity:0;transform:translateY(-5px) scale(.7,.8)}
.tippy-box[data-animation=nav-pop][data-state=visible]{opacity:1;transform:translateY(0) scale(1)}
.gallery-study .g-nav-button,.gallery-study .g-trailer-options button{border-color:var(--blue)}
.gallery-study .g-contact{display:grid;position:absolute;grid-column:auto;grid-row:auto;inset:64px 0 0 auto;width:min(390px,100%);height:auto;padding:20px;z-index:75;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(30px);transition:transform .28s cubic-bezier(.16,1,.3,1),opacity .18s,visibility .28s;border:1px solid var(--blue);background:var(--g-surface)}
.gallery-study .g-contact.g-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0)}
.gallery-study #g-contact-close{display:flex;border:0;width:44px;height:44px}
.gallery-study .g-contact #g-form{min-height:0}
/* Material is changed only after the easter egg is unlocked. */
.g-material-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.g-fabric-color{flood-color:var(--blue)}
.gallery-study .g-character{filter:url(#hoodie-power)}
.crown-base{fill:var(--crown-base-color,var(--blue))}
.crown-powered{transition:fill .2s;clip-path:inset(100% 0 0)}
.crown-svg[data-awake=true] .crown-powered{clip-path:inset(0)}
.g-primary,.g-text-action{position:relative;isolation:isolate;overflow:visible}
.g-action-energy{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;opacity:var(--action-energy,0)}
.g-action-energy path{fill:none;stroke:var(--blue);vector-effect:non-scaling-stroke;stroke-linejoin:miter;stroke-linecap:butt}
.g-action-bolt{stroke-width:var(--action-weight,1.3)}
.g-action-wave{stroke-width:calc(2px + var(--action-glow,0)*.6px);filter:blur(1px);opacity:.28;transform-box:fill-box;transform-origin:center;animation:g-aura-rise var(--energy-speed,4.2s) ease-out infinite}
@keyframes g-aura-rise{from{transform:translateY(1px) scale(.99);opacity:.3}to{transform:translateY(-6px) scale(1.035,1.10);opacity:0}}
.g-action-energy[data-paused=true] path{animation-play-state:paused}

.g-action-trail{stroke-width:calc(3px + var(--action-glow,0)*1.2px);filter:blur(calc(3px + var(--action-glow,0)*1.2px));opacity:clamp(0,var(--action-glow,0)*.5,.85);animation:g-action-afterglow calc(var(--energy-speed,4.2s)*1.4) ease-in-out infinite}
.g-action-spark{stroke-width:calc(var(--action-weight,1.3)*1.4);stroke-dasharray:5 20;animation:crown-flow var(--energy-speed,4.2s) linear infinite}
@keyframes g-action-afterglow{50%{opacity:clamp(0,var(--action-glow,0)*.7,1)}}
.gallery-study .g-form-actions{padding-inline:20px;padding-bottom:12px}
html:not([data-powered=true]) .g-action-energy,.g-leaving .g-action-energy{display:none}
/* A short, directional headline reveal follows each moving gallery card. */
.g-feature-copy h1,.g-about-heading h1,.g-services-heading h1{animation:g-headline-arrive .52s cubic-bezier(.16,1,.3,1) both}
.g-feature-copy>p:not(.g-eyebrow),.g-feature-copy>.g-primary{animation:g-copy-arrive .38s cubic-bezier(.16,1,.3,1) both;animation-delay:80ms}
.g-feature-copy>.g-primary{animation-delay:140ms}
@keyframes g-headline-arrive{from{clip-path:inset(0 100% 0 0);transform:translateX(14px);opacity:.45}to{clip-path:inset(0);transform:translateX(0);opacity:1}}
@keyframes g-copy-arrive{from{transform:translateX(10px);opacity:.35}to{transform:translateX(0);opacity:1}}
@media(max-width:700px),(orientation:landscape) and (max-height:600px){
 .gallery-study .g-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:52px minmax(0,1fr);gap:8px}
 .gallery-study .g-picker{grid-column:1;grid-row:1;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;justify-content:stretch;min-width:0;padding:0 6px}
 .gallery-study .g-picker button{width:100%;min-width:0;min-height:56px;padding:6px 2px;gap:3px;border-radius:0}
 .gallery-study .g-gallery{grid-column:1;grid-row:2}
 .gallery-study .g-workspace.contact-open{position:fixed;top:var(--visible-top,0px);left:var(--visible-left,0px);width:var(--visible-width,100vw);height:var(--visible-height,100dvh);padding:0;gap:0;z-index:80;background:var(--g-canvas);grid-template-rows:56px minmax(0,1fr);overflow:hidden}
 .gallery-study .contact-open .g-picker{padding-top:env(safe-area-inset-top);align-self:stretch}
 .gallery-study .contact-open .g-gallery{visibility:hidden}
 .gallery-study .g-contact{position:relative;grid-column:1;grid-row:2;inset:auto;width:100%;height:100%;max-height:none;min-height:0;border:0;border-top:1px solid var(--blue);padding:14px max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:0;transform:translateX(100%);overflow:hidden}
 .gallery-study .g-contact.g-open{transform:translateX(0)}
 .gallery-study .g-contact-top{padding-bottom:12px}
 .gallery-study .g-contact .g-form-body textarea{height:clamp(96px,calc(var(--contact-height,100dvh) - 164px),176px);min-height:96px}
}
@media(prefers-reduced-motion:reduce){
 .gallery-study .g-contact,.g-action-energy path,.g-feature-copy h1,.g-about-heading h1,.g-services-heading h1,.g-feature-copy>p,.g-feature-copy>.g-primary,.g-entering,.g-leaving{animation:none!important;transition:none!important}
 .gallery-study .g-card.g-leaving{display:none}
 .tippy-box[data-animation=nav-pop]{transform:none!important;transition:opacity .1s!important}
}
@media(max-width:700px),(orientation:landscape) and (max-height:600px){
 .gallery-study .g-picker{width:calc(100% + 12px);margin-inline:-6px;padding-inline:0}
 .gallery-study .contact-open .g-picker{width:100%;margin-inline:0;padding-inline:6px}
 .gallery-study .contact-open[data-short-contact=true] .g-contact-top p{display:none}
 .gallery-study .contact-open[data-short-contact=true] .g-contact-top h2{font-size:18px;margin:0}
 .gallery-study .contact-open[data-short-contact=true] .g-contact-top{padding-bottom:8px}
 .gallery-study .contact-open[data-short-contact=true] #g-form{padding-top:10px}
 .gallery-study .contact-open[data-short-contact=true] .g-form-body textarea{height:clamp(64px,calc(var(--contact-height) - 130px),176px);min-height:64px}
}

/* Reserve clearance for the main logo's tallest tier without shifting the wordmark. */
.crown-figure{transform-box:view-box;transform-origin:128px 128px;transform:scale(var(--crown-scale,1));transition:transform .35s cubic-bezier(.16,1,.3,1)}
.gallery-study .g-shell{grid-template-rows:102px minmax(0,1fr)}
.gallery-study .g-header.site-header{height:102px}
.gallery-study .g-header .brand{gap:24px}
@media(max-width:700px){
 .gallery-study .g-shell{grid-template-rows:76px minmax(0,1fr)}
 .gallery-study .g-header.site-header{height:76px}
 .gallery-study .g-header .brand{gap:18px}
 .gallery-study .g-picker button>span:not(.g-icon){font-size:.6875rem}
}
@media(orientation:landscape) and (max-height:600px){
 .gallery-study .g-shell{grid-template-rows:72px minmax(0,1fr)}
 .gallery-study .g-header.site-header{height:72px}
 .gallery-study .g-picker button>span:not(.g-icon){font-size:.6875rem}
}
@media(prefers-reduced-motion:reduce){.crown-figure{transition:none}}
/* The sample carousel has only records, with directional glow rails instead of a scrollbar. */
.gallery-study .g-media-picker{display:block;min-height:0;height:100%}
.g-sample-rail{position:relative;height:100%;min-height:0;padding-inline:44px}
.gallery-study .g-track-strip{height:100%;scrollbar-width:none;padding-bottom:12px;scrollbar-gutter:auto}
.gallery-study .g-track-strip::-webkit-scrollbar{display:none;width:0;height:0}
.g-scroll-edge{position:absolute;top:0;bottom:0;z-index:3;width:44px;min-width:44px;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--blue);cursor:pointer;transition:opacity .18s}
.g-scroll-back{left:0}.g-scroll-next{right:0}
.g-scroll-edge::before{content:'';position:absolute;top:5px;bottom:5px;left:21px;width:2px;background:linear-gradient(transparent,var(--blue) 18%,var(--blue) 82%,transparent);box-shadow:0 0 12px var(--blue);opacity:.6}
.g-scroll-edge .g-icon{position:relative;z-index:1;width:21px;height:21px;background:currentColor;box-shadow:0 0 12px var(--g-canvas)}
.g-scroll-edge:disabled{opacity:.17;cursor:default}
.g-sample-rail[data-overflow=false] .g-scroll-edge{visibility:hidden}
.g-sample-rail[data-overflow=false] .g-track-strip{justify-content:center}
.crown-figure{transform:translateY(18px) scale(var(--crown-scale,1))}
@media(max-width:700px){.gallery-study .g-header .brand{margin-left:8px}}
@media(prefers-reduced-motion:reduce){.g-scroll-edge{transition:none}}
/* Let the record strip overflow inside the card instead of sizing the card to its contents. */
.gallery-study #g-samples,.gallery-study .g-media-picker,.g-sample-rail{min-width:0;max-width:100%}

/* One gallery stage and a quiet footer replace the separate transport row. */
.gallery-study .g-shell{grid-template-rows:102px minmax(0,1fr) 24px;row-gap:10px}
.gallery-study .g-workspace{grid-template-rows:auto minmax(0,1fr);row-gap:8px}
.gallery-study .g-gallery{grid-template-rows:minmax(0,1fr);gap:0}
.gallery-study .g-viewport{grid-row:1}
.gallery-study .g-card{padding-top:10px}
.g-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;min-width:0;color:var(--g-muted);font-size:11px;line-height:1.3}
.g-footer a{display:flex;align-items:center;min-height:24px;color:var(--blue);text-decoration:none}
@media(max-width:700px){.gallery-study .g-shell{grid-template-rows:76px minmax(0,1fr) 24px}.gallery-study .g-workspace{grid-template-rows:auto minmax(0,1fr)}}
@media(orientation:landscape) and (max-height:600px){.gallery-study .g-shell{grid-template-rows:72px minmax(0,1fr) 20px;row-gap:5px}.gallery-study .g-workspace{grid-template-rows:auto minmax(0,1fr);row-gap:4px}.g-footer{font-size:10px}}

/* Identity clicks drive shared interactive accents and avatar material. */
.g-fabric-color{flood-color:var(--identity-accent,#b88aff)}
.gallery-study .g-header .brand{color:var(--identity-accent,#b88aff)}
.g-header-actions{--blue:var(--identity-accent,#b88aff);--g-accent:var(--identity-accent,#b88aff);display:flex;align-items:center;gap:12px;flex-shrink:0}
.gallery-study .g-header-actions .g-primary{display:inline-flex;gap:9px;min-height:44px;padding:10px 15px;color:#19141f;background:var(--g-accent);border:1px solid var(--g-accent);font-size:13px;white-space:nowrap}
.gallery-study .g-header-actions .g-icon{display:inline-block;background:currentColor;width:19px;height:19px;flex:none}
.gallery-study .g-picker{grid-template-columns:repeat(6,minmax(0,1fr))}
/* Button highlights follow the current power color. */
.gallery-study :is(button,a.g-primary,.g-player-toolbar a,summary){transition:background-color .15s,border-color .15s,color .15s}
@media(hover:hover){
 .gallery-study :is(button:not(.brand),a.g-primary,.g-player-toolbar a,summary):not(:disabled):hover{color:var(--g-accent);border-color:var(--g-accent);background:color-mix(in srgb,var(--g-accent) 16%,var(--g-surface))}
 .gallery-study :is(button.g-primary,a.g-primary):not(:disabled):hover{color:#19141f;background:color-mix(in srgb,var(--g-accent) 84%,#000);border-color:color-mix(in srgb,var(--g-accent) 84%,#000);filter:none}
 .gallery-study .g-record:hover .g-record-play{background:color-mix(in srgb,var(--g-accent) 84%,#000)}
 .gallery-study .g-record:hover .g-record-orbit text{fill:var(--g-accent)}
}
@media(max-width:700px){
 .gallery-study .g-header .brand{gap:12px;margin-left:0;flex-shrink:1}.g-header-actions{gap:8px}.gallery-study .g-header-actions .g-primary{padding:8px 10px;font-size:12px;gap:6px}.gallery-study .g-header-actions .g-social{display:inline-flex;width:44px;padding:10px}.g-header-actions .g-social>span:not(.g-icon){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .gallery-study .g-header .brand-lockup{width:40px;height:40px;flex-basis:40px}.gallery-study .g-brand-copy strong{font-size:18px}.gallery-study .g-brand-copy>span{font-size:11px}
}
@media(max-width:360px){.gallery-study .g-header .brand{gap:8px}.gallery-study .g-brand-copy strong{font-size:16px}.gallery-study .g-brand-copy>span{font-size:10px}.gallery-study .g-header-actions .g-primary{padding:8px;font-size:11px}.gallery-study .g-header-actions .g-icon{width:16px;height:16px}.g-header-actions{gap:6px}.gallery-study .g-header-actions #g-tab-contact{max-width:104px;white-space:normal;line-height:1.2}}
@media(prefers-reduced-motion:reduce){.gallery-study :is(button,a.g-primary,summary){transition:none}}

@media(hover:hover){html[data-power-family=red] .gallery-study .g-primary:hover{color:#fafafa}}

/* Softer red/blue fills retain readable matching text on neutral surfaces. */
.gallery-study :is(.sc-cart-button,.sc-steps [aria-current],.sc-summary-contact,.sc-back,.sc-clear,.sc-edit,.sc-browse,.sc-directions button[aria-pressed=true],.sc-projects button[aria-pressed=true],.sc-build-services button[aria-pressed=true],.g-text-action,.g-trailer-options button,.g-about-actions a,.g-footer a):not(:disabled){color:var(--accent-readable,var(--g-accent))}