:root {
            --red: #7b1720;
            --red2: #571018;
            --dark: #292929;
            --ink: #252525;
            --muted: #666;
            --light: #f4f4f4;
            --line: #e5e5e5;
            --soft: #f8eff0;
            --white: #fff;
            --shadow: 0 14px 36px #0000000d
        }

        * {
            box-sizing: border-box
        }

        html {
            scroll-behavior: smooth;
            scroll-padding-top: 90px
        }

        body {
            margin: 0;
            font: 16px/1.7 Arial, Helvetica, sans-serif;
            color: var(--ink)
        }

        img {
            max-width: 100%;
            display: block
        }

        a {
            color: inherit;
            text-decoration: none
        }

        .container {
            width: min(1180px, calc(100% - 40px));
            margin: auto
        }
/* 
        header {
            position: sticky;
            top: 0;
            z-index: 10;
            background: #fffffff7;
            border-bottom: 1px solid var(--line)
        } */

        .nav {
            min-height: 78px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 20px
        }

        .logo img {
            width: 200px;
            max-height: 62px;
            object-fit: contain
        }

        .navlinks {
            display: flex;
            align-items: center;
            gap: 22px;
            font-size: 14px;
            font-weight: bold
        }

        .navlinks a:hover {
            color: var(--red)
        }

        .navcta,
        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            padding: 12px 19px;
            border-radius: 7px;
            font-weight: bold;
            font-size: 14px;
            border: 1px solid transparent;
            transition: .2s
        }

        .navcta,
        .primary {
            background: var(--red);
            color: #fff
        }

        .navcta:hover,
        .primary:hover {
            background: var(--red2)
        }

        .outline {
            color: #fff;
            border-color: #ffffffa6
        }

        .outline:hover {
            background: #fff;
            color: var(--red)
        }

        .toggle {
            display: none;
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 6px;
            padding: 8px 12px;
            font-size: 22px
        }

        .breadcrumb {
            padding: 15px 0;
            font-size: 13px;
            color: var(--muted)
        }

        .breadcrumb span {
            margin: 0 8px;
            color: #aaa
        }

        .hero {
            background: linear-gradient(125deg, #292929, #383838 60%, #511018);
            color: #fff
        }

        .hero-grid {
            display: grid;
            grid-template-columns: 1fr 1.05fr;
            gap: 52px;
            align-items: center;
            padding: 58px 0 66px
        }

        .hero-media {
            position: relative;
            background: #fff;
            border-radius: 18px;
            padding: 34px 18px 18px;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            box-shadow: 0 22px 50px #0003
        }

        .hero-media:before {
            content: "PRODUCT OPTIONS";
            position: absolute;
            top: 12px;
            left: 18px;
            color: var(--red);
            font-size: 10px;
            font-weight: bold;
            letter-spacing: 1.5px
        }

        .pump {
            min-width: 0;
            padding-top: 12px
        }

        .pump img {
            height: 245px;
            width: 100%;
            object-fit: contain
        }

        .pump span {
            display: block;
            text-align: center;
            color: #333;
            font-size: 10px;
            font-weight: bold;
            letter-spacing: .5px;
            margin-top: 7px
        }

        .eyebrow,
        .kicker {
            display: inline-block;
            font-size: 12px;
            font-weight: bold;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: #e6b8bd;
            margin-bottom: 12px
        }

        h1,
        h2,
        h3,
        p {
            margin-top: 0
        }

        h1 {
            font-size: clamp(34px, 4vw, 53px);
            line-height: 1.12;
            letter-spacing: -.8px;
            margin-bottom: 16px
        }

        .hero h2 {
            color: #f0cbd0;
            font-size: clamp(19px, 2vw, 24px);
            line-height: 1.35;
            margin-bottom: 17px
        }

        .hero p {
            color: #e5e5e5
        }

        .actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            margin-top: 24px
        }

        .hero .note {
            font-size: 12px;
            color: #ccc;
            margin: 15px 0 0
        }

        .quick {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            box-shadow: var(--shadow);
            border-radius: 0 0 13px 13px;
            overflow: hidden
        }

        .qitem {
            text-align: center;
            padding: 22px 12px;
            border-right: 1px solid var(--line)
        }

        .qitem:last-child {
            border: 0
        }

        .qitem span {
            display: block;
            color: var(--muted);
            font-size: 10px;
            font-weight: bold;
            letter-spacing: 1.2px
        }

        .qitem strong {
            color: var(--red);
            font-size: 20px
        }

        section.content {
            padding: 76px 0
        }

        .light {
            background: var(--light)
        }

        .dark {
            background: var(--dark);
            color: #fff
        }

        .heading {
            max-width: 760px;
            text-align: center;
            margin: 0 auto 38px
        }

        .heading .kicker {
            color: var(--red);
            margin-bottom: 8px
        }

        .dark .heading .kicker {
            color: #e6b8bd
        }

        .heading h2 {
            font-size: clamp(27px, 3vw, 38px);
            line-height: 1.2;
            margin-bottom: 13px
        }

        .heading p {
            color: var(--muted);
            margin-bottom: 0
        }

        .dark .heading p {
            color: #d4d4d4
        }

        .overview {
            display: grid;
            grid-template-columns: 1.2fr .8fr;
            gap: 36px;
            align-items: start
        }

        .copy p {
            color: #555;
            margin-bottom: 15px
        }

        .copy strong {
            color: #292929
        }

        .summary {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 15px;
            padding: 26px;
            box-shadow: var(--shadow)
        }

        .stat {
            border-bottom: 1px solid var(--line);
            padding-bottom: 16px;
            margin-bottom: 14px
        }

        .stat span {
            display: block;
            color: var(--muted);
            font-size: 11px;
            font-weight: bold;
            letter-spacing: 1px
        }

        .stat strong {
            display: block;
            font-size: 40px;
            line-height: 1.2;
            color: var(--red)
        }

        .checks {
            padding: 0;
            margin: 0;
            list-style: none
        }

        .checks li {
            display: flex;
            gap: 10px;
            padding: 8px 0;
            border-bottom: 1px solid #f0f0f0;
            color: #484848
        }

        .checks li:last-child {
            border: 0
        }

        .tick {
            flex: 0 0 22px;
            width: 22px;
            height: 22px;
            border-radius: 50%;
            background: var(--soft);
            color: var(--red);
            font-weight: bold;
            text-align: center;
            line-height: 22px;
            font-size: 12px
        }

        .tablewrap {
            overflow-x: auto;
            border-radius: 12px;
            background: #fff;
            box-shadow: var(--shadow)
        }

        table {
            width: 100%;
            min-width: 510px;
            border-collapse: collapse
        }

        th,
        td {
            text-align: left;
            padding: 15px 21px;
            border-bottom: 1px solid var(--line);
            font-size: 14px
        }

        th {
            width: 42%;
            background: #f8f8f8;
            color: #333
        }

        td {
            color: #555
        }

        tr:last-child th,
        tr:last-child td {
            border-bottom: 0
        }

        .smallnote {
            font-size: 12px;
            color: var(--muted);
            margin-top: 13px
        }

        .cards {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 18px
        }

        .card {
            padding: 25px;
            border: 1px solid var(--line);
            border-radius: 12px;
            background: #fff
        }

        .ico {
            display: grid;
            place-items: center;
            width: 44px;
            height: 44px;
            background: var(--soft);
            border-radius: 11px;
            color: var(--red);
            font-size: 20px;
            font-weight: bold;
            margin-bottom: 15px
        }

        .card h3 {
            font-size: 17px;
            margin-bottom: 8px
        }

        .card p {
            font-size: 14px;
            color: var(--muted);
            margin: 0
        }

        .features {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 15px
        }

        .feature {
            border: 1px solid #4a4a4a;
            background: #303030;
            border-radius: 12px;
            padding: 22px
        }

        .num {
            color: #d6a2a8;
            font-size: 11px;
            font-weight: bold;
            letter-spacing: 1px;
            display: block;
            margin-bottom: 14px
        }

        .feature h3 {
            font-size: 16px;
            margin-bottom: 8px
        }

        .feature p {
            font-size: 13px;
            color: #d0d0d0;
            margin: 0
        }

        .materials {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 15px
        }

        .material {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 12px;
            padding: 22px
        }

        .material h3 {
            font-size: 17px;
            color: var(--red);
            margin-bottom: 8px
        }

        .material p {
            font-size: 13px;
            color: var(--muted);
            margin: 0
        }

        .notice {
            background: var(--soft);
            border-left: 4px solid var(--red);
            border-radius: 0 9px 9px 0;
            padding: 18px 21px;
            margin-top: 22px;
            color: #4d3436;
            font-size: 14px
        }

        .why {
            display: grid;
            grid-template-columns: .8fr 1.2fr;
            gap: 40px;
            align-items: center
        }

        .whybox {
            background: linear-gradient(145deg, var(--red), var(--red2));
            color: #fff;
            padding: 32px;
            border-radius: 16px
        }

        .whybox .kicker {
            color: #f1c9ce
        }

        .whybox h2 {
            font-size: 29px;
            line-height: 1.2;
            margin-bottom: 14px
        }

        .whybox p {
            font-size: 14px;
            color: #f0dfe1;
            margin: 0
        }

        .whylist {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 18px
        }

        .whyitem {
            padding-bottom: 14px;
            border-bottom: 1px solid var(--line)
        }

        .whyitem h3 {
            font-size: 16px;
            margin-bottom: 5px
        }

        .whyitem p {
            font-size: 13px;
            color: var(--muted);
            margin: 0
        }

        .faqs {
            max-width: 900px;
            margin: auto;
            display: grid;
            gap: 11px
        }

        .faqs details {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 9px;
            padding: 0 19px
        }

        .faqs summary {
            cursor: pointer;
            list-style: none;
            position: relative;
            padding: 17px 30px 17px 0;
            font-weight: bold
        }

        .faqs summary::-webkit-details-marker {
            display: none
        }

        .faqs summary:after {
            content: "+";
            position: absolute;
            right: 0;
            top: 12px;
            font-size: 23px;
            color: var(--red)
        }

        .faqs details[open] summary:after {
            content: "−"
        }

        .faqs details p {
            font-size: 14px;
            color: var(--muted);
            margin: 0;
            padding: 0 0 17px
        }

        .ctaband {
            background: linear-gradient(110deg, var(--red), var(--red2));
            color: #fff;
            padding: 45px 0
        }

        .ctainner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 28px
        }

        .ctainner h2 {
            font-size: clamp(24px, 3vw, 33px);
            margin-bottom: 7px
        }

        .ctainner p {
            color: #f0dfe1;
            margin: 0
        }

        .ctainner .btn {
            background: #fff;
            color: var(--red);
            white-space: nowrap
        }


        /* =====================================================
   FOOTER
===================================================== */

        .footer {

            background:
                #171617;

            color: white;

        }


        .footer-top {

            padding:
                80px 0;

        }


        .footer-grid {

            display: grid;

            grid-template-columns:
                1.3fr 1fr .7fr 1fr;

            gap: 60px;

        }


        .footer-company img {

            width: 190px;

            margin-bottom: 25px;

        }


        .footer p {

            color:
                #999;

            font-size: 11px;

            line-height: 1.8;

        }


        .footer-company p {

            max-width: 330px;

        }


        .footer h3 {

            font-size: 18px;

            margin-bottom: 25px;

        }


        .footer h4 {

            font-family:
                "Barlow Condensed",
                sans-serif;

            font-size: 18px;

            margin-bottom: 15px;

        }


        .footer-contact p {

            margin-bottom: 18px;

        }


        .footer a {

            color:
                #aaa;

            transition: .3s;

        }


        .footer a:hover {

            color:
                white;

        }


        .footer-links {

            display: flex;

            flex-direction: column;

        }


        .footer-links a {

            font-size: 11px;

            padding:
                8px 0;

            border-bottom:
                1px solid #292929;

        }


        .social {

            display: flex;

            gap: 8px;

            margin-top: 25px;

        }


        .social a {

            width: 36px;

            height: 36px;

            border:
                1px solid #444;

            display: flex;

            align-items: center;

            justify-content: center;

        }


        .social img {

            width: 16px;

            height: 16px;

            object-fit: contain;

            margin: 0;

        }


        .footer-map img {

            width: 100%;

            margin-bottom: 15px;

            opacity: .7;

        }


        .footer-btn {

            display: inline-flex;

            border:
                1px solid #555;

            padding:
                12px 18px;

            font-size: 9px;

            letter-spacing: 1px;

            color: white !important;

        }


        .footer-bottom {

            border-top:
                1px solid #292929;

            padding:
                20px 0;

        }


        .footer-bottom .container {

            display: flex;

            justify-content: space-between;

            gap: 20px;

        }


        .footer-bottom span {

            font-size: 9px;

            color: #777;

        }



        @media(max-width:980px) {
            .navlinks {
                gap: 12px
            }

            .hero-grid {
                gap: 28px
            }

            .pump img {
                height: 205px
            }

            .features {
                grid-template-columns: repeat(2, 1fr)
            }

            .materials {
                grid-template-columns: repeat(2, 1fr)
            }
        }

        @media(max-width:760px) {
            .container {
                width: calc(100% - 30px)
            }

            .nav {
                min-height: 70px
            }

            .logo img {
                width: 165px
            }

            .toggle {
                display: block
            }

            .navlinks {
                display: none;
                position: absolute;
                top: 69px;
                left: 0;
                right: 0;
                background: #fff;
                padding: 16px 22px 20px;
                border-bottom: 1px solid var(--line);
                box-shadow: 0 12px 22px #00000012;
                align-items: stretch;
                flex-direction: column;
                gap: 0
            }

            .navlinks.open {
                display: flex
            }

            .navlinks a {
                padding: 10px 0
            }

            .navlinks .navcta {
                margin-top: 7px
            }

            .hero-grid {
                grid-template-columns: 1fr;
                padding: 35px 0 42px;
                gap: 26px
            }

            .hero-media {
                order: 2;
                max-width: 560px;
                width: 100%;
                margin: auto;
                padding: 31px 12px 15px
            }

            .hero-copy {
                order: 1
            }

            .pump img {
                height: 185px
            }

            .quick {
                grid-template-columns: repeat(2, 1fr)
            }

            .qitem {
                padding: 17px 10px
            }

            .qitem:nth-child(2) {
                border-right: 0
            }

            .qitem:nth-child(-n+2) {
                border-bottom: 1px solid var(--line)
            }

            .qitem strong {
                font-size: 18px
            }

            section.content {
                padding: 54px 0
            }

            .overview,
            .why {
                grid-template-columns: 1fr;
                gap: 23px
            }

            .cards {
                grid-template-columns: 1fr
            }

            .whylist {
                grid-template-columns: 1fr
            }

            .ctainner {
                align-items: flex-start;
                flex-direction: column
            }

            .footgrid {
                grid-template-columns: 1fr;
                gap: 22px
            }

            .footbottom {
                flex-direction: column
            }
        }

        @media(max-width:440px) {
            h1 {
                font-size: 34px
            }

            .pump img {
                height: 140px
            }

            .pump span {
                font-size: 9px
            }

            .features,
            .materials {
                grid-template-columns: 1fr
            }

            .actions .btn {
                width: 100%
            }

            th,
            td {
                padding: 12px 13px
            }
        }

        /* =========================================
   AODD HALF-INCH DETAIL PAGE
   Theme: Maroon + Charcoal + White
   File: css/detail.css
========================================= */

        .aodd-detail-page {
            --detail-red: #7b1720;
            --detail-red-dark: #571018;
            --detail-red-light: #a52a35;
            --detail-dark: #252525;
            --detail-charcoal: #303030;
            --detail-text: #333333;
            --detail-muted: #6c6c6c;
            --detail-light: #f5f5f6;
            --detail-border: #e4e4e7;
            --detail-soft: #fbf0f1;
            --detail-white: #ffffff;
            --detail-shadow: 0 12px 35px rgba(0, 0, 0, 0.07);

            margin: 0;
            color: var(--detail-text);
            background: #fff;
            font-family: Inter, Arial, Helvetica, sans-serif;
            font-size: 16px;
            line-height: 1.7;
            overflow-wrap: break-word;
        }

        .aodd-detail-page *,
        .aodd-detail-page *::before,
        .aodd-detail-page *::after {
            box-sizing: border-box;
        }

        .aodd-detail-page img {
            display: block;
            max-width: 100%;
        }

        .aodd-detail-page a {
            color: inherit;
            text-decoration: none;
        }

        .aodd-detail-page h1,
        .aodd-detail-page h2,
        .aodd-detail-page h3,
        .aodd-detail-page p {
            margin-top: 0;
        }

        .aodd-detail-page h1,
        .aodd-detail-page h2,
        .aodd-detail-page h3 {
            font-family: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
            font-weight: 700;
        }

        .aodd-detail-page .container {
            width: min(1180px, calc(100% - 40px));
            margin-right: auto;
            margin-left: auto;
        }

        /* Smooth scrolling */

        html {
            scroll-behavior: smooth;
            scroll-padding-top: 90px;
        }

