.page-contact{
  --pc-line: rgba(192,199,209,.32);
  --pc-line-strong: rgba(192,199,209,.65);
  --pc-accent: #F97316;
  --pc-soft: #93C5FD;
  --pc-deep: #0A1428;
  --pc-deep-2: #0E2A47;
  --pc-card-bg: rgba(14,42,71,.5);
  --pc-paper: #F5F7FA;
  --pc-ink: #0F172A;
  background: var(--pc-deep);
  overflow-x: clip;
}

.page-contact .contact-hero{
  padding: clamp(2.5rem,6vw,5rem) 0;
  background:
    radial-gradient(ellipse 55% 50% at 85% 18%,rgba(37,99,235,.18),transparent 72%),
    linear-gradient(165deg,var(--pc-deep) 0%,var(--pc-deep-2) 100%);
  border-bottom: 1px solid var(--pc-line);
}

.page-contact .breadcrumb{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-bottom: clamp(2.5rem,6vw,4.5rem);
  font-family: var(--font-mono);
  font-size: .8125rem;
  color: var(--pc-soft);
}

.page-contact .breadcrumb a{
  color: var(--pc-soft);
  text-decoration: none;
  transition: color var(--duration) var(--ease-out);
}

.page-contact .breadcrumb a:hover{
  color: var(--pc-accent);
}

.page-contact .contact-hero__layout{
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}

.page-contact .contact-hero__main{
  max-width: 64ch;
}

.page-contact .contact-hero__main h1{
  margin: .75rem 0 1.5rem;
}

.page-contact .contact-hero__lead{
  color: var(--pc-soft);
  font-size: clamp(1rem,1.2vw,1.25rem);
  line-height: 1.85;
  max-width: 56ch;
}

.page-contact .contact-hero__side{
  position: relative;
  border-left: 1px solid var(--pc-line-strong);
  padding-left: clamp(1rem,2vw,1.5rem);
  font-family: var(--font-mono);
  font-size: .8125rem;
  color: var(--metallic-silver);
  line-height: 1.8;
  max-width: 26ch;
}

.page-contact .contact-hero__side::before{
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  width: 3px;
  height: 2.25rem;
  background: var(--pc-accent);
}

.page-contact .contact-hero__code{
  color: var(--pc-accent);
  letter-spacing: .08em;
  margin-bottom: .5rem;
}

.page-contact .contact-channels{
  padding: clamp(3rem,7vw,5.5rem) 0;
  background:
    radial-gradient(ellipse 70% 40% at 10% 90%,rgba(37,99,235,.08),transparent 70%),
    var(--pc-deep);
}

.page-contact .contact-channels .section-head{
  margin-bottom: 2.5rem;
}

.page-contact .contact-channels__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 2rem;
}

.page-contact .contact-card{
  display: flex;
  flex-direction: column;
  gap: .625rem;
  padding: clamp(1.5rem,3vw,2rem);
  border: 1px solid var(--pc-line);
  background: var(--pc-card-bg);
  position: relative;
  transition: border-color var(--duration) var(--ease-out),background-color var(--duration) var(--ease-out);
}

.page-contact .contact-card::before{
  content: "";
  position: absolute;
  top: -1px;
  left: 1.5rem;
  width: 2.25rem;
  height: 2px;
  background: var(--pc-accent);
}

.page-contact .contact-card:hover{
  border-color: rgba(249,115,22,.75);
  background: rgba(14,42,71,.72);
}

.page-contact .contact-card__icon{
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--pc-line);
  color: var(--pc-soft);
  margin-bottom: .5rem;
}

.page-contact .contact-card__icon svg{
  width: 1.25rem;
  height: 1.25rem;
}

.page-contact .contact-card__label{
  font-family: var(--font-mono);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--metallic-silver);
}

