/* 404ai / approved direction 01 — Hairline, 2026-10-21.
   Opt-in by linking this file after page CSS. No global palette or layout reset.
   Photos, screenshots, 3D scenes, charts and bespoke dark sections are preserved. */

/* 01 / Shared navigation. Keep hit areas; replace the mint fill with a line. */
body .site-header[data-navigation="catalogue"] .dropdown-toggle,
body .site-header[data-navigation="catalogue"] .nav-links>a:not(.nav-blog),
body .site-header[data-navigation="catalogue"] .cn-close{border-radius:0!important}
body .site-header[data-navigation="catalogue"] .dropdown-toggle:hover,
body .site-header[data-navigation="catalogue"] .nav-links>a:not(.nav-blog):hover{
 background:linear-gradient(#aebbb2,#aebbb2) 12px calc(100% - 4px)/calc(100% - 24px) 1px no-repeat!important;
 color:#1a211d!important;
}
body .site-header[data-navigation="catalogue"] .dropdown-toggle[aria-expanded="true"],
body .site-header[data-navigation="catalogue"] .dropdown-toggle.active,
body .site-header[data-navigation="catalogue"] .nav-links>a[aria-current="page"]{
 background:linear-gradient(#087a52,#087a52) 12px calc(100% - 4px)/calc(100% - 24px) 1px no-repeat!important;
 color:#1a211d!important;
}
body .site-header[data-navigation="catalogue"] .cn-close:hover{background:transparent!important;color:#1a211d!important}
body .site-header[data-navigation="catalogue"] .cn-link,
body .mobile-menu[data-navigation="catalogue"] .cn-link{border-radius:0!important}
body .site-header[data-navigation="catalogue"] .cn-link:hover,
body .site-header[data-navigation="catalogue"] .cn-link:focus-visible,
body .mobile-menu[data-navigation="catalogue"] .cn-link:hover,
body .mobile-menu[data-navigation="catalogue"] .cn-link:focus-visible{background:#f8f9f7!important}
body .site-header[data-navigation="catalogue"] .cn-link.cn-selected,
body .mobile-menu[data-navigation="catalogue"] .cn-link:is(.cn-selected,[aria-current="page"],.active){
 background:linear-gradient(#087a52,#087a52) left center/2px calc(100% - 32px) no-repeat!important;
 box-shadow:inset 0 1px #dfe5e1,inset 0 -1px #dfe5e1;
 color:#1a211d!important;
}
body .mobile-menu[data-navigation="catalogue"] .m-acc[aria-expanded="true"]{
 background:transparent!important;color:#1a211d!important;box-shadow:inset 0 -1px #087a52;border-radius:0!important;
}

/* 02 / Menu feature: paper rather than a dark green block. Artwork stays intact. */
body .site-header[data-navigation="catalogue"] .cn-preview{
 background:#fff!important;border-color:#ccd5ce!important;border-radius:0!important;color:#1a211d!important;box-shadow:none!important;
}
body .site-header[data-navigation="catalogue"] .cn-preview h3{color:#1a211d!important}
body .site-header[data-navigation="catalogue"] .cn-preview p{color:#606b63!important}
body .site-header[data-navigation="catalogue"] .cn-preview-label{color:#087a52!important}
body .site-header[data-navigation="catalogue"] .cn-path{color:#52675a!important;border-top-color:#dfe5e1!important}
body .site-header[data-navigation="catalogue"] .cn-path i{color:#087a52!important}
body .site-header[data-navigation="catalogue"] .cn-preview-link{color:#1a211d!important}

/* 03 / Known light-surface selectors only; never a global .active override. */
body.ed :is(.blog-filter-btn,.quiz-opt,.nz-chip){border-radius:0!important}
body.ed :is(.blog-filter-btn.active,.quiz-opt[aria-pressed="true"],.nz-chip[aria-pressed="true"],.tab-btn.active){
 background:#fff!important;color:#1a211d!important;border-color:#aebbb2!important;box-shadow:inset 0 -2px #087a52!important;
}
body.ed :is(.blog-filter-btn,.quiz-opt,.nz-chip):hover{
 background:#fafbf9!important;color:#1a211d!important;border-color:#aebbb2!important;
}
body.ed .quiz-q.invalid .quiz-opt{border-color:var(--stop,#b3402a)!important}
body.ed .quiz-opt[aria-pressed="true"]:hover{box-shadow:inset 0 -2px #087a52!important}
body[data-home-concept] .hv-direction-tabs [aria-selected="true"],
body[data-home-concept] .hv-crm-steps [aria-selected="true"]{
 background:#fff!important;color:#1a211d!important;border-color:#bdc8bf!important;box-shadow:inset 0 -2px #087a52!important;border-radius:0!important;
}
body[data-home-concept] .h3-route-tabs button[aria-selected="true"]{background:transparent!important;color:#1a211d!important}
/* Keep the complete tab family linear, not only its selected member. */
body.ed.ads-page .ads-tabs button,body .ws-route-tabs button,
body .pr-cinematic .pr-format-menu button,
body[data-home-concept] .hv-direction-tabs button,body[data-home-concept] .hv-crm-steps button{
 border-radius:0!important;border-width:0 0 1px!important;background:transparent!important;
 border-color:#dfe5e1!important;color:#606b63!important;box-shadow:none!important;
}
body.ed.ads-page .ads-tabs button[aria-selected="true"],
body .ws-route-tabs button[aria-pressed="true"]{
 background:#fff!important;color:#1a211d!important;border-color:#aebbb2!important;box-shadow:inset 0 -2px #087a52!important;border-radius:0!important;
}
body .pr-cinematic .pr-format-menu button[aria-pressed="true"]{
 background:transparent!important;color:#1a211d!important;box-shadow:inset 0 -1px #087a52!important;border-radius:0!important;
}
body #products[data-product-accordion] #pa-product-nav button[aria-pressed="true"]{
 color:#1a211d!important;border-color:#087a52!important;background:transparent!important;
}
body #products[data-product-accordion] #pa-product-nav button[aria-pressed="true"] span{color:#087a52!important}

/* 04 / Primary actions: graphite. Secondary white actions remain visible on dark bands. */
body.ed :is(.btn-mint,.btn-em),
body.ed .lead-submit .btn-dark,
body.ed .cl-score .btn-dark,
body.ed .cf-art .cf-final-form .btn-dark,
body .site-header[data-navigation="catalogue"] .nav-right>.btn{
 background:#1a211d!important;color:#fff!important;border-color:#1a211d!important;
}
body.ed :is(.btn-mint,.btn-em):hover,
body.ed .lead-submit .btn-dark:hover,
body.ed .cl-score .btn-dark:hover,
body.ed .cf-art .cf-final-form .btn-dark:hover,
body .site-header[data-navigation="catalogue"] .nav-right>.btn:hover{
 background:#303a33!important;color:#fff!important;border-color:#303a33!important;
}
body.ed .btn-white{background:#fff!important;color:#1a211d!important;border-color:#aebbb2!important;box-shadow:inset 0 0 0 1px #aebbb2}
body.ed .btn-white:hover{background:#f7f9f6!important;color:#1a211d!important;border-color:#87988b!important}

/* 05 / Semantic feedback: the check/text still carries success, not the fill alone. */
body.ed .form-success{background:#fff!important;color:#1a211d!important;box-shadow:inset 0 1px #b9cabe,inset 0 -1px #b9cabe}
body.ed .form-success-ic{background:transparent!important;box-shadow:inset 0 0 0 1px #b9cabe}
body.ed .form-success h3{color:#1a211d!important}
body.ed .form-success p{color:#606b63!important}
body.ed :is(.plan-badge,.plan-rr,.ph-chip-accent){
 background:#fff!important;color:#087a52!important;box-shadow:inset 0 0 0 1px #b9cabe;border-radius:0!important;
}
body.ed .plan.featured{background:#fff!important;border-color:#b9c6bd!important;box-shadow:inset 0 2px #087a52}
body .pr-selected-plan{background:#fff!important;box-shadow:inset 0 -1px #087a52}
/* Native checkbox/radio/switch and range thumbs intentionally retain their small semantic accent. */

/* 06 / Editorial tables and FAQ. Do not target arbitrary table or dashboard cells. */
body.ed .compare-table :is(th:nth-child(3),td:nth-child(3)),
body.ed .cmp-table :is(th:last-child,td.cmp-win),
body.ed .article-table td.hl,
body.theme-seo .gs-table td.hl,
body.theme-seo .gs-table--ai tbody td:nth-child(3),
body.theme-coach .co-table--cmp td.co-win,
body .pr-price-table tr>:nth-child(3){
 background:#fff!important;color:#1a211d!important;box-shadow:inset 0 -1px #b5c7ba;
}
body.ed .compare-table tr:hover td{background:#f8f9f7!important}
body.ed .compare-table tr:hover td:nth-child(3){background:#f8f9f7!important}
body.ed .faq-item.open,
body.theme-seo .faq-item.open{background:#fff!important;box-shadow:inset 0 1px #b9cabe,inset 0 -1px #dfe5e1;border-radius:0!important}
body.ed .faq-i summary::after{background:transparent!important;box-shadow:inset 0 0 0 1px #b9cabe}

/* 07 / Guard dark contexts. Only the named light-control families above are affected. */
body.ed :is(.roi,.security,.sec-security,.cta-big,.cl-score,.footer,.site-footer) :is(.tab-btn.active,.blog-filter-btn.active,.nz-chip[aria-pressed="true"]){
 background:transparent!important;color:#fff!important;box-shadow:inset 0 -2px #8dd4b3!important;border-color:#a8c4b3!important;
}

/* 08 / Keyboard focus is stronger than the decorative 1px selected line. */
body :is(.site-header,.mobile-menu) :is(button,a):focus-visible,
body.ed :is(.blog-filter-btn,.quiz-opt,.nz-chip,.tab-btn,.btn,.hv-direction-tabs button,.hv-crm-steps button,.h3-route-tabs button,.ads-tabs button,.ws-route-tabs button,.pr-format-menu button):focus-visible,
body #pa-product-nav button:focus-visible{
 outline:2px solid #087a52!important;outline-offset:4px!important;
}
@media(prefers-reduced-motion:reduce){
 body :is(.site-header,.mobile-menu) :is(.dropdown-toggle,.cn-link,.cn-chevron),
 body.ed :is(.blog-filter-btn,.quiz-opt,.nz-chip,.tab-btn){transition:none!important;animation:none!important}
}
