/* BrainyShack 2.0: approved pre-launch refinement, 19 October 2026 */
:root{--bs-backdrop:#F8FAFC;--bs-signature-gradient:linear-gradient(90deg,#0A0932 4%,#101D50 54%,#173D81 100%)}
html,body{background:#F8FAFC}
body.home-preview .design-proof,body.preview-product .showcase-section.bs-gallery{background:#F8FAFC}
body.preview-about .site-header,body.preview-about .migration-hero,body.preview-blog .site-header,body.preview-blog .migration-blog-header,body.preview-catalogue .site-header,body.preview-catalogue .catalogue-hero,body.preview-product .site-header,body.preview-product .detail-hero,body.home-preview .site-header,body.home-preview .hero{background:var(--bs-signature-gradient);box-shadow:none;border:0}
body:not(.home-preview):not(.preview-about):not(.preview-blog):not(.preview-catalogue):not(.preview-product) .site-header{background:var(--bs-signature-gradient);box-shadow:none;border:0}
body .site-header .main-nav a:not(.nav-finder-mobile){color:#E1EBFF}
body .site-header .main-nav a:not(.nav-finder-mobile):hover{color:#68CBFF}
body .site-header .main-nav a[aria-current='page']:not(.nav-finder-mobile){color:#68CBFF}
body .site-header .main-nav a[aria-current='page']:not(.nav-finder-mobile)::after{content:'';display:block;background:#42C9FF}
body .site-header .wordmark img{filter:none}
body .site-header .nav-cta{background:#FFFFFE;color:#0A3D7A;border-color:#86BCE9}
body.preview-about .migration-hero h1{color:#FFFFFE}
body.preview-about .migration-hero h1 em{color:#40C8FF}
body.preview-blog .migration-blog-header h1{color:#FFFFFE;font-size:clamp(42px,5.2vw,68px)}
body.preview-about .migration-hero{padding:clamp(74px,8vw,119px) 0}
body.preview-blog .migration-blog-header{padding:clamp(79px,7vw,111px) 0 clamp(77px,6.5vw,104px)}
body.home-preview .featured-section{padding-top:52px}
@media(max-width:850px){body .site-header .main-nav.open{background:#FFFFFE}body .site-header .main-nav a:not(.nav-finder-mobile){color:#193970}body .site-header .main-nav a[aria-current='page']:not(.nav-finder-mobile){color:#008AFC}body .site-header .main-nav a[aria-current='page']:not(.nav-finder-mobile)::after{display:none}body.home-preview .featured-section{padding-top:43px}}
/* BS 2.0 round-two refinements: navigation, filters and mobile. */
body.home-preview .bs-signature-gallery-card .proof-product-context h3{color:#40C8FF}
@media(min-width:851px){body.home-preview .bs-signature-gallery-card .proof-copy{transform:translateY(-16px)}}
@media(max-width:850px){body.home-preview .bs-signature-gallery-card .proof-copy{transform:translateY(-8px)}}
.bs-filter-mode{display:inline-flex;align-items:center;gap:4px;background:#EBF5FD;border:1px solid #C7E4FB;border-radius:11px;padding:5px}
.bs-filter-mode button{background:transparent;color:#234570;border:1px solid transparent;border-radius:8px;padding:11px 18px;font-size:12px;font-weight:780;cursor:pointer;transition:background .18s,color .18s}
.bs-filter-mode button[aria-selected="true"]{background:#173970;color:#FFFFFE;box-shadow:0 2px 8px rgba(10,9,50,.15)}
.bs-filter-mode button:focus-visible{outline:3px solid #40C8FF;outline-offset:2px}
.filter-sections.bs-filter-sections{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:23px}
.bs-filter-panel{min-height:43px;width:100%}
.bs-filter-panel[hidden]{display:none!important}
@media(max-width:767px){
body.home-preview .hero .hero-grid{min-height:0!important;padding-top:38px!important;padding-bottom:56px!important;align-items:start}
body.home-preview .hero .hero-copy{align-self:start}
body.preview-about .migration-hero{padding-top:38px!important;padding-bottom:58px!important}
body.preview-blog .migration-blog-header{padding-top:38px!important;padding-bottom:58px!important}
body.preview-catalogue .catalogue-hero{padding-top:38px!important;padding-bottom:54px!important}
body.preview-product .detail-hero{padding-top:38px!important}
body.preview-product.preview-legal .legal-hero{padding-top:38px!important}
body.preview-article .migration-article-header{padding-top:38px!important}
.bs-filter-mode{display:flex;width:100%}
.bs-filter-mode button{flex:1;padding:11px 9px;font-size:11px}
.filter-sections.bs-filter-sections{margin-top:18px}
body.home-preview .bs-signature-gallery-card .proof-copy{transform:none;margin-top:-8px}
}

/* BS 2.0 compact catalogue filter: single inline row, no full-width tinted trough */
.bs-filter-compact{display:flex;align-items:center;justify-content:flex-start;gap:12px;flex-wrap:wrap;margin-top:22px;width:100%}
.bs-filter-select-wrap{display:inline-flex;align-items:center;position:relative;flex:0 0 auto}
.bs-filter-select-wrap::after{content:'';position:absolute;right:14px;top:calc(50% - 4px);width:7px;height:7px;border-right:2px solid #173970;border-bottom:2px solid #173970;transform:rotate(45deg);pointer-events:none}
.bs-filter-select-wrap select{appearance:none;-webkit-appearance:none;min-width:167px;min-height:40px;padding:9px 36px 9px 13px;border:1px solid #B9D8EF;border-radius:9px;background:#FFFFFE;color:#173970;font-size:12px;font-weight:760;cursor:pointer;box-shadow:none}
.bs-filter-select-wrap select:hover{border-color:#008AFC}
.bs-filter-select-wrap select:focus-visible{outline:3px solid #40C8FF;outline-offset:2px}
.bs-filter-compact .bs-filter-options{display:flex;align-items:center;flex:0 1 auto;flex-wrap:wrap;min-width:0;width:auto;max-width:100%;background:transparent!important;padding:0!important;border:none!important;box-shadow:none!important}
.bs-filter-compact .bs-filter-options[hidden]{display:none!important}
.bs-filter-compact .bs-filter-options .segmented,.bs-filter-compact .bs-filter-options .area-pills{display:flex;gap:7px;flex-wrap:wrap;align-items:center;width:auto;max-width:100%;background:transparent!important;border:0!important;padding:0!important;margin:0!important;box-shadow:none!important}
.bs-filter-compact .bs-filter-options .segmented button,.bs-filter-compact .bs-filter-options .area-pills button{flex:0 0 auto;border:1px solid #C4DCF0!important;border-radius:8px!important;background:#FFFFFE!important;color:#173970!important;box-shadow:none!important;padding:9px 12px!important;font-size:11px!important;font-weight:740!important;line-height:1.5}
.bs-filter-compact .bs-filter-options .segmented button:hover,.bs-filter-compact .bs-filter-options .area-pills button:hover{border-color:#008AFC!important;color:#006DC9!important}
.bs-filter-compact .bs-filter-options .segmented button.active,.bs-filter-compact .bs-filter-options .area-pills button.active{background:#173970!important;border-color:#173970!important;color:#FFFFFE!important;box-shadow:0 2px 7px rgba(10,9,50,.12)!important}
.bs-filter-compact .bs-filter-options button:focus-visible{outline:3px solid #40C8FF;outline-offset:2px}
@media(max-width:650px){.bs-filter-compact{gap:10px;margin-top:17px}.bs-filter-select-wrap select{min-width:154px}.bs-filter-compact .bs-filter-options .segmented,.bs-filter-compact .bs-filter-options .area-pills{gap:6px}.bs-filter-compact .bs-filter-options .segmented button,.bs-filter-compact .bs-filter-options .area-pills button{padding:8px 10px!important}}

/* BS 2.0 stronger homepage operating-area cards: consistent cyan top accent */
body.home-preview .browse-section .category-tile{border:1px solid #C9DFF5;background:#FFFFFE;box-shadow:0 13px 34px rgba(15,54,111,.085);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
body.home-preview .browse-section .category-tile::before{content:'';display:block;position:absolute;inset:0 0 auto 0;width:100%;height:3px;background:linear-gradient(90deg,#008AFC 0%,#40C8FF 100%);opacity:1;border-radius:15px 15px 0 0;pointer-events:none}
body.home-preview .browse-section .category-tile:hover,body.home-preview .browse-section .category-tile:focus-visible{transform:translateY(-3px);border-color:#65BAF9;box-shadow:0 19px 42px rgba(11,57,129,.14)}
body.home-preview .browse-section .category-icon{background:#E6F5FF;color:#008AFC;box-shadow:inset 0 0 0 1px #D0EAFF}
body.home-preview .browse-section .category-tile small{color:#294A78}
@media(max-width:600px){body.home-preview .browse-section .category-tile::before{height:3px}body.home-preview .browse-section .category-tile{box-shadow:0 9px 23px rgba(15,54,111,.07)}}

/* BS 2.0 product detail section order: Structure Gallery Fit */
/* Existing section content, screenshot galleries and checkout remain untouched. */
body.preview-product .bs-product-depth + .bs-gallery{margin-top:0;padding-top:clamp(56px,5vw,80px);padding-bottom:clamp(60px,5vw,85px)}
body.preview-product .bs-gallery + .bs-fit-section{padding-top:clamp(55px,5vw,76px);padding-bottom:clamp(53px,4.5vw,70px)}
@media(max-width:650px){body.preview-product .bs-product-depth + .bs-gallery{margin-top:0;padding-top:54px;padding-bottom:56px}body.preview-product .bs-gallery + .bs-fit-section{padding-top:49px;padding-bottom:48px}}

/* BS 2.0 cross-site typography and spacing harmonisation — 19 October 2026 */
/* A consistent Inter/system-sans family, hero weight and relative tracking. */
:root{--bs-consistent-font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif}
body,button,input,select,textarea,summary{font-family:var(--bs-consistent-font)}
body :is(.hero h1,.migration-hero h1,.migration-blog-header h1,.catalogue-lead-row h1,.detail-copy h1,.migration-article-header h1){font-family:var(--bs-consistent-font);font-weight:830;letter-spacing:-.045em;line-height:1.1}
body :is(.section-head h2,.migration-section-heading h2,.bs-product-depth h2,.home-editorial .editorial-head h2,.migration-about-catalogue h2,.catalogue-tool h2,.product-faq h2){font-family:var(--bs-consistent-font);font-weight:830;letter-spacing:-.035em;line-height:1.16}
body :is(.hero-lead,.migration-hero p,.migration-blog-header p,.catalogue-lead-row p,.detail-lead){font-family:var(--bs-consistent-font);line-height:1.7}
body.home-preview .hero h1,body.preview-about .migration-hero h1,body.preview-blog .migration-blog-header h1,body.preview-catalogue .catalogue-lead-row h1{font-size:clamp(42px,4.75vw,70px)}
body.preview-product:not(.preview-legal) .detail-copy h1{font-size:clamp(43px,4.65vw,67px)}
/* Hero left edge must follow the site-wide nav/logo shell, not an extra 1150px centering constraint. */
body.preview-about .migration-hero .migration-hero-inner{max-width:none}
/* Product journeys: retain internal card spacing but remove doubled gaps between whole sections. */
body.preview-product:not(.preview-legal) .bs-product-depth{padding-top:clamp(54px,4.7vw,69px);padding-bottom:clamp(33px,3vw,42px)}
body.preview-product:not(.preview-legal) .bs-product-depth + .bs-gallery{margin-top:0;padding-top:clamp(34px,3.1vw,46px);padding-bottom:clamp(36px,3.4vw,49px)}
body.preview-product:not(.preview-legal) .bs-gallery + .bs-fit-section{padding-top:clamp(34px,3.3vw,47px);padding-bottom:clamp(35px,3.2vw,46px)}
body.preview-product:not(.preview-legal) .bs-fit-section + .choice-banner{margin-top:clamp(33px,3.7vw,47px)}
body.preview-product:not(.preview-legal) .choice-banner + .product-faq{padding-top:clamp(56px,5vw,70px)}
body.preview-product:not(.preview-legal) .product-faq + .product-end{margin-top:clamp(53px,4.4vw,69px)}
/* Homepage: preserve spacious cards and their dimensions; rationalise only the transitions. */
body.home-preview .browse-section{padding-top:clamp(58px,5vw,75px);padding-bottom:21px}
body.home-preview .design-proof{margin-top:38px;padding-top:clamp(35px,3.2vw,48px);padding-bottom:clamp(35px,3.2vw,48px)}
body.home-preview .featured-section{padding-top:clamp(38px,3.2vw,49px)}
body.home-preview .finder-spotlight{margin-top:clamp(53px,4vw,65px)}
body.home-preview .home-editorial{padding-top:clamp(58px,4vw,71px)}
body.home-preview .faq-section{padding-top:clamp(64px,5vw,75px)}
/* About Us: balance the opening, principles and catalogue CTA without compressing their cards. */
body.preview-about .migration-about-opening{gap:clamp(28px,4vw,70px);padding-top:clamp(63px,5vw,78px);padding-bottom:clamp(50px,4vw,61px)}
body.preview-about .migration-about-principles{padding-top:clamp(58px,4.5vw,69px);padding-bottom:clamp(56px,4.7vw,73px)}
body.preview-about .migration-about-catalogue{padding-top:clamp(64px,5vw,80px);padding-bottom:clamp(71px,6vw,91px)}
/* Blog index: gently reduce dead space between the navy hero and article cards. */
body.preview-blog .migration-blog-header{padding-bottom:clamp(58px,4.8vw,78px)}
body.preview-blog .migration-blog{padding-top:43px}
/* Tablet home hero: remove the old oversized min-height still active from 768px to 850px. */
@media(min-width:768px) and (max-width:850px){body.home-preview .hero .hero-grid{min-height:0;padding-top:55px;padding-bottom:69px}}
/* Mobile: keep clear section boundaries without repeated large pads. */
@media(max-width:767px){
body.home-preview .browse-section{padding-top:47px;padding-bottom:18px}
body.home-preview .design-proof{margin-top:30px;padding-top:31px;padding-bottom:36px}
body.home-preview .featured-section{padding-top:39px}
body.home-preview .finder-spotlight{margin-top:51px}
body.home-preview .home-editorial{padding-top:53px}
body.home-preview .faq-section{padding-top:62px}
body.preview-about .migration-about-opening{padding-top:51px;padding-bottom:43px;gap:25px}
body.preview-about .migration-about-principles{padding-top:49px;padding-bottom:53px}
body.preview-about .migration-about-catalogue{padding-top:52px;padding-bottom:66px}
body.preview-blog .migration-blog-header{padding-bottom:54px!important}
body.preview-blog .migration-blog{padding-top:34px}
body.preview-product:not(.preview-legal) .bs-product-depth{padding-top:49px;padding-bottom:29px}
body.preview-product:not(.preview-legal) .bs-product-depth + .bs-gallery{padding-top:29px;padding-bottom:33px}
body.preview-product:not(.preview-legal) .bs-gallery + .bs-fit-section{padding-top:36px;padding-bottom:33px}
body.preview-product:not(.preview-legal) .bs-fit-section + .choice-banner{margin-top:33px}
body.preview-product:not(.preview-legal) .choice-banner + .product-faq{padding-top:49px}
body.preview-product:not(.preview-legal) .product-faq + .product-end{margin-top:48px}
}
/* Preserve the original max widths for article reading and legal policy content. */



/* BrainyShack 2.0: full site-wide fade-up trial at 2.2 seconds (layout-safe). */
/* No padding, margin, width, height, position, display or structural changes. */
/* Content remains visible without JavaScript, IntersectionObserver or motion consent. */
@keyframes bs-premium-fade-up {
  0% { opacity:0; translate:0 16px; }
  100% { opacity:1; translate:0 0; }
}
.bs-fade-up-active {
  animation:bs-premium-fade-up 2200ms cubic-bezier(.42,0,.2,1) var(--bs-fade-delay,0ms) both;
}
/* Basic fallback preserves opacity where individual translate is unsupported. */
@supports not (translate:0 1px) {
  @keyframes bs-premium-fade-up {
    0% { opacity:0; }
    100% { opacity:1; }
  }
}
@media (prefers-reduced-motion:reduce) {
  .bs-fade-up-active {
    animation:none!important;
    opacity:1!important;
    translate:none!important;
  }
}

/* BrainyShack 2.0 catalogue footer breathing room restored after preview-note removal */
/* Former catalogue disclaimer provided the footer gap; restore it on the layout container, not on hidden or obsolete content. */
body.preview-catalogue main > .shell{padding-bottom:clamp(62px,5vw,80px)}
@media(max-width:767px){body.preview-catalogue main > .shell{padding-bottom:52px}}


/* BrainyShack 2.0: whole-cover, whole-gallery and opacity-only ticker motion */
/* Animate the existing white product cover frame and navy gallery container together. */
/* Existing children are skipped by the composite selector; there is no nested reveal. */
/* Only the homepage ticker is opacity-only. Preserve its independent 68-second marquee. */
@keyframes bs-premium-ticker-fade{0%{opacity:0}100%{opacity:1}}
body.home-preview .bs-ticker-band.bs-fade-up-active{animation-name:bs-premium-ticker-fade}
@media (prefers-reduced-motion:reduce){body.home-preview .bs-ticker-band.bs-fade-up-active{animation:none!important;opacity:1!important}}


/* BrainyShack 2.0: first-paint hero fades; prevent visible -> hidden -> fade flash. */
/* Synchronous <head> bootstrap adds bs-first-paint-motion BEFORE CSS renders. */
/* Hero visual units animate from their initial paint; the scroll observer skips them. */
html.bs-first-paint-motion body.home-preview .hero .hero-copy,
html.bs-first-paint-motion body.preview-about .migration-hero .migration-hero-inner,
html.bs-first-paint-motion body.preview-blog .migration-blog-header > .shell,
html.bs-first-paint-motion body.preview-catalogue .catalogue-hero > .shell,
html.bs-first-paint-motion body.preview-product .detail-hero .detail-copy,
html.bs-first-paint-motion body.preview-product .detail-hero .detail-cover-box,
html.bs-first-paint-motion body.preview-product .detail-hero .catalogue-breadcrumb,
html.bs-first-paint-motion body.preview-product .detail-assurance,
html.bs-first-paint-motion body.preview-article .migration-article-breadcrumb,
html.bs-first-paint-motion body.preview-article .migration-article-header,
html.bs-first-paint-motion body.preview-article .migration-article-hero,
html.bs-first-paint-motion body.preview-article .migration-article-hero {
  animation:bs-premium-fade-up 2200ms cubic-bezier(.42,0,.2,1) both;
}
html.bs-first-paint-motion body.preview-product .detail-hero .detail-cover-box {
  animation-delay:110ms;
}
html.bs-first-paint-motion body.preview-product .detail-assurance {
  animation-delay:180ms;
}
/* Ticker's container fades opacity-only, leaving its independent marquee intact. */
html.bs-first-paint-motion body.home-preview .bs-ticker-band {
  animation:bs-premium-ticker-fade 2200ms cubic-bezier(.42,0,.2,1) both;
}
@media(prefers-reduced-motion:reduce){
  html.bs-first-paint-motion body.home-preview .hero .hero-copy,
  html.bs-first-paint-motion body.preview-about .migration-hero .migration-hero-inner,
  html.bs-first-paint-motion body.preview-blog .migration-blog-header > .shell,
  html.bs-first-paint-motion body.preview-catalogue .catalogue-hero > .shell,
  html.bs-first-paint-motion body.preview-product .detail-hero .detail-copy,
  html.bs-first-paint-motion body.preview-product .detail-hero .detail-cover-box,
  html.bs-first-paint-motion body.preview-product .detail-hero .catalogue-breadcrumb,
  html.bs-first-paint-motion body.preview-product .detail-assurance,
  html.bs-first-paint-motion body.preview-article .migration-article-breadcrumb,
  html.bs-first-paint-motion body.preview-article .migration-article-header,
  html.bs-first-paint-motion body.preview-article .migration-article-hero,
    html.bs-first-paint-motion body.home-preview .bs-ticker-band {
    animation:none!important;opacity:1!important;translate:none!important;
  }
}


/* BrainyShack 2.0: first-paint preparation for scroll reveals */
/* Scroll targets start invisible before any paint. They keep their original dimensions. */
/* The observer reveals each once; completed elements stay visible. */
html.bs-first-paint-motion body main :is(.category-tile, .product-card, .editorial-card, .migration-post-card, .migration-principles-grid article, .bs-depth-card, .scope-col, .detail-cover-box, .bs-signature-gallery-card, .bs-ticker-band, .finder-spotlight, .finder-strip, .choice-banner, .last-cta, .hero-actions, .hero-proof, .detail-points, .detail-purchase, .bs-depth-modules > span, .proof-points, .catalogue-corner, .filter-row, .bs-filter-compact, .filter-bottom, .migration-article-breadcrumb, .migration-article-hero, .migration-article-body table, .migration-article-body figure, .no-results, .footer-cta, blockquote, figure):not(:where(.hero, .hero *, .detail-hero, .detail-hero *, .detail-assurance, .detail-assurance *, .migration-hero, .migration-hero *, .migration-blog-header, .migration-blog-header *, .catalogue-hero, .catalogue-hero *, .migration-article-breadcrumb, .migration-article-breadcrumb *, .migration-article-header, .migration-article-header *, .migration-article-hero, .migration-article-hero *, .bs-ticker-band, .bs-ticker-band *)):not(.bs-fade-up-active):not(.bs-fade-complete){opacity:0}
html.bs-first-paint-motion body main :is(h1, h2, h3, h4, h5, h6, p, li, img, video, .eyebrow, .micro-label, .article-lede, .migration-article-byline, .bs-keyview-label, .bs-gallery-caption, .detail-price, .detail-preface, a.button, button.button, .inline-arrow, .text-link, .scope-shortcuts, .bs-gallery-controls):not(:where(.hero, .hero *, .detail-hero, .detail-hero *, .detail-assurance, .detail-assurance *, .migration-hero, .migration-hero *, .migration-blog-header, .migration-blog-header *, .catalogue-hero, .catalogue-hero *, .migration-article-breadcrumb, .migration-article-breadcrumb *, .migration-article-header, .migration-article-header *, .migration-article-hero, .migration-article-hero *, .bs-ticker-band, .bs-ticker-band *)):not(:where(.category-tile *, .product-card *, .editorial-card *, .migration-post-card *, .migration-principles-grid article *, .bs-depth-card *, .scope-col *, .detail-cover-box *, .bs-signature-gallery-card *, .bs-ticker-band *, .finder-spotlight *, .finder-strip *, .choice-banner *, .last-cta *, .hero-actions *, .hero-proof *, .detail-points *, .detail-purchase *, .bs-depth-modules > span *, .proof-points *, .catalogue-corner *, .filter-row *, .bs-filter-compact *, .filter-bottom *, .migration-article-breadcrumb *, .migration-article-hero *, .migration-article-body table *, .migration-article-body figure *, .no-results *, .footer-cta *, blockquote *, figure *, li p)):not(.bs-fade-up-active):not(.bs-fade-complete){opacity:0}
@media(prefers-reduced-motion:reduce){html.bs-first-paint-motion body main :is(.category-tile, .product-card, .editorial-card, .migration-post-card, .migration-principles-grid article, .bs-depth-card, .scope-col, .detail-cover-box, .bs-signature-gallery-card, .bs-ticker-band, .finder-spotlight, .finder-strip, .choice-banner, .last-cta, .hero-actions, .hero-proof, .detail-points, .detail-purchase, .bs-depth-modules > span, .proof-points, .catalogue-corner, .filter-row, .bs-filter-compact, .filter-bottom, .migration-article-breadcrumb, .migration-article-hero, .migration-article-body table, .migration-article-body figure, .no-results, .footer-cta, blockquote, figure,h1, h2, h3, h4, h5, h6, p, li, img, video, .eyebrow, .micro-label, .article-lede, .migration-article-byline, .bs-keyview-label, .bs-gallery-caption, .detail-price, .detail-preface, a.button, button.button, .inline-arrow, .text-link, .scope-shortcuts, .bs-gallery-controls){opacity:1!important;animation:none!important;translate:none!important}}


/* BrainyShack 2.0: protect content revealed by interaction */
/* Hidden FAQ bodies, deferred search messages and aria-hidden alternatives must remain functional. */
/* The site animates the surrounding cards, not content that opens later on interaction. */
html.bs-first-paint-motion body main :is(.no-results, .no-results *, details *, [hidden] *, [aria-hidden='true'] *){opacity:1!important}

/* Product scope and key-view pills: fade in individually while preserving existing layout. */