/* ==========================================================
   Thème Koyuncu — styles complémentaires
   Ce qui ne peut pas être exprimé dans theme.json.
   Aucune police externe : voir style.css et theme.json.
   ========================================================== */

/* --- lien d'évitement --- */
.kk-skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--wp--preset--color--ink);color:#fff;
  padding:.75rem 1rem;
  font-family:var(--wp--preset--font-family--mono);
  font-size:.875rem;text-decoration:none;
}
.kk-skip:focus{left:0}

/* --- accessibilité : focus visible partout --- */
:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--wp--preset--color--accent);
  outline-offset:3px;
}

/* --- barre de navigation --- */
.kk-topbar{
  border-bottom:1px solid var(--wp--preset--color--rule);
  position:sticky;top:0;z-index:20;
}
.admin-bar .kk-topbar{top:32px}
@media screen and (max-width:782px){.admin-bar .kk-topbar{top:46px}}
.kk-topbar .wp-block-navigation{
  font-size:1.4rem;font-weight:600;
}
/* écrans intermédiaires : on réduit pour éviter que le menu ne passe
   à la ligne sous le logo */
@media (max-width:1100px){
  .kk-topbar .wp-block-navigation{font-size:1.2rem}
  .kk-topbar .wp-block-navigation__container > .wp-block-navigation-item:not(:last-child)::after{
    height:26px;
  }
}
.kk-topbar .wp-block-navigation a{
  border-bottom:2px solid transparent;padding-bottom:.2rem;
}

/* --- filet rouge entre les entrées du menu ---
   Rappel du filet placé sous le nom dans le logo. Le trait est décoratif :
   aria-hidden par nature, il n'est pas restitué par les lecteurs d'écran. */
.kk-topbar .wp-block-navigation__container > .wp-block-navigation-item{
  display:flex;align-items:center;gap:1.1rem;
}
.kk-topbar .wp-block-navigation__container > .wp-block-navigation-item:not(:last-child)::after{
  content:"";flex:none;
  /* Épaisseur reprise du filet sous le nom dans le logo (2 px à l'écran),
     longueur réduite pour rester proche de la hauteur du texte du menu. */
  width:2px;height:33px;
  background:var(--wp--preset--color--accent);
}
/* menu déroulant sur mobile : entrées plus grandes et plus espacées */
@media (max-width:600px){
  .kk-topbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container{font-size:1.6rem;gap:1.25rem}
  .kk-topbar .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container > .wp-block-navigation-item::after{display:none}
}
.kk-topbar .wp-block-navigation a:hover{
  border-bottom-color:var(--wp--preset--color--accent);
}

/* --- ouverture de la page d'accueil --- */
.kk-hero{
  border-bottom:3px solid var(--wp--preset--color--accent);
}
.kk-role,.kk-eyebrow{
  font-family:var(--wp--preset--font-family--mono);
  font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:600;margin-bottom:.5rem;
}
.kk-role{color:var(--wp--preset--color--muted)}
.kk-eyebrow{color:var(--wp--preset--color--accent)}
.kk-thesis{
  font-family:var(--wp--preset--font-family--serif);
  font-size:1.2rem;line-height:1.5;
}

/* --- cartes --- */
.kk-card{
  border:1px solid var(--wp--preset--color--rule);
  border-radius:3px;
}
.kk-card h2 a,.kk-card h3 a{
  color:var(--wp--preset--color--ink);text-decoration:none;
}
.kk-card h2 a:hover,.kk-card h3 a:hover{text-decoration:underline}

/* --- vignette des articles (image mise en avant) --- */
.kk-thumb{margin:0}
.kk-thumb img{
  width:100%;height:100%;object-fit:cover;
  border-radius:2px;display:block;
}
.kk-card > *:first-child{margin-block-start:0}

@media (min-width:600px){
  /* Deux colonnes uniquement lorsqu'une vignette existe.
     Sans prise en charge de :has(), la vignette se place
     simplement au-dessus du titre : mise en page dégradée,
     jamais cassée. */
  .kk-card:has(.kk-thumb img){
    display:grid;
    grid-template-columns:180px minmax(0,1fr);
    column-gap:1.4rem;
    align-items:start;
  }
  .kk-card:has(.kk-thumb img) > *{margin-block-start:0}
  .kk-card:has(.kk-thumb img) > * + *{margin-block-start:.5rem}
  .kk-card:has(.kk-thumb img) .kk-thumb{
    grid-column:1;grid-row:1 / span 20;margin-block-start:0;
  }
  .kk-card:has(.kk-thumb img) > :not(.kk-thumb){grid-column:2}
  .kk-card:has(.kk-thumb img) > :nth-child(2){margin-block-start:0}
}

