@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* ISR France — Color System (v2)
 * Core brand palette (validated, non-negotiable):
 *   Blush #F0D5D0 · Orange #FF8C1A · Magenta #E64C7E · Burgundy #3D1B2D
 * v2 additions: warm cream/ivory surfaces, peach tint, and brand gradients
 * for a more contemporary, editorial feel. Core four are untouched.
 */

:root {
  /* ---- Core brand (do not replace) ---- */
  --color-primary-blush: #F0D5D0;
  --color-primary-orange: #FF8C1A;
  --color-primary-magenta: #E64C7E;
  --color-primary-burgundy: #3D1B2D;

  /* ---- Extended tints / shades ---- */
  --color-blush-050: #FBF3F0;   /* v2 warm ivory tint of blush */
  --color-blush-100: #F8EBE7;
  --color-blush-200: #F0D5D0;   /* = core blush */
  --color-blush-300: #E8BDB5;
  --color-peach: #FCE4D6;       /* v2 warm peach accent surface */
  --color-orange-dark: #E67A0A;
  --color-orange-600: #CC6A00;
  --color-magenta-dark: #C63A66;
  --color-burgundy-light: #5A3145;
  --color-burgundy-900: #2A1220; /* deepest burgundy for gradients */

  /* ---- Warm neutrals (v2: subtly warm, not cold grey) ---- */
  --color-neutral-50: #FBF9F8;
  --color-neutral-100: #F5F2F0;
  --color-neutral-200: #EAE5E2;
  --color-neutral-300: #D8D0CC;
  --color-neutral-400: #A69C97;
  --color-neutral-500: #756B66;
  --color-neutral-600: #453E3A;
  --color-neutral-700: #2A2421;
  --color-neutral-800: #1A1614;
  --color-neutral-900: #0D0B0A;

  /* ---- Semantic ---- */
  --color-success: #2D9E5C;
  --color-warning: #F7A600;
  --color-error: #E63946;
  --color-info: #0D7AFF;

  /* ---- Text ---- */
  --color-text-primary: #1A1614;
  --color-text-secondary: #756B66;
  --color-text-tertiary: #A69C97;
  --color-text-inverse: #FBF9F8;
  --color-text-brand: #FF8C1A;

  /* ---- Backgrounds / surfaces ---- */
  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #FBF6F2;   /* v2 warm ivory page surface */
  --color-bg-tertiary: #F5F2F0;
  --color-bg-blush: #F0D5D0;
  --color-bg-dark: #3D1B2D;         /* burgundy is the dark surface */

  /* ---- Borders ---- */
  --color-border-light: #EAE5E2;
  --color-border-medium: #D8D0CC;
  --color-border-dark: #A69C97;
  --color-border-blush: #E8BDB5;

  /* ---- Interactive states ---- */
  --color-focus: var(--color-primary-orange);
  --color-disabled: #D8D0CC;
  --color-disabled-text: #A69C97;

  /* ---- Brand gradients (v2) ---- */
  --gradient-warm: linear-gradient(120deg, #FF8C1A 0%, #E64C7E 100%); /* @kind color */
  --gradient-warm-soft: linear-gradient(120deg, #FF8C1A 0%, #E64C7E 130%); /* @kind color */
  --gradient-burgundy: linear-gradient(160deg, #4A2236 0%, #2A1220 100%); /* @kind color */
  --gradient-blush: linear-gradient(180deg, #FBF6F2 0%, #F0D5D0 100%); /* @kind color */
  --gradient-ivory: linear-gradient(180deg, #FFFFFF 0%, #FBF6F2 100%); /* @kind color */

  /* ---- Image overlays (warm grading over photography) ---- */
  --overlay-hero: linear-gradient(120deg, rgba(42,18,32,0.82) 0%, rgba(61,27,45,0.62) 55%, rgba(230,76,126,0.34) 100%); /* @kind color */
  --overlay-card: linear-gradient(180deg, rgba(42,18,32,0) 30%, rgba(42,18,32,0.72) 100%); /* @kind color */
  --overlay-warm-wash: linear-gradient(0deg, rgba(255,140,26,0.10), rgba(230,76,126,0.06)); /* @kind color */

  /* ---- Legacy aliases (v1 compatibility) ---- */
  --color-secondary-blush-light: var(--color-blush-100);
  --color-secondary-blush-dark: var(--color-blush-300);
  --color-secondary-orange-dark: var(--color-orange-dark);
  --color-secondary-magenta-dark: var(--color-magenta-dark);
  --color-secondary-burgundy-light: var(--color-burgundy-light);
  --color-primary: var(--color-primary-orange);
  --color-accent: var(--color-primary-magenta);
  --color-dark: var(--color-primary-burgundy);
  --color-light: var(--color-primary-blush);
}


/* ISR France — Typography System (v2)
 * Sans (UI/body): Inter · Serif (display/headlines): Crimson Text
 * v2: fluid display scale (clamp) for a bolder editorial hero, unchanged pairing.
 */


:root {
  /* Families */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif;
  --font-serif: 'Crimson Text', 'Georgia', 'Times New Roman', serif;
  --font-mono: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;

  /* Display (serif) — fluid for hero impact */
  --font-size-display-xl: clamp(2.75rem, 1.6rem + 4.4vw, 4.5rem); /* @kind other */
  --line-height-display-xl: 1.06;
  --font-size-display-lg: clamp(2.25rem, 1.5rem + 3vw, 3.25rem); /* @kind other */
  --line-height-display-lg: 1.1;
  --font-size-display-md: clamp(1.875rem, 1.4rem + 1.9vw, 2.5rem); /* @kind other */
  --line-height-display-md: 1.15;
  --font-size-display-sm: 1.875rem;
  --line-height-display-sm: 1.2;

  /* Headings */
  --font-size-h1: 2.25rem;  --font-weight-h1: 700; --line-height-h1: 1.15;
  --font-size-h2: 1.875rem; --font-weight-h2: 700; --line-height-h2: 1.2;
  --font-size-h3: 1.5rem;   --font-weight-h3: 700; --line-height-h3: 1.3;
  --font-size-h4: 1.25rem;  --font-weight-h4: 600; --line-height-h4: 1.35;
  --font-size-h5: 1.125rem; --font-weight-h5: 600; --line-height-h5: 1.4;
  --font-size-h6: 1rem;     --font-weight-h6: 600; --line-height-h6: 1.45;

  /* Body */
  --font-size-body-lg: 1.125rem; --font-weight-body-lg: 400; --line-height-body-lg: 1.65;
  --font-size-body: 1rem;        --font-weight-body: 400;    --line-height-body: 1.6;
  --font-size-body-sm: 0.875rem; --font-weight-body-sm: 400; --line-height-body-sm: 1.55;
  --font-size-body-xs: 0.75rem;  --font-weight-body-xs: 400; --line-height-body-xs: 1.5;

  /* Labels / captions */
  --font-size-label: 0.875rem;   --font-weight-label: 500;   --line-height-label: 1.4;
  --font-size-caption: 0.75rem;  --font-weight-caption: 500; --line-height-caption: 1.4;

  /* Overline / tagline (uppercase, tracked) */
  --font-size-overline: 0.78rem; --font-weight-overline: 600; --line-height-overline: 1.4;
  --letter-spacing-overline: 0.14em;

  /* Button */
  --font-size-button: 1rem; --font-weight-button: 600; --line-height-button: 1.4;
}

body {
  font-family: var(--font-sans);
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-body);
  line-height: var(--line-height-body);
  color: var(--color-text-primary);
  background-color: var(--color-bg-primary);
}

h1 { font-size: var(--font-size-h1); font-weight: var(--font-weight-h1); line-height: var(--line-height-h1); margin: 0; }
h2 { font-size: var(--font-size-h2); font-weight: var(--font-weight-h2); line-height: var(--line-height-h2); margin: 0; }
h3 { font-size: var(--font-size-h3); font-weight: var(--font-weight-h3); line-height: var(--line-height-h3); margin: 0; }
h4 { font-size: var(--font-size-h4); font-weight: var(--font-weight-h4); line-height: var(--line-height-h4); margin: 0; }
h5 { font-size: var(--font-size-h5); font-weight: var(--font-weight-h5); line-height: var(--line-height-h5); margin: 0; }
h6 { font-size: var(--font-size-h6); font-weight: var(--font-weight-h6); line-height: var(--line-height-h6); margin: 0; }
p { margin: 0; }

a { color: var(--color-primary-orange); text-decoration: none; }
a:hover { color: var(--color-orange-dark); text-decoration: underline; }

strong, b { font-weight: 600; }


/* ISR France — Spacing System
 * Base unit 4px. Scale: 4,8,12,16,24,32,40,48,56,64,80,96,120,144
 */

:root {
  --spacing-0: 0;
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-5: 1.25rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-10: 2.5rem;
  --spacing-12: 3rem;
  --spacing-14: 3.5rem;
  --spacing-16: 4rem;
  --spacing-20: 5rem;
  --spacing-24: 6rem;
  --spacing-30: 7.5rem;
  --spacing-36: 9rem;

  --spacing-xs: var(--spacing-2);
  --spacing-sm: var(--spacing-4);
  --spacing-md: var(--spacing-6);
  --spacing-lg: var(--spacing-8);
  --spacing-xl: var(--spacing-12);
  --spacing-2xl: var(--spacing-16);
  --spacing-3xl: var(--spacing-24);

  --spacing-button-x: var(--spacing-6);
  --spacing-button-y: var(--spacing-3);
  --spacing-input-x: var(--spacing-4);
  --spacing-input-y: var(--spacing-3);
  --spacing-card-padding: var(--spacing-8);
  --spacing-section-top: var(--spacing-24);
  --spacing-section-bottom: var(--spacing-24);
  --spacing-section-gap: var(--spacing-12);

  --spacing-gap-tight: var(--spacing-4);
  --spacing-gap-normal: var(--spacing-6);
  --spacing-gap-loose: var(--spacing-8);
  --spacing-gap-xl: var(--spacing-12);
}


/* ISR France — Shadow & Elevation System (v2)
 * Warm, burgundy-tinted shadows (not neutral black) for a softer, branded depth.
 */

:root {
  /* Neutral elevation (kept for utility) */
  --shadow-xs: 0 1px 2px rgba(42, 18, 32, 0.06);
  --shadow-sm: 0 2px 6px rgba(42, 18, 32, 0.08);
  --shadow-md: 0 8px 20px rgba(42, 18, 32, 0.10);
  --shadow-lg: 0 16px 36px rgba(42, 18, 32, 0.14);
  --shadow-xl: 0 28px 60px rgba(42, 18, 32, 0.18);

  /* Warm accent shadow (for hovered/branded cards) */
  --shadow-warm-sm: 0 6px 16px rgba(255, 140, 26, 0.14);
  --shadow-warm-md: 0 18px 40px rgba(230, 76, 126, 0.18);

  /* Component-specific */
  --shadow-button: 0 4px 12px rgba(255, 140, 26, 0.22);
  --shadow-button-hover: 0 10px 22px rgba(255, 140, 26, 0.30);
  --shadow-card: var(--shadow-md);
  --shadow-card-hover: var(--shadow-lg);
  --shadow-dropdown: var(--shadow-lg);
  --shadow-modal: var(--shadow-xl);

  /* Focus ring */
  --shadow-focus: 0 0 0 3px rgba(255, 140, 26, 0.28);
  --shadow-focus-error: 0 0 0 3px rgba(230, 57, 70, 0.22);

  /* Inset */
  --shadow-inset-sm: inset 0 1px 2px rgba(42, 18, 32, 0.06);
}


/* ISR France — Size & Radius System (v2)
 * Slightly larger radii for a softer, contemporary card language.
 */

:root {
  --radius-0: 0;
  --radius-sm: 0.375rem;  /* 6px */
  --radius-md: 0.625rem;  /* 10px */
  --radius-lg: 0.875rem;  /* 14px */
  --radius-xl: 1.25rem;   /* 20px */
  --radius-2xl: 1.75rem;  /* 28px */
  --radius-3xl: 2.25rem;  /* 36px */
  --radius-full: 9999px;

  --radius-button: var(--radius-full);
  --radius-input: var(--radius-md);
  --radius-card: var(--radius-xl);
  --radius-modal: var(--radius-2xl);
  --radius-image: var(--radius-xl);

  --size-touch-target: 44px;

  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;

  --max-width-content: 1240px;
  --max-width-wide: 1400px;
  --max-width-prose: 68ch;

  --border-width-thin: 1px;
  --border-width-normal: 1px;
  --border-width-thick: 2px;
}


/* ISR France — Animation & Motion System (v2)
 * Sober, professional micro-interactions: fade/slide reveals, gentle lifts.
 * No bounces, rotations, or playful easings. All motion honours
 * prefers-reduced-motion (durations collapse to 0 and reveals show instantly).
 */

:root {
  /* Durations */
  --transition-fast: 150ms;    /* @kind other */
  --transition-base: 250ms;    /* @kind other */
  --transition-slow: 400ms;    /* @kind other */
  --transition-reveal: 700ms;  /* @kind other */

  /* Easing */
  --ease-in: cubic-bezier(0.4, 0, 1, 1);          /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);       /* @kind other */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);     /* @kind other */
  --ease-brand: cubic-bezier(0.22, 1, 0.36, 1);    /* @kind other */

  /* Composed transitions */
  --transition-color: color var(--transition-base) var(--ease-in-out);       /* @kind other */
  --transition-background: background-color var(--transition-base) var(--ease-in-out); /* @kind other */
  --transition-opacity: opacity var(--transition-base) var(--ease-in-out);   /* @kind other */
  --transition-transform: transform var(--transition-base) var(--ease-brand);/* @kind other */
  --transition-all: all var(--transition-base) var(--ease-brand);            /* @kind other */

  /* Hover lift distances */
  --lift-card: -6px;      /* @kind other */
  --lift-button: -2px;    /* @kind other */
  --scale-card-hover: 1.02; /* @kind other */
}

/* Scroll-reveal utility — pages add [data-reveal]; an IntersectionObserver
 * (or the no-JS fallback below) toggles .is-visible. CSS-only motion. */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--transition-reveal) var(--ease-brand),
              transform var(--transition-reveal) var(--ease-brand);
  will-change: opacity, transform;
}
[data-reveal].is-visible { opacity: 1; transform: none; }
[data-reveal][data-reveal-delay="1"] { transition-delay: 90ms; }
[data-reveal][data-reveal-delay="2"] { transition-delay: 180ms; }
[data-reveal][data-reveal-delay="3"] { transition-delay: 270ms; }
[data-reveal][data-reveal-delay="4"] { transition-delay: 360ms; }

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;    /* @kind other */
    --transition-base: 0ms;    /* @kind other */
    --transition-slow: 0ms;    /* @kind other */
    --transition-reveal: 0ms;  /* @kind other */
    --lift-card: 0px;          /* @kind other */
    --lift-button: 0px;        /* @kind other */
    --scale-card-hover: 1;     /* @kind other */
  }
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}


