.product-page section[id], #apps {
    scroll-margin-top: 6rem;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.product-page, .quest-intro, .home-apps, .container.product-section {
    max-width: 1160px;
}

.product-page { padding-bottom: 3rem; }

.product-page h1, .product-page h2,
.home-apps h1, .home-apps h2, .product-section h2 {
    margin-top: 0;
    line-height: 1.15;
    letter-spacing: -0.035em;
}

.product-eyebrow {
    color: var(--primary);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.quest-intro { padding-top: 2rem; text-align: center; }
.quest-intro p { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0; color: var(--text-muted); font-size: 0.95rem; }
.quest-intro p::before, .quest-intro p::after { content: ''; flex: 0 0 24px; height: 1px; background: currentColor; opacity: 0.3; }
.product-lead { color: var(--text-muted); font-size: 1.1rem; line-height: 1.7; max-width: 570px; }
.product-section { padding-top: 3rem; padding-bottom: 1.5rem; }
.product-section-heading { margin-bottom: 1.5rem; }
.product-section-heading h1, .product-section-heading h2 { font-size: 2rem; }
.home-apps { padding-top: 2rem; }

.home-product { min-width: 0; text-align: left; overflow: hidden; padding: 2rem 2rem 0; display: flex; flex-direction: column; }
.home-product-heading { display: flex; align-items: center; gap: 0.85rem; }
.home-product-heading .product-eyebrow { font-size: 0.65rem; margin-bottom: 0.25rem; }
.home-product-heading h2 { font-size: 1.65rem; }
.home-product-link, .home-product-link:hover { color: inherit; }
.home-product-link::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: var(--radius-modal); }
.home-product-link:focus-visible { outline: none; }
.home-product-link:focus-visible::after { outline: 2px solid var(--primary); outline-offset: -4px; }
.home-product-art { --art-shift: 12%; display: block; max-width: 390px; width: 100%; margin: 1.5rem auto 2rem; }
.home-product-art .app-illustration--jackked { transform: translateX(calc(-1 * var(--art-shift))); }
.home-product-art .app-illustration--crackked { transform: translateX(var(--art-shift)); }
.app-illustration { --illustration-skin: #d5a181; width: 100%; height: auto; display: block; }
.app-illustration .illustration-skin { fill: var(--illustration-skin); }
.home-product-copy { padding-bottom: 2rem; margin-top: auto; }
.home-product-copy p { color: var(--text-muted); min-height: 3.2em; font-size: 0.95rem; }
.home-product-copy .product-store-links { justify-content: center; margin: 1.5rem 0 0; }
.home-product-copy .store-link { z-index: 2; }

.product-hero { display: grid; grid-template-columns: 1.12fr 1fr; align-items: center; gap: 2.5rem; padding: 2rem 0 1rem; }
.product-hero h1 { font-size: clamp(2.75rem, 5vw, 4rem); max-width: 600px; margin-bottom: 1.25rem; line-height: 1.05; letter-spacing: -0.055em; text-wrap: balance; }
.product-hero-art { max-width: 400px; justify-self: center; width: 100%; }
.product-store-links { justify-content: flex-start; margin: 1.75rem 0 1.25rem; gap: 0.75rem; }
.product-store-links img { object-fit: contain; }
.product-hero-copy .product-fineprint { max-width: 400px; }
.product-walkthrough { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.product-step { min-width: 0; display: flex; flex-direction: column; }
.product-step-copy { flex: 1; padding-right: 0.5rem; }
.product-step h2 { font-size: 1.3rem; margin: 0 0 0.8rem; }
.product-step p { color: var(--text-muted); font-size: 0.9rem; }
.product-screen { display: block; max-width: 245px; width: 100%; margin: 1.5rem auto 0; border-radius: var(--radius-standard); overflow: hidden; }
.product-screen img { width: 100%; height: auto; display: block; }
.product-reference { margin: 1.5rem 0 0; }

.product-pricing { border: 1px solid var(--glass-border); border-radius: var(--radius-modal); overflow: hidden; background: var(--glass); }
.pricing-table { width: 100%; margin: 0; table-layout: fixed; border-collapse: collapse; }
.pricing-table col:first-child { width: 44%; }
.pricing-table .premium-column { background: color-mix(in srgb, var(--primary) 9%, transparent); }
.pricing-table th, .pricing-table td { padding: 0.85rem 1rem; border-bottom: 1px solid var(--glass-border); text-transform: none; letter-spacing: 0; }
.pricing-table th[scope='row'] { color: var(--text); font-size: 0.88rem; font-weight: 400; }
.pricing-table td, .pricing-table th[scope='col'] { text-align: center; font-size: 0.9rem; }
.pricing-table thead th { padding-block: 1.25rem; color: var(--text); }
.pricing-table thead th:first-child { text-align: left; }
.pricing-table thead th:last-child { color: var(--primary); }
.pricing-table tbody tr:last-child > * { border-bottom: 0; }
.plan-check { color: var(--primary); font-size: 1.1rem; font-weight: 600; }
.plan-unavailable { color: var(--text-muted); }
.product-fineprint { color: var(--text-muted); font-size: 0.78rem; line-height: 1.6; }

.product-faqs details { border-top: 1px solid var(--glass-border); }
.product-faqs details:last-child { border-bottom: 1px solid var(--glass-border); }
.product-faqs summary { cursor: pointer; font-size: 1rem; font-weight: 500; padding: 1.25rem 2rem 1.25rem 0; list-style: none; position: relative; }
.product-faqs summary::-webkit-details-marker { display: none; }
.product-faqs summary::after { content: '+'; position: absolute; right: 0; color: var(--primary); }
.product-faqs details[open] summary::after { content: '−'; }
.product-faqs p { color: var(--text-muted); font-size: 0.9rem; padding-right: 1.5rem; padding-bottom: 0.5rem; }
:where(.product-page, .home-apps, .product-section) a:focus-visible,
.product-faqs summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 5px; }

@media (max-width: 1100px) {
    .home-product-art { --art-shift: 6%; }
}

@media (min-width: 769px) and (max-width: 900px) {
    .nav-links { gap: 1.25rem; }
    .nav-menu { gap: 1.5rem; }
}

@media (max-width: 900px) {
    .product-hero { gap: 1.5rem; }
    .product-hero h1 { font-size: 3rem; }
    .product-hero .product-lead { font-size: 1rem; }
    .product-walkthrough { gap: 1rem; }
}

@media (max-width: 700px) {
    .home-product { padding: 1.5rem 1.5rem 0; }
    .home-product-art { max-width: 340px; }
    .home-product-copy p { min-height: 0; }
    .product-hero { grid-template-columns: 1fr; gap: 1.5rem; }
    .product-hero h1 { font-size: clamp(2.5rem, 9vw, 3.5rem); }
    .product-hero-art { max-width: 320px; }
    .product-walkthrough { grid-template-columns: 1fr; gap: 2.5rem; }
    .product-step { display: grid; grid-template-columns: 1fr 0.9fr; gap: 1rem; align-items: center; }
    .product-step-copy { padding: 0; }
    .product-step h2 { font-size: 1.2rem; }
    .product-step p { font-size: 0.85rem; }
    .product-screen { margin-top: 0; }
    .pricing-table col:first-child { width: 38%; }
    .pricing-table th, .pricing-table td, .pricing-table th[scope] { padding: 0.75rem 0.4rem; font-size: 0.75rem; }
}

@media (max-width: 380px) {
    .product-page, .quest-intro, .home-apps, .container.product-section { padding-left: 0.5rem; padding-right: 0.5rem; }
    .product-step { grid-template-columns: 1fr; }
    .product-screen { max-width: 220px; }
    .pricing-table th, .pricing-table td, .pricing-table th[scope] { padding-inline: 0.3rem; font-size: 0.7rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .product-page *, .home-apps * { transition: none; }
}
