/* ============================================================
   PELART⁺  —  Ancient secrets · Modern science
   Palette: RED · WHITE · BLACK  (red gradients only)
   ============================================================ */

:root {
  /* ---- black / surfaces ---- */
  --ink:    #0a0708;   /* near-black, faint warm   */
  --ink-2:  #140b0c;
  --ink-3:  #1c1011;

  /* ---- reds ---- */
  --red:        #d6202a;
  --red-bright: #ef3b33;
  --red-2:      #a8161d;
  --red-deep:   #6c0e12;
  --red-soft:   #e87a72;  /* light red / coral tint */
  --red-glow:   #ff5147;

  /* ---- white / text ---- */
  --white:    #f7f3f0;
  --white-dim:#c8bcbb;   /* white softened toward grey */
  --muted:    #8d8281;
  --line:     #ffffff14;
  --line-red: #d6202a33;

  --serif:  'Cormorant Garamond', Georgia, serif;
  --sans:   'Jost', system-ui, sans-serif;
  --script: 'Pinyon Script', cursive;
  --cjk:    'Noto Serif SC', serif;

  --ease: cubic-bezier(.16, 1, .3, 1);
  --ease-soft: cubic-bezier(.4, 0, .1, 1);

  --pad: clamp(1.25rem, 5vw, 7rem);
  --maxw: 1380px;
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

body {
  background: var(--ink);
  color: var(--white);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.7;
  letter-spacing: .01em;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.is-loading { overflow: hidden; height: 100vh; }
body.menu-open { overflow: hidden; }

img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; color: inherit; cursor: pointer; background: none; border: none; }

/* atmosphere: red glows on black */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -3; pointer-events: none;
  background:
    radial-gradient(120% 90% at 82% -8%, #d6202a22 0%, transparent 45%),
    radial-gradient(90% 70% at 8% 105%, #6c0e1233 0%, transparent 50%),
    var(--ink);
}
/* film grain */
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 1000; opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}

/* ============================================================
   BRAND LOGO (signature recreation + optional image swap)
   ============================================================ */
.brand { display: inline-flex; align-items: center; line-height: 1; }
.brand__img { display: none; height: 40px; width: auto; }
.brand__img.show { display: block; }
.brand.has-img .brand__type { display: none; }

.brand__type { display: inline-flex; align-items: center; }
.brand__word {
  font-family: var(--script); font-size: 2.4rem; color: var(--white); line-height: .8;
  padding-right: .08em; text-shadow: 0 2px 14px #00000060;
}
.brand__plus { width: 1.4rem; height: 1.4rem; fill: var(--red); transform: translateY(-7px) rotate(5deg);
  filter: drop-shadow(0 0 8px #d6202a55); }

.brand--xl .brand__word { font-size: 4.6rem; }
.brand--xl .brand__plus { width: 2.6rem; height: 2.6rem; transform: translateY(-14px) rotate(5deg); }
.brand--xl .brand__img { height: 92px; }

/* ============================================================
   PRELOADER
   ============================================================ */
.preloader { position: fixed; inset: 0; z-index: 2000; background: var(--ink); display: grid; place-items: center;
  transition: opacity .8s var(--ease), visibility .8s; }
.preloader.done { opacity: 0; visibility: hidden; }
.preloader__inner { display: grid; justify-items: center; gap: 2rem; }
.preloader .brand { opacity: 0; transform: translateY(14px); animation: fadeUp .8s var(--ease) .2s forwards; }
.preloader .brand__word { animation: inkBleed 1.1s var(--ease) .3s both; }
.preloader .brand__plus { opacity: 0; animation: stampIn .5s var(--ease) 1s forwards; }
.preloader__bar { width: 180px; height: 1px; background: var(--line); overflow: hidden; }
.preloader__bar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--red-deep), var(--red), var(--red-soft));
  animation: load 1.8s var(--ease-soft) forwards; }
@keyframes inkBleed { from { opacity: 0; filter: blur(10px); letter-spacing: .1em; } to { opacity: 1; filter: blur(0); letter-spacing: 0; } }
@keyframes stampIn { 0% { opacity: 0; transform: translateY(-14px) scale(1.6) rotate(5deg); } 60% { opacity: 1; } 100% { opacity: 1; transform: translateY(-14px) scale(1) rotate(5deg); } }
@keyframes load { to { width: 100%; } }

/* ============================================================
   CUSTOM CURSOR
   ============================================================ */
.cursor { position: fixed; top: 0; left: 0; z-index: 1500; pointer-events: none; }
.cursor__dot { position: fixed; width: 6px; height: 6px; border-radius: 50%; background: var(--red-bright); transform: translate(-50%, -50%); }
.cursor__ring { position: fixed; width: 34px; height: 34px; border: 1px solid #ffffff70; border-radius: 50%; transform: translate(-50%, -50%);
  transition: width .3s var(--ease), height .3s var(--ease), opacity .3s, border-color .3s; }
.cursor.is-hover .cursor__ring { width: 56px; height: 56px; opacity: .8; border-color: var(--red); }
.cursor.is-down .cursor__ring { width: 26px; height: 26px; }
@media (hover: none), (pointer: coarse) { .cursor { display: none; } }

/* ============================================================
   PARTICLES
   ============================================================ */
.particles { position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .75; }

/* ============================================================
   HEADER
   ============================================================ */
.header { position: fixed; top: 0; left: 0; right: 0; z-index: 70; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 1rem var(--pad); border-bottom: 1px solid transparent;
  transition: background .4s var(--ease), padding .4s var(--ease), border-color .4s; }
.header > .brand { justify-self: start; }
.header .nav { justify-self: center; }
.header__tools { justify-self: end; }
.header.scrolled { top: 0; background: #07040466; backdrop-filter: blur(14px); border-bottom: 1px solid var(--line);
  padding-top: .7rem; padding-bottom: .7rem; }
.header .brand__word { font-size: 2.1rem; }
.header .brand__plus { width: 1.25rem; height: 1.25rem; }

.nav { display: flex; gap: 2.4rem; }
.nav a { font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; color: var(--white-dim); position: relative; padding: .4rem 0; transition: color .3s; }
.nav a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: var(--red); transition: width .35s var(--ease); }
.nav a:hover { color: var(--white); }
.nav a:hover::after { width: 100%; }

.header__tools { display: flex; align-items: center; gap: 1.1rem; }
.icon-btn { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; position: relative; transition: background .3s; }
.icon-btn svg { width: 19px; height: 19px; fill: none; stroke: var(--white-dim); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transition: stroke .3s; }
.icon-btn:hover { background: #ffffff0d; }
.icon-btn:hover svg { stroke: var(--red-soft); }
.cart-count { position: absolute; top: 2px; right: 2px; background: var(--red); color: #fff; font-size: .55rem; min-width: 15px; height: 15px;
  border-radius: 8px; display: grid; place-items: center; padding: 0 3px; }
.wish-count { position: absolute; top: 2px; right: 2px; background: var(--red); color: #fff; font-size: .55rem; min-width: 15px; height: 15px;
  border-radius: 8px; display: grid; place-items: center; padding: 0 3px; }
.wish-count.is-empty { display: none; }
.icon-btn--wish { position: relative; }
/* account icon — now links to My Account */
.icon-btn--account { position: relative; }

.lang { display: inline-flex; align-items: center; gap: .4rem; padding: .4rem .7rem; border: 1px solid #ffffff22; border-radius: 100px;
  font-size: .7rem; letter-spacing: .12em; transition: border-color .3s; }
.lang:hover { border-color: var(--red); }
.lang__opt { color: var(--white-dim); transition: color .3s; }
.lang__opt.is-active { color: var(--red-soft); font-weight: 500; }
.lang__sep { color: #ffffff33; }

.burger { display: none; width: 38px; height: 38px; flex-direction: column; gap: 5px; align-items: center; justify-content: center; }
.burger span { width: 22px; height: 1.5px; background: var(--white); transition: transform .35s var(--ease), opacity .25s; }
.burger.active span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); background: var(--red); }
.burger.active span:nth-child(2) { opacity: 0; }
.burger.active span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); background: var(--red); }

/* ============================================================
   MOBILE MENU
   ============================================================ */
.mobile-menu { position: fixed; inset: 0; z-index: 65; background: linear-gradient(160deg, #0c0708, #1a0c0d);
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 0 var(--pad); gap: .2rem;
  clip-path: circle(0% at 100% 0%); transition: clip-path .7s var(--ease); pointer-events: none; }
.mobile-menu.open { clip-path: circle(150% at 100% 0%); pointer-events: auto; }
.mobile-menu__char { position: absolute; right: -3%; bottom: -4%; font-family: var(--cjk); font-weight: 900; font-size: 48vw;
  color: #d6202a0c; line-height: 1; pointer-events: none; }
.mobile-menu nav { display: flex; flex-direction: column; gap: .4rem; z-index: 2; }
.mobile-menu nav a { font-family: var(--serif); font-size: clamp(2.2rem, 11vw, 4rem); line-height: 1.15; color: var(--white);
  position: relative; opacity: 0; transform: translateY(30px); transition: color .3s; }
.mobile-menu nav a::before { content: attr(data-i); font-family: var(--sans); font-size: .8rem; color: var(--red); vertical-align: super; margin-right: .6rem; letter-spacing: .1em; }
.mobile-menu.open nav a { animation: fadeUp .6s var(--ease) forwards; }
.mobile-menu.open nav a:nth-child(1) { animation-delay: .15s; }
.mobile-menu.open nav a:nth-child(2) { animation-delay: .22s; }
.mobile-menu.open nav a:nth-child(3) { animation-delay: .29s; }
.mobile-menu.open nav a:nth-child(4) { animation-delay: .36s; }
.mobile-menu.open nav a:nth-child(5) { animation-delay: .43s; }
.mobile-menu nav a:hover { color: var(--red-soft); }
.mobile-menu__foot { display: flex; gap: 1.6rem; margin-top: 2.5rem; z-index: 2; }
.mobile-menu__foot a { font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; color: var(--white-dim); }

/* ============================================================
   SHARED TYPE / SECTION HELPERS
   ============================================================ */
section { position: relative; padding: clamp(5rem, 12vh, 10rem) var(--pad); }
.section-head { max-width: 760px; margin-bottom: clamp(2.5rem, 6vw, 5rem); }
.section-head--center { margin-inline: auto; text-align: center; }
/* align the pillars/products headings to the same edge as the grid below them */
.pillars .section-head, .products .section-head { max-width: var(--maxw); margin-inline: auto; }
.pillars .section-title, .products .section-title { max-width: 760px; }
.section-kicker { display: inline-block; font-size: .74rem; letter-spacing: .32em; text-transform: uppercase; color: var(--red-soft); margin-bottom: 1.2rem; }
.section-kicker::before { content: ""; display: inline-block; width: 26px; height: 1px; background: var(--red); vertical-align: middle; margin-right: .8rem; }
.section-title { font-family: var(--serif); font-weight: 300; font-size: clamp(2.2rem, 5.5vw, 4.4rem); line-height: 1.08; letter-spacing: -.01em; }
.section-title em { font-style: italic; color: var(--red-soft); }
.section-intro { margin-top: 1.6rem; color: var(--white-dim); font-size: clamp(1rem, 1.6vw, 1.18rem); }
.section-intro em { font-style: italic; color: var(--white); }
.bg-char { position: absolute; font-family: var(--cjk); font-weight: 900; color: #ffffff06; line-height: 1; pointer-events: none; user-select: none; z-index: 0; }

/* brush divider */
.divider { padding: 0 var(--pad); }
.divider svg { width: 100%; max-width: var(--maxw); margin: 0 auto; height: 40px; }
.divider__stroke { fill: none; stroke: var(--red); stroke-width: 2; stroke-linecap: round; opacity: .5;
  stroke-dasharray: 1600; stroke-dashoffset: 1600; }
.divider.in .divider__stroke { animation: draw 2s var(--ease) forwards; }

/* ============================================================
   BUTTONS / LINKS
   ============================================================ */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; padding: 1.05rem 2.3rem; font-size: .76rem;
  letter-spacing: .22em; text-transform: uppercase; border-radius: 100px; position: relative; overflow: hidden; will-change: transform;
  transition: color .4s var(--ease), transform .3s, box-shadow .4s; }
.btn--red { background: linear-gradient(120deg, var(--red-deep), var(--red) 55%, var(--red-bright)); color: #fff; font-weight: 500;
  box-shadow: 0 8px 30px #d6202a33; }
.btn--red::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, var(--red), var(--red-soft)); opacity: 0; transition: opacity .4s var(--ease); z-index: -1; }
.btn--red:hover { box-shadow: 0 10px 40px #d6202a55; }
.btn--red:hover::before { opacity: 1; }
.btn--ghost { border: 1px solid #ffffff33; color: var(--white); }
.btn--ghost::before { content: ""; position: absolute; inset: 0; background: var(--red); transform: translateY(101%); transition: transform .45s var(--ease); z-index: -1; }
.btn--ghost:hover { color: #fff; border-color: var(--red); }
.btn--ghost:hover::before { transform: translateY(0); }
.btn--large { padding: 1.3rem 3rem; font-size: .82rem; }

.link-underline { display: inline-block; font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--red-soft);
  padding-bottom: 4px; position: relative; margin-top: 1.8rem; }
.link-underline::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--red);
  transform: scaleX(.4); transform-origin: left; transition: transform .4s var(--ease); }
.link-underline:hover::after { transform: scaleX(1); }

/* ============================================================
   REVEAL
   ============================================================ */
.reveal { opacity: 0; transform: translateY(38px); filter: blur(6px); transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); }
.reveal.in { opacity: 1; transform: none; filter: blur(0); }
@keyframes fadeUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }
@keyframes draw { to { stroke-dashoffset: 0; } }

/* ============================================================
   HERO SLIDESHOW
   ============================================================ */
.hero { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; }
.hero__slides { position: absolute; inset: 0; z-index: 0; }

.slide { position: absolute; inset: 0; display: flex; align-items: center; opacity: 0; visibility: hidden;
  transition: opacity 1.2s var(--ease), visibility 1.2s; }
