/* ============================================================
   Unlimited Room（まりこさん）— 拠点テーマ

   ★ この拠点は commut-lp の共通トークンに乗せない。
     shared/tokens.css は広告LP向け（ゴシック・CTA×5）で、
     本案件は明朝ベースのブランドページのため性格が異なる。
     → 必要な値はすべてこのファイルで定義する。
     → shared/ は読むだけ。絶対に書き換えない。

   公開先は eqlabounity.jp の子ページ（当社が作る Astro のサイト
   site-unity・Cloudflare Pages）。ここは試作で、Astro へ移植する。
   ★ 変数は :root ではなく .ur に置く（サイト共通のトークンとぶつけない）。
   ============================================================ */

.ur {
  /* --- 地・面 --------------------------------------------- */
  --c-base:   #E5E4E0;  /* 基調。HERO / OUR PROBLEM / TEAM / VOICE / CTA */
  --c-sink:   #DCDAD3;  /* 沈める。ABOUT / HOW IT WORKS / FOR YOU */
  --c-card:   #F4F3F0;  /* カード面 */
  --c-cell:   #FBFAF8;  /* チームのセル面 */

  /* --- 文字・線 ------------------------------------------- */
  --c-ink:    #2A2724;  /* 本文・見出し */
  --c-sub:    #655E54;  /* ラベル・キャプション。地に対して 4.5:1 以上（旧 #7A7265 は 3.73 で不可） */
  --c-line:   #C9C2B6;  /* ヘアライン */
  --c-ring:   #CFC8BB;  /* 同心円（点線） */
  --c-ring2:  #C4BCAE;  /* 波紋（実線） */

  /* --- 球：OFF+BRAND 実測値 -------------------------------
     ★ mix-blend-mode は使わない。乗算は必ず暗くなりくすむ。
     ★ 土台をベージュにしない。隙間から透けて全体が濁る。 */
  --o-orange: #F5833C;
  --o-yellow: #FACB0E;
  --o-pink:   #F06BA8;
  --o-blue:   #78BAE6;
  --o-core:   rgba(255, 252, 244, .78);
  --o-floor:  #F6A95E;

  /* --- アクセント ----------------------------------------- */
  --c-mark:   #C08A6A;  /* カードの「×」 */

  /* --- タイポグラフィ ------------------------------------- */
  --jp-serif: "Yu Mincho","游明朝","YuMincho","Hiragino Mincho ProN",
              "ヒラギノ明朝 ProN","Noto Serif JP",serif;
  --en-sans:  "Jost","Helvetica Neue",Arial,sans-serif;

  --ls-vhead: 0.16em;   /* 縦書き見出し */
  --ls-head:  0.12em;   /* 横書き見出し */
  --ls-body:  0.06em;   /* 本文 */
  --ls-label: 0.22em;   /* 欧文ラベル */

  --lh-vhead: 2.2;
  --lh-head:  1.8;
  --lh-body:  2.0;

  /* --- 寸法 ------------------------------------------------ */
  --orb-ratio:   0.62;  /* 球の直径 ÷ 画面高（サンプル実測） */
  --ring-in:     1.23;  /* 内側の同心円 ÷ 球 */
  --ring-out:    1.53;  /* 外側の同心円 ÷ 球 */
  --orb-blur:    6px;

  --sec-pad:     100px; /* セクション上下（PC） */
  --sec-pad-sp:  60px;  /* 同（SP） */
  --gutter:      24px;
  --maxw:        1040px;
  --radius:      10px;  /* インタラクティブ要素のみ。カードは 0 */

  /* --- 動き（spec.md §4.3〜4.5・§5.1） ---------------------
     ★ アニメーションは transform と opacity だけ。 */
  --ease-out:    cubic-bezier(.22, 1, .36, 1);
  --drop-cycle:  6s;    /* 雫→波紋の周期 */
  --breathe:     12s;   /* 球の呼吸 */
  --t-reveal:    .9s;   /* 表示時のフェード */
  --t-hover:     .35s;  /* ホバー全般 */
  --t-card:      .6s;   /* カードのホバー（本家実測 0.6〜0.7s） */
  --ease-io:     cubic-bezier(.65, 0, .35, 1); /* ゆっくり始まり、ゆっくり止まる（本家のカード） */
  --t-travel:    1.2s;  /* 球の旅（PCのみ） */
  --bp-pc:       1024px;/* 球の旅・「＋→×」の拡大はこの幅以上だけ（参照用・メディアクエリには直値で） */
}

