/* ===================================================
   MA'TOUR — HOMEPAGE REFRESH ("moderne épuré")
   Loaded LAST, only on the 4 homepages (EN/FR/IT/ZH).
   Overrides palette + surface treatment only.
   Structure/markup untouched — this file never adds
   or removes layout, only recolors / retypes what is
   already there.
=================================================== */

:root{
    /* -- Refreshed palette: white space + one targeted accent -- */
    --dusk:        #17131E;   /* near-black plum — dark bands, footer, scrolled nav */
    --dusk-2:      #2A2032;
    --ember:       #C1552B;   /* the one accent — kept as-is, brand identity */
    --gold:        #C98A2C;   /* used sparingly: micro-accents only, not backgrounds */
    --sand:        #FFFFFF;   /* default background is now white */
    --sand-deep:   #F7F5F1;   /* barely-tinted off-white for alternating sections */
    --bark:        #1C1712;   /* headings — crisp near-black, not warm brown */
    --bark-soft:   #5A5048;   /* body copy — softened neutral grey-brown */
    --white:       #FFFFFF;

    --shadow:      0 24px 60px rgba(23,19,15,.10);
    --shadow-soft: 0 10px 28px rgba(23,19,15,.07);

    /* Flattened neumorphism -> clean white cards, single soft shadow */
    --neo-surface:      #FFFFFF;
    --neo-light:        rgba(255,255,255,1);
    --neo-dark:         rgba(23,19,15,.07);
    --neo-shadow:        0 18px 40px rgba(23,19,15,.08);
    --neo-shadow-soft:   0 10px 24px rgba(23,19,15,.06);
    --neo-shadow-inset:  inset 0 0 0 1px rgba(23,19,15,.07);
}

body{
    background:var(--white);
    -webkit-font-smoothing:antialiased;
}

/* ===============================
   HEADER / NAV — lighter, airier
=============================== */
header.scrolled{
    background:rgba(255,255,255,.92);
    box-shadow:0 1px 0 rgba(23,19,15,.06);
}
header.scrolled .logo{ color:var(--bark); }
header.scrolled nav a{ color:var(--bark); font-weight:500; }
header.scrolled nav a:hover{ color:var(--ember); }
nav a::after{ background:var(--ember); height:1px; }

/* ===============================
   TYPOGRAPHY — bolder display, tighter body
=============================== */
h1,h2,h3,.logo{ letter-spacing:-.01em; }

.eyebrow{
    letter-spacing:3.5px;
    font-weight:700;
    color:var(--ember);
}

.section-heading h2,
.identity-section h2,
.services-section h2,
.trust-section h2,
.team-section h2,
.testimonial-section h2,
.faq-section h2{
    color:var(--bark);
    font-weight:500;
    letter-spacing:-.015em;
}

.section-heading p{ color:var(--bark-soft); }

/* ===============================
   BUTTONS — flat, confident
=============================== */
.btn{
    background:var(--ember);
    border-color:var(--ember);
    box-shadow:none;
    font-weight:600;
    letter-spacing:.01em;
}
.btn:hover{
    background:var(--dusk);
    border-color:var(--dusk);
    color:var(--white);
    transform:translateY(-2px);
}
.btn-outline{
    border:1.5px solid var(--bark);
    color:var(--bark);
}
.btn-outline:hover{
    background:var(--bark);
    border-color:var(--bark);
}

/* ===============================
   HERO
=============================== */
.hero-content{
    color:var(--white);
}
.hero-eyebrow{
    letter-spacing:4px;
    font-weight:700;
}
.hero-dot{ background:rgba(255,255,255,.4); }
.hero-dot.is-active,
.hero-dot:hover{ background:var(--gold); }

/* ===============================
   TRUST / SERVICES / IDENTITY
   — flatten warm-sand cards to white
=============================== */
.trust-section,
.services-section,
.identity-section{
    background:var(--white);
}

.trust-card,
.service-card{
    background:var(--white);
    border:1px solid rgba(23,19,15,.08);
    box-shadow:var(--neo-shadow-soft);
    border-radius:16px;
}
.trust-card strong,
.service-card h3{ color:var(--ember); }
.trust-card p,
.service-card p{ color:var(--bark-soft); }

.identity-card{
    background:var(--sand-deep);
    border-radius:16px;
}
.identity-card strong{ color:var(--ember); }
.identity-section h2,
.services-section h2{ color:var(--bark); }
.identity-section p,
.services-section p{ color:var(--bark-soft); }

