/* Start custom CSS for html, class: .elementor-element-dae7dc1 *//* ============================================================
   RESPI — PODSTRONA AROMATU (szablon "rflv-*", wielokrotnego użytku)
   Wklej do: Elementor → strona (Cynamon) → Advanced → Custom CSS
   Ten sam plik będzie użyty bez zmian dla Mocnej Mięty i Włoskiej
   Pomarańczy — zmienia się tylko HTML (treść/zdjęcia), nie CSS.

   Spójne z systemem wizualnym wypracowanym w Aromatach / Jak to działa /
   kartach WooCommerce: nagłówki "Fraunces" (serif, normalny zapis,
   kursywa w kolorze akcentu na słowie-akcencie), etykiety/liczby/tagi
   "IBM Plex Mono", tekst "Sora". Zdjęcia dostają przygaszenie
   (mix-blend-mode:multiply) żeby ujednolicić różne źródła fotografii,
   dokładnie jak w Aromatach i "Jak to działa".
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,440;0,9..144,500;0,9..144,600;1,9..144,440;1,9..144,500&display=swap');

.rflv-hero, .rflv-about, .rflv-moments, .rflv-ingredients, .rflv-cross, .rflv-cta{
  --deep:#0F1510; --cream:#f4f6ec; --accent:#f2601c;
  font-family:"Sora",system-ui,sans-serif;
}
.rflv-hero *, .rflv-about *, .rflv-moments *, .rflv-ingredients *, .rflv-cross *, .rflv-cta *{ box-sizing:border-box; }

.rflv-eyebrow{ font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); margin:0 0 18px; }
.rflv-h2{ font-family:"Fraunces",serif; font-optical-sizing:auto; font-weight:500; color:var(--cream);
  font-size:clamp(28px,3.6vw,40px); line-height:1.16; letter-spacing:-.01em; margin:0 0 20px; }
.rflv-h2 em{ font-style:italic; color:var(--accent); }
.rflv-p{ font-size:15.5px; line-height:1.75; color:rgba(244,246,236,.66); font-weight:300; margin:0 0 18px; }
.rflv-disclaimer{ font-size:13px; line-height:1.65; color:rgba(244,246,236,.42); max-width:70ch; margin:36px auto 0; text-align:center; }

/* ============================================================
   HERO
   ============================================================ */
.rflv-hero{ position:relative; background:var(--deep); color:var(--cream); padding:150px 0 110px; overflow:hidden; }
.rflv-hero::before{ content:""; position:absolute; top:-15%; left:-8%; width:600px; height:600px; z-index:0;
  background:radial-gradient(circle, rgba(242,96,28,.12), rgba(242,96,28,0) 70%); pointer-events:none; }

.rflv-hero-shell{ position:relative; z-index:1; max-width:1280px; margin:0 auto; padding:0 40px;
  display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }

.rflv-breadcrumb{ font-family:"IBM Plex Mono",monospace; font-size:11.5px; letter-spacing:.04em;
  color:rgba(244,246,236,.42); margin:0 0 28px; }
.rflv-breadcrumb a{ color:rgba(244,246,236,.62); text-decoration:none; transition:color .2s ease; }
.rflv-breadcrumb a:hover{ color:var(--accent); }
.rflv-breadcrumb span{ margin:0 8px; opacity:.5; }

.rflv-hero-kicker{ display:flex; align-items:center; gap:14px; margin:0 0 22px; }
.rflv-hero-pill{ display:inline-flex; align-items:center; font-family:"IBM Plex Mono",monospace; font-weight:700;
  font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:#101711; background:var(--accent);
  padding:7px 14px; border-radius:999px; }
.rflv-hero-eyebrow{ font-family:"IBM Plex Mono",monospace; font-size:11.5px; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(244,246,236,.42); }

.rflv-h1{ font-family:"Fraunces",serif; font-optical-sizing:auto; font-weight:500; color:var(--cream);
  font-size:clamp(48px,7vw,84px); line-height:1; letter-spacing:-.02em; margin:0 0 20px; }
.rflv-lead{ font-size:17px; line-height:1.6; color:rgba(244,246,236,.68); max-width:42ch; font-weight:300; margin:0 0 30px; }

