/* Akemi page refresh — layered on top of cylo.css. Class names and
   data-lp-* hooks from the template are untouched. */
:root {
  --ak-brand: #1f4a38;
  --ak-brand-soft: #eef4ef;
  --ak-amber: #e2862c;
  --ak-amber-soft: #fdf3e7;
  --ak-ink: #1f2937;
  --ak-muted: #5b6472;
  --ak-line: #e6e8eb;
  --ak-cta: #4ba614;
  --ak-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ── Type ── */
.cylo-container .content .article,
.cylo-container .content .article li,
.cylo-container .testimonials-row-article,
.cylo-container .faqs-container-faqs-row-answer,
.cylo-container .testimonial-container-row-text,
.cylo-sidebar-container-testimonial-article {
  font-family: var(--ak-body);
  color: var(--ak-ink);
}
.cylo-container .content .article { font-size: 1.8rem; line-height: 1.7; }
.cylo-container .content .article p { margin: 0 0 1.4rem; }
.cylo-container .content h2,
.cylo-container .testimonials-title h2,
.cylo-container .faqs-container-title h2,
.cylo-container .testimonial-title h2 {
  font-weight: 700; color: var(--ak-ink); letter-spacing: -0.01em;
}
.cylo-container .content h2 { font-size: 2.6rem; margin-top: 5rem; padding-bottom: 0; }
.cylo-container .content h2::before {
  content: ""; display: block; width: 4.4rem; height: 0.4rem;
  background: var(--ak-amber); border-radius: 0.2rem; margin-bottom: 1.2rem;
}
.cylo-container .header-container-title h1 {
  font-size: 3.8rem; font-weight: 800; line-height: 1.15; letter-spacing: -0.02em;
  color: var(--ak-brand);
}
.cylo-container .header-container-subtitle { margin-top: 0; }
.cylo-container .header-container-subtitle a {
  color: var(--ak-muted); text-decoration: none; font-family: var(--ak-body);
  font-size: 1.9rem; line-height: 1.55;
}
.ak-lead { font-size: 2.2rem; line-height: 1.4 !important; }

/* ── Hero trust strip ── */
.ak-trust {
  list-style: none; padding: 0; margin: 2rem 0 0.5rem;
  display: flex; flex-wrap: wrap; gap: 0.8rem 1.8rem;
  font-family: var(--ak-body); font-size: 1.45rem; font-weight: 600; color: var(--ak-brand);
}
.ak-trust li { display: flex; align-items: center; gap: 0.6rem; }
.ak-trust li::before {
  content: "\2713"; display: inline-flex; align-items: center; justify-content: center;
  width: 1.9rem; height: 1.9rem; border-radius: 50%;
  background: var(--ak-brand-soft); color: var(--ak-brand); font-size: 1.1rem; font-weight: 800;
}
.cylo-container .content-section-image img { border-radius: 1.2rem; }

/* ── Callout ── */
.ak-callout {
  background: var(--ak-amber-soft); border-inline-start: 4px solid var(--ak-amber);
  border-radius: 0.8rem; padding: 1.6rem 2rem; font-size: 2rem; line-height: 1.45;
}

/* ── CTA buttons ── */
.cylo-container .content .button { margin: 3.5rem 0 1rem; }
.cylo-container .content .button a,
.cylo-sidebar-container-button a {
  text-transform: none; font-size: 2.2rem; font-weight: 800; letter-spacing: 0;
  padding: 1.7rem 3.6rem; border-radius: 99rem;
  box-shadow: 0 6px 18px rgba(75,166,20,.32); transition: transform .15s, box-shadow .15s;
}
.cylo-container .content .button a:hover,
.cylo-sidebar-container-button a:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(75,166,20,.4); }
.cylo-sidebar-container-button a { padding: 1.4rem 0; font-size: 2rem; }

/* ── Mechanism steps ── */
.ak-steps { list-style: none; padding: 0; margin: 0.6rem 0 1.6rem; display: grid; gap: 1.2rem; }
.ak-steps li {
  display: flex; gap: 1.6rem; align-items: flex-start;
  background: #fff; border: 1px solid var(--ak-line); border-radius: 1.2rem; padding: 1.8rem 2rem;
  font-family: var(--ak-body);
}
.ak-steps-num {
  flex: none; width: 3.6rem; height: 3.6rem; border-radius: 50%;
  background: var(--ak-brand); color: #fff; font-weight: 800; font-size: 1.7rem;
  display: flex; align-items: center; justify-content: center;
}
.ak-steps strong { font-size: 1.85rem; color: var(--ak-ink); }
.ak-steps p { margin: 0.4rem 0 0; font-size: 1.65rem; line-height: 1.6; color: var(--ak-muted); }

