/* INN PROGRESS | Forniture integrative - Home visual system alignment
   This stylesheet intentionally scopes presentation to the restored 63 pages.
   The model selectors, options, identifiers and request forms remain unchanged.
   Baseline: INN PROGRESS Home v367, 20/10/2026. */
body.complements-detail,
body.complementi-page {
  --ink: #101211;
  --paper: #f7f6f2;
  --white: #fff;
  --bronze: #8b653d;
  --bronze-light: #d8bc97;
  --muted: #4d504c;
  --line: #b9bab4;
  --pad: clamp(1.25rem, 4vw, 4.5rem);
  --serif: "Manrope", sans-serif;
  background: var(--paper);
  color: var(--ink);
  font-family: "DM Sans", sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.72;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body:is(.complements-detail,.complementi-page) :is(.wrap,.page-hero-copy) { box-sizing: border-box; }
body:is(.complements-detail,.complementi-page) .wrap {
  width: calc(100% - 2 * var(--pad));
  max-width: 1440px;
  margin-inline: auto;
}
body:is(.complements-detail,.complementi-page) :is(h1,h2,h3) {
  font-family: var(--serif);
  font-weight: 300;
  letter-spacing: -.052em;
}
body:is(.complements-detail,.complementi-page) :is(p,li) { overflow-wrap: break-word; }
body:is(.complements-detail,.complementi-page) :is(.eyebrow,.section-number,.chapter-number,.category-index,.category-bottom,.image-source) {
  font-family: "DM Sans",sans-serif;
  letter-spacing: .14em;
}
body:is(.complements-detail,.complementi-page) .eyebrow {
  font-size: .71rem;
  font-weight: 600;
  line-height: 1.5;
  text-transform: uppercase;
  color: #595b57;
}
body:is(.complements-detail,.complementi-page) .eyebrow.light { color: #f0dfc9; }
body:is(.complements-detail,.complementi-page) :is(.section h2,.detail-intro h2,.section-head h2,.faq h2) {
  font-family: var(--serif);
  font-size: clamp(2.3rem, 4.8vw, 5.25rem);
  font-weight: 300;
  line-height: 1.08;
  letter-spacing: -.052em;
  color: #171918;
  text-wrap: balance;
}
body:is(.complements-detail,.complementi-page) :is(.section h2,.detail-intro h2,.section-head h2,.faq h2) em {
  font: inherit;
  color: var(--bronze);
}
body:is(.complements-detail,.complementi-page) .intro-copy .large {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.25rem,2vw,1.75rem);
  line-height: 1.45;
  color: #191b19;
  letter-spacing: -.015em;
}
body:is(.complements-detail,.complementi-page) :is(.intro-copy p:not(.large),.section-head>p,.detail-intro p:not(.large),.chapter-heading p,.faq p,.model p,.category-description) {
  color: #484b47;
  line-height: 1.65;
}
body:is(.complements-detail,.complementi-page) .section { padding-block: clamp(4.5rem, 8vw, 8rem); }
body:is(.complements-detail,.complementi-page) .section-number { color: var(--muted); }
body:is(.complements-detail,.complementi-page) :is(.detail-intro,.intro) {
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: clamp(2rem,6vw,6rem);
  align-items: start;
  padding-block: clamp(5rem, 9vw, 8.5rem);
}
body:is(.complements-detail,.complementi-page) :is(.intro-copy,.section-head>p) { max-width: 39rem; }
body:is(.complements-detail,.complementi-page) .intro-copy { padding-top: clamp(1rem,2.7vw,3rem); }

/* Internal-page heroes echo the Home's cinematic full-bleed header. */
body:is(.complements-detail,.complementi-page) .page-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  width: 100%;
  min-height: clamp(38rem,78svh,62rem);
  padding: 0;
  overflow: hidden;
  background: #111412;
  color: #fff;
}
body:is(.complements-detail,.complementi-page) .page-hero > img {
  position: absolute;
  display: block;
  inset: 0;
  grid-column: auto;
  grid-row: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center;
  filter: saturate(.84) contrast(1.035);
}
body:is(.complements-detail,.complementi-page) .page-hero .hero-shade {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(90deg,#090b0ae8 0%,#090b0ac2 35%,#090b0a62 69%,#090b0a28 100%),
              linear-gradient(0deg,#090b0ab7 0%,transparent 68%);
}
body:is(.complements-detail,.complementi-page) .page-hero-copy {
  position: relative;
  display: block;
  z-index: 1;
  grid-column: auto;
  grid-row: auto;
  max-width: min(75rem,100%);
  width: 100%;
  padding: clamp(10.5rem,19vh,13.5rem) var(--pad) clamp(4.2rem,9vh,7rem);
  filter: drop-shadow(0 3px 15px #0009);
  text-align: start;
}
body:is(.complements-detail,.complementi-page) .page-hero h1 {
  margin: .7rem 0 1.35rem;
  color: #fff;
  font: 300 clamp(3.1rem,7vw,7rem)/1.035 var(--serif);
  letter-spacing: -.056em;
  max-width: 65rem;
  text-wrap: balance;
}
body:is(.complements-detail,.complementi-page) .page-hero :is(h1 em,.hero-statement em) {
  color: #e6c6a0;
}
body:is(.complements-detail,.complementi-page) .hero-statement {
  font: 300 clamp(1.4rem,2.6vw,2.6rem)/1.24 var(--serif);
  letter-spacing: -.035em;
  max-width: 40rem;
  color: #f7f6f2;
  margin: 0 0 1.55rem;
}
body:is(.complements-detail,.complementi-page) :is(.hero-domains,.signature) {
  color: #f4f0e8;
  font-size: .82rem;
  line-height: 1.5;
  letter-spacing: .09em;
  font-weight: 500;
}
body:is(.complements-detail,.complementi-page) .page-hero .actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem 1.25rem;
  margin-top: 2rem;
}
body:is(.complements-detail,.complementi-page) .page-hero .button,
body:is(.complements-detail,.complementi-page) .button {
  display: inline-flex;
  min-height: 3.25rem;
  padding: .85rem 1.35rem;
  justify-content: center;
  align-items: center;
  gap: .7rem;
  background: var(--bronze);
  border: 1px solid var(--bronze);
  border-radius: 0;
  color: #fff;
  font: 600 .72rem/1.25 "DM Sans",sans-serif;
  text-transform: uppercase;
  letter-spacing: .12em;
  text-decoration: none;
  transition: background .2s,transform .2s;
}
body:is(.complements-detail,.complementi-page) .button:hover {background: #714d29;transform: translateY(-2px);color:#fff;}
body:is(.complements-detail,.complementi-page) .page-hero .text-link {color:#fff;border-color:#fff;}
body:is(.complements-detail,.complementi-page) .cover-project-credit {z-index:2;}
body:is(.complements-detail,.complementi-page) :is(.back-to-supplies,.text-link) {font-size:.77rem;letter-spacing:.09em;}
body:is(.complements-detail,.complementi-page) .hero-signature {color:#f4f1eb;}

/* Home-like editorial divisions, rhythm and catalogue hierarchy. */
body.complementi-page .hub-index {
  display: grid;
  grid-template-columns: minmax(7rem,.75fr) repeat(4,minmax(0,1fr));
  gap: clamp(.75rem,2vw,2rem);
  background: var(--paper);
  border-block: 1px solid var(--line);
  padding-block: 1.35rem;
  align-items: center;
}
body.complementi-page .hub-index a {min-width:0;font-size:.82rem;line-height:1.5;color:#343733;}
body.complementi-page .hub-index a:hover {color:var(--bronze);}
body.complementi-page .hub-catalog {padding-block:clamp(5rem,8vw,8rem);}
body.complementi-page .hub-catalog>.section-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items: end;
  column-gap: clamp(2rem,7vw,7rem);
  margin-bottom: clamp(3rem,5vw,5rem);
}
body.complementi-page .hub-catalog>.section-head p:last-child {font-size:1rem;line-height:1.72;}
body.complementi-page .catalog-chapter {margin-block:0 clamp(4rem,7vw,7rem);}
body.complementi-page .chapter-heading {
  grid-template-columns: 3rem minmax(0,1fr) minmax(0,.65fr);
  gap:clamp(1rem,3vw,3rem);
  padding:1.65rem 0 2.5rem;
  border-top:1px solid var(--line);
  color:var(--ink);
}
body.complementi-page .chapter-heading h3 {
  font:300 clamp(1.8rem,3.2vw,3rem)/1.15 var(--serif);
  letter-spacing:-.045em;color:#171918;
}
body.complementi-page .chapter-heading p {font-size:.95rem;color:#484b47;max-width:28rem;}
body.complementi-page .complement-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,4vw,4rem) clamp(1rem,2.2vw,2.5rem);}
body.complementi-page .catalog-chapter .complement-category {border-top:1px solid var(--line);padding-top:.8rem;}
body.complementi-page .catalog-chapter .category-copy {padding-top:1.25rem;grid-template-rows:auto auto auto;height:auto;min-height:12.5rem;row-gap:.4rem;}
body.complementi-page .category-copy .eyebrow {font-size:.72rem;letter-spacing:.11em;color:#666a63;}
body.complementi-page .category-copy h3 {font:300 clamp(1.8rem,3vw,3rem)/1.14 var(--serif);letter-spacing:-.05em;color:#171918;}
body.complementi-page .category-description {font-size:.94rem;line-height:1.65;max-width:39rem;}
body.complementi-page .catalog-chapter .complement-category .category-image {
  margin-top: clamp(.75rem,1.5vw,1.5rem);
  min-height: 18rem;
  background: #f1f0eb;
  border:1px solid #d0cec5;
  border-bottom:1px solid #d0cec5;
}
body.complementi-page .catalog-chapter .complement-category:hover .category-image {border-color:var(--bronze);}
body.complementi-page .category-bottom {font-size:.75rem;color:#595b57;min-height:3.5rem;}
body.complementi-page .category-action {color:var(--ink);font-weight:600;}
body.complementi-page .hub-closing {background:#121513;color:#fff;padding-block:clamp(4.5rem,8vw,7.5rem);}
body.complementi-page .hub-closing :is(h2,h3){color:#fff;}
body.complementi-page .hub-closing p {color:#d0d2cd;}
body.complementi-page .hub-rights {color:#737670;font-size:.72rem;line-height:1.65;}

/* Product pages: lighter editorial typography and uninterrupted module UI. */
body.complements-detail .page-hero {min-height:clamp(34rem,75svh,56rem);}
body.complements-detail .page-hero h1 {font-size:clamp(2.85rem,6.3vw,6.45rem);}
body.complements-detail .page-hero h1 .supply-scope {
  display:block;
  font:400 clamp(.9rem,1.25vw,1.1rem)/1.5 "DM Sans",sans-serif;
  color:#f4eee5;
  letter-spacing:.015em;
  margin-top:1.25rem;
}
body.complements-detail .detail-intro .intro-copy .large {font-size:clamp(1.25rem,2vw,1.75rem);}
body.complements-detail .principles {border-color:var(--line);}
body.complements-detail .principles p {color:#484b47;}
body.complements-detail :is(.models-section,.configure,.faq,.request-section) {scroll-margin-top:6rem;}
body.complements-detail :is(.models-section,.configure,.faq) h2 {font-size:clamp(2.2rem,4.8vw,5rem);line-height:1.08;}
body.complements-detail .model {border-color:#cecec7;}
body.complements-detail .model h3 {font:400 clamp(1.4rem,2vw,2rem)/1.25 var(--serif);color:var(--ink);}
body.complements-detail :is(.model p,.model li,.model label,.configure p,.faq p,.request-card p) {font-size:clamp(.94rem,1.15vw,1rem);line-height:1.6;}
body.complements-detail :is(.request-card,.model,.configure) {color:var(--ink);}
body.complements-detail :is(input,textarea,select) {font-family:"DM Sans",sans-serif;font-size:1rem;}
body.complements-detail :is(input,textarea,select):focus-visible,
body:is(.complements-detail,.complementi-page) :is(a,button):focus-visible {outline:3px solid #d59b52;outline-offset:3px;}

@media (max-width:1000px) {
  body.complementi-page .hub-index {grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 1.2rem;}
  body.complementi-page .hub-index>span {grid-column:1/-1;}
  body.complementi-page .chapter-heading {grid-template-columns:2rem minmax(0,1fr);}
  body.complementi-page .chapter-heading p {grid-column:2;justify-self:start;max-width:100%;}
}
@media (max-width:900px) {
  body:is(.complements-detail,.complementi-page) :is(.detail-intro,.intro) {grid-template-columns:minmax(0,1fr);gap:1.7rem;padding-block:clamp(4rem,7vw,6rem);}
  body:is(.complements-detail,.complementi-page) .intro-copy {padding-top:0;}
  body.complementi-page .hub-catalog>.section-head {grid-template-columns:minmax(0,1fr);gap:1.6rem;}
  body.complementi-page .complement-grid {gap:2.5rem 1.25rem;}
  body.complementi-page .page-hero {min-height:clamp(36rem,80svh,54rem);}
}
@media (max-width:650px) {
  body:is(.complements-detail,.complementi-page) {font-size:16px;line-height:1.65;}
  body:is(.complements-detail,.complementi-page) .page-hero {min-height:clamp(36rem,82svh,55rem);}
  body:is(.complements-detail,.complementi-page) .page-hero>img {height:100%;min-height:0;object-position:55% center;}
  body:is(.complements-detail,.complementi-page) .page-hero .hero-shade {
    background:linear-gradient(0deg,#080b09ee 0%,#080b09c7 36%,#080b0970 74%,#080b0966 100%);
  }
  body:is(.complements-detail,.complementi-page) .page-hero-copy {
    padding: 11rem var(--pad) 3.4rem;
    width:100%;
  }
  body:is(.complements-detail,.complementi-page) .page-hero h1 {font-size:clamp(2.45rem,10.2vw,3.8rem);line-height:1.045;max-width:100%;letter-spacing:-.047em;}
  body:is(.complements-detail,.complementi-page) .hero-statement {font-size:clamp(1.35rem,5vw,1.9rem);}
  body:is(.complements-detail,.complementi-page) .hero-domains {font-size:.72rem;letter-spacing:.08em;}
  body:is(.complements-detail,.complementi-page) .section {padding-block:clamp(3.5rem,10vw,5rem);}
  body:is(.complements-detail,.complementi-page) :is(.section h2,.detail-intro h2,.section-head h2,.faq h2,.models-section h2,.configure h2) {font-size:clamp(2rem,9.2vw,3.35rem);line-height:1.1;}
  body:is(.complements-detail,.complementi-page) .intro-copy .large {font-size:1.21rem;line-height:1.48;}
  body.complementi-page .hub-index {grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem .9rem;padding-block:.95rem;}
  body.complementi-page .hub-index a {font-size:.78rem;}
  body.complementi-page .chapter-heading {padding-block:1.4rem 1.8rem;}
  body.complementi-page .chapter-heading h3 {font-size:1.8rem;}
  body.complementi-page .complement-grid {grid-template-columns:minmax(0,1fr);gap:2.6rem;}
  body.complementi-page .catalog-chapter .category-copy {height:auto;min-height:0;grid-template-rows:auto auto auto;gap:.65rem;padding-right:0;}
  body.complementi-page .category-copy h3 {font-size:clamp(1.9rem,8vw,2.55rem);}
  body.complementi-page .catalog-chapter .complement-category .category-image {margin-top:1rem;height:clamp(17rem,78vw,24rem);min-height:0;}
  body.complementi-page .category-bottom {font-size:.7rem;}
  body:is(.complements-detail,.complementi-page) .page-hero .button {width:100%;}
  body.complements-detail .page-hero .actions {align-items:stretch;}
  body.complements-detail .page-hero h1 .supply-scope {font-size:.91rem;}
  body.complements-detail .request-card {padding:1.15rem;}
}
@media (max-width:390px) {
  body:is(.complements-detail,.complementi-page) .page-hero h1 {font-size:2.38rem;}
  body.complementi-page .hub-index {grid-template-columns:1fr;}
  body.complementi-page .hub-index>span {grid-column:auto;}
}
html[lang="ar"] body:is(.complements-detail,.complementi-page) :is(.page-hero-copy,.intro-title,.intro-copy,.hub-catalog,.chapter-heading,.category-copy,.hub-closing,.model) {direction:rtl;text-align:right;}
html[lang="ar"] body:is(.complements-detail,.complementi-page) .page-hero .actions {justify-content:flex-start;}
@media (prefers-reduced-motion:reduce) {
  body:is(.complements-detail,.complementi-page) :is(.button,.category-image img) {transition:none;}
}

/* The current Home collapses the language list behind the globe on mobile.
   The archived pages carry older inline rules; restore the current behavior. */
@media (max-width:900px) {
  body:is(.complements-detail,.complementi-page) .language-banner > div { display:none; }
  body:is(.complements-detail,.complementi-page) .language-banner.languages-open > div {
    display:flex;
    position:absolute;
    inset-inline-end:.5rem;
    inset-inline-start:auto;
    top:100%;
    width:min(16rem,calc(100vw - 1rem));
    height:auto;
    max-height:calc(100dvh - 5rem);
    overflow-y:auto;
    flex-direction:column;
    z-index:110;
    background:rgba(16,18,17,.96);
    border:1px solid #ffffff35;
    box-shadow:0 12px 30px #0005;
  }
  body:is(.complements-detail,.complementi-page) .language-banner.languages-open > div a {
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:.55rem;
    padding:.55rem .8rem;
    min-height:2.75rem;
  }
}