/* Page « Lettres lumineuses » : sous-page d'Enseigne lumineuse. S'appuie sur el.css (nuit noire, lumière dorée, angles droits). */
.ll img{display:block;max-width:100%;height:auto}
.ll section{scroll-margin-top:80px}

/* Ouverture : texte à gauche, photo entière à droite (jamais recadrée) */
.ll-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,46%);min-height:min(100svh,980px);background:var(--ink)}
.ll-hero-txt{display:flex;flex-direction:column;justify-content:flex-end;padding:140px 56px clamp(56px,8vw,110px) max(40px,calc((100vw - 1320px)/2 + 40px))}
.ll-hero h1{margin:22px 0 0;font-family:var(--title);font-weight:200;font-size:clamp(44px,6.2vw,96px);line-height:.98;letter-spacing:-.03em;text-transform:uppercase}
.ll-hero h1 em{font-style:normal;display:block;color:var(--glow);text-shadow:0 0 38px rgba(232,196,138,.35)}
.ll-hero p.l{margin:26px 0 0;max-width:500px;color:#D0D0D0;font-size:16px;line-height:1.7}
.ll-hero .crumb a{border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:1px}
.ll-hero-ph{position:relative;margin:0;display:flex;align-items:center;justify-content:center;background:#0A0A0A;overflow:hidden}
.ll-hero-ph picture{display:block;height:100%;width:100%}
.ll-hero-img{width:100%;height:100%!important;object-fit:contain;object-position:center}
.ll-hero-ph figcaption,.ll-ph figcaption,.ll-int figcaption{position:absolute;left:16px;bottom:14px;font-size:11px;letter-spacing:.1em;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.ll-hero-ph figcaption b,.ll-ph figcaption b,.ll-int figcaption b{display:block;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:10.5px}

/* Sélecteur d'éclairage */
.ll-sel{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(24px,4vw,56px);margin-top:52px;align-items:start}
.ll-tabs{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.ll-tab{display:grid;grid-template-columns:34px 1fr;column-gap:8px;text-align:left;padding:20px 0;background:none;border:0;border-bottom:1px solid var(--line);color:#8F8F8F;transition:color .3s}
.ll-tab small{grid-row:span 2;font-family:var(--title);font-weight:300;font-size:13px;color:#6B6B6B;padding-top:3px}
.ll-tab b{font-family:var(--title);font-weight:300;font-size:22px;letter-spacing:.02em;text-transform:uppercase}
.ll-tab span{font-size:12.5px;margin-top:4px}
.ll-tab:hover{color:#D8D8D8}
.ll-tab.on{color:var(--fg)}
.ll-tab.on small{color:var(--glow)}
.ll-tab.on b{color:var(--glow)}
.ll-panel{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:center}
.ll-panel[hidden]{display:none}
.ll-panel.on{animation:llIn .6s cubic-bezier(.2,.7,.2,1) both}
.ll-ph{position:relative;margin:0;background:#111;height:min(640px,72vh);display:flex;align-items:center;justify-content:center}
.ll-ph img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.ll-ptxt h3{margin:0;font-family:var(--title);font-weight:300;font-size:clamp(24px,2.4vw,32px);text-transform:uppercase;letter-spacing:.04em}
.ll-ptxt h3 span{display:block;margin-top:6px;font-family:var(--font);font-size:12px;letter-spacing:.18em;color:var(--glow)}
.ll-ptxt p{margin:18px 0 0;color:#C9C9C9;font-size:15px;line-height:1.8}
.ll-ptxt dl,.ll-modal dl{margin:24px 0 0;display:grid;grid-template-columns:auto 1fr;gap:10px 18px;font-size:13.5px;border-top:1px solid var(--line);padding-top:18px}
.ll-ptxt dt,.ll-modal dt{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.ll-ptxt dd,.ll-modal dd{margin:0;color:#E2E2E2}
@keyframes llIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* Sections claires */
.ll-paper{background:var(--paper);color:var(--ink)}
.ll-paper .micro{color:#7a7a7a}.ll-paper .h2 span,.ll-paper .lead{color:#6b6b6b}

/* Lettre boîtier : coupe */
.ll-anat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,90px);align-items:center}
.ll-parts{list-style:none;margin:36px 0 0;padding:0;border-top:1px solid #E1DFDA}
.ll-parts li{display:grid;grid-template-columns:44px 1fr;gap:10px;padding:18px 0;border-bottom:1px solid #E1DFDA}
.ll-parts i{font-style:normal;display:grid;place-items:center;width:28px;height:28px;border:1px solid #9C7B52;color:#9C7B52;font-size:12px;font-weight:600}
.ll-parts b{display:block;font-size:15px;font-weight:600}
.ll-parts span{display:block;margin-top:4px;font-size:13.5px;color:#666;line-height:1.6}
.ll-cut-w{margin:0;background:#0F0F0F;padding:clamp(18px,3vw,36px)}
.ll-cut{display:block;width:100%;height:auto}
.ll-cut-t{fill:#8F8F8F;font:500 11px var(--font);letter-spacing:.14em;text-transform:uppercase}
.ll-cut-n circle{fill:#0A0A0A;stroke:#E8C48A;stroke-width:1.5}
.ll-cut-n text{fill:#E8C48A;font:600 12px var(--font);text-anchor:middle}
.ll-cut-h{fill:rgba(10,10,10,.75);font:600 10px var(--font);letter-spacing:.24em;text-transform:uppercase}
.ll-cut-w figcaption{margin-top:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8F8F8F}

/* Matières */
.ll-mats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:52px}
.ll-mat{border:1px solid var(--line);background:var(--ink2);padding:0 0 22px}
.ll-sw{aspect-ratio:16/10}
.ll-mat h3{margin:20px 20px 0;font-family:var(--title);font-weight:300;font-size:20px;text-transform:uppercase;letter-spacing:.04em}
.ll-mat p{margin:10px 20px 0;color:#BDBDBD;font-size:13.5px;line-height:1.65}
.ll-mat small{display:block;margin:14px 20px 0;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--glow)}
.ll-more{margin:28px 0 0;color:#BDBDBD;font-size:14px}
.ll-more a,.ll-alt a{color:var(--fg);border-bottom:1px solid var(--glow);padding-bottom:1px}

/* Intérieur */
.ll-int{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:52px;align-items:end}
.ll-int figure{position:relative;margin:0;background:#111}
.ll-int img{width:100%}

/* Galerie */
.ll-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px}
.ll-chip{background:none;border:1px solid var(--line);color:#BDBDBD;padding:10px 16px;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.ll-chip:hover{border-color:rgba(255,255,255,.5);color:var(--fg)}
.ll-chip.on{background:var(--fg);border-color:var(--fg);color:var(--ink)}
.ll-gal{columns:4;column-gap:16px;margin-top:30px}
.ll-g{display:block;width:100%;padding:0;margin:0 0 20px;border:0;background:transparent;cursor:zoom-in;text-align:left;break-inside:avoid;color:var(--fg)}
.ll-g img{width:100%;background:#151515;transition:filter .4s}
.ll-g:hover img{filter:brightness(1.08)}
.ll-g.is-off{display:none}
.ll-cap{display:block;padding-top:10px;font-size:12px;color:var(--muted);line-height:1.4}
.ll-cap b{display:block;color:var(--fg);font-weight:600;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:3px}
.ll-gal-foot{display:flex;justify-content:center;margin-top:12px}
.ll-showmore{background:none}
.ll-showmore[hidden]{display:none}

/* Fenêtre de détail */
.ll-modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;padding:24px}
.ll-modal[hidden]{display:none}
.ll-modal-in{position:relative;width:100%;max-width:1040px;max-height:min(92vh,860px);overflow:auto;background:#111;border:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.ll-modal-img{background:#0A0A0A;display:flex;align-items:center;justify-content:center;min-height:300px}
.ll-modal-img img{max-width:100%;max-height:min(80vh,780px);width:auto;height:auto;object-fit:contain}
.ll-modal-txt{padding:40px 34px;display:flex;flex-direction:column}
.ll-modal h3{margin:12px 0 0;font-family:var(--title);font-weight:300;font-size:28px;text-transform:uppercase;letter-spacing:.03em}
.ll-m-ville{margin:6px 0 0;color:var(--muted);font-size:14px}
.ll-m-nav{display:flex;gap:10px;margin-top:auto;padding-top:28px;flex-wrap:wrap}
.ll-m-prev,.ll-m-next{width:48px;height:48px;background:none;border:1px solid var(--line);color:var(--fg);font-size:16px}
.ll-m-cta{flex:1;justify-content:center}
.ll-m-close{position:absolute;top:10px;right:10px;z-index:2;width:44px;height:44px;background:rgba(10,10,10,.8);border:1px solid var(--line);color:var(--fg);font-size:22px;line-height:1}

/* Prix */
.ll-price{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:46px}
.ll-price div{padding:28px 24px 0 0}
.ll-price small{display:block;font-size:12px;color:var(--muted);line-height:1.6;max-width:240px}
.ll-price b{display:block;margin-top:8px;font-family:var(--title);font-weight:200;font-size:clamp(28px,3.2vw,42px);letter-spacing:-.01em;color:var(--fg)}

/* Méthode */
.ll-steps{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #1A1A1A}
.ll-steps li{padding:26px 24px 0 0}
.ll-steps i{display:block;font-style:normal;font-family:var(--title);font-weight:300;font-size:24px;color:#9C7B52}
.ll-steps b{display:block;margin-top:12px;font-size:15px;font-weight:600}
.ll-steps span{display:block;margin-top:6px;font-size:13.5px;line-height:1.65;color:#666}

/* Guide : 2 colonnes, 4 articles */
.ll-guide{grid-template-columns:repeat(2,minmax(0,1fr))!important}

.ll-alt{margin:34px 0 0;font-size:13px;color:#BDBDBD}

@media(max-width:1100px) and (min-width:761px){
  .ll-gal{columns:3}
  .ll-sel{grid-template-columns:1fr}
  .ll-tabs{flex-direction:row}
  .ll-tab{flex:1;border-bottom:0;border-right:1px solid var(--line);padding:16px 14px}
  .ll-mats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .ll-hero{grid-template-columns:1fr;min-height:0}
  .ll-hero-ph{order:-1;height:auto}
  .ll-hero-img{height:auto!important}
  .ll-hero-txt{position:relative;z-index:2;margin-top:-190px;padding:70px 20px 40px;background:linear-gradient(to bottom,rgba(10,10,10,0) 0,rgba(10,10,10,.72) 70px,var(--ink) 190px)}
  .ll-hero-ph figcaption{display:none}
  .ll-hero h1{margin-top:14px}
  .ll-hero p.l{margin-top:18px}
  .ll-hero .hero-acts{margin-top:24px}
  .ll-hero h1{font-size:clamp(38px,11vw,52px)}
  .ll-hero p.l{font-size:15px}
  .ll-hero-ph figcaption{bottom:12px}
  .ll-sel{grid-template-columns:1fr;margin-top:30px}
  .ll-tabs{flex-direction:row;overflow-x:auto;scrollbar-width:none;margin-right:-20px;border-top:0;border-bottom:1px solid var(--line)}
  .ll-tabs::-webkit-scrollbar{display:none}
  .ll-tab{flex:none;display:block;padding:12px 16px 14px 0;margin-right:6px;border-bottom:2px solid transparent}
  .ll-tab small,.ll-tab span{display:none}
  .ll-tab b{font-size:15px;white-space:nowrap}
  .ll-tab.on{border-bottom-color:var(--glow)}
  .ll-panel{grid-template-columns:1fr;gap:20px}
  .ll-ph{height:auto;max-height:62vh}
  .ll-ph img{max-height:62vh}
  .ll-anat{grid-template-columns:1fr}
  .ll-mats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:32px}
  .ll-mat h3{margin:14px 14px 0;font-size:16px}.ll-mat p{margin:8px 14px 0;font-size:12.5px}.ll-mat small{margin:10px 14px 0}
  .ll-int{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:32px -20px 0;padding:0 20px 6px;scrollbar-width:none}
  .ll-int::-webkit-scrollbar{display:none}
  .ll-int figure{flex:0 0 78%;scroll-snap-align:start}
  .ll-gal{columns:2;column-gap:10px}
  .ll-g{margin-bottom:16px}
  .ll-chips{flex-wrap:nowrap;overflow-x:auto;margin-right:-20px;padding-right:20px;scrollbar-width:none}
  .ll-chips::-webkit-scrollbar{display:none}
  .ll-chip{flex:none}
  .ll-price{grid-template-columns:1fr}.ll-price div{padding-top:20px}
  .ll-steps{grid-template-columns:1fr 1fr}
  .ll-guide{grid-template-columns:1fr!important}
  .ll-modal{padding:0;align-items:stretch}
  .ll-modal-in{grid-template-columns:1fr;max-height:none;height:100%;border:0}
  .ll-modal-img img{max-height:62vh}
  .ll-modal-txt{padding:24px 20px 30px}
}
@media(prefers-reduced-motion:reduce){.ll-panel.on{animation:none}}

/* ---------- Noir et blanc : la DA d'Enseigne lumineuse, avec des sections blanches en alternance ---------- */
.ll-anat .ll-parts{border-top-color:var(--line)}
.ll-anat .ll-parts li{border-bottom-color:var(--line)}
.ll-anat .ll-parts i{border-color:var(--glow);color:var(--glow)}
.ll-anat .ll-parts b{color:var(--fg)}
.ll-anat .ll-parts span{color:#BDBDBD}

.ll-white{--fg:#0A0A0A;--muted:#6B6B6B;--line:#E3E1DC;--glow:#9C7B52;--ink2:#F7F6F3;background:#fff;color:#0A0A0A}
.ll-white .micro{color:#7A7A7A}
.ll-white .h2{color:#0A0A0A}
.ll-white .h2 span,.ll-white .lead{color:#6B6B6B}
.ldn-el .ll-white .btn{background:#0A0A0A;color:#fff!important}
.ldn-el .ll-white .btn-line{border-color:#0A0A0A;color:#0A0A0A!important}
/* Éclairages */
.ll-white .ll-tab{color:#8A8A8A}
.ll-white .ll-tab small{color:#B5B0A8}
.ll-white .ll-tab:hover{color:#0A0A0A}
.ll-white .ll-tab.on{color:#0A0A0A}
.ll-white .ll-tab.on b,.ll-white .ll-tab.on small{color:#9C7B52}
.ll-white .ll-ph{background:#F3F1ED}
.ll-white .ll-ptxt p{color:#5E5E5E}
.ll-white .ll-ptxt dd{color:#0A0A0A}
/* Matières */
.ll-white .ll-mat{background:#F7F6F3;border-color:#E3E1DC}
.ll-white .ll-mat p{color:#5E5E5E}
.ll-white .ll-more{color:#5E5E5E}
.ll-white .ll-more a{color:#0A0A0A;border-bottom-color:#9C7B52}
/* Galerie */
.ll-white .ll-chip{border-color:#DAD7D1;color:#55514B}
.ll-white .ll-chip:hover{border-color:#0A0A0A;color:#0A0A0A}
.ll-white .ll-chip.on{background:#0A0A0A;border-color:#0A0A0A;color:#fff}
.ll-white .ll-g{color:#0A0A0A}
.ll-white .ll-g img{background:#F3F1ED}
.ll-white .ll-cap{color:#6B6B6B}
/* Méthode */
.ll-white .ll-steps{border-top-color:#0A0A0A}
/* FAQ */
.ll-white .faq summary{color:#0A0A0A}
.ll-white .faq p{color:#5E5E5E}
.ll-white .faq p b{color:#0A0A0A}

/* ---------- Typographie identique à Enseigne lumineuse (typo.css) : titres en Gill Sans, minuscules, poids normal ---------- */
body.ldn-el .ll-hero h1{font-family:var(--ldn-gill);font-weight:400;text-transform:none;letter-spacing:.005em;font-style:normal;font-size:clamp(41px,4.3vw,60px);line-height:1.08;max-width:820px}
body.ldn-el .ll-tab b,body.ldn-el .ll-ptxt h3,body.ldn-el .ll-modal h3,body.ldn-el .ll-price b,body.ldn-el .ll-steps i{font-family:var(--ldn-gill);font-weight:400;text-transform:none;letter-spacing:.005em}
body.ldn-el .ll-tab b{font-size:22px}
body.ldn-el .ll-ptxt h3{font-size:clamp(28px,2.7vw,39px);line-height:1.2}
body.ldn-el .ll-modal h3{font-size:30px}
body.ldn-el .ll-price b{font-size:clamp(30px,3.2vw,44px)}
body.ldn-el .ll-mat h3{font-family:'Montserrat','Helvetica Neue',Arial,sans-serif;font-weight:500;font-size:12.5px;letter-spacing:.2em;text-transform:uppercase}
@media(max-width:820px){
  body.ldn-el .ll-hero h1{font-size:34px}
  body.ldn-el .ll-tab b{font-size:16px}
  body.ldn-el .ll-ptxt h3{font-size:24.5px}
}
body.ldn-el .ll-ptxt h3 span{display:block;margin-top:10px;font-family:'Montserrat','Helvetica Neue',Arial,sans-serif;font-weight:500;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--glow)}
.ll-mats{max-width:1000px}
@media(max-width:760px){.ll-mats .ll-mat:last-child{grid-column:1/-1}.ll-mats .ll-mat:last-child .ll-sw{aspect-ratio:16/6}}

/* ---------- Ouverture plein écran : exactement celle d'Enseigne lumineuse (el.css), photo Dream ---------- */
.ll .hero-img img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 50%}