/* Mila Stays Design System — Point 2A/2B
   Point 2C: wired into semantic components.
   Source baseline: approved v138. */
:root{
  /* Brand fonts */
  --ms-font-body:"DM Sans",system-ui,sans-serif;
  --ms-font-display:"Cormorant Garamond",Georgia,serif;
  --ms-font-script:"Marck Script",cursive;

  /* Type scale */
  --ms-fs-micro:10px;
  --ms-fs-caption:12px;
  --ms-fs-small:14px;
  --ms-fs-body:16px;
  --ms-fs-body-lg:18px;
  --ms-fs-lead:20px;
  --ms-fs-subheading:24px;
  --ms-fs-card-title:28px;
  --ms-fs-heading-sm:34px;
  --ms-fs-heading:42px;
  --ms-fs-heading-lg:52px;
  --ms-fs-card-title-fluid:clamp(24px,2.4vw,30px);
  --ms-fs-heading-sm-fluid:clamp(32px,4vw,42px);
  --ms-fs-section-title:clamp(38px,5vw,58px);
  --ms-fs-page-title:clamp(48px,6vw,78px);
  --ms-fs-display:clamp(72px,10vw,128px);
  --ms-fs-script:clamp(28px,4vw,46px);

  /* Core palette */
  --ms-color-ink:#12110f;
  --ms-color-charcoal:#171511;
  --ms-color-paper:#fffaf1;
  --ms-color-cream:#f5efe4;
  --ms-color-cream-soft:#fffaf2;
  --ms-color-gold:#b98a3a;
  --ms-color-gold-soft:#d9b36f;
  --ms-color-gold-dark:#8b5c20;
  --ms-color-brown:#573414;
  --ms-color-muted:#6d675e;
  --ms-color-line:rgba(18,17,15,.14);

  /* Spacing: only these values should be used by new components */
  --ms-space-1:4px;
  --ms-space-2:8px;
  --ms-space-3:12px;
  --ms-space-4:16px;
  --ms-space-5:24px;
  --ms-space-6:32px;
  --ms-space-7:48px;
  --ms-space-8:64px;
  --ms-space-9:80px;
  --ms-space-10:96px;

  /* Radius */
  --ms-radius-sm:14px;
  --ms-radius-md:18px;
  --ms-radius-lg:22px;
  --ms-radius-xl:28px;
  --ms-radius-pill:999px;

  /* Shadows */
  --ms-shadow-soft:0 10px 32px rgba(50,30,10,.08);
  --ms-shadow-card:0 18px 50px rgba(50,30,10,.10);
  --ms-shadow-float:0 24px 70px rgba(50,30,10,.12);

  /* Layout */
  --ms-content-max:1180px;
  --ms-break-mobile:620px;
  --ms-break-tablet:980px;

  /* Article image scale — desktop */
  --ms-hero-landscape-d:460px;
  --ms-hero-panorama-d:480px;
  --ms-hero-portrait-d:350px;
  --ms-hero-square-d:390px;
  --ms-inline-landscape-d:600px;
  --ms-inline-panorama-d:620px;
  --ms-inline-portrait-d:420px;
  --ms-inline-square-d:500px;
  --ms-inline-portrait-compact-d:380px;
  --ms-inline-square-compact-d:460px;

  /* Article image scale — tablet */
  --ms-hero-landscape-t:460px;
  --ms-hero-panorama-t:480px;
  --ms-hero-portrait-t:350px;
  --ms-hero-square-t:390px;
  --ms-inline-landscape-t:520px;
  --ms-inline-panorama-t:540px;
  --ms-inline-portrait-t:380px;
  --ms-inline-square-t:440px;
  --ms-inline-portrait-compact-t:350px;
  --ms-inline-square-compact-t:420px;

  /* Article image scale — mobile */
  --ms-hero-landscape-m:330px;
  --ms-hero-panorama-m:345px;
  --ms-hero-portrait-m:290px;
  --ms-hero-square-m:315px;
  --ms-inline-landscape-m:390px;
  --ms-inline-panorama-m:400px;
  --ms-inline-portrait-m:330px;
  --ms-inline-square-m:360px;
  --ms-inline-portrait-compact-m:305px;
  --ms-inline-square-compact-m:335px;

  /* Selected by Mila mobile media frames */
  --ms-card-media-landscape-m:225px;
  --ms-card-media-square-m:275px;
  --ms-card-media-portrait-m:285px;
}

/* Point 2D — responsive contract tokens */
:root{
  --ms-header-height-desktop:82px;
  --ms-header-height-mobile:72px;
  --ms-touch-target:44px;
  --ms-gutter-mobile:16px;
  --ms-gutter-tablet:24px;
  --ms-gutter-desktop:28px;
  --ms-story-photo-mobile:205px;
  --ms-story-title-desktop:clamp(46px,4.2vw,56px);
  --ms-story-title-mobile:clamp(40px,11vw,48px);
}