:root{
  --bg:#fbfaf7;
  --panel:#ffffff;
  --text:#0f2430;
  --muted:#5a6771;
  --line:rgba(15,36,48,.10);

  --primary:#0b2f38;
  --primary2:#0e4350;

  --sand:#f2e7d6;
  --sand2:#efe3cf;

  --shadow: 0 18px 55px rgba(15,36,48,.10);
  --shadow2: 0 10px 28px rgba(15,36,48,.10);
  --radius: 18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(900px 600px at 20% 10%, rgba(192,122,47,.10), transparent 60%),
    radial-gradient(900px 600px at 80% 20%, rgba(14,67,80,.10), transparent 55%),
    var(--bg);
}

a{color:inherit}
.container{max-width:1120px;margin:0 auto;padding:0 18px}

/* Header */
.topbar{
  position:sticky;top:0;z-index:60;
  background: rgba(251,250,247,.86);
  backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(15,36,48,.08);
}
.topbar-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:18px;padding:14px 0;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-logo{ width:76px; height:76px; }
@media (max-width:980px){ .brand-logo{ width:64px; height:64px; } }
}
.brand-text{display:grid;gap:2px}
.brand-name{font-weight:900;letter-spacing:-.02em;font-size:18px}
.brand-loc{color:var(--muted);font-weight:800;font-size:12px}

.nav{display:flex;gap:18px;align-items:center}
.nav a{
  text-decoration:none;color:var(--muted);
  font-weight:800;font-size:13px;
  padding:10px 10px;border-radius:12px;
}
.nav a:hover{background:rgba(15,36,48,.05);color:var(--text)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border-radius:14px;padding:12px 16px;
  font-weight:900;text-decoration:none;border:1px solid transparent;
  box-shadow:none;transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover{transform: translateY(-1px);box-shadow: var(--shadow2)}
.btn-primary{background:linear-gradient(180deg,var(--primary2),var(--primary));color:#fff}
.btn-secondary{background:rgba(15,36,48,.04);border:1px solid var(--line);color:var(--text)}
.btn-ghost{background:rgba(255,255,255,.72);border:1px solid rgba(15,36,48,.10);color:var(--text)}
.btn-lg{padding:14px 18px;border-radius:16px}

/* Hero */
.hero{position:relative;padding:44px 0 18px}
.hero-grid{display:grid;grid-template-columns: 1.2fr .9fr;gap:26px;align-items:start}

.pill{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 14px;border-radius:999px;
  background: rgba(14,67,80,.08);
  border:1px solid rgba(14,67,80,.12);
  color:var(--primary);
  font-weight:900;font-size:13px;
}
.dot{
  width:10px;height:10px;border-radius:999px;background: rgba(192,122,47,.55);
  box-shadow: 0 10px 20px rgba(192,122,47,.20);
}

.hero-title{
  margin:16px 0 12px;
  font-size:56px;line-height:1.02;
  letter-spacing:-.03em;
}
.hl{
  background: linear-gradient(0deg, rgba(242,231,214,.92), rgba(242,231,214,.92));
  padding:0 .16em;border-radius:10px;
}
.hero-sub{
  margin:0;
  color:var(--muted);
  font-size:18px;
  line-height:1.6;
  max-width:60ch;
}

.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 14px}

/* ✅ ICON DOCK (cliquable) */
.icon-dock{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:12px 0 14px;
}
.dock-item{
  display:flex;align-items:center;gap:10px;
  text-decoration:none;
  padding:10px 12px;
  border-radius:16px;
  background: rgba(255,255,255,.72);
  border:1px solid rgba(15,36,48,.10);
  box-shadow: 0 10px 26px rgba(15,36,48,.08);
  transition: transform .15s ease, box-shadow .15s ease;
}
.dock-item:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 45px rgba(15,36,48,.12);
}
.dock-ico{
  width:44px;height:44px;border-radius:16px;
  background: rgba(255,255,255,.60);
  border:1px solid rgba(15,36,48,.10);
  display:grid;place-items:center;
  backdrop-filter: blur(10px);
}
.dock-ico img{
  width:40px;height:40px;object-fit:contain;display:block;
  filter: saturate(1.25) contrast(1.12);
}
.dock-txt{
  font-weight:950;
  font-size:13px;
  letter-spacing:-.01em;
  color: var(--text);
}

