.page-contact{
  --pc-edge:rgba(46,111,99,.42);
  --pc-soft:rgba(143,255,228,.08);
  --pc-radius:0;
  background:var(--c-deep);
  color:var(--c-ice);
  overflow-x:hidden;
}
.page-contact .shell{
  padding-inline:var(--gutter);
}
.page-contact .pc-section{
  padding-block:clamp(48px,7vw,104px);
  position:relative;
}
.page-contact .pc-section--panel{
  background:
    repeating-linear-gradient(180deg,rgba(143,255,228,.035) 0 1px,transparent 1px 6px),
    linear-gradient(180deg,#06201b 0%,#041713 100%);
  border-block:var(--hair);
}
.page-contact .section-head{
  max-width:960px;
  margin-bottom:clamp(28px,4vw,52px);
}
.page-contact .section-head--tight{
  margin-bottom:clamp(24px,3vw,40px);
}
.page-contact .eyebrow{
  color:var(--c-mint);
  letter-spacing:.18em;
  font-size:12px;
  margin-bottom:14px;
  text-transform:uppercase;
}
.page-contact .section-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.7rem,3.6vw,2.7rem);
  line-height:1.14;
  letter-spacing:.005em;
  color:var(--c-ice);
  margin-bottom:16px;
}
.page-contact .section-lede{
  color:var(--c-sage);
  font-size:clamp(.95rem,1.4vw,1.05rem);
  line-height:1.85;
  max-width:70ch;
}

/* ---------- hero ---------- */
.page-contact .contact-hero{
  position:relative;
  padding-top:calc(var(--header-h) + clamp(28px,5vw,64px));
  padding-bottom:clamp(40px,6vw,88px);
  background:
    radial-gradient(900px 520px at 82% 6%,rgba(19,242,200,.16),transparent 62%),
    radial-gradient(600px 400px at 8% 92%,rgba(255,107,26,.10),transparent 68%),
    linear-gradient(180deg,#041713 0%,#06201b 100%);
  border-bottom:var(--hair);
  overflow:hidden;
}
.page-contact .contact-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(180deg,rgba(143,255,228,.055) 0 1px,transparent 1px 5px);
  opacity:.55;
  pointer-events:none;
}
.page-contact .contact-hero::after{
  content:"";
  position:absolute;
  right:-10%;
  top:18%;
  width:58%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--c-mint),transparent);
  opacity:.5;
  transform:rotate(-14deg);
  pointer-events:none;
}
.page-contact .contact-hero__inner{
  position:relative;
  z-index:1;
  display:grid;
  gap:clamp(28px,4vw,48px);
}
.page-contact .breadcrumb ol{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0 0 22px;
  padding:0;
  font-size:13px;
  color:var(--c-sage);
}
.page-contact .breadcrumb li+li::before{
  content:"/";
  margin-right:8px;
  color:var(--c-line);
}
.page-contact .breadcrumb a{
  color:var(--c-mist);
  text-decoration:none;
}
.page-contact .breadcrumb a:hover,
.page-contact .breadcrumb a:focus-visible{
  color:var(--c-mint);
  text-decoration:underline;
}
.page-contact .contact-hero__coord{
  font-size:13px;
  color:var(--c-mint);
  letter-spacing:.12em;
  margin-bottom:16px;
}
.page-contact .contact-hero__title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(2rem,6.4vw,4.1rem);
  line-height:1.04;
  letter-spacing:.005em;
  margin-bottom:20px;
  color:var(--c-ice);
}
.page-contact .contact-hero__title::after{
  content:"";
  display:block;
  width:88px;
  height:4px;
  margin-top:20px;
  background:linear-gradient(90deg,var(--c-mint),var(--c-orange));
  clip-path:polygon(0 0,100% 0,calc(100% - 6px) 100%,0 100%);
}
.page-contact .contact-hero__lede{
  color:var(--c-sage);
  font-size:clamp(.95rem,1.5vw,1.06rem);
  line-height:1.9;
  max-width:60ch;
}
.page-contact .contact-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}
.page-contact .contact-hero__facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:14px;
  list-style:none;
  margin:32px 0 0;
  padding:20px 0 0;
  border-top:var(--hair);
}
.page-contact .contact-hero__facts li{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.page-contact .contact-hero__fact-num{
  font-size:clamp(1.35rem,2.6vw,1.75rem);
  font-weight:600;
  color:var(--c-mint);
  letter-spacing:.04em;
}
.page-contact .contact-hero__fact-label{
  font-size:12.5px;
  color:var(--c-sage);
  letter-spacing:.04em;
}
.page-contact .contact-hero__visual{
  margin:0;
  position:relative;
}
.page-contact .contact-hero__visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  clip-path:polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,30px 100%,0 calc(100% - 30px));
  border:1px solid var(--pc-edge);
  filter:saturate(.85) contrast(1.05);
}
.page-contact .contact-hero__caption{
  display:block;
  margin-top:12px;
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--c-line);
  text-transform:uppercase;
}

