/* ============================================================================
   Kashmir Palace — « Palais indien épicé — teal paon, or safran, ornements »
   Archétype : restaurant indien chaleureux & ornemental (esprit « Palace »).
   Palette : Teal-paon #124A46 + Or-safran #D9A441 + Terracotta-épice #C0562F,
            fond crème #FBF3E1.
   Fonts : Rozha One (display, héritage indien/didone) / Commissioner (body).
   Signature : MANDALA (rosette ornementale) + arches + doubles filets d'or.
   Bootstrap = squelette ; ce fichier = toute la peau. Aucune classe custom.
   ========================================================================== */

:root {
  --teal: #124A46;
  --teal-800: #0E3A37;
  --teal-900: #0A2A28;
  --teal-050: #E3EEEC;
  --or: #D9A441;
  --or-700: #B4842A;
  --or-050: #F6EAD1;
  --terra: #C0562F;
  --terra-700: #9E4322;
  --creme: #FBF3E1;
  --creme-2: #F3E7C7;
  --paper: #FFFCF3;
  --tinta: #2B2519;
  --muted: #6E6553;
  --line: #E6D9B9;

  --bs-primary: #C0562F;
  --bs-primary-rgb: 192, 86, 47;
  --bs-secondary: #D9A441;
  --bs-secondary-rgb: 217, 164, 65;
  --bs-body-color: #2B2519;
  --bs-body-bg: #FBF3E1;
  --bs-body-font-family: 'Commissioner', system-ui, -apple-system, sans-serif;
  --bs-border-color: #E6D9B9;
  --bs-link-color: #9E4322;
  --bs-link-hover-color: #124A46;

  /* MANDALA (rosette ornementale, signature) en data-URI */
  --mandala: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23D9A441' stroke-width='1.3'%3E%3Ccircle cx='20' cy='20' r='16.5'/%3E%3Ccircle cx='20' cy='20' r='9'/%3E%3C/g%3E%3Cg fill='%23D9A441'%3E%3Ccircle cx='20' cy='20' r='3'/%3E%3Ccircle cx='20' cy='3.5' r='1.7'/%3E%3Ccircle cx='20' cy='36.5' r='1.7'/%3E%3Ccircle cx='3.5' cy='20' r='1.7'/%3E%3Ccircle cx='36.5' cy='20' r='1.7'/%3E%3Ccircle cx='8.3' cy='8.3' r='1.4'/%3E%3Ccircle cx='31.7' cy='8.3' r='1.4'/%3E%3Ccircle cx='8.3' cy='31.7' r='1.4'/%3E%3Ccircle cx='31.7' cy='31.7' r='1.4'/%3E%3C/g%3E%3C/svg%3E");
  --mandala-cream: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23F3E7C7' stroke-width='1.3'%3E%3Ccircle cx='20' cy='20' r='16.5'/%3E%3Ccircle cx='20' cy='20' r='9'/%3E%3C/g%3E%3Cg fill='%23F3E7C7'%3E%3Ccircle cx='20' cy='20' r='3'/%3E%3Ccircle cx='20' cy='3.5' r='1.7'/%3E%3Ccircle cx='20' cy='36.5' r='1.7'/%3E%3Ccircle cx='3.5' cy='20' r='1.7'/%3E%3Ccircle cx='36.5' cy='20' r='1.7'/%3E%3C/g%3E%3C/svg%3E");

  --shadow-soft: 0 3px 8px rgba(10, 42, 40, .07), 0 22px 46px -28px rgba(10, 42, 40, .34);
  --shadow-lift: 0 8px 18px rgba(10, 42, 40, .14), 0 34px 62px -30px rgba(18, 74, 70, .42);
  --r: 14px;
}

/* ------------------------------------------------------------------ base */
body {
  background-color: var(--creme);
  background-image:
    radial-gradient(1000px 440px at 88% -6%, rgba(217, 164, 65, .16), transparent 60%),
    radial-gradient(820px 400px at -6% 100%, rgba(18, 74, 70, .08), transparent 60%);
  color: var(--tinta);
}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
  font-family: 'Rozha One', Georgia, serif;
  font-weight: 400;
  letter-spacing: .2px;
  color: var(--teal);
  line-height: 1.14;
}
p { line-height: 1.75; }
a { text-decoration: none; }
::selection { background: rgba(217, 164, 65, .5); }
.container { max-width: 1180px; }

/* ornement mandala réutilisable */
#ornament { display: inline-block; width: 22px; height: 22px; background: var(--mandala) center/contain no-repeat; flex-shrink: 0; }

/* kicker */
#section-kicker, #hero-eyebrow {
  font-family: 'Commissioner', sans-serif;
  font-weight: 700;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--or-700);
  align-items: center;
}

/* ------------------------------------------------------------------ topbar */
#topbar { background: var(--teal-900); color: #E6DFCB; font-weight: 500; }
#topbar a { color: var(--or); }
#topbar-tel:hover, #topbar-uber:hover { color: #fff; }
#topbar i { color: var(--or); }
#topbar-uber { text-transform: uppercase; letter-spacing: .5px; font-size: .72rem; font-weight: 700; }

