/* SOPETANCA — charte : rouge #C0262A, bleu #0062B5, noir/blanc/gris.
   Mise en page dense inspirée d'obut.com. */

:root{
  --red:#C0262A; --red-dk:#9a1e21; --red-lt:#e8484c;
  /* Bleu repris exactement du logo (échantillonné sur le fichier fourni) */
  --blue:#0660AE; --blue-dk:#04508F;
  /* Bleu profond éclairci à la demande de Gaël (était #00335F, trop sombre) */
  --navy:#004785; --navy-2:#003A6B;
  --ink:#141414; --ink-2:#333; --mut:#6b6b6b;
  --line:#dddddd; --line-2:#eeeeee; --paper:#f7f7f7; --white:#fff;
  --wrap:1320px; --r:6px;
  --shadow:0 10px 30px -18px rgba(0,0,0,.45);
  --ff:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --fh:'Barlow Condensed','Inter',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--ff);font-size:15px;line-height:1.6;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--red)}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 24px}

/* ---------- Titres / utilitaires ---------- */
.so-h1,.so-h2{font-family:var(--fh);font-weight:700;letter-spacing:.01em;line-height:1.08;margin:0 0 14px;text-transform:uppercase}
.so-h1{font-size:clamp(30px,4vw,46px)}
.so-h2{font-size:clamp(26px,3.2vw,38px)}
.so-h2 em,.so-h1 em{font-style:normal;color:var(--red)}
.so-h2--light,.so-h2--light em{color:#fff}
.so-h2--light em{color:var(--red-lt)}
.so-eyebrow{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.so-eyebrow--light{color:var(--red-lt)}
.so-lead{font-size:16px;color:var(--mut);max-width:62ch;margin:0 0 18px}
.so-sec{padding:clamp(44px,6vw,78px) 0}
.so-sec--alt{background:var(--paper)}
.so-sec--dark{background:var(--blue);color:#fff}
.so-sec--dark .so-lead{color:rgba(255,255,255,.72)}
.so-sec__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:26px}
.so-main{padding:26px 0 60px;min-height:50vh}

.so-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border:2px solid transparent;border-radius:var(--r);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .15s}
.so-btn:hover{transform:translateY(-1px);color:#fff}
.so-btn--red{background:var(--red);color:#fff;border-color:var(--red)}
.so-btn--red:hover{background:var(--red-dk);border-color:var(--red-dk)}
.so-btn--blue{background:var(--blue);color:#fff;border-color:var(--blue)}
.so-btn--blue:hover{background:var(--blue-dk);border-color:var(--blue-dk)}
.so-btn--outline{border-color:var(--navy);color:var(--navy)}
.so-btn--outline:hover{background:var(--navy);color:#fff}
.so-btn--ghost{border-color:rgba(255,255,255,.6);color:#fff}
.so-btn--ghost:hover{background:#fff;color:var(--ink)}

/* ---------- Barre de topo ---------- */
.so-topbar{background:var(--navy);color:rgba(255,255,255,.82);font-size:12.5px}
.so-topbar__in{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:38px;flex-wrap:wrap}
.so-topbar__right{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.so-topbar a:hover{color:var(--red-lt)}
.so-topbar__ship{color:var(--red-lt);font-weight:600}
/* Sélecteur de langue maison (le moteur Google reste, son interface est masquée) */
.so-lang{display:inline-flex;align-items:center;gap:2px;border:1px solid rgba(255,255,255,.22);border-radius:4px;padding:2px;margin-left:4px}
.so-lang__b{background:none;border:0;color:rgba(255,255,255,.7);font:inherit;font-size:11.5px;font-weight:600;letter-spacing:.04em;padding:3px 7px;border-radius:3px;cursor:pointer;line-height:1.4}
.so-lang__b:hover{color:#fff;background:rgba(255,255,255,.1)}
.so-lang__b.is-on{background:var(--red);color:#fff}
/* Interface injectée par Google : bannière, infobulle, conteneur — tout masqué */
#google_translate_element{position:absolute!important;left:-9999px!important;top:0!important;width:1px;height:1px;overflow:hidden}
.goog-te-banner-frame,.goog-te-balloon-frame,#goog-gt-tt,.goog-te-gadget,.goog-tooltip{display:none!important}
body>.skiptranslate{display:none!important}
body{top:0!important;position:static!important}
.goog-text-highlight{background:none!important;box-shadow:none!important}

/* ---------- En-tête ---------- */
.so-head{position:sticky;top:0;z-index:200;background:#fff;border-bottom:1px solid var(--line)}
.so-head__in{display:flex;align-items:center;gap:26px;min-height:84px;flex-wrap:nowrap}
.so-logo{flex:0 0 auto;display:flex;align-items:center;padding:6px 0}
.so-logo img{height:66px;width:auto}
.so-nav{margin-left:2px;min-width:0}
.so-nav__ul{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.so-nav__ul>li{position:relative}
.so-nav__ul>li>a{display:block;padding:12px 13px;font-family:var(--fh);font-size:16px;font-weight:600;letter-spacing:.03em;text-transform:uppercase}
.so-nav__ul>li>a:hover{color:var(--red)}
.so-nav__ul>li.has-sub>a::after,.so-nav__ul>li.menu-item-has-children>a::after{content:'';display:inline-block;width:6px;height:6px;margin-left:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.so-sub,.so-nav__ul .sub-menu{position:absolute;top:100%;left:0;min-width:240px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:8px;margin:0;list-style:none;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;z-index:210}
.so-nav__ul>li:hover .so-sub,.so-nav__ul>li:hover .sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.so-sub a,.sub-menu a{display:block;padding:9px 12px;border-radius:4px;font-size:14px}
.so-sub a:hover,.sub-menu a:hover{background:var(--paper);color:var(--red)}

.so-head__tools{margin-left:auto;display:flex;align-items:center;gap:14px}
.so-search{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.so-search input{border:0;background:transparent;padding:9px 12px;font-size:14px;width:210px;outline:none;font-family:inherit}
.so-search button{border:0;background:var(--navy);color:#fff;padding:9px 12px;cursor:pointer;display:flex;align-items:center}
.so-search button:hover{background:var(--red)}
.so-acct,.so-cart{position:relative;display:flex;align-items:center;color:var(--ink)}
.so-acct:hover,.so-cart:hover{color:var(--red)}
.so-cart__n{position:absolute;top:-6px;right:-9px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.so-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.so-burger span{display:block;width:24px;height:2px;background:var(--ink);transition:.2s}

/* ---------- Hero ---------- */
/* Hero en deux volets : panneau bleu pour le texte, photo a droite en pleine lumiere.
   Poser le texte sur la photo obligeait a l'assombrir fortement, ce qui la rendait terne. */
.so-hero{display:grid;grid-template-columns:1fr 1fr;min-height:clamp(460px,52vw,700px);color:#fff}
.so-hero__panel{background:var(--navy);display:flex;align-items:center;justify-content:flex-end;padding:56px 46px 56px 24px;position:relative}
.so-hero__panel::after{content:'';position:absolute;top:0;bottom:0;right:0;width:6px;background:var(--red)}
.so-hero__in{width:100%;max-width:calc((var(--wrap) - 48px) / 2)}
/* Propriétés longues volontairement : le raccourci « background: var(--x) pos/size » est
   ignoré en bloc par le navigateur (var() + syntaxe position/taille), ce qui laissait la
   photo à sa taille naturelle avec des bandes claires de chaque côté. */
.so-hero__media{background-color:var(--paper);background-position:center 32%;background-size:cover;background-repeat:no-repeat;min-height:280px}
.so-hero h1{font-family:var(--fh);font-size:clamp(38px,6vw,72px);line-height:1.03;text-transform:uppercase;margin:0 0 14px;font-weight:700}
.so-hero h1 em{font-style:normal;color:var(--red-lt);display:block}
.so-hero p{font-size:17px;color:rgba(255,255,255,.82);max-width:56ch;margin:0 0 26px}
.so-hero__cta{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- Hero : diaporama plein écran, texte par-dessus ---------- */
.so-hero2{position:relative;isolation:isolate;min-height:clamp(520px,72vh,760px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--navy)}
.so-hero2__slides{position:absolute;inset:0;z-index:0}
.so-hero2__slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.1s ease;will-change:opacity}
.so-hero2__slide.is-on{opacity:1;animation:so-kb 9s ease-out forwards}
/* Léger travelling avant : donne de la vie sans bouger le texte */
@keyframes so-kb{from{transform:scale(1.06)}to{transform:scale(1)}}
/* Voile : dégradé foncé en bas et sur la gauche pour garder le texte lisible */
/* Voile neutre (noir translucide) : le calque bleu dénaturait les photos */
.so-hero2::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.42) 34%,rgba(0,0,0,.06) 62%,rgba(0,0,0,.18) 100%),
             linear-gradient(to right,rgba(0,0,0,.48) 0%,rgba(0,0,0,.16) 44%,rgba(0,0,0,0) 70%)}
.so-hero2::after{content:'';position:absolute;left:0;right:0;bottom:0;height:6px;z-index:3;background:var(--red)}
/* Padding en vh : sur un écran peu haut le hero doit pouvoir se comprimer pour que
   le bandeau de réassurance reste au-dessus de la ligne de flottaison. */
.so-hero2__in{position:relative;z-index:2;padding-top:clamp(52px,9vh,132px);padding-bottom:clamp(66px,9vh,110px);max-width:var(--wrap);width:100%}
/* Sur photo, le sur-titre rouge se perd : pastille pleine */
.so-hero2__in .so-eyebrow{background:var(--red);color:#fff;padding:6px 12px;border-radius:3px;margin-bottom:16px;letter-spacing:.12em}
.so-hero2__in h1{font-family:var(--fh);font-size:clamp(38px,6.4vw,78px);line-height:.98;text-transform:uppercase;margin:0 0 16px;font-weight:700;max-width:16ch;text-shadow:0 2px 24px rgba(0,20,40,.35)}
.so-hero2__in h1 em{font-style:normal;color:var(--red-lt);display:block}
.so-hero2__in p{font-size:clamp(15px,1.3vw,18px);color:rgba(255,255,255,.88);max-width:52ch;margin:0 0 26px;text-shadow:0 1px 12px rgba(0,20,40,.4)}
/* Barre du bas : compteur, rail de progression, appel au scroll */
.so-hero2__barra{position:absolute;left:50%;transform:translateX(-50%);bottom:26px;z-index:3;
  display:flex;align-items:center;gap:22px;width:100%;max-width:var(--wrap)}
.so-hero2__conta{font-family:var(--fh);color:#fff;line-height:1;display:flex;align-items:baseline;gap:2px}
.so-hero2__conta b{font-size:26px;font-weight:700}
.so-hero2__conta i{font-style:normal;font-size:14px;color:rgba(255,255,255,.55)}
.so-hero2__dots{display:flex;gap:10px;flex:1}
.so-hero2__dot{position:relative;flex:0 0 56px;height:3px;border:0;padding:0;border-radius:2px;background:rgba(255,255,255,.28);cursor:pointer;overflow:hidden;transition:flex-basis .3s ease,background .2s}
.so-hero2__dot:hover{background:rgba(255,255,255,.5)}
.so-hero2__dot span{position:absolute;inset:0;width:0;background:var(--red);border-radius:2px}
.so-hero2__dot.is-on{flex-basis:120px}
/* La barre se remplit sur la durée de l'autoplay : on voit le temps passer */
.so-hero2__dot.is-on span{animation:so-rail 6s linear forwards}
@keyframes so-rail{from{width:0}to{width:100%}}
.so-hero2__scroll{margin-left:auto;display:inline-flex;align-items:center;gap:9px;color:rgba(255,255,255,.82);
  font-family:var(--fh);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;transition:color .2s,gap .2s}
.so-hero2__scroll:hover{color:#fff;gap:13px}
.so-hero2__scroll span{width:26px;height:26px;border:1px solid rgba(255,255,255,.45);border-radius:50%;position:relative}
.so-hero2__scroll span::before{content:'';position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-5px 0 0 -3px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);animation:so-desce 1.8s ease-in-out infinite}
@keyframes so-desce{0%,100%{transform:rotate(45deg) translate(-2px,-2px);opacity:.5}50%{transform:rotate(45deg) translate(1px,1px);opacity:1}}
/* Entrée du texte au chargement */
.so-hero2__in--anim>*{animation:so-sobe .7s cubic-bezier(.22,.8,.3,1) both}
.so-hero2__in--anim>*:nth-child(2){animation-delay:.08s}
.so-hero2__in--anim>*:nth-child(3){animation-delay:.16s}
.so-hero2__in--anim>*:nth-child(4){animation-delay:.24s}
@keyframes so-sobe{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.so-hero2__slide.is-on{animation:none}.so-hero2__slide{transition:none}
  .so-hero2__in--anim>*{animation:none}.so-hero2__scroll span::before{animation:none}}
/* Écrans peu hauts (portables 1366x768) : on resserre le hero pour que le bandeau
   de réassurance reste visible sans scroller. */
@media(min-width:1041px) and (max-height:800px){
  .so-hero2__in{padding-top:clamp(36px,6vh,84px);padding-bottom:clamp(58px,7vh,80px)}
  .so-hero2__in h1{font-size:clamp(32px,4.6vw,52px);margin-bottom:10px}
  .so-hero2__in p{font-size:15px;margin-bottom:18px}
  .so-hero2__in .so-eyebrow{margin-bottom:10px}
}

/* ---------- Réassurance ---------- */
.so-reas{background:var(--paper);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.so-reas__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:20px;padding-bottom:20px}
.so-reas__item{display:flex;align-items:center;gap:13px;padding:6px 10px}
.so-reas__ic{flex:0 0 auto;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--red)}
.so-reas__ic svg{width:20px;height:20px}
/* Cibler le texte par « > div » : « .so-reas__item span » attrapait aussi la pastille
   .so-reas__ic (un span) et lui remettait display:block, ce qui tuait le centrage flex
   de l'icône — le SVG se collait en haut à gauche du rond. */
.so-reas__item strong{display:block;font-size:13.5px;line-height:1.25}
.so-reas__item>div span{display:block;font-size:12.5px;color:var(--mut)}

/* ---------- Catégories ---------- */
.so-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.so-cat{display:block;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;transition:box-shadow .2s,transform .2s}
.so-cat:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.so-cat__img{aspect-ratio:4/3;background-color:var(--paper);background-position:center;background-size:cover;background-repeat:no-repeat;border-bottom:1px solid var(--line-2)}
.so-cat__body{padding:16px 18px 20px}
.so-cat__body h3{font-family:var(--fh);font-size:20px;text-transform:uppercase;margin:0 0 4px;font-weight:600;min-height:2.2em;display:flex;align-items:flex-start}
.so-cat__body span{font-size:13.5px;color:var(--mut)}
.so-cat:hover .so-cat__body h3{color:var(--red)}

/* ---------- Catégories : bento ----------
   Grille asymétrique + cartes à fond dégradé : les visuels sont des packshots détourés
   sur blanc, un traitement « photo pleine carte » les aurait rendus sales. */
.so-cats2__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:22px}
.so-cats2__head .so-h2{margin:0}
.so-cats2__tudo{display:inline-flex;align-items:center;gap:8px;font-family:var(--fh);font-size:15px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--navy);border-bottom:2px solid var(--red);padding-bottom:3px;transition:gap .2s,color .2s}
.so-cats2__tudo:hover{gap:14px;color:var(--red)}
/* Rangées de hauteur fixe : sinon la carte vedette (2 rangées) suit la hauteur de la
   carte voisine et devient démesurée. */
.so-cats2__grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(200px,17vw,248px);gap:14px}
.so-cat2{position:relative;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line-2);border-radius:16px;
  background:linear-gradient(165deg,#fff 0%,#f2f5f8 58%,#e9eef4 100%);transition:transform .25s,box-shadow .25s,border-color .25s}
.so-cat2:hover{transform:translateY(-4px);box-shadow:0 26px 50px -30px rgba(0,51,95,.55);border-color:var(--line)}
.so-cat2__media{flex:1;display:flex;align-items:center;justify-content:center;padding:22px 22px 6px;min-height:0}
.so-cat2__media img{width:auto;max-width:78%;max-height:100%;object-fit:contain;transition:transform .35s ease;mix-blend-mode:multiply}
.so-cat2:hover .so-cat2__media img{transform:scale(1.07) rotate(-1deg)}
.so-cat2__body{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;padding:16px 20px 20px}
.so-cat2__body h3{font-family:var(--fh);font-size:19px;line-height:1.12;text-transform:uppercase;font-weight:600;margin:0 0 4px;color:var(--ink)}
.so-cat2__desc{display:block;font-size:13px;color:var(--mut);line-height:1.4}
.so-cat2__seta{flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:17px;transition:background .2s,transform .2s}
.so-cat2:hover .so-cat2__seta{background:var(--red);transform:translateX(3px)}
/* Bento : la première carte occupe deux colonnes et deux rangées */
.so-cat2:nth-child(1){grid-column:span 2;grid-row:span 2}
.so-cat2:nth-child(1) .so-cat2__media{padding:34px 34px 10px}
.so-cat2:nth-child(1) .so-cat2__media img{max-width:62%}
.so-cat2:nth-child(1) .so-cat2__body h3{font-size:26px}
.so-cat2:nth-child(1) .so-cat2__desc{font-size:14.5px}
.so-cat2:nth-child(2){grid-column:span 2;flex-direction:row-reverse;align-items:stretch}
/* Carte large : image à droite, texte à gauche — empilé, le packshot vertical du sac
   se retrouvait minuscule au milieu d'un grand vide. */
.so-cat2:nth-child(2) .so-cat2__media{flex:0 0 44%;padding:20px 24px}
.so-cat2:nth-child(2) .so-cat2__media img{max-width:100%}
.so-cat2:nth-child(2) .so-cat2__body{flex:1;flex-direction:column;align-items:flex-start;justify-content:center;padding:22px 8px 22px 24px;gap:16px}
.so-cat2:nth-child(2) .so-cat2__body h3{font-size:23px}

/* ---------- Guide ---------- */
.so-guia{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center}
.so-guia__steps{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:18px}
.so-guia__steps li{display:flex;gap:16px}
.so-guia__n{flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fh);font-size:19px;font-weight:700}
.so-guia__steps strong{display:block;font-size:16px;margin-bottom:2px}
.so-guia__steps p{margin:0;color:rgba(255,255,255,.82);font-size:14.5px}
/* Sur fond bleu, le rouge de marque reste la couleur d'accent (numéros, sur-titre) */
.so-sec--dark .so-eyebrow--light{color:#fff}
.so-sec--dark .so-h2--light em{color:#fff;background:var(--red);padding:0 10px;display:inline-block}
.so-guia__img img{border-radius:var(--r);width:100%;object-fit:cover;aspect-ratio:4/3}

/* ---------- Guia v2 : critères + sélecteur ----------
   Fond clair, titre « sticker » rouge et outil interactif : la version précédente
   (aplat bleu + liste numérotée) faisait daté. */
.so-guia2{position:relative;background:var(--paper);padding:clamp(52px,7vw,96px) 0;overflow:hidden;border-top:1px solid var(--line-2)}
.so-guia2::before{content:'';position:absolute;top:-160px;right:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(0,98,181,.10),transparent 68%);pointer-events:none}
.so-guia2::after{content:'';position:absolute;bottom:-200px;left:-140px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(192,38,42,.08),transparent 68%);pointer-events:none}
.so-guia2__in{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(22px,3vw,40px) clamp(30px,4.5vw,68px);align-items:start;
  grid-template-areas:'head tool' 'crit tool'}
.so-guia2__head{grid-area:head}
.so-guia2__col{grid-area:crit}
.so-guia2__col--tool{grid-area:tool}
.so-guia2__titulo{font-family:var(--fh);font-weight:700;text-transform:uppercase;line-height:.98;letter-spacing:-.01em;font-size:clamp(34px,5.2vw,62px);margin:0 0 16px}
/* Effet « sticker » : le mot mis en avant est décalé et posé sur un aplat rouge */
.so-guia2__titulo em{display:inline-block;font-style:normal;color:#fff;background:var(--red);padding:0 .18em;transform:rotate(-1.4deg);box-shadow:6px 6px 0 var(--navy)}
.so-guia2__lead{font-size:17px;color:var(--mut);max-width:52ch;margin:0 0 30px}
.so-guia2__criterios{display:grid;gap:12px}
.so-crit{position:relative;display:block;background:#fff;border:1px solid var(--line-2);border-radius:12px;padding:20px 22px 20px 76px;color:inherit;transition:transform .2s,box-shadow .2s,border-color .2s}
.so-crit__mais{display:block;margin-top:9px;font-family:var(--fh);font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--red);opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s}
.so-crit:hover .so-crit__mais{opacity:1;transform:none}
.so-crit:hover h3{color:var(--navy)}
.so-crit:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--line)}
.so-crit__n{position:absolute;left:20px;top:16px;font-family:var(--fh);font-size:34px;font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--red);letter-spacing:-.02em}
.so-crit h3{font-family:var(--fh);font-size:20px;text-transform:uppercase;font-weight:600;margin:0 0 4px;letter-spacing:.02em}
.so-crit p{margin:0;font-size:14.5px;color:var(--mut);line-height:1.55}

/* Sélecteur */
.so-pick{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 24px 60px -34px rgba(0,51,95,.55)}
.so-pick__foto{position:relative;background:#fff;padding:26px 22px 10px;display:flex;justify-content:center}
/* halo derrière la boule plutôt qu'un aplat : la photo est sur fond blanc, un dégradé
   dans le conteneur laissait voir les bords du JPEG. */
.so-pick__foto::before{content:'';position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:min(78%,290px);aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle,rgba(0,98,181,.12),transparent 70%)}
/* Pas de drop-shadow : la photo est un JPEG opaque, l'ombre dessinerait le carré blanc.
   L'ombre au sol est une ellipse posée en ::after. */
.so-pick__foto img{position:relative;z-index:1;width:min(100%,300px);aspect-ratio:1/1;object-fit:contain;mix-blend-mode:multiply;animation:so-float 6s ease-in-out infinite}
.so-pick__foto::after{content:'';position:absolute;left:50%;bottom:16px;transform:translateX(-50%);width:min(46%,150px);height:16px;border-radius:50%;background:radial-gradient(ellipse,rgba(0,51,95,.28),transparent 70%);filter:blur(2px)}
@keyframes so-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.so-pick__corpo{padding:22px 24px 24px}
.so-pick__q{font-family:var(--fh);font-size:15px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--navy);margin:0 0 9px}
.so-pick__ops{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.so-pick__op{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 16px;font-family:var(--ff);font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:background .16s,color .16s,border-color .16s,transform .16s}
.so-pick__op:hover{border-color:var(--navy);transform:translateY(-1px)}
.so-pick__op.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.so-pick__res{background:var(--navy);color:#fff;border-radius:12px;padding:16px 18px;margin:4px 0 18px}
.so-pick__res-lab{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:8px}
.so-pick__res-vals{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:14.5px;color:rgba(255,255,255,.82)}
.so-pick__res-vals b{font-family:var(--fh);font-size:22px;font-weight:700;color:#fff;letter-spacing:.01em}
.so-pick__acoes{display:flex;gap:10px;flex-wrap:wrap}
.so-pick__acoes .so-btn{padding:12px 20px;font-size:12.5px}

/* ---------- À propos ---------- */
.so-sobre{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(28px,5vw,60px);align-items:center}
.so-sobre__img img{border-radius:var(--r);aspect-ratio:4/3;object-fit:cover;width:100%}
.so-ticks{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:9px}
.so-ticks li{position:relative;padding-left:28px;font-size:15px}
.so-ticks li::before{content:'';position:absolute;left:0;top:6px;width:16px;height:9px;border-left:2.5px solid var(--blue);border-bottom:2.5px solid var(--blue);transform:rotate(-45deg)}

/* ---------- WooCommerce : grille produits ---------- */
.woocommerce ul.products,ul.products{display:grid!important;grid-template-columns:repeat(4,1fr);gap:22px;list-style:none;margin:0;padding:0}
/* WooCommerce ajoute un clearfix ::before/::after : en grille il occuperait une cellule
   et décalerait toute la première rangée. */
.woocommerce ul.products::before,.woocommerce ul.products::after,ul.products::before,ul.products::after{content:none!important;display:none!important}
.woocommerce ul.products li.product,ul.products li.product{width:auto!important;margin:0!important;float:none!important;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:0;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s;text-align:left}
.woocommerce ul.products li.product:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
/* NB : ces règles ne sont PAS préfixées « .woocommerce » — la grille de la page d'accueil
   est rendue hors du wrapper WooCommerce, un sélecteur préfixé ne l'atteindrait pas. */
ul.products li.product a img{margin:0;padding:16px;background:#fff;aspect-ratio:1/1;object-fit:contain;width:100%}
/* Titre sur 2 lignes maxi : sans cela les noms longs décalent le prix d'une carte à l'autre */
ul.products li.product .woocommerce-loop-product__title{font-family:var(--fh);font-size:16px;font-weight:600;text-transform:uppercase;line-height:1.22;padding:0 16px;margin:2px 0 8px;min-height:2.44em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
ul.products li.product .price{display:block;padding:0 16px;color:var(--ink);font-size:17px;font-weight:700;margin:0 0 14px;min-height:1.5em}
ul.products li.product .price del{color:var(--mut);font-weight:400;font-size:14px;margin-right:6px}
ul.products li.product .price ins{text-decoration:none;color:var(--red)}
ul.products li.product .button,ul.products li.product .added_to_cart{margin:auto 16px 16px;background:var(--navy);color:#fff;border-radius:var(--r);padding:11px 16px;font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;text-align:center;display:block;border:0;line-height:1.3}
ul.products li.product .button:hover,ul.products li.product .added_to_cart:hover{background:var(--red);color:#fff}
.woocommerce span.onsale,ul.products li.product .onsale{position:absolute;top:10px;left:10px;background:var(--red);color:#fff;border-radius:3px;padding:4px 10px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;min-height:0;line-height:1.4;margin:0}
ul.products li.product{position:relative}

/* ---------- WooCommerce : fiche produit ---------- */
.so-crumb{font-size:13px;color:var(--mut);margin-bottom:18px}
.so-crumb a:hover{color:var(--red)}
/* Titres de page WooCommerce (boutique, catégories, panier…) à la police du thème */
.woocommerce-products-header__title,.woocommerce h1.page-title,.woocommerce-page h1.entry-title,
.woocommerce h2.woocommerce-loop-category__title{font-family:var(--fh);font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:1.08;font-size:clamp(28px,3.4vw,42px);margin:0 0 10px}
/* Sous-catégories en pastilles sous le titre d'une page catégorie */
.so-subcats{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 22px}
.so-subcat{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1px solid var(--line);border-radius:999px;background:#fff;font-family:var(--fh);font-size:15px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;line-height:1.2;transition:background .18s,border-color .18s,color .18s}
.so-subcat span{font-family:var(--ff);font-size:11.5px;font-weight:600;color:var(--mut);letter-spacing:0}
.so-subcat:hover{border-color:var(--navy);color:var(--navy)}
.so-subcat.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.so-subcat.is-on span{color:rgba(255,255,255,.68)}
.woocommerce .woocommerce-result-count{color:var(--mut);margin:0 0 22px}
.woocommerce .woocommerce-ordering{margin:0 0 22px}
.term-description{color:var(--mut);max-width:70ch;margin-bottom:18px}
.woocommerce div.product{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
/* Galerie produit : statique, en grille. L'opacité est forcée car WooCommerce pose
   opacity:0 en style inline et compte sur son JS pour la remonter. */
.woocommerce div.product .woocommerce-product-gallery{width:100%!important;float:none!important;margin:0;opacity:1!important}
.woocommerce div.product .woocommerce-product-gallery__wrapper{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0;padding:0;transform:none!important;width:auto!important}
.woocommerce div.product .woocommerce-product-gallery__image{margin:0;width:auto!important;float:none!important;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.woocommerce div.product .woocommerce-product-gallery__image:first-child{grid-column:1/-1}
.woocommerce div.product .woocommerce-product-gallery__image img{width:100%;height:100%;object-fit:contain;padding:10px;aspect-ratio:1/1;display:block}
.woocommerce div.product .woocommerce-product-gallery__image:first-child img{aspect-ratio:4/3;padding:22px}
.woocommerce div.product .woocommerce-product-gallery__trigger{display:none}
.woocommerce div.product .flex-control-thumbs{display:none}
/* Pas de position:sticky ici : un élément collant est borné par son bloc conteneur, et
   pour un enfant de grille c'est le conteneur ENTIER (galerie + onglets + similaires),
   pas sa rangée. Le résumé descendait donc par-dessus les onglets au scroll. */
.woocommerce div.product .summary{width:100%!important;float:none!important;margin:0}
.woocommerce div.product .product_title{font-family:var(--fh);font-size:clamp(26px,3vw,38px);text-transform:uppercase;font-weight:700;line-height:1.1;margin:0 0 12px}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--ink);font-size:28px;font-weight:700;margin-bottom:16px}
.woocommerce div.product p.price ins{color:var(--red);text-decoration:none}
.woocommerce div.product form.cart{margin-top:18px}
.woocommerce div.product form.cart .variations{margin-bottom:14px}
.woocommerce div.product form.cart .variations th{text-align:left;font-weight:600;padding:8px 12px 8px 0}
.woocommerce div.product form.cart .variations select,.woocommerce .quantity input,.woocommerce input[type=text],.woocommerce input[type=email],.woocommerce input[type=tel],.woocommerce input[type=password],.woocommerce input[type=number],.woocommerce textarea,.woocommerce select{border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;font-family:inherit;font-size:14px;background:#fff}
.woocommerce div.product form.cart .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt{background:var(--red);color:#fff;border-radius:var(--r);padding:14px 28px;font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;border:0;line-height:1.3}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover{background:var(--red-dk);color:#fff}
.woocommerce .woocommerce-tabs ul.tabs{padding:0;margin:0 0 18px;border-bottom:1px solid var(--line)}
.woocommerce .woocommerce-tabs ul.tabs::before{border:0}
.woocommerce .woocommerce-tabs ul.tabs li{background:transparent;border:0;border-radius:0;margin:0 22px 0 0;padding:0}
.woocommerce .woocommerce-tabs ul.tabs li::before,.woocommerce .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce .woocommerce-tabs ul.tabs li a{font-family:var(--fh);font-size:18px;text-transform:uppercase;font-weight:600;padding:12px 0;display:block;color:var(--mut);border-bottom:3px solid transparent}
.woocommerce .woocommerce-tabs ul.tabs li.active a{color:var(--ink);border-bottom-color:var(--red)}
.woocommerce div.product .woocommerce-tabs{grid-column:1/-1;margin-top:14px}
.woocommerce .related.products,.woocommerce .upsells.products{grid-column:1/-1;margin-top:34px}
.woocommerce .related h2,.woocommerce .upsells h2{font-family:var(--fh);font-size:26px;text-transform:uppercase;font-weight:700}
.woocommerce div.product .so-reas{grid-column:1/-1;margin-top:26px}

/* ---------- Personalização das bolas ---------- */
.so-perso{margin:18px 0 4px;border-top:1px solid var(--line);padding-top:18px}
.so-perso__abrir{display:inline-flex;align-items:center;gap:10px;background:#fff;border:2px dashed var(--navy);border-radius:var(--r);color:var(--navy);font-family:var(--fh);font-size:15px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:12px 20px;cursor:pointer;transition:background .18s,color .18s}
.so-perso__abrir:hover{background:var(--navy);color:#fff}
.so-perso.is-ativo .so-perso__abrir{background:var(--navy);color:#fff;border-style:solid}
.so-perso__abrir-ic{font-size:17px;line-height:1}
/* [hidden] est écrasé par la règle de classe ci-dessous : on le réaffirme,
   sinon le panneau de personnalisation reste ouvert en permanence. */
.so-perso__painel[hidden]{display:none}
.so-perso__painel{display:grid;grid-template-columns:200px 1fr;gap:22px;margin-top:16px;padding:18px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.so-perso__previa{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.so-perso__previa img{width:100%;height:100%;object-fit:contain;padding:10px}
/* Le texte est posé sur la boule : rendu « gravé » approché (creux sombre + reflet clair) */
.so-perso__previa-txt{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%) rotate(-4deg);max-width:74%;text-align:center;font-family:var(--fh);font-weight:700;font-size:clamp(14px,3.4vw,22px);letter-spacing:.06em;text-transform:uppercase;color:rgba(20,20,20,.62);text-shadow:0 1px 0 rgba(255,255,255,.65);word-break:break-word;line-height:1.15;pointer-events:none}
.so-perso__label{display:block;font-family:var(--fh);font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:.03em;margin:0 0 6px}
.so-perso__campos .so-perso__label+.so-perso__label{margin-top:16px}
.so-perso__select,.so-perso__input{width:100%;border:1px solid var(--line);border-radius:var(--r);padding:11px 12px;font-family:inherit;font-size:14.5px;background:#fff}
.so-perso__ajuda{margin:0 0 8px;font-size:12.5px;color:var(--mut)}
.so-perso__label+.so-perso__ajuda{margin-top:-2px}
.so-perso__contador{margin:6px 0 0;font-size:12.5px;color:var(--mut);text-align:right}
.so-perso__emojis{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.so-perso__emoji{width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:50%;font-size:18px;line-height:1;cursor:pointer;transition:border-color .15s,transform .15s}
.so-perso__emoji:hover{border-color:var(--navy);transform:translateY(-2px)}
.so-perso__total{margin:14px 0 0;font-weight:700;color:var(--navy)}
.so-perso__selo{position:absolute;top:10px;right:10px;z-index:2;background:var(--navy);color:#fff;border-radius:3px;padding:4px 9px;font-family:var(--fh);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}

/* Panier / commande */
.woocommerce table.shop_table{border-radius:var(--r);border-color:var(--line)}
.woocommerce table.shop_table th{font-family:var(--fh);text-transform:uppercase;font-size:15px}
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:var(--red);border-radius:var(--r);background:var(--paper)}
.woocommerce-message::before,.woocommerce-info::before{color:var(--red)}
.woocommerce .woocommerce-ordering select,.woocommerce .woocommerce-result-count{font-size:14px}

/* ---------- Pages / blog ---------- */
.so-page--narrow{max-width:840px}
/* Longueur de ligne lisible pour les pages de texte (mentions légales, etc.) */
.so-rte{max-width:80ch}
.so-rte h2{font-family:var(--fh);font-size:26px;text-transform:uppercase;margin-top:28px}
.so-rte h3{font-size:19px;margin-top:22px}
.so-rte ul{padding-left:20px}
/* Visuels insérés dans une page : bornés, sinon une affiche carrée occupe tout l'écran */
.so-rte figure{margin:0 0 22px}
.so-rte .wp-block-image img,.so-rte figure img{max-width:720px;width:100%;margin:0 auto;border-radius:var(--r)}
.so-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.so-post{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.so-post__body{padding:16px 18px 20px}
.so-post__body h2{font-family:var(--fh);font-size:21px;text-transform:uppercase;margin:0 0 6px}
.so-post__meta{font-size:12.5px;color:var(--mut);margin-bottom:8px}
.so-post__hero{border-radius:var(--r);margin:14px 0 20px}

/* ---------- Espaço CLUBE ---------- */
.so-clube{padding-top:0}
.so-clube__hero{background:var(--navy);color:#fff;padding:clamp(34px,5vw,60px) 0;border-bottom:6px solid var(--red)}
.so-clube__hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(26px,4vw,52px);align-items:center}
.so-clube__hero-txt .so-h1{color:#fff;margin-bottom:10px}
.so-clube__lead{font-size:17px;color:rgba(255,255,255,.78);margin:0 0 22px;max-width:46ch}
.so-clube__hero-img img{width:100%;border-radius:var(--r);box-shadow:var(--shadow)}
.so-clube__corpo{max-width:1000px;padding-top:clamp(34px,5vw,58px);padding-bottom:8px}
.so-clube__corpo h2{font-family:var(--fh);font-size:clamp(24px,2.8vw,32px);text-transform:uppercase;font-weight:700;line-height:1.1;margin:44px 0 14px;padding-top:20px;border-top:1px solid var(--line)}
.so-clube__corpo h2:first-child{margin-top:0;padding-top:0;border-top:0}
.so-clube__corpo p{max-width:78ch}
.so-clube__corpo p.destaque{font-size:17px;font-weight:600;color:var(--navy)}
/* Les listes deviennent une grille de pastilles : plus lisible qu'une colonne de puces */
.so-clube__corpo ul{list-style:none;margin:18px 0 22px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.so-clube__corpo ul li{position:relative;background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r);padding:13px 14px 13px 40px;font-size:14.5px;line-height:1.35}
.so-clube__corpo ul li::before{content:'';position:absolute;left:15px;top:17px;width:13px;height:7px;border-left:2.5px solid var(--red);border-bottom:2.5px solid var(--red);transform:rotate(-45deg)}
.so-clube__cta{background:var(--blue);color:#fff;margin-top:44px;padding:clamp(34px,5vw,56px) 0}
.so-clube__cta-in{display:grid;grid-template-columns:1.4fr .6fr;gap:32px;align-items:center}
.so-clube__cta p{color:rgba(255,255,255,.85);max-width:70ch;margin:0 0 10px}
.so-clube__cta-acoes{display:flex;flex-direction:column;gap:12px}

/* ---------- Eventos ---------- */
.so-evts{display:grid;gap:16px;margin-top:8px}
.so-evts__titulo{margin-top:52px}
.so-evts__vazio{color:var(--mut)}
.so-evt{display:grid;grid-template-columns:88px 1fr;gap:20px;align-items:start;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:18px 20px}
.so-evt:hover{box-shadow:var(--shadow)}
.so-evt__data{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--navy);color:#fff;border-radius:var(--r);padding:12px 6px;font-family:var(--fh);line-height:1}
.so-evt__dia{font-size:32px;font-weight:700}
.so-evt__mes{font-size:15px;text-transform:uppercase;letter-spacing:.08em;margin-top:4px;color:var(--red-lt)}
.so-evt__ano{font-family:var(--ff);font-size:12px;margin-top:6px;color:rgba(255,255,255,.6)}
.so-evt__titulo{font-family:var(--fh);font-size:24px;text-transform:uppercase;font-weight:700;margin:0 0 8px;line-height:1.1}
.so-evt__meta{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:5px;font-size:14.5px;color:var(--ink-2)}
.so-evt__meta li{position:relative;padding-left:24px}
.so-evt__meta li::before{content:'';position:absolute;left:0;top:3px;width:15px;height:15px;background:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;color:var(--red)}
.so-evt__quando::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E")}
.so-evt__onde::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 10-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 10-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/svg%3E")}
.so-evt__onde span{color:var(--mut)}
.so-evt__resumo{margin:0 0 14px;color:var(--mut);font-size:14.5px}
.so-evt__acoes{display:flex;gap:10px;flex-wrap:wrap}
.so-evt__acoes .so-btn{padding:10px 18px;font-size:12px}
.so-evt__img{grid-column:3;width:180px}
.so-evt__img img{border-radius:var(--r);aspect-ratio:4/3;object-fit:cover;width:100%}
.so-evt:has(.so-evt__img){grid-template-columns:88px 1fr 180px}
.so-evts--passados .so-evt{opacity:.72}
.so-evts--passados .so-evt__data{background:var(--mut)}
.so-evt__meta--single{margin:0 0 20px;font-size:16px}

/* ---------- Newsletter + pied de page ---------- */
.so-foot{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);
  color:rgba(255,255,255,.76);padding:clamp(40px,5vw,64px) 0 0;font-size:14.5px}
.so-foot::before{content:'';position:absolute;top:-180px;right:-120px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(6,96,174,.5),transparent 68%);pointer-events:none}
.so-foot>.wrap{position:relative;z-index:1}
/* Signature typographique en filigrane, rognee en bas */
.so-foot__marca{position:absolute;left:50%;bottom:-.30em;transform:translateX(-50%);z-index:0;pointer-events:none;
  font-family:var(--fh);font-weight:700;font-size:clamp(90px,17vw,240px);line-height:.8;letter-spacing:-.02em;
  color:rgba(255,255,255,.045);white-space:nowrap}

/* Carte newsletter */
.so-news2{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;
  background:linear-gradient(120deg,var(--red) 0%,#a71f23 100%);border-radius:20px;
  padding:clamp(24px,3vw,34px) clamp(24px,3.4vw,40px);
  box-shadow:0 30px 60px -34px rgba(0,0,0,.7);margin-bottom:clamp(38px,5vw,58px)}
.so-news2__txt h3{font-family:var(--fh);font-size:clamp(24px,2.6vw,32px);text-transform:uppercase;font-weight:700;color:#fff;margin:0 0 4px}
.so-news2__txt p{margin:0;color:rgba(255,255,255,.84);font-size:15px}
.so-news2__form{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.so-news2__form input{border:0;border-radius:999px;padding:14px 20px;min-width:290px;font-family:inherit;font-size:14.5px;background:#fff;outline:none}
.so-news2__form input:focus{box-shadow:0 0 0 3px rgba(255,255,255,.45)}
.so-news2__form button{display:inline-flex;align-items:center;gap:9px;border:0;border-radius:999px;cursor:pointer;
  background:var(--navy);color:#fff;font-family:var(--fh);font-size:13.5px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;padding:14px 24px;transition:background .2s,gap .2s}
.so-news2__form button:hover{background:#00325f;gap:14px}

/* Colonnes */
.so-foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(26px,3vw,44px)}
.so-foot a{color:rgba(255,255,255,.76)}
.so-foot a:hover{color:#fff}
.so-foot__brand img{margin-bottom:16px;height:50px;width:auto}
.so-foot__brand p{margin:0 0 18px;max-width:42ch;line-height:1.65}
.so-foot__contactos{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:11px;font-size:14px}
.so-foot__ic{position:relative;padding-left:26px;line-height:1.55}
.so-foot__ic::before{content:'';position:absolute;left:0;top:2px;width:15px;height:15px;background:var(--red-lt);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.so-foot__ic--pin::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 10-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 10-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/svg%3E")}
.so-foot__ic--tel::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a12 12 0 005 5L15 13l5 2v4a2 2 0 01-2 2A16 16 0 013 6a2 2 0 012-2z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a12 12 0 005 5L15 13l5 2v4a2 2 0 01-2 2A16 16 0 013 6a2 2 0 012-2z'/%3E%3C/svg%3E")}
.so-foot__ic--mail::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E")}
.so-foot__ic a{font-weight:600;color:#fff}
.so-foot__social{display:flex;gap:10px}
.so-foot__social a{width:38px;height:38px;border:1px solid rgba(255,255,255,.22);border-radius:50%;display:flex;
  align-items:center;justify-content:center;transition:background .2s,border-color .2s,transform .2s}
.so-foot__social a:hover{background:var(--red);border-color:var(--red);color:#fff;transform:translateY(-2px)}
.so-foot__col h5{position:relative;font-family:var(--fh);font-size:16px;text-transform:uppercase;color:#fff;
  margin:0 0 18px;padding-top:12px;font-weight:600;letter-spacing:.06em}
.so-foot__col h5::before{content:'';position:absolute;left:0;top:0;width:26px;height:3px;border-radius:2px;background:var(--red)}
.so-foot__col ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.so-foot__col a{position:relative;display:inline-block;transition:transform .18s,color .18s}
.so-foot__col a::before{content:'\2192';position:absolute;left:-18px;opacity:0;transition:opacity .18s,left .18s;color:var(--red-lt)}
.so-foot__col a:hover{transform:translateX(14px)}
.so-foot__col a:hover::before{opacity:1;left:-16px}

.so-foot__bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.14);margin-top:clamp(32px,4vw,52px);padding:20px 0 26px;font-size:13px}
.so-foot__livro{border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:2px}
.so-foot__livro:hover{border-color:var(--red-lt)}

.so-totop{position:fixed;right:20px;bottom:20px;width:44px;height:44px;border-radius:50%;border:0;background:var(--navy);color:#fff;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:150;box-shadow:var(--shadow)}
.so-totop.on{display:flex}
.so-totop:hover{background:var(--red)}

/* ---------- Ajustements ---------- */
/* Ancres : l'en-tête est collant, sinon la cible passe dessous */
[id]{scroll-margin-top:96px}
/* Photos catalogue détourées sur fond blanc : « contain », sinon le produit est rogné */
.so-cat__img{background-size:contain;background-repeat:no-repeat;background-color:#fff}
.so-guia__img img{object-fit:contain;background:#fff;padding:20px}
.so-sobre__img img{object-fit:cover}
/* WooCommerce cible « .woocommerce ul.products li.product .price » : plus spécifique que
   nos règles non préfixées, il réimposerait sa couleur verte par défaut. */
.woocommerce ul.products li.product .price,.woocommerce-page ul.products li.product .price{color:var(--ink);font-size:17px;font-weight:700}
.woocommerce ul.products li.product .price ins{color:var(--red)}
/* Le retrait de 16px doit être posé sur le sélecteur préfixé « .woocommerce » : sinon
   c'est « padding:.5em 0 » de WooCommerce (4 classes) qui l'emporte et le titre se colle
   au bord de la carte alors que le prix et le bouton restent en retrait. */
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--fh);font-size:16px;text-transform:uppercase;padding:0 16px;margin:2px 0 8px;min-height:2.44em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Le bouton d'une carte produit reste collé en bas quelle que soit la longueur du titre */
ul.products li.product .button,ul.products li.product .added_to_cart{margin-top:auto}
/* Les cartes d'une même rangée ont la même hauteur */
ul.products li.product{height:100%}

/* ---------- Cartes produit v2 ----------
   Refonte des vignettes WooCommerce : plus de cadre dur ni de gros bouton plein,
   on passe sur une carte arrondie, un fond dégradé derrière le packshot, un prix
   affirmé et un bouton pilule qui se remplit au survol. */
.woocommerce ul.products,ul.products{gap:18px}
.woocommerce ul.products li.product,ul.products li.product{
  border:0;border-radius:16px;background:#fff;overflow:hidden;
  background:linear-gradient(180deg,#fff 62%,#f6f8fb 100%);
  box-shadow:0 1px 0 rgba(0,51,95,.06),0 10px 26px -22px rgba(0,51,95,.5);
  transition:transform .25s ease,box-shadow .25s ease}
.woocommerce ul.products li.product:hover,ul.products li.product:hover{
  transform:translateY(-5px);box-shadow:0 26px 46px -28px rgba(0,51,95,.6)}
/* Zone visuelle : dégradé clair + zoom doux au survol */
ul.products li.product a.woocommerce-LoopProduct-link,ul.products li.product a:first-of-type{display:block}
/* Fond blanc derrière le packshot : les photos produit sont des JPEG sur blanc,
   un dégradé ici dessinait un carré blanc au milieu de la carte. */
ul.products li.product a img{background:#fff;padding:20px;
  aspect-ratio:1/1;object-fit:contain;width:100%;transition:transform .4s ease}
ul.products li.product:hover a img{transform:scale(1.06)}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title{
  font-size:15px;letter-spacing:.02em;padding:16px 18px 0;margin:0 0 10px;min-height:2.5em;color:var(--ink)}
.woocommerce ul.products li.product .price,ul.products li.product .price,
.woocommerce-page ul.products li.product .price{
  font-family:var(--fh);font-size:22px;font-weight:700;letter-spacing:.01em;color:var(--navy);padding:0 18px;margin:0 0 14px}
ul.products li.product .price del{font-size:15px}
/* Bouton pilule : contour au repos, plein au survol */
.woocommerce ul.products li.product .button,ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart,ul.products li.product .added_to_cart{
  margin:auto 18px 18px;padding:11px 16px;border-radius:999px;background:transparent;color:var(--navy);
  border:1.5px solid var(--navy);font-size:12px;letter-spacing:.07em;transition:background .18s,color .18s,border-color .18s}
.woocommerce ul.products li.product .button:hover,ul.products li.product .button:hover,
.woocommerce ul.products li.product .added_to_cart:hover,ul.products li.product .added_to_cart:hover{
  background:var(--navy);border-color:var(--navy);color:#fff}
/* Pastilles : promo à gauche, personnalisable à droite, style léger */
.woocommerce span.onsale,ul.products li.product .onsale{
  top:12px;left:12px;border-radius:999px;padding:5px 12px;font-size:10.5px;letter-spacing:.08em;box-shadow:0 6px 16px -8px rgba(192,38,42,.9)}
.so-perso__selo{top:12px;right:12px;background:rgba(255,255,255,.94);color:var(--navy);border:1px solid var(--line);
  border-radius:999px;padding:5px 11px 5px 22px;font-size:10.5px;box-shadow:0 6px 16px -10px rgba(0,51,95,.6)}
.so-perso__selo::before{content:'';position:absolute;left:10px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:var(--red)}

/* ---------- Fiche produit v2 ----------
   Galerie en cartes arrondies, résumé aéré, boutons pilule, onglets en pastilles. */
.woocommerce div.product{gap:clamp(28px,4vw,60px)}
.woocommerce div.product .woocommerce-product-gallery__wrapper{gap:12px}
.woocommerce div.product .woocommerce-product-gallery__image{border:0;border-radius:18px;overflow:hidden;
  background:linear-gradient(168deg,#fff 0%,#f3f6f9 60%,#e9eef4 100%);transition:transform .3s}
.woocommerce div.product .woocommerce-product-gallery__image:first-child img{padding:34px;aspect-ratio:4/3}
.woocommerce div.product .woocommerce-product-gallery__image:not(:first-child){border:1px solid var(--line-2);border-radius:12px}
.woocommerce div.product .woocommerce-product-gallery__image:not(:first-child):hover{transform:translateY(-3px)}
.woocommerce div.product .woocommerce-product-gallery__image img{background:transparent}

.woocommerce div.product .product_title{font-size:clamp(28px,3.2vw,42px);line-height:1.04;letter-spacing:-.005em;margin:0 0 6px}
.woocommerce div.product p.price,.woocommerce div.product span.price{font-family:var(--fh);font-size:34px;font-weight:700;
  color:var(--navy);margin:0}
.so-prod__iva{margin:2px 0 18px;font-size:12.5px;color:var(--mut);letter-spacing:.02em}
.woocommerce div.product .woocommerce-product-details__short-description{color:var(--ink-2);font-size:15px;line-height:1.65;
  border-top:1px solid var(--line-2);padding-top:16px;margin-bottom:4px}

/* Sélecteurs de variation */
.woocommerce div.product form.cart .variations{margin-bottom:18px;border-collapse:separate;border-spacing:0 10px}
.woocommerce div.product form.cart .variations th{font-family:var(--fh);font-size:15px;text-transform:uppercase;
  letter-spacing:.05em;color:var(--navy);vertical-align:middle;padding-right:16px}
.woocommerce div.product form.cart .variations select{border-radius:999px;padding:12px 16px;min-width:190px;border-color:var(--line)}
.woocommerce div.product form.cart .reset_variations{font-size:12.5px}

/* Quantité + ajout au panier */
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:20px}
.woocommerce div.product form.cart .variations,.woocommerce div.product form.cart .woocommerce-variation{flex:0 0 100%}
.woocommerce .quantity input.qty{border-radius:999px;padding:13px 10px;width:78px;text-align:center;font-weight:600;border-color:var(--line)}
.woocommerce div.product form.cart .button{border-radius:999px;padding:15px 34px;font-size:13px;letter-spacing:.08em;
  box-shadow:0 14px 26px -16px rgba(192,38,42,.9);transition:transform .18s,box-shadow .18s,background .18s}
.woocommerce div.product form.cart .button:hover{transform:translateY(-2px);box-shadow:0 18px 30px -16px rgba(192,38,42,.95)}
.woocommerce div.product form.cart .button.disabled,.woocommerce div.product form.cart .button:disabled{opacity:.45;box-shadow:none;transform:none;cursor:not-allowed}

/* Arguments courts */
.so-prod__args{list-style:none;margin:22px 0 18px;padding:18px 0 0;border-top:1px solid var(--line-2);display:grid;gap:11px}
.so-prod__arg{position:relative;padding-left:28px;font-size:14.5px;color:var(--ink-2)}
.so-prod__arg::before{content:'';position:absolute;left:0;top:3px;width:16px;height:16px;background:var(--red);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E")}

/* Métadonnées en pastilles */
.woocommerce div.product .product_meta{font-size:13px;color:var(--mut);border-top:1px solid var(--line-2);padding-top:16px;margin-top:4px}
.woocommerce div.product .product_meta a{display:inline-block;background:var(--paper);border:1px solid var(--line-2);
  border-radius:999px;padding:4px 12px;margin:3px 4px 3px 0;color:var(--ink-2);font-size:12.5px}
.woocommerce div.product .product_meta a:hover{border-color:var(--navy);color:var(--navy)}

/* Onglets en pastilles */
.woocommerce .woocommerce-tabs ul.tabs{border-bottom:1px solid var(--line);display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
/* WooCommerce cible « div.product .woocommerce-tabs ul.tabs li » (plus spécifique) :
   sans le même préfixe, son cadre blanc et ses bordures repassaient devant la pastille. */
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce .woocommerce-tabs ul.tabs li{margin:0;padding:0;background:transparent;border:0;border-radius:0}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none;border:0;box-shadow:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{border:1px solid var(--line);border-radius:999px;padding:10px 20px;
  font-family:var(--fh);font-size:14px;text-transform:uppercase;font-weight:600;color:var(--ink-2);display:block}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.woocommerce .woocommerce-tabs ul.tabs li a{border:1px solid var(--line);border-radius:999px;padding:10px 20px;font-size:14px;
  color:var(--ink-2);border-bottom:1px solid var(--line);transition:background .18s,color .18s,border-color .18s}
.woocommerce .woocommerce-tabs ul.tabs li.active a,.woocommerce .woocommerce-tabs ul.tabs li a:hover{
  background:var(--navy);border-color:var(--navy);color:#fff}
.woocommerce .woocommerce-tabs .panel{padding-top:4px}
.woocommerce .related h2,.woocommerce .upsells h2{position:relative;padding-top:14px}
.woocommerce .related h2::before,.woocommerce .upsells h2::before{content:'';position:absolute;left:0;top:0;width:30px;height:3px;
  border-radius:2px;background:var(--red)}

/* ---------- Page Contactos ---------- */
.so-contactos__head{max-width:70ch;margin-bottom:clamp(26px,3.4vw,42px)}
.so-contactos__head .so-h1{margin-bottom:10px}
.so-contactos__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,3.4vw,48px);align-items:start}

.so-form{background:#fff;border:1px solid var(--line-2);border-radius:18px;padding:clamp(22px,2.6vw,32px);
  box-shadow:0 24px 50px -38px rgba(0,51,95,.6)}
.so-form__linha{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.so-form__campo{display:block;margin-bottom:16px}
.so-form__campo>span{display:block;font-family:var(--fh);font-size:14px;font-weight:600;text-transform:uppercase;
  letter-spacing:.05em;color:var(--navy);margin-bottom:7px}
.so-form input[type=text],.so-form input[type=email],.so-form input[type=tel],.so-form select,.so-form textarea{
  width:100%;border:1px solid var(--line);border-radius:12px;padding:13px 15px;font-family:inherit;font-size:15px;
  background:#fff;outline:none;transition:border-color .18s,box-shadow .18s}
.so-form input:focus,.so-form select:focus,.so-form textarea:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(6,96,174,.14)}
.so-form textarea{resize:vertical;min-height:150px}
.so-form__consent{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--mut);margin:6px 0 20px;line-height:1.5}
.so-form__consent input{margin-top:3px;accent-color:var(--red)}
.so-form__consent a{color:var(--navy);text-decoration:underline}
.so-form .so-btn{width:100%;justify-content:center;border-radius:999px;padding:15px 24px}
.so-form__pote{position:absolute;left:-9999px}
.so-form__ok,.so-form__erro{border-radius:12px;padding:14px 16px;margin:0 0 20px;font-size:14.5px}
.so-form__ok{background:rgba(6,96,174,.08);border:1px solid rgba(6,96,174,.3);color:var(--navy)}
.so-form__erro{background:rgba(192,38,42,.07);border:1px solid rgba(192,38,42,.3);color:var(--red-dk)}

.so-contactos__card{background:var(--navy);color:rgba(255,255,255,.82);border-radius:18px;padding:clamp(22px,2.6vw,30px);margin-bottom:16px}
.so-contactos__card h2{font-family:var(--fh);font-size:24px;text-transform:uppercase;color:#fff;margin:0 0 16px;font-weight:700}
.so-contactos__lista{margin-bottom:16px}
.so-contactos__lista a{color:#fff;font-weight:600}
.so-contactos__nota{margin:0;font-size:13.5px;color:rgba(255,255,255,.7);border-top:1px solid rgba(255,255,255,.16);padding-top:14px}
.so-contactos__nota a{color:#fff;text-decoration:underline}
.so-contactos__mapa{border-radius:18px;overflow:hidden;border:1px solid var(--line-2);line-height:0}
.so-contactos__mapa iframe{width:100%;height:280px;border:0;filter:grayscale(.25)}

/* ---------- Page « Como escolher as bolas » ---------- */
.so-guia3{padding-top:0}
.so-guia3__hero{background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;
  padding:clamp(38px,5.5vw,72px) 0;border-bottom:6px solid var(--red)}
.so-guia3__hero-in{max-width:62ch}
.so-guia3__hero h1{font-family:var(--fh);font-size:clamp(30px,4.2vw,52px);line-height:1.04;text-transform:uppercase;
  font-weight:700;margin:0 0 12px}
.so-guia3__hero p{margin:0;color:rgba(255,255,255,.78);font-size:17px}
.so-guia3__corpo{max-width:900px;padding-top:clamp(32px,4vw,56px);padding-bottom:8px}
.so-guia3__corpo h2{font-family:var(--fh);font-size:clamp(23px,2.7vw,31px);text-transform:uppercase;font-weight:700;
  line-height:1.1;margin:42px 0 12px;padding-top:18px;border-top:1px solid var(--line)}
.so-guia3__corpo h2:first-of-type{margin-top:26px}
.so-guia3__corpo .so-lead{font-size:18px;color:var(--ink-2);max-width:none}
.so-guia3__corpo ul{list-style:none;padding:0;margin:16px 0 20px;display:grid;gap:10px}
.so-guia3__corpo ul li{position:relative;background:var(--paper);border:1px solid var(--line-2);border-radius:12px;
  padding:14px 16px 14px 42px;line-height:1.55}
.so-guia3__corpo ul li::before{content:'';position:absolute;left:16px;top:19px;width:13px;height:7px;
  border-left:2.5px solid var(--red);border-bottom:2.5px solid var(--red);transform:rotate(-45deg)}
.so-guia3__corpo ul li strong{color:var(--navy)}

/* Mesure de la main : visuel + tableau */
.so-guia3__medida{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:24px;align-items:start;
  background:var(--paper);border:1px solid var(--line-2);border-radius:16px;padding:20px;margin:22px 0 8px}
.so-guia3__figura{margin:0}
.so-guia3__figura img{width:100%;border-radius:12px;display:block}
.so-guia3__tabela{width:100%;border-collapse:separate;border-spacing:0 6px}
.so-guia3__tabela caption{text-align:left;font-family:var(--fh);font-size:15px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--navy);margin-bottom:8px;font-weight:600}
.so-guia3__tabela th,.so-guia3__tabela td{background:#fff;border:1px solid var(--line-2);padding:10px 14px;font-size:14.5px}
.so-guia3__tabela th{text-align:left;border-right:0;border-radius:10px 0 0 10px;font-weight:600;color:var(--ink-2)}
.so-guia3__tabela td{border-left:0;border-radius:0 10px 10px 0;font-family:var(--fh);font-size:18px;font-weight:700;
  color:var(--navy);text-align:right}

/* Bloc PDF */
.so-guia3__pdf{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;
  border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:30px 0 8px;
  background:linear-gradient(160deg,#fff 0%,#f4f7fa 100%)}
.so-guia3__pdf h3{font-family:var(--fh);font-size:22px;text-transform:uppercase;margin:6px 0 4px;font-weight:700}
.so-guia3__pdf p{margin:0;color:var(--mut);font-size:14.5px;max-width:52ch}
.so-guia3__pdf-tag{display:inline-block;background:var(--red);color:#fff;border-radius:4px;padding:3px 9px;
  font-family:var(--fh);font-size:11.5px;font-weight:700;letter-spacing:.1em}
.so-guia3__cta{background:var(--blue);color:#fff;margin-top:44px;padding:clamp(32px,4.5vw,54px) 0}
.so-guia3__cta-in{display:grid;grid-template-columns:1.4fr .6fr;gap:28px;align-items:center}
.so-guia3__cta p{margin:0;color:rgba(255,255,255,.85);max-width:60ch}
.so-guia3__cta-acoes{display:flex;flex-direction:column;gap:12px}

/* ---------- Boutons des blocs panier / commande ----------
   Les blocs WooCommerce ont leurs propres boutons gris : on les repasse à la charte. */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wc-block-components-button:not(.is-link){background:var(--red);color:#fff;border:0;border-radius:999px;
  font-family:var(--fh);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:14px;
  padding:15px 26px;transition:background .18s,transform .18s}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-button:not(.is-link):hover{background:var(--red-dk);color:#fff;transform:translateY(-1px)}
.wc-block-components-totals-coupon__button{background:var(--navy)!important}
.wc-block-components-totals-coupon__button:hover{background:#00325f!important}
.wc-block-components-chip{background:var(--paper);border:1px solid var(--line)}

/* Bloc de suivi de colis dans « A minha conta » */
.so-seguimento{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--line);
  border-radius:14px;padding:18px 20px;margin:24px 0;background:var(--paper)}
.so-seguimento__lab{font-family:var(--fh);font-size:13px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--navy)}
.so-seguimento strong{font-size:17px}
.so-seguimento .so-btn{margin-left:auto;padding:11px 20px;font-size:12px;border-radius:999px}

/* ---------- Responsive ---------- */
@media(max-width:1240px){
  .so-nav__ul>li>a{padding:12px 9px;font-size:15px}
  .so-search input{width:150px}
  .so-head__in{gap:16px}
}
@media(max-width:1100px){
  .so-cats2__grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:238px}
  .so-cat2:nth-child(1){grid-column:span 2;grid-row:span 1}
  .so-cat2:nth-child(2){grid-column:span 2}
  .so-cats,.woocommerce ul.products,ul.products{grid-template-columns:repeat(3,1fr)}
  .so-reas__grid{grid-template-columns:repeat(2,1fr)}
  .so-posts{grid-template-columns:repeat(2,1fr)}
  .so-search input{width:150px}
}
@media(max-width:1040px){
  .so-hero2{min-height:clamp(440px,74vh,620px)}
  .so-hero2__barra{padding:0 24px;gap:14px;bottom:20px}
  .so-hero2__scroll{display:none}
  .so-hero2__dot{flex:0 0 40px}
  .so-hero2__dot.is-on{flex-basis:80px}
  /* Le sujet est cadré à droite : en portrait on décale le point de mire, sinon il sort du cadre */
  .so-hero2__slide{background-position:72% center}
  .so-clube__hero-in{grid-template-columns:1fr}
  .so-guia3__medida{grid-template-columns:1fr}
  .so-guia3__cta-in{grid-template-columns:1fr}
  .so-clube__corpo ul{grid-template-columns:repeat(2,1fr)}
  .so-clube__cta-in{grid-template-columns:1fr}
  .so-hero{grid-template-columns:1fr}
  .so-hero__media{order:-1;min-height:230px;background-position:center 26%}
  .so-hero__panel{justify-content:flex-start;padding:40px 24px}
  .so-hero__panel::after{top:auto;left:0;right:0;bottom:0;width:auto;height:5px}
  .so-hero__in{max-width:none}
  .so-burger{display:flex}
  .so-nav{position:fixed;inset:84px 0 auto 0;background:#fff;border-bottom:1px solid var(--line);max-height:calc(100vh - 84px);overflow:auto;display:none;margin:0;padding:10px 0 18px}
  .so-nav.open{display:block}
  .so-nav__ul{flex-direction:column;align-items:stretch;gap:0}
  .so-nav__ul>li>a{padding:13px 24px;border-bottom:1px solid var(--line-2)}
  .so-sub,.so-nav__ul .sub-menu{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;padding:0 0 8px 24px;min-width:0}
  .so-guia,.so-sobre{grid-template-columns:1fr}
  .so-contactos__grid{grid-template-columns:1fr}
  .so-guia2__in{grid-template-columns:1fr;grid-template-areas:'head' 'tool' 'crit'}
  .so-guia__img,.so-sobre__img{order:-1}
  .woocommerce div.product{grid-template-columns:1fr}
  .so-foot__grid{grid-template-columns:1fr 1fr}
  .so-news2{flex-direction:column;align-items:flex-start}
  .so-news2__form{width:100%}
  .so-news2__form input{flex:1;min-width:0}
  .so-search{display:none}
}
@media(max-width:640px){
  .so-cats2__grid{grid-template-columns:1fr;grid-auto-rows:230px}
  .so-cat2:nth-child(2){flex-direction:column}
  .so-cat2:nth-child(2) .so-cat2__media{flex:1;padding:20px 20px 6px}
  .so-cat2:nth-child(2) .so-cat2__body{flex:0 0 auto;flex-direction:row;align-items:flex-end;justify-content:space-between;padding:14px 20px 18px}
  .so-cat2:nth-child(2) .so-cat2__body h3{font-size:19px}
  .so-cat2:nth-child(1),.so-cat2:nth-child(2){grid-column:span 1}
  .so-cat2:nth-child(1) .so-cat2__body h3{font-size:21px}
  .so-cats,.woocommerce ul.products,ul.products,.so-posts{grid-template-columns:repeat(2,1fr)}
  .so-reas__grid{grid-template-columns:1fr}
  .so-form__linha{grid-template-columns:1fr;gap:0}
  .so-crit{padding:18px 18px 18px 64px}
  .so-pick__res-vals{gap:6px 14px}

  /* ----- Barre de topo sur mobile -----
     En flex + wrap, les quatre éléments s'empilaient à la file en trois lignes ferrées à
     gauche (108px de haut à 360px de large). Ici : promo centrée sur une ligne, puis
     téléphone à gauche / langues à droite. L'e-mail saute (il reste au pied de page). */
  .so-topbar__msg{display:none}
  .so-topbar__in{min-height:0;padding-top:7px;padding-bottom:7px}
  .so-topbar__right{width:100%;display:grid;grid-template-columns:1fr auto;align-items:center;gap:7px 12px}
  .so-topbar__right>a[href^="mailto"]{display:none}
  .so-topbar__ship{grid-row:1;grid-column:1/-1;text-align:center;font-size:12px}
  .so-topbar__right>a[href^="tel"]{grid-row:2;grid-column:1;justify-self:start;font-size:13px;font-weight:600}
  .so-lang{grid-row:2;grid-column:2;justify-self:end;margin-left:0}
  .so-lang__b{padding:5px 9px}
  .so-foot__grid{grid-template-columns:1fr}
  .so-news2__form button{width:100%;justify-content:center}
  .so-foot__marca{font-size:22vw}
  .so-foot__bottom{justify-content:flex-start;gap:8px}
  .so-news__form input{min-width:0;flex:1}
  .so-evt,.so-evt:has(.so-evt__img){grid-template-columns:64px 1fr}
  .so-evt__dia{font-size:26px}
  .so-evt__titulo{font-size:20px}
  .so-evt__img{grid-column:1/-1;width:100%;margin-top:12px}
  .so-clube__hero-in,.so-clube__cta-in{grid-template-columns:1fr}
  .so-clube__corpo ul{grid-template-columns:1fr}
  .so-perso__painel{grid-template-columns:1fr;padding:14px}
  .so-perso__previa{max-width:200px;margin:0 auto}
  .so-perso__abrir{width:100%;justify-content:center;font-size:13.5px;padding:12px 14px}

  /* ----- Boutique sur mobile -----
     Deux cartes par ligne sur 342px utiles : tout est resserré (image, texte, bouton)
     pour que le produit tienne dans un écran au lieu d'une carte par défilement. */
  .woocommerce-products-header__title,.woocommerce h1.page-title,.woocommerce-page h1.entry-title{font-size:26px}
  .so-subcats{gap:6px;margin-bottom:16px}
  .so-subcat{padding:7px 12px;font-size:13.5px;gap:6px}
  .so-subcat span{font-size:11px}
  .woocommerce .woocommerce-result-count{font-size:13px;margin:0 0 10px}
  /* Le tri flotte à droite chez WooCommerce : à cette largeur il se retrouve décalé
     et à cheval sur le compteur de résultats. Pleine largeur, sous le compteur. */
  .woocommerce .woocommerce-ordering{float:none;width:100%;margin:0 0 16px}
  .woocommerce .woocommerce-ordering select{width:100%;font-size:14px}
  .so-cats,.woocommerce ul.products,ul.products{gap:12px}
  ul.products li.product a img{padding:10px}
  .woocommerce ul.products li.product .woocommerce-loop-product__title,
  ul.products li.product .woocommerce-loop-product__title{font-size:13.5px;line-height:1.25;padding:0 12px;margin:0 0 6px;min-height:2.5em}
  .woocommerce ul.products li.product .price,ul.products li.product .price{font-size:15px;padding:0 12px;margin:0 0 10px}
  ul.products li.product .button,ul.products li.product .added_to_cart{margin:auto 12px 12px;padding:10px 6px;font-size:11px;letter-spacing:.03em;border-width:1.4px}
  ul.products li.product a img{padding:12px}
  /* La pastille débordait de la carte (165px de large en 2 colonnes) */
  .so-perso__selo{top:8px;right:8px;font-size:9px;padding:4px 8px 4px 17px;letter-spacing:.04em}
  .so-perso__selo::before{left:7px;width:5px;height:5px}
  .woocommerce ul.products li.product .woocommerce-loop-product__title,ul.products li.product .woocommerce-loop-product__title{padding:12px 12px 0;margin-bottom:6px}
  .woocommerce ul.products li.product .price,ul.products li.product .price{font-size:18px;padding:0 12px;margin-bottom:10px}
  .woocommerce span.onsale,ul.products li.product .onsale{top:6px;left:6px;padding:3px 8px;font-size:10px}
  .woocommerce nav.woocommerce-pagination{margin-top:22px}
  .woocommerce nav.woocommerce-pagination ul{border:0;display:flex;justify-content:center;flex-wrap:wrap;gap:6px}
  .woocommerce nav.woocommerce-pagination ul li{border:0}
  .woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{border:1px solid var(--line);border-radius:var(--r);padding:9px 13px;min-width:40px}
  .woocommerce nav.woocommerce-pagination ul li span.current{background:var(--navy);color:#fff;border-color:var(--navy)}

  /* ----- Fiche produit sur mobile ----- */
  .woocommerce div.product{gap:20px}
  .woocommerce div.product p.price,.woocommerce div.product span.price{font-size:28px}
  .woocommerce div.product form.cart .button{padding:14px 22px;flex:1}
  .woocommerce div.product .woocommerce-product-gallery__image:first-child img{padding:18px}
  /* 2 vignettes suffisent par ligne : à 4 colonnes une photo seule faisait un timbre-poste */
  .woocommerce div.product .woocommerce-product-gallery__wrapper{grid-template-columns:repeat(3,1fr);gap:8px}
  .woocommerce div.product .woocommerce-product-gallery__image:first-child img{padding:14px}
  .woocommerce div.product .product_title{font-size:24px}
  .woocommerce div.product p.price,.woocommerce div.product span.price{font-size:24px;margin-bottom:12px}
  .woocommerce div.product form.cart .button{flex:1}
  .woocommerce div.product form.cart div.quantity{margin-right:8px}
  .woocommerce .woocommerce-tabs ul.tabs li{margin-right:16px}
  .woocommerce .woocommerce-tabs ul.tabs li a{font-size:16px}
}
