:root {
    --bg:#fff;
    --ink:#16131c;
    --muted:#655f6d;
    --purple:#6f3cc3;
    --purple-dark:#2c164d;
    --purple-deep:#170d27;
    --soft:#f6f3fa;
    --line:#e8e2ef;
    --radius:22px;
    --shadow:0 18px 50px rgba(43,22,77,.10);
    --max:1180px
}

* {
    box-sizing:border-box
}

html {
    scroll-behavior:smooth
}

body {
    margin:0;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--ink);
    background:var(--bg);
    line-height:1.6
}

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

a {
    color:inherit
}

.container {
    width:min(calc(100% - 40px),var(--max));
    margin-inline:auto
}

.narrow {
    max-width:820px
}

.sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0
}

.skip-link {
    position:absolute;
    left:-9999px;
    top:0;
    background:#fff;
    padding:10px 14px;
    z-index:999
}

.skip-link:focus {
    left:10px;
    top:10px
}

.site-header {
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(232,226,239,.9)
}

.header-inner {
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px
}

.brand img {
    width:190px
}

.site-nav {
    display:flex;
    align-items:center;
    gap:28px
}

.site-nav a {
    text-decoration:none;
    font-weight:700;
    font-size:.96rem;
    padding:30px 0 24px;
    border-bottom:3px solid transparent
}

.site-nav a:hover,.site-nav a:focus,.site-nav a.active {
    color:var(--purple);
    border-color:var(--purple)
}

.nav-toggle {
    display:none;
    border:0;
    background:transparent;
    padding:10px;
    cursor:pointer
}

.nav-toggle span:not(.sr-only) {
    display:block;
    width:26px;
    height:2px;
    background:var(--ink);
    margin:5px 0
}

.hero {
    background:linear-gradient(135deg,#fbfaff 0%,#f1eaff 58%,#fff 100%);
    overflow:hidden
}

.hero-grid {
    min-height:640px;
    display:grid;
    grid-template-columns:1.08fr .92fr;
    align-items:center;
    gap:60px;
    padding-block:70px
}

.hero-copy {
    max-width:650px
}

.eyebrow {
    text-transform:uppercase;
    letter-spacing:.13em;
    font-size:.78rem;
    font-weight:800;
    color:var(--purple);
    display:inline-block;
    margin-bottom:14px
}

.eyebrow-light {
    color:#d8c2ff
}

h1,h2,h3 {
    line-height:1.08;
    margin:0 0 18px;
    letter-spacing:-.035em
}

h1 {
    font-size:clamp(2.7rem,6vw,5.2rem)
}

h2 {
    font-size:clamp(2rem,4vw,3.2rem)
}

h3 {
    font-size:1.35rem
}

.lead {
    font-size:clamp(1.08rem,2vw,1.34rem);
    color:var(--muted);
    max-width:760px
}

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

.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:12px 21px;
    border-radius:999px;
    text-decoration:none;
    font-weight:800;
    border:1px solid transparent
}

.button-primary {
    background:var(--purple);
    color:#fff
}

.button-primary:hover {
    background:#5e30ab
}

.button-secondary {
    border-color:var(--line);
    background:#fff
}

.button-light {
    background:#fff;
    color:var(--purple-deep)
}

.hero-media {
    position:relative
}

.hero-media:before {
    content:"";
    position:absolute;
    inset:10% 5%;
    background:#fff;
    border-radius:50%;
    filter:blur(4px);
    box-shadow:0 30px 80px rgba(111,60,195,.16)
}

.hero-media img {
    position:relative;
    max-height:540px;
    margin:auto;
    object-fit:contain
}

.section {
    padding:60px 0
}

.section-soft {
    background:var(--soft)
}

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

.section-heading {
    max-width:750px;
    margin-bottom:40px
}

.split-heading {
    max-width:none;
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px
}

.feature-grid {
    display:grid;
    gap:22px
}

.feature-grid-3 {
    grid-template-columns:repeat(3,minmax(0,1fr))
}

.info-card,.dark-card {
    border-radius:var(--radius);
    padding:30px
}

.info-card {
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 8px 28px rgba(43,22,77,.045)
}

.dark-card {
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.13)
}

.dark-card p {
    color:#d9d1e3
}

.dark-card strong {
    display:block;
    color:#d8c2ff;
    margin-bottom:8px
}

.card-number {
    font-size:.78rem;
    font-weight:900;
    color:var(--purple);
    letter-spacing:.12em;
    display:block;
    margin-bottom:20px
}

.dark-card .card-number {
    color:#d8c2ff
}

.text-link {
    font-weight:800;
    color:var(--purple);
    text-decoration:none
}

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

.product-card {
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    background:#fff
}

.product-card-media {
    background:#f8f5fc;
    display:grid;
    place-items:center;
    aspect-ratio:1/1
}

.product-card-media img {
    width:86%;
    height:86%;
    object-fit:contain;
    transition:transform .25s
}

.product-card:hover .product-card-media img {
    transform:scale(1.025)
}

.product-card-body {
    padding:26px
}

.product-card h2,.product-card h3 {
    font-size:1.55rem
}

.product-card h2 a,.product-card h3 a {
    text-decoration:none
}

.product-model {
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.1em;
    font-weight:800;
    color:var(--purple)
}

.price {
    display:block;
    font-size:1.35rem;
    margin-top:18px
}

.availability {
    display:block;
    color:var(--muted);
    font-size:.9rem;
    margin-top:18px
}

