/*
Theme Name: Kadence Child
Theme URI: https://www.kadencewp.com/kadence-theme/
Template: kadence
Author: Kadence WP
Author URI: https://www.kadencewp.com/
Description: Kadence Theme is a lightweight yet full featured WordPress theme for creating beautiful fast loading and accessible websites, easier than ever. It features an easy to use drag and drop header and footer builder to build any type of header in minutes. It features a full library of gorgeous starter templates that are easy to modify with our intelligent global font and color controls. With extensive integration with the most popular 3rd party plugins, you can quickly build impressive ecommerce websites, course websites, business websites, and more.
Tags: translation-ready,accessibility-ready,two-columns,right-sidebar,left-sidebar,footer-widgets,blog,custom-logo,custom-background,custom-menu,rtl-language-support,editor-style,threaded-comments,custom-colors,featured-images,wide-blocks,full-width-template,theme-options,e-commerce
Version: 1.3.4.1757008554
Updated: 2025-09-04 17:55:54

*/
/*
 Theme Name: Kadence Child
 Template: kadence
 Version: 1.0
*/

/* ----- Conteneur principal ----- */
.rel-container{
  max-width: 1320px;      /* ajuste si besoin */
  margin: 0 auto;
  padding: 0 24px;
}

/* ----- Grille 3 colonnes ----- */
.rel-wrap{
  --gap: 32px;
  --left: 340px;          /* largeur gauche */
  --right: 380px;         /* largeur droite */
  --sticky: 96px;         /* offset sticky (header) */
  display: grid;
  grid-template-columns: var(--left) minmax(0,1fr) var(--right);
  column-gap: var(--gap);
  align-items: start;
}

/* Assigner explicitement les colonnes (évite l'empilement) */
.rel-left  { grid-column: 1; position: sticky; top: var(--sticky); }
.rel-main  { grid-column: 2; min-width: 0; }
.rel-right { grid-column: 3; }
.rel-right #secondary{ position: sticky; top: var(--sticky); margin: 0; }

/* Neutraliser les styles Kadence qui cassent la grille */
.rel-main, #secondary{ float: none !important; width: auto !important; display: block; }
.site-main, .content-area, .entry-content{ max-width: none; }

/* Admin bar */
body.admin-bar .rel-left,
body.admin-bar .rel-right #secondary{ top: calc(var(--sticky) + 32px); }

/* TABLETTE ≤1280px : 2 colonnes (contenu | droite) */
@media (max-width:1280px){
  .rel-wrap{
    --gap: 28px; --right: 340px;
    grid-template-columns: minmax(0,1fr) var(--right);
  }
  .rel-left{ display: none; }
}

/* MOBILE ≤1024px : 1 colonne */
@media (max-width:1024px){
  .rel-wrap{ display: block; }
  .rel-right #secondary{ position: static; }
}

/* ====== Base container ====== */
.rel-container{
  max-width: 1760px;
  margin: 0 auto;
  padding: 0 40px;
  box-sizing: border-box;
}

/* Neutralise les styles Kadence qui réduisent le flux */
.rel-main, #secondary{ float:none !important; width:auto !important; display:block; min-width:0; }
.site-main, .content-area, .entry-content{ max-width:none; }

/* ====== Desktop large ≥1400 : 3 colonnes — les 2 sidebars sticky ====== */
@media (min-width:1400px){
  .rel-wrap{
    --gap: 40px;
    --left: 360px;
    --right: 420px;
    --sticky: 96px;
    display: grid;
    grid-template-columns: var(--left) minmax(0,1fr) var(--right);
    column-gap: var(--gap);
    align-items: start;
  }

  /* Garde la gauche sticky */
  .rel-left{ grid-column:1; position: sticky; top: var(--sticky); align-self: start; }

  /* >>> DROITE : sticky sur le WRAPPER (plus fiable qu’#secondary dans une grid) */
  .rel-right{
    grid-column:3;
    position: sticky;
    top: var(--sticky);
    align-self: start;       /* important pour Safari/iPad */
    height: max-content;     /* évite certains bugs de calcul */
  }
  /* évite le “double position” si le thème pose des styles sur #secondary */
  .rel-right #secondary{ position: static; margin: 0; }

  /* Admin bar */
  body.admin-bar .rel-left,
  body.admin-bar .rel-right{ top: calc(var(--sticky) + 32px); }
}


/* ====== Laptop 991–1399 : 2 colonnes (gauche | contenu) ====== */
@media (min-width:991px) and (max-width:1399px){
  .rel-wrap{
    --gap: 32px;
    --left: 340px;          /* ajuste la largeur de la barre gauche */
    --sticky: 88px;
    display: grid;
    grid-template-columns: var(--left) minmax(0,1fr); /* gauche | contenu */
    column-gap: var(--gap);
    align-items: start;
  }
  .rel-left{ 
    grid-column: 1; 
    display: block; 
    position: sticky; 
    top: var(--sticky); 
  }
  .rel-main{ grid-column: 2; }
  .rel-right{ display: none; }                  /* on cache la droite sur ce palier */
  .rel-right #secondary{ position: static; }    /* neutralise tout sticky résiduel */

  body.admin-bar .rel-left{ 
    top: calc(var(--sticky) + 32px); 
  }
}


/* ====== <992 : 1 colonne ====== */
@media (max-width:991px){
  .rel-container{ padding: 0 24px; }
  .rel-wrap{ display:block; }
  .rel-left{ display:none; }
  .rel-right #secondary{ position:static; margin-top:24px; } /* la droite passe sous le contenu */
}

/* ====== H1 plus raisonnable + anti-casse ====== */
.rel-entry .entry-title{
  font-size: clamp(2rem, 1.4vw + 1.4rem, 3.2rem);
  line-height: 1.06;
  margin: 0 0 8px;
  overflow-wrap:anywhere; /* évite les titres “en colonne” quand l’espace est étroit */
}
@media (max-width:1199px){
  .rel-entry .entry-title{ font-size: clamp(1.8rem, 1.6vw + 1rem, 2.6rem); }
}
@media (max-width:768px){
  .rel-entry .entry-title{ font-size: clamp(1.6rem, 2.5vw + .9rem, 2.2rem); }
}

/***** RELIQ — FIX PUCES + PADDING MOBILE *****/

/* 1) Métas (ligne "Par … • Publié le … • …") — supprimer les séparateurs injectés par Kadence */
/* Mise en forme simple des métas personnalisées */
.rel-meta{font-size:.95rem;line-height:1.6;color:#5b6170}
.rel-meta > *{margin-right:12px}
.rel-meta .meta-label{margin-right:6px;opacity:.85}


/* 2) Listes de taxonomies/catégories (archives + single) — retirer les puces à gauche du badge */
.post-categories,
.post-categories li,
.entry-taxonomies,
.entry-taxonomies li,
.kadence-taxonomy-list,
.kadence-taxonomy-list li{
  list-style: none;
  margin: 0;
  padding: 0;
}
.post-categories li::marker,
.entry-taxonomies li::marker,
.kadence-taxonomy-list li::marker{
  content: "";
}
.post-categories li::before,
.entry-taxonomies li::before,
.kadence-taxonomy-list li::before{
  content: "";
  display: none;
}

/* 3) Style du badge catégorie (cohérent desktop + mobile) */
.rel-cat a,                          /* ton single */
.post-categories a,                  /* listes d’articles Kadence */
.kadence-taxonomy-list a{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: 6px 14px 6px 14px;
  margin-bottom:10px;
  background: #E21E51;
  color: #F9F6F1;
  font-weight: 700;
  font-size: .85rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-decoration: none;
  border: 0;
}

/*Background carré services etc..*/
/* ===== Micro-grid de fond pour le wrapper ===== */
/* Applique sur <section class="square-container">… */
:root{
  --rel-grid-color: rgba(17,17,17,.05); /* intensité de la grille */
  --rel-grid-size: 50px;                /* pas desktop */
  --rel-grid-size-sm: 36px;             /* pas mobile */
}

.square-container{
  position: relative;
  background: #fff; /* fond de base */
	overflow:hidden;
}

.square-container::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(var(--rel-grid-color) 1px, transparent 1px),
    linear-gradient(90deg, var(--rel-grid-color) 1px, transparent 1px);
  background-size:
    var(--rel-grid-size) var(--rel-grid-size),
    var(--rel-grid-size) var(--rel-grid-size);
  background-position: 0 0, 0 0;
}

/* Optionnel : halo très léger haut/bas pour du relief */
.square-container::after{
  content: "";
  position: absolute;
  inset: -8% -6% -8% -6%;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(70% 35% at 50% -5%, rgba(226,30,81,.05), transparent 60%),
    radial-gradient(70% 35% at 50% 105%, rgba(226,30,81,.05), transparent 60%);
  mix-blend-mode: multiply;
}

/* Le contenu passe au-dessus du motif */
.square-container > *{
  position: relative;
  z-index: 1;
  background: transparent;
}

/* Mobile : grille plus serrée */
@media (max-width: 640px){
  .square-container::before{
    background-size:
      var(--rel-grid-size-sm) var(--rel-grid-size-sm),
      var(--rel-grid-size-sm) var(--rel-grid-size-sm);
  }
}