.rflv-tagrow{ display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin:0 0 34px;
  padding:22px 0; border-top:1px solid rgba(244,246,236,.14); border-bottom:1px solid rgba(244,246,236,.14); }
.rflv-intensity{ display:flex; align-items:center; gap:10px; }
.rflv-intensity-label{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(244,246,236,.42); }
.rflv-leaves{ display:flex; gap:4px; }
.rflv-leaves svg{ width:13px; height:13px; fill:rgba(244,246,236,.2); flex:none; }
.rflv-leaves svg.is-filled{ fill:var(--accent); }
.rflv-tag{ font-family:"Fraunces",serif; font-style:italic; font-weight:400; font-size:16px; color:rgba(244,246,236,.7); }

.rflv-price-row{ display:flex; align-items:baseline; gap:12px; margin:0 0 30px; }
.rflv-price-label{ font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.05em;
  text-transform:uppercase; color:rgba(244,246,236,.5); }
.rflv-price-value{ font-family:"IBM Plex Mono",monospace; font-weight:600; font-size:22px; color:var(--accent); }

.rflv-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.rflv-btn{ display:inline-flex; align-items:center; gap:9px; font-family:"IBM Plex Mono",monospace; font-weight:700;
  font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; padding:17px 28px; border-radius:999px;
  text-decoration:none; transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease; }
.rflv-btn svg{ width:16px; height:16px; transition:transform .25s ease; }
.rflv-btn--primary{ background:var(--accent); color:#101711; }
.rflv-btn--primary:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(242,96,28,.35); }
.rflv-btn--primary:hover svg{ transform:translateX(3px); }
.rflv-btn--ghost{ background:transparent; color:var(--cream); border:1.5px solid rgba(244,246,236,.3);
  padding:15.5px 26px; }
.rflv-btn--ghost:hover{ background:rgba(244,246,236,.08); }

.rflv-hero-visual{ position:relative; isolation:isolate; border-radius:28px; overflow:hidden;
  aspect-ratio:4/5; background:#141915; box-shadow:0 30px 70px rgba(0,0,0,.4); }
.rflv-hero-visual img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.9); }
.rflv-hero-grade{ position:absolute; inset:0; background:var(--deep); mix-blend-mode:multiply; opacity:.3; }
.rflv-hero-scrim{ position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(9,12,9,0) 50%, rgba(9,12,9,.75) 100%); }
.rflv-hero-script{ position:absolute; left:30px; right:30px; bottom:28px; margin:0; z-index:2;
  font-family:"Fraunces",serif; font-style:italic; font-weight:500; font-size:20px; line-height:1.3; color:var(--cream); }

@media (max-width:900px){
  .rflv-hero{ padding:120px 0 80px; }
  .rflv-hero-shell{ grid-template-columns:1fr; gap:44px; padding:0 24px; }
  .rflv-hero-visual{ aspect-ratio:5/4; order:-1; }
}

/* ============================================================
   O SMAKU
   ============================================================ */
.rflv-about{ background:var(--deep); color:var(--cream); padding:120px 0; }
.rflv-about-shell{ max-width:1280px; margin:0 auto; padding:0 40px; display:grid;
  grid-template-columns:1fr 1fr; gap:80px; align-items:center; }

.rflv-about-media{ position:relative; isolation:isolate; border-radius:24px; overflow:hidden;
  aspect-ratio:1/1; background:#141915; }
.rflv-about-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.9); }
.rflv-about-grade{ position:absolute; inset:0; background:var(--deep); mix-blend-mode:multiply; opacity:.28; }

.rflv-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:32px;
  padding-top:28px; border-top:1px solid rgba(244,246,236,.14); }
.rflv-stat{ display:flex; flex-direction:column; gap:8px; }
.rflv-stat-label{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(244,246,236,.42); }
.rflv-stat-value{ font-family:"Fraunces",serif; font-weight:500; font-size:17px; color:var(--cream); }

@media (max-width:900px){
  .rflv-about{ padding:90px 0; }
  .rflv-about-shell{ grid-template-columns:1fr; gap:40px; padding:0 24px; }
  .rflv-stats{ grid-template-columns:1fr; gap:16px; }
}

/* ============================================================
   KIEDY SIĘGNĄĆ PO ... (momenty)
   ============================================================ */
