/* ========================================
   HEIMDALL STARTER
   MAIN CSS
   Castelmonte Stufe
   ======================================== */

body {
  background: var(--nero);
  color: var(--grigio-chiaro);
}

/* ========================================
   GLOBAL TYPOGRAPHY
======================================== */

body {
	background: var(--color-background);
	color: var(--color-text);
	font-family: var(--font-primary);
	font-size: var(--font-size-base);
	font-weight: var(--font-weight-light);
	line-height: var(--line-height-body);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	font-family: var(--font-heading);
	font-weight: var(--font-weight-bold);
	line-height: var(--line-height-heading);
	color: var(--color-heading);
}

h1 {
	font-size: var(--heading-1-size);
	font-weight: var(--font-weight-black);
	line-height: 0.95;
}

h2 {
	font-size: var(--heading-2-size);
}

h3 {
	font-size: var(--heading-3-size);
}

h4 {
	font-size: var(--heading-4-size);
}

h5 {
	font-size: var(--heading-5-size);
}

h6 {
	font-size: var(--heading-6-size);
}

p {
	margin-bottom: 1rem;
	color: inherit;
}

strong {
	font-weight: var(--font-weight-bold);
}

em {
	font-style: italic;
}

/* HERO */
.hero {
  position: relative;
  height: 100vh;
  min-height: 700px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 0 4rem;
  overflow: hidden;
}
.hero-bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(
      ellipse 60% 80% at 75% 50%,
      rgba(200, 104, 26, 0.18) 0%,
      transparent 60%
    ),
    linear-gradient(135deg, #0d0c0b 0%, #1a1510 60%, #1f1208 100%);
}
.flame-orb {
  position: absolute;
  right: 20%;
  top: 50%;
  transform: translateY(-50%);
  width: 400px;
  height: 500px;
  background: radial-gradient(
    ellipse,
    rgba(200, 104, 26, 0.22) 0%,
    rgba(232, 160, 64, 0.08) 40%,
    transparent 70%
  );
  border-radius: 50% 50% 40% 40%;
  animation: flicker 3s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes flicker {
  0% {
    opacity: 0.7;
    transform: translateY(-50%) scale(1);
  }
  50% {
    opacity: 1;
    transform: translateY(-52%) scale(1.04);
  }
  100% {
    opacity: 0.8;
    transform: translateY(-48%) scale(0.97);
  }
}
.hero-eyebrow {
  font-size: 0.65rem;
  letter-spacing: 0.35em;
  color: var(--ambra);
  text-transform: uppercase;
  margin-bottom: 1.2rem;
  opacity: 0;
  animation: fadeUp 0.8s 0.3s ease forwards;
}
.hero-title {
  font-family: "Playfair Display", serif;
  font-weight: 900;
  font-size: clamp(3.5rem, 7vw, 7rem);
  line-height: 0.95;
  color: var(--bianco);
  margin-bottom: 1.8rem;
  max-width: 700px;
  opacity: 0;
  animation: fadeUp 0.9s 0.5s ease forwards;
}
.hero-title em {
  font-style: italic;
  color: var(--fiamma);
}
.hero-subtitle {
  font-family: "Inter", sans-serif;
  font-size: 1.25rem;
  font-weight: 300;
  color: var(--grigio-chiaro);
  max-width: 480px;
  line-height: 1.7;
  margin-bottom: 3rem;
  opacity: 0;
  animation: fadeUp 0.9s 0.7s ease forwards;
}
.hero-actions {
  display: flex;
  gap: 1.2rem;
  opacity: 0;
  animation: fadeUp 0.9s 0.9s ease forwards;
}
.btn-primary {
  background: var(--fiamma);
  color: var(--bianco);
  padding: 1rem 2.4rem;
  text-decoration: none;
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-family: "Inter", sans-serif;
  font-weight: 500;
  transition: background 0.3s, transform 0.2s;
}
.btn-primary:hover {
  background: var(--ambra);
  transform: translateY(-2px);
}
.btn-outline {
  border: 1px solid rgba(245, 240, 232, 0.3);
  color: var(--grigio-40);
  padding: 1rem 2.4rem;
  text-decoration: none;
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  transition: border-color 0.3s, color 0.3s;
}
.btn-outline:hover {
  border-color: var(--ambra);
  color: var(--ambra);
}
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.scroll-hint {
  position: absolute;
  bottom: 2.5rem;
  left: 4rem;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 0.6rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  opacity: 0;
  animation: fadeUp 1s 1.2s ease forwards;
}
.scroll-line {
  width: 40px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--fiamma));
  animation: scrollLine 2s ease-in-out infinite;
}
@keyframes scrollLine {
  0%,
  100% {
    width: 40px;
    opacity: 0.5;
  }
  50% {
    width: 70px;
    opacity: 1;
  }
}

/* Hero product image */
.hero-product-img {
  position: absolute;
  right: 6%;
  bottom: 0;
  height: 85vh;
  max-height: 720px;
  object-fit: contain;
  object-position: bottom;
  opacity: 0;
  animation: fadeUp 1.2s 0.6s ease forwards;
  filter: drop-shadow(0 0 60px rgba(200, 104, 26, 0.25));
  pointer-events: none;
}

/* TAGLINE BAR */
.tagline-bar {
  background: var(--grafite);
  border-top: 1px solid rgba(200, 104, 26, 0.3);
  border-bottom: 1px solid rgba(200, 104, 26, 0.3);
  padding: 1.2rem 0;
  overflow: hidden;
}
.tagline-scroll {
  display: flex;
  gap: 4rem;
  animation: scrollLeft 20s linear infinite;
  white-space: nowrap;
}
@keyframes scrollLeft {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
.tagline-item {
  font-size: 0.65rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  display: flex;
  align-items: center;
  gap: 1rem;
}
.tagline-item .dot {
  color: var(--fiamma);
}

/* SECTION BASE */
section {
  padding: 8rem 4rem;
}
.section-label {
  font-size: 0.6rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 1rem;
}
.section-title {
  font-family: "Playfair Display", serif;
  font-weight: 700;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.1;
  color: var(--bianco);
  margin-bottom: 1.5rem;
}
.section-title em {
  font-style: italic;
  color: var(--ambra);
}
.section-text {
  font-family: "Inter", sans-serif;
  font-size: 1.15rem;
  line-height: 1.85;
  color: var(--grigio-chiaro);
  max-width: 520px;
}

/* ABOUT */
.about {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: center;
  background: var(--carbone);
}
.about-visual {
  position: relative;
  height: 520px;
}
@media (max-width:420px) {
  .about-visual {height:550px;}
}
.about-card {
  position: absolute;
  background: var(--grafite);
  border: 1px solid rgba(200, 104, 26, 0.2);
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.about-card:nth-child(1) {
  top: 0;
  left: 0;
  width: 70%;
  height: 58%;
}
.about-card:nth-child(2) {
  bottom: 0;
  right: 0;
  width: 60%;
  height: 48%;
}
@media (max-width:1024px) {
  .about-card:nth-child(2) {width:70%;height:50%;}
}
.card-num {
  font-family: "Playfair Display", serif;
  font-size: 3rem;
  font-weight: 900;
  color: var(--fiamma);
  line-height: 1;
}
.card-label {
  font-size: 0.65rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
}
.card-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 1rem;
  color: var(--grigio-40);
  margin-top: 0.5rem;
  line-height: 1.6;
}
.about-content {
  padding-right: 2rem;
}
.about-content .section-text {
  margin-bottom: 2.5rem;
}
.about-features {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 1.5rem;
}
.feature-item {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.feature-dot {
  width: 6px;
  height: 6px;
  background: var(--fiamma);
  border-radius: 50%;
  margin-top: 0.45rem;
  flex-shrink: 0;
}
.feature-text {
  font-size: 0.85rem;
  color: var(--grigio-chiaro);
  line-height: 1.6;
}

/* PRODOTTI */
.prodotti {
  background: var(--nero);
}
.prodotti-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 4rem;
}
.prodotti-tabs {
  display: flex;
  gap: 0;
  border: 1px solid rgba(200, 104, 26, 0.3);
}
.tab-btn {
  padding: 0.7rem 1.8rem;
  font-size: 0.65rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  background: transparent;
  color: var(--grigio-chiaro);
  border: none;
  cursor: pointer;
  transition: all 0.3s;
  font-family: "Inter", sans-serif;
}
.tab-btn.active,
.tab-btn:hover {
  background: var(--fiamma);
  color: var(--bianco);
}
.tab-btn:not(:last-child) {
  border-right: 1px solid rgba(200, 104, 26, 0.3);
}

/* Product cards with real photos */
.tab-content {
  display: none;
}
.tab-content.active {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
}

.product-card {
  background: var(--carbone);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: background 0.3s;
  display: flex;
  flex-direction: column;
}
.product-card::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--fiamma), transparent);
  transform: scaleX(0);
  transition: transform 0.4s;
  z-index: 2;
}
.product-card:hover::before {
  transform: scaleX(1);
}
.product-card:hover {
  background: var(--grafite);
}

/* Photo gallery per card */
.product-photo-wrap {
  position: relative;
  width: 100%;
  padding-top: 100%;
  overflow: hidden;
  background: #111;
}
.product-photo-wrap img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  transition: opacity 0.4s ease;
  padding: 1rem;
}
.product-photo-wrap img.hidden {
  opacity: 0;
  pointer-events: none;
}
.product-photo-wrap img.active {
  opacity: 1;
}

/* Finitura switcher dots */
.finish-dots {
  position: absolute;
  bottom: 0.8rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.5rem;
  z-index: 3;
}
.fdot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: transparent;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.fdot.active {
  background: var(--fiamma);
  border-color: var(--fiamma);
}

/* Card text area */
.product-info {
  padding: 2rem 2rem 2.2rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.product-model {
  font-size: 0.58rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.4rem;
}
.product-name {
  font-family: "Playfair Display", serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--bianco);
  margin-bottom: 0.4rem;
}
.product-tagline {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 0.95rem;
  color: var(--grigio-chiaro);
  margin-bottom: 1.5rem;
  line-height: 1.5;
}
.product-specs {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  flex: 1;
}
.spec-row {
  display: flex;
  justify-content: space-between;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.spec-key {
  color: var(--grigio-chiaro);
}
.spec-val {
  color: var(--grigio-40);
  font-weight: 500;
}
.product-badge {
  display: inline-block;
  font-size: 0.55rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 0.3rem 0.8rem;
  border: 1px solid var(--oro);
  color: var(--oro);
  align-self: flex-start;
  margin-top: auto;
}

/* GALLERIA modelli: vista a schermo intero per ogni variante */
.gallery-section {
  background: var(--carbone);
  padding: 6rem 4rem;
}
.gallery-title {
  text-align: center;
  margin-bottom: 4rem;
}
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
}
.gallery-item {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  background: #111;
}
.gallery-item img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: contain;
  object-position: center bottom;
  transition: transform 0.5s ease, filter 0.5s;
  filter: brightness(0.85);
  padding: 1rem;
}
.gallery-item:hover img {
  transform: scale(1.04);
  filter: brightness(1);
}
.gallery-item-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.92));
  padding: 2rem 1.2rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.gi-model {
  font-size: 0.55rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--fiamma);
}
.gi-name {
  font-family: "Playfair Display", serif;
  font-size: 1.1rem;
  color: var(--bianco);
}
.gi-finish {
  font-size: 0.65rem;
  color: var(--grigio-chiaro);
  letter-spacing: 0.1em;
}

