/*
Theme Name: Ludivine Larosa
Theme URI: https://www.ludivinelarosa.com
Author: Ludivine Larosa
Description: Thème sur mesure, éditorial, pour le site d'artiste de Ludivine Larosa. Feuilles blanc cassé sur fond pierre, petits repères, grandes images. Chaque œuvre est présentée entière, dans le même cadre chêne clair sur un mur (présentation simulée).
Version: 0.5.4
Requires at least: 6.3
Requires PHP: 7.4
License: Propriétaire — usage réservé à ludivinelarosa.com
Text Domain: ludivine-larosa
*/

/* Direction éditoriale (21/10/2026) — référence envoyée par Ludivine : planches « Esaku » (brand guidelines).
   Fond pierre, feuilles blanc cassé, barre de repères en petit texte (nom · rubrique · repère · numéro),
   grandes images, texte court en bas à droite, beaucoup d'air. Titres : Cormorant Garamond ; texte : Jost. */
:root{
  --ll-stone:#DEDBD5;          /* fond pierre, autour des feuilles */
  --ll-sheet:#F4F2EE;          /* feuille blanc cassé */
  --ll-wall:var(--ll-sheet);   /* mur = même couleur que la feuille (demande de Ludivine, 21/10/2026) */
  --ll-oak:#D6BC9C;            /* cadre chêne clair */
  --ll-ink:#1D1A17;
  --ll-muted:#8A837B;
  --ll-line:#D9D1C4;
  --ll-accent:#6E0A1E;
  --ll-display:"Cormorant Garamond",Georgia,serif;
  --ll-text:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ll-max:1440px;
  --ll-pad:clamp(20px,3.2vw,48px);
  --ll-gap:clamp(12px,1.4vw,20px);
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ll-stone);color:var(--ll-ink);font-family:var(--ll-text);font-weight:400;font-size:12.5px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:opacity .3s ease}
a:hover{opacity:.55}
:focus-visible{outline:1px solid var(--ll-ink);outline-offset:4px}
h1,h2,h3{font-family:var(--ll-display);font-weight:300;line-height:.95;margin:0;text-wrap:balance}
p{margin:0 0 1em}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:12px;left:12px;width:auto;height:auto;clip:auto;z-index:100;background:var(--ll-ink);color:var(--ll-sheet);padding:10px 16px}
.ll-muted{color:var(--ll-muted)}
.ll-link{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

/* ---------- Feuilles ---------- */
.ll-sheet{background:var(--ll-sheet);max-width:var(--ll-max);margin:0 auto;padding:var(--ll-pad)}
.ll-sheet + .ll-sheet{margin-top:var(--ll-gap)}
.ll-page{padding:clamp(12px,1.6vw,24px)}

/* ---------- Barre de repères (nom · menu · repère · numéro) ---------- */
.ll-bar{display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:baseline;gap:16px;padding-bottom:clamp(40px,6vw,96px)}
.ll-bar__name{font-family:var(--ll-display);font-size:22px;font-weight:400;letter-spacing:.005em}
.ll-menu{display:flex;flex-wrap:wrap;gap:6px 22px;list-style:none;margin:0;padding:0}
.ll-menu a[aria-current],.ll-menu .current-menu-item>a,.ll-menu .current_page_item>a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.ll-bar__meta,.ll-bar__count{color:var(--ll-muted)}
.ll-bar__count{font-variant-numeric:tabular-nums;text-align:right}

/* ---------- Œuvre au mur : cadre chêne, ombre douce (présentation simulée, œuvre entière) ---------- */
.ll-wall{background:var(--ll-wall);display:flex;align-items:center;justify-content:center;padding:14% 15%;aspect-ratio:4/5}
.ll-frame{position:relative;display:block;border:clamp(5px,.55vw,9px) solid var(--ll-oak);border-top-color:#DEC6A8;border-left-color:#DAC1A3;border-right-color:#CDB091;border-bottom-color:#C9AB8B;
  box-shadow:4px 14px 26px -4px rgba(40,30,20,.32),10px 30px 50px -14px rgba(40,30,20,.22),1px 3px 6px rgba(40,30,20,.16)}
.ll-frame::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.16),inset 2px 3px 6px rgba(0,0,0,.16);pointer-events:none}
.ll-frame{max-width:100%}
.ll-frame img{display:block;width:auto;height:auto;max-width:100%;max-height:64vh}
.ll-simule{color:var(--ll-muted);font-size:11px}

/* ---------- Cartel court ---------- */
.ll-cartel-line{color:var(--ll-muted)}
.ll-cartel-line em{font-family:var(--ll-display);font-size:15px;color:var(--ll-ink)}

/* ---------- Notes (texte court à puces, en bas à droite) ---------- */
.ll-notes{list-style:none;margin:0 0 0 auto;padding:0;max-width:340px;display:grid;gap:12px}
.ll-notes li{position:relative;padding-left:14px}
.ll-notes li::before{content:"•";position:absolute;left:0}
.ll-notes p{margin:0}

/* ---------- Planche d'ouverture : une grande œuvre, titre, notes ---------- */
.ll-spread{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:stretch}
.ll-spread .ll-wall{aspect-ratio:auto;min-height:min(78vh,820px);height:100%;padding:12% 16%}
.ll-spread__text{display:flex;flex-direction:column;justify-content:space-between;gap:48px}
.ll-spread__title{font-size:clamp(44px,5.4vw,84px);letter-spacing:-.005em}
.ll-spread__sub{display:block;margin-top:.5em;font-size:.42em;font-style:italic;letter-spacing:.01em}