/*CSS TEMPLATES COMMUN*/
/* ========= VARIABLES GLOBALES (défauts sûrs) ========= */
:root{
  /* Palette principale */
  --rq-accent:#E21E51;
  --rq-black:#000;                 /* par défaut = héros */
  --rel-black:#111111;
  --rel-accent:#E21E51;
  --rel-ink:#0C0C0C;

  /* Tech (évite les undefined) */
  --brand:#E21E51;
  --accent:#E21E51;
  --ink:#0B0B0B;
  --muted:#606060;
  --line:#E8E8EC;
  --white:#fff;
  /* Layout (fallback) */
  --global-content-width:1400px;

  /* Pour sections internes qui veulent un noir différent */
  --rq-black-section:#111;
}


/* ========= HERO / FOND ANIMÉ ========= */
.hero-section{
  padding:0.9rem 1.5rem;
  position:relative;
  overflow:hidden;
  text-align:center;
  background:#fff;
  isolation:isolate;
  z-index:0;
}
.hero-section::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:
    radial-gradient(40% 40% at 25% 30%, rgba(226,30,81,.20), transparent 60%),
    radial-gradient(35% 35% at 75% 70%, rgba(226,30,81,.12), transparent 65%);
  mix-blend-mode:screen;
  filter:saturate(110%);
  animation:swirl 28s linear infinite, pulse 6s ease-in-out infinite alternate;
  z-index:0;
  pointer-events:none;
}
.hero-section::after{
  content:"";
  position:absolute;
  inset:-10%;
  background:conic-gradient(from 0deg at 50% 50%,
    rgba(226,30,81,.06), transparent 20%, rgba(226,30,81,.04) 40%,
    transparent 60%, rgba(226,30,81,.05) 80%, transparent 100%);
  filter:blur(40px);
  animation:spin 40s linear infinite;
  z-index:0;
  pointer-events:none;
}
@keyframes swirl{0%{transform:rotate(0)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}
@keyframes pulse{0%{opacity:.55}50%{opacity:.30}100%{opacity:.55}}
@keyframes spin{0%{transform:rotate(0) scale(1.05)}100%{transform:rotate(360deg) scale(1.05)}}

/* ========= CONTENU HERO ========= */
.hero-container{
  position:relative;
  z-index:1;
  max-width:980px;
  margin:0 auto;
}
.hero-title{
  font-size:2.5rem;
  font-weight:700;
  color:var(--rq-black);
  margin:0 0 16px;
}
.hero-subtitle{
  font-size:1rem;
  color:var(--rq-black);
  margin:0 0 24px;
}

/* ========= CTA ========= */
.reliq-cta h2{
  margin:0 0 16px;
  font-size:18px;
  font-weight:700;
  color:var(--rq-black);
}
.reliq-cta a{
  display:inline-block;
  padding:12px 26px;
  font-size:14px;
  font-weight:700;
  text-transform:uppercase;
  color:var(--rq-black);
  background:#fff;
  border:2px solid var(--rq-black);
  text-decoration:none;
  transition:.25s;
  box-shadow:3px 3px 0 var(--rq-accent);
}
.reliq-cta a:hover{
  background:var(--rq-accent);
  color:#fff;
  border-color:var(--rq-accent);
  box-shadow:3px 3px 0 var(--rq-black);
}

/* ========= HERO CARDS (compactes + premium + cliquables, Titre centré + icône) ========= */
.hero-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  max-width:980px;
  margin:24px auto 20px;
  align-items:stretch;
}

/* Base commune (lien cliquable centré) */
.hero-card{
  padding:18px 10px;
  text-decoration:none;
  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;

  border:1px solid rgba(226,30,81,.65);
  box-shadow:2px 2px 0 var(--rq-accent);
  background:#fff;

  position:relative;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}

/* Titre centré + flèche */
.hero-card h3{
  margin:0;
  font-size:0.7rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.02em;

  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--rq-black); /* sera blanc sur .hero-card--premium */
}
.hero-card h3::after{
  content:"→";
  font-weight:700;
  font-size:1.1em;
  transition:transform .25s ease, margin-left .25s ease, opacity .25s ease;
  opacity:.9;
}
.hero-card:hover h3::after{
  transform:translateX(3px);
  margin-left:4px;
  opacity:1;
}

/* ===== VARIANTE PREMIUM (rouge + glossy + shine) ===== */
.hero-card--premium{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 30%),
    radial-gradient(120% 120% at 80% -20%, rgba(255,255,255,.20) 0%, rgba(255,255,255,0) 50%),
    var(--rel-accent);
  color:#fff;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:3px 3px 0 var(--rq-black);
  overflow:hidden;
}
.hero-card--premium::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,
    rgba(255,255,255,.2) 0%,
    rgba(255,255,255,.08) 8%,
    rgba(255,255,255,0) 20%);
  pointer-events:none;
}
.hero-card--premium::after{
  content:"";
  position:absolute;
  top:-120%;
  left:-60%;
  width:60%;
  height:300%;
  transform:rotate(18deg);
  background:linear-gradient(to right,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.55) 45%,
    rgba(255,255,255,0) 100%);
  opacity:0;
  transition:opacity .25s ease, transform .9s ease;
}
.hero-card--premium:hover::after{
  opacity:.6;
  transform:translateX(180%) rotate(18deg);
}
.hero-card--premium:hover{
  transform:translateY(-2px);
  box-shadow:4px 4px 0 var(--rq-black);
}
.hero-card--premium h3{
  color:#fff;            /* titre blanc sur fond rouge */
}

/* Focus & Accessibilité */
.hero-card:focus-visible{
  outline:2px dashed #fff;
  outline-offset:4px;
}
@media (prefers-reduced-motion: reduce){
  .hero-card--premium::after{ display:none; }
}

/* ========= SLIDER LOGOS FULL-WIDTH ========= */
.full-bleed{
  position:relative;
  left:50%;
  right:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  width:100vw;
}
.clients-slider{
  overflow:hidden;
  width:100%;
  padding:12px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:#fff;
}
.slider-track{
  display:flex;
  align-items:center;
  gap:clamp(18px,3vw,40px);
  animation:logos-scroll 28s linear infinite;
  will-change:transform;
}
.slider-track img{
  height:clamp(24px,4vw,40px);
  opacity:.9;
  filter:grayscale(1);
  display:block;
  max-width:none;
  transition:opacity .2s, filter .2s, transform .2s;
}
.slider-track img:hover{
  opacity:1;
  filter:grayscale(0);
  transform:scale(1.03);
}
@keyframes logos-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .slider-track{ animation:none; }
}

/* ========= RESPONSIVE ========= */
@media (max-width:1024px){
  .hero-cards{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .hero-cards{ grid-template-columns:repeat(2,1fr); } /* 2x2 sur mobile */
  .hero-card{ min-height:80px; padding:14px 10px; }
  .hero-card h3{ font-size:.9rem; gap:6px; }
  .hero-card h3::after{ font-size:1rem; }
}

/* ========= RELQ CABRAR / EXP-ZONE ========= */
.relq-cabrar,.exp-zone{
  position:relative;isolation:isolate;background:transparent;
  padding-right:1.5rem;padding-left:calc(1.5rem + 44px + 16px);
  --rc-ink:#111111; --rc-accent:var(--rq-accent);
}
.relq-cabrar{padding-top:65px; overflow:hidden;}
.exp-zone{padding-top:75px; padding-bottom:50px;}

.relq-cabrar::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(40% 40% at 20% 30%,rgba(226,30,81,.12),transparent 60%),
    radial-gradient(35% 35% at 80% 70%,rgba(226,30,81,.08),transparent 65%);
  mix-blend-mode:screen;animation:relqPulse 8s ease-in-out infinite alternate;
  z-index:0;pointer-events:none;transform:scale(1.35);        /* on “grandit” à l’intérieur */
  transform-origin:center;
}
@keyframes relqPulse{0%{opacity:.45}100%{opacity:.25}}

.relq-cabrar::after{
  content:"Nos services";
  position:absolute;left:0;top:0;bottom:0;width:50px;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:white;background:black;border-right:1px solid rgba(17,17,17,.14);z-index:0;
}
.exp-zone::after{
  content:"Nos expertises";
  position:absolute;left:0;top:0;bottom:0;width:50px;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:white;background:#E21E51;border-right:1px solid rgba(17,17,17,.14);z-index:0;
}

.cab-wrap,.exp-wrap{max-width:var(--global-content-width);margin:0 auto;position:relative;z-index:1;}

.cab-grid,.exp-grid{display:grid;gap:18px;}
.cab-grid{grid-template-columns:repeat(3,minmax(220px,1fr));}
.exp-grid{grid-template-columns:repeat(3,minmax(260px,1fr));}

