/* Fluctuat sur gabarit Eston - identite de marque (mode clair, or & charbon) */

:root{
  --eston-font: 'Work Sans', sans-serif !important;
  --eston-font-two: 'Work Sans', sans-serif !important;
  --eston-base: #C9A227 !important;
  --eston-base-rgb: 201, 162, 39 !important;
  --eston-black: #0D1013 !important;
  --eston-black-rgb: 13, 16, 19 !important;

  --dk-bg: #ffffff;
  --dk-bg-2: #f2eee3;
  --dk-card: #ffffff;
  --dk-card-hover: #fbf9f4;
  --dk-border: #e4dfd3;
  --dk-border-soft: #ede9de;
  --dk-text: #0d1013;
  --dk-text-muted: #42474b;
  --dk-accent: #C9A227;
  --dk-accent-soft: #e4cd7a;
  --dk-accent-text: #8a6d2f; /* variante fonc\00e9e de l'or, lisible en texte sur fond clair */
}

@media (prefers-reduced-motion: reduce){
  *{ transition: none !important; animation: none !important; }
}

/* ---------- Base ---------- */
html, body{ background-color: var(--dk-bg) !important; }
body{ color: var(--dk-text-muted); font-family: 'Work Sans', sans-serif; }

/* ---------- Header / nav ---------- */
.main-header{ background-color: #ffffff !important; box-shadow: 0 2px 16px rgba(13,16,19,.07); }
.stricky-header{ background-color: #ffffff !important; box-shadow: 0 2px 18px rgba(13,16,19,.08); }
.main-menu__list > li > a{ color: var(--dk-text) !important; }
.main-menu__list > li > ul{ background-color: var(--dk-card) !important; box-shadow: 0 12px 30px rgba(13,16,19,.12); }
.main-menu__list > li > ul li a{ color: var(--dk-text-muted) !important; }
.main-menu__list > li > ul li a:hover{ color: var(--dk-accent) !important; }

/* ---------- Menu mobile : le gabarit de base prevoit un panneau sombre, on le passe en mode clair ---------- */
.main-menu .mobile-nav__toggler{ color: var(--dk-text) !important; }
.mobile-nav__close{ color: var(--dk-text) !important; }
.mobile-nav__content{ background-color: var(--dk-bg) !important; }
.mobile-nav__container{ background-color: var(--dk-bg) !important; border-color: var(--dk-border-soft) !important; }
.mobile-nav__content .main-menu__list > li:not(:last-child),
.mobile-nav__content .main-menu__list > li > ul > li:not(:last-child),
.mobile-nav__content .main-menu__list > li > ul > li > ul > li:not(:last-child){ border-bottom-color: var(--dk-border-soft) !important; }
.mobile-nav__content .main-menu__list > li > ul,
.mobile-nav__content .main-menu__list > li > ul > li > ul{ border-top-color: var(--dk-border-soft) !important; }
.mobile-nav__social a, .mobile-nav__contact li a{ color: var(--dk-text) !important; }
.mobile-nav__contact li{ color: var(--dk-text-muted) !important; }

/* ---------- Brand lockup ---------- */
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.brand-mark{ width:36px; height:27px; flex:none; color: var(--dk-accent); }
.brand-text{ display:flex; flex-direction:column; line-height:1; }
.brand-name{
  font-family: 'Work Sans', sans-serif;
  font-weight: 700; font-size: 21px; letter-spacing:.2px;
  color: var(--dk-text) !important;
}
.brand-tag{
  font-family: 'Work Sans', sans-serif;
  font-size: 9px; font-weight: 500; letter-spacing:.8px; text-transform: uppercase;
  color: var(--dk-text-muted); margin-top: 3px; white-space: nowrap;
}
@media (max-width: 1200px){ .brand-tag{ display:none; } }

/* ---------- Language switcher ---------- */
.lang-switch{ display:flex; gap:4px; margin-left: 18px; }
.lang-switch a{
  font-family: 'Work Sans', sans-serif;
  font-size: 12px; font-weight: 600; letter-spacing:.5px;
  color: var(--dk-text-muted) !important;
  border: 1px solid rgba(13,16,19,.16);
  border-radius: 5px; padding: 5px 9px;
  transition: all .2s ease;
}
.lang-switch a:hover{ color: var(--dk-text) !important; border-color: rgba(13,16,19,.35); }
.lang-switch a.active{ color:#17140f !important; background: var(--dk-accent); border-color: var(--dk-accent); }

/* ---------- Buttons ---------- */
.thm-btn{
  background: linear-gradient(135deg, #e4cd7a, var(--dk-accent)) !important;
  color: #17140f !important;
  border-color: transparent !important;
  box-shadow: 0 8px 20px rgba(201,162,39,.22);
  transition: transform .25s ease, box-shadow .25s ease;
}
/* Le gabarit de base fait glisser un fond noir au survol (.thm-btn:after) - neutralise en or. */
.thm-btn:after{ background: var(--dk-accent) !important; }
.thm-btn:hover{ transform: translateY(-2px); box-shadow: 0 12px 26px rgba(201,162,39,.34); color:#17140f !important; }
.thm-btn:hover span, .thm-btn:hover i{ color:#17140f !important; }
.thm-btn .fa-long-arrow-alt-right{ display:inline-block; transition: transform .25s ease; }
.thm-btn:hover .fa-long-arrow-alt-right{ transform: translateX(4px); }

/* ---------- Onglets / liens secondaires : survol homogene ---------- */
.brand-hero__btn-ghost{ transition: border-color .2s ease, color .2s ease, transform .2s ease; }
.brand-hero__btn-ghost:hover{ transform: translateY(-2px); }
.lang-switch a:hover{ transform: translateY(-1px); }
.tab-buttons .tab-btn span{ transition: color .2s ease; }
.tab-buttons .tab-btn:hover span{ color: var(--dk-accent-text); }
.auth-tabs span{ transition: color .2s ease, border-color .2s ease; }
.auth-tabs span:hover{ color: var(--dk-text); }
.services-one__read-more, .project-one__read-more a, .news-one__read-more a{ transition: color .2s ease, transform .2s ease; display:inline-block; }
.services-one__read-more:hover, .project-one__read-more a:hover, .news-one__read-more a:hover{ transform: translateX(3px); }

/* Icones des 4 cartes "coup d'oeil" : le gabarit fournissait des PNG rouges hors charte */
.services-one__icon i{
  font-size: 64px; line-height:1; display:inline-block; color: var(--dk-accent);
  transition: all 500ms linear; transition-delay: .1s; transform: scale(1);
}
.services-one__single:hover .services-one__icon i{ transform: scale(0.9); }

/* ---------- Section titles ---------- */
.section-title__tagline{ color: var(--dk-accent-text) !important; }
.section-title__title{ color: var(--dk-text) !important; font-family: 'Work Sans', sans-serif; font-weight: 700; }
.section-title__title-box p{ color: var(--dk-text-muted) !important; }

/* ---------- About ---------- */
.about-one, .about-three{ background-color: var(--dk-bg); }
.about-one__img > img{ max-width: 100%; height: auto; }
.about-one__img-2{ max-width: 220px; }
.about-one__img-2 > img{ width: 100%; height: auto; display: block; }
.about-one__img-2::before{ background-color: var(--dk-accent) !important; }
.about-one__text, .tabs-one__text{ color: var(--dk-text-muted) !important; }
.tab-buttons .tab-btn span{ color: var(--dk-text-muted); }
.tab-buttons .tab-btn.active-btn span{ color: var(--dk-accent); }

/* ---------- Services ---------- */
.services-one, .services-two, .services-four{ background-color: var(--dk-bg-2); }
.services-one__single{
  border-color: var(--dk-border-soft) !important;
  background-color: var(--dk-card);
  transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, border-color .35s ease;
}
.services-one__single:hover{
  transform: translateY(-6px);
  box-shadow: 0 18px 36px rgba(13,16,19,.1);
  border-color: var(--dk-accent-soft) !important;
}
.services-one__title a{ color: var(--dk-text) !important; }
.services-one__title a:hover{ color: var(--dk-accent) !important; }
.services-one__text{ color: var(--dk-text-muted) !important; }
.services-one__read-more{ color: var(--dk-accent) !important; }

/* ---------- Project list (home teaser) ---------- */
.project-one{ background-color: var(--dk-bg); }
.project-one__list li{ border-color: var(--dk-border-soft) !important; transition: background-color .3s ease; }
.project-one__list li:hover{ background-color: var(--dk-card-hover); }
.project-one__list-year p{ color: var(--dk-text-muted) !important; }
.project-one__list-title h5{ color: var(--dk-text) !important; }
.project-one__director p, .project-one__budget p{ color: var(--dk-text-muted) !important; }
.project-one__director p span, .project-one__budget p span{ color: var(--dk-text) !important; }
.project-one__read-more a{ color: var(--dk-accent) !important; }

/* ---------- Project details ---------- */
.project-details{ background-color: var(--dk-bg); }
.project-details__title, .project-details__title-2{ color: var(--dk-text) !important; }
.project-details__text-1, .project-details__text-2, .project-details__text-3, .project-details__text-4{ color: var(--dk-text-muted) !important; }
.project-details__short-details{ background-color: var(--dk-card); border: 1px solid var(--dk-border-soft); }
.project-details__short-details h3{ color: var(--dk-text) !important; }
.project-details__short-details-list p{ color: var(--dk-text-muted) !important; }
.project-details__short-details-list p span{ color: var(--dk-accent) !important; }

/* ---------- News / journal ---------- */
.news-one{ background-color: var(--dk-bg-2); }
.news-one__img{ aspect-ratio: 4/3; }
.news-one__img img{ height: 100%; object-fit: cover; }
.project-one__list li{ overflow: hidden; }
.project-one__img{ width: 160px; height: 160px; overflow: hidden; border-radius: 6px; }
.project-one__img img{ width: 100%; height: 100%; object-fit: cover; }
.news-one__sub-title p{ color: var(--dk-accent) !important; }
.news-one__date p{ color: var(--dk-text-muted) !important; }
.news-one__title a{ color: var(--dk-text) !important; }
.news-one__title a:hover{ color: var(--dk-accent) !important; }
.news-one__read-more a{ color: var(--dk-accent) !important; }

/* ---------- Video ---------- */
.video-one{ background-color: var(--dk-bg); }

/* ---------- Team ---------- */
.team-one{ background-color: var(--dk-bg-2); }
.team-one__content p{ color: var(--dk-text-muted) !important; }
.team-one__content h3 a{ color: var(--dk-text) !important; }

/* ---------- Contact ---------- */
.contact-page{ background-color: var(--dk-bg-2); }
.contact-page__single{ border-color: var(--dk-border-soft) !important; }
.contact-page__title, .contact-page__title a{ color: var(--dk-text) !important; }
.contact-page__text{ color: var(--dk-text-muted) !important; }
.contact-one{ background-color: var(--dk-bg); }
.contact-one__input-box{ background-color: var(--dk-card) !important; border: 1px solid var(--dk-border-soft) !important; }
.contact-one__input-box input, .contact-one__input-box textarea{
  background-color: transparent !important;
  color: var(--dk-text) !important;
  font-family: 'Work Sans', sans-serif;
}
.contact-one__input-box input::placeholder, .contact-one__input-box textarea::placeholder{ color: var(--dk-text-muted) !important; opacity: 1; }
.contact-one__logo a{ color: var(--dk-text) !important; }

/* ---------- Footer ---------- */
.site-footer{ background-color: var(--dk-bg-2); }
.footer-widget__title, .footer-widget-two__title{ color: var(--dk-text) !important; }
.footer-widget__services-list a, .footer-widget__pages-list a,
.footer-widget-two__services-list a, .footer-widget-two__pages-list a{ color: var(--dk-text-muted) !important; }
.footer-widget__services-list a:hover, .footer-widget__pages-list a:hover,
.footer-widget-two__services-list a:hover, .footer-widget-two__pages-list a:hover{ color: var(--dk-accent) !important; }
.footer-widget__about-text, .site-footer__bottom-text, .footer-widget__contact a{ color: var(--dk-text-muted) !important; }
.site-footer-two__title{ color: var(--dk-text) !important; }
.site-footer__bottom{ border-top: 1px solid var(--dk-border-soft) !important; }

/* ---------- Maquette banner (portail client) ---------- */
.maquette-banner{
  background: linear-gradient(135deg, rgba(201,162,39,.12), rgba(201,162,39,.04));
  border: 1px dashed var(--dk-accent-soft);
  border-radius: 8px; padding: 16px 20px; margin-bottom: 34px;
  color: var(--dk-text-muted); font-size: 14px;
  display: flex; align-items: center; gap: 12px;
}
.maquette-banner strong{ color: var(--dk-accent); }

/* ---------- Portail client: auth mockup ---------- */
.auth-card{
  background: var(--dk-card); border: 1px solid var(--dk-border-soft); border-radius: 10px;
  padding: 30px; box-shadow: 0 10px 26px rgba(13,16,19,.08);
}
.auth-tabs{ display:flex; gap:6px; margin-bottom:22px; border-bottom:1px solid var(--dk-border-soft); }
.auth-tabs span{ padding: 8px 4px 12px; font-size: 13px; letter-spacing:.4px; color: var(--dk-text-muted); border-bottom: 2px solid transparent; cursor:pointer; }
.auth-tabs span.active{ color: var(--dk-text); border-color: var(--dk-accent); }
.auth-card .field{ margin-bottom: 16px; }
.auth-card input{
  width:100%; background: var(--dk-bg-2); border:1px solid var(--dk-border); border-radius:6px;
  color: var(--dk-text); padding: 12px 14px; font-family:'Work Sans',sans-serif; font-size:14px;
}
.auth-card input::placeholder{ color: var(--dk-text-muted); }
.auth-card .thm-btn{ width:100%; text-align:center; }

/* ---------- Portail client: catalogue ---------- */
.catalog-card{
  position: relative; background: var(--dk-card); border: 1px solid var(--dk-border-soft);
  border-radius: 10px; overflow: hidden; box-shadow: 0 10px 26px rgba(13,16,19,.07);
  transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease;
}
.catalog-card:hover{ transform: translateY(-5px); box-shadow: 0 18px 36px rgba(13,16,19,.14); }
.catalog-card .catalog-media{ position: relative; overflow:hidden; }
.catalog-card .catalog-media img{ width:100%; display:block; transition: transform .6s ease; }
.catalog-card:hover .catalog-media img{ transform: scale(1.06); }
.lock-badge{
  position: absolute; top: 14px; right: 14px; background: rgba(13,16,19,.82); color: var(--dk-accent);
  border: 1px solid rgba(255,255,255,.15); border-radius: 20px; font-size: 11px; letter-spacing:.5px;
  padding: 5px 11px; display:flex; align-items:center; gap:5px;
}
.catalog-body{ padding: 20px; }
.catalog-body h4{ color: var(--dk-text); font-family:'Work Sans',sans-serif; font-weight:700; }
.catalog-price{ color: var(--dk-accent); font-weight: 600; font-size: 14px; margin: 6px 0 14px; }
.btn-stripe{
  display:inline-flex; align-items:center; gap:8px;
  background: linear-gradient(135deg, #e4cd7a, var(--dk-accent)); color:#17140f; font-weight:600; font-size:13px;
  border:none; border-radius:6px; padding:10px 18px; cursor:pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-stripe:hover{ transform: translateY(-2px); box-shadow: 0 10px 22px rgba(201,162,39,.28); }
.btn-stripe:disabled{ opacity:.5; cursor:not-allowed; transform:none !important; }

/* ---------- Portail client: lecteur securise mockup ---------- */
.video-mock{ position: relative; border-radius: 10px; overflow: hidden; box-shadow: 0 20px 50px rgba(13,16,19,.25); background:#000; }
.video-mock::before{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.55) 100%); z-index:2; pointer-events:none; }
.video-mock-overlay{ position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; color:#fff; padding:20px; }
.video-mock-overlay .lock-icon{ width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center; font-size:18px; color: var(--dk-accent); background: rgba(0,0,0,.35); }
.video-mock-overlay p{ color: rgba(255,255,255,.75); font-size:13px; max-width:320px; font-family:'Work Sans',sans-serif; }
.video-mock iframe{ position:relative; z-index:1; width:100%; aspect-ratio:16/9; display:block; border:0; filter: brightness(.55) saturate(.8); }

/* ---------- Timeline (evenements) ---------- */
.timeline{ position: relative; padding-left: 34px; }
.timeline::before{ content:""; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background: var(--dk-border); }
.timeline-item{ position: relative; padding-bottom: 34px; }
.timeline-item::before{ content:""; position:absolute; left:-34px; top:3px; width:12px; height:12px; border-radius:50%; background: var(--dk-bg); border:2px solid var(--dk-accent); }
.timeline-item .timeline-date{ color: var(--dk-accent); font-size:13px; font-weight:600; letter-spacing:.4px; margin-bottom:4px; font-family:'Work Sans',sans-serif; }
.timeline-item h4{ color: var(--dk-text); margin-bottom:6px; font-family:'Work Sans',sans-serif; font-weight:700; }
.timeline-item p{ color: var(--dk-text-muted); margin-bottom:0; }

/* ---------- Blog cards (livre & ecriture) ---------- */
.blog-mini-card{
  background: var(--dk-card); border: 1px solid var(--dk-border-soft); border-radius: 8px; overflow:hidden;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.blog-mini-card:hover{ transform: translateY(-5px); box-shadow: 0 14px 30px rgba(13,16,19,.12); border-color: var(--dk-accent-soft); }
.blog-mini-card img{ width:100%; height:150px; object-fit:cover; }
.blog-mini-card .body{ padding: 16px 18px; }
.blog-mini-card .body .date{ color: var(--dk-text-muted); font-size:12px; font-family:'Work Sans',sans-serif; }
.blog-mini-card .body h4{ margin: 6px 0 0; }
.blog-mini-card .body h4 a{ color: var(--dk-text); font-family:'Work Sans',sans-serif; font-weight:700; font-size:17px; }
.blog-mini-card .body h4 a:hover{ color: var(--dk-accent); }

/* ---------- Scroll reveal ---------- */
.reveal-up{ opacity:0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal-up.is-visible{ opacity:1; transform: translateY(0); }

/* ---------- Hero de marque (accueil) ---------- */
.brand-hero{
  position: relative;
  padding: 220px 0 130px 0;
  background: linear-gradient(180deg, #ffffff 0%, var(--dk-bg-2) 100%);
  overflow: hidden;
  text-align: center;
}
.brand-hero__frame{ position:absolute; inset:0; pointer-events:none; }
.brand-hero__frame svg{ position:absolute; width:100%; height:100%; }
.brand-hero__frame path{ stroke: var(--dk-accent); stroke-opacity:.28; stroke-width:2.5; fill:none; }

/* Monogramme geant en fond du hero : reprend le "monogram reveal" de la fiche identitaire (trace progressif). */
.brand-hero__mega{
  position:absolute; top:110px; right:0; bottom:0; left:0; z-index:1; pointer-events:none;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.brand-hero__mega svg{
  height:min(64vw, 640px); width:auto; aspect-ratio: 700 / 930;
  animation: brandMegaBreathe 7s ease-in-out 2.4s infinite;
}
.brand-hero__mega-path{
  fill: var(--dk-accent);
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: brandMegaDraw 1.8s cubic-bezier(.16,.8,.24,1) .3s forwards;
}
@keyframes brandMegaDraw{
  0%{ opacity:0; transform: scale(.94); }
  100%{ opacity:.1; transform: scale(1); }
}
@keyframes brandMegaBreathe{ 0%,100%{ transform: scale(1); } 50%{ transform: scale(1.02); } }
@media (prefers-reduced-motion: reduce){
  .brand-hero__mega svg{ animation:none; }
  .brand-hero__mega-path{ animation:none; opacity:.1; transform:scale(1); }
}
@media (max-width: 767px){
  .brand-hero__mega{ top:70px; }
  .brand-hero__mega svg{ height:82vw; width:auto; }
}

.brand-hero__content{ position:relative; z-index:2; max-width:720px; margin:0 auto; }

.brand-hero__mark{
  width:130px; aspect-ratio: 134 / 102; margin:0 auto 30px auto; position:relative;
  animation: brandFocusPull 1.3s cubic-bezier(.16,.8,.24,1) forwards;
}
@keyframes brandFocusPull{
  0%{ opacity:0; transform: scale(1.6); filter: blur(14px); }
  60%{ opacity:1; filter: blur(2px); }
  100%{ opacity:1; transform: scale(1); filter: blur(0); }
}
.brand-hero__breathe{ width:100%; height:100%; animation: brandBreathe 4.5s ease-in-out 1.3s infinite; }
@keyframes brandBreathe{ 0%,100%{ transform: scale(1) rotate(0deg); } 50%{ transform: scale(1.035) rotate(1deg); } }
.brand-hero__mark svg path{ stroke: var(--dk-accent); }
.brand-hero__lens circle:first-child{ fill:none; stroke: rgba(13,16,19,.25); stroke-width:1; animation: brandRing 2.4s ease-out 1.3s infinite; transform-origin:109px 23px; }
.brand-hero__lens circle:last-child{ fill: var(--dk-text); animation: brandRec 2.4s ease-in-out 1.3s infinite; transform-origin:109px 23px; }
@keyframes brandRing{ 0%{ r:3.2; opacity:.9; } 100%{ r:11; opacity:0; } }
@keyframes brandRec{ 0%,100%{ opacity:.55; transform: scale(.9); } 50%{ opacity:1; transform: scale(1.15); } }

.brand-hero__eyebrow{
  display:block; font-size: 11px; font-weight:700; letter-spacing: 3px; text-transform:uppercase;
  color: var(--dk-accent-text); margin: 0 0 18px 0;
  opacity:0; animation: brandFadeUp .7s ease forwards; animation-delay:.4s;
}
.brand-hero__title{
  font-family:'Work Sans', sans-serif;
  font-size: 42px; line-height:1.2; font-weight:700; color: var(--dk-text);
  margin: 0 0 20px 0; letter-spacing:-.01em;
  opacity:0; animation: brandFadeUp .8s ease forwards; animation-delay:.55s;
}
.brand-hero__title em{ color: var(--dk-accent); font-style:normal; }
.brand-hero__subtitle{
  font-size:16px; line-height:1.6; color: var(--dk-text-muted); max-width:520px; margin: 0 auto 34px auto;
  opacity:0; animation: brandFadeUp .8s ease forwards; animation-delay:.75s;
}
.brand-hero__cta{
  display:flex; gap:16px; justify-content:center; flex-wrap:wrap;
  opacity:0; animation: brandFadeUp .8s ease forwards; animation-delay:.95s;
}
.brand-hero__btn-ghost{
  display:inline-flex; align-items:center; gap:10px;
  padding: 15px 30px; border-radius:2px; border:1px solid rgba(13,16,19,.22);
  font-size:13px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  text-decoration:none; color: var(--dk-text); transition: border-color .2s ease, color .2s ease;
}
.brand-hero__btn-ghost:hover{ border-color: var(--dk-accent); color: var(--dk-accent); }

@keyframes brandFadeUp{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }

@media (max-width: 767px){
  .brand-hero{ padding: 160px 0 90px 0; }
  .brand-hero__title{ font-size: 30px; }
}