/* Quickcards */
.quickcards{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:12px;margin-top:10px;
}
.qcard{
  background: rgba(255,255,255,.70);
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px 12px;
}
.qtitle{font-size:12px;color:var(--muted);font-weight:900}
.qtext{font-size:14px;font-weight:900;margin-top:4px}
.qtext a{text-decoration:none;border-bottom:1px dotted rgba(15,36,48,.25)}

.micro-seo{
  margin:14px 0 0;
  color:rgba(90,103,113,.95);
  font-weight:900;
  font-size:12px;
}

/* Hero right */
.hero-media{display:grid;gap:14px}
.portrait{
  position:relative;
  background: rgba(255,255,255,.65);
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
  box-shadow: var(--shadow);
}
.portrait img{
  width:100%;
  height: 380px;
  object-fit: cover;
  object-position: 50% 20%;
  display:block;
}
.portrait-badge{
  position:absolute;left:14px;bottom:14px;
  background: rgba(255,255,255,.82);
  border:1px solid rgba(15,36,48,.10);
  border-radius:18px;
  padding:10px 12px;
  backdrop-filter: blur(10px);
}
.pb-strong{font-weight:950;letter-spacing:-.01em}
.pb-soft{color:var(--muted);font-weight:800;font-size:12px;margin-top:2px}

/* Cards */
.card{
  background: rgba(255,255,255,.80);
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  box-shadow: var(--shadow);
}
.card-title{margin:0 0 10px;font-size:20px;letter-spacing:-.01em}
.list{margin:0;padding-left:18px;color:var(--muted);line-height:1.75}
.card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.note{margin:10px 0 0;color:var(--muted);font-size:13px}

/* Sections */
.section{padding:56px 0}
.section-tight{padding:42px 0}
.section.alt{
  background: linear-gradient(180deg, rgba(14,67,80,.04), transparent 60%);
  border-top:1px solid rgba(15,36,48,.06);
  border-bottom:1px solid rgba(15,36,48,.06);
}
.section-title{
  margin:0 0 10px;
  font-size:34px;letter-spacing:-.02em;
}
.section-sub{margin:0 0 18px;color:var(--muted);line-height:1.65}

/* ✅ TILES (fix icônes + rendu premium) */
.tile-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.tile{
  position:relative;
  border-radius:28px;
  overflow:hidden;
  border:1px solid rgba(15,36,48,.10);
  box-shadow: var(--shadow2);
  min-height: 285px;
  text-decoration:none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.tile:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 70px rgba(15,36,48,.14);
  border-color: rgba(14,67,80,.18);
}
.tile-wide{grid-column: span 3; min-height: 260px;}

.tile-bg{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  opacity:.92;
  filter: saturate(1.02) contrast(1.04);
}
.tile-overlay{
  position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 20% 0%, rgba(251,250,247,.88), rgba(251,250,247,.26) 62%, rgba(251,250,247,.14)),
    linear-gradient(180deg, rgba(251,250,247,.06), rgba(251,250,247,.62));
}

.tile-top{
  position:absolute;left:18px;top:18px;
  display:flex;align-items:center;gap:10px;
  z-index:2;
}
.tile-kicker{
  display:inline-flex;align-items:center;
  padding:10px 14px;border-radius:999px;
  background: rgba(255,255,255,.74);
  border:1px solid rgba(15,36,48,.10);
  backdrop-filter: blur(10px);
  font-weight:950;letter-spacing:-.01em;
}

/* ✅ correction : icône visible, pas “perdue” */
/* === ICÔNES SPÉCIALITÉS – VERSION PREMIUM === */

.tile-ico{
  width:86px;              /* ⬅️ beaucoup plus grand */
  height:86px;
  border-radius:26px;

  background: rgba(255,255,255,.35); /* fond plus discret */
  border:1px solid rgba(15,36,48,.08);

  display:grid;
  place-items:center;

  backdrop-filter: blur(12px);
  box-shadow:
    0 18px 40px rgba(15,36,48,.15),
    inset 0 0 0 1px rgba(255,255,255,.35);
}

.tile-ico img{
  width:74px;              /* ⬅️ l’icône devient dominante */
  height:74px;
  object-fit:contain;
  display:block;

  filter:
    saturate(1.35)
    contrast(1.15)
    drop-shadow(0 6px 14px rgba(15,36,48,.18));
}