/* Header partagé */
.rel-cases__head{display:grid;grid-template-columns:1fr auto;gap:16px 24px;align-items:end;margin-bottom:28px;}
.rel-cases__title{margin:0;font-size:clamp(1.9rem,1.2rem + 1.6vw,2.6rem);letter-spacing:.02em;color:var(--rc-ink);}
.rel-cases__lede{grid-column:1/-1;margin:0;color:#444;}
.rel-cases-btn{
  border:2px solid var(--rc-ink);background:#fff;color:#111;text-decoration:none;
  font-weight:800;padding:12px 18px;display:inline-flex;align-items:center;gap:8px;
  box-shadow:3px 3px 0 var(--rc-accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s;
}
.rel-cases-btn:hover{background:var(--rc-accent);color:#fff;border-color:var(--rc-accent);box-shadow:3px 3px 0 var(--rc-ink);}
.features {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 40px;
}

.feature {
  text-align: center;
  font-size: 15px;
  color: #111; /* texte */
}

.feature .icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: #E21E51; /* cercle accent reliq */
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature .icon i {
  color: #fff; /* icône blanche */
  font-size: 22px;
}


/* Cartes cabrar */
.cab-card{border:1px solid rgba(0,0,0,.75);background:#fff;padding:18px;display:flex;flex-direction:column;gap:12px;position:relative;transition:transform .2s ease;}
.cab-top{display:flex;align-items:center;gap:12px;}
.cab-ico{width:36px;height:36px;display:grid;place-items:center;background:var(--rq-accent);color:#fff;box-shadow:0 0 0 4px rgba(226,30,81,.12);}
.cab-title{font-weight:800;font-size:1.05rem;color:var(--rq-black-section);margin:0;}
.cab-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:2px;font-size:.85rem;color:#222;}
.cab-pill{border:1px solid rgba(0,0,0,.7);padding:4px 8px;background:#fff;display:inline-flex;align-items:center;gap:6px;}
.cab-benefit{color:#111;line-height:1.4;margin-top:2px;}
.cab-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px;border-top:1px solid rgba(0,0,0,.1);}
.btn-cab{
  display:inline-block;padding:10px 18px;font-size:.9rem;font-weight:800;text-transform:uppercase;
  color:var(--rq-black-section);background:#fff;border:2px solid var(--rq-black-section);text-decoration:none;transition:.2s;box-shadow:3px 3px 0 var(--rq-accent);white-space:nowrap;
}
.btn-cab:hover{background:var(--rq-accent);color:#fff;border-color:var(--rq-accent);box-shadow:3px 3px 0 var(--rel-ink);}
.cab-link{font-size:.9rem;color:var(--rq-black-section);text-decoration:underline;text-underline-offset:2px;}

/* Cartes expertises */
.exp-card{border:1px solid rgba(0,0,0,.75);background:#fff;padding:16px;display:flex;gap:12px;align-items:flex-start;transition:transform .2s ease;}
.exp-icon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;background:var(--rq-accent);color:#fff;box-shadow:0 0 0 4px rgba(226,30,81,.12);}
.exp-body{display:flex;flex-direction:column;gap:6px;min-width:0;}
.exp-link{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--rq-black-section);text-decoration:none;line-height:1.2;}
.exp-link .exp-arrow{transition:transform .2s ease;}
.exp-card:hover .exp-link .exp-arrow{transform:translateX(3px);}
.exp-desc{color:#111;font-size:.95rem;line-height:1.45;}
.exp-more{margin-top:6px;font-size:.9rem;color:var(--rq-black-section);text-decoration:underline;text-underline-offset:2px;}

/* ========= REL-FEATURE ========= */
.rel-feature{
  position:relative;overflow:hidden;background:transparent;
  padding-top:75px;padding-right:1.5rem;padding-left:calc(1rem + 44px + 16px);
}
.rel-feature::after{
  content:"Swiss-made conception";
  position:absolute;left:0;top:0;bottom:0;width:50px;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:#000;border-right:1px solid rgba(17,17,17,.14);z-index:0;
}
.rel-feature__wrap{max-width:var(--global-content-width);margin:0 auto;position:relative;z-index:1;}
.rel-feature__grid{display:grid;gap:clamp(18px,3vw,36px);grid-template-columns:1.05fr .95fr;align-items:stretch;}
.rel-feature__media{order:2;}
.rel-feature__figure{
  margin:0;position:relative;aspect-ratio:4/5;border:1px solid rgba(17,17,17,.22);background:var(--rel-ink);overflow:hidden;transform:translateY(6px);
}
.rel-feature__figure::after{
  content:"";position:absolute;top:18px;left:-12px;right:36%;
  height:24px;background:linear-gradient(90deg, rgba(226,30,81,.9), rgba(226,30,81,.6));
  transform:rotate(-3.5deg);box-shadow:6px 6px 0 rgba(17,17,17,.15);
}
.rel-feature__img{width:100%;height:100%;object-fit:cover;object-position:center;filter:contrast(1.04) saturate(1.02);transform:scale(1.045);transition:transform .35s ease;}
.rel-feature__figure:hover .rel-feature__img{transform:scale(1.06);}
.rel-feature__wm{
  position:absolute;bottom:10px;left:14px;right:14px;font-weight:800;font-size:clamp(34px,6vw,84px);letter-spacing:.04em;color:rgba(255,255,255,.06);text-transform:uppercase;pointer-events:none;white-space:nowrap;overflow:hidden;
}
.rel-feature__stamp{
  position:absolute;top:18px;right:18px;z-index:2;background:#fff;color:#111;font-weight:900;text-transform:uppercase;letter-spacing:.6px;padding:8px 12px;border:2px solid #111;box-shadow:4px 4px 0 var(--rel-accent);
}
.rel-feature__badge{
  position:absolute;bottom:18px;left:18px;z-index:2;background:var(--rel-accent);color:#fff;font-weight:900;padding:8px 12px;border:2px solid #fff;text-transform:uppercase;letter-spacing:.6px;
}
.rel-feature__content{order:1;display:flex;flex-direction:column;}
.rel-feature__kicker{
  display:inline-block;font-weight:900;color:#111;letter-spacing:.06em;text-transform:uppercase;
  border:2px solid #111;padding:6px 10px;box-shadow:4px 4px 0 var(--rel-accent);width:max-content;margin-bottom:16px;background:#fff;
}
.rel-feature__title{margin:0 0 10px;font-size:clamp(28px,2.2vw,40px);line-height:1.1;color:#111;}
.rel-feature__lede{margin:0 0 18px;color:#2c2c2c;font-size:clamp(16px,1.2vw,18px);line-height:1.55;}
.rel-feature__quote{margin:10px 0 20px;padding:16px 18px;background:#fff;border:1px solid rgba(17,17,17,.28);position:relative;}
.rel-feature__quote::before{content:"“";position:absolute;left:12px;top:-10px;font-weight:900;color:var(--rel-accent);font-size:28px;}
.rel-feature__quote em{font-style:normal;color:#111;font-weight:800;}
.rel-feature__aside{margin-top:auto;border:1px dashed rgba(17,17,17,.35);padding:12px 14px;background:#fff;display:flex;align-items:center;gap:12px;}
.rel-feature__aside strong{font-size:20px;}
.rel-feature__aside .u-accent{color:var(--rel-accent);}
.rel-feature__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;}
.rel-btn{
  border:2px solid var(--rel-black);background:#fff;color:#111;text-decoration:none;
  font-weight:800;padding:12px 18px;display:inline-flex;align-items:center;gap:8px;
  box-shadow:3px 3px 0 var(--rel-accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s;
}
.rel-btn:hover{background:var(--rel-accent);color:#fff;border-color:var(--rel-accent);box-shadow:3px 3px 0 var(--rel-black);}
.rel-btn.-ghost{background:#fff;border-color:#111;box-shadow:3px 3px 0 rgba(226,30,81,.35);}
.rel-btn.-ghost:hover{background:#111;color:#fff;border-color:#111;box-shadow:3px 3px 0 var(--rel-accent);}
.rel-feature__vert{position:absolute;left:0;top:0;bottom:0;width:44px;background:transparent;display:none;border-right:1px solid rgba(17,17,17,.12);z-index:1;}
.rel-feature__vert span{position:absolute;left:10px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:left top;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:#111;white-space:nowrap;}

/* ========= REL-CASES ========= */
.rel-cases{
  --rc-ink:#111111; --rc-accent:#E21E51; --rc-bg:#ffffff;
  --rc-max:var(--global-content-width); --rc-gap:24px;
  position:relative;isolation:isolate;overflow:hidden;background:transparent !important;
  padding-top:75px;padding-right:1.5rem;padding-left:calc(1rem + 44px + 16px);
}
.rel-cases, .rel-cases *{border-radius:0 !important;}
.rel-cases::after{
  content:"Réalisations de notre agence";
  position:absolute;left:0;top:0;bottom:0;width:50px;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:#E21E51;border-right:1px solid rgba(17,17,17,.12);z-index:0;
}
.rel-cases__wrap{max-width:var(--rc-max);margin:0 auto;position:relative;z-index:1;}
.rel-cases__grid{display:grid;gap:var(--rc-gap);grid-template-columns:repeat(3,minmax(0,1fr));}
.rel-case{position:relative;background:#fff;border:1px solid rgba(17,17,17,.22);box-shadow:10px 10px 0 rgba(226,30,81,.15);display:flex;flex-direction:column;overflow:hidden;}
.rel-case::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:6px;background:var(--rc-accent);}
.rel-case__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#f2f2f2;}
.rel-case__media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.02);transition:transform .35s ease;}
.rel-case:hover .rel-case__media img{transform:scale(1.06);}
.rel-case__wm{position:absolute;left:12px;bottom:10px;padding:6px 10px;background:#111;color:#fff;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:12px;}
.rel-case__kpis{display:flex;gap:16px;align-items:center;padding:10px 14px;border-top:1px solid rgba(17,17,17,.16);background:linear-gradient(180deg, rgba(226,30,81,.06), transparent 80%), #fff;}
.rel-kpi{display:flex;align-items:center;gap:8px;color:#111;font-weight:800;}
.rel-kpi small{font-weight:600;color:#444;letter-spacing:.02em;}
.rel-case__body{padding:18px;display:flex;flex-direction:column;gap:12px;flex:1 1 auto;}
.rel-case__title{margin:0;font-size:18px;color:#111;letter-spacing:.02em;}
.rel-case__desc{margin:0;color:#333;line-height:1.55;}
.rel-case__actions{margin-top:auto;display:flex;gap:12px;flex-wrap:wrap;}
.rel-cases-btn.--ghost{box-shadow:3px 3px 0 rgba(17,17,17,.25);}
.rel-cases__foot{margin-top:28px;display:flex;justify-content:flex-end;}

/* ========= SECTORS ========= */
.sectors{
  position:relative;isolation:isolate;background:transparent;
  padding-top:75px;padding-right:1.5rem;padding-left:calc(1rem + 44px + 16px);
  --rc-ink:#111111; --rc-accent:#E21E51;
}
.sectors::after{
  content:"Secteurs";
  position:absolute;left:0;top:0;bottom:0;width:50px;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:#000;border-right:1px solid rgba(17,17,17,.14);z-index:0;
}
.sectors .wrap{max-width:var(--global-content-width);margin:0 auto;position:relative;z-index:1;}
.sector-grid{display:grid;gap:20px;grid-template-columns:repeat(3,minmax(0,1fr));}
.sector-card{border:1px solid rgba(226,30,81,.65);background:#fff;color:var(--rel-black);display:flex;flex-direction:column;min-height:420px;position:relative;overflow:hidden;}
.sector-card.-dark{background:var(--rel-ink);color:#fff;}
.sector-card::after{
  content:attr(data-watermark);position:absolute;bottom:12px;left:16px;right:16px;
  font-size:72px;font-weight:800;letter-spacing:.04em;color:rgba(17,17,17,.06);pointer-events:none;white-space:nowrap;overflow:hidden;z-index:0;
}
.sector-card.-dark::after{color:rgba(255,255,255,.06);}
.sector-card > *{position:relative;z-index:1;}
.sector-card .head{padding:18px;border-bottom:1px solid rgba(226,30,81,.35);display:flex;align-items:center;gap:12px;position:relative;}
.sector-card .head::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg, rgba(226,30,81,.12) 18%, transparent 55%);z-index:0;}
.sector-card.-dark .head{border-bottom:1px solid rgba(255,255,255,.18);}
.sector-card.-dark .head::after{
  background:linear-gradient(105deg, rgba(226,30,81,.18) 18%, rgba(255,255,255,.06) 42%, transparent 66%),
             linear-gradient(180deg, rgba(0,0,0,.18), transparent 60%);
}
.sector-card .badge{width:32px;height:32px;background:var(--rel-accent);color:#fff;display:grid;place-items:center;font-weight:800;border:2px solid #fff;position:relative;z-index:1;}
.sector-card.-dark .badge{border-color:rgba(255,255,255,.85);}
.sector-card .title{margin:0;font-size:20px;line-height:1.1;text-transform:uppercase;letter-spacing:.5px;}
.sector-card.-dark .title{color:#fff !important;text-shadow:0 1px 0 rgba(0,0,0,.35);}
.sector-card.-dark .title::before{content:"";position:absolute;inset:-2px -4px;background:linear-gradient(90deg, rgba(0,0,0,.35), rgba(0,0,0,0));z-index:-1;}
.sector-list{padding:16px;display:grid;gap:12px;grid-template-columns:1fr;flex:1 1 auto;}
@media (min-width:1280px){.sector-list{grid-template-columns:repeat(2,minmax(0,1fr));}}
.sector-item{display:flex;align-items:center;gap:10px;padding:10px 12px;line-height:1.25;border:1px solid var(--rel-accent);background:#fff;border-radius:4px;}
.sector-card.-dark .sector-item{background:#0f0f0f;color:#fff;border-color:rgba(255,255,255,.28);}
.sector-item .dot{width:8px;height:8px;background:var(--rel-accent);border-radius:2px;display:inline-block;flex:0 0 8px;}
.sector-foot{padding:16px;margin-top:auto;display:flex;justify-content:flex-end;}
.sector-btn{
  border:2px solid var(--rel-black);background:#fff;color:#111;font-weight:800;padding:12px 18px;text-decoration:none;display:inline-block;
  box-shadow:3px 3px 0 var(--rel-accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s;
}
.sector-card.-dark .sector-btn{border-color:#fff;background:#fff;color:#111;}
.sector-btn:hover{background:var(--rel-accent);color:#fff;border-color:var(--rel-accent);box-shadow:3px 3px 0 var(--rel-black);}

/* ========= REL-GEO S ========= */
.rel-geoS{
  --gs-ink:#111111; --gs-accent:#E21E51; --gs-bg:#ffffff; --gs-max:var(--global-content-width);
  --gs-gap:28px; --gs-pad:18px;
  position:relative;isolation:isolate;overflow:visible;background:transparent;
  padding-top:75px;padding-right:1.5rem;padding-left:calc(1rem + 44px + 16px);
}
.rel-geoS::after{
  content:"Nos agences web";
  position:absolute;left:0;top:0;bottom:0;width:50px;display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:#E21E51;border-right:1px solid rgba(17,17,17,.12);z-index:0;
}
.rel-geoS__wrap{max-width:var(--gs-max);margin:0 auto;position:relative;z-index:1;}
.rel-geoS__head{display:grid;grid-template-columns:1fr auto;gap:16px 24px;align-items:end;margin-bottom:28px;}
.rel-geoS__title{margin:0;font-size:clamp(1.9rem, 1.2rem + 1.6vw, 2.6rem);letter-spacing:.02em;color:var(--gs-ink);}
.rel-geoS__lede{grid-column:1/-1;margin:0;color:#444;}
.rel-geoS-btn{
  display:inline-flex !important;width:auto !important;max-width:max-content;
  border:2px solid var(--gs-ink);background:#fff;color:#111;text-decoration:none;
  font-weight:800;padding:12px 18px;align-items:center;gap:8px;box-shadow:3px 3px 0 var(--gs-accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s;
}
.rel-geoS-btn:hover{background:var(--gs-accent);color:#fff;border-color:var(--gs-accent);box-shadow:3px 3px 0 var(--gs-ink);}
.rel-geoS__aside{display:none !important;}
.rel-geoS__grid{display:grid;gap:var(--gs-gap);grid-template-columns:repeat(4,minmax(0,1fr));padding-left:0;}
.rel-geoS-card{
  position:relative;border:1px solid rgba(17,17,17,.28);box-shadow:10px 10px 0 rgba(226,30,81,.15);background:#fff;overflow:visible;min-height:420px;display:flex;
}
.rel-geoS-card::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:6px;background:var(--gs-accent);}
.rel-geoS-card__in{flex:1 1 auto;padding:var(--gs-pad);display:flex;flex-direction:column;gap:14px;}
.rel-geoS-card__title{margin:0;font-size:14px;letter-spacing:.12em;color:var(--gs-ink);}
.rel-geoS-card__text{margin:0;color:#2f2f2f;line-height:1.55;font-size:clamp(.95rem,.9rem + .2vw,1rem);}
.rel-geoS-card__actions{margin-top:auto;display:flex;flex-direction:column;gap:12px;}
.rel-geoS-link{
  border:2px solid var(--gs-ink);background:#fff;color:#111;font-weight:800;padding:12px 18px;text-decoration:none;text-transform:uppercase;font-size:13px;letter-spacing:.4px;
  box-shadow:3px 3px 0 var(--gs-accent);transition:all .2s;display:inline-flex;align-items:center;gap:8px;width:max-content;max-width:100%;
}
.rel-geoS-link:hover{background:var(--gs-accent);color:#fff;border-color:var(--gs-accent);box-shadow:3px 3px 0 var(--gs-ink);}
.rel-geoS-link.--ghost{box-shadow:3px 3px 0 rgba(17,17,17,.25);}
.rel-geoS-card--ge::before{background:#E21E51;}
.rel-geoS-card--ls::before{background:#111111;}
.rel-geoS-card--zh::before{background:#0C0C0C;}
.rel-geoS-card--bs::before{background:#B10D3C;}
.rel-geoS-card--vs::before{background:#E21E51;}

/* ========= REL-MARQ (marquee) ========= */
.rel-marq{
  --mq-ink:#111; --mq-accent:#E21E51; --mq-bg:#fff;
  --mq-max:var(--global-content-width); --mq-gap:24px; --mq-card:380px; --mq-speed:60s;
  position:relative;overflow:hidden;background:transparent;
  padding-top:75px;padding-right:1.5rem;padding-left:calc(1rem + 44px + 16px);
}
.rel-marq::after{
  content:"Études de cas";
  position:absolute;left:0;top:0;bottom:0;width:50px;display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:#000;border-right:1px solid rgba(17,17,17,.12);z-index:0;
}
.rel-marq__wrap{max-width:var(--mq-max);margin:0 auto;position:relative;z-index:1;}
.rel-marq__head{display:grid;grid-template-columns:1fr auto;gap:16px 24px;align-items:end;margin-bottom:18px;}
.rel-marq__title{margin:0;font-size:clamp(1.8rem,1.2rem + 1.6vw,2.4rem);letter-spacing:.02em;color:var(--mq-ink);}
.rel-marq__lede{grid-column:1/-1;margin:0;color:#444;}
.rel-marq-btn{
  border:2px solid var(--mq-ink);background:#fff;color:#111;text-decoration:none;font-weight:800;padding:12px 18px;display:inline-flex;align-items:center;gap:8px;
  box-shadow:3px 3px 0 var(--mq-accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s;width:max-content;max-width:100%;
}
.rel-marq-btn:hover{background:var(--mq-accent);color:#fff;border-color:var(--mq-accent);box-shadow:3px 3px 0 var(--mq-ink);}
.rel-marq-btn.--ghost{box-shadow:3px 3px 0 rgba(17,17,17,.25);}

.rel-marq__marquee{
  --fade:28px;position:relative;overflow:hidden;
  mask-image:linear-gradient(to right, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);
}
.rel-marq__track{display:flex;gap:var(--mq-gap);width:max-content;animation:relMarqScroll var(--mq-speed) linear infinite;will-change:transform;}
.rel-marq__marquee:hover .rel-marq__track{animation-play-state:paused;}
@keyframes relMarqScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.rel-marq__group{display:flex;gap:var(--mq-gap);flex-shrink:0;}
.rel-marq-card{
  width:var(--mq-card);min-width:var(--mq-card);background:#fff;border:1px solid rgba(17,17,17,.22);
  box-shadow:10px 10px 0 rgba(226,30,81,.15);display:flex;flex-direction:column;overflow:hidden;position:relative;
}
.rel-marq-card::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:6px;background:var(--mq-accent);}
.rel-marq-media{position:relative;aspect-ratio:16/9;background:#f2f2f2;overflow:hidden;}
.rel-marq-media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.02);transition:transform .3s ease;}
.rel-marq-card:hover .rel-marq-media img{transform:scale(1.06);}
.rel-marq-wm{position:absolute;left:12px;bottom:10px;padding:6px 10px;background:#111;color:#fff;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:12px;}
.rel-marq-kpis{display:flex;gap:16px;align-items:center;padding:10px 14px;border-top:1px solid rgba(17,17,17,.16);background:linear-gradient(180deg, rgba(226,30,81,.06), transparent 80%), #fff;}
.rel-marq-body{padding:16px 16px 0;display:flex;flex-direction:column;gap:10px;}
.rel-marq-title{margin:0;font-size:18px;color:#111;letter-spacing:.02em;}
.rel-marq-desc{margin:0;color:#333;line-height:1.55;}
.rel-marq-review{margin-top:12px;padding:14px 16px;border-top:1px solid rgba(17,17,17,.12);background:#fff;}
.rel-stars{color:#111;letter-spacing:.12em;font-weight:800;margin-bottom:6px;}
.rel-quote{margin:0;color:#222;line-height:1.6;position:relative;padding-left:24px;}
.rel-quote::before{content:"“";position:absolute;left:0;top:-8px;font-size:36px;line-height:1;color:rgba(17,17,17,.25);}
.rel-author{margin-top:10px;color:#444;}
.rel-author strong{color:#111;}
.rel-marq-actions{padding:14px 16px 16px;display:flex;gap:10px;flex-wrap:wrap;}

/* ========= REL-FAQ ========= */
.rel-faq{
  --fq-ink:#111111; --fq-accent:#E21E51; --fq-bg:#ffffff;
  --fq-max:1437px; --fq-gap:18px;
  --fq-q-lines:2; --fq-q-minh:92px; --fq-ani-open:.64s cubic-bezier(.16,.84,.44,1); --fq-ani-shift:16px;
  position:relative;isolation:isolate;background:transparent;
  padding-top:75px;padding-right:1.5rem;padding-bottom:50px;padding-left:calc(1rem + 44px + 16px);
}
.rel-faq::after{
  content:"Questions fréquentes";
  position:absolute;left:0;top:0;bottom:0;width:50px;display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;background:#E21E51;border-right:1px solid rgba(17,17,17,.12);z-index:0;
}
.rel-faq__wrap{max-width:var(--fq-max);margin:0 auto;position:relative;z-index:1;}
.rel-faq__head{display:grid;grid-template-columns:1fr;gap:12px 24px;margin-bottom:24px;}
.rel-faq__title{margin:0;font-size:clamp(1.9rem,1.2rem + 1.6vw,2.6rem);letter-spacing:.02em;color:var(--fq-ink);}
.rel-faq__lede{grid-column:1/-1;margin:0;color:#444;}
.rel-faq-btn{
  border:2px solid var(--fq-ink);background:#fff;color:#111;text-decoration:none;
  font-weight:800;padding:12px 18px;display:inline-flex;align-items:center;gap:8px;
  box-shadow:3px 3px 0 var(--fq-accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s;width:max-content;max-width:100%;
}
.rel-faq-btn:hover{background:var(--fq-accent);color:#fff;border-color:var(--fq-accent);box-shadow:3px 3px 0 var(--fq-ink);}
.rel-faq__list{display:grid;gap:var(--fq-gap);grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;}
.rel-faq-item{border:1px solid rgba(17,17,17,.22);background:#fff;box-shadow:10px 10px 0 rgba(226,30,81,.15);position:relative;}
.rel-faq-item::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:6px;background:var(--fq-accent);}
.rel-faq-q{
  position:relative;cursor:pointer;list-style:none;padding:16px 56px 16px 18px;color:#111;font-weight:800;line-height:1.35;min-height:var(--fq-q-minh);
  overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--fq-q-lines);
}
.rel-faq-q::-webkit-details-marker{display:none;}
.rel-faq-q::after{
  content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);
  width:22px;height:22px;display:grid;place-items:center;border:2px solid #111;box-shadow:3px 3px 0 var(--fq-accent);font-size:14px;font-weight:800;
}
.rel-faq-item[open] .rel-faq-q{-webkit-line-clamp:unset;overflow:visible;min-height:auto;}
.rel-faq-item[open] .rel-faq-q::after{content:"–";box-shadow:3px 3px 0 var(--fq-ink);}
.rel-faq-a{
  border-top:1px solid rgba(17,17,17,.14);color:#2f2f2f;line-height:1.6;overflow:hidden;height:0;opacity:0;transform:translateY(-var(--fq-ani-shift));
  padding:0 18px;will-change:height,opacity,transform,padding;transition:
  height var(--fq-ani-open), opacity calc(var(--fq-ani-open)*.7) ease, transform calc(var(--fq-ani-open)*.7) ease, padding calc(var(--fq-ani-open)*.7) ease;
}
.rel-faq-a p{margin:0 0 10px;}
.rel-faq-a ul{margin:0 0 10px 18px;}
.rel-faq-a a{color:inherit;border-bottom:1px solid #111;text-decoration:none;}
.rel-faq-a a:hover{color:var(--fq-accent);border-color:var(--fq-accent);}
.rel-faq__foot{margin-top:26px;display:flex;justify-content:flex-end;}

/* ========= CTA DARK ========= */
.cta-reliq-dark{
  background:var(--rq-black);
  color:#fff;
  text-align:center;
  padding:110px 1.5rem;
  position:relative;
  overflow:hidden;
}
.cta__container{max-width:var(--global-content-width);margin:0 auto;position:relative;z-index:1;}
.cta__title{font-size:2.8rem;font-weight:900;margin-bottom:22px;color:#fff;text-transform:uppercase;letter-spacing:1.2px;}
.cta__subtitle{font-size:1.2rem;margin:0 auto 46px;max-width:720px;color:#ddd;}
.cta__buttons{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;}

.reliq-btn{
  display:inline-block;padding:14px 28px;font-size:15px;font-weight:800;text-transform:uppercase;
  color:var(--rq-black);background:#fff;border:2px solid var(--rq-black);text-decoration:none;transition:.25s;box-shadow:4px 4px 0 var(--rq-accent);
}
.reliq-btn:hover{background:var(--rq-accent);color:#fff;border-color:var(--rq-accent);box-shadow:4px 4px 0 #fff;}
.reliq-btn.alt{background:transparent;color:#fff;border:2px solid var(--rq-accent);box-shadow:4px 4px 0 #fff;}
.reliq-btn.alt:hover{background:var(--rq-accent);color:#fff;border-color:var(--rq-accent);box-shadow:4px 4px 0 var(--rq-black);}

/* Effets CTA : keyframes dédiées pour éviter conflits avec 'spin' global */
.cta-reliq-dark::before{
  content:"";position:absolute;inset:-25%;
  background:
    radial-gradient(45% 45% at 20% 30%, rgba(226,30,81,.25), transparent 70%),
    radial-gradient(40% 40% at 80% 70%, rgba(226,30,81,.15), transparent 65%);
  animation:swirl-cta 32s linear infinite;z-index:0;
}
.cta-reliq-dark::after{
  content:"";position:absolute;inset:-20%;
  background:conic-gradient(from 0deg at 50% 50%, rgba(226,30,81,.08), transparent 20%, rgba(255,255,255,.05) 40%, transparent 60%, rgba(226,30,81,.1) 80%, transparent 100%);
  filter:blur(70px);animation:spin-cta 50s linear infinite;z-index:0;
}
@keyframes swirl-cta{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes spin-cta{0%{transform:rotate(0)}100%{transform:rotate(-360deg)}}

/* Tech ~ Expertises sans changer le HTML */
.tech{
  position:relative; isolation:isolate;
  padding-top:75px; padding-right:1.5rem; padding-left: calc(1.5rem + 44px + 16px);
  --rq-black:#111; --rq-accent:#E21E51; --rc-ink:#111111; --rc-accent:var(--rq-accent);
}
.tech::after{ /* rail vertical */ 
  content:"Technologies"; position:absolute; left:0; top:0; bottom:0; width:50px;
  display:flex; align-items:center; justify-content:center; writing-mode:vertical-rl; transform:rotate(180deg);
  font-weight:900; letter-spacing:.22em; text-transform:uppercase; color:#fff; background:var(--rq-accent);
  border-right:1px solid rgba(17,17,17,.14); z-index:0;
}
.tech .wrap{ max-width: var(--global-content-width); margin: 0 auto; position: relative; z-index: 1; }

/* header alias */
.tech__title{ margin:0; font-size:clamp(1.9rem,1.2rem + 1.6vw,2.6rem); letter-spacing:.02em; color:var(--rc-ink); }
.tech__intro{ margin:0 0 26px; color:#444; max-width:1000px; }
.tech__grid{ display:grid; gap:16px; grid-template-columns: repeat(3, minmax(260px, 1fr)); margin-bottom:15px;}

/* carte -> look exp-card */
.tcard{
  border:1px solid rgba(0,0,0,.75); background:#fff;
  padding:16px; display:flex; gap:12px; align-items:flex-start;
  transition:transform .2s ease;
}
.tcard:hover{ transform:translateY(-2px); }
.tcard .tbar{ display:none; } /* on retire la barre verticale */
.tname{ margin:0; color: #E21E51; font-size:5rem; text-transform:none; letter-spacing:0; line-height:1.2; display:flex; align-items:center; gap:10px; }
.tname svg{ width:18px; height:18px; fill:#fff; display:block; background:var(--rq-accent); box-shadow:0 0 0 4px rgba(226,30,81,.12); padding:9px; /* carré visuel simulé */ }
.tdesc{ margin:2px 0 0; color:#111; line-height:1.45; font-size:.95rem; }
.tmeta{ order:-1; margin-bottom:4px; }
.tpill{ display:inline-flex; align-items:center; height:22px; padding:0 8px; font-size:12px; font-weight:800; letter-spacing:.2px; border:1.8px solid currentColor; color:#111; }

/* CTA boutons — alias des styles Expertises si tu as des boutons ici */
.btn--ghost{ border:2px solid var(--ink);background:#fff;color:#111;text-decoration:none;
  font-weight:800;padding:12px 18px;display:inline-flex;align-items:center;gap:8px;
  box-shadow:3px 3px 0 var(--accent);text-transform:uppercase;font-size:13px;letter-spacing:.4px;transition:all .2s; }
.btn--ghost:hover{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:3px 3px 0 var(--ink);}

/* ===== SECTION — Introduction Expertise (image) ===== */
.relx-exi, .relx-exi *{ border-radius:0 !important; }

.relx-exi{
  position:relative; isolation:isolate; background:transparent;
  padding-top:65px; overflow:hidden;
  padding-right:1.5rem; padding-left:calc(1.5rem + 44px + 16px);
  color:var(--rel-black);
}
.relx-exi::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(40% 40% at 20% 30%, rgba(226,30,81,.12), transparent 60%),
    radial-gradient(35% 35% at 80% 70%, rgba(226,30,81,.08), transparent 65%);
  mix-blend-mode:screen; animation:relqPulse 8s ease-in-out infinite alternate;
  z-index:0; pointer-events:none; transform:scale(1.35); transform-origin:center;
}
.relx-exi::after{
  content:"Pourquoi reliq?";
  position:absolute;left:0;top:0;bottom:0;width:50px;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-weight:900;letter-spacing:.22em;text-transform:uppercase;
  color:white;background:#E21E51;border-right:1px solid rgba(17,17,17,.14);z-index:0;
}

.relx-exi__wrap{ max-width:var(--global-content-width); margin:0 auto; position:relative; z-index:1; }

/* Head */
.relx-exi__head{ margin-bottom:28px; }
.relx-exi__headgrid{
  display:grid; grid-template-columns:1fr auto; gap:16px 24px; align-items:end;
}
.relx-exi__title{
  margin:0; font-size:clamp(1.9rem,1.2rem + 1.6vw,2.6rem);
  letter-spacing:.02em; color:var(--rq-black);
}
.relx-exi__lede{ grid-column:1/-1; margin:0; color:var(--ink); }

/* Bouton */
.relx-exi__btn{
  border:2px solid var(--rq-black); background:var(--white); color:var(--rel-black);
  text-decoration:none; font-weight:800; padding:12px 18px;
  display:inline-flex; align-items:center; gap:8px;
  box-shadow:3px 3px 0 var(--rq-accent); text-transform:uppercase; font-size:13px; letter-spacing:.4px; transition:all .2s;
}
.relx-exi__btn:hover{ background:var(--rq-accent); color:var(--white); border-color:var(--rq-accent); box-shadow:3px 3px 0 var(--rel-ink); }

/* Grid */
.relx-exi__grid{ display:grid; gap:18px; grid-template-columns:2fr .75fr; }
@media (max-width:1024px){ .relx-exi__grid{ grid-template-columns:1fr; } }

/* Texte */
.relx-exi__col p{ margin:0 0 14px; color:var(--ink); }
.relx-exi__col h3, .relx-exi__col h4{ margin:18px 0 10px; line-height:1.25; color:var(--rq-black); }

/* Listes */
.relx-exi__points{ margin:12px 0 0; padding:0; list-style:none; display:grid; gap:10px; }
.relx-exi__points li{ position:relative; padding-left:22px; }
.relx-exi__points li::before{
  content:""; position:absolute; left:0; top:.55em;
  width:10px; height:10px; border:2px solid var(--rq-accent);
}
.relx-exi__steps{ margin:12px 0 0 1rem; padding:0; }
.relx-exi__steps li{ margin:6px 0; }
.relx-exi__closing{ margin-top:14px; }
.relx-exi__link{ color:var(--rq-accent); text-decoration:underline; text-underline-offset:2px; }

/* Image aside */
.relx-exi__aside{ display:flex; align-items:center; justify-content:center; }
.relx-exi__img{
  max-width:100%; height:auto; display:block;
  border:1px solid var(--line); background:var(--white);
  box-shadow:3px 3px 0 var(--rq-accent);
}


/*MEDIA QUERIES*/
@media (max-width:1024px){ .tech__grid{ grid-template-columns: repeat(2, minmax(240px, 1fr)); margin-bottom:15px;} }
@media (max-width:560px){ .tech__grid{ grid-template-columns: 1fr; } }
@media (max-width:1100px){ .tech{ padding-left:1.5rem; } .tech::after{ display:none; margin-bottom:15px;} }


/* ========= MEDIA QUERIES (regroupées) ========= */
@media (max-width:1200px){
  .rel-marq{--mq-card:340px;}
}
@media (max-width:1100px){
  /* Rails off + paddings */
  .relq-cabrar,.exp-zone,.sectors,.rel-marq,.rel-faq, .tech, .rel-feature, .relx-exi{padding-left:1rem;}
  .relq-cabrar::after,.exp-zone::after,.sectors::after,.rel-marq::after,.rel-faq::after, .tech::after, .rel-feature::after, .relx-exi::after{display:none;}

  /* rel-cases */
  .rel-cases{padding-left:1rem;}
  .rel-cases::after{display:none;}
  .rel-cases__grid{grid-template-columns:repeat(2,minmax(0,1fr));}

  /* geo */
  .rel-geoS{padding-left:1rem;}
  .rel-geoS::after{display:none;}
  .rel-geoS__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .rel-geoS__head{grid-template-columns:1fr;}

  /* marquee cards */
  .rel-marq{--mq-card:300px;}
  .rel-feature__vert{display:block;}
}
@media (max-width:1024px){
  .cab-grid{grid-template-columns:repeat(2,minmax(220px,1fr));}
  .exp-grid{grid-template-columns:repeat(2,minmax(240px,1fr));}
}
@media (max-width:992px){
  .hero-title{font-size:2rem;}
  .reliq-cta a{width:100%;max-width:280px;margin:12px auto;}
  .trust-signals{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:680px;}
  .features{grid-template-columns:repeat(2,minmax(140px,1fr));column-gap:26px;row-gap:20px;}
}
@media (max-width:960px){
  .rel-feature__grid{grid-template-columns:1fr;}
}
@media (max-width:900px){
  .rel-faq__list{grid-template-columns:1fr;}
  .rel-geoS__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:820px){
  .tech__grid{grid-template-columns:repeat(2,1fr); margin-bottom:15px;}
}
@media (max-width:640px){
  .rel-cases__head{grid-template-columns:1fr;}
  .rel-cases__grid{grid-template-columns:1fr;}
  .rel-cases__foot{justify-content:flex-start;}

  /* sectors : carrousel */
  .sector-grid{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
  .sector-card{flex:0 0 84vw;scroll-snap-align:center;min-height:420px;}
  .sector-grid{scrollbar-width:none;}
  .sector-grid::-webkit-scrollbar{display:none;}
  .scroll-hint{
    position:absolute;right:10px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:2px solid #000;background:#fff;display:grid;place-items:center;
    box-shadow:3px 3px 0 var(--rel-accent);opacity:.9;z-index:2;animation:rp4Nudge 1.8s ease-in-out infinite;
  }
  .scroll-hint svg{width:14px;height:14px;fill:#000;}
  @keyframes rp4Nudge{0%,100%{transform:translate(0,-50%)}50%{transform:translate(4px,-50%)}}

  /* marquee */
  .rel-marq{--mq-card:86vw;}
  .rel-marq__head{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .cab-grid,.exp-grid{grid-template-columns:1fr;}
  .rel-geoS__grid{grid-template-columns:1fr;}
  .rel-geoS__head{grid-template-columns:1fr;}
}
@media (max-width:520px){
  .tech__grid{grid-template-columns:1fr;margin-bottom:15px;}
}
@media (max-width:480px){
  .trust-signals{grid-template-columns:1fr 1fr;}
  .features{grid-template-columns:1fr 1fr;gap:18px 22px;}
}

/* Accessibilité */
@media (prefers-reduced-motion:reduce){
  .rel-marq__track{animation-duration:.001s;animation-iteration-count:1;}
  .rel-faq-a{transition:none !important;transform:none !important;}
}

/* ===== SECTION — Avis clients (RELIQ Marquee, double ligne corrigée) ===== */
.relq-marq, .relq-marq *{ border-radius:0 !important; }

.relq-marq{
  position:relative; isolation:isolate; background:var(--white);
  padding:80px 1.5rem; overflow:hidden;
  padding-left:calc(1.5rem + 44px + 16px);
  color:var(--rel-black);
}

/* Rail */
.relq-marq::after{
  content: attr(data-rail);
  position:absolute; left:0; top:0; bottom:0; width:50px;
  display:flex; align-items:center; justify-content:center;
  writing-mode:vertical-rl; transform:rotate(180deg);
  font-weight:900; letter-spacing:.22em; text-transform:uppercase;
  color:var(--white); background:var(--rq-black);
  border-right:1px solid rgba(17,17,17,.14); z-index:0;
}

.marq-wrap{
  max-width:var(--global-content-width);
  margin:0 auto; position:relative; z-index:1;
  overflow:hidden;
  display:grid; gap:26px;
}

/* Rangées */
.marq-row{ overflow:hidden; }
.marq-row .marq-track{
  display:flex; gap:50px; width:max-content; will-change:transform;
  animation:marqSlide 40s linear infinite;
}
.marq-row--rev .marq-track{ animation-direction:reverse; }

/* Pause au survol */
.relq-marq:hover .marq-track,
.marq-wrap:hover .marq-track,
.marq-row:hover .marq-track,
.marq-track:hover{
  animation-play-state:paused;
}

/* Animation */
@keyframes marqSlide{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-50%); }
}

/* Cartes */
.marq-avis{
  min-width:420px; max-width:560px;
  flex:0 0 auto;
  border:1px solid var(--line);
  background:var(--white);
  padding:36px 32px;
  box-shadow:4px 4px 0 var(--rq-accent);
  display:flex; flex-direction:column; justify-content:space-between;
  min-height:220px;
  overflow:hidden;
}

.marq-txt{
  margin:0 0 18px;
  line-height:1.7;
  font-size:1.2rem;
  font-style:italic;
  color:var(--ink);
  padding-left:28px;
  position:relative;
}
.marq-txt::before{
  content:"«";
  position:absolute;
  left:0; top:.05em;
  font-size:1.2em;
  font-weight:900;
  color:var(--rq-accent);
  line-height:1;
}
/* pas de guillemet fermant flottant */
.marq-txt::after{ content:""; display:none; }

.marq-author{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
  font-weight:700;
  color:var(--rel-black);
  font-size:1rem;
}

/* Responsive */
@media (max-width:1100px){
  .relq-marq{ padding-left:1rem; }
  .relq-marq::after{ display:none; }
  .marq-avis{
    min-width:300px; max-width:380px;
    padding:22px 20px;
    min-height:180px;
  }
  .marq-txt{ font-size:1rem; }
}

/* ===== TECH CLAIR PREMIUM (mise à jour mockup) ===== */
#techC-title{ margin-bottom:6px; }

.rel-techC{ position:relative; color:var(--ink); padding: 0 var(--global-content-edge-padding);}
.rel-techC__wrap{ max-width:var(--global-content-width); margin:0 auto; }

.rel-techC__head{ max-width:100%; }
.rel-techC__underline{ display:block; height:3px; width:140px; margin:.5rem 0 0; background:var(--rel-accent); }
.rel-techC__lede{ margin:0; font-size:1.05rem; color:var(--muted); }

/* grille intro + aside */
.rel-techC__topgrid{
  display:grid; gap:28px; margin-top:18px;
  grid-template-columns:minmax(0,1fr) 380px;
}
@media (max-width:1100px){
  .rel-techC__topgrid{ grid-template-columns:1fr; }
}

/* blocs */
.rel-techC__block{
  background:#fff; border:1px solid var(--line);
  padding:22px; box-shadow:0 10px 30px rgba(0,0,0,.05);
}
.rel-techC__intro{ /* juste pour l’intro */
  padding:18px 20px;
}

/* aside en carte (pas sticky ici, il est au-dessus) */
.rel-techC__aside{ align-self:start; }
.rel-techC__card{
  background:#fff; border:1px solid var(--line); padding:18px 20px;
  box-shadow:0 18px 48px rgba(226,30,81,.12);
}
.rel-techC__cardTitle{
  margin:0 0 .8rem; font-size:1.02rem; font-weight:900; color:var(--rel-black);
}


/* image sous l’intro + aside */
.rel-techC__media{
	margin:26px 0 18px;
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:96px;   /* assure un bloc visible */
  padding:1rem 0;
}

.rel-techC__media i {
  font-size: 5rem; /* force la taille */
  color: #E21E51; 
  line-height: 1;
}

/* pros/cons */
.rel-techC__proscons{
  display:grid; gap:24px; grid-template-columns:1fr 1fr; margin-top:15px;
}
@media (max-width:900px){ .rel-techC__proscons{ grid-template-columns:1fr; } }

.rel-techC__h3{ margin:0 0 .5rem; font-size:1.06rem; font-weight:900; color:var(--rel-black); }

.rel-techC__list{ list-style:none; padding:0; margin:.35rem 0 0; }
.rel-techC__list li{ position:relative; padding-left:26px; margin:.5rem 0; }
.rel-techC__list li::before{
  content:""; position:absolute; left:0; top:.45rem; width:12px; height:12px;
  background:var(--rel-accent); border:2px solid var(--rel-accent);
}
.rel-techC__list--pros li::before{ background:#1f9d55; border-color:#1f9d55; }
.rel-techC__list--cons li::before{ background:#b22b2b; border-color:#b22b2b; }

/* no radius */
.rel-techC, .rel-techC *{ border-radius:0 !important; }

/*TEMPLATE REFERENCES*/
/* ===== PAGE RÉFÉRENCE — RELIQ · SIMPLE PREMIUM (COMPLET) ===== */
.rel-refS{ background:#fff; color:var(--ink); padding: 0 var(--global-content-edge-padding);}
.rel-refS__wrap{ max-width:var(--global-content-width); margin:0 auto; }
.rel-refS, .rel-refS *{ border-radius:0 !important; }

/* HERO : grille 2 colonnes */
.rel-refS__heroGrid{
  display:grid; gap:32px; grid-template-columns:minmax(0,1fr) 360px;
  align-items:start; margin-bottom:26px;
}
@media(max-width:1100px){ .rel-refS__heroGrid{ grid-template-columns:1fr; } }

.rel-refS__title{
  margin:0; color:var(--rel-black); font-weight:1000;
  line-height:1.04; font-size:clamp(36px,4.8vw,64px);
}
.rel-refS__lede{ margin:10px 0 14px; max-width:900px; color:var(--muted); font-size:1.1rem; }
.rel-refS__desc{ font-size:1rem; line-height:1.65; color:var(--ink); }

/* Aside / infos projet */
.rel-refS__card{
  background:#fff; border:1px solid var(--line); padding:20px;
  box-shadow:0 12px 36px rgba(0,0,0,.05);
}
.rel-refS__cardTitle{ margin:0 0 .9rem; font-size:1.08rem; font-weight:900; color:var(--rel-black); }
.rel-refS__meta{ margin:0; padding:0; }
.rel-refS__meta div{ display:flex; gap:.6rem; margin:.45rem 0; }
.rel-refS__meta dt{
  width:92px; flex:0 0 auto; text-transform:uppercase; letter-spacing:.04em; color:var(--muted);
}
.rel-refS__meta dd{ margin:0; color:var(--ink); }
.rel-refS__ctaWrap{ margin-top:12px; }

/* Image principale */
.rel-refS__media{ margin:18px 0 8px; }
.rel-refS__media img{
  display:block; width:100%; height:clamp(260px,46vh,520px); object-fit:cover;
  background:#f6f6f6; border:1px solid var(--line);
  box-shadow:0 14px 48px rgba(0,0,0,.06);
}
.rel-refS__caption{
  margin-top:6px; color:var(--muted); font-size:.95rem;
}

/* KPIs */
.rel-refS__kpis{
  display:grid; gap:16px; grid-template-columns:repeat(4, minmax(0,1fr));
  margin:14px 0 6px;
}
.rel-refS__kpi{
  background:#fff; border:1px solid var(--line); padding:18px 16px;
  box-shadow:0 10px 32px rgba(0,0,0,.05);
}
.rel-refS__kpi .n{ display:block; font-weight:1000; color:var(--rel-black); font-size:clamp(22px,3vw,34px); line-height:1; }
.rel-refS__kpi .l{ display:block; color:var(--muted); margin-top:6px; }
.rel-refS__kpi.kpi--opt{ display:block; }
@media(max-width:1000px){
  .rel-refS__kpis{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:640px){
  .rel-refS__kpis{ grid-template-columns:1fr; }
}

/* Défi → Solution */
.rel-refS__split{ display:grid; gap:18px; grid-template-columns:1fr 1fr; margin-top:10px; }
@media(max-width:900px){ .rel-refS__split{ grid-template-columns:1fr; } }
.rel-refS__h2{
  margin:0 0 .7rem; font-size:1.32rem; font-weight:900; color:var(--rel-black);
  border-left:8px solid var(--rel-accent); padding-left:.7rem;
}
.rel-refS__list{ list-style:none; padding:0; margin:.3rem 0 0; }
.rel-refS__list li{ position:relative; padding-left:24px; margin:.45rem 0; }
.rel-refS__list li::before{
  content:""; position:absolute; left:0; top:.5rem; width:10px; height:10px;
  background:var(--rel-accent); border:2px solid var(--rel-accent);
}
.rel-refS__card--accent{ border-color:var(--rel-accent); box-shadow:0 16px 44px rgba(226,30,81,.15); }
.rel-refS__list--accent li::before{ background:var(--rel-accent); border-color:var(--rel-accent); }

/* Livrables / Stack / Résultats (3 colonnes) */
.rel-refS__grid3{ display:grid; gap:18px; grid-template-columns:repeat(3,1fr); margin-top:18px; }
@media(max-width:1000px){ .rel-refS__grid3{ grid-template-columns:1fr; } }
.rel-refS__h3{ margin:0 0 .5rem; font-size:1.12rem; font-weight:900; color:var(--rel-black); }
.rel-refS__chips{
  display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:.2rem 0 0;
}
.rel-refS__chips li{
  padding:.45rem .6rem; background:linear-gradient(180deg,#fff,rgba(232,232,236,.45));
  border:1px solid var(--line); font-weight:700; color:var(--rel-black);
}

/* Galerie */
.rel-refS__gallery{
  margin:18px 0 24px;
  display:grid; gap:16px; grid-template-columns:repeat(4, 1fr);
}
  /* ===== SECTION ===== */
  .rel-refS__related{ margin:0; padding:0; margin-bottom:50px;}
  .rel-refS__related *{ border-radius:0 !important; }

  /* ===== BANDEAU ===== */
  .rel-refS__relatedBanner{
    position:relative; margin:0; overflow:hidden; background:var(--rq-black);
    aspect-ratio: 16/5;
  }
  .rel-refS__relatedBanner > img{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; opacity:.35;
  }
  .rel-refS__overlay{
    position:relative; z-index:1; height:100%;
    display:flex; flex-direction:column; justify-content:flex-end;
    padding:48px 1rem;
    background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.6) 100%);
  }
  .visually-hidden{
    position:absolute!important; width:1px; height:1px; overflow:hidden;
    clip:rect(1px,1px,1px,1px); white-space:nowrap;
  }

  /* ===== CONTENU ===== */
  .rel-refS__grid{
    display:grid; gap:24px;
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  @media (max-width:1024px){ .rel-refS__grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:640px){ .rel-refS__grid{ grid-template-columns:1fr; } }

  /* ===== CARTES INJECTÉES (.rcard) ===== */
  .rcard{
    background:var(--white);
    border:1px solid var(--line);
    box-shadow:3px 3px 0 var(--rel-accent);
    transition:.25s ease;
  }
  .rcard:hover{ transform:translateY(-2px); box-shadow:4px 4px 0 var(--rel-accent); }
  .rcard__media{ aspect-ratio:16/9; background:#f3f3f6; }
  .rcard__img{ width:100%; height:100%; object-fit:cover; }
  .rcard__body{ padding:16px 18px; }
  .rname{ margin:0 0 4px; font-size:18px; color:var(--rel-ink); }
  .rname a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.2); }
  .rname a:hover{ color:var(--rel-accent); border-color:var(--rel-accent); }
  .rdesc{ margin:0; font-size:15px; color:var(--muted); }
@media(max-width:1000px){ .rel-refS__gallery{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .rel-refS__gallery{ grid-template-columns:1fr; } }
.rel-refS__shot img{
  display:block; width:100%; height:220px; object-fit:cover; background:#f4f4f4; border:1px solid var(--line);
  box-shadow:0 8px 24px rgba(0,0,0,.05);
}


@media(max-width:800px){ .rel-refS__cta{ flex-direction:column; align-items:flex-start; } }
.rel-refS__cta h2{ margin:0; font-size:1.28rem; color:var(--rel-black); font-weight:900; }

/*TEMPLATE AGENCES*/
/* ===== AGENCE WEB — RELIQ · PROPOSITION B ===== */
.rq-span{
  --xpad: .08em;             /* micro padding horizontal */
  color:var(--rel-ink);
  font-weight:800;
  letter-spacing:.01em;
  text-transform:none;
  display:inline-block;
  line-height:1.1;
	text-transform:uppercase;
}

.rq-marker{
  background:linear-gradient(transparent 65%, var(--rel-accent) 65%);
  padding:0 var(--xpad);
}

.rel-agB{ background:#fff; color:var(--ink);  padding: 0 var(--global-content-edge-padding);}
.rel-agB__wrap{ max-width:var(--global-content-width); margin:0 auto; }
.rel-agB, .rel-agB *{ border-radius:0 !important; }

/* HERO */
.rel-agB__hero{
display:grid; gap:28px; align-items:center;
  grid-template-columns:minmax(0,1fr) 520px;
}
@media (max-width:1200px){ .rel-agB__hero{ grid-template-columns:1fr; margin-left:0; } }

.rel-agB__title{
  margin:0; color:var(--rel-black); font-weight:1000;
  line-height:1.04; font-size:clamp(36px,5vw,66px);
}
.rel-agB__lede{ margin:12px 0 16px; max-width:760px; color:var(--muted); font-size:1.12rem; }
.rel-agB__ctaRow{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin:4px 0 10px; }
.rel-agB__bullets{ list-style:none; padding:0; margin:10px 0 0; display:flex; gap:16px; flex-wrap:wrap; }
.rel-agB__bullets li{
  padding:.45rem .6rem; background:linear-gradient(180deg,#fff,rgba(232,232,236,.45));
  border:1px solid var(--line); font-weight:700; color:var(--rel-black);
}

.rel-agB__heroMedia img{
  display:block; width:100%; height:clamp(280px,46vh,520px); object-fit:cover;
  background:#f6f6f6; border:1px solid var(--line); box-shadow:0 14px 48px rgba(0,0,0,.06);
}

/* TITRES DE SECTION */
.rel-agB__h2{
  margin:48px 0 16px; font-size:1.42rem; font-weight:900; color:var(--rel-black);
  border-left:8px solid var(--rel-accent); padding-left:.7rem;
}

/* WHY */
.rel-agB__grid4{ display:grid; gap:20px; grid-template-columns:repeat(4,1fr); }
@media (max-width:1100px){ .rel-agB__grid4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .rel-agB__grid4{ grid-template-columns:1fr; } }
.rel-agB__whyCard{
  background:#fff; border:1px solid var(--line); padding:22px; box-shadow:0 10px 30px rgba(0,0,0,.05);
}
.rel-agB__whyCard h3{ margin:0 0 .5rem; font-weight:900; color:var(--rel-black); }

/* SERVICES */
.rel-agB__services{ margin-top:26px; }
.rel-agB__grid3{ display:grid; gap:20px; grid-template-columns:repeat(3,1fr); }
@media (max-width:1000px){ .rel-agB__grid3{ grid-template-columns:1fr; } }
.rel-agB__card{
  background:#fff; border:1px solid var(--line); padding:24px; box-shadow:0 12px 34px rgba(0,0,0,.05);
}
.rel-agB__card h3{ margin:0 0 .5rem; font-weight:900; color:var(--rel-black); }

/* PROCESS */
.rel-agB__process{ margin-top:18px; }
.rel-agB__steps{
  counter-reset: step; list-style:none; padding:0; margin:6px 0 0;
  display:grid; gap:14px; grid-template-columns:repeat(4,1fr);
}
@media (max-width:900px){ .rel-agB__steps{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .rel-agB__steps{ grid-template-columns:1fr; } }
.rel-agB__steps li{
  background:#fff; border:1px solid var(--line); padding:18px; box-shadow:0 10px 30px rgba(0,0,0,.05);
  font-weight:700; color:var(--rel-black);
}
.rel-agB__steps li span{
  display:inline-block; min-width:34px; text-align:center; margin-right:8px;
  color:#fff; background:var(--rel-accent); border:1px solid rgba(0,0,0,.12); box-shadow:3px 3px 0 var(--rel-accent);
}

/* COUVERTURE */
.rel-agB__coverage{ margin-top:22px; }
.rel-agB__cities{ list-style:none; padding:0; margin:8px 0 0; display:flex; flex-wrap:wrap; gap:10px 16px; }
.rel-agB__cities a{ font-weight:900; color:var(--rel-black); text-decoration:underline; }

/* FAQ */
.rel-agB__faq{ margin-top:22px; }
.rel-agB__qa{ border:1px solid var(--line); padding:14px 16px; box-shadow:0 8px 24px rgba(0,0,0,.04); }
.rel-agB__qa + .rel-agB__qa{ margin-top:10px; }
.rel-agB__qa summary{ cursor:pointer; font-weight:900; color:var(--rel-black); }
.rel-agB__qa p{ margin:.6rem 0 0; color:var(--ink); }

/* CTA final */
.rel-agB__ctaBar{
  margin-top:28px; padding:24px; display:flex; gap:16px; align-items:center; justify-content:space-between;
  border:1px solid var(--line); box-shadow:0 16px 48px rgba(226,30,81,.14);
}
@media(max-width:800px){ .rel-agB__ctaBar{ flex-direction:column; align-items:flex-start; } }
.rel-agB__ctaBar h2{ margin:0; font-size:1.32rem; color:var(--rel-black); font-weight:900; }