html { scroll-behavior: smooth; }
body:has(.cxp-page) { background: var(--bg-page, #fbf6ee); }
body:has(.cxp-page), body:has(.cxp-page) * { cursor: none !important; }
.cxp-page { --cxp-bg: var(--bg-page, #fbf6ee); --cxp-band: var(--bg-band, #eadcc8); --cxp-card: rgba(255,255,255,.88); --cxp-ink: var(--ink, #2f2f2f); --cxp-soft: var(--ink-soft, rgba(47,47,47,.72)); --cxp-line: var(--line, rgba(47,47,47,.14)); --cxp-accent: var(--accent, #8b6f37); --cxp-brown: #5b3b28; --cxp-dark: #17110b; --cxp-cream: #fbf6ee; --cxp-radius: var(--radius-large, 44px); --cxp-shadow: var(--shadow-soft, 0 18px 40px rgba(47,47,47,.1)); position: relative; overflow: hidden; background: var(--cxp-bg); color: var(--cxp-ink); }
.cxp-page *, .cxp-page *::before, .cxp-page *::after { box-sizing: border-box; }
.cxp-page::before { position: fixed; inset: 0; z-index: 80; pointer-events: none; content: ''; opacity: .035; background: repeating-radial-gradient(circle at 20% 20%, rgba(47,47,47,.12) 0 1px, transparent 1px 4px); }
.cxp-preloader { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(1.25rem,3vw,2.75rem); background: var(--cxp-cream); color: var(--cxp-ink); }
.cxp-preloader__top { display: flex; justify-content: space-between; gap: 1rem; color: var(--cxp-accent); font-size: .72rem; font-weight: 850; text-transform: uppercase; letter-spacing: .34em; }
.cxp-preloader__center { display: grid; min-height: 55vh; place-items: center; gap: clamp(2rem,5vw,3rem); }
.cxp-preloader__logo { width: min(54vw,520px); max-height: 280px; object-fit: contain; }
.cxp-preloader__word { max-width: 720px; margin: 0; color: var(--cxp-ink); font-family: 'DM Serif Display', Georgia, serif; font-size: clamp(2.2rem,5vw,5.4rem); font-weight: 400; line-height: .92; letter-spacing: -.05em; text-align: center; }
.cxp-preloader__bar { width: min(360px,58vw); height: 4px; margin-inline: auto; overflow: hidden; border-radius: 999px; background: rgba(91,59,40,.18); }
.cxp-preloader__bar span { display: block; width: 0; height: 100%; background: var(--cxp-brown); }
.cxp-cursor-dot, .cxp-cursor-ring { position: fixed; top: 0; left: 0; z-index: 10000; pointer-events: none; opacity: 0; transform: translate(-50%,-50%); }
.cxp-cursor-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--cxp-accent); }
.cxp-cursor-ring { width: 46px; height: 46px; border: 1.4px solid #fff; border-radius: 999px; background: rgba(255,255,255,.02); mix-blend-mode: difference; transition: width .22s ease, height .22s ease, background .22s ease, border-color .22s ease; }
.cxp-cursor-active .cxp-cursor-ring { width: 74px; height: 74px; background: rgba(255,255,255,.12); }
.cxp-cursor-on-dark .cxp-cursor-ring { border-color: #fff; background: rgba(255,255,255,.1); }
.cxp-section { padding: clamp(5rem,9vw,8rem) 0; }
.cxp-kicker, .cxp-page .eyebrow { display: inline-flex; margin-bottom: 14px; color: var(--cxp-accent); font-family: Inter, system-ui, sans-serif; font-size: .75rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.cxp-hero h1, .cxp-section-title { margin: 0; font-family: 'DM Serif Display', Georgia, serif; font-weight: 400; line-height: .92; letter-spacing: -.055em; text-wrap: balance; }
.cxp-section-title { font-size: clamp(3.1rem,5.8vw,6.7rem); }
.cxp-section-copy { max-width: 760px; margin-top: 1rem; color: var(--cxp-soft); font-size: clamp(1rem,1.1vw,1.1rem); line-height: 1.56; }
.cxp-hero { position: relative; min-height: calc(100svh - var(--header-height, 84px)); display: flex; align-items: center; overflow: hidden; padding: clamp(7rem,10vw,10rem) 0 clamp(4rem,7vw,6rem); background: var(--cxp-bg); }
.cxp-hero__media, .cxp-hero-bg, .cxp-hero__veil, .cxp-hero__grain { position: absolute; inset: 0; }
.cxp-hero-bg { width: 100%; height: 116%; object-fit: cover; opacity: .74; filter: saturate(.95) contrast(.92); }
.cxp-hero__veil { background: radial-gradient(circle at 80% 46%, rgba(251,246,238,.12), transparent 24rem), linear-gradient(90deg, rgba(251,246,238,.96) 0%, rgba(251,246,238,.86) 38%, rgba(251,246,238,.52) 62%, rgba(23,17,11,.28) 100%); }
.cxp-hero__grain { opacity: .04; background: repeating-linear-gradient(45deg, rgba(47,47,47,.1) 0 1px, transparent 1px 6px); }
.cxp-hero__ghost { position: absolute; left: 3vw; bottom: 3vw; margin: 0; color: rgba(47,47,47,.045); font-family: 'DM Serif Display', Georgia, serif; font-size: clamp(9rem,25vw,25rem); line-height: .75; letter-spacing: -.1em; pointer-events: none; }
.cxp-hero__inner { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr) minmax(320px,.52fr); gap: clamp(2.5rem,5vw,5rem); align-items: center; }
.cxp-hero h1 { max-width: 930px; color: #2a251f; font-size: clamp(4.8rem,9.4vw,10.8rem); line-height: .82; letter-spacing: -.075em; }
.cxp-line { display: block; overflow: hidden; }
.cxp-line span { display: block; }
.cxp-hero__copy p { max-width: 620px; margin: 1.45rem 0 0; color: rgba(47,47,47,.72); font-size: clamp(1.02rem,1.2vw,1.18rem); line-height: 1.55; }
.cxp-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 1.7rem; }
.cxp-hero__objects { position: relative; min-height: 470px; }
.cxp-object { border: 1px solid var(--cxp-line); border-radius: 34px; background: rgba(255,250,243,.76); box-shadow: var(--cxp-shadow); backdrop-filter: blur(18px); }
.cxp-object--main { width: min(100%,380px); margin-left: auto; padding: 1.25rem; }
.cxp-object--main img { width: 100%; min-height: 170px; object-fit: contain; border-radius: 26px; }
.cxp-object--main span { display: block; padding: .9rem .4rem .2rem; color: var(--cxp-accent); font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.cxp-object--float { position: absolute; width: 240px; padding: 1.15rem; }
.cxp-object--web { left: 0; top: 4rem; }
.cxp-object--qr { right: 0; bottom: 2rem; }
.cxp-object strong { display: block; color: var(--cxp-ink); font-family: 'DM Serif Display', Georgia, serif; font-size: 1.9rem; font-weight: 400; line-height: .94; }
.cxp-object small { display: block; margin-top: .45rem; color: var(--cxp-soft); font-weight: 700; }
.cxp-scroll-story, .cxp-process-jack { min-height: 100svh; background: var(--cxp-dark); color: var(--cxp-cream); }
.cxp-scroll-story__pin, .cxp-process-jack__pin, .cxp-needs-carousel__pin, .cxp-horizontal__pin { position: relative; min-height: max(720px,100svh); overflow: hidden; }
.cxp-scroll-story__pin, .cxp-process-jack__pin, .cxp-needs-carousel__pin { display: grid; align-items: center; padding: clamp(5rem,7vw,6.5rem) 0; }
.cxp-scroll-story__grid, .cxp-process-jack__grid, .cxp-loyalty__grid, .cxp-review-form { display: grid; grid-template-columns: minmax(280px,.8fr) minmax(0,1fr); gap: clamp(2rem,6vw,6rem); align-items: center; }
.cxp-story-visual { position: relative; min-height: clamp(420px,52svh,560px); }
.cxp-pass { position: relative; z-index: 2; width: min(100%,390px); margin-inline: auto; border: 1px solid rgba(232,220,200,.18); border-radius: 38px; padding: clamp(1rem,2.5vw,1.4rem); background: linear-gradient(145deg, rgba(251,246,238,.96), rgba(234,220,200,.84)); color: var(--cxp-ink); box-shadow: 0 30px 100px rgba(0,0,0,.35); transform: rotate(-5deg); }
.cxp-pass__top { display: flex; justify-content: space-between; color: var(--cxp-accent); font-size: .72rem; font-weight: 900; letter-spacing: .16em; }
.cxp-pass__mark { display: grid; min-height: clamp(170px,26svh,230px); place-items: center; }
.cxp-pass__mark img { width: 76%; max-height: 180px; object-fit: contain; }
.cxp-pass__lines { display: grid; gap: .65rem; }
.cxp-pass__lines span { height: 10px; border-radius: 999px; background: rgba(47,47,47,.1); }
.cxp-pass__qr { width: 90px; height: 90px; margin-top: 1.2rem; background: linear-gradient(90deg, var(--cxp-ink) 50%, transparent 0) 0 0 / 18px 18px, linear-gradient(var(--cxp-ink) 50%, transparent 0) 0 0 / 18px 18px; opacity: .2; }
.cxp-orbit { position: absolute; border-radius: 999px; filter: blur(50px); }
.cxp-orbit--one { inset: 8% auto auto 8%; width: 220px; height: 220px; background: rgba(139,111,55,.45); }
.cxp-orbit--two { right: 6%; bottom: 8%; width: 260px; height: 260px; background: rgba(234,220,200,.18); }
.cxp-story-copy .cxp-section-title, .cxp-process-jack .cxp-section-title { color: var(--cxp-cream); }
.cxp-story-copy .cxp-section-title { max-width: 780px; }
.cxp-story__steps { display: grid; gap: clamp(.75rem,1.4vw,1rem); margin-top: 2rem; }
.cxp-story__steps article { border-left: 2px solid rgba(251,246,238,.12); padding: .65rem 0 .65rem 1.2rem; opacity: .35; transform: translateX(0); }
.cxp-story__steps article.is-active { border-color: var(--cxp-accent); opacity: 1; transform: translateX(.45rem); }
.cxp-story__steps span, .cxp-process-step span { color: var(--cxp-accent); font-weight: 900; letter-spacing: .12em; }
.cxp-story__steps h3, .cxp-process-step h3 { margin: .25rem 0; color: var(--cxp-cream); font-family: 'DM Serif Display', Georgia, serif; font-size: clamp(1.8rem,3vw,2.8rem); font-weight: 400; line-height: 1; }
.cxp-story__steps p, .cxp-process-jack .cxp-section-copy, .cxp-process-step p { max-width: 650px; color: rgba(251,246,238,.7); }
.cxp-statement, .cxp-catalog, .cxp-reviews { background: var(--cxp-bg); }
.cxp-editorial-card, .cxp-surface { border-radius: var(--cxp-radius); padding: clamp(2rem,5vw,4rem); background: var(--cxp-card); box-shadow: var(--cxp-shadow); }
.cxp-editorial-card { text-align: center; }
.cxp-editorial-card h2 { max-width: 980px; margin-inline: auto; }
.cxp-editorial-card p { max-width: 760px; margin: 1rem auto 0; color: var(--cxp-soft); }
.cxp-needs-carousel { min-height: 100svh; background: var(--cxp-band); }
.cxp-needs-carousel__grid { display: grid; grid-template-columns: minmax(280px,.72fr) minmax(0,1fr); gap: clamp(2rem,6vw,6rem); align-items: center; }
.cxp-carousel-progress, .cxp-process-progress { width: min(280px,100%); height: 4px; margin-top: 1.5rem; overflow: hidden; border-radius: 999px; background: rgba(47,47,47,.13); }
.cxp-process-progress { background: rgba(251,246,238,.16); }
.cxp-carousel-progress span, .cxp-process-progress span { display: block; width: 8%; height: 100%; background: var(--cxp-accent); }
.cxp-process-progress span { background: var(--cxp-cream); }
.cxp-need-deck { position: relative; min-height: clamp(390px,52svh,540px); perspective: 1200px; }
.cxp-need-card { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--cxp-line); border-radius: var(--cxp-radius); padding: clamp(2rem,4.5vw,3.5rem); background: rgba(255,255,255,.9); box-shadow: var(--cxp-shadow); transform-origin: center; opacity: 0; }
.cxp-need-card.is-active { opacity: 1; }
.cxp-need-card span, .cxp-card__number { color: var(--cxp-accent); font-weight: 900; letter-spacing: .18em; }
.cxp-need-card h3, .cxp-card h3, .cxp-catalog-card h3 { margin: 1rem 0 0; font-family: 'DM Serif Display', Georgia, serif; font-size: clamp(2.65rem,4.6vw,4.9rem); font-weight: 400; line-height: .9; letter-spacing: -.06em; }
.cxp-need-card p, .cxp-card p, .cxp-catalog-card p, .cxp-surface p { max-width: 720px; color: var(--cxp-soft); line-height: 1.56; }
.cxp-horizontal { min-height: 100svh; overflow: hidden; background: var(--cxp-bg); }
.cxp-horizontal__pin { display: flex; height: 100svh; min-height: 720px; align-items: center; }
.cxp-progress { position: absolute; left: max(1.5rem, calc((100vw - 1600px) / 2)); top: 6.2rem; z-index: 3; display: flex; align-items: center; gap: 1rem; border: 1px solid var(--cxp-line); border-radius: 999px; padding: .8rem 1rem; background: rgba(251,246,238,.86); color: var(--cxp-accent); font-size: .72rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; backdrop-filter: blur(16px); }
.cxp-progress i { display: block; width: 7rem; height: .42rem; overflow: hidden; border-radius: 999px; background: rgba(47,47,47,.12); }
.cxp-progress b { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--cxp-accent); }
.cxp-horizontal-track { display: flex; width: max-content; height: 100%; align-items: center; gap: clamp(1rem,2vw,2rem); padding: 0 max(1.5rem, calc((100vw - 1600px) / 2)); will-change: transform; }
.cxp-moment-panel { position: relative; flex: 0 0 min(74vw,1080px); height: clamp(500px,72svh,760px); overflow: hidden; border-radius: var(--cxp-radius); background: var(--cxp-card); box-shadow: var(--cxp-shadow); }
.cxp-moment-panel--intro { display: flex; flex-direction: column; justify-content: center; padding: clamp(2rem,5vw,5rem); }
.cxp-moment-panel--intro p { max-width: 620px; margin-top: 1rem; color: var(--cxp-soft); font-size: 1.12rem; }
.cxp-moment-panel--image img { width: 100%; height: 100%; object-fit: cover; }
.cxp-moment-panel--image::after { position: absolute; inset: 0; content: ''; background: linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.76)); }
.cxp-moment-panel--image div { position: absolute; left: clamp(1.5rem,4vw,4rem); right: clamp(1.5rem,4vw,4rem); bottom: clamp(1.5rem,4vw,4rem); z-index: 2; color: #fff; text-shadow: 0 12px 36px rgba(0,0,0,.35); }
.cxp-moment-panel--image span { color: rgba(255,255,255,.82); font-weight: 900; letter-spacing: .2em; }
.cxp-moment-panel--image h3 { margin: .35rem 0 0; color: #fff; font-family: 'DM Serif Display', Georgia, serif; font-size: clamp(4rem,10vw,10rem); font-weight: 400; line-height: .8; letter-spacing: -.07em; }
.cxp-grid-3 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.cxp-card, .cxp-catalog-card { border: 1px solid var(--cxp-line); border-radius: 34px; background: rgba(255,255,255,.76); box-shadow: 0 18px 50px rgba(47,47,47,.08); }
.cxp-card { padding: 1.4rem; }
.cxp-catalog-card { overflow: hidden; padding: .85rem; }
.cxp-catalog-card img { width: 100%; aspect-ratio: 4 / 4.8; border-radius: 30px; object-fit: cover; }
.cxp-catalog-card h3, .cxp-catalog-card p { padding-inline: .85rem; }
.cxp-process-stage { position: relative; min-height: clamp(420px,55svh,610px); perspective: 1200px; }
.cxp-process-step { position: absolute; inset: 0; display: grid; grid-template-columns: clamp(76px,9vw,120px) minmax(0,1fr); gap: clamp(1.1rem,3vw,2rem); align-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: var(--cxp-radius); padding: clamp(2rem,4vw,3.5rem); background: rgba(255,255,255,.065); box-shadow: 0 24px 70px rgba(0,0,0,.2); opacity: 0; backdrop-filter: blur(16px); }
.cxp-process-step.is-active { opacity: 1; }
.cxp-process-step img { width: clamp(72px,8vw,100px); height: clamp(72px,8vw,100px); object-fit: contain; }
.cxp-process-step h3 { margin: .4rem 0 0; font-size: clamp(2.7rem,4.8vw,5.1rem); }
.cxp-loyalty { background: var(--cxp-band); }
.cxp-loyalty__grid { grid-template-columns: minmax(0,1fr) minmax(320px,.9fr); gap: 1.25rem; }
.cxp-loyalty__main, .cxp-loyalty__side { min-height: clamp(430px,50svh,540px); display: flex; flex-direction: column; justify-content: center; }
.cxp-loyalty__main .cxp-section-title, .cxp-loyalty__side .cxp-section-title { font-size: clamp(3rem,5.2vw,5.9rem); }
.cxp-perks { display: grid; gap: .7rem; margin-top: 1.4rem; }
.cxp-perks strong { display: block; border: 1px solid var(--cxp-line); border-radius: 999px; padding: .8rem 1rem; background: rgba(251,246,238,.65); }
.cxp-section-heading { max-width: 920px; margin-inline: auto; text-align: center; }
.cxp-section-heading--compact .cxp-section-title { font-size: clamp(3rem,5vw,5.8rem); }
.cxp-review-track { display: flex; gap: 1rem; margin-top: 2.4rem; overflow-x: auto; padding-bottom: 1rem; scrollbar-width: thin; }
.cxp-review-card { flex: 0 0 min(360px,82vw); }
.cxp-review-card h3 { margin: .8rem 0 0; font-family: 'DM Serif Display', Georgia, serif; font-size: 2rem; font-weight: 400; line-height: .95; }
.cxp-review-card small { display: block; margin-top: 1rem; color: rgba(47,47,47,.52); font-weight: 700; }
.cxp-review-form { max-width: 1180px; margin: 2rem auto 0; grid-template-columns: minmax(280px,.78fr) minmax(0,1fr); gap: clamp(1.5rem,4vw,4rem); padding: clamp(1.6rem,3.5vw,3rem); }
.cxp-review-form .cxp-section-title { font-size: clamp(2.8rem,4.8vw,5.4rem); }
.cxp-review-form form { display: grid; gap: .9rem; align-content: center; }
.cxp-review-form label { display: grid; gap: .4rem; color: var(--cxp-ink); font-weight: 800; }
.cxp-review-form input, .cxp-review-form textarea { width: 100%; border: 1px solid var(--cxp-line); border-radius: 22px; padding: .95rem 1rem; background: rgba(251,246,238,.78); color: var(--cxp-ink); outline: none; }
.cxp-review-form textarea { resize: vertical; }
.cxp-js [data-cxp-reveal] { opacity: 0; transform: translateY(40px); }
.cxp-js .cxp-line span { transform: translateY(112%); }
.cxp-js .cxp-preloader__logo { clip-path: inset(0 100% 0 0); }
.cxp-js .cxp-preloader__word { opacity: 0; }
@media (max-width: 980px) { body:has(.cxp-page), body:has(.cxp-page) * { cursor: auto !important; } .cxp-cursor-dot, .cxp-cursor-ring { display: none; } .cxp-hero__inner, .cxp-scroll-story__grid, .cxp-process-jack__grid, .cxp-needs-carousel__grid, .cxp-loyalty__grid, .cxp-review-form { grid-template-columns: 1fr; } .cxp-hero { padding-top: 7rem; } .cxp-hero h1 { font-size: clamp(4.1rem,18vw,7rem); } .cxp-hero__veil { background: linear-gradient(180deg, rgba(251,246,238,.94), rgba(251,246,238,.78) 58%, rgba(23,17,11,.28)); } .cxp-hero__objects { min-height: auto; display: grid; gap: 1rem; } .cxp-object--main, .cxp-object--float { position: static; width: 100%; } .cxp-scroll-story__pin, .cxp-needs-carousel__pin, .cxp-horizontal__pin, .cxp-process-jack__pin { height: auto; min-height: auto; } .cxp-scroll-story, .cxp-needs-carousel, .cxp-horizontal, .cxp-process-jack { min-height: auto; } .cxp-need-deck, .cxp-process-stage { display: grid; gap: 1rem; min-height: auto; } .cxp-need-card, .cxp-process-step { position: relative; inset: auto; opacity: 1; } .cxp-progress, .cxp-carousel-progress, .cxp-process-progress { display: none; } .cxp-horizontal__pin { height: auto; min-height: auto; } .cxp-horizontal-track { width: auto; height: auto; flex-direction: column; padding: 5rem 1.25rem; } .cxp-moment-panel { width: 100%; height: auto; min-height: 420px; flex: auto; } .cxp-grid-3 { grid-template-columns: 1fr; } .cxp-process-step { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .cxp-preloader { display: none !important; } .cxp-line span, [data-cxp-reveal] { opacity: 1 !important; transform: none !important; } }
