/* ============================================================
   JustPick – Main Stylesheet
   Edit CSS variables in :root to change the whole site palette.
   ============================================================ */

   @import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

   /* ── Variables ──────────────────────────────────────────────── */
   :root {
       /* Brand colours */
       --clr-primary:       #132e59;
       --clr-primary-dark:  #0d1f3c;
       --clr-primary-light: #e8eef7;
       --clr-accent:        #f59e0b;
       --clr-success:       #10b981;
       --clr-danger:        #ef4444;
   
       /* Neutrals */
       --clr-text:          #1f2937;
       --clr-text-muted:    #6b7280;
       --clr-heading:       #111827;
       --clr-bg:            #ffffff;
       --clr-bg-alt:        #f9fafb;
       --clr-border:        #e5e7eb;
       --clr-border-dark:   #d1d5db;
   
       /* Stars */
       --clr-star-filled:   #f59e0b;
       --clr-star-empty:    #d1d5db;
   
       /* Typography — system font stack, no external font load */
       --font-body:    'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
       --font-heading: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
       --text-base:    1rem;
       --text-sm:      0.875rem;
       --text-xs:      0.75rem;
       --text-lg:      1.125rem;
       --text-xl:      1.25rem;
       --text-2xl:     1.5rem;
       --text-3xl:     1.875rem;
       --text-4xl:     2.25rem;
   
       /* Layout */
       --max-width:     1400px;
       --gutter:        1.5rem;
       --radius:        0.5rem;
       --radius-lg:     1rem;
       --radius-pill:   100px;
   
       /* Shadows */
       --shadow-sm:     0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
       --shadow:        0 4px 12px rgba(0,0,0,.10);
       --shadow-lg:     0 10px 30px rgba(0,0,0,.12);
   
       /* Transitions */
       --transition:    0.2s ease;
   }
   
   /* ── Reset / base ───────────────────────────────────────────── */
   *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
   
   html { font-size: 16px; scroll-behavior: smooth; overflow-x: clip; }
   
   body {
       font-family: var(--font-body);
       font-size: var(--text-base);
       color: var(--clr-text);
       background: var(--clr-bg);
       line-height: 1.65;
       -webkit-font-smoothing: antialiased;
       overflow-x: clip;
   }
   
   img, video { max-width: 100%; height: auto; display: block; }
   
   a { color: var(--clr-primary); text-decoration: none; transition: color var(--transition); }
   a:hover { color: var(--clr-primary-dark); }
   
   h1, h2, h3, h4, h5, h6 {
       font-family: var(--font-heading);
       color: var(--clr-heading);
       line-height: 1.25;
       font-weight: 700;
   }
   
   p { margin-bottom: 1rem; }
   p:last-child { margin-bottom: 0; }
   
   ul, ol { padding-left: 1.25rem; }
   
   /* ── Layout helpers ─────────────────────────────────────────── */
   .container {
       max-width: var(--max-width);
       margin-inline: auto;
       padding-inline: var(--gutter);
   }
   
   .section { padding-block: 7rem; }
   .section--alt { background: var(--clr-bg-alt); }
   
   .text-center { text-align: center; }
   .text-muted   { color: var(--clr-text-muted); }
   
   /* ── Buttons ─────────────────────────────────────────────────── */
   .btn {
       display: inline-flex;
       align-items: center;
       gap: 0.4rem;
       padding: 0.55rem 1.25rem;
       border-radius: var(--radius-pill);
       font-size: var(--text-sm);
       font-weight: 600;
       line-height: 1;
       cursor: pointer;
       border: 2px solid transparent;
       transition: all var(--transition);
       white-space: nowrap;
       text-align: center;
       text-decoration: none;
   }
   
   .btn--primary {
       background: var(--clr-primary);
       color: #fff;
       border-color: var(--clr-primary);
   }
   .btn--primary:hover {
       background: var(--clr-primary-dark);
       border-color: var(--clr-primary-dark);
       color: #fff;
   }
   
   .btn--outline {
       background: transparent;
       color: var(--clr-primary);
       border-color: var(--clr-primary);
   }
   .btn--outline:hover {
       background: var(--clr-primary);
       color: #fff;
   }
   
   .btn--secondary {
       background: var(--clr-bg-alt);
       color: var(--clr-text);
       border-color: var(--clr-border-dark);
   }
   .btn--secondary:hover {
       border-color: var(--clr-primary);
       color: var(--clr-primary);
   }
   
   .btn--sm   { padding: 0.4rem 0.9rem; font-size: var(--text-xs); }
   .btn--lg   { padding: 0.75rem 1.75rem; font-size: var(--text-base); }
   .btn--full { width: 100%; justify-content: center; }
   
   /* ── Badges ──────────────────────────────────────────────────── */
   .badge {
       display: inline-block;
       padding: 0.25rem 0.65rem;
       border-radius: var(--radius-pill);
       font-size: var(--text-xs);
       font-weight: 700;
       letter-spacing: 0.03em;
       text-transform: uppercase;
       line-height: 1;
   }
   .badge--best-overall  { background: #fef3c7; color: #92400e; }
   .badge--best-value    { background: #d1fae5; color: #065f46; }
   .badge--editors-pick  { background: #ede9fe; color: #5b21b6; }
   .badge--best-for      { background: #dbeafe; color: #1e40af; }
   .badge--custom        { background: #f0fdf4; color: #166534; }
   
   /* ── JustPick star rating (.jp-stars) ────────────────────────────────────── */
   /* Renamed from .star-rating to avoid conflict with WooCommerce's own class  */
   .jp-stars {
       display: inline-flex;
       flex-direction: column;
       align-items: center;
       gap: 0.2rem;
   }
   .jp-stars__row {
       display: flex;
       gap: 2px;
       line-height: 1;
   }
   /* SVG stars — fill set directly on SVG in PHP */
   .star { display: inline-block; }
   
   .rating-value {
       font-size: 1.1rem;
       font-weight: 700;
       line-height: 2em;
       color: var(--clr-heading);
   }
   
   /* ── Breadcrumbs ─────────────────────────────────────────────── */
   .breadcrumbs {
       font-size: var(--text-sm);
       color: var(--clr-text-muted);
       padding-block: 1rem;
       display: flex;
       flex-wrap: wrap;
       gap: 0.35rem;
       align-items: center;
   }
   .breadcrumbs a { color: var(--clr-text-muted); }
   .breadcrumbs a:hover { color: var(--clr-primary); }
   .breadcrumbs [aria-current="page"] { color: var(--clr-text); font-weight: 500; }
   .breadcrumb__sep { color: var(--clr-border-dark); }
   
   /* ── Announcement bar ────────────────────────────────────────── */
   .announcement-bar {
       background: var(--clr-primary);
       color: #fff;
       text-align: center;
       padding: 0.5rem var(--gutter);
       font-size: var(--text-sm);
       font-weight: 500;
   }
   .announcement-bar a,
   .announcement-bar__link { color: #fff; text-decoration: underline; }
   
   /* ── Site header ─────────────────────────────────────────────── */
   .site-header {
       position: sticky;
       top: 0;
       z-index: 1000;
       background: var(--clr-bg);
       border-bottom: 1px solid var(--clr-border);
       box-shadow: var(--shadow-sm);
   }
   .site-header__inner {
       position: relative;
       display: flex;
       align-items: center;
       height: 110px;
       padding-top: 20px;
       padding-bottom: 20px;
       box-sizing: border-box;
   }
   
   /* Logo */
   .site-header__logo { flex-shrink: 0; }
   .site-header__logo img,
   .site-header__logo-img { height: 75px; width: auto; }
   .site-header__logo-text {
       font-size: var(--text-xl);
       font-weight: 800;
       color: var(--clr-primary);
   }
   
   /* Nav — positioned right of center to account for logo weight */
   .site-nav {
       position: absolute;
       left: 55%;
       transform: translateX(-50%);
   }
   .site-nav__list {
       display: flex;
       gap: 0.15rem;
       list-style: none;
       padding: 0;
       margin: 0;
   }
   .site-nav__list > li > a {
       display: block;
       padding: 0.5rem 0.9rem;
       font-size: 16px;
       font-weight: 500;
       color: var(--clr-text);
       border-radius: var(--radius);
       transition: background var(--transition), color var(--transition);
       white-space: nowrap;
   }
   .site-nav__list > li > a:hover,
   .site-nav__list > .current-menu-item > a,
   .site-nav__list > .current-menu-ancestor > a {
       background: var(--clr-primary-light);
       color: var(--clr-primary);
   }
   
   /* Dropdown indicator arrow */
   .site-nav__list .menu-item-has-children > a::after {
       content: '';
       display: inline-block;
       width: 6px;
       height: 6px;
       border-right: 1.5px solid currentColor;
       border-bottom: 1.5px solid currentColor;
       transform: rotate(45deg) translateY(-2px);
       margin-left: 5px;
       opacity: 0.6;
       vertical-align: middle;
   }
   
   /* Dropdown menus */
   .site-nav__list .menu-item-has-children { position: relative; }
   .site-nav__list .menu-item-has-children {
       /* Invisible bridge fills the gap so mouse can reach the dropdown */
       padding-bottom: 8px;
       margin-bottom: -8px;
   }
   .site-nav__list .sub-menu {
       display: none;
       position: absolute;
       top: 100%;
       left: 0;
       background: #fff;
       border: 1px solid rgba(0,0,0,0.08);
       border-top: 2px solid var(--clr-primary);
       border-radius: 0 0 10px 10px;
       box-shadow: 0 8px 28px rgba(0,0,0,0.12);
       min-width: 220px;
       list-style: none;
       padding: 0.4rem;
       z-index: 200;
   }
   .site-nav__list .menu-item-has-children:hover > .sub-menu { display: block; }
   .site-nav__list .sub-menu li a {
       display: block;
       padding: 0.55rem 0.9rem;
       font-size: 16px;
       font-weight: 500;
       color: var(--clr-text);
       border-radius: 7px;
       white-space: nowrap;
       transition: background var(--transition), color var(--transition);
   }
   .site-nav__list .sub-menu li a:hover {
       background: var(--clr-primary-light);
       color: var(--clr-primary);
   }
   
   /* Second-level submenu — opens to the right of its parent item */
   .site-nav__list .sub-menu .menu-item-has-children { position: relative; }
   .site-nav__list .sub-menu .sub-menu {
       top: -2px; /* align with parent panel top border */
       left: 100%;
       margin-left: 0;
       margin-top: 0;
       border-top: 2px solid var(--clr-primary);
       border-radius: 0 0 10px 10px;
   }
   /* Arrow indicator for nested items */
   .site-nav__list .sub-menu .menu-item-has-children > a::after {
       content: '';
       display: inline-block;
       width: 5px;
       height: 5px;
       border-right: 1.5px solid currentColor;
       border-bottom: 1.5px solid currentColor;
       transform: rotate(-45deg) translateY(-1px);
       margin-left: 6px;
       opacity: 0.6;
       vertical-align: middle;
       float: right;
       margin-top: 5px;
   }
   
   /* Right-side actions (search + CTA button) */
   .site-header__actions {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       flex-shrink: 0;
       margin-left: auto;
   }
   
   /* CTA button in header — slightly smaller padding than full cards */
   .site-header__btn {
       padding: 0.55rem 1.25rem;
       font-size: 0.85rem;
   }
   
   /* Search toggle */
   .site-header__search { position: relative; }
   .search-toggle {
       background: none;
       border: none;
       cursor: pointer;
       color: var(--clr-text-muted);
       padding: 0.35rem;
       border-radius: var(--radius);
       transition: color var(--transition);
   }
   .search-toggle:hover { color: var(--clr-primary); }
   
   /* Search dropdown box — hidden by default, JS removes [hidden] to show */
   .search-box[hidden] { display: none !important; }
   .search-box {
       position: absolute;
       right: 0;
       top: calc(100% + 0.75rem);
       background: #fff;
       border: 1px solid var(--clr-border);
       border-radius: 50px;
       padding: 0.3rem 0.3rem 0.3rem 1rem;
       box-shadow: 0 6px 24px rgba(0,0,0,0.1);
       min-width: 300px;
       display: flex;
       align-items: center;
       gap: 0.5rem;
   }
   
   /* Hide the default search form wrapper border/bg — we style the box itself */
   .search-box .search-form {
       display: flex;
       align-items: center;
       width: 100%;
       gap: 0.4rem;
   }
   .search-box .search-field {
       flex: 1;
       border: none;
       background: transparent;
       padding: 0.45rem 0;
       font-size: 0.88rem;
       color: var(--clr-text);
       outline: none;
       min-width: 0;
   }
   .search-box .search-field::placeholder { color: #aaa; }
   
   /* Remove browser native clear (×) button on search inputs */
   .search-box .search-field::-webkit-search-cancel-button,
   .search-box .search-field::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }
   
   /* Submit button — circle at the far right with search icon */
   .search-box .search-submit {
       flex-shrink: 0;
       width: 38px;
       height: 38px;
       border-radius: 50%;
       background: var(--clr-primary);
       border: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       transition: background var(--transition);
       font-size: 0;
       color: transparent;
       background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
       background-repeat: no-repeat;
       background-position: center;
       background-size: 16px 16px;
       margin-left: auto;
   }
   .search-box .search-submit:hover { background-color: #0d2244; }
   
   /* Mobile menu toggle */
   .mobile-menu-toggle {
       display: none;
       flex-direction: column;
       gap: 5px;
       background: none;
       border: none;
       cursor: pointer;
       padding: 0.35rem;
       margin-left: auto;
   }
   .hamburger-line {
       display: block;
       width: 24px;
       height: 2px;
       background: var(--clr-text);
       border-radius: 2px;
       transition: transform var(--transition), opacity var(--transition);
   }
   .mobile-menu-toggle.is-active .hamburger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
   .mobile-menu-toggle.is-active .hamburger-line:nth-child(2) { opacity: 0; }
   .mobile-menu-toggle.is-active .hamburger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
   
   /* ── Footer ──────────────────────────────────────────────────── */
   .site-footer { background: #0f1f42; color: #e8ecf2; margin-top: auto; }
   
   .disclosure-bar {
       background: #0a1730;
       border-bottom: 1px solid rgba(255,255,255,0.08);
       padding: 1rem 0;
       font-size: var(--text-xs);
       color: #9ca3af;
   }
   .disclosure-bar a { color: #9ca3af; text-decoration: underline; }
   
   /* ── Footer main 4-column grid ── */
   .footer-main { padding: 100px 0; }
   .footer-main__inner {
       display: grid;
       grid-template-columns: 1.5fr 1fr 1fr 1.4fr;
       gap: 3rem;
       align-items: start;
   }
   
   /* Shared column styles */
   .footer-col__title {
       color: #fff;
       font-size: 1.25rem;
       font-weight: 700;
       margin-bottom: 1.25rem;
       letter-spacing: 0.01em;
   }
   .footer-col__tagline {
       font-size: 1rem;
       color: #8fa3c0;
       line-height: 1.6;
       margin-top: 0.75rem;
       margin-bottom: 0;
   }
   
   /* Col 1 — Brand */
   .footer-logo { display: inline-block; margin-bottom: 0.25rem; }
   .footer-logo__img { max-height: 70px; width: auto; }
   .footer-logo img  { max-height: 70px; filter: brightness(0) invert(1); }
   .footer-logo__text {
       font-size: 1.25rem;
       font-weight: 800;
       color: #fff;
   }
   
   /* Social icons */
   .footer-social {
       display: flex;
       flex-wrap: wrap;
       gap: 0.5rem;
       margin-top: 1.25rem;
   }
   .footer-social__link {
       width: 36px;
       height: 36px;
       border-radius: 50%;
       background: rgba(255,255,255,0.08);
       display: flex;
       align-items: center;
       justify-content: center;
       color: #c5cfe0;
       font-size: 0.95rem;
       text-decoration: none;
       transition: background var(--transition), color var(--transition);
   }
   .footer-social__link:hover {
       background: var(--clr-primary);
       color: #fff;
   }
   
   /* Col 2 — Contact */
   .footer-contact-list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 0.9rem;
   }
   .footer-contact-list__item {
       display: flex;
       align-items: flex-start;
       gap: 0.75rem;
       font-size: 1rem;
       color: #8fa3c0;
       line-height: 1.5;
   }
   .footer-contact-list__icon {
       width: 34px;
       height: 34px;
       border-radius: 50%;
       border: 1px solid rgba(255,255,255,0.12);
       display: flex;
       align-items: center;
       justify-content: center;
       flex-shrink: 0;
       color: #c5cfe0;
       font-size: 0.85rem;
   }
   .footer-contact-list__item a {
       color: #8fa3c0;
       text-decoration: none;
       transition: color var(--transition);
   }
   .footer-contact-list__item a:hover { color: #fff; }
   
   /* Col 3 — Quick Links */
   .footer-col__list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 0.55rem;
   }
   .footer-col__list li a {
       font-size: 1rem;
       color: #8fa3c0;
       text-decoration: none;
       transition: color var(--transition);
   }
   .footer-col__list li a:hover { color: #fff; }
   
   /* Col 4 — Newsletter */
   .footer-newsletter__form { margin-top: 1rem; }
   
   /* Pill wrapper lives on the <p> CF7 outputs */
   .footer-newsletter__form .wpcf7-form {
       margin: 0;
   }
   .footer-newsletter__form .wpcf7-form p {
       display: flex;
       align-items: center;
       position: relative;
       background: rgba(255,255,255,0.07);
       border: 1px solid rgba(255,255,255,0.18);
       border-radius: 50px;
       padding: 4px 4px 4px 1.25rem;
       margin: 0;
       gap: 0;
   }
   .footer-newsletter__form .wpcf7-form br { display: none; }
   .footer-newsletter__form .wpcf7-form-control-wrap {
       flex: 1;
       min-width: 0;
   }
   /* Spinner — take it out of flow so it doesn't push the button */
   .footer-newsletter__form .wpcf7-spinner {
       position: absolute;
       right: 55px;
       top: 50%;
       transform: translateY(-50%);
       margin: 0;
   }
   
   /* Input — transparent inside the pill */
   .footer-newsletter__form input[type="email"],
   .footer-newsletter__form input[type="text"] {
       width: 100%;
       background: transparent;
       border: none;
       padding: 0.6rem 0.5rem 0.6rem 0;
       font-size: 1rem;
       color: #fff;
       outline: none;
       font-family: var(--font-body);
   }
   .footer-newsletter__form input::placeholder { color: rgba(255,255,255,0.45); }
   
   /* Submit — circle button at the right end */
   .footer-newsletter__form input[type="submit"] {
       flex-shrink: 0;
       width: 42px;
       height: 42px;
       border-radius: 50%;
       background-color: var(--clr-primary);
       border: none;
       cursor: pointer;
       font-size: 0;
       color: transparent;
       background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='22' y1='2' x2='11' y2='13'/%3E%3Cpolygon points='22 2 15 22 11 13 2 9 22 2'/%3E%3C/svg%3E");
       background-repeat: no-repeat;
       background-position: center;
       background-size: 15px;
       padding: 0;
       position: static;
       transform: none;
       -webkit-appearance: none;
       appearance: none;
       transition: background-color var(--transition);
   }
   .footer-newsletter__form input[type="submit"]:hover { background-color: #0d2244; }
   
   /* ── Bottom bar ── */
   .footer-bottom {
       background: #091530;
       padding: 1rem 0;
       border-top: 1px solid rgba(255,255,255,0.06);
   }
   .footer-bottom__inner {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 1rem;
       flex-wrap: wrap;
   }
   .footer-bottom__copy { font-size: 1rem; color: #6b7280; margin: 0; }
   .footer-bottom__copy a { color: #9ca3af; text-decoration: none; }
   .footer-bottom__nav .footer-bottom__menu {
       display: flex;
       gap: 1.25rem;
       list-style: none;
       padding: 0;
       margin: 0;
   }
   .footer-bottom__nav .footer-bottom__menu li a {
       font-size: 1rem;
       color: #6b7280;
       text-decoration: none;
       transition: color var(--transition);
   }
   .footer-bottom__nav .footer-bottom__menu li a:hover { color: #fff; }
   
   /* ── Hero slider ─────────────────────────────────────────────── */
   .hero-slider { position: relative; overflow: hidden; }
   
   .hero-slide {
       position: relative;
       height: 720px;
       display: flex;
       align-items: flex-end;  /* content sits at bottom */
       background: var(--clr-primary-dark);
       overflow: hidden;
   }
   
   /* Full-cover background image */
   .hero-slide__bg {
       position: absolute;
       inset: 0;
       object-fit: cover;
       width: 100%;
       height: 100%;
   }
   
   /* Left-weighted gradient overlay — text reads cleanly on the left */
   .hero-slide__overlay {
       position: absolute;
       inset: 0;
       background: linear-gradient(
           90deg,
           rgba(0, 0, 0, 0.70) 0%,
           rgba(0, 0, 0, 0.40) 50%,
           rgba(0, 0, 0, 0.05) 100%
       );
       z-index: 1;
   }
   
   /* Content — left-aligned, pinned to BOTTOM of slide */
   .hero-slide__content {
       position: relative;
       z-index: 2;
       width: 100%;
       display: flex;
       flex-direction: column;
       align-items: flex-start;
   }
   .hero-slide__content .container {
       width: 100%;
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       gap: 0;
       padding-bottom: 56px;
   }
   
   /* Badge pill — white bg, black text */
   .hero-slide__badge-wrap { margin-bottom: 1.1rem; }
   .hero-slide__badge {
       display: inline-block;
       background: rgba(255, 255, 255, 0.92);
       backdrop-filter: blur(4px);
       color: #000;
       font-size: 0.7rem;
       font-weight: 600;
       letter-spacing: 0.1em;
       text-transform: uppercase;
       padding: 0.3rem 0.85rem;
       border-radius: var(--radius-pill);
       border: 1px solid rgba(255, 255, 255, 0.6);
       text-decoration: none;
       transition: background var(--transition);
   }
   .hero-slide__badge:hover {
       background: #fff;
       color: #000;
   }
   
   /* Headline — 42px */
   .hero-slide__headline {
       font-size: 42px;
       font-weight: 700;
       color: #fff;
       line-height: 1.15;
       margin-bottom: 0.9rem;
       max-width: 560px;
       letter-spacing: -0.01em;
   }
   
   /* Description — 16px */
   .hero-slide__subtext {
       font-size: 16px;
       color: rgba(255, 255, 255, 0.78);
       margin-bottom: 2rem;
       max-width: 420px;
       line-height: 1.65;
   }
   
   /* CTA button */
   .hero-slide__cta {
       gap: 0.5rem;
       background: var(--clr-primary);
       border-color: var(--clr-primary);
       margin-bottom: 2.5rem;
   }
   .hero-slide__cta:hover {
       background: var(--clr-primary-dark);
       border-color: var(--clr-primary-dark);
       color: #fff;
   }
   
   /* ── Navigation — sits inline below the CTA, left-aligned ─────── */
   .hero-slide__nav {
       display: flex;
       align-items: center;
       gap: 0.6rem;
   }
   
   /* Arrow buttons — minimal circle style matching the image */
   .hero-nav-btn {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 36px;
       height: 36px;
       border-radius: 50%;
       border: 1.5px solid rgba(255, 255, 255, 0.45);
       background: transparent;
       color: #fff;
       cursor: pointer;
       transition: border-color var(--transition), background var(--transition);
       /* Reset Swiper defaults */
       position: static !important;
       transform: none !important;
       margin: 0 !important;
       flex-shrink: 0;
   }
   .hero-nav-btn::after { display: none; }
   .hero-nav-btn svg { display: block; flex-shrink: 0; }
   .hero-nav-btn:hover {
       border-color: rgba(255, 255, 255, 0.9);
       background: rgba(255, 255, 255, 0.12);
   }
   
   /* Hide Swiper's default nav arrows (we render our own inside the slide) */
   .hero-swiper > .swiper-button-next,
   .hero-swiper > .swiper-button-prev { display: none !important; }
   
   /* Dots — hidden (navigation handled by arrows) */
   .hero-swiper .swiper-pagination { display: none; }
   
   /* ── Marquee strip ────────────────────────────────────────────── */
   .marquee-strip {
       background: transparent;
       padding: 1.25rem 0;
       overflow: hidden;
       white-space: nowrap;
       user-select: none;
       border-top: 1px solid var(--clr-border);
       border-bottom: 1px solid var(--clr-border);
   }
   .marquee-strip__track {
       display: flex;
       width: max-content;
       animation: marquee-scroll 80s linear infinite;
   }
   .marquee-strip:hover .marquee-strip__track { animation-play-state: paused; }
   
   @keyframes marquee-scroll {
       0%   { transform: translateX(0); }
       100% { transform: translateX(-50%); }
   }
   
   .marquee-strip__list {
       display: flex;
       align-items: center;
       list-style: none;
       padding: 0;
       margin: 0;
       flex-shrink: 0;
   }
   
   .marquee-strip__item {
       display: inline-flex;
       align-items: center;
       gap: 0.65rem;
       font-size: 16px;
       font-weight: 500;
       line-height: 24px;
       color: #000;
       padding: 0 2.5rem;
       position: relative;
   }
   
   /* Separator dot — removed */
   
   /* Icon wrapper — pastel circle */
   .marquee-strip__icon {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 30px;
       height: 30px;
       border-radius: 50%;
       flex-shrink: 0;
   }
   .marquee-strip__icon svg { display: block; }
   
   /* ── Top Comparisons (colored category cards) ────────────────── */
   .comparisons-section { background: var(--clr-bg-alt); }
   
   /* Section heading — left-aligned, h3 style */
   .comparisons-section .section-heading { text-align: left; }
   .comparisons-section .section-heading__title {
       font-size: 45px;
       font-weight: 700;
       color: #1E1E1E;
       margin-bottom: 0.5rem;
   }.comparisons-section .section-heading__sub {
       font-size: 18px;
       color: var(--clr-text-muted);
       margin-inline: 0;
   }
   
   .comp-grid {
       display: grid;
       grid-template-columns: repeat(5, 1fr);
       gap: 1.25rem;
   }
   /* On desktop the Swiper wrapper must not override grid layout */
   @media (min-width: 768px) {
       .comp-swiper { overflow: visible !important; }
       .comp-swiper .swiper-wrapper { display: contents !important; }
       .comp-swiper .swiper-slide  { display: block !important; width: auto !important; margin: 0 !important; }
   }
   /* Mobile: one card at a time */
   @media (max-width: 767px) {
       .comp-grid  { display: block; overflow: hidden; }
       .comp-swiper { overflow: hidden; }
       .comp-swiper .swiper-slide { height: auto; }
       .comp-swiper .comp-card    { height: 100%; }
   }
   
   .comp-card {
       position: relative;
       display: flex;
       flex-direction: column;
       justify-content: center;
       min-height: 180px;
       border-radius: var(--radius-lg);
       overflow: hidden;
       background: var(--comp-card-bg, #dbeafe);
       text-decoration: none;
       transition: transform var(--transition), box-shadow var(--transition);
       cursor: pointer;
   }
   .comp-card:hover {
       transform: translateY(-4px);
       box-shadow: var(--shadow-lg);
       color: inherit;
   }
   
   /* Category image — hidden by default, crossfades on hover */
   .comp-card__image {
       position: absolute;
       inset: 0;
       opacity: 0;
       transition: opacity 0.45s ease;
       z-index: 1;
   }
   .comp-card__image img {
       width: 100%;
       height: 100%;
       object-fit: cover;
   }
   .comp-card:hover .comp-card__image { opacity: 1; }
   
   /* Dark overlay — appears with the image for text contrast */
   .comp-card__overlay {
       position: absolute;
       inset: 0;
       background: rgba(0,0,0,0.42);
       opacity: 0;
       transition: opacity 0.45s ease;
       z-index: 2;
   }
   .comp-card:hover .comp-card__overlay { opacity: 1; }
   
   /* Text — always visible, adjusts color on hover */
   .comp-card__body {
       position: relative;
       z-index: 3;
       padding: 1rem 1.1rem 1.25rem;
       transition: color 0.3s ease;
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       flex: 1;
       text-align: center;
   }
   .comp-card__name {
       display: block;
       font-size: 22px;
       font-weight: 600;
       color: var(--clr-heading);
       line-height: 1.25;
       letter-spacing: -0.05em;
       transition: color 0.3s ease;
   }
   .comp-card__count {
       display: block;
       font-size: 16px;
       color: var(--clr-text-muted);
       margin-top: 0.25rem;
       transition: color 0.3s ease;
   }
   .comp-card:hover .comp-card__name  { color: #fff; }
   .comp-card:hover .comp-card__count { color: rgba(255,255,255,0.75); }
   
   /* Arrow icon — bottom-right */
   .comp-card__arrow {
       position: absolute;
       top: 1rem;
       right: 1rem;
       z-index: 3;
       color: var(--clr-text-muted);
       opacity: 0;
       transform: translateX(-6px);
       transition: opacity 0.3s ease, transform 0.3s ease, color 0.3s ease;
   }
   .comp-card:hover .comp-card__arrow {
       opacity: 1;
       transform: translateX(0);
       color: #fff;
   }
   
   /* ── Category grid (homepage + parent category page) ─────────── */
   .category-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 1.5rem;
   }
   .category-grid--5col {
       grid-template-columns: repeat(5, 1fr);
   }
   .category-card {
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       overflow: hidden;
       transition: box-shadow var(--transition), transform var(--transition);
       background: var(--clr-bg);
       text-decoration: none;
       display: flex;
       flex-direction: column;
   }
   .category-card:hover {
       box-shadow: var(--shadow-lg);
       transform: translateY(-3px);
       color: inherit;
   }
   .category-card__image {
       aspect-ratio: 4/3;
       overflow: hidden;
       background: var(--clr-bg-alt);
   }
   .category-card__image img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       transition: transform 0.35s ease;
   }
   .category-card:hover .category-card__image img { transform: scale(1.05); }
   .category-card__body {
       padding: 1rem 1.1rem 1.25rem;
       flex: 1;
       display: flex;
       flex-direction: column;
       gap: 0.35rem;
   }
   .category-card__title {
       font-size: var(--text-base);
       font-weight: 700;
       color: var(--clr-heading);
   }
   .category-card__count {
       font-size: var(--text-xs);
       color: var(--clr-text-muted);
   }
   
   /* ── Product card (comparison page) ─────────────────────────── */
   .product-list { display: flex; flex-direction: column; gap: 1.25rem; }
   
   .product-card {
       display: grid;
       grid-template-columns: 56px 200px 1fr auto;
       gap: 1.25rem;
       align-items: center;
       background: var(--clr-bg);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.25rem 1.5rem;
       box-shadow: var(--shadow-sm);
       transition: box-shadow var(--transition), border-color var(--transition);
       position: relative;
   }
   .product-card:hover {
       box-shadow: var(--shadow);
       border-color: var(--clr-border-dark);
   }
   
   /* Rank column */
   .product-card__rank {
       font-size: var(--text-2xl);
       font-weight: 800;
       color: var(--clr-primary);
       text-align: center;
       flex-shrink: 0;
   }
   
   /* Image column */
   .product-card__image {
       width: 200px;
       height: 150px;
       flex-shrink: 0;
       border-radius: var(--radius);
       overflow: hidden;
       background: var(--clr-bg-alt);
       display: flex;
       align-items: center;
       justify-content: center;
   }
   .product-card__image img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       padding: 0.5rem;
   }
   
   /* Info column */
   .product-card__info { flex: 1; min-width: 0; }
   .product-card__badge { margin-bottom: 0.5rem; }
   .product-card__name {
       font-size: var(--text-lg);
       font-weight: 700;
       color: var(--clr-heading);
       margin-bottom: 0.4rem;
       line-height: 1.3;
   }
   .product-card__rating { margin-bottom: 0.5rem; }
   .product-card__offer {
       display: inline-flex;
       align-items: center;
       gap: 0.4rem;
       background: #fef3c7;
       color: #92400e;
       font-size: var(--text-xs);
       font-weight: 600;
       padding: 0.2rem 0.6rem;
       border-radius: var(--radius-pill);
       margin-bottom: 0.5rem;
   }
   .product-card__desc {
       font-size: var(--text-sm);
       color: var(--clr-text-muted);
       line-height: 1.5;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   
   /* CTA column */
   .product-card__ctas {
       display: flex;
       flex-direction: column;
       gap: 0.6rem;
       align-items: center;
       min-width: 160px;
   }
   
   /* ── Section headings ────────────────────────────────────────── */
   .section-heading {
       margin-bottom: 2.5rem;
   }
   .section-heading--center { text-align: center; }
   .section-heading__title {
       font-size: 33px;
       font-weight: 700;
       color: #1E1E1E;
       margin-bottom: 0.5rem;
   }
   .section-heading__sub {
       font-size: 16px;
       color: var(--clr-text-muted);
       max-width: 540px;
   }
   .section-heading--center .section-heading__sub { margin-inline: auto; }
   
   /* ── Post grid (articles) ────────────────────────────────────── */
   .posts-grid {
       display: grid;
       grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
       gap: 1.75rem;
   }
   .post-card {
       border-radius: var(--radius-lg);
       overflow: hidden;
       border: 1px solid var(--clr-border);
       background: var(--clr-bg);
       display: flex;
       flex-direction: column;
       transition: box-shadow var(--transition);
   }
   .post-card:hover { box-shadow: var(--shadow); }
   .post-card__thumb { display: block; aspect-ratio: 3/2; overflow: hidden; }
   .post-card__thumb img { width: 100%; height: 100%; object-fit: contain; padding: 20px; transition: transform 0.35s ease; box-sizing: border-box; }
   .post-card:hover .post-card__thumb img { transform: scale(1.04); }
   .post-card__body { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; gap: 0.8rem; background: #f9fafb;}
   .post-card__meta { font-size: var(--text-xs); color: var(--clr-text-muted); display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: center; }
   .post-card__cat {
       background: var(--clr-primary-light);
       color: var(--clr-primary);
       font-size: 0.7rem;
       font-weight: 600;
       text-transform: uppercase;
       letter-spacing: 0.06em;
       padding: 0.15rem 0.55rem;
       border-radius: 999px;
       text-decoration: none;
       white-space: nowrap;
   }
   .post-card__cat:hover { background: var(--clr-primary); color: #fff; }
   .post-card__title { font-size: var(--text-base); font-weight: 700; color: var(--clr-heading); }
   .post-card__title a { color: inherit; }
   .post-card__title a:hover { color: var(--clr-primary); }
   .post-card__excerpt {
       font-size: var(--text-sm);
       color: var(--clr-text-muted);
       flex: 1;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   .post-card__excerpt p { margin: 0; }
   
   /* ── Post category archive layout ───────────────────────────── */
   .post-cat-banner {
       margin-bottom: 0;
       background-color: #132e59;
   }
   .post-archive-layout {
       display: grid;
       grid-template-columns: minmax(0, 1fr) 300px;
       gap: 4rem;
       align-items: start;
       padding-block: 2.5rem;
   }
   /* 2 cards per row */
   .posts-grid--2col {
       grid-template-columns: repeat(2, 1fr);
   }
   .post-archive-sidebar {
       position: sticky;
       top: 0;
   }
   /* Search in archive sidebar has no header offset needed */
   .post-archive-sidebar .sidebar-search {
       margin-top: 0;
   }
   .post-archive-pagination {
       margin-top: 2rem;
   }

   /* ── Single post / page ──────────────────────────────────────── */
   .single-layout {
       display: grid;
       grid-template-columns: minmax(0, 1fr) 300px;
       gap: 3rem;
       align-items: start;
       padding-block: 2.5rem;
   }
   /* ── Single post banner elements ────────────────────────────── */
   .single-banner__cats {
       display: flex;
       gap: 0.5rem;
       flex-wrap: wrap;
       margin-bottom: 0.5rem;
   }
   .single-banner__cat-link {
       font-size: 0.72rem;
       font-weight: 700;
       text-transform: uppercase;
       letter-spacing: 0.07em;
       color: #fff;
       background: rgba(255,255,255,0.18);
       border: 1px solid rgba(255,255,255,0.35);
       padding: 0.2rem 0.7rem;
       border-radius: 999px;
       text-decoration: none;
       transition: background 0.2s;
   }
   .single-banner__cat-link:hover { background: rgba(255,255,255,0.3); }
   .single-banner__meta {
       display: flex;
       gap: 1rem;
       flex-wrap: wrap;
       font-size: var(--text-sm);
       color: rgba(255,255,255,0.7);
       margin-top: 0.35rem;
   }
   .single-thumb { border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 2rem; }
   .single-thumb img { width: 100%; max-height: 450px; height: auto; display: block; object-fit: contain; }
   
   /* Entry content typography */
   .entry-content { max-width: 100%; }
   .entry-content h2 { font-size: var(--text-2xl); margin: 2rem 0 0.75rem; }
   .entry-content h3 { font-size: var(--text-xl); margin: 1.75rem 0 0.6rem; }
   .entry-content p  { margin-bottom: 1.25rem; }
   .entry-content ul,
   .entry-content ol { margin-bottom: 1.25rem; line-height: 1.8; }
   .entry-content img { border-radius: var(--radius); margin-block: 1.5rem; }
   .entry-content a { text-decoration: underline; }
   .entry-content blockquote {
       border-left: 4px solid var(--clr-primary);
       padding: 0.75rem 1.25rem;
       background: var(--clr-primary-light);
       border-radius: 0 var(--radius) var(--radius) 0;
       margin-block: 1.5rem;
       font-style: italic;
   }
   
   /* Sticky sidebar */
   .single-sidebar { position: sticky; top: 0; }
   .sidebar-widget {
       background: var(--clr-bg-alt);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.25rem;
       margin-bottom: 1.5rem;
   }
   .sidebar-widget__title {
       font-size: var(--text-sm);
       font-weight: 700;
       text-transform: uppercase;
       letter-spacing: 0.05em;
       margin-bottom: 1rem;
   }
   
   /* ── Category archive banner ─────────────────────────────────── */
   /* Suppress header border/shadow so it sits flush against the banner */
   .tax-product_cat .site-header {
       border-bottom: none;
       box-shadow: none;
   }
   .category-archive {
       margin: 0;
       padding: 0;
   }
   .cat-banner {
       position: relative;
       height: 350px;
       background-color: var(--clr-primary);
       background-size: cover;
       background-position: center;
       display: flex;
       align-items: center;
       overflow: hidden;
   }
   @media (max-width: 767px) {
    body.page .cat-banner.page-banner {
        height: 200px !important;
    }
}
   .cat-banner__overlay {
       position: absolute;
       inset: 0;
       pointer-events: none;
   }
   .cat-banner__inner {
       position: relative;
       z-index: 1;
       display: flex;
       flex-direction: column;
       gap: 0.4rem;
       width: 100%;
   }
   .cat-banner__breadcrumbs { max-width: 1000px; }
   .cat-banner__breadcrumbs .breadcrumbs,
   .cat-banner__breadcrumbs .breadcrumbs a,
   .cat-banner__breadcrumbs .breadcrumbs span {
       color: rgba(255,255,255,0.7);
       font-size: 0.875rem;
   }
   .cat-banner__breadcrumbs .breadcrumbs .breadcrumb-sep { color: rgba(255,255,255,0.4); }
   .cat-banner__title {
       color: #fff;
       font-size: clamp(1.75rem, 3vw, 2.5rem);
       font-weight: 800;
       line-height: 1.15;
       margin: 0;
       max-width: 1000px;
   }
   .cat-banner__desc {
       color: rgba(255,255,255,0.8);
       font-size: 1rem;
       max-width: 780px;
       margin: 0;
       line-height: 1.6;
   }
   
   /* ── Category archive (comparison) ──────────────────────────── */
   /* No top padding — banner sits flush against header */
   .category-archive > .container {
       padding-top: 100px;
       padding-bottom: 4rem;
   }
   
   /* ── Review template ─────────────────────────────────────────── */
   .review-layout { padding-block: 2.5rem; }
   .review-header { margin-bottom: 2rem; }
   .review-product-box {
       display: flex;
       gap: 1.5rem;
       align-items: center;
       background: var(--clr-bg-alt);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.5rem;
       margin-bottom: 2rem;
   }
   .review-product-box__image {
       width: 120px;
       height: 120px;
       flex-shrink: 0;
       border-radius: var(--radius);
       overflow: hidden;
       background: var(--clr-bg);
       display: flex;
       align-items: center;
       justify-content: center;
   }
   .review-product-box__image img { object-fit: contain; width: 100%; height: 100%; padding: 0.5rem; }
   .review-product-box__info { flex: 1; }
   .review-product-box__name { font-size: var(--text-xl); font-weight: 700; margin-bottom: 0.5rem; }
   
   .key-specs-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
   .key-specs-table th,
   .key-specs-table td { padding: 0.6rem 0.85rem; border: 1px solid var(--clr-border); text-align: left; }
   .key-specs-table th { background: var(--clr-bg-alt); font-weight: 600; width: 40%; }
   
   /* ── Homepage Reviews section ───────────────────────────────── */
   .hp-reviews {
       background: var(--clr-bg-alt);
   }
   .hp-reviews > .container {
       max-width: 100%;
       padding-left: 0;
       padding-right: 0;
   }
   .hp-reviews > .container .hp-reviews__heading {
       padding-left: 2rem;
       padding-right: 2rem;
   }
   .hp-reviews__heading {
       text-align: center;
       margin-bottom: 2.5rem;
   }
   .hp-reviews__subtitle {
       font-size: var(--text-sm);
       font-weight: 600;
       color: var(--clr-primary);
       text-transform: uppercase;
       letter-spacing: 0.08em;
       margin-bottom: 0.5rem;
   }
   .hp-reviews__title {
       font-size: 45px;
       font-weight: 700;
       color: #1E1E1E;
       margin-bottom: 0.5rem;
   }
   .hp-reviews__desc {
       font-size: var(--text-base);
       color: var(--clr-text-muted);
       max-width: 600px;
       margin: 0 auto;
   }

   /* Swiper container — full-width strip */
   .hp-reviews-swiper {
       position: relative;
       overflow: hidden;
       padding-bottom: 3rem;
       padding-left: 2rem;
       padding-right: 2rem;
   }
   .hp-reviews-swiper .swiper-button-prev,
   .hp-reviews-swiper .swiper-button-next {
       top: auto;
       bottom: 0;
       width: 36px;
       height: 36px;
       background: var(--clr-primary);
       color: #fff;
       border-radius: 50%;
   }
   .hp-reviews-swiper .swiper-button-prev { left: calc(50% - 48px); }
   .hp-reviews-swiper .swiper-button-next { right: calc(50% - 48px); }
   .hp-reviews-swiper .swiper-button-prev::after,
   .hp-reviews-swiper .swiper-button-next::after {
       font-size: 14px;
       font-weight: 700;
   }

   /* Equal-height slides */
   .hp-reviews-swiper .swiper-wrapper {
       align-items: stretch;
       padding: 0.5rem 0;
       box-sizing: border-box;
   }
   .hp-reviews-swiper .swiper-slide {
       height: auto;
       display: flex;
   }

   /* Review card */
   .hp-review-card {
       background: #fff;
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.5rem;
       display: flex;
       flex-direction: column;
       gap: 1rem;
       height: 100%;
       width: 100%;
       box-sizing: border-box;
   }
   .hp-review-card__header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 0.75rem;
   }
   .hp-review-card__name {
       font-weight: 700;
       font-size: 18px;
       color: var(--clr-heading);
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
   }
   .hp-review-card__stars {
       flex-shrink: 0;
       display: flex;
       gap: 2px;
   }
   .hp-review-card__body {
       font-size: 18px;
       color: var(--clr-text);
       line-height: 1.6;
       display: -webkit-box;
       -webkit-line-clamp: 4;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   .hp-review-card__body p { margin: 0; }
   .hp-review-card__footer {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       margin-top: auto;
       padding-top: 0.75rem;
       border-top: 1px solid var(--clr-border);
   }
   .hp-review-card__product-img {
       width: 80px;
       height: 80px;
       border-radius: 50%;
       overflow: hidden;
       flex-shrink: 0;
       border: 2px solid var(--clr-border);
       background: var(--clr-bg-alt);
   }
   .hp-review-card__product-img img {
       width: 100%;
       height: 100%;
       object-fit: cover;
   }
   .hp-review-card__product-link {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       text-decoration: none;
       flex: 1;
       min-width: 0;
   }
   .hp-review-card__product-link:hover .hp-review-card__product-name {
       color: var(--clr-primary);
   }
   .hp-review-card__product-name {
       font-size: 18px;
       font-weight: 600;
       color: var(--clr-heading);
       line-height: 1.3;
       transition: color 0.2s;
   }

   /* ── Trust section (homepage) ────────────────────────────────── */
   .trust-section { overflow: hidden; }

   .trust-layout {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 5rem;
       align-items: center;
   }

   /* Left — stacked images */
   .trust-images {
       position: relative;
       min-height: 420px;
   }
   .trust-images__primary {
       border-radius: var(--radius-lg);
       overflow: hidden;
       width: 75%;
       aspect-ratio: 3/4;
       position: relative;
       z-index: 1;
       box-shadow: var(--shadow);
   }
   .trust-images__primary img { width: 100%; height: 100%; object-fit: cover; }

   .trust-images__secondary {
       border-radius: var(--radius-lg);
       overflow: hidden;
       width: 60%;
       aspect-ratio: 3/4;
       position: absolute;
       bottom: 0;
       right: 0;
       z-index: 2;
       box-shadow: var(--shadow);
       border: 4px solid #fff;
   }
   .trust-images__secondary img { width: 100%; height: 100%; object-fit: cover; }


   /* Right — text content */
   .trust-content { display: flex; flex-direction: column; gap: 1.25rem; }

   .trust-content__subtitle {
       font-size: var(--text-sm);
       font-weight: 600;
       color: var(--clr-primary);
       text-transform: uppercase;
       letter-spacing: 0.08em;
       margin: 0;
   }
   .trust-content__title {
       font-size: clamp(1.6rem, 3vw, 2.2rem);
       font-weight: 800;
       color: var(--clr-heading);
       line-height: 1.2;
       margin: 0;
   }
   .trust-content__desc {
       font-size: 16px;
       color: var(--clr-text-muted);
       line-height: 1.65;
       margin: 0;
   }

   /* Stats row */
   .trust-stats {
       display: flex;
       gap: 1.5rem;
       flex-wrap: wrap;
   }
   .trust-stat {
       display: flex;
       align-items: center;
       gap: 0.85rem;
       flex: 1;
       min-width: 140px;
   }
   .trust-stat__circle {
       width: 72px;
       height: 72px;
       flex-shrink: 0;
       border-radius: 50%;
       border: 3px solid var(--clr-primary);
       display: flex;
       align-items: center;
       justify-content: center;
   }
   .trust-stat__value {
       font-size: 1.1rem;
       font-weight: 800;
       color: var(--clr-primary);
       line-height: 1;
   }
   .trust-stat__label {
       font-size: 16px;
       font-weight: 600;
       color: var(--clr-heading);
       line-height: 1.3;
       margin: 0;
   }

   /* Bullets */
   .trust-bullets {
       list-style: none;
       padding: 0;
       margin: 0;
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 0.5rem 1.5rem;
   }
   .trust-bullets__item {
       display: flex;
       align-items: center;
       gap: 0.5rem;
       font-size: 16px;
       font-weight: 500;
       color: var(--clr-text);
   }
   .trust-bullets__item .bi-check2 {
       color: var(--clr-primary);
       font-size: 1.1rem;
       flex-shrink: 0;
   }

   .trust-content__btn { align-self: flex-start; margin-top: 0.25rem; }

   /* ── Articles carousel (homepage) ────────────────────────────── */
   .articles-section__header {
       display: flex;
       justify-content: space-between;
       align-items: flex-end;
       flex-wrap: wrap;
       gap: 1rem;
       margin-bottom: 2rem;
   }
   .articles-section__sub {
       font-size: 16px;
       color: var(--clr-text-muted);
       margin: 0.25rem 0 0;
   }
   .articles-swiper .swiper-wrapper { align-items: stretch; }
   .articles-swiper .swiper-slide   { height: auto; display: flex; }
   .art-card .post-card__thumb { aspect-ratio: unset !important; height: auto !important; overflow: visible !important; }
   .art-card .post-card__thumb img { width: 100% !important; height: auto !important; object-fit: unset !important; max-height: none !important; transform: none !important; }
   .art-card {
       display: flex;
       flex-direction: column;
       width: 100%;
   }
   .art-card .post-card__body { flex: 1; gap: 0.5rem; }
   .art-card .post-card__excerpt {
       font-size: 16px;
       flex: 1;
       margin-bottom: 0.75rem;
   }
   .art-card__btn {
       align-self: flex-start;
       margin-top: auto;
       padding-top: 0.6rem;
       padding-bottom: 0.6rem;
       font-size: 0.875rem;
   }
   
   /* ── Static pages ────────────────────────────────────────────── */
   .page-layout { padding-block: 100px; max-width: 1000px; }
   .page-title { font-size: var(--text-3xl); font-weight: 800; margin-bottom: 1.5rem; }

   /* ── Contact page ─────────────────────────────────────────────── */
   .contact-layout {
       display: grid;
       grid-template-columns: 1fr 380px;
       gap: 2rem;
       padding-block: 80px;
       align-items: start;
   }

   /* Form card */
   .contact-form-card {
       background: #fff;
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 2.25rem 2rem;
       box-shadow: var(--shadow-sm);
   }
   .contact-form-card__title {
       font-size: 32px;
       font-weight: 700;
       color: var(--clr-heading);
       margin: 0 0 1rem;
   }
   .contact-form-card__divider {
       border: none;
       border-top: 1px dashed var(--clr-border);
       margin: 0 0 1.75rem;
   }

   /* Style CF7 fields inside the contact form */
   .contact-form-wrap .wpcf7-form {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 1rem;
   }
   .contact-form-wrap .wpcf7-form p { margin: 0; }
   .contact-form-wrap .wpcf7-form p:has(textarea),
   .contact-form-wrap .wpcf7-form p:has([type="submit"]),
   .contact-form-wrap .wpcf7-form p:has(.cf7-submit-wrap),
   .contact-form-wrap .wpcf7-form p:has(.wpcf7-submit) {
       grid-column: 1 / -1;
   }
   .contact-form-wrap label {
       display: block;
       font-size: var(--text-sm);
       font-weight: 500;
       color: var(--clr-text-muted);
       margin-bottom: 0.35rem;
   }
   .contact-form-wrap input[type="text"],
   .contact-form-wrap input[type="email"],
   .contact-form-wrap input[type="tel"],
   .contact-form-wrap select,
   .contact-form-wrap textarea {
       width: 100%;
       padding: 0.7rem 1.1rem;
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-pill);
       font-size: 1rem;
       font-family: var(--font-body);
       color: var(--clr-heading);
       background: #f8fafc;
       box-sizing: border-box;
       transition: border-color 0.2s;
   }
   .contact-form-wrap textarea {
       border-radius: var(--radius-lg);
       resize: vertical;
       min-height: 120px;
   }
   .contact-form-wrap input:focus,
   .contact-form-wrap select:focus,
   .contact-form-wrap textarea:focus {
       outline: none;
       border-color: var(--clr-primary);
       background: #fff;
   }
   /* Submit row uses full grid width so .wpcf7-response-output never sits on the same row as the button */
   .contact-form-wrap .wpcf7-form p:has(.cf7-submit-wrap) {
       display: block;
       position: relative;
       width: 100%;
       max-width: 100%;
   }

   /* CF7 occasionally outputs the toast in the same <p> as submit — stack vertically */
   .contact-form-wrap .wpcf7-form p:has(.cf7-submit-wrap):has(.wpcf7-response-output) {
       display: flex !important;
       flex-direction: column !important;
       align-items: flex-start !important;
       gap: 0.85rem !important;
   }

   /* Layout only — never `display` !important here; CF7 uses .init + inline style to show/hide */
   .contact-form-wrap .wpcf7-response-output {
       grid-column: 1 / -1;
       width: 100%;
       max-width: 100%;
       box-sizing: border-box;
       clear: both;
       float: none !important;
       border-radius: var(--radius);
       font-size: var(--text-sm);
       line-height: 1.5;
       margin-top: 0.85rem;
       padding: 0.85rem 1rem;
   }

   /* Toast inside same <p> as submit (some CF7 setups) — stack under the button */
   .contact-form-wrap .wpcf7-form p:has(.cf7-submit-wrap) .wpcf7-response-output {
       float: none !important;
       width: 100% !important;
       margin-left: 0 !important;
       margin-right: 0 !important;
       clear: both !important;
   }

   .contact-form-wrap .wpcf7-form .screen-reader-response {
       grid-column: 1 / -1;
   }
   /* Spinner after submit in same <p> — keep outside pill so label stays centred */
   .contact-form-wrap .wpcf7-form p:has(.cf7-submit-wrap) > .wpcf7-spinner {
       position: absolute !important;
       top: 50%;
       left: 100%;
       right: auto;
       margin: 0 0 0 0.35rem !important;
       transform: translateY(-50%);
       float: none !important;
   }
   /* CF7 default: spinner after [submit] inside .cf7-submit-wrap — must leave flex flow entirely */
   .contact-form-wrap .cf7-submit-wrap .wpcf7-spinner {
       position: absolute !important;
       top: 50% !important;
       bottom: auto !important;
       right: 0.45rem !important;
       left: auto !important;
       margin: 0 !important;
       inset-inline-start: auto;
       inset-inline-end: 0.45rem;
       transform: translateY(-50%) !important;
       float: none !important;
       z-index: 2;
   }

   /* CF7 submit wrapper — match .btn--visit-site (pill, centered label, blob under text) */
   .contact-form-wrap .cf7-submit-wrap {
       display: inline-flex !important;
       align-items: center;
       justify-content: center !important;
       gap: 0 !important; /* overrides .btn gap when cf7-submit-wrap shares .btn classes */
       position: relative;
       overflow: hidden;
       z-index: 0;
       background: #132e59 !important;
       border: 1px solid #132e59 !important;
       border-radius: 32px !important;
       width: fit-content;
       padding: 0 !important;
       min-height: 2.5rem;
       cursor: pointer;
   }

   /* White blob shows through → navy label (readable on lighter fill under cursor) */
   .contact-form-wrap .cf7-submit-wrap:hover input[type="submit"],
   .contact-form-wrap .cf7-submit-wrap:hover .wpcf7-submit {
       color: #132e59 !important;
   }

   /* Input is the visible text + click handler — transparent bg so blob shows through */
   .contact-form-wrap .cf7-submit-wrap input[type="submit"],
   .contact-form-wrap .cf7-submit-wrap .wpcf7-submit {
       appearance: none;
       -webkit-appearance: none;
       flex: none;
       margin: 0;
       /* symmetric padding reserves space for .wpcf7-spinner without shifting label left */
       padding: 0.7rem 2.25rem !important;
       box-sizing: border-box;
       min-width: 0;
       width: auto;
       background: transparent;
       border: none;
       color: #fff !important;
       font-size: 0.9rem !important;
       font-weight: 600;
       font-family: var(--font-body);
       line-height: 1.2;
       text-align: center;
       white-space: nowrap;
       cursor: pointer;
       position: relative;
       z-index: 1;
       transition: color 0.4s ease;
   }
   /* Same ink-blob layering as site .btn--visit-site */
   .contact-form-wrap .cf7-submit-wrap .btn-blob {
       position: absolute;
       display: block;
       width: 0;
       height: 0;
       border-radius: 50%;
       background: #fff;
       transform: translate(-50%, -50%);
       transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
       pointer-events: none;
       z-index: -1;
   }
   .contact-form-wrap .cf7-submit-wrap .btn-blob.is-expanded {
       width: 225%;
       height: 220px;
   }

   /* Subject field — full width */
   .contact-form-wrap .wpcf7-form p:has([name="your-subject"]) {
       grid-column: 1 / -1;
   }

   /* Info card */
   .contact-info-card {
       background: #fff;
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 2.25rem 2rem;
       box-shadow: var(--shadow-sm);
       position: sticky;
       top: 2rem;
   }
   .contact-info-card__title {
       font-size: 32px;
       font-weight: 700;
       color: var(--clr-heading);
       margin: 0 0 1.5rem;
   }
   .contact-info-list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 1.25rem;
   }
   .contact-info-list__item {
       display: flex;
       align-items: flex-start;
       gap: 1rem;
       padding: 1rem;
       background: var(--clr-bg-alt);
       border-radius: var(--radius);
   }
   .contact-info-list__icon {
       width: 70px;
       height: 70px;
       flex-shrink: 0;
       border-radius: 50%;
       border: 1.5px solid var(--clr-border);
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 25px;
       color: var(--clr-primary);
       background: #fff;
   }
   .contact-info-list__body { flex: 1; min-width: 0; }
   .contact-info-list__label {
       font-size: 20px;
       font-weight: 600;
       color: var(--clr-heading);
       margin: 0 0 0.2rem;
   }
   .contact-info-list__line {
       font-size: 16px;
       color: var(--clr-text-muted);
       margin: 0;
       line-height: 1.5;
   }
   body.page .page-layout,
body.page .contact-layout,
body.page .page-categories-shell {
    padding-block: 50px;
}

   @media (max-width: 768px) {
       .contact-layout { grid-template-columns: 1fr; padding-block: 50px; }
       .contact-form-wrap .wpcf7-form { grid-template-columns: 1fr; }
   }
   
   /* ── Pagination ──────────────────────────────────────────────── */
   .nav-links {
       display: flex;
       flex-wrap: wrap;
       gap: 0.5rem;
       justify-content: center;
       padding-block: 2.5rem;
   }
   .page-numbers {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 40px;
       height: 40px;
       border: 1px solid var(--clr-border);
       border-radius: var(--radius);
       font-size: var(--text-sm);
       font-weight: 500;
       color: var(--clr-text);
       transition: all var(--transition);
   }
   .page-numbers:hover,
   .page-numbers.current {
       background: var(--clr-primary);
       color: #fff;
       border-color: var(--clr-primary);
   }
   
   /* ── Search & 404 ────────────────────────────────────────────── */

   /* Override cat-banner colour + height for the search banner */
   .search-banner {
       background-color: #132e59 !important;
       height: auto !important;
       padding: 4rem 0 3.5rem;
   }

   /* Centre all inner content */
   .search-banner__inner {
       align-items: center !important;
       text-align: center;
       gap: 1.1rem;
   }

   .search-banner__label {
       font-size: var(--text-sm);
       font-weight: 600;
       color: rgba(255,255,255,0.65);
       text-transform: uppercase;
       letter-spacing: 0.1em;
       margin: 0;
   }

   .search-banner__title {
       font-size: clamp(2rem, 4vw, 3rem);
       font-weight: 800;
       color: #fff;
       margin: 0;
       line-height: 1.15;
       max-width: 700px;
   }
   .search-banner__title span { color: #93c5fd; }

   .search-banner__form {
       display: flex;
       gap: 0;
       width: 100%;
       max-width: 560px;
       margin-top: 0.25rem;
   }
   .search-banner__field {
       flex: 1;
       padding: 0.8rem 1.25rem;
       border: none;
       border-radius: var(--radius) 0 0 var(--radius);
       font-size: 1rem;
       background: #fff;
       color: var(--clr-heading);
       outline: none;
   }
   .search-banner__submit {
       display: flex;
       align-items: center;
       gap: 0.4rem;
       padding: 0.8rem 1.4rem;
       background: var(--clr-primary-dark);
       color: #fff;
       border: none;
       border-radius: 0 var(--radius) var(--radius) 0;
       font-size: 0.95rem;
       font-weight: 600;
       cursor: pointer;
       white-space: nowrap;
       transition: background var(--transition);
   }
   .search-banner__submit:hover { background: #0a1828; }

   /* Results wrapper */
   .search-results-wrap {
       padding-top: 3rem;
       padding-bottom: 3rem;
   }
   .search-results__count {
       color: var(--clr-text-muted);
       font-size: var(--text-sm);
       margin: 0 0 1.5rem;
   }
   .search-results__count strong { color: var(--clr-heading); }
   .search-pagination { margin-top: 2.5rem; }
  
   /* No results state */
   .search-page .search-no-results {
       text-align: center;
       padding: 2.25rem 0;
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 1rem;
   }
   .search-page .search-no-results__icon {
       font-size: 3.5rem;
       color: #94a3b8;
   }
   .search-page .search-no-results__title {
       font-size: var(--text-2xl);
       font-weight: 700;
       color: var(--clr-heading);
       margin: 0;
   }
   .search-page .search-no-results__text {
       color: var(--clr-text-muted);
       max-width: 480px;
       margin: 0;
       line-height: 1.7;
   }
   .search-no-results__actions {
       display: flex;
       gap: 0.75rem;
       flex-wrap: wrap;
       justify-content: center;
       margin-top: 0.5rem;
   }

   /* ── 404 page ────────────────────────────────────────────────── */
   .error-page {
       text-align: center;
       padding: 5rem 0;
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 1.25rem;
   }
   .error-page__graphic {
       position: relative;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 180px;
       height: 180px;
       border-radius: 50%;
       background: var(--clr-primary-light);
       margin-bottom: 0.5rem;
   }
   .error-page__code {
       font-size: 4.5rem;
       font-weight: 900;
       color: var(--clr-primary);
       line-height: 1;
       letter-spacing: -2px;
   }
   .error-page__title {
       font-size: var(--text-2xl);
       font-weight: 800;
       color: var(--clr-heading);
       margin: 0;
   }
   .error-page__text {
       color: var(--clr-text-muted);
       max-width: 420px;
       margin: 0;
       line-height: 1.7;
   }
   .error-page__search {
       display: flex;
       gap: 0;
       width: 100%;
       max-width: 480px;
   }
   .error-page__actions {
       display: flex;
       gap: 1rem;
       flex-wrap: wrap;
       justify-content: center;
       margin-top: 0.5rem;
   }
   .error-page__actions .btn {
       display: inline-flex;
       align-items: center;
       gap: 0.4rem;
   }
   
   /* ── Product card buttons (Visit Site + Reviews) ─────────────── */
   
   /* Shared base — pill shape, overflow hidden for mouse-position ink blob */
   .btn--visit-site,
   .btn--reviews {
       position: relative;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 0.4rem;
       padding: 0.7rem 1.5rem;
       border-radius: 32px;
       font-size: 0.9rem;
       font-weight: 600;
       line-height: 1.2;
       text-decoration: none;
       white-space: nowrap;
       overflow: hidden;
       transition: color 0.4s ease;
       cursor: pointer;
       z-index: 0;
   }
   
   /* Ink blob — injected by JS, positioned at the exact mouse entry point */
   .btn--visit-site .btn-blob,
   .btn--reviews .btn-blob {
       position: absolute;
       display: block;
       width: 0;
       height: 0;
       border-radius: 50%;
       transform: translate(-50%, -50%);
       transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
       pointer-events: none;
       z-index: -1;
   }
   
   /* ── Visit Site — filled dark navy ──────────────────────────── */
   .btn--visit-site {
       background: #132e59;
       color: #fff;
       border: 1px solid #132e59;
   }
   /* Blob is a lighter navy — creates shimmer-from-cursor effect */
   .btn--visit-site .btn-blob { background: white; }
   .btn--visit-site .btn-blob.is-expanded {
       width: 225%;
       height: 220px;
   }
   
   /* ── Reviews — outlined transparent ─────────────────────────── */
   .btn--reviews {
       background: transparent;
       color: #132e59;
       border: 1.5px solid #132e59;
   }
   /* Blob fills the button with navy — text turns white */
   .btn--reviews .btn-blob { background: #132e59; }
   .btn--reviews.is-hovered { color: #fff; }
   .btn--reviews .btn-blob.is-expanded {
       width: 225%;
       height: 220px;
   }
   
   /* ── Product card row (pcr) ──────────────────────────────────── */
   
   /* Outer list container — gap creates independence between cards */
   .pcr-list {
       display: flex;
       flex-direction: column;
       gap: 1rem;
   }
   
   /* Single product row — independent card */
   .pcr {
       position: relative;
       display: grid;
       grid-template-columns: 160px 260px 1fr 180px;
       column-gap: 2rem;
       row-gap: 1rem;
       align-items: center;
       padding: 1.5rem 2rem;
       background: transparent;
       border: 1px solid var(--clr-border);
       border-radius: 1rem;
       transition: box-shadow var(--transition), border-color var(--transition);
   }
   .pcr:hover {
       box-shadow: 0 4px 20px rgba(0,0,0,0.08);
       border-color: #c8d6e8;
   }
   
   /* Rank — circular badge overlaid on the image (top-left, slightly outside border) */
   .pcr__rank {
       position: absolute;
       top: -10px;
       left: -10px;
       width: 36px;
       height: 36px;
       border-radius: 50%;
       background: var(--clr-primary);
       color: #fff;
       font-size: 0.8rem;
       font-weight: 800;
       line-height: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       z-index: 3;
       box-shadow: 0 2px 6px rgba(0,0,0,0.18);
   }
   
   /* Image cell — bordered box with inner padding */
   .pcr__image {
       position: relative;
       width: 140px;
       height: 140px;
       flex-shrink: 0;
       border: 1px solid #ddd;
       border-radius: 0.5rem;
       padding: 10px;
       overflow: visible; /* allow rank badge to poke outside */
       background: #fff;
       display: flex;
       align-items: center;
       justify-content: center;
   }
   .pcr__image img {
       width: 100%;
       height: 100%;
       object-fit: contain;
   }
   
   /* Ribbon badge — Best Overall, Best Value… (comparison page, top-right of card) */
   .pcr__ribbon {
       position: absolute;
       top: 0;
       right: 0;
       display: inline-block;
       color: #fff;
       font-size: 12px;
       font-weight: 400;
       letter-spacing: 0.08em;
       text-transform: uppercase;
       white-space: nowrap;
       clip-path: polygon(100% 0, 100% 100%, 0% 100%, 7% 50%, 0% 0%);
       padding: 1px 40px;
       border-radius: 0px 16px 0px 0px;
       z-index: 2;
       line-height: 2;
   }
   .pcr__ribbon.badge--best-overall { background: #16a34a; }
   .pcr__ribbon.badge--best-value   { background: #2563eb; }
   .pcr__ribbon.badge--editors-pick { background: #132e59; }
   .pcr__ribbon.badge--best-for     { background: #0891b2; }
   .pcr__ribbon.badge--custom       { background: #15803d; }
   
   /* Info column — product name + content */
   .pcr__info { min-width: 0; }
   .pcr__name {
       font-size: var(--text-base);
       font-weight: 700;
       color: var(--clr-heading);
       margin-bottom: 0.5rem;
       line-height: 1.35;
   }
   .pcr__name a { color: inherit; text-decoration: none; }
   .pcr__name a:hover { color: var(--clr-primary); }
   
   /* Top Highlights bullets */
   .pcr__bullets {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 0.2rem;
   }
   .pcr__bullets li {
       font-size: var(--text-sm);
       color: #1e1e1e;
       line-height: 1.45;
       padding-left: 1.5rem;
       position: relative;
   }
   .pcr__bullets li::before {
       content: '\f270';
       font-family: 'bootstrap-icons';
       position: absolute;
       left: 0;
       color: var(--clr-primary);
       font-size: 1.1rem;
       font-weight: 500;
       line-height: 1.45;
   }
   
   /* Description excerpt fallback — 3-line clamp */
   .pcr__excerpt {
       font-size: var(--text-sm);
       color: var(--clr-text-muted);
       line-height: 1.55;
       margin: 0;
       display: -webkit-box;
       -webkit-line-clamp: 3;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   
   /* Rating column — number above stars, badge below */
   .pcr__rating-col {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       text-align: center;
       gap: 0.35rem;
       border: 1px solid var(--clr-border);
       border-radius: 0.75rem;
       padding: 0.65rem 1.25rem 1.75rem;
       position: relative;
   }
   
   /* Editor's Pick badge — absolutely positioned so it never grows the box */
   .pcr__editors-badge {
       position: absolute;
       bottom: 0;
       left: 50%;
       transform: translateX(-50%);
       background: #132e59;
       color: #fff;
       font-size: 12px;
       font-weight: 400;
       letter-spacing: 0.08em;
       text-transform: uppercase;
       white-space: nowrap;
       clip-path: polygon(100% 0, 100% 100%, 0% 100%, 7% 50%, 0% 0%);
       padding: 1px 40px;
       border-radius: 0px 20px 20px 0px;
   }
   
   /* CTA actions column */
   .pcr__actions {
       display: flex;
       flex-direction: column;
       align-items: stretch;
       justify-content: center;
       gap: 0.5rem;
   }
   
   /* ── Editor's Pick section layout ────────────────────────────── */
   .ep-section { background: #fff; }
   
   .ep-layout {
       display: grid;
       grid-template-columns: 3fr 1fr;
       gap: 2rem;
       align-items: start;
   }
   
   .ep-heading { margin-bottom: 1.5rem; }
   .ep-heading__title {
       font-size: 45px;
       font-weight: 700;
       color: #1E1E1E;
       margin-bottom: 0.5rem;
   }
   .ep-heading__sub {
       font-size: 18px;
       color: var(--clr-text-muted);
   }
   
   /* Sidebar */
   .ep-sidebar {
       position: sticky;
       top: 84px;
       align-self: start;
       background: var(--clr-bg);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       justify-content: flex-start;
       padding: 1.5rem;
   }
   
   /* ── Sidebar widgets ─────────────────────────────────────────── */
   .sidebar-widget { width: 100%; }
   
   .sidebar-widget__title {
       display: flex;
       align-items: center;
       gap: 0.5rem;
       font-size: 1rem;
       font-weight: 700;
       color: var(--clr-heading);
       margin-bottom: 1.25rem;
       padding-bottom: 0.75rem;
       border-bottom: 1px solid var(--clr-border);
   }
   .sidebar-widget__title-dot {
       width: 10px;
       height: 10px;
       border-radius: 50%;
       background: var(--clr-primary);
       flex-shrink: 0;
   }
   
   /* Popular Posts list */
   .popular-posts {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 1rem;
   }
   
   .popular-posts__item { }
   
   .popular-posts__link {
       display: flex;
       align-items: flex-start;
       gap: 0.85rem;
       text-decoration: none;
       color: inherit;
       transition: opacity var(--transition);
   }
   .popular-posts__link:hover { opacity: 0.75; }
   
   /* Featured image thumbnail */
   .popular-posts__thumb {
       flex-shrink: 0;
       width: 80px;
       height: 80px;
       border-radius: 0.4rem;
       overflow: hidden;
       background: var(--clr-bg-alt);
   }
   .popular-posts__thumb img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block;
       border-radius: 10px;
   }
   .popular-posts__thumb-placeholder {
       width: 100%;
       height: 100%;
       background: var(--clr-bg-alt);
   }
   
   /* Body — title + author */
   .popular-posts__body {
       display: flex;
       flex-direction: column;
       gap: 0.2rem;
       min-width: 0;
   }
   .popular-posts__title {
       font-size: 16px;
       font-weight: 600;
       color: var(--clr-heading);
       line-height: 1.4;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   .popular-posts__author {
       font-size: 0.75rem;
       color: var(--clr-text-muted);
   }
   
   /* ── Sidebar — Post Categories widget ───────────────────────── */
   .sidebar-post-categories { margin-top: 1.5rem; }

   .sidebar-cats {
       list-style: none;
       margin: 0;
       padding: 0;
       display: flex;
       flex-direction: column;
   }
   .sidebar-cats__item {
       border-bottom: 1px solid var(--clr-border);
   }
   .sidebar-cats__item:last-child { border-bottom: none; }

   /* Row = link + toggle button side by side */
   .sidebar-cats__row {
       display: flex;
       align-items: center;
       gap: 0.5rem;
       padding: 0.55rem 0 0.4rem;
   }
   .sidebar-cats__link {
       flex: 1;
       display: flex;
       align-items: center;
       text-decoration: none;
       color: var(--clr-text);
       font-size: 16px;
       transition: color var(--transition);
   }
   .sidebar-cats__link:hover { color: var(--clr-primary); }
   .sidebar-cats__name { font-weight: 500; text-transform: capitalize; }

   /* Chevron toggle button */
   .sidebar-cats__toggle {
       flex-shrink: 0;
       background: none;
       border: none;
       padding: 2px 4px;
       cursor: pointer;
       color: var(--clr-text-muted);
       font-size: 0.8rem;
       line-height: 1;
       transition: color var(--transition), transform 0.2s;
   }
   .sidebar-cats__toggle:hover { color: var(--clr-primary); }
   .sidebar-cats__toggle.is-open { transform: rotate(180deg); color: var(--clr-primary); }

   /* Count badge */
   .sidebar-cats__count {
       font-size: 0.75rem;
       font-weight: 600;
       color: #fff;
       background: var(--clr-primary);
       border-radius: 999px;
       padding: 1px 8px;
       min-width: 22px;
       text-align: center;
       flex-shrink: 0;
   }
   .sidebar-cats__count--sm {
       font-size: 0.7rem;
       padding: 1px 6px;
       min-width: 18px;
   }

   /* Children list — hidden by default, revealed on .is-open */
   .sidebar-cats__children {
       list-style: none;
       margin: 0;
       padding: 0 0 0.5rem 0.75rem;
       display: none;
   }
   .sidebar-cats__children.is-open { display: flex; flex-direction: column; gap: 0; }
   .sidebar-cats__child-item { border-top: 1px solid var(--clr-border); }
   .sidebar-cats__child-link {
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding: 0.4rem 0;
       text-decoration: none;
       color: var(--clr-text-muted);
       font-size: 14px;
       transition: color var(--transition);
   }
   .sidebar-cats__child-link:hover { color: var(--clr-primary); }
   .sidebar-cats__child-name { font-weight: 400; text-transform: capitalize; }

   /* ── Sidebar — Search widget ─────────────────────────────────── */
   
   .sidebar-search {
       margin-top: 0;
       margin-bottom: 1.5rem;
   }
   .sidebar-search .search-form {
       display: flex;
       gap: 0;
   }
   .sidebar-search .search-field {
       flex: 1;
       min-width: 0;
       padding: 0.6rem 0.85rem;
       border: 1px solid var(--clr-border);
       border-right: none;
       border-radius: var(--radius) 0 0 var(--radius);
       font-size: 0.9rem;
       color: var(--clr-text);
       background: var(--clr-bg);
       outline: none;
       transition: border-color var(--transition);
   }
   .sidebar-search .search-field:focus {
       border-color: var(--clr-primary);
   }
   .sidebar-search .search-submit {
       flex-shrink: 0;
       width: 42px;
       background: var(--clr-primary);
       color: #fff;
       border: none;
       border-radius: 0 var(--radius) var(--radius) 0;
       font-size: 1rem;
       display: flex;
       align-items: center;
       justify-content: center;
       cursor: pointer;
       transition: opacity var(--transition);
   }
   .sidebar-search .search-submit:hover { opacity: 0.85; }

   /* ── Responsive ──────────────────────────────────────────────── */
   @media (max-width: 1024px) {
       .comp-grid { grid-template-columns: repeat(3, 1fr); gap: 1rem; }
       .product-card {
           grid-template-columns: 44px 160px 1fr;
           grid-template-rows: auto auto;
       }
       .product-card__ctas {
           grid-column: 2 / -1;
           flex-direction: row;
           flex-wrap: wrap;
           justify-content: flex-start;
       }
       .footer-main__inner { grid-template-columns: 1fr 1fr; gap: 2rem; }
       .footer-col--brand  { grid-column: 1 / -1; }
   .ep-layout {
       grid-template-columns: 1fr;
   }
   .ep-layout > *:first-child { order: 1; }
   .ep-sidebar { position: static; order: 2; }

    .pcr {
        grid-template-columns: 1fr;
        row-gap: 1rem;
        padding: 1.25rem;
    }

    .pcr__image {
        width: 100%;
        height: 220px;
        grid-column: 1;
    }

    .pcr__info {
        grid-column: 1;
    }

    .pcr__rating-col {
        grid-column: 1;
        width: 100%;
    }

    .pcr__actions {
        grid-column: 1;
        flex-direction: row;
        gap: 0.75rem;
    }

    .pcr__actions .btn {
        flex: 1;
        justify-content: center;
    }

    .pcr__bullets {
        display: none;
    }
   }
   /* Comparison/category product cards: 1024px–1300px */
   @media (min-width: 1024px) and (max-width: 1300px) {
       /* Homepage ep-layout: fixed sidebar so it doesn't get squeezed */
       .ep-layout {
           grid-template-columns: minmax(0, 1fr) 260px;
           gap: 1.5rem;
       }
       .ep-sidebar { position: sticky; order: 0; }

       body.tax-product_cat .ep-layout {
           grid-template-columns: minmax(0, 1fr) 300px;
           gap: 1.5rem;
       }

       /* 2 columns, 2 rows for ALL pages: [image | info] / [rating | buttons] */
       .pcr {
           grid-template-columns: 1fr 1fr;
           grid-template-rows: auto auto;
           column-gap: 1.25rem;
           row-gap: 1rem;
           padding: 1.25rem;
           align-items: center;
       }

       .pcr__image {
           grid-column: 1;
           grid-row: 1;
           width: 100%;
           height: 160px;
       }

       .pcr__info {
           grid-column: 2;
           grid-row: 1;
       }

       .pcr__rating-col {
           grid-column: 1;
           grid-row: 2;
           width: 100%;
           padding: 0.85rem 1rem 1.75rem;
       }

       .pcr__actions {
           grid-column: 2;
           grid-row: 2;
           flex-direction: column;
           gap: 0.6rem;
           align-items: stretch;
           justify-content: center;
       }

       .pcr__actions .btn {
           width: 100%;
           justify-content: center;
           min-width: 0;
           padding-inline: 1rem;
       }
   }

   
   @media (max-width: 900px) {
       .trust-layout {
           grid-template-columns: 1fr;
           gap: 2.5rem;
       }
       .trust-images { min-height: 300px; }
   }

   @media (max-width: 768px) {
       :root { --gutter: 1rem; }

       .trust-bullets { grid-template-columns: 1fr; }
       .trust-stats { flex-direction: column; }

       .mobile-menu-toggle { display: flex; }
       .site-nav {
           display: none;
           position: absolute;
           top: 110px;
           left: 0;
           right: 0;
           transform: none;
           background: var(--clr-bg);
           border-bottom: 1px solid var(--clr-border);
           box-shadow: var(--shadow);
           padding: 1rem;
       }
       .site-nav.is-open { display: block; }
       .site-nav__list { flex-direction: column; gap: 0.25rem; }
       .site-nav__list .sub-menu { position: static; box-shadow: none; border: none; padding-left: 1rem; }
       .site-header__actions { gap: 0.5rem; }
       .site-header__search { display: none; }
       .site-header__btn { display: none; }
   
     .single-layout { grid-template-columns: 1fr; }
     .single-content { order: 1; }
     .single-sidebar { position: static; order: 2; }
     .category-archive > .container { padding-top: 50px; padding-bottom: 50px; }
     .sidebar-search { margin-top: 0; }
     .post-archive-layout { grid-template-columns: 1fr; }
     .post-archive-main    { order: 1; }
     .post-archive-sidebar { position: static; order: 2; }
     .posts-grid--2col { grid-template-columns: 1fr; }
       .footer-main { padding: 50px 0; }
       .footer-main__inner { grid-template-columns: 1fr; gap: 2rem; }

       /* Homepage section headings — reduce on mobile */
       .ep-heading__title,
       .section-heading__title,
       .hp-reviews__title,
       .trust-content__title,
       .comparisons-section .section-heading__title {
           font-size: 35px !important;
           font-weight: 600 !important;
       }
       .footer-bottom__inner { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
   
      /* pcr — full stack below 768px (same as mobile ≤480px) */
      .pcr {
          grid-template-columns: 1fr;
          grid-template-rows: auto;
          row-gap: 0.75rem;
          padding: 1rem;
      }
      .pcr__image      { width: 100%; height: 180px; grid-column: 1; }
      .pcr__info       { grid-column: 1; }
      .pcr__rating-col {
          grid-column: 1;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          border: 1px solid var(--clr-border);
          border-radius: 0.75rem;
          padding: 0.75rem 1rem 1.75rem;
          gap: 0.5rem;
      }
      .pcr__actions    { grid-column: 1; flex-direction: row; flex-wrap: wrap; }
      .pcr__actions .btn { flex: 1; text-align: center; justify-content: center; }
      .pcr__excerpt,
      .pcr__bullets { display: none; }
      .pcr__ribbon {
          clip-path: none;
          border-radius: 0 1rem 0 0.5rem;
          padding: 3px 12px;
          font-size: 10px;
      }
      .pcr__editors-badge {
          font-size: 10px;
      }
      .pcr__rank { width: 28px; height: 28px; font-size: 0.7rem; }
   
   
       .product-card {
           grid-template-columns: 36px 1fr;
           grid-template-rows: auto auto auto;
       }
       .product-card__image {
           grid-column: 1 / -1;
           width: 100%;
           height: 180px;
       }
       .product-card__rank { grid-row: 1; grid-column: 1; }
       .product-card__info { grid-column: 2; }
       .product-card__ctas {
           grid-column: 1 / -1;
           flex-direction: row;
           flex-wrap: wrap;
       }
   
       .hero-slide { height: 480px; }
       .hero-slide__headline { font-size: var(--text-2xl); }
       .hero-slide__subtext { font-size: var(--text-sm); margin-bottom: 1.25rem; }
       .hero-slide__cta { margin-bottom: 1.5rem; }
       .category-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
       .comp-grid { grid-template-columns: repeat(3, 1fr); gap: 1rem; }
   }
   
   @media (max-width: 480px) {
       .category-grid { grid-template-columns: 1fr; }
       .product-card { padding: 1rem; gap: 0.75rem; }
       .product-card__image { height: 140px; }
       .section { padding-block: 2.5rem; }
   }
   
   /* ==========================================================================
      Single Product Page (woocommerce/single-product.php)
      ========================================================================== */
   
   /* Page layout — main + sidebar */
   .sp-layout {
       display: grid;
       grid-template-columns: 1fr 320px;
       gap: 2rem;
       align-items: start;
       padding-block: 2rem 4rem;
   }
   
   body.single-product { background: #e9eff7; }
   
   /* ── Product Hero Banner ──────────────────────────────────────────────────── */
   .sp-banner {
       position: relative;
       height: 350px;
       background-color: var(--clr-primary);
       background-size: cover;
       background-position: center;
       background-repeat: no-repeat;
       display: flex;
       align-items: center;
       margin-bottom: 2rem;
       overflow: hidden;
   }
   
   .sp-banner__overlay {
       position: absolute;
       inset: 0;
       pointer-events: none;
   }
   
   /* Default overlay when no image is set */
   .sp-banner:not(.sp-banner--has-image)::after {
       content: '';
       position: absolute;
       inset: 0;
       background: linear-gradient(105deg, rgba(10,30,70,0.82) 0%, rgba(19,46,89,0.55) 60%, transparent 100%);
       pointer-events: none;
   }
   
   .sp-banner--has-image .sp-banner__overlay {
       background: linear-gradient(105deg, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.35) 60%, transparent 100%) !important;
   }
   
   .sp-banner__inner {
       position: relative;
       z-index: 1;
       width: 100%;
       display: flex;
       flex-direction: column;
       justify-content: flex-end;
       gap: 0.5rem;
       padding-top: 1.5rem;
       padding-bottom: 1.75rem;
       height: 100%;
   }
   
   /* Title + badge on the same row, both top-aligned */
   .sp-banner__top-row {
       display: flex;
       flex-direction: row;
       align-items: flex-start;
       justify-content: space-between;
       gap: 2rem;
   }
   
   .sp-banner__title {
       flex: 1;
       font-size: clamp(1.3rem, 2.8vw, 2rem);
       font-weight: 700;
       color: #fff;
       line-height: 1.25;
       margin: 0;
       max-width: 1000px;
   }
   
   /* ── Circular rating badge ── */
   .sp-banner__rating-badge {
       position: relative;
       flex-shrink: 0;
       align-self: flex-start;
       width: 170px;
       height: 170px;
   }
   
   .sp-banner__rating-badge svg {
       width: 100%;
       height: 100%;
   }
   
   .sp-banner__rating-inner {
       position: absolute;
       inset: 0;
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       gap: 0.1rem;
   }
   
   .sp-banner__rating-num {
       font-size: 1.85rem;
       font-weight: 800;
       color: #f59e0b;
       line-height: 1;
       letter-spacing: -0.03em;
   }
   
   .sp-banner__rating-label {
       font-size: 0.62rem;
       font-weight: 500;
       color: rgba(255,255,255,0.6);
       text-transform: uppercase;
       letter-spacing: 0.05em;
   }
   
   .sp-banner .breadcrumbs {
       display: flex;
       flex-wrap: wrap;
       align-items: center;
       gap: 0.35rem;
       font-size: 0.78rem;
       color: rgba(255,255,255,0.7);
       margin: 0;
       max-width: 1000px;
   }
   
   .sp-banner .breadcrumbs a {
       color: rgba(255,255,255,0.8);
       text-decoration: none;
       transition: color 0.2s;
   }
   
   .sp-banner .breadcrumbs a:hover {
       color: #fff;
       text-decoration: underline;
   }
   
   .sp-banner .breadcrumbs .breadcrumb__sep {
       color: rgba(255,255,255,0.4);
   }
   
   .sp-banner .breadcrumbs span[aria-current="page"] {
       color: rgba(255,255,255,0.9);
       font-weight: 500;
   }
   
   /* ── Sidebar ──────────────────────────────────────────────────────────────── */
   .sp-sidebar {
       position: sticky;
       top: 1.5rem;
       align-self: start;
   }
   
   /* ── Main column shared ───────────────────────────────────────────────────── */
   .sp-main { display: flex; flex-direction: column; gap: 2rem; min-width: 0; }
   
   .sp-section-title {
       font-size: 1.25rem;
       font-weight: 700;
       color: var(--clr-heading);
       margin-bottom: 1rem;
       padding-bottom: 1.5rem;
       border-bottom: 1px solid var(--clr-border);
   }
   
   /* ── Product header card ──────────────────────────────────────────────────── */
   .sp-header {
       background: var(--clr-bg);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.75rem;
       display: flex;
       flex-direction: column;
       gap: 1.5rem;
   }
   
   /* Top row: image left + info right */
   .sp-header__top {
       display: grid;
       grid-template-columns: 220px 1fr;
       gap: 2rem;
       align-items: stretch;
   }
   
   /* Divider between sections inside the card */
   .sp-key-features,
   .sp-reviews {
       border-top: 1px solid var(--clr-border);
       padding-top: 1.5rem;
   }
   
   .sp-header__image {
       border: 1px solid var(--clr-border);
       border-radius: 20px;
       padding: 1rem;
       background: #fff;
       display: flex;
       align-items: center;
       justify-content: center;
       max-height: 500px;
   }
   .sp-header__image img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       display: block;
   }
   
   .sp-header__title {
       font-size: 1.5rem;
       font-weight: 700;
       color: var(--clr-heading);
       margin-bottom: 0.5rem;
       line-height: 1.3;
   }
   
   .sp-header__rating { margin-bottom: 0.75rem; }
   .sp-header__rating .jp-stars {
       display: flex;
       flex-direction: column;
       align-items: flex-start;
   }
   
   .sp-header__desc {
       font-size: var(--text-sm);
       color: var(--clr-text);
       line-height: 1.7;
       margin-bottom: 1.25rem;
   }
   .sp-header__desc p { margin: 0 0 0.5rem; }
   
   .sp-header__actions {
       display: flex;
       flex-wrap: wrap;
       gap: 0.75rem;
   }
   
   /* ── Pros & Cons ──────────────────────────────────────────────────────────── */
   .sp-pros-cons {
       display: grid;
       grid-template-columns: 1fr 1px 1fr;
       gap: 0 1.5rem;
       background: var(--clr-bg);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.5rem;
   }
   
   .sp-pros-cons__divider {
       background: var(--clr-border);
       align-self: stretch;
   }
   
   .sp-pros-cons__heading {
       display: flex;
       align-items: center;
       gap: 0.5rem;
       font-size: 1.05rem;
       font-weight: 700;
       color: var(--clr-heading);
       margin-bottom: 1rem;
   }
   
   .sp-pros-cons__icon { font-size: 1.2rem; line-height: 1; }
   .sp-pros-cons__icon--pro { color: #2563eb; }
   .sp-pros-cons__icon--con { color: #dc2626; }
   
   .sp-pros-cons__list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 0.6rem;
   }
   .sp-pros-cons__list li {
       display: flex;
       align-items: baseline;
       gap: 0.5rem;
       font-size: var(--text-sm);
       color: var(--clr-text);
       line-height: 1.5;
   }
   .sp-pros-cons__col--pros .sp-pros-cons__list li .bi {
       color: #16a34a;
       flex-shrink: 0;
       font-size: 0.95rem;
   }
   .sp-pros-cons__col--cons .sp-pros-cons__list li .bi {
       color: #dc2626;
       flex-shrink: 0;
       font-size: 0.95rem;
   }
   
   /* ── Key Specs table ──────────────────────────────────────────────────────── */
   
   .key-specs-table {
       width: 100%;
       border-collapse: collapse;
       font-size: var(--text-sm);
   }
   .key-specs-table tr { border-bottom: 1px solid var(--clr-border); }
   .key-specs-table tr:last-child { border-bottom: none; }
   .key-specs-table th,
   .key-specs-table td {
       padding: 0.65rem 1rem;
       text-align: left;
       vertical-align: top;
   }
   .key-specs-table th {
       font-weight: 600;
       color: var(--clr-heading);
       background: var(--clr-bg-alt);
       width: 38%;
       border-radius: 0;
   }
   .key-specs-table td { color: var(--clr-text); }
   .key-specs-table tbody tr:first-child th { border-radius: var(--radius-sm) 0 0 0; }
   .key-specs-table tbody tr:last-child  th { border-radius: 0 0 0 var(--radius-sm); }
   
   /* ── Key Features section ─────────────────────────────────────────────────── */
   
   .sp-key-features__list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 0.6rem;
   }
   .sp-key-features__list li {
       list-style: none;
       display: flex;
       align-items: baseline;
       gap: 0.5rem;
       font-size: 18px;
       color: var(--clr-text);
       line-height: 1.5;
       overflow-wrap: break-word;
       word-break: break-word;
       min-width: 0;
   }
   .sp-key-features__list li .bi {
       color: #16a34a;
       flex-shrink: 0;
       font-size: 1.2rem;
   }
   
   /* ── Reviews section ──────────────────────────────────────────────────────── */
   .sp-reviews__list {
       display: flex;
       flex-direction: column;
       gap: 1rem;
   }
   
   .sp-review-card {
       background: #e5e7eb;
       border-radius: var(--radius-lg);
       padding: 1.5rem;
   }
   
   .sp-review-card__rating { margin-bottom: 0.75rem; }
   .sp-review-card__rating .jp-stars {
       display: flex;
       flex-direction: column;
       align-items: flex-start;
   }
   
   .sp-review-card__quote {
       margin: 0 0 1.25rem;
       padding: 0;
       border: none;
       font-size: var(--text-sm);
       color: var(--clr-text);
       line-height: 1.7;
       font-style: italic;
   }
   .sp-review-card__quote p { margin: 0; }
   
   .sp-review-card__author {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       border-top: 1px solid var(--clr-border);
   }
   .sp-review-card__avatar {
       width: 44px;
       height: 44px;
       border-radius: 50%;
       object-fit: cover;
       flex-shrink: 0;
   }
   .sp-review-card__avatar--placeholder {
       display: none;
   }
   .sp-review-card__name {
       font-size: var(--text-sm);
       font-weight: 600;
       color: var(--clr-heading);
   }
   
   /* ── Reviews Swiper ───────────────────────────────────────────────────────── */
   .sp-reviews-swiper {
       position: relative;
       padding-bottom: 56px; /* room for arrows below */
       overflow: hidden;
   }
   .sp-reviews-swiper .swiper-slide {
       height: auto;
   }
   .sp-reviews-swiper .swiper-button-prev,
   .sp-reviews-swiper .swiper-button-next {
       top: auto;
       bottom: 0;
       transform: none;
       width: 40px;
       height: 40px;
       background: var(--clr-primary);
       border-radius: 50%;
       color: #fff;
       margin-top: 0;
   }
   .sp-reviews-swiper .swiper-button-prev::after,
   .sp-reviews-swiper .swiper-button-next::after {
       font-size: 13px;
       font-weight: 700;
   }
   .sp-reviews-swiper .swiper-button-prev {
       left: calc(50% - 48px);
   }
   .sp-reviews-swiper .swiper-button-next {
       right: calc(50% - 48px);
       left: auto;
   }
   .sp-reviews-swiper .swiper-button-disabled {
       opacity: 0.3;
       pointer-events: none;
   }
   
   /* ── Company Profile sidebar ──────────────────────────────────────────────── */
   .company-profile {
       background: var(--clr-bg);
       border: 1px solid var(--clr-border);
       border-radius: var(--radius-lg);
       padding: 1.5rem;
       display: flex;
       flex-direction: column;
       gap: 0.75rem;
       text-align: center;
   }
   
   .company-profile__logo {
       display: flex;
       justify-content: flex-start;
       margin-bottom: 0.25rem;
   }
   .company-profile__logo img {
       max-width: 200px;
       max-height: 100px;
       object-fit: contain;
   }
   
   .company-profile__name {
       font-size: 1rem;
       font-weight: 700;
       color: var(--clr-heading);
       margin: 0;
       text-align: left;
   }
   
   .company-profile__desc {
       font-size: var(--text-sm);
       color: var(--clr-text);
       line-height: 1.6;
       margin: 0;
       text-align: left;
   }
   
   .company-profile__trust {
       border-top: 1px solid var(--clr-border);
       padding-top: 0.75rem;
       margin-top: 0.25rem;
       text-align: left;
   }
   .company-profile__trust-title {
       font-size: 0.85rem;
       font-weight: 700;
       text-transform: uppercase;
       letter-spacing: 0.06em;
       color: var(--clr-primary);
       margin-bottom: 0.6rem;
   }
   .company-profile__trust-list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 0.5rem;
   }
   .company-profile__trust-list li {
       list-style: none;
       display: flex;
       align-items: baseline;
       gap: 0.5rem;
       font-size: var(--text-sm);
       color: var(--clr-text);
       line-height: 1.5;
   }
   .company-profile__trust-list li .bi {
       color: var(--clr-primary);
       flex-shrink: 0;
       font-size: 0.95rem;
   }
   
   /* ── Corporate Credentials ────────────────────────────────────────────────── */
   .company-profile__credentials {
       margin-top: 1.5rem;
       padding-top: 1.25rem;
       border-top: 1px solid var(--clr-border);
   }
   
   .company-profile__credentials-title {
       font-size: 0.8rem;
       font-weight: 700;
       text-transform: uppercase;
       letter-spacing: 0.07em;
       color: var(--clr-muted);
       margin-bottom: 1rem;
       text-align: left;
       width: 100%;
   }
   
   .company-profile__credentials-grid {
       list-style: none;
       margin: 0;
       padding: 0;
       display: flex;
       flex-direction: column;
       gap: 0.6rem;
   }
   
   .company-profile__cred-item {
       display: flex;
       flex-direction: row;
       align-items: center;
       gap: 0.75rem;
   }
   
   .company-profile__cred-icon {
       width: 38px;
       height: 38px;
       border-radius: 50%;
       background: #eef2fa;
       display: flex;
       align-items: center;
       justify-content: center;
       flex-shrink: 0;
   }
   
   .company-profile__cred-icon .bi {
       font-size: 1.1rem;
       color: var(--clr-primary);
   }
   
   .company-profile__cred-text {
       font-size: 0.82rem;
       font-weight: 500;
       color: #333;
       line-height: 1.4;
       text-align: left;
   }
   
   /* ── Responsive ───────────────────────────────────────────────────────────── */
   @media (max-width: 1024px) {
       .sp-layout { grid-template-columns: 1fr; }
       .sp-sidebar { position: static; order: 2; }
       .sp-main    { order: 1; }
       .company-profile { flex-direction: row; flex-wrap: wrap; text-align: left; align-items: center; }
       .company-profile__logo { justify-content: flex-start; margin-bottom: 0; }
       .company-profile__trust { width: 100%; }
   }
   
   @media (max-width: 640px) {
       .sp-header__top { grid-template-columns: 1fr; }
       .sp-header__image { min-height: 180px; }
       .sp-pros-cons { grid-template-columns: 1fr; gap: 1.25rem 0; }
       .sp-pros-cons__divider { width: 100%; height: 1px; align-self: auto; }
       .sp-banner { height: 220px; }
       .sp-banner__title { font-size: 1.1rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
       .sp-banner__rating-badge { display: none; }
       .sp-banner__rating-num { display: none; }
   }