.support-banner {
    background:linear-gradient(135deg,var(--purple-dark),var(--purple));
    color:#fff
}

.support-banner-inner {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px
}

.support-banner p {
    color:#eadff8
}

.page-hero {
    padding:105px 0;
    background:linear-gradient(135deg,#f7f2ff,#fff)
}

.page-hero.compact {
    padding:75px 0
}

.product-hero {
    padding:70px 0
}

.product-hero-grid {
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:70px;
    align-items:center
}

.product-main-image {
    background:var(--soft);
    border-radius:30px;
    padding:35px;
    aspect-ratio:1/1;
    display:grid;
    place-items:center
}

.product-main-image img {
    max-height:510px;
    object-fit:contain
}

.thumb-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-top:14px
}

.thumb-row img {
    width:100%;
    aspect-ratio:16/9;
    object-fit:contain;
    background:#faf8fc;
    border:1px solid var(--line);
    border-radius:16px;
    padding:10px
}

.spec-pills {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin:25px 0
}

.spec-pills span {
    background:var(--soft);
    border:1px solid var(--line);
    padding:7px 11px;
    border-radius:999px;
    font-size:.9rem;
    font-weight:700
}

.product-price {
    font-size:2rem;
    font-weight:900;
    margin:24px 0
}

.phase-notice {
    display:flex;
    flex-direction:column;
    gap:2px;
    padding:18px;
    border-left:4px solid var(--purple);
    background:var(--soft);
    margin:24px 0
}

.warranty-note {
    display:flex;
    flex-direction:column;
    gap:3px;
    border-top:1px solid var(--line);
    padding-top:20px
}

.warranty-note span {
    color:var(--muted)
}

.media-feature,.package-grid,.story-grid,.contact-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center
}

.media-feature img,.package-image img {
    border-radius:var(--radius)
}

.spec-table {
    border-top:1px solid var(--line)
}

.spec-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:30px;
    padding:18px 0;
    border-bottom:1px solid var(--line)
}

.spec-row small {
    display:block;
    color:var(--muted);
    font-weight:700
}

.check-list {
    list-style:none;
    padding:0;
    margin:28px 0
}

.check-list li {
    position:relative;
    padding:14px 0 14px 34px;
    border-bottom:1px solid var(--line)
}

.check-list li:before {
    content:"✓";
    position:absolute;
    left:0;
    color:var(--purple);
    font-weight:900
}

.check-list li span {
    display:block;
    color:var(--muted);
    font-size:.92rem
}

.prose p {
    font-size:1.08rem;
    color:var(--muted)
}

.contact-grid {
    align-items:stretch
}

.empty-state {
    text-align:center;
    padding:80px 20px
}

.site-footer {
    background:#110a1c;
    color:#fff;
    padding:65px 0 25px
}

.footer-grid {
    display:grid;
    grid-template-columns:1.7fr 1fr 1fr;
    gap:50px
}

.footer-logo {
    width:185px;
    margin-bottom:18px
}

.site-footer p,.site-footer span {
    color:#bdb4c9
}

.site-footer h2 {
    font-size:1rem;
    letter-spacing:.06em;
    text-transform:uppercase
}

.site-footer a {
    display:block;
    color:#fff;
    text-decoration:none;
    margin:7px 0
}

.footer-bottom {
    display:flex;
    justify-content:space-between;
    gap:20px;
    border-top:1px solid rgba(255,255,255,.12);
    padding-top:22px;
    margin-top:40px
}

.footer-bottom a {
    margin:0;
    color:#cdb8ed
}

@media(max-width:900px) {
    .site-nav {
        position:absolute;
        left:0;
        right:0;
        top:82px;
        background:#fff;
        border-bottom:1px solid var(--line);
        padding:10px 20px 20px;
        display:none;
        flex-direction:column;
        align-items:stretch;
        gap:0
    }

    .site-nav.open {
        display:flex
    }

    .site-nav a {
        padding:13px 0;
        border-bottom:1px solid var(--line)
    }

    .nav-toggle {
        display:block
    }

    .hero-grid,.product-hero-grid,.media-feature,.package-grid,.story-grid,.contact-grid {
        grid-template-columns:1fr
    }

    .hero-grid {
        padding-block:55px;
        gap:20px
    }

    .hero-media {
        order:-1
    }

    .hero-media img {
        max-height:330px
    }

    .feature-grid-3,.product-grid {
        grid-template-columns:1fr 1fr
    }

    .support-banner-inner {
        align-items:flex-start;
        flex-direction:column
    }

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

    .footer-grid>div:first-child {
        grid-column:1/-1
    }

}

@media(max-width:620px) {
    .container {
        width:min(calc(100% - 28px),var(--max))
    }

    .header-inner {
        min-height:70px
    }

    .brand img {
        width:155px
    }

    .site-nav {
        top:70px
    }

    .section {
        padding:60px 0
    }

    .page-hero,.page-hero.compact {
        padding:60px 0
    }

    .feature-grid-3,.product-grid,.footer-grid {
        grid-template-columns:1fr
    }

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

    .spec-row {
        grid-template-columns:1fr;
        gap:5px
    }

    .footer-bottom {
        flex-direction:column
    }

    .product-hero {
        padding:45px 0
    }

    .thumb-row {
        grid-template-columns:1fr
    }

    .button-row .button {
        width:100%
    }

}

/* Phase 3: cart and pricing */ .cart-link {
    display:inline-flex!important;
    align-items:center;
    gap:.45rem
}