/* 段階1：静的レイアウト用の追加トークン。既存トークンは変更しない。 */
.ur {
  --zero: 0;
  --full: 100%;
  --half: 50%;
  --one: 1;
  --hairline: 1px;
  --focus-width: 2px;
  --focus-offset: 5px;
  --font-normal: 400;
  --text-label: 11px;
  --text-small: 12px;
  --text-note: 14px;
  --text-body: 15px;
  --text-heading: clamp(24px, 3vw, 36px);
  --text-hero-sp: clamp(21px, 5.6vw, 30px);
  --text-hero-pc: clamp(30px, 3vw, 44px);
  --text-card: clamp(26px, 3vw, 38px);
  --text-mark: 15px;
  --text-cross: 9px;
  --text-shift: clamp(24px, 4vw, 48px);
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 32px;
  --space-lg: 48px;
  --space-xl: 80px;
  --label-line: 1.4;
  --hero-height: 100svh;
  --hero-min-sp: 700px;
  --hero-min-pc: 700px;
  --hero-top-sp: 104px;
  --hero-title-right: 14%;
  --hero-orb-top-sp: 65%;
  --orb-size: min(calc(100vh * var(--orb-ratio)), 86vw);
  --orb-inset: -6px;
  --orb-css-blur: 5px;
  --mask-solid: #000;
  --clear: transparent;
  --orb-edge-start: 80%;
  --orb-orange-x: 27%;
  --orb-orange-y: 23%;
  --orb-yellow-x: 79%;
  --orb-yellow-y: 19%;
  --orb-yellow-end: 47%;
  --orb-pink-x: 21%;
  --orb-pink-y: 77%;
  --orb-blue-x: 83%;
  --orb-blue-y: 75%;
  --orb-cool-end: 53%;
  --orb-core-x: 59%;
  --orb-core-y: 47%;
  --orb-core-end: 40%;
  --about-orb-size: min(60vw, 300px);
  --about-stage-pc: 600px;
  --about-word-left: 8%;
  --about-word-right: 6%;
  --about-word-top: 20%;
  --about-word-middle: 45%;
  --about-word-bottom: 94%;
  --problem-columns: minmax(0, 2fr) minmax(0, 3fr);
  --how-columns: minmax(0, 1fr) minmax(0, 2fr);
  --equal-columns: repeat(2, minmax(0, 1fr));
  --sticky-top: 120px;
  --card-max: 440px;
  --card-ratio: 1;
  --card-offset: 48px;
  --cell-ratio: 2.5;
  --number-column: 80px;
  --number-column-sp: 36px;
  --list-padding: 24px;
  --team-mark-offset: -5px;
  --cta-orb-size: 92px;
  --cta-orb-blur: 9px;
  --cta-pad-y: 9px;
  --cta-pad-x: 26px;
  --shift-size: clamp(120px, 18vw, 220px);
  --shift-cross: polygon(35% 0, 65% 0, 65% 35%, 100% 35%, 100% 65%, 65% 65%, 65% 100%, 35% 100%, 35% 65%, 0 65%, 0 35%, 35% 35%);
  --cross-angle: 45deg;
  --z-art: 0;
  --z-copy: 1;
  --text-how-pc: clamp(22px, 2vw, 28px);
  --canvas-inset: -8%;
  --canvas-size: 116%;
  --halo-delay: .6s;
  --halo-scale-start: .8;
  --halo-scale-end: 1.75;
  --halo-opacity: .4;
  --t-orb-switch: .4s;
  --text-hero-height-limit: 4.5svh;
  --orb-four-color-field:
    radial-gradient(circle at var(--orb-orange-x) var(--orb-orange-y), var(--o-orange) var(--zero), var(--clear) var(--half)),
    radial-gradient(circle at var(--orb-yellow-x) var(--orb-yellow-y), var(--o-yellow) var(--zero), var(--clear) var(--orb-yellow-end)),
    radial-gradient(circle at var(--orb-pink-x) var(--orb-pink-y), var(--o-pink) var(--zero), var(--clear) var(--orb-cool-end)),
    radial-gradient(circle at var(--orb-blue-x) var(--orb-blue-y), var(--o-blue) var(--zero), var(--clear) var(--orb-cool-end)),
    var(--o-floor);
}