/* ------------------------------------------------------------------ navbar */
.navbar {
  background: rgba(251, 243, 225, .94);
  backdrop-filter: saturate(140%) blur(10px);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 0 var(--or-050);
}
#brand-mandala { width: 34px; height: 34px; background: var(--mandala) center/contain no-repeat; }
#brand-word { font-family: 'Rozha One', serif; font-size: 1.5rem; color: var(--teal); letter-spacing: .5px; }
.navbar .nav-link {
  font-family: 'Commissioner', sans-serif;
  font-weight: 600;
  color: var(--tinta);
  padding: .5rem .85rem;
  position: relative;
}
.navbar .nav-link::after {
  content: '';
  position: absolute; left: .85rem; right: .85rem; bottom: .3rem;
  height: 2px; background: var(--or);
  transform: scaleX(0); transform-origin: left;
  transition: transform .26s ease;
}
.navbar .nav-link:hover, .navbar .nav-link:focus { color: var(--terra-700); }
.navbar .nav-link:hover::after, .navbar .nav-link:focus::after { transform: scaleX(1); }

/* ------------------------------------------------------------------ boutons */
.btn { font-family: 'Commissioner', sans-serif; font-weight: 700; border-radius: 8px; letter-spacing: .3px; transition: transform .2s ease, box-shadow .2s ease, background-color .2s; }
.btn-lg { padding: .82rem 1.7rem; }
.btn-primary {
  --bs-btn-bg: var(--terra);
  --bs-btn-border-color: var(--terra);
  --bs-btn-hover-bg: var(--terra-700);
  --bs-btn-hover-border-color: var(--terra-700);
  --bs-btn-active-bg: var(--terra-700);
  --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff;
  box-shadow: 0 10px 22px -12px rgba(158, 67, 34, .85);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -14px rgba(158, 67, 34, .9); }
.btn-outline-primary {
  --bs-btn-color: var(--teal);
  --bs-btn-border-color: var(--teal);
  --bs-btn-hover-bg: var(--teal);
  --bs-btn-hover-border-color: var(--teal);
  --bs-btn-hover-color: var(--or);
  --bs-btn-active-bg: var(--teal-800);
  border-width: 2px;
}
.btn-outline-primary:hover { transform: translateY(-2px); }
.btn-outline-light { --bs-btn-border-color: var(--or); --bs-btn-color: var(--or); --bs-btn-hover-bg: var(--or); --bs-btn-hover-color: var(--teal-900); --bs-btn-hover-border-color: var(--or); border-width: 2px; }
.btn-outline-light:hover { transform: translateY(-2px); }

/* ------------------------------------------------------------------ hero */
#top { background: var(--teal-900); }
#hero-media img { filter: contrast(1.04) saturate(1.05) brightness(.92); }
#hero-veil { background: radial-gradient(120% 90% at 50% 20%, rgba(10, 42, 40, .55), rgba(10, 42, 40, .86)), linear-gradient(180deg, rgba(10, 42, 40, .6), rgba(10, 42, 40, .9)); }
#hero-eyebrow { color: var(--or); justify-content: center; }
#hero-eyebrow #ornament { background-image: var(--mandala); }
#hero-title { font-size: clamp(2.6rem, 6vw, 4.6rem); color: var(--creme); }
#hero-sub { font-family: 'Rozha One', serif; color: var(--or); font-size: 1.5rem; }
#hero-lead { color: rgba(251, 243, 225, .85); font-size: 1.1rem; }

/* ------------------------------------------------------------------ features */
#features { position: relative; }
#feature-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--shadow-soft);
  position: relative;
  transition: transform .2s ease, box-shadow .2s ease;
}
#feature-card::before { content: ''; position: absolute; inset: 8px; border: 1px solid var(--or-050); border-radius: calc(var(--r) - 6px); pointer-events: none; }
#feature-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lift); }
#feature-icon {
  width: 68px; height: 68px;
  border-radius: 50%;
  background: var(--teal);
  color: var(--or);
  font-size: 1.7rem;
  box-shadow: inset 0 0 0 3px rgba(217, 164, 65, .35);
}
#feature-title { color: var(--teal); }
#feature-text { color: var(--muted); }

/* ------------------------------------------------------------------ histoire */
#histoire-figure {
  overflow: hidden;
  border: 6px solid #fff;
  border-radius: 180px 180px var(--r) var(--r);
  box-shadow: var(--shadow-lift);
  position: relative;
}
#histoire-figure::after { content: ''; position: absolute; inset: 6px; border: 2px solid rgba(217, 164, 65, .55); border-radius: 174px 174px 8px 8px; pointer-events: none; }
#histoire-figure img { display: block; width: 100%; object-fit: cover; }
#histoire-title { font-size: clamp(2rem, 3.6vw, 2.8rem); }
#histoire-text { color: var(--muted); }
#histoire-accroche { color: var(--teal); }

