/*
 * style-01-minimal.css — 01 Minimal Luxury
 * NOULE AI Brand OS
 *
 * 스펙: style-01-minimal-luxury-spec.md (모리 v1.0 · 2026-07-21)
 * 컨셉: 타이포그래피 + 여백만으로 말한다. 심볼·이미지·색 블록 없음.
 * 이름 52px 대형 세리프 + 이름 아래 ~75px 순수 여백.
 * 배경 #F5F1EB (오프화이트 크림 · 5스타일 중 가장 밝음)
 */

/* ── CSS 변수 ── */
.card--style-01 {
  --s01-bg:             #F5F1EB;
  --s01-text-primary:   #2E2620;
  --s01-text-secondary: #6B5F52;
  --s01-text-muted:     #7A6E62;
  --s01-text-label:     #8C7E6A;
  --s01-rule:           #D4CEC6;
  --s01-qr-dark:        #3A332C;

  --s01-padding-h:      32px;
  --s01-padding-top:    28px;
  --s01-padding-bottom: 26px;

  --s01-font-name:  'Noto Serif KR', 'Cormorant Garamond', Georgia, serif;
  --s01-font-label: 'Cormorant Garamond', serif;
  --s01-font-body:  'Pretendard Variable', Pretendard, 'Apple SD Gothic Neo', sans-serif;
}

/* ── 카드 본체 ── */
.card--style-01 {
  background-color: var(--s01-bg);
  border-radius: 0;
  font-family: var(--s01-font-body);
  position: relative; /* absolute 자식(연락처·QR) 기준점 */
}

/* 배경 레이어 숨김 */
.card--style-01 .card__bg,
.card--style-01 .card__bg-image,
.card--style-01 .card__overlay {
  display: none;
}

.card--style-01 .card__content {
  padding: 0;
  display: block;
}

/* ── 상단 콘텐츠 블록 ── */
.card--style-01 .s01-top-block {
  position: absolute;
  left: var(--s01-padding-h);
  right: var(--s01-padding-h);
  top: var(--s01-padding-top);
}

/* ── 브랜드 라벨 (7.5px 소형 대문자) ── */
.card--style-01 .s01-brand {
  font-family: var(--s01-font-label);
  font-size: 7.5px;
  font-weight: 400;
  letter-spacing: 0.22em;
  color: var(--s01-text-label);
  text-transform: uppercase;
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 가로 구분선 (28px 짧은 선) ── */
.card--style-01 .s01-rule {
  width: 28px;
  height: 1px;
  background: var(--s01-rule);
  margin-bottom: 16px;
}

/* ── 이름 — 카드의 주인공 (52px 대형 세리프) ── */
.card--style-01 .s01-name {
  font-family: var(--s01-font-name);
  font-size: 52px;
  font-weight: 300;
  letter-spacing: -0.02em;
  line-height: 1.0;
  color: var(--s01-text-primary);
  margin-bottom: 12px;
  word-break: keep-all;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── 직책 ── */
.card--style-01 .s01-position {
  font-family: var(--s01-font-body);
  font-size: 9.5px;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1.4;
  color: var(--s01-text-secondary);
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 브랜드 메시지 ── */
.card--style-01 .s01-message {
  font-family: var(--s01-font-body);
  font-size: 9px;
  font-weight: 300;
  letter-spacing: 0.02em;
  line-height: 1.6;
  color: var(--s01-text-muted);
  word-break: keep-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* ── 연락처 블록 — 하단 좌측 고정 ── */
.card--style-01 .s01-contact {
  position: absolute;
  left: var(--s01-padding-h);
  bottom: var(--s01-padding-bottom);
  right: 92px;
  font-family: var(--s01-font-body);
  font-size: 8px;
  font-weight: 300;
  letter-spacing: 0.03em;
  line-height: 1.72;
  color: var(--s01-text-secondary);
}

.card--style-01 .s01-contact-item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 배경 레이어 — 아주 은은한 AI 톤/질감 ── */
.card--style-01 .s01-bg-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.card--style-01 .s01-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  opacity: 0.55;   /* 은은하게 — 여백 해치지 않게 */
}

/* 콘텐츠는 배경 위 */
.card--style-01 .card__content {
  position: relative;
  z-index: 1;
}

/* ── QR — 기존 숨김 ── */
.card--style-01 .card__qr {
  display: none !important;
}

/* ── NOULE 유입 QR — 우하단 코너 고정 (02 패턴 동일) ── */
.card--style-01 .s01-noule-qr {
  position: absolute;
  right: 12px;
  bottom: 11px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  background: rgba(245, 241, 235, 0.88);
  padding: 2px 3px;
  border-radius: 1px;
}

.card--style-01 .s01-noule-qr .s01-qr-canvas {
  width: 42px;
  height: 42px;
  display: block;
  image-rendering: pixelated;
}

.card--style-01 .s01-noule-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.18;
}

.card--style-01 .s01-noule-make {
  font-family: var(--s01-font-body);
  font-size: 5.5px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #5E5348;
}

.card--style-01 .s01-noule-url {
  font-family: var(--s01-font-body);
  font-size: 4.5px;
  font-weight: 300;
  letter-spacing: 0.05em;
  color: #9A8E7E;
}