/* Contact page. */

.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
@media (max-width:940px){.contact-grid{grid-template-columns:1fr;gap:32px}}

/* ---------- reach-us route cards ---------- */
.route-list{display:grid;gap:14px;margin-top:var(--gap-md)}

.route-card{
  position:relative;overflow:hidden;display:grid;grid-template-columns:44px 1fr 22px;
  gap:16px;align-items:center;padding:18px 20px;text-decoration:none;
  border:1px solid rgba(255,255,255,.085);border-radius:var(--radius-md);
  background:rgba(5,3,10,.58);
  backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),
             background var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
}
.route-card:hover,.route-card:focus-visible{
  transform:translateY(-3px);border-color:var(--gold-line);
  background:rgba(14,6,26,.66);
  box-shadow:0 18px 40px -24px rgba(139,61,255,.5),var(--gold-glow-soft),inset 0 1px 0 rgba(255,255,255,.08);
  outline:none;
}

.route-card .rc-n{
  display:grid;place-items:center;width:44px;height:44px;border-radius:10px;
  font:600 13px var(--font-mono);color:#fff;
  background:linear-gradient(135deg,var(--gold-bright),var(--gold));
  box-shadow:var(--gold-glow-soft);
}
.route-card > span{position:relative;z-index:1}
.route-card .rc-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.route-card .rc-k{font:11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-bright)}
.route-card .rc-desc{font-size:13.5px;line-height:1.5;color:var(--text-on-light-dim)}
.route-card .rc-desc b{color:var(--text-on-light)}
.route-card .rc-go{font:16px var(--font-mono);color:var(--gold-bright);transition:transform var(--dur-fast) var(--ease)}
.route-card:hover .rc-go,.route-card:focus-visible .rc-go{transform:translate(3px,-3px)}

/* ---------- "loading" animations ---------- */
/* a progress bar fills across the bottom as each card reveals */
.route-card .rc-load{
  position:absolute;left:0;bottom:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--gold),var(--gold-bright));
  box-shadow:0 0 10px rgba(185,140,255,.7);
  transition:width 900ms var(--ease-soft) 200ms;
}
.route-card.is-visible .rc-load{width:100%}

/* a slow shimmer sweeps across once the card is in — signals a live channel */
.route-card::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 42%,rgba(185,140,255,.14) 50%,transparent 58%);
  transform:translateX(-120%);
}
.route-card.is-visible::after{animation:rc-shimmer 3.4s ease-in-out 900ms infinite}

@keyframes rc-shimmer{
  0%{transform:translateX(-120%)}
  55%,100%{transform:translateX(120%)}
}

@media (prefers-reduced-motion:reduce){
  .route-card .rc-load{transition:none;width:100%}
  .route-card::after{display:none}
  .route-card:hover{transform:none}
}

@media (max-width:420px){
  .route-card{grid-template-columns:36px 1fr 18px;gap:12px;padding:16px}
  .route-card .rc-n{width:36px;height:36px;border-radius:8px}
}

.response-note{margin-top:var(--gap-md)}

/* ---------- route-card icons ---------- */
/* Replaces the 01-04 numerals: each route now shows what it actually is. */
.route-card .rc-n{overflow:hidden;padding:0}
.route-card .rc-svg{width:22px;height:22px;fill:#fff;display:block}

.rc-n.is-telegram{background:linear-gradient(140deg,#3fa9dc,#1c7fb6);
  box-shadow:0 0 18px -4px rgba(63,169,220,.75)}

/* the trader's photo — background-image so a missing file falls back to the
   gradient tile rather than a broken-image icon */
.rc-n.is-photo{background:linear-gradient(140deg,var(--gold-bright),var(--gold))}
.rc-n.is-photo .rc-photo{display:block;width:100%;height:100%;
  background:url('../images/trader.jpg') center/cover no-repeat}

.rc-n.is-form{background:linear-gradient(140deg,var(--gold-bright),var(--gold))}

.rc-n.is-broker{background:#e0552b;box-shadow:0 0 18px -5px rgba(224,85,43,.8)}
.rc-n.is-broker img{width:100%;height:100%;display:block}