.tile-bottom{
  position:absolute;left:18px;right:18px;bottom:18px;
  background: rgba(255,255,255,.74);
  border:1px solid rgba(15,36,48,.10);
  border-radius:24px;
  padding:18px;
  backdrop-filter: blur(12px);
  z-index:2;
  box-shadow: 0 14px 40px rgba(15,36,48,.12);
}
.tile-bottom h3{
  margin:0 0 8px;
  font-size:22px;
  letter-spacing:-.02em;
}
.tile-bottom p{
  margin:0;
  color:var(--muted);
  font-weight:800;
  line-height:1.55;
}

/* Grids */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.feature{
  background: rgba(255,255,255,.78);
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  box-shadow: var(--shadow2);
}
.feature h3{margin:0 0 8px;font-size:18px}
.feature p{margin:0;color:var(--muted);line-height:1.65}

/* Bio */
.bio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.bullets{margin:0;padding-left:18px;line-height:1.75}
.small{font-size:13px}
.muted{color:var(--muted)}

/* Chips */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.chip{
  display:inline-flex;align-items:center;
  padding:8px 10px;border-radius:999px;
  border:1px solid rgba(15,36,48,.10);
  background: rgba(255,255,255,.72);
  font-weight:900;font-size:12px;color:rgba(15,36,48,.92);
}

/* Split sections with images */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:start}
.split-media{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.media-card{
  margin:0;
  background: rgba(255,255,255,.80);
  border:1px solid rgba(15,36,48,.10);
  border-radius:22px;
  overflow:hidden;
  box-shadow: var(--shadow2);
}
.media-card img{width:100%;height:240px;object-fit:cover;display:block}
.media-card figcaption{
  padding:10px 12px;
  color:var(--muted);
  font-weight:900;
  font-size:12px;
}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.step{
  background: rgba(255,255,255,.78);
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  box-shadow: var(--shadow2);
}
.sn{
  width:38px;height:38px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background: rgba(242,231,214,.9);
  border:1px solid rgba(15,36,48,.08);
  font-weight:950;margin-bottom:10px;
}
.step h3{margin:0 0 8px}
.step p{margin:0;color:var(--muted);line-height:1.65}

/* Panels + form */
.cols{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.panel{
  background: rgba(255,255,255,.80);
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  box-shadow: var(--shadow2);
}
.price{font-size:28px;font-weight:950;margin:6px 0 6px}
.hours{margin:0;padding-left:18px;color:var(--muted);line-height:1.75}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}

.form{display:grid;gap:10px;margin-top:10px}
label{display:grid;gap:6px;font-weight:900;font-size:13px;color:var(--text)}
input, textarea{
  border:1px solid rgba(15,36,48,.14);
  border-radius:14px;
  padding:12px 12px;
  font: inherit;
  background: rgba(255,255,255,.92);
  outline:none;
}
input:focus, textarea:focus{
  border-color: rgba(14,67,80,.40);
  box-shadow: 0 0 0 4px rgba(14,67,80,.10);
}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:900;color:var(--muted)}
.check input{margin-top:3px}

