/**
 * Copyright (c) 2026 DNA Genics, S.L. All rights reserved.
 * Premium Heritage discovery, free-tool collection and focused Studio offers.
 */
.studio-page { --hd-muted: #51594f; overflow-wrap: anywhere; }
.studio-page [hidden] { display: none !important; }
.stp-hero { padding: 48px 0 52px; }
.stp-hero-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: clamp(36px, 6vw, 88px); }
.stp-hero-layout > * { min-width: 0; }
.studio-page .stp-hero h1 { font-size: clamp(3.7rem, 6.2vw, 6rem); line-height: .98; letter-spacing: -.045em; margin-bottom: 26px; }
.stp-lead { max-width: 49ch; font-size: 1.05rem; line-height: 1.85; margin-bottom: 26px; }
.studio-page .stp-premium-link { margin-top: 12px; }
.studio-page .stp-note { max-width: 57ch; margin: 16px 0 0; font-size: .8rem; line-height: 1.8; }
.stp-field-guide { border: 1px solid #d8cdb8; background: #efe6d6; border-radius: 3px 3px 18px 3px; box-shadow: 12px 12px 0 #ede8de; }
.stp-guide-masthead { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 20px 28px; border-bottom: 1px solid #d8cdb8; color: #52604e; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.stp-guide-body { padding: 30px 32px 0; }
.studio-page .stp-guide-body h2 { font-size: clamp(2.3rem, 3.3vw, 3.1rem); letter-spacing: -.03em; line-height: 1.05; margin-bottom: 24px; }
.stp-guide-body > a { display: flex; align-items: center; gap: 18px; min-height: 94px; padding: 18px 0; border-top: 1px solid #d8cdb8; text-decoration: none; }
.stp-guide-body > a:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.stp-guide-number { font: 500 1.5rem var(--hd-serif); color: #715c34; }
.stp-guide-body > a > div { flex: 1; min-width: 0; }
.stp-guide-body strong { display: block; font-size: .9rem; font-weight: 600; }
.stp-guide-body div > span { display: block; margin-top: 6px; color: #51594f; font-size: .78rem; line-height: 1.6; }
.studio-page .stp-guide-caption { padding: 20px 32px; margin: 0; border-top: 1px solid #d8cdb8; font-size: .75rem; line-height: 1.7; }
.stp-access-strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 28px 0; border-block: 1px solid var(--hd-border); }
.stp-access-strip > div { min-width: 0; padding-right: 48px; }
.stp-access-strip > div + div { border-left: 1px solid var(--hd-border); padding: 0 0 0 48px; }
.stp-access-strip dt { font: 500 1.65rem/1.15 var(--hd-serif); margin-bottom: 10px; }
.stp-access-strip dd { color: #51594f; font-size: .82rem; line-height: 1.8; max-width: 58ch; }
.stp-search-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid #ddd5c7; padding-bottom: 18px; margin-bottom: 24px; }
.studio-page .stp-search-bar > p { margin: 0; font-size: .8rem; }
.stp-search { margin-bottom: 24px; padding: 24px; background: #efe6d6; border: 1px solid #d8cdb8; border-radius: 8px; }
.stp-search label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 12px; }
.stp-search-controls { display: flex; gap: 10px; }
.stp-search-controls input { flex: 1; min-width: 0; width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid #b7bfae; border-radius: 6px; background: #fff; color: #213a2f; font: inherit; }
.stp-search-controls button { min-height: 48px; min-width: 48px; padding: 10px 14px; border: 1px solid #b7bfae; border-radius: 6px; background: #faf8f4; color: #213a2f; font: 600 .85rem var(--hd-sans); }
.stp-search-controls input:focus-visible { outline: 3px solid #5f7a68; outline-offset: 3px; }
.studio-page #studio-search-status { margin: 14px 0 0; font-size: .8rem; }
.studio-page .stp-empty { padding: 28px; border: 1px solid #d8cdb8; border-radius: 8px; background: #efe6d6; }
.stp-tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.stp-tool { min-width: 0; display: flex; flex-direction: column; padding: 30px; background: #fff; border: 1px solid #e2dbcd; border-radius: 10px; }
.stp-tool-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.studio-page .stp-tool-top > .dna-icon { width: 24px; height: 24px; color: #42604b; }
.stp-badge { color: #31543c; background: #e9eee6; padding: 6px 10px; border: 1px solid #ced8c7; border-radius: 4px; font-size: .7rem; font-weight: 600; letter-spacing: .02em; }
.studio-page .stp-tool h3 { font-size: 2rem; margin-bottom: 14px; }
.stp-tool > p { font-size: .9rem; line-height: 1.8; margin-bottom: 20px; }
.studio-page .stp-tool-needs { padding-top: 18px; border-top: 1px solid #ece6da; font-size: .8rem; margin-bottom: 24px; }
.stp-tool-needs strong { display: block; color: #213a2f; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 7px; }
.stp-tool-links { margin-top: auto; display: flex; align-items: flex-start; flex-direction: column; gap: 2px; }
.stp-launch { display: inline-flex; align-items: center; min-height: 44px; font-size: .8rem; text-decoration: underline; text-underline-offset: 4px; }
.stp-upgrades .hpl-offer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.stp-upgrades .hpl-offer { padding: 28px; }
.stp-upgrades .hpl-offer h3 { font-size: 2.1rem; }
.stp-upgrades .hpl-offer .hpl-button { width: 100%; }
.stp-upgrades .hpl-offer .hpl-eyebrow { font-size: .68rem; }
.stp-upgrades .hpl-offer-grid > :only-child { max-width: 680px; }
.stp-upgrades .hpl-offer-grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.studio-page .hpl-steps li > span { color: #715c34; }
.stp-product-guides { display: flex; flex-wrap: wrap; justify-content: space-between; column-gap: 24px; margin-top: 30px; padding-top: 22px; border-top: 1px solid #d8cdb8; }
.studio-page .stp-ai-note { font-size: .76rem; line-height: 1.8; max-width: 108ch; margin: 20px 0 0; }
.stp-unavailable { padding: 30px; border: 1px solid #d8cdb8; background: #faf8f4; border-radius: 10px; }
.stp-unavailable p { max-width: 74ch; font-size: .9rem; line-height: 1.8; }
.stp-data-note { display: flex; gap: 22px; margin-top: 44px; padding: 28px; border: 1px solid #d8dfd1; border-radius: 10px; background: #e9eee6; }
.studio-page .stp-data-note > .dna-icon { width: 26px; height: 26px; margin-top: 4px; }
.stp-data-note > div { min-width: 0; }
.studio-page .stp-data-note h3 { font-size: 1.75rem; }
.studio-page .stp-data-note p { font-size: .85rem; line-height: 1.85; margin-bottom: 4px; max-width: 92ch; }
.stp-data-note p a { text-decoration: underline; text-underline-offset: 3px; }
.stp-applications { background: #eeece5; }
.stp-app-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 90px); }
.stp-app-layout > div { min-width: 0; }
.stp-app-layout > div > p { font-size: .95rem; line-height: 1.85; max-width: 44ch; }
.stp-app-list > a { display: flex; align-items: center; gap: 24px; padding: 22px 0; border-top: 1px solid #d2caba; text-decoration: none; }
.stp-app-list > a:last-child { border-bottom: 1px solid #d2caba; }
.stp-app-list > a > div { flex: 1; min-width: 0; }
.stp-app-list div > span { display: block; color: #715c34; font-size: .7rem; font-weight: 600; letter-spacing: .035em; margin-bottom: 8px; }
.stp-app-list strong { font: 500 1.6rem/1.2 var(--hd-serif); }
.studio-page .stp-app-list p { font-size: .8rem; line-height: 1.7; margin: 10px 0 0; }
.stp-app-list > a:hover strong { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 1100px) {
    .stp-upgrades .hpl-offer-grid { grid-template-columns: 1fr; }
    .stp-upgrades .hpl-offer-grid:has(> :nth-child(2):last-child) { grid-template-columns: 1fr; }
    .stp-upgrades .hpl-offer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 32px; }
    .stp-upgrades .hpl-offer > :is(.hpl-eyebrow,h3,p:not(.hpl-offer-price)) { grid-column: 1; }
    .stp-upgrades .hpl-offer > .hpl-offer-price { grid-column: 2; grid-row: 1 / 3; align-self: start; margin-top: 0; }
    .stp-upgrades .hpl-offer > ul { grid-column: 2; grid-row: 3 / 5; }
    .stp-upgrades .hpl-offer > .hpl-button { grid-column: 1 / -1; justify-self: start; width: auto; }
}
@media (max-width: 900px) {
    .stp-hero-layout { grid-template-columns: 1fr; gap: 36px; }
    .stp-hero-layout > div { max-width: 690px; }
    .studio-page .stp-hero h1 { font-size: clamp(3.6rem, 8vw, 5rem); }
    .stp-field-guide { max-width: 680px; width: calc(100% - 12px); }
    .stp-access-strip > div { padding-right: 24px; }
    .stp-access-strip > div + div { padding-left: 24px; }
    .stp-app-layout { grid-template-columns: 1fr; }
    .stp-app-layout > div > p { max-width: 62ch; }
}
@media (max-width: 600px) {
    .stp-hero { padding: 26px 0 36px; }
    .studio-page .stp-hero h1 { font-size: clamp(3.3rem, 13vw, 4.4rem); }
    .stp-lead { font-size: 1rem; }
    .stp-hero .hpl-actions { flex-direction: column; }
    .stp-guide-body { padding: 24px 20px 0; }
    .stp-guide-masthead { padding: 16px 20px; font-size: .65rem; }
    .studio-page .stp-guide-caption { padding: 18px 20px; }
    .stp-guide-body > a { gap: 14px; }
    .stp-access-strip { grid-template-columns: 1fr; gap: 22px; }
    .stp-access-strip > div, .stp-access-strip > div + div { padding: 0; border: 0; }
    .stp-access-strip > div + div { border-top: 1px solid var(--hd-border); padding-top: 22px; }
    .stp-search-bar { flex-direction: column; align-items: flex-start; }
    .stp-search { padding: 18px; }
    .stp-search-controls { flex-wrap: wrap; }
    .stp-search-controls input { flex-basis: 100%; }
    .stp-tool-grid { grid-template-columns: 1fr; gap: 18px; }
    .stp-tool { padding: 24px; }
    .stp-upgrades .hpl-offer { display: flex; padding: 24px; }
    .stp-upgrades .hpl-offer .hpl-button { width: 100%; }
    .stp-upgrades .hpl-offer > .hpl-offer-price { margin: 10px 0 22px; }
    .stp-data-note { padding: 22px; gap: 14px; }
    .studio-page .stp-data-note > .dna-icon { width: 20px; height: 20px; }
    .stp-product-guides { flex-direction: column; align-items: flex-start; gap: 10px; }
}