/* ISR France Design System — root stylesheet (v2)
 * Consumers link this single file. Imports all tokens + global base.
 */


*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
  text-size-adjust: 100%;
}

body { margin: 0; padding: 0; }

img, svg, video { max-width: 100%; height: auto; display: block; }

p, h1, h2, h3, h4, h5, h6 { text-wrap: pretty; }

:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-radius: var(--radius-sm);
}

::selection { background: var(--color-primary-blush); color: var(--color-primary-burgundy); }


/* ISR France — site page styles (v2). Portable static CSS built on the design
 * tokens (styles.css). Used by all page templates. No JS-injected styles here. */

.container{max-width:var(--max-width-content);margin:0 auto;padding-left:var(--spacing-6);padding-right:var(--spacing-6);width:100%}
.section{padding:var(--spacing-24) 0;position:relative}
.section--tight{padding:var(--spacing-16) 0}
.section--ivory{background:var(--color-bg-secondary)}
.section--blush{background:var(--color-primary-blush)}
.section--burgundy{background:var(--gradient-burgundy);color:var(--color-text-inverse)}
.eyebrow{display:inline-flex;align-items:center;gap:.55em;font-size:var(--font-size-overline);font-weight:var(--font-weight-overline);letter-spacing:var(--letter-spacing-overline);text-transform:uppercase;color:var(--color-primary-magenta)}
.eyebrow::before{content:"";width:1.75rem;height:2px;background:currentColor;border-radius:2px}
.eyebrow--plain::before{display:none}
.section--burgundy .eyebrow{color:var(--color-primary-orange)}
.section-head{display:flex;flex-direction:column;gap:var(--spacing-4);max-width:var(--max-width-prose);margin-bottom:var(--spacing-14)}
.section-head--center{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
.section-title{font-family:var(--font-serif);font-size:var(--font-size-display-md);line-height:var(--line-height-display-md);font-weight:700;color:inherit}
.section-intro{font-size:var(--font-size-body-lg);line-height:1.65;color:var(--color-text-secondary)}
.section--burgundy .section-intro{color:var(--color-primary-blush)}
.prose{max-width:var(--max-width-prose);font-size:var(--font-size-body-lg);line-height:1.7;color:var(--color-text-secondary)}
.prose h2{font-family:var(--font-serif);font-size:var(--font-size-h2);color:var(--color-text-primary);margin:var(--spacing-12) 0 var(--spacing-4)}
.prose h3{font-family:var(--font-serif);font-size:var(--font-size-h3);color:var(--color-text-primary);margin:var(--spacing-8) 0 var(--spacing-3)}
.prose p{margin:0 0 var(--spacing-4)}
.prose ul{margin:0 0 var(--spacing-4);padding-left:1.3rem}
.prose li{margin:0 0 var(--spacing-2)}
.prose a{color:var(--color-primary-orange);text-decoration:underline}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;font-family:var(--font-sans);font-weight:600;font-size:var(--font-size-button);line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer;padding:var(--spacing-3) var(--spacing-6);border-radius:var(--radius-full);border:2px solid transparent;min-height:var(--size-touch-target);transition:transform var(--transition-base) var(--ease-brand),box-shadow var(--transition-base) var(--ease-brand),background-color var(--transition-base) var(--ease-in-out),color var(--transition-base) var(--ease-in-out),border-color var(--transition-base) var(--ease-in-out)}
.btn:hover{transform:translateY(var(--lift-button));text-decoration:none}
.btn--primary{background:var(--color-primary-orange);color:#fff;box-shadow:var(--shadow-button)}
.btn--primary:hover{background:var(--color-orange-dark);color:#fff;box-shadow:var(--shadow-button-hover)}
.btn--secondary{background:transparent;color:var(--color-primary-orange);border-color:var(--color-primary-orange)}
.btn--secondary:hover{background:var(--color-blush-050);color:var(--color-orange-dark);border-color:var(--color-orange-dark)}
.btn--ghost{background:transparent;color:var(--color-text-primary);border-color:var(--color-border-medium)}
.btn--ghost:hover{background:var(--color-neutral-100)}
.btn--dark{background:var(--color-primary-burgundy);color:#fff}
.btn--dark:hover{background:var(--color-burgundy-light);box-shadow:var(--shadow-md)}
.btn--on-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn--on-dark:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn--lg{padding:1rem 2rem;font-size:var(--font-size-body-lg);min-height:54px}
.btn--block{display:flex;width:100%}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--color-border-light);transition:box-shadow var(--transition-base) var(--ease-in-out)}
.site-header.is-scrolled{box-shadow:var(--shadow-sm)}
.site-header__inner{max-width:var(--max-width-content);margin:0 auto;display:flex;align-items:center;gap:var(--spacing-6);padding:var(--spacing-3) var(--spacing-6)}
.site-header__brand{display:flex;align-items:center;flex:0 0 auto}
.site-header__brand img{height:84px;width:auto}
.site-nav{display:none;align-items:center;gap:var(--spacing-6);margin-left:auto}
.site-nav a{font-size:var(--font-size-body-sm);font-weight:500;color:var(--color-text-primary);text-decoration:none;position:relative;padding:.25rem 0}
.site-nav a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:var(--gradient-warm);border-radius:2px;transition:width var(--transition-base) var(--ease-brand)}
.site-nav a:hover{color:var(--color-orange-dark);text-decoration:none}
.site-nav a:hover::after,.site-nav a.is-active::after{width:100%}
.site-nav a.is-active{color:var(--color-primary-orange)}
.site-header__cta{display:none;margin-left:var(--spacing-2)}
.burger{all:unset;margin-left:auto;display:inline-grid;place-content:center;width:44px;height:44px;cursor:pointer;color:var(--color-primary-burgundy);border-radius:var(--radius-md)}
.burger:focus-visible{box-shadow:var(--shadow-focus)}
.mobile-nav{display:none;flex-direction:column;padding:var(--spacing-4) var(--spacing-6) var(--spacing-6);border-top:1px solid var(--color-border-light);background:#fff}
.mobile-nav.is-open{display:flex}
.mobile-nav a{padding:var(--spacing-3) 0;font-weight:500;color:var(--color-text-primary);text-decoration:none;border-bottom:1px solid var(--color-border-light)}
.mobile-nav .btn{margin-top:var(--spacing-4)}
@media(min-width:960px){.site-nav{display:flex}.site-header__cta{display:inline-flex}.burger{display:none}.mobile-nav{display:none!important}}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--color-primary-burgundy);color:var(--color-text-inverse)}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:100%;object-fit:cover}
.hero__overlay{position:absolute;inset:0;z-index:1;background:var(--overlay-hero)}
.hero__inner{position:relative;z-index:2;max-width:var(--max-width-content);margin:0 auto;padding:clamp(5rem,10vw,8.5rem) var(--spacing-6);display:flex;flex-direction:column;gap:var(--spacing-5)}
.hero__content{max-width:60ch;display:flex;flex-direction:column;gap:var(--spacing-5)}
.hero__eyebrow{display:inline-flex;align-items:center;gap:.6em;width:fit-content;font-size:var(--font-size-overline);font-weight:var(--font-weight-overline);letter-spacing:var(--letter-spacing-overline);text-transform:uppercase;color:var(--color-primary-orange);background:rgba(255,140,26,.12);border:1px solid rgba(255,140,26,.35);padding:.5rem 1rem;border-radius:var(--radius-full)}
.hero__title{font-family:var(--font-serif);font-size:var(--font-size-display-lg);line-height:var(--line-height-display-lg);font-weight:700;letter-spacing:-.01em;margin:0;color:var(--color-primary-blush)}
.hero__title-accent{display:inline-block;background:var(--gradient-warm);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero__lead{font-size:var(--font-size-body-lg);line-height:1.65;color:var(--color-primary-blush);max-width:56ch}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--spacing-4);margin-top:var(--spacing-2)}
.hero--compact .hero__inner{padding:clamp(3.5rem,7vw,5.5rem) var(--spacing-6)}
.hero__stats{display:flex;flex-wrap:wrap;gap:clamp(1.5rem,4vw,3.5rem);margin-top:var(--spacing-6);padding-top:var(--spacing-8);border-top:1px solid rgba(240,213,208,.25)}
.hero__stat{display:flex;flex-direction:column;gap:.15rem}
.hero__stat b{font-family:var(--font-serif);font-size:clamp(1.9rem,3.4vw,2.6rem);font-weight:700;line-height:1;color:var(--color-primary-orange)}
.hero__stat span{font-size:var(--font-size-body-sm);color:var(--color-primary-blush)}

