﻿/* 대문 — CVRF 세 학회 사전등록 진입 화면 (화면 시안 A안, 2026-09-18 확정).
   카드 세 장을 나란히 두고 접수 중인 학회만 살린다. 색 · 서체 · 컴포넌트는 Site.css 그대로 쓰고,
   여기에는 카드 배치에 필요한 것만 둔다 — 새 팔레트를 만들지 않는다.
   치수는 시안(13px 기준)을 본문 15px 기준으로 약 1.15배 옮긴 것이다. */

/* ── 헤더 로고 — 대문만 「CVRF Registration」을 건다 ── */
.site-logo.is-portal { letter-spacing: -.01em; }
.site-logo.is-portal .reg {
  margin-left: 9px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  vertical-align: 1px;
  color: var(--reg-teal);
}

/* ── 히어로 — 대문은 한 단 높게 (부제 한 줄이 붙는다) ── */
.hero.is-tall { padding: 40px 20px 38px; }
.hero-sub {
  margin: 8px 0 0;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--reg-teal);
}

/* ── 안내 한 줄 ── */
.portal-lead { margin: 0 0 27px; text-align: center; }
.portal-lead h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--reg-indigo);
  text-wrap: balance;
}
.portal-lead p { margin: 6px 0 0; font-size: 15px; color: var(--reg-text-2); }

/* ── 학회 카드 ── */
.conf-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.conf {
  display: flex;
  flex-direction: column;
  padding: 21px 20px 20px;
  background: #ffffff;
  border: 1px solid var(--reg-line);
  border-radius: 8px;
}
/* 접수 중인 학회를 살린다 — 나머지는 잠긴 버튼이라 누를 곳이 하나인 게 바로 보인다.
   오픈 예정(일정은 잡혔고 시작 전)은 그 사이 단계로, 흰 바탕은 지키되 테두리만 옅게 준다. */
.conf.is-open { border: 1.5px solid var(--reg-indigo); box-shadow: 0 2px 10px rgba(54, 49, 143, .08); }
.conf.is-upcoming { border: 1.5px solid #c8c4e4; }
.conf.is-off { background: #fafafa; }

.conf-top { display: flex; align-items: center; justify-content: space-between; gap: 9px; margin-bottom: 13px; }
.conf-year { font-size: 12.5px; font-weight: 700; letter-spacing: .14em; color: var(--reg-teal); }
.conf.is-off .conf-year { color: var(--reg-text-3); }

.conf-status {
  display: inline-flex;
  align-items: center;
  padding: 3px 11px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  white-space: nowrap;
}
.conf-status.is-on { color: #ffffff; background: var(--reg-teal); }
.conf-status.is-upcoming { color: var(--reg-indigo-deep); background: var(--reg-gold); }
.conf-status.is-soon { color: #8a6d22; background: #fdf9ee; border: 1px solid #f2e2b8; }
.conf-status.is-closed { color: #777777; background: #f0f0f0; border: 1px solid #e2e2e2; }

.conf h3 {
  margin: 0;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.01em;
  color: var(--reg-indigo-deep);
}
.conf.is-off h3 { color: #8b8b95; }
.conf h3 small {
  display: block;
  margin-top: 5px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--reg-text-2);
}

/* 행사 · 장소 · 사전등록 — 값이 없는 학회는 「추후 안내」로 흐리게 */
.conf-facts { margin: 15px 0 0; padding: 14px 0 0; border-top: 1px solid var(--reg-line-2); font-size: 13.5px; }
.conf-facts > div { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 9px; padding: 3px 0; }
.conf-facts dt { padding-top: 1px; font-size: 12.5px; font-weight: 600; color: var(--reg-text-3); }
.conf-facts dd { margin: 0; font-weight: 500; color: var(--reg-text); }
/* 날짜 묶음 안에서는 줄을 바꾸지 않는다 — "2027. 4." / "20(화)"처럼 끊기지 않게 */
.conf-facts dd span { white-space: nowrap; }
.conf-facts dd.is-tbd { font-weight: 400; color: var(--reg-text-3); }

.conf-cta { margin-top: auto; padding-top: 17px; }
/* 접수 중이 아닌 카드의 버튼 — 잠긴 모양이다. 등록 주소가 있으면 링크(a)로 그려 누르면 이동하고
   (2026-09-25 사용자 요청), 주소가 없는 학회(준비 중)만 모양뿐인 자리(span)로 남는다 */
.conf-cta .btn.is-locked {
  color: #a8a8a8;
  background: #f2f2f2;
  border: 1px solid var(--reg-line);
  cursor: default;
}
.conf-cta a.btn.is-locked { cursor: pointer; }
.conf-cta a.btn.is-locked:hover { color: #8b8b95; background: #ebebeb; }
.conf-url { margin: 10px 0 0; text-align: center; font-size: 12px; letter-spacing: .02em; color: var(--reg-text-3); }

/* ── 사무국 안내 ── */
.portal-foot {
  margin: 30px 0 0;
  padding: 15px 17px;
  text-align: center;
  font-size: 13.5px;
  line-height: 1.75;
  color: #2c6d70;
  background: #f2fbfb;
  border: 1px solid #d5e9e9;
  border-radius: 4px;
}
.portal-foot a { font-weight: 700; color: #2c6d70; text-underline-offset: 3px; }

@media (max-width: 767.98px) {
  .hero.is-tall { padding: 26px 16px 24px; }
  .hero-sub { font-size: 11.5px; letter-spacing: .12em; }
  .portal-lead { margin-bottom: 20px; }
  .portal-lead h2 { font-size: 18px; }
  .portal-lead p { font-size: 13.5px; }
  .conf-grid { grid-template-columns: 1fr; gap: 13px; }
  .conf { padding: 18px 17px 17px; }
  .conf h3 { font-size: 17px; }
  .portal-foot { margin-top: 20px; font-size: 12.5px; }
}
