:root {
  --red: #d52128;
  --ink: #111;
  --paper: #f5f2ea;
  --line: #ddd6ca;
  --muted: #6e6960;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; color: var(--ink); background: var(--paper); }
img { display: block; max-width: 100%; }
a { color: inherit; }
.eyebrow { margin: 0 0 12px; color: var(--red); font-size: .75rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.lead, p { color: var(--muted); line-height: 1.65; }
.hub main { padding: clamp(44px, 8vw, 110px) clamp(18px, 5vw, 76px); }
.hub h1 { max-width: 980px; margin: 0; font-size: clamp(3rem, 8vw, 7rem); line-height: .9; letter-spacing: 0; }
.hub .lead { max-width: 720px; }
.hub-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 42px; }
.hub-grid a { min-height: 230px; padding: 22px; background: white; border: 1px solid var(--line); border-radius: 8px; text-decoration: none; }
.hub-grid span, .hub-grid strong, .hub-grid em { display: block; }
.hub-grid span { color: var(--red); font-weight: 900; }
.hub-grid strong { margin-top: 50px; font-size: 1.45rem; line-height: 1; }
.hub-grid em { margin-top: 10px; color: var(--muted); font-style: normal; }

.nav { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 74px; padding: 15px clamp(18px, 5vw, 72px); }
.brand { font-weight: 900; text-decoration: none; }
.nav nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 18px; font-size: .9rem; }
.nav nav a { text-decoration: none; }
.button { display: inline-block; margin-top: 20px; padding: 13px 17px; border-radius: 4px; font-weight: 900; text-decoration: none; }
.hero, .applications, .resources, .samples, .families, .proof, .resource-hero, .video-library, .catalog-viewer, .product-hero, .product-lines, .prefix-toolbar, .prefix-groups, .gallery-hero, .gallery-grid-page, .product-intro, .intro-resource, .company-hero, .company-info { padding: clamp(54px, 8vw, 108px) clamp(18px, 5vw, 72px); }
.hero h1, h2 { margin: 0; letter-spacing: 0; }
.hero p { max-width: 620px; }
.section-head { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(380px, 1.2fr); gap: 28px; align-items: end; margin-bottom: 28px; }
.section-head h2, .applications h2, .resources h2, .samples h2, .resource-hero h1, .product-hero h1, .gallery-hero h1, .product-intro h2, .intro-resource h2, .company-hero h1, .company-card h2 { font-size: clamp(2.2rem, 5vw, 5.2rem); line-height: .95; }
.cards { display: grid; gap: 12px; }
.cards.four { grid-template-columns: repeat(4, 1fr); }
.cards.three { grid-template-columns: repeat(3, 1fr); }
.cards article { min-height: 170px; padding: 24px; border-radius: 8px; border: 1px solid var(--line); background: white; }
.cards strong, .cards span { display: block; }
.cards strong { font-size: 1.25rem; }
.cards span { margin-top: 8px; color: var(--muted); }
.applications { display: grid; grid-template-columns: minmax(380px, 1.05fr) minmax(320px, .95fr); gap: clamp(24px, 5vw, 72px); align-items: center; }
.applications img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.image-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.image-row img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.samples { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.samples h2 { max-width: 840px; }

.modernistic { color: white; background: #060708; }
.modernistic .nav { position: sticky; top: 0; z-index: 5; background: rgba(6,7,8,.82); border-bottom: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(18px); }
.modernistic .hero { display: grid; grid-template-columns: .86fr 1.14fr; min-height: 850px; padding: 0; }
.modernistic .hero-copy { align-self: end; padding: clamp(42px, 7vw, 96px); }
.modernistic .hero h1 { font-size: clamp(3.4rem, 8vw, 8.4rem); line-height: .82; text-transform: uppercase; }
.modernistic .hero img { width: 100%; height: 850px; object-fit: cover; clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%); }
.modernistic p, .modernistic .cards span { color: #aeb7b7; }
.modernistic .button { color: #050606; background: #6ad4d0; }
.modernistic .cards article { color: white; background: #111315; border-color: rgba(255,255,255,.16); }
.modernistic .applications, .modernistic .resources, .modernistic .samples { background: #101213; border-top: 1px solid rgba(255,255,255,.12); }

.artistic { color: #18140f; background: #f5efe4; }
.artistic .brand, .artistic h1, .artistic h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; }
.artistic .brand { font-size: 1.8rem; font-style: italic; }
.artistic .hero { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(28px, 5vw, 72px); min-height: 820px; }
.artistic .hero-copy { align-self: end; padding-bottom: 60px; }
.artistic .hero h1 { font-size: clamp(4rem, 10vw, 9.2rem); line-height: .86; }
.artistic .collage { position: relative; min-height: 680px; }
.artistic .collage img { position: absolute; object-fit: cover; border: 10px solid #fffaf0; box-shadow: 0 28px 80px rgba(24,20,15,.2); }
.artistic .c1 { top: 0; right: 0; width: 72%; height: 42%; }
.artistic .c2 { left: 0; top: 145px; width: 34%; height: 62%; }
.artistic .c3 { left: 32%; top: 48%; width: 38%; height: 34%; }
.artistic .c4 { right: 8%; bottom: 20px; width: 32%; height: 26%; }
.artistic .button { color: #18140f; background: #fffaf0; border: 1px solid #18140f; }
.artistic .cards article { background: #fffaf0; border-color: #d8c9b7; }
.artistic .applications { background: #2d5569; color: #fffaf0; }
.artistic .applications p { color: #e5dcca; }
.artistic .proof { background: #fffaf0; }
.artistic .samples { background: #c77d44; }

.traditional { color: #34241a; background: #fbefd8; font-family: Georgia, "Times New Roman", serif; }
.traditional .nav { display: grid; justify-items: center; gap: 10px; background: #fff8eb; border-bottom: 4px double #d7bea0; }
.traditional .brand { color: #b0382f; font-family: Georgia, serif; font-size: clamp(2.2rem, 5vw, 4.5rem); font-weight: 600; }
.traditional .nav nav { font-family: Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.traditional .hero { display: grid; grid-template-columns: .86fr 1.14fr; gap: 36px; align-items: center; }
.traditional .hero h1 { font-size: clamp(2.7rem, 6vw, 5.8rem); line-height: 1; font-weight: 500; }
.traditional .hero img, .traditional .applications img, .traditional .image-row img { border: 10px solid #fff8eb; outline: 1px solid #d7bea0; }
.traditional .button { color: #fff8eb; background: #7b3f28; }
.traditional .cards article { background: #fff8eb; border-color: #d7bea0; border-top: 6px solid #7b3f28; }
.traditional .applications, .traditional .proof { background: #eee0c8; }
.traditional .samples { color: #fff8eb; background: #536553; }

.luxury { color: #f7efe2; background: #14110e; }
.luxury .nav { position: absolute; z-index: 4; inset: 0 0 auto; border-bottom: 1px solid rgba(247,239,226,.18); }
.luxury .hero { position: relative; min-height: 880px; padding: 0; }
.luxury .hero > img { width: 100%; height: 880px; object-fit: cover; opacity: .48; }
.luxury .hero-copy { position: absolute; left: clamp(22px, 6vw, 86px); bottom: clamp(48px, 8vw, 110px); max-width: 900px; }
.luxury .hero h1 { font-family: Georgia, serif; font-size: clamp(3.4rem, 8vw, 8rem); line-height: .9; font-weight: 500; }
.luxury p, .luxury .cards span { color: #c9bca6; }
.luxury .button { color: #14110e; background: #c7a365; }
.luxury .cards article { color: #f7efe2; background: #211c17; border-color: rgba(247,239,226,.18); }
.luxury .applications, .luxury .resources { background: #211c17; }
.luxury .image-row img { filter: saturate(.82) contrast(1.05); }
.luxury .samples { background: #33271d; }
.product-intro { display: grid; grid-template-columns: minmax(320px, .86fr) minmax(420px, 1.14fr); gap: clamp(24px, 5vw, 72px); align-items: start; background: #211c17; border-top: 1px solid rgba(247,239,226,.12); }
.product-intro-feature { grid-template-columns: minmax(320px, .62fr) minmax(520px, 1.38fr); align-items: center; background: radial-gradient(circle at 75% 18%, rgba(199,163,101,.16), transparent 38%), #17130f; }
.product-intro.compact { background: #14110e; }
.product-intro h2 { font-family: Georgia, serif; font-weight: 500; margin: 0; letter-spacing: 0; }
.product-intro-feature .intro-copy { align-self: center; }
.intro-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 30px; overflow: hidden; border: 1px solid rgba(247,239,226,.16); border-radius: 8px; background: rgba(247,239,226,.16); }
.intro-stats span { display: grid; gap: 4px; padding: 18px; color: #c9bca6; background: #211c17; font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; }
.intro-stats strong { color: #c7a365; font-family: Georgia, serif; font-size: 1.45rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.product-structure-visual { margin: 0; overflow: hidden; background: #0f0d0a; border: 1px solid rgba(247,239,226,.18); border-radius: 8px; box-shadow: 0 32px 90px rgba(0,0,0,.34); }
.product-structure-visual img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.product-structure-visual figcaption { padding: 12px 14px; color: #c9bca6; font-size: .86rem; border-top: 1px solid rgba(247,239,226,.12); }
.product-intro-feature .intro-panel { grid-column: 1 / -1; grid-template-columns: repeat(4, 1fr); margin-top: 8px; }
.intro-panel { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.intro-panel article { min-height: 150px; padding: 22px; background: rgba(33,28,23,.82); border: 1px solid rgba(247,239,226,.16); border-radius: 8px; }
.intro-panel strong, .intro-panel span { display: block; }
.intro-panel strong { color: #f7efe2; font-size: 1.15rem; }
.intro-panel span { margin-top: 8px; color: #c9bca6; line-height: 1.55; }
.resources-page .nav { position: sticky; background: rgba(20,17,14,.88); backdrop-filter: blur(18px); }
.resources-page .resource-hero { min-height: 560px; display: grid; align-content: end; background: linear-gradient(rgba(20,17,14,.52), rgba(20,17,14,.92)), url("../gallery-photos/KakaoTalk_20260116_131038421.jpg") center/cover; }
.resources-page .resource-hero h1 { max-width: 980px; margin: 0; font-family: Georgia, serif; font-weight: 500; letter-spacing: 0; }
.resources-page .resource-hero p { max-width: 720px; }
.video-library { background: #211c17; }
.video-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.video-grid article { padding: 14px; background: #14110e; border: 1px solid rgba(247,239,226,.18); border-radius: 8px; }
.video-grid video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #080706; border-radius: 6px; }
.video-grid strong, .video-grid span { display: block; }
.video-grid strong { margin-top: 14px; color: #f7efe2; font-size: 1.12rem; }
.video-grid span { margin-top: 4px; color: #c9bca6; }
.catalog-viewer { background: #14110e; }
.pdf-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.button.ghost { color: #f7efe2; background: transparent; border: 1px solid rgba(247,239,226,.32); }
.pdf-frame { display: block; width: 100%; height: min(82vh, 900px); min-height: 620px; background: #211c17; border: 1px solid rgba(247,239,226,.18); border-radius: 8px; }
.intro-resource { display: grid; grid-template-columns: minmax(320px, .86fr) minmax(280px, .4fr); gap: 24px; align-items: end; background: #14110e; border-top: 1px solid rgba(247,239,226,.12); }
.intro-resource h2 { margin: 0; font-family: Georgia, serif; font-weight: 500; letter-spacing: 0; }
.intro-resource-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.intro-resource .intro-frame { grid-column: 1 / -1; height: min(72vh, 760px); }
.product-page .nav { position: sticky; background: rgba(20,17,14,.88); backdrop-filter: blur(18px); }
.product-hero { min-height: 520px; display: grid; align-content: end; background: linear-gradient(rgba(20,17,14,.32), rgba(20,17,14,.94)), url("../images/APZ05.jpeg") center/cover; }
.product-hero h1 { max-width: 980px; margin: 0; font-family: Georgia, serif; font-weight: 500; letter-spacing: 0; }
.product-hero p { max-width: 760px; }
.main-product-search { width: min(760px, 100%); margin-top: 30px; }
.main-product-search label { display: block; margin-bottom: 10px; color: #c7a365; font-size: .78rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.main-product-search div { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.main-product-search input { min-width: 0; padding: 15px 16px; color: #f7efe2; background: rgba(20,17,14,.86); border: 1px solid rgba(247,239,226,.28); border-radius: 6px; font: inherit; }
.main-product-search button { padding: 15px 18px; color: #14110e; background: #c7a365; border: 0; border-radius: 6px; font: inherit; font-weight: 900; cursor: pointer; }
.main-product-search p { margin: 10px 0 0; color: #c9bca6; font-size: .9rem; }
.product-lines { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; background: #14110e; }
.line-card { display: grid; min-height: 560px; color: #f7efe2; background: #211c17; border: 1px solid rgba(247,239,226,.18); border-radius: 8px; overflow: hidden; text-decoration: none; }
.line-card.is-hidden { display: none; }
.line-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(.85) contrast(1.05); }
.line-card span, .line-card strong, .line-card p, .line-card em { margin-left: 22px; margin-right: 22px; }
.line-card span { margin-top: 20px; color: #c7a365; font-size: .78rem; font-weight: 900; letter-spacing: .12em; }
.line-card strong { margin-top: 8px; font-family: Georgia, serif; font-size: 2rem; font-weight: 500; }
.line-card p { margin-top: 8px; }
.line-card em { margin-top: 4px; margin-bottom: 22px; color: #c9bca6; font-style: normal; font-size: .88rem; line-height: 1.5; }
.prefix-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; background: #211c17; border-top: 1px solid rgba(247,239,226,.14); border-bottom: 1px solid rgba(247,239,226,.14); }
.prefix-toolbar a { color: #c7a365; font-weight: 900; text-decoration: none; }
.prefix-toolbar input { width: min(520px, 100%); padding: 14px 16px; color: #f7efe2; background: #14110e; border: 1px solid rgba(247,239,226,.28); border-radius: 6px; font: inherit; }
.prefix-groups { display: grid; gap: 52px; background: #14110e; }
.prefix-section { scroll-margin-top: 110px; }
.prefix-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; border-bottom: 1px solid rgba(247,239,226,.16); padding-bottom: 14px; }
.prefix-head h2 { font-family: Georgia, serif; font-size: clamp(2.4rem, 6vw, 5.6rem); font-weight: 500; }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.product-card { overflow: hidden; background: #211c17; border: 1px solid rgba(247,239,226,.16); border-radius: 8px; }
.product-card img { width: 100%; aspect-ratio: 1 / 1.18; object-fit: cover; background: #0c0a08; transition: transform .25s ease; }
.product-card:hover img { transform: scale(1.04); }
.product-card strong, .product-card span { display: block; padding-left: 14px; padding-right: 14px; }
.product-card strong { padding-top: 14px; color: #f7efe2; }
.product-card span { padding-bottom: 16px; color: #c9bca6; font-size: .82rem; }
.product-card em { display: inline-block; margin: 0 14px 16px; padding: 5px 8px; color: #14110e; background: #c7a365; border-radius: 999px; font-size: .72rem; font-style: normal; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.product-image-button { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.no-results { color: #c9bca6; }
body.lightbox-open { overflow: hidden; }
.product-lightbox { position: fixed; inset: 0; z-index: 100; display: none; place-items: center; padding: clamp(18px, 4vw, 48px); background: rgba(10,8,6,.92); backdrop-filter: blur(16px); }
.product-lightbox.is-open { display: grid; }
.lightbox-stage { width: min(1320px, 100%); max-height: 92vh; display: grid; grid-template-columns: 150px minmax(0, 1fr) 190px; gap: 18px; align-items: center; }
.product-lightbox figure { margin: 0; max-height: 92vh; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 14px; }
.product-lightbox figure.from-right { animation: lightboxSlideFromRight .26s ease both; }
.product-lightbox figure.from-left { animation: lightboxSlideFromLeft .26s ease both; }
.product-lightbox figure > img { justify-self: center; max-width: 100%; max-height: calc(92vh - 90px); object-fit: contain; background: #0c0a08; border: 1px solid rgba(247,239,226,.18); border-radius: 8px; }
.product-lightbox figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; color: #f7efe2; }
.product-lightbox figcaption span, .product-lightbox figcaption strong, .product-lightbox figcaption em, .product-lightbox figcaption small { display: block; }
.product-lightbox figcaption strong { font-size: 1.25rem; }
.product-lightbox figcaption em, .product-lightbox figcaption small { color: #c9bca6; font-style: normal; }
.lightbox-nav { position: absolute; top: 50%; display: none; transform: translateY(-50%); padding: 13px 15px; color: #14110e; background: #c7a365; border: 0; border-radius: 4px; font: inherit; font-weight: 900; cursor: pointer; }
.product-lightbox.has-multiple .lightbox-nav { display: none; }
.lightbox-prev { left: 18px; }
.lightbox-next { right: 18px; }
.lightbox-side { display: grid; gap: 12px; max-height: calc(92vh - 44px); overflow: auto; }
.lightbox-left { opacity: 0; pointer-events: none; }
.product-lightbox.showing-example .lightbox-left { opacity: 1; pointer-events: auto; }
.product-lightbox.showing-example .lightbox-right { opacity: 0; pointer-events: none; }
.lightbox-thumb { display: grid; gap: 8px; padding: 8px; color: #f7efe2; background: #211c17; border: 1px solid rgba(247,239,226,.22); border-radius: 8px; cursor: pointer; text-align: left; }
.lightbox-thumb img { width: 100%; aspect-ratio: 1 / 1.18; object-fit: cover; border-radius: 5px; }
.lightbox-thumb span { color: #c9bca6; font-size: .76rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
@keyframes lightboxSlideFromRight {
  from { opacity: .2; transform: translateX(44px) scale(.985); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes lightboxSlideFromLeft {
  from { opacity: .2; transform: translateX(-44px) scale(.985); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}
.gallery-page .nav { position: sticky; background: rgba(20,17,14,.88); backdrop-filter: blur(18px); }
.gallery-hero { min-height: 520px; display: grid; align-content: end; background: linear-gradient(rgba(20,17,14,.34), rgba(20,17,14,.94)), url("../gallery-photos/KakaoTalk_20260116_131038421.jpg") center/cover; }
.gallery-hero h1 { max-width: 980px; margin: 0; font-family: Georgia, serif; font-weight: 500; letter-spacing: 0; }
.gallery-hero p { max-width: 760px; }
.gallery-grid-page { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-flow: dense; gap: 14px; background: #14110e; }
.gallery-item { position: relative; min-height: 310px; padding: 0; overflow: hidden; color: #f7efe2; background: #211c17; border: 1px solid rgba(247,239,226,.16); border-radius: 8px; cursor: zoom-in; }
.gallery-item.wide { grid-column: span 2; }
.gallery-item.tall { grid-row: span 2; min-height: 640px; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.86) contrast(1.04); transition: transform .28s ease; }
.gallery-item:hover img { transform: scale(1.04); }
.gallery-item span { position: absolute; left: 14px; bottom: 14px; padding: 8px 10px; color: #14110e; background: #c7a365; border-radius: 4px; font-size: .78rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.gallery-lightbox { position: fixed; inset: 0; z-index: 100; display: none; place-items: center; padding: clamp(18px, 4vw, 48px); background: rgba(10,8,6,.92); backdrop-filter: blur(16px); }
.gallery-lightbox.is-open { display: grid; }
.gallery-lightbox figure { margin: 0; width: min(1200px, 100%); display: grid; gap: 14px; }
.gallery-lightbox img { justify-self: center; max-width: 100%; max-height: calc(92vh - 70px); object-fit: contain; border: 1px solid rgba(247,239,226,.18); border-radius: 8px; }
.gallery-lightbox figcaption { color: #f7efe2; font-weight: 900; }
.company-page .nav { position: sticky; background: rgba(20,17,14,.88); backdrop-filter: blur(18px); }
.company-hero { min-height: 500px; display: grid; align-content: end; background: linear-gradient(rgba(20,17,14,.42), rgba(20,17,14,.94)), url("../gallery-photos/KakaoTalk_20260116_131038421.jpg") center/cover; }
.company-hero h1 { max-width: 980px; margin: 0; font-family: Georgia, serif; font-weight: 500; letter-spacing: 0; }
.company-hero p { max-width: 720px; }
.company-info { display: grid; grid-template-columns: minmax(320px, .72fr) minmax(420px, 1.28fr); gap: clamp(24px, 5vw, 72px); background: #14110e; }
.company-card { padding: clamp(24px, 4vw, 44px); background: #211c17; border: 1px solid rgba(247,239,226,.16); border-radius: 8px; }
.company-card h2 { margin: 0; font-family: Georgia, serif; font-weight: 500; letter-spacing: 0; }
.company-card dl { display: grid; gap: 18px; margin: 30px 0 0; }
.company-card dl div { padding-top: 18px; border-top: 1px solid rgba(247,239,226,.14); }
.company-card dt { color: #c7a365; font-size: .76rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.company-card dd { margin: 6px 0 0; color: #f7efe2; line-height: 1.5; }
.company-card a { color: #f7efe2; text-decoration-color: rgba(199,163,101,.7); text-underline-offset: 4px; }
.map-card { overflow: hidden; min-height: 620px; background: #211c17; border: 1px solid rgba(247,239,226,.16); border-radius: 8px; }
.map-card iframe { width: 100%; height: 100%; min-height: 620px; border: 0; filter: grayscale(.15) contrast(.95) brightness(.92); }

.catalog { color: #1d2324; background: #edf1f2; }
.catalog .nav { background: white; border-bottom: 1px solid #d3dadc; }
.catalog .hero { display: grid; grid-template-columns: minmax(320px, .8fr) minmax(420px, 1.2fr); gap: 28px; align-items: center; }
.catalog .hero h1 { font-size: clamp(2.8rem, 6vw, 6rem); line-height: .94; }
.catalog .finder { padding: 18px; background: white; border: 1px solid #d3dadc; border-radius: 8px; }
.catalog .search { padding: 16px; color: white; background: #1d2324; border-radius: 6px; font-weight: 900; }
.catalog .mini-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 12px; }
.catalog .mini-grid img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 6px; }
.catalog .button { color: white; background: #1d2324; }
.catalog .cards article { border-color: #d3dadc; }
.catalog .applications, .catalog .resources { background: white; border-top: 1px solid #d3dadc; }
.catalog .image-row img { border-radius: 6px; }

@media (max-width: 940px) {
  .hub-grid, .cards.four, .cards.three, .hero, .modernistic .hero, .artistic .hero, .traditional .hero, .catalog .hero, .applications, .section-head, .image-row {
    grid-template-columns: 1fr;
  }
  .nav, .samples { align-items: flex-start; flex-direction: column; }
  .modernistic .hero img, .luxury .hero > img { height: 520px; clip-path: none; }
  .artistic .collage { min-height: 620px; }
  .video-grid { grid-template-columns: 1fr; }
  .pdf-frame { min-height: 520px; }
  .product-intro, .intro-resource { grid-template-columns: 1fr; }
  .intro-panel { grid-template-columns: 1fr; }
  .intro-resource-actions { justify-content: flex-start; }
  .product-lines, .product-grid { grid-template-columns: repeat(2, 1fr); }
  .gallery-grid-page { grid-template-columns: repeat(2, 1fr); }
  .gallery-item.wide, .gallery-item.tall { grid-column: auto; grid-row: auto; min-height: 320px; }
  .company-info { grid-template-columns: 1fr; }
  .prefix-toolbar { align-items: flex-start; flex-direction: column; }
  .main-product-search div { grid-template-columns: 1fr; }
  .lightbox-stage { grid-template-columns: 1fr; align-items: stretch; }
  .lightbox-side { grid-auto-flow: column; grid-auto-columns: 120px; overflow-x: auto; overflow-y: hidden; order: 2; }
  .lightbox-left, .product-lightbox.showing-example .lightbox-left, .product-lightbox.showing-example .lightbox-right { opacity: 1; pointer-events: auto; }
  .product-lightbox figure { order: 1; }
}

@media (max-width: 620px) {
  .product-lines, .product-grid { grid-template-columns: 1fr; }
  .gallery-grid-page { grid-template-columns: 1fr; }
}