/* Styles for the generated pages (guides, landing pages, blog, Instagram strip). Reuses shared.css variables. */
.nw-wrap { max-width: 1080px; margin: 0 auto; padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 2rem); }
.nw-wrap h2 { font-family: var(--display); font-weight: 500; font-size: clamp(1.7rem, 3.2vw, 2.4rem); color: var(--parchment); margin: 2.6rem 0 1rem; line-height: 1.15; }
.nw-wrap h3 { font-family: var(--display); font-weight: 500; font-size: 1.35rem; color: var(--gold); margin: 1.8rem 0 .5rem; }
.nw-wrap p, .nw-wrap li { color: var(--sage); line-height: 1.75; font-size: 1.02rem; }
.nw-wrap p { margin: 0 0 1rem; max-width: 70ch; }
.nw-wrap ul, .nw-wrap ol { padding-left: 1.2rem; margin: 0 0 1.2rem; max-width: 70ch; }
.nw-wrap a { color: var(--gold); text-underline-offset: 3px; }
.nw-wrap a:hover { color: var(--parchment); }
.nw-lead { font-size: 1.15rem !important; color: var(--parchment) !important; }
.nw-note { border-left: 2px solid var(--gold-line); padding: .4rem 0 .4rem 1rem; margin: 1.4rem 0; }
.nw-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .8rem; margin: 1.5rem 0 2rem; }
.nw-fact { background: var(--pine); border: 1px solid var(--gold-line); border-radius: var(--radius-sm); padding: .9rem 1rem; }
.nw-fact b { display: block; color: var(--gold); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: .25rem; font-weight: 600; }
.nw-fact span { color: var(--parchment); font-size: 1.05rem; }
.nw-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.1rem; margin: 1.5rem 0 2.5rem; }
.nw-card { display: block; background: var(--pine); border: 1px solid var(--gold-line); border-radius: var(--radius); overflow: hidden; text-decoration: none !important; transition: transform .25s var(--ease-out), border-color .25s; }
.nw-card:hover { transform: translateY(-3px); border-color: var(--gold-border); }
.nw-card img { width: 100%; height: 170px; object-fit: cover; display: block; background: var(--slate); }
.nw-card-body { padding: .9rem 1rem 1.1rem; }
.nw-card-name { color: var(--parchment); font-family: var(--display); font-size: 1.25rem; line-height: 1.2; margin: 0 0 .35rem; }
.nw-card-meta { color: var(--sage); font-size: .85rem; margin: 0; }
.nw-card-rating { color: var(--gold); font-size: .85rem; margin-top: .3rem; }
.nw-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: .8rem 0 1.4rem; }
.nw-chip { border: 1px solid var(--gold-line); color: var(--parchment); border-radius: 999px; padding: .3rem .8rem; font-size: .8rem; letter-spacing: .04em; }
.nw-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1.6rem 0; }
.faq details { border-bottom: 1px solid var(--gold-line); padding: .9rem 0; }
.faq summary { cursor: pointer; color: var(--parchment); font-size: 1.05rem; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; float: right; color: var(--gold); }
.faq details[open] summary::after { content: '\2212'; }
.faq p { margin: .7rem 0 0; }
.nw-crumbs { font-size: .8rem; color: var(--sage); margin-bottom: 1rem; }
.nw-crumbs a { color: var(--sage); }
.nw-post-meta { color: var(--sage); font-size: .85rem; margin: -.4rem 0 1.4rem; }
.nw-toc { background: var(--pine); border: 1px solid var(--gold-line); border-radius: var(--radius-sm); padding: 1rem 1.2rem; margin: 1.4rem 0; max-width: 70ch; }
.nw-toc b { color: var(--gold); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }
.nw-toc ul { margin: .6rem 0 0; }
.ig-strip { padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 2rem); max-width: 1180px; margin: 0 auto; }
.ig-strip h2 { font-family: var(--display); font-weight: 500; color: var(--parchment); font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 1rem; }
.ig-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .6rem; }
.ig-grid a { display: block; aspect-ratio: 1; overflow: hidden; border-radius: var(--radius-sm); border: 1px solid var(--gold-line); }
.ig-grid img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media print {
  nav, footer, .nw-actions, .skip-link { display: none !important; }
  body, .nw-wrap, .nw-wrap p, .nw-wrap li, .nw-wrap h2, .nw-wrap h3 { background: #fff !important; color: #111 !important; }
}

/* click-to-play videos (scripts/lib/video.mjs + public/video.js) */
.yt-facade { position: relative; margin: 1.2rem 0; max-width: 760px; }
.yt-link { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--gold-line); background: var(--slate); }
.yt-link img { width: 100%; height: 100%; object-fit: cover; display: block; }
.yt-play { position: absolute; inset: 0; margin: auto; width: 72px; height: 72px; border-radius: 50%; background: rgba(13, 17, 25, .72); border: 2px solid var(--gold); }
.yt-play::after { content: ""; position: absolute; left: 29px; top: 22px; border-style: solid; border-width: 14px 0 14px 22px; border-color: transparent transparent transparent var(--gold); }
.yt-link:hover .yt-play, .yt-link:focus-visible .yt-play { background: rgba(13, 17, 25, .9); }
.yt-frame { width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--gold-line); border-radius: var(--radius); display: block; }
.yt-cap { margin: .45rem 0 0; font-size: .9rem; opacity: .85; }
.yt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; }
.yt-grid .yt-facade { margin: 0; max-width: none; }
@media print { .yt-facade { display: none !important; } }