/* Cards */
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--color-border-light);border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden;position:relative;transition:transform var(--transition-base) var(--ease-brand),box-shadow var(--transition-base) var(--ease-brand)}
.card--interactive:hover{transform:translateY(var(--lift-card)) scale(var(--scale-card-hover));box-shadow:var(--shadow-card-hover)}
.card--interactive:hover .card__media img{transform:scale(1.05)}
.card__media{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--color-neutral-100)}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow) var(--ease-brand)}
.card__body{display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-card-padding);flex:1}
.card__eyebrow{font-size:var(--font-size-overline);font-weight:var(--font-weight-overline);letter-spacing:var(--letter-spacing-overline);text-transform:uppercase;color:var(--color-primary-magenta)}
.card__title{font-family:var(--font-serif);font-size:var(--font-size-h3);font-weight:700;line-height:1.2;color:var(--color-text-primary)}
.card__desc{font-size:var(--font-size-body);color:var(--color-text-secondary);line-height:1.6}
.card__list{margin:var(--spacing-1) 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--spacing-2)}
.card__list li{position:relative;padding-left:1.5rem;font-size:var(--font-size-body-sm);color:var(--color-text-secondary);line-height:1.55}
.card__list li::before{content:"";position:absolute;left:0;top:.5em;width:.5rem;height:.5rem;border-radius:50%;background:var(--gradient-warm)}
.card__footer{margin-top:auto;padding-top:var(--spacing-4)}