.slide.is-active { opacity: 1; visibility: visible; }
.slide__art { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.slide__art .kenburns { position: absolute; inset: 0; transform: scale(1.04); }
.slide.is-active .kenburns { animation: kenburns 8s ease-out forwards; }
@keyframes kenburns { from { transform: scale(1.02) translate(0,0); } to { transform: scale(1.13) translate(-1.5%, -1%); } }
/* darken for legibility */
.slide__art::after { content: ""; position: absolute; inset: 0; z-index: 5;
  background: linear-gradient(90deg, #05030399 0%, #05030366 38%, transparent 72%),
              linear-gradient(0deg, #050303cc, transparent 45%); }

/* ---- caption ---- */
.slide__caption { position: relative; z-index: 6; max-width: var(--maxw); margin: 0 auto; width: 100%; padding: 0 var(--pad); }
.eyebrow { font-size: .76rem; letter-spacing: .3em; text-transform: uppercase; color: var(--red-soft); margin-bottom: 1.6rem;
  opacity: 0; transform: translateY(18px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.slide.is-active .eyebrow { opacity: 1; transform: none; transition-delay: .55s; }
.slide__title { font-family: var(--serif); font-weight: 300; font-size: clamp(2.8rem, 9vw, 7.2rem); line-height: .98; letter-spacing: -.02em; margin-bottom: 1.8rem; }
.slide__title .line { display: block; overflow: hidden; padding-bottom: .04em; }
.slide__title .word { display: inline-block; transform: translateY(110%); transition: transform 1s var(--ease); }
.slide__title .word.i { font-style: italic; color: var(--red-soft); }
.slide.is-active .slide__title .word { transform: translateY(0); }
.slide.is-active .slide__title .line:nth-child(1) .word { transition-delay: .15s; }
.slide.is-active .slide__title .line:nth-child(1) .word:nth-child(2) { transition-delay: .25s; }
.slide.is-active .slide__title .line:nth-child(2) .word { transition-delay: .37s; }
.slide.is-active .slide__title .line:nth-child(2) .word:nth-child(2) { transition-delay: .47s; }
.slide__lead { max-width: 520px; font-size: clamp(1rem, 1.7vw, 1.2rem); color: var(--white-dim);
  opacity: 0; transform: translateY(18px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.slide.is-active .slide__lead { opacity: 1; transform: none; transition-delay: .7s; }

/* ---- persistent overlay controls ---- */
.hero__actions { position: absolute; z-index: 7; left: 0; right: 0; bottom: 18%;
  margin-inline: auto; max-width: var(--maxw); padding: 0 var(--pad); display: flex; flex-wrap: wrap; gap: 1rem;
  opacity: 0; animation: fadeUp .8s var(--ease) 1.2s forwards; }
.hero__dots { position: absolute; z-index: 7; bottom: 6.5%; left: 50%; transform: translateX(-50%); display: flex; gap: .8rem; }
.dot { width: 30px; height: 3px; background: #ffffff33; border-radius: 4px; overflow: hidden; position: relative; transition: background .3s; }
.dot.is-active { background: #ffffff22; }
.dot.is-active::after { content: ""; position: absolute; inset: 0; width: 0; background: var(--red); animation: dotFill var(--slide-dur, 6s) linear forwards; }
.dot:hover { background: #ffffff55; }
@keyframes dotFill { to { width: 100%; } }
.hero__progress { position: absolute; z-index: 7; bottom: 0; left: 0; width: 100%; height: 3px; background: #ffffff10; }
.hero__progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--red-deep), var(--red), var(--red-soft)); }

.scroll-cue { position: absolute; z-index: 7; right: var(--pad); bottom: 6%; display: flex; flex-direction: column; align-items: center; gap: .7rem;
  font-size: .6rem; letter-spacing: .3em; text-transform: uppercase; color: var(--white-dim); }
.scroll-cue__line { width: 1px; height: 42px; background: linear-gradient(var(--red), transparent); position: relative; overflow: hidden; }
.scroll-cue__line::after { content: ""; position: absolute; top: -50%; left: 0; width: 100%; height: 50%; background: var(--red); animation: scrollDot 1.8s var(--ease-soft) infinite; }
@keyframes scrollDot { 0% { top: -50%; } 100% { top: 100%; } }

/* ---- SLIDE 1 illustration : moon + mountains ---- */
.moon { position: absolute; top: 13%; right: 13%; width: clamp(150px, 22vw, 320px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 50% 48%, #f0473e 0%, #d6202a 52%, #a8161d 78%, #7a1014 100%);
  box-shadow: 0 0 100px 30px #d6202a55, inset 0 0 60px #5a0c1055; animation: moonGlow 7s ease-in-out infinite alternate; }
.moon::after { content: ""; position: absolute; inset: 0; border-radius: 50%; mix-blend-mode: multiply;
  background: radial-gradient(circle at 50% 50%, transparent 56%, #6e0f1238 92%); }
@keyframes moonGlow { from { box-shadow: 0 0 70px 18px #d6202a33, inset -16px -16px 50px #4a0c0e66; } to { box-shadow: 0 0 130px 40px #d6202a55, inset -16px -16px 50px #4a0c0e66; } }
.mist { position: absolute; left: -10%; right: -10%; height: 50%; pointer-events: none; }
.mist--1 { bottom: 18%; background: radial-gradient(60% 90% at 30% 50%, #d6202a26 0%, transparent 70%); animation: drift 30s linear infinite; }
.mist--2 { bottom: 6%; background: radial-gradient(70% 90% at 70% 50%, #6c0e1233 0%, transparent 70%); animation: drift 44s linear infinite reverse; }
@keyframes drift { from { transform: translateX(-6%); } to { transform: translateX(6%); } }
.ink-layer { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 72%; }
.ink-layer--far path { fill: #2a0b0d; opacity: .7; }
.ink-layer--mid path { fill: #1a080a; opacity: .85; }
.ink-layer--near path { fill: #0a0405; }
.branch { position: absolute; top: 12%; left: 3%; width: clamp(200px, 27vw, 400px); opacity: .7; }
.branch__stroke { fill: none; stroke: #e8ddc8; stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 600; stroke-dashoffset: 600; }
.slide.is-active .branch__stroke { animation: draw 2.4s var(--ease) .8s forwards; }
.slide.is-active .branch__stroke--2 { animation-delay: 1.4s; }
.slide.is-active .branch__stroke--3 { animation-delay: 1.6s; }
.branch__bloom { fill: var(--red-bright); opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(0); filter: drop-shadow(0 0 5px #d6202aaa); }
.slide.is-active .branch__bloom { animation: bloomIn .5s var(--ease) 2.5s forwards; }
.slide.is-active .branch__bloom.bloom--s { animation-delay: 2.8s; }

/* ---- SLIDE 2 illustration : botanical ---- */
.bg-char--slide { font-size: clamp(16rem, 42vw, 40rem); right: 6%; top: 50%; transform: translateY(-50%); color: #d6202a0a; }
.botanic-scene { position: absolute; top: 50%; left: 73%; transform: translate(-50%, -50%); width: clamp(360px, 44vw, 620px); height: auto; }
.botanic-scene .vine { fill: none; stroke: var(--red); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 700; stroke-dashoffset: 700; }
.botanic-scene .leaf { fill: var(--red-2); opacity: 0; transform-box: fill-box; transform-origin: center bottom; transform: scale(0); }
.botanic-scene .bloom { fill: var(--red-bright); opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(0);
  filter: drop-shadow(0 0 10px #d6202a88); }
.slide.is-active .botanic-scene .vine { animation: draw 1.8s var(--ease) .4s forwards; }
.slide.is-active .botanic-scene .vine--2 { animation-delay: .8s; }
.slide.is-active .botanic-scene .vine--3 { animation-delay: 1s; }
.slide.is-active .botanic-scene .vine--4 { animation-delay: 1.2s; }
.slide.is-active .botanic-scene .vine--5 { animation-delay: 1.4s; }
.slide.is-active .botanic-scene .leaf { animation: leafIn .7s var(--ease) 1.5s forwards; }
.slide.is-active .botanic-scene .leaf:nth-child(7) { animation-delay: 1.7s; }
.slide.is-active .botanic-scene .leaf:nth-child(8) { animation-delay: 1.9s; }
.slide.is-active .botanic-scene .bloom { animation: bloomIn .6s var(--ease) 2s forwards; }
.slide.is-active .botanic-scene .bloom--s { animation-delay: 2.2s; }
@keyframes leafIn { from { opacity: 0; transform: scale(0); } to { opacity: .9; transform: scale(1); } }
@keyframes bloomIn { from { opacity: 0; transform: scale(0); } to { opacity: 1; transform: scale(1); } }

/* ---- SLIDE 3 illustration : silk + droplet ---- */
.rings { position: absolute; top: 50%; left: 64%; transform: translate(-50%, -50%); width: 0; height: 0; }
.rings span { position: absolute; top: 50%; left: 50%; border: 1px solid var(--red); border-radius: 50%; transform: translate(-50%, -50%); opacity: 0; }
.slide.is-active .rings span { animation: ring 4s var(--ease) infinite; }
.slide.is-active .rings span:nth-child(2) { animation-delay: 1.3s; }
.slide.is-active .rings span:nth-child(3) { animation-delay: 2.6s; }
@keyframes ring { 0% { width: 60px; height: 60px; opacity: .6; } 100% { width: 520px; height: 520px; opacity: 0; } }
.silk { position: absolute; inset: 0; width: 110%; height: 100%; }
.silk .ribbon { fill: none; stroke: var(--red); stroke-width: 2; opacity: .5; stroke-linecap: round; }
.silk .r1 { stroke: var(--red-soft); animation: flow 16s linear infinite; }
.silk .r2 { stroke: var(--red); opacity: .35; animation: flow 22s linear infinite reverse; }
.silk .r3 { stroke: var(--red-bright); opacity: .25; animation: flow 19s linear infinite; }
@keyframes flow { from { transform: translateX(0); } to { transform: translateX(-200px); } }
.droplet { position: absolute; top: 50%; left: 64%; transform: translate(-50%, -50%); width: clamp(200px, 26vw, 340px); }
.droplet__shape { fill: none; stroke: var(--red); stroke-width: 2.4; filter: drop-shadow(0 0 16px #d6202a66); stroke-dasharray: 1100; stroke-dashoffset: 1100; }
.droplet__shine { fill: none; stroke: var(--red-soft); stroke-width: 2.4; stroke-linecap: round; opacity: 0; }
.slide.is-active .droplet__shape { animation: draw 2s var(--ease) .5s forwards; }
.slide.is-active .droplet__shine { animation: fadeUp .6s var(--ease) 2.2s forwards; }

/* ============================================================
   PILLARS
   ============================================================ */
.pillars__grid { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.pillar { position: relative; padding: 2.6rem 2.2rem 3rem; border: 1px solid var(--line); border-radius: 2px;
  background: linear-gradient(160deg, #ffffff05, transparent); overflow: hidden; transition: border-color .5s, transform .6s var(--ease); }
.pillar::before { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 100% at 50% 0%, #d6202a1f, transparent 60%); opacity: 0; transition: opacity .6s; }
.pillar:hover { border-color: var(--line-red); transform: translateY(-6px); }
.pillar:hover::before { opacity: 1; }
.pillar__char { font-family: var(--cjk); font-weight: 600; font-size: 5rem; line-height: 1; color: var(--red-2); display: block; opacity: .9;
  transition: transform .6s var(--ease), color .5s; }
.pillar:hover .pillar__char { color: var(--red-bright); transform: scale(1.06) rotate(-2deg); }
.pillar__index { position: absolute; top: 2rem; right: 2rem; font-size: .72rem; letter-spacing: .2em; color: var(--red-soft); }
.pillar h3 { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; margin: 1.6rem 0 .9rem; }
.pillar p { color: var(--white-dim); font-size: .98rem; }
.pillar__line { display: block; width: 38px; height: 1px; background: var(--red); margin-top: 1.8rem; transition: width .6s var(--ease); }
.pillar:hover .pillar__line { width: 80px; }

/* ============================================================
   PHILOSOPHY
   ============================================================ */
.philosophy { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(2rem, 6vw, 6rem); max-width: var(--maxw); margin-inline: auto; }
.philosophy__art { position: relative; display: grid; place-items: center; min-height: 420px; }
.bg-char--yy { font-size: clamp(12rem, 30vw, 26rem); writing-mode: vertical-rl; right: 4%; top: 50%; transform: translateY(-50%); color: #d6202a08; }
.yinyang { width: clamp(220px, 32vw, 360px); position: relative; z-index: 2; filter: drop-shadow(0 20px 60px #00000080); }
.yy-spin { transform-origin: 100px 100px; animation: spin 36s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.yy-dark { fill: #120708; }
.yy-light { fill: var(--red); }
.yy-ring { fill: none; stroke: var(--red-soft); stroke-width: 1.5; opacity: .6; }
.yinyang::after { content: ""; position: absolute; inset: -12%; border-radius: 50%; z-index: -1; background: radial-gradient(circle, #d6202a40, transparent 65%); animation: pulse 5s ease-in-out infinite; }
@keyframes pulse { 0%,100% { transform: scale(1); opacity: .7; } 50% { transform: scale(1.08); opacity: 1; } }
.philosophy__text p { color: var(--white-dim); margin-top: 1.4rem; font-size: 1.05rem; }
.philosophy__text p strong { color: var(--red-soft); font-weight: 500; }
.philosophy__text p em { font-style: italic; color: var(--white); }
.philosophy .section-title { margin-top: .4rem; }

/* ============================================================
   SCIENCE
   ============================================================ */
.science { background: linear-gradient(180deg, transparent, #1a080a55, transparent); }
.stats { max-width: var(--maxw); margin: 0 auto clamp(3rem, 7vw, 6rem); display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.stat { background: var(--ink); padding: 2.4rem 1.4rem; text-align: center; }
.stat__num { display: block; font-family: var(--serif); font-weight: 400; font-size: clamp(2.6rem, 5vw, 4rem); color: var(--red-soft); line-height: 1; letter-spacing: -.02em; }
.stat__label { display: block; margin-top: .9rem; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--white-dim); }
.synergy { max-width: 980px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(1rem, 4vw, 3rem); }
.botanical { text-align: center; }
.botanical__art { width: clamp(120px, 16vw, 180px); margin: 0 auto 1.4rem; }
.leaf-svg path, .leaf-svg circle { fill: none; }
.leaf-svg .grow, .leaf-svg .root { stroke: var(--red); stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 300; stroke-dashoffset: 300; }
.leaf-svg .bloom { fill: var(--red-bright); opacity: 0; transform-box: fill-box; transform-origin: center; filter: drop-shadow(0 0 8px #d6202a66); }
.in .leaf-svg .grow { animation: grow 1.6s var(--ease) forwards; }
.in .leaf-svg .grow--2 { animation-delay: .3s; }
.in .leaf-svg .grow--3 { animation-delay: .5s; }
.in .leaf-svg .grow--4 { animation-delay: .7s; }
.in .leaf-svg .root { animation: grow 1.8s var(--ease) .3s forwards; }
.in .leaf-svg .bloom { animation: bloomIn .6s var(--ease) 1.2s forwards; }
.in .leaf-svg .bloom--s { animation-delay: 1.4s; }
@keyframes grow { to { stroke-dashoffset: 0; } }
.botanical h3 { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; }
.botanical__cn { display: block; font-family: var(--cjk); color: var(--red-soft); margin: .2rem 0 1rem; letter-spacing: .2em; }
.botanical p { color: var(--white-dim); font-size: .95rem; max-width: 320px; margin-inline: auto; }
.synergy__plus { display: grid; place-items: center; width: 56px; height: 56px; border: 1px solid var(--red); border-radius: 50%; position: relative; }
.synergy__plus span { position: absolute; background: var(--red); }
.synergy__plus span:first-child { width: 18px; height: 1.5px; }
.synergy__plus span:last-child { width: 1.5px; height: 18px; }

/* ============================================================
   PRODUCTS
   ============================================================ */
.products__grid { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; }
.product { position: relative; border: 1px solid var(--line); border-radius: 3px; padding: 1.4rem; overflow: hidden;
  background: linear-gradient(180deg, #ffffff05, transparent); transition: border-color .5s, transform .4s var(--ease); transform-style: preserve-3d; will-change: transform; }
.product:hover { border-color: var(--line-red); }
.product__tag { position: absolute; top: 1rem; left: 1rem; z-index: 4; font-size: .62rem; letter-spacing: .18em; text-transform: uppercase;
  padding: .35rem .7rem; border: 1px solid var(--red); color: var(--red-soft); border-radius: 100px; }
.product__media { aspect-ratio: 3/4; border-radius: 2px; display: grid; place-items: center; overflow: hidden; position: relative;
  background: radial-gradient(120% 100% at 50% 0%, #2a0b0d, #0a0405); perspective: 1100px; }
.product__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: radial-gradient(60% 45% at 46% 112%, #d6202a3a, transparent 70%); }
/* ---- perfume box (3D / volumetric) ---- */
.box { position: relative; width: 42%; height: 84%; transform-style: preserve-3d;
  transform: rotateX(5deg) rotateY(-21deg); --d: clamp(16px, 2vw, 30px); transition: transform .7s var(--ease); }
.product:hover .box { transform: rotateX(4deg) rotateY(-15deg) translateY(-8px); }
/* right side wall */
.box::before { content: ""; position: absolute; top: 0; right: 0; width: var(--d); height: 100%;
  background: linear-gradient(180deg, #190b0c, #050303); border-left: 1px solid #00000099;
  transform-origin: right center; transform: rotateY(-90deg); }
/* top lid */
.box::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: var(--d);
  background: linear-gradient(90deg, #24110f, #0c0606); border-bottom: 1px solid #0000007a;
  transform-origin: center top; transform: rotateX(-90deg); }
.box__face { position: absolute; inset: 0; border-radius: 2px;
  background: linear-gradient(105deg, #20100f 0%, #0e0708 55%, #050303 100%);
  border: 1px solid #ffffff12; box-shadow: inset 0 1px 0 #ffffff10, inset 0 0 40px #00000099, 0 30px 55px -12px #000000cc;
  display: flex; flex-direction: column; padding: 9% 8%; overflow: hidden; }
/* red sheen on the box */
.box__face::before { content: ""; position: absolute; top: 0; left: -40%; width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, #ffffff0e, transparent); transform: skewX(-18deg); transition: left .8s var(--ease); }
.product:hover .box__face::before { left: 130%; }

.box__logo { display: inline-flex; align-items: center; align-self: flex-end; line-height: 1; }
.box__logo-word { font-family: var(--script); color: var(--white); font-size: clamp(.8rem, 1.6vw, 1.15rem); }
.box__plus { width: .7rem; height: .7rem; fill: var(--red); transform: translateY(-5px) rotate(5deg); }

.box__cjk { position: absolute; top: 13%; left: 9%; writing-mode: vertical-rl; font-family: var(--cjk); font-weight: 600;
  color: var(--red); font-size: clamp(.85rem, 1.8vw, 1.3rem); letter-spacing: .14em; text-shadow: 0 0 10px #d6202a66; }

.box__art { flex: 1; display: grid; place-items: center; padding: 12% 0 6%; }
.box__art .art-svg { width: 78%; max-height: 100%; filter: drop-shadow(0 0 6px #d6202a55); }
.art-svg .ln path, .art-svg .ln circle { fill: none; stroke: var(--red); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.art-svg .ln .dot { fill: var(--red); stroke: none; }
.art-svg .ln path { stroke-dasharray: 600; stroke-dashoffset: 600; }
.product.in .art-svg .ln path { animation: draw 2.4s var(--ease) .15s forwards; }
.art-svg .ln .dot { opacity: 0; }
.product.in .art-svg .ln .dot { animation: bloomIn .5s var(--ease) 1.4s forwards; }

.box__bottom { margin-top: auto; }
.box__edp { display: block; font-size: clamp(5px, .9vw, 7px); letter-spacing: .28em; text-transform: uppercase; color: var(--white-dim); text-align: center; margin-bottom: 5%; }
.box__meta { display: flex; justify-content: space-between; align-items: flex-end; gap: 6%; }
.box__meta > span { font-size: clamp(4px, .8vw, 6px); letter-spacing: .06em; color: var(--white-dim); white-space: nowrap; }
.box__barcode { width: 38%; height: 12px; background:
  repeating-linear-gradient(90deg, #0a0506 0 1px, transparent 1px 2px, #0a0506 2px 4px, transparent 4px 5px),
  linear-gradient(#cfc7c4, #9a9290); border-radius: 1px; }
.product__info { padding: 1.3rem .2rem .4rem; }
.product__info h3 { font-family: var(--serif); font-weight: 400; font-size: 1.35rem; }
.product__info p { color: var(--white-dim); font-size: .85rem; margin: .3rem 0 .8rem; }
.product__price { color: var(--red-soft); font-size: 1.05rem; letter-spacing: .04em; }
.product__add { width: 100%; margin-top: 1.1rem; padding: .85rem; border: 1px solid #ffffff22; border-radius: 100px; font-size: .7rem;
  letter-spacing: .2em; text-transform: uppercase; color: var(--white); transition: background .4s var(--ease), color .4s, border-color .4s; }
.product__add:hover { background: var(--red); color: #fff; border-color: var(--red); }
.products__cta { text-align: center; margin-top: clamp(2.5rem, 5vw, 4rem); }

/* ============================================================
   LEGACY
   ============================================================ */
.legacy { overflow: hidden; }
.bg-char--legacy { font-size: clamp(14rem, 40vw, 40rem); top: 50%; left: 50%; transform: translate(-50%, -50%); writing-mode: vertical-rl; color: #d6202a06; }
.legacy__inner { position: relative; z-index: 2; max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.legacy__text p { color: var(--white-dim); margin-top: 1.4rem; font-size: 1.05rem; }
.legacy__text p em { font-style: italic; color: var(--red-soft); }
.legacy__list { list-style: none; display: grid; gap: 1.6rem; }
.legacy__list li { display: flex; gap: 1.3rem; align-items: flex-start; padding-bottom: 1.6rem; border-bottom: 1px solid var(--line); }
.legacy__cn { font-family: var(--cjk); font-weight: 600; font-size: 2.4rem; color: var(--red-2); line-height: 1; flex-shrink: 0; width: 52px; text-align: center; }
.legacy__list h4 { font-family: var(--serif); font-weight: 500; font-size: 1.3rem; margin-bottom: .3rem; }
.legacy__list p { color: var(--white-dim); font-size: .94rem; margin: 0; }
.legacy__list em { font-style: italic; color: var(--white); }

/* ============================================================
   QUOTE
   ============================================================ */
.quote { text-align: center; max-width: 1000px; margin-inline: auto; }
.quote__mark { font-family: var(--serif); font-size: 12rem; line-height: .6; color: var(--red); opacity: .3; height: 5rem; }
.quote blockquote { font-family: var(--serif); font-weight: 300; font-style: italic; font-size: clamp(1.5rem, 3.6vw, 2.8rem); line-height: 1.35; }
.quote__sign { margin-top: 2rem; font-size: .78rem; letter-spacing: .24em; text-transform: uppercase; color: var(--red-soft); }

/* ============================================================
   CTA
   ============================================================ */
.cta { text-align: center; }
.cta__seal { width: 110px; margin: 0 auto 2rem; }
.cta__seal svg { fill: none; }
.cta-ring { stroke: var(--red); stroke-width: 1.5; stroke-dasharray: 6 8; opacity: .7; transform-origin: 60px 60px; animation: spin 40s linear infinite; }
.cta__seal text { font-family: var(--cjk); font-weight: 900; font-size: 46px; fill: var(--red-bright); }
.cta h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(2.4rem, 6vw, 4.6rem); line-height: 1.05; }
.cta p { color: var(--white-dim); max-width: 480px; margin: 1.4rem auto 2.6rem; font-size: 1.1rem; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer { background: linear-gradient(180deg, transparent, #07040460); border-top: 1px solid var(--line); padding: clamp(3.5rem, 7vw, 6rem) var(--pad) 2rem; }
.footer__top { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: 1.4fr 2.6fr; gap: clamp(2rem, 6vw, 5rem); }
.footer__brand { display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; }
.footer__brand .brand__word { font-size: 2.6rem; }
.footer__brand p { color: var(--white-dim); font-size: .92rem; max-width: 300px; }
.footer__cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.footer__col h5 { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--red-soft); margin-bottom: 1.2rem; }
.footer__col a { display: block; color: var(--white-dim); font-size: .9rem; padding: .35rem 0; transition: color .3s, padding-left .3s; }
.footer__col a:hover { color: var(--white); padding-left: .4rem; }
.footer__col--news p { color: var(--white-dim); font-size: .9rem; margin-bottom: 1rem; }
.newsletter { display: flex; border-bottom: 1px solid #ffffff33; }
.newsletter input { flex: 1; background: none; border: none; outline: none; color: var(--white); padding: .6rem 0; font-family: inherit; font-size: .9rem; }
.newsletter input::placeholder { color: var(--muted); }
.newsletter button { color: var(--red-soft); font-size: 1.3rem; padding: 0 .4rem; transition: transform .3s; }
.newsletter button:hover { transform: translateX(4px); }
.footer__bottom { max-width: var(--maxw); margin: clamp(2.5rem, 5vw, 4rem) auto 0; padding-top: 1.6rem; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: .76rem; letter-spacing: .08em; color: var(--white-dim); }
.footer__social { display: flex; gap: 1.4rem; }
.footer__social a { transition: color .3s; }
.footer__social a:hover { color: var(--red-soft); }
.footer__legal { display: inline-flex; align-items: center; gap: 1.3rem; flex-wrap: wrap; }
.footer__legal a { color: var(--white-dim); transition: color .3s; }
.footer__legal a:hover { color: var(--red-soft); }

/* ============================================================
   CATALOG PAGE
   ============================================================ */
.catalog-hero { position: relative; padding: clamp(8rem, 18vh, 12rem) var(--pad) clamp(2.5rem, 6vw, 4.5rem); text-align: center; overflow: hidden; }
.catalog-hero__inner { position: relative; z-index: 2; max-width: 760px; margin: 0 auto; }
.catalog-hero .section-title { margin-top: .6rem; }
.catalog-hero .section-intro { margin-inline: auto; }
.catalog-hero .bg-char--legacy { color: #d6202a07; }

.back-link { display: inline-block; font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; color: var(--white-dim); margin-bottom: 1.4rem; transition: color .3s; }
.back-link:hover { color: var(--red-soft); }

/* ---- category grid ---- */
.catalog-section { padding-top: 0; }
.cat-grid { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: clamp(180px, 21vw, 290px); gap: 14px; }
.cat:nth-child(1) { grid-column: span 3; grid-row: span 2; }
.cat:nth-child(2) { grid-column: span 3; }
.cat:nth-child(3) { grid-column: span 3; }
.cat:nth-child(4) { grid-column: span 3; }
.cat:nth-child(5) { grid-column: span 3; }

.cat { position: relative; overflow: hidden; border-radius: 3px; border: 1px solid var(--line);
  display: flex; align-items: flex-end; isolation: isolate; background: linear-gradient(150deg, #2a0d0f, #0a0506 70%); }
.cat__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0;
  filter: grayscale(.25) brightness(.6) contrast(1.05); transition: transform 1s var(--ease), filter .6s var(--ease); }
.cat::before { content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(0deg, #050303f2 2%, #05030366 38%, transparent 72%), linear-gradient(120deg, #6c0e1255, transparent 55%); }
.cat::after { content: ""; position: absolute; inset: 0; z-index: 1; opacity: 0;
  background: radial-gradient(120% 80% at 50% 120%, #d6202a55, transparent 60%); transition: opacity .6s; }
.cat:hover .cat__img { transform: scale(1.07); filter: grayscale(0) brightness(.82) contrast(1.05); }
.cat:hover::after { opacity: 1; }

.cat__cjk { position: absolute; top: clamp(.4rem, 1.5vw, 1rem); right: clamp(.8rem, 2vw, 1.6rem); z-index: 2;
  font-family: var(--cjk); font-weight: 900; font-size: clamp(3rem, 7vw, 6rem); line-height: 1; color: #ffffff12;
  pointer-events: none; transition: color .5s; }
.cat:hover .cat__cjk { color: #d6202a3a; }
.cat__index { position: absolute; top: clamp(.9rem, 2vw, 1.6rem); left: clamp(.9rem, 2vw, 1.6rem); z-index: 3;
  font-size: .72rem; letter-spacing: .2em; color: var(--red-soft); }
.cat__body { position: relative; z-index: 3; width: 100%; padding: clamp(1.1rem, 2.2vw, 2.2rem); }
.cat__title { font-family: var(--serif); font-weight: 400; font-size: clamp(1.5rem, 2.6vw, 2.5rem); line-height: 1.05; }
.cat:nth-child(1) .cat__title { font-size: clamp(1.9rem, 3.4vw, 3.4rem); }
.cat__title::after { content: ""; display: block; width: 30px; height: 2px; background: var(--red); margin-top: .7rem; transition: width .5s var(--ease); }
.cat:hover .cat__title::after { width: 72px; }
.cat__go { display: inline-block; margin-top: .9rem; font-size: .72rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--white); opacity: 0; transform: translateX(-8px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.cat:hover .cat__go { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .cat-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: clamp(200px, 38vw, 300px); }
  .cat:nth-child(1) { grid-column: span 2; grid-row: span 1; }
  .cat:nth-child(n+2) { grid-column: span 1; grid-row: span 1; }
}
@media (max-width: 560px) {
  .cat-grid { grid-template-columns: 1fr; grid-auto-rows: clamp(220px, 56vw, 320px); }
  .cat:nth-child(1) { grid-column: span 1; }
}
@media (hover: none) {
  .cat__go { opacity: 1; transform: none; }
  .cat__img { filter: grayscale(.1) brightness(.74) contrast(1.05); }
}

/* ============================================================
   CATALOG: FILTERS + PRODUCT GRID
   ============================================================ */
.art-svg { color: var(--red); }

.catalog-layout { position: relative; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--pad) clamp(4rem,8vw,7rem);
  display: grid; grid-template-columns: 248px 1fr; gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }

/* ---- sidebar ---- */
.filters { position: sticky; top: 86px; align-self: start; border: 1px solid var(--line); border-radius: 4px;
  background: linear-gradient(180deg, #ffffff06, transparent); padding: 1.1rem 1.3rem 1.4rem; max-height: calc(100vh - 104px); overflow-y: auto; }
.filters__head { display: flex; align-items: center; justify-content: space-between; }
.filters__head h2 { font-family: var(--serif); font-weight: 400; font-size: 1.45rem; }
.filters__close { display: none; font-size: 1.3rem; color: var(--white-dim); width: 34px; height: 34px; }

.filter-group { border-top: 1px solid var(--line); padding: 1rem 0; }
.filter-group__head { width: 100%; display: flex; align-items: center; justify-content: space-between;
  font-family: var(--serif); font-weight: 500; font-size: 1.15rem; color: var(--white); }
.filter-group__head svg { width: 15px; height: 15px; fill: none; stroke: var(--white-dim); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .35s var(--ease); }
.filter-group.collapsed .filter-group__head svg { transform: rotate(-180deg); }
.filter-group__body { display: grid; gap: .55rem; padding-top: .95rem; }
.filter-group.collapsed .filter-group__body { display: none; }

.opt { display: flex; align-items: center; gap: .65rem; font-size: .92rem; color: var(--white-dim); cursor: pointer; transition: color .2s; }
.opt:hover { color: var(--white); }
.opt input { appearance: auto; accent-color: var(--red); width: 16px; height: 16px; cursor: pointer; flex: 0 0 auto; }

.clear-filters { width: 100%; margin-top: 1.3rem; padding: .85rem; border: 1px solid #ffffff2e; border-radius: 100px;
  font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: var(--white); transition: border-color .3s, color .3s; }
.clear-filters:hover { border-color: var(--red); color: var(--red-soft); }

.filters-backdrop { display: none; }

/* ---- main / bar ---- */
.catalog-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.6rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.results-count { font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--white-dim); }
.filters-toggle { display: none; align-items: center; gap: .55rem; padding: .6rem 1.1rem; border: 1px solid #ffffff2e; border-radius: 100px;
  font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--white); }
.filters-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }

.catalog-main .products__grid { grid-template-columns: repeat(3, 1fr); max-width: none; margin: 0; }
.catalog-main .product { transition: opacity .42s var(--ease), transform .42s var(--ease), border-color .5s; }
.catalog-main .product.is-hidden { opacity: 0; transform: scale(.93); pointer-events: none; }

.product__rating { display: inline-block; font-size: .82rem; letter-spacing: .04em; color: var(--red-soft); margin-bottom: .35rem; }
.product__actions { display: flex; gap: .6rem; margin-top: 1.1rem; }
.product__actions .product__add { flex: 1; margin-top: 0; }
.product__wish { flex: 0 0 46px; width: 46px; display: grid; place-items: center; border: 1px solid #ffffff22; border-radius: 100px; transition: background .3s, border-color .3s; }
.product__wish svg { width: 18px; height: 18px; fill: none; stroke: var(--white-dim); stroke-width: 1.6; transition: stroke .3s, fill .3s; }
.product__wish:hover { border-color: var(--red); }
.product__wish:hover svg { stroke: var(--red-soft); }
.product__wish.is-saved { background: var(--red); border-color: var(--red); }
.product__wish.is-saved svg { fill: #fff; stroke: #fff; }

.no-results { text-align: center; padding: 4rem 1rem; color: var(--white-dim); font-family: var(--serif); font-style: italic; font-size: 1.5rem; }

/* ---- custom scrollbar for the filter panel (muted) ---- */
.filters { scrollbar-width: thin; scrollbar-color: #5e1418 transparent; }
.filters::-webkit-scrollbar { width: 5px; }
.filters::-webkit-scrollbar-track { background: transparent; margin: 4px 0; }
.filters::-webkit-scrollbar-thumb { background: #5e1418; border-radius: 10px; }
.filters::-webkit-scrollbar-thumb:hover { background: #7e1c22; }

/* ---- catalog bar + sort dropdown ---- */
.catalog-bar { grid-column: 1 / -1; flex-wrap: wrap; gap: .8rem 1rem; margin-bottom: 0; }
.catalog-bar__left { display: flex; align-items: center; gap: 1rem; }
.sort { position: relative; }
.sort__btn { display: inline-flex; align-items: center; gap: .55rem; padding: .6rem 1.1rem; border: 1px solid #ffffff2e; border-radius: 100px;
  font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--white); transition: border-color .3s; }
.sort__btn:hover { border-color: var(--red); }
.sort__cap { color: var(--white-dim); }
#sortCurrent { color: var(--red-soft); }
.sort__btn svg { width: 13px; height: 13px; fill: none; stroke: var(--white-dim); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s; }
.sort.open .sort__btn svg { transform: rotate(180deg); }
.sort__menu { position: absolute; top: calc(100% + 8px); right: 0; min-width: 230px; z-index: 30;
  background: linear-gradient(180deg, #1b0d0e, #0c0708); border: 1px solid var(--line); border-radius: 6px; padding: .9rem 1.1rem;
  display: grid; gap: .6rem; box-shadow: 0 24px 50px #000a;
  opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s; }
.sort.open .sort__menu { opacity: 1; visibility: visible; transform: none; }

/* ---- equal-height product cards (buttons aligned) ---- */
.product { display: flex; flex-direction: column; }
.product__media { flex-shrink: 0; }
.product__info { display: flex; flex-direction: column; flex: 1 1 auto; }
.product__price { margin-top: auto; padding-top: .5rem; }

@media (max-width: 1100px) {
  .catalog-layout { grid-template-columns: 220px 1fr; }
  .catalog-main .products__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .catalog-layout { grid-template-columns: 1fr; }
  .filters { position: fixed; top: 0; left: 0; bottom: 0; width: 300px; max-width: 86vw; max-height: none; z-index: 95;
    border: none; border-right: 1px solid var(--line); border-radius: 0; background: linear-gradient(180deg, #140b0c, #0a0506);
    transform: translateX(-100%); transition: transform .4s var(--ease); padding-top: 1.4rem; }
  .filters.open { transform: none; }
  .filters__close { display: grid; place-items: center; }
  .filters-backdrop { display: block; position: fixed; inset: 0; z-index: 94; background: #000a; opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; }
  .filters-backdrop.open { opacity: 1; visibility: visible; }
  .filters-toggle { display: inline-flex; }
  body.filters-open { overflow: hidden; }
}
@media (max-width: 560px) {
  .catalog-main .products__grid { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }
}

/* clickable product card hints (link to PDP) */
.product__media.is-clickable { cursor: pointer; }
.product__info h3.is-clickable { cursor: pointer; transition: color .3s; }
.product__info h3.is-clickable:hover { color: var(--red-soft); }

/* ============================================================
   PRODUCT DETAIL PAGE (PDP)
   ============================================================ */
.pdp { max-width: var(--maxw); margin: 0 auto; padding: clamp(7rem, 12vh, 9.5rem) var(--pad) clamp(4rem, 8vw, 7rem); }
.pdp .back-link { margin-bottom: 1.6rem; }
.pdp__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }

.pdp__gallery { position: sticky; top: 92px; }
.pdp__main { aspect-ratio: 1; border-radius: 6px; position: relative; overflow: hidden; display: grid; place-items: center;
  border: 1px solid var(--line); background: radial-gradient(120% 100% at 50% 0%, #2a0b0d, #0a0405); perspective: 1200px; }
.pdp__main::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(52% 38% at 50% 116%, #d6202a3a, transparent 70%); }
.pdp__main .box { width: 40%; height: 80%; }
.pdp__thumbs { display: flex; gap: .7rem; margin-top: .9rem; }
.thumb { width: 72px; height: 88px; border: 1px solid var(--line); border-radius: 4px; overflow: hidden; display: grid; place-items: center;
  background: radial-gradient(120% 100% at 50% 0%, #1c0c0d, #0a0506); color: var(--red); transition: border-color .3s, transform .3s; }
.thumb svg { width: 52%; filter: drop-shadow(0 0 5px #d6202a55); }
.thumb:hover { transform: translateY(-2px); }
.thumb.is-active { border-color: var(--red); }

.pdp__eyebrow { display: inline-block; font-size: .74rem; letter-spacing: .26em; text-transform: uppercase; color: var(--red-soft); margin-bottom: 1rem; }
.pdp__title { font-family: var(--serif); font-weight: 400; font-size: clamp(2.4rem, 5vw, 3.8rem); line-height: 1.04; color: var(--red-soft); letter-spacing: .01em; }
.pdp__price { font-family: var(--serif); font-size: clamp(1.7rem, 3vw, 2.5rem); color: var(--white); margin: .6rem 0 1.5rem; }
.pdp__desc { color: var(--white-dim); font-size: 1.05rem; max-width: 48ch; }

.pdp__buy { display: flex; align-items: stretch; gap: 1rem; margin: 2.2rem 0 1.3rem; flex-wrap: wrap; }
.qty { display: flex; align-items: center; border: 1px solid #ffffff2e; border-radius: 100px; overflow: hidden; }
.qty__btn { width: 46px; height: 54px; font-size: 1.2rem; color: var(--white); transition: background .3s, color .3s; }
.qty__btn:hover { background: #ffffff0d; color: var(--red-soft); }
.qty__val { width: 44px; height: 54px; text-align: center; background: none; border: none; color: var(--white); font-family: inherit; font-size: 1rem; }
.pdp__add { flex: 1; min-width: 210px; }

.pdp__wish { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--white-dim); transition: color .3s; }
.pdp__wish svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; transition: fill .3s, stroke .3s; }
.pdp__wish:hover { color: var(--red-soft); }
.pdp__wish.is-saved { color: var(--red-soft); }
.pdp__wish.is-saved svg { fill: var(--red); stroke: var(--red); }

.pdp__meta { list-style: none; margin-top: 2rem; display: grid; gap: .55rem; font-size: .86rem; letter-spacing: .06em; color: var(--white-dim); }
.pdp__meta span { color: #ffffff55; text-transform: uppercase; letter-spacing: .16em; margin-right: .45rem; font-size: .76rem; }
.pdp__meta a { color: var(--red-soft); }

.pdp__tabs { margin-top: clamp(3rem, 6vw, 5rem); }
.tabs__head { display: flex; gap: 2.2rem; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.tab { font-family: var(--serif); font-style: italic; font-size: 1.25rem; color: var(--white-dim); padding-bottom: 1rem; position: relative; transition: color .3s; }
.tab.is-active { color: var(--white); }
.tab::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 0; height: 2px; background: var(--red); transition: width .35s var(--ease); }
.tab.is-active::after { width: 100%; }
.tabs__panels { padding-top: 1.8rem; }
.tab-panel { display: none; color: var(--white-dim); max-width: 72ch; line-height: 1.85; }
.tab-panel.is-active { display: block; animation: fadeUp .5s var(--ease); }
.tab-panel p + p { margin-top: 1rem; }
.info-table { width: 100%; max-width: 540px; border-collapse: collapse; }
.info-table td { padding: .75rem 0; border-bottom: 1px solid var(--line); font-size: .96rem; color: var(--white); }
.info-table td:first-child { color: #ffffff66; text-transform: uppercase; letter-spacing: .12em; font-size: .76rem; width: 42%; }
/* WooCommerce "Additional information" table → mirror .info-table */
.pdp__tabs .woocommerce-product-attributes,
.pdp__tabs .shop_attributes { width: 100%; max-width: 540px; border-collapse: collapse; margin: 0; }
.pdp__tabs .shop_attributes th,
.pdp__tabs .shop_attributes td { padding: .75rem 0; border-bottom: 1px solid var(--line); font-size: .96rem; color: var(--white); text-align: left; vertical-align: top; }
.pdp__tabs .shop_attributes th { width: 42%; color: #ffffff66; text-transform: uppercase; letter-spacing: .12em; font-size: .76rem; font-weight: 500; }
.pdp__tabs .shop_attributes td p { margin: 0; }
.reviews__summary { display: flex; align-items: center; gap: .8rem; margin-bottom: 1.4rem; }
.reviews__avg { font-family: var(--serif); font-size: 2.2rem; color: var(--white); }
.reviews__count { font-size: .82rem; color: var(--white-dim); }
.review { padding: 1.2rem 0; border-bottom: 1px solid var(--line); }
.review__stars { color: var(--red-soft); letter-spacing: .12em; }
.review__name { font-family: var(--serif); font-style: italic; color: var(--white); margin: .35rem 0; }
.review p:last-child { color: var(--white-dim); }

@media (max-width: 860px) {
  .pdp__grid { grid-template-columns: 1fr; }
  .pdp__gallery { position: static; max-width: 460px; }
}
@media (max-width: 460px) {
  .pdp__add { min-width: 0; width: 100%; }
  .pdp__buy { flex-direction: column; align-items: stretch; }
  .qty { align-self: flex-start; }
}

/* ============================================================
   PRODUCT LINES — series grid + popup
   ============================================================ */
.lines-section { padding-top: 0; }
.lines-grid { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lines-grid .line { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border: 1px solid var(--line); border-radius: 3px;
  display: flex; align-items: flex-end; text-align: left; isolation: isolate; background: #160c0d; cursor: pointer; }
.line__bg { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover;
  filter: grayscale(.12) brightness(.62) contrast(1.03); transition: transform 1s var(--ease), filter .6s var(--ease); }
.line:hover .line__bg { filter: grayscale(0) brightness(.82); }
.lines-grid .line::after { content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(0deg, #050303f2 3%, #05030355 40%, transparent 72%), linear-gradient(120deg, #6c0e1240, transparent 55%); }
.line__cjk { position: absolute; top: .4rem; right: 1rem; z-index: 2; font-family: var(--cjk); font-weight: 900;
  font-size: clamp(2.6rem, 5vw, 4.4rem); color: #ffffff12; transition: color .5s; pointer-events: none; }
.line:hover .line__cjk { color: #d6202a40; }
.line__index { position: absolute; top: 1.1rem; left: 1.2rem; z-index: 3; font-size: .7rem; letter-spacing: .2em; color: var(--red-soft); }
.line__body { position: relative; z-index: 3; width: 100%; padding: clamp(1rem, 2vw, 1.8rem); }
.line__title { font-family: var(--serif); font-weight: 400; font-size: clamp(1.4rem, 2.2vw, 2rem); line-height: 1.1; color: var(--white); }
.line__title::after { content: ""; display: block; width: 28px; height: 2px; background: var(--red); margin-top: .6rem; transition: width .5s var(--ease); }
.line:hover .line__title::after { width: 64px; }
.line__go { display: inline-block; margin-top: .7rem; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--white);
  opacity: 0; transform: translateX(-8px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.line:hover .line__go { opacity: 1; transform: none; }

/* popup */
.line-modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; }
.line-modal.open { opacity: 1; visibility: visible; }
.line-modal__overlay { position: absolute; inset: 0; background: #040303e8; backdrop-filter: blur(7px); }
.line-modal__dialog { position: relative; z-index: 2; width: min(1160px, 94vw); max-height: 92vh; overflow: auto;
  background: linear-gradient(180deg, #0e0809, #060405); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 40px 110px #000;
  transform: translateY(24px) scale(.985); transition: transform .5s var(--ease); }
.line-modal.open .line-modal__dialog { transform: none; }
.line-modal__close { position: absolute; top: 1rem; right: 1.1rem; z-index: 5; width: 44px; height: 44px; display: grid; place-items: center;
  font-size: 1.2rem; color: var(--white); border: 1px solid #ffffff22; border-radius: 50%; transition: border-color .3s, color .3s, transform .4s; }
.line-modal__close:hover { border-color: var(--red); color: var(--red-soft); transform: rotate(90deg); }
.line-modal__panel { display: none; }
.line-modal__panel.is-active { display: grid; grid-template-columns: 1.05fr 1fr; }
.line-modal__img { background: radial-gradient(80% 70% at 50% 40%, #1a0c0d, #050303); display: grid; place-items: center; padding: clamp(1.5rem, 3vw, 3rem); }
.line-modal__img img { width: 100%; max-height: 78vh; object-fit: contain; filter: drop-shadow(0 24px 60px #d6202a3a); }
.line-modal__content { padding: clamp(2rem, 4vw, 3.6rem); align-self: center; }
.line-modal__cjk { font-family: var(--cjk); font-weight: 600; color: var(--red); font-size: 2rem; line-height: 1; }
.line-modal__title { font-family: var(--serif); font-weight: 400; font-size: clamp(2rem, 4vw, 3rem); color: var(--red-soft); margin: .4rem 0 1.8rem; line-height: 1.05; }
.line-modal__text p { margin-bottom: 1.3rem; }
.line-modal__text strong { display: block; font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--white); margin-bottom: .35rem; }
.line-modal__text span { color: var(--white-dim); line-height: 1.8; }
.line-modal__cta { margin-top: .6rem; width: 100%; }
body.modal-open { overflow: hidden; }

/* Desktop: hero + all nine tiles share ONE screen — the grid takes whatever
   height the hero leaves and splits it into three equal rows, and its width is
   tied to the viewport height so the tiles stay compact instead of stretching.
   Short windows fall back to the normal scrolling flow. */
@media (min-width: 901px) and (min-height: 620px) {
  .lines-page { min-height: 100svh; display: flex; flex-direction: column; }
  .lines-page .catalog-hero { flex: none; padding-top: clamp(5rem, 11vh, 6.5rem); padding-bottom: clamp(1rem, 2.4vh, 2rem); }
  .lines-page .catalog-hero__inner { max-width: 640px; }
  .lines-page .section-title { font-size: clamp(2rem, 4vw, 3.2rem); }
  .lines-page .section-intro { margin-top: 1rem; font-size: clamp(.92rem, 1.15vw, 1rem); }
  /* align-items must STRETCH, not center: a flex child's `height:100%` has no
     definite parent height to resolve against, so the rows would collapse to
     the height of their own text. Stretching gives the grid a real height. */
  .lines-page .lines-section { flex: 1 1 auto; min-height: 0; display: flex; align-items: stretch; padding-bottom: clamp(1rem, 3vh, 2.6rem); }
  .lines-page .lines-grid { width: 100%; max-width: min(var(--maxw), calc(100svh * .95));
    grid-template-rows: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 1.1vh, 14px); }
  .lines-page .lines-grid .line { aspect-ratio: auto; min-height: 0; }
  .lines-page .line__cjk { top: .2rem; right: .8rem; font-size: clamp(1.9rem, 8vh, 3.4rem); }
  .lines-page .line__index { top: .8rem; left: .9rem; font-size: .62rem; }
  .lines-page .line__body { padding: clamp(.7rem, 1.6vh, 1.2rem); }
  .lines-page .line__title { font-size: clamp(1rem, 2.1vh, 1.5rem); }
  .lines-page .line__title::after { margin-top: .45rem; }
  .lines-page .line__go { margin-top: .5rem; font-size: .62rem; }
}
@media (max-width: 900px) { .lines-grid { grid-template-columns: repeat(2, 1fr); } }
/* Phones: ONE full-width tile per row (user call 2026-08-08 — no orphan panda row).
   4:3 (not the poster's native 5:4) + a slimmer hero keep tile TWO peeking above the
   fold even with Safari's bars — otherwise the page reads as "just one line" (UX call). */
@media (max-width: 700px) {
  .catalog-hero { padding-top: 5rem; padding-bottom: 1.2rem; }
  .lines-grid { grid-template-columns: 1fr; }
  .lines-grid .line { aspect-ratio: 4 / 3; }
}
@media (max-width: 760px) {
  .line-modal__panel.is-active { grid-template-columns: 1fr; }
  .line-modal__img { max-height: 40vh; }
  .line-modal__img img { max-height: 36vh; }
}
/* Phones keep TWO tiles per row (never one) — just tighter chrome. */
@media (max-width: 560px) {
  .lines-grid { gap: 9px; }
  .line__cjk { font-size: clamp(1.9rem, 9vw, 2.8rem); top: .2rem; right: .7rem; }
  .line__index { top: .7rem; left: .8rem; font-size: .6rem; }
  .line__body { padding: .8rem .85rem; }
  .line__title { font-size: clamp(.95rem, 4.2vw, 1.25rem); }
  .line__go { opacity: 1; transform: none; font-size: .6rem; letter-spacing: .14em; }
}
@media (hover: none) {
  .line__go { opacity: 1; transform: none; }
  .line__bg { filter: grayscale(.05) brightness(.72) contrast(1.03); }
}

/* ============================================================
   B2B PAGE
   ============================================================ */
.b2b-hero { position: relative; min-height: 76vh; display: flex; align-items: center; overflow: hidden;
  padding: clamp(8rem, 16vh, 11rem) var(--pad) clamp(3.5rem, 7vw, 6rem); }
.b2b-hero__inner { position: relative; z-index: 2; width: 100%; max-width: var(--maxw); margin-inline: auto; }
.b2b-hero__lead { } /* lead keeps its own max-width below */
.b2b-hero__title { font-family: var(--serif); font-weight: 300; font-size: clamp(3rem, 8vw, 6rem); line-height: 1; letter-spacing: -.02em; margin: .4rem 0 1.4rem; }
.b2b-hero__title em { font-style: italic; color: var(--red-soft); }
.b2b-hero__lead { max-width: 640px; color: var(--white-dim); font-size: clamp(1.05rem, 1.8vw, 1.25rem); }
.b2b-hero__cta { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 2.2rem; }

.b2b-stats-section { padding: 0 var(--pad) clamp(3rem, 6vw, 5rem); }
.b2b-stats { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.b2b-stat { background: var(--ink); padding: clamp(1.6rem, 3vw, 2.6rem) 1rem; text-align: center; }
.b2b-stat__num { display: block; font-family: var(--serif); font-size: clamp(2.6rem, 5vw, 4.2rem); color: var(--red-soft); line-height: 1; letter-spacing: -.02em; }
.b2b-stat__label { display: block; margin-top: .7rem; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--white-dim); }

.b2b-cards { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.b2b-card { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 3px; padding: 2.2rem 1.8rem;
  background: linear-gradient(160deg, #ffffff05, transparent); transition: border-color .5s, transform .6s var(--ease); }
.b2b-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 100% at 50% 0%, #d6202a1c, transparent 60%); opacity: 0; transition: opacity .6s; }
.b2b-card:hover { border-color: var(--line-red); transform: translateY(-6px); }
.b2b-card:hover::before { opacity: 1; }
.b2b-card .ico { width: 46px; height: 46px; margin-bottom: 1.3rem; position: relative; z-index: 1; }
.b2b-card .ico * { fill: none; stroke: var(--red); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: stroke .4s; stroke-dasharray: 400; stroke-dashoffset: 400; }
.b2b-card.in .ico * { animation: draw 1.5s var(--ease) .15s forwards; }
.b2b-card:hover .ico * { stroke: var(--red-bright); }
.b2b-card h3 { font-family: var(--serif); font-weight: 400; font-size: 1.4rem; margin-bottom: .55rem; position: relative; z-index: 1; }
.b2b-card p { color: var(--white-dim); font-size: .96rem; position: relative; z-index: 1; }

.b2b-market { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.b2b-market__text p { color: var(--white-dim); margin-top: 1.2rem; max-width: 46ch; font-size: 1.05rem; }
.b2b-market__figs { display: flex; align-items: center; gap: 2.5rem; margin-top: 2.4rem; flex-wrap: wrap; }
.fig__num { display: block; font-family: var(--serif); font-size: clamp(2.4rem, 4vw, 3.4rem); color: var(--white); line-height: 1; }
.fig__label { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--white-dim); }
.donut-wrap { position: relative; width: 130px; height: 130px; }
.donut { width: 130px; height: 130px; }
.donut__track { fill: none; stroke: #ffffff14; stroke-width: 12; }
.donut__val { fill: none; stroke: var(--red); stroke-width: 12; stroke-linecap: round; transform: rotate(-90deg); transform-origin: center;
  stroke-dasharray: 515; stroke-dashoffset: 515; filter: drop-shadow(0 0 6px #d6202a66); }
.donut.in .donut__val { animation: donut 1.8s var(--ease) .2s forwards; }
@keyframes donut { to { stroke-dashoffset: 21; } }
.donut__center { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; }
.donut__num { font-family: var(--serif); font-size: 1.7rem; color: var(--red-soft); line-height: 1; }
.donut__cap { font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: var(--white-dim); }

.chart { width: 100%; height: auto; }
.chart__grid { stroke: #ffffff10; stroke-width: 1; }
.chart__area { fill: #d6202a22; opacity: 0; }
.chart.in .chart__area { animation: fadeArea 1.1s var(--ease) .9s forwards; }
@keyframes fadeArea { to { opacity: 1; } }
.chart__line { fill: none; stroke: var(--red); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 6px #d6202a66); stroke-dasharray: 1300; stroke-dashoffset: 1300; }
.chart.in .chart__line { animation: draw 1.9s var(--ease) forwards; }
.chart__dots circle { fill: var(--red-bright); opacity: 0; transform-box: fill-box; transform-origin: center; }
.chart.in .chart__dots circle { animation: dotPop .4s var(--ease) forwards; }
.chart.in .chart__dots circle:nth-child(1) { animation-delay: .5s; }
.chart.in .chart__dots circle:nth-child(2) { animation-delay: .7s; }
.chart.in .chart__dots circle:nth-child(3) { animation-delay: .9s; }
.chart.in .chart__dots circle:nth-child(4) { animation-delay: 1.1s; }
.chart.in .chart__dots circle:nth-child(5) { animation-delay: 1.3s; }
.chart.in .chart__dots circle:nth-child(6) { animation-delay: 1.5s; }
.chart.in .chart__dots circle:nth-child(7) { animation-delay: 1.7s; }
@keyframes dotPop { from { opacity: 0; transform: scale(0); } to { opacity: 1; transform: scale(1); } }
.chart__years { display: flex; justify-content: space-between; margin-top: .6rem; padding: 0 1.5%; font-size: .64rem; letter-spacing: .08em; color: var(--white-dim); }

.b2b-partners { padding: clamp(3rem, 6vw, 5rem) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow: hidden; }
.b2b-partners__cap { text-align: center; font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--white-dim); margin-bottom: 2rem; padding: 0 var(--pad); }
.marquee { overflow: hidden; }
.marquee--rev { margin-top: 1rem; }
.marquee__track { display: inline-flex; gap: 2.2rem; align-items: center; white-space: nowrap; font-family: var(--serif); font-size: clamp(1.4rem, 3vw, 2.4rem);
  animation: marqueeX 34s linear infinite; will-change: transform; }
.marquee--rev .marquee__track { animation-direction: reverse; animation-duration: 40s; }
.marquee__track span { color: #ffffff33; }
.marquee__track span:nth-child(even) { color: var(--red-soft); opacity: .6; }
@keyframes marqueeX { to { transform: translateX(-50%); } }

.steps { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; position: relative; }
.steps__line { position: absolute; top: 27px; left: 9%; right: 9%; height: 2px; background: linear-gradient(90deg, var(--red-deep), var(--red), var(--red-soft)); transform: scaleX(0); transform-origin: left; }
.steps.in .steps__line { animation: growX 1.6s var(--ease) .2s forwards; }
@keyframes growX { to { transform: scaleX(1); } }
.step { text-align: center; }
.step__num { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; border: 1px solid var(--red); background: var(--ink); color: var(--red-soft); font-family: var(--serif); font-size: 1.2rem; position: relative; z-index: 2; }
.step h4 { font-family: var(--serif); font-weight: 500; font-size: 1.3rem; margin: 1.1rem 0 .5rem; }
.step p { color: var(--white-dim); font-size: .92rem; max-width: 24ch; margin: 0 auto; }

.tiers { max-width: 1080px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; align-items: stretch; }
.tier { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 5px; padding: 2.4rem 2rem; background: linear-gradient(180deg, #ffffff05, transparent); transition: transform .5s var(--ease), border-color .5s; }
.tier:hover { transform: translateY(-6px); border-color: var(--line-red); }
.tier--featured { border-color: #d6202a66; background: linear-gradient(180deg, #d6202a12, transparent); }
.tier__badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--red); color: #fff; font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; padding: .35rem .85rem; border-radius: 100px; white-space: nowrap; }
.tier__name { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; }
.tier__price { font-family: var(--serif); font-size: 1.9rem; color: var(--white); margin: .5rem 0 1.4rem; }
.tier__price span { font-size: .78rem; color: var(--white-dim); font-family: var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.tier__price small { display: block; font-size: .64rem; color: var(--white-dim); font-family: var(--sans); letter-spacing: .12em; text-transform: uppercase; margin-top: .2rem; }
.tier ul { list-style: none; display: grid; gap: .7rem; margin-bottom: 1.8rem; }
.tier li { color: var(--white-dim); font-size: .94rem; padding-left: 1.5rem; position: relative; }
.tier li::before { content: "✦"; position: absolute; left: 0; top: .15rem; color: var(--red-soft); font-size: .7rem; }
.tier .btn { width: 100%; margin-top: auto; }

.quotes { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.quote-card { border: 1px solid var(--line); border-radius: 4px; padding: 2rem; background: linear-gradient(160deg, #ffffff05, transparent); }
.quote-card__stars { color: var(--red-soft); letter-spacing: .1em; margin-bottom: 1rem; }
.quote-card blockquote { font-family: var(--serif); font-style: italic; font-size: 1.2rem; line-height: 1.5; color: var(--white); }
.quote-card figcaption { margin-top: 1.2rem; font-size: .82rem; letter-spacing: .05em; color: var(--white-dim); }
.quote-card figcaption span { color: var(--red-soft); }

.b2b-contact__inner { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.b2b-contact__intro p { color: var(--white-dim); margin-top: 1.2rem; max-width: 40ch; }
.b2b-contact__meta { list-style: none; margin-top: 2rem; display: grid; gap: .6rem; font-size: .95rem; color: var(--white); }
.b2b-contact__meta span { color: #ffffff55; text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; margin-right: .5rem; }
.b2b-form { position: relative; }
.b2b-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.field { display: flex; flex-direction: column; gap: .4rem; }
.field--full { grid-column: 1 / -1; }
.field span { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--white-dim); }
.field input, .field select, .field textarea { background: #ffffff08; border: 1px solid var(--line); border-radius: 4px; padding: .85rem 1rem; color: var(--white); font-family: inherit; font-size: .95rem; transition: border-color .3s, background .3s; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--red); background: #ffffff0d; }
.field textarea { resize: vertical; }
.field select option { background: #140b0c; }
.b2b-form > .btn { margin-top: 1.6rem; }
.b2b-form__success { display: none; text-align: center; padding: 2.5rem 1rem; }
.b2b-form.sent .b2b-form__grid, .b2b-form.sent > .btn { display: none; }
.b2b-form.sent .b2b-form__success { display: block; animation: fadeUp .6s var(--ease); }
.b2b-form__check { display: inline-grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--red); color: #fff; font-size: 1.6rem; margin-bottom: 1rem; }
.b2b-form__success p { color: var(--white); font-family: var(--serif); font-style: italic; font-size: 1.3rem; }
/* honeypot: present in the DOM, off-screen, empty for humans (see inc/forms.php) */
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.form-error { color: var(--red-soft); font-size: .85rem; margin-top: 1rem; opacity: 0; transition: opacity .3s; }
.form-error.show { opacity: 1; }
.b2b-form.sent .form-error { display: none; }

@media (max-width: 980px) {
  .b2b-cards { grid-template-columns: repeat(2, 1fr); }
  .b2b-market { grid-template-columns: 1fr; }
  .quotes { grid-template-columns: 1fr; max-width: 560px; }
  .b2b-contact__inner { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .b2b-stats { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); gap: 2.4rem 1.5rem; }
  .steps__line { display: none; }
  .tiers { grid-template-columns: 1fr; max-width: 420px; }
}
@media (max-width: 560px) {
  .b2b-cards { grid-template-columns: 1fr; }
  .b2b-form__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-main { padding-top: 0; }
.contact-main__inner { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.contact-h { font-family: var(--serif); font-weight: 400; font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: 1.4rem; }
.contact-aside { display: grid; gap: 1.6rem; }
.contact-hq { position: relative; border: 1px solid #d6202a44; border-radius: 6px; padding: 2rem; background: linear-gradient(160deg, #d6202a12, transparent); }
.contact-hq__badge { display: inline-block; background: var(--red); color: #fff; font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; padding: .35rem .8rem; border-radius: 100px; margin-bottom: .9rem; }
.contact-hq .contact-h { margin-bottom: 1rem; }
.contact-lines { list-style: none; display: grid; gap: .9rem; }
.contact-lines li { display: flex; gap: .8rem; align-items: flex-start; color: var(--white-dim); font-size: .95rem; line-height: 1.5; }
.contact-lines svg { width: 19px; height: 19px; flex-shrink: 0; margin-top: 1px; fill: none; stroke: var(--red-soft); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.contact-lines a { color: var(--white); transition: color .3s; }
.contact-lines a:hover { color: var(--red-soft); }
.contact-sub { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--red-soft); margin-bottom: 1rem; }
.quick { display: grid; gap: .2rem; }
.quick a { display: flex; justify-content: space-between; gap: 1rem; align-items: center; color: var(--white); font-size: .92rem; padding: .65rem 0; border-bottom: 1px solid var(--line); transition: color .3s; }
.quick a span { color: var(--white-dim); text-transform: uppercase; letter-spacing: .12em; font-size: .7rem; }
.quick a:hover { color: var(--red-soft); }
.socials { display: flex; gap: .7rem; flex-wrap: wrap; }
.social { width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; transition: border-color .3s, transform .3s; }
.social svg { width: 20px; height: 20px; fill: none; stroke: var(--white-dim); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: stroke .3s; }
.social:hover { border-color: var(--red); transform: translateY(-3px); }
.social:hover svg { stroke: var(--red-soft); }

.offices { max-width: var(--maxw); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.office { position: relative; border: 1px solid var(--line); border-radius: 5px; padding: 1.8rem; background: linear-gradient(160deg, #ffffff05, transparent); transition: transform .5s var(--ease), border-color .5s; }
.office:hover { transform: translateY(-5px); border-color: var(--line-red); }
.office--hq { border-color: #d6202a55; background: linear-gradient(160deg, #d6202a12, transparent); }
.office__tag { display: inline-block; font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--red-soft); border: 1px solid var(--red); padding: .25rem .7rem; border-radius: 100px; margin-bottom: .9rem; }
.office__city { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; margin-bottom: .6rem; }
.office p { color: var(--white-dim); font-size: .92rem; margin: .15rem 0; }
.office a { display: block; color: var(--white); font-size: .92rem; margin: .15rem 0; transition: color .3s; }
.office a:hover { color: var(--red-soft); }
.office__hours { color: var(--muted) !important; font-size: .84rem !important; margin-top: .7rem !important; }

@media (max-width: 980px) {
  .contact-main__inner { grid-template-columns: 1fr; }
  .offices { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .offices { grid-template-columns: 1fr; }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .nav { display: none; }
  .burger { display: flex; }
  .header { display: flex; justify-content: space-between; }
  .brand { flex: none; }
  .pillars__grid { grid-template-columns: 1fr; max-width: 520px; }
  .products__grid { grid-template-columns: repeat(2, 1fr); }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1fr; }
  .hero__actions { bottom: 16%; }
}

@media (max-width: 760px) {
  :root { --pad: 1.25rem; }
  .header__tools { gap: .5rem; }
  .lang { padding: .35rem .6rem; }
  .header__tools .icon-btn:not(.icon-btn--cart):not(.icon-btn--account) { display: none; }
  .slide { align-items: flex-start; }
  .slide__caption { padding-top: clamp(6.5rem, 22vh, 11rem); }
  .philosophy { grid-template-columns: 1fr; }
  .philosophy__art { min-height: 300px; order: -1; }
  .legacy__inner { grid-template-columns: 1fr; }
  .synergy { grid-template-columns: 1fr; gap: 2.5rem; }
  .synergy__plus { margin: 0 auto; }
  .footer__cols { grid-template-columns: repeat(2, 1fr); gap: 1.6rem 1.2rem; }
  .footer__bottom { flex-direction: column; text-align: center; }
  .slide__title { font-size: clamp(2.6rem, 13vw, 4rem); margin-bottom: 1.1rem; }
  .slide__art::after { background: linear-gradient(0deg, #050303e6, #05030366 55%, #05030399); }
  .botanic-scene { left: 50%; opacity: .5; }
  .droplet, .rings { left: 50%; }
  .scroll-cue { display: none; }
  .hero__actions { bottom: 11%; }
  .hero__dots { bottom: 4%; }
}

@media (max-width: 460px) {
  .products__grid { grid-template-columns: 1fr; max-width: 360px; margin-inline: auto; }
  .stats { grid-template-columns: 1fr 1fr; }
  .footer__cols { grid-template-columns: 1fr; }
  .btn { width: 100%; }
  .hero__actions { flex-direction: column; }
}

/* ============================================================
   WordPress / WooCommerce surfaces — Cart / Checkout / My Account
   Dark-theme overrides, scoped to .woo-page (page.php adds this class).
   No effect on the static site (no matching markup there).
   ============================================================ */
.woo-page { color: var(--white-dim); }
.woo-page a:not(.button):not(.wc-block-components-button) { color: var(--red-soft); }
.woo-page h1, .woo-page h2, .woo-page h3,
.woo-page .wc-block-components-title { color: var(--white); font-family: var(--serif); }

/* --- Tables: cart items + order summary --- */
.woo-page table.shop_table,
.woo-page .wc-block-cart-items,
.woo-page .wc-block-components-totals-wrapper { border-color: var(--line); }
.woo-page th, .woo-page td { border-color: var(--line) !important; color: var(--white-dim); }
.woo-page .wc-block-cart-items__header th,
.woo-page table.shop_table thead th {
  color: #ffffff66; text-transform: uppercase; letter-spacing: .12em;
  font-size: .76rem; font-weight: 500; border-bottom: 1px solid var(--line);
}
.woo-page .wc-block-cart-item__product .wc-block-components-product-name,
.woo-page .wc-block-components-product-name,
.woo-page td.product-name a { color: var(--white) !important; font-family: var(--serif); font-size: 1.06rem; }
.woo-page .wc-block-cart-item__prices,
.woo-page .wc-block-components-product-price,
.woo-page .product-price, .woo-page .product-subtotal { color: var(--white); }
.woo-page .wc-block-components-product-metadata,
.woo-page .wc-block-cart-item__product-metadata { color: var(--white-dim); }

/* product thumbnail in cart/checkout = our branded tile */
.woo-page .wc-block-cart-item__image img,
.woo-page td.product-thumbnail img,
.woo-page .wc-block-components-order-summary-item__image img {
  border-radius: 10px; border: 1px solid var(--line-red); background: var(--ink-2);
}

/* --- Totals card --- */
.woo-page .wc-block-components-totals-item__label,
.woo-page .wc-block-components-totals-item__value,
.woo-page .cart_totals th, .woo-page .cart_totals td { color: var(--white); }
.woo-page .wp-block-woocommerce-cart-order-summary-block,
.woo-page .cart-collaterals .cart_totals {
  border: 1px solid var(--line); border-radius: 16px; padding: 1.4rem 1.6rem;
  background: linear-gradient(160deg, rgba(214,32,42,.05), transparent);
}
.woo-page .wc-block-components-totals-footer-item,
.woo-page .order-total .amount { color: var(--white); }

/* --- Inputs / selects / textareas --- */
.woo-page input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),
.woo-page select, .woo-page textarea,
.woo-page .wc-block-components-text-input input,
.woo-page .select2-selection {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid var(--line) !important;
  color: var(--white) !important;
  border-radius: 8px !important;
}
.woo-page input:focus, .woo-page select:focus, .woo-page textarea:focus,
.woo-page .wc-block-components-text-input.is-active input { border-color: var(--red) !important; outline: none; box-shadow: none; }
.woo-page label, .woo-page .wc-block-components-text-input label,
.woo-page .wc-block-components-checkbox__label { color: var(--white-dim) !important; }
.woo-page ::placeholder { color: #ffffff55; }
.woo-page .wc-block-components-text-input input:focus + label,
.woo-page .wc-block-components-text-input.is-active label { color: var(--red-soft) !important; }

/* --- Buttons → brand red --- */
.woo-page .button,
.woo-page button.wc-block-components-button,
.woo-page .wc-block-components-button.contained,
.woo-page .wc-block-cart__submit-button,
.woo-page .checkout-button,
.woo-page a.checkout-button,
.woo-page #place_order {
  background: linear-gradient(135deg, var(--red-bright), var(--red-2)) !important;
  color: #fff !important; border: none !important; border-radius: 999px !important;
  font-family: var(--sans); letter-spacing: .04em; box-shadow: 0 10px 30px -12px var(--red-2);
}
.woo-page .button:hover,
.woo-page button.wc-block-components-button:hover,
.woo-page .wc-block-cart__submit-button:hover,
.woo-page #place_order:hover { filter: brightness(1.08); }
.woo-page .wc-block-components-button.outlined,
.woo-page a.button.wc-backward {
  background: transparent !important; border: 1px solid var(--line-red) !important;
  color: var(--white) !important; border-radius: 999px !important;
}

/* --- Quantity stepper --- */
.woo-page .wc-block-components-quantity-selector,
.woo-page .quantity { border: 1px solid var(--line); border-radius: 999px; background: transparent; overflow: hidden; }
.woo-page .wc-block-components-quantity-selector__input,
.woo-page .wc-block-components-quantity-selector__button,
.woo-page .quantity input.qty { color: var(--white) !important; background: transparent !important; border: none !important; }

/* --- Coupons / panels --- */
.woo-page .wc-block-components-panel,
.woo-page .wc-block-components-totals-coupon { border-color: var(--line) !important; }
.woo-page .wc-block-components-panel__button { color: var(--white) !important; }

/* --- Notices --- */
.woo-page .wc-block-components-notice-banner,
.woo-page .woocommerce-message,
.woo-page .woocommerce-info,
.woo-page .woocommerce-error {
  background: rgba(214,32,42,.08); border: 1px solid var(--line-red);
  color: var(--white); border-radius: 10px;
}
.woo-page .wc-block-components-notice-banner a,
.woo-page .woocommerce-message a { color: var(--red-soft); }
/* recolor the WooCommerce notice icon (was blue/green) to brand red */
.woo-page .woocommerce-message::before,
.woo-page .woocommerce-info::before,
.woo-page .woocommerce-error::before,
.woo-page .woocommerce-noreviews::before,
.woo-page .woocommerce-Message::before,
.woo-page .cart-empty::before { color: var(--red) !important; }
.woo-page .wc-block-components-notice-banner__icon,
.woo-page .wc-block-components-notice-banner svg { fill: var(--red) !important; color: var(--red) !important; }

/* --- My Account --- */
.woo-page .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.woo-page .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--line); }
.woo-page .woocommerce-MyAccount-navigation li:last-child { border-bottom: none; }
.woo-page .woocommerce-MyAccount-navigation li a { display: block; padding: .9rem 1.2rem; color: var(--white-dim); }
.woo-page .woocommerce-MyAccount-navigation li.is-active a,
.woo-page .woocommerce-MyAccount-navigation li a:hover { background: rgba(214,32,42,.08); color: var(--white); }
.woo-page .woocommerce-MyAccount-content { color: var(--white-dim); }
@media (min-width: 768px) {
  .woo-page .woocommerce-account .woocommerce { display: grid; grid-template-columns: 240px 1fr; gap: 2.5rem; align-items: start; }
}

/* --- Forms: login / register / edit-account fieldset (tone down white borders) --- */
.woo-page form.login,
.woo-page form.register,
.woo-page form.woocommerce-form-login,
.woo-page form.woocommerce-form-register {
  border: 1px solid var(--line) !important;
  border-radius: 14px;
  padding: 1.7rem 1.9rem;
  background: linear-gradient(160deg, rgba(214,32,42,.04), transparent);
}
.woo-page fieldset {
  border: 1px solid var(--line) !important;
  border-radius: 14px;
  padding: 1.2rem 1.5rem;
  margin-top: 1.4rem;
}
.woo-page fieldset legend { color: var(--white); font-family: var(--serif); font-size: 1.1rem; padding: 0 .5rem; }
.woo-page .woocommerce-form-login__rememberme { color: var(--white-dim); }
.woo-page .woocommerce-form-login__submit,
.woo-page .woocommerce-Button { margin-right: .8rem; }
/* give the account-details "Save changes" button room below the fieldset */
.woo-page .woocommerce-EditAccountForm > p.woocommerce-form-row:last-of-type,
.woo-page button[name="save_account_details"] { margin-top: 2rem; }

/* two-column name rows */
.woo-page .form-row-first { float: left; width: 48%; }
.woo-page .form-row-last { float: right; width: 48%; }
.woo-page .form-row-wide { clear: both; }
.woo-page .woocommerce-EditAccountForm::after,
.woo-page form.checkout::after,
.woo-page .woocommerce-Addresses::after { content: ""; display: block; clear: both; }
.woo-page em, .woo-page .woocommerce-EditAccountForm span em { color: var(--white-dim); }

/* --- Addresses (force a clean side-by-side grid, override WC floats) --- */
.woo-page .woocommerce-Addresses,
.woo-page .woocommerce-account .addresses { display: grid !important; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: start; float: none; }
.woo-page .woocommerce-Addresses > div,
.woo-page .woocommerce-Addresses .u-column1,
.woo-page .woocommerce-Addresses .u-column2,
.woo-page .woocommerce-Addresses .col-1,
.woo-page .woocommerce-Addresses .col-2 { width: auto !important; max-width: none !important; float: none !important; margin: 0 !important; }
.woo-page .woocommerce-Address { border: 1px solid var(--line); border-radius: 14px; padding: 1.3rem 1.5rem; height: 100%; }
.woo-page .woocommerce-Address-title { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.woo-page .woocommerce-Address-title h2,
.woo-page .woocommerce-Address-title h3 { margin: 0; font-size: 1.3rem; }
.woo-page .woocommerce-Address-title .edit { font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; white-space: nowrap; }
.woo-page address { font-style: normal; color: var(--white-dim); line-height: 1.7; }
/* Pelart address grid (template override) — guarantees side-by-side cards */
.pelart-address-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: start; }
.pelart-address-grid::after { content: none !important; display: none !important; }
.pelart-address-grid > .woocommerce-Address { float: none !important; width: auto !important; max-width: none !important; margin: 0 !important; }

@media (max-width: 640px) {
  .pelart-address-grid { grid-template-columns: 1fr !important; }
  .woo-page .woocommerce-Addresses.col2-set,
  .woo-page .woocommerce-Addresses.u-columns { grid-template-columns: 1fr; }
  .woo-page .woocommerce-account .woocommerce { grid-template-columns: 1fr; }
  .woo-page .form-row-first, .woo-page .form-row-last { width: 100%; float: none; }
}

/* --- Block checkout: Country / State comboboxes (kill the white fill) --- */
.woo-page .components-input-control__container,
.woo-page .components-input-control__input,
.woo-page .components-combobox-control__input,
.woo-page .wc-block-components-combobox-control,
.woo-page .wc-block-components-combobox input,
.woo-page .wc-block-components-select__select {
  background: rgba(255,255,255,.03) !important;
  color: var(--white) !important;
}
.woo-page .components-input-control__backdrop,
.woo-page .wc-block-components-combobox-control { border-color: var(--line) !important; }
.woo-page .components-form-token-field__suggestions-list,
.woo-page .wc-block-components-combobox-control__suggestions-container,
.woo-page .components-combobox-control__suggestions-container ul {
  background: var(--ink-2) !important; color: var(--white) !important; border: 1px solid var(--line) !important;
}
.woo-page .components-form-token-field__suggestion { color: var(--white-dim) !important; }
.woo-page .components-form-token-field__suggestion.is-selected,
.woo-page .components-form-token-field__suggestion:hover { background: rgba(214,32,42,.18) !important; color: var(--white) !important; }
.woo-page .wc-block-components-combobox-control svg,
.woo-page .components-input-control__suffix svg { color: var(--white-dim) !important; }
/* tint checkboxes & radios red (Remember me, Add a note, payment radios) */
.woo-page input[type=checkbox], .woo-page input[type=radio] { accent-color: var(--red); }
/* Nova Poshta checkout: hidden country + delivery-method radios */
.pelart-hide { display: none !important; }
/* delivery method — one radio per line */
.woo-page .pelart-delivery .woocommerce-input-wrapper { display: grid; grid-template-columns: auto 1fr; gap: .5rem .6rem; align-items: center; margin-top: .3rem; }
.woo-page .pelart-delivery label.radio { display: inline; margin: 0; color: var(--white); cursor: pointer; }
.woo-page .pelart-delivery .input-radio { width: 17px; height: 17px; margin: 0; }
/* hide coupon prompt + the (now empty) "additional information" column */
.woo-page .woocommerce-form-coupon-toggle { display: none; }
.woo-page #customer_details .col-2 { display: none; }
.woo-page #customer_details .col-1 { float: none; width: 100%; max-width: none; }
/* payment gateways (WayForPay / COD) on the dark checkout */
.woo-page ul.payment_methods { border-bottom: 1px solid var(--line); }
.woo-page ul.payment_methods li { color: var(--white); }
.woo-page ul.payment_methods img { max-height: 26px; width: auto; display: inline-block; vertical-align: middle; margin-left: .5rem; }
.woo-page ul.payment_methods .payment_box { background: rgba(214,32,42,.06) !important; color: var(--white-dim); border-radius: 8px; }
.woo-page ul.payment_methods .payment_box::before { border-bottom-color: rgba(214,32,42,.06) !important; }
.woo-page ul.payment_methods .payment_box p { color: var(--white-dim); }

/* place-order: privacy text full-width left, button cleanly bottom-right */
.woo-page #payment .place-order { display: flex; flex-direction: column; align-items: flex-start; gap: 1.2rem; }
.woo-page #payment .place-order .woocommerce-terms-and-conditions-wrapper,
.woo-page #payment .place-order .woocommerce-privacy-policy-text { align-self: stretch; text-align: left; margin: 0; }
.woo-page #payment #place_order { float: none; width: auto; display: inline-block; }
/* deterministic billing field order (immune to WooCommerce locale JS reordering) */
.woo-page .woocommerce-billing-fields__field-wrapper { display: flex; flex-direction: column; }
.woo-page #billing_country_field { order: 0; }
.woo-page #billing_first_name_field { order: 1; }
.woo-page #billing_phone_field { order: 2; }
.woo-page #billing_pelart_delivery_field { order: 3; }
.woo-page #billing_state_field { order: 4; }
.woo-page #billing_city_field { order: 5; }
.woo-page #billing_address_1_field { order: 6; }
.woo-page #billing_email_field { order: 7; }

/* --- Order received / Thank-you page: align every block to one column --- */
.woo-page .woocommerce-order { max-width: 1040px; margin-inline: auto; }
.woo-page .woocommerce-order > *,
.woo-page .woocommerce-order .woocommerce-order-overview,
.woo-page .woocommerce-order .woocommerce-order-details,
.woo-page .woocommerce-order .woocommerce-customer-details { width: 100%; margin-left: 0; margin-right: 0; }
.woo-page .woocommerce-order table.shop_table { width: 100% !important; margin: 0 0 2rem 0 !important; }
.woo-page ul.order_details { display: flex; flex-wrap: wrap; gap: 0; padding: 0; list-style: none; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.woo-page ul.order_details li { flex: 1 1 auto; margin: 0; padding: 1rem 1.4rem; border-right: 1px solid var(--line); border-bottom: none; list-style: none; color: #ffffff66; text-transform: uppercase; letter-spacing: .1em; font-size: .72rem; }
.woo-page ul.order_details li:last-child { border-right: none; }
.woo-page ul.order_details li strong { display: block; margin-top: .35rem; color: var(--white); text-transform: none; letter-spacing: 0; font-size: 1.05rem; font-family: var(--serif); }

/* --- Wishlist share / shared-view --- */
.wishlist-actions { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; margin-top: 1.6rem; }
.wishlist-shared-note { color: var(--red-soft); font-family: var(--serif); font-style: italic; font-size: 1.1rem; margin-top: 1rem; }

/* ============================================================
   SEARCH OVERLAY (instant product search)
   ============================================================ */
body.search-open { overflow: hidden; }
.search-overlay { position: fixed; inset: 0; z-index: 200; display: flex; justify-content: center; align-items: flex-start;
  background: rgba(10,7,8,0); opacity: 0; visibility: hidden; transition: opacity .35s ease, background .35s ease, backdrop-filter .35s ease; }
.search-overlay.open { opacity: 1; visibility: visible; background: rgba(10,7,8,.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.search-overlay__char { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-family: 'Noto Serif SC', serif; font-size: 42vh; line-height: 1; color: #fff; opacity: .035; pointer-events: none; user-select: none; }
.search-overlay__close { position: absolute; top: clamp(1.2rem,3vw,2.2rem); right: clamp(1.2rem,3vw,2.2rem); width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line); background: transparent; color: var(--white); font-size: 1rem; cursor: pointer; transition: border-color .3s, color .3s, transform .4s; }
.search-overlay__close:hover { border-color: var(--red); color: var(--red-soft); transform: rotate(90deg); }
.search-overlay__close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.search-box__input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.search-overlay__inner { position: relative; width: min(720px,92vw); margin-top: clamp(6rem,16vh,11rem); transform: translateY(-16px); transition: transform .4s ease; }
.search-overlay.open .search-overlay__inner { transform: translateY(0); }
.search-box { display: flex; align-items: center; gap: 1rem; padding: 0 .3rem 1rem; border-bottom: 1px solid var(--line-red); }
.search-box__icon { width: 26px; height: 26px; flex: none; fill: none; stroke: var(--red-soft); stroke-width: 1.5; stroke-linecap: round; }
.search-box__input { flex: 1; min-width: 0; background: transparent; border: none; outline: none; color: var(--white); font-family: var(--serif); font-size: clamp(1.5rem,4vw,2.3rem); }
.search-box__input::placeholder { color: #ffffff40; font-style: italic; }
.search-hint, .search-empty { margin-top: 1.4rem; color: var(--white-dim); font-style: italic; font-family: var(--serif); font-size: 1.05rem; }
.search-results { margin-top: .6rem; max-height: 54vh; overflow-y: auto; }
.search-item { display: flex; align-items: center; gap: 1.1rem; padding: 1rem .3rem; border-bottom: 1px solid var(--line); text-decoration: none; transition: background .25s ease, padding-left .25s ease; }
.search-item:hover { background: rgba(214,32,42,.07); padding-left: 1rem; }
.search-item__cjk { flex: none; width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid var(--line-red); border-radius: 10px; background: var(--ink-2); font-family: 'Noto Serif SC', serif; font-size: 1.3rem; color: var(--red-soft); }
.search-item__body { flex: 1; min-width: 0; }
.search-item__name { display: block; font-family: var(--serif); font-size: 1.2rem; color: var(--white); }
.search-item__desc { display: block; margin-top: .15rem; font-size: .85rem; color: var(--white-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-item__price { flex: none; font-family: var(--serif); font-size: 1.05rem; color: var(--white); }
.mobile-menu__search { display: flex; align-items: center; gap: .7rem; width: min(320px, 82vw); margin: 0 auto 1.8rem; padding: .85rem 1.2rem; border: 1px solid var(--line-red); border-radius: 12px; background: rgba(255,255,255,.04); color: var(--white-dim); font-family: var(--sans); font-size: .98rem; letter-spacing: .01em; cursor: pointer; }
.mobile-menu__search svg { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--red-soft); stroke-width: 1.5; }
.mobile-menu__search:active { border-color: var(--red); }

/* Floating "Filters" button (mobile catalog) */
.filters-fab { position: fixed; left: 50%; bottom: 1.4rem; z-index: 60; display: none; align-items: center; gap: .5rem;
  padding: .8rem 1.5rem; border: none; border-radius: 999px; background: linear-gradient(135deg, var(--red-bright), var(--red-2));
  color: #fff; font-family: var(--sans); font-size: .8rem; letter-spacing: .14em; text-transform: uppercase;
  box-shadow: 0 12px 30px -8px var(--red-2); cursor: pointer; opacity: 0; transform: translateX(-50%) translateY(150%);
  transition: opacity .35s ease, transform .4s var(--ease); }
.filters-fab svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.filters-fab.is-visible { opacity: 1; transform: translateX(-50%) translateY(0); }
body.filters-open .filters-fab { opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(150%); }
@media (max-width: 1024px) { .filters-fab { display: inline-flex; } }

/* ============================================================
   LEGAL / HELP PAGES  (privacy · help: shipping/returns/faq)
   ============================================================ */
.legal { max-width: 940px; margin: 0 auto; padding: 0 var(--pad) clamp(4rem,8vw,7rem); }
.legal__nav { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: clamp(2rem,5vw,3.4rem); }
.legal__nav a { padding: .55rem 1.15rem; border: 1px solid var(--line); border-radius: 999px; color: var(--white-dim); font-size: .82rem; letter-spacing: .04em; text-decoration: none; transition: border-color .3s, color .3s, background .3s; }
.legal__nav a:hover { border-color: var(--red); color: var(--white); background: rgba(214,32,42,.08); }
.legal__updated { color: var(--white-dim); font-style: italic; font-family: var(--serif); margin: 0 0 2.4rem; }
.legal__block { margin-bottom: clamp(2.6rem,5vw,3.8rem); scroll-margin-top: 110px; }
.legal__block > h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.7rem,3.6vw,2.5rem); margin-bottom: 1.3rem; color: var(--white); line-height: 1.15; }
.legal__block > h2 .cn { font-family: 'Noto Serif SC', serif; color: var(--red-soft); font-size: .72em; margin-right: .55rem; }
.legal h3 { font-family: var(--serif); font-weight: 400; font-size: 1.22rem; margin: 1.9rem 0 .6rem; color: var(--white); }
.legal p, .legal li { color: var(--white-dim); line-height: 1.78; font-size: 1rem; }
.legal p { margin-bottom: 1rem; }
.legal ul { list-style: none; display: grid; gap: .55rem; margin: 0 0 1.3rem; }
.legal ul li { position: relative; padding-left: 1.4rem; }
.legal ul li::before { content: "✦"; position: absolute; left: 0; top: .35rem; color: var(--red-soft); font-size: .7rem; }
.legal a:not(.btn) { color: var(--red-soft); text-decoration: underline; text-underline-offset: 3px; }
.legal a:not(.btn):hover { color: var(--red-bright); }
/* FAQ — native <details> accordion (zero-JS) */
.faq { border-top: 1px solid var(--line); }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__item > summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.3rem 0; cursor: pointer; color: var(--white); font-family: var(--serif); font-size: 1.12rem; }
.faq__item > summary::-webkit-details-marker { display: none; }
.faq__item > summary::marker { content: ""; }
.faq__item > summary svg { width: 20px; height: 20px; flex: none; fill: none; stroke: var(--red-soft); stroke-width: 1.6; stroke-linecap: round; transition: transform .35s var(--ease); }
.faq__item[open] > summary svg { transform: rotate(180deg); }
.faq__a { padding: 0 0 1.5rem; }
.faq__a p { margin: 0 0 .8rem; }
.faq__a p:last-child { margin-bottom: 0; }

/* form privacy-consent line (b2b / contact / etc.) */
.form-consent { margin: .2rem 0 1.3rem; font-size: .84rem; color: var(--white-dim); line-height: 1.55; }
.form-consent a { color: var(--red-soft); text-decoration: underline; text-underline-offset: 2px; }
.form-consent a:hover { color: var(--red-bright); }

/* newsletter (footer) — submit feedback */
.footer__col--news .newsletter { position: relative; }
.newsletter__msg { margin-top: .7rem; min-height: 1.05em; font-size: .82rem; letter-spacing: .02em; opacity: 0; transform: translateY(4px); transition: opacity .35s ease, transform .35s ease; }
.newsletter__msg.show { opacity: 1; transform: translateY(0); }
.newsletter__msg.ok { color: var(--red-soft); }
.newsletter__msg.err { color: #ff8a8a; }
.newsletter.is-done input { opacity: .55; }

/* ============================================================
   404 — page not found
   ============================================================ */
.error-404 { position: relative; min-height: 80vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: clamp(7rem,16vh,11rem) var(--pad) clamp(4rem,8vw,6rem); overflow: hidden; }
.error-404 .bg-char--legacy { color: #d6202a08; font-size: clamp(16rem, 46vw, 40rem); }
.error-404__inner { position: relative; z-index: 2; max-width: 620px; }
.error-404__code { font-family: var(--serif); font-weight: 300; font-size: clamp(6rem, 20vw, 13rem); line-height: .92; letter-spacing: .04em;
  background: linear-gradient(180deg, var(--white) 0%, var(--red-soft) 75%, var(--red-2) 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 14px 40px #d6202a33); }
.error-404 .section-kicker { margin-bottom: 1.4rem; }
.error-404 h1 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.8rem, 4.5vw, 3rem); line-height: 1.1; margin: .6rem 0 1rem; }
.error-404 h1 em { font-style: italic; color: var(--red-soft); }
.error-404 > .error-404__inner p { color: var(--white-dim); max-width: 460px; margin: 0 auto 2.2rem; font-size: 1.06rem; line-height: 1.7; }
.error-404__actions { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }
.error-404__links { display: flex; gap: 1.6rem; flex-wrap: wrap; justify-content: center; margin-top: 2.4rem; }
.error-404__links a { color: var(--white-dim); font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; position: relative; transition: color .3s; }
.error-404__links a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -4px; height: 1px; background: var(--red); transition: right .35s var(--ease); }
.error-404__links a:hover { color: var(--white); }
.error-404__links a:hover::after { right: 0; }

/* ============================================================
   MINI-CART (slide-out drawer)
   ============================================================ */
.mini-cart-backdrop { position: fixed; inset: 0; z-index: 190; background: rgba(10,7,8,0); visibility: hidden; transition: background .35s ease, visibility .35s ease; }
.mini-cart-backdrop.open { visibility: visible; background: rgba(10,7,8,.7); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.mini-cart { position: fixed; top: 0; right: 0; z-index: 201; width: min(400px, 92vw); height: 100%; background: var(--ink-2); border-left: 1px solid var(--line-red); display: flex; flex-direction: column; transform: translateX(100%); transition: transform .42s var(--ease); box-shadow: -24px 0 60px -24px #000; }
.mini-cart.open { transform: translateX(0); }
.mini-cart__head { display: flex; align-items: center; justify-content: space-between; padding: 1.4rem 1.5rem; border-bottom: 1px solid var(--line); }
.mini-cart__head h3 { font-family: var(--serif); font-weight: 400; font-size: 1.4rem; margin: 0; color: var(--white); }
.mini-cart__close { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; background: none; color: var(--white); cursor: pointer; display: grid; place-items: center; transition: border-color .3s, transform .4s; }
.mini-cart__close:hover { border-color: var(--red); transform: rotate(90deg); }
.mini-cart__close svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.mini-cart__body { flex: 1; overflow-y: auto; padding: 1.2rem 1.5rem 1.6rem; }
.mini-cart .woocommerce-mini-cart { list-style: none; margin: 0; padding: 0; }
.mini-cart .woocommerce-mini-cart__empty-message { color: var(--white-dim); font-family: var(--serif); font-style: italic; font-size: 1.05rem; padding: 1.5rem 0; }
.mini-cart li.woocommerce-mini-cart-item { position: relative; display: block; padding: 1rem 0 1rem 2rem; border-bottom: 1px solid var(--line); color: var(--white); }
.mini-cart li.woocommerce-mini-cart-item img { display: none; } /* no product photos in this shop */
.mini-cart li.woocommerce-mini-cart-item a:not(.remove) { display: block; color: var(--white); text-decoration: none; font-family: var(--serif); font-size: 1.05rem; line-height: 1.3; }
.mini-cart li.woocommerce-mini-cart-item a.remove { position: absolute; left: 0; top: 1.05rem; width: 20px; height: 20px; line-height: 18px; text-align: center; border: 1px solid var(--line); border-radius: 50%; color: var(--white-dim) !important; font-size: .8rem; }
.mini-cart li.woocommerce-mini-cart-item a.remove:hover { border-color: var(--red); color: var(--red-soft) !important; background: transparent !important; }
.mini-cart .quantity { display: block; color: var(--white-dim); font-size: .88rem; margin-top: .25rem; }
.mini-cart .woocommerce-mini-cart__total { display: flex; justify-content: space-between; align-items: baseline; padding: 1.1rem 0; margin-top: .4rem; border-top: 1px solid var(--line-red); color: var(--white); font-family: var(--serif); font-size: 1.1rem; }
.mini-cart .amount { color: var(--white); }
.mini-cart .woocommerce-mini-cart__buttons { display: flex; flex-direction: column; gap: .7rem; margin: .3rem 0 0; padding: 0; }
.mini-cart .woocommerce-mini-cart__buttons .button { display: block; width: 100%; text-align: center; padding: .9rem 1rem; border-radius: 100px; font-family: var(--sans); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; border: 1px solid var(--line); background: transparent; color: var(--white); transition: border-color .3s, background .3s, color .3s; }
.mini-cart .woocommerce-mini-cart__buttons .button:hover { border-color: var(--red); background: rgba(214,32,42,.08); }
.mini-cart .woocommerce-mini-cart__buttons .checkout { background: linear-gradient(135deg, var(--red-bright), var(--red-2)); border-color: transparent; color: #fff; }
body.mini-cart-open { overflow: hidden; }

/* Mini-cart — empty state (rendered by pelart_mini_cart_empty on
   woocommerce_after_mini_cart; Woo's own bare message is hidden). */
.mini-cart .woocommerce-mini-cart__empty-message { display: none; }
.mini-cart__empty { position: relative; text-align: center; padding: clamp(2rem, 6vh, 3.6rem) .4rem 1rem; }
/* Light weight, not 900: a 1px stroke around heavy CJK strokes outlines each one
   twice and turns the glyph into scribble at this size. */
.mini-cart__empty-char { display: block; font-family: var(--cjk); font-weight: 300; font-size: 6.5rem; line-height: 1;
  color: transparent; -webkit-text-stroke: 1px #d6202a4d; margin-bottom: 1.4rem; user-select: none; }
.mini-cart__empty-title { font-family: var(--serif); font-size: 1.45rem; color: var(--white); margin: 0 0 .6rem; }
.mini-cart__empty-text { color: var(--white-dim); font-size: .92rem; line-height: 1.7; margin: 0 auto 1.8rem; max-width: 26ch; }
.mini-cart__empty-btn { width: 100%; }
.mini-cart__empty-link { display: inline-block; margin-top: 1.1rem; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--white-dim) !important; border-bottom: 1px solid var(--line-red); padding-bottom: .3rem; transition: color .3s, border-color .3s; }
.mini-cart__empty-link:hover { color: var(--white) !important; border-color: var(--red); }

/* ===== EMPTY CART PAGE ===== */
.cart-empty { position: relative; text-align: center; padding: clamp(1rem, 3vh, 2.5rem) 0 clamp(2rem, 5vh, 3.5rem); overflow: hidden; }
.cart-empty__char { font-size: clamp(11rem, 26vw, 20rem); font-weight: 300; left: 50%; top: 46%; transform: translate(-50%, -50%);
  color: transparent; -webkit-text-stroke: 1px #d6202a33; }
.cart-empty__inner { position: relative; z-index: 2; max-width: 620px; margin-inline: auto; }
.cart-empty .section-title { font-size: clamp(2rem, 4.4vw, 3.2rem); }
.cart-empty .section-intro { margin-inline: auto; }
.cart-empty__actions { margin-top: clamp(1.6rem, 4vh, 2.4rem); display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }
.cart-suggest { margin-top: clamp(2.5rem, 6vh, 4rem); padding-top: clamp(1.8rem, 4vh, 2.8rem); border-top: 1px solid var(--line); }
.cart-suggest__head { text-align: center; margin-bottom: clamp(1.4rem, 3vh, 2.2rem); }
@media (max-width: 560px) {
  .cart-empty__actions .btn { width: 100%; }
  /* The grid drops to one card per row on phones, so all four would make an empty
     cart ~3000px tall. Two is enough of a nudge; the CTA above is the real path. */
  .cart-suggest .product:nth-child(n+3) { display: none; }
}

/* My Account → Orders: the status cell is driven by KeyCRM (see inc/keycrm.php) */
.crm-status { font-size: .78rem; letter-spacing: .06em; }
.crm-status--accepted { color: var(--white); }
.crm-status--shipped,
.crm-status--at_branch { color: var(--red-soft); }
.crm-status--received { color: var(--white); border-bottom: 1px solid var(--red); padding-bottom: .1rem; }
.crm-status--cancelled { color: var(--white-dim); text-decoration: line-through; }

/* PDP — related products */
.pdp-related { margin-top: clamp(3rem, 6vw, 5rem); }
.pdp-related .section-head { margin-bottom: clamp(1.8rem, 4vw, 3rem); }

/* ============================================================
   COOKIE CONSENT BAR
   ============================================================ */
.cookie-bar { position: fixed; left: 50%; bottom: 1.2rem; transform: translateX(-50%) translateY(160%); z-index: 180; width: min(680px, 94vw); display: flex; align-items: center; gap: 1.2rem; padding: 1rem 1.3rem; background: var(--ink-2); border: 1px solid var(--line-red); border-radius: 14px; box-shadow: 0 20px 50px -20px #000; opacity: 0; visibility: hidden; transition: transform .5s var(--ease), opacity .5s ease, visibility .5s; }
.cookie-bar.show { transform: translateX(-50%) translateY(0); opacity: 1; visibility: visible; }
.cookie-bar__text { margin: 0; flex: 1; color: var(--white-dim); font-size: .86rem; line-height: 1.5; }
.cookie-bar__text a { color: var(--red-soft); text-decoration: underline; text-underline-offset: 2px; }
.cookie-bar__text a:hover { color: var(--red-bright); }
.cookie-bar__btn { flex: none; padding: .7rem 1.6rem; border: none; border-radius: 999px; background: linear-gradient(135deg, var(--red-bright), var(--red-2)); color: #fff; font-family: var(--sans); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: transform .3s; }
.cookie-bar__btn:hover { transform: translateY(-2px); }
@media (max-width: 560px) { .cookie-bar { flex-direction: column; align-items: stretch; text-align: center; gap: .8rem; bottom: .6rem; } .cookie-bar__btn { width: 100%; } }

/* ============================================================
   CHECKOUT PHONE MASK (UA / PL country picker)
   ============================================================ */
.phone-mask { display: flex; gap: .5rem; align-items: stretch; }
.phone-mask input { flex: 1 1 auto; min-width: 0; }
.phone-mask__cc {
  flex: 0 0 auto;
  width: auto !important;
  padding: .55rem .7rem !important;
  font-family: var(--sans);
  font-size: .9rem;
  letter-spacing: .04em;
  cursor: pointer;
}
.phone-mask__cc option { background: #14090b; color: var(--white); }


/* ============================================================
   PRODUCTION VIDEO (replaces the products grid on the front page)
   ============================================================ */
/* edge-to-edge: kill the global section side paddings */
.prodvideo { position: relative; width: 100%; overflow: hidden; padding: 6vh 0 2vh; }
.prodvideo .section-head { max-width: calc(var(--maxw) + 2 * var(--pad)); margin: 0 auto; padding: 0 var(--pad); }
.prodvideo__frame { margin-top: 4vh; line-height: 0; }
/* dimmed via filter, and the frame itself DISSOLVES into the page background
   top & bottom via a mask — there is no visible edge to hide */
.prodvideo video { display: block; width: 100%; height: auto;
  filter: brightness(.68) saturate(.85);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 70%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 70%, transparent 100%); }

/* ============================================================
   THE FOUR WAYS (scroll-driven product-lines showcase)
   ============================================================ */
.ways { position: relative; height: 540vh; padding: 0; }
.ways__pin { position: sticky; top: 0; height: 100vh; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center; }
.ways__head { position: absolute; top: calc(var(--header-h, 72px) + 1vh); left: 0; right: 0;
  max-width: calc(var(--maxw) + 2 * var(--pad)); margin: 0 auto; padding: 0 var(--pad); z-index: 5; }
.ways__bgchar { position: absolute; right: 3vw; top: 50%; transform: translateY(-50%);
  font-family: 'Noto Serif SC', serif; font-weight: 900; font-size: clamp(14rem, 40vh, 32rem);
  color: transparent; -webkit-text-stroke: 1px rgba(214, 32, 42, .22); line-height: 1;
  z-index: 1; user-select: none; pointer-events: none; }
.ways__stage { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr;
  align-items: center; gap: 4vw; width: 100%;
  max-width: calc(var(--maxw) + 2 * var(--pad)); margin: 0 auto; padding: 0 var(--pad); }
.ways__art { position: relative; height: 60vh; display: flex; align-items: center; justify-content: center; }
.ways__img { position: absolute; max-height: 100%; max-width: 100%; opacity: 0; will-change: transform, opacity;
  -webkit-mask-image: radial-gradient(closest-side, #000 42%, transparent 97%);
          mask-image: radial-gradient(closest-side, #000 42%, transparent 97%); }
.ways__img.is-active { opacity: 1; }
.ways__num { font-family: var(--sans); font-size: .72rem; letter-spacing: .34em; color: var(--red-soft);
  display: block; margin-bottom: 1.8vh; }
.ways__name { font-family: var(--serif); font-weight: 300; font-size: clamp(2.6rem, 7.5vh, 4.8rem);
  line-height: 1.02; margin: 0 0 1.8vh; }
.ways__line { color: var(--white-dim); font-size: clamp(.95rem, 2vh, 1.15rem); line-height: 1.7;
  max-width: 44ch; margin: 0 0 4vh; }
.ways__progress { position: absolute; left: calc(var(--pad) / 2); top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: .6rem; z-index: 4; }
.ways__progress i { width: 7px; height: 7px; border-radius: 50%; background: #ffffff2b;
  transition: background .4s, transform .4s; }
.ways__progress i.on { background: var(--red); transform: scale(1.3); }
@media (max-width: 900px) {
  .ways { height: 580vh; }
  .ways__stage { grid-template-columns: 1fr; gap: 2vh; padding-top: 16vh; }
  .ways__art { height: 38vh; }
  .ways__name { font-size: clamp(2.2rem, 5vh, 3.2rem); }
  .ways__bgchar { right: -6vw; top: 32%; font-size: clamp(10rem, 26vh, 18rem); }
  .ways__progress { left: auto; right: 4vw; }
}

/* ===== LINE TILE HOVER VIDEO ===== */
.line__vid { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; pointer-events: none; filter: grayscale(.12) brightness(.62) contrast(1.03);
  transition: opacity .7s ease, filter .6s var(--ease); }
.line:hover .line__vid { filter: grayscale(0) brightness(.85); }
.line__vid.is-playing { opacity: 1; }
@media (hover: none) {
  /* touch tiles are dimmed like their posters — keep the playing video in the same key */
  .line__vid { filter: grayscale(.05) brightness(.72) contrast(1.03); }
}

/* ===== NINE WAYS PHASE VIDEO ===== */
.ways__vid { position: absolute; max-height: 100%; max-width: 100%; opacity: 0; pointer-events: none;
  -webkit-mask-image: radial-gradient(closest-side, #000 42%, transparent 97%);
          mask-image: radial-gradient(closest-side, #000 42%, transparent 97%); }
/* .ways__vid visibility is driven inline by JS/Motion; .is-playing is a state marker only */

.ways__img.ghost-off { opacity: 0 !important; transition: opacity .6s ease; }