.page-contact .contact-card__value{
  font-weight: 700;
  font-size: clamp(1rem,1.5vw,1.35rem);
  color: var(--paper-white);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.page-contact .contact-card__note{
  font-size: .875rem;
  color: var(--pc-soft);
  line-height: 1.6;
}

.page-contact .contact-channels__visual{
  position: relative;
  margin: 0;
}

.page-contact .contact-channels__visual::after{
  content: "CONTACT CHANNELS";
  position: absolute;
  top: 1rem;
  left: 1rem;
  padding: .4rem .65rem;
  background: rgba(10,20,40,.82);
  border: 1px solid var(--pc-line);
  color: var(--metallic-silver);
  font-family: var(--font-mono);
  font-size: .6875rem;
  letter-spacing: .12em;
  pointer-events: none;
}

.page-contact .contact-channels__visual img{
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--pc-line);
  background: var(--pc-card-bg);
}

.page-contact .contact-service{
  background: var(--pc-paper);
  color: var(--pc-ink);
  padding: clamp(3rem,7vw,5.5rem) 0;
}

.page-contact .contact-service .section-title{
  color: var(--pc-ink);
}

.page-contact .contact-service .section-intro{
  color: #475569;
}

.page-contact .contact-service__time{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .5rem;
  margin: 3rem 0 2.5rem;
  padding: clamp(1.5rem,4vw,2.5rem);
  border: 1px solid rgba(192,199,209,.7);
  background:
    repeating-linear-gradient(90deg,transparent,transparent 36px,rgba(192,199,209,.28) 36px,rgba(192,199,209,.28) 37px),
    #fff;
  position: relative;
}

.page-contact .contact-service__time::before{
  content: "";
  position: absolute;
  left: 0;
  top: 24px;
  bottom: 24px;
  width: 3px;
  background: var(--pc-accent);
}

.page-contact .contact-service__hours{
  font-family: var(--font-sans);
  font-weight: 900;
  font-size: clamp(2rem,6vw,3.75rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--pc-deep);
}

.page-contact .contact-service__days{
  font-family: var(--font-mono);
  font-size: .875rem;
  color: #475569;
  letter-spacing: .06em;
}

.page-contact .contact-service__groups{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: .75rem;
  margin-bottom: 2rem;
}

.page-contact .contact-service__group{
  display: flex;
  align-items: center;
  gap: .875rem;
  padding: 1rem 1.25rem;
  border: 1px solid rgba(192,199,209,.8);
  background: #fff;
  color: var(--pc-ink);
}

.page-contact .contact-service__group-num{
  font-family: var(--font-mono);
  font-size: .8125rem;
  color: var(--pc-accent);
}

.page-contact .contact-service__group-name{
  font-weight: 700;
  font-size: .9rem;
}

.page-contact .contact-service__note{
  color: #475569;
  border-left: 2px solid var(--pc-accent);
  padding-left: 1rem;
}

.page-contact .contact-boundary{
  background: var(--pc-deep);
  padding: clamp(3rem,7vw,5.5rem) 0;
}

.page-contact .contact-boundary__list{
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-top: 3rem;
}

.page-contact .contact-boundary__item{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem 1.5rem;
  padding: 0 0 2rem;
  border-bottom: 1px solid var(--pc-line);
}

.page-contact .contact-boundary__item:last-child{
  border-bottom: 0;
  padding-bottom: 0;
}

.page-contact .contact-boundary__index{
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--pc-accent);
  line-height: 1.6;
}

.page-contact .contact-boundary__item h3{
  color: var(--paper-white);
  font-size: clamp(1.1rem,2vw,1.5rem);
  margin: 0 0 .5rem;
}

.page-contact .contact-boundary__item p{
  grid-column: 1 / -1;
  color: var(--pc-soft);
  line-height: 1.8;
  margin: 0;
}

.page-contact .contact-help{
  background: var(--pc-paper);
  color: var(--pc-ink);
  padding: clamp(3rem,7vw,5.5rem) 0;
}

.page-contact .contact-help .section-title{
  color: var(--pc-ink);
}