/* PERSONALIZZAZIONE */
.personaliz {
  background: var(--carbone);
  display: grid;
  grid-template-columns: 5fr 4fr;
  gap: 5rem;
  align-items: center;
}
.ceramica-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
}
.ceramica-cell {
  aspect-ratio: 1;
  position: relative;
  overflow: hidden;
  background: #111;
}
.ceramica-cell img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  transition: transform 0.4s;
  padding: 0.5rem;
}
.ceramica-cell:hover img {
  transform: scale(1.06);
}
.ceramica-cell .label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(13, 12, 11, 0.82);
  font-size: 0.55rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.4rem 0.5rem;
  color: var(--grigio-chiaro);
  text-align: center;
}
.personaliz-content .section-text {
  margin-bottom: 2rem;
}
.finish-list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  margin-top: 1.5rem;
}
.finish-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.8rem;
  color: var(--grigio-chiaro);
  letter-spacing: 0.05em;
}
.finish-item .fbar {
  width: 28px;
  height: 2px;
  background: var(--fiamma);
  flex-shrink: 0;
}

/* TECNOLOGIA */
.tecnologia {
  background: var(--nero);
  text-align: center;
}
.tech-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin-top: 4rem;
}
.tech-card {
  background: var(--carbone);
  padding: 3rem 2rem;
  position: relative;
  overflow: hidden;
}
.tech-card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--fiamma);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s;
}
.tech-card:hover::after {
  transform: scaleX(1);
}
.tech-icon {
  font-size: 2rem;
  margin-bottom: 1.2rem;
}
.tech-title {
  font-family: "Playfair Display", serif;
  font-size: 1.1rem;
  color: var(--bianco);
  margin-bottom: 0.8rem;
}
.tech-desc {
  font-size: 0.8rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
}

/* MODELLI TABLE */
.modelli {
  background: var(--carbone);
}
.modelli-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 3rem;
  font-size: 0.8rem;
}
.modelli-table th {
  text-align: left;
  font-size: 0.6rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--fiamma);
  padding: 1rem 1.2rem;
  border-bottom: 1px solid rgba(200, 104, 26, 0.3);
  font-weight: 400;
}
.modelli-table td {
  padding: 1.2rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  color: var(--grigio-chiaro);
  vertical-align: middle;
}
.modelli-table tr:hover td {
  background: rgba(200, 104, 26, 0.05);
  color: var(--crema);
}
.modelli-table .model-name-cell {
  font-family: "Playfair Display", serif;
  font-size: 1.1rem;
  color: var(--bianco);
  font-weight: 700;
}
.tipo-badge {
  display: inline-block;
  font-size: 0.55rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 0.25rem 0.7rem;
  border-radius: 20px;
}
.tipo-pellet {
  border: 1px solid var(--fiamma);
  color: var(--fiamma);
}
.tipo-legna {
  border: 1px solid var(--ambra);
  color: var(--ambra);
}
.td-thumb {
  width: 60px;
  height: 70px;
  object-fit: contain;
  object-position: center bottom;
}

/* CTA */
.cta-section {
  background: linear-gradient(135deg, #1a1510 0%, #0d0c0b 100%);
  text-align: center;
  padding: 8rem 4rem;
  position: relative;
  overflow: hidden;
}
.cta-section::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 400px;
  background: radial-gradient(
    ellipse,
    rgba(200, 104, 26, 0.15) 0%,
    transparent 70%
  );
  pointer-events: none;
}
.cta-section .section-title {
  max-width: 600px;
  margin: 1.2rem auto 1.5rem;
}
.cta-section .section-text {
  margin: 0 auto 3rem;
  text-align: center;
}
.cta-buttons {
  display: flex;
  gap: 1.2rem;
  justify-content: center;
}

/* CONTATTI */
.contatti {
  background: var(--grafite);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: start;
  padding: 7rem 4rem;
}
.contatti-info p {
  font-size: 0.88rem;
  color: var(--grigio-chiaro);
  line-height: 1.9;
  margin-top: 1.5rem;
}
.contatti-info a {
  color: var(--ambra);
  text-decoration: none;
}
.form-group {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.form-group input,
.form-group textarea {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--crema);
  padding: 1rem 1.2rem;
  font-family: "Inter", sans-serif;
  font-size: 0.82rem;
  letter-spacing: 0.05em;
  outline: none;
  transition: border-color 0.3s;
  resize: none;
  width: 100%;
}
.form-group input:focus,
.form-group textarea:focus {
  border-color: var(--fiamma);
}
.form-group input::placeholder,
.form-group textarea::placeholder {
  color: rgba(154, 149, 144, 0.6);
}
.form-submit {
  background: var(--fiamma);
  color: var(--bianco);
  border: none;
  padding: 1.1rem 2.8rem;
  font-family: "Inter", sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.3s;
  align-self: flex-start;
  margin-top: 0.5rem;
}
.form-submit:hover {
  background: var(--ambra);
}

/* FOOTER */
footer {
  background: var(--nero);
  border-top: 1px solid rgba(200, 104, 26, 0.2);
  padding: 3rem 4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer-brand {
  font-family: "Playfair Display", serif;
  font-weight: 900;
  font-size: 1.1rem;
  letter-spacing: 0.2em;
  color: var(--crema);
}
.footer-copy {
  font-size: 0.65rem;
  color: var(--grigio-chiaro);
  letter-spacing: 0.1em;
}
.footer-links {
  display: flex;
  gap: 2rem;
  list-style: none;
}
.footer-links a {
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  color: var(--grigio-chiaro);
  text-decoration: none;
  text-transform: uppercase;
  transition: color 0.3s;
}
.footer-links a:hover {
  color: var(--ambra);
}

/* RESPONSIVE */
@media (max-width: 900px) {
  section,
  .contatti,
  .gallery-section {
    padding: 5rem 1.5rem;
  }
  .hero {
    padding: 0 1.5rem;
  }
  .about,
  .personaliz,
  .contatti {
    grid-template-columns: 1fr;
    gap: 3rem;
  }
  .tab-content.active,
  .tech-grid {
    grid-template-columns: 1fr 1fr;
  }
  .gallery-grid {
    grid-template-columns: 1fr 1fr;
  }
  .prodotti-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
  }
  footer {
    flex-direction: column;
    gap: 1.5rem;
    text-align: center;
  }
  .cta-buttons {
    flex-direction: column;
    align-items: center;
  }
  .form-row {
    grid-template-columns: 1fr;
  }
  .hero-product-img {
    height: 55vh;
    right: -5%;
    opacity: 0.5;
  }
  .scroll-hint {
    display: none;
  }
}
@media (max-width: 600px) {
  .tab-content.active,
  .tech-grid,
  .gallery-grid,
  .ceramica-grid {
    grid-template-columns: 1fr;
  }
}

/* ─── GAMMA PRODOTTI ─── */
.gamma {
  background: var(--nero);
  padding: 0 4rem 6rem;
}
.gamma-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
}
.gamma-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  background: var(--carbone);
  border: 1px solid rgba(200, 104, 26, 0.12);
  transition: border-color 0.4s;
}
.gamma-card:hover {
  border-color: rgba(200, 104, 26, 0.5);
}
.gamma-photo-wrap {
  position: relative;
  width: 100%;
  padding-top: 85%;
  overflow: hidden;
  background: #0f0e0c;
}
.gamma-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  padding: 1.5rem 2rem 0;
  transition: transform 0.6s ease, filter 0.4s;
  filter: brightness(0.9);
}
.gamma-card:hover .gamma-photo {
  transform: scale(1.05) translateY(-8px);
  filter: brightness(1.05);
}
.gamma-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50%;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.85));
  pointer-events: none;
}
.gamma-content {
  padding: 1.8rem 2.2rem 2.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  border-top: 1px solid rgba(200, 104, 26, 0.15);
  background: var(--carbone);
}
.gamma-label {
  font-size: 0.6rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--fiamma);
}
.gamma-title {
  font-family: "Playfair Display", serif;
  font-size: 2.4rem;
  font-weight: 900;
  color: var(--bianco);
  line-height: 1;
  margin-bottom: 0.3rem;
}
.gamma-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 1rem;
  color: var(--grigio-chiaro);
  line-height: 1.6;
  margin-bottom: 1rem;
}
.gamma-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bianco);
  border: 1px solid rgba(200, 104, 26, 0.4);
  padding: 0.7rem 1.4rem;
  width: fit-content;
  transition: background 0.3s, border-color 0.3s, color 0.3s;
}
.gamma-card:hover .gamma-cta {
  background: var(--fiamma);
  border-color: var(--fiamma);
  color: var(--bianco);
}
.gamma-arrow {
  transition: transform 0.3s;
}
.gamma-card:hover .gamma-arrow {
  transform: translateX(4px);
}
@media (max-width: 900px) {
  .gamma {
    padding: 0 1.5rem 4rem;
  }
  .gamma-grid {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

.gamma-photo-wrap--inserti {
  padding-top: 85%;
  background: #0a0a08;
}
.gamma-photo--inserti {
  object-fit: cover;
  object-position: center center;
  padding: 0;
  filter: brightness(0.85);
}
.gamma-card--inserti:hover .gamma-photo--inserti {
  transform: scale(1.04);
  filter: brightness(0.95);
}

/* ─── CERAMICHE VIETRI ─── */
.ceramiche {
  background: var(--nero);
  padding: 8rem 4rem;
}
.ceramiche-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: end;
  margin-bottom: 5rem;
}
.ceramiche-intro-text .section-text {
  margin-bottom: 0;
}
.ceramiche-intro-quote {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  line-height: 1.4;
  color: var(--bianco);
  border-left: 2px solid var(--fiamma);
  padding-left: 2rem;
}
.ceramiche-intro-quote span {
  color: var(--fiamma);
}

/* Showcase centrale: foto grande + crop dettaglio */
.ceramiche-showcase {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 3px;
  margin-bottom: 3px;
}
.ceramiche-main-img {
  position: relative;
  overflow: hidden;
  background: #0f0e0c;
}
.ceramiche-main-img img {
  width: 100%;
  /*height: 560px;*/
  object-fit: cover;
  object-position: center center;
  transition: transform 0.6s ease;
}
.ceramiche-main-img:hover img {
  transform: scale(1.03);
}
.ceramiche-main-label {
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
  background: rgba(13, 12, 11, 0.88);
  border-left: 2px solid var(--fiamma);
  padding: 0.8rem 1.2rem;
}
.cml-name {
  font-family: "Playfair Display", serif;
  font-size: 1.2rem;
  color: var(--bianco);
  font-weight: 700;
}
.cml-desc {
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-top: 0.2rem;
}

.ceramiche-showcase-side {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.ceramiche-showcase-side-item {
	flex: 1;
	min-height: 0;
}

/* Finiture grid: 5 card */
.finiture-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 3px;
  margin-top: 3px;
}
.finitura-card {
  position: relative;
  overflow: hidden;
  background: #0f0e0c;
  cursor: pointer;
}
.finitura-card img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
  object-position: center;
  transition: transform 0.5s ease, filter 0.4s;
  filter: brightness(0.75);
}
.finitura-card:hover img {
  transform: scale(1.06);
  filter: brightness(1);
}
.finitura-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem 1rem 1rem;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.9));
  text-align: center;
}
.fl-num {
  font-size: 0.5rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.2rem;
}
.fl-name {
  font-family: "Playfair Display", serif;
  font-size: 0.95rem;
  color: var(--bianco);
  font-weight: 700;
  line-height: 1.2;
}
.fl-sub {
  font-size: 0.6rem;
  color: var(--grigio-chiaro);
  margin-top: 0.2rem;
  letter-spacing: 0.08em;
}

/* Dimensioni ceramiche card */
.dim-section {
  margin-top: 4rem;
  background: var(--carbone);
  padding: 3rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.dim-title {
  font-family: "Playfair Display", serif;
  font-size: 1.4rem;
  color: var(--bianco);
  margin-bottom: 1.5rem;
}
.dim-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}
.dim-table th {
  text-align: left;
  font-size: 0.58rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--fiamma);
  padding: 0.6rem 0.8rem;
  border-bottom: 1px solid rgba(200, 104, 26, 0.3);
  font-weight: 400;
}
.dim-table td {
  padding: 0.7rem 0.8rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  color: var(--grigio-chiaro);
}
.dim-table tr:hover td {
  color: var(--grigio-40);
}
.dim-table td:first-child {
  color: var(--grigio-40);
  font-weight: 500;
}
.dim-note {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.05rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}
.dim-note strong {
  color: var(--grigio-40);
}