.rflv-moments{ background:#0c110d; color:var(--cream); padding:120px 0; }
.rflv-moments-shell{ max-width:1280px; margin:0 auto; padding:0 40px; }
.rflv-moments-head{ max-width:600px; margin:0 auto 56px; text-align:center; }
.rflv-moments-head .rflv-h2{ margin:0 0 0; }

.rflv-moments-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.rflv-moment{ position:relative; isolation:isolate; overflow:hidden; border-radius:22px; margin:0;
  aspect-ratio:3/4; background:#141915; box-shadow:0 16px 40px rgba(0,0,0,.3);
  transition:transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s cubic-bezier(.16,1,.3,1); }
.rflv-moment:hover{ transform:translateY(-6px); box-shadow:0 24px 54px rgba(0,0,0,.4), 0 0 0 1px rgba(242,96,28,.35); }
.rflv-moment img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.88);
  transition:transform .9s cubic-bezier(.16,1,.3,1); }
.rflv-moment:hover img{ transform:scale(1.06); }
.rflv-moment-grade{ position:absolute; inset:0; background:var(--deep); mix-blend-mode:multiply; opacity:.32; }
.rflv-moment-scrim{ position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(9,12,9,0) 40%, rgba(9,12,9,.88) 100%); }
.rflv-moment figcaption{ position:relative; z-index:2; display:flex; flex-direction:column; gap:8px;
  padding:24px; margin-top:auto; height:100%; justify-content:flex-end; }
.rflv-moment-label{ font-family:"IBM Plex Mono",monospace; font-weight:700; font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--accent); }
.rflv-moment-quote{ font-family:"Fraunces",serif; font-style:italic; font-weight:400; font-size:16px;
  line-height:1.4; color:var(--cream); }

@media (max-width:900px){
  .rflv-moments{ padding:90px 0; }
  .rflv-moments-shell{ padding:0 24px; }
  .rflv-moments-grid{ grid-template-columns:1fr; gap:18px; }
  .rflv-moment{ aspect-ratio:4/3; }
}

/* ============================================================
   SKŁAD I PRZEJRZYSTOŚĆ
   ============================================================ */
.rflv-ingredients{ background:var(--deep); color:var(--cream); padding:120px 0; }
.rflv-ingredients-shell{ max-width:1180px; margin:0 auto; padding:0 40px; }
.rflv-ingredients-head{ max-width:600px; margin:0 auto 56px; text-align:center; }

.rflv-ingredients-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:rgba(244,246,236,.1); }
.rflv-ingredient{ background:var(--deep); padding:38px 30px; display:flex; flex-direction:column; gap:16px; }
.rflv-ingredient-icon{ width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(244,246,236,.2); background:transparent; color:var(--cream);
  transition:border-color .3s ease, background .3s ease, color .3s ease; }
