/* Atelier Baratte — couche « Maison » : prestige horloger, retenue, harmonie.
 * Signature : le guilloché (gravure concentrique des cadrans) en filigrane sur les fonds nuit.
 * Principes : or champagne mat (plus de brillance), filets fins, beaucoup d'air, titres plus fins,
 * capitales espacées pour les petits textes, une seule forme de bouton, cartes sobres.
 */
:root{
  --nuit:#111A2C;          /* fonds sombres, plus profonds que le marine */
  --marine:#1C2A45;
  --champagne:#C9AB72;     /* or mat principal */
  --champagne-2:#B18F55;   /* or soutenu (survol, texte sur clair) */
  --ivoire:#F7F4EE;        /* fond clair */
  --porcelaine:#FFFFFF;
  --filet:rgba(177,143,85,.38);
  --filet-clair:rgba(201,171,114,.28);
  --guilloche:repeating-radial-gradient(circle at 78% 28%,rgba(201,171,114,.075) 0 1px,transparent 1px 9px);
  --radius:10px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Typographie : plus fine, plus aérée ---------- */
body{background:var(--ivoire);}
h1,h2{font-weight:400!important;letter-spacing:-.005em;}
h1{line-height:1.08!important;}
h2{line-height:1.12;}
h1 em,h2 em{font-weight:400;color:var(--champagne)!important;}
.eyebrow{font-weight:500!important;letter-spacing:.32em!important;font-size:11px!important;color:var(--champagne-2)!important;}
.hero .eyebrow,.diff .eyebrow,.contact .eyebrow,.band .eyebrow{color:var(--champagne)!important;}
p{text-wrap:pretty;}
h1,h2,h3{text-wrap:balance;}

/* Titres de section : losange serti entre deux filets au lieu du trait épais */
.head h2::after{
  width:120px!important;height:10px!important;border-radius:0!important;margin:20px auto 0!important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Crect x='2' y='2' width='6' height='6' transform='rotate(45 5 5)' fill='%23C9AB72'/%3E%3C/svg%3E") center/10px 10px no-repeat,
    linear-gradient(var(--filet),var(--filet)) left center/48px 1px no-repeat,
    linear-gradient(var(--filet),var(--filet)) right center/48px 1px no-repeat!important;
}
.head{margin-bottom:64px!important;}
.head p{max-width:58ch;margin-left:auto;margin-right:auto;}

/* ---------- Rythme : plus d'air ---------- */
.sec{padding-top:112px!important;padding-bottom:112px!important;}
@media (max-width:640px){.sec{padding-top:76px!important;padding-bottom:76px!important;}}

/* ---------- Fonds nuit + guilloché (signature) ---------- */
.hero,.diff,.contact,.band,footer{background-color:var(--nuit)!important;}
.hero{background-image:var(--guilloche),radial-gradient(60% 70% at 80% 20%,rgba(201,171,114,.10),transparent 70%),linear-gradient(165deg,#0E1626,#16223A 60%,#1A2742)!important;}
.diff,.band{background-image:var(--guilloche),linear-gradient(180deg,#121C30,#16223A)!important;}
.contact{background-image:repeating-radial-gradient(circle at 12% 90%,rgba(201,171,114,.06) 0 1px,transparent 1px 9px),linear-gradient(180deg,#141F35,#111A2C)!important;}
footer{border-top:1px solid var(--filet-clair);}

/* Bandeaux dorés → bandeau nuit à filets (moins criard, plus « maison ») */
.trust,.statband{background:var(--nuit)!important;border-top:1px solid var(--filet-clair);border-bottom:1px solid var(--filet-clair);}
.trust .it,.trust .it b,.trust a.it,.statband,.statband span{color:#D9D4C7!important;}
.trust .it b{color:var(--champagne)!important;font-weight:500!important;}
.trust .dot,.statband i{color:var(--champagne)!important;opacity:.7;}
.trust .it span[style]{color:var(--champagne)!important;}
.statband span{letter-spacing:.22em;font-size:11.5px;}

/* ---------- Boutons : une seule famille, mate et précise ---------- */
.btn{
  min-height:52px!important;padding:12px 34px!important;
  font-size:12px!important;font-weight:500!important;letter-spacing:.18em!important;
  border-radius:999px!important;box-shadow:none!important;
  transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease),transform .4s var(--ease)!important;
}
.btn::before{background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%)!important;transition:transform 1.2s var(--ease)!important;}
.btn-gold{
  background:var(--champagne)!important;color:#1B1408!important;border:1px solid var(--champagne)!important;
}
.btn-gold:hover{
  background:var(--champagne-2)!important;border-color:var(--champagne-2)!important;transform:none!important;
  box-shadow:0 0 0 4px var(--ivoire),0 0 0 5px var(--filet)!important; /* lunette : anneau fin décalé */
}
.hero .btn-gold:hover,.diff .btn-gold:hover,.band .btn-gold:hover,.contact .btn-gold:hover{box-shadow:0 0 0 4px var(--nuit),0 0 0 5px var(--filet)!important;}
.btn-navy{background:transparent!important;border:1px solid var(--marine)!important;color:var(--marine)!important;}
.btn-navy:hover{background:var(--marine)!important;color:var(--ivoire)!important;transform:none!important;}
.hero .btn-navy,.diff .btn-navy,.band .btn-navy,.contact .btn-navy{border-color:var(--filet)!important;color:var(--champagne)!important;background:transparent!important;-webkit-backdrop-filter:none;backdrop-filter:none;}
.hero .btn-navy:hover,.diff .btn-navy:hover,.band .btn-navy:hover,.contact .btn-navy:hover{border-color:var(--champagne)!important;background:rgba(201,171,114,.08)!important;color:#EFE6D2!important;}
.btn:hover svg{transform:none!important;}
@media (max-width:420px){.btn{letter-spacing:.12em!important;padding:12px 22px!important;}}

/* ---------- En-tête : capitales espacées, filet d'or ---------- */
header{background:rgba(247,244,238,.9)!important;box-shadow:none!important;}
header.scrolled{box-shadow:0 10px 30px -26px rgba(17,26,44,.5)!important;}
@media (min-width:641px){
  nav.links{background:transparent!important;border-color:transparent!important;box-shadow:none!important;}
  nav.links a:not(.nav-call){font-size:11.5px!important;letter-spacing:.2em!important;text-transform:uppercase;color:var(--marine)!important;font-weight:500;}
  nav.links a:not(.nav-call):hover{background:transparent!important;color:var(--champagne-2)!important;}
}
.nav-call{background:transparent!important;border:1px solid var(--champagne)!important;color:var(--marine)!important;box-shadow:none!important;letter-spacing:.14em!important;}
.nav-call:hover{background:var(--champagne)!important;color:#1B1408!important;box-shadow:none!important;transform:none!important;}
.nav .right a.dir{border-color:var(--filet)!important;}
@media (max-width:640px){
  nav.links .nav-call{background:var(--champagne)!important;color:#1B1408!important;}
  nav.links a:not(.nav-call){font-size:22px!important;}
}
.callbar{background:rgba(17,26,44,.96)!important;}
.callbar a{background:var(--champagne)!important;color:#1B1408!important;letter-spacing:.14em!important;font-weight:500!important;}
.callbar a.dir{background:transparent!important;color:var(--champagne)!important;border:1px solid var(--filet)!important;}

/* ---------- Photos : encadrement « lunette » (filet d'or décalé) ---------- */
.showcase .frame,.hero .ph{
  background:transparent!important;border:1px solid var(--filet)!important;padding:12px!important;border-radius:6px!important;
  box-shadow:0 40px 80px -50px rgba(0,0,0,.8)!important;
}
.showcase .frame img,.hero .ph img{border-radius:3px!important;}
.showcase .tag{border-radius:3px!important;background:var(--nuit)!important;border:1px solid var(--filet);}
.watches .grid figure,.story .ph,.gems figure{border-radius:6px!important;border-color:var(--filet)!important;}
.watches .grid img,.story .ph img,.gems img{border-radius:3px!important;}

/* ---------- Cartes : sobres, filet fin, pas d'ombre ---------- */
.metier,.gc,.pcard,.rev,.pic,.step,.ravis{
  border-radius:var(--radius)!important;box-shadow:none!important;background:var(--porcelaine)!important;
  border:1px solid rgba(27,35,51,.08)!important;transition:border-color .4s var(--ease),transform .4s var(--ease)!important;
}
.metier:hover,.gc:hover,.pcard:hover{transform:translateY(-2px)!important;border-color:var(--filet)!important;box-shadow:none!important;}
.metier h3,.gc h3,.pcard h3{font-family:var(--serif)!important;font-weight:500!important;font-size:23px!important;letter-spacing:0;color:var(--marine);}
.metier h3 a,.gc h3 a{text-decoration:none;}
.metier h3 a:hover,.gc h3 a:hover{color:var(--champagne-2)!important;}
.metier .ic,.gc .ic{color:var(--champagne-2)!important;}
.rev .av{background:var(--nuit)!important;color:var(--champagne)!important;box-shadow:0 0 0 2px var(--porcelaine),0 0 0 3px var(--filet)!important;}
.rev .st,.stars .s,.proof .st,.avis .s{color:var(--champagne)!important;}
.proof{background:transparent!important;border:1px solid var(--filet)!important;}
.vid video{border-radius:8px!important;box-shadow:0 0 0 1px var(--filet)!important;}
.pics .pic img{border-radius:0!important;}

/* Sections claires alternées : porcelaine / ivoire */
.sec.alt,.social,.faq{background:var(--porcelaine)!important;}
.avis,.avis-p,.vids-sec{background:var(--ivoire)!important;}
.avis-p{border-color:var(--filet-clair)!important;}

/* FAQ : filets fins */
.faq details,.faq .list{border-color:rgba(27,35,51,.1)!important;}
.faq summary{font-weight:400!important;}

/* Liens dans le texte */
main p a:not(.btn),.sec p a:not(.btn){text-underline-offset:3px;}

/* Focus clavier visible, cohérent avec la charte */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:1px solid var(--champagne)!important;outline-offset:4px!important;}

@media (prefers-reduced-motion:reduce){.btn,.metier,.gc,.pcard{transition:none!important;}}

/* ---------- Ajustements après relecture ---------- */
/* « Vendez votre or » : même fond nuit guilloché que les autres sections sombres */
.sign{background-color:var(--nuit)!important;background-image:repeating-radial-gradient(circle at 88% 50%,rgba(201,171,114,.07) 0 1px,transparent 1px 9px),linear-gradient(180deg,#121C30,#16223A)!important;}
.sign .btn-navy{border-color:var(--filet)!important;color:var(--champagne)!important;}
/* Bandeau des dates clés : porcelaine à filets au lieu du beige */
.keydates{background:var(--porcelaine)!important;border-top:1px solid var(--filet-clair);border-bottom:1px solid var(--filet-clair);}
.keydates p{font-weight:400!important;}
/* Sous-titres de galeries en serif, comme les titres */
.subhead h3{font-family:var(--serif)!important;font-weight:400!important;font-size:clamp(26px,3.2vw,34px)!important;color:var(--marine)!important;letter-spacing:0!important;}
/* Raccourcis « Faire réparer… » : cartes sobres à filet */
.intents a{border-radius:var(--radius)!important;border:1px solid rgba(27,35,51,.08)!important;border-left:1px solid var(--champagne)!important;box-shadow:none!important;background:var(--porcelaine)!important;letter-spacing:.02em;}
.intents a:hover{border-color:var(--filet)!important;}
/* Boutons courts : jamais sur deux lignes */
.hero .actions .btn,.diff .btn,.sign .btn,.avis-cta .btn,.keydates .btn{white-space:nowrap!important;flex:0 1 auto!important;}
.btn{letter-spacing:.15em!important;}
@media (max-width:640px){.hero .actions .btn{flex:1 1 100%!important;white-space:normal!important;}.hero .actions .btn-tel{white-space:nowrap!important;}}
/* Pages intérieures : même ornement (losange entre filets), aligné à gauche */
.sec h2::after{
  width:84px!important;height:10px!important;border-radius:0!important;margin-top:18px!important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Crect x='2' y='2' width='6' height='6' transform='rotate(45 5 5)' fill='%23C9AB72'/%3E%3C/svg%3E") left center/10px 10px no-repeat,
    linear-gradient(var(--filet),var(--filet)) 16px center/68px 1px no-repeat!important;
}
.head h2::after,.sec [style*="text-align:center"] h2::after,.band h2::after,.diff h2::after{margin-left:auto!important;margin-right:auto!important;
  width:120px!important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Crect x='2' y='2' width='6' height='6' transform='rotate(45 5 5)' fill='%23C9AB72'/%3E%3C/svg%3E") center/10px 10px no-repeat,
    linear-gradient(var(--filet),var(--filet)) left center/48px 1px no-repeat,
    linear-gradient(var(--filet),var(--filet)) right center/48px 1px no-repeat!important;}
