/**
 * Copyright (c) 2026 DNA Genics, S.L. All rights reserved.
 * DNA Segment Studio: Heritage application landing and conceptual comparison outline.
 */
.dss-product-page .happ-desktop-hero-layout { align-items: start; }
.dss-product-page .happ-desktop-hero h1 { max-width: 16ch; }
.dss-product-page .happ-hero-description { max-width: 53ch; }
.dss-method { min-width: 0; padding: clamp(24px, 3vw, 38px); background: var(--hd-forest); color: #faf8f4; border-radius: 12px; }
.dss-method-eyebrow { display: block; color: #d9c69e; font-size: 12px; font-weight: 600; line-height: 1.6; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 20px; }
.dss-product-page .dss-method h2 { color: #faf8f4; font-size: clamp(2rem, 2.5vw, 2.7rem); line-height: 1.1; margin-bottom: 26px; }
.dss-method-pairs { list-style: none; margin: 0; padding: 0; border-top: 1px solid #6e7d71; }
.dss-method-pairs li { display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; gap: 16px; align-items: center; padding-block: 22px; border-bottom: 1px solid #6e7d71; }
.dss-person { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid #a4b1a5; border-radius: 50%; color: #faf8f4; font: 500 23px/1 var(--hd-serif); }
.dss-person--common { background: #efe6d6; border-color: #efe6d6; color: #213a2f; }
.dss-method-pairs strong { display: block; font-size: 14px; line-height: 1.6; font-weight: 600; color: #faf8f4; }
.dss-method-pairs div > span { display: block; color: #d2dcd0; font-size: 12px; line-height: 1.7; margin-top: 4px; }
.dss-product-page .dss-method > p { margin: 22px 0 0; color: #d2dcd0; font-size: 14px; line-height: 1.9; }
.dss-product-page .dss-method > .dss-method-caption { margin-top: 16px; font-size: 12px; line-height: 1.8; color: #d9c69e; }
.dss-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.dss-principles > article { min-width: 0; border-top: 1px solid #cbbd9f; padding-top: 24px; }
.dss-principle-number { display: block; font-size: 12px; line-height: 1.7; color: #765e34; margin-bottom: 20px; text-transform: uppercase; letter-spacing: .06em; }
.dss-principles h3 { max-width: 15ch; font-size: 2rem; }
.dss-principles p { font-size: 14px; line-height: 1.95; margin-bottom: 0; }
.dss-section-note { border-top: 1px solid var(--hd-border); padding-top: 22px; margin: 30px 0 0; font-size: 13px; line-height: 1.9; }
.dss-install-steps { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--hd-border); }
.dss-install-steps li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 20px; padding-block: 24px; border-bottom: 1px solid var(--hd-border); }
.dss-install-steps li > span { font: 500 26px/1.2 var(--hd-serif); color: #765e34; }
.dss-install-steps h3 { font-size: 1.75rem; margin-bottom: 8px; }
.dss-install-steps p { margin-bottom: 0; font-size: 14px; line-height: 1.9; }
.dss-product-page code { color: var(--hd-forest); background: var(--hd-sand); padding: 2px 5px; border-radius: 3px; font: 12px/1.8 ui-monospace, Consolas, monospace; overflow-wrap: anywhere; }
.dss-reading-list { min-width: 0; }
.dss-reading-list > article { padding-block: 24px; border-top: 1px solid #cbbd9f; }
.dss-reading-list > article:first-child { padding-top: 0; border-top: 0; }
.dss-product-page .dss-reading-author { font-size: 12px; line-height: 1.8; color: #53664e; margin-bottom: 10px; }
.dss-reading-list h3 { font-size: 1.9rem; margin-bottom: 10px; }
.dss-reading-list > .hpl-small-note { margin-top: 6px; margin-bottom: 0; padding-top: 22px; border-top: 1px solid #cbbd9f; }
.dss-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 1100px) {
    .dss-method-pairs li { grid-template-columns: 30px minmax(0, 1fr) 30px; gap: 12px; }
    .dss-person { width: 30px; height: 30px; font-size: 21px; }
    .dss-principles { gap: 24px; }
}
@media (max-width: 767px) {
    .dss-product-page .happ-desktop-hero h1 { max-width: 16ch; }
    .dss-method { padding: 26px 24px; }
    .dss-product-page .dss-method h2 { font-size: 2.35rem; }
    .dss-method-pairs li { grid-template-columns: 32px minmax(0, 1fr) 32px; gap: 12px; padding-block: 20px; }
    .dss-person { width: 32px; height: 32px; }
    .dss-method-pairs strong { font-size: 13px; }
    .dss-principles { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .dss-principles h3 { max-width: none; font-size: 1.9rem; }
    .dss-principle-number { margin-bottom: 14px; }
    .dss-install-steps li { grid-template-columns: 24px minmax(0, 1fr); gap: 16px; }
}
@media print {
    .dss-method { background: #fff; border: 1px solid #cbbd9f; color: #213a2f; }
    .dss-product-page .dss-method :is(h2, p, strong, span) { color: #213a2f; }
    .dss-person { border-color: #213a2f; }
    .dss-principles > article, .dss-install-steps li { break-inside: avoid; }
}