.rflv-ingredient-icon svg{ width:22px; height:22px; }
.rflv-ingredient:hover .rflv-ingredient-icon{ border-color:var(--accent); background:var(--accent); color:#101711; }
.rflv-ingredient-h3{ font-family:"Fraunces",serif; font-optical-sizing:auto; font-weight:500; font-size:18px;
  color:var(--cream); margin:0; }
.rflv-ingredient-desc{ font-size:14px; line-height:1.6; color:rgba(244,246,236,.56); margin:0; font-weight:300; }

@media (max-width:900px){
  .rflv-ingredients{ padding:90px 0; }
  .rflv-ingredients-shell{ padding:0 24px; }
  .rflv-ingredients-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .rflv-ingredients-grid{ grid-template-columns:1fr; }
}

/* ============================================================
   POZNAJ POZOSTAŁE AROMATY (cross-sell)
   ============================================================ */
.rflv-cross{ background:#0c110d; color:var(--cream); padding:120px 0; }
.rflv-cross-shell{ max-width:1180px; margin:0 auto; padding:0 40px; text-align:center; }
.rflv-cross-head{ max-width:560px; margin:0 auto 48px; }

.rflv-cross-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin:0 0 40px; text-align:left; }
.rflv-cross-tile{ display:flex; flex-direction:column; gap:10px; padding:32px 30px; border-radius:20px;
  background:rgba(244,246,236,.03); border:1px solid rgba(244,246,236,.1); text-decoration:none;
  transition:border-color .3s ease, background .3s ease, transform .3s ease; }
.rflv-cross-tile:hover{ border-color:rgba(242,96,28,.4); background:rgba(244,246,236,.05); transform:translateY(-4px); }
.rflv-cross-tile-name{ font-family:"Fraunces",serif; font-optical-sizing:auto; font-weight:500; font-size:22px; color:var(--cream); }
.rflv-cross-tile-tag{ font-family:"Fraunces",serif; font-style:italic; font-weight:400; font-size:14.5px; color:rgba(244,246,236,.6); }
.rflv-cross-tile-link{ display:inline-flex; align-items:center; gap:6px; margin-top:8px; font-family:"IBM Plex Mono",monospace;
  font-weight:500; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.rflv-cross-tile-link span{ transition:transform .25s ease; }
.rflv-cross-tile:hover .rflv-cross-tile-link span{ transform:translateX(3px); }

.rflv-cross-all{ display:inline-flex; align-items:center; font-family:"IBM Plex Mono",monospace; font-weight:600;
  font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:rgba(244,246,236,.7); text-decoration:underline;
  text-underline-offset:4px; transition:color .2s ease; }
.rflv-cross-all:hover{ color:var(--accent); }

@media (max-width:700px){
  .rflv-cross{ padding:90px 0; }
  .rflv-cross-shell{ padding:0 24px; }
  .rflv-cross-grid{ grid-template-columns:1fr; }
}

/* ============================================================
   CTA ZAKUPOWE
   ============================================================ */
.rflv-cta{ position:relative; background:var(--deep); color:var(--cream); padding:130px 0; overflow:hidden; text-align:center; }
.rflv-cta::before{ content:""; position:absolute; bottom:-25%; left:50%; transform:translateX(-50%); width:800px; height:800px;
  background:radial-gradient(circle, rgba(242,96,28,.12), rgba(242,96,28,0) 70%); pointer-events:none; }
.rflv-cta-shell{ position:relative; z-index:1; max-width:680px; margin:0 auto; padding:0 32px; }
.rflv-cta-eyebrow{ font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); margin:0 0 20px; }
.rflv-cta-h2{ font-family:"Fraunces",serif; font-optical-sizing:auto; font-weight:500; color:var(--cream);
  font-size:clamp(30px,4.4vw,48px); line-height:1.14; letter-spacing:-.01em; margin:0 0 20px; }
.rflv-cta-sub{ font-size:15.5px; line-height:1.7; color:rgba(244,246,236,.62); font-weight:300; margin:0 0 40px; }

.rflv-cta-actions{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px; margin:0 0 40px; }
.rflv-cta-btn{ display:inline-flex; align-items:center; gap:9px; font-family:"IBM Plex Mono",monospace; font-weight:700;
  font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; padding:17px 28px; border-radius:999px;
  text-decoration:none; transition:transform .25s ease, box-shadow .25s ease, background .25s ease; }
.rflv-cta-btn svg{ width:16px; height:16px; }
.rflv-cta-btn--primary{ background:var(--accent); color:#101711; }
.rflv-cta-btn--primary:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(242,96,28,.35); }
.rflv-cta-btn--ghost{ background:transparent; color:var(--cream); border:1.5px solid rgba(244,246,236,.3); padding:15.5px 26px; }
.rflv-cta-btn--ghost:hover{ background:rgba(244,246,236,.08); }

.rflv-cta-trust{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:28px; }
.rflv-cta-trust-item{ display:inline-flex; align-items:center; gap:8px; font-family:"IBM Plex Mono",monospace;
  font-size:11.5px; letter-spacing:.02em; color:rgba(244,246,236,.5); }
.rflv-cta-trust-item svg{ width:16px; height:16px; color:var(--accent); flex:none; }

@media (max-width:560px){
  .rflv-cta{ padding:90px 0; }
  .rflv-cta-actions{ flex-direction:column; align-items:stretch; }
  .rflv-cta-btn{ justify-content:center; }
  .rflv-cta-trust{ flex-direction:column; gap:14px; }
}

@media (prefers-reduced-motion: reduce){
  .rflv-moment, .rflv-moment img, .rflv-ingredient-icon, .rflv-cross-tile, .rflv-btn, .rflv-cta-btn{ transition:none; }
}/* End custom CSS */