.cart-count {
    display:inline-grid;
    place-items:center;
    min-width:1.55rem;
    height:1.55rem;
    padding:0 .35rem;
    border-radius:999px;
    background:#5b2a86;
    color:#fff;
    font-size:.78rem;
    font-weight:800
}

.flash {
    margin-top:1rem;
    padding:.9rem 1rem;
    border-radius:12px
}

.flash-success {
    background:#eef8f0;
    border:1px solid #bfdfc5;
    color:#24552c
}

.add-to-cart-form {
    display:grid;
    grid-template-columns:auto 90px 1fr;
    align-items:end;
    gap:.75rem;
    margin:1.25rem 0
}

.add-to-cart-form label,.cart-item-actions label {
    font-size:.86rem;
    font-weight:700
}

.add-to-cart-form input,.cart-item-actions input,.code-entry input {
    width:100%;
    min-height:44px;
    border:1px solid #cfc8d8;
    border-radius:10px;
    padding:.65rem .75rem;
    background:#fff;
    color:#20182a
}

.quantity-pricing-preview {
    display:flex;
    flex-direction:column;
    gap:.15rem;
    margin:.75rem 0;
    color:#4a3a55
}

.cart-page .section-heading h1 {
    margin-bottom:.4rem
}

.empty-cart {
    padding:2rem;
    border:1px solid #e5dfea;
    border-radius:18px;
    background:#fff
}

.cart-layout {
    display:grid;
    grid-template-columns:minmax(0,1.65fr) minmax(300px,.75fr);
    gap:2rem;
    align-items:start
}

.cart-items {
    display:grid;
    gap:1rem
}

.cart-item {
    display:grid;
    grid-template-columns:1fr auto;
    gap:1.5rem;
    padding:1.35rem;
    border:1px solid #e5dfea;
    border-radius:18px;
    background:#fff
}

.cart-item h2 {
    font-size:1.2rem;
    margin:.2rem 0
}

.cart-item h2 a {
    color:inherit;
    text-decoration:none
}

.cart-item-actions {
    display:grid;
    gap:.55rem;
    justify-items:end;
    min-width:180px
}

.cart-item-actions form {
    display:grid;
    grid-template-columns:70px auto;
    gap:.5rem;
    align-items:end
}

.cart-item-actions form:last-child {
    display:block
}

.cart-summary {
    position:sticky;
    top:96px;
    padding:1.4rem;
    border-radius:18px;
    background:#f7f4fa;
    border:1px solid #e3dbea
}

.cart-summary h2 {
    margin-top:0
}

.summary-row {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    padding:.8rem 0;
    border-bottom:1px solid #ded6e5
}

.summary-total {
    font-size:1.15rem;
    border-bottom:0
}

.savings {
    color:#27733b
}

.pricing-code-box {
    padding:1rem 0;
    border-bottom:1px solid #ded6e5
}

.pricing-code-box h3 {
    font-size:1rem;
    margin:.1rem 0 .7rem
}

.code-entry {
    display:grid;
    grid-template-columns:1fr auto;
    gap:.5rem
}

.applied-code {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    font-weight:700
}

.form-error {
    color:#a52626;
    font-size:.88rem;
    margin:.55rem 0 0
}

.summary-note {
    font-size:.84rem;
    color:#665b6e
}

.button-block {
    width:100%;
    justify-content:center
}

.text-button {
    border:0;
    background:transparent;
    padding:0;
    color:#5b2a86;
    text-decoration:underline;
    cursor:pointer
}

.button[disabled] {
    opacity:.55;
    cursor:not-allowed
}

@media (max-width:850px) {
    .cart-layout {
        grid-template-columns:1fr
    }

    .cart-summary {
        position:static
    }

    .cart-item {
        grid-template-columns:1fr
    }

    .cart-item-actions {
        justify-items:start
    }

    .add-to-cart-form {
        grid-template-columns:1fr 100px
    }

    .add-to-cart-form .button {
        grid-column:1/-1
    }

    .cart-item-actions form {
        grid-template-columns:80px auto
    }

}

/* Phase 3B: checkout */ .checkout-layout {
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(320px,.75fr);
    gap:2rem;
    align-items:start
}

.checkout-main {
    display:grid;
    gap:1rem
}

.checkout-card,.pending-order-card {
    padding:1.5rem;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff
}

.checkout-card h2 {
    font-size:1.35rem
}

.form-grid {
    display:grid;
    gap:1rem
}

.form-grid.two-col {
    grid-template-columns:1fr 1fr
}

.form-grid label,.checkout-card>label {
    display:grid;
    gap:.35rem;
    font-weight:700;
    font-size:.92rem
}

.form-grid input,.form-grid select,.checkout-card textarea {
    width:100%;
    min-height:46px;
    border:1px solid #cfc8d8;
    border-radius:10px;
    padding:.7rem .8rem;
    background:#fff;
    color:var(--ink);
    font:inherit
}

.checkout-card textarea {
    resize:vertical
}

.span-2 {
    grid-column:1/-1
}

.optional,.field-note {
    font-weight:400;
    color:var(--muted);
    font-size:.83rem
}

.fulfillment-options {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.8rem
}

.choice-card {
    display:flex;
    gap:.75rem;
    align-items:flex-start;
    border:1px solid var(--line);
    border-radius:14px;
    padding:1rem;
    cursor:pointer
}

.choice-card input {
    margin-top:.3rem
}

.choice-card span {
    display:grid
}

.choice-card small {
    color:var(--muted)
}

