/* geo-landing 디자인 토큰 v1.1 — 색·글자·간격은 이 파일 한 곳에서만 정한다.
   색은 블루 하나와 무채색뿐이다(녹색·앰버·레드·따뜻한 흰색 없음). 판정은 색이 아니라 표식 모양과 굵기로 가른다.
   글자 크기는 애플코리아 제품 페이지 실측 체계(크기·행간·자간·굵기)를 따르고, 글꼴은 Pretendard Variable 이다.
   반응형은 clamp 없이 두 구간(1068px 이하 · 734px 이하) 고정값으로 줄인다. */
:root {
  /* ---------- 색 ---------- */
  --c-bg: #FFFFFF;              /* 밝은 면 기본 */
  --c-bg-2: #F5F5F7;            /* 밝은 면 교차 · 타일 바탕 */
  --c-bg-dark: #000000;         /* 히어로 · 어두운 섹션 */
  --c-bg-dark-2: #161617;       /* 어두운 면 타일 */
  --c-text: #1D1D1F;            /* 밝은 면 글자 */
  --c-text-2: #6E6E73;          /* 보조 글자 */
  --c-text-3: #86868B;          /* 2색 문단의 회색 · 캡션 */
  --c-text-on-dark: #F5F5F7;    /* 어두운 면 글자 */
  --c-text-on-dark-2: #A1A1A6;  /* 어두운 면 보조 글자 */
  --c-blue: #0071E3;            /* 버튼 · 강조(밝은 면) */
  --c-blue-hover: #0077ED;
  --c-link: #0066CC;            /* 밝은 면 링크 */
  --c-blue-on-dark: #2997FF;    /* 어두운 면 링크 · 강조 */
  --c-line: #D2D2D7;            /* 꼭 필요한 구분선만 */
  --c-line-dark: rgba(255, 255, 255, 0.16);
  --c-track: #E8E8ED;           /* 점수 고리 바탕 */
  --c-glass-dark: rgba(0, 0, 0, 0.72);
  --c-glass-light: rgba(255, 255, 255, 0.72);
  --c-scrim: rgba(0, 0, 0, 0.48);
  --c-sky-q: #A1C8FF;           /* 별하늘 질문 글자 */
  --g-blue: linear-gradient(180deg, #2997FF, #0060D0);   /* 픽토그램 · 점수 고리 · 제목 강조 단어 */
  --g-blue-top: #2997FF;
  --g-blue-bottom: #0060D0;
  --c-on-blue: #FFFFFF;
  --c-field-dark: rgba(255, 255, 255, 0.08);   /* 어두운 면 입력창 */
  --c-hover-dark: rgba(255, 255, 255, 0.10);
  --c-hover-light: rgba(0, 0, 0, 0.04);
  --c-focus: #0071E3;
  --c-focus-dark: #2997FF;
  --c-blue-soft: rgba(0, 113, 227, 0.14);      /* 입력창 초점 테 */
  --c-bg-dark-3: #2C2C2E;       /* 휴대폰 장면 5 알림 카드(중립 회색) */
  --c-ring-glow: rgba(41, 151, 255, 0.6);      /* 휴대폰 장면 5 고리 빛 */
  --c-ring-glow-0: rgba(41, 151, 255, 0);
  /* 사진 위 글자 막(대비 4.5:1 이상 보장) */
  --g-why-scrim: linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.75) 38%, rgba(0, 0, 0, 0.15) 68%, rgba(0, 0, 0, 0) 80%);
  --g-why-scrim-m: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, #000 100%);
  --g-cta-scrim: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.2) 40%, #000 100%);
  --g-phone-fade: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);

  /* ---------- 글자 ---------- */
  --font-sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo",
    "Malgun Gothic", "Noto Sans KR", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;   /* 측정 근거 한 줄에만 */
  --w-regular: 400;
  --w-semibold: 600;

  /* 크기 / 행간 / 자간 — 표 A 그대로(데스크톱) */
  --t-hero-fs: 80px;      --t-hero-lh: 92px;      --t-hero-ls: 0em;
  --t-display-fs: 64px;   --t-display-lh: 70px;   --t-display-ls: 0em;
  --t-headline-fs: 56px;  --t-headline-lh: 60px;  --t-headline-ls: 0em;
  --t-headline-r-fs: 48px; --t-headline-r-lh: 57px; --t-headline-r-ls: 0em;
  --t-tile-fs: 32px;      --t-tile-lh: 39px;      --t-tile-ls: 0.004em;
  --t-title-fs: 28px;     --t-title-lh: 35px;     --t-title-ls: 0.007em;
  --t-label-fs: 24px;     --t-label-lh: 31px;     --t-label-ls: 0.009em;
  --t-intro-fs: 21px;     --t-intro-lh: 32px;     --t-intro-ls: 0.011em;
  --t-body-fs: 17px;      --t-body-lh: 27px;      --t-body-ls: 0em;
  --t-body-tight-lh: 23px;
  --t-caption-fs: 14px;   --t-caption-lh: 22px;   --t-caption-ls: 0em;
  --t-micro-fs: 12px;     --t-micro-lh: 16px;     --t-micro-ls: 0em;
  --t-score-fs: 96px;     /* 점수 숫자 */
  --t-phone-fs: 48px;     --t-phone-lh: 57px;     /* 휴대폰 장면 문장(48px/600) */

  /* ---------- 간격 · 모서리 · 그림자 ---------- */
  --gutter: 40px;
  --maxw: 1120px;
  --body-w: 692px;        /* 본문 칼럼 */
  --intro-w: 980px;       /* 소개 문단 */
  --sec-y: 160px;         /* 섹션 상하 여백 */
  --tile-pad: 40px;
  --r-tile: 28px;
  --r-sm: 12px;
  --r-pill: 980px;
  --shadow-float: 0 30px 80px -30px rgba(0, 0, 0, 0.45);
  --shadow-ring: drop-shadow(0 6px 18px rgba(0, 113, 227, 0.28));

  /* ---------- 모션 ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-1: 160ms;
  --dur-2: 320ms;
  --dur-3: 640ms;
  --dur-ring: 1400ms;     /* 점수 고리 · 숫자 */
  --dur-rotate: 6500ms;   /* 탭 진행 밑줄 한 바퀴 */

  /* ---------- 자리 ---------- */
  --nav-h: 52px;
  --dock-h: 60px;
  --dock-w: 680px;
  --tap: 44px;
  --z-nav: 50;
  --z-dock: 60;
  --z-modal: 80;
}

