:root{
    --navy:#13294b; --navy2:#1d3a6b; --red:#b3202f; --cream:#f7f2e6; --paper:#fbf8f0;
    --ink:#16202e; --muted:#5b6575; --line:#dcd3bf; --gold:#c9a24a;
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 Inter,system-ui,sans-serif}
  a{color:var(--navy2)}
  .wrap{max-width:1040px;margin:0 auto;padding:0 20px}

  .flag{height:8px;background:repeating-linear-gradient(90deg,var(--red) 0 40px,#fff 40px 80px)}
  header.top{background:var(--navy);color:var(--cream)}
  header.top .wrap{display:flex;justify-content:space-between;align-items:center;height:62px}
  .brand{display:flex;align-items:center;gap:10px;font:700 20px Fraunces,serif;color:var(--cream);text-decoration:none}
  .brand svg{width:28px;height:28px}
  nav a{margin-left:20px;font-size:14px;color:#cdd6e6;text-decoration:none}
  .ribbon{background:var(--red);height:24px;overflow:hidden}
  .ribbon svg{display:block;margin:0 auto;height:24px;width:320px}

  .crumbs{font-size:13px;color:var(--muted);padding:18px 0 0}
  .crumbs a{color:var(--muted)}

  .hero{display:grid;grid-template-columns:1.3fr 1fr;gap:36px;padding:26px 0 40px;align-items:center}
  .eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--red);font-weight:600}
  h1{font:700 clamp(34px,5.4vw,54px)/1.05 Fraunces,serif;margin:10px 0 14px;color:var(--navy)}
  .lede{font-size:18px;color:var(--muted);max-width:50ch;margin:0 0 22px}
  .cta{display:flex;gap:12px;flex-wrap:wrap}
  .btn{display:inline-block;padding:12px 20px;border-radius:4px;font-weight:600;font-size:15px;text-decoration:none}
  .btn.primary{background:var(--navy);color:#fff}
  .btn.red{background:var(--red);color:#fff}
  .btn.ghost{border:1.5px solid var(--navy);color:var(--navy)}
  .heromap{max-width:360px;justify-self:center;width:100%}
  .heromap svg{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 14px rgba(19,41,75,.22))}
  .heromap .cap{text-align:center;font:600 12px Inter;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-top:6px}

  .section-title{font:700 28px Fraunces,serif;color:var(--navy);margin:0 0 6px}
  .section-sub{color:var(--muted);margin:0 0 20px;max-width:60ch}

  .grid{display:grid;grid-template-columns:2fr 1fr;gap:28px;padding-bottom:44px}
  .card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:24px}
  .card h2{font:700 22px Fraunces,serif;margin:0 0 12px;color:var(--navy)}
  .products{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  .p{border:1px solid var(--line);border-radius:4px;overflow:hidden}
  .p .img{aspect-ratio:1;background:repeating-linear-gradient(45deg,#ece6d6,#ece6d6 10px,#f7f2e6 10px,#f7f2e6 20px);display:grid;place-items:center;font-size:11px;color:var(--muted)}
  .p .t{padding:10px 12px;font-size:14px;font-weight:500}
  .p .t span{display:block;color:var(--muted);font-weight:400;font-size:13px}
  dl{margin:0} dt{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:14px} dd{margin:2px 0 0;font-weight:500}

  /* Carte interactive */
  .mapsec{background:var(--navy);color:var(--cream);padding:48px 0;margin:8px 0 48px}
  .mapsec .section-title{color:#fff}
  .mapsec .section-sub{color:#b9c6df}
  .mapgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center}
  .mapbox{position:relative}
  .mapbox svg{width:100%;height:auto;display:block}
  .c{stroke:#fbf8f0;stroke-width:.9;stroke-linejoin:round;cursor:pointer;transition:fill .15s}
  .c.l0{fill:#2b4778} .c.l1{fill:#5b7cb5} .c.l2{fill:#8fa9d6} .c.l3{fill:#dbe5f6}
  .c:hover,.c:focus{fill:var(--gold);outline:none}
  .c.mine{fill:var(--red)}
  .c.mine:hover{fill:#d12d3e}
  .outline{fill:none;stroke:#fbf8f0;stroke-width:2.2;stroke-linejoin:round;pointer-events:none}
  .tip{position:absolute;pointer-events:none;background:#fff;color:var(--ink);border-radius:4px;padding:8px 12px;font-size:13px;box-shadow:0 6px 18px rgba(0,0,0,.28);transform:translate(-50%,-120%);white-space:nowrap;opacity:0;transition:opacity .1s}
  .tip b{display:block;font:700 15px Fraunces,serif;color:var(--navy)}
  .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:#b9c6df;margin-top:12px;align-items:center}
  .legend i{display:inline-block;width:14px;height:14px;border-radius:2px;margin-right:6px;vertical-align:-3px;border:1px solid rgba(255,255,255,.4)}
  .stats{display:grid;gap:14px}
  .stat{border-left:3px solid var(--red);padding:2px 0 2px 16px}
  .stat b{display:block;font:700 34px Fraunces,serif;color:#fff;line-height:1.1}
  .stat span{color:#b9c6df;font-size:14px}
  .note{font-size:12px;color:#8fa1c4;margin-top:16px}

  /* Pub / mise en avant */
  .adsec{padding:0 0 48px}
  .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
  .tier{background:#fff;border:1px solid var(--line);border-radius:6px;padding:26px 22px;display:flex;flex-direction:column}
  .tier.hot{border:2px solid var(--red);position:relative;box-shadow:0 10px 26px rgba(179,32,47,.12)}
  .tier .badge{position:absolute;top:-12px;left:20px;background:var(--red);color:#fff;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:3px}
  .tier h3{font:700 20px Fraunces,serif;margin:0;color:var(--navy)}
  .price{font:700 40px Fraunces,serif;color:var(--navy);margin:8px 0 2px}
  .price small{font:500 14px Inter;color:var(--muted)}
  .tier ul{list-style:none;padding:0;margin:14px 0 22px;display:grid;gap:8px;font-size:14.5px;flex:1}
  .tier li{padding-left:22px;position:relative}
  .tier li:before{content:"";position:absolute;left:0;top:7px;width:10px;height:10px;background:var(--navy);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
  .fine{font-size:12.5px;color:var(--muted);margin-top:14px}

  .b2b{background:var(--cream);border:1px solid var(--line);border-radius:6px;padding:28px;margin-bottom:28px;display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:center}
  .b2b h2{font:700 24px Fraunces,serif;margin:0 0 8px;color:var(--navy)}
  .b2b p{margin:0;color:var(--muted)}
  .b2b form{display:grid;gap:8px}
  .b2b input,.b2b select{padding:11px 12px;border-radius:4px;border:1px solid var(--line);font:inherit;background:#fff}
  .b2b button{padding:12px;border:0;border-radius:4px;background:var(--red);color:#fff;font:inherit;font-weight:700;cursor:pointer}

  .claim{border:1.5px dashed var(--red);background:#fdf5f3}
  .claim h2{color:var(--red)}
  pre{background:var(--navy);color:#e8ecf5;padding:14px;border-radius:4px;overflow:auto;font-size:12.5px;line-height:1.5;margin:10px 0 0}

  .near h3{font:700 18px Fraunces,serif;margin:0 0 10px;color:var(--navy)}
  .near ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .near li a{display:block;padding:12px;border:1px solid var(--line);border-radius:4px;background:#fff;text-decoration:none;color:var(--ink);font-weight:500;font-size:14px}
  .near li a span{display:block;color:var(--muted);font-weight:400;font-size:13px}

  footer{background:var(--navy);color:#b9c6df;padding:26px 0 40px;font-size:13px}
  footer a{color:#cdd6e6}

  @media (max-width:800px){
    .hero,.grid,.b2b,.mapgrid,.tiers{grid-template-columns:1fr}
    .products,.near ul{grid-template-columns:1fr 1fr}
    nav{display:none}
    .heromap{order:-1;max-width:260px}
  }

  /* ajouts site */
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;list-style:none;padding:0;margin:0}
  .cards a{display:block;padding:16px;border:1px solid var(--line);border-radius:6px;background:#fff;text-decoration:none;color:var(--ink);height:100%}
  .cards a b{display:block;font:700 18px Fraunces,serif;color:var(--navy)}
  .cards a span{display:block;color:var(--muted);font-size:13.5px;margin-top:2px}
  .cards a em{display:block;font-style:normal;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--red);margin-top:8px;font-weight:600}
  .page{padding:34px 0 50px}
  .tools{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 24px}
  .chip{padding:7px 14px;border:1px solid var(--line);border-radius:99px;background:#fff;font-size:13.5px;text-decoration:none;color:var(--ink)}
  .chip:hover{border-color:var(--navy)}
  @media (max-width:800px){.cards{grid-template-columns:1fr}}

  .grid{align-items:start}

  /* recherche */
  header.top .wrap{gap:18px}
  .search{position:relative;flex:1;max-width:420px}
  .search input,.bigsearch{width:100%;padding:10px 14px;border-radius:6px;border:1px solid #3b5688;background:#1d3a6b;color:#fff;font:inherit;font-size:14.5px}
  .search input::placeholder{color:#a9b9d6}
  .search input:focus{outline:2px solid var(--gold);border-color:var(--gold)}
  .results{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;color:var(--ink);border-radius:6px;box-shadow:0 12px 30px rgba(0,0,0,.3);overflow:hidden;z-index:50}
  .results[hidden]{display:none}
  .results a{display:block;padding:10px 14px;text-decoration:none;color:var(--ink);border-bottom:1px solid #eee7d6}
  .results a:hover{background:#f7f2e6}
  .results a b{display:block;font:700 15px Fraunces,serif;color:var(--navy)}
  .results a span{display:block;font-size:12.5px;color:var(--muted)}
  .results .none,.results .more{padding:12px 14px;font-size:13px;color:var(--muted)}
  .bigsearch{background:#fff;color:var(--ink);border:1.5px solid var(--navy);margin:6px 0 18px;padding:14px 16px;font-size:16px}
  .bigsearch::placeholder{color:#7b8596}
  @media (max-width:800px){
    header.top .wrap{height:auto;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
    .search{order:3;flex-basis:100%;max-width:none}
  }

/* guides de catégorie */
.guide{padding:0;overflow:hidden;margin:22px 0}
.gsec{padding:26px 28px;border-top:1px solid var(--line,#d9d0bd)}
.gsec:first-child{border-top:0}
.ghead{display:flex;gap:16px;align-items:center;margin-bottom:10px}
.ghead h2{margin:2px 0 0;font:700 clamp(22px,3vw,28px)/1.15 Fraunces,serif;color:var(--navy,#13294b)}
.gicon{flex:none;color:var(--red,#b3202f);background:#f1e9d4;border-radius:50%;padding:12px;box-sizing:content-box}
.gsec p{max-width:68ch;line-height:1.65}
.gfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:18px 0}
.gf{background:var(--navy,#13294b);color:#f7f2e6;border-radius:10px;padding:14px 16px;border-top:3px solid var(--gold,#c9a24a)}
.gf b{display:block;font:700 26px/1.1 Fraunces,serif;color:#fff}
.gf span{font-size:13px;opacity:.85}
.gtl{list-style:none;display:flex;flex-wrap:wrap;gap:0;margin:16px 0;padding:0;border-top:3px solid var(--gold,#c9a24a)}
.gtl li{flex:1 1 140px;padding:10px 12px 0 0}
.gtl b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--red,#b3202f)}
.gtl span{font-size:15px}
.gsec details{border-top:1px solid #e6dcc3;padding:10px 0}
.gsec summary{cursor:pointer;font-weight:600;color:var(--navy,#13294b)}
.gsec details p{margin:8px 0 2px}
.gsrc{font-size:12.5px;color:#5b6575;margin-top:14px}
.gsrc a{color:inherit}
@media(max-width:600px){.gsec{padding:20px 18px}.ghead{align-items:flex-start}}

/* vignette « photo en attente » */
.ph{display:flex;gap:18px;align-items:center;margin-top:16px}
.polaroid{position:relative;flex:none;width:150px;background:#fff;padding:8px 8px 22px;border:1px solid #e2d8bf;box-shadow:0 6px 14px rgba(19,41,75,.14);transform:rotate(-2.5deg)}
.polaroid svg{display:block;width:100%;height:auto;background:#f1e9d4}
.stamp{position:absolute;right:-12px;bottom:14px;transform:rotate(-9deg);border:2px solid var(--red,#b3202f);color:var(--red,#b3202f);background:rgba(255,255,255,.92);font:700 10px/1 Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:5px 7px;border-radius:3px}
.phtxt{font-size:13.5px;line-height:1.55;color:#5b6575}
.phtxt b{color:var(--navy,#13294b)}
@media(max-width:480px){.ph{flex-direction:column;align-items:flex-start}}
.brand img{display:block;height:54px;width:auto}
.glance a.site,.grid dd a.site{font-weight:600;color:var(--red,#b3202f);word-break:break-all}
.grid dd.muted{color:#7a8190;font-style:italic}
.brand img{display:block;height:54px;width:auto}
.grid dd a.site{font-weight:600;color:var(--red,#b3202f);word-break:break-all}
.grid dd.muted{color:#7a8190;font-style:italic}
.adsec{margin-top:40px}
.b2b .for{margin:8px 0 0;font-size:14px;color:var(--navy,#13294b)}
.profile{margin:0;line-height:1.65}
.psrc{margin-top:12px}
.psrc a{color:inherit}