/* ===============================
   EDITORIAL ACCORDIONS / SCENES
   — kept as the dramatic dark accent band
=============================== */
.editorial-heading h2{ color:var(--bark); font-weight:500; }
.accordion-list,
.accordion-list details{ border-color:rgba(23,19,15,.14); }
.accordion-list summary{ color:var(--bark); }
.accordion-list summary span{ color:var(--ember); }
.accordion-list details p{ color:var(--bark-soft); }

.editorial-scene-overlay{
    background:linear-gradient(180deg,rgba(23,19,15,0) 0%,rgba(23,19,15,.78) 100%);
}
.editorial-scene-eyebrow{ color:var(--gold); letter-spacing:3px; }

/* ===============================
   SIGNATURE ITINERARIES
=============================== */
.signature-card{
    background:var(--white);
    box-shadow:var(--neo-shadow-soft);
    border:1px solid rgba(23,19,15,.07);
}
.signature-link{ color:var(--ember); }
.signature-price{ color:var(--bark); }
.signature-duration{ color:var(--bark-soft); }

/* ===============================
   PLANNER / QUICK PLANNER
=============================== */
.planner-box{
    background:var(--white);
    box-shadow:var(--neo-shadow);
    border:1px solid rgba(23,19,15,.06);
}
.planner-phase-overview{ background:rgba(23,19,15,.10); border-color:rgba(23,19,15,.10); }
.planner-phase-overview>div{ background:var(--white); }

.quick-planner{ background:var(--sand-deep); }
.quick-step{
    background:var(--white);
    box-shadow:var(--neo-shadow-soft);
}
.quick-progress span{ background:#EAE5DC; color:var(--bark); }
.quick-progress span.active{ background:var(--ember); color:var(--white); }
.quick-intro,
.quick-note,
.quick-status{ color:var(--bark-soft); }

/* ===============================
   LOCATION BAND — dark accent, unchanged intent
=============================== */
.location-card{
    background:var(--dusk);
}

/* ===============================
   CERTIFICATIONS
=============================== */
.certifications-section{ background:var(--white); }
.certification-card{
    background:var(--white);
    border:1px solid rgba(23,19,15,.08);
    box-shadow:var(--neo-shadow-soft);
}
.cert-icon{ color:var(--ember); }

/* ===============================
   TEAM
=============================== */
.team-section{ background:var(--white); }
.team-card{
    background:var(--white);
    border:1px solid rgba(23,19,15,.08);
    box-shadow:var(--neo-shadow-soft);
}
.team-avatar,
.team-avatar-fallback{ background:var(--ember); }
.team-photo-note{ color:var(--bark-soft); }

/* ===============================
   TESTIMONIALS — off warm-sand, onto soft neutral
=============================== */
.testimonial-section{
    background:var(--sand-deep);
}
.testimonial-section blockquote{ color:var(--bark); }
.testimonial-section p,
.testimonial-author{ color:var(--bark-soft); }
.testimonial-card{
    background:var(--white);
    box-shadow:var(--neo-shadow-soft);
}
.testimonial-stars{ color:var(--gold); }

/* ===============================
   FAQ
=============================== */
.faq-section{ background:var(--white); }
.faq-section details{ border-color:rgba(23,19,15,.12); }
.faq-section summary{ color:var(--bark); }
.faq-section details p{ color:var(--bark-soft); }

/* ===============================
   GALLERY
=============================== */
.gallery{ background:var(--white); }

/* ===============================
   FOOTER — keep dark, tidy contrast
=============================== */
.footer{ background:var(--dusk); }
.footer-column a{ color:rgba(255,255,255,.78); }
.footer-column a:hover{ color:var(--gold); }

/* ===============================
   MODALS (contact / quote)
=============================== */
.contact-modal-content,
.quote-modal-content{
    background:var(--white);
    box-shadow:var(--shadow);
}
.contact-modal-header h2{ color:var(--bark); }
.contact-modal-header p{ color:var(--bark-soft); }
.contact-option-card{
    border:1px solid rgba(23,19,15,.08);
}
.contact-option-body h3{ color:var(--bark); }
.contact-option-body p{ color:var(--bark-soft); }

/* ===============================
   BACK TO TOP
=============================== */
.back-to-top{ background:var(--white); box-shadow:var(--neo-shadow-soft); }
.back-to-top-icon{ color:var(--ember); }