/* =====================================================
   HEADER
===================================================== */

.header {

    position: fixed;

    left: 0;
    top: 0;

    width: 100%;

    z-index: 999;

    background:
        rgba(23, 22, 23, 0.96);

    border-bottom:
        1px solid rgba(
            255,
            255,
            255,
            .08
        );

    transition: .3s;

}


.header.scrolled {

    background:
        rgba(23, 22, 23, 0.99);

    box-shadow:
        0 10px 30px rgba(0,0,0,.2);

}


.nav {

    min-height: 82px;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.logo img {

    width: 175px;

    height: auto;

}


.nav-links {

    display: flex;

    align-items: center;

    gap: 34px;

}


.nav-links a {

    color: #fff;

    font-size: 12px;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: 1px;

    transition: .3s;

}


.nav-links a:hover {

    color: #d98d91;

}


.nav-links .nav-btn {

    background: var(--maroon);

    padding: 14px 22px;

    color: #fff;

}


.nav-links .nav-btn:hover {

    background: #961d28;

    color: #fff;

}


.menu-toggle {

    display: none;

    width: 42px;

    height: 42px;

    border: 1px solid #555;

    background: transparent;

    cursor: pointer;

}


.menu-toggle span {

    display: block;

    width: 20px;

    height: 2px;

    background: white;

    margin: 4px auto;

    transition: .3s;

}
        /* =========================================
   BREADCRUMB
========================================= */

        .aodd-detail-page .breadcrumb {
            padding-top: 14px;
            padding-bottom: 14px;
            color: #777;
            font-size: 12px;
        }

        .aodd-detail-page .breadcrumb a {
            transition: color 0.2s ease;
        }

        .aodd-detail-page .breadcrumb a:hover {
            color: var(--detail-red);
        }

        .aodd-detail-page .breadcrumb span {
            margin: 0 9px;
            color: #aaa;
        }

        .aodd-detail-page .breadcrumb strong {
            color: var(--detail-red);
        }

        /* =========================================
   HERO SECTION
========================================= */

        .aodd-detail-page .hero {
            position: relative;
            isolation: isolate;
            overflow: hidden;
            color: #fff;
            background:
                radial-gradient(ellipse at 10% 10%, rgba(165, 42, 53, 0.24), transparent 42%),
                linear-gradient(125deg, #202020 0%, #303030 56%, #501018 100%);
        }

        .aodd-detail-page .hero::before {
            content: "";
            position: absolute;
            z-index: -1;
            top: -180px;
            right: -120px;
            width: 440px;
            height: 440px;
            border: 1px solid rgba(255, 255, 255, 0.07);
            border-radius: 50%;
            box-shadow:
                0 0 0 45px rgba(255, 255, 255, 0.018),
                0 0 0 90px rgba(255, 255, 255, 0.014);
        }

        .aodd-detail-page .hero-grid {
            display: grid;
            grid-template-columns: 1fr 1.05fr;
            align-items: center;
            gap: 55px;
            padding-top: 115px;
            padding-bottom: 68px;
        }

        .aodd-detail-page .hero-copy {
            min-width: 0;
            animation: aoddFadeUp 0.8s ease both;
        }

        .aodd-detail-page .eyebrow,
        .aodd-detail-page .kicker {
            display: inline-block;
            margin-bottom: 12px;
            color: #dca8ae;
            font-size: 11px;
            font-weight: 800;
            letter-spacing: 2px;
            line-height: 1.6;
            text-transform: uppercase;
        }

        .aodd-detail-page .hero h1 {
            max-width: 650px;
            margin-bottom: 18px;
            color: #fff;
            font-size: clamp(42px, 5vw, 66px);
            line-height: 1.03;
            letter-spacing: -0.7px;
        }

        .aodd-detail-page .hero h2 {
            margin-bottom: 18px;
            color: #f1cbd0;
            font-family: Inter, Arial, sans-serif;
            font-size: clamp(18px, 2vw, 23px);
            font-weight: 600;
            line-height: 1.45;
        }

        .aodd-detail-page .hero p {
            margin-bottom: 15px;
            color: #dedede;
            font-size: 14px;
            line-height: 1.9;
        }

        .aodd-detail-page .hero .note {
            margin-top: 17px;
            margin-bottom: 0;
            color: #c7c7c7;
            font-size: 11px;
            line-height: 1.7;
        }

        .aodd-detail-page .hero-media {
            position: relative;
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 14px;
            min-width: 0;
            padding: 44px 17px 18px;
            overflow: hidden;
            border: 1px solid rgba(255, 255, 255, 0.6);
            border-radius: 15px;
            background: #fff;
            box-shadow: 0 25px 60px rgba(0, 0, 0, 0.27);
            animation: aoddFadeUp 0.9s 0.12s ease both;
        }

        .aodd-detail-page .hero-media::before {
            content: "AVAILABLE PRODUCT OPTIONS";
            position: absolute;
            top: 15px;
            left: 19px;
            color: var(--detail-red);
            font-size: 10px;
            font-weight: 800;
            letter-spacing: 1.6px;
        }

        .aodd-detail-page .pump {
            min-width: 0;
            padding: 12px 5px 10px;
            border-radius: 9px;
            background: linear-gradient(180deg, #fff, #f7f7f7);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .aodd-detail-page .pump:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
        }

        .aodd-detail-page .pump img {
            width: 100%;
            height: 235px;
            object-fit: contain;
            transition: transform 0.4s ease;
        }

        .aodd-detail-page .pump:hover img {
            transform: scale(1.045);
        }

        .aodd-detail-page .pump span {
            display: block;
            margin-top: 9px;
            color: var(--detail-red);
            font-size: 10px;
            font-weight: 800;
            letter-spacing: 0.7px;
            text-align: center;
        }

        /* =========================================
   BUTTONS
========================================= */

        .aodd-detail-page .actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            margin-top: 25px;
        }

        .aodd-detail-page .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            min-height: 46px;
            padding: 12px 20px;
            border: 1px solid transparent;
            border-radius: 5px;
            font-size: 13px;
            font-weight: 800;
            line-height: 1.4;
            text-align: center;
            transition:
                transform 0.25s ease,
                background 0.25s ease,
                color 0.25s ease,
                box-shadow 0.25s ease;
        }

        .aodd-detail-page .btn:hover {
            transform: translateY(-3px);
        }

        .aodd-detail-page .btn.primary {
            background: var(--detail-red);
            color: #fff;
            box-shadow: 0 7px 18px rgba(123, 23, 32, 0.22);
        }

        .aodd-detail-page .btn.primary:hover {
            background: var(--detail-red-light);
            box-shadow: 0 10px 24px rgba(123, 23, 32, 0.3);
        }

        .aodd-detail-page .btn.outline {
            border-color: rgba(255, 255, 255, 0.55);
            background: transparent;
            color: #fff;
        }

        .aodd-detail-page .btn.outline:hover {
            border-color: #fff;
            background: #fff;
            color: var(--detail-red);
        }

        .aodd-detail-page .ctainner .btn {
            flex-shrink: 0;
            background: #fff;
            color: var(--detail-red);
        }

        .aodd-detail-page .ctainner .btn:hover {
            background: #f8e9eb;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
        }

        /* =========================================
   QUICK SPECIFICATION STRIP
========================================= */

        .aodd-detail-page .quick {
            position: relative;
            z-index: 2;
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin-top: 0;
            overflow: hidden;
            border: 1px solid var(--detail-border);
            border-top: 0;
            border-radius: 0 0 12px 12px;
            background: #fff;
            box-shadow: 0 14px 35px rgba(0, 0, 0, 0.07);
        }

        .aodd-detail-page .qitem {
            position: relative;
            padding: 24px 12px;
            text-align: center;
            transition: background 0.25s ease;
        }

        .aodd-detail-page .qitem:not(:last-child) {
            border-right: 1px solid var(--detail-border);
        }

        .aodd-detail-page .qitem:hover {
            background: var(--detail-soft);
        }

        .aodd-detail-page .qitem span {
            display: block;
            margin-bottom: 5px;
            color: var(--detail-muted);
            font-size: 10px;
            font-weight: 800;
            letter-spacing: 1.1px;
        }

        .aodd-detail-page .qitem strong {
            color: var(--detail-red);
            font-size: clamp(17px, 2vw, 23px);
            font-weight: 800;
            line-height: 1.4;
        }

        /* =========================================
   CONTENT SECTIONS AND HEADINGS
========================================= */

        .aodd-detail-page section.content {
            position: relative;
            padding: 78px 0;
            background: #fff;
        }

        .aodd-detail-page section.content.light {
            background: var(--detail-light);
        }

        .aodd-detail-page section.content.dark {
            overflow: hidden;
            background:
                radial-gradient(ellipse at 100% 0%, rgba(123, 23, 32, 0.23), transparent 40%),
                linear-gradient(125deg, #222, #303030);
            color: #fff;
        }

        .aodd-detail-page .heading {
            max-width: 780px;
            margin: 0 auto 43px;
            text-align: center;
        }

        .aodd-detail-page .heading .kicker {
            margin-bottom: 9px;
            color: var(--detail-red);
        }

        .aodd-detail-page .dark .heading .kicker {
            color: #e1aeb4;
        }

        .aodd-detail-page .heading h2 {
            margin-bottom: 15px;
            color: var(--detail-dark);
            font-size: clamp(31px, 3.7vw, 44px);
            line-height: 1.12;
        }

        .aodd-detail-page .dark .heading h2 {
            color: #fff;
        }

        .aodd-detail-page .heading p {
            max-width: 690px;
            margin: 0 auto;
            color: var(--detail-muted);
            font-size: 14px;
            line-height: 1.85;
        }

        .aodd-detail-page .dark .heading p {
            color: #d0d0d0;
        }

        /* =========================================
   OVERVIEW AND SUMMARY PANEL
========================================= */

        .aodd-detail-page .overview {
            display: grid;
            grid-template-columns: 1.2fr 0.8fr;
            align-items: start;
            gap: 38px;
        }

        .aodd-detail-page .copy p {
            margin-bottom: 18px;
            color: #585858;
            font-size: 14px;
            line-height: 1.95;
        }

        .aodd-detail-page .copy strong {
            color: var(--detail-red);
            font-weight: 800;
        }

        .aodd-detail-page .summary {
            padding: 29px;
            border: 1px solid var(--detail-border);
            border-top: 4px solid var(--detail-red);
            border-radius: 10px;
            background: #fff;
            box-shadow: var(--detail-shadow);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .aodd-detail-page .summary:hover {
            transform: translateY(-4px);
            box-shadow: 0 18px 42px rgba(0, 0, 0, 0.1);
        }

        .aodd-detail-page .stat {
            margin-bottom: 17px;
            padding-bottom: 20px;
            border-bottom: 1px solid var(--detail-border);
        }

        .aodd-detail-page .stat>span {
            display: block;
            margin-bottom: 8px;
            color: var(--detail-muted);
            font-size: 10px;
            font-weight: 800;
            letter-spacing: 1.1px;
        }

        .aodd-detail-page .stat>strong {
            display: block;
            color: var(--detail-red);
            font-size: 48px;
            line-height: 1.1;
        }

        .aodd-detail-page .checks {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .aodd-detail-page .checks li {
            display: flex;
            align-items: flex-start;
            gap: 11px;
            padding: 12px 0;
            border-bottom: 1px solid #f0f0f0;
            color: #4a4a4a;
            font-size: 13px;
            line-height: 1.65;
        }

        .aodd-detail-page .checks li:last-child {
            border-bottom: 0;
        }

        .aodd-detail-page .tick {
            display: inline-flex;
            flex: 0 0 22px;
            align-items: center;
            justify-content: center;
            width: 22px;
            height: 22px;
            border-radius: 50%;
            background: var(--detail-soft);
            color: var(--detail-red);
            font-size: 12px;
            font-weight: 900;
        }

        /* =========================================
   PREMIUM TECHNICAL SPECIFICATION TABLE
========================================= */

        .aodd-detail-page .tablewrap {
            position: relative;
            overflow-x: auto;
            border: 1px solid #e5dfe0;
            border-radius: 12px;
            background: #fff;
            box-shadow: 0 14px 38px rgba(0, 0, 0, 0.075);
            scrollbar-color: var(--detail-red) #eee;
            scrollbar-width: thin;
        }

        .aodd-detail-page .tablewrap table {
            width: 100%;
            min-width: 540px;
            border-collapse: separate;
            border-spacing: 0;
            background: #fff;
        }

        .aodd-detail-page .tablewrap tbody tr:first-child th,
        .aodd-detail-page .tablewrap tbody tr:first-child td {
            border-top: 0;
        }

        .aodd-detail-page .tablewrap th,
        .aodd-detail-page .tablewrap td {
            padding: 16px 23px;
            border-top: 1px solid #ece8e8;
            border-bottom: 0;
            font-size: 13px;
            line-height: 1.65;
            text-align: left;
            vertical-align: middle;
            transition: background 0.22s ease, color 0.22s ease;
        }

        .aodd-detail-page .tablewrap th {
            width: 39%;
            background: #f7f4f4;
            color: #333;
            font-weight: 800;
        }

        .aodd-detail-page .tablewrap td {
            background: #fff;
            color: #555;
            font-weight: 500;
        }

        .aodd-detail-page .tablewrap tbody tr:nth-child(even) th {
            background: #f0ebec;
        }

        .aodd-detail-page .tablewrap tbody tr:nth-child(even) td {
            background: #fcfafb;
        }

        .aodd-detail-page .tablewrap tbody tr:hover th,
        .aodd-detail-page .tablewrap tbody tr:hover td {
            background: #f9e9eb;
        }

        .aodd-detail-page .tablewrap tbody tr:hover th {
            color: var(--detail-red);
        }

        .aodd-detail-page .tablewrap tbody tr:hover td {
            color: #292929;
        }

        .aodd-detail-page .tablewrap tbody tr {
            transition: box-shadow 0.22s ease;
        }

        .aodd-detail-page .tablewrap tbody tr:hover {
            box-shadow: inset 4px 0 0 var(--detail-red);
        }

        .aodd-detail-page .smallnote {
            margin-top: 17px;
            padding: 15px 18px;
            border-left: 3px solid var(--detail-red);
            border-radius: 0 6px 6px 0;
            background: #fff;
            color: #666;
            font-size: 12px;
            line-height: 1.85;
        }

        /* =========================================
   APPLICATION CARDS
========================================= */

        .aodd-detail-page .cards {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 22px;
        }

        .aodd-detail-page .card {
            position: relative;
            min-width: 0;
            padding: 28px 25px;
            overflow: hidden;
            border: 1px solid var(--detail-border);
            border-radius: 10px;
            background: #fff;
            box-shadow: 0 5px 18px rgba(0, 0, 0, 0.025);
            transition:
                transform 0.3s ease,
                box-shadow 0.3s ease,
                border-color 0.3s ease;
        }

        .aodd-detail-page .card::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 0;
            height: 3px;
            background: var(--detail-red);
            transition: width 0.35s ease;
        }

        .aodd-detail-page .card:hover {
            transform: translateY(-7px);
            border-color: #dfb7bb;
            box-shadow: 0 17px 35px rgba(68, 15, 20, 0.09);
        }

        .aodd-detail-page .card:hover::before {
            width: 100%;
        }

        .aodd-detail-page .ico {
            display: grid;
            place-items: center;
            width: 48px;
            height: 48px;
            margin-bottom: 18px;
            border: 1px solid #f0dadd;
            border-radius: 10px;
            background: var(--detail-soft);
            color: var(--detail-red);
            font-size: 23px;
            transition: transform 0.3s ease, background 0.3s ease;
        }

        .aodd-detail-page .card:hover .ico {
            transform: rotate(-5deg) scale(1.07);
            background: #f4dfe2;
        }

        .aodd-detail-page .card h3 {
            margin-bottom: 10px;
            color: #292929;
            font-size: 21px;
            line-height: 1.3;
        }

        .aodd-detail-page .card p {
            margin-bottom: 0;
            color: var(--detail-muted);
            font-size: 13px;
            line-height: 1.85;
        }

        /* =========================================
   FEATURES SECTION
========================================= */

        .aodd-detail-page .features {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 17px;
        }

        .aodd-detail-page .feature {
            position: relative;
            min-width: 0;
            padding: 25px 21px;
            overflow: hidden;
            border: 1px solid #484848;
            border-radius: 9px;
            background: linear-gradient(145deg, #343434, #292929);
            transition:
                transform 0.3s ease,
                border-color 0.3s ease,
                background 0.3s ease;
        }

        .aodd-detail-page .feature::after {
            content: "";
            position: absolute;
            right: -28px;
            bottom: -28px;
            width: 90px;
            height: 90px;
            border: 1px solid rgba(255, 255, 255, 0.045);
            border-radius: 50%;
            transition: transform 0.4s ease;
        }

        .aodd-detail-page .feature:hover {
            transform: translateY(-6px);
            border-color: #a24c55;
            background: linear-gradient(145deg, #3a3031, #292929);
        }

        .aodd-detail-page .feature:hover::after {
            transform: scale(1.45);
        }

        .aodd-detail-page .num {
            display: block;
            margin-bottom: 15px;
            color: #dda6ac;
            font-size: 10px;
            font-weight: 800;
            letter-spacing: 1.4px;
        }

        .aodd-detail-page .feature h3 {
            margin-bottom: 10px;
            color: #fff;
            font-size: 20px;
            line-height: 1.25;
        }

        .aodd-detail-page .feature p {
            margin-bottom: 0;
            color: #cfcfcf;
            font-size: 12px;
            line-height: 1.85;
        }

        /* =========================================
   MATERIAL CARDS
========================================= */

        .aodd-detail-page .materials {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 18px;
        }

        .aodd-detail-page .material {
            position: relative;
            padding: 26px 22px;
            overflow: hidden;
            border: 1px solid var(--detail-border);
            border-radius: 9px;
            background: #fff;
            transition:
                transform 0.3s ease,
                box-shadow 0.3s ease,
                border-color 0.3s ease;
        }

        .aodd-detail-page .material::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 4px;
            height: 0;
            background: var(--detail-red);
            transition: height 0.3s ease;
        }

        .aodd-detail-page .material:hover {
            transform: translateY(-5px);
            border-color: #e0b9bd;
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.065);
        }

        .aodd-detail-page .material:hover::before {
            height: 100%;
        }

        .aodd-detail-page .material h3 {
            margin-bottom: 11px;
            color: var(--detail-red);
            font-size: 22px;
            line-height: 1.25;
        }

        .aodd-detail-page .material p {
            margin-bottom: 0;
            color: var(--detail-muted);
            font-size: 12px;
            line-height: 1.9;
        }

        /* =========================================
   NOTICE BOXES
========================================= */

        .aodd-detail-page .notice {
            margin-top: 24px;
            padding: 18px 22px;
            border: 1px solid #eedbdd;
            border-left: 4px solid var(--detail-red);
            border-radius: 0 8px 8px 0;
            background: linear-gradient(100deg, #fbf0f1, #fffafa);
            color: #5c4144;
            font-size: 13px;
            line-height: 1.85;
        }

        .aodd-detail-page .notice strong {
            color: var(--detail-red);
        }

        /* =========================================
   WHY AMBICA SECTION
========================================= */

        .aodd-detail-page .why {
            display: grid;
            grid-template-columns: 0.8fr 1.2fr;
            align-items: center;
            gap: 42px;
        }

        .aodd-detail-page .whybox {
            padding: 36px 31px;
            border-radius: 12px;
            background:
                radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.12), transparent 45%),
                linear-gradient(145deg, var(--detail-red), var(--detail-red-dark));
            color: #fff;
            box-shadow: 0 16px 35px rgba(87, 16, 24, 0.18);
        }

        .aodd-detail-page .whybox .kicker {
            color: #f0c5ca;
        }

        .aodd-detail-page .whybox h2 {
            margin-bottom: 17px;
            color: #fff;
            font-size: clamp(29px, 3vw, 38px);
            line-height: 1.12;
        }

        .aodd-detail-page .whybox p {
            margin-bottom: 0;
            color: #f2e3e5;
            font-size: 13px;
            line-height: 1.9;
        }

        .aodd-detail-page .whylist {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 23px 25px;
        }

        .aodd-detail-page .whyitem {
            padding-bottom: 16px;
            border-bottom: 1px solid var(--detail-border);
            transition: border-color 0.25s ease, transform 0.25s ease;
        }

        .aodd-detail-page .whyitem:hover {
            transform: translateX(3px);
            border-color: #c98b92;
        }

        .aodd-detail-page .whyitem h3 {
            margin-bottom: 7px;
            color: #303030;
            font-size: 20px;
            line-height: 1.3;
        }

        .aodd-detail-page .whyitem p {
            margin-bottom: 0;
            color: var(--detail-muted);
            font-size: 12px;
            line-height: 1.85;
        }

        /* =========================================
   FAQ ACCORDION
========================================= */

        .aodd-detail-page .faqs {
            display: grid;
            gap: 12px;
            max-width: 900px;
            margin: 0 auto;
        }

        .aodd-detail-page .faqs details {
            overflow: hidden;
            border: 1px solid #e6e2e2;
            border-radius: 8px;
            background: #fff;
            box-shadow: 0 3px 12px rgba(0, 0, 0, 0.02);
            transition: border-color 0.25s ease, box-shadow 0.25s ease;
        }

        .aodd-detail-page .faqs details:hover,
        .aodd-detail-page .faqs details[open] {
            border-color: #d6a4a9;
            box-shadow: 0 8px 22px rgba(87, 16, 24, 0.06);
        }

        .aodd-detail-page .faqs summary {
            position: relative;
            padding: 19px 54px 19px 21px;
            color: #303030;
            font-size: 14px;
            font-weight: 800;
            line-height: 1.6;
            cursor: pointer;
            list-style: none;
        }

        .aodd-detail-page .faqs summary::-webkit-details-marker {
            display: none;
        }

        .aodd-detail-page .faqs summary::after {
            content: "+";
            position: absolute;
            top: 50%;
            right: 20px;
            display: grid;
            place-items: center;
            width: 27px;
            height: 27px;
            border-radius: 50%;
            background: var(--detail-soft);
            color: var(--detail-red);
            font-size: 21px;
            font-weight: 500;
            transform: translateY(-50%);
            transition: background 0.25s ease, color 0.25s ease;
        }

        .aodd-detail-page .faqs details[open] summary {
            color: var(--detail-red);
        }

        .aodd-detail-page .faqs details[open] summary::after {
            content: "−";
            background: var(--detail-red);
            color: #fff;
        }

        .aodd-detail-page .faqs details p {
            margin: 0;
            padding: 0 21px 20px;
            color: var(--detail-muted);
            font-size: 13px;
            line-height: 1.9;
        }

        /* =========================================
   BOTTOM CTA
========================================= */

        .aodd-detail-page .ctaband {
            position: relative;
            overflow: hidden;
            padding: 48px 0;
            background:
                radial-gradient(circle at 95% 0%, rgba(255, 255, 255, 0.1), transparent 32%),
                linear-gradient(110deg, var(--detail-red), var(--detail-red-dark));
            color: #fff;
        }

        .aodd-detail-page .ctainner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 30px;
        }

        .aodd-detail-page .ctainner>div {
            max-width: 760px;
        }

        .aodd-detail-page .ctainner h2 {
            margin-bottom: 9px;
            color: #fff;
            font-size: clamp(28px, 3.5vw, 39px);
            line-height: 1.15;
        }

        .aodd-detail-page .ctainner p {
            margin-bottom: 0;
            color: #f1dfe1;
            font-size: 13px;
            line-height: 1.8;
        }

        /* =========================================
        FOOTER
        ========================================= */

        .aodd-detail-page footer {
            /* padding: 49px 0 18px; */
            background: #202020;
            color: #fff;
        }

        .aodd-detail-page .footgrid {
            display: grid;
            grid-template-columns: 1.2fr 0.8fr 1fr;
            gap: 36px;
            padding-bottom: 30px;
        }

        .aodd-detail-page .footlogo {
            width: 185px;
            max-height: 65px;
            margin-bottom: 18px;
            padding: 5px;
            border-radius: 4px;
            background: #fff;
            object-fit: contain;
        }

        .aodd-detail-page footer h3 {
            margin-bottom: 16px;
            color: #fff;
            font-size: 21px;
        }

        .aodd-detail-page footer p,
        .aodd-detail-page footer li {
            color: #c8c8c8;
            font-size: 12px;
            line-height: 1.9;
        }

        .aodd-detail-page footer p {
            margin-bottom: 17px;
        }

        .aodd-detail-page footer ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .aodd-detail-page footer li {
            margin: 8px 0;
        }

        .aodd-detail-page footer li a {
            display: inline-block;
            transition: color 0.2s ease, transform 0.2s ease;
        }

        .aodd-detail-page footer li a:hover {
            transform: translateX(4px);
            color: #f0b7bd;
        }

        .aodd-detail-page .footbottom {
            display: flex;
            justify-content: space-between;
            gap: 18px;
            padding-top: 19px;
            border-top: 1px solid #3c3c3c;
            color: #aaa;
            font-size: 11px;
            line-height: 1.8;
        }

        /* =========================================
   ENTRANCE ANIMATIONS
========================================= */

        @keyframes aoddFadeUp {
            from {
                opacity: 0;
                transform: translateY(22px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* =========================================
   TABLET RESPONSIVE
========================================= */

        @media (max-width: 1050px) {
            .aodd-detail-page .navlinks {
                gap: 14px;
                font-size: 12px;
            }

            .aodd-detail-page .logo img {
                width: 165px;
            }

            .aodd-detail-page .hero-grid {
                gap: 32px;
            }

            .aodd-detail-page .pump img {
                height: 205px;
            }

            .aodd-detail-page .features {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .aodd-detail-page .materials {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        /* =========================================
   MOBILE NAVIGATION AND LAYOUT
========================================= */

        @media (max-width: 760px) {
            .aodd-detail-page .container {
                width: calc(100% - 30px);
            }

            .aodd-detail-page .nav {
                min-height: 70px;
            }

            .aodd-detail-page .logo img {
                width: 155px;
                max-height: 55px;
            }

            .aodd-detail-page .toggle {
                display: block;
            }

            .aodd-detail-page .navlinks {
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                display: none;
                align-items: stretch;
                flex-direction: column;
                gap: 0;
                padding: 13px 22px 20px;
                border-bottom: 1px solid var(--detail-border);
                background: #fff;
                box-shadow: 0 15px 24px rgba(0, 0, 0, 0.09);
            }

            .aodd-detail-page .navlinks.open {
                display: flex;
                animation: aoddFadeUp 0.22s ease both;
            }

            .aodd-detail-page .navlinks>a:not(.navcta) {
                padding: 12px 0;
                border-bottom: 1px solid #f1eeee;
            }

            .aodd-detail-page .navlinks>a:not(.navcta)::after {
                display: none;
            }

            .aodd-detail-page .navlinks .navcta {
                margin-top: 13px;
                padding: 13px;
            }

            .aodd-detail-page .hero-grid {
                grid-template-columns: minmax(0, 1fr);
                gap: 28px;
                padding-top: 39px;
                padding-bottom: 42px;
            }

            .aodd-detail-page .hero-copy {
                order: 1;
            }

            .aodd-detail-page .hero-media {
                order: 2;
                width: 100%;
                max-width: 560px;
                margin: 0 auto;
            }

            .aodd-detail-page .hero h1 {
                font-size: clamp(38px, 9vw, 54px);
            }

            .aodd-detail-page .pump img {
                height: 190px;
            }

            .aodd-detail-page .quick {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                border-radius: 0 0 10px 10px;
            }

            .aodd-detail-page .qitem {
                padding: 18px 10px;
            }

            .aodd-detail-page .qitem:nth-child(2) {
                border-right: 0;
            }

            .aodd-detail-page .qitem:nth-child(-n+2) {
                border-bottom: 1px solid var(--detail-border);
            }

            .aodd-detail-page section.content {
                padding: 55px 0;
            }

            .aodd-detail-page .heading {
                margin-bottom: 30px;
            }

            .aodd-detail-page .heading h2 {
                font-size: clamp(29px, 7vw, 36px);
            }

            .aodd-detail-page .overview,
            .aodd-detail-page .why {
                grid-template-columns: minmax(0, 1fr);
                gap: 25px;
            }

            .aodd-detail-page .cards {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 15px;
            }

            .aodd-detail-page .card {
                padding: 23px 19px;
            }

            .aodd-detail-page .whylist {
                gap: 20px;
            }

            .aodd-detail-page .ctainner {
                align-items: flex-start;
                flex-direction: column;
                gap: 22px;
            }

            .aodd-detail-page .footgrid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 28px;
            }

            .aodd-detail-page .footgrid>div:first-child {
                grid-column: 1 / -1;
            }

            .aodd-detail-page .footbottom {
                flex-direction: column;
                gap: 7px;
            }
        }

        /* =========================================
   SMALL MOBILE
========================================= */

        @media (max-width: 480px) {
            .aodd-detail-page .container {
                width: calc(100% - 26px);
            }

            .aodd-detail-page .breadcrumb {
                font-size: 10px;
                line-height: 1.9;
            }

            .aodd-detail-page .breadcrumb span {
                margin: 0 4px;
            }

            .aodd-detail-page .hero-grid {
                padding-top: 31px;
                padding-bottom: 32px;
            }

            .aodd-detail-page .hero h1 {
                font-size: 39px;
            }

            .aodd-detail-page .hero h2 {
                font-size: 18px;
            }

            .aodd-detail-page .hero p {
                font-size: 13px;
            }

            .aodd-detail-page .hero-media {
                gap: 7px;
                padding: 39px 8px 11px;
                border-radius: 10px;
            }

            .aodd-detail-page .hero-media::before {
                left: 12px;
                font-size: 9px;
            }

            .aodd-detail-page .pump {
                padding: 9px 2px;
            }

            .aodd-detail-page .pump img {
                height: 135px;
            }

            .aodd-detail-page .pump span {
                font-size: 8px;
                letter-spacing: 0.3px;
            }

            .aodd-detail-page .actions {
                flex-direction: column;
                gap: 10px;
            }

            .aodd-detail-page .actions .btn {
                width: 100%;
            }

            .aodd-detail-page .qitem span {
                font-size: 9px;
                letter-spacing: 0.6px;
            }

            .aodd-detail-page .qitem strong {
                font-size: 17px;
            }

            .aodd-detail-page .summary {
                padding: 22px 18px;
            }

            .aodd-detail-page .stat>strong {
                font-size: 42px;
            }

            .aodd-detail-page .cards,
            .aodd-detail-page .features,
            .aodd-detail-page .materials,
            .aodd-detail-page .whylist {
                grid-template-columns: minmax(0, 1fr);
            }

            .aodd-detail-page .card,
            .aodd-detail-page .feature,
            .aodd-detail-page .material {
                padding: 23px;
            }

            .aodd-detail-page .tablewrap th,
            .aodd-detail-page .tablewrap td {
                padding: 13px 14px;
                font-size: 12px;
            }

            .aodd-detail-page .whybox {
                padding: 27px 23px;
            }

            .aodd-detail-page .faqs summary {
                padding: 16px 43px 16px 15px;
                font-size: 13px;
            }

            .aodd-detail-page .faqs summary::after {
                right: 12px;
            }

            .aodd-detail-page .faqs details p {
                padding: 0 15px 17px;
                font-size: 12px;
            }

            .aodd-detail-page .footgrid {
                grid-template-columns: minmax(0, 1fr);
                gap: 24px;
            }

            .aodd-detail-page .footgrid>div:first-child {
                grid-column: auto;
            }
        }

        /* =========================================
   ACCESSIBILITY: REDUCED MOTION
========================================= */

        @media (prefers-reduced-motion: reduce) {
            html {
                scroll-behavior: auto;
            }

            .aodd-detail-page *,
            .aodd-detail-page *::before,
            .aodd-detail-page *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;
            }
        }