/* =========================================
   Leilani Kai — Blog Styles (OS 2.0)
   Matches your warm/luxury aesthetic:
   - Warm sand background
   - Cormorant headlines, Inter body
   - Dark luxury buttons
========================================= */

:root{
  --lk-bg:#f7f1e7;
  --lk-ink:#2f2f2f;
  --lk-ink-soft:#5e574f;
  --lk-border: rgba(222,214,203,1);
  --lk-card: rgba(255,255,255,.35);
  --lk-dark:#4a3f35;
  --lk-dark-2:#3f3a32;
  /* Blog link color (requested): make hyperlinks clearly blue in articles */
  --lk-link:#1a73e8;
  --lk-link-hover:#1558b0;
  --lk-link-underline: rgba(26,115,232,.35);
  --lk-link-underline-hover: rgba(26,115,232,.85);
}

/* Prevent weird horizontal scrollbars */
html, body { overflow-x: hidden; }

.lk-wrap{background:var(--lk-bg); color:var(--lk-ink);}
.lk-container{max-width:1100px; margin:0 auto; padding:40px 24px 70px;}

.lk-kicker{
  font-family: Inter, sans-serif;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--lk-ink-soft);
}

.lk-h1, .lk-h2, .lk-h3{
  font-family:"Cormorant Garamond", serif;
  color:#2F2A24;
  margin:0;
}
.lk-h1{font-size:48px; line-height:1.05;}
.lk-h2{font-size:34px; font-style:italic; text-align:center;}
.lk-h3{font-size:22px;}

.lk-muted{color:var(--lk-ink-soft); font-family:Inter, sans-serif; line-height:1.8; font-size:14px;}
.lk-divider{border:0; border-top:1px solid var(--lk-border); margin:0;}

/* =========================
   BLOG HERO
========================= */

.lk-hero{
  max-width:1400px;
  margin:0 auto 40px;
  padding:0 40px;
}
.lk-hero-card{
  position:relative;
  border:1px solid var(--lk-border);
  background: rgba(255,255,255,.2);
  overflow:hidden;
}

/* FIX: responsive hero height without “giant zoom” */
.lk-hero-media{
  height: clamp(320px, 38vw, 520px);
  overflow:hidden;
}
.lk-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: 50% 45%;
  display:block;
}

.lk-hero-content{
  position:absolute;
  right:8%;
  top:50%;
  transform:translateY(-50%);
  max-width:480px;
}
.lk-hero-sub{
  font-family:"Cormorant Garamond", serif;
  font-style:italic;
  font-size:22px;
  margin:6px 0 18px;
  color:#3A342D;
}

/* =========================
   Controls
========================= */

.lk-controls{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  margin:26px 0 10px;
}
.lk-search{
  display:flex;
  gap:10px;
  align-items:center;
  border:1px solid var(--lk-border);
  background: rgba(255,255,255,.25);
  padding:10px 12px;
  min-width:280px;
}
.lk-search input{
  border:0; outline:0; background:transparent;
  font-family:Inter,sans-serif; font-size:14px; width:100%;
}
.lk-tags{display:flex; flex-wrap:wrap; gap:10px;}
.lk-pill{
  border:1px solid var(--lk-border);
  background: transparent;
  padding:10px 14px;
  cursor:pointer;
  font-family:"Cormorant Garamond", serif;
  font-size:18px;
  color:#3A342D;
  border-radius:999px;
  transition:.2s ease;
}
.lk-pill:hover{background: rgba(63,58,50,.06);}
.lk-pill.is-active{background: rgba(63,58,50,.10); border-color:#3F3A32;}

/* =========================
   Cards grid
========================= */

.lk-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
  margin-top:18px;
}
.lk-card{
  border:1px solid var(--lk-border);
  background: var(--lk-card);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.lk-card-media img{width:100%; height:190px; object-fit:cover; display:block;}
.lk-card-body{padding:14px 14px 16px; text-align:left;}
.lk-card-title{
  font-family:"Cormorant Garamond", serif;
  font-size:22px;
  margin:0 0 6px;
}
.lk-card-meta{
  font-family:Inter,sans-serif;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--lk-ink-soft);
  margin-bottom:10px;
}
.lk-card-excerpt{margin:0 0 14px;}

/* =========================
   Buttons
========================= */

.lk-btn{
  display:inline-block;
  background: var(--lk-dark);
  color:#fff;
  font-family: Inter, sans-serif;
  font-size:13px;
  letter-spacing:.15em;
  text-transform:uppercase;
  padding:14px 28px;
  border:1px solid var(--lk-dark);
  cursor:pointer;
  transition: background .25s ease, transform .12s ease;
  text-decoration:none;
}
.lk-btn:hover{background: var(--lk-dark-2); transform: translateY(-1px);}
.lk-btn:active{transform: translateY(0);}
.lk-btn--outline{
  background: transparent;
  color: var(--lk-dark);
  border-color: var(--lk-border);
}
.lk-btn--outline:hover{
  background: rgba(63,58,50,.06);
  border-color: #3F3A32;
}

/* =========================
   Article page
========================= */

.lk-article-hero{max-width:1100px; margin:0 auto; padding:40px 24px 24px;}
.lk-breadcrumb{
  font-family:Inter,sans-serif;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--lk-ink-soft);
  margin-bottom:10px;
}
.lk-article-title{font-size:52px; margin-bottom:10px;}
.lk-article-meta{
  display:flex; flex-wrap:wrap; gap:12px;
  font-family:Inter,sans-serif; font-size:12px;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--lk-ink-soft);
  margin-bottom:18px;
}
.lk-article-image{
  border:1px solid var(--lk-border);
  background:#fff;
  overflow:hidden;

  /* FIX: responsive height wrapper */
  height: clamp(280px, 42vw, 520px);
}
.lk-article-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: 50% 45%;
  display:block;
}