/* Grids */
.grid{display:grid;gap:var(--spacing-8)}
.grid--3{grid-template-columns:1fr}
.grid--2{grid-template-columns:1fr}
.grid--4{grid-template-columns:1fr 1fr}
@media(min-width:680px){.grid--3{grid-template-columns:1fr 1fr}.grid--2{grid-template-columns:1fr 1fr}.grid--4{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1000px){.grid--3{grid-template-columns:repeat(3,1fr)}}

/* Split feature row (alternating) */
.feature{display:grid;gap:var(--spacing-10);align-items:center;grid-template-columns:1fr}
.feature+.feature{margin-top:var(--spacing-16)}
.feature__media{border-radius:var(--radius-2xl);overflow:hidden;box-shadow:var(--shadow-lg);position:relative}
.feature__media img{width:100%;height:100%;object-fit:cover;display:block}
.feature__list{margin:var(--spacing-4) 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--spacing-3)}
.feature__list li{position:relative;padding-left:1.75rem;line-height:1.6}
.feature__list li::before{content:"";position:absolute;left:0;top:.5em;width:.7rem;height:.7rem;border-radius:50%;background:var(--gradient-warm)}
.section--burgundy .feature__list li{color:var(--color-primary-blush)}
@media(min-width:900px){.feature{grid-template-columns:1fr 1fr;gap:var(--spacing-16)}.feature--reverse .feature__media{order:2}}