/* 段階3：表示・ホバー（既存トークンは変更しない） */
.ur {
  --reveal-rise: 12px;
  --paragraph-step: .12s;
  --row-step: .08s;
  --row-text-delay: .16s;
  --t-team: .25s;
  --team-muted: .35;
  --t-float: 8s;
  --float-range: 6px;
  --float-phase-two: -2.67s;
  --float-phase-three: -5.33s;
  --arrow-step: 4px;
  --scroll-cycle: 2.4s;
  --hero-exit: 80px;
  --hero-drift: 12px;
  --char-rate: 3;
  --char-step: .07;
  --tag-rise: 1em;
  --tag-row-height: calc(var(--text-small) * var(--lh-body) + var(--hairline) * 2);
}

/* 段階4：球の旅・＋→×（既存値は変更しない） */
.ur {
  --t-travel-fade: .8s;
  --travel-problem-scale: 1.6;
  --travel-how-scale: .6;
  --travel-how-opacity: .6;
  --travel-how-x: calc(-1 * (min(var(--maxw), calc(100vw - var(--gutter) * 2)) / 3 + var(--space-xl) / 6));
  --z-orb-layer: 1;
  --z-page-copy: 2;
  --shift-height-pc: 300vh;
  --shift-height-sp: 120vh;
  --shift-stage-height: 100vh;
  --shift-rise-distance: 60vh;
  --shift-turn-start: .2;
  --shift-turn-span: .25;
  --shift-fill-start: .45;
  --shift-fill-span: .25;
  --shift-text-start: .7;
  --shift-text-span: .05;
  --shift-handoff-start: .9;
  --shift-handoff-span: .1;
  --shift-turn-grow: .8;
  --text-marquee: clamp(48px, 8vw, 120px);
  --t-marquee: 18s;
}
.ur {
  --shift-bridge-start: .68;
  --shift-bridge-span: .04;
  --shift-deliver-start: .999;
  --shift-deliver-span: .001;
  --z-shift-overlay: 3;
}
.ur {
  --text-about-word: clamp(18px, 1.5vw, 20px);
  --text-about-label: 13px;
}
.ur {
  --statement-inset-pc: 64px;
  --card-second-shift-pc: 96px;
}
.ur {
  --about-orbit-side: .52;
  --about-orbit-bottom: .60;
  --about-orbit-word-width: 300px;
  --about-orbit-rise: .28;
  --about-foundation-lift: 64px;
  --about-caption-clearance: 104px;
  --about-reading-height: 100vh;
}
.ur {
  --text-marquee-small: clamp(32px, 4.8vw, 72px);
}
.ur {
  --how-cards-shift-pc: clamp(0px, calc((100vw - var(--maxw)) / 2 - var(--gutter)), 48px);
  --card-second-extra-right: clamp(0px, calc((100vw - var(--maxw)) / 2 - var(--gutter)), 64px);
}
.ur {
  --cta-pill-radius: 999px;
  --cta-pill-border: rgba(42,39,36,.35);
  --cta-pill-y: 13px;
  --cta-pill-x: 30px;
  --cta-pill-gap: 14px;
  --cta-pill-line: 20px;
  --cta-pill-spacing: .18em;
  --hero-bottom-space: 64px;
  --hero-cta-gap-sp: 24px;
  --hero-cta-gap-pc: 40px;
  --hero-cta-fade-start: .25;
  --hero-cta-fade-span: .4;
  --hero-copy-inset-pc: 56px;
  --hero-copy-offset-y-pc: 40px;
}
.ur {
  --orb-veil: .14;
  --orb-alpha: .88;
  --orb-core-boost: 1.15;
  --orb-veil-color: #fffcf4;
}