@media (max-width:1024px) {
  .dim-section {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .ceramiche {
    padding: 5rem 1.5rem;
    padding-top:8rem;
  }
  .ceramiche-intro {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .ceramiche-showcase {
    grid-template-columns: 1fr;
  }
  .finiture-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2px;
  }
  .dim-section {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2rem 1rem;
  }
}
@media (max-width: 600px) {
  .finiture-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* ─── LIMITED EDITION ─── */
.limited {
  background: var(--nero);
  padding: 8rem 4rem;
  position: relative;
  overflow: hidden;
}
/* Background texture dorata */
.limited::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
      ellipse 80% 60% at 50% 0%,
      rgba(212, 170, 90, 0.06) 0%,
      transparent 60%
    ),
    radial-gradient(
      ellipse 40% 30% at 80% 80%,
      rgba(200, 104, 26, 0.05) 0%,
      transparent 50%
    );
  pointer-events: none;
}
.limited-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 5rem;
  position: relative;
}

@media (max-width:820px) {
  .limited-header {padding-top:100px;}
}

@media (max-width:767px) {
  .limited-header {padding-top:60px;}
}
.limited-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.6rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: var(--oro);
  margin-bottom: 1.2rem;
}
.limited-eyebrow::before,
.limited-eyebrow::after {
  content: "";
  width: 40px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--oro));
}
.limited-eyebrow::after {
  transform: scaleX(-1);
}
.limited-header .section-title {
  color: var(--bianco);
  margin-bottom: 1rem;
}
.limited-header .section-title em {
  color: var(--oro);
}
.limited-header p {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.1rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}

/* Cards LE */
.le-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  position: relative;
}
.le-card {
  background: var(--carbone);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(212, 170, 90, 0.15);
  transition: border-color 0.4s;
}
.le-card:hover {
  border-color: rgba(212, 170, 90, 0.5);
}

/* Badge LE */
.le-badge {
  position: absolute;
  top: 1.2rem;
  left: 1.2rem;
  z-index: 10;
  background: var(--oro);
  color: var(--nero);
  font-size: 0.5rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  padding: 0.35rem 0.9rem;
  font-weight: 600;
  font-family: "Inter", sans-serif;
}
.le-numero {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  z-index: 10;
  font-family: "Playfair Display", serif;
  font-size: 0.7rem;
  color: rgba(212, 170, 90, 0.7);
  letter-spacing: 0.1em;
  background: rgba(13, 12, 11, 0.7);
  padding: 0.3rem 0.7rem;
  border: 1px solid rgba(212, 170, 90, 0.3);
}

/* Foto prodotto */
.le-photo {
  position: relative;
  width: 100%;
  padding-top: 110%;
  overflow: hidden;
  background: #0c0b0a;
}
.le-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  padding: 1rem 1.5rem 0;
  transition: transform 0.7s ease, filter 0.4s;
  filter: brightness(0.9);
}
.le-card:hover .le-photo img {
  transform: scale(1.04) translateY(-6px);
  filter: brightness(1.05);
}

/* Dettaglio ceramica — strip in basso */
.le-ceramic-strip {
  width: 100%;
  height: 90px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}
.le-ceramic-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  transition: transform 0.6s ease;
  filter: brightness(0.8) saturate(1.1);
}
.le-card:hover .le-ceramic-strip img {
  transform: scale(1.05);
  filter: brightness(1) saturate(1.2);
}
.le-ceramic-strip::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(13, 12, 11, 0.4),
    transparent,
    rgba(13, 12, 11, 0.4)
  );
}

/* Info card */
.le-info {
  padding: 1.8rem 2rem 2.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  border-top: 1px solid rgba(212, 170, 90, 0.2);
  flex: 1;
}
.le-collezione {
  font-size: 0.55rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--oro);
}
.le-name {
  font-family: "Playfair Display", serif;
  font-size: 1.6rem;
  font-weight: 900;
  color: var(--bianco);
  line-height: 1.05;
  margin-bottom: 0.2rem;
}
.le-ceramic-name {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 1rem;
  color: var(--oro);
  margin-bottom: 0.8rem;
}
.le-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 0.95rem;
  color: var(--grigio-chiaro);
  line-height: 1.65;
  margin-bottom: 1.2rem;
}
.le-specs {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid rgba(212, 170, 90, 0.15);
}
.le-spec {
  display: flex;
  justify-content: space-between;
  font-size: 0.7rem;
  letter-spacing: 0.04em;
}
.le-spec-k {
  color: var(--grigio-chiaro);
}
.le-spec-v {
  color: var(--grigio-40);
  font-weight: 500;
}
.le-spec-v.gold {
  color: var(--oro);
}

/* CTA card */
.le-cta-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: auto;
}
.le-btn {
  flex: 1;
  background: transparent;
  border: 1px solid var(--oro);
  color: var(--oro);
  padding: 0.85rem 1rem;
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-family: "Inter", sans-serif;
  cursor: pointer;
  transition: background 0.3s, color 0.3s;
  text-align: center;
  text-decoration: none;
  display: block;
}
.le-btn:hover {
  background: var(--oro);
  color: var(--nero);
}
.le-availability {
  font-size: 0.6rem;
  color: var(--grigio-chiaro);
  letter-spacing: 0.08em;
  white-space: nowrap;
}
.le-availability .dot-avail {
  display: inline-block;
  width: 5px;
  height: 5px;
  background: #6db97a;
  border-radius: 50%;
  margin-right: 0.4rem;
  animation: pulse-avail 2s ease-in-out infinite;
}
@keyframes pulse-avail {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
}

/* Strip inferiore */
.le-footer-strip {
  margin-top: 4rem;
  border: 1px solid rgba(212, 170, 90, 0.2);
  padding: 2.5rem 3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 3rem;
  background: rgba(212, 170, 90, 0.03);
  position: relative;
}
.le-footer-strip::before {
  content: "✦";
  position: absolute;
  top: -0.7rem;
  left: 50%;
  transform: translateX(-50%);
  background: var(--nero);
  color: var(--oro);
  padding: 0 1rem;
  font-size: 0.8rem;
}
.lfs-text {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.05rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
  max-width: 520px;
}
.lfs-text strong {
  color: var(--grigio-40);
}
.lfs-cta {
  flex-shrink: 0;
  background: var(--oro);
  color: var(--nero);
  padding: 1rem 2.4rem;
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.3s, transform 0.2s;
  white-space: nowrap;
}
.lfs-cta:hover {
  background: var(--ambra);
  transform: translateY(-2px);
}

@media (max-width: 1024px) {
  .le-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}

@media (max-width: 900px) {
  .limited {
    padding: 5rem 1.5rem;
  }
  .le-grid {
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .le-footer-strip {
    flex-direction: column;
    text-align: center;
  }
}

/* ─── SEZIONE VIETRI ─── */
.vietri-section {
  background: var(--carbone);
  overflow: hidden;
}

.vietri-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 80vh;
}
.vietri-hero-left {
  background: var(--nero);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 5rem 4rem;
  position: relative;
  overflow: hidden;
}
.vietri-hero-left::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 80% 60% at 20% 30%,
    rgba(200, 104, 26, 0.08) 0%,
    transparent 60%
  );
  pointer-events: none;
}
.vietri-big-title {
  font-family: "Playfair Display", serif;
  font-weight: 900;
  font-size: clamp(3rem, 5.5vw, 6rem);
  line-height: 0.92;
  color: var(--bianco);
  margin-bottom: 2rem;
  position: relative;
}
.vietri-big-title .vbt-di {
  font-size: 0.38em;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  font-family: "Inter", sans-serif;
  font-weight: 300;
  display: block;
  margin-bottom: 0.4rem;
}
.vietri-big-title .vbt-vietri {
  display: block;
}
.vietri-big-title .vbt-sul {
  font-size: 0.55em;
  font-style: italic;
  font-weight: 400;
  color: var(--fiamma);
  display: block;
  margin-top: 0.1rem;
}
.vietri-hero-desc {
  font-family: "Inter", sans-serif;
  font-size: 1.1rem;
  color: var(--grigio-chiaro);
  line-height: 1.85;
  max-width: 420px;
  position: relative;
}
.vietri-hero-right {
  position: relative;
  overflow: hidden;
}
.vietri-hero-right img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  filter: brightness(0.9);
  transition: transform 8s ease;
  padding: 2rem 1.5rem 0;
}
.vietri-hero-right:hover img {
  transform: scale(1.03) translateY(-10px);
}
.vietri-hero-right::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    var(--nero) 0%,
    transparent 20%,
    transparent 80%,
    var(--carbone) 100%
  );
  pointer-events: none;
}

.vietri-storia {
  padding: 7rem 4rem;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 6rem;
  align-items: start;
  background: var(--nero);
}
.vietri-storia-lead {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.1rem, 2vw, 1.6rem);
  font-style: italic;
  color: var(--bianco);
  line-height: 1.5;
  margin-bottom: 2rem;
  padding-left: 1.5rem;
  border-left: 2px solid var(--fiamma);
}
.vietri-storia-body {
  font-family: "Inter", sans-serif;
  font-size: 1.08rem;
  color: var(--grigio-chiaro);
  line-height: 1.9;
}
.vietri-storia-body p + p {
  margin-top: 1.2rem;
}
.vietri-storia-body strong {
  color: var(--grigio-40);
  font-weight: 600;
}
.riggiole-word {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 1.25em;
  color: var(--fiamma);
}
.vietri-pilastri {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.pilastro {
  padding: 1.8rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
}
.pilastro:first-child {
  padding-top: 0;
}
.pilastro-num {
  font-family: "Playfair Display", serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--fiamma);
  opacity: 0.3;
  line-height: 1;
  flex-shrink: 0;
  width: 2rem;
}
.pilastro-title {
  font-family: "Playfair Display", serif;
  font-size: 1.05rem;
  color: var(--bianco);
  margin-bottom: 0.4rem;
}
.pilastro-text {
  font-size: 0.8rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
}

.vietri-materici {
  padding: 7rem 4rem;
  background: var(--carbone);
}
.vietri-materici-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 5rem;
}
.vietri-materici-header p {
  font-family: "Inter", sans-serif;
  font-size: 1.1rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}
.materici-grid {
  display: grid;
  grid-template-columns: 1fr 2px 1fr;
  gap: 0;
  align-items: stretch;
  margin-bottom: 4rem;
  background: var(--grafite);
}
.materici-sep {
  background: linear-gradient(
    180deg,
    transparent,
    var(--fiamma) 50%,
    transparent
  );
  opacity: 0.4;
}
.materici-col {
  padding: 3rem 4rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.mc-icon {
  font-size: 1.8rem;
  color: var(--bianco);
}
.mc-subtitle {
  font-size: 0.58rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--fiamma);
}
.mc-title {
  font-family: "Playfair Display", serif;
  font-size: 1.5rem;
  color: var(--bianco);
  font-weight: 700;
}
.mc-body {
  font-family: "Inter", sans-serif;
  font-size: 1.02rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}
.mc-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.mc-tag {
  font-size: 0.58rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.3rem 0.8rem;
  border: 1px solid rgba(200, 104, 26, 0.3);
  color: var(--grigio-chiaro);
}

.vietri-prodotti {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
}
.vietri-prod-item {
  position: relative;
  overflow: hidden;
  background: #0c0b0a;
}
.vietri-prod-item img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: contain;
  object-position: center bottom;
  padding: 1.5rem;
  transition: transform 0.7s ease, filter 0.4s;
  filter: brightness(0.85);
}
.vietri-prod-item:hover img {
  transform: scale(1.04) translateY(-8px);
  filter: brightness(1);
}
.vietri-prod-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 3rem 1.5rem 1.5rem;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.92));
}
.vpl-model {
  font-size: 0.55rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.3rem;
}
.vpl-name {
  font-family: "Playfair Display", serif;
  font-size: 1.3rem;
  color: var(--bianco);
  font-weight: 700;
}
.vpl-finish {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 0.88rem;
  color: var(--grigio-chiaro);
  margin-top: 0.2rem;
}

