@font-face {
  font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/assets/instrument-serif-italic-latin-6c5b1c87.woff2") format("woff2"); 
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/assets/instrument-serif-italic-latin-ext-2d393e0b.woff2") format("woff2"); 
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Instrument Serif"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("/assets/instrument-serif-latin-126f9d71.woff2") format("woff2"); 
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Serif"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("/assets/instrument-serif-latin-ext-fa589071.woff2") format("woff2"); 
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/assets/geist-latin-90ac0fe7.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/assets/geist-latin-ext-4f909eff.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/assets/geist-mono-latin-a600ad3f.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/assets/geist-mono-latin-ext-1a2f930e.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --prestka-primary: #393A8F;   
  --prestka-dark:    #2A2B6F;
  --prestka-light:   #5054B8;
  --setka-primary:   #004D95;   
  --webtka-primary:  #118893;   
  --gold:            #D4AF37;    
  --gold-tasks-facture: #DAA520;

  --obsidian:      #08080d;      
  --graphite:      #1a1a1e;      
  --slate:         #24242b;      
  --deep-indigo:   #151227;      
  --cloud-dancer:  #f5f3ef;      
  --cloud-blue:    #eef3fb;      
  --paper:         #fafafa;
  --paper-dim:     #e4e4e7;
  --paper-soft:    #a1a1aa;
  --ink:           #0a0a0a;

  --neutral-0:    #FFFFFF;
  --neutral-50:   #F9FAFB;
  --neutral-100:  #F3F4F6;
  --neutral-200:  #E5E7EB;
  --neutral-300:  #D1D5DB;
  --neutral-400:  #9CA3AF;
  --neutral-500:  #6B7280;
  --neutral-600:  #4B5563;
  --neutral-700:  #374151;
  --neutral-800:  #1F2937;
  --neutral-900:  #111827;
  --neutral-1000: #0A0A0F;

  --status-event-a-valider:   #D9354A;  
  --status-event-valide:      #067574;  
  --status-event-non-cloture: #5A2F97;  
  --status-event-cloture:     #556270;  
  --chip-select: var(--status-event-non-cloture);
  --status-booking-attente-envoi:        #CD9B9B;
  --status-booking-attente-confirmation: #CD950C;
  --status-booking-accepte:              #228B22;
  --status-booking-refuse:               #B22222;
  --status-task-a-realiser: var(--neutral-400);
  --status-task-en-cours:   var(--prestka-primary);
  --status-task-finalise:   var(--status-booking-accepte);
  --priority-minimum:   #4A90E2;
  --priority-moyen:     var(--neutral-500);
  --priority-important: #E85D04;
  --priority-urgent:    #B22222;
  --cat-laboratoire:    var(--prestka-light);
  --cat-cuisine:        var(--gold);
  --cat-livraison:      var(--webtka-primary);
  --cat-reprise:        var(--neutral-500);
  --cat-autre:          var(--neutral-400);

  --bg:              var(--graphite);
  --nav-bg:          var(--obsidian);   
  --bg-hero:         var(--deep-indigo);
  --fg:              var(--paper);
  --text-primary:    var(--paper);
  --text-secondary:  var(--paper-dim);
  --text-tertiary:   var(--paper-soft);
  --text-mute:       #737373;
  --accent:          var(--gold);
  --brand-primary:   var(--prestka-primary);
  --nav-icon-active: color-mix(in srgb, var(--prestka-light) 78%, var(--paper));
  --brand-accent:       color-mix(in srgb, var(--prestka-light) 62%, var(--paper));
  --brand-accent-hover: color-mix(in srgb, var(--prestka-light) 48%, var(--paper));
  --line:            rgba(250, 250, 250, 0.18);   
  --line-strong:     rgba(250, 250, 250, 0.26);
  --surface-tint:    var(--graphite);   
  --surface:         color-mix(in srgb, var(--surface-tint) 82%, transparent);
  --surface-solid:   var(--slate);
  --salle-canvas:    color-mix(in srgb, var(--paper) 14%, var(--slate));

  --glass-subtle-bg: color-mix(in srgb, var(--surface-tint) 45%, transparent);   --glass-subtle-blur: 12px;  --glass-subtle-sat: 1.4;  --glass-subtle-border: rgba(250,250,250,0.06);
  --glass-medium-bg: color-mix(in srgb, var(--surface-tint) 62%, transparent);   --glass-medium-blur: 20px;  --glass-medium-sat: 1.8;  --glass-medium-border: rgba(250,250,250,0.10);
  --glass-strong-bg: color-mix(in srgb, var(--surface-tint) 80%, transparent);   --glass-strong-blur: 28px;  --glass-strong-sat: 2.0;  --glass-strong-border: rgba(250,250,250,0.14);
  --glass-hero-bg:   rgba(21, 18, 39, 0.35);  --glass-hero-blur: 30px;   --glass-hero-sat: 1.8;    --glass-hero-border: rgba(212,175,55,0.15);
  --glass-highlight: rgba(255, 255, 255, 0.06);  

  --font-display: "Instrument Serif", Georgia, "Times New Roman", serif;  
  --font-sans:    "Geist", system-ui, -apple-system, sans-serif;          
  --font-mono:    "Geist Mono", ui-monospace, "SF Mono", monospace;       

  --text-xs:    0.75rem;   --text-sm:  0.875rem;  --text-base: 1rem;
  --text-md:    1.125rem;  --text-lg:  1.25rem;   --text-xl:   1.563rem;
  --text-2xl:   1.953rem;  --text-3xl: 2.441rem;  --text-4xl:  3.052rem;
  --display-sm: clamp(2rem, 4vw, 3rem);
  --display-md: clamp(2.6rem, 6vw, 4.5rem);
  --display-lg: clamp(3.4rem, 9vw, 7rem);

  --leading-tight: 1.15;  --leading-snug: 1.3;  --leading-normal: 1.55;  --leading-relaxed: 1.75;
  --tracking-tight: -0.035em;  --tracking-normal: 0;  --tracking-wide: 0.04em;  --tracking-caps: 0.22em;

  --weight-regular: 400;  --weight-medium: 500;  --weight-semibold: 600;  --weight-bold: 700;

  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;  --space-5: 24px;
  --space-6: 32px;  --space-7: 48px;  --space-8: 64px;  --space-9: 96px;

  --radius-sm: 4px;  --radius-md: 8px;  --radius-lg: 12px;  --radius-xl: 20px;  --radius-2xl: 32px;  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.20);
  --shadow-md: 0 4px 14px -4px rgba(0,0,0,0.35);
  --shadow-lg: 0 18px 40px -16px rgba(0,0,0,0.55);
  --shadow-xl: 0 32px 64px -24px rgba(0,0,0,0.65);
  --shadow-glow: 0 0 40px rgba(212,175,55,0.10);

  --shadow-ambient:  0 2px 10px -4px rgba(0,0,0,0.30);          
  --shadow-key:      0 26px 56px -22px rgba(0,0,0,0.62);        
  --glass-sheen-top: rgba(255,255,255,0.07);                   
  --glass-inner:     inset 0 -22px 38px -28px rgba(0,0,0,0.55); 
  --glass-edge:      inset 0 0 0 1px rgba(255,255,255,0.025);   
  --glow-brand:      0 0 36px -6px color-mix(in srgb, var(--brand-primary) 45%, transparent);
  --glow-gold:       0 0 30px -4px rgba(212,175,55,0.30);

  --ease-silk:     cubic-bezier(0.22, 1, 0.36, 1);   
  --ease-friction: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 150ms;  --dur-normal: 250ms;  --dur-slow: 450ms;  --dur-reveal: 1100ms;

  --focus-ring: 2px solid var(--brand-primary);
  --focus-offset: 4px;

  --z-sticky: 30;
  --z-topbar: 50;
  --z-popover: 700;
  --z-drawer: 900;
  --z-modal: 1000;
  --z-toast: 1100;

  --topbar-h: 64px;

  --toast-success: var(--status-booking-accepte);
  --toast-error:   var(--priority-urgent);
  --toast-info:    var(--prestka-light);

  --banner-success: color-mix(in srgb, var(--status-booking-accepte) 55%, var(--paper));
  --banner-danger:  color-mix(in srgb, var(--priority-urgent) 55%, var(--paper));
  --banner-info:    color-mix(in srgb, var(--prestka-light) 78%, var(--paper));
  --banner-warning: var(--gold);

  --bg-deep: var(--obsidian);
  --bg-elevated: color-mix(in srgb, var(--paper) 5%, transparent);
  --bg-elevated-strong: color-mix(in srgb, var(--paper) 8%, transparent);
  --gold-accent: var(--gold);
  --gold-soft: rgba(212,175,55,0.15);
  --gold-stroke: rgba(212,175,55,0.25);
  --gold-stroke-soft: rgba(212,175,55,0.10);
  --glass-bg-obsidian: var(--glass-medium-bg);
  --glass-bg-cloud: var(--glass-medium-bg);
  --glass-blur: blur(var(--glass-medium-blur)) saturate(var(--glass-medium-sat));
  --glass-border: 1px solid var(--glass-medium-border);
  --glass-shadow: var(--shadow-lg);
  --motion-fast: var(--dur-fast);  --motion-base: var(--dur-normal);  --motion-slow: var(--dur-slow);
  --motion-spring: var(--ease-spring);  --motion-ease-out: var(--ease-silk);
  --status-priority-urgent: var(--priority-urgent);
  --cat-cuisine-service: var(--gold);
}