.checkbox-row {
    display:flex!important;
    grid-template-columns:auto 1fr!important;
    align-items:center;
    gap:.6rem!important
}

.checkbox-row input {
    width:1rem;
    height:1rem
}

.checkout-summary {
    position:sticky;
    top:96px
}

.checkout-line {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    padding:.55rem 0;
    font-size:.9rem
}

.checkout-errors {
    margin-bottom:1rem;
    padding:1rem 1.2rem;
    border:1px solid #e2a9a9;
    border-radius:12px;
    background:#fff2f2;
    color:#7e2020
}

.checkout-errors ul {
    margin:.5rem 0 0
}

.pending-order-card {
    text-align:left
}

.pending-order-card h1 {
    font-size:clamp(2rem,5vw,3.4rem)
}

.pending-total {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:1.5rem 0;
    padding:1.2rem;
    background:var(--soft);
    border-radius:14px;
    font-size:1.2rem
}

.pending-total strong {
    font-size:1.6rem
}

@media(max-width:850px) {
    .checkout-layout {
        grid-template-columns:1fr
    }

    .checkout-summary {
        position:static
    }

}

@media(max-width:620px) {
    .form-grid.two-col,.fulfillment-options {
        grid-template-columns:1fr
    }

    .span-2 {
        grid-column:auto
    }

}

/* Site refresh batch */ :root {
    --page-title:clamp(2.25rem,5vw,4rem)
}

.page-hero h1,.product-editorial-hero h1,.tracking-container h1 {
    font-size:var(--page-title)
}

.button,button,input[type="submit"] {
    cursor:pointer;
    transition:transform .16s ease,background-color .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .16s ease
}

.button:hover,button:hover,input[type="submit"]:hover {
    transform:translateY(-1px)
}

.button:active,button:active,input[type="submit"]:active {
    transform:translateY(0) scale(.985)
}

.cart-actions button,.pricing-code-form button {
    cursor:pointer
}

.cart-actions button:hover,.pricing-code-form button:hover {
    box-shadow:0 8px 20px rgba(43,22,77,.14)
}

.shipping-trust {
    display:inline-flex;
    align-items:center;
    margin:20px 0 0;
    padding:10px 14px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    box-shadow:0 8px 24px rgba(43,22,77,.06)
}

.product-image-placeholder,.product-large-placeholder {
    display:grid;
    place-items:center;
    text-align:center;
    background:linear-gradient(135deg,#f3ecff,#fff);
    color:var(--purple-dark);
    font-weight:900;
    letter-spacing:-.03em
}

.product-image-placeholder {
    width:86%;
    height:86%;
    border-radius:20px;
    font-size:clamp(1.5rem,4vw,2.4rem);
    padding:20px
}

.product-large-placeholder {
    min-height:430px;
    border-radius:28px;
    padding:40px;
    font-size:clamp(2.2rem,6vw,4.5rem)
}

.product-large-placeholder small {
    display:block;
    margin-top:12px;
    font-size:.9rem;
    font-weight:700;
    letter-spacing:0;
    color:var(--muted)
}

.product-large-placeholder.compact {
    min-height:300px
}

.product-editorial-hero {
    padding:72px 0 48px;
    background:#fff
}

.product-editorial-grid {
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    gap:70px;
    align-items:center
}

.product-editorial-copy {
    max-width:620px
}

.product-editorial-media img {
    width:100%;
    max-height:650px;
    object-fit:contain;
    border-radius:26px;
    background:#f8f7fa
}

.product-story-section {
    padding-top:60px
}

.editorial-feature-list {
    display:grid;
    gap:0;
    border-top:1px solid var(--line)
}

.editorial-feature {
    display:grid;
    grid-template-columns:72px 1fr;
    gap:28px;
    padding:30px 0;
    border-bottom:1px solid var(--line);
    max-width:900px
}

.editorial-feature-number {
    font-size:.82rem;
    font-weight:900;
    color:var(--purple);
    letter-spacing:.12em
}

.editorial-feature strong {
    display:block;
    margin-bottom:8px;
    color:var(--purple-dark)
}

.product-assurance {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:start;
    border-top:1px solid var(--line);
    padding-top:40px
}

.video-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:26px
}

.video-card {
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 8px 28px rgba(43,22,77,.045)
}

.video-card h3 {
    font-size:1.05rem;
    padding:18px 20px 20px;
    margin:0
}

.video-frame {
    aspect-ratio:9/16;
    background:#111
}

.video-frame iframe {
    display:block;
    width:100%;
    height:100%;
    border:0
}

.faq-wrap {
    max-width:900px
}

.faq-wrap>h2 {
    font-size:clamp(1.7rem,3vw,2.3rem);
    margin-bottom:22px
}

.faq-section-title {
    margin-top:60px!important
}

.faq-list {
    border-top:1px solid var(--line)
}

.faq-item {
    border-bottom:1px solid var(--line)
}

.faq-item summary {
    list-style:none;
    cursor:pointer;
    padding:22px 48px 22px 0;
    font-weight:800;
    font-size:1.08rem;
    position:relative
}

.faq-item summary::-webkit-details-marker {
    display:none
}

.faq-item summary:after {
    content:"+";
    position:absolute;
    right:8px;
    top:16px;
    font-size:1.8rem;
    font-weight:400;
    color:var(--purple)
}

.faq-item[open] summary:after {
    content:"−"
}

.faq-answer {
    padding:0 42px 24px 0;
    color:var(--muted)
}