.vietri-quote {
  background: var(--nero);
  padding: 7rem 4rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.vietri-quote::before {
  content: '"';
  position: absolute;
  top: -4rem;
  left: 50%;
  transform: translateX(-50%);
  font-family: "Playfair Display", serif;
  font-size: 20rem;
  color: rgba(200, 104, 26, 0.04);
  line-height: 1;
  pointer-events: none;
}
.vietri-quote-text {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: clamp(1.3rem, 2.8vw, 2rem);
  color: var(--bianco);
  max-width: 820px;
  margin: 0 auto 1.5rem;
  line-height: 1.55;
  position: relative;
}
.vietri-quote-text em {
  color: var(--fiamma);
  font-style: normal;
}
.vietri-quote-attr {
  font-size: 0.62rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  position: relative;
}
.vietri-quote-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin-top: 2.5rem;
  border: 1px solid rgba(200, 104, 26, 0.3);
  padding: 0.8rem 2rem;
  font-size: 0.62rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--fiamma);
  position: relative;
}
.vietri-quote-badge::before {
  content: "✦";
}

@media (max-width: 900px) {
  .vietri-hero {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .vietri-hero-left {
    padding: 4rem 2rem;
  }
  .vietri-hero-right {
    height: 55vw;
    min-height: 260px;
  }
  .vietri-storia {
    grid-template-columns: 1fr;
    gap: 3rem;
    padding: 5rem 1.5rem;
  }
  .vietri-materici {
    padding: 5rem 1.5rem;
  }
  .materici-grid {
    grid-template-columns: 1fr;
  }
  .materici-sep {
    display: none;
  }
  .materici-col {
    padding: 2rem 1rem;
  }
  .vietri-prodotti {
    grid-template-columns: 1fr 1fr;
  }
  .vietri-quote {
    padding: 5rem 2rem;
  }
}
@media (max-width: 600px) {
  .vietri-prodotti {
    grid-template-columns: 1fr;
  }
}

/* ─── TECNOLOGIA REINGEGNERIZZATA ─── */
.tech2 {
  background: var(--nero);
  padding: 8rem 4rem;
  overflow: hidden;
  position: relative;
}
.tech2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(
    ellipse 60% 40% at 80% 20%,
    rgba(200, 104, 26, 0.05) 0%,
    transparent 60%
  );
  pointer-events: none;
}
.tech2-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: end;
  margin-bottom: 6rem;
}
.tech2-intro-right {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: clamp(1.2rem, 2.2vw, 1.7rem);
  color: var(--bianco);
  line-height: 1.5;
  border-left: 2px solid var(--fiamma);
  padding-left: 2rem;
}
.tech2-intro-right span {
  color: var(--fiamma);
  font-style: normal;
}

/* Timeline ingegneristica */
.tech2-timeline {
  display: grid;
  grid-template-columns: 1fr 80px 1fr;
  gap: 0;
  margin-bottom: 6rem;
  position: relative;
}
.tech2-col-left,
.tech2-col-right {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tech2-col-right {
  margin-top: 4rem;
}
.tech2-spine {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 2rem;
  position: relative;
}
.tech2-spine::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(
    180deg,
    transparent,
    var(--fiamma) 20%,
    var(--fiamma) 80%,
    transparent
  );
  opacity: 0.4;
}
.tech2-spine-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--fiamma);
  flex-shrink: 0;
  margin: 2rem 0;
  position: relative;
  z-index: 1;
  box-shadow: 0 0 12px rgba(200, 104, 26, 0.5);
}

.tech2-card {
  background: var(--carbone);
  padding: 2.2rem 2.5rem;
  border: 1px solid rgba(200, 104, 26, 0.1);
  position: relative;
  transition: border-color 0.3s, background 0.3s;
}
.tech2-card:hover {
  border-color: rgba(200, 104, 26, 0.4);
  background: var(--grafite);
}
.tech2-card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--fiamma);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s;
}
.tech2-card:hover::after {
  transform: scaleX(1);
}
.tc2-num {
  font-family: "Playfair Display", serif;
  font-size: 0.65rem;
  letter-spacing: 0.3em;
  color: var(--fiamma);
  opacity: 0.6;
  margin-bottom: 0.5rem;
}
.tc2-title {
  font-family: "Playfair Display", serif;
  font-size: 1.2rem;
  color: var(--bianco);
  font-weight: 700;
  margin-bottom: 0.6rem;
  line-height: 1.2;
}
.tc2-body {
  font-size: 0.82rem;
  color: var(--grigio-chiaro);
  line-height: 1.75;
  letter-spacing: 0.02em;
}
.tc2-tag {
  display: inline-block;
  margin-top: 1rem;
  font-size: 0.55rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 0.25rem 0.7rem;
  border: 1px solid rgba(200, 104, 26, 0.3);
  color: var(--fiamma);
}

/* Foto prodotto + dati tecnici */
.tech2-showcase {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2px;
  margin-bottom: 4rem;
}
.tech2-photo-card {
  position: relative;
  overflow: hidden;
  background: #0c0b0a;
}
.tech2-photo-card img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: contain;
  object-position: center bottom;
  padding: 1rem;
  filter: brightness(0.8);
  transition: transform 0.6s, filter 0.4s;
}
.tech2-photo-card:hover img {
  transform: scale(1.04);
  filter: brightness(1);
}
.tech2-photo-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2.5rem 1.2rem 1.2rem;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.93));
}
.tpl-model {
  font-size: 0.55rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.3rem;
}
.tpl-stat {
  font-family: "Playfair Display", serif;
  font-size: 1.4rem;
  color: var(--bianco);
  font-weight: 900;
}
.tpl-desc {
  font-size: 0.7rem;
  color: var(--grigio-chiaro);
  margin-top: 0.2rem;
}

/* Strip certificazioni */
.tech2-certif {
  display: flex;
  gap: 2px;
}
.tech2-cert-item {
  flex: 1;
  background: var(--grafite);
  padding: 1.8rem 2rem;
  display: flex;
  align-items: center;
  gap: 1.2rem;
  border: 1px solid rgba(255, 255, 255, 0.05);
  transition: border-color 0.3s;
}
.tech2-cert-item:hover {
  border-color: rgba(200, 104, 26, 0.3);
}
.cert-icon {
  font-size: 1.4rem;
  flex-shrink: 0;
}
.cert-name {
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  color: var(--crema);
  font-weight: 500;
}
.cert-desc {
  font-size: 0.65rem;
  color: var(--grigio-chiaro);
  margin-top: 0.2rem;
}

/* ─── COLLEZIONI CERAMICHE ─── */
.collezioni {
  background: var(--carbone);
  padding: 8rem 4rem;
}
.collezioni-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: end;
  margin-bottom: 5rem;
}
.collezioni-header-right {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.1rem;
  color: var(--grigio-chiaro);
  line-height: 1.85;
}

/* Cards collezione */
.coll-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3px;
  margin-bottom: 3px;
}
.coll-card {
  background: var(--nero);
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.04);
  transition: border-color 0.4s;
  cursor: pointer;
}
.coll-card:hover {
  border-color: rgba(200, 104, 26, 0.35);
}

/* Colore accent per ogni collezione */
#ville-antiche {
  --coll-color: #b8956a;
}
#artemisia {
  --coll-color: #6a9e6a;
}
#monolite {
  --coll-color: #8a8a8a;
}
#nuovo-cerreto {
  --coll-color: #c8a060;
}

.coll-photo {
  position: relative;
  overflow: hidden;
}
.coll-photo-prod {
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: contain;
  object-position: center bottom;
  padding: 1rem 0.5rem 0;
  filter: brightness(0.8);
  transition: transform 0.6s, filter 0.4s;
  display: block;
}
.coll-card:hover .coll-photo-prod {
  transform: scale(1.04) translateY(-6px);
  filter: brightness(1);
}

/* Crop ceramica in overlay basso */
.coll-ceramic-strip {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100px;
  overflow: hidden;
}
.coll-ceramic-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  filter: brightness(0.7) saturate(1.2);
  transition: transform 0.5s;
}
.coll-card:hover .coll-ceramic-strip img {
  transform: scale(1.06);
  filter: brightness(0.9) saturate(1.3);
}
.coll-ceramic-strip::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 40px;
  background: linear-gradient(rgba(13, 12, 11, 0.9), transparent);
  z-index: 1;
}
.coll-ceramic-label {
  position: absolute;
  bottom: 0.6rem;
  left: 0.8rem;
  font-size: 0.52rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  z-index: 2;
}

.coll-info {
  padding: 2.5rem 2.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.5rem;
  border-left: 2px solid var(--coll-color, var(--fiamma));
  position: relative;
}
.coll-number {
  font-family: "Playfair Display", serif;
  font-size: 4rem;
  font-weight: 900;
  color: var(--coll-color, var(--fiamma));
  opacity: 0.12;
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  line-height: 1;
}
.coll-label {
  font-size: 0.55rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--coll-color, var(--fiamma));
}
.coll-name {
  font-family: "Playfair Display", serif;
  font-size: 1.6rem;
  font-weight: 900;
  color: var(--bianco);
  line-height: 1.05;
  margin-bottom: 0.2rem;
}
.coll-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 0.95rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
  margin-bottom: 1rem;
}
.coll-models {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 1rem;
}
.coll-model-tag {
  font-size: 0.55rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.25rem 0.6rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--grigio-chiaro);
}
.coll-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--coll-color, var(--fiamma));
  text-decoration: none;
  transition: gap 0.3s;
  margin-top: auto;
}
.coll-card:hover .coll-cta {
  gap: 0.9rem;
}

/* Card personalizzazione esclusiva */
.coll-bespoke {
  background: var(--grafite);
  padding: 4rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
  border: 1px solid rgba(212, 170, 90, 0.2);
  position: relative;
  overflow: hidden;
}
.coll-bespoke::before {
  content: "✦";
  position: absolute;
  right: 3rem;
  top: 2rem;
  font-size: 4rem;
  color: rgba(212, 170, 90, 0.06);
}
.bespoke-label {
  font-size: 0.58rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--oro);
  margin-bottom: 0.8rem;
}
.bespoke-title {
  font-family: "Playfair Display", serif;
  font-size: 1.8rem;
  font-weight: 900;
  color: var(--bianco);
  line-height: 1.1;
  margin-bottom: 1rem;
}
.bespoke-title em {
  font-style: italic;
  color: var(--oro);
}
.bespoke-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.05rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}
.bespoke-steps {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.bespoke-step {
  display: flex;
  gap: 1.2rem;
  align-items: flex-start;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.bs-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--oro);
  color: var(--oro);
  font-size: 0.65rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: "Playfair Display", serif;
  font-weight: 700;
}
.bs-text {
  font-size: 0.82rem;
  color: var(--grigio-chiaro);
  line-height: 1.6;
}
.bs-text strong {
  color: var(--grigio-40);
  font-weight: 500;
}
.bespoke-cta {
  display: inline-block;
  background: var(--oro);
  color: var(--nero);
  padding: 1rem 2.4rem;
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  text-decoration: none;
  margin-top: 2rem;
  transition: background 0.3s, transform 0.2s;
}
.bespoke-cta:hover {
  background: var(--ambra);
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .tech2 {
    padding: 5rem 1.5rem;
  }
  .tech2-intro {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .tech2-timeline {
    grid-template-columns: 1fr;
  }
  .tech2-spine {
    display: none;
  }
  .tech2-col-right {
    margin-top: 0;
  }
  .tech2-showcase {
    grid-template-columns: 1fr 1fr;
  }
  .tech2-certif {
    flex-wrap: wrap;
  }
  .collezioni {
    padding: 5rem 1.5rem;
  }
  .collezioni-header {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .coll-grid {
    grid-template-columns: 1fr;
  }
  .coll-card {
    grid-template-columns: 1fr;
  }
  .coll-photo-prod {
    min-height: 240px;
  }
  .coll-bespoke {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2.5rem;
  }
}

/* ─── TECNOLOGIA V2 ─── */
.tech3 {
  background: var(--nero);
  padding: 0;
}

@media(max-width:900px) {
  .tech3 {
    padding-top:4rem;
  }
}

/* Hero intro tecnologia */
.tech3-hero {
  padding: 8rem 4rem 5rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.tech3-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 60% 80% at 80% 50%,
    rgba(200, 104, 26, 0.07) 0%,
    transparent 60%
  );
  pointer-events: none;
}
.tech3-hero-quote {
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: clamp(1.2rem, 2.2vw, 1.7rem);
  color: var(--bianco);
  line-height: 1.5;
  border-left: 2px solid var(--fiamma);
  padding-left: 2rem;
}
.tech3-hero-quote em {
  color: var(--fiamma);
  font-style: normal;
}

/* Grid tecnologie: layout alternato sx/dx */
.tech3-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 420px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.tech3-block:nth-child(even) {
  direction: rtl;
}
.tech3-block:nth-child(even) > * {
  direction: ltr;
}

.tech3-visual {
  background: var(--carbone);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem;
  position: relative;
  overflow: hidden;
}
.tech3-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 70% 70% at 50% 50%,
    rgba(200, 104, 26, 0.06) 0%,
    transparent 70%
  );
  pointer-events: none;
}
.tech3-visual svg {
  position: relative;
  z-index: 1;
}

