/**
 * Copyright (c) 2026 DNA Genics, S.L. All rights reserved.
 * Heritage ancestry guides: native navigation, reference material and reading surfaces.
 */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@400;500;600;700&display=swap');
.hg-page { --hg-nav:var(--nav-height,var(--navbar-height,72px)); padding-top:calc(var(--hg-nav) + 8px); padding-bottom:56px; min-width:0; font:400 max(1rem,16px)/1.8 var(--hd-sans); }
.hg-page *, .hg-page *::before, .hg-page *::after { box-sizing:border-box; }
.hg-page [hidden] { display:none !important; }
.hg-page :where(section) { padding:0; }
.hg-page :is(h1,h2,h3,h4,p,a,span,summary,li) { overflow-wrap:anywhere; }
.hg-page [id] { scroll-margin-top:calc(var(--hg-nav) + 20px); }
.hg-page :is(a,button,input,summary,[tabindex]):focus-visible { outline:3px solid #92723b; outline-offset:4px; }
.hg-page a:not(.hg-skip,.hd-btn):is(:hover,:focus) { color:var(--hd-primary); text-decoration:underline; text-underline-offset:4px; }
.hg-page .hd-eyebrow { color:#876a36; font-size:.68em; margin-bottom:12px; }
.hg-page .dna-icon { width:17px; height:17px; flex-shrink:0; }
.hg-container { max-width:1440px; width:100%; margin-inline:auto; padding-inline:clamp(18px,4vw,56px); }
.hg-skip { position:fixed; top:-120px; left:16px; z-index:2000; color:#fff; background:var(--hd-primary); padding:12px 18px; border-radius:8px; }
.hg-skip:focus { top:12px; color:#fff; }
.hg-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:14px 0; color:var(--hd-muted); font-size:.76em; }
.hg-breadcrumb a { color:var(--hd-primary); text-decoration:underline; text-underline-offset:3px; }
.hg-hero { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,1fr); align-items:center; gap:clamp(28px,6vw,80px); padding:24px 0 42px; }
.hg-hero h1 { font:500 clamp(2.8rem,5vw,4.8rem)/1.06 var(--hd-serif); letter-spacing:-.025em; color:var(--hd-primary); margin:0 0 24px; }
.hg-hero > div > p { color:#555a50; margin:0 0 24px; max-width:54ch; }
.hg-page .hd-btn { justify-content:center; min-height:46px; font-size:.85em; padding:12px 20px; gap:12px; }
.hg-page .hd-btn--primary, .hg-page .hd-btn--primary:is(:hover,:focus) { color:#fff; }
.hg-page .hd-btn--sand:is(:hover,:focus) { color:var(--hd-primary); }
.hg-context { background:var(--hd-sand); border:1px solid var(--hd-border); border-radius:var(--hd-radius); padding:clamp(24px,3vw,34px); }
.hg-context h2 { color:var(--hd-primary); font:500 2.1em/1.13 var(--hd-serif); margin:0 0 20px; }
.hg-context p { color:#5e5d52; font-size:.88em; margin:0 0 18px; }
.hg-context > :last-child { margin-bottom:0; }
.hg-context a { display:inline-flex; align-items:center; gap:10px; min-height:44px; color:var(--hd-primary); text-decoration:underline; text-underline-offset:4px; font-size:.82em; }
.hg-reading-layout { display:grid; grid-template-columns:220px minmax(0,1fr); align-items:start; gap:clamp(28px,5vw,68px); border-top:1px solid var(--hd-border); padding-top:32px; }
.hg-index { min-width:0; }
.hg-index nav { display:grid; gap:4px; }
.hg-index nav > a { display:flex; align-items:center; min-height:44px; color:var(--hd-primary); padding:10px 0; border-bottom:1px solid var(--hd-border); text-decoration:none; font-size:.84em; }
.hg-help-link { display:inline-flex; align-items:center; min-height:44px; margin-top:20px; color:var(--hd-primary); font-size:.79em; text-decoration:underline; text-underline-offset:4px; }
.hg-reading { min-width:0; }
.hg-reading :is(h2,h3,h4) { color:var(--hd-primary); }
.hg-reading h2 { font:500 clamp(2rem,3vw,2.65rem)/1.18 var(--hd-serif); letter-spacing:-.01em; margin:0 0 20px; }
.hg-reading h3 { font:600 1.1em/1.5 var(--hd-sans); margin:24px 0 14px; }
.hg-reading h4 { font:600 1em/1.5 var(--hd-sans); margin:0 0 12px; }
.hg-reading p { color:#4f554c; margin:0 0 18px; }
.hg-reading :is(ul,ol) { padding-left:22px; margin:0 0 20px; }
.hg-reading li { color:#4f554c; padding-left:3px; margin-bottom:6px; }
.hg-reading a { color:var(--hd-primary); text-decoration:underline; text-underline-offset:3px; }
.hg-faq-search { background:var(--hd-surface); border:1px solid var(--hd-border); border-radius:12px; padding:22px; margin-bottom:36px; }
.hg-faq-search label { display:block; color:var(--hd-primary); font-size:.84em; font-weight:600; margin:0 0 10px; }
.hg-search-field { display:flex; align-items:center; gap:12px; border:1px solid #cfc4b1; border-radius:8px; padding-left:14px; background:#fff; min-width:0; }
.hg-search-field > .dna-icon { color:#6b7668; }
.hg-search-field input { flex:1; min-width:0; width:100%; border:0; padding:13px 0; background:none; color:var(--hd-ink); font:inherit; font-size:.93em; border-radius:8px; }
.hg-search-field input::-webkit-search-cancel-button { -webkit-appearance:none; }
.hg-search-field button { align-self:stretch; border:0; border-left:1px solid var(--hd-border); background:var(--hd-sand); color:var(--hd-primary); font:600 .8em var(--hd-sans); padding:10px 14px; border-radius:0 7px 7px 0; min-height:44px; cursor:pointer; }
.hg-page .hg-status { color:#626559; font-size:.78em; margin:12px 0 0; }
.hg-empty { background:var(--hd-sand); border-radius:10px; padding:20px; }
.hg-faq-group { margin-bottom:40px; }
.hg-section-heading { margin-bottom:22px; }
.hg-question { border-bottom:1px solid var(--hd-border); }
.hg-question:first-of-type { border-top:1px solid var(--hd-border); }
.hg-question summary { display:flex; align-items:center; justify-content:space-between; gap:20px; color:var(--hd-primary); font-size:1em; line-height:1.65; list-style:none; cursor:pointer; padding:20px 0; min-height:60px; }
.hg-question summary::-webkit-details-marker { display:none; }
.hg-question summary > .dna-icon { width:14px; height:14px; }
.hg-question[open] summary { font-weight:600; }
.hg-question[open] summary > .dna-icon { transform:rotate(180deg); }
.hg-answer { padding:4px 24px 24px 0; }
.hg-answer p { max-width:78ch; }
.hg-answer > :last-child { margin-bottom:0; }
.hg-reference-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 32px; margin:24px 0; }
.hg-reference-list > section { border-left:2px solid var(--hd-sand-strong); padding-left:18px; }
.hg-video { margin:26px 0; }
.hg-video iframe { display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:10px; background:#e8e8df; }
.hg-page figcaption { color:#65675e; font-size:.78em; line-height:1.75; padding-top:12px; }
.hg-reference-map { margin:26px 0; padding:22px; border:1px solid var(--hd-border); border-radius:12px; background:var(--hd-surface); }
.hg-reference-map figcaption { padding:0; margin-bottom:18px; }
.hg-reference-map figcaption strong { display:block; color:var(--hd-primary); font-size:1.12em; }
.hg-reference-map figcaption span { display:block; }
.hg-map { width:100%; height:420px; min-width:0; border-radius:9px; margin-top:18px; background:var(--hd-sand); z-index:0; }
.hg-map .leaflet-container { font-family:var(--hd-sans); }
.hg-article > section { padding:30px 0 !important; border-bottom:1px solid var(--hd-border); }
.hg-guide-intro { max-width:76ch; }
.hg-code { background:#fff; border:1px solid #ded6c8; border-radius:10px; margin:24px 0; overflow:hidden; min-width:0; }
.hg-code > div { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:8px 12px 8px 18px; border-bottom:1px solid var(--hd-border); background:#f2eee6; color:var(--hd-primary); font-size:.8em; }
.hg-code button { display:inline-flex; align-items:center; gap:8px; border:1px solid #cfc4b1; background:#fff; color:var(--hd-primary); border-radius:6px; min-height:44px; padding:10px 14px; font:600 1em var(--hd-sans); cursor:pointer; }
.hg-code pre { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; margin:0; padding:20px; font-size:.875em; line-height:1.85; color:#384c3e; }
.hg-code code { color:inherit; white-space:pre; font:inherit; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.hg-code > .hg-status { padding:0 18px 14px; margin-top:0; }
.hg-code > .hg-status:empty { padding:0; margin:0; }
.hg-copy-field { position:fixed; top:0; left:-9999px; }
.hg-instruction { margin:26px 0; }
.hg-instruction img { display:block; width:100%; height:auto; border:1px solid var(--hd-border); border-radius:10px; background:#fff; }
.hg-note { background:var(--hd-sage); border:1px solid #d5dfd0; border-left:3px solid #789070; border-radius:8px; padding:18px 20px; font-size:.91em; }
.hg-share { margin-top:32px; }
.hg-share-actions, .hg-resources { display:flex; align-items:center; flex-wrap:wrap; gap:12px 24px; }
.hg-share-actions > a, .hg-resources > a { display:inline-flex; align-items:center; min-height:44px; font-size:.82em; }
.hg-resources { margin-top:30px; padding-top:24px; border-top:1px solid var(--hd-border); }
@media (min-width:992px) { .hg-index { position:sticky; top:calc(var(--hg-nav) + 20px); } }
@media (max-width:991px) { .hg-hero { grid-template-columns:minmax(0,1.2fr) minmax(260px,1fr); gap:28px; } .hg-reading-layout { grid-template-columns:minmax(0,1fr); gap:26px; } .hg-index nav { display:flex; align-items:center; flex-wrap:wrap; gap:6px 24px; } .hg-index nav .hd-eyebrow { flex-basis:100%; margin:0; } .hg-index nav > a { border:0; padding:8px 0; } .hg-help-link { margin-top:4px; } }
@media (max-width:767px) { .hg-hero { grid-template-columns:minmax(0,1fr); padding:18px 0 28px; gap:26px; } .hg-hero h1 { font-size:clamp(2.7rem,10vw,4rem); } .hg-reading-layout { padding-top:20px; } .hg-answer { padding-right:0; } .hg-question summary { gap:14px; } .hg-faq-search { padding:18px; } .hg-reference-map { padding:18px; } .hg-map { height:320px; } .hg-page { padding-bottom:32px; } }
@media (max-width:575px) { .hg-reference-list { grid-template-columns:minmax(0,1fr); } .hg-search-field input { font-size:max(1em,16px); } }
@media (prefers-reduced-motion:reduce) { .hg-page *, .hg-page *::before, .hg-page *::after { scroll-behavior:auto !important; transition:none !important; } }
@media print {
    @page { margin:16mm; }
    body:has(.hg-page) :is(#mainNav,.hf-footer,.dng-footer) { display:none !important; }
    .hg-page { padding:0; background:#fff; font-size:11pt; }
    .hg-container { max-width:none; padding:0; }
    .hg-skip, .hg-breadcrumb, .hg-index, .hg-faq-search, .hg-share, .hg-resources, .hg-hero .hd-btn, .hg-code button, .hg-video, .hg-reference-map { display:none !important; }
    .hg-hero, .hg-reading-layout { display:block; }
    .hg-hero h1 { font-size:2.4em; }
    .hg-context { margin-top:18px; border-radius:0; }
    .hg-question::details-content { display:contents; }
    .hg-question .hg-answer { display:block !important; }
    .hg-question summary { padding:16px 0 10px; }
    .hg-question summary > .dna-icon { display:none; }
    .hg-reading h2, .hg-reading h3 { break-after:avoid; }
    .hg-code pre { white-space:pre-wrap; overflow:visible; }
    .hg-code code { white-space:pre-wrap; overflow-wrap:anywhere; }
    .hg-instruction { break-inside:avoid; }
    .hg-page p { orphans:3; widows:3; }
}
