:root {
            --cream: #fbf7f3;
            --blush: #efd9d4;
            --rose: #c88f89;
            --sage: #94a08f;
            --sage-dark: #7c8877;
            --ink: #272523;
            --muted: #6f6a66;
            --line: #eaded7;
            --white: #fff;
            --shadow: 0 18px 50px rgba(66, 48, 40, .09);
        }

        * {
            box-sizing: border-box
        }

        html {
            scroll-behavior: smooth
        }

        body {
            margin: 0;
            font-family: Outfit, Arial, sans-serif;
            color: var(--ink);
            background: #fff
        }

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

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

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

        .announcement {
            position: relative;
            min-height: 42px;
            overflow: hidden;
            color: #fff;
            background: linear-gradient(110deg, #687363 0%, var(--sage-dark) 46%, #8b7772 100%);
            font-size: 12px;
            letter-spacing: .035em;
            isolation: isolate
        }

        .announcement::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: -1;
            background: linear-gradient(100deg, transparent 18%, rgba(255, 255, 255, .1) 48%, transparent 78%);
            transform: translateX(-100%);
            animation: announcementSheen 8s ease-in-out infinite
        }

        .announcement-inner {
            width: min(1180px, calc(100% - 32px));
            min-height: 42px;
            margin: auto;
            display: grid;
            grid-template-columns: 96px minmax(0, 1fr) 96px;
            align-items: center
        }

        .announcement-inner::before {
            content: ''
        }

        .announcement-viewport {
            position: relative;
            height: 42px;
            overflow: hidden
        }

        .announcement-item {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            text-align: center;
            opacity: 0;
            transform: translateY(12px);
            transition: opacity .45s ease, transform .45s cubic-bezier(.22, 1, .36, 1);
            pointer-events: none
        }

        .announcement-item.active {
            opacity: 1;
            transform: translateY(0)
        }

        .announcement-item.leaving {
            opacity: 0;
            transform: translateY(-12px)
        }

        .announcement-item strong {
            font-weight: 600
        }

        .announcement-item .announcement-detail {
            color: rgba(255, 255, 255, .72)
        }

        .announcement-separator {
            width: 3px;
            height: 3px;
            border-radius: 50%;
            background: #f0cbc5;
            flex: 0 0 auto
        }

        .announcement-controls {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 7px
        }

        .announcement-dot,
        .announcement-pause {
            border: 0;
            padding: 0;
            color: #fff;
            background: transparent;
            cursor: pointer
        }

        .announcement-dot {
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: rgba(255, 255, 255, .35);
            transition: width .25s ease, border-radius .25s ease, background .25s ease
        }

        .announcement-dot.active {
            width: 15px;
            border-radius: 5px;
            background: #fff
        }

        .announcement-pause {
            width: 24px;
            height: 24px;
            margin-left: 2px;
            display: grid;
            place-items: center;
            border-radius: 50%;
            font-size: 10px;
            line-height: 1;
            transition: background .2s ease
        }

        .announcement-pause:hover,
        .announcement-pause:focus-visible {
            background: rgba(255, 255, 255, .14)
        }

        .announcement-dot:focus-visible,
        .announcement-pause:focus-visible {
            outline: 2px solid #fff;
            outline-offset: 3px
        }

        @keyframes announcementSheen {
            0%, 62% { transform: translateX(-100%) }
            88%, 100% { transform: translateX(100%) }
        }

        .header {
            position: absolute;
            top: 42px;
            right: 0;
            left: 0;
            background: transparent;
            z-index: 40;
            border: 0;
            box-shadow: none
        }

        .nav {
            height: 92px;
            display: grid;
            grid-template-columns: 1fr auto 1fr;
            align-items: center;
            gap: 30px
        }

        .brand {
            grid-column: 1;
            justify-self: start;
            display: inline-flex;
            align-items: center;
            width: 74px;
            height: 74px;
            padding: 4px;
            border: 1px solid rgba(200, 143, 137, .18);
            border-radius: 17px;
            background: #fff;
            box-shadow: 0 7px 20px rgba(69, 47, 38, .08);
            transition: transform .25s ease, box-shadow .25s ease
        }

        .brand:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 24px rgba(69, 47, 38, .12)
        }

        .brand img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: contain;
            border-radius: 13px
        }

        .menu {
            grid-column: 2;
            justify-self: center;
            display: flex;
            gap: 6px;
            align-items: center;
            padding: 5px;
            border: 1px solid rgba(200, 143, 137, .14);
            border-radius: 999px;
            background: rgba(255, 255, 255, .48);
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
            font-size: 13px;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9)
        }

        .menu a {
            position: relative;
            padding: 10px 14px;
            border-radius: 999px;
            color: #514b47;
            transition: color .2s ease, background .2s ease
        }

        .menu a:hover {
            color: #8f5f5a;
            background: #f8ece6
        }

        .nav-actions {
            grid-column: 3;
            justify-self: end;
            display: inline-flex;
            align-items: center;
            gap: 5px;
            padding: 5px;
            border: 1px solid rgba(200, 143, 137, .14);
            border-radius: 999px;
            background: rgba(255, 255, 255, .56);
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px)
        }

        .icon-btn {
            position: relative;
            width: 40px;
            height: 40px;
            padding: 0;
            border: 0;
            background: transparent;
            border-radius: 50%;
            display: grid;
            place-items: center;
            color: #413c38;
            cursor: pointer;
            transition: color .2s ease, background .2s ease, transform .2s ease
        }

        .icon-btn svg {
            width: 19px;
            height: 19px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
            pointer-events: none
        }

        .icon-btn:hover {
            color: #8f5f5a;
            background: #f8ece6;
            transform: translateY(-1px)
        }

        .icon-btn:focus-visible,
        .menu a:focus-visible,
        .brand:focus-visible {
            outline: 2px solid var(--rose);
            outline-offset: 3px
        }

        .mobile-toggle {
            display: none
        }

        .mobile-toggle .menu-line {
            transform-origin: center;
            transition: transform .25s ease, opacity .2s ease
        }

        .mobile-toggle.is-open .menu-line:first-child {
            transform: translateY(6px) rotate(45deg)
        }

        .mobile-toggle.is-open .menu-line:nth-child(2) {
            opacity: 0
        }

        .mobile-toggle.is-open .menu-line:last-child {
            transform: translateY(-6px) rotate(-45deg)
        }

        .hero {
            position: relative;
            min-height: 660px;
            display: flex;
            align-items: center;
            overflow: hidden
        }

        .hero-slider {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1
        }

        .slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1);
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            z-index: 1
        }

        .slide.active {
            opacity: 1;
            z-index: 2
        }

        .slide-1 {
            background-image: linear-gradient(90deg, rgba(251, 247, 243, .96) 0%, rgba(251, 247, 243, .78) 34%, rgba(251, 247, 243, .08) 58%), var(--ppp-background-image,url('hero.png'))
        }

        .slide-2 {
            background-image: linear-gradient(90deg, rgba(251, 247, 243, .96) 0%, rgba(251, 247, 243, .78) 34%, rgba(251, 247, 243, .08) 58%), var(--ppp-background-image,url('img5.png'))
        }

        .hero .container {
            position: relative;
            z-index: 10
        }

        .slider-controls {
            position: absolute;
            bottom: 40px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 10;
            display: flex;
            gap: 16px;
            align-items: center
        }

        .slider-dot {
            width: 32px;
            height: 2px;
            background: rgba(39, 37, 35, 0.2);
            border: none;
            cursor: pointer;
            transition: all 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
            padding: 0;
            position: relative
        }

        .slider-dot::after {
            content: '';
            position: absolute;
            top: -15px;
            bottom: -15px;
            left: -5px;
            right: -5px
        }

        .slider-dot.active {
            width: 64px;
            background: var(--ink)
        }

        .hero-copy {
            max-width: 520px;
            padding: 80px 0
        }

        .eyebrow {
            font-size: 12px;
            letter-spacing: .28em;
            text-transform: uppercase;
            color: #706963;
            margin-bottom: 16px
        }

        h1,
        h2,
        h3 {
            font-family: "Cormorant Garamond", serif
        }

        h1 {
            font-size: 72px;
            line-height: .92;
            margin: 0 0 20px;
            font-weight: 600
        }

        .hero p {
            font-size: 16px;
            line-height: 1.8;
            color: #514c48;
            max-width: 450px
        }

        .script {
            font-family: Allura, cursive;
            font-size: 34px;
            color: #7f7a74;
            margin: 16px 0 26px
        }

        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            padding: 15px 24px;
            background: var(--rose);
            color: #fff;
            border: 0;
            font-weight: 600;
            letter-spacing: .08em;
            text-transform: uppercase;
            font-size: 12px;
            transition: .2s
        }

        .btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 25px rgba(200, 143, 137, .25)
        }

        .btn.sage {
            background: var(--sage-dark)
        }

        .btn.ghost {
            background: transparent;
            color: var(--ink);
            border: 1px solid var(--ink)
        }

        .features {
            padding: 30px 0;
            border-bottom: 1px solid var(--line);
            background: #fffaf7
        }

        .feature-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr)
        }

        .feature {
            padding: 24px 28px;
            text-align: center;
            border-right: 1px solid var(--line)
        }

        .feature:last-child {
            border-right: 0
        }

        .feature .ico {
            font-size: 27px;
            margin-bottom: 10px
        }

        .feature strong {
            display: block;
            font-family: "Cormorant Garamond", serif;
            font-size: 21px
        }

        .feature span {
            font-size: 13px;
            color: var(--muted);
            line-height: 1.5
        }

        .section {
            padding: 68px 0
        }

        .section.soft {
            background: #fffaf7
        }

        .section-head {
            text-align: center;
            max-width: 720px;
            margin: 0 auto 42px
        }

        .section-head h2 {
            font-size: 54px;
            line-height: 1;
            margin: 8px 0 12px
        }

        .section-head p {
            color: var(--muted);
            line-height: 1.7
        }

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

        .product-card {
            position: relative;
            background: linear-gradient(180deg, #fff 0%, #fffdfc 100%);
            border: 1px solid rgba(200, 143, 137, .22);
            border-radius: 18px;
            box-shadow: 0 12px 35px rgba(66, 48, 40, .08), 0 2px 8px rgba(66, 48, 40, .04);
            overflow: hidden;
            transition: transform .4s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease, border-color .4s ease;
            isolation: isolate
        }

        .product-card::after {
            content: '';
            position: absolute;
            inset: 8px;
            border: 1px solid rgba(255, 255, 255, .62);
            border-radius: 12px;
            pointer-events: none;
            z-index: 2
        }

        .product-card:hover {
            transform: translateY(-8px);
            border-color: rgba(200, 143, 137, .5);
            box-shadow: 0 24px 55px rgba(66, 48, 40, .14), 0 6px 16px rgba(66, 48, 40, .06)
        }

        .product-media {
            position: relative;
            aspect-ratio: 1.12/1;
            background: #f6ebe6;
            overflow: hidden;
            border-bottom: 1px solid rgba(200, 143, 137, .12)
        }

        .product-media::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, transparent 62%, rgba(54, 43, 38, .1) 100%);
            pointer-events: none
        }

        .product-media img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .7s cubic-bezier(.22, 1, .36, 1)
        }

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

        .product-copy {
            text-align: center;
            padding: 30px 28px 34px
        }

        .product-copy h3 {
            font-size: 34px;
            margin: 0 0 9px;
            line-height: 1
        }

        .product-copy .tag {
            width: fit-content;
            margin: 0 auto;
            padding: 6px 12px;
            border: 1px solid rgba(200, 143, 137, .18);
            border-radius: 999px;
            background: #fbf4f1;
            font-size: 10px;
            letter-spacing: .16em;
            text-transform: uppercase;
            font-weight: 600;
            color: #665d58
        }

        .product-copy p {
            color: var(--muted);
            line-height: 1.6;
            font-size: 14px;
            min-height: 46px;
            margin: 17px 0 21px
        }

        .product-copy .btn {
            min-width: 190px;
            border-radius: 999px;
            box-shadow: 0 8px 18px rgba(200, 143, 137, .18)
        }

        .product-copy .btn.sage {
            box-shadow: 0 8px 18px rgba(124, 136, 119, .2)
        }

        .video-section {
            position: relative;
            overflow: hidden;
            padding: 84px 0 48px;
            background:
                radial-gradient(circle at 8% 12%, rgba(200, 143, 137, .13), transparent 27%),
                radial-gradient(circle at 92% 88%, rgba(148, 160, 143, .12), transparent 25%),
                #fffaf7
        }

        .video-section::before,
        .video-section::after {
            content: '';
            position: absolute;
            width: 190px;
            height: 190px;
            border: 1px solid rgba(200, 143, 137, .14);
            border-radius: 50%;
            pointer-events: none
        }

        .video-section::before {
            top: -105px;
            left: -58px
        }

        .video-section::after {
            right: -70px;
            bottom: -120px
        }

        .video-heading-row {
            position: relative;
            z-index: 1;
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 50px;
            margin-bottom: 44px
        }

        .video-heading {
            max-width: 680px
        }

        .video-heading h2 {
            margin: 8px 0 14px;
            font-size: 54px;
            line-height: .98
        }

        .video-heading p {
            max-width: 580px;
            margin: 0;
            color: var(--muted);
            font-size: 16px;
            line-height: 1.7
        }

        .video-toggle {
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            gap: 9px;
            min-height: 42px;
            padding: 10px 17px;
            border: 1px solid rgba(124, 136, 119, .3);
            border-radius: 999px;
            color: #586052;
            background: rgba(255, 255, 255, .74);
            font: inherit;
            font-size: 12px;
            font-weight: 600;
            letter-spacing: .08em;
            text-transform: uppercase;
            cursor: pointer;
            transition: color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease
        }

        .video-toggle:hover {
            color: #fff;
            background: var(--sage-dark);
            transform: translateY(-2px);
            box-shadow: 0 10px 22px rgba(124, 136, 119, .18)
        }

        .video-toggle:focus-visible {
            outline: 2px solid var(--rose);
            outline-offset: 3px
        }

        .video-toggle-icon {
            position: relative;
            width: 12px;
            height: 12px
        }

        .video-toggle-icon::before,
        .video-toggle-icon::after {
            content: '';
            position: absolute;
            top: 1px;
            width: 3px;
            height: 10px;
            border-radius: 2px;
            background: currentColor
        }

        .video-toggle-icon::before {
            left: 1px
        }

        .video-toggle-icon::after {
            right: 1px
        }

        .video-toggle.is-paused .video-toggle-icon::before {
            top: 0;
            left: 2px;
            width: 0;
            height: 0;
            border-top: 6px solid transparent;
            border-bottom: 6px solid transparent;
            border-left: 9px solid currentColor;
            border-radius: 0;
            background: transparent
        }

        .video-toggle.is-paused .video-toggle-icon::after {
            display: none
        }

        .video-grid {
            position: relative;
            z-index: 1;
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 18px;
            padding-bottom: 0
        }

        .video-card {
            position: relative;
            margin: 0;
            aspect-ratio: 9 / 15;
            overflow: hidden;
            border: 7px solid rgba(255, 255, 255, .92);
            border-radius: 26px;
            background: #e9ddd6;
            box-shadow: 0 18px 42px rgba(66, 48, 40, .13);
            isolation: isolate;
            transition: transform .45s cubic-bezier(.22, 1, .36, 1), box-shadow .45s ease
        }

        .video-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 28px 54px rgba(66, 48, 40, .2)
        }

        .video-card::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(180deg, rgba(25, 20, 18, .03) 48%, rgba(34, 26, 23, .68) 100%);
            pointer-events: none
        }

        .video-card::after {
            content: '';
            position: absolute;
            inset: 8px;
            z-index: 2;
            border: 1px solid rgba(255, 255, 255, .5);
            border-radius: 14px;
            pointer-events: none
        }

        .video-card video {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover
        }

        .video-card figcaption {
            position: absolute;
            right: 24px;
            bottom: 22px;
            left: 24px;
            z-index: 3;
            color: #fff
        }

        .video-card figcaption span {
            display: block;
            margin-bottom: 5px;
            color: rgba(255, 255, 255, .78);
            font-size: 10px;
            font-weight: 600;
            letter-spacing: .18em;
            text-transform: uppercase
        }

        .video-card figcaption strong {
            display: block;
            font-family: "Cormorant Garamond", serif;
            font-size: 25px;
            font-weight: 600;
            line-height: 1.05
        }

        .story-section {
            padding: 76px 0;
            background: #fffaf7
        }

        .video-section + .story-section {
            padding-top: 28px
        }

        .editorial {
            display: grid;
            grid-template-columns: 1.02fr .98fr;
            min-height: 590px;
            overflow: hidden;
            background: #f7e9e4;
            border: 1px solid rgba(200, 143, 137, .18);
            border-radius: 24px;
            box-shadow: 0 22px 65px rgba(66, 48, 40, .1)
        }

        .editorial-visual {
            position: relative;
            background-image: var(--ppp-background-image,url('1.jpeg'));
            background-size: cover;
            background-position: center
        }

        .editorial-visual::after {
            content: '';
            position: absolute;
            inset: 12px;
            border: 1px solid rgba(255, 255, 255, .65);
            border-radius: 15px;
            pointer-events: none
        }

        .editorial-copy {
            padding: 66px clamp(42px, 5vw, 72px);
            display: flex;
            flex-direction: column;
            justify-content: center;
            position: relative;
            background: linear-gradient(145deg, #f9ece7 0%, #f5e4de 100%)
        }

        .editorial-copy h2 {
            font-size: 54px;
            line-height: .98;
            margin: 8px 0 24px
        }

        .editorial-copy p {
            margin: 0 0 14px;
            font-size: 15px;
            line-height: 1.8;
            color: #504a46;
            max-width: 600px
        }

        .story-values {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 10px;
            margin: 18px 0 25px;
            padding-top: 20px;
            border-top: 1px solid rgba(122, 101, 91, .16)
        }

        .story-values span {
            font-size: 11px;
            font-weight: 600;
            line-height: 1.45;
            letter-spacing: .06em;
            color: #665d58
        }

        .flower-note {
            align-self: flex-end;
            margin: -2px 8px 25px 0;
            font-family: Allura, cursive;
            font-size: 32px;
            line-height: .95;
            color: #77706c;
            transform: rotate(-5deg)
        }

        .banner {
            position: relative;
            min-height: 540px;
            background-image: linear-gradient(90deg, rgba(251, 247, 243, .98) 0%, rgba(251, 247, 243, .9) 34%, rgba(251, 247, 243, .24) 58%, rgba(251, 247, 243, .02) 74%), var(--ppp-background-image,url('secbg.png'));
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            overflow: hidden;
            border-top: 1px solid rgba(200, 143, 137, .12);
            border-bottom: 1px solid rgba(200, 143, 137, .12)
        }

        .banner-copy {
            position: relative;
            max-width: 560px;
            padding: 86px 0 86px 42px
        }

        .banner-copy::before {
            content: '';
            position: absolute;
            top: 86px;
            bottom: 86px;
            left: 0;
            width: 2px;
            background: linear-gradient(180deg, var(--rose), var(--sage))
        }

        .banner-copy h2 {
            font-size: 56px;
            line-height: .98;
            margin: 7px 0 19px
        }

        .banner-copy p {
            max-width: 485px;
            margin: 0;
            line-height: 1.7;
            color: var(--muted)
        }

        .detail-list {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin: 26px 0 30px
        }

        .detail-list span {
            padding: 8px 12px;
            border: 1px solid rgba(124, 136, 119, .24);
            border-radius: 999px;
            background: rgba(255, 255, 255, .6);
            color: #5f675c;
            font-size: 11px;
            font-weight: 600;
            letter-spacing: .04em
        }

        .quote {
            position: relative;
            width: 100%;
            margin: 0;
            background-image: var(--ppp-background-image,url('img10.png'));
            background-color: #f8ece6;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            display: flex;
            align-items: center;
            overflow: hidden;
            border-top: 1px solid rgba(200, 143, 137, .12);
            border-bottom: 1px solid rgba(200, 143, 137, .12);
            isolation: isolate
        }

        .quote::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: -1;
            background: linear-gradient(90deg, rgba(248, 236, 230, .94) 0%, rgba(248, 236, 230, .66) 32%, rgba(248, 236, 230, .08) 60%, transparent 75%)
        }

        .quote-inner {
            width: 100%;
            margin: auto;
            padding: 0 max(20px, calc((100% - 1180px) / 2));
            position: relative;
            z-index: 1
        }

        .quote-copy {
            position: relative;
            max-width: 600px;
            margin: 0;
            padding: 20px 0 20px 56px
        }

        .quote-copy::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 2px;
            height: 100%;
            background: linear-gradient(180deg, transparent 0%, var(--rose) 22%, var(--sage) 78%, transparent 100%)
        }

        .quote-mark {
            display: block;
            height: 48px;
            margin-left: -4px;
            font-family: "Cormorant Garamond", serif;
            font-size: 100px;
            font-weight: 600;
            line-height: .78;
            color: rgba(200, 143, 137, .58)
        }

        .quote .eyebrow {
            margin: 0 0 18px;
            color: #766b65
        }

        .quote p {
            font-family: "Cormorant Garamond", serif;
            font-size: 46px;
            font-weight: 600;
            line-height: 1.12;
            color: #3f3936;
            margin: 0
        }

        .quote p em {
            color: #a86f6b;
            font-weight: 600
        }

        .quote footer {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-top: 28px;
            color: #716863;
            font-size: 13px;
            line-height: 1.6
        }

        .quote footer::before {
            content: '';
            width: 44px;
            height: 1px;
            flex: 0 0 auto;
            background: var(--rose)
        }

        .ritual-section {
            padding: 76px 0;
            background: #fff
        }

        .ritual-grid {
            display: grid;
            grid-template-columns: 1.08fr .92fr;
            overflow: hidden;
            background: #faf5f1;
            border: 1px solid rgba(200, 143, 137, .18);
            border-radius: 22px;
            box-shadow: 0 20px 60px rgba(66, 48, 40, .09)
        }

        .ritual-visual {
            position: relative;
            min-height: 510px;
            overflow: hidden
        }

        .ritual-visual::after {
            content: '';
            position: absolute;
            inset: 12px;
            border: 1px solid rgba(255, 255, 255, .68);
            border-radius: 13px;
            pointer-events: none
        }

        .ritual-visual img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 26% center
        }

        .ritual-copy {
            padding: 62px 58px;
            display: flex;
            flex-direction: column;
            justify-content: center
        }

        .ritual-copy h2 {
            margin: 7px 0 18px;
            font-size: 52px;
            line-height: 1;
            font-weight: 600
        }

        .ritual-copy > p {
            margin: 0;
            color: var(--muted);
            font-size: 15px;
            line-height: 1.75
        }

        .ritual-points {
            margin: 30px 0 32px;
            border-top: 1px solid #eaded7
        }

        .ritual-point {
            display: grid;
            grid-template-columns: 32px 1fr;
            gap: 12px;
            align-items: center;
            padding: 15px 0;
            border-bottom: 1px solid #eaded7
        }

        .ritual-point span {
            font-family: "Cormorant Garamond", serif;
            font-size: 19px;
            font-style: italic;
            color: var(--rose)
        }

        .ritual-point strong {
            font-size: 13px;
            font-weight: 500;
            letter-spacing: .02em;
            color: #4f4945
        }

        .ritual-copy .btn {
            align-self: flex-start
        }

        .gallery-section {
            position: relative;
            overflow: hidden;
            background: linear-gradient(180deg, #fff 0%, #fdf9f6 100%)
        }

        .gallery-head {
            max-width: none;
            margin-bottom: 38px;
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 60px;
            text-align: left
        }

        .gallery-head h2 {
            margin-bottom: 0
        }

        .gallery-head p {
            max-width: 430px;
            margin: 0 0 4px
        }

        .gallery {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            grid-template-rows: repeat(2, 255px);
            gap: 14px
        }

        .gallery-item {
            position: relative;
            margin: 0;
            overflow: hidden;
            border: 1px solid rgba(200, 143, 137, .14);
            border-radius: 18px;
            background: #eee5df
        }

        .gallery-item::after {
            content: '';
            position: absolute;
            inset: 0;
            pointer-events: none;
            background: linear-gradient(180deg, transparent 65%, rgba(37, 29, 26, .14) 100%);
            opacity: .7;
            transition: opacity .4s ease
        }

        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .65s cubic-bezier(.22, 1, .36, 1)
        }

        .gallery-item:hover img {
            transform: scale(1.045)
        }

        .gallery-item:hover::after {
            opacity: .25
        }

        .gallery-item:nth-child(1) {
            grid-column: 1 / span 3;
            grid-row: 1 / span 2
        }

        .gallery-item:nth-child(2) {
            grid-column: 4 / span 6;
            grid-row: 1
        }

        .gallery-item:nth-child(3) {
            grid-column: 10 / span 3;
            grid-row: 1 / span 2
        }

        .gallery-item:nth-child(4) {
            grid-column: 4 / span 3;
            grid-row: 2
        }

        .gallery-extra {
            grid-column: 7 / span 3;
            grid-row: 2
        }

        .gallery-extra img {
            object-position: 76% center
        }

        .newsletter {
            position: relative;
            overflow: hidden;
            background: linear-gradient(135deg, #f9efeb 0%, #f4e1db 100%);
            padding: 86px 0
        }

        .news-inner {
            position: relative;
            overflow: hidden;
            display: grid;
            grid-template-columns: 1.08fr .92fr;
            gap: 68px;
            align-items: center;
            padding: 56px 62px;
            border: 1px solid rgba(200, 143, 137, .26);
            border-radius: 30px;
            background: rgba(255, 252, 249, .86);
            box-shadow: 0 24px 65px rgba(92, 60, 49, .1)
        }

        .news-inner::before {
            content: '';
            position: absolute;
            width: 290px;
            height: 290px;
            top: -170px;
            left: -90px;
            border-radius: 50%;
            background: rgba(200, 143, 137, .11);
            pointer-events: none
        }

        .news-copy,
        .news-form-panel {
            position: relative;
            z-index: 1
        }

        .news-copy {
            max-width: 570px
        }

        .news-inner h2 {
            max-width: 460px;
            margin: 10px 0 16px;
            font-size: 52px;
            line-height: .96
        }

        .news-copy>p {
            max-width: 520px;
            margin: 0;
            color: var(--muted);
            font-size: 16px;
            line-height: 1.75
        }

        .news-form-panel {
            padding: 30px;
            border: 1px solid rgba(200, 143, 137, .2);
            border-radius: 22px;
            background: #f8ece6;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75)
        }

        .news-form-label {
            display: block;
            margin: 0 0 14px;
            color: #6f625c;
            font-size: 11px;
            font-weight: 600;
            letter-spacing: .18em;
            text-transform: uppercase
        }

        .subscribe {
            display: flex;
            gap: 10px
        }

        .subscribe input {
            flex: 1;
            min-width: 0;
            min-height: 56px;
            border: 1px solid #ddccc4;
            border-radius: 999px;
            background: #fff;
            padding: 16px 21px;
            font: inherit;
            color: var(--ink);
            outline: none;
            transition: border-color .2s ease, box-shadow .2s ease
        }

        .subscribe input:focus {
            border-color: var(--rose);
            box-shadow: 0 0 0 4px rgba(200, 143, 137, .13)
        }

        .subscribe button {
            min-height: 56px;
            padding-right: 24px;
            padding-left: 24px;
            border: none;
            border-radius: 999px;
            white-space: nowrap;
            background: var(--ink)
        }

        .news-form-note {
            display: block;
            margin-top: 13px;
            color: #8b7d76;
            font-size: 12px
        }

        .footer {
            position: relative;
            overflow: hidden;
            background-color: #252522;
            background-image: var(--ppp-background-image,url('img6.png'));
            background-position: center center;
            background-size: cover;
            background-repeat: no-repeat;
            background-attachment: fixed;
            color: #f6f2ef
        }

        .footer::before {
            content: '';
            position: absolute;
            inset: 0;
            background:
                linear-gradient(110deg, rgba(25, 23, 21, .84) 0%, rgba(34, 30, 27, .77) 46%, rgba(39, 32, 28, .7) 100%),
                radial-gradient(circle at 82% 14%, rgba(207, 156, 145, .16), transparent 36%);
            pointer-events: none
        }

        .footer::after {
            content: '';
            position: absolute;
            inset: 0 0 auto;
            height: 1px;
            background: rgba(255, 255, 255, .35);
            pointer-events: none
        }

        .footer>.container {
            position: relative;
            z-index: 1;
            padding-top: 56px;
            padding-bottom: 22px
        }

        .footer-main {
            display: grid;
            grid-template-columns: minmax(270px, .72fr) minmax(0, 1.65fr);
            gap: 18px;
            align-items: stretch
        }

        .footer-brand-panel,
        .footer-directory {
            border: 1px solid rgba(255, 255, 255, .14);
            box-shadow: 0 22px 58px rgba(0, 0, 0, .18);
            -webkit-backdrop-filter: blur(9px);
            backdrop-filter: blur(9px)
        }

        .footer-brand-panel {
            display: flex;
            flex-direction: column;
            padding: 32px;
            border-radius: 28px;
            background: rgba(21, 19, 18, .64)
        }

        .footer-logo-link {
            display: inline-flex;
            width: 126px;
            height: 126px;
            padding: 6px;
            overflow: hidden;
            border: 1px solid rgba(255, 255, 255, .22);
            border-radius: 21px;
            background: #fff;
            box-shadow: 0 16px 36px rgba(0, 0, 0, .2);
            transition: transform .3s ease, box-shadow .3s ease
        }

        .footer-logo-link:hover {
            transform: translateY(-4px);
            box-shadow: 0 24px 52px rgba(0, 0, 0, .26)
        }

        .footer-logo-link img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: contain;
            border-radius: 15px
        }

        .footer-promise {
            margin-top: 30px;
            padding-top: 28px;
            border-top: 1px solid rgba(255, 255, 255, .14)
        }

        .footer h4 {
            margin: 0 0 17px;
            color: #efd9d4;
            font-family: Outfit, Arial, sans-serif;
            font-size: 11px;
            font-weight: 600;
            letter-spacing: .16em;
            text-transform: uppercase
        }

        .footer-promise strong {
            display: block;
            margin-bottom: 10px;
            color: #fff;
            font-family: "Cormorant Garamond", serif;
            font-size: 29px;
            font-weight: 600;
            line-height: 1.05
        }

        .footer p,
        .footer a {
            color: #d4ceca;
            font-size: 13px;
            line-height: 1.75
        }

        .footer-promise p {
            margin: 0;
            max-width: 300px
        }

        .footer-directory {
            overflow: hidden;
            border-radius: 28px;
            background: rgba(21, 19, 18, .48)
        }

        .footer-contact-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 30px;
            padding: 34px 38px;
            border-bottom: 1px solid rgba(255, 255, 255, .13);
            background: linear-gradient(110deg, rgba(216, 170, 165, .15), rgba(255, 255, 255, .035))
        }

        .footer-contact-copy span {
            display: block;
            margin-bottom: 6px;
            color: #cfc6c1;
            font-size: 10px;
            font-weight: 600;
            letter-spacing: .18em;
            text-transform: uppercase
        }

        .footer-contact-copy strong {
            display: block;
            color: #fff;
            font-family: "Cormorant Garamond", serif;
            font-size: 29px;
            font-weight: 600;
            line-height: 1.08
        }

        .footer-note-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 11px;
            flex: 0 0 auto;
            min-height: 48px;
            padding: 10px 19px;
            border: 1px solid rgba(255, 255, 255, .2);
            border-radius: 999px;
            background: rgba(255, 255, 255, .1);
            color: #fff !important;
            font-weight: 500;
            transition: color .2s ease, background .2s ease, transform .2s ease
        }

        .footer-note-link span {
            color: #efc8c2;
            transition: transform .2s ease
        }

        .footer-note-link:hover {
            color: var(--ink) !important;
            background: #f6e8e3;
            transform: translateY(-2px)
        }

        .footer-note-link:hover span {
            transform: translateX(4px)
        }

        .footer-links-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 42px;
            padding: 38px 40px 42px
        }

        .footer-column a {
            width: fit-content;
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 3px 0;
            transition: color .2s ease, transform .2s ease
        }

        .footer-column a::before {
            content: '';
            width: 0;
            height: 1px;
            background: #d8aaa5;
            transition: width .25s ease
        }

        .footer-column a:hover {
            color: #fff;
            transform: translateX(3px)
        }

        .footer-column a:hover::before {
            width: 12px
        }

        .footer-bottom {
            margin-top: 24px;
            padding: 20px 8px 4px;
            border-top: 1px solid rgba(255, 255, 255, .18);
            font-size: 12px;
            color: #c9c1bc;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 24px
        }

        .footer-legal {
            display: flex;
            gap: 20px
        }

        .footer-legal a {
            color: #c9c1bc;
            font-size: 12px
        }

        .footer-legal a:hover {
            color: #fff
        }

        @media(max-width:900px) {
            .menu {
                display: none;
                position: absolute;
                top: 92px;
                left: 0;
                right: 0;
                gap: 4px;
                padding: 16px 28px 20px;
                border-radius: 0 0 20px 20px;
                background: rgba(255, 252, 249, .98);
                flex-direction: column;
                align-items: stretch;
                border-top: 1px solid var(--line);
                box-shadow: var(--shadow)
            }

            .menu a {
                width: 100%;
                padding: 12px 14px
            }

            .menu.open {
                display: flex
            }

            .mobile-toggle {
                display: grid
            }

            .brand-text small {
                display: none
            }

            .hero {
                min-height: 610px
            }

            .slide {
                background-position: 62% center
            }

            h1 {
                font-size: 56px
            }

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

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

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

            .video-heading-row {
                align-items: flex-start;
                flex-direction: column;
                gap: 24px
            }

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

            .editorial {
                grid-template-columns: 1fr;
                min-height: 0
            }

            .editorial-visual {
                min-height: 430px
            }

            .story-section {
                padding: 58px 0
            }

            .banner {
                background-position: 64% center
            }

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

            .ritual-visual {
                min-height: 380px
            }

            .news-inner {
                grid-template-columns: 1fr;
                gap: 36px;
                padding: 48px
            }

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

            .footer-brand-panel {
                display: grid;
                grid-template-columns: auto 1fr;
                gap: 34px;
                align-items: center
            }

            .footer-promise {
                margin-top: 0;
                padding-top: 0;
                padding-left: 34px;
                border-top: 0;
                border-left: 1px solid rgba(255, 255, 255, .14)
            }

            .gallery-head {
                display: block
            }

            .gallery-head p {
                margin-top: 16px
            }

            .gallery {
                grid-template-columns: repeat(2, 1fr);
                grid-template-rows: repeat(3, 250px)
            }

            .gallery-item:nth-child(1) {
                grid-column: auto;
                grid-row: span 2
            }

            .gallery-item:nth-child(2),
            .gallery-item:nth-child(3),
            .gallery-item:nth-child(4),
            .gallery-extra {
                grid-column: auto;
                grid-row: auto
            }
        }

        @media(max-width:600px) {
            .container {
                width: min(100% - 28px, 1180px)
            }

            .announcement {
                font-size: 11px;
                letter-spacing: .01em
            }

            .announcement-inner {
                width: calc(100% - 20px);
                grid-template-columns: 50px minmax(0, 1fr) 50px
            }

            .announcement-item {
                gap: 6px;
                padding: 0 4px
            }

            .announcement-item .announcement-detail,
            .announcement-separator,
            .announcement-controls .announcement-dot {
                display: none
            }

            .nav {
                height: 76px;
                grid-template-columns: auto minmax(0, 1fr) auto;
                gap: 10px
            }

            .menu {
                top: 76px
            }

            .brand {
                width: 54px;
                height: 54px;
                border-radius: 14px
            }

            .brand img {
                border-radius: 10px
            }

            .nav-actions {
                gap: 3px;
                padding: 3px;
                justify-self: end
            }

            .icon-btn {
                width: 34px;
                height: 34px
            }

            .icon-btn svg {
                width: 18px;
                height: 18px
            }

            .hero {
                min-height: 720px;
                min-height: max(720px, calc(100svh - 42px));
                align-items: flex-start
            }

            .slide-1 {
                background-image: linear-gradient(180deg, rgba(251, 247, 243, .96) 0%, rgba(251, 247, 243, .90) 48%, rgba(251, 247, 243, .18) 100%), var(--ppp-background-image,url('hero.png'))
            }

            .slide-2 {
                background-image: linear-gradient(180deg, rgba(251, 247, 243, .96) 0%, rgba(251, 247, 243, .90) 48%, rgba(251, 247, 243, .18) 100%), var(--ppp-background-image,url('img5.png'))
            }

            .slide {
                align-items: flex-start;
                background-position: center, 68% bottom;
                background-size: 100% 100%, auto 47%;
                background-repeat: no-repeat
            }

            .hero-copy {
                max-width: 100%;
                padding: 124px 0 250px
            }

            h1 {
                font-size: clamp(43px, 13vw, 50px)
            }

            .hero p {
                max-width: 100%;
                margin: 0;
                font-size: 15px;
                line-height: 1.65
            }

            .hero .script {
                margin: 14px 0 22px;
                font-size: 29px;
                line-height: 1.05
            }

            .slider-controls {
                bottom: 24px;
                gap: 12px
            }

            .slider-dot.active {
                width: 48px
            }

            .section {
                padding: 64px 0
            }

            .section-head h2 {
                font-size: 42px
            }

            .video-section {
                padding: 62px 0 36px
            }

            .video-heading-row {
                margin-bottom: 30px
            }

            .video-heading h2 {
                font-size: 42px
            }

            .video-heading p {
                font-size: 15px
            }

            .video-toggle {
                min-height: 40px;
                padding: 9px 15px
            }

            .video-grid {
                width: calc(100% + 14px);
                margin-right: -14px;
                padding-right: 14px;
                padding-bottom: 28px;
                overflow-x: auto;
                grid-template-columns: repeat(4, minmax(210px, 72vw));
                gap: 12px;
                scroll-snap-type: x mandatory;
                scrollbar-width: none
            }

            .video-grid::-webkit-scrollbar {
                display: none
            }

            .video-card {
                transform: none;
                scroll-snap-align: start;
                border-width: 5px;
                border-radius: 22px
            }

            .video-card:hover {
                transform: none
            }

            .video-card figcaption {
                right: 20px;
                bottom: 19px;
                left: 20px
            }

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

            .feature {
                padding: 18px 10px
            }

            .editorial-copy {
                padding: 46px 26px 50px
            }

            .editorial-copy h2,
            .banner-copy h2 {
                font-size: 42px
            }

            .story-section {
                padding: 50px 0
            }

            .video-section + .story-section {
                padding-top: 20px
            }

            .editorial {
                border-radius: 16px
            }

            .editorial-visual {
                min-height: 300px
            }

            .story-values {
                grid-template-columns: 1fr;
                gap: 0;
                margin-top: 14px
            }

            .story-values span {
                padding: 8px 0;
                border-bottom: 1px solid rgba(122, 101, 91, .12)
            }

            .story-values br {
                display: none
            }

            .flower-note {
                align-self: flex-start;
                margin: 0 0 24px;
                font-size: 28px
            }

            .banner {
                min-height: 600px;
                background-image: linear-gradient(90deg, rgba(251, 247, 243, .98) 0%, rgba(251, 247, 243, .92) 72%, rgba(251, 247, 243, .48) 100%), var(--ppp-background-image,url('secbg.png'));
                background-size: cover, auto 100%;
                background-position: center, 72% center;
                background-repeat: no-repeat
            }

            .banner-copy {
                padding: 64px 12px 64px 28px
            }

            .banner-copy::before {
                top: 64px;
                bottom: 64px
            }

            .quote {
                background-size: auto 100%;
                background-position: 72% center
            }

            .quote::before {
                background: linear-gradient(90deg, rgba(248, 236, 230, .96) 0%, rgba(248, 236, 230, .88) 64%, rgba(248, 236, 230, .38) 100%)
            }

            .quote-inner {
                width: 100%;
                padding: 0 14px
            }

            .quote-copy {
                max-width: 100%;
                padding: 14px 8px 14px 28px
            }

            .quote-mark {
                height: 40px;
                font-size: 82px
            }

            .quote p {
                font-size: 34px
            }

            .ritual-section {
                padding: 52px 0
            }

            .ritual-grid {
                border-radius: 16px
            }

            .ritual-visual {
                min-height: 285px
            }

            .ritual-copy {
                padding: 42px 26px 46px
            }

            .ritual-copy h2 {
                font-size: 42px
            }

            .newsletter {
                padding: 58px 0
            }

            .news-inner {
                gap: 28px;
                padding: 34px 22px;
                border-radius: 22px
            }

            .news-inner h2 {
                font-size: 43px
            }

            .news-form-panel {
                padding: 22px 18px;
                border-radius: 18px
            }

            .subscribe {
                flex-direction: column
            }

            .subscribe button {
                width: 100%
            }

            .gallery {
                grid-template-rows: 220px 220px 190px;
                gap: 10px
            }

            .gallery-item {
                border-radius: 13px
            }

            .footer {
                background-attachment: scroll;
                background-position: 34% center
            }

            .footer>.container {
                padding-top: 34px;
                padding-bottom: 16px
            }

            .footer-main {
                gap: 14px
            }

            .footer-logo-link {
                width: 112px;
                height: 112px;
                border-radius: 18px
            }

            .footer-brand-panel {
                display: block;
                padding: 24px;
                border-radius: 20px
            }

            .footer-promise {
                margin-top: 24px;
                padding-top: 24px;
                padding-left: 0;
                border-top: 1px solid rgba(255, 255, 255, .14);
                border-left: 0
            }

            .footer-directory {
                border-radius: 20px
            }

            .footer-contact-row {
                align-items: flex-start;
                flex-direction: column;
                gap: 20px;
                padding: 27px 22px
            }

            .footer-contact-copy strong {
                font-size: 26px
            }

            .footer-note-link {
                width: 100%
            }

            .footer-links-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 32px 20px;
                padding: 30px 22px 34px
            }

            .footer-column:last-child {
                grid-column: 1 / -1
            }

            .footer-bottom {
                align-items: flex-start;
                flex-direction: column;
                gap: 12px;
                padding-right: 4px;
                padding-left: 4px
            }

            .footer-legal {
                gap: 16px
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .announcement::before {
                animation: none
            }

            .announcement-item,
            .product-card,
            .product-media img,
            .video-card,
            .gallery-item img {
                transition: none
            }

            .product-card:hover,
            .product-card:hover .product-media img,
            .video-card:hover,
            .gallery-item:hover img {
                transform: none
            }
        }