
        :root {
            --cream: #f7f4ec;
            --wine: #72373c;
            --ink: #292a25;
            --line: #d9d6cc
        }

        * {
            box-sizing: border-box
        }

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

        body {
            margin: 0;
            background: var(--cream);
            color: var(--ink);
            font-family: "Jost-Regular";
        }

        button,
        a {
            -webkit-tap-highlight-color: transparent
        }

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

        button {
            font: inherit;
            cursor: pointer
        }

        header {
            height: 88px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 5%;
            border-bottom: 1px solid var(--line);
            background: var(--cream);
            position: sticky;
            top: 0;
            z-index: 10
        }

        .logo {
            font-size: 29px;
            font-weight: 700;
            letter-spacing: 5px
        }

        nav {
            display: flex;
            gap: 32px;
            font-size: 13px
        }

        .nav-cta {
            border-bottom: 1px solid;
            padding-bottom: 5px
        }

        .menu {
            display: none
        }

        .eyebrow {
            font-size: 11px;
            letter-spacing: 2px;
            text-transform: uppercase
        }

        .hero {
            padding: 65px 5% 0
        }

        .hero-top {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 40px;
            margin-bottom: 43px
        }

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

        h1,
        h2,
        .serif {
            font-family: Georgia, 'Times New Roman', serif;
            font-weight: 400
        }

        h1 {
            font-size: clamp(56px, 7.6vw, 112px);
            line-height: .96;
            letter-spacing: -5px;
            margin-top: 23px
        }

        h1 em {
            font-weight: 400;
            color: var(--wine)
        }

        .hero-copy {
            width: 310px;
            padding-bottom: 5px;
            font-size: 15px;
            line-height: 1.7
        }

        .pill {
            display: inline-flex;
            align-items: center;
            gap: 32px;
            background: var(--wine);
            color: white;
            border: 0;
            border-radius: 30px;
            padding: 17px 25px;
            font-size: 13px;
            margin-top: 25px
        }

        .pill:hover {
            background: #54262b
        }

        .hero-visual {
            height: 510px;
            position: relative;
            overflow: hidden;
            background: #ded7cd;
            border-radius: 3px
        }

        .hero-visual img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
            animation: slowzoom 16s ease-in-out infinite alternate
        }

        .visual-labels {
            position: absolute;
            bottom: 24px;
            left: 0;
            right: 0;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            color: white;
            text-shadow: 0 1px 10px #000;
            font-size: 12px;
            letter-spacing: 1px;
            text-transform: uppercase
        }

        .visual-labels a {
            padding-left: 25px
        }

        .visual-labels a:hover {
            text-decoration: underline
        }

        .hero-bottom {
            display: flex;
            justify-content: space-between;
            padding: 20px 0;
            font-size: 11px;
            letter-spacing: 1px;
            text-transform: uppercase
        }

        .ticker {
            margin-top: 40px;
            background: var(--wine);
            color: #f8e9de;
            overflow: hidden;
            padding: 19px 0;
            display: flex
        }

        .ticker-track {
            display: flex;
            white-space: nowrap;
            animation: marquee 35s linear infinite;
            font-family: Georgia, serif;
            font-size: 24px;
            gap: 45px
        }

        .section {
            padding: 90px 5%
        }

        .section-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom: 35px;
            gap: 25px
        }

        h2 {
            font-size: clamp(38px, 4.5vw, 65px);
            letter-spacing: -2px;
            margin-top: 15px
        }

        .section-head p {
            max-width: 320px;
            line-height: 1.7;
            font-size: 14px
        }

        .tabs {
            display: flex;
            gap: 10px;
            margin-bottom: 32px;
            flex-wrap: wrap
        }

        .tab {
            border: 1px solid var(--line);
            border-radius: 30px;
            background: transparent;
            padding: 11px 21px;
            font-size: 12px
        }

        .tab.active,
        .tab:hover {
            background: var(--ink);
            color: white;
            border-color: var(--ink)
        }

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

        .product {
            border-top: 1px solid var(--line);
            padding-top: 18px
        }

        .product[hidden] {
            display: none
        }

        .product-image {
            height: 260px;
            overflow: hidden;
            background: #e8e2d8;
            position: relative
        }

        .product-image img {
            width: 300%;
            max-width: none;
            height: 100%;
            object-fit: cover;
            transition: transform .6s
        }

        .product-image.body img {
            margin-left: 0
        }

        .product-image.fitness img {
            margin-left: -100%
        }

        .product-image.garden img {
            margin-left: -200%
        }

        .product:hover .product-image img {
            transform: scale(1.035)
        }

        .product-image .tag {
            position: absolute;
            top: 15px;
            left: 15px;
            background: var(--cream);
            padding: 7px 10px;
            font-size: 10px;
            text-transform: uppercase;
            letter-spacing: 1px
        }

        .product-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 18px 0 10px
        }

        h3 {
            font-size: 20px;
            font-weight: 400
        }

        .product p {
            font-size: 13px;
            line-height: 1.65;
            color: #65665e;
            min-height: 43px
        }

        .detail {
            border: 0;
            border-bottom: 1px solid #aaa;
            background: transparent;
            padding: 9px 0 5px;
            font-size: 12px;
            margin-top: 8px
        }

        .story {
            background: #e9e6dc;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 70px;
            align-items: center
        }

        .story-art {
            height: 480px;
            overflow: hidden;
            position: relative
        }

        .story-art img {
            width: 300%;
            height: 100%;
            object-fit: cover;
            margin-left: 0
        }

        .story .text p {
            line-height: 1.8;
            font-size: 15px;
            margin-top: 25px;
            max-width: 450px
        }

        .story small {
            display: block;
            margin-top: 25px;
            letter-spacing: 1px;
            font-size: 11px
        }

        .shop-banner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 65px 5%;
            background: var(--wine);
            color: var(--cream);
            gap: 30px
        }

        .shop-banner h2 {
            margin-top: 0;
            font-size: 48px
        }

        .shop-banner p {
            margin-top: 15px;
            font-size: 14px
        }

        .shop-banner .pill {
            background: var(--cream);
            color: var(--wine);
            margin-top: 0;
            white-space: nowrap
        }

        footer {
            padding: 50px 5% 25px
        }

        .footer-top {
            display: flex;
            justify-content: space-between;
            gap: 30px
        }

        .footer-top p {
            max-width: 300px;
            font-size: 13px;
            line-height: 1.7;
            margin-top: 15px
        }

        .footer-links {
            display: flex;
            gap: 35px;
            font-size: 12px
        }

        .footer-bottom {
            margin-top: 45px;
            border-top: 1px solid var(--line);
            padding-top: 20px;
            display: flex;
            justify-content: space-between;
            font-size: 10px;
            color: #68695f
        }

        .reveal {
            opacity: 0;
            transform: translateY(25px);
            transition: opacity .8s, transform .8s
        }

        .reveal.visible {
            opacity: 1;
            transform: none
        }

        dialog {
            border: 0;
            border-radius: 5px;
            padding: 40px;
            max-width: 540px;
            width: calc(100% - 32px);
            background: var(--cream);
            color: var(--ink)
        }

        dialog::backdrop {
            background: #24201bb3;
            backdrop-filter: blur(5px)
        }

        dialog h2 {
            font-size: 40px
        }

        dialog p {
            font-size: 14px;
            line-height: 1.8;
            margin-top: 20px
        }

        .close {
            position: absolute;
            right: 15px;
            top: 15px;
            border: 0;
            background: none;
            font-size: 25px
        }

        .asset-note {
            font-size: 10px;
            color: #68695f;
            margin-top: 18px
        }

        @keyframes marquee {
            to {
                transform: translateX(-50%)
            }
        }

        @keyframes slowzoom {
            to {
                transform: scale(1.05)
            }
        }

        @media(max-width:800px) {
            header {
                height: 72px
            }

            .logo {
                font-size: 22px
            }

            nav {
                gap: 15px;
                font-size: 11px
            }

            .hero {
                padding-top: 40px
            }

            .hero-top {
                display: block
            }

            h1 {
                letter-spacing: -3px
            }

            .hero-copy {
                margin-top: 25px;
                width: auto;
                max-width: 430px
            }

            .hero-visual {
                height: 360px
            }

            .section {
                padding: 60px 5%
            }

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

            .section-head {
                display: block
            }

            .section-head p {
                margin-top: 20px
            }

            .story {
                grid-template-columns: 1fr;
                gap: 30px
            }

            .story-art {
                height: 360px
            }

            .shop-banner {
                display: block
            }

            .shop-banner .pill {
                margin-top: 25px
            }

            .footer-top {
                display: block
            }

            .footer-links {
                margin-top: 30px
            }

            .hero-bottom {
                font-size: 9px
            }

            .visual-labels {
                font-size: 9px
            }

            .visual-labels a {
                padding-left: 12px
            }
        }

        @media(max-width:480px) {
            nav a:nth-child(2) {
                display: none
            }

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

            .product-image {
                height: 330px
            }

            .hero-visual {
                height: 300px
            }

            .hero-bottom span:last-child {
                display: none
            }

            .footer-bottom {
                gap: 20px
            }

            .shop-banner h2 {
                font-size: 37px
            }
        }

        @media(prefers-reduced-motion:reduce) {
            * {
                scroll-behavior: auto !important;
                animation: none !important;
                transition: none !important
            }

            .reveal {
                opacity: 1;
                transform: none
            }
        }

        .page-hero {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 55px;
            padding: 60px 5%;
            align-items: center
        }

        .page-hero h1 {
            font-size: 76px;
            letter-spacing: -3px;
            line-height: 1.02
        }

        .page-hero p {
            max-width: 460px;
            line-height: 1.8;
            margin-top: 25px;
            font-size: 15px
        }

        .page-hero img {
            width: 100%;
            height: 540px;
            object-fit: cover
        }

        .breadcrumbs {
            font-size: 11px;
            margin-bottom: 30px;
            color: #666
        }

        .specs {
            display: flex;
            gap: 25px;
            margin-top: 30px;
            flex-wrap: wrap
        }

        .specs span {
            border-top: 1px solid var(--line);
            padding-top: 12px;
            font-size: 11px;
            letter-spacing: .7px
        }

        .feature-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 40px;
            margin-top: 40px
        }

        .feature-grid article {
            border-top: 1px solid var(--line);
            padding-top: 20px
        }

        .feature-grid p {
            font-size: 14px;
            line-height: 1.8;
            margin-top: 15px;
            color: #65665e
        }

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

        .gallery img {
            width: 100%;
            height: 420px;
            object-fit: cover;
            transition: transform .6s
        }

        .gallery figure {
            margin: 0
        }

        .gallery figcaption {
            font-size: 13px;
            margin-top: 18px;
            line-height: 1.6
        }

        .gallery button {
            width: 100%;
            padding: 0;
            border: 0;
            background: none;
            overflow: hidden;
            cursor: zoom-in
        }

        .gallery button:hover img {
            transform: scale(1.035)
        }

        .faq {
            max-width: 850px;
            margin-top: 35px
        }

        details {
            border-top: 1px solid var(--line);
            padding: 22px 0
        }

        summary {
            cursor: pointer;
            font-size: 16px
        }

        details p {
            margin-top: 15px;
            font-size: 14px;
            line-height: 1.8;
            color: #65665e
        }

        .use-section {
            background: #e9e6dc
        }

        .use-row {
            display: grid;
            grid-template-columns: 130px 1fr;
            gap: 20px;
            border-top: 1px solid #ccc8bd;
            padding: 25px 0
        }

        .use-row .serif {
            font-size: 32px;
            color: var(--wine)
        }

        .use-row p {
            line-height: 1.8;
            font-size: 14px;
            margin-top: 12px
        }

        .related {
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
            margin-top: 30px
        }

        .related a {
            border: 1px solid var(--line);
            padding: 14px 20px;
            border-radius: 30px;
            font-size: 12px
        }

        .lightbox {
            max-width: 900px;
            padding: 15px
        }

        .lightbox img {
            width: 100%;
            max-height: 80vh;
            object-fit: contain
        }

        .note {
            font-size: 11px !important;
            color: #73736b;
            line-height: 1.7 !important
        }

        .feature-grid h3 {
            font-family: Georgia, serif;
            font-size: 25px
        }

        .collection-card {
            display: block
        }

        .collection-card .product-image img {
            width: 100%;
            margin: 0
        }

        .collection-card:hover h3 {
            color: var(--wine)
        }

        @media(max-width:800px) {
            .page-hero {
                grid-template-columns: 1fr;
                gap: 30px
            }

            .page-hero h1 {
                font-size: 57px
            }

            .page-hero img {
                height: 420px
            }

            .feature-grid {
                grid-template-columns: 1fr;
                gap: 25px
            }

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

            .gallery img {
                height: 480px
            }

            .use-row {
                grid-template-columns: 60px 1fr
            }
        }

        [hidden] {
            display: none !important
        }

        a:focus-visible,
        button:focus-visible,
        summary:focus-visible {
            outline: 3px solid #72373c;
            outline-offset: 5px
        }

        .product-photo {
            object-fit: contain !important;
            background: white;
            padding: 22px
        }

        .listing-banner {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 3px
        }

        .listing-gallery {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 25px;
            margin-top: 35px
        }

        .listing-gallery figure {
            margin: 0
        }

        .listing-gallery button {
            width: 100%;
            padding: 0;
            border: 0;
            background: none;
            cursor: zoom-in
        }

        .listing-gallery img {
            width: 100%;
            height: auto;
            display: block
        }

        .listing-gallery figcaption {
            margin-top: 12px;
            font-size: 12px;
            line-height: 1.7;
            color: #666
        }

        .review-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 30px;
            margin-top: 35px
        }

        .review-card {
            border: 1px solid var(--line);
            padding: 30px
        }

        .review-card blockquote {
            font-family: Georgia, serif;
            font-size: 23px;
            line-height: 1.5;
            margin: 18px 0
        }

        .review-card small {
            font-size: 11px;
            line-height: 1.7;
            display: block
        }

        .rating {
            font-size: 13px;
            color: var(--wine);
            margin-top: 22px;
            line-height: 1.9
        }

        .ratings-panel {
            display: flex;
            gap: 35px;
            align-items: center;
            margin-top: 30px;
            flex-wrap: wrap
        }

        .ratings-panel strong {
            font-family: Georgia, serif;
            font-size: 45px;
            font-weight: 400
        }

        .ratings-panel span {
            font-size: 12px;
            line-height: 1.9
        }

        .kit {
            background: #e9e6dc;
            padding: 35px;
            margin-top: 35px
        }

        .kit ul {
            margin: 20px 0 0;
            padding-left: 20px;
            line-height: 2;
            font-size: 14px
        }

        .variant-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 30px;
            font-size: 14px
        }

        .variant-table td,
        .variant-table th {
            padding: 20px 12px;
            border-bottom: 1px solid var(--line);
            text-align: left
        }

        .variant-table a {
            text-decoration: underline
        }

        .collection-card .product-image {
            background: white
        }

        .collection-card .product-image img {
            object-fit: contain;
            padding: 15px
        }

        .hero-split {
            display: grid;
            grid-template-columns: 1.25fr .75fr;
            gap: 22px
        }

        .hero-split img {
            width: 100%;
            height: auto;
            display: block
        }

        .hero-split a {
            display: block;
            overflow: hidden
        }

        .hero-split a img {
            transition: transform .8s
        }

        .hero-split a:hover img {
            transform: scale(1.015)
        }

        .hero-split .hero-small {
            display: flex;
            flex-direction: column;
            gap: 22px
        }

        .hero-split p {
            padding: 10px 0;
            font-size: 12px
        }

        .snapshot {
            font-size: 11px;
            color: #73736b;
            line-height: 1.8;
            margin-top: 20px
        }

        a:focus-visible,
        button:focus-visible,
        summary:focus-visible {
            outline: 3px solid var(--wine);
            outline-offset: 5px
        }

        [hidden] {
            display: none !important
        }

        @media(max-width:800px) {

            .listing-gallery,
            .review-grid,
            .hero-split {
                grid-template-columns: 1fr
            }

            .hero-split .hero-small {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 15px
            }

            .page-hero .product-photo {
                height: 360px
            }

            .variant-table {
                font-size: 12px
            }

            .variant-table td,
            .variant-table th {
                padding: 15px 5px
            }
        }

        .product-photo {
            object-fit: contain !important;
            background: white;
            padding: 22px
        }

        .listing-banner {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 3px
        }

        .listing-gallery {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 25px;
            margin-top: 35px
        }

        .listing-gallery figure {
            margin: 0
        }

        .listing-gallery button {
            width: 100%;
            padding: 0;
            border: 0;
            background: none;
            cursor: zoom-in
        }

        .listing-gallery img {
            width: 100%;
            height: auto;
            display: block
        }

        .listing-gallery figcaption {
            margin-top: 12px;
            font-size: 12px;
            line-height: 1.7;
            color: #666
        }

        .review-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 30px;
            margin-top: 35px
        }

        .review-card {
            border: 1px solid var(--line);
            padding: 30px
        }

        .review-card blockquote {
            font-family: Georgia, serif;
            font-size: 23px;
            line-height: 1.5;
            margin: 18px 0
        }

        .review-card small {
            font-size: 11px;
            line-height: 1.7;
            display: block
        }

        .rating {
            font-size: 13px;
            color: var(--wine);
            margin-top: 22px;
            line-height: 1.9
        }

        .ratings-panel {
            display: flex;
            gap: 35px;
            align-items: center;
            margin-top: 30px;
            flex-wrap: wrap
        }

        .ratings-panel strong {
            font-family: Georgia, serif;
            font-size: 45px;
            font-weight: 400
        }

        .ratings-panel span {
            font-size: 12px;
            line-height: 1.9
        }

        .kit {
            background: #e9e6dc;
            padding: 35px;
            margin-top: 35px
        }

        .kit ul {
            margin: 20px 0 0;
            padding-left: 20px;
            line-height: 2;
            font-size: 14px
        }

        .variant-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 30px;
            font-size: 14px
        }

        .variant-table td,
        .variant-table th {
            padding: 20px 12px;
            border-bottom: 1px solid var(--line);
            text-align: left
        }

        .variant-table a {
            text-decoration: underline
        }

        .collection-card .product-image {
            background: white
        }

        .collection-card .product-image img {
            object-fit: contain;
            padding: 15px
        }

        .hero-split {
            display: grid;
            grid-template-columns: 1.25fr .75fr;
            gap: 22px
        }

        .hero-split img {
            width: 100%;
            height: auto;
            display: block
        }

        .hero-split a {
            display: block;
            overflow: hidden
        }

        .hero-split a img {
            transition: transform .8s
        }

        .hero-split a:hover img {
            transform: scale(1.015)
        }

        .hero-split .hero-small {
            display: flex;
            flex-direction: column;
            gap: 22px
        }

        .hero-split p {
            padding: 10px 0;
            font-size: 12px
        }

        .snapshot {
            font-size: 11px;
            color: #73736b;
            line-height: 1.8;
            margin-top: 20px
        }

        a:focus-visible,
        button:focus-visible,
        summary:focus-visible {
            outline: 3px solid var(--wine);
            outline-offset: 5px
        }

        [hidden] {
            display: none !important
        }

        @media(max-width:800px) {

            .listing-gallery,
            .review-grid,
            .hero-split {
                grid-template-columns: 1fr
            }

            .hero-split .hero-small {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 15px
            }

            .page-hero .product-photo {
                height: 360px
            }

            .variant-table {
                font-size: 12px
            }

            .variant-table td,
            .variant-table th {
                padding: 15px 5px
            }
        }

        /* TNMORA motion treatment */
        .pill {
            transition: transform .3s, background .3s, box-shadow .3s
        }

        .pill:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 24px #72373c20
        }

        .collection-card {
            transition: transform .4s
        }

        .collection-card:hover {
            transform: translateY(-6px)
        }

        .collection-card .product-image img {
            transition: transform .7s ease
        }

        .collection-card:hover .product-image img {
            transform: scale(1.045)
        }

        .listing-banner.reveal {
            transition: opacity 1s, transform 1s
        }

        .cinema {
            position: relative;
            margin: 25px 3% 0;
            border-radius: 6px;
            overflow: hidden;
            background: #352329;
            color: #f7f4ec;
            min-height: 580px;
            display: grid;
            grid-template-columns: 40% 60%;
            isolation: isolate
        }

        .cinema-copy {
            position: relative;
            z-index: 2;
            padding: 65px 9% 100px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            overflow: hidden
        }

        .cinema-copy:before {
            content: '';
            position: absolute;
            width: 450px;
            height: 450px;
            border: 1px solid #f7f4ec13;
            border-radius: 50%;
            top: -170px;
            left: -210px;
            z-index: -1;
            animation: orbit 20s ease-in-out infinite alternate
        }

        .cinema-copy:after {
            content: '';
            position: absolute;
            width: 450px;
            height: 450px;
            border: 1px solid #f7f4ec12;
            border-radius: 50%;
            bottom: -250px;
            right: -160px;
            z-index: -1;
            animation: orbit 24s ease-in-out infinite alternate-reverse
        }

        .cinema h1 {
            font-size: clamp(48px, 5.6vw, 84px);
            line-height: 1.04;
            letter-spacing: -3px;
            margin: 25px 0 0
        }

        .cinema h1 em {
            color: #eabcb6
        }

        .cinema .scene-description {
            font-size: 14px;
            line-height: 1.8;
            max-width: 310px;
            margin-top: 25px;
            color: #e0d4cd
        }

        .cinema .pill {
            background: #f7f4ec;
            color: #72373c;
            align-self: flex-start
        }

        .cinema-stage {
            position: relative;
            min-width: 0;
            display: flex;
            align-items: center;
            background: #e7d6c8;
            overflow: hidden
        }

        .scene {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            opacity: 0;
            transform: translateX(35px);
            transition: opacity 1.3s ease, transform 1.7s cubic-bezier(.2, .7, .3, 1);
            pointer-events: none
        }

        .scene.active {
            opacity: 1;
            transform: translateX(0);
            pointer-events: auto
        }

        .scene img {
            display: block;
            width: 100%;
            height: auto;
            max-height: 100%;
            object-fit: contain;
            transform: scale(.95);
            transition: transform 9s linear
        }

        .scene.active img {
            transform: scale(1)
        }

        .cinema-stage[data-theme="rope"] {
            background: #171717
        }

        .cinema-stage[data-theme="hose"] {
            background: #536442
        }

        .cinema-stage {
            transition: background 1.3s
        }

        .cinema-controls {
            position: absolute;
            left: 3.6%;
            bottom: 28px;
            display: flex;
            align-items: center;
            gap: 12px;
            z-index: 5
        }

        .scene-dot {
            width: 35px;
            height: 28px;
            padding: 0;
            background: none;
            border: 0;
            position: relative;
            cursor: pointer
        }

        .scene-dot:before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 13px;
            height: 2px;
            background: #ffffff40
        }

        .scene-dot.active:before {
            background: #f7f4ec
        }

        .scene-dot.active:after {
            content: '';
            position: absolute;
            left: 0;
            top: 13px;
            height: 2px;
            background: #d7938c;
            animation: scene-progress 8s linear forwards
        }

        .cinema.paused .scene-dot.active:after {
            animation-play-state: paused
        }

        .motion-button {
            color: inherit;
            border: 1px solid #ffffff45;
            background: transparent;
            border-radius: 50%;
            width: 33px;
            height: 33px;
            font-size: 12px
        }

        .scene-count {
            font-size: 10px;
            letter-spacing: 2px;
            margin-right: 12px
        }

        .cinema-tag {
            position: absolute;
            right: 25px;
            bottom: 28px;
            font-size: 10px;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: white;
            background: #352329b3;
            padding: 9px 12px;
            z-index: 4
        }

        .scene-text-enter {
            animation: text-rise .65s ease both
        }

        .motion-under {
            display: flex;
            justify-content: space-between;
            margin: 20px 5%;
            font-size: 10px;
            letter-spacing: 1.3px;
            text-transform: uppercase
        }

        @keyframes text-rise {
            from {
                opacity: 0;
                transform: translateY(16px)
            }

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

        @keyframes orbit {
            to {
                transform: translate(35px, 20px)
            }
        }

        @keyframes scene-progress {
            from {
                width: 0
            }

            to {
                width: 100%
            }
        }

        @media(max-width:800px) {
            .cinema {
                grid-template-columns: 1fr;
                min-height: 0;
                margin: 18px 4% 0
            }

            .cinema-copy {
                padding: 45px 7% 65px
            }

            .cinema h1 {
                font-size: 58px
            }

            .cinema-stage {
                height: 280px;
                order: -1
            }

            .cinema-controls {
                left: 7%;
                bottom: 22px
            }

            .cinema-tag {
                top: 18px;
                bottom: auto;
                right: 18px;
                font-size: 8px
            }

            .cinema .scene-description {
                max-width: 420px
            }

            .motion-under span:last-child {
                display: none
            }
        }

        @media(max-width:480px) {
            .cinema-stage {
                height: 220px
            }

            .cinema h1 {
                font-size: 49px
            }

            .cinema-copy {
                padding-top: 32px
            }

            .cinema .pill {
                font-size: 12px;
                padding: 15px 20px
            }

            .motion-under {
                font-size: 9px
            }
        }

        @media(prefers-reduced-motion:reduce) {

            .cinema *,
            .pill,
            .collection-card {
                animation: none !important;
                transition: none !important
            }

            .scene img {
                transform: none !important
            }

            .scene {
                transform: none !important
            }
        }

        @font-face {
            font-family: 'TNMORA Editorial';
            src: url('fonts/Jost-Regular.ttf') format('ttf');
            font-style: normal;
            font-weight: 400;
            font-display: swap
        }

        @font-face {
            font-family: 'TNMORA Editorial';
            src: url('fonts/latin-modern-italic.woff') format('woff');
            font-style: italic;
            font-weight: 400;
            font-display: swap
        }

        h1,
        h2,
        .serif,
        .feature-grid h3,
        .review-card blockquote,
        .ratings-panel strong,
        .ticker-track {
            font-family: 'TNMORA Editorial', Georgia, serif;
            font-weight: 400
        }

        h1,
        h2 {
            letter-spacing: -.035em
        }

        h1 em,
        h2 em {
            font-family: 'TNMORA Editorial', Georgia, serif;
            font-style: italic
        }

        .cinema h1 {
            letter-spacing: -.035em;
            line-height: 1.07
        }

        .page-hero h1 {
            line-height: 1.07
        }
    
.specification-table {width:100%;border-collapse:collapse;margin:28px 0;font-size:15px;line-height:1.7}.specification-table th,.specification-table td{padding:16px 20px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.specification-table th{width:32%;font-weight:500}.specification-table caption{text-align:left;font-size:13px;color:#666;margin-bottom:12px}.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:30px}.guide-grid p,.evidence-copy{line-height:1.8}.evidence-box{padding:28px;border:1px solid var(--line);border-radius:12px;margin-top:24px}.evidence-box h3{margin:0 0 16px}.detail-nav{display:flex;gap:20px;flex-wrap:wrap;margin:25px 0}.detail-nav a{font-size:13px;text-decoration:underline;text-underline-offset:5px}.product-error{padding:100px 8%;line-height:1.8}[hidden]{display:none!important}@media(max-width:700px){.guide-grid{grid-template-columns:1fr}.specification-table th,.specification-table td{padding:12px 8px;font-size:13px}.specification-table th{width:38%}}

/* Product detail edit: visual highlights and expandable detail groups */
.detail-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:32px 0}.detail-highlight{padding:30px 24px;border:1px solid var(--line);border-radius:18px;background:#fffaf2}.detail-highlight strong{display:block;font-family:Georgia,serif;font-size:clamp(25px,3vw,38px);font-weight:400;color:var(--wine);line-height:1.2}.detail-highlight p{font-size:14px;line-height:1.7;margin:14px 0 0}.detail-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.detail-panel{border:1px solid var(--line);border-radius:16px;padding:22px;background:rgba(255,255,255,.35)}.detail-panel summary{font-size:18px;font-weight:500;cursor:pointer}.detail-panel dl{margin:22px 0 0}.detail-panel dl>div{padding:14px 0;border-top:1px solid var(--line)}.detail-panel dt{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--wine);margin-bottom:8px}.detail-panel dd{margin:0;font-size:14px;line-height:1.7}.test-facts{display:flex;flex-wrap:wrap;gap:26px;margin-top:28px}.test-facts>div{flex:1 1 160px;padding:20px;border-top:2px solid var(--wine)}.test-facts span{display:block;font-size:12px;color:#666;margin-bottom:12px}.test-facts strong{font-size:20px;font-weight:400;overflow-wrap:anywhere}.coverage-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:30px 0}.coverage-option{border:1px solid var(--line);padding:28px;border-radius:18px}.coverage-option h3{font-size:27px;margin:16px 0}.coverage-option p{line-height:1.7}.coverage-option a{display:inline-block;margin-top:12px;color:var(--wine)}@media(max-width:760px){.detail-highlights,.detail-panels,.coverage-options{grid-template-columns:1fr}.detail-highlight{padding:24px}.detail-panel{padding:22px}.test-facts{gap:12px}}
