/* ═══════════════════════════════════════════════════════════
   LINEN — V3 config.css
   ───────────────────────────────────────────────────────────
   The design controller: V3 --cp-* tokens ONLY (no selectors).
   Minimalist / warm / editorial. Lora (serif) + Lato (sans),
   warm taupe on soft white, softly-squared 4px radius, a light
   photography-forward hero under a transparent header.
   Loaded AFTER core.v3.min.css; overrides only the values below.

   Ports Linen v2. Every v2 per-component selector collapses to a
   token here — the taupe-button fix is just --cp-on-primary, the
   taupe stat numbers just --cp-stat-number-color, the italic <em>
   accent just --cp-emphasis-color + --cp-emphasis-style:italic.
   ═══════════════════════════════════════════════════════════ */

@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400&family=Lora:ital,wght@0,400..700;1,400..700&display=swap");
/* Pill hero search-bar module (reads the --cover-search-* vars below). */
@import url("https://kunversion-frontend-custom.s3.amazonaws.com/components/main/modules/search-bar/pill.ps.css");

:root {
  /* ── Fonts ─────────────────────────────────────────── */
  --cp-heading-font: "Lora", Georgia, serif;
  --cp-text-font: "Lato", system-ui, sans-serif;

  /* ── Brand ─────────────────────────────────────────── */
  --cp-primary: #9e8570; /* warm taupe — buttons / links / accents */
  --cp-accent: #c8ae8e; /* light sand — hover/active */
  --cp-on-primary: #ffffff;
  --cp-radius: 4px;

  /* ── Scroll-reveal ── */
  --cp-reveal-scale: 1;
  --cp-reveal-duration: 0.9s;
  --cp-reveal-stagger: 0.14s;
  --cp-reveal-easing: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --cp-reveal-distance: 24px;

  /* ── Emphasis / eyebrows — taupe italic <em> ─────────── */
  --cp-emphasis-color: var(--cp-primary);
  --cp-emphasis-style: italic;
  --cp-eyebrow-color: var(--cp-primary);

  /* ── Surfaces — warm, soft elevation ────────────────── */
  --cp-rule-color: rgba(158, 133, 112, 0.5);
  --cp-card-radius: 6px;
  --cp-card-shadow: 0 8px 28px rgba(80, 50, 20, 0.08);

  /* ── Section background tints — warm off-whites / deep taupe ── */
  --cp-bg-warm: #faf8f5;
  --cp-bg-tint: #f0ebe3;
  --cp-bg-cool: #f7f5f2;
  --cp-bg-dark: #2c2420;
  --cp-bg-charcoal: #3a3129;
  --cp-bg-navy: #2b2218;
  --cp-bg-ink: #1f1912;

  /* ── Typography — Lora serif, gentle, sentence-case ──── */
  --cp-h2-size: clamp(1.9rem, 3.8vw, 3.2rem);
  --cp-h2-weight: 400;
  --cp-h2-tracking: 0em;
  --cp-h2-transform: none;
  --cp-h2-line-height: 1.25;
  --cp-h2-eyebrow-size: 0.68rem;
  --cp-h2-eyebrow-weight: 500;
  --cp-h2-eyebrow-tracking: 0.24em;
  --cp-h2-eyebrow-transform: uppercase;

  --cp-h3-size: clamp(1.1rem, 1.9vw, 1.5rem);
  --cp-h3-weight: 500;
  --cp-h3-tracking: 0em;
  --cp-h3-transform: none;

  --cp-h4-size: 0.9rem;
  --cp-h4-weight: 600;
  --cp-h4-tracking: 0.06em;
  --cp-h4-transform: uppercase;

  --cp-p-size: 1rem;
  --cp-p-weight: 300;
  --cp-p-line-height: 1.9;
  --cp-p-color: #7a6e65;

  /* Shared roles */
  --cp-name-weight: 600;
  --cp-meta-color: var(--cp-primary);
  --cp-meta-tracking: 0.14em;
  --cp-meta-transform: uppercase;

  /* Marquee */
  --cp-marquee-size: clamp(0.9rem, 3vw, 1.2rem);
  --cp-marquee-weight: 200;
  --cp-marquee-gap: 2rem;

  /* Taupe count-up numbers (v2: [Animated Stats] .cp-stat-number override) */
  --cp-stat-number-color: var(--cp-primary);

  --cp-header-social-display: none;

  /* ── Hero — light, photography-forward, under a transparent header ── */
  --cp-hero-header-offset: 0rem;
  --cp-cover-margin-top: -170px; /* pull cover under the transparent header */
  --cp-cover-height: 550px; /* no inline height in BoldTrail */
  --cp-cover-height-full: 91vh; /* inline height present */
  --cp-cover-overlay: rgba(35, 25, 15, 0.32); /* very light — let the photo lead */
  --cp-cover-overlay-dark: rgba(35, 25, 15, 0.58); /* client "make background dark" toggle (data-opacity="0.6") */
  --cp-cover-title-size: clamp(2.6rem, 5vw, 3.4rem);
  --cp-cover-title-size-compact: clamp(2.2rem, 4vw, 3rem);
  --cp-cover-title-weight: 400;
  --cp-cover-title-tracking: 0.01em;
  --cp-cover-title-transform: none;
  --cp-cover-title-color: #fff;
  --cp-cover-subtitle-color: rgba(255, 255, 255, 0.9);
  --cp-cover-eyebrow-color: #fff;
  --cp-cover-btn-radius: 4px;
  --cp-cover-anim: cp-hero-blur;
  --cp-cover-anim-duration: 0.9s;
  --cp-cover-bg-anim: cp-hero-kb; /* slow ken-burns on the hero photo */
  --cp-cover-ai-search-display: none; /* hide Classic/AI toggle (older layout) */

  /* ── Hero search bar (pill module) ─────────────────── */
  --cover-search-bar-bg-color: rgba(255, 255, 255, 0.95);
  --cover-search-bar-text-color: #2c2420;
  --cover-search-bar-placeholder-color: #9a8f85;
  --cover-search-button-bg-color: var(--cp-primary);
  --cover-search-button-icon-color: #ffffff;

  /* ── Header — transparent over hero, crisp white on scroll ── */
  --cp-header-bg: transparent;
  --cp-header-scroll-bg: #ffffff;
  --cp-header-link-color: #ffffff;
  --cp-header-scroll-link-color: #2c2420;
  --cp-header-burger-color: #ffffff;
  --cp-header-burger-scroll-color: #2c2420;
  --cp-header-container-width: 1360px;
  --cp-header-link-weight: 400;
  --cp-header-link-letter-spacing: 0.04em;
  --cp-header-link-transform: none;

  /* ── Logos — white over the transparent hero, color on scroll ── */
  --home-primary-logo_max-width: 250px;
  --home-primary-logo_filter: brightness(0) invert(1);
  --home-primary-logo-scroll_filter: none;
  --inner-primary-logo_max-width: 250px;

  /* ── Buttons (down-page) — softly squared ─────────── */
  --cp-btn-radius: 4px;

  /* ── Testimonials — frosted glass over a warm bg image ── */
  --cp-tc-quote-size: clamp(1.15rem, 1.6vw, 1.4rem);
  --cp-tc-star-color: var(--cp-primary);
  --cp-avatar-bg: var(--cp-primary);
  --cp-avatar-color: #ffffff;

  /* ── Tiles (Featured Areas) — soft scrim, quiet label ── */
  --cp-tile-label-weight: 500;
  --cp-tile-scrim: linear-gradient(to top, rgba(30, 20, 12, 0.7) 0%, rgba(30, 20, 12, 0.15) 55%, transparent 80%);

  /* ── Listings Showcase — taupe badge, warm dark slider panel ── */
  --cp-listings-accent: var(--cp-primary);
  --cp-listings-badge-color: #ffffff;
  --cp-listings-scrim: var(--cp-tile-scrim);
  --cp-listings-panel-bg: #2c2420;
  --cp-listings-panel-color: rgba(240, 235, 227, 0.9);

  /* ── Custom Footer — warm near-black, sand headings ─── */
  --cp-footer-bg: #2c2420;
  --cp-footer-color: rgba(240, 235, 227, 0.62);
  --cp-footer-heading: #ffffff;
  --cp-footer-link: rgba(240, 235, 227, 0.62);
  --cp-footer-link-hover: #ffffff;
  --cp-footer-border: rgba(200, 174, 142, 0.2);
  --cp-footer-logo-filter: brightness(0) invert(1);
}

/* ── Base body — soft white canvas for the down-page sections ── */
body {
  background-color: #ffffff;
  color: #2c2420;
}

/* Mobile: drop the fixed hero photo so the native bg doesn't jitter on scroll. */
@media only screen and (max-width: 767px) {
  .cover .cover-image {
    background-attachment: scroll !important;
  }
}
.cp-marquee-item {
  font-family: var(--cp-text-font);
}