.lk-article-body{max-width:820px; margin:0 auto; padding:26px 24px 60px;}
.lk-article-body .rte{
  font-family:Inter,sans-serif;
  color:#3A342D;
  line-height:1.9;
  font-size:15px;
}

/* Hyperlinks: make linked text clearly blue in blog posts (requested) */
.lk-article-hero .lk-breadcrumb a,
.lk-article-meta a,
.lk-article-body .rte a{
  color: var(--lk-link);
  text-decoration: underline;
  text-decoration-color: var(--lk-link-underline);
  text-underline-offset: 3px;
}
.lk-article-hero .lk-breadcrumb a:hover,
.lk-article-meta a:hover,
.lk-article-body .rte a:hover{
  color: var(--lk-link-hover);
  text-decoration-color: var(--lk-link-underline-hover);
}
.lk-article-body .rte h2,
.lk-article-body .rte h3{
  font-family:"Cormorant Garamond", serif;
  margin-top:26px;
}
.lk-callout{
  border:1px solid var(--lk-border);
  background: rgba(255,255,255,.25);
  padding:16px;
  margin:26px 0;
}
.lk-callout-title{
  font-family:Inter,sans-serif;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--lk-ink-soft);
  margin-bottom:8px;
}
.lk-article-actions{
  display:flex; gap:12px; flex-wrap:wrap;
  margin-top:22px;
}

.lk-related{
  max-width:1100px;
  margin:0 auto;
  padding:0 24px 70px;
}
.lk-related h2{margin:0 0 18px;}

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

/* When embedding a single product inside an article, center it and prevent it from spanning the full content width */
.lk-products.lk-products--embed{
  grid-template-columns: minmax(0, 380px);
  justify-content: center;
}
.lk-product-card{
  border:1px solid var(--lk-border);
  background: rgba(255,255,255,.25);
  overflow:hidden;
}
.lk-product-card img{width:100%; height:190px; object-fit:cover; display:block;}
.lk-product-body{text-align:center; padding:12px 12px 16px;}
.lk-product-name{font-family:"Cormorant Garamond", serif; font-size:20px;}
.lk-product-price{font-family:"Cormorant Garamond", serif; font-size:18px; color:#3A342D; margin:2px 0 12px;}
.lk-product-body .lk-btn{width:100%;}

/* =========================
   Newsletter
========================= */

.lk-newsletter{
  max-width:1100px; margin:0 auto;
  padding:50px 24px 70px;
  text-align:center;
}
.lk-newsletter form{
  display:flex; gap:12px; justify-content:center;
  flex-wrap:wrap; margin-top:16px;
}
.lk-newsletter input{
  border:1px solid var(--lk-border);
  background: rgba(255,255,255,.25);
  padding:14px 16px;
  min-width:320px;
  font-family:Inter,sans-serif;
  font-size:14px;
}

/* =========================
   Responsive
========================= */

@media(max-width:1100px){
  .lk-hero{padding:0 20px;}
}

@media(max-width:980px){
  /* FIX: set the wrapper heights (not the img heights) */
  .lk-hero-media{ height: clamp(260px, 56vw, 420px); }

  .lk-hero-content{
    position:static; transform:none;
    max-width:none;
    padding:18px 18px 22px;
    border-top:1px solid var(--lk-border);
    background: rgba(247,241,231,.85);
  }

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

  .lk-article-image{ height: clamp(240px, 60vw, 420px); }
  .lk-article-title{font-size:40px;}
}

/* =========================
   Editor/content niceties
========================= */

.lk-article-body .rte img{ height:auto; }

/* =========================
   WooCommerce blocks in post content
   Allows inserting Products/Collections via built-in Woo blocks
========================= */

/* Older WC blocks grid */
.lk-article-body .wc-block-grid__products,
.lk-article-body .wc-block-product-template{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:22px;
}
.lk-article-body .wc-block-grid__product,
.lk-article-body .wc-block-product{
  border:1px solid var(--lk-border);
  background: rgba(255,255,255,.25);
  overflow:hidden;
  padding:0;
}
.lk-article-body .wc-block-grid__product-image img,
.lk-article-body .wc-block-product-image img{
  width:100%;
  height:190px;
  object-fit:cover;
  display:block;
}
.lk-article-body .wc-block-grid__product-title,
.lk-article-body .wc-block-product-title{
  font-family:"Cormorant Garamond", serif;
  font-size:20px;
  margin:12px 12px 0;
  text-align:center;
}
.lk-article-body .wc-block-grid__product-price,
.lk-article-body .wc-block-product-price{
  font-family:"Cormorant Garamond", serif;
  font-size:18px;
  color:#3A342D;
  margin:2px 0 12px;
  text-align:center;
}
.lk-article-body .wc-block-grid__product-add-to-cart,
.lk-article-body .wc-block-product-button{
  padding:0 12px 16px;
}
.lk-article-body .wc-block-grid__product-add-to-cart a,
.lk-article-body .wc-block-product-button a{
  display:inline-block;
  width:100%;
  text-align:center;
  background: var(--lk-dark);
  color:#fff;
  font-family: Inter, sans-serif;
  font-size:13px;
  letter-spacing:.15em;
  text-transform:uppercase;
  padding:14px 28px;
  border:1px solid var(--lk-dark);
  text-decoration:none;
}
.lk-article-body .wc-block-grid__product-add-to-cart a:hover,
.lk-article-body .wc-block-product-button a:hover{ background: var(--lk-dark-2); }

@media(max-width:980px){
  .lk-article-body .wc-block-grid__products,
  .lk-article-body .wc-block-product-template{ grid-template-columns:1fr; }
}