/* Footer */
.footer{
  padding:26px 0;
  border-top:1px solid rgba(15,36,48,.08);
}
.footer-inner{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
.f-title{font-weight:950}
.f-text{color:var(--muted);margin-top:6px}
.f-links{display:flex;gap:14px;flex-wrap:wrap}
.f-links a{color:var(--muted);text-decoration:none;font-weight:950}
.f-links a:hover{color:var(--text)}

/* Sticky mobile bar */
.sticky{
  position:fixed;left:0;right:0;bottom:0;
  display:none;
  background: rgba(251,250,247,.92);
  border-top:1px solid var(--line);
  backdrop-filter: blur(10px);
  padding:10px;
  gap:10px;
  z-index:60;
}
.sbtn{
  flex:1;
  text-decoration:none;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  font-weight:950;
  text-align:center;
}
.sbtn.primary{
  background:linear-gradient(180deg,var(--primary2),var(--primary));
  color:#fff;border-color:transparent;
}

/* Glow */
.hero-glow{
  position:absolute;inset:-40px -20px auto -20px;height:260px;
  background:
    radial-gradient(60% 100% at 30% 20%, rgba(192,122,47,.16), transparent 60%),
    radial-gradient(60% 100% at 70% 10%, rgba(14,67,80,.14), transparent 65%);
  filter: blur(18px);
  pointer-events:none;
  z-index:-1;
}

/* Responsive */
@media (max-width: 1050px){
  .tile-grid{grid-template-columns:1fr}
  .tile-wide{grid-column: auto}
  .split{grid-template-columns:1fr}
  .split-media{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .bio-grid{grid-template-columns:1fr}
}
@media (max-width: 980px){
  .hero-title{font-size:44px}
  .hero-grid{grid-template-columns:1fr}
  .nav{display:none}
  .sticky{display:flex}
  .quickcards{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .cols{grid-template-columns:1fr}
}
/* =========================
   ICÔNES DU HAUT (boutons cliquables)
   ========================= */

.icon-tabs{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:14px;
}

.itab{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-radius:18px;
  text-decoration:none;

  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,36,48,.10);
  box-shadow: 0 10px 26px rgba(15,36,48,.10);

  transition: transform .15s ease, box-shadow .15s ease;
}

.itab:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(15,36,48,.14);
}

.itab .i{
  width:62px;              /* ⬅️ le “carré” devient cohérent */
  height:62px;
  border-radius:18px;

  display:grid;
  place-items:center;

  background: rgba(255,255,255,.35);
  border: 1px solid rgba(15,36,48,.08);
  backdrop-filter: blur(10px);

  box-shadow:
    0 12px 26px rgba(15,36,48,.12),
    inset 0 0 0 1px rgba(255,255,255,.35);
}

.itab .i img{
  width:54px;              /* ⬅️ l’icône devient visible */
  height:54px;
  object-fit:contain;
  display:block;

  filter:
    saturate(1.35)
    contrast(1.12)
    drop-shadow(0 6px 14px rgba(15,36,48,.16));
}

.itab span:last-child{
  font-weight:900;
  letter-spacing:-.01em;
}
/* =========================
   PAGES ANNEXES (layout)
========================= */

.page-hero{
  padding: 44px 0 18px;
  position: relative;
}

.page-hero-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 22px;
  align-items: start;
}

.page-title{
  margin: 14px 0 10px;
  font-size: 52px;
  line-height: 1.03;
  letter-spacing: -.03em;
}

.page-sub{
  margin: 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.65;
  max-width: 62ch;
}

.page-cta{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 18px 0 12px;
}

.page-card{
  background: rgba(255,255,255,.78);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  box-shadow: var(--shadow);
}

.page-card-top{
  display:flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}

.page-ico{
  width: 56px;
  height: 56px;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(15,36,48,.12));
}

.page-card-kicker{
  font-weight: 800;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.page-card-title{
  font-weight: 900;
  font-size: 18px;
  letter-spacing: -.01em;
}

.media-duo{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.content-grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  align-items: start;
}

@media (max-width: 980px){
  .page-hero-grid{grid-template-columns: 1fr}
  .page-title{font-size: 40px}
  .media-duo{grid-template-columns: 1fr}
  .content-grid{grid-template-columns: 1fr}
}
/* =========================
   PAGES ANNEXES — THEMING (fond différent, même style)
   Utilise : <body class="page page-sport"> (ou page-bebe, etc.)
========================= */

body.page{
  background:
    radial-gradient(900px 600px at 18% 12%, rgba(192,122,47,.08), transparent 60%),
    radial-gradient(900px 600px at 82% 18%, rgba(14,67,80,.08), transparent 55%),
    #fbfaf7;
}

/* Variante sport : un peu plus “acier/bleu” (subtil) */
body.page-sport{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(14,67,80,.10), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(192,122,47,.06), transparent 55%),
    #fbfaf7;
}

/* Optionnel : petite différence sur le header en page annexe (très léger) */
body.page .topbar{
  background: rgba(251,250,247,.88);
}

/* =========================
   PATCH SPORT-TRAUMA (UX + Apple-like)
========================= */

/* chips cliquables */
.chip-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin: 10px 0 0;
}

.chip-link{
  text-decoration:none;
  cursor:pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.chip-link:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow2);
  background: rgba(255,255,255,.92);
}

/* focus accessible */
.chip-link:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(14,67,80,.14);
}

/* vignettes cliquables + lisibilité du figcaption */
.media-link{
  position:relative;
  display:block;
  text-decoration:none;
  color:inherit;
  overflow:hidden;
  border-radius: 18px;
  transition: transform .15s ease, box-shadow .15s ease;
}

.media-link img{
  width:100%;
  height: 260px;
  object-fit: cover;
  object-position: 50% 45%;
  display:block;
  border-radius: 18px;
}

/* voile en bas pour lisibilité */
.media-shade{
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0) 55%,
    rgba(0,0,0,.22) 100%
  );
  opacity:.55;
  transition: opacity .18s ease;
  pointer-events:none;
}

