@import url("contact-page-base-v9.css?v=20261007");

/* VFINAL.10 — CONTACT: light technical intro -> spatial gallery room */
body.contact-modular{--ct-room:0;overflow-x:clip!important}
.ct-stage{perspective:1250px!important;background:linear-gradient(180deg,rgba(238,241,235,.99),rgba(238,241,235,.96))}
.ct-stage::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:calc(var(--header,76px) + 1rem) 1.6rem 1.6rem;
  opacity:var(--ct-room);
  pointer-events:none;
  clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);
  background:
    linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px) center/11rem 100%,
    linear-gradient(180deg,#222728 0%,#111516 54%,#070909 100%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 0 9rem rgba(0,0,0,.45),0 2rem 7rem rgba(0,0,0,.12);
  transform:perspective(1000px) rotateX(1deg) scale(.985);
  transform-origin:center bottom;
}
.ct-stage::after{
  z-index:3!important;
  opacity:calc(1 - var(--ct-room));
  background:
    linear-gradient(90deg,rgba(238,241,235,.95) 0 4%,transparent 17% 83%,rgba(238,241,235,.88) 97% 100%),
    linear-gradient(180deg,rgba(238,241,235,.42),transparent 18% 82%,rgba(238,241,235,.28))!important;
}
.ct-portrait{z-index:6!important;max-width:48rem!important}
.ct-portrait::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:7%;right:11%;bottom:2.5%;height:10%;
  background:linear-gradient(180deg,#7d8587,#1b1f20 20% 72%,#080a0a 73%);
  border:1px solid rgba(255,255,255,.18);
  transform:perspective(800px) rotateX(62deg);
  transform-origin:center bottom;
  opacity:var(--ct-room);
  box-shadow:0 1.5rem 4rem rgba(0,0,0,.38);
}
.ct-portrait img{filter:saturate(1) contrast(1.03) brightness(.99) drop-shadow(0 2.8rem 5rem rgba(11,14,16,.18))!important}
.ct-copy{
  z-index:12!important;
  right:clamp(2rem,5vw,var(--gutter))!important;
  width:min(37rem,39vw)!important;
  min-width:0!important;
  padding:clamp(1.15rem,1.7vw,1.7rem)!important;
  background:rgba(247,248,244,.92)!important;
  border:1px solid rgba(11,14,16,.12)!important;
  box-shadow:0 1.8rem 5rem rgba(0,0,0,.09)!important;
  backdrop-filter:blur(13px)!important;
}
.ct-panel{min-width:0!important}
.ct-panel h1,.ct-panel h2{max-width:10ch!important;text-wrap:balance;overflow-wrap:normal!important}
.ct-panel :is(p,small,strong,a,button){max-width:100%;overflow-wrap:anywhere}
.ct-channels,.ct-specs{min-width:0!important}
.ct-channel{min-width:0!important;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s ease!important}
.ct-channel strong,.ct-specs p{overflow-wrap:anywhere}
.ct-channel:hover{transform:translateX(.35rem)}
.ct-floater{backdrop-filter:blur(10px);transition:transform .35s ease,box-shadow .35s ease!important}
.ct-floater--work{transform:translate3d(var(--ct-work-x,0),var(--ct-work-y,0),55px)!important}
.ct-floater--cv{transform:translate3d(var(--ct-cv-x,0),var(--ct-cv-y,0),34px)!important}
.ct-floater--journey{transform:translate3d(var(--ct-journey-x,0),var(--ct-journey-y,0),24px)!important}
.ct-rail{z-index:18!important}
.ct-rail :is(a,button){min-width:0!important}

@media(max-width:1180px){
  .ct-copy{right:2rem!important;width:min(34rem,42vw)!important}
  .ct-portrait{left:1.5%!important;width:min(46vw,35rem)!important}
  .ct-floater--work{scale:.88}
  .ct-floater--proof{scale:.86}
}
@media(max-width:920px){
  .ct-story{height:auto!important;background:var(--ct-bg)!important}
  .ct-stage{height:auto!important;overflow:visible!important;padding-top:calc(var(--header,72px) + 1rem)!important}
  .ct-stage::before,.ct-stage::after{display:none!important}
  .ct-copy{position:relative!important;inset:auto!important;width:auto!important;margin:0 var(--gutter)!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important}
  .ct-portrait{position:relative!important;left:auto!important;top:auto!important;width:min(100%,31rem)!important;height:34rem!important;margin:0 auto 1.5rem!important;transform:none!important}
  .ct-portrait::before{display:none!important}
  .ct-panel{position:relative!important;inset:auto!important;opacity:1!important;visibility:visible!important;transform:none!important;padding:3.2rem 0!important;border-top:1px solid var(--ct-line)!important;pointer-events:auto!important}
  .ct-panel:first-child{border-top:0!important}
  .ct-panel h1,.ct-panel h2{font-size:clamp(3.1rem,10vw,5rem)!important;max-width:10ch!important}
  .ct-floaters,.ct-readouts,.ct-node{display:none!important}
  .ct-rail{position:relative!important;inset:auto!important;margin:0 var(--gutter) 2rem!important}
}
@media(max-width:620px){
  .ct-stage{padding-top:calc(var(--header,68px) + .75rem)!important}
  .ct-portrait{width:100%!important;height:min(30rem,66svh)!important;margin-bottom:1rem!important}
  .ct-copy{margin-inline:var(--gutter)!important}
  .ct-panel{padding:2.7rem 0!important}
  .ct-panel h1,.ct-panel h2{font-size:clamp(2.85rem,13.5vw,4.5rem)!important;line-height:.86!important}
  .ct-channel{grid-template-columns:minmax(0,1fr) auto!important;gap:.8rem!important}
  .ct-channel span{grid-column:1/-1!important}
  .ct-specs article{grid-template-columns:2rem minmax(0,1fr)!important}
  .ct-rail{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:1px!important}
  .ct-rail :is(a,button){padding:.85rem .65rem!important}
}
@media(prefers-reduced-motion:reduce){
  .ct-floater,.ct-portrait,.ct-copy,.ct-panel{transform:none!important;transition:none!important}
}