/* 페이지 전용 기본 (공통 변수 없을 경우 대비) */
:root{
  --border:#e6e6e9;
  --muted:#58606b;
  --text:#111;
  --bg:#fff;
}

/* 헤더/소개/스택/내지 공통 간격 */
.head{ width:min(1000px,94%); margin:16px auto 0; }
.title{ margin:6px 0 2px; font-size:26px; font-weight:800; }
.meta{ margin:0; color:var(--muted); }
.price{ margin:6px 0 12px; font-weight:800; }

.blurb{ width:min(1000px,94%); margin:18px auto 12px; padding:24px 12px; }
.blurb .text{ max-width:720px; margin:0 auto; text-align:center; line-height:1.45; font-size:15px; color:#222; }
.blurb .text p{ margin:10px 0; }
@media (max-width:640px){ .blurb .text{ font-size:13px; } }

/* 가로형 미디어 한 장 */
.wide-stack{ width:min(1000px,94%); margin:8px auto 20px; }
.stack-item{ margin:0; }
.stack-media{ display:block; width:100%; height:auto; }

/* 내지 탭 이미지 */
.inside-tap{ width:min(1000px,94%); margin:0 auto; }
#insideTap{ display:block; width:100%; height:auto; cursor:pointer; }
.inside-caption{ width:min(1000px,94%); margin:8px auto 28px; text-align:center; color:#333; }

/* 주문 섹션 컨테이너 */
.order{ width:min(1000px,94%); margin:24px auto 40px; padding:16px; border-top:1px solid var(--border); }
.order h2{ margin:0 0 10px; font-size:20px; }
.order .note{ margin:0 0 12px; color:var(--muted); }
.form{ display:grid; gap:12px; }
.row{ display:grid; gap:12px; grid-template-columns:1fr 1fr; }
@media (max-width:640px){ .row{ grid-template-columns:1fr; } }
input,select,textarea{ width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:10px; font:inherit; background:#fff; }
textarea{ min-height:90px; resize:vertical; }
.helper{ color:var(--muted); font-size:13px; }

/* 총액 박스 */
.total{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px; border:1px dashed var(--border); border-radius:10px; background:#fafafa; font-weight:700;
}

/* 버튼 */
.btn{ appearance:none; border:none; border-radius:12px; padding:12px 16px; background:#111; color:#fff; font-weight:800; cursor:pointer; }
.btn:active{ transform:translateY(1px); }

/* ===== iOS 안전 커스텀 배송 카드 UI ===== */
.ship-group{
  display:grid;
  gap:12px;
  padding-top:6px;
}
@media (min-width:900px){
  .ship-group{ grid-template-columns:1fr 1fr; }
}

.ship-card{
  position:relative;
  display:grid;
  grid-template-columns:22px 1fr auto; /* 동그라미 | 텍스트 | 가격 */
  align-items:center;
  gap:12px;
  width:100%;
  min-height:56px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff;
  color:#111;
  -webkit-tap-highlight-color: transparent;
}

/* 실제 라디오(전체 카드 클릭 영역) */
.ship-card .ship-radio{
  position:absolute;
  inset:0;               /* 카드 전체를 클릭영역으로 */
  opacity:0;
  pointer-events:auto;
}

/* 커스텀 동그라미 */
.ship-card .ship-radio-ui{
  width:18px; height:18px;
  border:2px solid #111;
  border-radius:50%;
  box-sizing:border-box;
  display:inline-block;
  pointer-events:none;
  position:relative;
}
.ship-card .ship-radio-ui::after{
  content:"";
  position:absolute;
  left:50%; top:50%;
  width:10px; height:10px;
  margin:-5px 0 0 -5px;
  border-radius:50%;
  background:#111;
  opacity:0;
  transition:opacity .12s ease;
}
/* 체크되면 안쪽 점 표시 */
.ship-card .ship-radio:checked + .ship-radio-ui::after{ opacity:1; }

/* 포커스 표시(iOS도 보이게) */
.ship-card .ship-radio:focus-visible + .ship-radio-ui{
  box-shadow:0 0 0 3px rgba(0,0,0,.15) inset;
}

/* 텍스트/가격 */
.ship-card .ship-text,
.ship-card .ship-price{ font-weight:700; line-height:1.3; color:#111; }
.ship-card .ship-text{
  min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ship-card .ship-price{ margin-left:8px; }
@media (max-width:420px){
  .ship-card .ship-text, .ship-card .ship-price{ font-size:14px; }
}

/* 모달(공통 스타일 없을 때 최소 보장) */
.modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.4); padding:16px; z-index:50; }
.modal-card{ width:min(560px,100%); background:#fff; border:1px solid var(--border); border-radius:12px; padding:16px; }
.modal-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.modal-head h3{ margin:0; font-size:18px; }
.x{ border:none; background:transparent; font-size:20px; cursor:pointer; }
.dl{ display:grid; grid-template-columns:110px 1fr; gap:8px; margin:0 0 12px; }
.dl dt{ color:var(--muted); }

/* 떠 있는 미니 비디오 */
.mini-float{ position:fixed; right:24px; bottom:24px; z-index:9999; width:220px; border:1px solid var(--border); border-radius:0; overflow:hidden; background:#000; box-shadow:0 6px 30px rgba(0,0,0,.08); }
.mini-float .mini-video{ display:block; width:100%; height:auto; }
@media (max-width:640px){ .mini-float{ right:12px; bottom:12px; width:150px; } }
.project{
  --bg:#fff;
  --text:#111;
  --muted:#58606b;
  --border:#e6e6e9;
  --accent:#111;
  background:var(--bg);
  color:var(--text);
  font:13px/1.65 system-ui,-apple-system,Segoe UI,Roboto,'Noto Sans KR',sans-serif;
}

.project *, .project *::before, .project *::after{ box-sizing:border-box; }

/* 상단 바 */
.project .bar{
  position:sticky; top:0; z-index:10;
  padding:12px 16px;
  border-bottom:1px solid var(--border);
  background:#fff;
}
.project .bar a{ color:#111; text-decoration:none; font-weight:700; }