/* MS Projects theme.css: the single token layer for the landing page.
   Direction: quiet architectural luxury. Warm ivory paper, ink bands, one brass accent.
   Display: Cormorant Garamond. UI and body: Manrope. Every page style reads from here. */

:root{
  /* primitives: warm neutrals + brass (never referenced directly by components) */
  --ivory-50:#fbf9f5;
  --ivory-100:#f5f1ea;
  --ivory-200:#ece6dc;
  --ivory-300:#ddd4c6;
  --stone-500:#8c8172;
  --stone-600:#5a5249;
  --ink-700:#2a2621;
  --ink-800:#1f1c18;
  --ink-900:#1a1714;
  --ink-950:#12100d;
  --brass-300:#d8bd8a;
  --brass-400:#c4a36e;
  --brass-500:#b08d57;
  --brass-700:#7a5a22;
  --sand-200:#d6ccbd;
  --sand-400:#b8ae9f;
  --red-700:#a12d22;
  --red-300:#f0a097;
  --green-700:#2f6a3d;
  --green-300:#8fcf9e;

  /* semantic: surfaces */
  --color-surface-page:var(--ivory-100);
  --color-surface-card:var(--ivory-50);
  --color-surface-raised:var(--ivory-200);
  --color-surface-inverse:var(--ink-900);
  --color-surface-inverse-deep:var(--ink-950);
  --color-surface-inverse-card:var(--ink-800);

  /* semantic: text */
  --color-text-primary:var(--ink-900);
  --color-text-secondary:var(--stone-600);
  --color-text-accent:var(--brass-700);
  --color-text-on-action:var(--ink-950);
  --color-text-inverse:var(--ivory-100);
  --color-text-inverse-secondary:var(--sand-400);
  --color-text-inverse-accent:var(--brass-400);
  --color-text-error:var(--red-700);
  --color-text-success:var(--green-700);

  /* semantic: action (one primary: brass) */
  --color-action-primary:var(--brass-500);
  --color-action-primary-hover:var(--brass-400);
  --color-action-primary-active:var(--brass-300);
  --color-action-secondary-hover:rgba(26,23,20,.06);
  --color-action-secondary-active:rgba(26,23,20,.12);
  --color-action-inverse-secondary-hover:rgba(245,241,234,.1);
  --color-action-inverse-secondary-active:rgba(245,241,234,.18);

  /* semantic: borders */
  --color-border-default:var(--ivory-300);
  --color-border-strong:var(--stone-500);
  --color-border-input:var(--stone-500);
  --color-border-error:var(--red-700);
  --color-border-inverse:rgba(245,241,234,.16);
  --color-border-inverse-strong:rgba(245,241,234,.55);
  --color-focus:var(--brass-700);
  --color-focus-inverse:var(--brass-300);

  /* media scrims */
  --scrim-hero:linear-gradient(180deg,rgba(18,16,13,.72) 0%,rgba(18,16,13,.62) 40%,rgba(18,16,13,.92) 100%);
  --scrim-hero-wide:linear-gradient(180deg,rgba(18,16,13,.7) 0%,rgba(18,16,13,.38) 38%,rgba(18,16,13,.9) 100%);
  --scrim-center:radial-gradient(ellipse 70% 60% at 50% 48%,rgba(18,16,13,.55) 0%,rgba(18,16,13,0) 100%);
  --scrim-side:linear-gradient(90deg,rgba(18,16,13,.85) 0%,rgba(18,16,13,.35) 70%,rgba(18,16,13,.2) 100%);

  /* typography */
  --font-display:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --font-sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --text-xs:.75rem;--text-sm:.875rem;--text-base:1.0625rem;--text-lg:1.1875rem;--text-xl:1.375rem;
  --text-2xl:1.625rem;--text-3xl:2rem;--text-4xl:2.5rem;--text-5xl:3.25rem;
  --text-brand:clamp(1.25rem,1rem + 1.2vw,1.625rem);
  --text-display:clamp(2.25rem,1.2rem + 4.8vw,5.75rem);
  --text-h2:clamp(2rem,1.4rem + 2.7vw,3.75rem);
  --text-h3:clamp(1.625rem,1.3rem + 1vw,2.125rem);
  --text-numeral:clamp(3rem,2rem + 3vw,4.5rem);
  --leading-display:1.04;--leading-tight:1.12;--leading-snug:1.3;--leading-normal:1.65;
  --tracking-eyebrow:.22em;--tracking-button:.14em;--tracking-display:-.015em;
  --weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;

  /* spacing (4px base) */
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;
  --space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;
  --space-20:5rem;--space-24:6rem;--space-32:8rem;
  --space-gutter:clamp(1rem,.5rem + 3vw,3rem);
  --space-section:clamp(4.5rem,3rem + 6vw,9rem);
  --container-max:82rem;
  --measure:62ch;

  /* radius: a deliberate ladder, not one value */
  --radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.5rem;--radius-lg:1rem;--radius-full:9999px;

  /* sizing */
  --size-control-md:3rem;--size-control-lg:3.5rem;--size-icon-sm:1rem;--size-icon-md:1.25rem;--size-icon-lg:1.5rem;
  --size-header:4.5rem;
  --border-hairline:1px;--border-thick:.125rem;

  /* depth */
  --shadow-card:0 1px 2px rgba(26,23,20,.05),0 18px 50px -20px rgba(26,23,20,.22);
  --shadow-panel:0 30px 80px -30px rgba(18,16,13,.45);
  --shadow-focus-ring:0 0 0 .125rem var(--color-surface-page),0 0 0 .25rem var(--color-focus);

  /* motion */
  --duration-fast:140ms;--duration-normal:240ms;--duration-slow:420ms;--duration-hero:1600ms;
  --ease-out:cubic-bezier(.22,.61,.36,1);--ease-in:cubic-bezier(.55,.06,.68,.19);
  --ease-in-out:cubic-bezier(.45,.05,.55,.95);--ease-emphasized:cubic-bezier(.2,0,0,1);

  --duration-spin:800ms;
  --duration-marquee:80s;
  --size-logo:clamp(2.5rem,2rem + 1.6vw,3.5rem);
  --logo-tile-bg:transparent;
  --logo-tile-pad:0;
  --opacity-disabled:.5;
  --color-header-bg:rgba(18,16,13,.86);
  --filter-photo:grayscale(.3) sepia(.12) contrast(1.04);
  --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1714' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --blur-header:saturate(140%) blur(.75rem);
  color-scheme:light;
}