/* Grande numero decorativo sfondo */
.tech3-visual-num {
  position: absolute;
  font-family: "Playfair Display", serif;
  font-size: 14rem;
  font-weight: 900;
  color: rgba(200, 104, 26, 0.04);
  line-height: 1;
  right: 1rem;
  bottom: -2rem;
  user-select: none;
  pointer-events: none;
}

.tech3-content {
  background: var(--grafite);
  padding: 4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.6rem;
  position: relative;
  overflow: hidden;
}
.tech3-keyword {
  font-size: 0.55rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.4rem;
}
.tech3-name {
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 900;
  color: var(--bianco);
  line-height: 1;
  margin-bottom: 0.6rem;
}
.tech3-name em {
  font-style: italic;
  color: var(--fiamma);
}
.tech3-body {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.05rem;
  color: var(--grigio-chiaro);
  line-height: 1.85;
  margin-bottom: 1.2rem;
}
.tech3-specs {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.tech3-spec {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 0.75rem;
  color: var(--grigio-chiaro);
  letter-spacing: 0.04em;
}
.tech3-spec::before {
  content: "";
  width: 20px;
  height: 1px;
  background: var(--fiamma);
  flex-shrink: 0;
}

/* Strip certificazioni finale */
.tech3-certif {
  padding: 4rem 4rem;
  background: var(--carbone);
  border-top: 1px solid rgba(200, 104, 26, 0.2);
}
.tech3-certif-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin-top: 2.5rem;
}
.tech3-cert-card {
  background: var(--grafite);
  padding: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.04);
  transition: border-color 0.3s;
}
.tech3-cert-card:hover {
  border-color: rgba(200, 104, 26, 0.3);
}
.tc3-cert-icon {
  font-size: 1.5rem;
  margin-bottom: 0.8rem;
}
.tc3-cert-name {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  color: var(--grigio-40);
  font-weight: 500;
  margin-bottom: 0.4rem;
}
.tc3-cert-desc {
  font-size: 0.72rem;
  color: var(--grigio-chiaro);
  line-height: 1.6;
}

@media (max-width: 900px) {
  .tech3-hero {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 5rem 1.5rem 3rem;
  }
  .tech3-block {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .tech3-block:nth-child(even) {
    direction: ltr;
  }
  .tech3-visual {
    min-height: 280px;
  }
  .tech3-content {
    padding: 3rem 1.5rem;
  }
  .tech3-certif {
    padding: 3rem 1.5rem;
  }
  .tech3-certif-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* ─── TECH BLOCK GALLERIA FOTO ─── */
.tech3-photo-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  width: 100%;
  position: relative;
  z-index: 1;
}
.tech3-photo-cell {
  position: relative;
  overflow: hidden;
  background: #0a0908;
  aspect-ratio: 3/4;
}
.tech3-photo-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: brightness(0.82) saturate(0.9);
  transition: transform 0.6s ease, filter 0.4s;
}
.tech3-photo-cell:hover img {
  transform: scale(1.05);
  filter: brightness(1) saturate(1.1);
}
/* Prima foto più grande (2 righe) */
.tech3-photo-cell.main {
  grid-row: 1 / 3;
  aspect-ratio: auto;
}
.tech3-photo-cell.main img {
  height: 100%;
}
/* Label foto */
.tech3-photo-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem 1rem 0.8rem;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.88));
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
}
.tech3-photo-label strong {
  display: block;
  color: var(--fiamma);
  margin-bottom: 0.1rem;
  font-weight: 500;
}

.tech3-photo-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  width: 100%;
  position: relative;
  z-index: 1;
  height: 100%;
  min-height: 420px;
}
.tech3-photo-cell {
  position: relative;
  overflow: hidden;
  background: #0a0908;
}
.tech3-photo-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: brightness(0.82) saturate(0.85);
  transition: transform 0.6s ease, filter 0.4s;
  display: block;
}
.tech3-photo-cell:hover img {
  transform: scale(1.05);
  filter: brightness(1) saturate(1);
}
.tech3-photo-cell.main {
  grid-row: 1 / 3;
}
.tech3-photo-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem 1rem 0.8rem;
  background: linear-gradient(transparent, rgba(13, 12, 11, 0.9));
  font-size: 0.58rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  line-height: 1.5;
}
.tech3-photo-label strong {
  display: block;
  color: var(--fiamma);
  margin-bottom: 0.1rem;
  font-size: 0.65rem;
}

/* ─── STORIA ─── */
.storia {
  background: var(--nero);
  padding: 8rem 4rem;
  overflow: hidden;
  position: relative;
}
.storia::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 50% 60% at 90% 30%,
    rgba(200, 104, 26, 0.06) 0%,
    transparent 60%
  );
  pointer-events: none;
}
.storia-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: center;
  margin-bottom: 6rem;
}
.storia-lead {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.3rem, 2.5vw, 2rem);
  font-weight: 400;
  font-style: italic;
  color: var(--bianco);
  line-height: 1.5;
  border-left: 2px solid var(--fiamma);
  padding-left: 2rem;
}
.storia-lead em {
  color: var(--fiamma);
  font-style: normal;
}
.storia-body {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.1rem;
  color: var(--grigio-chiaro);
  line-height: 1.9;
}
.storia-body p + p {
  margin-top: 1.2rem;
}
.storia-body strong {
  color: var(--grigio-40);
}

/* Timeline storia */
.storia-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin-bottom: 5rem;
}
.storia-era {
  background: var(--carbone);
  padding: 2.5rem 2rem;
  border: 1px solid rgba(255, 255, 255, 0.04);
  position: relative;
  overflow: hidden;
  transition: border-color 0.3s;
}
.storia-era:hover {
  border-color: rgba(200, 104, 26, 0.3);
}
.storia-era::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--fiamma);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s;
}
.storia-era:hover::before {
  transform: scaleX(1);
}
.era-anno {
  font-family: "Playfair Display", serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--fiamma);
  line-height: 1;
  margin-bottom: 0.5rem;
  opacity: 0.8;
}
.era-titolo {
  font-family: "Playfair Display", serif;
  font-size: 1rem;
  color: var(--bianco);
  margin-bottom: 0.6rem;
}
.era-testo {
  font-size: 0.78rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
}

/* Archivio disegni */
.storia-archivio {
  background: var(--grafite);
  padding: 4rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
  border: 1px solid rgba(200, 104, 26, 0.15);
  position: relative;
  overflow: hidden;
}
.storia-archivio::after {
  content: "✦";
  position: absolute;
  right: 3rem;
  top: 2rem;
  font-size: 5rem;
  color: rgba(200, 104, 26, 0.05);
  pointer-events: none;
}
.archivio-label {
  font-size: 0.58rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.8rem;
}
.archivio-title {
  font-family: "Playfair Display", serif;
  font-size: 1.8rem;
  font-weight: 900;
  color: var(--bianco);
  line-height: 1.1;
  margin-bottom: 1rem;
}
.archivio-title em {
  font-style: italic;
  color: var(--ambra);
}
.archivio-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.05rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}
/* Visualizzazione grafica 2 armadi */
.archivio-visual {
  display: flex;
  gap: 2rem;
  justify-content: center;
  align-items: flex-end;
}
.armadio {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
}
.armadio-box {
  width: 90px;
  background: var(--carbone);
  border: 1px solid rgba(200, 104, 26, 0.3);
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem 0.5rem;
  gap: 4px;
  position: relative;
}
.armadio-box::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 20px;
  background: rgba(200, 104, 26, 0.4);
  border-radius: 1px;
}
.armadio-sheet {
  width: 70px;
  height: 4px;
  background: rgba(245, 240, 232, 0.15);
  border-radius: 1px;
}
.armadio-sheet.highlight {
  background: rgba(200, 104, 26, 0.5);
  height: 5px;
}
.armadio-label {
  font-size: 0.6rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  text-align: center;
}
.archivio-count {
  font-family: "Playfair Display", serif;
  font-size: 3rem;
  font-weight: 900;
  color: var(--fiamma);
  opacity: 0.5;
  line-height: 1;
  text-align: center;
  margin-top: 0.5rem;
}
.archivio-count-label {
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--grigio-chiaro);
  text-align: center;
}

/* ─── TROVA RIVENDITORE ─── */
.rivenditori {
  background: var(--carbone);
  padding: 8rem 4rem;
}
.rivenditori-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: end;
  margin-bottom: 4rem;
}
.rivenditori-header p.section-text {
  max-width: 100%;
}
/* Mappa placeholder interattiva */
.rivenditori-map {
  background: var(--grafite);
  border: 1px solid rgba(200, 104, 26, 0.15);
  height: 420px;
  position: relative;
  overflow: hidden;
  margin-bottom: 3rem;
}
.map-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background: rgba(13, 12, 11, 0.7);
}
.map-icon {
  font-size: 2.5rem;
}
.map-text {
  font-family: "Playfair Display", serif;
  font-size: 1.2rem;
  color: var(--bianco);
  text-align: center;
}
.map-subtext {
  font-size: 0.75rem;
  color: var(--grigio-chiaro);
  letter-spacing: 0.1em;
  text-align: center;
  max-width: 360px;
}
/* SVG mappa italia stilizzata */
.map-svg-bg {
  position: absolute;
  inset: 0;
  opacity: 0.08;
}
/* Grid rivenditori placeholder */
.rivenditori-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin-bottom: 3rem;
}
.rivenditore-card {
  background: var(--grafite);
  padding: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.04);
  transition: border-color 0.3s;
}
.rivenditore-card:hover {
  border-color: rgba(200, 104, 26, 0.3);
}
.rv-regione {
  font-size: 0.55rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.4rem;
}
.rv-nome {
  font-family: "Playfair Display", serif;
  font-size: 1.1rem;
  color: var(--bianco);
  margin-bottom: 0.3rem;
  font-weight: 700;
}
.rv-indirizzo {
  font-size: 0.75rem;
  color: var(--grigio-chiaro);
  line-height: 1.6;
  margin-bottom: 0.8rem;
}
.rv-tel {
  font-size: 0.72rem;
  color: var(--ambra);
  text-decoration: none;
  letter-spacing: 0.05em;
  display:flex;
	align-items:center;
	gap:4px;
}

