/* iLux — Figma 326:505. Desktop composition, fluid sections on mobile. */
.theme-ilux { background: #1b1d24; color: #fff; }
.theme-ilux .site-header { position: absolute; height: 80px; background: transparent; box-shadow: none; pointer-events: none; }
.theme-ilux .site-header .brand { top: 33.39px; left: 2.833333%; pointer-events: auto; }
.theme-ilux .site-header .brand img { filter: none; }
.ilux-page { overflow: hidden; font-family: var(--poppins); color: #fff; }
.ilux-page :is(h1,h2,h3,p,ul) { margin: 0; }
.ilux-page strong { font-weight: 500; }
.ilux-hero { position: relative; height: 61.144vw; overflow: hidden; }
.ilux-hero-photo { position: absolute; width: 101.06%; max-width: none; height: auto; left: -.294%; top: -17.77%; }
.ilux-hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to bottom, #1b1d24ba, transparent 31%, transparent 70%, #1b1d24ba); }
.ilux-products-link { position: absolute; z-index: 2; top: 35px; right: 2.52%; display: flex; align-items: center; justify-content: space-between; width: 220px; min-height: 44px; border-bottom: 2px solid #ffffffb8; font-size: 13.665px; }
.ilux-products-link img { width: 7px; height: 7px; }
.ilux-hero h1 { position: absolute; z-index: 1; left: 68.95%; top: 29.58%; width: 25.435%; height: 9.27%; overflow: hidden; mix-blend-mode: screen; }
.ilux-hero h1 img { position: absolute; width: 108.46%; max-width: none; height: 208.46%; left: -4.23%; top: -41.08%; }
.ilux-intro { padding: 112px 0 120px; }
.ilux-intro-statement { position: relative; max-width: 1182px; margin: 0 auto; padding: 12px 70px; }
.ilux-intro h2 { max-width: 700px; margin: auto; text-align: center; font-size: 36px; line-height: 48px; font-weight: 400; letter-spacing: -.44px; }
.ilux-crosses { position: absolute; inset: 0; display: grid; grid-template-columns: 18px 18px; justify-content: space-between; align-content: space-between; pointer-events: none; }
.ilux-crosses img { width: 18px; height: 18px; }
.ilux-intro-cards { display: grid; grid-template-columns: repeat(2, 344px); gap: 45px; justify-content: center; margin-top: 114px; }
.ilux-intro-cards > div { min-height: 159px; border-radius: 30px; padding: 30px 34px; background: linear-gradient(90deg, #9e9ef34a, #3737374a); }
.ilux-intro-cards h3 { font-size: 24px; line-height: 26px; font-weight: 600; margin-bottom: 11px; }
.ilux-intro-cards p { font-size: 16px; line-height: 19px; font-weight: 300; letter-spacing: -.44px; }
.ilux-section-label { display: flex; justify-content: space-between; position: relative; margin: 0 2%; padding-top: 5px; border-top: 1px solid #ffffff70; font-size: 11px; line-height: 24px; }
.ilux-section-label > span:nth-child(2) { position: absolute; left: 50%; transform: translateX(-50%); }
.ilux-section-label b { display: inline-flex; border: 1px solid #fff; border-radius: 50%; width: 14px; height: 14px; align-items: center; justify-content: center; font-size: 9px; font-weight: 400; }
.ilux-coating-grid { display: grid; grid-template-columns: 45% 55%; align-items: center; max-width: 1240px; min-height: 577px; margin: auto; gap: 24px; }
.ilux-authentic { position: relative; padding-left: 80px; }
.ilux-authentic > img { position: absolute; left: 0; top: -12px; width: 67px; height: 60px; }
.ilux-authentic h2 { font-size: 36px; line-height: 40px; font-weight: 400; }
.ilux-authentic h2 strong { display: block; font-family: var(--font); font-weight: 700; }
.ilux-authentic p { max-width: 314px; margin-top: 12px; font-size: 20px; line-height: 26px; }
.ilux-coating-features { position: relative; isolation: isolate; }
.ilux-red-glow { position: absolute; z-index: -1; width: 150%; max-width: none; height: 540px; left: -25%; top: -200px; }
.ilux-coating-features > p { font-size: 16px; font-weight: 300; line-height: 19px; letter-spacing: -.44px; }
.ilux-coating-features ul { list-style: none; padding: 0; display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 40px; margin-top: 26px; }
.ilux-coating-features li { font-size: 24px; line-height: 29px; font-weight: 500; }
.ilux-benefit-cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 30px; max-width: 992px; margin: 120px auto 0; }
.ilux-benefit-cards > div { min-height: 250px; padding: 80px 18px 28px; border-radius: 30px; background: linear-gradient(90deg,#9e9ef314,#37373714); border-top: 1px solid #ffffff50; border-bottom: 1px solid #ffffff30; }
.ilux-benefit-cards > div:first-child { background: linear-gradient(60deg,#3737375d 40%,#9e9ef34a 92%); }
.ilux-benefit-cards h3 { font-family: var(--font); font-size: 16px; line-height: 26px; font-weight: 700; white-space: nowrap; }
.ilux-benefit-cards p { font-family: 'Author',var(--poppins); font-weight: 300; font-size: 16px; line-height: 19px; margin-top: 16px; }
.ilux-expression { display: grid; grid-template-columns: 355px 363px; gap: 50px; justify-content: center; margin: 109px auto 0; }
.ilux-portrait { height: 345px; overflow: hidden; border-radius: 30px; }
.ilux-portrait img { width: 100%; height: 136.81%; object-fit: fill; }
.ilux-expression h2 { font: 300 36px/40px 'Author',var(--poppins); max-width: 280px; margin: 12px 0 26px; }
.ilux-expression h2 strong { display: block; }
.ilux-expression p { font-size: 16px; line-height: 20px; font-weight: 300; letter-spacing: -.44px; }
.ilux-expression p + p { margin-top: 20px; }
.ilux-tags { padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.ilux-tags li { border: 1px solid #ffffff26; border-radius: 999px; background: #fbfbfd1f; padding: 6px 17px; font-size: 12.8px; line-height: 19.2px; }
.ilux-expression .ilux-tags { margin-top: 30px; }
.ilux-quote { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 40px; max-width: 1182px; margin: 144px auto 0; min-height: 145px; }
.ilux-quote p { max-width: 826px; text-align: center; font-size: 28px; line-height: 36px; }
.ilux-quote-cross { width: 18px; height: 18px; flex-shrink: 0; }
.ilux-yellow-glow { position: absolute; z-index: -1; top: -100px; left: -10%; width: 120%; height: 304px; max-width: none; }
.ilux-identity { display: grid; grid-template-columns: 338px 702px; gap: 151px; max-width: 1146px; margin: 171px auto 0; }
.ilux-identity h2 { font-size: 24px; font-weight: 300; line-height: 28px; letter-spacing: -.44px; }
.ilux-identity ul { list-style: none; padding: 0; margin-top: 26px; }
.ilux-identity li { display: flex; align-items: center; gap: 12px; text-transform: uppercase; font-size: 16px; font-weight: 500; line-height: 31px; }
.ilux-identity li img { width: 22px; height: 20px; }
.ilux-identity-photo { position: relative; height: 304px; border-radius: 30px; overflow: hidden; }
.ilux-identity-photo > img { position: absolute; top: -58.31%; width: 100%; height: 288.63%; max-width: none; }
.ilux-gallery { margin: 122px auto 0; padding-bottom: 100px; }
.ilux-gallery-stage { position: relative; height: 480px; width: 1440px; left: 50%; transform: translateX(-50%); }
.ilux-gallery-card { position: absolute; object-fit: fill; }
.ilux-gallery-card--1 { left: -49px; top: 0; width: 317px; height: 480px; transform: scaleX(-1); }
.ilux-gallery-card--2 { left: 305px; top: 106px; width: 177px; height: 269px; transform: scaleX(-1); }
.ilux-gallery-card--3 { left: 506px; top: 140px; width: 133px; height: 198px; transform: scaleX(-1); }
.ilux-gallery-card--4 { left: 658px; top: 149px; width: 124px; height: 182px; border-radius: 20px; object-fit: cover; }
.ilux-gallery-card--5 { left: 801px; top: 140px; width: 133px; height: 198px; }
.ilux-gallery-card--6 { left: 959px; top: 106px; width: 177px; height: 269px; }
.ilux-gallery-card--7 { left: 1173px; top: 0; width: 317px; height: 480px; }
.ilux-gallery > .ilux-tags { position: relative; justify-content: center; margin-top: -74px; }
.theme-ilux .site-footer { background: #1b1d24; color: #fff; min-height: 153px; }
.theme-ilux .footer-brand > img, .theme-ilux .social-links img { filter: brightness(0) invert(1); }
@media (max-width: 1250px) {
 .ilux-intro-statement,.ilux-quote { margin-inline: 5%; }
 .ilux-coating-grid { margin-inline: 5%; grid-template-columns: 42% 55%; gap: 3%; }
 .ilux-coating-features ul { gap: 20px; }
 .ilux-benefit-cards { margin-inline: 5%; }
 .ilux-identity { margin-inline: 8%; grid-template-columns: 32% 60%; gap: 8%; }
}
@media (max-width: 820px) {
 .ilux-hero { height: 78vw; min-height: 450px; }
 .ilux-hero-photo { width: 130%; left: -18%; top: -9%; }
 .ilux-hero h1 { left: 65%; top: 32%; width: 31%; height: 9%; }
 .ilux-intro { padding: 72px 24px 80px; }
 .ilux-intro-statement { margin: 0; padding: 24px 30px; }
 .ilux-intro h2 { font-size: 28px; line-height: 38px; }
 .ilux-intro-cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; margin-top: 55px; }
 .ilux-intro-cards > div { padding: 28px; }
 .ilux-coating-grid { grid-template-columns: 1fr; gap: 60px; padding: 90px 0; min-height: 0; }
 .ilux-coating-features ul { gap: 25px; }
 .ilux-benefit-cards { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 70px; gap: 20px; }
 .ilux-benefit-cards > div { min-height: 205px; padding-top: 48px; }
 .ilux-benefit-cards h3 { white-space: normal; }
 .ilux-expression { grid-template-columns: minmax(0,355px) minmax(0,363px); gap: 28px; margin: 70px 5% 0; }
 .ilux-quote { margin-top: 90px; gap: 15px; }
 .ilux-quote p { font-size: 24px; line-height: 32px; }
 .ilux-identity { margin-top: 90px; grid-template-columns: 1fr; gap: 35px; }
 .ilux-gallery { margin-top: 80px; padding: 0 20px 80px; }
 .ilux-gallery-stage { position: static; transform: none; width: 100%; height: auto; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; align-items: center; }
 .ilux-gallery-card { position: static; width: 100%; height: auto; }
 .ilux-gallery-card--4 { aspect-ratio: 124/182; height: auto; }
 .ilux-gallery-card--7 { display: none; }
 .ilux-gallery > .ilux-tags { margin-top: 28px; }
}
@media (max-width: 520px) {
 .theme-ilux .site-header .brand { left: 20px; top: 25px; }
 .ilux-products-link { right: 20px; top: 24px; width: 180px; font-size: 11px; }
 .ilux-hero { min-height: 480px; }
 .ilux-hero-photo { width: 185%; left: -43%; top: -5%; }
 .ilux-hero h1 { left: 57%; top: 27%; width: 40%; height: 8%; }
 .ilux-intro h2 { font-size: 24px; line-height: 33px; }
 .ilux-intro-cards { grid-template-columns: 1fr; }
 .ilux-authentic { padding-left: 55px; }
 .ilux-authentic > img { width: 45px; height: 40px; top: 0; }
 .ilux-authentic h2 { font-size: 30px; line-height: 36px; }
 .ilux-coating-features ul { grid-template-columns: 1fr; gap: 24px; }
 .ilux-coating-features li { font-size: 23px; max-width: 280px; }
 .ilux-section-label { margin-inline: 20px; font-size: 9px; }
 .ilux-benefit-cards { gap: 12px; }
 .ilux-benefit-cards > div { padding: 32px 15px; }
 .ilux-benefit-cards h3 { font-size: 14px; line-height: 22px; overflow-wrap: anywhere; }
 .ilux-expression { grid-template-columns: 1fr; margin-inline: 24px; }
 .ilux-portrait { max-width: 355px; width: 100%; justify-self: center; }
 .ilux-expression-copy h2 { margin-top: 0; }
 .ilux-quote p { font-size: 21px; line-height: 30px; }
 .ilux-quote-cross { width: 12px; height: 12px; }
 .ilux-identity { margin-inline: 24px; }
 .ilux-identity-photo { height: 180px; }
 .ilux-gallery-stage { grid-template-columns: repeat(2,minmax(0,1fr)); }
}