[data-theme="light"] {
  --bg:             var(--cloud-blue);
  --bg-hero:        var(--cloud-blue);
  --fg:             var(--ink);
  --text-primary:   var(--ink);
  --text-secondary: #27272a;
  --text-tertiary:  #52525b;
  --text-mute:      #71717a;
  --nav-icon-active: var(--brand-primary);   
  --brand-accent:       var(--prestka-dark);
  --brand-accent-hover: var(--prestka-primary);
  --line:           rgba(10, 10, 10, 0.10);
  --line-strong:    rgba(10, 10, 10, 0.22);
  --surface-tint:   var(--cloud-dancer);
  --surface:        color-mix(in srgb, var(--cloud-dancer) 70%, transparent);
  --surface-solid:  #ffffff;
  --salle-canvas:   #ffffff;

  --glass-subtle-bg: rgba(245,243,239,0.55);
  --glass-medium-bg: rgba(245,243,239,0.72);
  --glass-strong-bg: rgba(245,243,239,0.85);
  --glass-hero-bg:   rgba(245,243,239,0.35);
  --glass-hero-border: rgba(212,175,55,0.20);
  --glass-highlight: rgba(255,255,255,0.5);
  --glass-sheen-top: rgba(255,255,255,0.6);
  --glass-inner: inset 0 -22px 40px -30px rgba(20,18,39,0.16);
  --glass-edge: inset 0 0 0 1px rgba(255,255,255,0.55);
  --shadow-ambient: 0 2px 10px -4px rgba(20,18,39,0.10);
  --shadow-key: 0 26px 56px -24px rgba(20,18,39,0.16);

  --bg-elevated: color-mix(in srgb, var(--ink) 4%, transparent);
  --bg-elevated-strong: color-mix(in srgb, var(--ink) 7%, transparent);

  --toast-success: color-mix(in srgb, var(--status-booking-accepte) 80%, var(--ink));
  --toast-error:   color-mix(in srgb, var(--priority-urgent) 88%, var(--ink));
  --toast-info:    var(--brand-primary);

  --banner-success: color-mix(in srgb, var(--status-booking-accepte) 80%, var(--ink));
  --banner-danger:  color-mix(in srgb, var(--priority-urgent) 88%, var(--ink));
  --banner-info:    var(--brand-primary);
  --banner-warning: color-mix(in srgb, var(--gold) 62%, var(--ink));
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background:
    radial-gradient(58vw 48vh at 12% -8%, color-mix(in srgb, var(--brand-primary) 14%, transparent), transparent 58%),
    radial-gradient(46vw 40vh at 102% 106%, color-mix(in srgb, var(--gold) 6%, transparent), transparent 55%),
    var(--bg);
  background-attachment: fixed;
  color: var(--fg);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  transition: background var(--dur-normal) var(--ease-friction), color var(--dur-normal) var(--ease-friction);
}