.rv-tel span {
	transform:translateY(-1px);
}
/* Form diventa rivenditore */
.rivenditori-form-block {
  background: var(--nero);
  padding: 3.5rem 4rem;
  border: 1px solid rgba(200, 104, 26, 0.15);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
}
.rvf-title {
  font-family: "Playfair Display", serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--bianco);
  margin-bottom: 0.8rem;
}
.rvf-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 1rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
}

/* ─── DOWNLOAD ─── */
.download-section {
  background: var(--nero);
  padding: 8rem 4rem;
}
.download-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin-top: 3.5rem;
}
.download-card {
  background: var(--carbone);
  padding: 3rem 2.5rem;
  border: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  transition: border-color 0.3s, background 0.3s;
  cursor: pointer;
  text-decoration: none;
}
.download-card:hover {
  border-color: rgba(200, 104, 26, 0.4);
  background: var(--grafite);
}
.dl-icon {
  font-size: 2rem;
  margin-bottom: 0.5rem;
}
.dl-tipo {
  font-size: 0.55rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--fiamma);
}
.dl-title {
  font-family: "Playfair Display", serif;
  font-size: 1.2rem;
  color: var(--bianco);
  font-weight: 700;
  margin-bottom: 0.3rem;
}
.dl-desc {
  font-size: 0.78rem;
  color: var(--grigio-chiaro);
  line-height: 1.65;
  flex: 1;
}
.dl-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fiamma);
  border: 1px solid rgba(200, 104, 26, 0.3);
  padding: 0.3rem 0.8rem;
  margin-top: 1rem;
  width: fit-content;
  transition: background 0.3s, color 0.3s;
}
.download-card:hover .dl-badge {
  background: var(--fiamma);
  color: var(--bianco);
}

/* ─── ASSISTENZA ─── */
.assistenza {
  background: var(--carbone);
  padding: 8rem 4rem;
}
.assistenza-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: end;
  margin-bottom: 4rem;
}
/* 3 canali assistenza */
.assistenza-canali {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin-bottom: 4rem;
}
.canale-card {
  background: var(--grafite);
  padding: 2.5rem 2rem;
  border: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  transition: border-color 0.3s;
  position: relative;
  overflow: hidden;
}
.canale-card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--fiamma);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s;
}
.canale-card:hover::after {
  transform: scaleX(1);
}
.canale-card:hover {
  border-color: rgba(200, 104, 26, 0.3);
}
.ca-icon {
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
}
.ca-title {
  font-family: "Playfair Display", serif;
  font-size: 1.1rem;
  color: var(--bianco);
  font-weight: 700;
  margin-bottom: 0.3rem;
}
.ca-desc {
  font-size: 0.78rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
  flex: 1;
}
.ca-cta {
  display: inline-block;
  margin-top: 1rem;
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fiamma);
  text-decoration: none;
  transition: gap 0.3s;
}
.ca-cta::after {
  content: " →";
}

/* Form assistenza tecnica */
.assistenza-form-block {
  background: var(--nero);
  padding: 3.5rem 4rem;
  border: 1px solid rgba(200, 104, 26, 0.15);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
}
.af-title {
  font-family: "Playfair Display", serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--bianco);
  margin-bottom: 0.8rem;
}
.af-title em {
  font-style: italic;
  color: var(--ambra);
}
.af-desc {
  font-family: "Cormorant Garamond", serif;
  font-size: 1rem;
  color: var(--grigio-chiaro);
  line-height: 1.8;
  margin-bottom: 1.5rem;
}
.af-features {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.af-feat {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 0.78rem;
  color: var(--grigio-chiaro);
}
.af-feat::before {
  content: "";
  width: 18px;
  height: 1px;
  background: var(--fiamma);
  flex-shrink: 0;
}
select.form-select {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--crema);
  padding: 1rem 1.2rem;
  font-family: "Inter", sans-serif;
  font-size: 0.82rem;
  outline: none;
  transition: border-color 0.3s;
  width: 100%;
  cursor: pointer;
  -webkit-appearance: none;
}
select.form-select:focus {
  border-color: var(--fiamma);
}
select.form-select option {
  background: #1a1815;
}

/* Responsive */
@media (max-width: 900px) {
  .storia,
  .rivenditori,
  .download-section,
  .assistenza {
    padding: 8rem 1.5rem;
  }
  .storia-intro,
  .rivenditori-header,
  .assistenza-intro {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .storia-timeline,
  .rivenditori-grid,
  .download-grid,
  .assistenza-canali {
    grid-template-columns: 1fr 1fr;
    gap: 2px;
  }
  .storia-archivio,
  .rivenditori-form-block,
  .assistenza-form-block {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 2.5rem 1.5rem;
  }
  .archivio-visual {
    justify-content: flex-start;
  }
}
@media (max-width: 600px) {
  .storia-timeline,
  .rivenditori-grid,
  .download-grid,
  .assistenza-canali {
    grid-template-columns: 1fr;
  }
}

/* ─── CENTRI ASSISTENZA ─── */
.centri-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin-bottom: 0;
}
.centro-card {
  background: var(--grafite);
  padding: 2.2rem 2rem;
  border: 1px solid rgba(255, 255, 255, 0.05);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  position: relative;
  transition: border-color 0.3s;
}
.centro-card:hover {
  border-color: rgba(200, 104, 26, 0.4);
}
.centro-card.hidden {
  display: none;
}
.centro-badge {
  font-size: 0.52rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--fiamma);
  margin-bottom: 0.3rem;
  font-family: "Inter", sans-serif;
}
.centro-badge.pending {
  color: var(--grigio-chiaro);
}
.centro-nome {
  font-family: "Playfair Display", serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--bianco);
  line-height: 1.3;
  margin-bottom: 0.2rem;
}
.centro-indirizzo {
  font-size: 0.75rem;
  color: var(--grigio-chiaro);
  line-height: 1.7;
  flex: 1;
}
.centro-contatti {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-top: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.centro-link {
  font-size: 0.68rem;
  color: var(--ambra);
  text-decoration: none;
  transition: color 0.2s;
  letter-spacing: 0.04em;
}
.centro-link:hover {
  color: var(--crema);
}
.centro-regione {
  display: none;
}
.centro-pending {
  opacity: 0.55;
}
.centro-pending:hover {
  opacity: 0.8;
}

.assistenza-diventare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: start;
}

@media (max-width: 900px) {
  .centri-grid {
    grid-template-columns: 1fr 1fr;
  }
  .assistenza-diventare {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
}
@media (max-width: 600px) {
  .centri-grid {
    grid-template-columns: 1fr;
  }
}

/* ─── RICHIAMO COLLEZIONE NELLA CARD PRODOTTO (mockup) ─── */
.product-collezione-badge {
  position: absolute;
  bottom: 0.9rem;
  left: 1rem;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(13, 12, 11, 0.82);
  border: 1px solid rgba(212, 170, 90, 0.4);
  padding: 0.4rem 0.9rem;
  font-size: 0.58rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--crema);
  text-decoration: none;
  transition: background 0.3s, border-color 0.3s, gap 0.3s;
  backdrop-filter: blur(4px);
}
.product-collezione-badge:hover {
  background: rgba(212, 170, 90, 0.15);
  border-color: var(--oro);
  gap: 0.8rem;
}
.product-collezione-badge .pcb-label {
  color: var(--grigio-chiaro);
  font-weight: 300;
}
.product-collezione-badge .pcb-name {
  color: var(--oro);
  font-family: "Playfair Display", serif;
  font-style: italic;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  text-transform: none;
}
.product-collezione-badge .pcb-arrow {
  color: var(--oro);
  transition: transform 0.3s;
}
.product-collezione-badge:hover .pcb-arrow {
  transform: translateX(3px);
}

/* Scroll-margin per navbar fissa su navigazione da ancora */
section[id],
div[id="centri-list"] {
  scroll-margin-top: 90px;
}

/* =========================================================
   CASTELMONTE LUCE
========================================================= */

.luce-coming-soon {
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 8rem 4rem;
  position: relative;
  overflow: hidden;
}

.luce-coming-soon__glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 60% 60% at 50% 40%,
    rgba(212, 170, 90, 0.08) 0%,
    transparent 60%
  );
  pointer-events: none;
}

.luce-coming-soon__content {
  position: relative;
  z-index: 1;
}

.luce-coming-soon__label {
  font-size: 0.65rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: var(--oro);
  margin-bottom: 1.5rem;
}

.luce-coming-soon__title {
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: clamp(3rem, 6vw, 5.5rem);
  line-height: 0.95;
  color: var(--bianco);
  margin-bottom: 1.5rem;
}

.luce-coming-soon__title em {
  font-style: italic;
  color: var(--oro);
}

.luce-coming-soon__text {
  font-family: 'Inter', sans-serif;
  font-size: 1.1rem;
  color: var(--grigio-chiaro);
  max-width: 560px;
  line-height: 1.8;
  margin: 0 auto 3rem;
}

.luce-coming-soon__actions {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 1.2rem;
}

.luce-coming-soon__cta {
  background: var(--oro);
  border: 1px solid var(--oro);
}

.luce-coming-soon__cta:hover {
  background: var(--oro);
  border: 1px solid var(--oro);
}

.luce-coming-soon__dots {
  margin-top: 4rem;
  display: flex;
  justify-content: center;
  gap: 0.6rem;
}

.luce-coming-soon__dots span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(212, 170, 90, 0.3);
}

.luce-coming-soon__dots span.is-active {
  background: var(--oro);
  animation: pulse-avail 2s ease-in-out infinite;
}

@media (max-width: 768px) {
  .luce-coming-soon {
    min-height: 75vh;
    padding: 8rem 1.5rem;
  }

  .luce-coming-soon__actions {
    flex-direction: column;
    align-items: center;
  }

  .luce-coming-soon__actions a {
    width: 100%;
    max-width: 320px;
  }
}

/* =========================================================
   FLUENT FORMS
   ========================================================= */

.fluentform {
  width: 100%;
  accent-color:var(--fiamma)!important;
}

.fluentform form {
  margin: 0;
}