/* Steps */
.steps{display:grid;gap:var(--spacing-8);grid-template-columns:1fr}
@media(min-width:760px){.steps--3{grid-template-columns:repeat(3,1fr)}}
.step{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--color-border-light);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-card);transition:transform var(--transition-base) var(--ease-brand),box-shadow var(--transition-base) var(--ease-brand)}
.step:hover{transform:translateY(var(--lift-card));box-shadow:var(--shadow-card-hover)}
.step:hover .step__media img{transform:scale(1.05)}
.step__media{position:relative;z-index:1;aspect-ratio:3/2;overflow:visible;background:var(--color-neutral-100)}
.step__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow) var(--ease-brand)}
.step__media::after{content:"";position:absolute;inset:0;background:var(--overlay-card);opacity:.5}
.step__num{position:absolute;z-index:2;left:var(--spacing-5);bottom:calc(-1 * var(--spacing-6));width:3.25rem;height:3.25rem;display:grid;place-content:center;border-radius:var(--radius-full);font-family:var(--font-serif);font-size:1.5rem;font-weight:700;color:#fff;background:var(--gradient-warm);box-shadow:var(--shadow-button);border:3px solid #fff}
.step__body{display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-10) var(--spacing-6) var(--spacing-6)}
.step__title{font-family:var(--font-serif);font-size:var(--font-size-h3);font-weight:700;line-height:1.2;color:var(--color-text-primary)}
.step__desc{font-size:var(--font-size-body);color:var(--color-text-secondary);line-height:1.6}

