/* ==========================================================================
   Curated Guides — Home & Living
   Scoped entirely under .cg-* so it cannot affect any existing page.
   Palette: ivory #faf8f4 · cream #f3ede4 · champagne #c9a962
            terracotta #a86540 · charcoal #1e1b18

   CONTRAST NOTE
   Earlier the cards were white and the rows inside them were ivory, which
   are almost the same colour, so everything looked flat and washed out.
   That is now inverted: cards sit on a soft tint, rows are pure white and
   lift off them with real shadows and a coloured edge.
   ========================================================================== */

.cg-page{
  --cg-ivory:#faf8f4;
  --cg-cream:#f3ede4;
  --cg-gold:#c9a962;
  --cg-terra:#a86540;
  --cg-terra-dark:#8f5334;
  --cg-char:#1e1b18;
  --cg-line:rgba(30,27,24,.12);
  --cg-line-strong:rgba(30,27,24,.10);
  --cg-gold-line:rgba(201,169,98,.35);
  --cg-soft:rgba(30,27,24,.62);
  --cg-body:rgba(30,27,24,.70);
  --cg-radius:18px;
  --cg-shadow:0 18px 44px rgba(30,27,24,.09);
  --cg-lift:0 2px 10px rgba(30,27,24,.05);
  --cg-lift-hover:0 10px 26px rgba(30,27,24,.11);

  max-width:1080px;
  margin:0 auto;
  padding:34px 22px 90px;
  color:var(--cg-char);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  line-height:1.7;
}

/* ------------------------------------------------------------ typography */
.cg-h1{
  font-family:'Playfair Display',Georgia,serif;
  font-size:clamp(2.2rem,5vw,3.6rem);
  line-height:1.1;
  font-weight:600;
  letter-spacing:-.015em;
  margin:.15em 0 .35em;
}
.cg-h2{
  font-family:'Playfair Display',Georgia,serif;
  font-size:clamp(1.65rem,3.2vw,2.5rem);
  line-height:1.18;
  font-weight:600;
  margin:0 0 .6em;
  position:relative;
  padding-bottom:.4em;
}
/* Gold rule under every section heading */
.cg-h2::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:56px;
  height:3px;
  border-radius:3px;
  background:linear-gradient(90deg,var(--cg-gold),var(--cg-terra));
}
.cg-center .cg-h2::after{left:50%;transform:translateX(-50%);}
.cg-h3{
  font-family:'Playfair Display',Georgia,serif;
  font-size:clamp(1.3rem,2.2vw,1.8rem);
  line-height:1.25;
  font-weight:600;
  margin:0 0 .45em;
}
/* Pill-style label above each heading */
.cg-eyebrow{
  display:inline-block;
  background:var(--cg-cream);
  color:var(--cg-terra);
  padding:6px 14px;
  border-radius:999px;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin:0 0 1em;
}
.cg-subtitle,.cg-lede{
  font-size:1.08rem;
  color:var(--cg-soft);
  max-width:62ch;
  margin:0 0 1.1em;
}
.cg-center{text-align:center;}
.cg-center .cg-btn-row{justify-content:center;}
.cg-empty{
  text-align:center;
  padding:70px 20px;
  color:var(--cg-soft);
  background:var(--cg-cream);
  border-radius:var(--cg-radius);
}

/* ----------------------------------------------------------- breadcrumb */
.cg-breadcrumb{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  font-size:.82rem;color:var(--cg-soft);margin-bottom:22px;
}
.cg-breadcrumb a{color:var(--cg-terra);text-decoration:none;}
.cg-breadcrumb a:hover{text-decoration:underline;}

/* ----------------------------------------------------------------- hero */
.cg-hero{
  background:linear-gradient(160deg,var(--cg-cream),var(--cg-ivory));
  border:1px solid var(--cg-gold-line);
  border-radius:26px;
  padding:clamp(30px,5vw,58px);
  margin-bottom:34px;
}
.cg-hero--index{text-align:center;}
.cg-hero--index .cg-subtitle{margin-left:auto;margin-right:auto;}
.cg-hero__image{
  width:100%;border-radius:var(--cg-radius);
  margin:24px 0 4px;display:block;box-shadow:var(--cg-shadow);
}
.cg-intro p{margin:0 0 1em;max-width:68ch;}