.kk-hero-thumb img{
  width:100%;height:auto;object-fit:cover;border-radius:3px;
}

/* --- bloc sombre (contact) --- */
.kk-dark{
  background:var(--wp--preset--color--ink);
  color:#fff;border-radius:3px;
}
.kk-dark h2,.kk-dark h3{color:#fff}
.kk-dark a{color:#fff;text-decoration-color:#F0B8C0}
.kk-dark .kk-eyebrow{color:#F0B8C0}

/* --- fiche d'une question (injectée par functions.php) --- */
.kk-fiche{
  background:var(--wp--preset--color--card);
  border:1px solid var(--wp--preset--color--rule);
  border-radius:3px;
  padding:1.1rem 1.25rem;
  margin:0 0 1.75rem;
}
.kk-fiche dl{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));
  gap:.9rem 1.5rem;margin:0;
}
.kk-fiche dt{
  font-family:var(--wp--preset--font-family--mono);
  font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--wp--preset--color--muted);font-weight:600;margin-bottom:.2rem;
}
.kk-fiche dd{margin:0;font-size:.95rem}
.kk-fiche .kk-answer{
  margin:1.1rem 0 0;padding-top:1rem;
  border-top:1px solid var(--wp--preset--color--rule);
}
.kk-fiche .kk-answer strong{color:var(--wp--preset--color--accent)}
.kk-fiche .kk-source{margin:.9rem 0 0;font-size:.9rem}

/* --- pastilles de référence et d'état --- */
.kk-ref{
  font-family:var(--wp--preset--font-family--mono);font-size:.75rem;
  background:var(--wp--preset--color--stamp);
  border:1px solid var(--wp--preset--color--rule);
  border-radius:2px;padding:.12rem .45rem;white-space:nowrap;
}
.kk-state{
  display:inline-block;
  font-family:var(--wp--preset--font-family--mono);
  font-size:.72rem;padding:.15rem .5rem;border-radius:2px;
  font-weight:700;white-space:nowrap;
}
.kk-state--tenu{background:#DDEEE1;color:#0F4023}
.kk-state--partiel{background:#FDF0DA;color:#6B4708}
.kk-state--non{background:#FAE0E4;color:#7E0E1F}
.kk-state--attente{background:#E4E9F0;color:#2C3852}
.kk-state--sans{background:var(--wp--preset--color--stamp);color:var(--wp--preset--color--muted)}

/* --- logo de l'en-tête ---
   La hauteur pilote la taille : le logo étant très allongé, la contraindre
   évite qu'il n'écrase la navigation. Les !important neutralisent la largeur
   fixée par le bloc dans l'éditeur, qui autrement l'emporterait. */
.kk-topbar .wp-block-site-logo{width:auto !important;max-width:none !important}
.kk-topbar .wp-block-site-logo img{
  width:auto !important;height:auto !important;
  max-height:180px;max-width:min(70vw,660px);
  display:block;
}
@media (max-width:900px){
  .kk-topbar .wp-block-site-logo img{max-height:140px}
}
@media (max-width:600px){
  .kk-topbar .wp-block-site-logo img{max-height:104px;max-width:74vw}
}

/* --- corps des questions en Literata ---
   Les questions sont des textes longs : la serif de lecture y est
   plus confortable que la sans d'interface utilisée ailleurs. */
.single-qp_question .wp-block-post-content{
  font-family:var(--wp--preset--font-family--serif);
  font-size:1.15rem;line-height:1.72;
}
.single-qp_question .wp-block-post-content li{margin-bottom:.35rem}

/* la fiche structurée reste en sans, pour la distinguer du propos */
.single-qp_question .kk-fiche{font-family:var(--wp--preset--font-family--sans)}
.single-qp_question .kk-fiche dd{font-size:.95rem}

/* --- signature en pied de question --- */
.kk-sign{
  margin:2rem 0 0;padding-top:1rem;
  border-top:1px solid var(--wp--preset--color--rule);
  font-weight:600;line-height:1.45;
}
.kk-sign span{
  display:block;font-weight:400;font-size:.9rem;
  color:var(--wp--preset--color--muted);
}

/* --- taxonomies en pied de fiche --- */
.kk-taxo{
  border-top:1px solid var(--wp--preset--color--rule);
  padding-top:1rem;color:var(--wp--preset--color--muted);
  gap:.4rem 1.5rem;
}

/* --- pied de page --- */
.kk-footer{border-top:1px solid var(--wp--preset--color--rule)}

/* --- impression --- */
@media print{
  .kk-topbar,.wp-block-navigation,.kk-skip{display:none!important}
  body{background:#fff}
  .kk-fiche,.kk-card{border:none;padding:0}
  .kk-thumb,.kk-hero-thumb{display:none}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