/* Badge / tagline pill */
.badge{display:inline-flex;align-items:center;gap:.4em;font-size:var(--font-size-caption);font-weight:600;letter-spacing:.02em;padding:.4rem .7rem;border-radius:var(--radius-full);border:1px solid var(--color-blush-300);background:var(--color-blush-100);color:var(--color-orange-dark)}

/* Accordion */
.acc{display:flex;flex-direction:column;gap:var(--spacing-3)}
.acc__item{border:1px solid var(--color-border-light);border-radius:var(--radius-lg);background:#fff;overflow:hidden;transition:box-shadow var(--transition-base) var(--ease-brand),border-color var(--transition-base) var(--ease-in-out)}
.acc__item.is-open{border-color:var(--color-blush-300);box-shadow:var(--shadow-sm)}
.acc__trigger{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4);width:100%;cursor:pointer;padding:var(--spacing-5) var(--spacing-6);font-size:var(--font-size-h5);font-weight:600;color:var(--color-text-primary);line-height:1.4}
.acc__trigger:hover{color:var(--color-orange-dark)}
.acc__trigger:focus-visible{box-shadow:var(--shadow-focus);border-radius:var(--radius-md)}
.acc__icon{flex:0 0 auto;width:1.5rem;height:1.5rem;position:relative;color:var(--color-primary-orange)}
.acc__icon::before,.acc__icon::after{content:"";position:absolute;top:50%;left:50%;width:.8rem;height:2px;background:currentColor;border-radius:2px;transform:translate(-50%,-50%);transition:transform var(--transition-base) var(--ease-brand)}
.acc__icon::after{transform:translate(-50%,-50%) rotate(90deg)}
.acc__item.is-open .acc__icon::after{transform:translate(-50%,-50%) rotate(0)}
.acc__panel{max-height:0;overflow:hidden;transition:max-height var(--transition-slow) var(--ease-brand)}
.acc__inner{padding:0 var(--spacing-6) var(--spacing-6);color:var(--color-text-secondary);font-size:var(--font-size-body);line-height:1.7}
.acc__inner p{margin:0 0 var(--spacing-3)}.acc__inner p:last-child{margin:0}
.acc__inner ul{margin:0 0 var(--spacing-3);padding-left:1.2rem}.acc__inner li{margin-bottom:.4rem}