.faq-answer p:first-child {
    margin-top:0
}

.faq-answer a {
    color:var(--purple);
    font-weight:700
}

.policy-page {
    max-width:900px
}

.policy-page h2 {
    font-size:clamp(1.55rem,3vw,2.15rem);
    margin-top:44px
}

.policy-page h2:first-child {
    margin-top:0
}

.policy-page li {
    margin-bottom:8px
}

.policy-note {
    margin-top:42px;
    padding:22px 24px;
    border-left:4px solid var(--purple);
    background:var(--soft);
    border-radius:0 14px 14px 0
}

.tracking-container {
    max-width:760px
}

.tracking-form {
    display:grid;
    grid-template-columns:1fr;
    gap:20px
}

.tracking-form label {
    display:grid;
    gap:8px;
    font-weight:800
}

.tracking-form input {
    width:100%;
    min-height:58px;
    padding:14px 16px;
    font-size:1.05rem;
    border:1px solid #cfc6d8;
    border-radius:12px;
    background:#fff
}

.tracking-form .button {
    justify-self:start;
    min-width:210px
}

.site-footer a {
    display:block;
    margin:8px 0;
    text-decoration:none
}

.site-footer a:hover {
    text-decoration:underline
}

@media (max-width:900px) {
    .product-editorial-grid {
        grid-template-columns:1fr;
        gap:34px
    }

    .product-editorial-copy {
        max-width:none
    }

    .video-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

    .product-assurance {
        grid-template-columns:1fr;
        gap:18px
    }

}

@media (max-width:640px) {
    .video-grid {
        grid-template-columns:1fr 1fr;
        gap:14px
    }

    .video-card h3 {
        font-size:.95rem;
        padding:14px
    }

    .editorial-feature {
        grid-template-columns:44px 1fr;
        gap:14px
    }

    .product-large-placeholder {
        min-height:300px
    }

    .tracking-form input {
        min-height:62px;
        font-size:1.08rem
    }

    .page-hero.compact {
        padding:58px 0
    }

}

@media (max-width:440px) {
    .video-grid {
        grid-template-columns:1fr
    }

    .video-frame {
        aspect-ratio:9/16;
        max-height:620px
    }

}

.hero h1 {
    font-size:clamp(2.5rem,5vw,4.3rem)
}

main h1 {
    font-size:var(--page-title)
}

/* U.S. support + shipping trust messaging */ .homepage-trust-row {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:20px;
    max-width:760px
}

.homepage-trust-row .shipping-trust {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    margin:0;
    border-radius:16px;
    line-height:1.35
}

.homepage-trust-row .shipping-trust strong {
    color:var(--purple-dark);
    margin-bottom:3px
}

.homepage-trust-row .shipping-trust span {
    font-size:.9rem;
    color:var(--muted)
}

.support-service-strip {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px
}

.support-service-strip>div {
    padding:28px;
    border:1px solid var(--line);
    border-radius:20px;
    background:#fff
}

.support-service-strip h2 {
    font-size:clamp(1.45rem,3vw,2rem)
}

.support-service-strip p {
    margin-bottom:0;
    color:var(--muted)
}

.checkout-service-note {
    margin:18px 0 8px;
    padding:14px 16px;
    border:1px solid #e3dbea;
    border-radius:12px;
    background:#f7f4fa;
    color:#4e4358;
    font-size:.92rem;
    line-height:1.55
}

@media(max-width:700px) {
    .homepage-trust-row,.support-service-strip {
        grid-template-columns:1fr
    }

    .homepage-trust-row {
        max-width:none
    }

}

/* Combined storefront/admin update */ .account-link {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:999px;
    color:inherit
}

.account-link svg {
    width:22px;
    height:22px
}

.account-link:hover,.account-link:focus {
    background:rgba(90,42,168,.09)
}

.stock-status {
    display:inline-flex;
    align-items:center;
    width:max-content;
    font-weight:800;
    font-size:.9rem;
    margin:.35rem 0 .7rem
}

.stock-in_stock {
    color:#277343
}

.stock-low_stock {
    color:#9a6500
}

.stock-extremely_low {
    color:#b42318
}

.stock-out_of_stock {
    color:#7a1b1b
}

.stock-backorder {
    color:#6b4d00
}

.product-card-body .stock-status {
    display:block
}

.product-editorial-copy .stock-status {
    font-size:1rem
}

.button:disabled {
    opacity:.55;
    cursor:not-allowed;
    transform:none!important
}

.split-screen-feature {
    text-align:center
}

.split-screen-feature .section-heading {
    max-width:720px;
    margin-left:auto;
    margin-right:auto
}

.split-screen-image {
    display:block;
    width:min(920px,100%);
    height:auto;
    margin:24px auto 0;
    border-radius:18px;
    box-shadow:0 14px 38px rgba(20,12,30,.18)
}

.media-feature.reverse>div:first-child {
    order:2
}

.media-feature.reverse>div:last-child {
    order:1
}

.about-intro {
    font-size:1.08rem;
    line-height:1.8
}

.contact-support-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px
}

@media(max-width:760px) {
    .contact-support-grid {
        grid-template-columns:1fr
    }

    .media-feature.reverse>div:first-child,.media-feature.reverse>div:last-child {
        order:initial
    }

    .account-link {
        width:42px;
        height:42px
    }

}

/* Step 9: progressive quantity pricing + compact customer login */ .progressive-pricing-card {
    margin:18px 0;
    padding:16px 18px;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--soft)
}

