/* 07.10.2026: logo yazı tipi Montserrat (SIL Open Font License) siteye gömülü — dış sunucuya (Google) istek yok. */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../assets/fonts/montserrat-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../assets/fonts/montserrat-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --bg: #050a18;
  --bg-deep: #020510;
  --surface: #0a1530;
  --surface-2: #0f2046;
  --surface-glass: rgba(17, 32, 68, .62);
  --ink: #f4f7ff;
  --muted: #a8b7d4;
  --sapphire: #4f7cff;
  --sapphire-soft: #bdd2ff;
  --blue: #7cc8ff;
  --line: rgba(189, 210, 255, .16);
  --line-strong: rgba(189, 210, 255, .32);
  --light: #edf3ff;
  --light-2: #dfe9fb;
  --light-ink: #0d1a3c;
  --light-muted: #506385;
  --radius: 18px;
  --radius-lg: 30px;
  --font: "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
  --mono: "Cascadia Mono", "Segoe UI Mono", Consolas, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; background: var(--bg); }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  opacity: .16;
  background-image: linear-gradient(rgba(124, 200, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 124, 255, .04) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, #000 0, transparent 65%);
}
::selection { color: var(--bg-deep); background: var(--sapphire); }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 570; line-height: 1.02; letter-spacing: -.055em; }
h2 { margin-bottom: 28px; font-size: clamp(2.65rem, 5vw, 5.25rem); }
h3 { font-size: 1.6rem; }
p { color: var(--muted); }
em { color: var(--sapphire); font: inherit; font-weight: 570; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid var(--sapphire);
  outline-offset: 4px;
}
.container { width: min(1320px, calc(100% - 96px)); margin-inline: auto; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 500; padding: 13px 18px; border-radius: 8px; color: var(--bg); background: var(--sapphire); font-weight: 700; }
.skip-link:focus { top: 14px; }

/* Navigation */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid var(--line);
  background: rgba(2, 8, 24, .78);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}