.media-link figcaption{
  position:absolute;
  left: 12px;
  bottom: 10px;
  margin:0;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255,255,255,.90);
  border: 1px solid rgba(15,36,48,.10);
  font-weight: 900;
  font-size: 13px;
  letter-spacing: -.01em;
  box-shadow: 0 10px 26px rgba(15,36,48,.10);
}

.media-link:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow2);
}
.media-link:hover .media-shade{ opacity:.70; }

.media-link:focus-visible{
  outline:none;
  box-shadow: 0 0 0 4px rgba(14,67,80,.14);
}

/* responsive */
@media (max-width: 980px){
  .media-link img{ height: 320px; }
}
/* Variante bébé : plus “doux / parentalité” (subtil, Apple-like) */
body.page-bebe{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(192,122,47,.08), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(14,67,80,.08), transparent 55%),
    #fbfaf7;
}
/* Variante seniors : un peu plus “calme / respiration” (subtil) */
body.page-seniors{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(14,67,80,.09), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(192,122,47,.05), transparent 55%),
    #fbfaf7;
}
/* Variante ATM : un peu plus “nerf / précision” (subtil, premium) */
body.page-atm{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(14,67,80,.10), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(192,122,47,.06), transparent 55%),
    #fbfaf7;
}
/* Variante musiciens : touche “jazz” très subtile (premium) */
body.page-musiciens{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(192,122,47,.09), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(14,67,80,.09), transparent 55%),
    #fbfaf7;
}
/* Variante app : moderne / tech (subtil, premium) */
body.page-app{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(14,67,80,.10), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(192,122,47,.07), transparent 55%),
    #fbfaf7;
}
/* Variante double compétence : sobre, “clinique” (subtil) */
body.page-double{
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(14,67,80,.10), transparent 60%),
    radial-gradient(900px 600px at 84% 18%, rgba(192,122,47,.05), transparent 55%),
    #fbfaf7;
}
/* =========================
   DOCK (INDEX) — FINAL (icônes + grandes, sans casser le layout)
   ========================= */

.icon-dock{ gap:12px; }

.dock-item{
  padding:12px 14px;                 /* un peu + “premium” */
  border-radius:18px;
  background: rgba(255,255,255,.90);
  border: 1px solid rgba(15,36,48,.14);
  box-shadow: 0 14px 34px rgba(15,36,48,.10);
}

.dock-ico{
  width:62px;                         /* + grand */
  height:62px;
  border-radius:20px;
  background: rgba(255,255,255,.95);
  border:1px solid rgba(15,36,48,.16);
  display:grid;
  place-items:center;
  overflow:hidden;                    /* propre */
  box-shadow: 0 12px 26px rgba(15,36,48,.12);
}

.dock-ico img{
  width:60px;                         /* max dans le carré */
  height:60px;
  object-fit:contain;
  display:block;

  /* ✅ clé du problème (PNG avec marges transparentes) */
  transform: scale(1.18);             /* ajuste si besoin: 1.12 → 1.25 */
  transform-origin:center;

  /* rendu net */
  filter: saturate(1.25) contrast(1.12) drop-shadow(0 6px 14px rgba(15,36,48,.18));
}

.dock-txt{
  font-weight:950;
  font-size:14px;                      /* léger boost */
  letter-spacing:-.012em;
}

/* Focus */
.dock-item:focus-visible{
  outline:none;
  box-shadow: 0 0 0 4px rgba(14,67,80,.14), 0 18px 45px rgba(15,36,48,.12);
}

/* Responsive */
@media (max-width: 980px){
  .dock-ico{ width:66px; height:66px; }
  .dock-ico img{ width:64px; height:64px; transform: scale(1.16); }
}
/* =========================
   FINAL TWEAKS — LOGO + DOCK
   (safe, sans régression)
   ========================= */

/* 1) LOGO : plus grand + surtout NON déformé */
.brand-logo{
  width:88px;                 /* + grand */
  height:88px;                /* carré -> impossible d’être ovale */
  object-fit:contain;
  aspect-ratio:1/1;           /* verrouille le ratio */
  display:block;
}

@media (max-width:980px){
  .brand-logo{ width:70px; height:70px; }
}

/* 2) DOCK : icônes un cran au-dessus */
.dock-ico{
  width:68px;
  height:68px;
  border-radius:22px;
  overflow:hidden;
}

.dock-ico img{
  width:66px;
  height:66px;
  transform: scale(1.22);     /* avant ~1.18 -> + visible */
  transform-origin:center;
}