.category-hero--interior{aspect-ratio:1688/646;justify-content:flex-end}
.category-hero--interior:after{background:#0006}
.illustrated-intro{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(480px,44vw,770px);display:flex;align-items:center;padding:5% 3%}
.illustrated-intro-copy{width:46%;max-width:650px;text-align:center;position:relative;z-index:1}
.illustrated-intro h2{font-size:clamp(28px,2.8vw,48px);line-height:1.25;max-width:580px;margin:auto}
.illustrated-intro p{font-size:clamp(14px,1.07vw,18px);line-height:1.7;margin:30px auto;max-width:608px}
.illustrated-intro-emblem{height:65px;width:65px;object-fit:contain;margin:28px auto 38px}
.illustrated-intro-image{position:absolute;z-index:0;width:98%;max-width:none;height:auto;left:36%;top:50%;transform:translateY(-50%);mix-blend-mode:multiply;pointer-events:none}
.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:0 1.2%}
.category-card{aspect-ratio:408/850;display:flex;align-items:flex-end;justify-content:center;text-align:center;border-radius:20px;padding:30px 10px;scroll-margin-top:20px}
.category-card:after{background:linear-gradient(transparent 50%,#0008)}
.category-card h2{font-size:clamp(15px,1.85vw,32px);letter-spacing:.07em;line-height:1.35;margin:0}
.category-card--agencement .photo-bg{object-position:43% center}
.category-card--luminaire .photo-bg{object-position:56% center}

@media(max-width:900px){.illustrated-intro-copy{width:52%}.illustrated-intro-image{left:42%}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.category-card{aspect-ratio:3/4}.category-card h2{font-size:22px}}
@media(max-width:700px){.category-hero--interior{aspect-ratio:auto}.illustrated-intro{display:flex;flex-direction:column;padding:52px 16px 22px;min-height:0}.illustrated-intro-copy{width:100%;max-width:550px}.illustrated-intro h2{font-size:30px}.illustrated-intro p{font-size:16px}.illustrated-intro-emblem{height:54px;margin:25px auto 30px}.illustrated-intro-image{position:relative;left:auto;top:auto;transform:none;width:145%;max-width:none;margin:20px -22.5% -10px}.category-grid{margin:0}.category-card{padding:22px 8px;min-height:250px}.category-card h2{font-size:clamp(13px,3.4vw,22px);letter-spacing:.04em}}

/* Center the visible sketch, accounting for the transparent space in its source. */
@media(max-width:1024px){
 .illustrated-intro{flex-direction:column;min-height:0;padding:52px 16px 22px}
 .illustrated-intro-copy{width:100%;max-width:650px}
 .illustrated-intro-image{position:relative;left:auto;top:auto;width:145%;max-width:none;margin:20px 0 -10px;transform:translateX(16.3%)}
}

/* Shared left alignment for the Interior and Exterior introduction copy. */
.illustrated-intro .illustrated-intro-copy{text-align:left}
.illustrated-intro .illustrated-intro-copy h2,
.illustrated-intro .illustrated-intro-copy p{margin-left:0;margin-right:0}
.illustrated-intro .illustrated-intro-emblem{margin-left:0;margin-right:0}

@media(max-width:700px){
 .category-card{min-width:0;width:100%;aspect-ratio:auto;min-height:250px}
 .category-card h2{overflow-wrap:anywhere}
}