.progressive-pricing-card>strong {
    display:block;
    margin-bottom:10px;
    font-size:1rem
}

.progressive-pricing-grid {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:8px
}

.progressive-pricing-grid span {
    display:inline-flex;
    gap:7px;
    align-items:center;
    padding:7px 10px;
    border-radius:999px;
    background:#fff;
    border:1px solid var(--line);
    font-size:.9rem
}

.progressive-pricing-grid b {
    color:var(--purple)
}

.progressive-pricing-card small {
    display:block;
    color:var(--muted);
    line-height:1.45
}

.cart-progressive-breakdown {
    display:grid;
    gap:2px;
    margin:.35rem 0 .65rem;
    color:var(--muted);
    font-size:.86rem
}

.account-login-actions {
    display:flex;
    gap:12px;
    flex-wrap:wrap
}

.account-login-form {
    max-width:760px
}

.account-login-form .account-login-actions {
    margin-top:2px
}

@media(max-width:620px) {
    .account-login-actions .button {
        width:100%
    }

    .progressive-pricing-grid span {
        width:calc(50% - 4px);
        justify-content:space-between
    }

}

/* Product Management additions */ .preview-banner {
    background:#fff4c7;
    color:#5f4a00;
    padding:.75rem 1rem;
    text-align:center;
    font-weight:800;
    border-bottom:1px solid #ead684
}

.product-gallery {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:1.25rem
}

.product-gallery img {
    width:100%;
    aspect-ratio:4/3;
    object-fit:contain;
    background:#fafafa;
    border-radius:16px
}

/* Storefront product cleanup — Stage 1: spacing only
   Scope: public product detail pages. No image sizing or rendering changes. */ .product-editorial-hero {
    padding:48px 0 34px
}

.product-editorial-grid {
    gap:42px
}

.product-editorial-copy h1 {
    margin-bottom:12px
}

.product-editorial-copy .lead {
    margin-top:0;
    margin-bottom:14px
}

.product-editorial-copy .product-price {
    margin:14px 0
}

.product-editorial-copy .progressive-pricing-card {
    margin:12px 0
}

.product-editorial-copy .quantity-pricing-preview {
    margin:10px 0
}

.product-editorial-copy .add-to-cart-form {
    margin:12px 0
}

.product-editorial-copy .warranty-note {
    padding-top:14px
}

.product-editorial-hero~.section {
    padding:52px 0
}

.product-editorial-hero~.section .section-heading {
    margin-bottom:26px
}

.product-editorial-hero~.section .eyebrow {
    margin-bottom:10px
}

.product-editorial-hero~.section h2 {
    margin-bottom:14px
}

.product-editorial-hero~.section .media-feature, .product-editorial-hero~.section .package-grid {
    gap:36px
}

.product-editorial-hero~.section .split-screen-image {
    margin-top:16px
}

.product-editorial-hero~.section .spec-row {
    gap:22px;
    padding:13px 0
}

.product-editorial-hero~.section .check-list {
    margin:18px 0
}

.product-editorial-hero~.section .check-list li {
    padding:10px 0 10px 30px
}

.product-editorial-hero~.section .product-gallery {
    gap:16px
}

.product-editorial-hero~.section .product-assurance {
    gap:36px;
    padding-top:24px
}

@media(max-width:900px) {
    .product-editorial-hero {
        padding:40px 0 30px
    }

    .product-editorial-grid {
        gap:28px
    }

    .product-editorial-hero~.section {
        padding:46px 0
    }

    .product-editorial-hero~.section .media-feature, .product-editorial-hero~.section .package-grid {
        gap:28px
    }

}

@media(max-width:620px) {
    .product-editorial-hero {
        padding:32px 0 24px
    }

    .product-editorial-grid {
        gap:22px
    }

    .product-editorial-hero~.section {
        padding:38px 0
    }

    .product-editorial-hero~.section .section-heading {
        margin-bottom:20px
    }

    .product-editorial-hero~.section .media-feature, .product-editorial-hero~.section .package-grid {
        gap:22px
    }

}

/* Storefront product cleanup — Stage 1B: compact text feature rows only
   Scope: text-only product feature bands (including the short intro block).
   CSS-only; no Blade, controller, model, route, database, admin, or image changes. */ .product-editorial-hero ~ .section:has(> .container.narrow) {
    padding:18px 0;
}

.product-editorial-hero ~ .section:has(> .container.narrow) .container.narrow {
    max-width:1180px;
}

.product-editorial-hero ~ .section:has(> .container.narrow) .eyebrow {
    margin-bottom:4px;
    font-size:.66rem;
    letter-spacing:.11em;
}

.product-editorial-hero ~ .section:has(> .container.narrow) h2 {
    margin-bottom:5px;
    font-size:clamp(1.25rem,2.1vw,1.7rem);
    line-height:1.04;
}

.product-editorial-hero ~ .section:has(> .container.narrow) .lead, .product-editorial-hero ~ .section:has(> .container.narrow) p {
    margin-top:0;
    margin-bottom:0;
    max-width:760px;
    font-size:.92rem;
    line-height:1.42;
}

@media(max-width:620px) {
    .product-editorial-hero ~ .section:has(> .container.narrow) {
        padding:15px 0
    }

    .product-editorial-hero ~ .section:has(> .container.narrow) h2 {
        font-size:1.22rem
    }

    .product-editorial-hero ~ .section:has(> .container.narrow) .lead, .product-editorial-hero ~ .section:has(> .container.narrow) p {
        font-size:.9rem;
        line-height:1.38
    }

}

