/* ═══════════════════════════════════════════════════════════════════════
   CHOICE WHISPER — Main Stylesheet
   Mirrors the React / Tailwind design exactly.
   Color palette:
     Cream:   #F7F1E8  |  Dark:    #2F2926  |  Mauve:   #BFA5A0
     Brown:   #6F5E53  |  Border:  #D8C7B2  |  Green:   #829E84
     Red CTA: #EF3E36
═══════════════════════════════════════════════════════════════════════ */

/* ── 1. RESET & BASE ────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --cream:   #F7F1E8;
  --dark:    #2F2926;
  --mauve:   #BFA5A0;
  --brown:   #6F5E53;
  --border:  #D8C7B2;
  --green:   #829E84;
  --red:     #EF3E36;
  --font-serif: "Playfair Display", Georgia, serif;
  --font-sans:  "Inter", system-ui, sans-serif;
  --font-mono:  "JetBrains Mono", monospace;
  --max-w: 1280px;
  --px: clamp(1.5rem, 5vw, 3rem);
}

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-sans);
  background-color: var(--cream);
  color: var(--dark);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

::selection { background: rgba(191,165,160,.3); color: var(--brown); }

img { display: block; max-width: 100%; height: auto; }
a   { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; border: none; background: none; }
ul, ol { list-style: none; }

/* ── 2. UTILITY ─────────────────────────────────────────────────────── */
.cw-container { max-width: var(--max-w); margin-inline: auto; padding-inline: var(--px); }
.cw-section   { padding-block: clamp(3rem, 6vw, 5rem); }

/* ── 3. ANIMATIONS ──────────────────────────────────────────────────── */
@keyframes fadeIn  { from { opacity:0; transform:translateY(4px) } to { opacity:1; transform:translateY(0) } }
@keyframes slideIn { from { opacity:0; transform:translateX(20px) } to { opacity:1; transform:translateX(0) } }
.animate-fadeIn  { animation: fadeIn  .4s cubic-bezier(.16,1,.3,1) forwards; }
.animate-slideIn { animation: slideIn .35s cubic-bezier(.16,1,.3,1) forwards; }

/* ── 4. TYPOGRAPHY HELPERS ──────────────────────────────────────────── */
.cw-section-title  { font-family: var(--font-serif); font-size: clamp(1.5rem,3vw,2rem); font-weight: 900; color: var(--dark); }
.cw-section-desc   { font-size:.75rem; color: rgba(47,41,38,.7); line-height:1.7; font-family:var(--font-serif); }
.cw-eyebrow        { display:block; font-size:.625rem; letter-spacing:.25em; color:var(--mauve); font-weight:700; text-transform:uppercase; font-family:var(--font-mono); }
.cw-section-header { text-align:center; max-width:36rem; margin-inline:auto; margin-bottom:2.5rem; display:flex; flex-direction:column; gap:.5rem; }
.cw-text-center    { text-align:center; }
.cw-section-topbar { display:flex; align-items:flex-end; justify-content:space-between; border-bottom:1px solid rgba(216,199,178,.4); padding-bottom:1rem; margin-bottom:2rem; }

.cw-view-all-link  { display:inline-flex; align-items:center; gap:.25rem; font-size:.75rem; font-weight:700; color:var(--brown); transition:color .2s; }
.cw-view-all-link:hover { color:var(--mauve); }
.cw-read-more      { display:inline-flex; align-items:center; gap:.25rem; font-size:.75rem; font-weight:700; color:var(--brown); transition:color .2s; }
.cw-read-more:hover { color:var(--mauve); }