/* Dark mode swaps at the semantic tier only. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --color-surface-page:var(--ink-950);
    --color-surface-card:var(--ink-800);
    --color-surface-raised:var(--ink-900);
    --color-surface-inverse:#0b0a08;
    --color-surface-inverse-deep:#080706;
    --color-surface-inverse-card:var(--ink-900);
    --color-text-primary:var(--ivory-100);
    --color-text-secondary:var(--sand-400);
    --color-text-accent:var(--brass-400);
    --color-text-error:var(--red-300);
    --color-text-success:var(--green-300);
    --color-action-secondary-hover:rgba(245,241,234,.08);
    --color-action-secondary-active:rgba(245,241,234,.14);
    --color-border-default:rgba(245,241,234,.12);
    --color-border-strong:rgba(245,241,234,.5);
    --color-border-input:rgba(245,241,234,.5);
    --color-border-error:var(--red-300);
    --color-focus:var(--brass-300);
    --logo-tile-bg:var(--ivory-100);
    --logo-tile-pad:var(--space-3) var(--space-5);
    --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5f1ea' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --color-surface-page:var(--ink-950);
  --color-surface-card:var(--ink-800);
  --color-surface-raised:var(--ink-900);
  --color-surface-inverse:#0b0a08;
  --color-surface-inverse-deep:#080706;
  --color-surface-inverse-card:var(--ink-900);
  --color-text-primary:var(--ivory-100);
  --color-text-secondary:var(--sand-400);
  --color-text-accent:var(--brass-400);
  --color-text-error:var(--red-300);
  --color-text-success:var(--green-300);
  --color-action-secondary-hover:rgba(245,241,234,.08);
  --color-action-secondary-active:rgba(245,241,234,.14);
  --color-border-default:rgba(245,241,234,.12);
  --color-border-strong:rgba(245,241,234,.5);
  --color-border-input:rgba(245,241,234,.5);
  --color-border-error:var(--red-300);
  --color-focus:var(--brass-300);
  --logo-tile-bg:var(--ivory-100);
  --logo-tile-pad:var(--space-3) var(--space-5);
  --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5f1ea' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  color-scheme:dark;
}