/* Channel Guide — isolated component styles */ .cg-page {
    padding:55px 0 85px
}

.cg-intro {
    max-width:850px;
    margin-bottom:28px
}

.cg-intro h1 {
    margin-bottom:14px
}

.cg-intro p {
    color:var(--muted)
}

.cg-panel {
    padding:24px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--soft)
}

.cg-form {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(170px,230px) auto;
    gap:14px;
    align-items:end
}

.cg-field label {
    display:block;
    font-weight:800;
    font-size:.9rem;
    margin-bottom:7px
}

.cg-field input,.cg-field select {
    display:block;
    width:100%;
    height:50px;
    border:1px solid #cfc8d8;
    border-radius:12px;
    background:#fff;
    padding:10px 13px;
    font:inherit;
    color:var(--ink)
}

.cg-field input:focus-visible,.cg-field select:focus-visible {
    outline:3px solid #cdb7ef;
    outline-offset:1px
}

.cg-form .button {
    height:50px
}

.cg-results {
    margin:24px 0 12px;
    color:var(--muted)
}

.cg-table-wrap {
    overflow-x:auto;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff
}

.cg-table {
    border-collapse:collapse;
    width:100%;
    min-width:460px
}

.cg-table th,.cg-table td {
    padding:14px 18px;
    text-align:left;
    border-bottom:1px solid var(--line)
}

.cg-table th {
    font-size:.86rem;
    background:var(--soft);
    color:var(--purple-dark)
}

.cg-table td:first-child {
    font-weight:800;
    color:var(--purple-dark);
    width:155px
}

.cg-table tr:last-child td {
    border-bottom:0
}

.cg-table tbody tr:hover {
    background:#faf8fd
}

.cg-pagination {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:24px
}

.cg-pagination a,.cg-pagination span {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:42px;
    padding:8px 12px;
    border:1px solid var(--line);
    border-radius:10px;
    text-decoration:none
}

.cg-pagination a:hover {
    background:var(--soft)
}

.cg-pagination [aria-current="page"] {
    background:var(--purple);
    color:#fff
}

.cg-note {
    margin-top:25px;
    color:var(--muted);
    font-size:.9rem
}

.cg-tools {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin:15px 0 0
}

.cg-tools button {
    font:inherit
}

@media(max-width:760px) {
    .cg-form {
        grid-template-columns:1fr
    }

    .cg-page {
        padding:35px 0 60px
    }

    .cg-panel {
        padding:18px
    }

}

@media print {
    .site-header,.site-footer,.cg-panel,.cg-pagination,.cg-tools,.skip-link {
        display:none!important
    }

    .cg-page {
        padding:0
    }

    .cg-table-wrap {
        overflow:visible
    }

    .cg-table {
        min-width:0
    }

    .cg-table th,.cg-table td {
        padding:5px 8px
    }

    .cg-note {
        font-size:10px
    }

}

.product-full-description {
    white-space: pre-line;
}

/* Appearance selector */
.theme-picker { display:inline-flex; align-items:center; gap:6px; flex-shrink:0; font-size:.82rem; font-weight:700; color:var(--ink); }
.theme-picker-icon { font-size:1.2rem; line-height:1; }
.theme-picker select { max-width:90px; padding:7px 8px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font:inherit; cursor:pointer; }
.theme-picker select:focus-visible { outline:2px solid var(--purple); outline-offset:2px; }
@media(max-width:900px) { .site-nav .theme-picker { padding:12px 0; } }