.nav { width: min(1400px, calc(100% - 72px)); height: 86px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 14px; flex-shrink: 0; color: var(--ink); font-size: 20px; font-weight: 680; letter-spacing: .12em; line-height: 1.06; }
.brand-sub { display: block; margin-top: 6px; color: var(--muted); font: 600 9px/1 var(--mono); letter-spacing: .31em; }
.brand-mark { position: relative; width: 37px; height: 40px; border: 1px solid rgba(189, 210, 255, .78); transform: skewY(-13deg); background: linear-gradient(140deg, rgba(255,255,255,.22), rgba(79, 124, 255,.08)); box-shadow: inset 0 0 18px rgba(124, 200, 255,.14), 8px 8px 28px rgba(79, 124, 255,.08); }
.brand-mark::after { content: ""; position: absolute; inset: 5px -7px -5px 7px; border: 1px solid rgba(124, 200, 255, .46); background: linear-gradient(140deg, rgba(124, 200, 255,.12), rgba(255,255,255,.02)); }
.nav-links { display: flex; align-items: center; gap: 30px; margin: 0; padding: 0; list-style: none; color: #cad5eb; font-size: 13px; }
.nav-links a { position: relative; display: block; padding: 10px 0; }
.nav-links a:not(.nav-cta)::after { content: ""; position: absolute; right: 0; bottom: 4px; left: 0; height: 1px; transform: scaleX(0); transform-origin: right; background: var(--sapphire); transition: transform .22s ease; }
.nav-links a:hover, .nav-links a.active { color: var(--ink); }
.nav-links a:hover::after, .nav-links a.active::after { transform: scaleX(1); transform-origin: left; }
.nav-links .nav-cta { min-height: 46px; padding: 12px 18px; border: 1px solid var(--line-strong); border-radius: 8px; color: var(--ink); background: rgba(255,255,255,.035); transition: border-color .2s, background .2s, transform .2s; }
.nav-links .nav-cta:hover { transform: translateY(-2px); border-color: var(--sapphire); background: rgba(79, 124, 255,.08); }
.nav-cta span { margin-left: 20px; color: var(--sapphire); }
.nav-toggle { display: none; width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 8px; background: transparent; }
.nav-toggle span { display: block; width: 22px; height: 1px; margin: 7px auto; background: var(--ink); }

/* Hero */
.hero { position: relative; min-height: calc(var(--ekran-h, 100svh) - 86px); overflow: hidden; background: radial-gradient(circle at 76% 42%, rgba(39, 82, 190, .34), transparent 33%), linear-gradient(145deg, #050a18 5%, #06132e 52%, #020510 100%); }
.hero-grid { position: absolute; inset: 0; opacity: .58; background-image: linear-gradient(rgba(124, 200, 255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 124, 255,.055) 1px, transparent 1px); background-size: 64px 64px; mask-image: radial-gradient(circle at 70% 48%, #000, transparent 64%); }
.hero-glow { position: absolute; width: 480px; height: 480px; border-radius: 50%; filter: blur(120px); pointer-events: none; opacity: .2; }
.hero-glow-a { right: 7%; top: 8%; background: var(--sapphire); }
.hero-glow-b { right: 33%; bottom: -31%; background: var(--blue); }
.hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr); align-items: center; gap: 40px; min-height: calc(var(--ekran-h, 100svh) - 154px); padding: 62px 0 34px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 24px; color: var(--sapphire); font: 650 11px/1.55 var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: var(--sapphire); box-shadow: 0 0 0 5px rgba(79, 124, 255,.08), 0 0 20px var(--sapphire); }
.hero h1 { max-width: 780px; margin-bottom: 30px; font-size: clamp(4.2rem, 7.6vw, 7.7rem); line-height: .93; letter-spacing: -.075em; }
.lead { max-width: 570px; margin-bottom: 0; color: #b7c4dd; font-size: clamp(1.05rem, 1.45vw, 1.24rem); line-height: 1.72; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; margin-top: 38px; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; gap: 24px; padding: 14px 22px; border: 1px solid transparent; border-radius: 8px; font-size: 14px; font-weight: 650; transition: transform .2s, background .2s, border-color .2s, box-shadow .2s; }
.btn:hover { transform: translateY(-3px); }
.btn-primary { color: #020718; background: var(--sapphire); box-shadow: 0 12px 35px rgba(79, 124, 255,.14); }
.btn-primary:hover { background: var(--sapphire-soft); box-shadow: 0 16px 45px rgba(79, 124, 255,.22); }
.btn-outline { border-color: var(--line-strong); color: var(--ink); background: rgba(255,255,255,.025); }
.text-link { display: inline-flex; align-items: center; gap: 22px; min-height: 44px; padding: 7px 0; border-bottom: 1px solid var(--line-strong); color: var(--ink); font-size: 14px; transition: border-color .2s, color .2s; }
.text-link span { color: var(--sapphire); }
.text-link:hover { border-color: var(--sapphire); }
.hero-note { display: flex; align-items: center; gap: 15px; margin-top: 58px; }
.hero-note p { margin: 0; color: #96a7c6; font: 11px/1.75 var(--mono); letter-spacing: .04em; }
.hero-note strong { color: #dce6f8; font-weight: 500; }
.pulse { position: relative; width: 34px; height: 34px; border: 1px solid var(--line-strong); border-radius: 50%; }
.pulse::after { content: ""; position: absolute; inset: 11px; border-radius: inherit; background: var(--sapphire); box-shadow: 0 0 14px var(--sapphire); animation: pulse 2.2s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .25; transform: scale(.55); } }
.hero-bottom { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center; min-height: 68px; border-top: 1px solid var(--line); color: #8094b6; font: 600 9px/1 var(--mono); letter-spacing: .17em; }
.hero-bottom a { color: #c7d5ec; }
.hero-bottom a span { margin-left: 20px; color: var(--sapphire); font-size: 15px; }

/* CSS 3D optical wall */
.glass-stage { --tilt-x: 0deg; --tilt-y: 0deg; position: relative; height: 590px; isolation: isolate; perspective: 1200px; }
.glass-stage::before { content: ""; position: absolute; inset: 13% 1% 12%; z-index: -2; border-radius: 50%; background: radial-gradient(circle, rgba(79, 124, 255,.17), rgba(124, 200, 255,.05) 42%, transparent 68%); filter: blur(12px); }
.glass-stage::after { content: ""; position: absolute; right: 8%; bottom: 66px; left: 15%; z-index: -1; height: 45px; transform: rotate(-9deg); border-radius: 50%; background: rgba(68, 120, 232, .18); filter: blur(24px); }
.stage-orbit { position: absolute; border: 1px solid rgba(124, 200, 255,.16); border-radius: 50%; pointer-events: none; }
.orbit-a { inset: 4% 1% 8%; transform: rotate(-18deg) scaleY(.77); }
.orbit-b { inset: 16% 12% 19%; transform: rotate(31deg) scaleY(.78); border-color: rgba(79, 124, 255,.2); }
.glass-sculpture { position: absolute; top: 47%; left: 51%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; width: 390px; height: 390px; transform-style: preserve-3d; transform: translate(-50%, -50%) rotateX(calc(12deg + var(--tilt-y))) rotateY(calc(-23deg + var(--tilt-x))) rotateZ(-6deg); transition: transform .16s ease-out; animation: glass-float 10s ease-in-out infinite; }
.glass-block { position: relative; transform-style: preserve-3d; border: 1px solid rgba(239, 245, 255,.62); border-radius: 14px; background: linear-gradient(135deg, rgba(255,255,255,.66) 0%, rgba(124, 200, 255,.13) 20%, rgba(79, 124, 255,.10) 42%, rgba(255,255,255,.2) 58%, rgba(57, 111, 225,.18) 100%); box-shadow: inset 3px 3px 9px rgba(255,255,255,.62), inset -5px -6px 10px rgba(0, 16, 48,.45), 7px 8px 0 -2px rgba(75, 122, 219,.42), 12px 15px 25px rgba(0,0,0,.27), 0 0 25px rgba(79, 124, 255,.04); -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
.glass-block::before { content: ""; position: absolute; inset: 9px; border: 1px solid rgba(255,255,255,.46); border-radius: 36% 46% 34% 43%; transform: translateZ(9px) rotate(-12deg); background: repeating-radial-gradient(ellipse at 35% 31%, rgba(255,255,255,.32) 0 2px, transparent 4px 10px), radial-gradient(ellipse at 28% 25%, rgba(255,255,255,.42), transparent 60%); box-shadow: inset 3px 3px 8px rgba(255,255,255,.24), inset -3px -3px 8px rgba(8, 29, 73,.25); }
.glass-block::after { content: ""; position: absolute; inset: 2px; border-radius: 11px; transform: translateZ(12px); background: linear-gradient(118deg, transparent 28%, rgba(124, 200, 255,.36) 42%, rgba(255,255,255,.5) 48%, rgba(79, 124, 255,.22) 54%, transparent 68%); opacity: .46; }
.glass-block:nth-child(3n + 1) { transform: translateZ(8px); }
.glass-block:nth-child(4n + 2) { background-color: rgba(124, 200, 255,.09); }
.glass-block:nth-child(5n) { transform: translateZ(-5px); }
.stage-hud { position: absolute; color: #7892bd; font: 600 9px/1.5 var(--mono); letter-spacing: .16em; }
.hud-top { top: 10%; left: 7%; display: flex; gap: 18px; }
.hud-top strong { color: var(--sapphire); font-weight: 600; }
.hud-side { top: 25%; right: -12px; writing-mode: vertical-rl; }
.stage-label { position: absolute; right: 3%; bottom: 14px; left: 11%; padding: 17px 20px; border: 1px solid rgba(189, 210, 255,.17); border-radius: 10px; background: rgba(8, 20, 50,.62); box-shadow: inset 0 1px rgba(255,255,255,.08); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.stage-label > span { display: block; margin-bottom: 6px; color: #7e97c0; font: 600 9px/1.4 var(--mono); letter-spacing: .15em; }
.stage-label strong { display: flex; justify-content: space-between; color: #eaf1ff; font-size: 14px; font-weight: 560; }
.stage-label strong span { color: var(--sapphire); }
@keyframes glass-float {
  0%, 100% { transform: translate(-50%, -50%) rotateX(calc(12deg + var(--tilt-y))) rotateY(calc(-23deg + var(--tilt-x))) rotateZ(-6deg); }
  50% { transform: translate(-50%, -53%) rotateX(calc(9deg + var(--tilt-y))) rotateY(calc(-18deg + var(--tilt-x))) rotateZ(-4deg); }
}

/* Shared sections */
.signal-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #071127; }
.signal-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.signal-grid > div { position: relative; display: grid; gap: 2px; padding: 26px 28px; border-right: 1px solid var(--line); }
.signal-grid > div:first-child { border-left: 1px solid var(--line); }
.signal-grid strong { color: #f0f5ff; font-size: 15px; font-weight: 620; }
.signal-grid span { color: #7489ad; font: 10px/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.section { padding: 118px 0; }
.section-dark { background: var(--bg); }
.section-alt { border-block: 1px solid var(--line); background: #08132c; }
.section-light { color: var(--light-ink); background: var(--light); }
.section-light p { color: var(--light-muted); }
.section-light h1, .section-light h2, .section-light h3 { color: var(--light-ink); }
.section-light .eyebrow { color: #2459cb; }
.section-light .text-link { border-color: rgba(35, 79, 169,.32); color: var(--light-ink); }
.section-head { max-width: 800px; margin: 0 auto 55px; text-align: center; }
.section-head p { font-size: 16px; }
.heading-row { max-width: none; display: flex; align-items: end; justify-content: space-between; gap: 50px; text-align: left; }
.heading-row h2 { margin: 0; }
.heading-row p { max-width: 420px; margin: 0 0 10px; }
.grid { display: grid; gap: 20px; }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card { position: relative; overflow: hidden; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); transition: transform .22s, border-color .22s, background .22s; }
.card::before { content: ""; position: absolute; inset: -1px; pointer-events: none; background: radial-gradient(circle at 10% 5%, rgba(79, 124, 255,.11), transparent 36%); opacity: 0; transition: opacity .22s; }
.card:hover { transform: translateY(-4px); border-color: var(--line-strong); background-color: rgba(79, 124, 255,.025); }
.card:hover::before { opacity: 1; }
.card h3 { position: relative; margin-bottom: 16px; font-size: 25px; letter-spacing: -.035em; }
.card p { position: relative; margin-bottom: 0; font-size: 15px; }
.card-icon { position: relative; margin-bottom: 38px; color: var(--sapphire); font: 600 13px/1 var(--mono); }

/* Home collection */
.collection-bento { display: grid; grid-template-columns: 1.3fr .7fr; grid-template-rows: repeat(2, 315px); gap: 22px; }
.feature-card { position: relative; display: grid; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); transition: transform .26s, border-color .26s, box-shadow .26s; }
.feature-card:hover { transform: translateY(-5px); border-color: rgba(79, 124, 255,.42); box-shadow: 0 24px 70px rgba(0,0,0,.22); }
.feature-primary { grid-row: 1 / 3; grid-template-rows: 1fr auto; }
.feature-secondary { grid-template-columns: 45% 1fr; }
.feature-media { position: relative; overflow: hidden; min-height: 0; background: radial-gradient(circle at 50% 42%, rgba(239, 245, 255,.92), rgba(156, 188, 238,.56) 38%, rgba(17, 41, 92,.52) 72%, rgba(4, 12, 31,.7)); }
.feature-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(130deg, rgba(124, 200, 255,.16), transparent 35%, rgba(79, 124, 255,.08)); mix-blend-mode: screen; pointer-events: none; }
.feature-media img { width: 100%; height: 100%; object-fit: contain; padding: 34px; transition: transform .55s ease; }
.feature-primary .feature-media img { padding: 48px; }
.feature-card:hover img { transform: scale(1.035) rotate(.4deg); }
.product-no { position: absolute; top: 20px; left: 22px; z-index: 2; padding: 7px 10px; border: 1px solid rgba(10, 27, 63,.17); border-radius: 6px; color: #10234d; background: rgba(238, 244, 255,.72); font: 650 9px/1 var(--mono); letter-spacing: .1em; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.feature-copy { align-self: center; padding: 30px; }
.feature-copy .eyebrow { margin-bottom: 13px; }
.feature-copy h3 { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 13px; font-size: clamp(1.55rem, 2.4vw, 2.25rem); }
.feature-copy h3 span { color: var(--sapphire); font-size: 20px; }
.feature-copy p { margin: 0; font-size: 14px; }
.feature-accent .feature-media { background: radial-gradient(circle at 50% 45%, rgba(231,250,255,.95), rgba(124, 200, 255,.45) 42%, rgba(24, 59, 128,.58) 76%, rgba(4, 12, 31,.7)); }

/* Split, capabilities, process */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 90px; }
.split p { font-size: 16px; }
.split-img { width: 100%; aspect-ratio: 4 / 3; border-radius: var(--radius); object-fit: cover; }
.vision-image { position: relative; }
.vision-image::before { content: ""; position: absolute; inset: 20px -20px -20px 20px; z-index: 0; border: 1px solid rgba(30, 70, 151,.2); border-radius: var(--radius); }
.vision-image .split-img { position: relative; z-index: 1; aspect-ratio: 1.08; filter: saturate(.63) contrast(1.04); }
.image-caption { position: absolute; z-index: 2; bottom: 18px; left: 18px; padding: 10px 13px; border-radius: 5px; color: #e4edff; background: rgba(5, 12, 31,.76); font: 650 9px/1 var(--mono); letter-spacing: .12em; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.vision-copy { padding-left: 10px; }
.vision-copy h2 em { color: #2459cb; }
.vision-copy .text-link { margin-top: 14px; }
.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.capability-card { position: relative; min-height: 290px; padding: 30px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012)); }
.capability-card::after { content: ""; position: absolute; width: 150px; height: 150px; right: -65px; bottom: -65px; border: 1px solid var(--line); border-radius: 50%; box-shadow: 0 0 45px rgba(79, 124, 255,.06); }
.capability-wide { grid-column: span 2; }
.capability-card > span { display: block; margin-bottom: 70px; color: var(--sapphire); font: 600 11px/1 var(--mono); }
.capability-card h3 { max-width: 520px; margin-bottom: 14px; font-size: 31px; }
.capability-card p { max-width: 530px; margin: 0; font-size: 14px; }
.capability-card > i { position: absolute; right: 30px; top: 27px; color: var(--sapphire); font-style: normal; }
.process-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.process-grid article { padding-top: 22px; border-top: 1px solid var(--line); }
.process-grid article > span { display: block; margin-bottom: 42px; color: var(--sapphire); font: 600 11px/1 var(--mono); }
.process-grid h3 { font-size: 27px; }
.process-grid p { max-width: 300px; margin-bottom: 0; font-size: 14px; }

/* Project gallery */
.project-section { border-top: 1px solid var(--line); background: #071127; }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.gallery img { width: 100%; aspect-ratio: 4 / 3; border: 1px solid var(--line); border-radius: 12px; object-fit: cover; cursor: zoom-in; filter: saturate(.68) contrast(1.04); transition: transform .24s, filter .24s, border-color .24s; }
.gallery img:hover { transform: translateY(-3px); border-color: var(--line-strong); filter: saturate(.92) brightness(1.08); }
.project-showcase { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.project-showcase img { height: 480px; aspect-ratio: auto; }
.project-showcase img:first-child { border-radius: var(--radius) 8px 8px var(--radius); object-position: center top; }
.gallery-contain img { padding: 20px; background: rgba(255,255,255,.88); object-fit: contain; filter: none; }
.center-link { margin-top: 38px; text-align: center; }

/* Bizote workmanship */
.bizote-section { overflow: hidden; }
.bizote-showcase { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); align-items: center; gap: 72px; }
.bizote-copy { max-width: 560px; }
.bizote-copy h2 { margin-bottom: 28px; }
.bizote-copy p { font-size: 16px; }
.bizote-copy .bizote-lead { color: var(--ink); font-size: clamp(1.08rem, 1.5vw, 1.28rem); line-height: 1.7; }
.bizote-copy .text-link { margin-top: 16px; }
.bizote-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.bizote-gallery figure { margin: 0; }
.bizote-gallery figure:nth-child(2) { transform: translateY(34px); }
.bizote-gallery img { aspect-ratio: 3 / 4; border-radius: var(--radius); object-position: center; }
.bizote-gallery figcaption { display: flex; gap: 12px; padding: 14px 4px 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.bizote-gallery figcaption span { flex: 0 0 auto; color: var(--sapphire); font: 650 11px/1.7 var(--mono); }

/* CTA and footer */
.cta-band { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 0; overflow: hidden; padding: 74px 78px; border: 1px solid rgba(79, 124, 255,.28); border-radius: var(--radius-lg); background: radial-gradient(circle at 90% 100%, rgba(124, 200, 255,.16), transparent 38%), radial-gradient(circle at 12% 0, rgba(79, 124, 255,.16), transparent 35%), #0b1b3f; }
.cta-band::before { content: ""; position: absolute; right: -80px; bottom: -180px; width: 430px; height: 430px; border: 1px solid rgba(79, 124, 255,.12); border-radius: 50%; box-shadow: 0 0 0 48px rgba(79, 124, 255,.025), 0 0 0 96px rgba(124, 200, 255,.018); }
.cta-band > * { position: relative; z-index: 1; }
.cta-band .eyebrow { margin-bottom: 18px; }
.cta-band h2 { margin-bottom: 18px; font-size: clamp(2.6rem, 4.4vw, 4.7rem); }
.cta-band p { margin-bottom: 0; }
.cta-band .btn { flex-shrink: 0; }
.site-footer { margin-top: 110px; padding: 68px 0 26px; border-top: 1px solid var(--line); background: #020817; }
.footer-grid { display: grid; grid-template-columns: 1.4fr .7fr .8fr 1.1fr; gap: 48px; margin-bottom: 58px; }
.footer-grid h4 { margin: 0 0 22px; color: #dce6f8; font-size: 12px; font-weight: 650; }
.footer-brand h4 { color: var(--ink); font-size: 21px; letter-spacing: -.025em; }
.footer-brand p { max-width: 310px; font-size: 13px; }
.footer-grid ul { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; color: #879bbc; font-size: 12px; }
.footer-grid a { transition: color .2s; }
.footer-grid a:hover { color: var(--sapphire); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 24px; border-top: 1px solid var(--line); color: #6e82a6; font: 9px/1.5 var(--mono); letter-spacing: .04em; }

/* Inner pages */
.page-header { position: relative; overflow: hidden; padding: 105px 0 82px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 80% 30%, rgba(79, 124, 255,.14), transparent 26%), linear-gradient(145deg, #07132d, #020617); }
.page-header::before { content: ""; position: absolute; inset: 0; opacity: .44; background-image: linear-gradient(rgba(124, 200, 255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 124, 255,.05) 1px, transparent 1px); background-size: 60px 60px; mask-image: linear-gradient(90deg, transparent, #000); }
.page-header .container { position: relative; z-index: 1; }
.page-header h1 { max-width: 1040px; margin-bottom: 26px; font-size: clamp(3.4rem, 6.6vw, 6.7rem); }
.page-header p { max-width: 690px; margin-bottom: 0; font-size: 17px; }
.subnav { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 38px; }
.subnav a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 16px; border: 1px solid var(--line); border-radius: 7px; color: #ced9ec; background: rgba(255,255,255,.025); font-size: 12px; transition: border-color .2s, background .2s, color .2s; }
.subnav a:hover { border-color: var(--sapphire); color: #030918; background: var(--sapphire); }
.swatches { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 24px; margin-top: 30px; }
.swatch { margin: 0; }
.swatch img { width: 100%; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 14px; background: radial-gradient(circle, #edf3ff, #b9c9e6); object-fit: contain; }
.swatch figcaption { margin-top: 12px; color: #bac8df; font-size: 13px; }
.swatches-sm { grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); }
#cam-tugla .swatches { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 38px 24px; }
.gallery-products img { cursor: zoom-in; transition: transform .25s, border-color .25s; }
.gallery-products img:hover { transform: translateY(-3px); border-color: var(--sapphire); }
.showroom-accessory { max-width: 330px; margin-bottom: 38px; }
.spec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.feature-card-wide { grid-column: span 2; }
.archive-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.service-grid .feature-card { display: block; border-radius: var(--radius); }
.solutions-section .spec-grid { grid-template-columns: 1.15fr .85fr; align-items: start; }
.solutions-section .feature-card { display: block; padding: 34px; border-radius: var(--radius); }
.solutions-section .feature-card > .eyebrow { margin-bottom: 16px; }
.solutions-section .feature-card h3 { font-size: 30px; }
.solutions-section .archive-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 30px; }
.solutions-section .showroom-accessory { max-width: 100%; margin: 28px 0 0; }
.feature-card--media { align-content: space-between; }
.checklist { display: grid; gap: 13px; margin: 26px 0; padding: 0; list-style: none; color: var(--muted); font-size: 15px; }
.checklist li::before { content: "↗"; margin-right: 12px; color: var(--sapphire); }
.about-logo { padding: 42px; background: #f1f5ff; object-fit: contain; }
.award-img { max-width: 400px; justify-self: center; aspect-ratio: auto; padding: 18px; background: #f1f5ff; object-fit: contain; }
.legacy-mark { position: relative; display: grid; align-content: space-between; justify-self: center; width: min(100%, 430px); aspect-ratio: 1; padding: 42px; overflow: hidden; border: 1px solid var(--line-strong); border-radius: var(--radius-lg); background: radial-gradient(circle at 75% 25%, rgba(124, 200, 255,.18), transparent 34%), radial-gradient(circle at 15% 85%, rgba(79, 124, 255,.18), transparent 38%), #0a193b; box-shadow: inset 0 1px rgba(255,255,255,.08), 0 26px 70px rgba(0,0,0,.2); }
.legacy-mark::before, .legacy-mark::after { content: ""; position: absolute; border: 1px solid rgba(189, 210, 255,.14); border-radius: 50%; }
.legacy-mark::before { width: 310px; height: 310px; right: -120px; bottom: -110px; }
.legacy-mark::after { width: 210px; height: 210px; right: -70px; bottom: -60px; }
.legacy-mark span { color: var(--sapphire); font: 650 12px/1 var(--mono); letter-spacing: .16em; }
.legacy-mark strong { color: var(--ink); font-size: clamp(2.4rem, 4vw, 4rem); font-weight: 560; line-height: .98; letter-spacing: -.06em; }
.legacy-mark small { color: var(--muted); font: 600 9px/1 var(--mono); letter-spacing: .16em; }
.timeline { max-width: 760px; margin: auto; padding: 0 0 0 34px; border-left: 1px solid var(--line-strong); list-style: none; }
.timeline li { position: relative; padding: 0 0 42px; }
.timeline li::before { content: ""; position: absolute; top: 8px; left: -40px; width: 11px; height: 11px; border: 2px solid var(--bg); border-radius: 50%; background: var(--sapphire); box-shadow: 0 0 17px rgba(79, 124, 255,.5); }
.timeline strong { color: var(--ink); font-size: 24px; font-weight: 560; }
.timeline p { margin: 9px 0 0; font-size: 15px; }

/* Contact */
.contact-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 64px; align-items: start; }
.contact-info .card { margin-bottom: 13px; padding: 23px; }
.contact-info .card-icon { float: left; width: 42px; margin: 3px 0 0; font-size: 18px; }
.contact-info h3 { margin: 0 0 8px; font-size: 19px; }
.contact-info p { margin-bottom: 0; padding-left: 42px; overflow-wrap: anywhere; font-size: 14px; }
.contact-info a:hover { color: var(--sapphire); }
#contact-form { padding: 38px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); }
#contact-form h2 { margin-bottom: 32px; font-size: 39px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-field { margin-bottom: 22px; }
.form-field label { display: block; margin-bottom: 9px; color: #bdcae1; font-size: 12px; }
.form-field input, .form-field textarea, .form-field select { width: 100%; min-width: 0; padding: 13px 14px; border: 1px solid var(--line-strong); border-radius: 7px; color: var(--ink); background: #07132d; font-size: 14px; }
.form-field select option { color: var(--ink); background: #07132d; }
.form-field textarea { resize: vertical; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-color: var(--sapphire); }
.form-note { margin: 19px 0 0; font-size: 12px; }
.form-success { display: none; margin-top: 20px; padding: 15px; border: 1px solid rgba(79, 124, 255,.28); border-radius: 7px; color: #dbe7ff; background: rgba(79, 124, 255,.08); font-size: 13px; }
.form-success.visible { display: block; }
.location-card { margin-top: 24px; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); background: radial-gradient(circle at 90% 10%, rgba(124, 200, 255,.08), transparent 40%), #091934; }
.location-card .eyebrow { margin-bottom: 16px; }
.location-card h3 { font-size: 26px; }
.location-card p { font-size: 14px; }
.location-card .text-link { margin-top: 5px; }
.map-embed { width: 100%; aspect-ratio: 16 / 10; margin-top: 30px; border: 1px solid var(--line); border-radius: var(--radius); }

/* Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 300; display: none; align-items: center; justify-content: center; padding: 65px; background: rgba(2,10,8,.94); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.lightbox.open { display: flex; }
.lightbox img { max-width: min(100%, 1120px); max-height: calc(var(--ekran-h, 100vh) * .8); border: 1px solid var(--line-strong); border-radius: 10px; object-fit: contain; }
.lightbox button { position: absolute; width: 46px; height: 46px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; color: white; background: rgba(11, 24, 59,.8); font-size: 26px; }
.lightbox button:hover { border-color: var(--sapphire); color: var(--sapphire); }
.lightbox-close { top: 20px; right: 20px; }
.lightbox-prev { top: 50%; left: 14px; }
.lightbox-next { top: 50%; right: 14px; }
.lightbox-caption { position: absolute; right: 60px; bottom: 14px; left: 60px; margin: 0; color: #dce6f8; text-align: center; font: 11px/1.4 var(--mono); }
body.modal-open { overflow: hidden; }

/* Progressive reveal */
.reveal-ready [data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .46s ease, transform .46s ease; }
.reveal-ready [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@media (min-width: 1500px) {
  .glass-stage { height: 640px; }
  .glass-sculpture { width: 430px; height: 430px; }
}

@media (max-width: 1100px) {
  .container { width: calc(100% - 56px); }
  .nav { width: calc(100% - 48px); }
  .nav-links { gap: 17px; font-size: 12px; }
  .brand { font-size: 18px; }
  .hero-inner { grid-template-columns: minmax(0, 1fr) minmax(350px, .82fr); gap: 12px; }
  .hero h1 { font-size: clamp(3.7rem, 7.5vw, 6rem); }
  .glass-sculpture { width: 330px; height: 330px; }
  .glass-stage { height: 530px; }
  .collection-bento { grid-template-columns: 1.15fr .85fr; grid-template-rows: repeat(2, 285px); }
  .feature-secondary { grid-template-columns: 42% 1fr; }
  .feature-copy { padding: 24px; }
  .split { gap: 50px; }
  .footer-grid { gap: 28px; }
  .cta-band { padding: 58px; }
  .contact-grid { gap: 36px; }
}

@media (max-width: 780px) {
  .container { width: calc(100% - 40px); }
  .nav { width: calc(100% - 40px); height: 74px; }
  .nav-toggle { display: block; }
  .nav-links { position: absolute; top: 100%; right: 0; left: 0; display: none; flex-direction: column; align-items: stretch; gap: 5px; padding: 18px 20px 22px; border-bottom: 1px solid var(--line); background: rgba(3, 9, 25,.98); box-shadow: 0 18px 40px rgba(0,0,0,.3); }
  .nav-links.open { display: flex; }
  .nav-links a { min-height: 44px; padding: 12px; }
  .nav-links .nav-cta { text-align: center; }
  .hero { min-height: auto; }
  .hero-inner { grid-template-columns: 1fr; min-height: 0; gap: 10px; padding-top: 65px; }
  .hero h1 { font-size: clamp(3.55rem, 14vw, 5.3rem); }
  .lead { max-width: 540px; font-size: 1rem; }
  .hero-note { margin-top: 38px; }
  .glass-stage { width: min(100%, 540px); height: 470px; margin: 0 auto; }
  .glass-sculpture { width: 300px; height: 300px; }
  .stage-label { right: 5%; left: 5%; }
  .hud-side { right: 0; }
  .hero-bottom { min-height: 62px; gap: 18px; font-size: 8px; }
  .hero-bottom a span { margin-left: 7px; }
  .signal-grid { grid-template-columns: 1fr 1fr; }
  .signal-grid > div:nth-child(odd) { border-left: 1px solid var(--line); }
  .signal-grid > div { border-bottom: 1px solid var(--line); }
  .signal-grid > div:last-child { grid-column: 1 / -1; }
  .section { padding: 78px 0; }
  .heading-row { display: block; }
  .heading-row p, .heading-row > .text-link { margin-top: 28px; }
  .grid-3, .grid-4 { grid-template-columns: 1fr 1fr; }
  .collection-bento { grid-template-columns: 1fr; grid-template-rows: auto; }
  .feature-primary { grid-row: auto; min-height: 620px; }
  .feature-secondary { min-height: 290px; }
  .split, .contact-grid { grid-template-columns: 1fr; }
  .split { gap: 46px; }
  .vision-image::before { inset: 14px -10px -10px 14px; }
  .capability-grid { grid-template-columns: 1fr 1fr; }
  .capability-wide { grid-column: span 2; }
  .process-grid { grid-template-columns: 1fr; gap: 30px; }
  .process-grid article > span { margin-bottom: 20px; }
  .process-grid p { max-width: none; }
  .project-showcase { grid-template-columns: 1fr 1fr; }
  .project-showcase img { height: 340px; }
  .project-showcase img:first-child { height: 340px; }
  .bizote-showcase { grid-template-columns: 1fr; gap: 44px; }
  .bizote-copy { max-width: 720px; }
  .cta-band { align-items: flex-start; flex-direction: column; padding: 42px 32px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 34px; }
  .footer-bottom { flex-direction: column; }
  .site-footer { margin-top: 78px; padding-top: 50px; }
  .page-header { padding: 75px 0 62px; }
  .page-header h1 { font-size: clamp(3.2rem, 12vw, 5rem); }
  .page-header p { font-size: 15px; }
  #cam-tugla .swatches { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .spec-grid { grid-template-columns: 1fr 1fr; }
  .solutions-section .spec-grid { grid-template-columns: 1fr; }
  .feature-card-wide { grid-column: span 2; }
  .archive-gallery { grid-template-columns: repeat(2, 1fr); }
  .lightbox { padding: 60px; }
}

@media (max-width: 480px) {
  .container { width: calc(100% - 32px); }
  .nav { width: calc(100% - 32px); }
  .brand { font-size: 16px; }
  .brand-mark { width: 32px; height: 35px; }
  .hero-inner { padding-top: 52px; }
  .hero h1 { font-size: clamp(3.1rem, 15.3vw, 4.5rem); }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 12px; }
  .hero-actions .btn, .hero-actions .text-link { width: 100%; }
  .hero-actions .text-link { justify-content: space-between; }
  .hero-note { display: none; }
  .glass-stage { height: 410px; }
  .glass-sculpture { width: 250px; height: 250px; gap: 5px; }
  .glass-block { border-radius: 10px; }
  .glass-block::before { inset: 6px; }
  .stage-label { bottom: 8px; }
  .hud-top { left: 1%; }
  .hero-bottom { letter-spacing: .07em; }
  .hero-bottom > span { max-width: 120px; }
  .signal-grid > div { padding: 20px 18px; }
  .section { padding: 66px 0; }
  h2 { font-size: 2.8rem; }
  .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .feature-primary { min-height: 520px; }
  .feature-secondary { grid-template-columns: 1fr; min-height: 500px; }
  .feature-secondary .feature-media { min-height: 270px; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-wide { grid-column: auto; }
  .capability-card { min-height: 255px; }
  .capability-card > span { margin-bottom: 50px; }
  .project-showcase { grid-template-columns: 1fr; }
  .project-showcase img, .project-showcase img:first-child { grid-column: auto; height: 330px; }
  .bizote-gallery { grid-template-columns: 1fr; }
  .bizote-gallery figure:nth-child(2) { transform: none; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  #contact-form { padding: 26px 20px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand, .footer-grid > div:last-child { grid-column: 1 / -1; }
  .page-header { padding-top: 60px; }
  .page-header h1 { font-size: 3.35rem; }
  #cam-tugla .swatches { grid-template-columns: 1fr 1fr; }
  .gallery { grid-template-columns: 1fr 1fr; }
  .spec-grid, .archive-gallery { grid-template-columns: 1fr; }
  .feature-card-wide { grid-column: auto; }
  .lightbox { padding: 58px 42px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .glass-sculpture { transform: translate(-50%, -50%) rotateX(12deg) rotateY(-23deg) rotateZ(-6deg); }
  .reveal-ready [data-reveal] { opacity: 1; transform: none; }
}

/* Glass-first product system — 28 September 2026 */
.pane-stage::after { right: 3%; left: 8%; transform: rotate(-5deg); }
.glass-panes { position: absolute; inset: 12% 4% 18%; transform-style: preserve-3d; transform: rotateX(calc(5deg + var(--tilt-y))) rotateY(calc(-10deg + var(--tilt-x))); transition: transform .16s ease-out; animation: pane-float 10s ease-in-out infinite; }
@keyframes pane-float {
  0%, 100% { transform: translateY(0) rotateX(calc(5deg + var(--tilt-y))) rotateY(calc(-10deg + var(--tilt-x))); }
  50% { transform: translateY(-7px) rotateX(calc(3deg + var(--tilt-y))) rotateY(calc(-6deg + var(--tilt-x))); }
}
.glass-pane { position: absolute; top: 6%; width: 36%; height: 76%; overflow: hidden; border: 1px solid rgba(228,241,255,.62); border-radius: 9px; box-shadow: inset 2px 2px 8px rgba(255,255,255,.42), inset -4px -3px 12px rgba(4,15,38,.32), 18px 24px 42px rgba(0,0,0,.24), 7px 8px 0 rgba(79,124,255,.12); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.glass-pane::before { content: ""; position: absolute; inset: 0; background: linear-gradient(118deg, transparent 20%, rgba(255,255,255,.5) 35%, transparent 46%, rgba(124,200,255,.2) 72%, transparent 82%); opacity: .72; }
.glass-pane::after { content: ""; position: absolute; inset: 11px; border: 1px solid rgba(255,255,255,.3); border-radius: 5px; }
.glass-pane i { position: absolute; z-index: 2; right: 15px; bottom: 13px; color: rgba(233,242,255,.72); font: 650 11px/1 var(--mono); font-style: normal; }
.pane-clear { left: 1%; transform: translateZ(-24px) rotateY(-8deg); background: linear-gradient(145deg, rgba(230,247,255,.26), rgba(52,103,187,.08)); }
.pane-smoke { left: 22%; top: 1%; transform: translateZ(0) rotateY(-4deg); background: linear-gradient(145deg, rgba(164,183,202,.32), rgba(13,28,55,.48)); }
.pane-bronze { left: 43%; top: 9%; transform: translateZ(24px) rotateY(4deg); background: linear-gradient(145deg, rgba(210,171,115,.45), rgba(75,48,30,.48)); border-color: rgba(255,224,181,.52); }
.pane-texture { left: 64%; top: 3%; transform: translateZ(48px) rotateY(8deg); background-color: rgba(174,211,230,.2); background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.2) 0 2px, rgba(52,102,166,.1) 2px 8px), linear-gradient(145deg, rgba(232,247,255,.24), rgba(47,87,148,.18)); }

.material-bento { display: grid; grid-template-columns: 1.12fr .88fr; gap: 20px; }
.material-card { display: grid; grid-template-columns: 42% 58%; min-height: 292px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014)); transition: transform .25s, border-color .25s, box-shadow .25s; }
.material-card:hover { transform: translateY(-4px); border-color: rgba(79,124,255,.48); box-shadow: 0 24px 70px rgba(0,0,0,.2); }
.material-card-wide:not(.material-card-horizontal) { grid-row: span 2; grid-template-columns: 1fr; grid-template-rows: minmax(330px, 1fr) auto; }
.material-card-horizontal { grid-column: 1 / -1; grid-template-columns: 38% 62%; min-height: 330px; }
.material-visual { position: relative; min-height: 220px; overflow: hidden; background: radial-gradient(circle at 62% 38%, rgba(124,200,255,.22), transparent 38%), #0a1731; }
.material-visual::before, .material-visual::after, .material-visual span { content: ""; position: absolute; border: 1px solid rgba(226,240,255,.52); border-radius: 7px; box-shadow: inset 2px 2px 8px rgba(255,255,255,.28), 18px 18px 35px rgba(0,0,0,.24); }
.material-visual::before { inset: 17% 25% 19% 20%; transform: rotate(-6deg); }
.material-visual::after { inset: 24% 17% 13% 29%; transform: rotate(6deg); }
.material-visual span { inset: 30% 31% 24% 14%; transform: rotate(-1deg); }
.material-visual i { position: absolute; z-index: 2; top: 18px; left: 19px; color: var(--sapphire); font: 650 10px/1 var(--mono); font-style: normal; }
.visual-clear::before, .visual-clear::after, .visual-clear span { background: linear-gradient(135deg, rgba(240,250,255,.3), rgba(76,137,216,.07)); }
.visual-mirror::before, .visual-mirror::after, .visual-mirror span { background: linear-gradient(135deg, rgba(246,250,255,.74), rgba(119,146,180,.26) 48%, rgba(238,247,255,.66) 51%, rgba(45,72,111,.2)); }
.visual-tinted::before { background: rgba(72,88,105,.48); }
.visual-tinted::after { background: rgba(143,92,53,.54); border-color: rgba(255,215,169,.5); }
.visual-tinted span { background: rgba(4,8,16,.8); }
.visual-texture::before, .visual-texture::after, .visual-texture span { background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.24) 0 2px, rgba(75,123,183,.08) 2px 9px), linear-gradient(145deg, rgba(226,243,255,.3), rgba(52,94,151,.16)); }
.material-copy { align-self: center; padding: 30px; }
.material-copy .eyebrow { margin-bottom: 13px; }
.material-copy h3 { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 13px; font-size: clamp(1.65rem, 2.5vw, 2.45rem); }
.material-copy h3 b { color: var(--sapphire); font-size: 18px; font-weight: 500; }
.material-copy p { margin-bottom: 22px; font-size: 14px; }
.material-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.material-tags span { padding: 7px 10px; border: 1px solid var(--line-strong); border-radius: 999px; color: #bfd0e9; font: 600 10px/1 var(--mono); }

.product-page-header::after { content: ""; position: absolute; right: 7%; bottom: -110px; width: 360px; height: 300px; transform: rotate(-8deg); border: 1px solid rgba(189,210,255,.18); border-radius: 12px; background: linear-gradient(135deg, rgba(255,255,255,.11), rgba(79,124,255,.04)); box-shadow: -46px -30px 0 rgba(124,200,255,.025); }
.glass-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.glass-product-card { display: grid; grid-template-rows: 255px auto; overflow: hidden; scroll-margin-top: 105px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.052), rgba(255,255,255,.014)); }
.glass-product-card.product-card-wide { grid-column: 1 / -1; grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr); grid-template-rows: none; min-height: 390px; }
.glass-product-card.product-card-low { min-height: 330px; }
.product-sample { position: relative; min-height: 250px; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 50% 45%, rgba(124,200,255,.17), transparent 48%), #091832; }
.product-sample::before { content: ""; position: absolute; inset: 13%; z-index: -1; border-radius: 50%; background: rgba(79,124,255,.14); filter: blur(42px); }
.product-sample span { position: absolute; inset: 16% 17%; border: 1px solid rgba(235,246,255,.63); border-radius: 8px; box-shadow: inset 3px 3px 12px rgba(255,255,255,.35), inset -4px -4px 15px rgba(3,17,44,.3), 18px 22px 0 rgba(42,83,155,.18), 24px 30px 50px rgba(0,0,0,.28); }
.product-sample span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 22%, rgba(255,255,255,.46) 38%, transparent 52%); }
.product-sample b, .product-sample small { position: absolute; z-index: 2; color: #8fa5c8; font: 650 10px/1 var(--mono); letter-spacing: .12em; }
.product-sample b { top: 20px; left: 22px; color: var(--sapphire); }
.product-sample small { right: 21px; bottom: 20px; }
.sample-clear span { background: linear-gradient(145deg, rgba(236,249,255,.27), rgba(50,100,174,.07)); }
.sample-mirror span { background: linear-gradient(135deg, rgba(248,252,255,.74), rgba(116,143,177,.25) 48%, rgba(246,251,255,.73) 52%, rgba(50,78,115,.18)); }
.sample-frosted span { background: radial-gradient(circle at 28% 35%, rgba(255,255,255,.3), transparent 4%), radial-gradient(circle at 66% 68%, rgba(255,255,255,.2), transparent 5%), linear-gradient(145deg, rgba(226,240,248,.55), rgba(89,124,158,.28)); filter: blur(.2px); }
.sample-tinted span { background: linear-gradient(90deg, rgba(65,78,92,.62) 0 33%, rgba(134,83,45,.64) 33% 66%, rgba(3,6,12,.88) 66%); }
.sample-wired span { background-image: linear-gradient(rgba(219,238,249,.16), rgba(65,104,146,.2)), linear-gradient(45deg, transparent 46%, rgba(229,242,248,.3) 47% 53%, transparent 54%), linear-gradient(-45deg, transparent 46%, rgba(229,242,248,.3) 47% 53%, transparent 54%); background-size: auto, 20px 20px, 20px 20px; }
.product-details { align-self: center; padding: 36px; }
.product-details .eyebrow { margin-bottom: 14px; }
.product-details h3 { margin-bottom: 16px; font-size: clamp(2rem, 3.2vw, 3.7rem); }
.product-details p { max-width: 650px; margin-bottom: 25px; }
.variant-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin: 0; padding: 0; list-style: none; }
.variant-list li { display: grid; gap: 5px; min-height: 72px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.018); }
.variant-list strong { color: #e8f0ff; font: 650 13px/1.3 var(--mono); }
.variant-list span { color: var(--muted); font-size: 12px; }
.variant-list-stack { grid-template-columns: 1fr; }
.variant-list-stack li { grid-template-columns: 72px 1fr; align-items: center; min-height: 53px; }
.glass-catalog-section + #cam-tugla { border-top: 1px solid var(--line); }

@media (max-width: 1100px) {
  .material-card { grid-template-columns: 38% 62%; }
  .glass-product-card.product-card-wide { grid-template-columns: .9fr 1.1fr; }
  .variant-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 780px) {
  .glass-panes { right: 0; left: 0; }
  .material-bento { grid-template-columns: 1fr; }
  .material-card-wide:not(.material-card-horizontal), .material-card-horizontal { grid-column: auto; grid-row: auto; grid-template-columns: 42% 58%; grid-template-rows: none; min-height: 300px; }
  .glass-product-grid { grid-template-columns: 1fr; }
  .glass-product-card, .glass-product-card.product-card-wide { grid-column: auto; grid-template-columns: 1fr; grid-template-rows: 280px auto; }
  .product-page-header::after { opacity: .35; }
}

@media (max-width: 480px) {
  .glass-panes { inset: 12% 1% 19%; }
  .glass-pane { width: 39%; height: 72%; }
  .pane-clear { left: 0; }
  .pane-smoke { left: 20%; }
  .pane-bronze { left: 40%; }
  .pane-texture { left: 60%; }
  .material-card, .material-card-wide:not(.material-card-horizontal), .material-card-horizontal { grid-template-columns: 1fr; grid-template-rows: 240px auto; }
  .material-copy { padding: 25px; }
  .glass-product-card, .glass-product-card.product-card-wide { grid-template-rows: 235px auto; }
  .product-details { padding: 27px 23px; }
  .variant-list { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .glass-panes { animation: none; transform: rotateX(5deg) rotateY(-10deg); }
}

/* Category split and contained hero — 28 September 2026 */
.pane-stage { overflow: hidden; isolation: isolate; max-width: 100%; border-radius: 18px; clip-path: inset(0 round 18px); contain: paint; }

.category-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
.category-tile { grid-column: span 2; display: grid; grid-template-rows: 230px auto; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014)); transition: transform .25s, border-color .25s, box-shadow .25s; }
.category-tile:nth-child(-n + 2) { grid-column: span 3; grid-template-rows: 290px auto; }
.category-tile:hover { transform: translateY(-4px); border-color: rgba(79,124,255,.48); box-shadow: 0 24px 70px rgba(0,0,0,.2); }
.category-tile-media { position: relative; min-height: 0; overflow: hidden; background: #0a1731; }
.category-tile-media > img { width: 100%; height: 100%; padding: 10px; object-fit: contain; filter: saturate(.78) contrast(1.02); transition: transform .5s ease, filter .3s ease; }
.category-tile:nth-child(2) .category-tile-media > img { object-position: center 52%; }
.category-tile:hover .category-tile-media > img { transform: scale(1.025); filter: saturate(.96) contrast(1.04); }
.category-tile .material-visual::before { inset: 16% 25% 18% 20%; }
.category-tile .material-visual::after { inset: 23% 17% 12% 29%; }
.category-tile .material-visual span { inset: 29% 31% 23% 14%; }
.category-tile-copy { padding: 27px; }
.category-tile-copy > span { display: block; margin-bottom: 13px; color: var(--sapphire); font: 650 10px/1 var(--mono); letter-spacing: .13em; }
.category-tile-copy h3 { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 11px; font-size: clamp(1.7rem, 2.3vw, 2.35rem); }
.category-tile-copy h3 b { color: var(--sapphire); font-size: 17px; font-weight: 500; }
.category-tile-copy p { margin: 0; font-size: 14px; }

.category-section { scroll-margin-top: 86px; }
.category-section .glass-product-card { max-width: none; }
.category-mirror { background: #08132c; }
.category-feature { display: grid; grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr); overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012)); }
.category-feature-copy { align-self: center; padding: 46px; }
.category-feature-copy h3 { margin-bottom: 17px; font-size: clamp(2.2rem, 4vw, 4.2rem); }
.category-feature-copy p { max-width: 520px; }
.category-photo-grid { grid-template-columns: .72fr 1.28fr; gap: 0; }
.category-photo-grid img { height: 500px; aspect-ratio: auto; border: 0; border-radius: 0; object-fit: cover; filter: saturate(.76) contrast(1.03); }
.category-photo-grid img:first-child { object-position: center; }

.special-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.special-product-card { overflow: hidden; scroll-margin-top: 105px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012)); }
.special-product-card > img { width: 100%; height: 330px; object-fit: cover; filter: saturate(.78) contrast(1.03); }
.special-product-copy { padding: 34px; }
.special-product-copy h3 { margin-bottom: 15px; font-size: clamp(2rem, 3vw, 3.15rem); }
.special-product-copy p { margin-bottom: 24px; }
.special-photo-grid { display: grid; grid-template-columns: 1.08fr .92fr; grid-template-rows: 165px 165px; gap: 0; }
.special-photo-grid img { width: 100%; height: 165px; aspect-ratio: auto; border: 0; border-radius: 0; object-fit: cover; filter: saturate(.78) contrast(1.03); }
.special-photo-grid img:first-child { grid-row: 1 / 3; height: 330px; }
.category-decorative .glass-product-card { background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012)); }
#cam-tugla { scroll-margin-top: 86px; }

@media (max-width: 900px) {
  .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .category-tile, .category-tile:nth-child(-n + 2) { grid-column: span 1; grid-template-rows: 250px auto; }
  .category-tile:last-child { grid-column: 1 / -1; grid-template-columns: 42% 58%; grid-template-rows: none; }
  .category-feature { grid-template-columns: 1fr; }
  .category-photo-grid img { height: 420px; }
  .special-product-grid { grid-template-columns: 1fr; }
}

@media (max-width: 580px) {
  .pane-stage { border-radius: 12px; clip-path: inset(0 round 12px); }
  .category-grid { grid-template-columns: 1fr; }
  .category-tile, .category-tile:nth-child(-n + 2), .category-tile:last-child { grid-column: auto; grid-template-columns: 1fr; grid-template-rows: 230px auto; }
  .category-feature-copy { padding: 30px 24px; }
  .category-photo-grid { grid-template-columns: 1fr 1fr; }
  .category-photo-grid img { height: 290px; }
  .special-product-card > img { height: 260px; }
  .special-photo-grid { grid-template-rows: 135px 135px; }
  .special-photo-grid img { height: 135px; }
  .special-photo-grid img:first-child { height: 270px; }
  .special-product-copy { padding: 28px 23px; }
}

/* Product clarity and design archive — 29 September 2026 */
.category-grid .category-tile:nth-child(n + 6) { grid-column: span 3; }

.catalog-grid { display: grid; gap: 20px; }
.catalog-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.catalog-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.catalog-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.catalog-card { display: flex; min-width: 0; overflow: hidden; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014)); }
.catalog-card-copy { flex: 1; padding: 32px; }
.catalog-card-copy .eyebrow { margin-bottom: 13px; }
.catalog-card-copy h3 { margin-bottom: 14px; font-size: clamp(1.65rem, 2.4vw, 2.6rem); }
.catalog-card-copy p { margin-bottom: 23px; font-size: 14px; }
.catalog-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.catalog-specs > div { min-width: 0; padding: 12px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(3, 10, 28, .32); }
.catalog-specs dt { margin-bottom: 5px; color: #7288ad; font: 600 9px/1.25 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.catalog-specs dd { margin: 0; color: #edf4ff; font-size: 13px; font-weight: 620; }
.catalog-card-media { display: block; margin: 0; border-top: 1px solid var(--line); background: #071127; }
.catalog-card-media img { width: 100%; height: 330px; object-fit: contain; background: #071127; filter: saturate(.83) contrast(1.03); }
.catalog-card-media figcaption, .standalone-product-media figcaption, .product-note-media figcaption { padding: 13px 17px; color: #8fa3c4; background: #060f23; font: 600 10px/1.45 var(--mono); letter-spacing: .04em; }
.catalog-material { position: relative; height: 290px; overflow: hidden; border-top: 1px solid var(--line); isolation: isolate; background: radial-gradient(circle at 65% 36%, rgba(124,200,255,.19), transparent 40%), #07162f; }
.catalog-material::before { content: ""; position: absolute; inset: 15%; z-index: -1; border-radius: 50%; background: rgba(79,124,255,.15); filter: blur(35px); }
.catalog-material > span { position: absolute; inset: 15% 14% 17%; border: 1px solid rgba(235,246,255,.64); border-radius: 8px; background: linear-gradient(145deg, rgba(236,249,255,.26), rgba(50,100,174,.08)); box-shadow: inset 3px 3px 12px rgba(255,255,255,.31), inset -4px -4px 15px rgba(3,17,44,.28), 17px 21px 0 rgba(42,83,155,.17), 24px 30px 50px rgba(0,0,0,.27); }
.catalog-material > span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 22%, rgba(255,255,255,.44) 38%, transparent 52%); }
.catalog-material small { position: absolute; right: 18px; bottom: 16px; color: #8fa5c8; font: 650 9px/1 var(--mono); letter-spacing: .1em; }
.material-mirror-smoke > span { background: linear-gradient(135deg, rgba(217,226,237,.58), rgba(54,68,85,.77) 47%, rgba(226,235,244,.42) 52%, rgba(25,35,49,.72)); }
.material-mirror-bronze > span { background: linear-gradient(135deg, rgba(239,218,187,.66), rgba(110,73,45,.64) 47%, rgba(240,220,190,.54) 52%, rgba(73,45,27,.69)); }
.material-smoke > span { background: linear-gradient(145deg, rgba(139,158,177,.38), rgba(24,35,49,.77)); }
.material-bronze > span { background: linear-gradient(145deg, rgba(212,159,104,.43), rgba(78,44,24,.72)); }
.material-frosted > span { background: radial-gradient(circle at 28% 35%, rgba(255,255,255,.3), transparent 4%), radial-gradient(circle at 66% 68%, rgba(255,255,255,.2), transparent 5%), linear-gradient(145deg, rgba(226,240,248,.58), rgba(89,124,158,.31)); filter: blur(.2px); }
.material-sable > span { background-image: radial-gradient(circle at 20% 20%, rgba(255,255,255,.42) 0 1px, transparent 1.5px), linear-gradient(145deg, rgba(216,232,240,.52), rgba(81,111,143,.31)); background-size: 8px 8px, auto; }
.material-decorative > span { background-image: repeating-linear-gradient(90deg, rgba(231,244,250,.4) 0 4px, rgba(68,111,154,.24) 4px 11px), linear-gradient(145deg, rgba(226,240,248,.5), rgba(71,108,145,.35)); }

.product-note { display: grid; grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr); align-items: stretch; overflow: hidden; margin-top: 20px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.025); }
.product-note > div { align-self: center; padding: 40px; }
.product-note h3 { margin-bottom: 14px; font-size: clamp(2rem, 3vw, 3.25rem); }
.product-note p { margin: 0; }
.product-note-media { display: block; margin: 0; border-left: 1px solid var(--line); background: #071127; }
.product-note-media img { width: 100%; height: 380px; object-fit: contain; background: #071127; }

.standalone-product { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014)); }
.standalone-product-copy { padding: 42px; }
.standalone-product-copy h3 { margin-bottom: 15px; font-size: clamp(2.3rem, 4vw, 4.5rem); }
.standalone-product-copy p { max-width: 760px; }
.standalone-product-copy .catalog-specs { max-width: 760px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.standalone-product-media { display: block; margin: 0; border-top: 1px solid var(--line); }
.standalone-product-media img { width: 100%; height: 560px; object-fit: cover; object-position: center 52%; }

.product-view-set { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--line); background: var(--line); }
.product-view { min-width: 0; margin: 0; background: #061024; }
.product-view > span { display: block; overflow: hidden; aspect-ratio: 3 / 2; background: #0a1730; }
.product-view img { display: block; width: 100%; height: 100%; object-fit: contain; }
.product-view figcaption { padding: 13px 16px; color: #dbe6f8; font: 600 10px/1.4 var(--mono); letter-spacing: .04em; }

.block-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.block-product { overflow: hidden; margin: 0; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.025); }
.block-product img { width: 100%; height: 340px; border: 0; border-radius: 0; object-fit: cover; }
.block-product figcaption { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; }
.block-product figcaption strong { color: #f1f5ff; font-size: 15px; font-weight: 620; }
.block-product figcaption span { color: #8fa3c4; font: 600 10px/1.35 var(--mono); }
.dimension-note { max-width: 830px; margin: 26px 0 0; color: #7f93b5; font-size: 12px; }

.design-page-header { background: radial-gradient(circle at 78% 45%, rgba(79,124,255,.2), transparent 28%), linear-gradient(145deg, #07132d, #020617); }
.design-feature-grid { display: grid; gap: 24px; }
.design-feature { display: grid; grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr); overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.025); }
.design-feature-reverse { grid-template-columns: minmax(0, 1.28fr) minmax(280px, .72fr); }
.design-feature-reverse .design-feature-copy { order: 2; }
.design-feature-copy { align-self: center; padding: 44px; }
.design-feature-copy > span { display: block; margin-bottom: 62px; color: var(--sapphire); font: 650 11px/1 var(--mono); }
.design-feature-copy h3 { margin-bottom: 15px; font-size: clamp(2.1rem, 3.6vw, 4rem); }
.design-feature-copy p { margin: 0; }
.design-feature-media { display: block; margin: 0; border-left: 1px solid var(--line); }
.design-feature-reverse .design-feature-media { border-right: 1px solid var(--line); border-left: 0; }
.design-feature-media img { width: 100%; height: 610px; object-fit: contain; object-position: center; background: #f1f1ee; }
.design-feature-media figcaption { padding: 13px 18px; color: #8fa3c4; background: #060f23; font: 600 10px/1.4 var(--mono); }

.design-card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.design-card { overflow: hidden; margin: 0; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.025); }
.design-card-wide { grid-column: 1 / -1; display: grid; grid-template-columns: 1.45fr .55fr; }
.design-card img { width: 100%; height: 560px; object-fit: contain; object-position: center; background: #071127; }
.design-card-wide img { height: 430px; }
.design-card figcaption { display: grid; gap: 5px; padding: 22px 24px; }
.design-card figcaption span { color: var(--sapphire); font: 650 9px/1.2 var(--mono); letter-spacing: .1em; }
.design-card figcaption strong { color: #eef4ff; font-size: 20px; font-weight: 600; }
.design-card figcaption small { color: #8398ba; font-size: 12px; }
.design-card-wide figcaption { align-content: center; }

.design-masonry { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.design-shot { overflow: hidden; margin: 0; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.025); }
.design-shot img { width: 100%; height: 310px; border: 0; border-radius: 0; object-fit: cover; }
.design-shot figcaption { display: grid; gap: 3px; padding: 17px 19px; }
.design-shot figcaption strong { color: #edf4ff; font-size: 15px; font-weight: 620; }
.design-shot figcaption span { color: #8398ba; font-size: 12px; }
.design-shot-wide { grid-column: span 2; }

@media (max-width: 1180px) {
  .catalog-grid-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-grid-three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-grid-three .catalog-card:last-child { grid-column: 1 / -1; }
}

@media (max-width: 980px) {
  .nav-toggle { display: block; }
  .nav-links { position: absolute; top: 100%; right: 0; left: 0; display: none; flex-direction: column; align-items: stretch; gap: 5px; padding: 18px 20px 22px; border-bottom: 1px solid var(--line); background: rgba(3, 9, 25,.98); box-shadow: 0 18px 40px rgba(0,0,0,.3); }
  .nav-links.open { display: flex; }
  .nav-links a { min-height: 44px; padding: 12px; }
  .nav-links .nav-cta { text-align: center; }
  .category-grid .category-tile:nth-child(n + 6) { grid-column: span 1; }
  .product-note, .design-feature, .design-feature-reverse { grid-template-columns: 1fr; }
  .design-feature-reverse .design-feature-copy { order: 0; }
  .product-note-media, .design-feature-media, .design-feature-reverse .design-feature-media { border: 0; border-top: 1px solid var(--line); }
  .block-product-grid, .design-masonry { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .design-shot-wide { grid-column: auto; }
}

@media (max-width: 680px) {
  .catalog-grid-four, .catalog-grid-three, .catalog-grid-two, .block-product-grid, .design-card-grid, .design-masonry { grid-template-columns: 1fr; }
  .catalog-grid-three .catalog-card:last-child, .design-card-wide { grid-column: auto; }
  .catalog-card-copy, .standalone-product-copy, .product-note > div, .design-feature-copy { padding: 28px 23px; }
  .catalog-card-media img { height: 280px; }
  .catalog-material { height: 250px; }
  .catalog-specs, .standalone-product-copy .catalog-specs { grid-template-columns: 1fr 1fr; }
  .standalone-product-media img { height: 360px; }
  .product-note-media img { height: 300px; }
  .block-product img { height: 310px; }
  .block-product figcaption { align-items: flex-start; flex-direction: column; gap: 5px; }
  .design-feature-copy > span { margin-bottom: 34px; }
  .design-feature-media img { height: 470px; }
  .design-card-wide { display: block; }
  .design-card img, .design-card-wide img { height: 430px; }
  .design-shot img { height: 290px; }
}

/* Clear home hierarchy and project archive — 30 September 2026 */
.heading-action { display: grid; justify-items: start; gap: 18px; max-width: 460px; }
.heading-action p { max-width: none; margin: 0; }

.home-about-grid { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: center; gap: 90px; }
.home-about-copy h2 { margin-bottom: 30px; }
.home-about-copy h2 em { color: #2459cb; }
.home-about-copy p { max-width: 610px; font-size: 17px; }
.home-about-copy .text-link { margin-top: 16px; }
.home-about-panel { overflow: hidden; border: 1px solid rgba(35,79,169,.18); border-radius: var(--radius-lg); background: #0a1731; box-shadow: 0 30px 80px rgba(15,39,91,.14); }
.home-about-panel-head { display: grid; gap: 4px; padding: 34px 38px; border-bottom: 1px solid var(--line); }
.home-about-panel-head .eyebrow { margin-bottom: 10px; }
.home-about-panel-head > strong { max-width: 650px; color: #edf4ff; font-size: 22px; font-weight: 570; line-height: 1.35; letter-spacing: -.025em; }
.home-service-list { margin: 0; padding: 0; list-style: none; }
.home-service-list li { display: grid; grid-template-columns: 42px 1fr; gap: 19px; padding: 24px 38px; border-bottom: 1px solid var(--line); }
.home-service-list li:last-child { border-bottom: 0; }
.home-service-list li > span { padding-top: 4px; color: var(--sapphire); font: 650 10px/1 var(--mono); }
.home-service-list strong { display: block; margin-bottom: 4px; color: #edf4ff; font-size: 16px; font-weight: 620; }
.home-service-list p { margin: 0; color: #94a8c9; font-size: 13px; }

.featured-products { border-bottom: 1px solid var(--line); }
.featured-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.featured-product-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014)); transition: transform .25s, border-color .25s, box-shadow .25s; }
.featured-product-card:hover { transform: translateY(-5px); border-color: rgba(79,124,255,.5); box-shadow: 0 26px 70px rgba(0,0,0,.2); }
.featured-product-media { height: 280px; overflow: hidden; border-bottom: 1px solid var(--line); background: #071127; }
.featured-product-media > img { width: 100%; height: 100%; padding: 12px; object-fit: contain; transition: transform .4s ease; }
.featured-product-card:hover .featured-product-media > img { transform: scale(1.02); }
.featured-product-media.material-visual { min-height: 0; }
.featured-product-copy { position: relative; min-height: 210px; padding: 28px; }
.featured-product-copy > span:not(.featured-product-link) { display: block; margin-bottom: 13px; color: var(--sapphire); font: 650 9px/1.2 var(--mono); letter-spacing: .12em; }
.featured-product-copy h3 { margin-bottom: 13px; font-size: clamp(1.7rem, 2.3vw, 2.5rem); }
.featured-product-copy p { margin: 0; font-size: 14px; }
.featured-product-link { display: flex; align-items: center; gap: 12px; margin-top: 20px; color: var(--sapphire-soft); font-size: 13px; font-weight: 600; }
.featured-product-link b { color: var(--sapphire); font-size: 17px; font-weight: 500; }

.home-projects { background: #08132c; }
.home-project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.home-project-card { overflow: hidden; margin: 0; border: 1px solid var(--line); border-radius: var(--radius-lg); background: #061024; }
.home-project-card img { width: 100%; aspect-ratio: 4 / 3; border: 0; object-fit: contain; background: #071127; }
.home-project-card figcaption { display: grid; gap: 6px; padding: 20px 23px; }
.home-project-card figcaption span { color: var(--sapphire); font: 650 9px/1.2 var(--mono); letter-spacing: .12em; }
.home-project-card figcaption strong { color: #edf4ff; font-size: 18px; font-weight: 600; }

.project-archive-grid .design-shot img { height: auto; aspect-ratio: 4 / 3; object-fit: contain; background: #071127; }
.legacy-redirect { display: grid; min-height: 100svh; place-items: center; text-align: center; }
.legacy-redirect .container { max-width: 760px; padding-block: 80px; }
.legacy-redirect h1 { margin-bottom: 20px; font-size: clamp(3.4rem, 8vw, 7rem); }
.legacy-redirect p { margin-bottom: 30px; font-size: 17px; }

/* Real workshop introduction — 1 October 2026 */
.home-page .hero { min-height: 0; background: #11191c; }
.hero-backdrop { position: absolute; inset: 0; pointer-events: none; }
.hero-backdrop img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 50%; filter: saturate(.8); }
.hero-backdrop::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,13,16,.92), rgba(7,13,16,.76) 40%, rgba(7,13,16,.18) 78%), linear-gradient(0deg, rgba(5,10,14,.65), transparent 60%); }
.home-page .hero-grid { opacity: .15; mask-image: linear-gradient(90deg, transparent, #000 58%); pointer-events: none; }
.home-page .hero-glow { display: none; }
.home-page .hero-bottom { position: relative; z-index: 1; }
.home-page .hero-inner { display: flex; min-height: 600px; padding: 64px 0 50px; }
.home-page .hero-copy { min-width: 0; width: 55%; max-width: 650px; }
.home-page .hero h1 { font-size: clamp(3.3rem, 5.8vw, 6.1rem); line-height: 1.04; margin-bottom: 24px; letter-spacing: -.055em; }
.home-page .hero h1 em { color: #8fb7ff; background: linear-gradient(105deg, #83baff, #a9c1ff 52%, #638eff); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.home-page .lead { max-width: 570px; font-size: clamp(1rem, 1.2vw, 1.15rem); }
.home-page .hero-actions { gap: 14px; margin-top: 30px; }
.hero-highlights { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 27px; }
.hero-highlights span { padding: 7px 12px; border: 1px solid var(--line); border-radius: 30px; color: #b9cbe8; background: rgba(169,200,255,.045); font-size: 11px; }
.home-page .pane-stage { width: 100%; height: 480px; margin: 0; border: 1px solid rgba(169,201,255,.24); border-radius: 26px; clip-path: inset(0 round 26px); background: radial-gradient(ellipse at 70% 24%, rgba(120,173,255,.2), transparent 57%), radial-gradient(ellipse at 50% 90%, rgba(55,108,230,.16), transparent 56%), linear-gradient(150deg, rgba(177,207,255,.055), rgba(7,16,37,.46)); box-shadow: inset 0 1px rgba(222,235,255,.1), 0 28px 75px rgba(0,0,0,.18); }
.home-page .glass-panes { inset: 23% 10% 20%; }
.home-page .glass-pane { width: 35%; height: 86%; }
.home-page .pane-clear { left: 0; }
.home-page .pane-smoke { left: 21%; }
.home-page .pane-bronze { left: 42%; }
.home-page .pane-texture { left: 63%; }
.home-page .hud-top { inset: 25px 27px auto; display: grid; gap: 7px; }
.home-page .hud-top > span { color: #c4d8f7; font-size: 10px; }
.home-page .hud-top strong { color: #819aba; font-size: 8px; font-weight: 500; letter-spacing: .08em; }
.home-page .stage-label { inset: auto 24px 20px; padding: 14px 18px; background: rgba(6,17,40,.68); }
.home-page .stage-label strong { font-size: 15px; }
.home-page .stage-orbit.orbit-a { inset: 30% 6% 12%; transform: rotate(-12deg) scaleY(.56); }
.home-page .stage-orbit.orbit-b { inset: 35% 17% 18%; transform: rotate(12deg) scaleY(.62); }
.home-page .featured-products { padding-block: 82px; }
.home-page .featured-product-copy { min-height: 230px; }

@media (max-width: 1180px) {
  .nav-links { gap: 19px; font-size: 12px; }
  .featured-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .home-about-grid { grid-template-columns: 1fr; gap: 50px; }
  .home-page .hero-inner { align-items: flex-start; padding-top: 42px; padding-bottom: 160px; }
  .home-page .hero-copy { width: 100%; max-width: 650px; }
  .home-page .pane-stage { width: min(100%, 600px); height: 400px; margin-inline: auto; }
}

@media (max-width: 680px) {
  .heading-action { gap: 14px; }
  .home-about-panel-head { padding: 28px 24px; }
  .home-service-list li { grid-template-columns: 32px 1fr; gap: 13px; padding: 21px 24px; }
  .featured-product-grid, .home-project-grid { grid-template-columns: 1fr; }
  .featured-product-media { height: 250px; }
  .featured-product-copy { min-height: 185px; padding: 25px 23px; }
  .home-project-card img { aspect-ratio: 4 / 3; }
  .home-page .hero-inner { min-height: 650px; padding: 24px 0 170px; }
  .home-page .hero h1 { font-size: clamp(2.6rem, 10.8vw, 4.3rem); margin-bottom: 18px; }
  .home-page .lead { line-height: 1.65; }
  .hero-backdrop img { object-position: 24% center; }
  .hero-backdrop::after { background: linear-gradient(180deg, rgba(7,13,16,.88), rgba(7,13,16,.79) 48%, rgba(7,13,16,.28) 75%, rgba(7,13,16,.65)); }
  .home-page .pane-stage { height: 280px; border-radius: 20px; clip-path: inset(0 round 20px); }
  .home-page .glass-panes { inset: 26% 10% 23%; }
  .home-page .glass-pane i { right: 7px; bottom: 10px; font-size: 8px; }
  .home-page .hud-top { inset: 18px 20px auto; }
  .home-page .stage-label { inset: auto 16px 13px; padding: 10px 13px; }
  .home-page .stage-label > span { font-size: 8px; }
  .home-page .stage-label strong { font-size: 13px; }
  .hero-highlights { gap: 7px; margin-top: 18px; }
  .hero-highlights span { padding: 6px 9px; font-size: 10px; }
  .home-page .hero-actions { flex-direction: row; flex-wrap: nowrap; gap: 10px; margin-top: 22px; }
  .home-page .hero-actions .btn { width: auto; flex: 1; min-width: 0; padding: 12px 10px; gap: 8px; font-size: 12px; }
  .home-page .hero-bottom { flex-wrap: wrap; gap: 16px; padding-block: 18px; line-height: 1.5; }
  .home-page .featured-products { padding-block: 58px; }
  .home-page .featured-product-copy { min-height: 0; }
}

/* Compact selection guide; homepage examples open an in-page preview. */
.selection-guide { padding-block: 58px; }
.selection-guide .section-head { margin-bottom: 30px; }
.selection-guide h2 { font-size: clamp(2rem, 3.6vw, 3.5rem); margin-bottom: 14px; }
.selection-guide .section-head p { font-size: 14px; }
.selection-guide .guide-card { display: flex; flex-direction: column; gap: 14px; padding: 24px; border-radius: 20px; }
.guide-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.selection-guide .guide-card-head h3 { margin: 0; font-size: 21px; }
.selection-guide .card-icon { margin: 0; font-size: 10px; }
.selection-guide .guide-card > p { margin: 0; min-height: 40px; font-size: 13px; line-height: 1.55; }
.guide-thickness-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.guide-thickness-options a { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 9px; border: 1px solid var(--line); border-radius: 8px; }
.guide-thickness-options i { display: block; width: 24px; height: var(--glass-mm); flex-shrink: 0; border: 1px solid rgba(202,236,232,.5); background: linear-gradient(#c6e6df, #3d7876); }
.guide-thickness-options strong, .guide-thickness-options small { display: block; }
.guide-thickness-options strong { font-size: 13px; }
.guide-thickness-options small { color: var(--muted); font-size: 10px; }
.guide-mini-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.guide-mini-row a { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.guide-material { display: block; position: relative; height: 72px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: linear-gradient(145deg, #15324b, #081323); }
.guide-material > span { position: absolute; inset: 11px 15%; border: 1px solid rgba(231,245,251,.6); border-radius: 3px; background: linear-gradient(145deg, rgba(232,244,250,.3), rgba(42,86,126,.15)); box-shadow: 4px 4px rgba(94,144,189,.15); }
.guide-material > span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.25) 43%, transparent 55%); }
.guide-material.material-bronze > span { background: linear-gradient(145deg, rgba(212,159,104,.6), rgba(78,44,24,.85)); }
.guide-material.material-smoke > span { background: linear-gradient(145deg, rgba(139,158,177,.5), rgba(24,35,49,.88)); }
.guide-material.material-frosted > span { background: linear-gradient(145deg, rgba(237,244,249,.8), rgba(158,183,201,.5)); }
.guide-material.material-sable > span { background: radial-gradient(circle, rgba(255,255,255,.5) 0 1px, transparent 1.5px), linear-gradient(145deg, rgba(216,232,240,.65), rgba(81,111,143,.45)); background-size: 4px 4px, auto; }
.selection-guide .guide-mini-row img { width: 100%; height: 72px; object-fit: contain; border: 1px solid var(--line); border-radius: 8px; background: #d7dce0; transform: none; }
.guide-mini-label { color: #d9e5f9; font-size: 11px; text-align: center; }
.guide-preview-note { color: #8fa3c4; font-size: 10px; line-height: 1.5; }
.guide-catalog-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); color: #ccddff; font-size: 12px; }
.guide-catalog-link span { color: var(--sapphire); }
.guide-thickness-options a:hover, .guide-mini-row a:hover .guide-material, .guide-mini-row a:hover img { border-color: var(--sapphire); }
@media (max-width: 900px) {
  .selection-guide .guide-grid { grid-template-columns: 1fr; }
  .selection-guide .guide-card { gap: 12px; padding: 20px; }
  .selection-guide .guide-card > p { min-height: 0; }
}

/* Show only the complete main panel of a catalogue collage, without stretching. */
.home-page .guide-thickness-options i { height: 30px; border-radius: 2px; background: linear-gradient(145deg, rgba(232,244,250,.3), rgba(42,86,126,.15)); }
.home-page .guide-material > span, .product-preview .guide-material > span { box-shadow: none; }
.home-page .featured-product-media.visual-clear::before, .home-page .featured-product-media.visual-clear::after { display: none; }
.home-page .featured-product-media.visual-clear > span { inset: 10% 28%; transform: none; }
.main-glass-photo { position: relative; display: block; height: 100%; aspect-ratio: 819 / 1024; overflow: hidden; }
.main-glass-photo-telli { aspect-ratio: 842 / 1024; }
.main-photo-media, .guide-photo { display: flex; justify-content: center; align-items: center; }
.guide-photo { height: 72px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #d7dce0; }
.home-page .main-glass-photo img, .product-preview .main-glass-photo img { position: absolute; top: 0; left: 0; width: auto; max-width: none; height: 100%; padding: 0; border: 0; border-radius: 0; object-fit: contain; transform: none; }
.guide-mini-row a:hover .guide-photo { border-color: var(--sapphire); }

.product-preview { width: min(460px, calc(100% - 32px)); max-height: calc(var(--ekran-h, 100dvh) - 32px); margin: auto; padding: 0; overflow: auto; border: 1px solid var(--line); border-radius: 20px; color: var(--ink); background: #0b172a; box-shadow: 0 24px 80px rgba(0,0,0,.5); }
.product-preview::backdrop { background: rgba(2,7,17,.75); backdrop-filter: blur(5px); }
.product-preview-panel { padding: 22px; }
.product-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.product-preview-heading > span { color: #9fb6d6; font-size: 10px; letter-spacing: .14em; }
.product-preview-close { width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.04); color: #fff; font-size: 26px; cursor: pointer; }
.product-preview h2 { margin: 8px 0 18px; font-size: 25px; }
.product-preview-media { display: flex; align-items: center; justify-content: center; height: min(260px, calc(var(--ekran-h, 100dvh) * .34)); overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: #13223a; }
.product-preview-media > .featured-product-media { width: 100%; height: 100%; padding: 0; }
.product-preview-media > .guide-material { width: 80%; height: 90%; border: 0; background: none; }
.product-preview-media > .guide-material > span { inset: 12px 15%; }
.product-preview-media .featured-product-media > img { width: 100%; height: 100%; padding: 10px; object-fit: contain; transform: none; }
.product-preview #product-preview-note { margin: 16px 0; color: #b0bfd6; font-size: 12px; line-height: 1.65; }
.product-preview-catalog { display: flex; width: 100%; font-size: 12px; }

/* Supplied four-panel material source: isolate each product without altering it. */
.sample-photo { --panel-left: 0; --panel-width: 380; --panel-height: 900; position: relative; display: block; height: 100%; aspect-ratio: var(--panel-width) / var(--panel-height); overflow: hidden; flex-shrink: 0; }
.sample-gul { --panel-left: 390; --panel-width: 371; }
.sample-mirror-smoke { --panel-left: 773; --panel-width: 381; }
.sample-mirror-bronze { --panel-left: 1165; --panel-width: 371; }
.sample-photo img, .selection-guide .sample-photo img, .product-preview .sample-photo img, .lightbox .sample-photo img { position: absolute; top: 0; left: calc(var(--panel-left) / var(--panel-width) * -100%); width: calc(1536 / var(--panel-width) * 100%); max-width: none; height: calc(1024 / var(--panel-height) * 100%); max-height: none; object-fit: fill; padding: 0; border: 0; border-radius: 0; transform: none; }
.sample-individual { aspect-ratio: var(--individual-ratio); }
.sample-individual img, .lightbox .sample-individual img, .product-preview .sample-individual img, .selection-guide .sample-individual img { left: 0; width: 100%; height: 100%; object-fit: contain; }
.selection-guide .guide-material, .selection-guide .guide-photo { height: 180px; }
.selection-guide .guide-material > span { inset: 15px 10%; }
.selection-guide .guide-mini-label { font-size: 12px; }
.selection-guide .guide-thickness-options i { width: 34px; height: 48px; border-radius: 3px; background: linear-gradient(145deg, rgba(232,244,250,.3), rgba(42,86,126,.15)); }
.selection-guide .guide-thickness-options a { min-height: 76px; }
.guide-photo { background: #10213a; }
.product-preview-media > .guide-photo { width: 100%; height: 100%; border: 0; }
.special-collage { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 8px; background: #071127; }
.special-cell { position: relative; display: grid; grid-template-rows: minmax(0, 1fr) auto; justify-items: center; align-items: stretch; min-width: 0; min-height: 0; overflow: hidden; border-radius: 6px; background: #15253c; }
.special-cell-label { width: 100%; padding: 5px 3px; text-align: center; background: rgba(3,9,22,.85); color: #f4f7ff; font-size: 10px; line-height: 1.3; }
.special-cell > .guide-material { width: 100%; height: 100%; border: 0; border-radius: 0; }
.special-cell > .guide-material > span { inset: 12px 22%; }
.product-preview-special { width: min(620px, calc(100% - 32px)); }
.product-preview-special .product-preview-media { height: min(380px, calc(var(--ekran-h, 100dvh) * .44)); }
.product-preview-special .special-cell-label { font-size: 12px; }
.product-preview-media > .special-collage { display: grid; padding: 8px; }
.featured-product-media.special-composite-media > img { padding: 0; transform: none; }
.product-preview-media > .special-composite-media > img { padding: 0; }
.category-wired .standalone-product { display: grid; width: min(100%, 1100px); margin-inline: auto; grid-template-columns: minmax(0, 1fr) minmax(0, 525px); align-items: center; }
.category-wired .standalone-product-copy { padding: 28px; }
.category-wired .standalone-product-copy h3 { font-size: clamp(28px, 3vw, 40px); }
.category-wired .product-view-set { border: 0; }
.category-wired .product-view > span { height: auto; max-height: none; aspect-ratio: 3 / 2; background: transparent; }
.category-wired .product-view img { width: 100%; height: 100%; border: 0; border-radius: 0; object-fit: contain; transform: none; filter: none; }
.product-view img, .sample-photo[role="button"] { cursor: zoom-in; }
.material-photo-media { display: grid; grid-template-rows: minmax(0, 1fr) auto; justify-items: center; align-items: stretch; height: 360px; margin: 0; padding-top: 12px; background: #0a1730; }
.material-photo-media > .sample-photo { height: 100%; }
.material-photo-media figcaption { width: 100%; margin: 0; }
.category-decorative .catalog-grid { align-items: start; }
.decorative-select-label { display: block; margin: 18px 0 8px; color: #dce8ff; font-size: 12px; }
#decorative-model { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 8px; background: #0b1930; color: var(--ink); font: inherit; font-size: 13px; }
.decorative-model-status { margin: 10px 0 18px; font-size: 12px; color: var(--sapphire-soft); }
.bizote-gallery .bizote-detail { grid-column: 1 / -1; }
.bizote-gallery:has(.bizote-detail) figure:nth-child(2) { transform: none; }
.bizote-gallery .bizote-detail img { height: 280px; object-fit: contain; }
.lightbox-visual { display: flex; justify-content: center; align-items: center; width: 90vw; height: calc(var(--ekran-h, 100vh) * .8); }
.lightbox-visual > img { max-width: 100%; max-height: 100%; }
.lightbox-visual > .sample-photo { height: 100%; }
@media (max-width: 900px) {
  .selection-guide .guide-material, .selection-guide .guide-photo, .selection-guide .guide-thumb { height: 150px; }
  .category-wired .standalone-product { width: min(100%, 390px); grid-template-columns: 1fr; }
  .category-wired .product-view-set { border-top: 1px solid var(--line); }
}

/* Neutral, image-sized previews: no coloured letterbox bands or forced cropping. */
.product-preview { background: #151515; border-color: rgba(255,255,255,.16); }
.product-preview::backdrop { background: rgba(0,0,0,.8); }
.product-preview-media { background: transparent; border-color: rgba(255,255,255,.12); }
.product-preview-photo .product-preview-media { position: relative; width: min(100%, calc(min(440px, calc(var(--ekran-h, 100dvh) * .52)) * var(--preview-ratio))); height: auto; aspect-ratio: var(--preview-ratio); margin-inline: auto; padding: 0; background: transparent; border: 0; border-radius: 6px; }
.product-preview-photo .product-preview-media > .featured-product-media, .product-preview-photo .product-preview-media > .guide-photo { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; background: transparent; }
.product-preview-photo .featured-product-media > img { padding: 0; }
.category-mirror .material-photo-media, .featured-product-media.mirror-matched-media { background: #e9e4de; }
.category-mirror .material-photo-media img { filter: none; }
.product-preview-special .product-preview-media { width: min(100%, 380px, calc(var(--ekran-h, 100dvh) * .44)); height: auto; aspect-ratio: 1; }
.lightbox { background: rgba(0,0,0,.94); }
.lightbox-visual { position: relative; width: min(1120px, calc(100vw - 104px), calc((var(--ekran-h, 100dvh) - 160px) * var(--lightbox-ratio, 1))); height: auto; aspect-ratio: var(--lightbox-ratio, 1); background: transparent; }
.lightbox-visual > img, .lightbox-visual > .sample-photo { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; border: 0; border-radius: 6px; background: transparent; }
.lightbox-visual > img { object-fit: contain; }
@media (max-width: 600px) {
  .lightbox-visual { width: min(calc(100vw - 84px), calc((var(--ekran-h, 100dvh) - 150px) * var(--lightbox-ratio, 1))); }
}

/* Keep the additional Cam Tuğla navigation tab comfortable on small laptops. */
/* Workshop portraits and bevel details: image-sized frames without blue bands. */
.projects-page #ayna-bizote .design-card-grid { grid-template-columns: repeat(2, minmax(0, 420px)); justify-content: center; gap: 24px; }
.projects-page #ayna-bizote .design-card img { display: block; width: 100%; height: auto; aspect-ratio: 1600 / 2133; object-fit: contain; background: transparent; transform: none; }
.bizote-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 1600 / 2133; object-fit: contain; background: transparent; filter: none; transform: none; }
.bizote-gallery .bizote-detail img { height: auto; aspect-ratio: 3 / 2; object-fit: contain; }
@media (max-width: 680px) {
  .projects-page #ayna-bizote .design-card-grid { grid-template-columns: minmax(0, 420px); }
}

/* Context fills mirror frames; preserve whole products, never stretch their edges. */
.sample-mirror-scene { --scene-index: 0; aspect-ratio: 1 / 1; }
.scene-smoke { --scene-index: 1; }
.scene-bronze { --scene-index: 2; }
.sample-mirror-scene img, .product-preview .sample-mirror-scene img, .lightbox .sample-mirror-scene img { left: calc(var(--scene-index) * -100%); width: 300%; height: 100%; filter: none; }
.category-mirror .material-photo-media { display: block; height: auto; padding: 0; }
.category-mirror .catalog-grid-three .catalog-card:last-child { grid-column: auto; }
.category-mirror .material-photo-media > .sample-photo { width: 100%; height: auto; }
.category-mirror .material-photo-media figcaption { min-height: 55px; }
.home-page .featured-product-media { height: auto; aspect-ratio: 1 / 1; }
.home-page .featured-product-media > img { padding: 0; transform: none; }
.mirror-matched-media > .sample-photo { width: 100%; height: 100%; }
/* Narrow decorative photographs receive narrow frames instead of coloured sidebars. */
.selection-guide .guide-photo { width: fit-content; max-width: 100%; margin-inline: auto; background: transparent; }
/* 05.10.2026: dar panel, buzlu/sable kartlarındaki ürün görselleriyle aynı yükseklikte görünsün diye genişletildi (eskiden 152px) */
.decorative-selector-card .material-photo-media { display: block; width: min(100%, 250px); height: auto; margin: 0 auto 22px; padding: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: transparent; }
.decorative-selector-card .material-photo-media > .sample-photo { width: 100%; height: auto; }
.decorative-selector-card .material-photo-media figcaption { text-align: center; padding: 10px 8px; }

/* 2026-10-02 Profesyonel / fütüristik yenileme: ana sayfa girişi, güven şeridi, atölye bölümü, kart ışıkları. */
.home-page .hero { display: flex; flex-direction: column; min-height: max(680px, calc(var(--ekran-h, 100svh) - 86px)); }
.home-page .hero-inner { flex: 1; align-items: center; min-height: 0; padding: 72px 0 48px; }
.home-page .hero h1 { font-size: clamp(3.4rem, 6.3vw, 6.8rem); }
.home-page .hero .eyebrow { font-size: 12px; }
.home-page .lead { color: #c9d4e8; }
.home-page .hero-backdrop { z-index: 0; isolation: isolate; }
.hero-sweep { z-index: 0; }
.home-page .hero-backdrop img { filter: saturate(.5) contrast(1.08) brightness(.92); }
.home-page .hero-backdrop::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(120deg, #1d3f9e, #0d2466 55%, #2a5bd8); mix-blend-mode: color; opacity: .55; }
.home-page .hero-backdrop::after { z-index: 2; }
.hero-sweep { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hero-sweep::before { content: ""; position: absolute; top: -20%; bottom: -20%; left: -40%; width: 26%; transform: skewX(-18deg); background: linear-gradient(100deg, transparent, rgba(140,180,255,.08) 40%, rgba(225,236,255,.16) 50%, rgba(140,180,255,.08) 60%, transparent); mix-blend-mode: screen; animation: hero-sweep 11s ease-in-out infinite 1.2s; }
@keyframes hero-sweep { 0% { left: -40%; } 55%, 100% { left: 130%; } }

.hero-stats-wrap { position: relative; z-index: 2; padding-bottom: 36px; }
.hero-stats { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; overflow: hidden; border: 1px solid rgba(189,210,255,.18); border-radius: 18px; background: rgba(6,14,36,.6); list-style: none; box-shadow: inset 0 1px rgba(255,255,255,.06), 0 24px 60px rgba(0,0,0,.25); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.hero-stats::before { content: ""; position: absolute; top: 0; left: 8%; right: 8%; height: 1px; background: linear-gradient(90deg, transparent, rgba(124,200,255,.8), transparent); }
.hero-stats li { display: grid; gap: 4px; padding: 22px 26px; border-right: 1px solid rgba(189,210,255,.12); }
.hero-stats li:last-child { border-right: 0; }
.hero-stats strong { color: var(--ink); font-size: clamp(1.25rem, 1.9vw, 1.7rem); font-weight: 600; line-height: 1.15; letter-spacing: -.025em; }
.hero-stats strong b { font-weight: inherit; }
.hero-stats span { color: #9fb0cf; font-size: 13.5px; line-height: 1.4; }

/* Okunabilirlik */
.home-page .section-head p { font-size: 17px; }
.home-page .guide-card p { font-size: 15px; color: #b3c1da; }
.home-page .featured-product-copy p { font-size: 15.5px; color: #b9c6de; }
.home-page .featured-product-copy > span:not(.featured-product-link) { font-size: 11px; }
.home-page .featured-product-link { font-size: 14px; }
.home-page .cta-band p { font-size: 17px; color: #c3cfe6; }
.footer-brand p { font-size: 14px; }
.footer-grid h4 { font-size: 13px; }
.footer-grid ul { gap: 12px; color: #a3b3cf; font-size: 14px; }
.footer-bottom { color: #8a9cbd; font-size: 11px; }

/* Cam ışığı: imleci izleyen parıltı ve üzerinden geçen yansıma */
.home-page .featured-product-card { position: relative; isolation: isolate; }
.home-page .featured-product-card::before { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; z-index: 3; width: 45%; transform: skewX(-18deg); background: linear-gradient(100deg, transparent, rgba(220,235,255,.12) 50%, transparent); pointer-events: none; opacity: 0; }
.home-page .featured-product-card:hover::before { opacity: 1; left: 130%; transition: left .9s ease, opacity .2s; }
.home-page .featured-product-card::after, .home-page .guide-card::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(110,160,255,.14), transparent 45%); pointer-events: none; opacity: 0; transition: opacity .3s; }
.home-page .featured-product-card:hover::after, .home-page .guide-card:hover::after { opacity: 1; }
.home-page .featured-product-card:hover, .home-page .guide-card:hover { border-color: rgba(110,160,255,.55); box-shadow: 0 0 0 1px rgba(79,124,255,.18), 0 30px 80px rgba(10,30,90,.45); }

/* Atölye işçiliği */
.workshop-section { position: relative; overflow: hidden; background: radial-gradient(circle at 18% 40%, rgba(79,124,255,.12), transparent 40%), var(--bg); }
.workshop-split { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: 84px; }
.workshop-media { position: relative; max-width: 500px; margin: 0; justify-self: center; }
.workshop-media::before { content: ""; position: absolute; inset: 22px -22px -22px 22px; border: 1px solid rgba(124,200,255,.22); border-radius: 26px; }
.workshop-media img { position: relative; width: 100%; height: auto; aspect-ratio: 1600 / 2133; border: 1px solid var(--line-strong); border-radius: 26px; object-fit: contain; box-shadow: 0 40px 90px rgba(0,0,0,.4); }
.workshop-media figcaption { position: absolute; left: 18px; bottom: 18px; display: grid; gap: 4px; padding: 12px 16px; border: 1px solid rgba(189,210,255,.2); border-radius: 12px; color: #e4edff; background: rgba(5,12,31,.72); font-size: 13px; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.workshop-media figcaption span { color: var(--blue); font: 650 10px/1 var(--mono); letter-spacing: .14em; }
.workshop-copy h2 { margin-bottom: 24px; font-size: clamp(2.5rem, 4.4vw, 4.6rem); }
.workshop-lead { max-width: 560px; color: #c3cfe6; font-size: 17px; }
.workshop-list { display: grid; margin: 34px 0 30px; padding: 0; list-style: none; }
.workshop-list li { display: grid; grid-template-columns: 54px 1fr; align-items: baseline; padding: 18px 0; border-top: 1px solid var(--line); }
.workshop-list li:last-child { border-bottom: 1px solid var(--line); }
.workshop-list li > span { color: var(--sapphire); font: 650 12px/1 var(--mono); }
.workshop-list strong { display: block; color: var(--ink); font-size: 19px; font-weight: 600; }
.workshop-list small { display: block; margin-top: 3px; color: var(--muted); font-size: 15px; }

/* Ortam ve ürün fotoğrafları (bronz, füme, buzlu toprak): küçük karede cama odaklı, katalogda tam oran. */
.selection-guide .guide-photo.guide-scene { width: 100%; background: #0b1730; }
.selection-guide .guide-mini-row .guide-photo { width: 100%; }
.selection-guide .guide-mini-row .guide-photo > .sample-photo { width: 100%; height: auto; }
.selection-guide .guide-mini-row .guide-scene img { width: 100%; height: 100%; border: 0; border-radius: 0; object-fit: cover; object-position: var(--focus-x, 50%) 50%; background: transparent; transition: transform .5s ease; }
.selection-guide .guide-mini-row a:hover .guide-scene img { transform: scale(1.06); }
.product-preview .guide-scene img { width: 100%; height: 100%; object-fit: contain; }
/* Kalınlık: dört uzun kare, camın kenarına odaklı (kalınlık farkı kenarda görünür). */
.selection-guide .guide-thickness-options { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.selection-guide .guide-thickness-options a { flex-direction: column; align-items: stretch; gap: 8px; min-height: 0; padding: 0; border: 0; text-align: center; }
.guide-thumb { display: block; height: 180px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #c4c6ca; transition: border-color .2s; }
.guide-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: 72% 50%; transition: transform .5s ease; }
.guide-thickness-options a:hover .guide-thumb { border-color: var(--sapphire); }
.guide-thickness-options a:hover .guide-thumb img { transform: scale(1.06); }
.selection-guide .guide-thickness-options strong { font-size: 13.5px; }
.selection-guide .guide-thickness-options small { display: none; }
.product-preview-photo .product-preview-media > .guide-thumb { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: transparent; }
.product-preview-media > .guide-thumb img, .product-preview .guide-scene img { object-fit: contain; object-position: center; transform: none; }
/* Düz Cam öne çıkan kartı: stüdyo fotoğrafı, yanlar fotoğrafın gri fonuyla birleşir. */
.home-page .featured-product-media.studio-media { background: linear-gradient(90deg, #d3d4d7, #c2c4c8); }
.home-page .featured-product-media.studio-media > img { object-fit: contain; }
.catalog-card-media.scene-media { background: transparent; }
.catalog-card-media.scene-media img { height: auto; aspect-ratio: 880 / 1168; object-fit: cover; background: transparent; filter: none; }
#renkli-boyali .catalog-grid, #dekoratif .catalog-grid { align-items: start; }

@media (max-width: 1100px) {
  .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-stats li:nth-child(2) { border-right: 0; }
  .hero-stats li:nth-child(-n + 2) { border-bottom: 1px solid rgba(189,210,255,.12); }
}
@media (max-width: 900px) {
  .workshop-split { grid-template-columns: 1fr; gap: 56px; }
  .workshop-media { max-width: 440px; }
  .workshop-copy { order: -1; }
}
@media (max-width: 680px) {
  .home-page .hero-inner { min-height: 0; padding: 32px 0 150px; }
  .hero-stats-wrap { padding-bottom: 24px; }
  .hero-stats li { padding: 16px 16px; }
  .hero-stats span { font-size: 12.5px; }
  .workshop-media::before { inset: 14px -10px -14px 10px; }
  .workshop-list strong { font-size: 17px; }
  .workshop-list small { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-sweep::before { animation: none; display: none; }
  .home-page .featured-product-card:hover::before { transition: none; opacity: 0; }
}

/* 2026-10-02 İç sayfalar: ana sayfayla aynı dil. */
/* Sayfa başlıkları: sağda safir tonlu konu fotoğrafı, geçen ışık, parlayan alt çizgi. */
.page-header { isolation: isolate; }
.page-header.has-photo::after { display: none; }
.page-header-photo { position: absolute; top: 0; right: 0; bottom: 0; z-index: 0; width: 62%; background-position: center; background-size: cover; background-repeat: no-repeat; filter: grayscale(1) contrast(1.12); mix-blend-mode: luminosity; opacity: .5; pointer-events: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 60%); mask-image: linear-gradient(90deg, transparent, #000 60%); }
.page-header .hero-sweep { z-index: 1; }
.page-header .hero-sweep::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(124,200,255,.75), transparent); }
.page-header .container { z-index: 2; }
.page-header h1 { text-shadow: 0 2px 30px rgba(2,5,16,.6); }
.page-header p { color: #c3cfe6; }
.subnav a { font-size: 13px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background: rgba(6,14,36,.45); }

/* Kart ışığı: imleci izleyen parıltı (JS .glow-card ekler). */
.glow-card { position: relative; isolation: isolate; }
.glow-card::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(110,160,255,.13), transparent 45%); pointer-events: none; opacity: 0; transition: opacity .3s; }
.glow-card:hover::after { opacity: 1; }
.catalog-card, .design-shot, .design-card { transition: transform .25s, border-color .25s, box-shadow .25s; }
.catalog-card:hover, .design-shot:hover, .design-card:hover, .service-grid .feature-card:hover, .contact-info .card:hover { border-color: rgba(110,160,255,.5); box-shadow: 0 0 0 1px rgba(79,124,255,.14), 0 28px 70px rgba(10,30,90,.4); }

/* Okunabilirlik */
.eyebrow { font-size: 12px; }
.section-head p { font-size: 17px; }
.catalog-card-copy p { font-size: 15.5px; color: #b9c6de; }
.catalog-specs dt { color: #8a9fc2; font-size: 10.5px; }
.catalog-specs dd { font-size: 14px; }
.catalog-card-media figcaption, .standalone-product-media figcaption, .product-note-media figcaption { color: #a3b3cf; font-size: 11px; }
.design-shot figcaption strong { font-size: 16.5px; }
.design-shot figcaption span, .design-card figcaption small { color: #a0b0cc; font-size: 13.5px; }
.contact-info p { font-size: 15px; }
.home-page .guide-preview-note { font-size: 11.5px; }

/* Projeler: düzenli 3×3 ızgara; eski fotoğraflardaki tarih damgası (alt şerit) kadraj dışında. */
.project-archive-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.project-archive-grid .design-shot-wide { grid-column: auto; }
.project-archive-grid .design-shot img { height: auto; aspect-ratio: 5 / 3; object-fit: cover; object-position: center top; background: #071127; transition: transform .5s ease; }
.project-archive-grid .design-shot:hover img { transform: scale(1.04); }

/* Hizmetler: son kart satırda yalnız kalırsa tam genişlikte vurgulu kart olur. */
.service-grid .feature-card:last-child:nth-child(3n + 1) { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 0 36px; border-color: rgba(79,124,255,.35); background: radial-gradient(circle at 90% 50%, rgba(79,124,255,.16), transparent 45%), linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); }
.service-grid .feature-card:last-child:nth-child(3n + 1) > * { grid-column: 2; }
.service-grid .feature-card:last-child:nth-child(3n + 1) > .card-icon { grid-column: 1; grid-row: 1 / span 3; margin: 0; font-size: 2.4rem; opacity: .9; }

@media (min-width: 981px) {
  .contact-info { position: sticky; top: 110px; }
}
/* İletişim bantları kaldırılan sayfalarda son bölüm ile altbilgi arasında çift boşluk kalmasın. */
main:has(> .section:last-child) + .site-footer { margin-top: 0; }

/* Hakkımızda: güven bilgileri 2×2. */
.about-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); align-self: center; }
.about-stats li { padding: 30px 28px; border-bottom: 1px solid rgba(189,210,255,.12); }
.about-stats li:nth-child(2n) { border-right: 0; }
.about-stats li:nth-child(n + 3) { border-bottom: 0; }
.about-stats strong { font-size: clamp(1.5rem, 2.4vw, 2.1rem); }
.timeline li::before { box-shadow: 0 0 0 5px rgba(79,124,255,.12), 0 0 20px rgba(79,124,255,.7); }

@media (max-width: 980px) {
  .project-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 780px) {
  .page-header-photo { width: 100%; opacity: .28; -webkit-mask-image: linear-gradient(180deg, transparent, #000 70%); mask-image: linear-gradient(180deg, transparent, #000 70%); }
  .service-grid .feature-card:last-child:nth-child(3n + 1) { display: block; }
}
@media (max-width: 680px) {
  #sable-cam .catalog-specs > div:last-child { grid-column: 1 / -1; }
  .project-archive-grid { grid-template-columns: 1fr; }
  .about-stats li { padding: 18px 16px; }
}

@media (min-width: 1261px) {
  .nav-links { gap: 22px; }
}
@media (max-width: 1260px) {
  .nav-toggle { display: block; }
  .nav-links { position: absolute; top: 100%; right: 0; left: 0; display: none; flex-direction: column; align-items: stretch; gap: 5px; padding: 18px 20px 22px; border-bottom: 1px solid var(--line); background: rgba(3,9,25,.98); box-shadow: 0 18px 40px rgba(0,0,0,.3); }
  .nav-links.open { display: flex; }
  .nav-links a { min-height: 44px; padding: 12px; }
  .nav-links .nav-cta { text-align: center; }
}

/* İşçilik galerileri (Hizmetler: rodaj, CNC kanal) — 05.10.2026; görseller kırpılmadan doğal oranında */
.craft-section { overflow: hidden; }
.craft-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: end; margin-bottom: 44px; }
.craft-head h2 { margin-bottom: 0; }
.craft-head p { font-size: 16px; }
.craft-head .text-link { margin-right: 28px; }
.craft-note, .craft-head .craft-note { margin: 18px 0 0; color: var(--muted); font-size: 12px; opacity: .8; }
.craft-head .craft-lead { color: var(--ink); font-size: clamp(1.05rem, 1.4vw, 1.22rem); line-height: 1.7; }
/* sabit satırlar (.craft-row): her figure en/boy oranı (--r) kadar büyür, böylece satırdaki görseller eşit yükseklikte ve satır tam genişlikte olur */
.craft-gallery { display: flex; flex-direction: column; gap: 22px; }
.craft-row { display: flex; gap: 18px; align-items: flex-start; }
.craft-row figure { flex: var(--r) 1 0; min-width: 0; margin: 0; }
.craft-gallery img { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: initial; border-radius: var(--radius); filter: none; cursor: zoom-in; }
.craft-gallery img:hover { filter: brightness(1.06); }
.craft-gallery figcaption { display: flex; gap: 12px; padding: 12px 4px 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.craft-gallery figcaption span { flex: 0 0 auto; color: var(--sapphire); font: 650 11px/1.7 var(--mono); }
@media (max-width: 980px) {
  .craft-head { grid-template-columns: 1fr; gap: 18px; }
  .craft-row { gap: 12px; }
}
@media (max-width: 560px) {
  /* telefon: 2 sütun; yatay görseller (.genis) tam genişlik */
  .craft-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 12px; align-items: start; }
  .craft-row { display: contents; }
  .craft-gallery figure.genis { grid-column: 1 / -1; }
  .craft-gallery figcaption { gap: 8px; font-size: 12px; }
}

/* Ana sayfa atölye işçiliği kolajı (05.10.2026): bizote solda boylu boyunca, rodaj ve CNC kanal sağda üst üste; her kare ilgili hizmet bölümüne gider */
.workshop-mosaic { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; width: 100%; aspect-ratio: 4 / 5; }
.workshop-mosaic .mosaic-tile { position: relative; display: block; min-height: 0; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 20px; box-shadow: 0 30px 70px rgba(0,0,0,.35); }
.workshop-mosaic .mosaic-tall { grid-row: 1 / 3; }
.workshop-mosaic .mosaic-tile img { width: 100%; height: 100%; aspect-ratio: auto; border: 0; border-radius: 0; object-fit: cover; box-shadow: none; transition: transform .5s ease; }
.workshop-mosaic .mosaic-tile:hover img, .workshop-mosaic .mosaic-tile:focus-visible img { transform: scale(1.04); }
.workshop-mosaic .mosaic-tile > span { position: absolute; top: 12px; left: 12px; padding: 6px 10px; border: 1px solid rgba(189,210,255,.22); border-radius: 999px; color: #e4edff; background: rgba(5,12,31,.66); font: 650 11px/1 var(--mono); letter-spacing: .08em; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.workshop-mosaic figcaption { z-index: 1; max-width: calc(50% - 30px); }
.workshop-list strong a { color: inherit; text-decoration: none; }
.workshop-list strong a:hover, .workshop-list strong a:focus-visible { color: var(--sapphire-soft); }
@media (prefers-reduced-motion: reduce) { .workshop-mosaic .mosaic-tile img { transition: none; } }

/* Ana sayfa girişi: dönen proje görselleri (05.10.2026). Mavi boyama hafifletildi, ürünlerin gerçek rengi görünür. */
.home-page .hero-backdrop .hero-slide { position: absolute; inset: 0; opacity: 0; object-position: var(--odak-x, 50%) center; transform: scale(1.06); transition: opacity 1.4s ease, transform 1.4s ease; filter: saturate(.92) brightness(.88); }
.home-page .hero-backdrop .hero-slide.is-active { opacity: 1; transform: scale(1); transition: opacity 1.4s ease, transform 7s ease-out; }
.home-page .hero-backdrop::before { opacity: .16; }
@media (prefers-reduced-motion: reduce) {
  .home-page .hero-backdrop .hero-slide { transition: none; transform: none; }
}
.workshop-links { display: flex; flex-wrap: wrap; gap: 14px 28px; }
.cta-band .cta-hours { margin-top: 10px; font-size: 14px; color: var(--muted); }

/* Cam Tuğla: Trendyol mağazasına online sipariş bandı (05.10.2026) */
.online-order { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; margin-top: 34px; padding: 24px 28px; border: 1px solid var(--line-strong); border-radius: var(--radius); background: linear-gradient(120deg, rgba(79,124,255,.12), rgba(255,255,255,.02)); }
.online-order strong { display: block; color: var(--ink); font-size: 20px; font-weight: 600; }
.online-order span { color: var(--muted); font-size: 15px; }

/* WhatsApp (05.10.2026): tüm sayfalarda sağ altta yüzen buton; İletişim formunda iki kanal */
.wa-float { position: fixed; right: 20px; bottom: 20px; z-index: 60; display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px 12px 14px; border-radius: 999px; color: #fff; background: #1faa59; box-shadow: 0 12px 30px rgba(0,0,0,.35); font-weight: 600; font-size: 15px; text-decoration: none; transition: transform .2s, background .2s; }
.wa-float svg { width: 24px; height: 24px; }
.wa-float:hover, .wa-float:focus-visible { background: #179a4e; transform: translateY(-2px); color: #fff; }
.wa-link { color: #4fd18b; }
.form-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.form-field label small { color: var(--muted); font-weight: 400; }
body:has(dialog[open]) .wa-float, body:has(.lightbox.open) .wa-float, body:has(.nav-links.open) .wa-float { display: none; }
@media (max-width: 560px) {
  .wa-float { right: 14px; bottom: 14px; padding: 13px; }
  .wa-float span { display: none; }
}
@media (prefers-reduced-motion: reduce) { .wa-float { transition: none; } }

/* 07.10.2026: uzamış önizleme çerçevesinde (iframe) pencereler dokunulan öğenin hizasında, bir ekran boyunda açılır (main.js pencereyiHizala). */
.lightbox.cerceve-hizali { position: absolute; top: var(--hiza-ust); bottom: auto; height: var(--ekran-h); }
.product-preview.cerceve-hizali { position: absolute; top: var(--hiza-ust); bottom: auto; margin: 16px auto 0; }
/* 07.10.2026: tek görselli büyütmede (katalog kartları) geçiş okları yok (main.js .lightbox-tek). */
.lightbox-tek .lightbox-prev, .lightbox-tek .lightbox-next { display: none; }
/* Telefonda oklar görselin üstüne binmesin: görsel neredeyse tam genişlik, oklar altta açıklamanın iki yanında. */
@media (max-width: 600px) {
  .lightbox { padding: 72px 16px 84px; }
  .lightbox-visual { width: min(calc(100vw - 32px), calc((var(--ekran-h, 100dvh) - 170px) * var(--lightbox-ratio, 1))); }
  .lightbox-prev, .lightbox-next { top: auto; bottom: 18px; }
  .lightbox-prev { left: 16px; }
  .lightbox-next { right: 16px; }
  .lightbox-caption { right: 74px; bottom: 22px; left: 74px; }
  .lightbox-tek .lightbox-caption { right: 16px; left: 16px; }
}
/* Telefonda düzcam kalınlıkları yan yana (2×2): görsel üstte, kısa metin altta; mm farkı tek bakışta. */
@media (max-width: 680px) {
  #cam .catalog-grid-four { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #cam .catalog-card-media { order: -1; border-top: 0; }
  #cam .catalog-card-media figcaption, #cam .catalog-card-copy .eyebrow, #cam .catalog-specs { display: none; }
  #cam .catalog-card-copy { padding: 14px 13px 16px; }
  #cam .catalog-card-copy h3 { margin-bottom: 6px; font-size: 1.2rem; }
  #cam .catalog-card-copy p { margin: 0; font-size: 13px; line-height: 1.5; }
}
/* 07.10.2026: ana sayfa rehber önizlemesinde aynı kart içindeki seçenekler arasında geçiş (kalınlık / renk / doku). */
.product-preview-nav { display: none; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; }
.product-preview-grouped .product-preview-nav { display: flex; }
.product-preview-nav button { width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.04); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
.product-preview-nav button:hover, .product-preview-nav button:focus-visible { border-color: var(--sapphire); color: var(--sapphire); }
.product-preview-count { color: #9fb6d6; font: 600 11px/1 var(--mono); letter-spacing: .08em; }
.product-preview-media { touch-action: pan-y; }
/* 07.10.2026: dikey ekranlarda (telefon, dik tablet) giriş arka planı ayrı kurgulanmış 9:16 görsellerden gelir (<picture>, *-dikey.jpg);
   ürün ortada durduğu için yatay odak (--odak-x) kullanılmaz. */
@media (max-aspect-ratio: 3/4) {
  .home-page .hero-backdrop .hero-slide, .hero-backdrop img { object-position: center center; }
}
/* Telefonda (dikey, ≤680 px): 9:16 görsel tam genişlikte, kırpılmadan arka planda durur. Görseldeki ürün bandı (yüksekliğin ~%40–88'i)
   yazı ile istatistik kartı arasındaki pencereye denk gelir: görsel yüksekliği 100vw × 16/9; pencere ≈ ürün bandı + pay. */
@media (max-width: 680px) and (max-aspect-ratio: 3/4) {
  .home-page .hero-inner { padding-bottom: calc(85vw + 30px); }
  .home-page .hero-backdrop .hero-slide { top: auto; bottom: calc(248px - 21.3vw); height: auto; aspect-ratio: 9 / 16; -webkit-mask-image: linear-gradient(180deg, transparent, #000 24%, #000 88%, transparent); mask-image: linear-gradient(180deg, transparent, #000 24%, #000 88%, transparent); }
  .home-page .hero-backdrop::after { background: linear-gradient(180deg, rgba(7,13,16,.9), rgba(7,13,16,.84) 40%, rgba(7,13,16,.14) 51%, rgba(7,13,16,.06) 72%, rgba(7,13,16,.7)); }
}
/* 07.10.2026: firma logosu — iç içe iki baklava işareti (SVG, logo_hazirla.py ölçüleri) + Montserrat "MERSİN / CAM İŞLEME". Koyu menüde beyaz. */
.brand { gap: 13px; font-family: "Montserrat", var(--font); font-weight: 800; letter-spacing: .05em; }
.brand-sub { margin-top: 5px; color: #c9d6ee; font: 650 9.5px/1 "Montserrat", var(--font); letter-spacing: .3em; }
svg.brand-mark { width: 48px; height: 35px; flex: none; border: 0; transform: none; background: none; box-shadow: none; fill: none; stroke: #f4f7ff; stroke-width: 6; stroke-linejoin: miter; overflow: visible; }
svg.brand-mark::after { content: none; }
@media (max-width: 480px) { svg.brand-mark { width: 42px; height: 31px; } }