/* ---------- channel cards ---------- */
.page-contact .channel-grid{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}
.page-contact .channel-card{
  position:relative;
  padding:26px 24px 28px;
  background:linear-gradient(160deg,rgba(8,42,36,.96),rgba(4,23,19,.92));
  border:1px solid var(--pc-edge);
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%);
  transition:transform .24s var(--ease),border-color .24s var(--ease);
}
.page-contact .channel-card:hover{
  transform:translateY(-3px);
  border-color:rgba(19,242,200,.6);
}
.page-contact .channel-card--signal{
  background:linear-gradient(160deg,rgba(11,22,38,.98),rgba(8,42,36,.9));
  border-color:rgba(255,107,26,.42);
}
.page-contact .channel-card__coord{
  font-size:11.5px;
  letter-spacing:.16em;
  color:var(--c-mint);
  margin-bottom:14px;
}
.page-contact .channel-card--signal .channel-card__coord{
  color:var(--c-amber);
}
.page-contact .channel-card__title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.25rem;
  letter-spacing:.02em;
  margin-bottom:10px;
  color:var(--c-ice);
}
.page-contact .channel-card__value{
  font-size:.95rem;
  line-height:1.55;
  color:var(--c-ice);
  word-break:break-word;
  margin-bottom:12px;
  padding-bottom:12px;
  border-bottom:1px dashed rgba(46,111,99,.5);
}
.page-contact .channel-card__desc{
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.8;
}
.page-contact .channel-card .tag{
  margin-top:16px;
}

.page-contact .channel-note{
  display:grid;
  gap:16px;
  align-items:start;
  margin-top:24px;
  padding:22px 24px;
  background:rgba(19,242,200,.05);
  border-left:3px solid var(--c-mint);
}
.page-contact .channel-note p{
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.85;
}
.page-contact .channel-note .btn{
  justify-self:start;
}

/* ---------- route panel ---------- */
.page-contact .route-panel{
  display:grid;
  gap:0;
  margin-top:clamp(28px,4vw,48px);
  background:var(--c-data);
  border:1px solid var(--pc-edge);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%);
}
.page-contact .route-panel__map{
  padding:24px;
  border-bottom:var(--hair);
}
.page-contact .route-map{
  display:block;
  width:100%;
  height:auto;
}
.page-contact .route-map__ghost{
  fill:none;
  stroke:rgba(46,111,99,.55);
  stroke-width:1;
  stroke-dasharray:5 6;
}
.page-contact .route-map__line{
  fill:none;
  stroke:var(--c-mint);
  stroke-width:2;
  stroke-linecap:square;
}
.page-contact .route-map__node{
  fill:var(--c-deep);
  stroke:var(--c-mint);
  stroke-width:2;
}
.page-contact .route-map__node--hot{
  fill:var(--c-orange);
  stroke:var(--c-amber);
}
.page-contact .route-map__label{
  fill:var(--c-sage);
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.06em;
}
.page-contact .route-panel__legend{
  padding:24px;
}
.page-contact .route-panel__legend-title{
  font-size:12px;
  letter-spacing:.14em;
  color:var(--c-mint);
  margin-bottom:16px;
  text-transform:uppercase;
}
.page-contact .route-panel__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-contact .route-panel__list li{
  display:flex;
  gap:12px;
  align-items:baseline;
  font-size:14.5px;
  line-height:1.7;
  color:var(--c-sage);
}
.page-contact .route-panel__list .mono{
  color:var(--c-amber);
  font-size:12.5px;
  flex:none;
}