/* Dark theme: applied on <html> before the stylesheet loads to prevent a light flash. */
html[data-theme="dark"] {
  --bg:#15101e; --ink:#f1ebf8; --muted:#c2b6ce; --purple:#c6a0ff;
  --purple-dark:#e0c8ff; --purple-deep:#100a19; --soft:#241b30; --line:#45374f;
  --shadow:0 18px 50px rgba(0,0,0,.35);
  color-scheme:dark;
}
html[data-theme="dark"] .site-header { background:rgba(21,16,30,.97); border-bottom-color:var(--line); }
html[data-theme="dark"] .hero { background:linear-gradient(135deg,#1b1427,#2a1d3c 58%,#15101e); }
html[data-theme="dark"] .page-hero { background:linear-gradient(135deg,#251b36,#15101e); }
html[data-theme="dark"] .hero-media:before { background:#30213f; box-shadow:0 30px 80px rgba(0,0,0,.3); }
html[data-theme="dark"] .info-card,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .video-card,
html[data-theme="dark"] .support-service-strip>div,
html[data-theme="dark"] .shipping-trust,
html[data-theme="dark"] .progressive-pricing-grid span,
html[data-theme="dark"] .cart-item,
html[data-theme="dark"] .empty-cart,
html[data-theme="dark"] .checkout-card,
html[data-theme="dark"] .pending-order-card,
html[data-theme="dark"] .cg-table-wrap { background:#21192c; border-color:var(--line); color:var(--ink); }
html[data-theme="dark"] .product-editorial-hero { background:var(--bg); }
html[data-theme="dark"] .product-card-media,
html[data-theme="dark"] .product-main-image,
html[data-theme="dark"] .product-editorial-media img,
html[data-theme="dark"] .product-gallery img,
html[data-theme="dark"] .thumb-row img { background:#30263b; }
html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .cart-summary,
html[data-theme="dark"] .checkout-service-note,
html[data-theme="dark"] .cg-table th,
html[data-theme="dark"] .cg-table tbody tr:hover { background:#30243d; color:var(--ink); border-color:var(--line); }
html[data-theme="dark"] .button-primary,
html[data-theme="dark"] .cg-pagination [aria-current="page"] { background:#8751d0; color:#fff; }
html[data-theme="dark"] .button-primary:hover { background:#7641bf; }
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .product-model,
html[data-theme="dark"] .text-link,
html[data-theme="dark"] .card-number,
html[data-theme="dark"] .editorial-feature-number,
html[data-theme="dark"] .faq-answer a,
html[data-theme="dark"] .cg-table td:first-child,
html[data-theme="dark"] .cg-table th,
html[data-theme="dark"] .editorial-feature strong,
html[data-theme="dark"] .homepage-trust-row .shipping-trust strong,
html[data-theme="dark"] .progressive-pricing-grid b { color:#d2afff; }
html[data-theme="dark"] .eyebrow-light { color:#e0c8ff; }
html[data-theme="dark"] .site-nav a:hover,
html[data-theme="dark"] .site-nav a:focus,
html[data-theme="dark"] .site-nav a.active { color:#d2afff; border-color:#d2afff; }
html[data-theme="dark"] .site-nav a.cart-link .cart-count { color:#fff; }
html[data-theme="dark"] .quantity-pricing-preview,
html[data-theme="dark"] .checkout-service-note,
html[data-theme="dark"] .summary-note { color:var(--muted); }
html[data-theme="dark"] .add-to-cart-form input,
html[data-theme="dark"] .cart-item-actions input,
html[data-theme="dark"] .code-entry input,
html[data-theme="dark"] .form-grid input,
html[data-theme="dark"] .form-grid select,
html[data-theme="dark"] .checkout-card textarea,
html[data-theme="dark"] .tracking-form input,
html[data-theme="dark"] .cg-field input,
html[data-theme="dark"] .cg-field select { background:#191321; color:var(--ink); border-color:#62516f; }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color:#b6a9c2; }
html[data-theme="dark"] .cg-table tbody tr:hover { background:#30243d; }
html[data-theme="dark"] .cg-pagination a,
html[data-theme="dark"] .cg-pagination span { border-color:var(--line); }
html[data-theme="dark"] .site-footer { background:#0c0812; }
html[data-theme="dark"] .site-footer p,html[data-theme="dark"] .site-footer span { color:#c5b9d2; }
html[data-theme="dark"] .flash-success { background:#183324; border-color:#35684a; color:#bce9c7; }
html[data-theme="dark"] .checkout-errors { background:#3c1b25; border-color:#8c4855; color:#ffd6dc; }
html[data-theme="dark"] .form-error { color:#ffaaa8; }
html[data-theme="dark"] .savings,html[data-theme="dark"] .stock-in_stock { color:#89dfa5; }
html[data-theme="dark"] .stock-low_stock { color:#ffd37b; }
html[data-theme="dark"] .stock-extremely_low,html[data-theme="dark"] .stock-out_of_stock { color:#ffaaa8; }
html[data-theme="dark"] .stock-backorder { color:#e4c78a; }
html[data-theme="dark"] .nav-toggle span:not(.sr-only) { background:var(--ink); }
@media(max-width:900px) { html[data-theme="dark"] .site-nav { background:#21192c; border-bottom-color:var(--line); } }
@media print { html[data-theme="dark"] { color-scheme:light; --bg:#fff; --ink:#16131c; --muted:#655f6d; --soft:#f6f3fa; --line:#e8e2ef; } }

/* Header logo — Light and Dark Mode */
.logo-dark {
    display: none;
}

html[data-theme="dark"] .logo-light {
    display: none;
}

html[data-theme="dark"] .logo-dark {
    display: block;
}

/* Keep Support banner's original purple gradient in Dark Mode */
html[data-theme="dark"] .support-banner {
    background: linear-gradient(135deg, #2c164d, #6f3cc3);
}

/* Homepage featured product descriptions */
.product-card-description {
    line-height: 1.6;
}

.product-card-description p {
    margin: 0 0 12px;
}

.product-card-description p:last-child {
    margin-bottom: 0;
}

/* Homepage promotional button — Light Mode */
html:not([data-theme="dark"]) .homepage-promo .promo-inline button {
    background: #6f3cc3;
    color: #ffffff;
}

html:not([data-theme="dark"]) .homepage-promo .promo-inline button:hover {
    background: #5e30ab;
}

/* Homepage promotional button — Dark Mode */
html[data-theme="dark"] .homepage-promo .promo-inline button {
    background: #ffffff;
    color: #29232f;
}

html[data-theme="dark"] .homepage-promo .promo-inline button:hover {
    background: #e9ddff;
}

/* Shopping cart Remove link — Light Mode */
.cart-item-actions .text-button {
    color: #8050b5;
    font-weight: 400;
}

/* Shopping cart Remove link — Dark Mode */
html[data-theme="dark"] .cart-item-actions .text-button {
    color: #c9a5ef;
    font-weight: 400;
}

/* Homepage V6 Plus headline */
.hero-copy h2 {
    font-size: clamp(2rem, 3.2vw, 3.6rem);
    line-height: 1.12;
    letter-spacing: -0.035em;
}

.accessories-strike {
    text-decoration: line-through;
    text-decoration-color: #ff3030;
    text-decoration-thickness: 4px;
    text-underline-offset: 0;
    border-bottom: none;
}