.page-contact .contact-help .section-intro{
  color: #475569;
}

.page-contact .contact-help__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: 2.5rem;
}

.page-contact .contact-help__card{
  display: flex;
  flex-direction: column;
  padding: 1.75rem 1.5rem;
  background: #fff;
  border: 1px solid rgba(192,199,209,.75);
  text-decoration: none;
  color: var(--pc-ink);
  transition: border-color var(--duration) var(--ease-out),box-shadow var(--duration) var(--ease-out),transform var(--duration) var(--ease-out);
}

.page-contact .contact-help__card:hover{
  border-color: var(--pc-accent);
  box-shadow: 0 8px 24px rgba(10,20,40,.08);
  transform: translateY(-2px);
}

.page-contact .contact-help__num{
  font-family: var(--font-mono);
  font-size: .8125rem;
  color: var(--pc-accent);
  margin-bottom: 1rem;
}

.page-contact .contact-help__card h3{
  font-size: 1.25rem;
  margin: 0 0 .75rem;
}

.page-contact .contact-help__card p{
  color: #475569;
  font-size: .9rem;
  line-height: 1.7;
  flex: 1;
  margin: 0 0 1.25rem;
}

.page-contact .contact-help__go{
  font-family: var(--font-mono);
  font-size: .8125rem;
  color: var(--pc-deep);
  font-weight: 700;
}

.page-contact .contact-help__meta{
  margin-top: 2.5rem;
  padding: 1.25rem 1.5rem;
  border-left: 3px solid var(--pc-accent);
  background: rgba(192,199,209,.2);
  color: #475569;
}

.page-contact .contact-location{
  background:
    radial-gradient(ellipse 60% 45% at 12% 15%,rgba(37,99,235,.13),transparent 72%),
    var(--pc-deep);
  padding: clamp(3rem,7vw,5rem) 0;
  border-top: 1px solid var(--pc-line);
}

.page-contact .contact-location__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
}

.page-contact .contact-location__content h2{
  color: var(--paper-white);
  font-size: clamp(1.375rem,3vw,2rem);
  margin: .75rem 0 1rem;
}

.page-contact .contact-location__content p{
  color: var(--pc-soft);
  line-height: 1.8;
  margin: 0 0 1.25rem;
  max-width: 60ch;
}

.page-contact .contact-location__icp{
  color: var(--metallic-silver);
}

.page-contact .contact-location__links{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-top: 1.5rem;
  font-size: .9rem;
}

.page-contact .contact-location__links a{
  color: var(--pc-soft);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--duration) var(--ease-out),color var(--duration) var(--ease-out);
}

.page-contact .contact-location__links a:hover{
  color: var(--pc-accent);
  border-color: var(--pc-accent);
}

.page-contact .contact-location__links span{
  color: var(--metallic-silver);
}

.page-contact .contact-location__map{
  position: relative;
  margin: 0;
}

.page-contact .contact-location__map::before{
  content: "";
  position: absolute;
  inset: 1.5rem -0.75rem -0.75rem 1.5rem;
  border: 1px solid var(--pc-line);
  z-index: 0;
  pointer-events: none;
}

.page-contact .contact-location__map img{
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--pc-line);
}

@media (min-width: 768px){
  .page-contact .contact-hero__layout{
    grid-template-columns: 1fr .55fr;
    align-items: start;
  }

  .page-contact .contact-channels__grid{
    grid-template-columns: repeat(3,1fr);
    gap: 1.25rem;
  }

  .page-contact .contact-service__groups{
    grid-template-columns: repeat(4,1fr);
  }

  .page-contact .contact-help__grid{
    grid-template-columns: repeat(3,1fr);
    gap: 1.25rem;
  }

  .page-contact .contact-location__grid{
    grid-template-columns: 1fr 1fr;
  }
}

@media (prefers-reduced-motion: reduce){
  .page-contact *,
  .page-contact *::before,
  .page-contact *::after{
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}