/* ---------- cooperation ---------- */
.page-contact .coop-list{
  display:grid;
  gap:14px;
}
.page-contact .coop{
  background:linear-gradient(140deg,rgba(11,22,38,.92),rgba(8,42,36,.86));
  border:1px solid var(--pc-edge);
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%);
}
.page-contact .coop[open]{
  border-color:rgba(19,242,200,.55);
}
.page-contact .coop__head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  padding:20px 22px;
  cursor:pointer;
  list-style:none;
}
.page-contact .coop__head::-webkit-details-marker{
  display:none;
}
.page-contact .coop__head:focus-visible{
  outline:2px solid var(--c-mint);
  outline-offset:-2px;
}
.page-contact .coop__idx{
  font-size:12px;
  letter-spacing:.14em;
  color:var(--c-orange);
  flex:none;
}
.page-contact .coop__name{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.2rem;
  letter-spacing:.02em;
  color:var(--c-ice);
}
.page-contact .coop__toggle{
  margin-left:auto;
  width:14px;
  height:14px;
  position:relative;
  flex:none;
}
.page-contact .coop__toggle::before,
.page-contact .coop__toggle::after{
  content:"";
  position:absolute;
  background:var(--c-mint);
  transition:transform .22s var(--ease),opacity .22s var(--ease);
}
.page-contact .coop__toggle::before{
  left:0;
  top:6px;
  width:14px;
  height:2px;
}
.page-contact .coop__toggle::after{
  left:6px;
  top:0;
  width:2px;
  height:14px;
}
.page-contact .coop[open] .coop__toggle::after{
  transform:rotate(90deg);
  opacity:0;
}
.page-contact .coop__body{
  padding:0 22px 24px;
  border-top:1px dashed rgba(46,111,99,.5);
  margin-top:0;
}
.page-contact .coop__dl{
  margin:0;
  display:grid;
  gap:6px;
}
.page-contact .coop__dl dt{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--c-mint);
  margin-top:16px;
}
.page-contact .coop__dl dd{
  margin:0;
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.82;
}

/* ---------- flow ---------- */
.page-contact .flow{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:26px;
  counter-reset:none;
}
.page-contact .flow__step{
  position:relative;
  padding-top:20px;
  border-top:1px solid var(--pc-edge);
}
.page-contact .flow__step::before{
  content:"";
  position:absolute;
  top:-5px;
  left:0;
  width:9px;
  height:9px;
  background:var(--c-mint);
  transform:rotate(45deg);
}
.page-contact .flow__num{
  font-size:12.5px;
  letter-spacing:.16em;
  color:var(--c-orange);
  margin-bottom:10px;
}
.page-contact .flow__title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.15rem;
  letter-spacing:.02em;
  color:var(--c-ice);
  margin-bottom:10px;
}
.page-contact .flow__text{
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.82;
}

/* ---------- hours ---------- */
.page-contact .hours-inner{
  display:grid;
  gap:clamp(28px,4vw,52px);
  align-items:center;
}
.page-contact .hours-text{
  color:var(--c-sage);
  font-size:15px;
  line-height:1.9;
  margin-bottom:14px;
  max-width:62ch;
}
.page-contact .hours-list{
  list-style:none;
  margin:22px 0 0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-contact .hours-list li{
  display:grid;
  gap:4px;
  padding-left:16px;
  position:relative;
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.75;
}
.page-contact .hours-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  width:6px;
  height:6px;
  background:var(--c-mint);
  transform:rotate(45deg);
}
.page-contact .hours-list .mono{
  color:var(--c-amber);
  font-size:12.5px;
  letter-spacing:.1em;
}
.page-contact .hours-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}
.page-contact .hours-visual{
  margin:0;
}
.page-contact .hours-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1/1;
  object-fit:cover;
  border:1px solid var(--pc-edge);
  clip-path:polygon(24px 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%,0 24px);
  filter:saturate(.9);
}
.page-contact .hours-visual .media-caption{
  display:block;
  margin-top:12px;
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--c-line);
}

