/* SKADI - Palette de marque et echelle typographique fluide.
   Surcouche du theme Blacksilver : on n'edite jamais styles-black.css. */

:root{
  /* Fonds */
  --skadi-bg:#232E33;        /* sol : charbon bleute */
  --skadi-surface:#2A363C;   /* bloc detache (FAQ, portrait) */
  --skadi-deep:#1C2529;      /* pied de page, menu vertical */
  --skadi-petrole:#2F596B;   /* petrole sature : filets, petits aplats */
  --skadi-hairline:#33424A;

  /* Encres */
  --skadi-ink:#FFFFFF;
  --skadi-muted:#A8B4BA;     /* 6.56:1 sur le sol */
  --skadi-muted-fort:#CBD3D7;

  /* Accents : version graphique et version texte */
  --skadi-laiton:#AB6A20;         /* traits, contours, motifs (3.19:1) */
  --skadi-laiton-texte:#C9862F;   /* petit texte laiton (4.59:1) */
  --skadi-glacier:#2082AB;        /* crete, traits froids */
  --skadi-glacier-texte:#3FA3CC;  /* petit texte froid (4.85:1) */
}

/* ---- Sol ---- */
html body,
body .container-outer,
body.error404{background-color:var(--skadi-bg);}
body .footer-outer-wrap{background-color:var(--skadi-deep);}
body .gridblock-element-inner,
body .commentform-wrap .comment.odd{background-color:var(--skadi-surface);}

/* ---- Liens dans le corps de texte ---- */
.section-description a,
.elementor-widget-text-editor a,
.elementor-widget-accordion .elementor-tab-content a{
  color:var(--skadi-laiton-texte);
  text-decoration:underline;
  text-underline-offset:.18em;
  text-decoration-thickness:1px;
}
.section-description a:hover,
.elementor-widget-text-editor a:hover,
.elementor-widget-accordion .elementor-tab-content a:hover{color:var(--skadi-glacier-texte);}

/* ---- Echelle typographique fluide ----
   Une seule regle couvre mobile, tablette et grand ecran : pas de palier
   qui saute, pas de titre a quatre lignes sur un petit telephone. */
.section-heading .section-title,
.elementor-widget-section-heading h1.section-title,
.elementor-widget-section-heading h2.section-title{
  font-size:clamp(1.75rem,1.15rem + 2.6vw,3.25rem);
  line-height:1.08;
  letter-spacing:-.01em;
  text-wrap:balance;
}
.section-heading .section-subtitle{
  font-size:clamp(.72rem,.66rem + .22vw,.82rem);
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--skadi-laiton-texte);
}
.section-heading .section-description,
.elementor-widget-text-editor{
  font-size:clamp(1rem,.96rem + .18vw,1.0625rem);
  line-height:1.72;
  color:var(--skadi-muted);
}
.section-heading .section-description p{max-width:65ch;}
.section-align-center .section-description p{margin-inline:auto;}

/* ---- Repli mobile ---- */
@media (max-width:767px){
  .section-heading .section-description p{max-width:none;}
  .elementor-widget-section-heading{text-align:left;}
  .section-align-center .section-description p{margin-inline:0;}

  /* Le theme fait tomber les grilles a une seule colonne sous 768px.
     Sur cette page cela donne 23 photos pleine largeur a la suite : un mur
     d'accrochage devient un couloir. On tient deux colonnes. */
  .thumbnails-grid-container.gridblock-four .gridblock-element,
  .thumbnails-grid-container.gridblock-three .gridblock-element,
  .thumbnails-grid-container.gridblock-two .gridblock-element{
    width:50%;padding:0 3px;
  }
  .thumbnails-grid-container{width:calc(100% + 6px);margin-left:-3px;}

  /* L'arche se resserre : sur un ecran etroit, une pointe trop marquee
     rogne le sujet. */
  .skadi-arche .skadi-arche-trace{opacity:.85;}

  .skadi-crete{margin-block:clamp(32px,9vw,48px);}
}

/* ---- Cibles tactiles ---- */
@media (hover:none){
  .elementor-widget-accordion .elementor-tab-title{min-height:48px;display:flex;align-items:center;}
}