.cw-badge        { display:inline-block; align-self:flex-start; padding:.25rem .75rem; font-size:.625rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; border-radius:9999px; text-decoration:none; }
.cw-badge-brown  { background:var(--brown); color:#fff; }
.cw-badge-brown:hover { background:var(--dark); color:#fff; }
.cw-badge-mini   { display:inline-block; align-self:flex-start; padding:.125rem .5rem; font-size:.5625rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; border-radius:.25rem; background:rgba(111,94,83,.1); color:var(--brown); text-decoration:none; }
.cw-badge-mini:hover { background:rgba(111,94,83,.2); }

/* ── 5. BUTTONS ─────────────────────────────────────────────────────── */
.cw-btn-pill   { display:inline-flex; align-items:center; gap:.5rem; background:var(--mauve); color:var(--cream); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; padding:.625rem 1.25rem; border-radius:9999px; transition:background .2s, box-shadow .2s; }
.cw-btn-pill:hover { background:var(--brown); box-shadow:0 4px 12px rgba(0,0,0,.15); }
.cw-btn-dark   { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; background:var(--brown); color:var(--cream); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.15em; padding:.875rem 1.5rem; border-radius:9999px; transition:background .2s; }
.cw-btn-dark:hover { background:var(--dark); }
.cw-nl-form { display:flex; flex-direction:column; gap:1rem; }
.cw-btn-red    { background:var(--red); color:#fff; font-size:.6875rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; padding:1rem 2rem; white-space:nowrap; transition:background .2s; font-family:var(--font-mono); border:none; cursor:pointer; }
.cw-btn-red:hover { background:#D62828; }
.cw-btn-full   { width:100%; justify-content:center; }

/* ── 6. HEADER ──────────────────────────────────────────────────────── */
.cw-header { position:sticky; top:0; z-index:40; background:rgba(247,241,232,.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(216,199,178,.4); transition:all .3s; }

.cw-microbar { background:var(--brown); color:var(--cream); font-size:.625rem; text-transform:uppercase; letter-spacing:.2em; padding:.375rem 1rem; text-align:center; font-weight:600; }
.cw-microbar-inner { display:inline-flex; align-items:center; gap:.375rem; }
.cw-sparkle { color:var(--mauve); }

.cw-header-inner { max-width:var(--max-w); margin-inline:auto; padding-inline:var(--px); padding-block:1.25rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.cw-header-right { display:flex; align-items:center; gap:1rem; }

.cw-logo { display:flex; flex-direction:column; }
.cw-logo-text { font-family:var(--font-serif); font-size:clamp(1.1rem,2.5vw,1.5rem); font-weight:900; letter-spacing:-.025em; text-transform:uppercase; color:var(--dark); transition:color .2s; position:relative; }
.cw-logo-text::after { content:''; position:absolute; bottom:-.125rem; left:0; width:0; height:2px; background:var(--mauve); transition:width .3s; }
.cw-logo:hover .cw-logo-text { color:var(--mauve); }
.cw-logo:hover .cw-logo-text::after { width:100%; }
.cw-logo img { max-height:48px; width:auto; }

/* Desktop nav */
.cw-nav-desktop { display:none; }
@media (min-width:1024px) { .cw-nav-desktop { display:block; } }

.cw-nav-list { display:flex; align-items:center; gap:1.75rem; }
.cw-nav-list li a,
.cw-nav-list li > a {
  font-size:.75rem; text-transform:uppercase; letter-spacing:.2em; font-weight:700;
  color:rgba(47,41,38,.8); transition:color .2s; padding:.375rem 0; position:relative;
}
.cw-nav-list li.current-menu-item > a,
.cw-nav-list li.current_page_item > a { color:var(--mauve); }
.cw-nav-list li.current-menu-item > a::after,
.cw-nav-list li.current_page_item > a::after {
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:.375rem; height:.375rem; border-radius:9999px; background:var(--mauve);
}
.cw-nav-list li a:hover { color:var(--mauve); }

/* CTA — hidden on mobile, visible tablet+ */
.cw-header-actions { display:none; }
@media (min-width:640px) { .cw-header-actions { display:flex; align-items:center; } }

/* Hamburger — visible mobile/tablet, hidden desktop */
.cw-hamburger { display:flex; padding:.375rem; color:var(--dark); transition:color .2s; }
.cw-hamburger:hover { color:var(--mauve); }
@media (min-width:1024px) { .cw-hamburger { display:none; } }

/* Tighten gap on mobile so lang + burger sit close together */
@media (max-width:639px) { .cw-header-right { gap:.5rem; } }

/* Mobile menu */
.cw-mobile-menu {
  display:none; border-top:1px solid rgba(216,199,178,.4); background:var(--cream);
  padding:1rem 1.5rem; position:absolute; top:100%; left:0; width:100%;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
}
.cw-mobile-menu.cw-open { display:block; animation:fadeIn .3s ease; }
.cw-mobile-nav-list { display:flex; flex-direction:column; gap:.25rem; }
.cw-mobile-nav-list li a { display:block; font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700; padding:.625rem .75rem; border-radius:.5rem; color:var(--dark); transition:all .2s; }
.cw-mobile-nav-list li a:hover,
.cw-mobile-nav-list li.current-menu-item > a { background:rgba(191,165,160,.15); color:var(--mauve); }
.cw-mobile-cta { padding-top:.75rem; border-top:1px solid rgba(216,199,178,.4); }

/* ── 7. TOAST ───────────────────────────────────────────────────────── */
.cw-toast {
  position:fixed; bottom:1.5rem; right:1.5rem; z-index:9999;
  background:var(--brown); color:var(--cream); padding:.75rem 1.25rem;
  border-radius:1rem; box-shadow:0 8px 24px rgba(0,0,0,.2);
  display:flex; align-items:center; gap:.75rem; max-width:20rem;
  animation:slideIn .35s ease; font-size:.75rem; font-weight:600;
}
.cw-toast-icon { width:1.25rem; height:1.25rem; border-radius:9999px; background:var(--mauve); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.cw-toast-icon svg { color:var(--dark); }

/* ── 8. POPUP ───────────────────────────────────────────────────────── */
.cw-popup-overlay {
  position:fixed; inset:0; z-index:9998; display:flex; align-items:center; justify-content:center;
  padding:1rem; background:rgba(47,41,38,.7); backdrop-filter:blur(4px); animation:fadeIn .3s ease;
}
.cw-popup-inner {
  background:var(--cream); border:1px solid var(--border); border-radius:2rem;
  max-width:32rem; width:100%; padding:clamp(2rem,5vw,2.5rem); position:relative;
  box-shadow:0 24px 64px rgba(0,0,0,.2);
}
.cw-popup-close {
  position:absolute; top:1.25rem; right:1.25rem; width:2rem; height:2rem;
  border-radius:9999px; background:rgba(111,94,83,.1); color:var(--dark);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.75rem;
  transition:background .2s;
}
.cw-popup-close:hover { background:rgba(111,94,83,.2); }
.cw-popup-body { text-align:center; }
.cw-popup-badge { display:inline-flex; align-items:center; gap:.375rem; padding:.25rem .75rem; background:rgba(111,94,83,.1); color:var(--brown); border-radius:9999px; font-size:.625rem; text-transform:uppercase; font-weight:700; letter-spacing:.2em; font-family:var(--font-mono); margin-bottom:.75rem; }
.cw-popup-badge svg { color:var(--mauve); }
.cw-popup-heading { font-family:var(--font-serif); font-size:clamp(1.5rem,3vw,2rem); font-weight:900; text-transform:uppercase; color:var(--dark); margin-bottom:.75rem; }
.cw-popup-subtext { font-size:.8125rem; color:rgba(47,41,38,.8); line-height:1.6; max-width:26rem; margin-inline:auto; }
.cw-popup-form-wrap { margin-top:1.5rem; }
.cw-popup-skip { width:100%; text-align:center; display:block; font-size:.6875rem; color:var(--brown); font-weight:700; text-transform:uppercase; letter-spacing:.2em; margin-top:.5rem; background:none; border:none; cursor:pointer; }
.cw-popup-skip:hover { text-decoration:underline; }
.cw-input-round { width:100%; padding:1rem 1.25rem; border-radius:9999px; border:1px solid rgba(216,199,178,.8); background:#fff; font-size:.75rem; color:var(--dark); outline:none; font-family:var(--font-sans); transition:box-shadow .2s; }
.cw-input-round:focus { box-shadow:0 0 0 2px var(--mauve); }

/* CF7 inside popup */
.cw-popup-form-wrap .wpcf7-form { display:flex; flex-direction:column; gap:.75rem; }
.cw-popup-form-wrap input[type=email] { width:100%; padding:1rem 1.25rem; border-radius:9999px; border:1px solid rgba(216,199,178,.8); background:#fff; font-size:.75rem; outline:none; }
.cw-popup-form-wrap input[type=submit] { background:var(--brown); color:var(--cream); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; padding:1rem; border-radius:9999px; border:none; cursor:pointer; width:100%; transition:background .2s; }
.cw-popup-form-wrap input[type=submit]:hover { background:var(--dark); }
.wpcf7-response-output { font-size:.75rem; margin-top:.5rem; text-align:center; }

/* ── 9. HERO SECTION ────────────────────────────────────────────────── */
/* React: max-w-7xl px-6 md:px-12 pt-8 pb-10 */
.cw-hero-section { padding-top:2rem; padding-bottom:2.5rem; }
.cw-hero-grid { display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width:1024px) { .cw-hero-grid { grid-template-columns:8fr 4fr; align-items:stretch; } }

.cw-hero-left {
  position:relative; border-radius:1.5rem; overflow:hidden;
  min-height:400px; display:flex; flex-direction:column; justify-content:flex-end;
  padding:clamp(2rem,5vw,3rem); border:1px solid rgba(216,199,178,.3);
  background-color:#2F2926; background-size:cover; background-position:center;
  transition:transform .3s;
}
@media (min-width:1024px) { .cw-hero-left { min-height:500px; } }
.cw-hero-left:hover { transform:none; }
.cw-hero-img-link { position:absolute; inset:0; display:block; }
.cw-hero-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.cw-hero-left:hover .cw-hero-img { transform:scale(1.02); }
.cw-hero-title-link { text-decoration:none; display:block; }
.cw-hero-title-link:hover .cw-hero-title { text-decoration:underline; text-decoration-color:rgba(255,255,255,.4); }
.cw-hero-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(47,41,38,.9) 0%, rgba(47,41,38,.35) 60%, transparent 100%); pointer-events:none; }
.cw-hero-frame  { position:absolute; inset:1rem; border-radius:1.25rem; border:1px solid rgba(255,255,255,.1); pointer-events:none; }
.cw-hero-content { position:relative; z-index:10; }
.cw-hero-cat    { display:block; font-size:.625rem; letter-spacing:.25em; font-weight:900; color:var(--mauve); text-transform:uppercase; font-family:var(--font-mono); margin-bottom:.5rem; text-decoration:none; }
.cw-hero-cat:hover { color:#fff; }
.cw-hero-title  { font-family:var(--font-serif); font-size:clamp(1.75rem,3.5vw,2.75rem); font-weight:900; color:#fff; line-height:1.15; letter-spacing:-.025em; margin-bottom:.75rem; }
.cw-hero-author { display:flex; align-items:center; gap:.625rem; }
.cw-hero-avatar { width:1.75rem; height:1.75rem; border-radius:9999px; border:1px solid rgba(255,255,255,.2); object-fit:cover; flex-shrink:0; }
.cw-hero-author span { font-size:.75rem; font-weight:700; color:rgba(255,255,255,.9); }

.cw-hero-right { display:flex; flex-direction:column; justify-content:space-between; gap:1.5rem; }
.cw-hero-right-top { display:block; }
.cw-hero-right-img-wrap { aspect-ratio:16/10; border-radius:1rem; overflow:hidden; border:1px solid rgba(216,199,178,.2); background:#e7e2da; }
.cw-hero-right-img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.cw-hero-right-top:hover .cw-hero-right-img { transform:scale(1.02); }
.cw-hero-right-info { padding-top:.75rem; }
.cw-hero-right-title  { font-family:var(--font-serif); font-size:clamp(1rem,1.5vw,1.125rem); font-weight:900; color:var(--dark); line-height:1.25; transition:color .2s; }
.cw-hero-right-top:hover .cw-hero-right-title { color:var(--mauve); }
.cw-hero-right-author { font-size:.625rem; color:var(--brown); font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.1em; font-weight:600; margin-top:.25rem; }
.cw-hero-divider { border-top:1px solid rgba(216,199,178,.3); }
.cw-hero-right-rows { display:flex; flex-direction:column; gap:1rem; }
.cw-hero-row { display:flex; align-items:center; gap:1rem; }
.cw-hero-row-img { width:85px; height:65px; border-radius:.75rem; border:1px solid rgba(216,199,178,.2); object-fit:cover; flex-shrink:0; transition:transform .3s; }
.cw-hero-row:hover .cw-hero-row-img { transform:scale(1.02); }
.cw-hero-row-title  { font-family:var(--font-serif); font-size:.8125rem; font-weight:700; color:var(--dark); line-height:1.3; transition:color .2s; }
.cw-hero-row:hover .cw-hero-row-title { color:var(--mauve); }
.cw-hero-row-author { font-size:.5625rem; color:var(--brown); font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.1em; font-weight:600; margin-top:.125rem; }

/* ── 10. CATEGORY CARDS ─────────────────────────────────────────────── */
/* React: bg-white py-14 border-y mb-16 → 3.5rem vert padding + 4rem margin-bottom */
.cw-cats-section { background:#fff; border-top:1px solid rgba(216,199,178,.4); border-bottom:1px solid rgba(216,199,178,.4); padding-block:3.5rem; margin-bottom:4rem; }
.cw-cats-grid { display:grid; grid-template-columns:1fr; gap:1.5rem; }
@media (min-width:640px) { .cw-cats-grid { grid-template-columns:1fr 1fr; } }
@media (min-width:1024px) { .cw-cats-grid { grid-template-columns:repeat(4,1fr); } }

.cw-cat-card {
  position:relative; aspect-ratio:14/10; border-radius:1.5rem; overflow:hidden;
  border:1px solid rgba(216,199,178,.25); cursor:pointer;
  background-color:#c4bdb4; background-size:cover; background-position:center;
  transition:box-shadow .3s;
}
.cw-cat-card:hover { box-shadow:0 8px 24px rgba(0,0,0,.12); }
.cw-cat-card-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.cw-cat-card:hover .cw-cat-card-img { transform:scale(1.05); }
.cw-cat-card-overlay { position:absolute; inset:0; background:rgba(0,0,0,.35); transition:background .3s; }
.cw-cat-card:hover .cw-cat-card-overlay { background:rgba(0,0,0,.45); }
.cw-cat-card-content { position:absolute; inset:0; display:flex; align-items:flex-end; padding:1.25rem; z-index:10; }
.cw-cat-card-title { font-family:var(--font-serif); font-size:.875rem; font-weight:900; color:#fff; letter-spacing:.05em; }

/* ── 11. FASHION SECTION ────────────────────────────────────────────── */
/* React: py-8 mb-12 → 2rem vert padding + 3rem margin-bottom */
.cw-fashion-section { background:var(--cream); padding-block:2rem; margin-bottom:3rem; }

.cw-featured-card {
  background:rgba(253,251,247,.4); border-radius:1.75rem; border:1px solid rgba(216,199,178,.25);
  overflow:hidden; display:grid; grid-template-columns:1fr; box-shadow:0 1px 4px rgba(0,0,0,.04);
  transition:box-shadow .3s;
}
@media (min-width:768px) { .cw-featured-card { grid-template-columns:1fr 1fr; } }
.cw-featured-card:hover { box-shadow:0 4px 16px rgba(0,0,0,.06); }

.cw-featured-card-img-wrap { position:relative; min-height:300px; overflow:hidden; background:#e7e2da; }
@media (min-width:768px) { .cw-featured-card-img-wrap { min-height:380px; } }
.cw-featured-card-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.cw-featured-card:hover .cw-featured-card-img { transform:scale(1.01); }

.cw-featured-card-body { padding:clamp(2rem,4vw,3rem); display:flex; flex-direction:column; justify-content:center; gap:1rem; }
.cw-featured-card-title a { font-family:var(--font-serif); font-size:clamp(1.25rem,2.5vw,1.75rem); font-weight:900; color:var(--dark); line-height:1.2; display:block; transition:color .2s; }
.cw-featured-card-title a:hover { color:var(--mauve); }
.cw-featured-card-author { font-size:.6875rem; color:var(--brown); font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.1em; font-weight:500; }
.cw-featured-card-excerpt { font-size:.75rem; color:rgba(47,41,38,.75); line-height:1.7; }

.cw-sub-articles-grid { display:grid; grid-template-columns:1fr; gap:1.5rem 2rem; padding-top:2rem; border-top:1px solid rgba(216,199,178,.25); }
@media (min-width:640px) { .cw-sub-articles-grid { grid-template-columns:1fr 1fr; } }
@media (min-width:1024px) { .cw-sub-articles-grid { grid-template-columns:repeat(4,1fr); } }
.cw-sub-article { display:flex; flex-direction:column; gap:.5rem; }
.cw-sub-article-title a { font-family:var(--font-serif); font-size:.875rem; font-weight:900; color:var(--dark); line-height:1.35; display:block; transition:color .2s; }
.cw-sub-article-title a:hover { color:var(--mauve); text-decoration:underline; }
.cw-sub-article-author { font-size:.625rem; color:#78716c; font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.06em; }

/* ── 12. LIFESTYLE SECTION ──────────────────────────────────────────── */
/* React: bg-white py-16 mb-12 border-y → 4rem vert padding + 3rem margin-bottom */
.cw-lifestyle-section { background:#fff; border-top:1px solid rgba(216,199,178,.2); border-bottom:1px solid rgba(216,199,178,.2); padding-block:4rem; margin-bottom:3rem; }
.cw-lifestyle-grid { display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width:768px) { .cw-lifestyle-grid { grid-template-columns:1fr 1fr; } }

.cw-lifestyle-item { display:grid; grid-template-columns:1fr; gap:1.5rem; align-items:center; }
@media (min-width:640px) { .cw-lifestyle-item { grid-template-columns:5fr 7fr; } }

.cw-lifestyle-img-wrap { aspect-ratio:4/3; border-radius:.75rem; overflow:hidden; background:#e7e2da; }
.cw-lifestyle-img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.cw-lifestyle-img-wrap:hover .cw-lifestyle-img { transform:scale(1.02); }

.cw-lifestyle-body { display:flex; flex-direction:column; gap:.5rem; }
.cw-lifestyle-title a { font-family:var(--font-serif); font-size:clamp(1rem,1.5vw,1.125rem); font-weight:700; color:var(--dark); line-height:1.3; display:block; transition:color .2s; }
.cw-lifestyle-title a:hover { color:var(--mauve); }
.cw-lifestyle-excerpt { font-size:.75rem; color:rgba(47,41,38,.75); line-height:1.7; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ── 13. TRAVEL SLIDER ──────────────────────────────────────────────── */
/* React: py-8 mb-12 → 2rem vert padding + 3rem margin-bottom */
.cw-travel-section { background:var(--cream); padding-block:2rem; margin-bottom:3rem; }

.cw-slider {
  position:relative; border-radius:2rem; overflow:hidden;
  border:1px solid rgba(216,199,178,.3); background:#e7e2da;
  aspect-ratio:16/10;
}
@media (min-width:768px) { .cw-slider { aspect-ratio:21/9; } }

.cw-slider-track { display:flex; height:100%; transition:transform .7s ease-in-out; }
.cw-slide { position:relative; min-width:100%; height:100%; flex-shrink:0; overflow:hidden; }
.cw-slide-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none; transition:transform 1s ease; }
.cw-slider:hover .cw-slide-img { transform:scale(1.01); }
.cw-slide-overlay { position:absolute; inset:0; background:rgba(0,0,0,.55); z-index:1; }
.cw-slide-content {
  position:relative; z-index:10; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center;
  padding:clamp(3rem,6vw,4rem) clamp(2rem,6vw,5rem); color:#fff;
  width:100%; box-sizing:border-box;
}
.cw-slide-badge { padding:.25rem .875rem; background:var(--green); color:#fff; font-size:.6875rem; font-weight:700; text-transform:uppercase; letter-spacing:.2em; border-radius:9999px; margin-bottom:1rem; }
.cw-slide-title { font-family:var(--font-serif); font-size:clamp(1.1rem,4vw,2.375rem); font-weight:900; letter-spacing:-.025em; line-height:1.2; max-width:48rem; margin-bottom:1rem; word-break:break-word; overflow-wrap:break-word; width:100%; }
.cw-slide-title a { color:#fff; transition:color .3s; }
.cw-slide-title a:hover { color:var(--border); }
.cw-slide-meta { font-size:.6875rem; color:rgba(255,255,255,.8); font-weight:500; letter-spacing:.05em; margin-bottom:1.5rem; }
.cw-slide-cta {
  display:inline-flex; align-items:center; gap:.375rem; padding:.625rem 1.25rem;
  border:1px solid rgba(255,255,255,.2); border-radius:9999px; color:#fff;
  font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em;
  transition:all .3s;
}
.cw-slide-cta:hover { border-color:#fff; background:rgba(255,255,255,.1); }

.cw-slider-dots { position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%); display:flex; gap:.625rem; z-index:20; }
.cw-dot { width:.625rem; height:.625rem; border-radius:9999px; background:transparent; border:1.5px solid rgba(255,255,255,.85); transition:all .35s; padding:0; }
.cw-dot-active { background:#fff; border-color:#fff; transform:scale(1.15); }
.cw-dot:hover { background:rgba(255,255,255,.3); }

.cw-slider-prev, .cw-slider-next {
  position:absolute; top:50%; transform:translateY(-50%);
  width:2.25rem; height:2.25rem; border-radius:9999px;
  background:rgba(0,0,0,.15); color:#fff; display:flex; align-items:center; justify-content:center;
  transition:all .35s; opacity:0; z-index:20;
}
.cw-slider:hover .cw-slider-prev,
.cw-slider:hover .cw-slider-next { opacity:1; }
.cw-slider-prev { left:1rem; }
.cw-slider-next { right:1rem; }
.cw-slider-prev:hover, .cw-slider-next:hover { background:rgba(0,0,0,.35); }

/* ── 14. NEWSLETTER SECTION ─────────────────────────────────────────── */
/* React: py-16 lg:py-24 border-b → 4rem (6rem at lg) vert padding */
.cw-newsletter-section { background:#EFECE5; border-bottom:1px solid rgba(216,199,178,.4); overflow:hidden; padding-block:4rem; }
@media (min-width:1024px) { .cw-newsletter-section { padding-block:6rem; } }
.cw-newsletter-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; }
@media (min-width:1024px) { .cw-newsletter-grid { grid-template-columns:1fr 1fr; gap:4rem; } }

.cw-newsletter-copy { display:flex; flex-direction:column; gap:1.5rem; }
.cw-newsletter-heading { font-family:var(--font-serif); font-size:clamp(1.75rem,4vw,2.75rem); font-weight:900; color:var(--dark); line-height:1.15; letter-spacing:-.025em; }
.cw-nl-line { display:block; }
.cw-newsletter-subtext { font-size:.8125rem; color:var(--brown); line-height:1.7; font-family:var(--font-serif); max-width:32rem; }

.cw-nl-inline-form { display:flex; flex-direction:column; gap:1rem; max-width:28rem; }
.cw-nl-input-row { display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(216,199,178,.7); background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.04); }
@media (min-width:480px) { .cw-nl-input-row { flex-direction:row; border-radius:0; } }
.cw-nl-input { flex:1; padding:1rem 1.25rem; font-size:.75rem; font-family:var(--font-mono); color:var(--dark); background:transparent; outline:none; border:none; }
.cw-nl-input::placeholder { color:rgba(111,94,83,.6); }

.cw-nl-consent { display:flex; align-items:flex-start; gap:.625rem; cursor:pointer; }
.cw-nl-consent input { margin-top:.125rem; accent-color:var(--red); }
.cw-nl-consent span { font-size:.6875rem; color:rgba(111,94,83,.85); line-height:1.4; }

/* CF7 inside newsletter */
.cw-newsletter-cf7-wrap .wpcf7-form { display:flex; flex-direction:column; gap:.75rem; max-width:28rem; }
.cw-newsletter-cf7-wrap input[type=email] { width:100%; padding:1rem 1.25rem; border:1px solid rgba(216,199,178,.7); background:#fff; font-size:.75rem; outline:none; font-family:var(--font-mono); }
.cw-newsletter-cf7-wrap input[type=submit] { background:var(--red); color:#fff; font-size:.6875rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; padding:1rem 2rem; border:none; cursor:pointer; font-family:var(--font-mono); transition:background .2s; }
.cw-newsletter-cf7-wrap input[type=submit]:hover { background:#D62828; }

/* Device mockups */
.cw-newsletter-mockups { display:flex; justify-content:center; align-items:center; }
.cw-mockup-wrap { position:relative; width:100%; max-width:480px; aspect-ratio:16/10.5; }
.cw-mockup-laptop {
  width:82%; aspect-ratio:16/10; background:linear-gradient(to bottom,#1a1311,#251e1c);
  border-radius:1rem; padding:.5rem .5rem .25rem; border:1px solid rgba(255,255,255,.05);
  box-shadow:0 20px 48px rgba(0,0,0,.3); transition:transform .5s;
}
.cw-mockup-laptop:hover { transform:scale(1.01); }
.cw-mockup-laptop .cw-mockup-screen { width:100%; height:100%; border-radius:.5rem; overflow:hidden; background:#FAF9F5; position:relative; }
.cw-mockup-laptop .cw-mockup-screen img { width:100%; height:100%; object-fit:cover; filter:brightness(.95); }
.cw-mockup-base { position:absolute; bottom:-.625rem; left:8%; width:84%; height:.625rem; background:#3a302d; border-radius:0 0 .75rem .75rem; box-shadow:0 4px 8px rgba(0,0,0,.2); border-top:1px solid rgba(255,255,255,.05); }

.cw-mockup-phone {
  position:absolute; left:-2%; bottom:-10%; width:24%; aspect-ratio:9/18.5;
  background:#1a1311; border-radius:1.5rem; padding:.375rem;
  box-shadow:0 20px 48px rgba(0,0,0,.3); border:1px solid rgba(255,255,255,.1); z-index:20;
  transition:transform .5s;
}
.cw-mockup-phone:hover { transform:scale(1.05); }
.cw-mockup-phone .cw-mockup-screen { width:100%; height:100%; border-radius:1.125rem; overflow:hidden; background:#FAF9F5; }
.cw-mockup-phone .cw-mockup-screen img { width:100%; height:100%; object-fit:cover; filter:brightness(.9); }

.cw-mockup-tablet {
  position:absolute; right:-4%; bottom:-5%; width:38%; aspect-ratio:3/4.2;
  background:#1a1311; border-radius:1.375rem; padding:.5rem;
  box-shadow:0 20px 48px rgba(0,0,0,.3); border:1px solid rgba(255,255,255,.1); z-index:10;
  transition:transform .5s;
}
.cw-mockup-tablet:hover { transform:scale(1.03); }
.cw-mockup-tablet .cw-mockup-screen { width:100%; height:100%; border-radius:.75rem; overflow:hidden; background:#FAF9F5; }
.cw-mockup-tablet .cw-mockup-screen img { width:100%; height:100%; object-fit:cover; filter:brightness(.9); }

/* ── 15. BEAUTY SECTION ─────────────────────────────────────────────── */
/* React: py-16 → 4rem vert padding */
.cw-beauty-section { background:var(--cream); border-top:1px solid rgba(216,199,178,.4); padding-block:4rem; }
.cw-beauty-grid { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem 1.5rem; justify-items:center; }
@media (min-width:768px) { .cw-beauty-grid { grid-template-columns:repeat(4,1fr); } }

.cw-beauty-item { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.75rem; }
.cw-beauty-circle {
  width:clamp(7rem,12vw,11rem); height:clamp(7rem,12vw,11rem);
  border-radius:9999px; overflow:hidden; background:#fff;
  border:1px solid rgba(216,199,178,.4); position:relative;
  box-shadow:0 2px 8px rgba(0,0,0,.06); transition:box-shadow .3s;
}
.cw-beauty-item:hover .cw-beauty-circle { box-shadow:0 6px 20px rgba(0,0,0,.1); }
.cw-beauty-img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.cw-beauty-item:hover .cw-beauty-img { transform:scale(1.05); }
.cw-beauty-overlay { position:absolute; inset:0; background:rgba(0,0,0,.05); transition:background .3s; }
.cw-beauty-item:hover .cw-beauty-overlay { background:transparent; }
.cw-beauty-title { font-family:var(--font-serif); font-size:.8125rem; font-weight:900; color:var(--dark); line-height:1.35; max-width:180px; transition:color .2s; }
.cw-beauty-item:hover .cw-beauty-title { color:var(--mauve); }

/* ── 16. ARCHIVE PAGE ───────────────────────────────────────────────── */
div.cw-archive { padding-block:3rem; }
.cw-archive-banner {
  background:rgba(111,94,83,.15); padding:2rem clamp(1.5rem,4vw,3rem);
  border-radius:2rem; border:1px solid rgba(216,199,178,.45); margin-bottom:3rem;
  display:flex; flex-direction:column; gap:1.5rem;
}
@media (min-width:768px) { .cw-archive-banner { flex-direction:row; align-items:center; justify-content:space-between; } }
.cw-archive-eyebrow { display:block; font-size:.6875rem; font-weight:700; color:var(--mauve); text-transform:uppercase; letter-spacing:.2em; font-family:var(--font-mono); margin-bottom:.25rem; }
.cw-archive-title { font-family:var(--font-serif); font-size:2.5rem; font-weight:900; color:var(--dark); }
.cw-archive-desc { font-size:.75rem; color:rgba(47,41,38,.7); margin-top:.5rem; max-width:32rem; }
.cw-archive-back { display:inline-flex; align-items:center; gap:.5rem; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; border:1px solid rgba(111,94,83,.3); color:var(--dark); padding:.625rem 1.25rem; border-radius:9999px; transition:border-color .2s; white-space:nowrap; text-decoration:none; }
.cw-archive-back:hover { border-color:var(--brown); }

.cw-archive-grid { display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width:768px) { .cw-archive-grid { grid-template-columns:1fr 1fr; } }

.cw-archive-card { background:#fff; border-radius:1.5rem; overflow:hidden; border:1px solid rgba(216,199,178,.2); box-shadow:0 1px 4px rgba(0,0,0,.04); transition:box-shadow .3s; }
.cw-archive-card:hover { box-shadow:0 6px 20px rgba(0,0,0,.08); }
.cw-archive-card-img-wrap { aspect-ratio:16/9; overflow:hidden; background:#e7e2da; display:block; }
.cw-archive-card-img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.cw-archive-card:hover .cw-archive-card-img { transform:scale(1.02); }
.cw-archive-card-body { padding:2rem; display:flex; flex-direction:column; gap:1rem; }
.cw-archive-card-meta { display:flex; align-items:center; gap:.75rem; }
.cw-archive-cat-label { font-size:.75rem; font-weight:700; color:var(--mauve); text-decoration:none; }
.cw-archive-cat-label:hover { text-decoration:underline; }
.cw-archive-card-title a { font-family:var(--font-serif); font-size:1.25rem; font-weight:700; color:var(--dark); display:block; line-height:1.3; transition:color .2s; }
.cw-archive-card:hover .cw-archive-card-title a { color:var(--mauve); }
.cw-archive-card-excerpt { font-size:.75rem; color:#78716c; line-height:1.7; }
.cw-archive-card-footer { padding-top:1rem; border-top:1px solid rgba(0,0,0,.05); display:flex; align-items:center; justify-content:space-between; }
.cw-archive-author { font-size:.625rem; text-transform:uppercase; font-family:var(--font-mono); font-weight:700; color:var(--brown); letter-spacing:.1em; }
.cw-read-dialogue { display:inline-flex; align-items:center; gap:.25rem; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--mauve); transition:color .2s; }
.cw-read-dialogue:hover { color:var(--brown); }

.cw-pagination { margin-top:3rem; }
.cw-pagination .nav-links { display:flex; align-items:center; justify-content:center; gap:.75rem; flex-wrap:wrap; }
.cw-pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; width:2.5rem; height:2.5rem; border-radius:9999px; font-size:.8125rem; font-weight:600; color:var(--dark); border:1px solid var(--border); transition:all .2s; }
.cw-pagination .page-numbers.current { background:var(--brown); color:#fff; border-color:var(--brown); }
.cw-pagination .page-numbers:hover:not(.current) { border-color:var(--brown); color:var(--brown); }
.cw-pagination .prev, .cw-pagination .next { width:auto; padding-inline:1.25rem; font-size:.75rem; }
.cw-no-posts { text-align:center; padding:3rem; color:var(--brown); font-family:var(--font-serif); font-size:1.125rem; }

/* ── 17. SINGLE POST ────────────────────────────────────────────────── */
.cw-single { padding-block:3rem; }
.cw-back-bar { padding-bottom:1rem; border-bottom:1px solid rgba(216,199,178,.2); margin-bottom:2rem; }
.cw-back-link { display:inline-flex; align-items:center; gap:.5rem; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--brown); transition:color .2s; }
.cw-back-link:hover { color:var(--mauve); }

.cw-single-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:start; }
@media (min-width:1280px) { .cw-single-grid { grid-template-columns:8fr 4fr; } }

/* Matches React space-y-8 — gaps between meta block, hero image, and body */
article.cw-single-main { display:flex; flex-direction:column; gap:2rem; }

.cw-single-meta { display:flex; flex-direction:column; gap:1rem; }
.cw-single-cat-pill { display:inline-block; padding:.25rem .75rem; background:rgba(191,165,160,.15); color:var(--mauve); font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.2em; border-radius:9999px; font-family:var(--font-mono); align-self:flex-start; text-decoration:none; }
.cw-single-cat-pill:hover { background:rgba(191,165,160,.3); }
.cw-single-title { font-family:var(--font-serif); font-size:clamp(1.75rem,4vw,2.625rem); font-weight:900; color:var(--dark); line-height:1.15; letter-spacing:-.025em; }
.cw-single-author-row { display:flex; align-items:center; gap:.75rem; }
.cw-single-author-avatar { width:2.75rem; height:2.75rem; border-radius:9999px; border:1px solid rgba(191,165,160,.2); object-fit:cover; }
.cw-single-author-name { font-size:.75rem; font-weight:900; color:#1f2937; }
.cw-single-author-role { font-size:.625rem; color:var(--brown); font-weight:700; text-transform:uppercase; letter-spacing:.1em; }

.cw-single-hero-img { aspect-ratio:16/10; border-radius:1.75rem; overflow:hidden; border:1px solid rgba(216,199,178,.3); background:#e7e2da; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.cw-single-hero-img-tag { width:100%; height:100%; object-fit:cover; }

.cw-single-content { display:flex; flex-direction:column; gap:1.5rem; }
.cw-single-lead { font-family:var(--font-serif); font-size:1.125rem; font-weight:500; color:rgba(47,41,38,.95); line-height:1.7; }
.cw-single-lead::first-letter { font-size:3rem; font-family:var(--font-serif); font-weight:900; color:var(--mauve); float:left; margin-right:.75rem; line-height:.8; }
.cw-single-body { font-size:.9375rem; color:rgba(47,41,38,.8); line-height:1.8; }
.cw-single-body p { margin-bottom:1rem; }
.cw-single-body h2, .cw-single-body h3 { font-family:var(--font-serif); font-weight:700; color:var(--dark); margin-bottom:.5rem; margin-top:1.5rem; }
.cw-single-body ul, .cw-single-body ol { padding-left:1.5rem; margin-bottom:1rem; }
.cw-single-body ul { list-style:disc; }
.cw-single-body ol { list-style:decimal; }

.cw-pullquote { background:rgba(111,94,83,.08); padding:clamp(1.5rem,3vw,2rem); border-radius:1rem; border-left:4px solid var(--brown); font-style:italic; font-size:.875rem; font-weight:500; color:rgba(47,41,38,.9); line-height:1.6; }

.cw-author-bio { display:flex; flex-direction:column; align-items:center; text-align:center; gap:1.5rem; padding:clamp(1.5rem,3vw,2rem); background:#fff; border-radius:1rem; border:1px solid rgba(216,199,178,.3); margin-top:2rem; }
@media (min-width:640px) { .cw-author-bio { flex-direction:row; text-align:left; } }
.cw-author-bio-avatar { width:4rem; height:4rem; border-radius:9999px; border:1px solid rgba(191,165,160,.3); object-fit:cover; flex-shrink:0; }
.cw-author-bio-label { display:block; font-size:.5625rem; text-transform:uppercase; letter-spacing:.2em; color:var(--mauve); font-family:var(--font-mono); font-weight:700; }
.cw-author-bio-name { font-family:var(--font-serif); font-size:1rem; font-weight:900; color:var(--dark); margin-block:.25rem; }
.cw-author-bio-desc { font-size:.75rem; color:rgba(47,41,38,.75); line-height:1.6; }

/* ── 18. SIDEBAR ────────────────────────────────────────────────────── */
.cw-sidebar { display:flex; flex-direction:column; gap:2rem; }
@media (min-width:1024px) { .cw-sidebar { position:sticky; top:6rem; } }

.cw-sidebar-card { background:#fff; padding:clamp(1.5rem,3vw,2rem); border-radius:1.5rem; border:1px solid rgba(216,199,178,.4); box-shadow:0 1px 4px rgba(0,0,0,.04); }

.cw-sidebar-nl-icon { width:2.5rem; height:2.5rem; border-radius:9999px; background:rgba(191,165,160,.15); display:flex; align-items:center; justify-content:center; margin-bottom:.75rem; color:var(--mauve); }
.cw-sidebar-nl-title { font-family:var(--font-serif); font-size:1rem; font-weight:900; color:var(--dark); margin-bottom:.25rem; }
.cw-sidebar-nl-sub { font-size:.75rem; color:#6b7280; margin-bottom:.75rem; }
.cw-sidebar-input { width:100%; font-size:.75rem; padding:.75rem 1rem; border-radius:.75rem; border:1px solid rgba(216,199,178,.4); background:var(--cream); outline:none; font-family:var(--font-sans); margin-bottom:.5rem; transition:border-color .2s; }
.cw-sidebar-input:focus { border-color:var(--mauve); }

/* CF7 in sidebar */
.cw-sidebar-newsletter .wpcf7-form { display:flex; flex-direction:column; gap:.5rem; }
.cw-sidebar-newsletter input[type=email] { width:100%; padding:.75rem 1rem; border-radius:.75rem; border:1px solid rgba(216,199,178,.4); background:var(--cream); font-size:.75rem; outline:none; }
.cw-sidebar-newsletter input[type=submit] { background:var(--brown); color:var(--cream); font-size:.625rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; padding:.75rem; border-radius:.75rem; border:none; cursor:pointer; width:100%; transition:background .2s; }
.cw-sidebar-newsletter input[type=submit]:hover { background:var(--dark); }

.cw-sidebar-eyebrow { display:block; font-size:.5625rem; text-transform:uppercase; letter-spacing:.2em; color:var(--brown); font-family:var(--font-mono); font-weight:700; margin-bottom:.125rem; }
.cw-sidebar-recent-title { font-family:var(--font-serif); font-size:1rem; font-weight:900; color:var(--dark); margin-bottom:1.5rem; }
.cw-sidebar-recent-list { display:flex; flex-direction:column; gap:1rem; }
.cw-sidebar-post { display:flex; align-items:flex-start; gap:.75rem; }
.cw-sidebar-post-img { width:4rem; height:4rem; border-radius:.5rem; overflow:hidden; background:#e7e2da; flex-shrink:0; display:block; }
.cw-sidebar-post-img img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.cw-sidebar-post-img:hover img { transform:scale(1.05); }
.cw-sidebar-post-cat { display:block; font-size:.5625rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700; color:var(--mauve); margin-bottom:.25rem; text-decoration:none; }
.cw-sidebar-post-cat:hover { text-decoration:underline; }
.cw-sidebar-post-title { font-family:var(--font-serif); font-size:.75rem; font-weight:900; color:var(--dark); line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.cw-sidebar-post-title a { color:inherit; text-decoration:none; transition:color .2s; }
.cw-sidebar-post-title a:hover { color:var(--brown); }

/* ── 19. ABOUT PAGE ─────────────────────────────────────────────────── */
.cw-about { padding-block:3rem; }
.cw-about-container { max-width:72rem; margin-inline:auto; padding-inline:var(--px); }

.cw-about-banner {
  position:relative; height:clamp(200px,30vw,280px); border-radius:1.5rem; overflow:hidden;
  display:flex; align-items:center; justify-content:center; margin-bottom:3rem;
  background-size:cover; background-position:center;
  border:1px solid rgba(216,199,178,.3); box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.cw-about-banner-overlay { position:absolute; inset:0; background:rgba(47,41,38,.25); mix-blend-mode:multiply; }
.cw-about-banner-content { position:relative; z-index:10; text-align:center; }
.cw-about-banner-eyebrow { display:block; font-size:.625rem; text-transform:uppercase; letter-spacing:.2em; color:var(--cream); font-weight:700; font-family:var(--font-mono); margin-bottom:.5rem; }
.cw-about-banner-title { font-family:var(--font-serif); font-size:clamp(2rem,5vw,3rem); font-weight:900; color:#fff; letter-spacing:.05em; }

.cw-about-story-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:stretch; }
@media (min-width:1024px) { .cw-about-story-grid { grid-template-columns:5fr 7fr; gap:4rem; } }

.cw-about-img-col { padding-top:1rem; display:flex; flex-direction:column; }
@media (min-width:1024px) { .cw-about-img-col { padding-top:0; } }
.cw-about-img-frame { position:relative; flex:1; display:flex; flex-direction:column; }
.cw-about-img-border { position:absolute; inset:-.75rem; border-radius:2.375rem; border:2px solid rgba(138,154,134,.25); transform:translate(.75rem,1rem); pointer-events:none; }
.cw-about-img-wrap { flex:1; min-height:300px; border-radius:2rem; overflow:hidden; background:#e7e2da; border:1px solid rgba(216,199,178,.3); box-shadow:0 8px 24px rgba(0,0,0,.1); position:relative; z-index:10; }
.cw-about-img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.cw-about-img-wrap:hover .cw-about-img { transform:scale(1.03); }
.cw-about-img-caption { font-size:.6875rem; color:#a8a29e; font-style:italic; text-align:center; font-family:var(--font-serif); margin-top:1.5rem; }

.cw-about-story-col { display:flex; flex-direction:column; gap:2rem; }
.cw-about-story-intro { display:flex; flex-direction:column; gap:.75rem; }
.cw-about-badge { display:inline-block; font-size:.625rem; text-transform:uppercase; letter-spacing:.2em; color:#8A9A86; background:rgba(138,154,134,.1); padding:.25rem .75rem; border-radius:9999px; font-weight:700; font-family:var(--font-mono); align-self:flex-start; }
.cw-about-story-heading { font-family:var(--font-serif); font-size:clamp(1.75rem,3.5vw,2.5rem); font-weight:900; color:var(--dark); line-height:1.15; }
.cw-about-story-body { font-size:.875rem; color:#57534e; line-height:1.8; display:flex; flex-direction:column; gap:1rem; }
.cw-about-story-body p { margin:0; }
.cw-about-story-body p:first-child::first-letter { font-size:2.5rem; font-family:var(--font-serif); font-weight:900; color:#8A9A86; float:left; margin-right:.5rem; line-height:.9; }

/* Cards: stacked vertically, each card horizontal (icon left + text right) — matches React */
.cw-about-cards { display:flex; flex-direction:column; gap:1rem; border-top:1px solid rgba(216,199,178,.2); padding-top:1rem; }
.cw-about-card { background:#FDFBF7; border:1px solid rgba(216,199,178,.3); border-radius:1rem; padding:1.5rem; display:flex; flex-direction:row; gap:1.25rem; align-items:flex-start; box-shadow:0 1px 3px rgba(0,0,0,.04); transition:box-shadow .3s; }
.cw-about-card:hover { box-shadow:0 2px 8px rgba(0,0,0,.07); }
.cw-about-card-icon { width:2.5rem; height:2.5rem; border-radius:.75rem; border:1px solid rgba(138,154,134,.3); background:rgba(138,154,134,.05); display:flex; align-items:center; justify-content:center; color:#8A9A86; flex-shrink:0; margin-top:.125rem; }
.cw-about-card-text { display:flex; flex-direction:column; gap:.25rem; }
.cw-about-card-title { font-family:var(--font-serif); font-size:.875rem; font-weight:900; color:var(--dark); }
.cw-about-card-body { font-size:.75rem; color:#57534e; line-height:1.7; }

/* ── 20. CONTACT PAGE ───────────────────────────────────────────────── */
.cw-contact { padding-block:3rem; }

/* Grid: form (7 parts) | image (5 parts) — matches React lg:col-span-7 / lg:col-span-5 */
.cw-contact-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:start; }
@media (min-width:768px) { .cw-contact-grid { grid-template-columns:7fr 5fr; align-items:stretch; } }

/* Form column */
.cw-contact-form-col { display:flex; flex-direction:column; gap:1.5rem; }
.cw-contact-form-header { display:flex; flex-direction:column; gap:.375rem; }
.cw-contact-eyebrow { display:block; font-size:.625rem; text-transform:uppercase; letter-spacing:.2em; color:var(--mauve); font-weight:700; font-family:var(--font-mono); }
.cw-contact-heading { font-family:var(--font-serif); font-size:clamp(1.75rem,3.5vw,2.5rem); font-weight:900; color:var(--dark); margin-top:.25rem; }
.cw-contact-subheading { font-size:.75rem; color:rgba(47,41,38,.6); line-height:1.7; margin-top:.25rem; }

/* Form card wrapper — white card with border + shadow matching React */
.cw-contact-form-area { position:relative; }
.cw-contact-form { display:flex; flex-direction:column; gap:1.25rem; }
.cw-contact-form-card {
  background:#fff;
  padding:1.5rem;
  border-radius:1.5rem;
  border:1px solid rgba(216,199,178,.4);
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}
@media (min-width:768px) { .cw-contact-form-card { padding:2rem; } }

/* Contact success state */
.cw-contact-success { display:flex; flex-direction:column; align-items:center; text-align:center; gap:1rem; padding:2.5rem 2rem; background:#fff; border-radius:1.5rem; border:1px solid rgba(216,199,178,.4); box-shadow:0 1px 3px rgba(0,0,0,.04); }
.cw-contact-success-icon { width:4rem; height:4rem; border-radius:9999px; background:rgba(111,94,83,.12); display:flex; align-items:center; justify-content:center; }
.cw-contact-success-title { font-family:var(--font-serif); font-size:1.125rem; font-weight:700; color:var(--dark); margin:0; }
.cw-contact-success-body { font-size:.8125rem; color:#6b7280; max-width:24rem; line-height:1.7; margin:0; }
.cw-contact-reset { margin-top:.5rem; font-size:.625rem; letter-spacing:.12em; padding:.75rem 1.75rem; border:none; cursor:pointer; }

/* 2-column name + email row */
.cw-contact-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:639px) { .cw-contact-row-2 { grid-template-columns:1fr; } }

/* Fields */
.cw-contact-field { display:flex; flex-direction:column; gap:.375rem; }
.cw-contact-field label { font-size:.625rem; font-weight:700; color:var(--dark); text-transform:uppercase; letter-spacing:.08em; }
.cw-contact-field label span { color:var(--red); }
.cw-contact-field input,
.cw-contact-field textarea {
  width:100%; padding:.75rem 1rem; border:1px solid rgba(216,199,178,.4);
  border-radius:.75rem; background:var(--cream); color:var(--dark);
  font-size:.75rem; font-family:var(--font-sans); outline:none;
  transition:border-color .2s, box-shadow .2s;
}
.cw-contact-field input:focus,
.cw-contact-field textarea:focus { border-color:var(--mauve); box-shadow:0 0 0 2px rgba(191,165,160,.2); }
.cw-contact-field textarea { resize:none; min-height:120px; }

/* Submit button — full width, rounded-xl (not pill) */
.cw-contact-submit {
  width:100%;
  align-self:stretch;
  padding:.75rem 1rem;
  border-radius:.75rem !important;
  gap:.5rem;
  justify-content:center;
}

/* Image column */
.cw-contact-img-col { display:flex; flex-direction:column; }
.cw-contact-img-wrap {
  position:relative;
  min-height:350px;
  border-radius:2rem;
  overflow:hidden;
  background:#e7e2da;
  border:1px solid rgba(216,199,178,.4);
  box-shadow:0 1px 3px rgba(0,0,0,.05);
}
/* On tablet/desktop the image column stretches to match form height */
@media (min-width:768px) {
  .cw-contact-img-col { flex:1; }
  .cw-contact-img-wrap { flex:1; min-height:550px; }
}
.cw-contact-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.5s; }
.cw-contact-img-wrap:hover .cw-contact-img { transform:scale(1.02); }

/* Image overlay — gradient + caption */
.cw-contact-img-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,.1) 40%, transparent);
  display:flex; align-items:flex-end; padding:2rem;
  pointer-events:none;
}
.cw-contact-img-caption h3 { font-family:var(--font-serif); font-size:1.125rem; font-weight:700; color:#fff; }
.cw-contact-img-caption p { font-size:.75rem; color:#d1d5db; margin-top:.375rem; }

/* ── 21. LEGAL PAGE ─────────────────────────────────────────────────── */
/* Legal Pages — matches React design (max-w-4xl / py-16 / text-3xl hierarchy) */
.cw-legal { padding-block:4rem; }

/* Narrow container (max-w-4xl = 56rem) so back button aligns with left edge of card */
.cw-legal-container { max-width:56rem; margin-inline:auto; padding-inline:var(--px); }

/* Back button: text-xs font-bold uppercase tracking-wider text-[#6F5E53] */
.cw-legal-back {
    display:inline-flex; align-items:center; gap:.5rem;
    font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
    color:var(--brown); transition:color .2s; margin-bottom:2rem;
}
.cw-legal-back:hover { color:var(--mauve); }

/* Card: bg-white p-8 md:p-14 rounded-[32px] border border-[#D8C7B2]/40 shadow-xs */
.cw-legal-card {
    background:#fff; border-radius:2rem;
    border:1px solid rgba(216,199,178,.4);
    padding:clamp(2rem,5vw,3.5rem);
    box-shadow:0 1px 3px rgba(0,0,0,.04);
}

/* Header: just the h1 — no border here, border sits below the intro paragraph */
.cw-legal-header { margin-bottom:0; }

/* H1: text-3xl font-serif font-black text-[#2F2926] */
.cw-legal-title { font-family:var(--font-serif); font-size:1.875rem; font-weight:900; color:var(--dark); margin-bottom:0; }

/* Content wrapper */
.cw-legal-content { line-height:1.8; }

/* Intro paragraph: text-xs italic font-serif text-gray-500 — GETS the border-bottom below it */
.cw-legal-content .cw-legal-intro,
.cw-legal-content > p:first-child {
    font-size:.75rem; color:#6b7280; font-style:italic;
    font-family:var(--font-serif); margin-top:.5rem;
    padding-bottom:1.5rem; margin-bottom:2rem;
    border-bottom:1px solid rgba(0,0,0,.05);
    padding-left:0;
}

/* Section headings: font-serif text-base font-black text-gray-800 */
.cw-legal-content h2 { font-family:var(--font-serif); font-size:1rem; font-weight:900; color:#1f2937; margin-bottom:.5rem; margin-top:2rem; }
.cw-legal-content h3 { font-family:var(--font-serif); font-weight:700; color:var(--dark); margin-bottom:.5rem; margin-top:1.5rem; }

/* Body text: text-sm font-sans pl-1 — neutral gray matching React design */
.cw-legal-content p { font-size:.875rem; color:#4b5563; margin-bottom:.875rem; padding-left:.25rem; line-height:1.75; }
.cw-legal-content ul, .cw-legal-content ol { padding-left:1.5rem; margin-bottom:1rem; font-size:.875rem; color:#4b5563; }
.cw-legal-content ul { list-style:disc; }
/* Links inside legal content — inherit surrounding text color, no blue hyperlink */
.cw-legal-content a { color:inherit; text-decoration:underline; }
.cw-legal-content a:hover { color:var(--brown); }

/* ── 22. FORMS — SUCCESS STATE ──────────────────────────────────────── */
.cw-form-success { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.5rem; padding:1.5rem; background:rgba(255,255,255,.6); border:1px solid rgba(191,165,160,.2); border-radius:1rem; }
.cw-form-success svg { margin-bottom:.25rem; }
.cw-form-success p, .cw-form-success small { font-size:.75rem; color:#6b7280; }

/* Homepage newsletter success */
.cw-nl-success { flex-direction:column; text-align:left; padding:1.5rem; background:rgba(255,255,255,.8); backdrop-filter:blur(12px); border-radius:1rem; border:1px solid rgba(216,199,178,.4); max-width:28rem; gap:.5rem; }
.cw-nl-success-check { display:flex; align-items:center; gap:.75rem; }
.cw-nl-success-title { font-family:var(--font-serif); font-size:.875rem; font-weight:700; color:var(--dark); }
.cw-nl-success-body { font-family:var(--font-serif); font-size:.75rem; color:#6F5E53; margin:0; }

/* Sidebar newsletter success */
.cw-sidebar-success { background:rgba(111,94,83,.15); border-radius:.75rem; border:1px solid rgba(216,199,178,.4); padding:1rem; text-align:center; }
.cw-sidebar-success-title { font-size:.75rem; font-weight:900; color:var(--dark); margin:0; }

/* ── 23. FOOTER ─────────────────────────────────────────────────────── */
.cw-footer { background:var(--dark); color:#fff; padding-top:4rem; padding-bottom:2rem; padding-inline:var(--px); position:relative; font-family:var(--font-sans); border-top:1px solid rgba(255,255,255,.05); }
footer::selection, footer *::selection { background-color:var(--mauve)!important; color:var(--dark)!important; }

.cw-footer-wave { position:absolute; top:0; left:0; width:100%; overflow:hidden; transform:translateY(-100%); }
.cw-footer-wave svg { display:block; width:100%; height:15px; transform:scaleY(-1); }

.cw-footer-inner { max-width:var(--max-w); margin-inline:auto; }
.cw-footer-grid { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem 4rem; padding-bottom:3rem; border-bottom:1px solid rgba(255,255,255,.1); }
@media (min-width:768px)  { .cw-footer-grid { grid-template-columns:repeat(2,1fr) repeat(2,auto); } }
@media (min-width:1024px) { .cw-footer-grid { grid-template-columns:5fr 3fr 2fr 2fr; gap:2.5rem 4rem; } }

.cw-footer-logo { display:block; font-family:var(--font-serif); font-size:1.5rem; font-weight:900; text-transform:uppercase; letter-spacing:-.025em; color:#fff; transition:color .2s; }
.cw-footer-logo:hover { color:var(--mauve); }
.cw-footer-tagline { color:#9ca3af; font-size:.875rem; line-height:1.6; max-width:20rem; margin-block:.75rem 1.25rem; }

.cw-social-icons { display:flex; align-items:center; gap:.875rem; }
.cw-social-icon { width:2.25rem; height:2.25rem; border-radius:9999px; background:rgba(255,255,255,.05); display:flex; align-items:center; justify-content:center; color:#d1d5db; transition:all .2s; }
.cw-social-icon:hover { background:var(--mauve); color:var(--dark); }

.cw-footer-col-title { font-size:.75rem; text-transform:uppercase; letter-spacing:.2em; color:var(--mauve); font-weight:900; margin-bottom:1rem; }
.cw-footer-links { display:flex; flex-direction:column; gap:.625rem; }
.cw-footer-links li a { color:#d1d5db; font-size:.875rem; transition:color .2s; }
.cw-footer-links li a:hover { color:var(--mauve); }

.cw-trustpilot { display:flex; flex-direction:column; gap:.75rem; }
.cw-tp-header { display:flex; align-items:center; gap:.5rem; }
.cw-tp-brand { font-weight:700; font-size:1.5rem; color:#fff; letter-spacing:-.025em; line-height:1; }
.cw-tp-stars { display:flex; align-items:center; gap:.375rem; }
.cw-tp-star { width:2.25rem; height:2.25rem; background:#00b67a; display:flex; align-items:center; justify-content:center; border-radius:.125rem; }

.cw-footer-bottom { padding-top:2rem; display:flex; flex-direction:column; align-items:center; gap:1rem; text-align:center; font-size:.75rem; color:#6b7280; }
@media (min-width:640px) { .cw-footer-bottom { flex-direction:row; justify-content:space-between; text-align:left; } }
.cw-footer-copy { display:flex; align-items:center; gap:.25rem; flex-wrap:wrap; }
.cw-heart-icon { flex-shrink:0; }
.cw-back-to-top { display:inline-flex; align-items:center; gap:.375rem; color:#9ca3af; transition:color .2s; font-size:.75rem; border:1px solid rgba(255,255,255,.1); padding:.375rem .75rem; border-radius:9999px; }
.cw-back-to-top:hover { color:#fff; }

/* ── 24. LANGUAGE SWITCHER ───────────────────────────────────────────── */
.cw-lang-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.cw-lang-trigger {
    display: flex; align-items: center; gap: .45rem;
    background: none; border: none; border-radius: 0;
    padding: .25rem .1rem; cursor: pointer;
    font-size: .6875rem; font-family: var(--font-sans);
    font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
    color: var(--dark); white-space: nowrap;
    transition: color .2s;
}
.cw-lang-trigger:hover,
.cw-lang-switcher:hover .cw-lang-trigger,
.cw-lang-switcher.open .cw-lang-trigger {
    color: var(--brown);
}
.cw-lang-arrow {
    transition: transform .3s cubic-bezier(.16,1,.3,1);
    flex-shrink: 0;
    color: var(--mauve);
}
.cw-lang-switcher:hover .cw-lang-arrow,
.cw-lang-switcher.open .cw-lang-arrow { transform: rotate(180deg); }

.cw-lang-dropdown {
    position: absolute; top: calc(100% + 10px); right: 0;
    background: #fff; border: 1px solid var(--border); border-radius: 8px;
    padding: .375rem 0; min-width: 170px;
    box-shadow: 0 16px 40px rgba(47,41,38,.11), 0 2px 8px rgba(47,41,38,.05);
    list-style: none; margin: 0; z-index: 9999;
    opacity: 0;
    transform: translateY(-5px);
    pointer-events: none;
    transition: opacity .22s cubic-bezier(.16,1,.3,1), transform .22s cubic-bezier(.16,1,.3,1);
}
.cw-lang-switcher:hover .cw-lang-dropdown,
.cw-lang-switcher.open .cw-lang-dropdown {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
}
/* invisible bridge so moving mouse to dropdown doesn't close it */
.cw-lang-dropdown::before {
    content: ''; position: absolute; top: -10px; left: 0; right: 0; height: 10px;
}
.cw-lang-item { }
.cw-lang-item a {
    display: flex; align-items: center; gap: .65rem;
    padding: .55rem 1rem; text-decoration: none;
    font-size: .75rem; font-family: var(--font-sans);
    font-weight: 500; letter-spacing: .04em; text-transform: uppercase;
    color: var(--dark); transition: background .15s, color .15s;
}
.cw-lang-item a:hover { background: rgba(191,165,160,.12); color: var(--brown); }
.cw-lang-item.cw-lang-active a {
    background: rgba(191,165,160,.18);
    color: var(--brown); font-weight: 700;
}
.cw-lang-item a img { border-radius: 2px; flex-shrink: 0; }
.cw-lang-name { display: none; }
@media (min-width: 1024px) { .cw-lang-name { display: inline; } }

/* ── 25. RESPONSIVE UTILITIES ───────────────────────────────────────── */
@media (max-width:767px) {
  .cw-single-grid { gap:2rem; }
  /* .cw-about-cards is now flex flex-col — no grid override needed */
  .cw-footer-grid { grid-template-columns:1fr; gap:2rem; }
}