/* Manifiesto en capas: photography, paper panels and material samples. */
.sustainability-manifesto { --sm-space: clamp(24px, 5vw, 84px); --sm-muted: #535e4f; }
.sustainability-manifesto figure { margin: 0; }
.sustainability-manifesto p { font-size: 1rem; line-height: 1.65; }
.sustainability-manifesto .sm-kicker { margin: 0 0 20px; font-size: .75rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--forest-2); }
.sustainability-manifesto h1, .sustainability-manifesto h2, .sustainability-manifesto h3 { margin: 0; font-family: var(--serif); font-weight: 400; letter-spacing: -.06em; }
.sustainability-manifesto h2 { font-size: clamp(42px, 5.1vw, 80px); line-height: 1.01; }
.sustainability-manifesto em { color: var(--forest-2); }
.sustainability-manifesto section[id] { scroll-margin-top: 28px; }
.sustainability-manifesto :where(a, summary):focus-visible { outline: 2px solid var(--forest-2); outline-offset: 5px; }
.sm-hero { position: relative; isolation: isolate; display: grid; align-items: end; min-height: max(720px, 94svh); padding: 200px var(--sm-space) 62px; background: var(--forest); }
.sm-hero-photo { position: absolute; z-index: -2; inset: 0; }
.sm-hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 58%; }
.sm-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #111a12bf, transparent 28%), linear-gradient(90deg, #18221940, transparent 75%); }
.sm-hero-note { position: absolute; top: 125px; right: var(--sm-space); display: grid; gap: 7px; color: var(--cream); font-size: .75rem; letter-spacing: .11em; text-transform: uppercase; text-align: right; text-shadow: 0 1px 8px #0008; }
.sm-hero-card { width: min(100%, 570px); padding: clamp(28px, 3.2vw, 52px); background: rgba(232,235,225,.94); }
.sm-hero-card h1 { font-size: clamp(56px, 6.5vw, 100px); line-height: .99; }
.sm-hero-card > p:not(.sm-kicker) { max-width: 360px; margin: 28px 0; color: var(--sm-muted); }
.sm-link { display: inline-flex; align-items: center; gap: 24px; min-height: 44px; padding: 6px 0; font-size: .875rem; border-bottom: 1px solid var(--line); }
.sm-link span { font-size: 1.3rem; transition: transform .3s ease; }
.sm-link:hover span { transform: translate(3px, -3px); }
.sm-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 0 var(--sm-space); border-bottom: 1px solid var(--line); }
.sm-principles a { display: grid; grid-template-columns: auto 1fr; gap: 5px 22px; padding: 28px 24px; border-right: 1px solid var(--line); }
.sm-principles a:first-child { padding-left: 0; }
.sm-principles a:last-child { border-right: 0; }
.sm-principles span { font-size: .75rem; color: var(--forest-2); padding-top: 6px; }
.sm-principles strong { font: 400 clamp(23px, 2.2vw, 34px)/1.1 var(--serif); letter-spacing: -.035em; }
.sm-principles small { grid-column: 2; font-size: .875rem; line-height: 1.45; color: var(--sm-muted); }
.sm-principles a:hover { background: #ccd5c433; }
.sm-section { padding: clamp(65px, 8vw, 128px) var(--sm-space); }
.sm-heading { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(30px, 8vw, 130px); align-items: end; margin-bottom: 45px; }
.sm-heading-copy > p { margin: 0; max-width: 400px; color: var(--sm-muted); }
.sm-logos { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 24px; }
.sm-logos img { width: 88px; height: 80px; object-fit: contain; }
.sm-logos img + img { width: 120px; }
.sm-wood-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.2vw, 36px); }
.sm-material { min-width: 0; }
.sm-material figure { aspect-ratio: 1.5; overflow: hidden; background: var(--mist); }
.sm-material figure img { width: 100%; height: 100%; object-fit: cover; }
.sm-material .sm-kicker { margin: 20px 0 9px; }
.sm-material h3 { font-size: clamp(28px, 2.7vw, 42px); line-height: 1.1; margin-bottom: 20px; overflow-wrap: anywhere; }
.sustainability-manifesto details { border-top: 1px solid var(--line); }
.sustainability-manifesto summary { display: flex; justify-content: space-between; gap: 16px; align-items: center; min-height: 50px; padding: 12px 0; font-size: .875rem; line-height: 1.5; list-style: none; cursor: pointer; }
.sustainability-manifesto summary::-webkit-details-marker { display: none; }
.sustainability-manifesto summary::after { content: '+'; flex: none; color: var(--forest-2); font-size: 1.35rem; }
.sustainability-manifesto details[open] summary::after { content: '−'; }
.sustainability-manifesto details > p { margin: 0 0 22px; color: var(--sm-muted); }
.sm-wood-care { margin-top: 32px; border-bottom: 1px solid var(--line); }
.sm-wood-care p { max-width: 800px; }
.sm-surfaces { padding: 60px var(--sm-space) clamp(65px, 8vw, 128px); background: var(--mist); }
.sm-hpl-layer { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; padding-top: 12px; }
.sm-hpl-photo { grid-column: 1 / 8; grid-row: 1; }
.sm-hpl-photo img { width: 100%; height: auto; max-height: 760px; object-fit: cover; object-position: center 78%; }
.sm-panel { position: relative; padding: clamp(28px, 3.5vw, 56px); background: var(--paper); }
.sm-hpl-layer > .sm-panel { grid-column: 7 / -1; grid-row: 1; }
.sm-panel > p:not(.sm-kicker) { margin: 28px 0; color: var(--sm-muted); max-width: 410px; }
.sm-materials-intro { display: flex; justify-content: space-between; align-items: end; gap: 30px; padding: clamp(60px, 8vw, 100px) 0 40px; }
.sm-materials-intro p { margin: 0; max-width: 340px; color: var(--sm-muted); }
.sm-other-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 2vw, 30px); }
.sm-other-grid .sm-material figure { aspect-ratio: 1; }
.sm-other-grid .sm-material h3 { font-size: clamp(26px, 2.3vw, 36px); }
.sm-care { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; }
.sm-olea-photo { grid-column: 1 / 9; grid-row: 1; }
.sm-olea-photo img { width: 100%; height: auto; }
.sm-care-panel { grid-column: 7 / -1; grid-row: 1; background: var(--forest); color: var(--cream); }
.sm-care-panel h2 { font-size: clamp(40px, 4.3vw, 68px); }
.sm-care-panel em, .sm-care-panel .sm-kicker, .sm-care-panel summary::after { color: #c2cbb8; }
.sm-care-panel > p:not(.sm-kicker), .sm-care-panel details > p { color: #dbe1d2; }
.sm-care-panel details { border-color: var(--white-line); }
.sm-care-panel summary:focus-visible { outline-color: var(--cream); }
@media (max-width: 1100px) {
  .sm-other-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px; }
  .sm-other-grid .sm-material figure { aspect-ratio: 1.6; }
  .sm-hpl-layer > .sm-panel, .sm-care-panel { grid-column: 6 / -1; }
}
@media (max-width: 760px) {
  .sm-hero { min-height: 760px; padding-top: 285px; padding-bottom: 28px; }
  .sm-hero-photo img { object-position: 63% center; }
  .sm-hero-note { top: 120px; left: var(--sm-space); right: auto; text-align: left; }
  .sm-hero-card { width: 100%; }
  .sm-hero-card h1 { font-size: clamp(48px, 10.5vw, 75px); }
  .sm-hero-card .sm-kicker { font-size: .75rem; letter-spacing: .07em; }
  .sm-principles a { display: block; padding: 20px 12px; }
  .sm-principles span, .sm-principles strong, .sm-principles small { display: block; }
  .sm-principles strong { margin: 10px 0; font-size: 22px; }
  .sm-principles small { font-size: .75rem; }
  .sm-heading { grid-template-columns: 1fr; gap: 28px; }
  .sm-wood-grid { grid-template-columns: 1fr; gap: 32px; }
  .sm-material figure { aspect-ratio: 1.8; }
  .sm-hpl-layer, .sm-care { display: flex; flex-direction: column; align-items: stretch; }
  .sm-hpl-photo img { max-height: none; }
  .sm-hpl-layer > .sm-panel, .sm-care-panel { margin: -35px 12px 0; padding: 28px 24px; }
  .sm-materials-intro { display: block; }
  .sm-materials-intro p { margin-top: 24px; }
  .sm-other-grid { grid-template-columns: 1fr; gap: 32px; }
  .sm-other-grid .sm-material figure { aspect-ratio: 1.8; }
  .sm-care-panel { margin-top: -18px; }
}
@media (prefers-reduced-motion: reduce) {
  .sm-link span { transition: none; }
  body[data-page="sustainability"], html:has(body[data-page="sustainability"]) { scroll-behavior: auto; }
}