.fluentform fieldset {
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.fluentform .ff-el-group {
  margin-bottom: 1rem;
}

.fluentform .ff-t-container {
  display: flex;
  gap: 1rem;
  margin-bottom: 0;
}

.fluentform .ff-t-cell {
  padding: 0 !important;
}

.fluentform .ff-el-input--label {
  display: none!important;
}

.fluentform .ff-el-form-control {
  min-height: 52px!important;
  background: rgba(255, 255, 255, 0.04)!important;
  border: 1px solid rgba(255, 255, 255, 0.1)!important;
  border-radius: 0!important;
  color: var(--grigio-40)!important;
  padding: 1rem 1.2rem!important;
  font-family: "Inter", sans-serif!important;
  font-size: 0.82rem!important;
  letter-spacing: 0.05em!important;
  outline: none!important;
  transition: border-color 0.3s!important;
  resize: none!important;
  width: 100%!important;
}

.fluentform textarea.ff-el-form-control {
  min-height: 130px!important;
  resize: vertical;
}

.fluentform .ff-el-tc {
  color: rgba(154, 149, 144, 0.6)!important;
  font-family: "Inter", sans-serif!important;
  font-size: 0.82rem!important;
  letter-spacing: 0.05em!important;
}

.fluentform .ff-el-form-control::placeholder {
  color: rgba(154, 149, 144, 0.6)!important;
}

.fluentform .ff-el-form-control:focus {
  border-color: var(--fiamma)!important;
  background: rgba(255, 255, 255, 0.06)!important;
}

.fluentform .ff-el-group:has(textarea),
.fluentform .ff-el-group:has(.ff-el-tc) {
  margin-bottom: 10px!important;
}

.fluentform .ff_submit_btn_wrapper {
  margin-top: 0;
  margin-bottom: 0;
}

.fluentform .ff-btn-submit,
.fluentform .ff-btn-submit:not(.ff_btn_no_style) {
  background-color: var(--fiamma)!important;
  color: var(--bianco)!important;
  border: none!important;
  border-radius: 0;
  font-family: inherit;
  font-size: 0.75rem!important;
  font-weight: 400;
  letter-spacing: 0.12em!important;
  text-transform: uppercase;
  padding: 1.1rem 2.8rem!important;
  cursor: pointer;
  box-shadow: none!important;
  transition: background 0.3s!important;
}

.fluentform .ff-btn-submit:hover,
.fluentform .ff-btn-submit:focus {
  background-color: var(--ambra)!important;
  opacity: 1!important;
}

.fluentform .ff-el-is-error .ff-el-form-control {
  border-color: #c94b3c;
}

.fluentform .ff-el-help-message,
.fluentform .ff-el-is-error .text-danger {
  margin-top: 0.4rem;
  color: #c94b3c;
  font-size: 0.78rem;
}

.fluentform .ff-message-success {
  border: 1px solid rgba(200, 104, 26, 0.28);
  background: rgba(255, 255, 255, 0.035);
  color: var(--bianco);
  padding: 1rem;
  font-size: 0.9rem;
}

/* Mobile */
@media (max-width: 768px) {
  .fluentform .ff-t-container {
    flex-direction: column;
    gap: 0;
  }

  .fluentform .ff-t-cell {
    flex-basis: 100% !important;
    width: 100%;
  }

  .fluentform .ff-btn-submit,
  .fluentform .ff-btn-submit:not(.ff_btn_no_style) {
    width: 100%;
  }
}

/* FOOTER */
/* FOOTER MIDDLE SECTION */
footer.site-footer {
  display: flex;
  flex-direction: column;
}

.site-footer__middle-section {
	width:100%;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	padding-bottom:12px;
	border-bottom:1px solid rgba(255,255,255, .15);
}

.site-footer__logo {
	max-width:250px;
}

.site-footer__logo img {
	width:100%;
}

.site-footer__main-menu ul {
	display:flex;
	gap:1rem;
}

.site-footer__main-menu ul li a {
	color:var(--grigio);
	text-decoration:none;
	font-size:0.85rem;
	transition: color 350ms ease;
}

.site-footer__main-menu ul li a:hover,
.site-footer__main-menu ul li a:active,
.site-footer__main-menu ul li a:focus {
	color:var(--fiamma);
}

@media (max-width:900px) {
	footer {
		padding: 3rem 1.5rem;
	}
}

@media (max-width:821px) {
	.site-footer__middle-section {
		flex-direction:column;
		gap:1rem;
	}
}

@media (max-width:767px) {
	.site-footer__middle-section {
		flex-direction:column;
		align-items:flex-start;
		gap:2rem;
		padding-bottom:2rem;
	}

	.site-footer__main-menu ul {
		flex-direction:column;
		align-items:flex-start;
	}
}

/* FOOTER COPYRIGHT SECTION */
.site-footer__copyright-section {
	width:100%;
	padding-top:24px;
}

.site-footer__legal-menu ul {
	display:flex;
	gap:1rem;
}

.site-footer__legal-menu ul li a {
	color:var(--grigio);
	text-decoration:none;
	font-size:0.85rem;
	transition: color 350ms ease;
}

.site-footer__legal-menu ul li a:hover,
.site-footer__legal-menu ul li a:active,
.site-footer__legal-menu ul li a:focus {
	color:var(--fiamma);
}

.site-footer__copyright p {
	margin-bottom:0;
	font-size:0.85rem;
	line-height:1.5;
	color:var(--grigio);
}

/* FOOTER SOCIAL */
.site-footer__social ul {
	margin-top:12px;
	display:flex;
	gap:6px;
}

.site-footer__social ul li a svg {
	width:28px;
	height:28px;
	transition:all 350ms ease;
}

.site-footer__social ul li a:hover svg,
.site-footer__social ul li a:focus svg {
	fill:var(--ambra);
}

@media (max-width:821px) {
	.site-footer__legal-menu ul,
	.site-footer__social ul {
		justify-content:center;
	}
}

/* TEMPLATE: CONTATTI */
.contatti-info__content-text {
  margin-bottom:0;
}

.contatti-info__content-text strong {
  color:var(--grigio-40);
  letter-spacing:0.05em;
  font-weight:400;
}

.contatti-info__address {
  color:var(--grigio-chiaro);
  font-size:0.88rem;
  font-style:normal;
}

.contatti-info__links-emoji {
  color:var(--grigio-chiaro);
}

/* ==================================================
   SKIP LINK
   ================================================== */

.skip-link {
	position: absolute;
	top: -100px;
	left: 3rem!important;
	z-index: 9999;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.85rem 1rem!important;
	font-size: 0.75rem!important;
	font-weight: 400!important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--crema);
	background: rgba(13, 12, 11, 0.96);
	border: 1px solid var(--fiamma);
	border-radius: 0;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	transition:
		top 0.25s ease,
		background-color 0.25s ease,
		color 0.25s ease;
}

.skip-link:focus,
.skip-link:focus-visible {
	top: 1.5rem;
	outline: 2px solid var(--ambra);
	outline-offset: 4px;
	background: var(--fiamma);
	color: var(--nero);
}

/* ==================================================
   HEADER CASTELMONTE
   ================================================== */

.castelmonte-header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 9999;
	background: linear-gradient(
		180deg,
		rgba(13, 12, 11, 0.95) 0%,
		rgba(13, 12, 11, 0) 100%
	);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.castelmonte-header__container {
	width: 100%;
	padding-inline: 4rem;
}

.castelmonte-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 96px;
	gap: 2rem;
}

/* ==================================================
   BRANDING
   ================================================== */

.castelmonte-header__branding {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.castelmonte-header__logo-link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}

.castelmonte-header__logo {
	display: block;
	width: auto;
	height: 52px;
	max-width: 220px;
}

/* ==================================================
   NAVIGAZIONE
   ================================================== */

.castelmonte-navigation {
	display: flex;
	align-items: center;
	margin-left: auto;
}

.castelmonte-navigation__menu {
	display: flex;
	align-items: center;
	gap: 2.8rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.castelmonte-navigation__menu > li {
	position: relative;
	margin: 0;
	padding: 0;
}

.castelmonte-navigation__menu > li > a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--grigio-chiaro);
	font-size: 0.7rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0.22em;
	text-decoration: none;
	text-transform: uppercase;
	transition:
		color .3s ease,
		background-color .3s ease,
		border-color .3s ease;
}

.castelmonte-navigation__menu a:hover,
.castelmonte-navigation__menu a:focus-visible {
	color: var(--ambra);
}

.castelmonte-navigation__menu a:focus-visible {
	outline: 2px solid var(--ambra);
	outline-offset: 5px;
}

/* ==================================================
   PAGINA CORRENTE
   ================================================== */

.castelmonte-navigation__menu .current-menu-item > a,
.castelmonte-navigation__menu .current-menu-ancestor > a,
.castelmonte-navigation__menu .current_page_item > a,
.castelmonte-navigation__menu .current_page_ancestor > a {
	color: var(--ambra);
}

/* ==================================================
   FRECCIA SOTTOMENU
   ================================================== */

.castelmonte-navigation__menu > .menu-item-has-children > a::after {
	content: "";
	width: .4rem;
	height: .4rem;
	margin-left: .55rem;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: translateY(-.15rem) rotate(45deg);
	transition: transform .25s ease;
}

.castelmonte-navigation__menu > .menu-item-has-children:hover > a::after,
.castelmonte-navigation__menu > .menu-item-has-children:focus-within > a::after {
	transform: translateY(.05rem) rotate(225deg);
}

/* ==================================================
   SOTTOMENU
   ================================================== */

.castelmonte-navigation__menu .sub-menu {
	position: absolute;
	top: calc(100% + .75rem);
	left: 50%;
	z-index: 1100;
	min-width: 220px;
	margin: 0;
	padding: .6rem 0;
	list-style: none;
	background: rgba(26,24,21,.97);
	border: 1px solid rgba(200,104,26,.25);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, .75rem);
	transition:
		opacity .2s ease,
		visibility .2s ease,
		transform .2s ease;
}

.castelmonte-navigation__menu .sub-menu::before {
	content: "";
	position: absolute;
	top: -5px;
	left: 50%;
	width: 8px;
	height: 8px;
	background: #1a1815;
	border-top: 1px solid rgba(200,104,26,.25);
	border-left: 1px solid rgba(200,104,26,.25);
	transform: translateX(-50%) rotate(45deg);
}

.castelmonte-navigation__menu .sub-menu li {
	margin: 0;
	padding: 0;
}

.castelmonte-navigation__menu .sub-menu a {
	display: flex;
	width: 100%;
	padding: .75rem 1.4rem;
	color: var(--grigio-chiaro);
	font-size: .65rem;
	line-height: 1.4;
	letter-spacing: .18em;
	white-space: nowrap;
  text-transform: uppercase;
  text-decoration: none;
}

.castelmonte-navigation__menu .sub-menu a:hover,
.castelmonte-navigation__menu .sub-menu a:focus-visible {
	color: var(--ambra);
	background: rgba(200,104,26,.08);
}

.castelmonte-navigation__menu .menu-item-has-children:hover > .sub-menu,
.castelmonte-navigation__menu .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%,0);
}

/* ==================================================
   PULSANTI MENU
   ================================================== */

.castelmonte-navigation__menu .menu-item--luce > a,
.castelmonte-navigation__menu .menu-item--cta > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: .65rem 1.4rem;
	border: 1px solid;
}

/* Castelmonte Luce */

.castelmonte-navigation__menu .menu-item--luce > a {
	color: var(--oro);
	border-color: var(--oro);
}

.castelmonte-navigation__menu .menu-item--luce > a::before {
	content: "";
	width: .4rem;
	height: .4rem;
	margin-right: .55rem;
  margin-bottom: 1px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 .6rem currentColor;
}

.castelmonte-navigation__menu .menu-item--luce > a:hover,
.castelmonte-navigation__menu .menu-item--luce > a:focus-visible {
	color: var(--nero);
	background: var(--oro);
	border-color: var(--oro);
}

.castelmonte-navigation__menu .menu-item--luce > a:hover::before,
.castelmonte-navigation__menu .menu-item--luce > a:focus-visible::before {
	box-shadow: none;
}

/* Contattaci */

.castelmonte-navigation__menu .menu-item--cta > a {
	color: var(--grigio-chiaro);
	border-color: var(--fiamma);
}

.castelmonte-navigation__menu .menu-item--cta > a:hover,
.castelmonte-navigation__menu .menu-item--cta > a:focus-visible {
	color: var(--nero);
	background: var(--fiamma);
	border-color: var(--fiamma);
}

/* ==================================================
   HAMBURGER
   ================================================== */

.castelmonte-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 40px;
	height: 40px;
	padding: 0;
	gap: 6px;
	color: var(--fiamma);
	background: transparent;
	border: 1px solid rgba(255,255,255,.25);
	cursor: pointer;
}

.castelmonte-menu-toggle__line {
	display: block;
	width: 20px;
	height: 1px;
	background: currentColor;
}

/* ==================================================
   ADMIN BAR
   ================================================== */

body.admin-bar .castelmonte-header {
	top: 32px;
}

/* ==================================================
   RESPONSIVE
   ================================================== */

@media (max-width:1200px){

	.castelmonte-header__container{
		padding-inline:2rem;
	}

	.castelmonte-navigation__menu{
		gap:1.6rem;
	}

	.castelmonte-navigation__menu > li > a{
		font-size:.62rem;
		letter-spacing:.17em;
	}

	.castelmonte-header__logo{
		height:46px;
		max-width:190px;
	}

}

@media (max-width:782px){

	body.admin-bar .castelmonte-header{
		top:46px;
	}

}

/* ==================================================
   PREFERS REDUCED MOTION
   ================================================== */