/* ── Ingredients ── */
.ak-ingredients { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem; margin-top: 0.4rem; }
.ak-ing {
  display: flex; gap: 1.2rem; align-items: flex-start; font-family: var(--ak-body);
  background: var(--ak-brand-soft); border-radius: 1.2rem; padding: 1.6rem 1.8rem;
}
.ak-ing:last-child:nth-child(odd) { grid-column: 1 / -1; }
.ak-ing-icon {
  flex: none; width: 4.2rem; height: 4.2rem; border-radius: 50%; background: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 2.1rem;
}
.ak-ing strong { font-size: 1.65rem; color: var(--ak-brand); }
.ak-ing p { margin: 0.3rem 0 0; font-size: 1.5rem; line-height: 1.5; color: var(--ak-ink); }
.ak-pills { list-style: none; padding: 0; margin: 1.6rem 0 0; display: flex; flex-wrap: wrap; gap: 0.8rem; }
.ak-pills li {
  font-family: var(--ak-body); font-size: 1.3rem; font-weight: 600; color: var(--ak-brand);
  border: 1px solid #c9dccf; border-radius: 99rem; padding: 0.5rem 1.3rem; background: #fff;
}

/* ── USP grid tint to brand ── */
.cylo-container .cylo-product-reveal .cylo-usp-item { background: var(--ak-brand-soft); border-color: #d3e3d8; }
.cylo-container .cylo-product-reveal .cylo-usp-item::before { color: var(--ak-brand); }

/* ── Testimonials (cards) ── */
.cylo-container .testimonials-title h2 { font-size: 3rem; margin-top: 3rem; }
.cylo-container .testimonials-row {
  background: #fff; border: 1px solid var(--ak-line); border-radius: 1.2rem;
  padding: 0; overflow: hidden; box-shadow: 0 4px 14px rgba(0,0,0,.05);
}
.cylo-container .testimonials-row-image { order: -1; margin: 0; padding: 0; }
.cylo-container .testimonials-row-image img { height: 20rem; }
.cylo-container .testimonials-row-name { padding: 1.4rem 1.6rem 0; font-family: var(--ak-body); }
.cylo-container .testimonials-row-score,
.cylo-sidebar-container-testimonial-score { color: #f5b301; font-size: 1.9rem; letter-spacing: 0.15rem; }
.cylo-container .testimonials-row-score { padding: 0.2rem 1.6rem 0; }
.cylo-container .testimonials-row-article { padding: 0.6rem 1.6rem 1.8rem; line-height: 1.6; }
.cylo-container .testimonials-row-article p { margin: 0; }

/* ── How-to (3 cards) ── */
.ak-how { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin-top: 0.6rem; }
.ak-how .cylo-how-step {
  text-align: center; background: #fff; border: 1px solid var(--ak-line);
  border-radius: 1.2rem; padding: 2.2rem 1.6rem 1.4rem;
}
.ak-how-num {
  display: inline-flex; width: 4.4rem; height: 4.4rem; border-radius: 50%;
  background: var(--ak-amber); color: #fff; font-weight: 800; font-size: 2rem;
  align-items: center; justify-content: center;
}
.cylo-container .content .ak-how .cylo-how-step h3 { margin: 1rem 0 0.2rem; font-size: 2rem; color: var(--ak-brand); }
.cylo-container .content .ak-how .article { font-size: 1.55rem; line-height: 1.55; color: var(--ak-muted); padding: 0.4rem 0; }

/* ── Guarantee ── */
.ak-guarantee .article { position: relative; background: var(--ak-brand-soft); border-radius: 1.2rem; padding: 2.4rem 2.4rem 1.2rem !important; }
.ak-seal {
  float: right; margin: 0 0 1rem 1.6rem; width: 10.4rem; height: 10.4rem; border-radius: 50%;
  background: var(--ak-brand); color: #fff; border: 4px double #d8b46a;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; font-family: "Montserrat", sans-serif; font-size: 1.05rem; font-weight: 800; line-height: 1.15; letter-spacing: 0.05em;
}
.ak-seal span { font-size: 3.2rem; line-height: 1; }

/* ── Offer / package picker ── */
.cylo-container .cylo-offer {
  max-width: none; background: #fff; border: 2px solid var(--ak-brand); border-radius: 1.6rem;
  padding: 3rem 2.4rem 2.4rem; box-shadow: 0 10px 30px rgba(31,74,56,.08);
}
.cylo-container .cylo-offer-headline { font-size: 2.4rem; color: var(--ak-brand); margin-bottom: 0.4rem; }
.cylo-container .cylo-offer-headline p { margin: 0; }
.cylo-container .cylo-offer-urgency { color: #c0392b; font-weight: 700; }
.ak-packs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin: 3rem 0 1.6rem; align-items: stretch; }
.ak-pack {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
  border: 1px solid var(--ak-line); border-radius: 1.2rem; padding: 2.6rem 1.2rem 1.4rem;
  text-decoration: none; color: var(--ak-ink); background: #fff; transition: transform .15s, box-shadow .15s;
}
.ak-pack:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0,0,0,.08); }
.ak-pack--best { border: 3px solid var(--ak-cta); background: #fff; box-shadow: 0 8px 22px rgba(75,166,20,.18); }
.ak-pack-badge {
  position: absolute; top: -1.3rem; left: 50%; transform: translateX(-50%); white-space: nowrap;
  background: var(--ak-brand); color: #fff; font-size: 1.2rem; font-weight: 800; letter-spacing: 0.06em;
  text-transform: uppercase; border-radius: 0.6rem; padding: 0.4rem 1.2rem;
}
.ak-pack--best .ak-pack-badge { background: var(--ak-cta); }
.ak-pack-badge--ghost { background: #8a94a3; }
.ak-pack img { height: 11rem; width: auto; max-width: 100%; object-fit: contain; }
.ak-pack-name { font-size: 1.9rem; font-weight: 800; }
.ak-pack-name small { display: block; font-size: 1.3rem; font-weight: 500; color: var(--ak-muted); }
.ak-pack-off { background: #e11d48; color: #fff; font-size: 1.3rem; font-weight: 800; border-radius: 0.4rem; padding: 0.2rem 0.8rem; }
.ak-pack-price { font-size: 3rem; font-weight: 800; color: var(--ak-cta); line-height: 1.1; }
.ak-pack-price small { font-size: 1.4rem; color: var(--ak-muted); font-weight: 600; }
.ak-pack-cup { font-size: 1.35rem; font-weight: 700; color: var(--ak-brand); }
.ak-pack-total { font-size: 1.3rem; color: var(--ak-muted); }
.ak-pack-total s { color: #e11d48; margin-inline-start: 0.3rem; }
.ak-pack-btn {
  margin-top: auto; width: 100%; text-align: center; border-radius: 99rem; padding: 1.1rem 0.6rem;
  font-size: 1.5rem; font-weight: 800; background: #fff; color: var(--ak-cta); border: 2px solid var(--ak-cta);
}
.ak-pack--best .ak-pack-btn { background: var(--ak-cta); color: #fff; box-shadow: 0 6px 16px rgba(75,166,20,.3); }
.cylo-container .cylo-offer-guarantee { font-size: 1.45rem; }
.cylo-container .cylo-offer-badge { border-color: #c9dccf; }

/* ── FAQ ── */
.cylo-container .faqs-container-faqs { width: 100%; }
.cylo-container .faqs-container-faqs-row-question { font-size: 1.8rem; padding: 1.8rem 2rem; }
.cylo-container .faqs-container-faqs-row-answer p { margin: 0 0 1.6rem; line-height: 1.65; }

/* ── Secondary testimonials ── */
.cylo-container .testimonial-container-row-image { border-radius: 50%; }
.cylo-container .testimonial-container-row-text-name { color: var(--ak-brand); }

/* ── Sidebar ── */
.cylo-sidebar-container-title h2 { font-size: 2.2rem; font-weight: 800; color: var(--ak-brand); margin-bottom: 0.4rem; }
.ak-side-sub { font-family: var(--ak-body); font-size: 1.45rem; color: var(--ak-muted); line-height: 1.5; margin: 0; }
.ak-side-price {
  display: flex; justify-content: space-between; align-items: center; margin-top: 1.4rem;
  font-family: var(--ak-body); font-size: 1.45rem;
}
.ak-side-price strong { color: var(--ak-cta); font-size: 1.9rem; }
.ak-side-off { background: #e11d48; color: #fff; font-weight: 800; font-size: 1.2rem; border-radius: 0.4rem; padding: 0.3rem 0.7rem; }
.cylo-sidebar-container-button { margin-top: 1.2rem; }
.ak-side-guarantee { text-align: center; font-family: var(--ak-body); font-size: 1.25rem; color: var(--ak-muted); margin-top: 0.8rem; }
.cylo-sidebar-container-testimonial { background: #fff; border: 1px solid var(--ak-line); border-radius: 1.2rem; padding: 1.4rem; }
.cylo-sidebar-container-testimonial-article { line-height: 1.55; }

/* ── Sticky bar ── */
.ak-sticky-sub { display: block; font-size: 1.2rem; font-weight: 600; color: var(--ak-cta); }
.cylo-sticky-btn { text-transform: none; border-radius: 99rem; font-size: 1.5rem; }

/* ── Exit modal ── */
.exit-intent-heading { text-decoration: none; color: var(--ak-brand); }
.exit-intent-cta { background-color: var(--ak-cta); color: #fff; border-radius: 99rem; }

/* ── Mobile ── */
@media screen and (max-width: 750px) {
  .cylo-container .header { padding: 0.5rem 1.5rem; }
  .cylo-container .header-container-title h1 { font-size: 2.9rem; }
  .cylo-container .header-container-subtitle a { font-size: 1.7rem; }
  .ak-trust { display: grid; grid-template-columns: 1fr 1fr; font-size: 1.3rem; gap: 0.8rem 1rem; }
  .cylo-container .content { padding: 0.5rem 1.5rem; }
  .cylo-container .content h2 { font-size: 2.3rem; margin-top: 4rem; }
  .cylo-container .content .article { font-size: 1.7rem; }
  .ak-lead { font-size: 2rem; }
  .cylo-container .content .button a { display: block; font-size: 1.9rem; padding: 1.6rem 1.2rem; }
  .ak-ingredients { grid-template-columns: 1fr; }
  .ak-how { grid-template-columns: 1fr; }
  .ak-how .cylo-how-step { display: grid; grid-template-columns: 4.4rem 1fr; column-gap: 1.4rem; text-align: start; padding: 1.6rem; }
  .ak-how-num { grid-row: span 2; }
  .cylo-container .content .ak-how .cylo-how-step h3 { margin: 0; }
  .cylo-container .testimonials { padding: 1rem 1.5rem 1.5rem; gap: 1.4rem; }
  .cylo-container .testimonials-title h2 { font-size: 2.4rem; }
  /* mobile testimonial: photo thumbnail left, text right — no full-screen cards */
  .cylo-container .testimonials-row {
    display: grid; grid-template-columns: 9.6rem 1fr; grid-template-rows: auto auto 1fr;
    column-gap: 0;
  }
  .cylo-container .testimonials-row-image { grid-column: 1; grid-row: 1 / span 3; align-self: stretch; }
  .cylo-container .testimonials-row-image img { height: 100%; min-height: 12rem; aspect-ratio: auto; }
  .cylo-container .testimonials-row-name,
  .cylo-container .testimonials-row-score,
  .cylo-container .testimonials-row-article { grid-column: 2; padding-left: 1.4rem; padding-right: 1.4rem; }
  .cylo-container .testimonials-row-article { font-size: 1.5rem; padding-bottom: 1.4rem; }
  .ak-guarantee .article { padding: 2rem 1.8rem 1rem !important; }
  .ak-seal { width: 8.6rem; height: 8.6rem; font-size: 0.9rem; }
  .ak-seal span { font-size: 2.6rem; }
  .cylo-container .cylo-offer { margin: 2rem 0; padding: 2.4rem 1.4rem 1.8rem; }
  .ak-packs { grid-template-columns: 1fr; gap: 2.2rem; }
  .ak-pack--best { order: -1; }
  .ak-pack {
    display: grid; grid-template-columns: 10rem 1fr; column-gap: 1.4rem; row-gap: 0.3rem;
    align-items: center; text-align: start; padding: 2.4rem 1.4rem 1.4rem;
  }
  .ak-pack img { grid-column: 1; grid-row: 1 / span 5; height: auto; width: 10rem; }
  .ak-pack > span:not(.ak-pack-badge):not(.ak-pack-btn) { grid-column: 2; justify-self: start; }
  .ak-pack-btn { grid-column: 1 / -1; margin-top: 1rem; }
  .cylo-container .faqs { padding: 3rem 1.5rem 2rem; }
  .cylo-container .faqs-container-faqs-row-question { font-size: 1.7rem; padding: 1.6rem; }
  .cylo-container .testimonial { padding: 2rem 1.5rem; }
}