body {
  margin: 0;
  min-height: 100vh;
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  font-feature-settings: "kern", "liga", "calt";
}

::selection { background: var(--prestka-primary); color: var(--paper); }
:focus-visible { outline: var(--focus-ring); outline-offset: var(--focus-offset); border-radius: 2px; }

* { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--text-tertiary) 35%, transparent) transparent; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--text-tertiary) 30%, transparent); border-radius: 999px; border: 3px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--brand-primary) 55%, transparent); background-clip: padding-box; }

.font-display { font-family: var(--font-display); }
.font-sans    { font-family: var(--font-sans); }
.font-mono    { font-family: var(--font-mono); }

.eyebrow {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-caps);
  color: var(--text-tertiary);
}

.icon {
  width: 1.25em; height: 1.25em;
  flex: none;
  stroke: currentColor;
  fill: none;
  vertical-align: -0.2em;
}
.icon--sm { width: 1em; height: 1em; }
.icon--lg { width: 1.5em; height: 1.5em; }

.sketch-frame { max-width: 1200px; margin: 0 auto; padding: var(--space-7) var(--space-5); }
.sketch-frame__title {
  font-family: var(--font-display); font-style: italic; font-weight: var(--weight-regular);
  font-size: var(--display-sm); line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight); margin: 0 0 var(--space-3); color: var(--text-primary);
}
.sketch-frame__subtitle {
  font-family: var(--font-mono); font-size: var(--text-sm); color: var(--text-tertiary);
  margin: 0 0 var(--space-6); letter-spacing: var(--tracking-caps); text-transform: uppercase;
}
.variant__label {
  font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-tertiary);
  letter-spacing: var(--tracking-caps); text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}