/* ---------- Démarche (planche de texte) ---------- */
.ll-statement{max-width:560px;margin-left:auto;font-family:var(--ll-display);font-size:clamp(19px,1.6vw,23px);line-height:1.4}
.ll-statement p{margin:0 0 1em}
.ll-statement .ll-link{font-family:var(--ll-text);font-size:12.5px}

/* ---------- Planche à deux images + notes ---------- */
.ll-duo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ll-gap);align-items:end}
.ll-duo figure{margin:0;display:grid;gap:10px}
.ll-duo .ll-wall{padding:16% 17%}
.ll-duo .ll-photo{width:100%;aspect-ratio:4/5;object-fit:cover}

/* ---------- Index des œuvres ---------- */
.ll-index-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px 24px;padding-bottom:clamp(28px,4vw,56px)}
.ll-index-head h1{font-size:clamp(44px,5.4vw,84px)}
.ll-index-head__text{max-width:420px;color:var(--ll-muted);margin-top:16px}
.ll-filter{display:flex;flex-wrap:wrap;gap:6px 22px;color:var(--ll-muted)}
.ll-filter a[aria-current]{color:var(--ll-ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.ll-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.6vw,56px) var(--ll-gap)}
.ll-item{display:grid;gap:12px}
.ll-cap{display:grid;gap:2px}
.ll-cap__t{font-family:var(--ll-display);font-style:italic;font-size:17px;line-height:1.2}
.ll-cap__l{color:var(--ll-muted)}
.ll-group + .ll-group{margin-top:clamp(56px,7vw,112px)}
.ll-group__title{font-size:clamp(28px,3vw,44px);padding-bottom:clamp(20px,3vw,40px);border-bottom:1px solid var(--ll-line);margin-bottom:clamp(24px,3vw,40px)}
.ll-empty{color:var(--ll-muted);padding-bottom:64px}

/* ---------- Une œuvre ---------- */
.ll-single{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:stretch}
.ll-single .ll-wall{aspect-ratio:auto;min-height:min(80vh,860px);height:100%;padding:12% 14%}
.ll-single__text{display:flex;flex-direction:column;justify-content:space-between;gap:48px}
.ll-single__title{font-size:clamp(40px,4.6vw,72px);font-style:italic}
.ll-single__line{color:var(--ll-muted);margin-top:16px}
.ll-single__status{color:var(--ll-accent)}
.ll-single__actions{display:flex;flex-wrap:wrap;gap:8px 22px}
.ll-single__nav{display:flex;justify-content:space-between;gap:16px;padding-top:clamp(28px,4vw,56px);color:var(--ll-muted)}

/* ---------- Page Artiste : mise en page éditoriale ---------- */
.ll-about{display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(48px,7vw,96px);padding-bottom:clamp(24px,4vw,64px)}
.ll-about__title{font-size:clamp(56px,8vw,112px);font-weight:400;letter-spacing:.02em;text-transform:uppercase}
.ll-about__lead{max-width:300px;margin:0;font-family:var(--ll-display);font-size:19px;line-height:1.35;letter-spacing:.02em}
.ll-about__cols{max-width:620px;columns:2;column-gap:48px;text-align:justify;hyphens:auto;font-family:var(--ll-display);font-size:18px;line-height:1.3;letter-spacing:.03em}
.ll-about__cols p{margin:0 0 .9em;break-inside:avoid-column}
.ll-about__cols em,.ll-about__lead em,.ll-about__closing em{font-style:italic;letter-spacing:0}
.ll-about__photo{margin:0;width:130px}
.ll-about__photo img{width:100%;height:auto}
.ll-about__closing{max-width:360px;font-family:var(--ll-display);font-size:18px;line-height:1.35;letter-spacing:.02em}
.ll-about__closing p{margin:0 0 1.4em}
.ll-about__closing-title{letter-spacing:.06em}

/* ---------- Pages simples ---------- */
.ll-title{padding-bottom:clamp(28px,4vw,56px)}
.ll-title h1{font-size:clamp(44px,5.4vw,84px)}
.ll-title p{max-width:420px;margin-top:16px;color:var(--ll-muted)}
.ll-content{max-width:620px;font-size:14px;line-height:1.7;padding-bottom:clamp(24px,4vw,64px)}
.ll-content h2{font-size:32px;margin:48px 0 16px}
.ll-content em{font-family:var(--ll-display);font-size:1.15em}
.ll-content a{text-decoration:underline;text-underline-offset:4px}
.ll-content--shop{max-width:none}
.ll-page-photo{max-width:520px;margin-bottom:56px}

/* ---------- Pied ---------- */
.ll-foot{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:16px;color:var(--ll-muted);padding-top:clamp(56px,7vw,112px)}
.ll-foot__links{display:flex;flex-wrap:wrap;gap:6px 22px}
.ll-foot__last{text-align:right}

/* ---------- WooCommerce (base) ---------- */
.woocommerce ul.products li.product img{object-fit:contain;background:var(--ll-wall)}
.woocommerce a.button,.woocommerce button.button{background:var(--ll-ink);color:var(--ll-sheet);border-radius:0;font-family:var(--ll-text);font-weight:400;letter-spacing:.04em;font-size:12px}

/* ---------- Téléphone et tablette ---------- */
@media (max-width:900px){
  .ll-bar,.ll-foot{grid-template-columns:1fr auto}
  .ll-bar nav{grid-column:1/-1;order:3}
  .ll-bar__meta{display:none}
  .ll-foot__last{text-align:left}
  .ll-spread,.ll-duo,.ll-single{grid-template-columns:1fr}
  .ll-spread .ll-wall,.ll-single .ll-wall{min-height:0;aspect-ratio:4/5}
  .ll-notes{margin-left:0}
  .ll-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){.ll-about__cols{columns:1}}
@media (max-width:540px){.ll-grid{grid-template-columns:1fr}.ll-sheet{padding:12px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