/* Testimonials */
.quote{display:flex;flex-direction:column;gap:var(--spacing-4);background:#fff;border:1px solid var(--color-border-light);border-radius:var(--radius-xl);padding:var(--spacing-8);box-shadow:var(--shadow-card);height:100%}
.quote__stars{color:var(--color-primary-orange);letter-spacing:.05em;font-size:1.05rem}
.quote__text{font-family:var(--font-serif);font-size:var(--font-size-h4);font-style:italic;line-height:1.5;color:var(--color-text-primary);margin:0}
.quote__foot{display:flex;align-items:center;gap:var(--spacing-4);margin-top:auto}
.quote__avatar{width:3rem;height:3rem;border-radius:var(--radius-full);background:var(--gradient-warm);display:grid;place-content:center;color:#fff;font-weight:700}
.quote__name{font-weight:600;color:var(--color-text-primary)}
.quote__role{font-size:var(--font-size-body-sm);color:var(--color-text-secondary)}

/* Forms */
.field{display:flex;flex-direction:column;gap:var(--spacing-2);margin-bottom:var(--spacing-5)}
.field label{font-size:var(--font-size-label);font-weight:500;color:var(--color-text-primary)}
.field .req{color:var(--color-error)}
.field input,.field select,.field textarea{font-family:var(--font-sans);font-size:var(--font-size-body);color:var(--color-text-primary);background:#fff;border:1.5px solid var(--color-border-medium);border-radius:var(--radius-input);padding:var(--spacing-3) var(--spacing-4);min-height:var(--size-touch-target);width:100%;transition:border-color var(--transition-base) var(--ease-in-out),box-shadow var(--transition-base) var(--ease-in-out),background-color var(--transition-base) var(--ease-in-out)}
.field textarea{min-height:130px;resize:vertical;line-height:1.6}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--color-primary-orange);background:var(--color-blush-050);box-shadow:var(--shadow-focus)}
.field-grid{display:grid;gap:0 var(--spacing-5);grid-template-columns:1fr}
@media(min-width:620px){.field-grid{grid-template-columns:1fr 1fr}}
.consent{display:flex;align-items:flex-start;gap:var(--spacing-3);font-size:var(--font-size-body-sm);color:var(--color-text-secondary);line-height:1.5;margin-bottom:var(--spacing-5)}
.consent input{width:1.35rem;height:1.35rem;margin-top:2px;accent-color:var(--color-primary-orange);flex:0 0 auto}
.form-card{background:#fff;border:1px solid var(--color-border-light);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);padding:clamp(1.5rem,4vw,3rem)}

/* Formulaires : états d'erreur */
.form-contact .field .is-error,.form-contact .field [aria-invalid="true"]{border-color:var(--color-error);background:var(--color-blush-050)}
.form-contact .field .is-error:focus,.form-contact .field [aria-invalid="true"]:focus{border-color:var(--color-error);box-shadow:var(--shadow-focus-error)}
.news-form .news-row .is-error,.news-form .news-row [aria-invalid="true"]{border:1.5px solid var(--color-error);background:#fff}
.news-form .news-row .is-error:focus,.news-form .news-row [aria-invalid="true"]:focus{box-shadow:var(--shadow-focus-error)}
.form-contact .consent:has(.is-error),.news-form .news-consent:has(.is-error){color:var(--color-error)}
.form-contact .consent .is-error,.news-form .news-consent .is-error{accent-color:var(--color-error)}

/* Footer */
.site-footer{background:var(--gradient-burgundy);color:var(--color-primary-blush)}
.site-footer__news{border-bottom:1px solid rgba(240,213,208,.15)}
.site-footer__inner{max-width:var(--max-width-content);margin:0 auto;padding:var(--spacing-16) var(--spacing-6)}
.news-grid{display:grid;gap:var(--spacing-8);align-items:center;grid-template-columns:1fr}
@media(min-width:820px){.news-grid{grid-template-columns:1fr 1fr}}
.news-grid h3{font-family:var(--font-serif);font-size:var(--font-size-display-sm);color:#fff;text-transform:uppercase;letter-spacing:.02em;margin:0 0 var(--spacing-3)}
.news-grid p{color:var(--color-primary-blush);max-width:44ch;line-height:1.6}
.news-form{display:flex;flex-direction:column;gap:var(--spacing-3)}
.news-row{display:flex;gap:var(--spacing-3);flex-wrap:wrap}
.news-row input{flex:1;min-width:220px;background:rgba(255,255,255,.96);border:none;border-radius:var(--radius-input);padding:var(--spacing-3) var(--spacing-4);min-height:var(--size-touch-target);font-family:var(--font-sans)}
.news-consent{display:flex;align-items:flex-start;gap:var(--spacing-3);font-size:var(--font-size-body-sm);color:var(--color-primary-blush);line-height:1.5}
.news-consent input{width:1.2rem;height:1.2rem;margin-top:2px;accent-color:var(--color-primary-orange);flex:0 0 auto}
.news-consent a{color:var(--color-primary-orange)}
.footer-main{display:grid;gap:var(--spacing-10);grid-template-columns:1fr}
@media(min-width:760px){.footer-main{grid-template-columns:1.6fr 1fr 1fr}}
.footer-brand img{height:96px;width:auto;margin-bottom:var(--spacing-4);filter:brightness(0) invert(1)}
.footer-brand p{color:var(--color-primary-blush);max-width:38ch;line-height:1.6;font-size:var(--font-size-body-sm)}
.footer-col h4{font-size:var(--font-size-overline);text-transform:uppercase;letter-spacing:var(--letter-spacing-overline);color:#fff;font-weight:600;margin:0 0 var(--spacing-4)}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spacing-3)}
.footer-col a{color:var(--color-primary-blush);text-decoration:none;font-size:var(--font-size-body-sm)}
.footer-col a:hover{color:#fff;text-decoration:underline}
.footer-bar{border-top:1px solid rgba(240,213,208,.15)}
.footer-bar__inner{max-width:var(--max-width-content);margin:0 auto;padding:var(--spacing-6);display:flex;flex-wrap:wrap;gap:var(--spacing-3);justify-content:space-between;align-items:center;font-size:var(--font-size-body-sm);color:var(--color-primary-blush)}

/* Misc */
.center{text-align:center}
.mt-2{margin-top:var(--spacing-8)}
.refs{display:flex;justify-content:center;background:#fff;border-radius:var(--radius-2xl);border:1px solid var(--color-border-light);box-shadow:var(--shadow-sm);padding:clamp(1.5rem,4vw,3rem)}
.refs img{max-width:min(900px,100%);height:auto}
.lead-block{max-width:var(--max-width-prose)}
.intro-quote{font-family:var(--font-serif);font-size:var(--font-size-display-sm);line-height:1.4;color:var(--color-primary-burgundy);font-weight:600}
.empty-state{text-align:center;padding:var(--spacing-16);background:var(--color-bg-secondary);border:1px dashed var(--color-border-medium);border-radius:var(--radius-2xl);color:var(--color-text-secondary)}
.contact-item{display:flex;gap:var(--spacing-4);align-items:flex-start;margin-bottom:var(--spacing-6)}
.contact-item .k{font-size:var(--font-size-overline);text-transform:uppercase;letter-spacing:var(--letter-spacing-overline);color:var(--color-primary-magenta);font-weight:600;margin-bottom:.2rem}
.contact-item .v{font-size:var(--font-size-body-lg);color:var(--color-text-primary)}
.embed-slot{min-height:640px;border-radius:var(--radius-2xl);border:1px dashed var(--color-border-medium);background:transparent;display:grid;place-content:center;text-align:center;color:var(--color-text-secondary);padding:var(--spacing-8)}
/* Cal.com embed: override grid constraint to force desktop layout.
 * display:block on .embed-slot--cal removes place-content:center width constraint.
 * min-width:768px on iframe prevents Cal.com from detecting mobile viewport.
 * overflow-x:auto on #isr-cal-inline scrolls horizontally on narrow parent screens.
 * min-width:800px on iframe applied only >=768px (desktop) to force desktop layout
 * without breaking the responsive mobile layout (<768px : iframe takes natural width
 * <768px -> Cal.com detects mobile -> responsive slots). Cal.com mobile threshold is
 * matchMedia("(max-width:768px)") so 800px gives a safe margin above it. */
.embed-slot--cal{display:block}
#isr-cal-inline{width:100%;overflow-x:auto}
#isr-cal-inline iframe{width:100% !important;min-height:640px !important}
@media(min-width:768px){#isr-cal-inline iframe{min-width:800px !important}}


a{color:var(--color-primary-orange)}a:hover{color:var(--color-orange-dark)}