/* ---------------------------------------------------------------- blocks */
/* Soft tint so the white rows inside can stand out against it. */
.cg-block{
  background:linear-gradient(180deg,#ffffff 0%,var(--cg-ivory) 100%);
  border:1px solid rgba(201,169,98,.30);
  border-radius:var(--cg-radius);
  padding:clamp(24px,4vw,42px);
  margin-bottom:26px;
  box-shadow:0 4px 18px rgba(30,27,24,.05);
}
.cg-block > p{max-width:68ch;}
.cg-wide-image{width:100%;border-radius:14px;margin:18px 0;display:block;}

/* --------------------------------------------------------------- buttons */
.cg-btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px;}
.cg-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 22px;border-radius:999px;
  font-size:.92rem;font-weight:600;text-decoration:none;
  border:1.5px solid transparent;cursor:pointer;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;
}
.cg-btn--solid{
  background:linear-gradient(140deg,var(--cg-terra),#95583a);
  color:var(--cg-ivory);
  box-shadow:0 4px 14px rgba(168,101,64,.28);
}
.cg-btn--solid:hover{
  background:linear-gradient(140deg,#955837,var(--cg-terra-dark));
  transform:translateY(-1px);
  box-shadow:0 10px 26px rgba(168,101,64,.38);
}
.cg-btn--ghost{background:transparent;color:var(--cg-char);border-color:var(--cg-gold);}
.cg-btn--ghost:hover{background:var(--cg-cream);transform:translateY(-1px);}
.cg-btn--small{
  padding:8px 16px;font-size:.82rem;
  background:var(--cg-char);color:var(--cg-ivory);white-space:nowrap;
  box-shadow:0 2px 8px rgba(30,27,24,.22);
}
.cg-btn--small:hover{background:var(--cg-terra);}
.cg-note{font-size:.82rem;color:var(--cg-soft);margin:12px 0 0;}
.cg-inline-link{color:var(--cg-terra);font-weight:600;text-decoration:underline;}

/* ----------------------------------------------------------------- icons */
.cg-icon{width:20px;height:20px;fill:currentColor;display:block;}

/* ----------------------------------------------------------- tool cards */
.cg-tool-list{display:grid;gap:12px;margin-top:8px;}
.cg-tool{
  display:flex;align-items:center;gap:16px;
  padding:16px 18px;
  background:#ffffff;
  border:1px solid var(--cg-line-strong);
  border-left:4px solid var(--cg-gold);
  border-radius:14px;
  box-shadow:var(--cg-lift);
  transition:transform .18s ease,box-shadow .18s ease,border-left-color .18s ease;
}
.cg-tool:hover{
  transform:translateX(4px);
  box-shadow:var(--cg-lift-hover);
  border-left-color:var(--cg-terra);
}
.cg-tool__icon{
  flex:0 0 46px;width:46px;height:46px;
  display:grid;place-items:center;border-radius:12px;
  background:linear-gradient(140deg,var(--cg-cream),#e8dcc4);
  border:1px solid rgba(201,169,98,.45);
  color:var(--cg-terra);
}
.cg-tool__text{flex:1;min-width:0;}
.cg-tool__text strong{display:block;font-size:1.02rem;font-weight:600;color:var(--cg-char);}
.cg-tool__text span{display:block;font-size:.88rem;color:var(--cg-body);margin-top:2px;}

/* --------------------------------------------------------- highlight grid */
.cg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;margin-top:10px;}
.cg-grid__cell{
  background:#ffffff;
  border:1px solid var(--cg-line-strong);
  border-top:4px solid var(--cg-gold);
  border-radius:16px;
  padding:26px 22px;
  box-shadow:0 3px 14px rgba(30,27,24,.06);
  transition:transform .2s ease,box-shadow .2s ease,border-top-color .2s ease;
}
.cg-grid__cell:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 34px rgba(30,27,24,.12);
  border-top-color:var(--cg-terra);
}
.cg-grid__icon{
  display:grid;place-items:center;width:46px;height:46px;
  border-radius:12px;
  background:linear-gradient(140deg,var(--cg-cream),#e8dcc4);
  border:1px solid rgba(201,169,98,.45);
  color:var(--cg-terra);margin-bottom:15px;
}
.cg-grid__cell h3{
  font-family:'Playfair Display',Georgia,serif;
  font-size:1.08rem;margin:0 0 .4em;font-weight:600;color:var(--cg-char);
}
.cg-grid__cell p{font-size:.9rem;color:var(--cg-body);margin:0;line-height:1.65;}

/* -------------------------------------------------------- numbered steps */
.cg-steps{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:12px;}
.cg-step{
  display:flex;gap:16px;align-items:flex-start;
  padding:16px 20px;
  background:#ffffff;
  border:1px solid var(--cg-line-strong);
  border-left:4px solid var(--cg-gold);
  border-radius:14px;
  box-shadow:var(--cg-lift);
  transition:transform .18s ease,box-shadow .18s ease,border-left-color .18s ease;
}
.cg-step:hover{
  transform:translateX(4px);
  box-shadow:var(--cg-lift-hover);
  border-left-color:var(--cg-terra);
}
.cg-step__num{
  flex:0 0 auto;
  display:grid;place-items:center;
  width:40px;height:40px;min-width:40px;
  border-radius:11px;
  background:linear-gradient(140deg,var(--cg-terra),var(--cg-terra-dark));
  color:#fff;
  font-family:'Playfair Display',Georgia,serif;
  font-size:1rem;font-weight:700;letter-spacing:.02em;
  box-shadow:0 3px 8px rgba(168,101,64,.28);
}
.cg-step__text{padding-top:2px;min-width:0;}
.cg-step__text strong{display:block;font-size:1.02rem;font-weight:600;color:var(--cg-char);}
.cg-step__text span{display:block;font-size:.9rem;color:var(--cg-body);margin-top:3px;line-height:1.65;}
.cg-step__text .cg-inline-link{display:inline-block;margin-top:6px;font-size:.85rem;}

/* ------------------------------------------------------------ pull quote */
.cg-quote{
  background:linear-gradient(150deg,var(--cg-cream),var(--cg-ivory));
  border:1px solid var(--cg-gold-line);
  border-radius:var(--cg-radius);
  text-align:center;
  padding:44px 34px;
  position:relative;
}
/* Large decorative opening quote mark */
.cg-quote::before{
  content:"\201C";
  position:absolute;
  top:6px;left:26px;
  font-family:'Playfair Display',Georgia,serif;
  font-size:5rem;line-height:1;
  color:var(--cg-gold);
  opacity:.35;
}
.cg-quote blockquote{margin:0;}
.cg-quote p{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(1.5rem,3.4vw,2.3rem);
  font-style:italic;line-height:1.35;margin:0 auto .5em;max-width:24ch;
  color:var(--cg-char);
  position:relative;
}
.cg-quote cite{
  font-style:normal;font-size:.85rem;
  color:var(--cg-terra);font-weight:600;letter-spacing:.04em;
}

/* --------------------------------------------------------- callout / pin */
.cg-callout{
  background:linear-gradient(145deg,#f9efdb,var(--cg-cream));
  border:1px solid rgba(201,169,98,.55);
  box-shadow:0 8px 26px rgba(201,169,98,.16);
}
.cg-pin{
  background:var(--cg-cream);
  border:1px solid var(--cg-gold-line);
}
.cg-callout__inner,.cg-pin__inner,.cg-product__inner{
  display:grid;grid-template-columns:1.5fr .9fr;gap:26px;align-items:center;
}
.cg-callout__image,.cg-pin__image,.cg-product__image{
  width:100%;border-radius:14px;display:block;box-shadow:var(--cg-shadow);
}
.cg-badge{
  display:inline-block;font-size:.68rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;
  background:linear-gradient(140deg,var(--cg-terra),var(--cg-terra-dark));
  color:var(--cg-ivory);
  padding:5px 12px;border-radius:999px;margin-bottom:12px;
  box-shadow:0 3px 9px rgba(168,101,64,.30);
}
.cg-badge--center{display:block;width:max-content;margin:0 auto 14px;}

/* ---------------------------------------------------------- product card */
.cg-product{
  background:#ffffff;
  border:1px solid rgba(201,169,98,.55);
  box-shadow:0 8px 26px rgba(30,27,24,.09);
}
.cg-checklist{list-style:none;padding:0;margin:14px 0;display:grid;gap:8px;}
.cg-checklist li{position:relative;padding-left:26px;font-size:.92rem;}
.cg-checklist li::before{
  content:"";position:absolute;left:0;top:.45em;
  width:14px;height:14px;border-radius:50%;
  background:var(--cg-terra);
  box-shadow:inset 0 0 0 3px #fff,0 0 0 1px rgba(168,101,64,.35);
}
.cg-price{
  font-family:'Playfair Display',Georgia,serif;
  font-size:2.1rem;font-weight:700;color:var(--cg-terra);margin:14px 0 0;
}

/* ----------------------------------------------------------------- notes */
.cg-smallnote{background:transparent;border:0;box-shadow:none;padding:6px 4px;}
.cg-smallnote p{font-size:.82rem;color:var(--cg-soft);margin:0;}

/* -------------------------------------------------------------- cta block */
.cg-cta{
  background:linear-gradient(150deg,var(--cg-cream),var(--cg-ivory));
  border:1px solid rgba(201,169,98,.45);
  box-shadow:0 8px 26px rgba(30,27,24,.07);
  text-align:center;
}
.cg-cta .cg-lede{margin-left:auto;margin-right:auto;}

/* --------------------------------------------------------- related / index */
.cg-more{background:transparent;border:0;box-shadow:none;padding-left:0;padding-right:0;}
.cg-more__grid,.cg-index-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;
}
.cg-more__card,.cg-index-card{
  display:block;text-decoration:none;color:inherit;background:#fff;
  border:1px solid var(--cg-line-strong);border-radius:var(--cg-radius);
  overflow:hidden;
  box-shadow:0 4px 16px rgba(30,27,24,.07);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.cg-more__card:hover,.cg-index-card:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 44px rgba(30,27,24,.15);
  border-color:var(--cg-gold);
}
.cg-more__card img,.cg-index-card img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;}
.cg-index-card img{aspect-ratio:2/3;}
.cg-index-card__placeholder{
  display:block;aspect-ratio:2/3;
  background:linear-gradient(150deg,var(--cg-cream),#e6d9c4);
}
.cg-more__card span,.cg-index-card__text{display:block;padding:16px 18px;}
.cg-more__card em,.cg-index-card__text em{
  font-style:normal;font-size:.68rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cg-terra);display:block;margin-bottom:6px;
}
.cg-more__card strong,.cg-index-card__text strong{
  font-family:'Playfair Display',Georgia,serif;
  font-size:1.15rem;font-weight:600;display:block;line-height:1.3;
}
.cg-index-card__text > span{font-size:.88rem;color:var(--cg-soft);display:block;margin-top:7px;}
.cg-index-card__cta{
  font-size:.82rem!important;font-weight:600;color:var(--cg-terra)!important;margin-top:12px!important;
}

/* ------------------------------------------------------------ responsive */
@media (max-width:760px){
  .cg-page{padding:20px 16px 64px;}
  .cg-callout__inner,.cg-pin__inner,.cg-product__inner{grid-template-columns:1fr;}
  .cg-callout__image,.cg-pin__image,.cg-product__image{order:-1;max-width:260px;margin:0 auto;}
  .cg-tool{flex-wrap:wrap;}
  .cg-tool .cg-btn--small{width:100%;}
  .cg-btn{width:100%;}
  .cg-btn-row{flex-direction:column;}
  .cg-step__num{width:34px;height:34px;min-width:34px;font-size:.9rem;}
  .cg-tool:hover,.cg-step:hover{transform:none;}
  .cg-grid__cell:hover{transform:none;}
  .cg-quote{padding:34px 22px;}
  .cg-quote::before{font-size:3.4rem;left:14px;}
}

/* --------------------------------------------------- accessibility extras */
.cg-page a:focus-visible,.cg-page button:focus-visible{
  outline:3px solid var(--cg-terra);outline-offset:2px;border-radius:6px;
}
@media (prefers-reduced-motion:reduce){
  .cg-page *{transition:none!important;animation:none!important;}
}

/* ---------- Curated Guides header with a background photo ---------- */

.cg-hero--photo{
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(201, 169, 98, .35);
  padding-top: clamp(48px, 8vw, 92px);
  padding-bottom: clamp(48px, 8vw, 92px);
  box-shadow: 0 18px 46px rgba(30, 27, 24, .10);
  overflow: hidden;
  isolation: isolate;
}

/* Soft veil between the photo and the words.
   Lower numbers = the picture shows through more.
   Raise them if your photo is busy and the text is hard to read. */
.cg-hero--photo::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(180deg,
      rgba(250, 248, 244, .28) 0%,
      rgba(243, 237, 228, .52) 45%,
      rgba(250, 248, 244, .80) 100%);
}

/* Keep the words above the veil */
.cg-hero--photo > *{
  position: relative;
  z-index: 1;
}

.cg-hero--photo .cg-h1{
  text-shadow: 0 2px 14px rgba(250, 248, 244, .85);
}

.cg-hero--photo .cg-eyebrow{
  text-shadow: 0 1px 8px rgba(250, 248, 244, .9);
}

.cg-hero--photo .cg-subtitle{
  color: var(--cg-char);
  opacity: .92;
  text-shadow: 0 1px 10px rgba(250, 248, 244, .9);
}