/* ---------- visit ---------- */
.page-contact .visit-panel{
  background:linear-gradient(155deg,#0B1626 0%,#082A24 100%);
  border:1px solid var(--pc-edge);
  padding:clamp(24px,4vw,44px);
  clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));
}
.page-contact .visit-panel .section-title{
  max-width:22ch;
}
.page-contact .visit-panel__grid{
  display:grid;
  gap:22px;
  margin-top:canstant;
  margin-top:clamp(20px,3vw,36px);
}
.page-contact .visit-panel__block{
  padding-top:18px;
  border-top:1px solid rgba(46,111,99,.55);
}
.page-contact .visit-panel__block--signal{
  background:rgba(255,107,26,.08);
  border-top-color:rgba(255,107,26,.55);
  padding:18px 18px 22px;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);
}
.page-contact .visit-panel__label{
  font-size:11.5px;
  letter-spacing:.16em;
  color:var(--c-mint);
  margin-bottom:12px;
}
.page-contact .visit-panel__block--signal .visit-panel__label{
  color:var(--c-amber);
}
.page-contact .visit-panel__address{
  font-family:var(--font-mono);
  font-size:15px;
  line-height:1.7;
  color:var(--c-ice);
  margin-bottom:12px;
}
.page-contact .visit-panel__hint{
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.8;
}
.page-contact .visit-panel__block--signal .btn{
  margin-top:16px;
}
.page-contact .visit-panel__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-contact .visit-panel__list li{
  position:relative;
  padding-left:16px;
  color:var(--c-sage);
  font-size:14.5px;
  line-height:1.75;
}
.page-contact .visit-panel__list li::before{
  content:"—";
  position:absolute;
  left:0;
  color:var(--c-mint);
}

/* ---------- related links ---------- */
.page-contact .pc-links{
  margin-top:clamp(28px,4vw,48px);
  padding-top:22px;
  border-top:var(--hair);
}
.page-contact .pc-links__title{
  font-size:11.5px;
  letter-spacing:.18em;
  color:var(--c-line);
  margin-bottom:16px;
}
.page-contact .pc-links ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-contact .pc-links a{
  display:inline-block;
  color:var(--c-mist);
  text-decoration:none;
  font-size:14.5px;
  padding-bottom:3px;
  border-bottom:1px solid rgba(19,242,200,.28);
  transition:color .2s var(--ease),border-color .2s var(--ease);
}
.page-contact .pc-links a:hover,
.page-contact .pc-links a:focus-visible{
  color:var(--c-mint);
  border-bottom-color:var(--c-mint);
}

@media (min-width:720px){
  .page-contact .channel-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-contact .channel-note{
    grid-template-columns:1fr auto;
    align-items:center;
  }
  .page-contact .route-panel{
    grid-template-columns:1.5fr 1fr;
  }
  .page-contact .route-panel__map{
    border-bottom:0;
    border-right:var(--hair);
    display:flex;
    align-items:center;
  }
  .page-contact .flow{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:32px 28px;
  }
  .page-contact .visit-panel__grid{
    grid-template-columns:1.1fr 1fr;
  }
  .page-contact .visit-panel__block--signal{
    grid-column:1 / -1;
  }
  .page-contact .pc-links ul{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (min-width:960px){
  .page-contact .contact-hero__inner{
    grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
    align-items:center;
  }
  .page-contact .hours-inner{
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  }
  .page-contact .flow{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-contact .visit-panel__grid{
    grid-template-columns:1.1fr 1fr .9fr;
  }
  .page-contact .visit-panel__block--signal{
    grid-column:auto;
  }
}

@media (min-width:1200px){
  .page-contact .coop-list{
    gap:18px;
  }
  .page-contact .coop:nth-child(even){
    margin-left:clamp(0px,3vw,48px);
  }
  .page-contact .coop:nth-child(odd){
    margin-right:clamp(0px,3vw,48px);
  }
}

@media (prefers-reduced-motion:reduce){
  .page-contact .channel-card,
  .page-contact .coop__toggle::before,
  .page-contact .coop__toggle::after,
  .page-contact .pc-links a{
    transition:none;
  }
  .page-contact .channel-card:hover{
    transform:none;
  }
}
<<<END>>>