:root {
  --paper: #f4f4f4;
  --stone: #e5e5e5;
  --charcoal: #292929;
  --white: #ffffff;
  --ink: #292929;
  --muted: #696969;
  --line: #d7d7d7;
  --red: #5b5b5b;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --gutter: clamp(24px, 5vw, 88px);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family:
    -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue",
    Arial, sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  cursor: pointer;
  color: inherit;
}
button:disabled {
  opacity: 0.45;
  cursor: default;
}
button {
  border: 0;
  background: none;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 6px;
}
input:focus,
select:focus,
textarea:focus {
  outline: 1px solid var(--red);
  outline-offset: 3px;
}
img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
svg {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  stroke-width: 1.4;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}
h1,
h2,
h3,
p {
  margin: 0;
}
h1,
h2,
h3 {
  font-weight: 300;
}
p {
  line-height: 1.8;
}
::selection {
  background: #62626230;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.skip {
  position: fixed;
  top: -80px;
  left: 20px;
  background: white;
  color: var(--ink);
  padding: 12px;
  z-index: 100;
}
.skip:focus {
  top: 12px;
}
.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.19em;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.6;
}
.quiet {
  color: var(--muted);
}
.page {
  animation: appear 0.55s var(--ease);
}
.page[hidden] {
  display: none !important;
}
.cc-added-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: clamp(16px, 2vw, 32px);
  max-width: 1400px;
  margin: clamp(42px, 7vw, 112px) auto 0;
  padding: 0 var(--gutter);
}
.cc-added-image {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  background: var(--stone);
}
.cc-added-image img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 160px;
  object-fit: contain;
}
@keyframes appear {
  from {
    opacity: 0.25;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 99px;
  padding: 0 var(--gutter);
  display: flex;
  align-items: center;
  gap: 36px;
  z-index: 30;
  color: white;
  transition:
    background 0.3s,
    height 0.3s,
    color 0.3s;
  border-bottom: 1px solid #ffffff26;
}
.header.solid {
  background: rgba(245, 244, 242, 0.97);
  color: var(--ink);
  height: 82px;
  border-bottom-color: var(--line);
  backdrop-filter: blur(14px);
}
.logo {
  width: 150px;
  flex-shrink: 0;
  display: block;
}
.logo img {
  height: auto;
  object-fit: contain;
}
/* The supplied red bitmap is immediately visible on light pages. Its white
   appearance follows the photo header in CSS, without a second image request. */
.header:not(.solid) .logo img:is([src="/assets/images/logo-rosso.png"], [src="assets/images/logo-rosso.png"]) {
  filter: brightness(0) invert(1);
}
.header.solid .logo img {
  filter: none;
}
.nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 25px;
}
.nav a {
  position: relative;
  font-size: 12px;
  white-space: nowrap;
  padding: 15px 0;
}
.nav a:after {
  content: "";
  position: absolute;
  bottom: 4px;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.25s;
}
.nav a:hover:after,
.nav a.active:after {
  transform: scaleX(1);
}
.tools {
  display: grid;
  grid-template-columns: repeat(4, 44px);
  flex-shrink: 0;
  gap: 8px;
  align-items: center;
}
.tools .icon-btn {
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 8px;
}
.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 44px;
  padding: 8px;
  position: relative;
}
.icon-btn:hover {
  color: var(--red);
}
.count-dot {
  position: absolute;
  right: 2px;
  top: 5px;
  background: var(--red);
  color: white;
  font-size: 9px;
  border-radius: 12px;
  min-width: 15px;
  height: 15px;
  display: grid;
  place-items: center;
}
.count-dot:empty {
  display: none;
}
.hero {
  height: calc(100svh - 88px);
  min-height: min(560px, calc(100svh - 88px));
  max-height: 1150px;
  position: relative;
  background: #4f4f4f;
  color: white;
  overflow: hidden;
}
.hero-photo {
  position: absolute;
  inset: 0;
  object-position: 50% 60%;
  transition: opacity 0.35s;
}
.hero:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    #16161670 0%,
    #1616160d 30%,
    #16161620 54%,
    #16161670 100%
  );
  pointer-events: none;
}
.hero-center {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  padding: 110px 24px 150px;
}
.hero-center .eyebrow {
  margin-bottom: 30px;
  font-size: 10px;
  text-shadow: 0 1px 8px #00000066;
}
.hero h1 {
  font-size: clamp(58px, 7.4vw, 118px);
  line-height: 1.14;
  letter-spacing: -0.015em;
  text-shadow: 0 2px 24px #00000022;
  font-weight: 300;
}
.hero-link {
  margin-top: 36px;
  font-size: 12px;
  display: flex;
  gap: 24px;
  align-items: center;
  border-bottom: 0;
  padding: 12px 0;
}
.hero-bottom {
  pointer-events: none;
  position: absolute;
  z-index: 2;
  bottom: 36px;
  left: var(--gutter);
  right: var(--gutter);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 25px;
}
.hero-caption {
  font-size: 11px;
  letter-spacing: 0.04em;
  line-height: 1.8;
}
.hero-caption span {
  display: block;
  opacity: 0.65;
  font-size: 10px;
}
.scroll-link {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  display: flex;
  align-items: center;
  gap: 20px;
}
.scroll-link svg {
  transform: rotate(90deg);
  width: 18px;
}
.intro {
  padding: 106px var(--gutter) 110px;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 60px;
}
.intro .eyebrow {
  padding-top: 10px;
}
.intro h2 {
  font-size: clamp(35px, 4vw, 62px);
  line-height: 1.17;
  letter-spacing: -0.015em;
  max-width: 860px;
}
.intro p {
  max-width: 590px;
  font-size: 14px;
  margin-top: 28px;
  color: var(--muted);
}
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 38px;
  font-size: 12px;
  border-bottom: 0;
  padding: 13px 0;
  margin-top: 26px;
}
.text-link svg {
  width: 18px;
  transition: transform 0.3s;
}
.text-link:hover svg {
  transform: translateX(5px);
}
.text-link:hover {
  color: inherit;
}
.section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 35px;
}
.section-head h2 {
  font-size: clamp(32px, 3.5vw, 50px);
  letter-spacing: -0.015em;
}
.section-head .text-link {
  margin: 0;
}
.gallery-section {
  padding: 0 var(--gutter) 110px;
}
.gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.product-card {
  display: flex;
  flex-direction: column;
  position: relative;
  min-width: 0;
}
.card-image {
  flex-shrink: 0;
  display: block;
  width: 100%;
  height: clamp(310px, 37vw, 570px);
  padding: 0;
  overflow: hidden;
  background: #dcdcdc;
  position: relative;
  text-align: left;
}
.card-image img {
  transition: transform 0.9s var(--ease);
  object-position: center 55%;
}
.card-image:after {
  content: "";
  position: absolute;
  inset: 65% 0 0;
  background: linear-gradient(transparent, #1616165c);
  pointer-events: none;
}
.card-save {
  position: absolute;
  top: 14px;
  right: 14px;
  background: #f6f6f6e8;
  width: 38px;
  height: 38px;
  min-height: 38px;
  z-index: 1;
}
.card-save[aria-pressed="true"] {
  color: var(--red);
}
.card-save[aria-pressed="true"] svg {
  fill: #62626222;
}
.card-info {
  flex: 1;
  display: flex;
  justify-content: space-between;
  gap: 15px;
  align-items: center;
  padding: 21px 0;
  border-bottom: 1px solid var(--line);
}
.card-info h3 {
  font-size: 23px;
  letter-spacing: -0.015em;
}
.card-info p {
  font-size: 10px;
  color: var(--muted);
  margin-top: 6px;
}
.card-info a {
  flex: 1;
}
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 650px;
}
.split-photo {
  min-height: 600px;
  position: relative;
  overflow: hidden;
  background: #b3b3b3;
}
.split-photo img {
  position: absolute;
  inset: 0;
  object-position: 50% 55%;
}
.split-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 85px clamp(32px, 7vw, 120px);
}
.split-copy h2 {
  font-size: clamp(40px, 4.2vw, 68px);
  letter-spacing: -0.015em;
  line-height: 1.19;
  margin: 28px 0;
}
.split-copy p {
  font-size: 14px;
  color: var(--muted);
  max-width: 460px;
}
.dark {
  background: var(--ink);
  color: var(--paper);
}
.dark p.quiet,
.dark .split-copy p {
  color: #b8b8b8;
}
.dark .text-link {
  border-color: #8a8a8a;
}
.image-note {
  position: absolute;
  bottom: 18px;
  left: 24px;
  color: #ffffff;
  font-size: 9px;
  letter-spacing: 0.1em;
  z-index: 2;
  background: #25252594;
  padding: 8px 12px;
}
.wide-story {
  height: 630px;
  position: relative;
  color: white;
}
.wide-story:after {
  content: "";
  position: absolute;
  inset: 0;
  background: #18181863;
}
.wide-story img {
  position: absolute;
  inset: 0;
}
.wide-story .content {
  position: relative;
  z-index: 1;
  padding: 80px var(--gutter);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.wide-story h2 {
  font-size: clamp(40px, 5.2vw, 76px);
  line-height: 1.15;
  letter-spacing: -0.015em;
  max-width: 820px;
  margin: 25px 0;
}
.wide-story p {
  font-size: 13px;
  max-width: 440px;
}
.journal {
  padding: 100px var(--gutter);
}
.journal-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}
.journal-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.journal-card img {
  flex-shrink: 0;
  height: 260px;
  transition: filter 0.25s;
}
.journal-card .eyebrow {
  font-size: 9px;
  color: var(--muted);
  margin: 22px 0 12px;
}
.journal-card h3 {
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -0.015em;
}
.journal-card h3 {
  margin-bottom: 20px;
}
.journal-card .text-link {
  margin-top: auto;
  align-self: flex-start;
}
.callout {
  padding: 70px var(--gutter);
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}
.callout h2 {
  font-size: clamp(30px, 3.5vw, 50px);
  letter-spacing: -0.015em;
}
.button {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 38px;
  padding: 18px 24px;
  border: 1px solid var(--ink);
  font-size: 12px;
  background: var(--ink);
  color: var(--paper);
  transition: background 0.2s;
  min-height: 52px;
}
.button:hover {
  background: #404040;
}
.button.secondary {
  background: transparent;
  color: inherit;
}
.button.secondary:hover {
  background: #88888811;
}
.button svg {
  width: 19px;
}
.footer {
  padding: 65px var(--gutter) 26px;
  background: #1c1c1c;
  color: #e1e1e1;
}
.footer-top {
  display: grid;
  grid-template-columns: 1.8fr 0.7fr 0.7fr;
  gap: 80px;
  padding-bottom: 50px;
}
.footer-logo {
  width: 166px;
  height: auto;
  margin-bottom: 28px;
}
.footer-description {
  font-size: 12px;
  line-height: 1.9;
  color: #b6b6b6;
  max-width: 600px;
}
.footer h3 {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.17em;
  margin-bottom: 24px;
  color: #8d8d8d;
  font-weight: 500;
}
.footer-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  font-size: 12px;
}
.footer-links a:hover {
  color: white;
  text-decoration: none;
}
.footer-bottom {
  border-top: 1px solid #535353;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding-top: 25px;
  font-size: 10px;
  color: #a4a4a4;
}
.footer-bottom button {
  padding: 0;
  color: inherit;
  font-size: 10px;
}
.footer-bottom > div {
  display: flex;
  gap: 25px;
}
.footer .instagram {
  display: inline-flex;
  gap: 20px;
  align-items: center;
}
.footer .instagram svg {
  width: 15px;
}
.inner-head {
  padding: 155px var(--gutter) 66px;
}
.inner-head .eyebrow {
  color: var(--muted);
  margin-bottom: 26px;
}
.inner-head h1 {
  font-size: clamp(50px, 6vw, 88px);
  line-height: 1.15;
  letter-spacing: -0.015em;
}
.inner-head p {
  font-size: 14px;
  color: var(--muted);
  max-width: 540px;
  margin-top: 25px;
}
.inner-head.row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 60px;
}
.inner-head.row p {
  max-width: 380px;
}
.filters {
  display: flex;
  gap: 28px;
  border-bottom: 1px solid var(--line);
  margin: 0 var(--gutter) 40px;
  overflow: auto;
}
.filter {
  padding: 15px 0;
  font-size: 12px;
  white-space: nowrap;
  position: relative;
  color: var(--muted);
  border-bottom: 2px solid transparent;
}
.filter.active {
  color: var(--ink);
  border-bottom-color: var(--red);
}
.products-grid {
  padding: 0 var(--gutter) 100px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 45px 24px;
}
.empty {
  padding: 40px 0;
  color: var(--muted);
  font-size: 14px;
  grid-column: 1/-1;
}
.method {
  padding: 85px var(--gutter);
}
.steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  margin-top: 50px;
}
.step {
  border-top: 1px solid var(--line);
  padding-top: 20px;
}
.step > span {
  font-size: 11px;
  color: var(--red);
}
.step h3 {
  font-size: 25px;
  margin: 25px 0 14px;
}
.step p {
  font-size: 13px;
  color: var(--muted);
}
.form-section {
  padding: 85px var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 100px;
  background: #ededed;
}
.form-section h2 {
  font-size: 42px;
  letter-spacing: -0.015em;
  line-height: 1.15;
  margin: 25px 0;
}
.form-section p {
  font-size: 13px;
  color: var(--muted);
  max-width: 330px;
}
.project-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 25px;
}
.field {
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 11px;
}
.field.wide,
.form-note,
.project-form .button {
  grid-column: 1/-1;
}
.field label {
  color: #535353;
}
.field input,
.field select,
.field textarea {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #b3b3b3;
  background: transparent;
  padding: 12px 0;
  border-radius: 0;
  color: var(--ink);
  font-size: 14px;
  min-height: 44px;
}
.field textarea {
  resize: vertical;
  min-height: 100px;
}
.form-note {
  font-size: 11px !important;
  max-width: none !important;
  line-height: 1.6 !important;
}
.project-form .button {
  justify-self: start;
}
.form-success {
  color: #555555;
  grid-column: 1/-1;
  font-size: 13px;
  line-height: 1.7;
}
.faq-section {
  padding: 65px var(--gutter) 100px;
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 100px;
}
.faq-section h2 {
  font-size: 40px;
  letter-spacing: -0.015em;
}
.faq-list details {
  border-bottom: 1px solid var(--line);
  padding: 23px 0;
}
.faq-list details:first-child {
  border-top: 1px solid var(--line);
}
.faq-list summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  font-size: 15px;
}
.faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-list summary:after {
  content: "+";
  font-size: 23px;
  font-weight: 300;
}
.faq-list details[open] summary:after {
  content: "−";
}
.faq-list p {
  font-size: 13px;
  color: var(--muted);
  padding: 18px 35px 0 0;
}
.material-controls {
  margin: 25px 0;
  display: flex;
  gap: 15px;
}
.material-chip {
  border: 1px solid #b1b1b1;
  padding: 5px;
  width: 52px;
  height: 52px;
}
.material-chip span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--swatch);
}
.material-chip.active {
  outline: 1px solid var(--red);
  outline-offset: 4px;
}
.material-detail {
  min-height: 120px;
}
.material-detail h3 {
  font-size: 23px;
  margin-bottom: 10px;
}
.material-detail p {
  font-size: 13px;
}
.lighting {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  background: #292929;
  color: #f1f1f1;
}
.light-stage {
  height: 690px;
  position: relative;
  overflow: hidden;
  --light-color: 255, 65, 65;
  --brightness: 0.3;
}
.light-stage img {
  object-position: 50% 40%;
  filter: brightness(0.72);
}
.light-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  background: linear-gradient(
    90deg,
    rgba(var(--light-color), var(--brightness)),
    transparent 35%,
    transparent 67%,
    rgba(var(--light-color), var(--brightness))
  );
  transition: background 0.5s;
}
.light-overlay.cycle {
  animation: rgbCycle 12s linear infinite;
}
@keyframes rgbCycle {
  0%,
  100% {
    filter: hue-rotate(0deg);
  }
  33% {
    filter: hue-rotate(120deg);
  }
  66% {
    filter: hue-rotate(240deg);
  }
}
.light-panel {
  padding: 80px clamp(30px, 6vw, 95px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.light-panel h2 {
  font-size: 48px;
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin: 25px 0;
}
.light-panel p {
  font-size: 13px;
  color: #bbbbbb;
}
.light-options {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin: 30px 0;
}
.light-option {
  border: 1px solid #616161;
  padding: 17px 4px;
  font-size: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.light-option span {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--dot);
}
.light-option.active {
  border-color: #f6f6f6;
  background: #ffffff08;
}
.light-range {
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 11px;
  margin: 10px 0 22px;
}
.light-range input {
  width: 100%;
  accent-color: #bfbfbf;
}
.light-power {
  display: flex;
  gap: 10px;
  align-items: center;
  align-self: flex-start;
  font-size: 12px;
  border-bottom: 1px solid #747474;
  padding: 10px 0;
}
.light-power svg {
  width: 17px;
}
.small-note {
  font-size: 10px !important;
  color: #909090 !important;
  margin-top: 25px;
  line-height: 1.6;
}
.article-body {
  max-width: 760px;
  margin: auto;
  padding: 65px 30px 90px;
}
.article-body p {
  margin: 20px 0;
  color: var(--muted);
  font-size: 15px;
}
.article-body h2 {
  font-size: 33px;
  letter-spacing: -0.015em;
  margin-top: 42px;
}
.article-cover {
  height: 530px;
  margin: 0 var(--gutter);
}
/* Lucide icon paths, ISC license. Copyright Lucide Contributors. */
dialog {
  border: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
  max-width: none;
  max-height: 90svh;
  box-shadow: 0 20px 80px #00000033;
}
dialog::backdrop {
  background: #1717179e;
  backdrop-filter: blur(5px);
}
.dialog-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 32px;
  border-bottom: 1px solid var(--line);
}
.dialog-top .eyebrow {
  color: var(--muted);
}
.dialog-body {
  padding: 32px;
}
.search-dialog {
  width: min(760px, calc(100% - 32px));
}
.search-input {
  display: flex;
  align-items: center;
  gap: 18px;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 15px;
}
.search-input input {
  width: 100%;
  font-size: 28px;
  font-weight: 300;
  background: transparent;
  border: 0;
  outline: none;
}
.search-hint {
  font-size: 11px;
  color: var(--muted);
  margin: 18px 0;
}
.search-result {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 15px 0;
  border-bottom: 1px solid var(--line);
  width: 100%;
  text-align: left;
}
.search-result img {
  width: 65px;
  height: 70px;
  object-position: center;
}
.search-result div {
  flex: 1;
}
.search-result h3 {
  font-size: 20px;
}
.search-result p {
  font-size: 11px;
  color: var(--muted);
}
.search-result:hover h3 {
  color: var(--red);
}
.side-dialog {
  margin: 0 0 0 auto;
  height: 100svh;
  max-height: 100svh;
  width: min(490px, 100%);
}
.side-dialog .dialog-body {
  padding: 32px 40px;
}
.menu-links {
  display: flex;
  flex-direction: column;
  gap: 21px;
  padding: 10px 0 40px;
}
.menu-links a {
  font-size: 30px;
  font-weight: 300;
  letter-spacing: -0.015em;
  display: flex;
  justify-content: space-between;
}
.menu-links a:hover {
  color: var(--red);
}
.side-title {
  font-size: 35px;
  letter-spacing: -0.015em;
  margin-bottom: 20px;
}
.side-intro {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 20px;
}
.saved-item {
  display: grid;
  grid-template-columns: 74px 1fr 32px;
  gap: 17px;
  align-items: center;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.saved-item img {
  height: 90px;
}
.saved-item h3 {
  font-size: 20px;
}
.saved-item p {
  font-size: 10px;
  color: var(--muted);
  margin-top: 7px;
}
.detail-dialog {
  width: min(1030px, calc(100% - 32px));
}
.detail-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.detail-layout > img {
  height: 600px;
}
.detail-copy {
  padding: 65px 45px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.detail-copy h2 {
  font-size: 45px;
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin: 20px 0;
}
.detail-copy p {
  font-size: 14px;
  color: var(--muted);
}
.detail-copy ul {
  list-style: none;
  padding: 20px 0;
  margin: 0;
  width: 100%;
}
.detail-copy li {
  padding: 12px 0;
  border-top: 1px solid var(--line);
  font-size: 11px;
}
.detail-copy .button {
  margin-top: 15px;
}
.detail-dialog > .icon-btn {
  position: absolute;
  right: 14px;
  top: 14px;
  background: var(--paper);
  z-index: 2;
}
.legal-dialog {
  width: min(700px, calc(100% - 32px));
}
.legal-dialog h2 {
  font-size: 32px;
  margin-bottom: 25px;
}
.legal-dialog p {
  font-size: 13px;
  margin-top: 15px;
  color: var(--muted);
}
.toast {
  position: fixed;
  left: 50%;
  bottom: 28px;
  transform: translate(-50%, 20px);
  z-index: 90;
  background: var(--ink);
  color: white;
  padding: 16px 25px;
  font-size: 12px;
  box-shadow: 0 4px 20px #00000022;
  opacity: 0;
  transition: all 0.25s;
  pointer-events: none;
  max-width: calc(100% - 40px);
  text-align: center;
}
.toast.visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
@media (min-width: 1600px) {
  .nav {
    gap: 30px;
  }
  .nav a {
    font-size: 13px;
  }
  .hero-photo {
    object-position: 50% 60%;
  }
}
@media (max-width: 1150px) {
  .header {
    gap: 20px;
    padding: 0 32px;
  }
  .nav {
    gap: 17px;
  }
  .nav a {
    font-size: 11px;
  }
  .logo {
    width: 125px;
  }
  .icon-btn {
    min-width: 35px;
  }
  .split-copy {
    padding: 65px 45px;
  }
  .form-section,
  .faq-section {
    gap: 50px;
  }
  .footer-top {
    gap: 40px;
  }
}
@media (max-width: 950px) {
  .nav {
    display: none;
  }
  .tools {
    margin-left: auto;
  }
  .header {
    height: 84px;
  }
  .intro {
    grid-template-columns: 1fr;
    gap: 25px;
    padding-top: 75px;
    padding-bottom: 75px;
  }
  .gallery-section {
    padding-bottom: 75px;
  }
  .gallery {
    gap: 16px;
  }
  .card-image {
    height: 380px;
  }
  .split {
    min-height: 520px;
  }
  .split-photo {
    min-height: 520px;
  }
  .split-copy {
    padding: 50px 32px;
  }
  .split-copy h2 {
    font-size: 43px;
  }
  .footer-top {
    grid-template-columns: 1.6fr 1fr;
    gap: 45px;
  }
  .footer-top > div:last-child {
    grid-column: 2;
  }
  .footer-top > div:first-child {
    grid-row: span 2;
  }
  .steps {
    grid-template-columns: 1fr 1fr;
  }
  .form-section,
  .faq-section {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .form-section p {
    max-width: 540px;
  }
  .lighting {
    grid-template-columns: 1fr 1fr;
  }
  .light-panel {
    padding: 50px 30px;
  }
  .light-panel h2 {
    font-size: 40px;
  }
  .light-stage {
    height: 650px;
  }
  .inner-head.row {
    align-items: flex-start;
    flex-direction: column;
    gap: 0;
  }
  .journal-card img {
    height: 220px;
  }
  .journal-card h3 {
    font-size: 21px;
  }
  .products-grid {
    grid-template-columns: 1fr 1fr;
  }
  .detail-copy {
    padding: 55px 28px 30px;
  }
}
@media (max-width: 620px) {
  :root {
    --gutter: 24px;
  }
  .header {
    padding: 0 20px;
    height: 76px;
  }
  .header.solid {
    height: 70px;
  }
  .logo {
    width: 120px;
  }
  .hero {
    min-height: min(480px, calc(100svh - 64px));
    max-height: 1000px;
    height: calc(100svh - 64px);
  }
  .hero-photo {
    object-position: 54% 55%;
  }
  .hero-center {
    padding-bottom: 145px;
  }
  .hero-bottom .hero-caption { display: none; }
  .hero-contacts { align-items: flex-start; }
  .hero-center .eyebrow {
    font-size: 8px;
    letter-spacing: 0.16em;
    margin-bottom: 23px;
  }
  .hero h1 {
    font-size: 61px;
    letter-spacing: -0.015em;
  }
  .hero-link {
    font-size: 11px;
    margin-top: 25px;
  }
  .hero-bottom {
    bottom: 28px;
    align-items: flex-end;
  }
  .hero-caption {
    font-size: 10px;
    max-width: 165px;
  }
  .scroll-link {
    display: none;
  }
  .intro {
    padding: 65px 24px;
  }
  .intro h2 {
    font-size: 36px;
  }
  .intro p {
    font-size: 13px;
    margin-top: 22px;
  }
  .section-head {
    align-items: flex-start;
    gap: 12px;
  }
  .section-head h2 {
    font-size: 31px;
  }
  .section-head .text-link {
    font-size: 10px;
    gap: 10px;
    white-space: nowrap;
    padding-top: 12px;
  }
  .section-head .text-link svg {
    width: 15px;
  }
  .gallery {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .gallery .card-image {
    height: 470px;
  }
  .card-info {
    padding: 17px 0;
  }
  .split {
    grid-template-columns: 1fr;
  }
  .split-photo {
    min-height: 490px;
  }
  .split-copy {
    padding: 55px 28px 60px;
    min-height: 430px;
  }
  .split-copy h2 {
    font-size: 43px;
    margin: 23px 0;
  }
  .split-copy p {
    font-size: 13px;
  }
  .dark.reverse-mobile .split-photo {
    order: 0;
  }
  .dark.reverse-mobile .split-copy {
    order: 1;
  }
  .wide-story {
    height: 540px;
  }
  .wide-story .content {
    padding: 60px 25px;
  }
  .wide-story h2 {
    font-size: 45px;
  }
  .journal {
    padding: 65px 24px;
  }
  .journal-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .journal-card img {
    height: 280px;
  }
  .journal-card h3 {
    font-size: 25px;
  }
  .callout {
    padding: 45px 24px;
    align-items: flex-start;
    flex-direction: column;
  }
  .callout h2 {
    font-size: 36px;
  }
  .footer {
    padding: 50px 24px 24px;
  }
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 40px 25px;
  }
  .footer-top > div:first-child {
    grid-column: 1/-1;
    grid-row: auto;
  }
  .footer-top > div:last-child {
    grid-column: auto;
  }
  .footer-description {
    font-size: 11px;
  }
  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    font-size: 9px;
    gap: 18px;
  }
  .inner-head {
    padding: 122px 24px 45px;
  }
  .inner-head h1 {
    font-size: 53px;
  }
  .inner-head p {
    font-size: 13px;
  }
  .filters {
    gap: 22px;
    margin-bottom: 28px;
  }
  .products-grid {
    grid-template-columns: 1fr;
    gap: 32px;
    padding-bottom: 65px;
  }
  .products-grid .card-image {
    height: 480px;
  }
  .steps {
    gap: 28px;
  }
  .step h3 {
    font-size: 23px;
  }
  .step p {
    font-size: 12px;
  }
  .method {
    padding: 60px 24px;
  }
  .form-section {
    padding: 60px 24px;
  }
  .form-section h2 {
    font-size: 36px;
  }
  .project-form {
    grid-template-columns: 1fr;
  }
  .field {
    grid-column: 1/-1;
  }
  .faq-section {
    padding: 55px 24px 65px;
  }
  .faq-section h2 {
    font-size: 36px;
  }
  .lighting {
    grid-template-columns: 1fr;
  }
  .light-stage {
    height: 470px;
  }
  .light-panel {
    padding: 55px 28px;
  }
  .light-panel h2 {
    font-size: 43px;
  }
  .light-options {
    gap: 12px;
  }
  .article-cover {
    height: 380px;
  }
  .article-body {
    padding: 35px 24px 65px;
  }
  .detail-layout {
    grid-template-columns: 1fr;
  }
  .detail-layout > img {
    height: 300px;
  }
  .detail-copy {
    padding: 30px 26px;
  }
  .detail-copy h2 {
    font-size: 36px;
  }
  .detail-copy p {
    font-size: 13px;
  }
  .dialog-top {
    padding: 15px 22px;
  }
  .dialog-body {
    padding: 25px;
  }
  .search-input input {
    font-size: 22px;
  }
  .side-dialog .dialog-body {
    padding: 28px;
  }
  .menu-links a {
    font-size: 29px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *:before,
  *:after {
    animation: none !important;
    transition: none !important;
  }
}
.contact-email {
  overflow-wrap: anywhere;
  max-width: 100%;
}
.footer-top > div,
.split-copy {
  min-width: 0;
}

/* Lingue e richieste: controlli compatti coerenti con il sito. */
.language-trigger {
  font-size: 10px;
  white-space: nowrap;
}
.language-trigger svg {
  transform: translateY(-4px);
}
#language-code {
  position: absolute;
  bottom: 1px;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 9px;
  line-height: 12px;
}
.language-dialog {
  width: min(420px, calc(100vw - 32px));
  border: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
}
.language-options {
  padding: 10px 26px 26px;
}
.language-options button {
  display: flex;
  align-items: center;
  gap: 18px;
  width: 100%;
  min-height: 78px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  padding: 12px 4px;
  font-size: 18px;
}
.language-options small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-top: 5px;
}
.language-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  font-size: 13px;
}
.language-check {
  margin-left: auto;
  color: var(--red);
  visibility: hidden;
}
.language-options [aria-pressed="true"] .language-check {
  visibility: visible;
}
.language-options [aria-pressed="true"] .language-mark {
  border-color: var(--red);
}
.contact-dialog {
  width: min(700px, calc(100vw - 28px));
  max-height: 90svh;
  overflow: auto;
  border: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
}
.contact-dialog h2 {
  font-size: clamp(28px, 4vw, 40px);
  letter-spacing: -0.015em;
}
.contact-lead {
  font-size: 13px;
  color: var(--muted);
  margin: 14px 0 30px;
}
.contact-honey {
  display: none;
}
.contact-intro p {
  margin-bottom: 24px;
}
.contact-dialog .form-note {
  color: var(--muted);
}
.form-success.is-error {
  color: #565656;
}
.footer-links button {
  text-align: left;
  padding: 0;
  font-size: inherit;
}
.contact-email {
  text-align: left;
}
html:lang(zh) body {
  font-family:
    -apple-system, BlinkMacSystemFont, "PingFang SC", "PingFang TC",
    "Microsoft YaHei", sans-serif;
}
html:lang(zh) .eyebrow {
  letter-spacing: 0.08em;
}
html:lang(zh) h1,
html:lang(zh) h2 {
  line-height: 1.3;
}
@media (min-width: 951px) and (max-width: 1280px) {
  .nav {
    gap: 14px;
  }
  .header {
    gap: 18px;
  }
  .logo {
    width: 125px;
  }
}
@media (max-width: 620px) {
  .header {
    gap: 8px;
    padding-inline: 16px;
  }
  .logo {
    width: clamp(88px, 28vw, 110px);
  }
  .tools {
    gap: 4px;
  }
  .contact-dialog .project-form {
    grid-template-columns: 1fr;
  }
  .contact-dialog .dialog-body {
    padding: 22px;
  }
  .contact-dialog .button {
    width: 100%;
    gap: 12px;
  }
}

/* Area Clienti: riuso dei campi e dei pulsanti del sito. */
.client-panel {
  max-width: 740px;
  margin: 0 auto;
  padding: 0 32px 100px;
}
.client-panel [hidden] {
  display: none !important;
}
.client-panel h2 {
  font-size: 32px;
  margin-bottom: 18px;
}
.client-tabs {
  display: flex;
  gap: 28px;
  margin: 0 0 32px;
  border-bottom: 1px solid var(--line);
}
.client-tabs [aria-current="page"] {
  border-bottom-color: var(--red);
}
.client-panel .project-form {
  margin: 24px 0;
}
.client-panel p {
  font-size: 14px;
  line-height: 1.7;
  margin: 20px 0;
}
.client-consent {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  grid-column: 1/-1;
  font-size: 13px;
  line-height: 1.6;
}
.client-consent input {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  accent-color: var(--red);
}
.client-consent a,
.legal-copy a,
.client-help a {
  text-decoration: none;
  text-underline-offset: 3px;
}
#client-status {
  padding: 16px;
  background: #ececec;
  border-left: 2px solid #555555;
  overflow-wrap: anywhere;
}
#client-status.is-error {
  border-color: var(--red);
  color: #4e4e4e;
}
.legal-copy {
  padding-top: 0;
  overflow-wrap: anywhere;
}
.legal-pending {
  padding: 16px;
  border: 1px solid var(--line);
}
@media (max-width: 620px) {
  .client-panel {
    padding-inline: 24px;
  }
  .client-panel .project-form {
    grid-template-columns: 1fr;
  }
  .client-panel .button {
    width: 100%;
  }
}

