/* =============================================================
   VERITI GLOBAL  ·  tokens.css
   Design tokens, reset, layout container and type primitives.
   Load first. Every other sheet depends on these variables.
   ============================================================= */

:root{
  --cream:      #f2e7d4;
  --cream-2:    #f3e8d5;
  --paper:      #fcfaf8;
  --panel:      #f4eee3;
  --white:      #ffffff;
  --ink:        #211e1b;
  --body:       #3e3830;
  --red:        #af2419;
  --red-soft:   #d4574a;
  --red-light:  #eb7d75;
  --stamp:      #d93329;
  --rule:       #d6c6b4;

  --serif: 'DM Serif Display', 'Noto Serif', Georgia, 'Times New Roman', serif;
  --serif-text: 'DM Serif Text', 'DM Serif Display', Georgia, serif;
  --sans: 'Work Sans', 'Noto Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --multi: 'Work Sans', 'Noto Sans', 'Noto Sans JP', 'Noto Sans SC', 'Noto Sans Arabic', 'Hiragino Sans', 'PingFang SC', 'Malgun Gothic', 'Segoe UI', Arial, sans-serif;
  --multi-serif: 'DM Serif Display', 'Noto Serif', 'Hiragino Mincho ProN', 'Songti SC', Georgia, serif;

  --gutter: clamp(20px, 6vw, 240px);
  --maxw: 1440px;

  --fs-h1: clamp(40px, 4.15vw, 80px);
  --fs-h2: clamp(30px, 2.92vw, 56px);
  --fs-h3: clamp(21px, 1.4vw, 27px);
  --fs-h4: clamp(19px, 1.25vw, 24px);
  --fs-price: clamp(52px, 5vw, 96px);
  --fs-spec: clamp(26px, 2.08vw, 40px);
  --fs-lead: clamp(17px, 1.09vw, 21px);
  --fs-body: clamp(15px, 0.89vw, 17px);
  --fs-num: clamp(30px, 2.29vw, 44px);

  --sp-sec-top: clamp(56px, 5.4vw, 104px);
  --sp-sec-bot: clamp(64px, 5.8vw, 112px);
  --sp-block: clamp(32px, 2.9vw, 56px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:110px}
html.is-locked{overflow:hidden}
body{
  margin:0;
  background:var(--paper);
  color:var(--body);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
p{margin:0}
h1,h2,h3,h4{margin:0;font-weight:400}

.wrap{width:min(var(--maxw), 100% - (var(--gutter) * 2));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- type primitives ---------- */
.h1{font-family:var(--serif);font-size:var(--fs-h1);line-height:1.15;letter-spacing:-0.01em;color:var(--ink)}
.h2{font-family:var(--serif);font-size:var(--fs-h2);line-height:1.2;letter-spacing:-0.01em;color:var(--ink)}
.h3{font-family:var(--serif);font-size:var(--fs-h3);line-height:1.25;color:var(--ink)}
.h4{font-family:var(--serif);font-size:var(--fs-h4);line-height:1.3;color:var(--ink)}
.it{font-style:italic;color:var(--red)}
.lead{font-size:var(--fs-lead);line-height:1.55;color:var(--body)}
.body{font-size:var(--fs-body);line-height:1.58;color:var(--body)}
.micro{font-size:clamp(11px,0.63vw,12px);letter-spacing:0.18em;font-weight:600}