/* Route-scoped LUMORA interior-door configurator styles. */
/* Unutrašnja vrata — kompletan champagne studio u dnevnom režimu. */
html[data-theme="day"] .lumora-interior-config-section {
  background:linear-gradient(180deg,#eee6da 0%,#f6f1e8 46%,#ebe2d5 100%) !important;
}
html[data-theme="day"] .idc {
  --idc-bg:#f4efe6;
  --idc-panel:#fbf8f2;
  --idc-panel-hi:#e9dfcf;
  --idc-line:rgba(54,47,39,.16);
  --idc-muted:#626a75;
  --idc-gold:#a9834c;
  --idc-gold-hi:#7f6033;
  border-color:rgba(169,131,76,.28);
  background:var(--idc-bg);
  color:#1b1f26;
  box-shadow:0 38px 100px rgba(62,47,29,.13);
}
html[data-theme="day"] .idc::before {
  background-image:linear-gradient(rgba(72,59,43,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(72,59,43,.045) 1px,transparent 1px);
}
html[data-theme="day"] .idc-header {
  background:radial-gradient(760px 300px at 24% 20%,rgba(169,131,76,.13),transparent 72%),linear-gradient(115deg,#fbf8f2,#eee6da);
}
html[data-theme="day"] .idc-header :is(h1,h2) { color:#1d2128; }
html[data-theme="day"] .idc-header > div > p:last-child,
html[data-theme="day"] .idc-header dd { color:#5e6570; }
html[data-theme="day"] .idc-collection-switch { background:#e9dfcf; }
html[data-theme="day"] .idc-collection-switch button {
  background:linear-gradient(115deg,#fbf8f2,#eee6da);
  color:#555d68;
}
html[data-theme="day"] .idc-collection-switch button:hover,
html[data-theme="day"] .idc-collection-switch button.is-active {
  background:radial-gradient(circle at 20% 50%,rgba(169,131,76,.16),transparent 40%),linear-gradient(115deg,#fffdf8,#e7dac7);
  color:#6f522c;
}
html[data-theme="day"] .idc-collection-switch small { color:#6c737d; }
html[data-theme="day"] .idc-controls,
html[data-theme="day"] .idc-specification {
  background:linear-gradient(160deg,rgba(251,248,242,.99),rgba(235,226,212,.99));
}
html[data-theme="day"] .idc-controls h3 { color:#22262d; }
html[data-theme="day"] .idc-swatch-grid button {
  background:rgba(255,252,247,.78);
  color:#626872;
}
html[data-theme="day"] .idc-swatch-grid button:hover,
html[data-theme="day"] .idc-swatch-grid button.is-active { color:#6f522c; }
html[data-theme="day"] .idc-swatch-grid i { border-color:rgba(54,47,39,.14); }
html[data-theme="day"] .idc-hardware-grid button { background:#f9f5ed; }
html[data-theme="day"] .idc-hardware-grid button:hover,
html[data-theme="day"] .idc-hardware-grid button.is-active { background:#e9dece; }
html[data-theme="day"] .idc-hardware-grid .idc-hardware-expand { border-color:rgba(151,111,55,.58); background:radial-gradient(circle at 20% 18%,rgba(255,255,255,.74),transparent 34%),repeating-linear-gradient(102deg,rgba(151,111,55,.028) 0 1px,transparent 1px 8px),linear-gradient(145deg,#f7efe1,#dbc29a); box-shadow:0 14px 30px -18px rgba(77,55,27,.55),inset 0 0 0 1px rgba(255,255,255,.58); color:#182238; }
html[data-theme="day"] .idc-hardware-grid .idc-hardware-expand:hover { border-color:rgba(119,80,31,.88); background:radial-gradient(circle at 20% 18%,rgba(255,255,255,.82),transparent 34%),linear-gradient(145deg,#fff8eb,#d6ba8e); box-shadow:0 18px 34px -17px rgba(77,55,27,.56),0 0 22px rgba(169,131,76,.2),inset 0 0 0 1px rgba(255,255,255,.72); }
html[data-theme="day"] .idc-hardware-grid .idc-hardware-expand::before { border-color:rgba(126,87,38,.22); box-shadow:inset 0 0 14px rgba(255,255,255,.4); }
html[data-theme="day"] .idc-hardware-expand > span > b { border-color:rgba(99,67,28,.58); background:linear-gradient(145deg,rgba(255,255,255,.46),rgba(171,124,66,.2)); box-shadow:7px 5px 0 -3px rgba(111,73,29,.13),0 8px 16px rgba(83,57,25,.18),inset 0 0 0 3px rgba(255,250,238,.22); }
html[data-theme="day"] .idc-hardware-expand > span > b::before { border-color:rgba(100,67,27,.18); }
html[data-theme="day"] .idc-hardware-expand > span > b::after { background:#76512a; box-shadow:0 0 7px rgba(118,81,42,.28); }
html[data-theme="day"] .idc-hardware-expand > span > i { border-color:rgba(99,67,28,.55); background:linear-gradient(90deg,#77522c,#c49a61 48%,#81592f); box-shadow:0 5px 10px rgba(83,57,25,.22),0 0 10px rgba(169,131,76,.16); }
html[data-theme="day"] .idc-hardware-expand > span > i::before,
html[data-theme="day"] .idc-hardware-expand > span > i::after { background:linear-gradient(90deg,#b98d55,#6f4b27); }
html[data-theme="day"] .idc-hardware-expand > span > strong { border-color:rgba(100,67,27,.58); background:#f8f0e2; color:#755129; box-shadow:0 0 14px rgba(135,95,43,.22); }
html[data-theme="day"] .idc-hardware-grid .idc-hardware-expand > em { color:#0b162b; text-shadow:0 1px 0 rgba(255,255,255,.5); }
html[data-theme="day"] .idc-hardware-grid .idc-hardware-expand > small { color:#684c2b; }
html[data-theme="day"] .idc-hardware-grid .idc-hardware-expand.is-active,
html[data-theme="day"] .idc-decor-grid .idc-decor-expand.is-active { border-color:rgba(119,80,31,.92); background:radial-gradient(circle at 20% 18%,rgba(255,255,255,.9),transparent 36%),linear-gradient(145deg,#fff8eb,#cfaa73); box-shadow:0 18px 38px -17px rgba(77,55,27,.58),0 0 25px rgba(140,97,43,.28),inset 0 0 0 1px rgba(255,255,255,.78); color:#111a2c; }
html[data-theme="day"] .idc-selected-decor span { color:#6b727c; }
html[data-theme="day"] .idc-selected-decor strong { color:#71552f; }
html[data-theme="day"] .idc-decor-grid button { background:rgba(255,252,247,.82); color:#626872; }
html[data-theme="day"] .idc-decor-grid button:hover,
html[data-theme="day"] .idc-decor-grid button.is-active { color:#6f522c; }
html[data-theme="day"] .idc-decor-grid .idc-decor-expand { border-color:rgba(151,111,55,.58); background:radial-gradient(circle at 20% 18%,rgba(255,255,255,.72),transparent 34%),repeating-linear-gradient(102deg,rgba(151,111,55,.028) 0 1px,transparent 1px 8px),linear-gradient(145deg,#f7efe1,#dbc29a); box-shadow:0 14px 30px -18px rgba(77,55,27,.55),inset 0 0 0 1px rgba(255,255,255,.55); color:#182238; }
html[data-theme="day"] .idc-decor-grid .idc-decor-expand:hover { border-color:rgba(119,80,31,.88); box-shadow:0 18px 34px -17px rgba(77,55,27,.56),0 0 22px rgba(169,131,76,.2),inset 0 0 0 1px rgba(255,255,255,.72); color:#111a2c; }
html[data-theme="day"] .idc-decor-grid .idc-decor-expand::before { border-color:rgba(126,87,38,.22); box-shadow:inset 0 0 14px rgba(255,255,255,.38); }
html[data-theme="day"] .idc-decor-grid .idc-decor-expand > span { border-color:rgba(111,73,29,.48); background:linear-gradient(110deg,#9a7044,#d4b077); box-shadow:5px 4px 0 -1px rgba(111,73,29,.13),-5px -4px 0 -1px rgba(255,255,255,.44),0 8px 17px rgba(83,57,25,.2); }
html[data-theme="day"] .idc-decor-grid .idc-decor-expand > b { color:#0b162b; text-shadow:0 1px 0 rgba(255,255,255,.48); }
html[data-theme="day"] .idc-decor-grid .idc-decor-expand > small { color:#684c2b; }
html[data-theme="day"] .idc-stage {
  --idc-floor-line:rgba(140,106,60,.42);
  --idc-floor-near:#dcd1bf;
  --idc-floor-far:#e8e0d3;
  --idc-contact:rgba(58,40,18,.4);
  background:radial-gradient(60% 52% at 50% 36%,rgba(255,253,248,.72),transparent 76%),linear-gradient(180deg,#f4eee4,#e9e0d1);
}
html[data-theme="day"] .idc-stage::before {
  background:linear-gradient(90deg,rgba(93,75,53,.11),transparent 15%,transparent 85%,rgba(93,75,53,.1));
}
html[data-theme="day"] .idc-stage-label strong { color:#59616d; }
html[data-theme="day"] .idc-visual-pending { border-color:rgba(169,131,76,.4); background:radial-gradient(circle at 50% 42%,rgba(169,131,76,.15),transparent 30%),linear-gradient(145deg,rgba(255,253,248,.96),rgba(226,215,198,.96)); box-shadow:0 28px 60px rgba(72,55,34,.14),inset 0 0 0 1px rgba(255,255,255,.45); }
html[data-theme="day"] .idc-visual-pending strong { color:#6f522c; }
html[data-theme="day"] .idc-visual-pending span { color:#646b75; }
html[data-theme="day"] .idc-loupe > span { color:#71552f; }
html[data-theme="day"] .idc-specification header > p { color:#6a717c; }
html[data-theme="day"] .idc-specification h3 { color:#20242b; }
html[data-theme="day"] .idc-specification dt { color:#30353d; }
html[data-theme="day"] .idc-specification dd,
html[data-theme="day"] .idc-technical-note { color:#626a75; }
html[data-theme="day"] .idc-secondary-action { color:#464c55; }
html[data-theme="day"] .idc-secondary-action:hover { color:#6f522c; }
html[data-theme="day"] .idc-privacy { color:#69707a; }
html[data-theme="day"] .idc .idc-project-sales { border-color:rgba(151,111,55,.35); background:radial-gradient(circle at 92% 4%,rgba(174,133,74,.14),transparent 36%),linear-gradient(145deg,rgba(255,252,246,.98),rgba(234,224,209,.96)); box-shadow:0 22px 45px -34px rgba(76,55,30,.48),inset 0 0 0 1px rgba(255,255,255,.65); }
html[data-theme="day"] .idc .idc-project-sales h4 { color:#252931; }
html[data-theme="day"] .idc .idc-project-sales > p:not(.idc-section-number) { color:#626973; }
html[data-theme="day"] .idc .idc-project-sales button { border-color:rgba(130,91,40,.38); background:rgba(169,131,76,.08); color:#6e4d24; }
html[data-theme="day"] .idc-model-rail { background:#e8dece; }
html[data-theme="day"] .idc-model-rail > div:first-child p { color:#23272e; }
html[data-theme="day"] .idc-model-rail button {
  background:linear-gradient(180deg,#fbf8f2,#eee6da);
  color:#565e68;
}
html[data-theme="day"] .idc-model-rail button:hover,
html[data-theme="day"] .idc-model-rail button.is-active {
  background:linear-gradient(180deg,#fffdf8,#e5d8c5);
  color:#6f522c;
}
html[data-theme="day"] .idc-model-rail .idc-model-expand {
  background:radial-gradient(circle at 50% 40%,rgba(169,131,76,.18),transparent 34%),linear-gradient(145deg,#fdfaf4,#e5d8c5);
  color:#6f522c;
  box-shadow:-14px 0 34px rgba(72,55,34,.08);
}
html[data-theme="day"] .idc-model-rail .idc-model-expand.is-active { border-color:rgba(122,84,36,.68); background:radial-gradient(circle at 50% 40%,rgba(169,131,76,.3),transparent 38%),linear-gradient(145deg,#fffaf1,#d8c09a); box-shadow:-14px 0 34px rgba(72,55,34,.1),0 0 28px rgba(140,97,43,.2); }
html[data-theme="day"] .idc-model-rail .idc-model-expand > span strong { color:#8a6738; text-shadow:0 0 20px rgba(169,131,76,.25); }
html[data-theme="day"] .idc-model-overlay { background:rgba(40,31,20,.46); -webkit-backdrop-filter:blur(18px) saturate(.75); backdrop-filter:blur(18px) saturate(.75); }
html[data-theme="day"] .idc-model-panel { border-color:rgba(152,112,57,.44); background:linear-gradient(145deg,rgba(255,253,248,.99),rgba(231,220,202,.99)); box-shadow:0 42px 120px rgba(56,42,25,.3),0 0 0 1px rgba(255,255,255,.6),inset 0 1px #fff; }
html[data-theme="day"] .idc-model-panel::before { border-color:rgba(152,112,57,.17); background:radial-gradient(circle,rgba(189,151,96,.19),transparent 63%); }
html[data-theme="day"] .idc-model-panel > header { border-color:rgba(152,112,57,.25); background:linear-gradient(90deg,rgba(255,255,255,.55),transparent 58%); }
html[data-theme="day"] .idc-model-panel > header h3 { color:#182035; }
html[data-theme="day"] .idc-model-panel > header div > span { color:#6f7279; }
html[data-theme="day"] .idc-model-panel-close { border-color:rgba(152,112,57,.45); background:rgba(255,253,248,.68); color:#74552d; }
html[data-theme="day"] .idc-model-panel-close:hover { border-color:#9b733d; background:#fffaf1; color:#2b2115; }
html[data-theme="day"] .idc-model-panel-grid { background:rgba(152,112,57,.18); scrollbar-color:#9f7947 rgba(238,228,212,.8); }
html[data-theme="day"] .idc-model-panel-card { background:linear-gradient(160deg,#fffdf8,#eee4d5); color:#606570; }
html[data-theme="day"] .idc-model-panel-card::before { background:radial-gradient(circle at 50% 42%,rgba(169,131,76,.2),transparent 35%); }
html[data-theme="day"] .idc-model-panel-card:hover,html[data-theme="day"] .idc-model-panel-card.is-active { background:linear-gradient(160deg,#fff,#e4d4bd); color:#6d4f29; }
html[data-theme="day"] .idc-model-panel-card > span img { filter:drop-shadow(0 24px 23px rgba(65,45,22,.2)); }
html[data-theme="day"] .idc-model-panel-card > b { color:#1d2536; }
html[data-theme="day"] .idc-model-system-badge { border-color:rgba(141,103,52,.34); background:rgba(255,252,245,.88); color:#70502a; box-shadow:0 8px 24px rgba(73,51,24,.11); }
html[data-theme="day"] .idc-model-system-badge.is-sincro-dekori { border-color:rgba(141,103,52,.46); background:linear-gradient(120deg,rgba(229,209,180,.95),rgba(255,252,245,.9)); color:#5c3d1f; }
html[data-theme="day"] .idc-model-panel-card > .idc-model-preview-finish { color:#91672e; }
html[data-theme="day"] .idc-model-panel-card > em { color:#696d75; }
html[data-theme="day"] .idc-decor-panel-grid { background:rgba(152,112,57,.18); scrollbar-color:#9f7947 rgba(238,228,212,.8); }
html[data-theme="day"] .idc-decor-panel-card { background:linear-gradient(160deg,#fffdf8,#eee4d5); color:#606570; }
html[data-theme="day"] .idc-decor-panel-card:hover,html[data-theme="day"] .idc-decor-panel-card.is-active { background:radial-gradient(circle at 50% 43%,rgba(169,131,76,.17),transparent 36%),linear-gradient(160deg,#fff,#e4d4bd); color:#6d4f29; }
html[data-theme="day"] .idc-decor-panel-card > b { color:#1d2536; }
html[data-theme="day"] .idc-hardware-panel-grid { background:rgba(152,112,57,.18); scrollbar-color:#9f7947 rgba(238,228,212,.8); }
html[data-theme="day"] .idc-hardware-panel-card { background:linear-gradient(160deg,#fffdf8,#eee4d5); color:#606570; }
html[data-theme="day"] .idc-hardware-panel-card:hover,html[data-theme="day"] .idc-hardware-panel-card.is-active { background:radial-gradient(circle at 50% 43%,rgba(169,131,76,.17),transparent 36%),linear-gradient(160deg,#fff,#e4d4bd); color:#6d4f29; }
html[data-theme="day"] .idc-hardware-panel-card > b { color:#1d2536; }
/* ========================================================================== 
   LUMORA unutrašnja vrata — prototip kompozicija, stvarni RAL i okov slojevi
   ========================================================================== */
.idc {
  --idc-bg: #070d1e;
  --idc-panel: #0b1530;
  --idc-panel-hi: #101d3b;
  --idc-line: rgba(80,105,164,.34);
  --idc-muted: #8f9bb4;
  --idc-gold: #c7a064;
  --idc-gold-hi: #e7d0a0;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--idc-line);
  background: var(--idc-bg);
  color: #f4f6fb;
  box-shadow: 0 38px 100px rgba(0,0,0,.34);
  scroll-margin-top: 170px;
}
.lumora-interior-page .lumora-page-hero-compact {
  min-height:0;
  padding-top:clamp(20px,2vw,32px);
  padding-bottom:clamp(20px,2vw,32px);
  border-bottom:1px solid rgba(199,160,100,.34);
  background:radial-gradient(920px 480px at 80% 26%,rgba(51,71,125,.25),transparent 72%),#081024;
}
.lumora-interior-page .lumora-page-hero-compact .breadcrumb { margin-bottom:clamp(12px,1.4vw,20px); }
.lumora-interior-page .lumora-page-hero-compact h1 {
  max-width:900px;
  margin-top:10px;
  font-size:clamp(2.2rem,2.8vw,3.45rem);
  line-height:.98;
}
.lumora-interior-page .lumora-page-hero-compact .hero-lead {
  max-width:820px;
  margin-top:12px;
  font-size:clamp(.84rem,.92vw,.96rem);
}
.lumora-interior-config-section { padding-block: clamp(24px,3vw,48px); border-top: 0 !important; }
.lumora-interior-config-section > .container { width: min(1840px,calc(100% - clamp(24px,4vw,72px))); }
.idc-deferred-boundary { min-height:1427px; }
.idc-deferred-boundary:has(> .idc) { min-height:0; }
.idc-deferred-shell {
  position:relative;
  min-height:inherit;
  overflow:hidden;
  border:1px solid rgba(80,105,164,.34);
  background:radial-gradient(620px 320px at 50% 18%,rgba(199,160,100,.09),transparent 70%),linear-gradient(145deg,#0b1530,#070d1e);
  box-shadow:0 38px 100px rgba(0,0,0,.28);
}
.idc-deferred-shell::before {
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(65,89,145,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(65,89,145,.075) 1px,transparent 1px);
  background-size:72px 72px;
  content:"";
  mask-image:linear-gradient(180deg,#000,transparent 70%);
}
.idc-deferred-shell span { position:absolute; top:clamp(42px,5vw,84px); left:clamp(28px,4.5vw,78px); height:8px; border-radius:999px; background:rgba(199,160,100,.28); }
.idc-deferred-shell span:nth-child(1) { width:min(180px,42%); }
.idc-deferred-shell span:nth-child(2) { top:calc(clamp(42px,5vw,84px) + 38px); width:min(560px,68%); height:clamp(38px,5vw,72px); border-radius:0; background:rgba(244,246,251,.055); }
.idc-deferred-shell span:nth-child(3) { top:calc(clamp(42px,5vw,84px) + 132px); width:min(430px,58%); background:rgba(143,155,180,.14); }
.idc-deferred-start {
  position:absolute;
  z-index:2;
  top:calc(clamp(42px,5vw,84px) + 168px);
  left:clamp(28px,4.5vw,78px);
  width:min(290px,calc(100% - clamp(56px,9vw,156px)));
  cursor:pointer;
}
.idc-deferred-start b { font:inherit; }
html[data-theme="day"] .idc-deferred-shell { border-color:rgba(169,131,76,.28); background:radial-gradient(620px 320px at 50% 18%,rgba(169,131,76,.11),transparent 70%),linear-gradient(145deg,#fbf8f2,#eee6da); box-shadow:0 38px 100px rgba(62,47,29,.11); }
html[data-theme="day"] .idc-deferred-shell::before { background-image:linear-gradient(rgba(72,59,43,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(72,59,43,.045) 1px,transparent 1px); }
html[data-theme="day"] .idc-deferred-shell span:nth-child(2) { background:rgba(35,39,46,.06); }
@media (max-width:1100px) { .idc-deferred-boundary { min-height:4196px; } }
@media (max-width:700px) {
  .idc-deferred-boundary { min-height:3757px; }
  .idc-deferred-start { top:calc(clamp(42px,5vw,84px) + 168px); width:calc(100% - 56px); }
}
.idc::before {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(65,89,145,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(65,89,145,.075) 1px,transparent 1px);
  background-size: 72px 72px;
  content: "";
  mask-image: linear-gradient(180deg,#000,transparent 70%);
  pointer-events: none;
}
.idc button { font-family: inherit; }
.idc-header {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: clamp(30px,5vw,90px);
  align-items: end;
  padding: clamp(42px,5vw,84px) clamp(28px,4.5vw,78px) clamp(32px,3.5vw,58px);
  border-bottom: 1px solid var(--idc-line);
  background: radial-gradient(760px 280px at 24% 20%,rgba(199,160,100,.08),transparent 70%);
}
.idc-header > div { max-width: 850px; }
.idc-eyebrow,.idc-section-number {
  margin: 0 0 16px;
  color: var(--idc-gold);
  font: 600 max(var(--type-micro),.68rem) var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
}
.idc-header :is(h1,h2) {
  display: flex;
  margin: 0;
  flex-direction: column;
  font: var(--lumora-heading-weight,300) clamp(3.3rem,5.15vw,6.6rem)/.86 var(--font-display),system-ui,sans-serif;
  letter-spacing: var(--lumora-heading-tracking,-.012em);
}
.idc-header :is(h1,h2) .is-champagne { color: var(--idc-gold); }
.idc-header > div > p:last-child { max-width: 720px; margin: 28px 0 0; color: #aab4c9; font-size: clamp(.94rem,1.05vw,1.08rem); line-height: 1.75; }
.idc-header dl { display: grid; min-width: 350px; margin: 0; grid-template-columns: repeat(3,1fr); border: 1px solid var(--idc-line); }
.idc-header dl div { min-width: 112px; padding: 20px 18px; border-right: 1px solid var(--idc-line); }
.idc-header dl div:last-child { border-right: 0; }
.idc-header dt { color: var(--idc-gold); font: 500 1.35rem var(--mono); }
.idc-header dd { margin: 8px 0 0; color: #aeb8cd; font: 600 max(var(--type-micro),.66rem) var(--mono); letter-spacing: .08em; text-transform: uppercase; }

.idc-collection-switch {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  border-bottom: 1px solid var(--idc-line);
  background: #070e20;
}
.idc-collection-switch button {
  position: relative;
  display: grid;
  min-height: 104px;
  grid-template-columns: auto 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 22px clamp(18px,2.5vw,46px);
  overflow: hidden;
  border: 0;
  border-right: 1px solid var(--idc-line);
  background: linear-gradient(115deg,rgba(15,27,57,.72),rgba(8,16,36,.92));
  color: #aab4c9;
  cursor: pointer;
  text-align: left;
  transition: background .3s ease,color .3s ease;
}
.idc-collection-switch button:last-child { border-right: 0; }
.idc-collection-switch button::before { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: linear-gradient(90deg,transparent,var(--idc-gold),transparent); content: ""; opacity: 0; transform: scaleX(.35); transition: opacity .3s ease,transform .45s ease; }
.idc-collection-switch button::after { position: absolute; top: -70%; left: -18%; width: 18%; height: 230%; background: linear-gradient(90deg,transparent,rgba(255,244,216,.13),transparent); content: ""; transform: skewX(-18deg); transition: left .7s ease; }
.idc-collection-switch button:hover::after { left: 115%; }
.idc-collection-switch button:hover,.idc-collection-switch button.is-active { background: radial-gradient(circle at 20% 50%,rgba(199,160,100,.14),transparent 40%),linear-gradient(115deg,#111d38,#091329); color: #f0dfbb; }
.idc-collection-switch button.is-active::before { opacity: 1; transform: scaleX(1); }
.idc-collection-switch i { color: var(--idc-gold); font: max(var(--type-micro),.65rem) var(--mono); font-style: normal; }
.idc-collection-switch span { display: grid; gap: 5px; }
.idc-collection-switch strong { font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; }
.idc-collection-switch small { color: var(--idc-muted); font: max(var(--type-micro),.58rem) var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.idc-collection-switch b { color: var(--idc-gold); font-size: 1.05rem; font-weight: 400; }
.idc-collection-switch button > i,.idc-collection-switch button > span,.idc-collection-switch button > b { position: relative; z-index: 2; }
.idc-collection-material { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; display: block; width: clamp(58px,26%,126px); border-left: 1px solid rgba(211,178,117,.2); text-decoration: none; opacity: .8; pointer-events: none; mask-image: linear-gradient(90deg,transparent 0,#000 42%); }
.idc-collection-material.is-mdf { background: linear-gradient(135deg,#fcfaf5 0 48%,#e5ded2 49% 100%); box-shadow: inset 18px 0 32px rgba(7,14,32,.12); }
.idc-collection-material.is-glass {
  background: linear-gradient(135deg,rgba(225,245,255,.88),rgba(117,157,180,.34) 44%,rgba(246,251,255,.78) 48%,rgba(114,148,169,.3) 54%,rgba(218,241,251,.7));
  box-shadow: inset 18px 0 32px rgba(7,14,32,.13);
}
.idc-collection-material.is-sincro {
  background:
    linear-gradient(90deg,rgba(7,14,32,.08),rgba(7,14,32,.2)),
    repeating-linear-gradient(88deg,rgba(255,240,210,.09) 0 1px,transparent 1px 8px),
    repeating-linear-gradient(96deg,transparent 0 17px,rgba(45,25,12,.14) 18px 20px),
    linear-gradient(105deg,#815633,#bc8d58 38%,#6f492f 72%,#a67545);
  box-shadow: inset 18px 0 32px rgba(7,14,32,.18);
}

.idc-workspace {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: 850px;
  grid-template-columns: minmax(270px,.78fr) minmax(490px,1.34fr) minmax(320px,.88fr);
}
.idc-controls,.idc-specification { background: linear-gradient(160deg,rgba(15,27,57,.98),rgba(8,16,36,.99)); }
.idc-controls { display: grid; align-content: center; gap: 48px; padding: clamp(28px,3vw,50px); border-right: 1px solid var(--idc-line); }
.idc-controls section + section { padding-top: 42px; border-top: 1px solid var(--idc-line); }
.idc-glass-choice { margin-top: 30px; padding-top: 28px; border-top: 1px solid var(--idc-line); }
.idc-glass-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:18px; }
.idc-glass-grid button { display:grid; min-height:82px; grid-template-columns:42px 1fr; gap:12px; align-items:center; padding:12px; border:1px solid var(--idc-line); background:rgba(5,13,31,.46); color:#abb5c9; cursor:pointer; text-align:left; transition:border-color .25s ease,background .25s ease,color .25s ease,transform .25s ease; }
.idc-glass-grid button:hover,.idc-glass-grid button.is-active { border-color:var(--idc-gold); background:linear-gradient(135deg,rgba(28,48,86,.9),rgba(8,18,42,.94)); color:var(--idc-gold-hi); transform:translateY(-2px); }
.idc-glass-grid i { width:42px; aspect-ratio:1; border:1px solid rgba(224,244,255,.48); box-shadow:inset 0 0 18px rgba(255,255,255,.22),0 8px 18px rgba(0,0,0,.2); }
.idc-glass-grid i.is-clear { background:linear-gradient(135deg,rgba(227,247,255,.72),rgba(102,151,178,.2),rgba(246,252,255,.62)); }
.idc-glass-grid i.is-ornament { background:repeating-radial-gradient(circle at 30% 30%,rgba(255,255,255,.65) 0 1px,rgba(141,178,197,.3) 2px 4px),linear-gradient(135deg,rgba(225,241,247,.74),rgba(119,153,169,.42)); }
.idc-glass-grid span { font:650 max(var(--type-micro),.62rem)/1.35 var(--mono); letter-spacing:.04em; text-transform:uppercase; }
.idc-controls h3 { margin: 0 0 8px; font-size: clamp(1.12rem,1.25vw,1.4rem); font-weight: 650; letter-spacing: .02em; text-transform: uppercase; }
.idc-help { margin: 0 0 18px; color: var(--idc-muted); font-size: .78rem; line-height: 1.65; }
.idc-swatch-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 7px; }
.idc-swatch-grid button {
  position: relative;
  display: grid;
  min-width: 0;
  gap: 5px;
  padding: 5px;
  border: 1px solid transparent;
  background: rgba(4,10,24,.64);
  color: #7f8aa2;
  cursor: pointer;
  transition: border-color .2s ease,color .2s ease,transform .2s ease;
}
.idc-swatch-grid button:hover,.idc-swatch-grid button.is-active { border-color: var(--idc-gold); color: var(--idc-gold-hi); transform: translateY(-2px); }
.idc-swatch-grid button.is-active::after { position: absolute; inset: -4px; border: 1px solid rgba(199,160,100,.25); content: ""; }
.idc-swatch-grid i { display: block; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.1); background: var(--idc-swatch); box-shadow: inset 0 0 16px rgba(0,0,0,.16); }
.idc-swatch-grid span { overflow: hidden; font: max(var(--type-micro),.55rem) var(--mono); letter-spacing: .04em; text-overflow: ellipsis; }
.idc-swatch-grid .idc-other-color > i {
  position: relative;
  overflow: hidden;
  margin: 7%;
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 50%;
  background: conic-gradient(from 0deg,#e4c477 0 12.5%,#b56f55 12.5% 25%,#74567f 25% 37.5%,#55729a 37.5% 50%,#668c78 50% 62.5%,#a4a773 62.5% 75%,#c89a68 75% 87.5%,#ded5c7 87.5% 100%);
  box-shadow: inset 0 0 0 3px rgba(7,13,30,.16),inset 0 0 16px rgba(255,255,255,.24),0 0 14px rgba(199,160,100,.22);
}
.idc-swatch-grid .idc-other-color > i::after,.idc-swatch-grid .idc-other-color > i > b { display:none; }
.idc-swatch-grid .idc-other-color > span { font-size: max(var(--type-micro), .48rem); font-weight: 750; }
.idc-selected-decor { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: -3px 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--idc-line); }
.idc-selected-decor span { color: var(--idc-muted); font: max(var(--type-micro),.52rem) var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.idc-selected-decor strong { overflow: hidden; color: var(--idc-gold-hi); font-size: max(var(--type-micro), .65rem); letter-spacing: .05em; text-overflow: ellipsis; white-space: nowrap; }
.idc-decor-picker { position: relative; isolation: isolate; container: idc-decors / inline-size; }
.idc-decor-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; }
.idc-decor-grid button { position: relative; display: grid; min-width: 0; gap: 5px; padding: 4px; border: 1px solid var(--idc-line); background: rgba(4,10,24,.6); color: #8994aa; cursor: pointer; transition: border-color .2s ease,color .2s ease,transform .2s ease; }
.idc-decor-grid button:hover,.idc-decor-grid button.is-active { border-color: var(--idc-gold); color: var(--idc-gold-hi); transform: translateY(-2px); }
.idc-decor-grid button.is-active::after { position: absolute; inset: -3px; border: 1px solid rgba(199,160,100,.22); content: ""; pointer-events: none; }
.idc-decor-grid button > span { position: relative; display: block; aspect-ratio: 1; overflow: hidden; }
.idc-decor-grid img { object-fit: cover; }
.idc-decor-grid b { overflow: hidden; padding-inline: 1px; font: max(var(--type-micro),.44rem)/1.25 var(--mono); letter-spacing: .02em; text-overflow: ellipsis; white-space: nowrap; }
/* Decor names (ROVERE LANGHE, ROVERE LIMONE ...) need two lines in the narrow grid columns,
   ROVERE LJUBLIANA TENUE three (IC2-06). The data writes them as names ("Rovere Langhe",
   CP2-08); the tile capitals come from text-transform, as on the decor dialog cards. */
.idc-decor-grid button:not(.idc-decor-expand) > b { display: -webkit-box; min-height: 2.5em; white-space: normal; text-transform: uppercase; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.idc-decor-grid .idc-decor-expand { position: relative; z-index: 1; display: grid; min-height: 0; align-content: center; justify-items: center; gap: 5px; overflow: hidden; padding: 7px 5px 6px; border-color: rgba(231,208,160,.56); background: radial-gradient(circle at 50% 26%,rgba(199,160,100,.2),transparent 36%),linear-gradient(145deg,#101b35,#050b19); box-shadow: 0 14px 30px -18px rgba(0,0,0,.95),inset 0 0 0 1px rgba(255,255,255,.025); color: var(--idc-gold-hi); isolation: isolate; transform: none; }
.idc-decor-grid .idc-decor-expand:hover { border-color: rgba(238,211,158,.92); box-shadow: 0 18px 36px -17px rgba(0,0,0,.98),0 0 22px rgba(199,160,100,.17),inset 0 0 0 1px rgba(255,255,255,.05); color: #f4dfb4; transform: translateY(-2px); }
.idc-decor-expand::before { position: absolute; z-index: -1; inset: 4px; border: 1px solid rgba(231,208,160,.18); content: ""; box-shadow: inset 0 0 16px rgba(199,160,100,.06); animation: idc-decor-invite-pulse 2.4s ease-in-out infinite; }
.idc-decor-expand::after { position: absolute; z-index: -1; top: -90%; left: -45%; width: 28%; height: 280%; background: linear-gradient(90deg,transparent,rgba(255,244,216,.24),transparent); content: ""; transform: skewX(-18deg); animation: idc-decor-invite-shine 3.8s ease-in-out infinite; }
.idc-decor-grid .idc-decor-expand > span { position:relative; display: grid; width: 44px; height:35px; margin: 2px auto 1px; place-items: center; overflow: visible; border: 1px solid rgba(231,208,160,.48); border-radius:0; background:linear-gradient(110deg,rgba(109,72,37,.72),rgba(206,172,113,.54)); box-shadow: 5px 4px 0 -1px rgba(199,160,100,.16),-5px -4px 0 -1px rgba(231,208,160,.09),0 8px 18px rgba(0,0,0,.24); transform:rotate(-2deg); }
.idc-decor-grid .idc-decor-expand > span::before { position:absolute; inset:4px; border:1px solid rgba(255,244,216,.22); content:""; }
.idc-decor-expand strong { position:relative; z-index:1; color:#fff0cf; font: 300 1.35rem/1 var(--font-display),system-ui,sans-serif; text-shadow:0 2px 10px rgba(0,0,0,.45); transform:rotate(2deg); }
.idc-decor-grid .idc-decor-expand > b { min-width: 0; max-width: 100%; overflow: visible; color: var(--idc-gold-hi); font: 820 max(var(--type-micro),.58rem)/1.12 system-ui,sans-serif; letter-spacing: 0; text-align: center; text-transform: uppercase; white-space: normal; }
.idc-decor-grid .idc-decor-expand > small { min-width: 0; max-width: 100%; color: #aab3c4; font: max(var(--type-micro),.34rem)/1.2 var(--mono); letter-spacing: .02em; overflow-wrap: anywhere; text-align: center; }
/* Keep the action's full words readable in the actual sidebar width. */
@container idc-decors (max-width: 344px) {
  .idc-decor-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@container idc-decors (max-width: 274px) {
  .idc-decor-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@keyframes idc-decor-invite-pulse { 0%,100% { border-color:rgba(231,208,160,.16); box-shadow:0 0 0 4px rgba(199,160,100,.02),inset 0 0 19px rgba(199,160,100,.05); } 50% { border-color:rgba(231,208,160,.52); box-shadow:0 0 0 4px rgba(199,160,100,.055),0 0 22px rgba(199,160,100,.2),inset 0 0 24px rgba(199,160,100,.1); } }
@keyframes idc-decor-invite-shine { 0%,35% { left:-45%; opacity:0; } 58% { opacity:1; } 78%,100% { left:125%; opacity:0; } }
.idc-hardware-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.idc-hardware-grid button { position: relative; min-width: 0; padding: 0; border: 1px solid var(--idc-line); background: #081027; cursor: pointer; transition: border-color .2s ease,background .2s ease,transform .2s ease; }
.idc-hardware-grid button:hover,.idc-hardware-grid button.is-active { border-color: var(--idc-gold); background: #101b36; transform: translateY(-2px); }
.idc-hardware-grid button > i { position: absolute; top: 7px; left: 8px; z-index: 2; color: var(--idc-gold); font: max(var(--type-micro),.55rem) var(--mono); font-style: normal; }
.idc-hardware-thumb { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: transparent; isolation: isolate; }
.idc-hardware-thumb::before { position: absolute; z-index: -1; inset: 14%; border: 1px solid rgba(199,160,100,.25); border-radius: 50%; background: #f8f5ed; content: ""; box-shadow: 0 0 0 1px rgba(255,255,255,.28),0 0 18px rgba(199,160,100,.16); }
.idc-hardware-thumb::after { position: absolute; inset: 17%; border: 1px solid rgba(138,111,70,.28); border-radius: 50%; content: ""; pointer-events: none; }
.idc-hardware-thumb img { z-index: 1; object-fit: contain; filter: drop-shadow(0 8px 9px rgba(0,0,0,.2)); transform: none; }
html:not([data-theme="day"]) .idc-hardware-thumb::before { inset: 11%; border-color: rgba(255,249,235,.94); background: #faf7ef; box-shadow: 0 0 0 1px rgba(199,160,100,.5),0 0 0 8px rgba(199,160,100,.1),0 0 22px rgba(231,208,160,.24); }
html:not([data-theme="day"]) .idc-hardware-thumb::after { inset: 14%; border-color: rgba(119,91,50,.38); box-shadow: inset 0 0 12px rgba(199,160,100,.08); }
.idc-hardware-grid .idc-hardware-expand { position:relative; z-index:1; display:grid; min-height:0; align-content:center; justify-items:center; gap:4px; overflow:hidden; padding:6px 4px 5px; border-color:rgba(231,208,160,.58); background:radial-gradient(circle at 50% 30%,rgba(199,160,100,.2),transparent 38%),linear-gradient(145deg,#101b35,#050b19); box-shadow:0 14px 30px -18px rgba(0,0,0,.95),inset 0 0 0 1px rgba(255,255,255,.025); color:var(--idc-gold-hi); isolation:isolate; transform:none; }
.idc-hardware-grid .idc-hardware-expand:hover { border-color:rgba(238,211,158,.92); background:radial-gradient(circle at 50% 30%,rgba(199,160,100,.28),transparent 40%),linear-gradient(145deg,#152342,#071027); box-shadow:0 18px 36px -17px rgba(0,0,0,.98),0 0 22px rgba(199,160,100,.2),inset 0 0 0 1px rgba(255,255,255,.05); transform:translateY(-2px); }
.idc-hardware-expand::before { position:absolute; z-index:-1; inset:4px; border:1px solid rgba(231,208,160,.18); content:""; box-shadow:inset 0 0 16px rgba(199,160,100,.06); animation:idc-decor-invite-pulse 2.4s ease-in-out infinite; }
.idc-hardware-expand::after { position:absolute; z-index:-1; top:-90%; left:-45%; width:28%; height:280%; background:linear-gradient(90deg,transparent,rgba(255,244,216,.24),transparent); content:""; transform:skewX(-18deg); animation:idc-decor-invite-shine 3.8s ease-in-out infinite; }
.idc-hardware-grid .idc-hardware-expand > span { position:relative; display:block; width:58px; height:48px; margin:0 auto 1px; }
.idc-hardware-expand > span > b { position:absolute; top:2px; right:5px; width:31px; height:43px; border:1px solid rgba(247,226,183,.68); background:linear-gradient(145deg,rgba(227,197,143,.2),rgba(70,48,27,.32)); box-shadow:7px 5px 0 -3px rgba(199,160,100,.18),0 8px 18px rgba(0,0,0,.28),inset 0 0 0 3px rgba(4,11,27,.2); transform:perspective(100px) rotateY(-8deg); }
.idc-hardware-expand > span > b::before { position:absolute; inset:5px; border:1px solid rgba(247,226,183,.2); content:""; }
.idc-hardware-expand > span > b::after { position:absolute; top:20px; right:5px; width:3px; height:3px; border-radius:50%; background:#f1d59d; box-shadow:0 0 8px rgba(241,213,157,.42); content:""; }
.idc-hardware-expand > span > i { position:absolute; top:9px; left:14px; z-index:2; width:5px; height:29px; border:1px solid rgba(255,238,201,.72); border-radius:3px; background:linear-gradient(90deg,#7c572f,#edcf95 48%,#8d6539); box-shadow:0 5px 11px rgba(0,0,0,.34),0 0 10px rgba(199,160,100,.2); }
.idc-hardware-expand > span > i::before,.idc-hardware-expand > span > i::after { position:absolute; left:4px; width:11px; height:2px; background:linear-gradient(90deg,#e6c78f,#73502c); content:""; }
.idc-hardware-expand > span > i::before { top:3px; }
.idc-hardware-expand > span > i::after { bottom:3px; }
.idc-hardware-expand > span > strong { position:absolute; z-index:3; right:2px; bottom:0; display:grid; width:19px; height:19px; place-items:center; border:1px solid rgba(255,237,198,.75); border-radius:50%; background:#09142a; color:#f4dca9; font:600 1rem/1 system-ui,sans-serif; box-shadow:0 0 14px rgba(199,160,100,.42); }
.idc-hardware-grid .idc-hardware-expand > em { max-width:100%; color:var(--idc-gold-hi); font:820 max(var(--type-micro),.58rem)/1.12 system-ui,sans-serif; font-style:normal; letter-spacing:.015em; text-transform:uppercase; white-space:nowrap; }
.idc-hardware-grid .idc-hardware-expand > small { color:#aab3c4; font:max(var(--type-micro),.34rem)/1.2 var(--mono); letter-spacing:.02em; }
.idc-decor-grid .idc-decor-expand.is-active,
.idc-hardware-grid .idc-hardware-expand.is-active { border-color:rgba(238,211,158,.98); background:radial-gradient(circle at 50% 28%,rgba(199,160,100,.34),transparent 42%),linear-gradient(145deg,#17284a,#071027); box-shadow:0 18px 38px -18px rgba(0,0,0,.98),0 0 28px rgba(199,160,100,.32),inset 0 0 0 1px rgba(255,255,255,.07); color:#f5dfb3; }
.idc-model-rail .idc-model-expand.is-active { border-color:rgba(231,208,160,.78); background:radial-gradient(circle at 50% 40%,rgba(199,160,100,.28),transparent 38%),linear-gradient(145deg,#17284a,#071027); box-shadow:-16px 0 38px rgba(1,5,15,.24),0 0 28px rgba(199,160,100,.24); }
.idc-model-rail .idc-model-expand.is-active::before { border-color:rgba(231,208,160,.62); box-shadow:0 0 0 12px rgba(199,160,100,.05),0 0 48px rgba(199,160,100,.3),inset 0 0 34px rgba(199,160,100,.08); }

.idc-stage {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 850px;
  place-items: center;
  overflow: hidden;
  /* Item 58: the door stands on a floor in soft light (no glowing ring under it). */
  --idc-floor-line:rgba(199,160,100,.36);
  --idc-floor-near:#111c38;
  --idc-floor-far:#0a1229;
  --idc-contact:rgba(0,0,0,.62);
  background: radial-gradient(60% 52% at 50% 36%,rgba(42,61,112,.42),transparent 76%),#071027;
}
.idc-stage::before { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(3,8,21,.6),transparent 15%,transparent 85%,rgba(3,8,21,.55)); content: ""; pointer-events: none; }
.idc-stage-label { position: absolute; top: 28px; left: 30px; z-index: 4; display: flex; max-width: calc(100% - 60px); gap: 10px; flex-direction: column; }
.idc-stage-label span { color: var(--idc-gold); font: max(var(--type-micro),.62rem) var(--mono); letter-spacing: .14em; text-transform: uppercase; }
/* The whole selection (model, finish, glass, handle, fixed accent) wraps instead of ending in an
   ellipsis: two lines above the door on wider screens, four on phones (IC2-01, IC2-02). */
.idc-stage-label strong { display: -webkit-box; overflow: hidden; color: #8e9ab2; font: 500 max(var(--type-micro),.62rem)/1.35 var(--mono); letter-spacing: .04em; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
@media (max-width:700px) { .idc-stage-label strong { -webkit-line-clamp: 4; } }
.idc-door-canvas { position: relative; z-index: 2; width: min(94%,680px); aspect-ratio: 1; }
.idc-door-canvas > img { z-index: 2; object-fit: contain; filter: drop-shadow(0 35px 28px rgba(0,0,0,.42)); }
.idc-door-canvas .idc-glass-layer { z-index: 3; filter:none; }
.idc-door-canvas .idc-hardware-layer { z-index: 4; filter: drop-shadow(0 6px 8px rgba(0,0,0,.32)); }
.idc-visual-pending { position: absolute; z-index: 2; inset: 17% 18%; display: grid; place-content: center; justify-items: center; padding: 30px; border: 1px solid rgba(199,160,100,.34); background: radial-gradient(circle at 50% 42%,rgba(199,160,100,.16),transparent 28%),linear-gradient(145deg,rgba(18,31,62,.88),rgba(6,13,30,.95)); text-align: center; box-shadow: 0 28px 60px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.025); }
.idc-visual-pending::before,.idc-visual-pending::after { position: absolute; width: 44px; height: 44px; border-color: var(--idc-gold); border-style: solid; content: ""; opacity: .7; }
.idc-visual-pending::before { top: 12px; left: 12px; border-width: 1px 0 0 1px; }
.idc-visual-pending::after { right: 12px; bottom: 12px; border-width: 0 1px 1px 0; }
.idc-visual-pending > i { width: 56px; height: 82px; margin-bottom: 22px; border: 1px solid var(--idc-gold); background: linear-gradient(145deg,rgba(199,160,100,.2),transparent 48%); box-shadow: 13px 10px 0 -7px rgba(199,160,100,.14),0 0 28px rgba(199,160,100,.18); transform: perspective(120px) rotateY(-8deg); }
.idc-visual-pending strong { color: var(--idc-gold-hi); font: 500 clamp(1.2rem,2vw,1.8rem) var(--font-display),system-ui,sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.idc-visual-pending span { margin-top: 10px; color: var(--idc-muted); font: max(var(--type-micro),.56rem) var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.idc-loupe { position: absolute; top: 50.6%; left: 71.5%; z-index: 5; display: grid; width: clamp(180px,12vw,215px); place-items: center; transform: translateY(-50%); }
.idc-loupe > div { position: relative; width: clamp(154px,10.5vw,188px); aspect-ratio: 1; overflow: hidden; border: 1px solid var(--idc-gold); border-radius: 50%; background: radial-gradient(circle,#f8f3e9 0 48%,#d5bea0 100%); box-shadow: 0 22px 54px rgba(0,0,0,.42),0 0 0 7px rgba(199,160,100,.1),0 0 0 8px rgba(231,208,160,.32),inset 0 0 34px rgba(255,255,255,.35); }
.idc-loupe img { object-fit: contain; filter: drop-shadow(0 10px 10px rgba(0,0,0,.22)); transform: none; }
.idc-loupe > span { box-sizing: border-box; max-width: 100%; margin-top: 15px; padding: 3px 4px; background: var(--idc-bg); color: var(--idc-gold-hi); font: max(var(--type-micro),.57rem)/1.4 var(--mono); letter-spacing: .11em; text-align: center; text-transform: uppercase; }
/* Floor line at the threshold (--door-floor from scripts/generate-door-floor-lines.mjs, in the
   1254 layer space) with a warm gradient below, across the stage (which clips it). */
.idc-stage-floor { position: absolute; z-index: 1; top: calc(var(--door-floor,.9408) * 100%); left: 50%; width: 400vw; height: 100vh; border-top: 1px solid var(--idc-floor-line); background: linear-gradient(180deg,var(--idc-floor-near),var(--idc-floor-far) min(240px,60%)); transform: translateX(-50%); pointer-events: none; }
.idc-stage-floor i { display: none; }
/* Contact shadow, narrow and exactly under the door leaf and frame. */
.idc-door-canvas::after { position: absolute; z-index: 1; top: calc(var(--door-floor,.9408) * 100% - 5px); left: calc(var(--door-left,.2863) * 100% - 1.5%); width: calc((var(--door-right,.7121) - var(--door-left,.2863)) * 100% + 3%); height: 12px; border-radius: 50%; background: radial-gradient(closest-side,var(--idc-contact),transparent); content: ""; pointer-events: none; }

.idc-specification { display: flex; min-width: 0; flex-direction: column; padding: clamp(34px,3.2vw,58px); border-left: 1px solid var(--idc-line); }
.idc-specification header { padding-bottom: 32px; border-bottom: 1px solid var(--idc-line); }
.idc-specification header > p { margin: 0 0 16px; color: #73809b; font: max(var(--type-micro),.68rem) var(--mono); }
.idc-specification header > p span { color: var(--idc-gold); }
.idc-specification h3 { margin: 0 0 13px; color: #fff; font-size: clamp(2.2rem,3vw,3.5rem); font-weight: 600; letter-spacing: -.035em; }
.idc-specification header small { color: var(--idc-muted); font-size: .78rem; line-height: 1.65; }
.idc-specification > .idc-section-number { margin-top: 34px; }
.idc-specification dl { margin: 0; }
.idc-specification dl > div { display: grid; grid-template-columns: minmax(125px,.9fr) minmax(115px,1.1fr); gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--idc-line); }
.idc-specification dt { color: #d8deea; font-size: .69rem; font-weight: 600; line-height: 1.45; text-transform: uppercase; }
.idc-specification dt i { margin-right: 9px; color: var(--idc-gold); font: max(var(--type-micro),.57rem) var(--mono); font-style: normal; }
.idc-specification dd { margin: 0; color: #919db5; font-size: .7rem; line-height: 1.5; text-align: right; }
.idc-technical-note { margin: 25px 0; color: #737f96; font-size: max(var(--type-micro), .67rem); line-height: 1.65; }
.idc-primary-action,.idc-secondary-action { display: flex; width: 100%; min-height: 55px; align-items: center; justify-content: space-between; padding: 0 18px; cursor: pointer; font-size: max(var(--type-micro), .68rem); font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.idc-primary-action { position: relative; overflow: hidden; border: 1px solid var(--idc-gold-hi); background: linear-gradient(105deg,#aa8148,#d7b679 52%,#ad844b); color: #071027; box-shadow: 0 15px 36px -22px rgba(199,160,100,.9),inset 0 1px rgba(255,244,217,.5); isolation: isolate; }
.idc-primary-action::before { position: absolute; z-index: -1; top: -60%; bottom: -60%; left: -34%; width: 22%; background: linear-gradient(90deg,transparent,rgba(255,250,232,.72),transparent); content: ""; transform: skewX(-20deg); transition: left .75s cubic-bezier(.18,.72,.2,1); }
.lumora-interior-page--configurator-first .idc-primary-action > span { position:relative; display:block; width:30px; height:30px; flex:0 0 30px; padding:0; border:1px solid currentColor; border-radius:50%; font-size:0; line-height:0; box-shadow:inset 0 0 0 4px rgba(255,255,255,.08); transition:transform .25s ease,box-shadow .25s ease; }
.lumora-interior-page--configurator-first .idc-primary-action > span::before,.lumora-interior-page--configurator-first .idc-primary-action > span::after { position:absolute; top:50%; left:50%; width:10px; height:1px; background:currentColor; content:""; transform:translate(-50%,-50%); transform-origin:center; }
.lumora-interior-page--configurator-first .idc-primary-action > span::after { transform:translate(-50%,-50%) rotate(90deg); }
.lumora-interior-page--configurator-first .idc-primary-action:is(:hover,:focus-visible) > span { transform:rotate(90deg); box-shadow:inset 0 0 0 4px rgba(255,255,255,.12),0 0 18px rgba(255,245,220,.34); }
.lumora-interior-page--configurator-first .idc-primary-action:focus-visible { outline:2px solid var(--idc-gold-hi); outline-offset:3px; }
.idc-secondary-action { margin-top: 8px; border: 1px solid var(--idc-line); background: transparent; color: #b3bdd0; }
.idc-primary-action:hover { background: linear-gradient(105deg,#c39b61,#ead3a5 52%,#c39b61); }
.idc-primary-action:hover::before { left: 116%; }
.idc-secondary-action:hover { border-color: var(--idc-gold); color: var(--idc-gold-hi); }
.idc .idc-project-sales { position: relative; overflow: hidden; margin-top: 30px; padding: 25px 24px 23px; border: 1px solid rgba(199,160,100,.34); background: radial-gradient(circle at 92% 5%,rgba(199,160,100,.16),transparent 35%),linear-gradient(145deg,rgba(20,32,59,.96),rgba(6,13,29,.98)); box-shadow: 0 22px 50px -34px rgba(0,0,0,.95),inset 0 0 0 1px rgba(255,255,255,.018); isolation: isolate; }
.idc .idc-project-sales::before { position:absolute; top:0; left:0; width:38%; height:1px; background:linear-gradient(90deg,var(--idc-gold),rgba(231,208,160,.2),transparent); content:""; }
.idc .idc-project-sales::after { position:absolute; right:-42px; bottom:-64px; width:150px; aspect-ratio:1; border:1px solid rgba(199,160,100,.11); border-radius:50%; box-shadow:0 0 0 25px rgba(199,160,100,.025),0 0 0 50px rgba(199,160,100,.018); content:""; pointer-events:none; }
.idc .idc-project-sales > .idc-section-number { margin: 0 0 13px; }
.idc .idc-project-sales h4 { max-width: 390px; margin: 0; color: #f3f5f9; font-size: 1rem; letter-spacing: .015em; line-height: 1.3; text-transform: uppercase; }
.idc .idc-project-sales > p:not(.idc-section-number) { max-width: 430px; margin: 11px 0 20px; color: #a8b2c5; font-size: .72rem; line-height: 1.72; }
.idc .idc-project-sales button { position:relative; z-index:1; display: inline-flex; align-items: center; gap: 13px; min-height:38px; padding:0 15px; border:1px solid rgba(231,208,160,.42); background:rgba(199,160,100,.06); color: var(--idc-gold-hi); cursor: pointer; font: 700 max(var(--type-micro),.59rem) var(--mono); letter-spacing: .07em; text-transform: uppercase; transition:border-color .2s ease,background .2s ease,box-shadow .2s ease; }
.idc .idc-project-sales button span { transition: transform .22s ease; }
.idc .idc-project-sales button:hover { border-color:rgba(238,211,158,.88); background:rgba(199,160,100,.12); box-shadow:0 0 24px rgba(199,160,100,.12); }
.idc .idc-project-sales button:hover span { transform: translate(3px,-3px); }
.idc-privacy { align-self: center; margin-top: 16px; color: #68748e; font: max(var(--type-micro),.56rem) var(--mono); letter-spacing: .08em; text-transform: uppercase; }

.idc-model-rail { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(220px,.65fr) minmax(0,2.35fr); align-items: stretch; border-top: 1px solid var(--idc-line); background: #060c1c; }
.idc-model-rail > div:first-child { display: flex; justify-content: center; padding: 32px clamp(24px,3vw,50px); flex-direction: column; border-right: 1px solid var(--idc-line); }
.idc-model-rail > div:first-child p { margin: 0; font-size: 1.1rem; font-weight: 650; text-transform: uppercase; }
.idc-model-rail > div:first-child small { margin-top: 7px; color: var(--idc-muted); font: max(var(--type-micro),.58rem) var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.idc-model-strip { display: grid; min-width: 0; grid-template-columns: minmax(0,1fr) clamp(155px,10vw,195px); }
.idc-model-list { display: grid; min-width: 0; grid-template-columns: repeat(5,minmax(0,1fr)); }
/* The scrolling rail clips an outside outline, so keyboard focus is drawn inside the card. */
/* LM-IC-10, IC2-04: one inset gold ring on every configurator choice, so a scrolling grid cannot
   clip it and a neighbouring card cannot paint over it. */
.idc-model-list > button:focus-visible,.idc-model-panel-card:focus-visible,.idc-decor-panel-card:focus-visible,.idc-hardware-panel-card:focus-visible,.idc-decor-grid button:focus-visible,.idc-hardware-grid button:focus-visible,.idc-swatch-grid button:focus-visible { outline: 2px solid var(--idc-gold-hi); outline-offset: -3px; }
.idc-model-rail button { position: relative; display: grid; min-width: 0; min-height: 210px; grid-template-rows: 1fr auto; padding: 15px 16px 18px; border: 0; border-right: 1px solid var(--idc-line); background: #081027; color: #a9b3c8; cursor: pointer; text-align: left; transition: background .25s ease,color .25s ease; }
.idc-model-rail button:last-child { border-right: 0; }
.idc-model-rail button:hover,.idc-model-rail button.is-active { background: linear-gradient(180deg,#12203e,#0a1430); color: var(--idc-gold-hi); }
.idc-model-rail button.is-active::before { position: absolute; top: 0; right: 0; left: 0; height: 2px; background: var(--idc-gold); content: ""; box-shadow: 0 0 24px rgba(199,160,100,.6); }
.idc-model-rail button > span { position: relative; min-height: 145px; overflow: hidden; }
.idc-model-rail button img { object-fit: contain; transition: transform .3s ease; }
.idc-model-rail button img.idc-model-preview-base { z-index:1; }
.idc-model-rail button img.idc-model-preview-glass { z-index:2; filter:none; }
.idc-model-rail button:hover img,.idc-model-rail button.is-active img { transform: scale(1.05); }
.idc-model-rail button > i { position: absolute; top: 16px; left: 17px; z-index: 2; color: var(--idc-gold); font: max(var(--type-micro),.62rem) var(--mono); font-style: normal; }
.idc-model-rail button > b { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.idc-model-system-badge { position: absolute; z-index: 4; top: 12px; right: 12px; display: inline-flex; min-height: 22px; align-items: center; padding: 0 8px; border: 1px solid rgba(214,182,121,.28); background: rgba(5,12,29,.76); color: #e7d3aa; font: 600 max(var(--type-micro),.43rem) var(--mono); letter-spacing: .1em; text-transform: uppercase; -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); box-shadow: 0 8px 22px rgba(0,0,0,.15); }
/* r2-layout-lumora-03 (decision 123): on narrow cards the badge slid left over the model number; it now
   stays clear of the number and wraps instead.
   Round 2 (T2-06): the badge keeps one line wherever that line fits beside the number (the number ends 29.3 px
   into the card, 27.3 px where it sits at 15 px), wraps only where it would reach the number, and is never
   narrower than its longest word, so no letter runs past its border. On the narrowest five-card rail
   (901-1080 px, cards 99-132 px) that word does not always fit beside the number (sv "RAL-LACKERAD" needs a
   124 px card): there the badge takes its own row under the number, lined up with it. The "all models" panel
   cards carry their number under the picture, so their badge keeps its earlier width (6d48a289 had wrapped it at
   320-408 px). */
.idc-model-rail .idc-model-system-badge { width: max-content; min-width: min-content; max-width: calc(100% - 41.35px); }
@media (min-width: 1281px) and (min-height: 800px) {
  .idc-model-rail .idc-model-list > button > .idc-model-system-badge { max-width: calc(100% - 39.35px); }
}
@media (min-width: 901px) and (max-width: 1080px) {
  .idc-model-rail .idc-model-list > button > .idc-model-system-badge { top: 34px; right: auto; left: 8px; max-width: calc(100% - 16px); }
}
.idc-model-system-badge.is-sincro-dekori { border-color: rgba(214,182,121,.52); background: linear-gradient(120deg,rgba(74,48,27,.88),rgba(19,28,44,.84)); color: #f0d8aa; }
.idc-model-system-badge.is-mdf-staklo { border-color:rgba(165,211,233,.58); background:linear-gradient(120deg,rgba(38,77,101,.88),rgba(12,27,49,.86)); color:#dff6ff; }
.idc-model-placeholder { position: absolute; top: 50%; left: 50%; display: block; width: 48px; height: 84px; border: 1px solid rgba(199,160,100,.7); background: linear-gradient(145deg,rgba(199,160,100,.16),rgba(255,255,255,.015)); box-shadow: 10px 9px 0 -6px rgba(199,160,100,.1),0 0 28px rgba(199,160,100,.12); transform: translate(-50%,-50%) perspective(100px) rotateY(-7deg); }
.idc-model-rail .idc-model-expand { position: relative; z-index: 3; place-items: center; grid-template-rows: 1fr auto auto; overflow: hidden; border-left: 1px solid rgba(199,160,100,.35); border-right: 0; background: radial-gradient(circle at 50% 40%,rgba(199,160,100,.15),transparent 34%),linear-gradient(145deg,#101b35,#070e20); text-align: center; box-shadow: -16px 0 38px rgba(1,5,15,.2); isolation: isolate; }
.idc-model-rail .idc-model-expand::before { position: absolute; z-index: -1; inset: 8%; border: 1px solid rgba(199,160,100,.2); border-radius: 48% 52% 50% 50%; content: ""; box-shadow: 0 0 0 12px rgba(199,160,100,.025),0 0 36px rgba(199,160,100,.14),inset 0 0 30px rgba(199,160,100,.04); transition: border-color .3s ease,box-shadow .3s ease,transform .45s ease; }
.idc-model-rail .idc-model-expand::after { position: absolute; z-index: -1; top: -80%; left: -30%; width: 28%; height: 260%; background: linear-gradient(90deg,transparent,rgba(255,245,218,.18),transparent); content: ""; transform: skewX(-18deg); transition: left .75s ease; pointer-events: none; }
.idc-model-rail .idc-model-expand:hover::before { border-color: rgba(231,208,160,.52); box-shadow: 0 0 0 12px rgba(199,160,100,.04),0 0 48px rgba(199,160,100,.26),inset 0 0 34px rgba(199,160,100,.07); transform: scale(.97); }
.idc-model-rail .idc-model-expand:hover::after { left: 125%; }
.idc-model-rail .idc-model-expand > span { display: grid; min-height: 145px; place-content: center; overflow: visible; }
.idc-model-rail .idc-model-expand > span strong { color: #f0d8a7; font: 300 clamp(2.2rem,3vw,3.5rem)/1 var(--font-display),system-ui,sans-serif; text-shadow: 0 0 18px rgba(199,160,100,.62),0 0 40px rgba(199,160,100,.2); }
.idc-model-rail .idc-model-expand > span small { margin-top: 8px; color: var(--idc-muted); font: max(var(--type-micro),.55rem) var(--mono); letter-spacing: .14em; }
.idc-model-rail .idc-model-expand > em { margin-top: 6px; color: var(--idc-muted); font: max(var(--type-micro),.48rem) var(--mono); font-style: normal; letter-spacing: .08em; text-transform: uppercase; }

.idc-model-overlay { position: fixed; z-index: 10020; inset: 0; display: grid; place-items: center; padding: clamp(18px,3vw,48px); background: rgba(1,5,15,.82); -webkit-backdrop-filter: blur(18px) saturate(.78); backdrop-filter: blur(18px) saturate(.78); animation: idc-model-overlay-in .28s ease both; }
.idc-model-panel { position: relative; display: grid; width: min(1480px,100%); max-height: calc(100dvh - clamp(36px,6vw,96px)); grid-template-rows: auto minmax(0,1fr); overflow: hidden; border: 1px solid rgba(211,178,117,.42); background: linear-gradient(145deg,rgba(17,29,55,.985),rgba(4,10,25,.99)); box-shadow: 0 42px 120px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.025),inset 0 1px rgba(255,244,217,.09); }
.idc-model-panel::before { position: absolute; z-index: 0; top: -46%; left: 12%; width: 62%; aspect-ratio: 1; border: 1px solid rgba(211,178,117,.13); border-radius: 50%; background: radial-gradient(circle,rgba(199,160,100,.12),transparent 63%); content: ""; pointer-events: none; }
.idc-model-panel > header { position: relative; z-index: 1; display: flex; min-height: 126px; align-items: center; justify-content: space-between; gap: 28px; padding: 25px clamp(24px,4vw,60px); border-bottom: 1px solid rgba(211,178,117,.26); background: linear-gradient(90deg,rgba(255,255,255,.035),transparent 58%); }
.idc-model-panel > header p { margin: 0 0 8px; color: var(--idc-gold); font: max(var(--type-micro),.58rem) var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.idc-model-panel > header h3 { margin: 0; color: #f5f1e8; font: 430 clamp(1.8rem,3vw,3.25rem)/1 var(--font-display),system-ui,sans-serif; letter-spacing: .035em; text-transform: uppercase; }
.idc-model-panel > header div > span { display: block; margin-top: 9px; color: var(--idc-muted); font: max(var(--type-micro),.58rem) var(--mono); letter-spacing: .11em; text-transform: uppercase; }
.idc-model-panel-close { display: inline-flex; min-height: 52px; align-items: center; gap: 13px; padding: 0 20px; border: 1px solid rgba(211,178,117,.44); background: rgba(5,12,29,.7); color: #e3d6bb; cursor: pointer; font: 650 max(var(--type-micro),.58rem) var(--mono); letter-spacing: .12em; text-transform: uppercase; transition: border-color .25s ease,background .25s ease,color .25s ease; }
.idc-model-panel-close i { position: relative; display: block; width: 19px; height: 19px; transform: rotate(45deg); }
.idc-model-panel-close i::before,.idc-model-panel-close i::after { position: absolute; top: 50%; left: 50%; background: currentColor; content: ""; transform: translate(-50%,-50%); }
.idc-model-panel-close i::before { width: 18px; height: 1px; }
.idc-model-panel-close i::after { width: 1px; height: 18px; }
.idc-model-panel-close:hover { border-color: var(--idc-gold-hi); background: rgba(199,160,100,.12); color: #fff5df; }
.idc-model-panel-grid { position: relative; z-index: 1; display: grid; min-height: 0; grid-template-columns: repeat(4,minmax(0,1fr)); grid-auto-rows: minmax(max-content,auto); gap: 1px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; background: rgba(211,178,117,.16); scrollbar-color: var(--idc-gold) rgba(4,10,25,.6); }
.idc-model-panel-card { position: relative; display: grid; min-width: 0; min-height: clamp(250px,31vh,390px); grid-template-rows: minmax(160px,auto) auto auto auto auto; align-content: start; padding: 40px clamp(18px,2vw,30px) 25px; border: 0; background: linear-gradient(160deg,#0d1933,#071027); color: #aab5ca; cursor: pointer; text-align: left; isolation: isolate; transition: background .28s ease,color .28s ease; }
.idc-model-panel-card::before { position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle at 50% 42%,rgba(199,160,100,.14),transparent 33%); content: ""; opacity: 0; transition: opacity .3s ease; }
.idc-model-panel-card::after { position: absolute; top: 0; right: 0; left: 0; height: 2px; background: linear-gradient(90deg,transparent,var(--idc-gold),transparent); content: ""; opacity: 0; box-shadow: 0 0 26px rgba(199,160,100,.62); }
.idc-model-panel-card:hover,.idc-model-panel-card.is-active { background: linear-gradient(160deg,#152543,#09142e); color: #f2e5c8; }
.idc-model-panel-card:hover::before,.idc-model-panel-card.is-active::before,.idc-model-panel-card.is-active::after { opacity: 1; }
.idc-model-panel-card > span { position: relative; min-height: 170px; }
.idc-model-panel-card > span img { object-fit: contain; filter: drop-shadow(0 24px 25px rgba(0,0,0,.28)); transition: transform .38s cubic-bezier(.2,.7,.2,1),filter .3s ease; }
.idc-model-panel-card > span img.idc-model-preview-base { z-index:1; }
.idc-model-panel-card > span img.idc-model-preview-glass { z-index:2; filter:none; }
.idc-model-panel-card:hover > span img { filter: drop-shadow(0 28px 28px rgba(0,0,0,.38)); transform: translateY(-5px) scale(1.035); }
.idc-model-panel-card > i { margin-top: 12px; color: var(--idc-gold); font: max(var(--type-micro),.58rem) var(--mono); font-style: normal; letter-spacing: .12em; }
.idc-model-panel-card > b { margin-top: 7px; color: #f2f4f8; font-size: .85rem; letter-spacing: .09em; text-transform: uppercase; }
.idc-model-panel-card > .idc-model-preview-finish { margin-top: 7px; color: var(--idc-gold-hi); font: max(var(--type-micro),.5rem) var(--mono); letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.idc-model-panel-card > em { display: -webkit-box; overflow: hidden; min-height: 2.9em; margin-top: 8px; color: var(--idc-muted); font-size: max(var(--type-micro), .67rem); font-style: normal; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.idc-decor-panel-grid { position: relative; z-index: 1; display: grid; min-height: 0; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; background: rgba(211,178,117,.16); scrollbar-color: var(--idc-gold) rgba(4,10,25,.6); }
.idc-decor-panel-card { position: relative; display: grid; min-width: 0; min-height: clamp(210px,28vh,330px); grid-template-rows: minmax(145px,1fr) auto auto; padding: 18px 20px 21px; border: 0; background: linear-gradient(160deg,#0d1933,#071027); color: #aab5ca; cursor: pointer; text-align: left; isolation: isolate; transition: background .28s ease,color .28s ease; }
.idc-decor-panel-card::after { position: absolute; top: 0; right: 0; left: 0; height: 2px; background: linear-gradient(90deg,transparent,var(--idc-gold),transparent); content: ""; opacity: 0; box-shadow: 0 0 26px rgba(199,160,100,.62); }
.idc-decor-panel-card:hover,.idc-decor-panel-card.is-active { background: radial-gradient(circle at 50% 43%,rgba(199,160,100,.13),transparent 35%),linear-gradient(160deg,#152543,#09142e); color: #f2e5c8; }
.idc-decor-panel-card:hover::after,.idc-decor-panel-card.is-active::after { opacity: 1; }
.idc-decor-panel-card > span { position: relative; min-height: 145px; }
.idc-decor-panel-card img { object-fit: contain; filter: drop-shadow(0 20px 20px rgba(0,0,0,.3)); transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.idc-decor-panel-card:hover img { transform: translateY(-4px) scale(1.035); }
.idc-decor-panel-card > i { margin-top: 11px; color: var(--idc-gold); font: max(var(--type-micro),.55rem) var(--mono); font-style: normal; letter-spacing: .1em; }
.idc-decor-panel-card > b { margin-top: 6px; overflow: hidden; color: #f2f4f8; font-size: .74rem; letter-spacing: .06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.idc-hardware-panel-grid { position:relative; z-index:1; display:grid; min-height:0; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; background:rgba(211,178,117,.16); scrollbar-color:var(--idc-gold) rgba(4,10,25,.6); }
.idc-hardware-panel-card { position:relative; display:grid; min-width:0; min-height:clamp(220px,29vh,350px); grid-template-rows:minmax(150px,1fr) auto auto; padding:18px 20px 22px; border:0; background:linear-gradient(160deg,#0d1933,#071027); color:#aab5ca; cursor:pointer; text-align:left; isolation:isolate; transition:background .28s ease,color .28s ease; }
.idc-hardware-panel-card::after { position:absolute; top:0; right:0; left:0; height:2px; background:linear-gradient(90deg,transparent,var(--idc-gold),transparent); content:""; opacity:0; box-shadow:0 0 26px rgba(199,160,100,.62); }
.idc-hardware-panel-card:hover,.idc-hardware-panel-card.is-active { background:radial-gradient(circle at 50% 43%,rgba(199,160,100,.13),transparent 36%),linear-gradient(160deg,#152543,#09142e); color:#f2e5c8; }
.idc-hardware-panel-card:hover::after,.idc-hardware-panel-card.is-active::after { opacity:1; }
.idc-hardware-panel-card > .idc-hardware-thumb { min-height:150px; aspect-ratio:auto; }
.idc-hardware-panel-card > .idc-hardware-thumb::before { inset:10%; }
.idc-hardware-panel-card > .idc-hardware-thumb::after { inset:13%; }
.idc-hardware-panel-card:hover img { transform:translateY(-4px) scale(1.035); }
.idc-hardware-panel-card > i { margin-top:11px; color:var(--idc-gold); font:max(var(--type-micro),.55rem) var(--mono); font-style:normal; letter-spacing:.1em; }
.idc-hardware-panel-card > b { display:-webkit-box; overflow:hidden; margin-top:6px; color:#f2f4f8; font-size:.72rem; line-height:1.35; letter-spacing:.04em; text-transform:uppercase; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
@keyframes idc-model-overlay-in { from { opacity: 0; } to { opacity: 1; } }

@media (max-width:1050px) {
  .idc-model-panel-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .idc-decor-panel-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .idc-hardware-panel-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:720px) {
  .idc-model-overlay { padding:10px; }
  .idc-model-panel { max-height:calc(100dvh - 20px); }
  .idc-model-panel > header { min-height:104px; padding:18px; }
  .idc-model-panel > header h3 { font-size:1.55rem; }
  .idc-model-panel > header div > span,.idc-model-panel-close span { display:none; }
  .idc-model-panel-close { min-width:48px; padding:0 14px; }
  .idc-model-panel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .idc-decor-panel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .idc-hardware-panel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  /* IC2-07: the collection badge sits above the door picture, as on desktop. */
  .idc-model-panel-card { min-height:245px; padding:40px 12px 18px; }
  .idc-decor-panel-card { min-height:215px; padding:14px 11px 16px; }
  .idc-hardware-panel-card { min-height:215px; padding:14px 11px 16px; }
  .idc-model-panel-card > span { min-height:150px; }
}

/* Desktop Studio: cijeli konfigurator ostaje u jednom jasnom kadru na FHD/2K, bez skaliranja i gubitka oštrine. */
@media (min-width:1281px) and (min-height:800px) {
  .lumora-interior-config-section { padding-block:18px; }
  .idc-header { align-items:center; padding:28px clamp(34px,3.5vw,58px) 24px; }
  .idc-header :is(h1,h2) { font-size:clamp(3.05rem,3.8vw,4.7rem); line-height:.9; }
  .idc-header > div > p:last-child { margin-top:15px; font-size:.9rem; line-height:1.52; }
  .idc-header dl { min-width:330px; }
  .idc-header dl div { padding:13px 15px; }
  .idc-header dd { margin-top:5px; font-size:max(var(--type-micro), .58rem); }
  .idc-workspace { min-height:580px; }
  .idc-controls { align-content:center; gap:18px; padding:22px clamp(20px,2vw,34px); }
  .idc-controls section + section { padding-top:18px; }
  .idc-eyebrow,.idc-section-number { margin-bottom:10px; font-size:max(var(--type-micro), .59rem); }
  .idc-controls h3 { margin-bottom:5px; font-size:1.05rem; }
  .idc-help { margin-bottom:10px; font-size:max(var(--type-micro), .68rem); line-height:1.45; }
  .idc-swatch-grid { gap:4px; }
  .idc-swatch-grid button { gap:3px; padding:3px; }
  .idc-swatch-grid span { font-size:max(var(--type-micro), .49rem); }
  .idc-hardware-grid { gap:5px; }
  .idc-stage { min-height:580px; }
  .idc-stage-label { top:19px; left:22px; }
  .idc-door-canvas { width:min(91%,560px); }
  .idc-loupe { width:164px; }
  .idc-loupe > div { width:140px; }
  .idc-loupe > span { margin-top:10px; font-size:max(var(--type-micro), .49rem); }
  .idc-specification { padding:26px clamp(22px,2.4vw,42px); }
  .idc-specification header { padding-bottom:17px; }
  .idc-specification header > p { margin-bottom:9px; }
  .idc-specification h3 { margin-bottom:8px; font-size:clamp(2rem,2.45vw,2.8rem); }
  .idc-specification header small { font-size:.73rem; line-height:1.48; }
  .idc-specification > .idc-section-number { margin-top:18px; }
  .idc-specification dl > div { gap:12px; padding:8px 0; }
  .idc-specification dt { font-size:max(var(--type-micro), .68rem); line-height:1.4; }
  .idc-specification dd { color:#aab6cd; font-size:.78rem; line-height:1.45; }
  .idc-technical-note { margin:14px 0; font-size:max(var(--type-micro), .63rem); line-height:1.5; }
  .idc-primary-action,.idc-secondary-action { min-height:47px; }
  .idc-privacy { margin-top:10px; }
  .idc-model-rail > div:first-child { padding:26px 34px; }
  .idc-model-rail > div:first-child p { font-size:1.2rem; }
  .idc-model-rail > div:first-child small { margin-top:9px; font-size:max(var(--type-micro), .62rem); }
  .idc-model-rail button { min-height:clamp(190px,18vh,230px); padding:14px 15px 17px; }
  .idc-model-rail button > span { min-height:clamp(132px,12.5vh,164px); }
  .idc-model-rail button > b { font-size:.78rem; }
  .idc-model-rail .idc-model-expand > span { min-height:clamp(132px,12.5vh,164px); }
  .idc-model-rail button > i { top:14px; left:15px; }
}

@media (max-width: 1280px) {
  .idc-workspace { grid-template-columns: minmax(270px,.78fr) minmax(430px,1.22fr); }
  .idc-specification { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(250px,.75fr) minmax(360px,1.25fr); gap: 0 50px; border-top: 1px solid var(--idc-line); border-left: 0; }
  .idc-specification header { grid-row: 1 / span 3; padding-right: 42px; border-right: 1px solid var(--idc-line); border-bottom: 0; }
  .idc-specification > .idc-section-number,.idc-specification dl,.idc-specification .idc-technical-note,.idc-specification button,.idc-specification .idc-privacy { grid-column: 2; }
  .idc-specification > .idc-section-number { margin-top: 0; }
  .idc-loupe { left: 70%; width: 160px; }
  .idc-loupe > div { width: 138px; }
}

@media (max-width: 900px) {
  .idc-header { grid-template-columns: 1fr; }
  .idc-header dl { min-width: 0; }
  .idc-collection-switch { grid-template-columns:1fr; }
  .idc-collection-switch button { border-right:0; border-bottom:1px solid var(--idc-line); }
  .idc-collection-switch button:last-child { border-bottom:0; }
  .idc-workspace { display:flex; flex-direction:column; }
  .idc-stage { min-height: min(125vw,720px); order: 1; border-bottom: 1px solid var(--idc-line); }
  /* IC2-01: room above the door for the wrapped selection label (it ended on the door frame).
     The detail circle is placed within the door canvas, so it already moves down with the door. */
  .idc-stage { --idc-label-room: 56px; padding-top: var(--idc-label-room); }
  .idc-controls { order: 2; border-right: 0; }
  .idc-decor-picker { display: block; }
  .idc-specification { display:flex; order:3; border-top:1px solid var(--idc-line); }
  /* BS/SL/DE master mobile order: stage, controls, models, then specification. */
  html:is([lang="bs"],[data-shell="master"]) .idc { display:flex; flex-direction:column; }
  html:is([lang="bs"],[data-shell="master"]) .idc-workspace { display:contents; }
  html:is([lang="bs"],[data-shell="master"]) .idc-stage { order:1; }
  html:is([lang="bs"],[data-shell="master"]) .idc-controls { order:2; }
  html:is([lang="bs"],[data-shell="master"]) .idc-model-rail { order:3; }
  html:is([lang="bs"],[data-shell="master"]) .idc-specification { order:4; }
  html:is([lang="bs"],[data-shell="master"]) .idc :is(.idc-stage,.idc-controls,.idc-model-rail,.idc-specification) {
    content-visibility:auto;
  }
  html:is([lang="bs"],[data-shell="master"]) .idc-stage { contain-intrinsic-size:auto 520px; }
  html:is([lang="bs"],[data-shell="master"]) .idc-controls { contain-intrinsic-size:auto 872px; }
  html:is([lang="bs"],[data-shell="master"]) .idc-model-rail { contain-intrinsic-size:auto 308px; }
  html:is([lang="bs"],[data-shell="master"]) .idc-specification { contain-intrinsic-size:auto 1212px; }
  .idc-specification header { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--idc-line); }
  .idc-specification > .idc-section-number { margin-top: 34px; }
  .idc-model-rail { grid-template-columns: 1fr; }
  .idc-model-rail > div:first-child { border-right: 0; border-bottom: 1px solid var(--idc-line); }
  .idc-model-strip { grid-template-columns:minmax(0,1fr) 170px; }
  .idc-model-list { display:flex; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x mandatory; }
  .idc-model-list::-webkit-scrollbar { display:none; }
  .idc-model-list > button { min-width:220px; scroll-snap-align:start; }
}

@media (max-width: 600px) {
  .idc-header { padding: 44px 20px 32px; }
  .idc-header :is(h1,h2) { font-size: clamp(2.42rem,13vw,3.45rem); letter-spacing: var(--lumora-heading-tracking,-.012em); }
  .idc-header dl { grid-template-columns: 1fr; }
  .idc-header dl div { display: flex; min-width: 0; align-items: center; justify-content: space-between; padding: 13px 15px; border-right: 0; border-bottom: 1px solid var(--idc-line); }
  .idc-header dl div:last-child { border-bottom: 0; }
  .idc-header dd { margin-top: 0; }
  .idc-stage { --idc-label-room: 72px; min-height: 520px; }
  .idc-stage-label { top: 18px; left: 18px; max-width: calc(100% - 36px); }
  .idc-stage-label strong { max-width: 72vw; }
  .idc-door-canvas { width: 112%; }
  /* The canvas is wider than its stage; keep the detail circle inside the stage. */
  .idc-loupe { top: 50.5%; left: min(66%, calc(94% - 130px)); width: 122px; }
  .idc-loupe > div { width: 104px; }
  .idc-loupe > span { font-size: max(var(--type-micro), .45rem); }
  .idc-controls,.idc-specification { padding: 40px 20px; }
  .idc-swatch-grid { grid-template-columns: repeat(6,1fr); }
  .idc-decor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .idc-swatch-grid button { padding: 3px; }
  .idc-swatch-grid span { font-size: max(var(--type-micro), .48rem); }
  .idc-hardware-grid { gap: 6px; }
  .idc-specification dl > div { grid-template-columns: 1fr; gap: 5px; }
  .idc-specification dd { padding-left: 27px; text-align: left; }
  .idc-model-rail > div:first-child { padding: 24px 20px; }
  .idc-model-strip { grid-template-columns:minmax(0,1fr) 132px; }
  .idc-model-list > button { min-width:48vw; }
  .idc-model-rail .idc-model-expand { min-width:132px; padding-inline:8px; }
  .idc-model-rail .idc-model-expand > em { font-size:max(var(--type-micro), .4rem); }
}

@media (prefers-reduced-motion: reduce) {
  .idc button,.idc img { transition: none !important; }
  .lumora-interior-page--configurator-first .idc-primary-action > span { transition:none; }
  .lumora-interior-page--configurator-first .idc-primary-action:is(:hover,:focus-visible) > span { transform:none; }
}

/* Unutrašnja vrata: kompaktan, arhitektonski projektni poziv umjesto praznog svijetlog polja. */
.lumora-interior-page > .cta-section { position:relative; overflow:hidden; padding-block:clamp(42px,4vw,64px); isolation:isolate; }
.lumora-interior-page > .cta-section::before { position:absolute; z-index:-1; top:-75%; right:-8%; width:48%; aspect-ratio:1; border:1px solid rgba(199,160,100,.1); border-radius:50%; box-shadow:0 0 0 78px rgba(199,160,100,.025),0 0 0 156px rgba(199,160,100,.018); content:""; }
.lumora-interior-page > .cta-section .cta-inner { position:relative; overflow:hidden; min-height:230px; padding:clamp(34px,4vw,58px); box-shadow:0 35px 85px -58px rgba(0,0,0,.9),inset 0 1px rgba(255,255,255,.035); isolation:isolate; }
.lumora-interior-page > .cta-section .cta-inner::before { position:absolute; z-index:-1; top:0; bottom:0; left:0; width:3px; background:linear-gradient(#e7d0a0,#8b6636); box-shadow:0 0 22px rgba(199,160,100,.45); content:""; }
.lumora-interior-page > .cta-section .cta-inner::after { position:absolute; z-index:-1; top:-120%; right:-8%; width:46%; aspect-ratio:1; border:1px solid rgba(199,160,100,.12); border-radius:50%; box-shadow:0 0 0 54px rgba(199,160,100,.025),0 0 0 108px rgba(199,160,100,.018); content:""; }
.lumora-interior-page > .cta-section .cta-inner h2 { max-width:780px; font-size:clamp(2.15rem,3.55vw,4.35rem); line-height:1.02; letter-spacing:var(--lumora-heading-tracking,-.012em); }
.lumora-interior-page > .cta-section .button-primary { position:relative; min-width:220px; overflow:hidden; box-shadow:0 18px 40px -24px rgba(199,160,100,.9); }
.lumora-interior-page > .cta-section .button-primary::after { position:absolute; top:-70%; bottom:-70%; left:-40%; width:24%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent); content:""; transform:skewX(-20deg); transition:left .7s ease; }
.lumora-interior-page > .cta-section .button-primary:hover::after { left:118%; }
html[data-theme="day"] .lumora-interior-page > .cta-section .cta-inner { border-color:rgba(112,83,46,.25); background:linear-gradient(118deg,rgba(255,253,248,.98),rgba(237,227,212,.92)); box-shadow:0 35px 85px -58px rgba(72,51,26,.48),inset 0 1px #fff; }
html[data-theme="day"] .lumora-interior-page > .cta-section .cta-inner::after { border-color:rgba(112,83,46,.12); }
@media (max-width:760px) {
  .lumora-interior-page > .cta-section .cta-inner { min-height:0; align-items:flex-start; padding:30px 24px; flex-direction:column; }
  .lumora-interior-page > .cta-section .button-primary { width:100%; }
}

/* BS vodi direktno u konfigurator, uz očuvan, server-renderovan naslov stranice. */
.lumora-interior-page--configurator-first .lumora-interior-config-section { padding-top:clamp(26px,3vw,52px); }
.lumora-configurator-first-heading {
  width:min(100% - 40px,1760px);
  margin:0 auto clamp(22px,2.8vw,42px);
  padding:clamp(22px,2.5vw,38px) clamp(20px,3vw,48px);
  border:1px solid rgba(199,160,100,.24);
  background:linear-gradient(120deg,rgba(16,29,57,.96),rgba(7,15,34,.98));
  box-shadow:0 28px 70px -52px rgba(0,0,0,.9),inset 0 1px rgba(255,255,255,.035);
}
.lumora-configurator-first-heading .breadcrumb { margin-bottom:clamp(22px,2vw,32px); }
html[data-theme="night"] .lumora-configurator-first-heading .breadcrumb { color:#8f9bb4; }
.lumora-configurator-first-heading h1 {
  max-width:18ch;
  margin:10px 0 0;
  color:#f4f7fc;
  font-size:clamp(2.5rem,5.2vw,6.1rem);
  font-weight:var(--lumora-heading-weight,300);
  line-height:.96;
  letter-spacing:var(--lumora-heading-tracking,-.012em);
  text-wrap:balance;
}
html[data-theme="day"] .lumora-configurator-first-heading {
  border-color:rgba(126,91,43,.25);
  background:radial-gradient(circle at 92% 0,rgba(199,160,100,.16),transparent 36%),linear-gradient(120deg,#fffdf8,#eee4d5);
  box-shadow:0 28px 70px -52px rgba(75,52,26,.48),inset 0 1px #fff;
}
html[data-theme="day"] .lumora-configurator-first-heading h1 { color:#171b24; }
@media (max-width:760px) {
  .lumora-configurator-first-heading { width:calc(100% - 24px); margin-bottom:18px; padding:22px 18px; }
  .lumora-configurator-first-heading h1 { font-size:clamp(2.2rem,12vw,3.5rem); }
}
/* J06 (phone review of the translations, decision 109), Swedish only, 380-560 px: there "INNERDÖRRAR" fits its line,
   but with the translated title limit (globals.css, 10 4 4) Chromium still hyphenated it in the balanced title
   ("LUMORA- / INNER- / DÖRRAR / EFTER MÅTT"). No hyphenation keeps today's three lines; below 380 px the word does not
   fit and keeps its hyphen. BS never matches. */
@media (min-width:380px) and (max-width:560px) {
  :root:lang(sv) .lumora-configurator-first-heading h1 { -webkit-hyphens:manual; hyphens:manual; }
}

/* Approved LUMORA probes 146. */
/* i18n:bs-length-lock */ html[lang="bs"] body .lumora-bs-scope main .idc .idc-swatch-grid button > span {
  font-size: 11px;
  line-height: 1.35;
  letter-spacing: 0;
  overflow: visible;
  text-overflow: clip;
}
html:is([lang="bs"],[data-shell="master"]) body .lumora-bs-scope main .idc .idc-hardware-grid button > i,
html:is([lang="bs"],[data-shell="master"]) body .lumora-bs-scope main .idc .idc-collection-switch button small {
  font-size: 11px;
  line-height: 1.35;
}
@media (max-width:360px) {
  html:is([lang="bs"],[data-shell="master"]) body .lumora-bs-scope main .idc .idc-swatch-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
}
/* r2-layout-lumora-04 (decision 123): the 11 px "OSTALO" (41 px) ran 1-6 px past its tile at 910-980 and
   1282-1510 px; the "other colour" label is a size smaller and may use the tile padding, still centred. */
html[lang="bs"] body .lumora-bs-scope main .idc .idc-swatch-grid .idc-other-color > span { font-size: 10px; margin-inline: -4px; text-align: center; }
/* K5 hr/sr (Oct 2026, H7), translated pages only: the BS length lock above stays BS-only (W6 F3),
   so on hr and sr pages the same word "OSTALO" was clipped to "OSTAL…" (1440, 1024 and 390 px):
   the label is 41 px wide, 3 px more than the tile's text box, which BS lets run into the tile's
   own padding. The "other colour" tile alone gets the BS label rules back (no tracking, visible,
   no ellipsis), so the same word looks as it does in BS; the colour tiles keep the foreign rules.
   Bug hunt round 2 T2-23 (rest of r2-layout-lumora-04 on the translated pages): the label was still 11 px and
   started at the left padding, so hr/sr "OSTALO" ran up to 7 px past the tile at 901-1030 and 1290-1410 px (and
   1-2 px at 320-375), sl "DRUGO" up to 4 px, sv "ÖVRIGT" up to 6 px. It now gets the BS r2-layout-lumora-04 size,
   padding use and centring as well; at 10 px every one of these words is at most as wide as BS "OSTALO". */
html:not(:lang(bs)) body .lumora-bs-scope main .idc .idc-swatch-grid .idc-other-color > span { font-size: 10px; margin-inline: -4px; letter-spacing: 0; overflow: visible; text-align: center; text-overflow: clip; }
/* Bug hunt round 3 (r3-layout-lumora-05, the rest of r2-layout-lumora-04): laptop windows lower than 800 px
   (1282-1386 px wide, 1366x768 among them) keep the 5 px tile padding, so the tiles are 34-37 px wide and "OSTALO"
   started at the left padding and ran 2-4.5 px past the tile. There the label box is as wide as the tile plus a
   pixel on each side, so the centred word sits in the middle of the tile (at most half a pixel past it at 1282 px),
   and the word is half a pixel smaller (9.5 px); 800 px and taller windows are unchanged. */
@media (min-width: 1281px) and (max-height: 799px) {
  html:is([lang="bs"], :not(:lang(bs))) body .lumora-bs-scope main .idc .idc-swatch-grid .idc-other-color > span { margin-inline: -7px; font-size: 9.5px; text-align: center; }
}

/* Keep the hardware index readable over both light and dark photography. */
html:is([lang="bs"],[data-shell="master"]) .idc .idc-hardware-grid button > i { padding:2px 3px; background:#101b36; color:#e7d0a0; }
html:is([lang="bs"],[data-shell="master"])[data-theme="day"] .idc .idc-hardware-grid button > i { background:#f9f5ed; color:#68491f; }

/* Room for longer translated labels (length probe, fixes 4 and 6), translated pages only: a word
   wider than its tile or card breaks inside it instead of spilling out, so the "+ N" decor tile
   and the panel cards grow with the label. Scoped away from BS (html lang="bs"): 'PRIKAŽITE' and
   'LJUBLIANA' are a fraction of a pixel wider than the 58 px decor tile text box and show whole
   (or as 'LJUBLIA…') today, so 'anywhere' would split them. :where() keeps the specificity.
   Bug hunt round 3 (r3-layout-locales-03): the decor "show all" tile label is no longer in this list. hr/sr have
   the same word as BS, "PRIKAŽITE", which is up to 1.3 px wider than the tile at some widths; 'anywhere' (and
   'break-word' too) split it ('PRIKAŽIT / E SVE'), so it now shows whole as on BS. The sl and sv labels fit. */
:where(:root:not(:lang(bs))) .idc-decor-grid .idc-decor-expand > b { overflow-wrap: normal; }
:where(:root:not(:lang(bs))) .idc-decor-grid button:not(.idc-decor-expand) > b,
:where(:root:not(:lang(bs))) .idc-model-panel-card > :is(i, b, em, small, .idc-model-preview-finish),
:where(:root:not(:lang(bs))) .idc-decor-panel-card > :is(i, b),
:where(:root:not(:lang(bs))) .idc-hardware-panel-card > :is(i, b) { overflow-wrap: anywhere; }

/* K5 sv, length-guarded locales only (never BS): the glass choice "ORNAMENTGLAS (FROSTAT)" ran 2.8 px past its card at
   1024 px. A smaller swatch and gap give the label the room; the word stays whole (10.9 px inside the card after). */
:where(html:not(:lang(bs))[data-length-guard]) .idc-glass-grid button { grid-template-columns: 34px 1fr; gap: 9px; }
:where(html:not(:lang(bs))[data-length-guard]) .idc-glass-grid i { width: 34px; }
:where(html:not(:lang(bs))[data-length-guard]) .idc-glass-grid span { letter-spacing: .02em; }
/* K5 de round 2 (release 3, 31 Oct 2026; TL/l2-code/k5fix/judge/FIX-R2.md), German pages only: "ORNAMENTGLAS
   (MATTIERT)" inked 2.8 px past its card at 1024 px (4.6 px at 1012 px). German has no length guard, so the K5 sv rule
   above never matched; the same smaller swatch and gap keep the word whole, about 9-13 px inside the card. */
:where(html:lang(de)) .idc-glass-grid button { grid-template-columns: 34px 1fr; gap: 9px; }
:where(html:lang(de)) .idc-glass-grid i { width: 34px; }
:where(html:lang(de)) .idc-glass-grid span { letter-spacing: .02em; }

/* Decision 120 item 5, phones only: the selected door stays in view while the visitor chooses (door-mini-preview.tsx).
   The anchor is a zero-height item right after the stage; once the stage has scrolled away it sticks under the LUMORA
   header and its bar hangs over the choices, until the end of the configurator clips it. On phones the configurator
   clips with overflow: clip (the same clip as hidden, but the anchor can stick to the page); a browser without clip
   keeps hidden and simply shows no bar. The door window crops only the transparent margin of the square layers. */
.idc-mini { display:none; }
@media (max-width:700px) {
  html:is([lang="bs"],[data-shell="master"]) .idc { overflow:clip; }
  html:is([lang="bs"],[data-shell="master"]) .idc-mini { position:sticky; z-index:6; top:var(--idc-mini-top,78px); display:block; height:0; order:1; }
  .idc-mini-bar {
    position:absolute;
    top:0;
    right:0;
    left:0;
    display:grid;
    min-height:96px;
    grid-template-columns:42px 40px minmax(0,1fr) 30px;
    gap:10px;
    align-items:center;
    padding:8px max(14px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));
    border:0;
    border-bottom:1px solid rgba(199,160,100,.4);
    background:linear-gradient(115deg,#0f1b39,#070e20);
    box-shadow:0 22px 36px -24px rgba(0,0,0,.92);
    color:#f4f6fb;
    cursor:pointer;
    font:inherit;
    text-align:left;
    opacity:0;
    visibility:hidden;
    transform:translateY(-10px);
    transition:opacity .22s ease,transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s linear .3s;
    -webkit-tap-highlight-color:transparent;
  }
  .idc-mini[data-shown] .idc-mini-bar { opacity:1; visibility:visible; transform:none; transition:opacity .22s ease,transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s; }
  .idc-mini-bar::after { position:absolute; right:0; bottom:-1px; left:0; height:1px; background:linear-gradient(90deg,transparent,var(--idc-gold),transparent); content:""; pointer-events:none; }
  .idc-mini-bar:focus-visible { outline:2px solid var(--idc-gold-hi); outline-offset:-3px; }
  .idc-mini-door { position:relative; width:42px; height:80px; overflow:hidden; background:radial-gradient(70% 55% at 50% 44%,rgba(42,61,112,.6),transparent 78%); }
  .idc-mini-canvas { position:absolute; top:-2px; left:-20.9px; width:84px; height:84px; transition:opacity .2s ease; }
  .idc-mini-canvas > img { object-fit:contain; filter:drop-shadow(0 4px 4px rgba(0,0,0,.42)); }
  .idc-mini-canvas > img.idc-glass-layer { filter:none; }
  .idc-mini-canvas > img.idc-hardware-layer { filter:drop-shadow(0 1px 1px rgba(0,0,0,.32)); }
  .idc-mini-placeholder { position:absolute; top:50%; left:50%; display:block; width:26px; height:52px; border:1px solid rgba(199,160,100,.7); background:linear-gradient(145deg,rgba(199,160,100,.16),rgba(255,255,255,.015)); transform:translate(-50%,-50%) perspective(80px) rotateY(-7deg); }
  .idc-mini-bar[data-state="loading"] .idc-mini-canvas { opacity:.55; }
  .idc-mini-bar[data-state="loading"] .idc-mini-door::after { position:absolute; inset:0; background:linear-gradient(100deg,transparent 25%,rgba(231,208,160,.34) 50%,transparent 75%); content:""; animation:idc-mini-sweep 1.15s ease-in-out infinite; }
  .idc-mini-loupe { position:relative; width:40px; height:40px; overflow:hidden; border:1px solid var(--idc-gold); border-radius:50%; background:radial-gradient(circle,#f8f3e9 0 48%,#d5bea0 100%); box-shadow:0 0 0 3px rgba(199,160,100,.1),0 8px 18px rgba(0,0,0,.34); }
  .idc-mini-loupe img { object-fit:contain; }
  .idc-mini-copy { display:grid; min-width:0; gap:4px; }
  .idc-mini-copy small { overflow:hidden; color:var(--idc-gold); font:600 max(var(--type-micro),.56rem)/1.2 var(--mono); letter-spacing:.14em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
  .idc-mini-copy strong { display:-webkit-box; overflow:hidden; color:#c9d1e3; font:500 max(var(--type-micro),.62rem)/1.35 var(--mono); letter-spacing:.03em; -webkit-box-orient:vertical; -webkit-line-clamp:4; }
  .idc-mini-bar[data-state="failed"] .idc-mini-copy small { color:#e7b9a4; }
  .idc-mini-go { position:relative; width:30px; height:30px; border:1px solid rgba(199,160,100,.55); border-radius:50%; }
  .idc-mini-go::before { position:absolute; top:12px; left:10.5px; width:7px; height:7px; border-top:1.4px solid var(--idc-gold-hi); border-left:1.4px solid var(--idc-gold-hi); content:""; transform:rotate(45deg); }
  html[data-theme="day"] .idc-mini-bar { border-bottom-color:rgba(169,131,76,.38); background:linear-gradient(115deg,#fbf8f2,#eee6da); box-shadow:0 22px 36px -26px rgba(62,47,29,.5); color:#1b1f26; }
  html[data-theme="day"] .idc-mini-door { background:radial-gradient(70% 55% at 50% 44%,rgba(169,131,76,.17),transparent 78%); }
  html[data-theme="day"] .idc-mini-canvas > img:not(.idc-glass-layer):not(.idc-hardware-layer) { filter:drop-shadow(0 4px 4px rgba(62,47,29,.24)); }
  html[data-theme="day"] .idc-mini-loupe { box-shadow:0 0 0 3px rgba(169,131,76,.1),0 8px 16px rgba(62,47,29,.2); }
  html[data-theme="day"] .idc-mini-copy small { color:#68471f; }
  html[data-theme="day"] .idc-mini-copy strong { color:#4f5660; }
  html[data-theme="day"] .idc-mini-bar[data-state="failed"] .idc-mini-copy small { color:#8a3b22; }
  html[data-theme="day"] .idc-mini-go { border-color:rgba(126,91,43,.45); }
  html[data-theme="day"] .idc-mini-go::before { border-color:#7f6033; }
}
@keyframes idc-mini-sweep { from { transform:translateX(-100%); } to { transform:translateX(100%); } }
@media (max-width:700px) and (prefers-reduced-motion: reduce) {
  .idc-mini-bar,.idc-mini[data-shown] .idc-mini-bar { transform:none; transition:opacity .01s linear,visibility 0s; }
  .idc-mini-bar[data-state="loading"] .idc-mini-door::after { animation:none; opacity:.6; }
}

/* Bug hunt T53 (decision 123): the 'Prikažite sve' label of the last handle tile stayed on one
   line and was cut by the tile edge where the tile is narrower than the label (320-344 px and
   1290-1500 px on laptop heights). It may use the tile's 3 px side padding as before and wraps to
   two centred lines only where it is still wider; wider tiles keep their one line. */
.idc-hardware-grid .idc-hardware-expand > em { max-width:calc(100% + 6px); margin-inline:-3px; white-space:normal; text-align:center; }

/* Bug hunt T54 (decision 123): on 320-329 px phones the label 'UNUTRAŠNJA VRATA' of the phone door
   bar was 4 px too wide and ended in '…'. A slightly narrower gap and letter spacing let it fit;
   the entrance bar is unchanged. */
@media (max-width:329px) {
  .idc-mini-bar { column-gap:8px; }
  .idc-mini-copy small { letter-spacing:.12em; }
}

/* Bug hunt T56 (decision 123): in Day the 'n dodatnih modela' line under 'Prikažite sve' was
   #626a75 on the light gold card, 3.4-4.2 : 1. It takes the darker helper grey of the entrance
   control surfaces (#444b56, above 4.5 : 1 on the card); Night is unchanged. */
html[data-theme="day"] .idc-model-rail .idc-model-expand > em { color:#444b56; }

/* Decision 124 (owner, 21 Oct 2026; bug hunt item T74): in the day theme the small gold labels of the
   interior configurator (collection and model numbers, the "Unutrašnja vrata" stage label, the
   specification numbers, the catalogue eyebrow and numbers of the open model and hardware lists) take a
   darker bronze of the same gold, the lightest tone that keeps 4.5 : 1 on the light panels
   (#a9834c -> #7b5f37; 2.8-3.4 : 1 before). The RAL line of the model cards (#91672e -> #7e5a28, 3.8-4.3)
   and the loupe label over the hardware photo (#71552f -> #624929, 3.8-4.5) take the same step of their
   own bronze. Night and every other colour are unchanged. */
html[data-theme="day"] .idc :is(.idc-collection-switch i,.idc-stage-label span,.idc-specification dt i,.idc-model-rail button > i,.idc-model-panel > header p,.idc-model-panel-card > i,.idc-hardware-panel-card > i) { color: #7b5f37; }
html[data-theme="day"] .idc .idc-model-panel-card > .idc-model-preview-finish { color: #7e5a28; }
html[data-theme="day"] .idc .idc-loupe > span { color: #624929; }