/* 1068px 이하 */
@media (max-width: 1068px) {
  :root {
    --t-hero-fs: 64px;     --t-hero-lh: 70px;
    --t-display-fs: 48px;  --t-display-lh: 52px;
    --t-headline-fs: 40px; --t-headline-lh: 44px;
    --t-tile-fs: 28px;     --t-tile-lh: 32px;
    --t-intro-fs: 19px;    --t-intro-lh: 28px;
    --t-phone-fs: 40px;    --t-phone-lh: 44px;
    --gutter: 32px;
    --maxw: 980px;
  }
}

/* 734px 이하 */
@media (max-width: 734px) {
  :root {
    --t-hero-fs: 40px;     --t-hero-lh: 44px;
    --t-display-fs: 32px;  --t-display-lh: 36px;
    --t-headline-fs: 28px; --t-headline-lh: 32px;
    --t-headline-r-fs: 28px; --t-headline-r-lh: 32px;
    --t-tile-fs: 24px;     --t-tile-lh: 28px;
    --t-title-fs: 21px;    --t-title-lh: 25px;
    --t-intro-fs: 17px;    --t-intro-lh: 25px;
    --t-body-fs: 17px;     --t-body-lh: 25px;
    --t-score-fs: 72px;
    --t-phone-fs: 28px;    --t-phone-lh: 32px;
    --gutter: 16px;
    --sec-y: 100px;
    --tile-pad: 28px;
  }
}