/* ------------------------------------------------------------------ menu (aperçu + complet) */
#menu-preview-title, #cat-title { font-family: 'Rozha One', serif; }
#menu-preview-title { font-size: clamp(2rem, 3.8vw, 2.8rem); }
#cat-title {
  color: var(--terra-700);
  display: inline-flex; align-items: center; gap: .7rem;
  padding-bottom: .5rem;
  border-bottom: 2px solid var(--or);
}
#cat-ornament { display: inline-block; width: 24px; height: 24px; background: var(--mandala) center/contain no-repeat; }
#dish-row {
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 4px solid var(--or);
  border-radius: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .16s ease, box-shadow .16s ease, border-left-color .16s;
  align-items: flex-start;
}
#dish-row:hover { transform: translateX(3px); box-shadow: var(--shadow-lift); border-left-color: var(--terra); }
#dish-name { font-family: 'Commissioner', sans-serif; font-weight: 700; color: var(--teal); }
#dish-desc { color: var(--muted); }
#dish-price { font-family: 'Rozha One', serif; color: #fff; background: var(--teal); padding: .25rem .7rem; border-radius: 100px; font-size: .95rem; white-space: nowrap; }

/* nav catégories (menu) */
#cat-nav { background: var(--teal); box-shadow: 0 4px 16px -8px rgba(10, 42, 40, .5); }
#cat-nav-scroll { scrollbar-width: thin; }
#cat-chip { font-family: 'Commissioner', sans-serif; font-weight: 600; font-size: .8rem; color: var(--creme); border: 1.5px solid rgba(217, 164, 65, .4); border-radius: 100px; padding: .35rem .9rem; white-space: nowrap; transition: background-color .2s, color .2s, border-color .2s; }
#cat-chip:hover { background: var(--or); color: var(--teal-900); border-color: var(--or); }

/* ------------------------------------------------------------------ avis */
#avis-title { font-size: clamp(2rem, 3.6vw, 2.8rem); }
#avis-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--shadow-soft);
  transition: transform .2s ease, box-shadow .2s ease;
}
#avis-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
#avis-stars { color: var(--or); font-size: .85rem; letter-spacing: 2px; }
#avis-text p { color: var(--tinta); font-size: .98rem; }
#avis-author { color: var(--teal); }
#avis-date { color: var(--muted); }

/* ------------------------------------------------------------------ contact */
#contact-title { font-size: clamp(2rem, 3.6vw, 2.8rem); }
#contact-line { color: var(--tinta); }
#contact-line a { color: var(--terra-700); font-weight: 600; }
#coord-icon { color: var(--or-700); flex-shrink: 0; margin-top: .2rem; }
#map-frame { border-radius: var(--r); overflow: hidden; border: 3px solid var(--teal); box-shadow: var(--shadow-soft); }

/* ------------------------------------------------------------------ page menu head */
#page-head { background: var(--teal); color: var(--creme); position: relative; overflow: hidden; }
#page-head::before { content: ''; position: absolute; inset: 0; background-image: var(--mandala-cream); background-size: 120px; opacity: .06; pointer-events: none; }
#page-head .container { position: relative; }
#page-head #hero-eyebrow { color: var(--or); }
#page-head #hero-title { color: var(--creme); font-size: clamp(2.4rem, 5vw, 3.6rem); }
#crumbs { color: rgba(251, 243, 225, .72); }
#crumbs a { color: var(--or); }

/* ------------------------------------------------------------------ seo */
#seo h2 { color: var(--teal); }
#seo p { color: var(--muted); }

/* ------------------------------------------------------------------ footer */
#colophon {
  background: var(--teal-900);
  color: #CFD8D2;
  position: relative;
  border-top: 4px solid var(--or);
}
#colophon::before { content: ''; position: absolute; inset: 0; background-image: var(--mandala-cream); background-size: 84px; opacity: .05; pointer-events: none; }
#colophon .container { position: relative; }
#footer-name { font-family: 'Rozha One', serif; color: var(--or); }
#footer-baseline { color: #E4D9BA; font-weight: 600; }
#footer-head { color: var(--or) !important; letter-spacing: 1px; }
#footer-link { color: rgba(207, 216, 210, .85); }
#footer-link:hover { color: var(--or); }
#footer-note { color: rgba(207, 216, 210, .72); }
#footer-social {
  width: 42px; height: 42px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(217, 164, 65, .35);
  color: #fff;
  font-size: 1.05rem;
  transition: background-color .2s, transform .2s, color .2s;
}
#footer-social:hover { background: var(--or); color: var(--teal-900); transform: translateY(-2px); }
#footer-rule { border-color: rgba(255, 255, 255, .14); }
#copyright { color: rgba(207, 216, 210, .82); }

/* ------------------------------------------------------------------ responsive */
@media (max-width: 575px) {
  #brand-word { font-size: 1.2rem; }
  #histoire-figure { border-radius: 120px 120px var(--r) var(--r); }
  #cat-nav { position: static !important; }
}

/* focus visibles (WCAG) */
a:focus-visible, .btn:focus-visible, .nav-link:focus-visible {
  outline: 3px solid var(--or);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
  .btn:hover, #feature-card:hover, #avis-card:hover, #dish-row:hover { transform: none; }
}