/* Contact page — light section below dark page-header */
.cc-contact-main {
  --cc-surface: #FFFFFF;
  --cc-panel: #FFFFFF;
  --cc-muted: #9B9890;
  --cc-muted-2: #C8C7C2;
  --cc-ink: #1A1916;
  --cc-ink-m: #5C5B57;
  --cc-ink-l: #3D3C39;
  --cc-rule: #E0DFDA;
  --cc-off: #FFFFFF;
  --cc-accent: #1B4FD8;
  --cc-blue: #7B9FEA;
  --cc-gold: #C9A84C;
  --cc-gold-dim: rgba(201, 168, 76, 0.12);
  --cc-blue-dim: rgba(27, 79, 216, 0.08);
  font-family: 'DM Sans', sans-serif;
  font-weight: 300;
  background: var(--cc-surface);
  color: var(--cc-ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

@keyframes cc-cd-fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
@keyframes cc-cd-spin {
  to { transform: rotate(360deg); }
}
@keyframes cc-cd-checkPop {
  0% { transform: scale(0); }
  60% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

.cc-contact-main *,
.cc-contact-main *::before,
.cc-contact-main *::after {
  box-sizing: border-box;
}

.cc-contact-main .page {
  padding-top: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--cc-surface);
  width: 100%;
  max-width: var(--container-max, 1280px);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.cc-contact-main .left {
  padding: 56px 48px 64px 48px;
  border-right: 1px solid var(--cc-rule);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--cc-surface);
}

.cc-contact-main .l-inner { position: relative; z-index: 1; }

.cc-contact-main .inq-types {
  display: flex;
  flex-direction: column;
  gap: 0;
  opacity: 0;
  animation: cc-cd-fadeUp 0.6s 0.12s forwards;
}
.cc-contact-main .inq-t {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid var(--cc-rule);
  border-bottom: none;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  position: relative;
  background: var(--cc-panel);
}
.cc-contact-main .inq-t:last-child { border-bottom: 1px solid var(--cc-rule); }
.cc-contact-main .inq-t::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: transparent;
  transition: background 0.2s;
}
.cc-contact-main .inq-t:hover { background: #FFFFFF; }
.cc-contact-main .inq-t.on {
  background: var(--cc-blue-dim);
  border-color: rgba(27, 79, 216, 0.22);
}
.cc-contact-main .inq-t.on::before { background: var(--cc-accent); }
.cc-contact-main .inq-t.on-gold {
  background: var(--cc-gold-dim);
  border-color: rgba(201, 168, 76, 0.35);
}
.cc-contact-main .inq-t.on-gold::before { background: var(--cc-gold); }
.cc-contact-main .inq-ico {
  width: 36px;
  height: 36px;
  border: 1px solid var(--cc-rule);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
  transition: border-color 0.2s;
  color: var(--cc-muted);
  background: var(--cc-surface);
}
.cc-contact-main .inq-t.on .inq-ico { border-color: rgba(27, 79, 216, 0.35); color: var(--cc-accent); }
.cc-contact-main .inq-t.on-gold .inq-ico { border-color: rgba(201, 168, 76, 0.45); color: #9A7B2E; }
.cc-contact-main .inq-body { flex: 1; }
.cc-contact-main .inq-title {
  font-size: 14px;
  font-weight: 500;
  color: var(--cc-ink-l);
  margin-bottom: 3px;
  transition: color 0.15s;
}
.cc-contact-main .inq-t.on .inq-title,
.cc-contact-main .inq-t.on-gold .inq-title { color: var(--cc-ink); }
.cc-contact-main .inq-sub {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  color: var(--cc-muted);
  letter-spacing: 0.06em;
}
.cc-contact-main .inq-arr {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: var(--cc-muted-2);
  transition: color 0.2s, transform 0.2s;
}
.cc-contact-main .inq-t.on .inq-arr { color: var(--cc-accent); transform: translateX(3px); }
.cc-contact-main .inq-t.on-gold .inq-arr { color: #9A7B2E; transform: translateX(3px); }

.cc-contact-main .l-info {
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--cc-rule);
  display: flex;
  flex-direction: column;
  gap: 10px;
  opacity: 0;
  animation: cc-cd-fadeUp 0.6s 0.28s forwards;
}
.cc-contact-main .li-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12.5px;
  gap: 12px;
}
.cc-contact-main .li-k {
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cc-muted);
  flex-shrink: 0;
}
.cc-contact-main .li-v { font-weight: 400; color: var(--cc-ink-m); text-align: right; }
.cc-contact-main .li-v a { color: var(--cc-accent); text-decoration: none; }
.cc-contact-main .li-v a:hover { text-decoration: underline; }
.cc-contact-main .l-trust {
  margin-top: 16px;
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  color: var(--cc-muted);
  line-height: 1.65;
  letter-spacing: 0.04em;
  opacity: 0;
  animation: cc-cd-fadeUp 0.6s 0.36s forwards;
}

.cc-contact-main .right {
  padding: 56px 48px 64px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  background: var(--cc-surface);
}
.cc-contact-main .form-shell { opacity: 0; animation: cc-cd-fadeUp 0.7s 0.18s forwards; }

.cc-contact-main .fc {
  background: var(--cc-panel);
  border: 1px solid var(--cc-rule);
  position: relative;
  overflow: hidden;
}
.cc-contact-main .fc-hdr {
  padding: 13px 22px;
  border-bottom: 1px solid var(--cc-rule);
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background 0.3s, border-color 0.3s;
}
.cc-contact-main .fc-hdr.blue {
  background: #EEF2FD;
  border-color: rgba(27, 79, 216, 0.15);
}
.cc-contact-main .fc-hdr.gold {
  background: #FAF6EB;
  border-color: rgba(201, 168, 76, 0.25);
}
.cc-contact-main .fc-hdr.grey {
  background: #FFFFFF;
  border-color: var(--cc-rule);
}
.cc-contact-main .fc-hdr-t {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: color 0.3s;
}
.cc-contact-main .fc-hdr.blue .fc-hdr-t { color: var(--cc-accent); }
.cc-contact-main .fc-hdr.gold .fc-hdr-t { color: #8A7030; }
.cc-contact-main .fc-hdr.grey .fc-hdr-t { color: var(--cc-muted); }
.cc-contact-main .fc-hdr-ref {
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  color: var(--cc-muted);
}

.cc-contact-main .fc-body { padding: 22px; }
.cc-contact-main .ff-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.cc-contact-main .ff-full { margin-bottom: 14px; }
.cc-contact-main .ff { display: flex; flex-direction: column; gap: 5px; }
.cc-contact-main .fl {
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cc-muted);
}
.cc-contact-main .fi {
  font-family: 'DM Sans', sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  color: var(--cc-ink);
  background: var(--cc-surface);
  border: 1px solid var(--cc-rule);
  padding: 11px 14px;
  outline: none;
  transition: border-color 0.15s, background 0.15s;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  width: 100%;
}
.cc-contact-main .fi::placeholder { color: #B8B6B0; }
.cc-contact-main .fi option { background: var(--cc-panel); color: var(--cc-ink); }
.cc-contact-main .fi.focus-blue:focus {
  border-color: rgba(27, 79, 216, 0.45);
  background: #FFFFFF;
}
.cc-contact-main .fi.focus-gold:focus {
  border-color: rgba(201, 168, 76, 0.5);
  background: #FFFFFF;
}
.cc-contact-main .fi.focus-grey:focus {
  border-color: var(--cc-ink-l);
  background: #FFFFFF;
}
.cc-contact-main .fta {
  font-family: 'DM Sans', sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  color: var(--cc-ink);
  background: var(--cc-surface);
  border: 1px solid var(--cc-rule);
  padding: 11px 14px;
  outline: none;
  width: 100%;
  min-height: 90px;
  resize: vertical;
  line-height: 1.65;
  -webkit-appearance: none;
  border-radius: 0;
  transition: border-color 0.15s, background 0.15s;
}
.cc-contact-main .fta::placeholder { color: #B8B6B0; }
.cc-contact-main .fta.focus-blue:focus { border-color: rgba(27, 79, 216, 0.45); background: #FFFFFF; }
.cc-contact-main .fta.focus-gold:focus { border-color: rgba(201, 168, 76, 0.5); background: #FFFFFF; }
.cc-contact-main .fta.focus-grey:focus { border-color: var(--cc-ink-l); background: #FFFFFF; }

.cc-contact-main .submit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 6px;
}
.cc-contact-main .submit-note {
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  color: var(--cc-muted);
  line-height: 1.6;
}
.cc-contact-main .btn-sub {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border: none;
  padding: 12px 24px;
  cursor: pointer;
  transition: opacity 0.15s, background 0.2s;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.cc-contact-main .btn-sub.blue { color: #FAFAF8; background: var(--cc-accent); }
.cc-contact-main .btn-sub.blue:hover { opacity: 0.92; }
.cc-contact-main .btn-sub.gold { color: #1A1916; background: var(--cc-gold); }
.cc-contact-main .btn-sub.grey { color: var(--cc-ink); background: var(--cc-rule); }
.cc-contact-main .btn-sub.grey:hover { opacity: 0.88; }
.cc-contact-main .btn-sub:disabled { opacity: 0.5; cursor: not-allowed; }
.cc-contact-main .spinner {
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #FAFAF8;
  border-radius: 50%;
  animation: cc-cd-spin 0.7s linear infinite;
  display: none;
}
.cc-contact-main .btn-sub.gold .spinner,
.cc-contact-main .btn-sub.grey .spinner {
  border: 2px solid rgba(26, 25, 22, 0.15);
  border-top-color: var(--cc-ink);
}
.cc-contact-main .btn-sub.loading .btn-text { display: none; }
.cc-contact-main .btn-sub.loading .spinner { display: block; }

.cc-contact-main .success-view {
  display: none;
  padding: 48px 32px;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}
.cc-contact-main .success-view.vis { display: flex; }
.cc-contact-main .sv-check {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 8px;
  animation: cc-cd-checkPop 0.4s 0.1s ease both;
}
.cc-contact-main .sv-check.blue {
  background: #EEF2FD;
  border: 1px solid rgba(27, 79, 216, 0.25);
  color: var(--cc-accent);
}
.cc-contact-main .sv-check.gold {
  background: var(--cc-gold-dim);
  border: 1px solid rgba(201, 168, 76, 0.35);
  color: #8A7030;
}
.cc-contact-main .sv-check.grey {
  background: #FFFFFF;
  border: 1px solid var(--cc-rule);
  color: var(--cc-muted);
}
.cc-contact-main .sv-title {
  font-family: 'Instrument Serif', serif;
  font-size: 28px;
  font-weight: 400;
  color: var(--cc-ink);
}
.cc-contact-main .sv-sub {
  font-size: 14px;
  font-weight: 300;
  color: var(--cc-ink-m);
  line-height: 1.75;
  max-width: 340px;
}
.cc-contact-main .sv-ref {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  color: var(--cc-muted);
  letter-spacing: 0.1em;
}
.cc-contact-main .sv-reset {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cc-muted);
  background: transparent;
  border: 1px solid var(--cc-rule);
  padding: 9px 18px;
  cursor: pointer;
  transition: all 0.15s;
  margin-top: 8px;
}
.cc-contact-main .sv-reset:hover {
  color: var(--cc-ink);
  border-color: var(--cc-ink-l);
}

.cc-contact-main .contact-strip {
  border-top: 1px solid var(--cc-rule);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  background: var(--off-white);
  width: 100%;
  max-width: var(--container-max, 1280px);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
.cc-contact-main .cs {
  padding: 28px 32px;
  border-right: 1px solid var(--cc-rule);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cc-contact-main .cs:last-child { border-right: none; }
.cc-contact-main .cs-l {
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cc-muted);
}
.cc-contact-main .cs-v { font-size: 13px; font-weight: 400; color: var(--cc-ink-m); }
.cc-contact-main .cs-v a { color: var(--cc-accent); text-decoration: none; }
.cc-contact-main .cs-v a:hover { text-decoration: underline; }
.cc-contact-main .cs-v.gold a { color: #8A7030; }
.cc-contact-main .cs-note {
  font-family: 'DM Mono', monospace;
  font-size: 8.5px;
  color: var(--cc-muted);
  line-height: 1.55;
  margin-top: 2px;
}

.cc-contact-main .cc-contact-form-error {
  font-size: 13px;
  color: #8B2E2E;
  margin-bottom: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(192, 57, 43, 0.25);
  background: rgba(192, 57, 43, 0.06);
}

@media (max-width: 900px) {
  .cc-contact-main .page { grid-template-columns: 1fr; }
  .cc-contact-main .left {
    border-right: none;
    border-bottom: 1px solid var(--cc-rule);
    padding: 48px 22px 40px;
  }
  .cc-contact-main .right { padding: 40px 22px 48px; }
  .cc-contact-main .contact-strip { grid-template-columns: 1fr; }
  .cc-contact-main .cs {
    border-right: none;
    border-bottom: 1px solid var(--cc-rule);
  }
  .cc-contact-main .cs:last-child { border-bottom: none; }
}

@media (max-width: 520px) {
  .cc-contact-main .ff-grid { grid-template-columns: 1fr; }
}