/* Le informative aggiunte vanno a capo sui display piccoli. */
.footer-bottom > div {
  flex-wrap: wrap;
  row-gap: 14px;
}

/* Contatti della copertina e mappa attivata solo su richiesta. */
.hero-contacts { display: flex; flex-direction: column; gap: 4px; pointer-events: auto; }
.hero-contacts button { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 4px 0; text-align: left; font-size: 12px; line-height: 1.5; text-shadow: 0 1px 8px #000000; }
.hero-contacts button:hover span { text-decoration: none; text-underline-offset: 4px; }
.hero-contacts svg { width: 18px; height: 18px; flex-shrink: 0; }
.map-dialog { width: min(900px, calc(100% - 32px)); }
.map-dialog h2 { font-size: 24px; }
.map-address { margin-bottom: 24px; line-height: 1.6; }
.map-consent p, .map-note { color: var(--muted); font-size: 14px; line-height: 1.7; }
.map-consent .button { margin: 20px 8px 0 0; }
#map-container iframe { display: block; width: 100%; height: min(480px, 52svh); border: 0; }
.map-note { margin-top: 16px; }
@media (max-width: 620px) {
  .map-dialog .dialog-body { padding: 20px; }
  .hero-contacts button { font-size: 11px; }
}

/* Toni neutri: bianco caldo, pietra e antracite. */
#page-home .intro { background: var(--stone); }
#page-home .gallery-section { padding-top: 72px; }
.dark { background: var(--charcoal); }
.dark p.quiet, .dark .split-copy p { color: #c4c4c4; }
#page-home .split:not(.dark) .split-copy { background: #ebebeb; }
#page-home .journal { background: var(--charcoal); color: var(--paper); }
#page-home .journal .eyebrow { color: #c4c4c4; }
#page-home .journal .text-link { border-bottom-color: #909090; }
.callout { background: var(--stone); }
.footer-description { color: #c2c2c2; }
.footer h3 { color: #afafaf; }
.footer-bottom { border-top-color: #535353; }
@media (max-width: 620px) {
  #page-home .gallery-section { padding-top: 48px; }
}

/* Cataloghi: copertine e consultazione pubblica, gestione riservata. */
.catalog-section {padding:0 var(--gutter) 90px}
.catalog-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 32px}
.catalog-card {min-width:0}
.catalog-cover {display:flex;align-items:center;justify-content:center;background:var(--stone);padding:30px;aspect-ratio:4/5;overflow:hidden}
.catalog-cover img {width:100%;height:100%;object-fit:contain;transition:transform .35s}
.catalog-copy {padding:24px 0 0}
.catalog-copy h2 {font-size:clamp(22px,2.1vw,30px);margin:10px 0 12px;overflow-wrap:anywhere}
.catalog-copy .eyebrow {font-size:10px}
.catalog-actions {display:flex;gap:20px;flex-wrap:wrap;margin-top:22px}
.catalog-actions .text-link {font-size:12px;gap:14px}
.catalog-owner {border-top:1px solid var(--line);margin-top:65px;padding-top:25px}
.catalog-document {align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;width:100%;background:var(--charcoal);color:var(--paper);padding:28px}
.catalog-document-title {font-size:clamp(22px,2.5vw,36px);line-height:1.25;overflow-wrap:anywhere}
.catalog-admin {border-top:1px solid var(--line);margin-top:48px;padding-top:36px}
.catalog-admin h2 {font-size:30px;margin-bottom:18px}
.catalog-admin .project-form {margin-top:25px}
.catalog-admin input[type=file] {padding:16px 0;max-width:100%;white-space:normal}
#catalog-status,#catalog-admin-status {padding:18px 0;line-height:1.6}
.is-error {color:#515151}
@media(max-width:1100px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.catalog-grid{grid-template-columns:1fr;gap:44px}.catalog-cover{padding:22px}.catalog-section{padding-bottom:55px}}

.catalog-section [hidden] {display:none !important}

#catalog-cover-preview {width:160px;height:220px;object-fit:contain;background:var(--stone);margin-top:16px}


/* Proposta visiva locale: materiali caldi, gerarchie chiare e ombre leggere. */
.header.solid {background:rgba(250,250,248,.97);border-bottom-color:#dddddd}
.footer {background:#252525;color:#eeeeee}
.footer-description {color:#bcbcbc}
.footer h3 {color:#acacac}
.footer-bottom {border-top-color:#494949}
.button {background:#343434;border-color:#343434;transition:background .2s,box-shadow .2s}
.button:hover {background:#4d4d4d;box-shadow:0 6px 16px #27272718}
.button.secondary {background:transparent}
#page-home .intro {background:#e9e9e9}
#page-home .journal,.dark {background:linear-gradient(130deg,#373737,#262626)}
.callout {background:#e7e7e7}
.card-image {background:#e5e5e5;box-shadow:0 9px 25px #2929290b}
.split-photo {background:#d8d8d8}

/* Accesso: fotografia e modulo appartengono allo stesso spazio. */
[data-page="area-clienti"] {padding:132px var(--gutter) 76px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:stretch;gap:0;background:linear-gradient(135deg,#e3e3e3 0%,#f4f4f4 65%)}
.client-visual {position:relative;min-height:670px;overflow:hidden;background:#313131}
.client-visual>img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:48% center}
.client-visual::after {content:"";position:absolute;inset:0;background:linear-gradient(180deg,#1a1a1a00 30%,#1a1a1ac9 100%)}
.client-visual-copy {position:absolute;z-index:1;bottom:54px;left:48px;right:40px;color:#f4f4f4}
.client-visual-copy .eyebrow {font-size:10px;letter-spacing:.19em;color:#d2d2d2;margin-bottom:26px}
.client-visual-copy h2 {font-weight:300;font-size:clamp(42px,4.5vw,66px);line-height:1.06;letter-spacing:-0.015em;margin:0 0 24px}
.client-visual-copy>p:last-child {font-size:14px;line-height:1.7;color:#d3d3d3;max-width:300px}
.client-shell {background:#fbfbfb;padding:58px clamp(28px,4.4vw,68px) 40px;min-width:0;box-shadow:16px 18px 48px #3535350d}
.client-shell .inner-head {padding:0;margin-bottom:38px}
.client-shell .inner-head .eyebrow {font-size:10px;color:#767676;letter-spacing:.15em;margin-bottom:24px}
.client-shell .inner-head h1 {font-size:clamp(35px,3.5vw,52px);line-height:1.1;letter-spacing:-0.015em;margin:0 0 20px}
.client-shell .inner-head>p:last-child {font-size:14px;line-height:1.7;max-width:340px;margin:0;color:#6d6d6d}
.client-shell .client-panel {padding:0;max-width:none;margin:0}
.client-shell .client-tabs {gap:30px;margin-bottom:30px;border-bottom:1px solid #d8d8d8}
.client-shell .client-tabs .text-link {padding:0 0 13px;border-bottom:2px solid transparent;font-size:13px;color:#7b7b7b}
.client-shell .client-tabs [aria-current="page"] {color:#343434;border-bottom-color:#6c6c6c}
.client-shell .project-form {gap:22px 18px;margin:0 0 24px}
.client-shell .field {font-size:12px;gap:9px}
.client-shell .field label {color:#575757}
.client-shell .field input,.client-shell .field select {padding:14px 15px;background:#ffffff;border:1px solid #d4d4d4;min-height:51px;transition:border-color .2s,box-shadow .2s}
.client-shell .field input:focus,.client-shell .field select:focus {outline:none;border-color:#6e6e6e;box-shadow:0 0 0 3px #6e6e6e15}
.client-shell .button {width:100%;justify-content:center;min-height:52px;font-size:13px;letter-spacing:.02em}
#client-login>[data-auth-view="recover"] {grid-column:1/-1;justify-self:end;border:0;padding:0;font-size:12px;text-decoration: none;text-underline-offset:5px;color:#6c6c6c}
.client-shell .client-help {border-top:1px solid #dcdcdc;padding-top:24px;margin-top:30px;font-size:12px;color:#787878}
.client-shell #client-status {margin-top:0;background:#e6e6e6;border-color:#666666}
.client-shell #client-status.is-error {background:#e8e8e8;border-color:#5b5b5b}
.client-shell .catalog-admin {margin-top:36px}
.client-shell .catalog-admin h2 {font-size:28px}
/* Keep the photograph proportionate when account forms become longer. */
@media(min-width:701px){
 [data-page="area-clienti"] {grid-template-rows:clamp(670px,calc(100svh - 180px),800px)}
 [data-page="area-clienti"] .client-visual {min-height:0}
 [data-page="area-clienti"] .client-shell {min-height:0;overflow-y:auto;scrollbar-gutter:stable;scrollbar-width:thin;overscroll-behavior-y:contain}
}

/* Cataloghi: copertine reali, spazio editoriale e profondità discreta. */
.catalog-intro {position:relative;isolation:isolate;overflow:hidden;background:#2e2e2e;color:#f4f4f4;padding:155px var(--gutter) 65px;min-height:390px}
.catalog-intro-photo {position:absolute;inset:0 0 0 auto;width:54%;height:100%;object-fit:cover;object-position:center;z-index:-2;opacity:.64}
.catalog-intro::after {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#2e2e2e 40%,#2e2e2ede 54%,#2e2e2e10 100%)}
.catalog-intro .eyebrow {color:#bcbcbc;letter-spacing:.2em;font-size:10px}
.catalog-intro h1 {font-size:clamp(42px,5.5vw,78px);letter-spacing:-0.015em;margin:25px 0}
.catalog-intro>p:last-child {max-width:510px;line-height:1.8;color:#d7d7d7;font-size:14px}
.catalog-section {padding-top:64px;padding-bottom:65px;background:#f4f4f4}
.catalog-cover {background:radial-gradient(ellipse at 45% 35%,#f0f0f0 0%,#d9d9d9 100%);padding:38px}
.catalog-cover img {filter:drop-shadow(12px 20px 14px #28282830);transition:transform .4s,filter .4s}
.catalog-copy .eyebrow {color:#737373;letter-spacing:.17em}
.catalog-copy .quiet {color:#7a7a7a;font-size:13px}
.catalog-actions {gap:20px 28px}
.catalog-actions .text-link {border-bottom-color:#a8a8a8;font-size:12px}
.catalog-grid>.catalog-card:only-child {grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;background:#fbfbfb;box-shadow:0 18px 45px #33333309}
.catalog-grid>.catalog-card:only-child .catalog-cover {aspect-ratio:auto;min-height:460px;padding:42px;height:480px}
.catalog-grid>.catalog-card:only-child .catalog-cover img {max-width:300px;max-height:390px}
.catalog-grid>.catalog-card:only-child .catalog-copy {align-self:center;padding:42px clamp(28px,5vw,76px)}
.catalog-grid>.catalog-card:only-child h2 {font-size:clamp(28px,3.5vw,48px);line-height:1.15;letter-spacing:-0.015em;margin:23px 0}
.catalog-grid>.catalog-card:only-child .catalog-actions {display:flex;flex-direction:column;align-items:flex-start;margin-top:32px;gap:24px}
.catalog-grid>.catalog-card:only-child .catalog-actions .text-link:first-child {background:#343434;color:#f4f4f4;border:1px solid #343434;padding:17px 26px;min-width:220px;justify-content:center}
.catalog-grid>.catalog-card:only-child .catalog-actions .text-link:first-child:hover {background:#4d4d4d}
.catalog-owner {margin-top:38px;padding-top:22px;display:flex;justify-content:flex-end}
.catalog-owner .text-link {color:#777777;font-size:11px}
@media(max-width:1000px){
 [data-page="area-clienti"] {padding-inline:24px;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
 .client-visual-copy {left:30px;right:25px;bottom:40px}
 .client-shell {padding:40px 28px 28px}
 .client-visual {min-height:620px}
}
@media(max-width:700px){
 [data-page="area-clienti"],[data-page="area-clienti"]:has(#client-account:not([hidden])) {display:flex;flex-direction:column;padding:100px 20px 45px}
 .client-visual,[data-page="area-clienti"]:has(#client-account:not([hidden])) .client-visual {height:245px;min-height:245px;position:relative;top:auto}
 .client-visual>img {object-position:center 45%}
 .client-visual-copy {bottom:25px;left:26px}
 .client-visual-copy .eyebrow {margin-bottom:15px;font-size:9px}
 .client-visual-copy h2 {font-size:38px;margin-bottom:0}
 .client-visual-copy>p:last-child {display:none}
 .client-shell {padding:32px 25px 25px}
 .client-shell .inner-head {margin-bottom:30px}
 .client-shell .inner-head h1 {font-size:37px}
 .client-shell .inner-head .eyebrow {display:none}
 .client-shell .project-form {grid-template-columns:1fr}
 .catalog-intro {padding-top:140px;padding-bottom:42px;min-height:340px}
 .catalog-intro-photo {width:100%;opacity:.32}
 .catalog-intro::after {background:linear-gradient(90deg,#2e2e2eed,#2e2e2e60)}
 .catalog-intro>p:last-child {max-width:90%}
 .catalog-section {padding-top:30px}
 .catalog-grid>.catalog-card:only-child {grid-template-columns:1fr}
 .catalog-grid>.catalog-card:only-child .catalog-cover {height:390px;min-height:0;padding:30px}
 .catalog-grid>.catalog-card:only-child .catalog-cover img {max-height:330px}
 .catalog-grid>.catalog-card:only-child .catalog-copy {padding:30px}
 .catalog-grid>.catalog-card:only-child h2 {font-size:32px}
 .catalog-owner {justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){.catalog-cover img{transition:none}.catalog-cover:hover img{transform:none}}

/* Bianco e grafite: superfici satinate, con fallback opaco. */
:root{--paper:#f6f6f5;--stone:#e6e6e5;--charcoal:#363738;--ink:#303132;--muted:#6b6d6f;--line:#d8d9da;--red:#55585a}
.header{background:rgba(48,50,52,.32);border-bottom:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(22px) saturate(110%);backdrop-filter:blur(22px) saturate(110%);box-shadow:0 4px 24px rgba(0,0,0,.04)}
.header.solid{background:rgba(250,250,250,.82);border-bottom-color:rgba(255,255,255,.68);box-shadow:0 8px 30px rgba(40,42,44,.06)}
.footer{background:#363738;color:#f5f5f5}.footer-description{color:#c5c7c8}.footer h3{color:#afb2b4}
.button{background:#414345;border-color:#414345;color:#fff}.button:hover{background:#56595c}.button.secondary{background:transparent;color:inherit}
.client-shell{background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.9);box-shadow:0 18px 56px rgba(42,44,46,.08),inset 0 1px 0 #fff;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.catalog-intro{background:#3b3d3f}.catalog-intro::after{background:linear-gradient(90deg,#3b3d3f 40%,#3b3d3fde 54%,#3b3d3f10 100%)}
.catalog-grid>.catalog-card:only-child{background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9);box-shadow:0 18px 48px rgba(40,42,44,.06)}
.catalog-cover{background:radial-gradient(ellipse at 45% 35%,#f5f5f5,#dddddd)}
.catalog-grid>.catalog-card:only-child .catalog-actions .text-link:first-child{background:#414345;border-color:#414345}.catalog-grid>.catalog-card:only-child .catalog-actions .text-link:first-child:hover{background:#56595c}
dialog{background:rgba(250,250,250,.9);border:1px solid rgba(255,255,255,.86);box-shadow:0 24px 80px rgba(32,34,36,.2),inset 0 1px 0 #fff;-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px)}
dialog::backdrop{background:rgba(42,44,46,.28);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.card-save{background:rgba(255,255,255,.76);border:1px solid rgba(255,255,255,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 4px 14px rgba(40,42,44,.08)}
.is-error{color:#9b302c}.client-shell #client-status.is-error{background:#f6e9e8;border-color:#9b302c}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.header{background:rgba(48,50,52,.9)}.header.solid,.client-shell,dialog{background:#fafafa}.card-save{background:#f5f5f5}}
@media(prefers-reduced-transparency:reduce){.header{background:#363738}.header.solid,.client-shell,dialog,.card-save{background:#fafafa;-webkit-backdrop-filter:none;backdrop-filter:none}dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(max-width:700px){.catalog-intro::after{background:linear-gradient(90deg,#3b3d3fed,#3b3d3f60)}.header,.client-shell{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}}

/* Home a tutta altezza: vetro soltanto dopo lo scroll, invito sovrapposto alla foto. */
.header:not(.solid){background:transparent;border-bottom-color:rgba(255,255,255,.2);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
#page-home .hero{height:100svh;min-height:100svh;max-height:none}
.hero-bottom{bottom:96px}.hero-caption .hero-caption-line{font-size:11px;opacity:1}
.hero-scroll-band{position:absolute;isolation:isolate;z-index:3;bottom:0;left:0;width:100%;min-height:64px;padding:20px 24px;display:flex;align-items:center;justify-content:center;gap:20px;color:#fff;background:transparent;border:0;box-shadow:none;font-size:10px;letter-spacing:.16em;text-transform:uppercase;text-shadow:0 1px 8px #20222488}
.hero-scroll-band::before{content:"";position:absolute;z-index:-1;inset:-32px 0 0;pointer-events:none;background:linear-gradient(to bottom,rgba(42,44,46,.08),rgba(42,44,46,.48) 46%,rgba(42,44,46,.72));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 48%);mask-image:linear-gradient(to bottom,transparent,#000 48%);transition:opacity .2s}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.hero-scroll-band::before{background:linear-gradient(transparent,rgba(45,47,49,.9))}}
@media(prefers-reduced-transparency:reduce){.hero-scroll-band::before{background:#393b3d;-webkit-backdrop-filter:none;backdrop-filter:none}}
.map-help{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:18px}.map-help p{width:100%;margin:0}.map-help .text-link{font-size:13px}
@media(max-width:700px){.hero-center{padding-bottom:215px}.hero-bottom{bottom:84px}.hero-scroll-band{min-height:58px;padding:18px 20px;font-size:9px}}
@media(max-height:620px){.hero-center{padding-top:85px;padding-bottom:165px}.hero h1{font-size:clamp(38px,6vw,62px)}.hero-center .eyebrow{margin-bottom:14px}.hero-link{margin-top:16px}.hero-bottom{bottom:72px}.hero-contacts button{font-size:10px;min-height:32px}}

/* Isolated furniture studies: the original room photographs remain in details. */
.products-render-note{margin:0 var(--gutter) 26px;font-size:12px;line-height:1.7;color:var(--muted);max-width:720px}
.product-card-media{position:relative}
.product-isolated .card-image{height:clamp(290px,31vw,460px);padding:24px 30px 40px;background:#fff;box-shadow:none}
.product-isolated .card-image::after{display:none}
.product-isolated .card-image img{width:100%;height:100%;padding:0;object-fit:contain;object-position:center}
.product-isolated .card-info{border:0;text-align:center;justify-content:center;padding:22px 10px 30px}
.product-isolated .card-info h3{font-size:17px;letter-spacing:.055em;text-transform:uppercase;line-height:1.45;font-weight:400}
.product-isolated .card-info p{font-size:11px;line-height:1.6}
.product-model-button{position:absolute;right:14px;bottom:12px;display:flex;align-items:center;gap:6px;padding:8px 11px;min-height:36px;border:1px solid #dedede;border-radius:22px;background:#fffffff2;color:#424547;font-size:11px;letter-spacing:.025em}
.product-model-button svg{width:16px;height:16px}.product-model-button:hover{border-color:#777;background:#f1f1f1}
.product-detail-media{min-width:0;background:#fff;padding:30px 24px}
.product-render-stage{height:480px;display:flex;align-items:center;justify-content:center}
.product-render-stage img{height:100%;width:100%;object-fit:contain}
.product-render-caption{text-align:center;color:var(--muted);font-size:10px;letter-spacing:.1em;margin:14px 0 20px}
.product-original-photo{border-top:1px solid var(--line);font-size:12px;color:#4e5153}
.product-original-photo summary{padding:16px 0;cursor:pointer}.product-original-photo img{width:100%;height:auto;max-height:650px;object-fit:contain}
.product-detail-model{gap:10px;margin:0 0 22px;padding-bottom:10px;align-self:flex-start;min-width:0;font-size:12px}
.product-detail-model>svg{width:18px;height:18px;flex:none}
.product-model-dialog{width:min(1080px,calc(100% - 24px));padding:0;max-height:calc(100svh - 24px);overflow:auto;background:#f9f9f8}
.product-model-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:28px 32px 16px}
.product-model-heading h2{font-size:clamp(24px,3vw,38px);line-height:1.2;margin:10px 0 0;font-weight:400;letter-spacing:-0.015em}
.product-model-heading .icon-btn{position:static;flex:none}
.product-model-stage{position:relative;background:linear-gradient(#fafafa,#eeefec)}
#product-model-canvas{display:block;width:100%;height:clamp(280px,55vh,570px);touch-action:none;cursor:grab}
#product-model-canvas:active{cursor:grabbing}
#product-model-canvas:focus-visible{outline:2px solid #717775;outline-offset:-4px}
#product-model-status{position:absolute;left:20px;right:20px;bottom:12px;text-align:center;font-size:11px;pointer-events:none}
.product-model-controls{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px;padding:16px 18px 10px}
.product-model-controls button{min-width:44px;min-height:44px;padding:10px 14px;border:1px solid #d4d7d4;background:#fff;border-radius:6px;color:#414744;font-size:15px}
.product-model-controls button:hover{background:#e8ebe8}.product-model-controls span{width:14px}
.product-model-controls button:last-child{font-size:12px}
.product-model-hint,.product-model-disclaimer{text-align:center;font-size:12px;line-height:1.65;margin:0 24px 8px;color:#505753}
.product-model-disclaimer{font-size:10px;color:var(--muted);margin-bottom:22px}
@media(max-width:620px){.product-isolated .card-image{height:370px}.product-detail-media{padding:24px 18px}.product-render-stage{height:340px}.product-model-heading{padding:24px 20px 15px}.product-model-controls{gap:4px}.product-model-controls span{display:none}.products-render-note{font-size:11px}}

/* Navigazione essenziale e pannello perla, dal riferimento approvato. */
.header > .logo {
  width: 150px;
}
.nav {
  flex: 1;
  min-width: 0;
  margin-left: 0;
  justify-content: center;
  gap: clamp(14px, 1.35vw, 24px);
}
.nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 12px 0;
  font-size: 12px;
  line-height: 1.4;
}
.nav a.nav-home {
  display: none;
}
.nav a::after {
  bottom: 2px;
  height: 1px;
  background: currentColor;
}
.header a:focus-visible,
.header button:focus-visible {
  outline-color: currentColor;
}
.header .icon-btn:hover {
  color: inherit;
  background: rgba(255, 255, 255, .12);
}
.header.solid .icon-btn:hover {
  background: rgba(48, 49, 50, .06);
}
#language-code {
  font-size: 12px;
}
#menu-dialog {
  width: clamp(490px, 40vw, 560px);
  max-width: 100%;
  background: rgba(248, 248, 246, .91);
  color: var(--ink);
  border-width: 0 0 0 1px;
  border-color: rgba(255, 255, 255, .85);
  -webkit-backdrop-filter: blur(30px) saturate(80%);
  backdrop-filter: blur(30px) saturate(80%);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#menu-dialog::backdrop {
  background: rgba(32, 34, 36, .22);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
#menu-dialog .dialog-top {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 92px;
  padding: 24px 44px;
  border-bottom: 0;
  background: rgba(248, 248, 246, .93);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}
#menu-dialog .dialog-top .eyebrow {
  color: var(--ink);
  font-size: 12px;
  letter-spacing: .18em;
}
#menu-dialog .dialog-body {
  padding: 4px 44px 36px;
}
#menu-dialog .menu-links {
  gap: 0;
  padding: 0 0 20px;
}
#menu-dialog .menu-links a {
  position: relative;
  align-items: center;
  gap: 18px;
  min-height: 54px;
  padding: 9px 0 9px 22px;
  font-size: clamp(28px, 2.35vw, 34px);
  line-height: 1.3;
  font-weight: 300;
  letter-spacing: -0.015em;
}
#menu-dialog .menu-links a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 2px;
  height: 1.05em;
  background: currentColor;
  transform: translateY(-50%);
  opacity: 0;
}
#menu-dialog .menu-links a[aria-current="page"]::before {
  opacity: 1;
}
#menu-dialog .menu-links a:hover {
  color: var(--ink);
  text-decoration: none;
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
}
#menu-dialog .menu-links .menu-home {
  margin-bottom: 14px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
#menu-dialog .menu-links .menu-secondary {
  min-height: 44px;
  padding-block: 10px;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: -0.015em;
}
#menu-dialog .menu-links .menu-secondary-start {
  margin-top: 18px;
  padding-top: 23px;
  border-top: 1px solid var(--line);
}
.menu-project {
  display: block;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.menu-project > img {
  width: 100%;
  height: clamp(140px, 18svh, 180px);
  object-fit: cover;
  object-position: center;
}
.menu-project-caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  min-height: 52px;
  padding: 12px 0;
  font-size: 14px;
  line-height: 1.5;
}
.menu-project:hover .menu-project-caption > span {
  text-decoration: none;
  text-underline-offset: 5px;
}
.menu-contact {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 76px;
  padding: 18px 0;
  border-top: 0;
  text-align: left;
  font-size: clamp(18px, 1.7vw, 24px);
  font-weight: 300;
  letter-spacing: -0.015em;
}
.menu-contact > span {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.menu-contact > svg:first-child {
  width: 28px;
  height: 28px;
}
.menu-tools {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 10px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.menu-tools .text-link {
  justify-content: space-between;
  width: 100%;
  min-height: 44px;
  padding-block: 9px;
  font-size: 14px;
}

/* Testi di servizio leggibili, senza cambiare l'impaginazione delle pagine. */
.eyebrow,
.journal-card .eyebrow,
.catalog-intro .eyebrow,
.catalog-copy .eyebrow,
.footer h3,
.image-note,
.product-render-caption,
.product-model-disclaimer,
.language-options small {
  font-size: 12px;
}
.card-info p,
.product-isolated .card-info p,
.saved-item p,
.search-hint,
.search-result p,
.detail-copy li,
.light-option,
.light-range,
.field,
.footer-bottom,
.footer-bottom button,
.product-model-button,
#product-model-status,
.products-render-note {
  font-size: 13px;
}
.text-link,
.section-head .text-link,
.catalog-actions .text-link,
.catalog-owner .text-link,
.product-detail-model,
.filter,
.button,
.footer-description,
.footer-links {
  font-size: 14px;
}
.form-note,
.small-note {
  font-size: 12px !important;
}
.footer-bottom,
.footer-bottom > div {
  flex-wrap: wrap;
}
.hero-center .eyebrow {
  font-size: 12px;
}
.hero-link {
  min-height: 44px;
  font-size: 15px;
}
.hero-caption span,
.hero-caption .hero-caption-line {
  font-size: 13px;
}
.hero-contacts button {
  min-height: 44px;
  font-size: 13px;
}
.hero-scroll-band {
  font-size: 12px;
}
@media (min-width: 951px) and (max-width: 1359px) {
  .nav a.nav-extra { display: none; }
}
@media (max-width: 950px) {
  .header > .logo { width: 150px; }
}
@media (max-width: 700px) {
  #menu-dialog { width: 100%; border: 0; }
  #menu-dialog .dialog-top { min-height: 82px; padding: 18px 28px; }
  #menu-dialog .dialog-body { padding: 4px 28px 32px; }
  #menu-dialog .menu-links a { font-size: 29px; }
  #menu-dialog .menu-links .menu-secondary { font-size: 20px; }
  .section-head { flex-wrap: wrap; }
  .section-head .text-link { white-space: normal; }
  .hero-link { font-size: 14px; }
  .hero-contacts button { font-size: 12px; }
}
@media (max-width: 620px) {
  .header > .logo { width: clamp(88px, 28vw, 110px); }
  .hero-center .eyebrow { max-width: 100%; letter-spacing: .12em; }
  .hero-contacts { max-width: 100%; }
  .hero-contacts button { max-width: 100%; }
  .hero-contacts span { overflow-wrap: anywhere; }
  .footer-description { font-size: 14px; }
}
@media (max-width: 380px) {
  #menu-dialog .dialog-top { padding-inline: 22px; }
  #menu-dialog .dialog-body { padding-inline: 22px; }
  #menu-dialog .menu-links a { font-size: 26px; gap: 12px; }
  #menu-dialog .menu-links .menu-secondary { font-size: 19px; }
  .menu-contact { gap: 12px; font-size: 18px; }
}
@media (max-width: 540px) {
  .hero-scroll-band { padding-inline: 20px 78px; gap: 12px; font-size: 11px; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  #menu-dialog,
  #menu-dialog .dialog-top { background: #f6f6f4; }
}
/* Ultimo nella cascata: la preferenza opaca vale anche sulla Home. */
@media (prefers-reduced-transparency: reduce) {
  .header:not(.solid) { background: #363738; }
  .header.solid,
  #menu-dialog,
  #menu-dialog .dialog-top { background: #f6f6f4; }
  .header,
  .header.solid,
  #menu-dialog,
  #menu-dialog .dialog-top,
  #menu-dialog::backdrop {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* Match the published desktop menu placement before remote content loads.
   Editor inline placement remains free to override this initial position. */
@media (min-width: 701px) {
  .header > .nav { translate: 10px 0; }
}

/* Interactive light study: an initially white room, illuminated only on request. */
.led-demo {
  --led-rgb: 255, 210, 158;
  --led-core: #fff2dc;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #fff;
  color: #383838;
  padding: 44px 6vw 30px;
  transition: background-color .8s ease, color .8s ease;
  scroll-margin-top: 82px;
}
.led-demo[data-temperature="4000"] { --led-rgb: 236, 237, 229; --led-core: #fffff6; }
.led-demo.is-on { background: #191a1b; color: #f5f3ee; }
.led-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; position: relative; z-index: 2; }
.led-toolbar .eyebrow { margin: 0; font-size: 10px; letter-spacing: .2em; }
.led-controls { display: flex; align-items: center; gap: 26px; }
.led-power { display: inline-flex; align-items: center; gap: 10px; min-width: 100px; min-height: 48px; font-size: 13px; }
.led-power svg { width: 19px; height: 19px; }
.led-power[aria-pressed="true"] svg { color: var(--led-core); filter: drop-shadow(0 0 5px rgba(var(--led-rgb), .6)); }
.led-temperatures { display: flex; border-left: 1px solid #8885; padding-left: 20px; gap: 6px; }
.led-temperatures button { display: flex; flex-direction: column; gap: 5px; align-items: center; min-width: 86px; min-height: 55px; padding: 8px 12px; border-bottom: 1px solid transparent; font-size: 12px; }
.led-temperatures button span:last-child { font-size: 10px; opacity: .7; }
.led-temperatures button[aria-pressed="true"] { border-bottom-color: currentColor; }
.led-demo button:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.led-scene { position: relative; min-height: 510px; display: grid; place-items: center; padding: 155px 20px 70px; }
.led-fixtures { position: absolute; top: 65px; left: 4%; right: 4%; display: grid; grid-template-columns: 1fr 1fr; gap: 7%; pointer-events: none; }
.led-fixture { position: relative; height: 4px; border-radius: 2px; background: #d5d5d3; transition: background .6s, box-shadow .8s; }
.led-fixture::after { content: ""; position: absolute; top: 4px; left: -18%; width: 136%; height: 430px; opacity: 0; transform: scaleY(0); transform-origin: top; background: radial-gradient(ellipse at 50% 0%, rgba(var(--led-rgb),.26) 0%, rgba(var(--led-rgb),.12) 30%, rgba(var(--led-rgb),.035) 58%, transparent 76%); filter: blur(12px); transition: transform 1.8s cubic-bezier(.2,.65,.25,1), opacity .65s, background .8s; }
.led-demo.is-on .led-fixture { background: var(--led-core); box-shadow: 0 0 4px 1px rgba(var(--led-rgb),.9), 0 7px 18px 4px rgba(var(--led-rgb),.4); }
.led-demo.is-on .led-fixture::after { opacity: 1; transform: scaleY(1); }
.led-invitation { position: absolute; inset: 120px 0 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; transition: opacity .25s, visibility .25s; }
.led-invitation p { margin: 0; font-size: clamp(24px,3vw,40px); font-weight: 300; letter-spacing: -0.015em; text-align: center; }
.led-start { display: inline-flex; align-items: center; gap: 24px; border-bottom: 1px solid #aaa; padding: 12px 0; font-size: 13px; }
.led-start svg { width: 16px; height: 16px; }
.led-demo.is-on .led-invitation { opacity: 0; visibility: hidden; pointer-events: none; }
.led-copy { position: relative; z-index: 1; max-width: 640px; text-align: center; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .35s, transform .35s, visibility .35s; }
.led-demo.is-on .led-copy { opacity: 1; visibility: visible; transform: none; transition: opacity 1.2s .45s, transform 1.2s .45s, visibility 0s; }
.led-copy .eyebrow { font-size: 10px; letter-spacing: .2em; color: var(--led-core); }
.led-copy h2 { font-size: clamp(36px,4.5vw,64px); font-weight: 300; line-height: 1.1; letter-spacing: -0.015em; margin: 24px 0; color: var(--led-core); transition: color .8s, text-shadow .8s; text-shadow: 0 0 32px rgba(var(--led-rgb),.16); }
.led-copy > p:last-child { max-width: 440px; margin: 0 auto; font-size: 14px; line-height: 1.8; color: #d1cfca; }
.led-note { position: relative; margin: 0 auto; text-align: center; font-size: 11px; line-height: 1.7; max-width: 600px; color: #737373; }
.led-demo.is-on .led-note { color: #a6a6a6; }
@media (max-width: 700px) {
  .led-demo { padding: 32px 24px 25px; }
  .led-toolbar { flex-direction: column; align-items: flex-start; gap: 18px; }
  .led-controls { width: 100%; justify-content: space-between; gap: 12px; }
  .led-temperatures { padding-left: 12px; gap: 0; }
  .led-temperatures button { min-width: 70px; padding: 8px; }
  .led-power { min-width: 85px; }
  .led-scene { min-height: 470px; padding: 125px 0 60px; }
  .led-fixtures { top: 48px; left: 0; right: 0; gap: 10%; }
  .led-fixture::after { height: 390px; }
  .led-copy h2 { font-size: clamp(32px,8vw,42px); }
  .led-copy > p:last-child { font-size: 13px; }
  .led-note { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .led-demo, .led-demo *, .led-demo *::after { transition-duration: .01ms !important; transition-delay: 0s !important; }
}

/* A dedicated viewport and a short, freely scrollable pause for the light study. */
.led-experience { --led-header: 82px; position: relative; background: #fff; transition: background-color .8s; }
.led-experience::after { content: ""; display: block; height: 45svh; }
.led-experience.is-on { background: #191a1b; }
.led-experience .led-demo { position: sticky; top: var(--led-header); min-height: calc(100svh - var(--led-header)); display: flex; flex-direction: column; padding-top: clamp(28px,5svh,56px); padding-bottom: 28px; }
.led-experience .led-scene { flex: 1; min-height: 420px; }
.led-experience .led-fixture::after { height: max(430px,55svh); }
.led-experience .led-invitation { gap: 30px; }
.led-experience .led-start { min-width: 220px; min-height: 60px; padding: 16px 25px; justify-content: space-between; background: #303234; color: #fff; border: 1px solid #303234; font-size: 16px; transition: background .2s, box-shadow .2s; }
.led-experience .led-start:hover { background: #46484a; box-shadow: 0 8px 28px #00000014; }
.led-experience .led-start svg { width: 20px; height: 20px; }
.led-experience .led-power { justify-content: center; padding: 12px 16px; min-width: 120px; border: 1px solid #96969670; font-size: 14px; }
.led-experience .led-power[aria-pressed="true"] { border-color: #dddddd60; background: #ffffff08; }
.led-experience .led-temperatures button { font-size: 14px; min-width: 90px; }
.led-experience .led-temperatures button span:last-child { font-size: 12px; }

/* Quiet, readable search and request dialogs; shared form behaviour is unchanged. */
#search-dialog, #contact-dialog { border: 1px solid #ffffffc9; border-radius: 4px; background: rgba(248,249,248,.97); box-shadow: 0 24px 90px #14161730; max-height: calc(100svh - 48px); overflow: hidden; }
#search-dialog[open], #contact-dialog[open] { display: flex; flex-direction: column; }
#search-dialog::backdrop, #contact-dialog::backdrop { background: #20222452; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
#search-dialog { width: min(880px,calc(100vw - 48px)); }
#contact-dialog { width: min(1080px,calc(100vw - 64px)); background: #fafaf8; border-radius: 2px; }
#search-dialog .dialog-top, #contact-dialog .dialog-top { padding: 18px 30px; flex-shrink: 0; border-bottom: 1px solid #dcdedc; }
#search-dialog .dialog-top .eyebrow, #contact-dialog .dialog-top .eyebrow { font-size: 11px; color: #565a5b; letter-spacing: .16em; }
#search-dialog .dialog-body, #contact-dialog .dialog-body { padding: 28px 30px 30px; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
#search-dialog .search-input { gap: 14px; padding: 16px 18px; border: 1px solid #c6c9c7; border-radius: 2px; background: #fff; transition: border-color .2s, box-shadow .2s; }
#search-dialog .search-input:focus-within { border-color: #424648; box-shadow: 0 0 0 2px #42464812; }
#search-dialog .search-input > svg { width: 21px; height: 21px; flex-shrink: 0; color: #555b5d; }
#search-dialog .search-input input { font-size: 20px; font-weight: 400; min-width: 0; color: #292d2f; }
#search-dialog .search-input input::placeholder { color: #727778; opacity: 1; }
#search-dialog .search-hint { font-size: 13px; margin: 20px 0 16px; line-height: 1.6; color: #656a6b; }
#search-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
#search-dialog .search-result { display: grid; grid-template-columns: 64px minmax(0,1fr) 18px; gap: 14px; padding: 12px; border: 1px solid #dcdedc; border-radius: 2px; background: #ffffff6b; transition: background .2s,border-color .2s; }
#search-dialog .search-result:hover, #search-dialog .search-result:focus-visible { background: #fff; border-color: #969c9d; outline-offset: 2px; }
#search-dialog .search-result img { width: 64px; height: 78px; object-fit: cover; }
#search-dialog .search-result h3 { font-size: 17px; font-weight: 400; line-height: 1.25; letter-spacing: -0.015em; margin: 0 0 6px; }
#search-dialog .search-result p { font-size: 12px; line-height: 1.5; color: #666c6e; margin: 0; }
#search-dialog .search-result > svg { width: 18px; height: 18px; }
#search-dialog .empty { grid-column: 1/-1; padding: 28px 0; font-size: 15px; line-height: 1.6; }
#contact-dialog .dialog-top { padding: 16px 32px; background: transparent; border-bottom-color: #e4e5e1; }
#contact-dialog .dialog-body { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.6fr); align-items: start; gap: 48px; padding: 40px 40px 36px; }
#contact-dialog .contact-heading { padding-top: 3px; }
#contact-dialog h2 { font-size: clamp(28px,2.8vw,36px); line-height: 1.2; font-weight: 300; letter-spacing: -0.015em; margin: 0; max-width: 270px; }
#contact-dialog .contact-lead { font-size: 14px; line-height: 1.7; color: #666b6b; margin: 20px 0 0; max-width: 240px; }
#contact-dialog .project-form { gap: 22px 24px; min-width: 0; }
#contact-dialog .field { gap: 4px; min-width: 0; }
#contact-dialog .field label { font-size: 12px; font-weight: 500; line-height: 1.5; color: #565c5d; }
#contact-dialog .field input, #contact-dialog .field select, #contact-dialog .field textarea { padding: 11px 0; min-height: 46px; border: 0; border-bottom: 1px solid #b9bfbd; border-radius: 0; background: transparent; color: #292f30; font-size: 15px; line-height: 1.5; transition: border-color .2s,background .2s; }
#contact-dialog .field :is(input,select,textarea):focus { border-bottom-color: #292f30; outline: none; background-color: transparent; box-shadow: none; }
#contact-dialog .field select { appearance:none; -webkit-appearance:none; padding-right:30px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23565c5d' stroke-width='1.2'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 4px center; background-size:16px; }
#contact-dialog .field :is(input,textarea)::placeholder { color: #767c7d; opacity: 1; }
#contact-dialog .field textarea { min-height: 96px; resize: vertical; }
#contact-dialog .form-note { font-size: 11px !important; line-height: 1.65; color: #707676; margin: 0; }
#contact-dialog .contact-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; grid-column: 1/-1; padding-top: 2px; }
#contact-dialog .contact-actions .button { margin: 0; justify-content: space-between; gap: 24px; min-height: 50px; padding: 14px 20px; font-size: 14px; border-radius: 0; }
#contact-dialog .contact-actions .secondary { padding: 10px 0; min-height: 44px; border: 0; border-bottom: 1px solid #b9bfbd; background: transparent; color: #505757; gap: 12px; font-size: 12px; }
#contact-dialog .contact-actions .secondary:hover { color: #202526; border-color: #202526; }
#contact-dialog .contact-actions svg { width: 18px; height: 18px; }
#contact-dialog .form-success { grid-column: 1/-1; font-size: 14px; line-height: 1.6; }
html:lang(zh) #contact-dialog h2 { font-size: 30px; line-height: 1.5; letter-spacing: .015em; font-weight: 400; }
html:lang(zh) #contact-dialog .dialog-top .eyebrow { letter-spacing: .12em; }
html:lang(zh) #contact-dialog .field label { font-size: 13px; font-weight: 400; }
@media (max-width:900px) {
 #contact-dialog .dialog-body { grid-template-columns: 1fr; gap: 26px; padding: 28px 32px; }
 #contact-dialog h2, #contact-dialog .contact-lead { max-width: none; }
 #contact-dialog .contact-lead { margin-top: 10px; }
}
@media (max-width:700px) {
 .led-experience { --led-header: 70px; }
 .led-experience::after { height: 25svh; }
 .led-experience .led-demo { padding: 28px 24px 24px; }
 .led-experience .led-scene { min-height: 420px; }
 .led-experience .led-power { min-width: 110px; padding: 12px; }
 .led-experience .led-temperatures button { min-width: 72px; }
 .led-experience .led-start { min-width: 230px; }
 #search-dialog, #contact-dialog { width: calc(100vw - 24px); max-height: calc(100svh - 24px); }
 #search-dialog .dialog-top, #contact-dialog .dialog-top { padding: 12px 20px; }
 #search-dialog .dialog-body, #contact-dialog .dialog-body { padding: 22px 20px; }
 #search-dialog .dialog-top .eyebrow { font-size: 10px; letter-spacing: .1em; }
 #search-dialog .search-input { padding: 14px 12px; gap: 10px; }
 #search-dialog .search-input input { font-size: 16px; }
 #search-results { grid-template-columns: 1fr; }
 #search-dialog .search-result { grid-template-columns: 54px minmax(0,1fr) 16px; padding: 10px; }
 #search-dialog .search-result img { width: 54px; height: 62px; }
 #contact-dialog .project-form { grid-template-columns: 1fr; gap: 18px; }
 #contact-dialog .contact-actions { align-items: stretch; flex-direction: column; gap: 12px; }
 #contact-dialog .contact-actions .button { width: 100%; }
 #contact-dialog .contact-actions .secondary { align-self: center; width: auto; }
 #contact-dialog .field input, #contact-dialog .field select, #contact-dialog .field textarea { font-size: 16px; }
 html:lang(zh) #contact-dialog h2 { font-size: 26px; }
}
@media (prefers-reduced-motion:reduce) {
 .led-experience::after { height: 0; }
 .led-experience .led-demo { position: relative; top: auto; }
}

/* Focus and frosted surfaces: quiet light follows the content hierarchy. */
.callout {
  position: relative; isolation: isolate; overflow: hidden;
  padding-block: clamp(54px,6vw,86px); color: #fafafa; border-top: 1px solid #ffffff30;
  background: radial-gradient(ellipse at 12% 0%,rgba(220,211,192,.2),transparent 65%),linear-gradient(115deg,#3d4041,#242729);
}
.callout h2 { max-width: 760px; color: #f6f5f2; text-wrap: balance; }
.callout > .button {
  flex-shrink: 0; min-height: 56px; color: #252a2c; background: linear-gradient(135deg,#ffffffef,#eceeead9);
  border: 1px solid #ffffffb8; border-radius: 4px; box-shadow: 0 10px 32px #00000018,inset 0 1px 0 #fff;
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); transition:background .2s,box-shadow .2s;
}
.callout > .button:hover { background: #fff; box-shadow: 0 12px 36px #00000024,inset 0 1px 0 #fff; }
.callout > .button:focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
#contact-dialog {
  background: rgba(247,248,246,.94); border: 0; border-radius: 8px;
  box-shadow: 0 26px 90px #15191b40;
  -webkit-backdrop-filter: blur(28px) saturate(85%); backdrop-filter: blur(28px) saturate(85%);
}
#contact-dialog::backdrop { background: rgba(22,26,28,.54); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
#contact-dialog .dialog-top { background: linear-gradient(110deg,#fffffff2,#f5f7f3c4); }
#contact-dialog .dialog-body { gap: 0; padding: 0; align-items: stretch; }
#contact-dialog .contact-heading {
  padding: 40px 32px; border: 0;
  background: radial-gradient(ellipse at 10% 0%,rgba(224,212,186,.3),transparent 72%),linear-gradient(155deg,#454847,#292d2f);
  box-shadow: none;
}
#contact-dialog .contact-heading h2 { color: #fcfaf5; }
#contact-dialog .contact-lead { color: #d4d7d4; }
#contact-dialog .project-form { padding: 34px 36px; background: linear-gradient(135deg,#fffffff2,#f3f5f1eb); }
#contact-dialog .field { padding: 4px 8px; margin: -4px -8px; }
#contact-dialog .field :is(input,select,textarea):focus-visible { outline: 1px solid #657273; outline-offset: 3px; }
#contact-dialog .contact-actions > .button:not(.secondary) {
  background: linear-gradient(145deg,#505859,#303638); border-color:#353e40; border-radius:3px;
  box-shadow: 0 7px 20px #27303226,inset 0 1px 0 #ffffff2b;
}
#contact-dialog .contact-actions > .button:not(.secondary):hover { background:#414b4d; }
#search-dialog { background:linear-gradient(130deg,#fffffff2,#edf0ecf2); border-radius:8px; }
#search-dialog .search-input { box-shadow:0 6px 24px #242a2c08,inset 0 1px 0 #fff; }
#search-dialog .search-result { background:#ffffff70; border-color:#daddd7; }
#search-dialog .search-result:hover, #search-dialog .search-result:focus-visible { background:#fff; box-shadow:0 5px 18px #252b2d0c; }
#menu-dialog { background:linear-gradient(130deg,#ffffffe8,#e8ece6eb); box-shadow:-18px 0 60px #1920231c,inset 1px 0 0 #ffffffdb; }
#menu-dialog .menu-links a:hover, #menu-dialog .menu-links a:focus-visible { background:#ffffffad; }
#menu-dialog button.menu-project { width:100%; text-align:left; color:inherit; background:transparent; border:0; border-top:1px solid var(--line); padding:20px 0 0; }
.split.dark .split-copy { background:radial-gradient(ellipse at 12% 0%,#cac6b217,transparent 70%),linear-gradient(135deg,#363b3b,#262a2c); }
.split.dark .split-copy h2 { color:#fafaf8; }
.split.dark .split-copy > p { color:#d5d9d6; }
.client-shell:focus-within { box-shadow:0 18px 56px #2a2c2e12,inset 0 1px 0 #fff; border-color:#fff; }
@media(max-width:900px) {
 #contact-dialog .contact-heading { padding:26px 32px; border-right:0; }
 #contact-dialog .project-form { padding:28px 32px; }
}
@media(max-width:700px) {
 .callout { align-items:flex-start; }
 .callout > .button { align-self:flex-start; }
 #contact-dialog .contact-heading { padding:24px 22px; }
 #contact-dialog .project-form { padding:26px 22px; }
 #contact-dialog .dialog-body { padding:0; gap:0; }
}
@media(prefers-reduced-motion:reduce) {
 #contact-dialog .field,.callout>.button { transition:none; }
}
@media(prefers-reduced-transparency:reduce) {
 #contact-dialog,#search-dialog,#menu-dialog { background:#f8f9f7; -webkit-backdrop-filter:none; backdrop-filter:none; }
 #contact-dialog .project-form { background:#f8f9f7; }
 .callout>.button { background:#f7f8f6; -webkit-backdrop-filter:none; backdrop-filter:none; }
}

/* Linear, neutral surfaces: restrained light, square architectural edges. */
:root { --action-light: linear-gradient(155deg,#47494a 0%,#343637 70%,#303233 100%); }
.button:not(.secondary), .callout > .button, .led-experience .led-start,
#contact-dialog .contact-actions > .button:not(.secondary) {
  border-radius:0; border:1px solid #414344; color:#fff;
  background:var(--action-light); box-shadow:inset 0 1px 0 #ffffff14;
}
.button:not(.secondary):hover, .callout > .button:hover, .led-experience .led-start:hover,
#contact-dialog .contact-actions > .button:not(.secondary):hover {
  background:linear-gradient(155deg,#525455,#393b3c); box-shadow:inset 0 1px 0 #ffffff20;
}
.button.secondary, #contact-dialog, #search-dialog,
#search-dialog .search-input, #search-dialog .search-result,
.product-model-controls button { border-radius:0; }
.callout {
  color:#303233; border-top:1px solid #d8d9d9; border-bottom:1px solid #d8d9d9;
  background:linear-gradient(110deg,#f5f5f4,#ededed);
}
.callout h2 { color:#303233; }
.callout > .button { -webkit-backdrop-filter:none; backdrop-filter:none; }
.callout > .button:focus-visible { outline-color:#424647; }
#contact-dialog .contact-heading {
  background:radial-gradient(ellipse at 0% 0%,#ffffff12,transparent 75%),linear-gradient(155deg,#3d3f40,#292b2c);
}
#contact-dialog .dialog-top, #contact-dialog .project-form,
#search-dialog { background:linear-gradient(135deg,#fafafa,#f3f3f3); }
#menu-dialog { background:linear-gradient(130deg,#fffffff0,#edededf0); }
.split.dark .split-copy { background:linear-gradient(135deg,#383a3b,#2c2e2f); }
.inner-head { background:var(--intro-surface,linear-gradient(135deg,#fafafa 30%,#f3f3f3)); }
.inner-head .section-action { margin-top:26px; min-height:54px; }
@media (max-width:700px) {
 .inner-head .section-action { max-width:100%; font-size:13px; gap:24px; }
}

/* 2026-10: quiet motion, an editorial request form and a dedicated location. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); }
html { scrollbar-gutter: stable; }
.page { animation: cc-page-arrive .55s var(--motion-ease); }
@keyframes cc-page-arrive { from { opacity: .25; translate: 0 12px; } to { opacity: 1; translate: 0 0; } }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: cc-page-out .18s ease both; }
::view-transition-new(root) { animation: cc-page-in .38s var(--motion-ease) both; }
@keyframes cc-page-out { to { opacity: 0; } }
@keyframes cc-page-in { from { opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
 .button, .text-link, .icon-btn { transition: background-color .22s, color .22s, border-color .22s, box-shadow .22s, transform .28s var(--motion-ease); }
 .text-link svg, .button svg, .menu-links svg { transition: transform .35s var(--motion-ease); }
 .text-link:hover svg, .button:hover svg { transform: translateX(3px); }
 .nav a::after { transition: transform .35s var(--motion-ease), opacity .25s; }
 #menu-dialog[open] .menu-links a { animation: cc-menu-item .55s var(--motion-ease) both; }
 #menu-dialog[open] .menu-links a:nth-child(2) { animation-delay: .025s; }
 #menu-dialog[open] .menu-links a:nth-child(3) { animation-delay: .05s; }
 #menu-dialog[open] .menu-links a:nth-child(n+4) { animation-delay: .075s; }
 #menu-dialog[open] .menu-project { animation: cc-menu-photo .65s var(--motion-ease) both; }
}
@keyframes cc-menu-item { from { opacity: 0; transform: translateX(-16px); } to { opacity: 1; transform: none; } }
@keyframes cc-menu-photo { from { opacity: 0; transform: translateX(36px); } to { opacity: 1; transform: none; } }
#menu-dialog { width: 100%; max-width: 100%; height: 100svh; max-height: 100svh; margin: 0; border: 0; background: #262626; color: #f7f7f7; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
#menu-dialog::backdrop { background: #262626; backdrop-filter: none; }
#menu-dialog .dialog-top { min-height: 82px; padding: 20px 5vw; background: #262626; color: #f7f7f7; backdrop-filter: none; -webkit-backdrop-filter: none; }
#menu-dialog .dialog-top .eyebrow { color: #b7b7b7; }
#menu-dialog .dialog-body { display: grid; grid-template-columns: minmax(280px,.9fr) minmax(0,1.5fr); gap: 26px 8vw; padding: 20px 8vw 48px; max-width: 1700px; margin: auto; }
#menu-dialog .menu-links { grid-column: 1; grid-row: 1 / span 2; padding: 0; }
#menu-dialog .menu-links a { padding: 7px 0 7px 20px; min-height: 46px; font-size: clamp(26px,2.5vw,40px); font-weight: 300; color: #f7f7f7; }
#menu-dialog .menu-links a:hover, #menu-dialog .menu-links a:focus-visible { background: transparent; color: #fff; text-decoration: none; }
#menu-dialog .menu-links .menu-home { font-size: 16px; border-color: #ffffff25; padding-bottom: 18px; margin-bottom: 14px; }
#menu-dialog .menu-links .menu-secondary { font-size: 16px; min-height: 36px; padding-block: 7px; color: #c3c3c3; }
#menu-dialog .menu-links .menu-secondary-start { margin-top: 22px; padding-top: 20px; border-color: #ffffff25; }
#menu-dialog button.menu-project { grid-column: 2; grid-row: 1; align-self: start; padding: 0; border: 0; }
#menu-dialog .menu-project > img { width: 100%; height: clamp(240px,49svh,560px); object-fit: cover; }
#menu-dialog .menu-project-caption { font-size: 16px; padding-block: 22px; border-bottom: 1px solid #ffffff25; }
#menu-dialog .menu-contact { grid-column: 2; grid-row: 2; align-self: start; border-color: #ffffff25; color: #d3d3d3; }
#menu-dialog .menu-tools { grid-column: 2; margin: 0; color: #c3c3c3; }
#menu-dialog .menu-tools .quiet { color: #a6a6a6; }

/* The request reads as a clean two-column editorial spread, with a single line per field. */
#contact-dialog { width: min(1320px,calc(100vw - 48px)); border-radius: 0; background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; }
#contact-dialog .dialog-top { background: #fff; border-bottom: 0; padding: 22px 4vw 12px; }
#contact-dialog .dialog-body { grid-template-columns: minmax(0, .95fr) minmax(0, 1.3fr); gap: clamp(30px,5vw,80px); padding: 24px 4vw 48px; }
#contact-dialog .contact-heading { padding: 0; background: transparent; }
#contact-dialog .contact-heading h2 { font-size: clamp(38px,4.2vw,64px); line-height: 1.15; letter-spacing: -.018em; max-width: 460px; color: #2b2b2b; font-weight: 400; }
#contact-dialog .contact-lead { color: #6a6a6a; max-width: 330px; font-size: 16px; margin-top: 32px; line-height: 1.75; }
#contact-dialog .project-form { padding: 0; background: transparent; gap: 28px 26px; }
#contact-dialog .field { padding: 0; margin: 0; gap: 5px; }
#contact-dialog .field label { font-size: 13px; font-weight: 400; color: #595959; }
#contact-dialog .field :is(input,select,textarea) { font-size: 16px; min-height: 48px; border-bottom-color: #b2b2b2; }
#contact-dialog .field textarea { min-height: 100px; }
#contact-dialog .field :is(input,select,textarea):focus-visible { outline: 0; border-bottom: 2px solid #343434; padding-bottom: 10px; }
#contact-dialog .form-note { font-size: 12px !important; line-height: 1.8; }
#contact-dialog .contact-actions { justify-content: space-between; flex-direction: row-reverse; }
#contact-dialog .contact-actions > .button:not(.secondary) { background: #323232; border-radius: 0; box-shadow: none; min-height: 52px; }
#contact-dialog .contact-actions .secondary { font-size: 12px; }

.location-intro { max-width: 920px; margin: auto; padding: 150px 24px 64px; text-align: center; }
.location-intro h1 { font-size: clamp(42px,5.8vw,82px); line-height: 1.14; font-weight: 400; letter-spacing: -.018em; margin: 24px 0; }
.location-intro > p:last-child { max-width: 570px; margin: auto; font-size: 17px; line-height: 1.85; color: #686868; }
.location-layout { display: grid; grid-template-columns: 1.25fr 1fr; gap: 32px; padding: 0 5vw 100px; max-width: 1600px; margin: auto; }
.location-map { position: relative; min-height: 450px; background: #ededed; border: 1px solid #e3e3e3; }
.location-map-invitation { min-height: 450px; padding: 40px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.location-map-invitation > svg { width: 30px; height: 30px; margin-bottom: 24px; }
.location-map-invitation h2 { font-size: 32px; font-weight: 300; letter-spacing: -.015em; }
.location-map-invitation > p { margin: 12px 0 24px; }
.location-map-invitation .location-map-note { max-width: 340px; font-size: 11px; color: #676767; line-height: 1.7; margin: 24px 0 0; }
.location-map-note a { text-decoration: none; text-underline-offset: 3px; }
#location-map-frame { height: 100%; min-height: 450px; }
#location-map-frame iframe { display: block; width: 100%; height: 100%; min-height: 450px; border: 0; position: absolute; inset: 0; }
.location-card { background: #2b2b2b; color: #f5f5f5; padding: clamp(28px,4vw,60px); }
.location-card .eyebrow { color: #c3c3c3; }
.location-card h2 { font-size: 40px; font-weight: 400; margin: 18px 0 26px; }
.location-card address { font-style: normal; font-size: 17px; line-height: 1.85; color: #e5e5e5; }
.location-directions { display: flex; justify-content: space-between; margin: 32px 0 16px; background: #f5f5f5; color: #2b2b2b; border: 0; }
.location-card .text-link { display: flex; justify-content: space-between; width: 100%; padding: 16px 0; border-color: #ffffff45; }
.location-email { display: block; font-size: 14px; margin-top: 22px; }
.location-visit-note { font-size: 12px; color: #c3c3c3; line-height: 1.7; margin-top: 16px; }
@media (max-width: 900px) {
 #contact-dialog .dialog-body { grid-template-columns: 1fr; gap: 30px; }
 #contact-dialog .contact-heading h2 { max-width: 640px; font-size: 40px; }
 #contact-dialog .contact-lead { max-width: none; margin-top: 16px; }
 .location-layout { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
 #menu-dialog .dialog-top { min-height: 70px; padding: 16px 24px; }
 #menu-dialog .dialog-body { display: flex; flex-direction: column; gap: 24px; padding: 6px 24px 40px; }
 #menu-dialog .menu-links a { font-size: 28px; }
 #menu-dialog .menu-project > img { height: 220px; }
 #contact-dialog { width: calc(100vw - 24px); }
 #contact-dialog .dialog-top { padding: 16px 22px; }
 #contact-dialog .dialog-body { padding: 10px 22px 30px; }
 #contact-dialog .contact-heading h2 { font-size: 36px; }
 #contact-dialog .project-form { gap: 24px; }
 #contact-dialog .contact-actions { flex-direction: column; align-items: stretch; }
 .location-intro { padding: 114px 24px 44px; }
 .location-intro > p:last-child { font-size: 16px; }
 .location-layout { padding: 0 24px 56px; gap: 20px; }
 .location-map, .location-map-invitation, #location-map-frame, #location-map-frame iframe { min-height: 350px; }
 .location-map-invitation { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
 @view-transition { navigation: none; }
 .page, #menu-dialog .menu-links a, #menu-dialog .menu-project { animation: none !important; }
 ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
}
html.cc-editor-motion-off .page { animation: none !important; }
@media (min-width: 901px) and (max-height: 800px) {
 #contact-dialog .dialog-body { padding-top: 12px; padding-bottom: 24px; }
 #contact-dialog .project-form { gap: 18px 26px; }
 #contact-dialog .field textarea { min-height: 78px; }
}

/* Desktop navigation: one glass surface, without shifting the header or page. */
.nav-dropdown { position: absolute; top: 100%; left: 0; width: 100%; color: #343434; background: rgba(248,248,248,.96); border-top: 1px solid #ffffff60; border-bottom: 1px solid #bcbcbc70; backdrop-filter: blur(26px) saturate(115%); -webkit-backdrop-filter: blur(26px) saturate(115%); box-shadow: 0 20px 36px #20202018; }
.nav-dropdown-inner { max-width: 1440px; margin: auto; padding: 34px 5vw 42px; display: grid; grid-template-columns: 1fr 3fr; gap: 40px; }
.nav-dropdown .eyebrow { padding-top: 13px; margin: 0; color: #6a6a6a; }
#nav-dropdown-links { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px 36px; }
#nav-dropdown-links :is(a,button) { text-align: left; display: block; padding: 12px 0; min-height: 48px; border-bottom: 1px solid #c3c3c370; font-size: 18px; line-height: 1.4; transition: color .2s,border-color .2s; }
#nav-dropdown-links :is(a,button):hover { color: #0a0a0a; border-bottom-color: currentColor; }
@media(max-width:1000px) { .nav-dropdown { display: none !important; } }
@media(prefers-reduced-transparency:reduce) { .nav-dropdown { background:#f5f5f5; backdrop-filter:none; -webkit-backdrop-filter:none; } }

/* Automatic device appearance. Media and the interactive LED study keep their own colours. */
:root { color-scheme: light; }
@media (prefers-color-scheme: dark) {
 :root { color-scheme: dark; --paper:#1b1b1b; --stone:#2a2a2a; --ink:#efefef; --muted:#b5b5b5; --line:#474747; --red:#cbcbcb; }
 body { background:var(--paper); color:var(--ink); }
 .header.solid { background:rgba(31,31,31,.94); color:#f2f2f2; border-bottom-color:#ffffff20; box-shadow:0 12px 35px #0002; }
 .header.solid .logo img[src$="logo-rosso.png"] { filter:brightness(0) invert(1); }
 .header.solid .icon-btn:hover { background:#ffffff12; }
 .nav-dropdown { background:rgba(36,36,36,.97); color:#f2f2f2; border-color:#ffffff20; box-shadow:0 22px 45px #0004; }
 .nav-dropdown .eyebrow { color:#b2b2b2; }
 #nav-dropdown-links :is(a,button) { border-color:#ffffff25; }
 #nav-dropdown-links :is(a,button):hover { color:#fff; }
 .dark { background:#2a2a2a; color:#f1f1f1; }
 .button { background:#eaeaea; color:#252525; border-color:#eaeaea; }
 .button:hover { background:#fff; color:#1a1a1a; }
 .button.secondary { background:transparent; color:var(--ink); border-color:#707070; }
 .button.secondary:hover { background:#ffffff12; }
 .callout { background:linear-gradient(120deg,#353535,#262626); color:#eee; }
 .callout h2 { color:#f1f1f1; }
 .callout > .button { background:#eaeaea; color:#252525; }
 .form-section,.client-shell,.catalogs-section,.catalog-card,.catalog-grid>.catalog-card:only-child { background:#262626; color:var(--ink); }
 .client-shell .inner-head>p:last-child,.client-shell .inner-head .eyebrow,.client-shell .client-tabs .text-link,.client-shell .field label,.catalog-copy .eyebrow,.catalog-copy .quiet,.catalog-owner .text-link { color:#bcbcbc; }
 .client-shell .client-tabs [aria-current="page"] { color:#fff; border-color:#dcdcdc; }
 .client-shell .field input,.client-shell .field select { background:#1d1d1d; color:#f1f1f1; border-color:#585858; }
 #client-status { background:#393939; color:#e8e8e8; }
 #client-status.is-error,.form-success.is-error { color:#f0b5ab; }
 .catalog-cover { background:linear-gradient(135deg,#393939,#2d2d2d); }
 .product-detail-media { color:#292929; --muted:#696969; }
 .card-save { color:#393939; }
 dialog,#search-dialog,#contact-dialog { background:#262626; color:#f1f1f1; border-color:#4c4c4c; }
 #search-dialog .dialog-top,#contact-dialog .dialog-top { background:#262626; border-color:#4c4c4c; }
 #search-dialog .dialog-top .eyebrow,#contact-dialog .dialog-top .eyebrow { color:#c1c1c1; }
 #contact-dialog .contact-heading { background:transparent; }
 #contact-dialog .contact-heading h2 { color:#f1f1f1; }
 #contact-dialog .contact-lead,#contact-dialog .form-note { color:#bdbdbd; }
 #contact-dialog .project-form { background:transparent; }
 #contact-dialog .field label { color:#c3c3c3; }
 #contact-dialog .field :is(input,select,textarea) { color:#f3f3f3; border-color:#7f7f7f; background-color:transparent; }
 #contact-dialog .field :is(input,textarea)::placeholder { color:#bababa; }
 #contact-dialog .field :is(input,select,textarea):focus-visible { border-bottom-color:#f4f4f4; }
 #contact-dialog .field select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23d6d6d6' stroke-width='1.2'/%3E%3C/svg%3E"); }
 #contact-dialog .field select option { color:#f3f3f3; background:#262626; }
 #contact-dialog .contact-actions>.button:not(.secondary) { background:#eaeaea; color:#252525; border-color:#eaeaea; }
 #contact-dialog .contact-actions .secondary { color:#c4c4c4; border-color:#797979; }
 #search-dialog .search-input { background:#1d1d1d; border-color:#6a6a6a; box-shadow:none; }
 #search-dialog .search-input input,#search-dialog .search-input>svg { color:#f2f2f2; }
 #search-dialog .search-input input::placeholder,#search-dialog .search-hint { color:#bababa; }
 #search-dialog .search-result { background:#2e2e2e; border-color:#4d4d4d; }
 #search-dialog .search-result:hover,#search-dialog .search-result:focus-visible { background:#3a3a3a; border-color:#8f8f8f; }
 #search-dialog .search-result p { color:#c3c3c3; }
 .location-intro>p:last-child { color:#bdbdbd; }
 .location-map { background:#2b2b2b; border-color:#4b4b4b; }
 .location-map-invitation .location-map-note { color:#bebebe; }
 .location-card { background:#2a2a2a; border:1px solid #4b4b4b; }
 .location-directions { color:#252525; background:#eaeaea; }
 .led-demo,.led-experience { color-scheme:light; }
 .led-demo:not(.is-on) { color:#383838; }
 .led-experience .led-start { color:#fff; background:#323232; }
}
.location-card .button.location-directions { background:#f1f1f1; color:#2d2d2d; border:0; box-shadow:none; }
.location-card .button.location-directions:hover { background:#fff; }
.location-map-invitation[hidden] { display:none !important; }
@media (prefers-color-scheme: dark) {
 .product-model-hint,.product-model-disclaimer { color:var(--muted); }
}

/* v37 — glass, continuous surface motion and a real location explorer. */
.nav-dropdown { background:rgba(247,247,247,.52); backdrop-filter:blur(12px) saturate(125%); -webkit-backdrop-filter:blur(12px) saturate(125%); border-color:#ffffff5c; overflow:hidden; box-shadow:0 22px 40px #19191910; }
.nav-dropdown[hidden] { display:none; }
.nav-dropdown-inner { position:relative; }
.nav-dropdown-ghost { position:absolute; inset:0; width:100%; pointer-events:none; }
.nav-dropdown .eyebrow { color:#494949; }
#nav-dropdown-links :is(a,button) { color:#262626; border-color:#4c4c4c33; }
#menu-dialog::backdrop { background:#17171742; backdrop-filter:none; -webkit-backdrop-filter:none; }
#menu-dialog[data-closing] { pointer-events:none; }
@media(prefers-reduced-motion:no-preference) {
 #menu-dialog[open]::backdrop { animation:cc-backdrop-arrive .8s ease both; }
 #menu-dialog[data-closing]::backdrop { animation:cc-backdrop-leave .62s ease both; }
 #menu-dialog[open] .menu-links a { animation:cc-menu-item .8s var(--motion-ease) .28s both; }
 #menu-dialog[open] .menu-links a:nth-child(2) { animation-delay:.32s; }
 #menu-dialog[open] .menu-links a:nth-child(3) { animation-delay:.36s; }
 #menu-dialog[open] .menu-links a:nth-child(n+4) { animation-delay:.40s; }
 #menu-dialog[open] .menu-project { animation:cc-menu-photo .95s var(--motion-ease) .18s both; }
 .page { animation-duration:.8s; }
 ::view-transition-old(root) { animation-duration:.32s; }
 ::view-transition-new(root) { animation-duration:.62s; }
}
@keyframes cc-menu-item { from { opacity:0; transform:translateX(50px); } to { opacity:1; transform:none; } }
@keyframes cc-menu-photo { from { opacity:0; transform:translateX(75px); } to { opacity:1; transform:none; } }
@keyframes cc-backdrop-arrive { from { opacity:0; } to { opacity:1; } }
@keyframes cc-backdrop-leave { from { opacity:1; } to { opacity:0; } }
.location-intro { padding-bottom:72px; }
.location-layout { max-width:1800px; padding-inline:4vw; grid-template-columns:minmax(0,1.4fr) minmax(330px,1fr); gap:32px; align-items:start; }
.location-map-wrap { min-width:0; }
.location-map { height:clamp(440px,58vw,640px); min-height:0; border:0; isolation:isolate; background:#e7e7e7; z-index:0; }
.location-map .leaflet-tile-pane { filter:grayscale(.92) saturate(.2) contrast(.88) brightness(1.05); }
.location-map .leaflet-control-attribution { font:11px/1.5 -apple-system,BlinkMacSystemFont,sans-serif; background:#ffffffed; color:#3a3a3a; }
.location-map .leaflet-control-attribution a { color:#3a3a3a; }
.location-map .leaflet-control-zoom { border:1px solid #cecece; border-radius:0; box-shadow:0 4px 18px #0001; margin:0 20px 24px 0; }
.location-map .leaflet-control-zoom a { width:40px; height:40px; line-height:40px; border-radius:0; color:#353535; background:#fbfbfb; }
.location-map .cc-map-marker { border:0; background:transparent; filter:drop-shadow(0 3px 5px #0003); }
.location-map .cc-map-marker svg { width:46px; height:54px; fill:#292929; color:#fff; stroke-width:1.3; }
.location-map .cc-map-label { border:0; border-radius:0; padding:8px 12px; box-shadow:0 4px 16px #0001; font:500 13px/1.4 -apple-system,BlinkMacSystemFont,sans-serif; color:#2a2a2a; }
.location-map-loading { position:absolute; inset:45% 0 auto; text-align:center; font-size:14px; color:#585858; }
.location-map-error { padding:16px; background:var(--stone); font-size:13px; line-height:1.6; }
.location-card { padding:32px; border:0; background:linear-gradient(120deg,#383838,#282828); }
.location-card-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.location-card .eyebrow { font-size:11px; letter-spacing:.16em; }
.location-card h2 { font-size:clamp(28px,3vw,40px); margin:14px 0 20px; }
.location-center { color:#f2f2f2; width:48px; height:48px; display:grid; place-items:center; border:1px solid #ffffff40; transition:background .3s; }
.location-center:hover { background:#ffffff18; }
.location-card address { font-size:16px; line-height:1.8; }
.location-actions { display:grid; grid-template-columns:1fr 1fr; margin-top:30px; border-top:1px solid #ffffff30; }
.location-actions :is(a,button) { display:flex; align-items:center; gap:14px; padding:22px 12px 4px 0; color:#f6f6f6; font-size:14px; }
.location-actions :is(a,button):hover { color:#fff; }
.location-actions svg { width:21px; height:21px; transition:transform .35s; }
.location-actions a:hover svg { transform:translate(2px,-2px); }
.location-visit { padding:36px 8px; }
.location-visit .eyebrow { font-size:11px; color:var(--muted); }
.location-visit h3 { font-size:26px; font-weight:400; line-height:1.35; margin:20px 0 14px; letter-spacing:0; }
.location-visit > p:not(.eyebrow) { font-size:15px; line-height:1.8; max-width:330px; color:var(--muted); }
.location-visit .location-email { display:flex; justify-content:space-between; font-size:14px; margin-top:26px; }
@media(max-width:900px) { .location-layout { grid-template-columns:1fr; gap:24px; } .location-map { height:440px; } }
@media(max-width:600px) { .location-intro { padding:125px 24px 44px; } .location-layout { padding-inline:20px; } .location-map { height:360px; } .location-card { padding:26px; } .location-visit { padding:26px 6px; } }
@media(prefers-color-scheme:dark) {
 .nav-dropdown { background:rgba(32,32,32,.62); border-color:#e5e5e530; }
 .nav-dropdown .eyebrow { color:#cacaca; }
 #nav-dropdown-links :is(a,button) { color:#f6f6f6; border-color:#dddddd33; }
 .location-map .leaflet-tile-pane { filter:grayscale(1) invert(.86) hue-rotate(180deg) brightness(.9); }
 .location-map { background:#2c2c2c; }
 .location-card { border:1px solid #ffffff20; }
}
@media(prefers-reduced-transparency:reduce) { .nav-dropdown { background:#f5f5f5; backdrop-filter:none; -webkit-backdrop-filter:none; } }
@media(prefers-reduced-transparency:reduce) and (prefers-color-scheme:dark) { .nav-dropdown { background:#252525; } }

/* The photo header and its open submenu share one dark glass surface. */
.header:not(.solid) { --photo-glass:rgba(23,23,23,.28); }
.header:not(.solid)::before {
 content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
 background:var(--photo-glass); backdrop-filter:blur(12px) saturate(115%);
 -webkit-backdrop-filter:blur(12px) saturate(115%); opacity:0;
 transition:opacity .6s var(--motion-ease);
}
.header:not(.solid):has(.nav-dropdown:not([hidden]))::before { opacity:1; }
.header:not(.solid) .nav-dropdown {
 background:var(--photo-glass); color:#fff; border-top:0;
 border-bottom-color:#ffffff26; box-shadow:0 20px 36px #00000012;
 backdrop-filter:blur(12px) saturate(115%); -webkit-backdrop-filter:blur(12px) saturate(115%);
}
.header:not(.solid) .nav-dropdown .eyebrow { color:#ffffffc7; }
.header:not(.solid) #nav-dropdown-links :is(a,button) { color:#fff; border-bottom-color:#ffffff36; }
.header:not(.solid) #nav-dropdown-links :is(a,button):hover { color:#fff; border-bottom-color:#ffffffb3; }
.header:not(.solid) #nav-dropdown-links :is(a,button):focus-visible { outline-color:#fff; }
@media(prefers-reduced-transparency:reduce) {
 .header:not(.solid) { --photo-glass:#292929; }
 .header:not(.solid)::before, .header:not(.solid) .nav-dropdown { backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@media(prefers-reduced-motion:reduce) { .header:not(.solid)::before { transition:none; } }

/* Keep the scrolled header and dropdown readable over detailed photography.
   Sibling glass layers avoid a nested backdrop root that leaves the photos sharp. */
.header.solid { --solid-glass:rgba(249,249,249,.90); background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; }
.header.solid::before {
 content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
 background:var(--solid-glass); backdrop-filter:blur(24px) saturate(105%);
 -webkit-backdrop-filter:blur(24px) saturate(105%);
}
.header.solid .nav-dropdown {
 background:var(--solid-glass); color:#242424; border-top:0; border-bottom-color:#cdcdcd;
 backdrop-filter:blur(24px) saturate(105%); -webkit-backdrop-filter:blur(24px) saturate(105%);
 box-shadow:0 18px 32px #1e1e1e18;
}
.header.solid .nav-dropdown .eyebrow { color:#585858; }
.header.solid #nav-dropdown-links :is(a,button) { color:#242424; font-weight:500; border-bottom-color:#90909066; }
.header.solid #nav-dropdown-links :is(a,button):hover { color:#000; border-bottom-color:#242424; }
@media(prefers-color-scheme:dark) {
 .header.solid { --solid-glass:rgba(32,32,32,.92); }
 .header.solid .nav-dropdown { color:#f9f9f9; border-bottom-color:#ffffff30; }
 .header.solid .nav-dropdown .eyebrow { color:#cbcbcb; }
 .header.solid #nav-dropdown-links :is(a,button) { color:#f9f9f9; border-bottom-color:#ffffff55; }
 .header.solid #nav-dropdown-links :is(a,button):hover { color:#fff; border-bottom-color:#fff; }
}
@media(prefers-reduced-transparency:reduce) {
 .header.solid { --solid-glass:#f9f9f9; }
 .header.solid::before, .header.solid .nav-dropdown { backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@media(prefers-reduced-transparency:reduce) and (prefers-color-scheme:dark) { .header.solid { --solid-glass:#202020; } }

/* Device-dark surfaces are paired with their text, including light editor backgrounds. */
@media (prefers-color-scheme: dark) {
 :root { --paper:#191919; --stone:#282828; --ink:#f2f2f2; --muted:#bdbdbd; --line:#494949; --intro-surface:linear-gradient(135deg,#242424 30%,#1b1b1b); }
 /* The editor's white page-intro background belongs to the light appearance. */
 .inner-head { background:var(--intro-surface) !important; color:var(--ink); }
 .inner-head .eyebrow,.inner-head > p { color:var(--muted); }
 #page-home .intro,#page-home .split:not(.dark) .split-copy { background:#242424; color:var(--ink); }
 #page-home .journal,.catalog-document { color:#f2f2f2; }
 .catalog-section,[data-page="area-clienti"] { background:var(--paper); color:var(--ink); }
 .client-shell,.catalog-grid>.catalog-card:only-child { border-color:var(--line); box-shadow:none; }
 .client-shell .inner-head { background:transparent !important; }
 .client-shell #client-status { background:#333; color:#eee; border-color:#777; }
 .client-shell #client-status.is-error { background:#3a2424; color:#ffc5c0; border-color:#b96b65; }
 .product-model-dialog { background:#242424; color:var(--ink); }
 /* Furniture and LED previews keep their deliberate white stage and dark captions. */
 #product-model-status { color:#454545; }
 .led-demo:not(.is-on) { --muted:#696969; --ink:#383838; }
 .location-map-loading { color:#bdbdbd; }
 .callout { border-color:var(--line); }
}

/* v41: a consistent black action, red selection cues, and complete dark surfaces. */
:root { --selection-red:#e1262d; --action-light:linear-gradient(145deg,#292929,#151515); }
.button:not(.secondary), .callout > .button,
#contact-dialog .contact-actions > .button:not(.secondary),
.led-experience .led-start,
.catalog-grid>.catalog-card:only-child .catalog-actions .text-link:first-child {
 background:var(--action-light); color:#fff; border:1px solid #555;
 box-shadow:inset 0 1px 0 #ffffff12;
}
.button:not(.secondary):hover, .callout > .button:hover,
#contact-dialog .contact-actions > .button:not(.secondary):hover,
.led-experience .led-start:hover,
.catalog-grid>.catalog-card:only-child .catalog-actions .text-link:first-child:hover {
 background:linear-gradient(145deg,#383838,#202020); color:#fff;
}
.nav a::after, #menu-dialog .menu-links a[aria-current="page"]::before { background:var(--selection-red); }
.filter.active, .led-temperatures button[aria-pressed="true"],
.client-shell .client-tabs [aria-current="page"] { border-bottom-color:var(--selection-red); }
.card-save[data-save][aria-pressed="true"], .text-link[data-save][aria-pressed="true"] svg { color:var(--selection-red); }
.card-save[data-save][aria-pressed="true"] svg, .text-link[data-save][aria-pressed="true"] svg { fill:currentColor; }
.product-card-media::before {
 content:""; position:absolute; inset:0; border:1px solid transparent;
 z-index:1; pointer-events:none; transition:border-color .25s ease;
}
.product-card:has(> .card-save[aria-pressed="true"]) .product-card-media::before { border-color:var(--selection-red); }
@media (prefers-color-scheme: dark) {
 /* Published editor surfaces have explicit white backgrounds: pair these page-level surfaces with the theme. */
 [data-page="prodotti"], .catalog-section { background:var(--paper) !important; color:var(--ink); }
 .product-isolated .card-image, .product-detail-media { background:#dcdcdc; }
 .led-experience { background:#dedede; }
 .led-demo:not(.is-on) { background:#dedede; color:#303030; }
 .led-demo:not(.is-on) .led-fixture { background:#909090; }
 .led-demo:not(.is-on) .led-toolbar .eyebrow { color:#555; }
 .led-demo:not(.is-on) .led-note { color:#5c5c5c; }
}
@media (prefers-reduced-motion: reduce) { .product-card-media::before { transition:none; } }

/* v42: neutral dark surfaces with a visible hierarchy, from canvas to raised panels. */
@media (prefers-color-scheme: dark) {
 :root {
  --surface-base:#191919;
  --surface-recessed:#151515;
  --surface-section:#242424;
  --surface-panel:#303030;
  --surface-raised:#393939;
  --surface-divider:#ffffff18;
  --intro-surface:linear-gradient(125deg,#303030,#252525 72%);
 }
 #page-home .intro { background:var(--surface-panel); border-bottom:1px solid var(--surface-divider); }
 #page-home .gallery-section { background:var(--surface-base); }
 .split:not(.dark) .split-copy,
 #page-home .split:not(.dark) .split-copy { background:linear-gradient(135deg,#373737,#2d2d2d); }
 .split.dark .split-copy { background:linear-gradient(135deg,#252525,#1c1c1c); }
 .method { background:var(--surface-base); }
 .form-section,.faq-section { background:var(--surface-panel); border-block:1px solid var(--surface-divider); }
 #page-home .journal,[data-page="notizie"] .journal { background:var(--surface-section); }
 .callout { background:linear-gradient(115deg,#3d3d3d,#303030); border-block-color:#ffffff20; }
 .footer { background:var(--surface-recessed); border-top:1px solid var(--surface-divider); }
 .client-shell { background:var(--surface-panel); border-color:#ffffff25; }
 .catalog-card,.catalog-grid>.catalog-card:only-child { background:var(--surface-panel); border-color:#ffffff20; }
 .catalog-cover { background:radial-gradient(ellipse at 40% 25%,#414141,#303030 80%); }
 .location-card { background:linear-gradient(125deg,#3b3b3b,#2c2c2c); border-color:#ffffff25; }
 dialog,#contact-dialog,#search-dialog,.product-model-dialog { background:var(--surface-panel); border-color:#ffffff25; }
 #contact-dialog .dialog-top,#search-dialog .dialog-top { background:var(--surface-panel); }
 #contact-dialog .contact-heading,#contact-dialog .project-form { background:transparent; }
 #search-dialog .search-input { background:var(--surface-recessed); border-color:#777; }
 #search-dialog .search-result { background:var(--surface-raised); border-color:#ffffff20; }
 #search-dialog .search-result:hover,#search-dialog .search-result:focus-visible { background:#444; border-color:#999; }
 #menu-dialog,#menu-dialog .dialog-top { background:#222; }
 .header.solid { --solid-glass:rgba(43,43,43,.94); }
}
@media (prefers-reduced-transparency:reduce) and (prefers-color-scheme:dark) {
 .header.solid { --solid-glass:#2b2b2b; }
}

.footer-languages {display:flex;flex-wrap:wrap;gap:24px;padding:22px 0 0;font-size:13px;color:inherit}


/* Shared interaction feedback: gentle zoom only, with no hover frames. */
:root { --interaction-ease: cubic-bezier(.22,1,.36,1); }
/* Inline text links need a transformable box; component layouts keep priority. */
:where(html:not(.cc-editor-motion-off) a[href], html:not(.cc-editor-motion-off) [role="link"]) {
  display: inline-block;
}
html:not(.cc-editor-motion-off) :where(
  a[href], button, summary, select, textarea, input:not([type="hidden"]),
  [role="button"], [role="link"], [role="tab"]
):not(:disabled):not([aria-disabled="true"]):not([inert], [inert] *) {
  transition: color .28s ease, background-color .28s ease,
    border-color .28s ease, box-shadow .32s ease,
    transform .35s var(--interaction-ease), scale .35s var(--interaction-ease);
}
/* Independent scale preserves saved image crop, flip and rotation. */
html:not(.cc-editor-motion-off) :where(a[href], button, [role="button"]) > img {
  transition: scale .65s var(--interaction-ease);
}
.journal-card, #menu-dialog .menu-project { overflow: hidden; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html:not(.cc-editor-motion-off) :where(
    a[href], button, summary, select, [role="button"], [role="link"], [role="tab"],
    input[type="button"], input[type="submit"], input[type="reset"],
    input[type="checkbox"], input[type="radio"]
  ):not(:has(> img)):not(:disabled):not([aria-disabled="true"]):not([inert], [inert] *):hover {
    scale: var(--control-hover-scale, 1.025);
  }
  /* Image links zoom their photograph rather than the whole card and caption. */
  html:not(.cc-editor-motion-off) :where(a[href], button, [role="button"]):not(:disabled):not([aria-disabled="true"]):not([inert], [inert] *):hover > img {
    scale: 1.025;
  }
}
/* Keep the site's existing keyboard focus indicators, without adding mouse rings. */
@media (prefers-reduced-motion: no-preference) {
  html:not(.cc-editor-motion-off) :where(a[href], button, [role="button"]):not(:disabled):not([aria-disabled="true"]):not([inert], [inert] *):focus-visible > img {
    scale: 1.025;
  }
  /* Touch gets a brief press response, without a sticky hover state. */
  html:not(.cc-editor-motion-off) :where(
    a[href], button, summary, [role="button"], [role="link"], [role="tab"],
    input[type="button"], input[type="submit"], input[type="reset"]
  ):not(:has(> img)):not(:disabled):not([aria-disabled="true"]):not([inert], [inert] *):active {
    scale: var(--control-press-scale, .98);
  }
}

/* Large hero lettering needs a much smaller response than compact controls. */
.hero-title-link {
  --control-hover-scale: 1.012;
  --control-press-scale: .997;
}

/* Open text actions: keep labels and keyboard focus, without a tile. */
:is(.button, .led-experience .led-start,
  .catalog-grid > .catalog-card:only-child .catalog-actions .text-link:first-child,
  .product-model-button) {
  background: transparent !important;
  color: inherit !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  font-weight: 600;
}
:is(.button, .led-experience .led-start,
  .catalog-grid > .catalog-card:only-child .catalog-actions .text-link:first-child) {
  padding-inline: 0 !important;
}

/* Existing render files already have alpha: let the page show through. */
.product-isolated .card-image,
.product-detail-media {
  background: transparent;
}
.product-detail-media { color: inherit; --muted: inherit; }
.product-original-photo { color: inherit; }
.product-isolated > .card-save {
  background: transparent;
  color: inherit;
  border: 0;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* Brand marks share a row while retaining generous, named touch targets. */
.social-links { display: flex; flex-wrap: wrap; gap: 12px; }
.footer-socials { margin-left: -8px; }
.social-links .social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-height: 44px;
  color: #f4f4f4;
  font-size: 0;
}
.social-links .social-link svg {
  width: 26px;
  height: 26px;
  fill: currentColor;
  stroke: none;
  flex: none;
}
.social-links .social-link:hover { text-decoration: none; }

/* Social links stay with the navigation on desktop and in the mobile flow. */
#menu-dialog .menu-navigation { grid-column: 1; grid-row: 1 / span 2; min-width: 0; }
#menu-dialog .menu-socials { margin: 28px 0 0 12px; }

/* Compact header symbols need a more perceptible response than large text. */
.header .tools .icon-btn {
  --control-hover-scale: 1.12;
  --control-press-scale: .96;
  background: transparent !important;
}

/* Catalogue: a clear photograph, a freestanding cover and one primary action. */
[data-page="cataloghi"] .catalog-intro {
  background: #222 !important;
  color: #f5f5f5;
  padding-block: 140px 52px;
  min-height: 350px;
}
[data-page="cataloghi"] .catalog-intro-photo { width: 52%; opacity: .95; }
[data-page="cataloghi"] .catalog-intro::after {
  background: linear-gradient(90deg,#222 38%,#222222e6 51%,#22222200 78%);
}
[data-page="cataloghi"] .catalog-intro h1 { margin-block: 22px; }
[data-page="cataloghi"] .catalog-intro > p { max-width: 48%; color: #d7d7d7; }
[data-page="cataloghi"] .catalog-section { padding-block: clamp(36px,5vw,72px) 64px; }
#catalog-grid > .catalog-card:only-child {
  grid-template-columns: minmax(0,.95fr) minmax(0,1fr);
  gap: clamp(32px,6vw,96px);
  background: transparent;
  border: 0;
  box-shadow: none;
}
#catalog-grid .catalog-cover { background: #e5e5e5; }
#catalog-grid > .catalog-card:only-child .catalog-cover {
  height: clamp(420px,43vw,580px);
  min-height: 0;
  padding: clamp(28px,3vw,48px);
}
#catalog-grid > .catalog-card:only-child .catalog-cover img { max-width: 370px; max-height: 500px; }
#catalog-grid > .catalog-card:only-child .catalog-copy { padding: 24px 0; }
#catalog-grid > .catalog-card:only-child h2 {
  max-width: 16ch;
  margin-block: 22px;
  font-size: clamp(32px,3.8vw,56px);
  line-height: 1.12;
  text-wrap: balance;
}
#catalog-grid .catalog-copy .eyebrow { color: var(--muted); letter-spacing: .2em; }
#catalog-grid .catalog-copy .quiet { color: var(--muted); font-size: 14px; }
#catalog-grid .catalog-actions {
  align-items: flex-start;
  flex-direction: column;
  gap: 18px;
  margin-top: clamp(28px,3.5vw,48px);
}
#catalog-grid .catalog-actions .catalog-read {
  justify-content: space-between;
  gap: 28px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 14px 0;
  font-size: clamp(22px,2.1vw,30px);
  line-height: 1.35;
  font-weight: 500;
  border-bottom: 0 !important;
  transform-origin: left center;
}
#catalog-grid .catalog-actions .catalog-download {
  gap: 14px;
  min-height: 44px;
  margin: 0;
  padding: 10px 0;
  border: 0;
  color: var(--muted);
  font-size: 14px;
}
#catalog-grid .catalog-actions :is(a > span, svg) { display: inline-flex; flex-shrink: 0; }
#catalog-grid .catalog-download svg { width: 18px; height: 18px; }
@media (prefers-color-scheme: dark) {
  #catalog-grid .catalog-cover { background: #303030; }
}
@media (max-width: 700px) {
  [data-page="cataloghi"] .catalog-intro { padding-block: 118px 36px; min-height: 310px; }
  [data-page="cataloghi"] .catalog-intro-photo { width: 100%; opacity: .55; }
  [data-page="cataloghi"] .catalog-intro::after { background: linear-gradient(90deg,#222222f2,#22222266); }
  [data-page="cataloghi"] .catalog-intro > p { max-width: 100%; }
  #catalog-grid > .catalog-card:only-child { grid-template-columns: minmax(0,1fr); gap: 28px; }
  #catalog-grid > .catalog-card:only-child .catalog-cover { height: 390px; padding: 28px; }
  #catalog-grid > .catalog-card:only-child .catalog-cover img { max-height: 334px; }
  #catalog-grid > .catalog-card:only-child .catalog-copy { padding: 0; }
  #catalog-grid .catalog-actions { margin-top: 24px; }
}

/* Text carries the action; retain the shared zoom, native links and keyboard focus. */
.text-link, .hero-link { font-weight: 600; }

/* Plain labels, independent hero links and readable text actions. */
.interface-label, .article-back, .footer h3 {
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: normal;
  text-transform: none;
  font-weight: 500;
}
.hero-title-link { display: block; width: fit-content; max-width: 100%; }
.hero-center > a { flex-shrink: 0; }
.text-link, .hero-link, .button { --control-hover-scale: 1.045; }
.text-link, .button { transform-origin: left center; }
.hero-link { transform-origin: center; }
.hero-title-link, .hero-link, .wide-story .text-link,
.wide-story .text-link:hover, .wide-story .text-link:focus-visible {
  color: #fff;
}
.wide-story .text-link { text-shadow: 0 1px 12px #0009; }
.wide-story { overflow: hidden; }
.wide-story > img { transition: scale .65s var(--interaction-ease); }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html:not(.cc-editor-motion-off) .wide-story:has(.text-link:hover) > img { scale: 1.025; }
}
@media (prefers-reduced-motion: no-preference) {
  html:not(.cc-editor-motion-off) .wide-story:has(.text-link:focus-visible) > img { scale: 1.025; }
}

/* Remove text underlines; section dividers and field/focus outlines remain structural. */
.text-link, .hero-link, .filter, .led-temperatures button,
.client-shell .client-tabs .text-link, #nav-dropdown-links :is(a, button) {
  border-bottom: 0 !important;
}
.nav a::after { display: none; }
.nav a.active, .filter.active, .led-temperatures button[aria-pressed="true"],
.client-shell .client-tabs [aria-current="page"] {
  color: var(--selection-red);
  font-weight: 600;
}

/* Rebalance the content after removing decorative overlines. */
.intro { grid-template-columns: minmax(0, 1fr); }
.intro > div { max-width: 1000px; }
.split-copy > h2:first-child, .form-section h2:first-child,
.wide-story .content > h2:first-child, .location-intro h1:first-child,
.location-card h2:first-child, .detail-copy h2:first-child, .led-copy h2:first-child,
[data-page="cataloghi"] .catalog-intro h1,
#catalog-grid .catalog-copy > h2:first-child { margin-top: 0; }
.journal-card > img + h3 { margin-top: 22px; }
.catalog-document { justify-content: center; }
.led-toolbar { justify-content: flex-end; }
.callout > .button {
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.35;
  max-width: 44%;
  text-align: right;
  transform-origin: right center;
}
@media (max-width: 700px) {
  .callout > .button { max-width: 100%; text-align: left; transform-origin: left center; }
}

/* Text actions stay prominent without a button surface or an underline. */
.page :is(.text-link, .button, .hero-link) {
  font-size: clamp(16px, 1.1vw, 18px);
  font-weight: 600;
  line-height: 1.45;
}

/* Keep each tool's icon and label together instead of spreading across the panel. */
#menu-dialog .menu-tools { gap: 12px; }
#menu-dialog .menu-tools > .interface-label {
  margin: 0 0 6px;
  color: #bdbdbd;
  font-size: 16px;
}
#menu-dialog .menu-tools .text-link {
  display: inline-flex;
  justify-content: flex-start;
  gap: 16px;
  width: fit-content;
  max-width: 100%;
  min-height: 56px;
  margin: 0;
  padding: 10px 0;
  color: #f5f5f5;
  font-size: clamp(18px, 1.25vw, 20px);
  font-weight: 600;
  line-height: 1.4;
  text-align: left;
}
#menu-dialog .menu-tools .text-link > svg {
  order: -1;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  transform: none;
}

/* Brand-led enquiry form and a distinct acknowledgement after a confirmed send. */
#contact-dialog .dialog-top { justify-content: flex-end; }
#contact-dialog .contact-logo {
  display: block;
  width: min(320px, 100%);
  height: auto;
  object-fit: contain;
  object-position: left center;
  margin: 12px 0 0;
}
@media (prefers-color-scheme: dark) {
  #contact-dialog .contact-logo { filter: brightness(0) invert(1); }
}
#contact-success-dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100svh - 32px);
  color: var(--ink);
  background: var(--paper);
  overflow-y: auto;
}
#contact-success-dialog .dialog-top {
  justify-content: flex-end;
  border: 0;
  padding: 16px 20px 0;
}
#contact-success-dialog .dialog-body { padding: 12px clamp(24px, 5vw, 48px) 40px; }
#contact-success-title { font-size: clamp(34px, 5vw, 44px); font-weight: 400; margin: 0 0 24px; }
#contact-success-message { font-size: 19px; line-height: 1.5; }
#contact-success-followup { margin-top: 14px; color: var(--muted); font-size: 16px; }
#contact-success-dialog .button { margin-top: 30px; font-size: 16px; }
@media (max-width: 700px) {
  #contact-dialog .contact-logo { width: min(220px, 100%); }
}

/* Product detail URLs reuse the catalogue detail design and original imagery. */
.product-page { padding: calc(var(--header-height, 100px) + 48px) var(--gutter, 5vw) 80px; }
.product-page > .text-link { margin-bottom: 32px; }
.product-page .detail-layout { max-width: 1500px; margin-inline: auto; }
.product-page h1 { font-size: clamp(2rem, 4.5vw, 4.5rem); line-height: 1.12; font-weight: 400; }
@media(max-width:700px) { .product-page { padding-top: 130px; } }