@media (prefers-reduced-motion: reduce){

	.castelmonte-navigation__menu a,
	.castelmonte-navigation__menu .sub-menu,
	.castelmonte-navigation__menu > .menu-item-has-children > a::after{
		transition:none;
	}

}

/* ==================================================
   NAVIGAZIONE RESPONSIVE
   ================================================== */

@media (max-width: 1200px) {

	.castelmonte-header__container {
		padding-inline: 4rem;
	}

	.castelmonte-navigation__menu {
		gap: 1.6rem;
	}

	.castelmonte-navigation__menu > li > a {
		font-size: 0.62rem;
		letter-spacing: 0.17em;
	}

	.castelmonte-header__logo {
		height: 46px;
		max-width: 280px;
	}

}

@media (max-width: 1024px) {

	.castelmonte-navigation {
		display: none;
	}

	.castelmonte-menu-toggle {
		display: inline-flex;
	}

}

@media (max-width: 821px) {
  .castelmonte-header__container {
    padding-inline: 1.5rem;
  }
}

@media (max-width: 782px) {

	body.admin-bar .castelmonte-header {
		top: 46px;
	}

}

@media (max-width: 767px) {

  .castelmonte-header__logo {
		max-width: 190px;
	}

}

/* ==================================================
   MENU MOBILE
   ================================================== */

.castelmonte-mobile-overlay,
.castelmonte-mobile-menu {
	display: none;
}

@media (max-width: 1024px) {

	.castelmonte-navigation {
		display: none;
	}

	.castelmonte-menu-toggle {
		display: inline-flex;
	}

	/* Overlay */

	.castelmonte-mobile-overlay {
		position: fixed;
		inset: 0;
		z-index: 1190;
		display: block;
		background: rgba(13, 12, 11, 0.72);
		opacity: 0;
		visibility: hidden;
		transition:
			opacity 0.3s ease,
			visibility 0.3s ease;
	}

	/* Pannello slide-in */

	.castelmonte-mobile-menu {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 1200;
		display: flex;
		flex-direction: column;
		width: min(88vw, 420px);
		height: 100vh;
		height: 100dvh;
		padding: 1.5rem 2rem 2rem;
		background: rgba(13, 12, 11, 0.98);
		border-right: 1px solid rgba(200, 104, 26, 0.3);
		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);
		overflow-y: auto;
		visibility: hidden;
		transform: translateX(-100%);
		transition:
			transform 0.35s ease,
			visibility 0.35s ease;
	}

	/* Stato aperto */

	body.castelmonte-mobile-menu-open {
		overflow: hidden;
	}

	body.castelmonte-mobile-menu-open .castelmonte-mobile-overlay {
		opacity: 1;
		visibility: visible;
	}

	body.castelmonte-mobile-menu-open .castelmonte-mobile-menu {
		visibility: visible;
		transform: translateX(0);
	}

	/* Header interno */

	.castelmonte-mobile-menu__header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1.5rem;
		padding-bottom: 1.5rem;
		border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	}

	.castelmonte-mobile-menu__logo-link {
		display: inline-flex;
		align-items: center;
		text-decoration: none;
	}

	.castelmonte-mobile-menu__logo {
		display: block;
		width: auto;
		height: 46px;
		max-width: 190px;
	}

	/* Pulsante chiusura */

	.castelmonte-mobile-menu__close {
		position: relative;
		flex: 0 0 auto;
		width: 42px;
		height: 42px;
		padding: 0;
		color: var(--fiamma);
		background: transparent;
		border: 1px solid rgba(255, 255, 255, 0.25);
		cursor: pointer;
	}

	.castelmonte-mobile-menu__close span {
		position: absolute;
		top: 50%;
		left: 50%;
		display: block;
		width: 18px;
		height: 1px;
		background: currentColor;
	}

	.castelmonte-mobile-menu__close span:first-child {
		transform: translate(-50%, -50%) rotate(45deg);
	}

	.castelmonte-mobile-menu__close span:last-child {
		transform: translate(-50%, -50%) rotate(-45deg);
	}

	.castelmonte-mobile-menu__close:focus-visible {
		outline: 2px solid var(--ambra);
		outline-offset: 4px;
	}

	/* Navigazione */

	.castelmonte-mobile-navigation {
		padding-top: 1.5rem;
	}

	.castelmonte-mobile-navigation__menu,
	.castelmonte-mobile-navigation__menu .sub-menu {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.castelmonte-mobile-navigation__menu {
		display: flex;
		flex-direction: column;
		gap: 0;
	}

	.castelmonte-mobile-navigation__menu > li {
		position: relative;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}

	.castelmonte-mobile-navigation__menu a {
		color: var(--grigio-chiaro);
		text-decoration: none;
		text-transform: uppercase;
	}

	.castelmonte-mobile-navigation__menu > li > a {
		display: flex;
		align-items: center;
		width: 100%;
		min-height: 52px;
		padding: 0.85rem 0;
		font-size: 0.72rem;
		font-weight: 500;
		line-height: 1.4;
		letter-spacing: 0.2em;
	}

	.castelmonte-mobile-navigation__menu a:hover,
	.castelmonte-mobile-navigation__menu a:focus-visible {
		color: var(--ambra);
	}

	.castelmonte-mobile-navigation__menu a:focus-visible {
		outline: 2px solid var(--ambra);
		outline-offset: 4px;
	}

	/* ==================================================
	   ELEMENTI CON SOTTOMENU
	   ================================================== */

	.castelmonte-mobile-navigation__menu >
	.menu-item-has-children >
	a {
		padding-right: 3.5rem;
	}

	/* Pulsante apertura sottomenu */

	.castelmonte-mobile-submenu-toggle {
		position: absolute;
		top: 4px;
		right: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		color: var(--grigio-chiaro);
		background: transparent;
		border: 0;
		cursor: pointer;
	}

	.castelmonte-mobile-submenu-toggle:hover,
	.castelmonte-mobile-submenu-toggle:focus-visible {
		color: var(--ambra);
	}

	.castelmonte-mobile-submenu-toggle:focus-visible {
		outline: 2px solid var(--ambra);
		outline-offset: 2px;
	}

	/* Freccia del pulsante */

	.castelmonte-mobile-submenu-toggle span {
		display: block;
		width: 0.45rem;
		height: 0.45rem;
		border-right: 1px solid currentColor;
		border-bottom: 1px solid currentColor;
		transform: translateY(-2px) rotate(45deg);
		transition: transform 0.25s ease;
	}

	.castelmonte-mobile-navigation__menu
	.menu-item--open >
	.castelmonte-mobile-submenu-toggle span {
		transform: translateY(2px) rotate(225deg);
	}

	/* ==================================================
	   SOTTOMENU MOBILE
	   ================================================== */

	.castelmonte-mobile-navigation__menu .sub-menu {
		max-height: 0;
		padding: 0 0 0 1rem;
		overflow: hidden;
		visibility: hidden;
		transition:
			max-height 0.35s ease,
			visibility 0.35s ease;
	}

	.castelmonte-mobile-navigation__menu
	.menu-item--open >
	.sub-menu {
		max-height: 600px;
		padding-bottom: 0.8rem;
		visibility: visible;
	}

	.castelmonte-mobile-navigation__menu .sub-menu li {
		margin: 0;
		padding: 0;
	}

	.castelmonte-mobile-navigation__menu .sub-menu a {
		display: block;
		padding: 0.55rem 0;
		font-size: 0.65rem;
		line-height: 1.5;
		letter-spacing: 0.16em;
	}

	/* Pagina corrente */

	.castelmonte-mobile-navigation__menu .current-menu-item > a,
	.castelmonte-mobile-navigation__menu .current-menu-ancestor > a,
	.castelmonte-mobile-navigation__menu .current_page_item > a,
	.castelmonte-mobile-navigation__menu .current_page_ancestor > a {
		color: var(--ambra);
	}

	/* Pulsanti mobile */

	.castelmonte-mobile-navigation__menu .menu-item--luce,
	.castelmonte-mobile-navigation__menu .menu-item--cta {
		border-bottom: 0;
	}

	.castelmonte-mobile-navigation__menu .menu-item--luce {
		margin-top: 1.5rem;
	}

	.castelmonte-mobile-navigation__menu .menu-item--cta {
		margin-top: 0.8rem;
	}

	.castelmonte-mobile-navigation__menu .menu-item--luce > a,
	.castelmonte-mobile-navigation__menu .menu-item--cta > a {
		justify-content: center;
		min-height: 46px;
		padding: 0.75rem 1.2rem;
		border: 1px solid;
	}

	/* Castelmonte Luce */

	.castelmonte-mobile-navigation__menu .menu-item--luce > a {
		color: var(--oro);
		border-color: var(--oro);
	}

	.castelmonte-mobile-navigation__menu .menu-item--luce > a::before {
		content: "";
		width: 0.4rem;
		height: 0.4rem;
		margin-right: 0.55rem;
		margin-bottom: 1px;
		background: currentColor;
		border-radius: 50%;
		box-shadow: 0 0 0.6rem currentColor;
	}

	.castelmonte-mobile-navigation__menu .menu-item--luce > a:hover,
	.castelmonte-mobile-navigation__menu .menu-item--luce > a:focus-visible {
		color: var(--nero);
		background: var(--oro);
		border-color: var(--oro);
	}

	.castelmonte-mobile-navigation__menu .menu-item--luce > a:hover::before,
	.castelmonte-mobile-navigation__menu .menu-item--luce > a:focus-visible::before {
		box-shadow: none;
	}

	/* Contattaci */

	.castelmonte-mobile-navigation__menu .menu-item--cta > a {
		color: var(--grigio-chiaro);
		border-color: var(--fiamma);
	}

	.castelmonte-mobile-navigation__menu .menu-item--cta > a:hover,
	.castelmonte-mobile-navigation__menu .menu-item--cta > a:focus-visible {
		color: var(--nero);
		background: var(--fiamma);
		border-color: var(--fiamma);
	}

}

@media (max-width: 480px) {

	.castelmonte-mobile-menu {
		width: 100%;
		padding-inline: 1.5rem;
	}

}

/* ARCHIVIO PRODOTTI */
.products-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
}

@media (max-width:900px) {
  .products-list {grid-template-columns: 1fr 1fr;}
}

@media (max-width:767px) {
  .products-list {grid-template-columns: 1fr;}
}

.products-list .product-name a {
  cursor: pointer; 
  transition: color 0.2s; 
  color: var(--bianco);
  text-decoration:none;
}

.products-list .product-name a:hover {
  color: var(--fiamma);
}

.product-collezione-badge {
	display:flex;
	align-items:flex-end;
}

.product-card[hidden] {
	display: none !important;
}

/* ==================================================
   TABELLA MODELLI - SCROLL ORIZZONTALE
   ================================================== */

.modelli-table-wrap {
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
}

.modelli-table {
	width: 100%;
	min-width: 900px;
}

.modelli-table th,
.modelli-table td {
	white-space: nowrap;
}

.modelli-table th:nth-child(5),
.modelli-table td:nth-child(5) {
	min-width: 220px;
	white-space: normal;
}

/* HOME - HERO (TEMPORANEA) */
@media (max-width: 1611px) {
	.home .hero-product-img {right:4rem;max-height:40vw;}
}

@media (max-width: 1024px) {
	.home .hero {height:unset;}
	.home .hero-product-img {display:none;}
	.home .hero-actions {flex-direction:column;}
}

/* ==================================================
   DIMENSIONI CERAMICHE – TABELLA RESPONSIVE
   ================================================== */

@media (max-width: 767px) {

	.dim-section {
		width: 100%;
		max-width: 100%;
		min-width: 0;
	}

	.dim-section > * {
		min-width: 0;
	}

	.dim-table-wrapper {
		display: block;
		width: 100%;
		max-width: 100%;
		min-width: 0;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
	}

	.dim-table {
		width: 100%;
		min-width: 700px;
		margin: 0;
	}

	.dim-table th,
	.dim-table td {
		white-space: nowrap;
	}

}