/* =====================
   ROOT & RESET
===================== */
:root{
  --bg:#fbf7f2;
  --ink:#2b2622;
  --muted:#6b625b;

  --rose:#d8a1a8;
  --rose-soft:#f6e8eb;

  --gold:#c79b45;
  --gold-soft:#f7f1e3;

  --mint:#9bbfb3;
  --mint-soft:#eef6f3;

  --card:#ffffff;
  --border:rgba(43,38,34,.08);

  --radius:22px;
  --shadow:0 20px 50px rgba(43,38,34,.08);
}

*{ box-sizing:border-box; }

body{
  margin:0;
  font-family:'Inter',system-ui,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}

h1,h2,h3,h4{
  font-family:'Playfair Display',serif;
  margin:0;
  letter-spacing:-0.01em;
}



p{ margin:0; }

a{
  color:inherit;
  text-decoration:none;
}

.container{
  max-width:1120px;
  margin:0 auto;
  padding:0 20px;
}

/* =====================
   BUTTONS
===================== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  font-weight:700;
  padding:14px 26px;
  border:1px solid transparent;
  transition:all .25s ease;
}

/* hlavní CTA – růžové */
.btn.primary{
  background:linear-gradient(135deg,#d8a1a8,#c78b96);
  color:#fff;
  box-shadow:0 14px 34px rgba(199,139,150,.35);
}

.btn.primary:hover{
  transform:translateY(-2px);
  box-shadow:0 20px 46px rgba(199,139,150,.50);
}

/* sekundární */
.btn.ghost{
  border:1.5px solid rgba(199,155,69,.45); /* jemné zlaté ohraničení */
  background:transparent;
  color:#6b625b;
  border-radius:999px;
  padding:14px 26px;
  font-weight:600;
  transition:all .25s ease;
}

.btn.ghost:hover{
  background:rgba(199,155,69,.08); /* jemný hover */
  border-color:rgba(199,155,69,.7);
  transform:translateY(-1px);
}


.btn.big{
  font-size:16px;
  padding:18px 34px;
}

.btn.full{ width:100%; }

/* =====================
   NAV
===================== */
.nav{
  position:sticky;
  top:0;
  z-index:10;
  background:rgba(251,247,242,.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}

.nav-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 0;
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
}

.brand-mark{
  font-size:20px;
  color:var(--rose);
  transform:translateY(-1px);
}

.brand-name{
  font-family:'Fraunces',serif;
  font-size:20px;
  letter-spacing:.3px;
}

/* legacy (když někde zůstane svg) */
.moon{ width:22px; height:22px; display:block; }

.nav-links{
  display:flex;
  gap:22px;
  align-items:center;
}

.nav-links a{
  font-size:14px;
  color:var(--muted);
}

/* =====================
   HERO
===================== */
.hero{
  padding:90px 0 80px;
  text-align:center;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 18px;
  border-radius:999px;
  background:var(--rose-soft);
  color:#9d4c57;
  font-size:13px;
  margin-bottom:22px;
}

.h1{
  font-size:clamp(36px,5vw,56px);
  line-height:1.15;
  margin-bottom:16px;
}



.accent{
  color:var(--gold);
  font-weight:600;
}

.sub{
  max-width:720px;
  margin:0 auto 36px;
  color:var(--muted);
  font-size:18px;
}

.hero-actions{
  display:flex;
  gap:18px;
  justify-content:center;
  flex-wrap:wrap;
}

.meta-row{
  display:flex;
  justify-content:center;
  gap:26px;
  margin-top:26px;
  color:var(--muted);
  font-size:14px;
}

/* =====================
   SECTIONS
===================== */
.section{ padding:48px 0; }
.section.tint{ background:#fff; }

.section-head{
  text-align:center;
  max-width:720px;
  margin:0 auto 34px;
}

.h2{
  font-size:clamp(30px,4vw,44px);
  margin-bottom:16px;
}

.lead{ color:var(--muted); }

.tag{
  display:inline-block;
  padding:6px 16px;
  border-radius:999px;
  font-size:12px;
  margin-bottom:16px;
}

.tag.rose{ background:var(--rose-soft); color:#9d4c57; }
.tag.gold{ background:var(--gold-soft); color:#8a6a22; }
.tag.mint{ background:var(--mint-soft); color:#3e6e63; }

/* =====================
   CARDS & GRIDS
===================== */
.grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}

.grid-2{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px;
}

.card{
  background:var(--card);
  border-radius:var(--radius);
  padding:32px;
  box-shadow:var(--shadow);
}

.card.soft{ background:#fff; }

.icon-badge{
  width:42px;
  height:42px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
}

.icon-badge.rose{ background:var(--rose-soft); color:#9d4c57; }
.icon-badge.gold{ background:var(--gold-soft); color:#8a6a22; }

.card-title{ margin-bottom:10px; }
.card-text{ color:var(--muted); }

/* =====================
   FEATURES
===================== */
.feature-card{
  display:flex;
  gap:18px;
  background:var(--card);
  padding:26px;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.feature-title{ margin-bottom:6px; }
.feature-text{ color:var(--muted); }

/* =====================
   QUOTE (světlá sekce - Sarah)
===================== */
.quote{
  max-width:860px;
  margin:34px auto 0;
  padding:22px 26px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(216,161,168,.18),rgba(216,161,168,.06));
  border:1px solid rgba(216,161,168,.25);
  position:relative;
}

.quote::before{
  content:"“";
  position:absolute;
  top:-18px;
  left:18px;
  font-family:'Fraunces',serif;
  font-size:64px;
  line-height:1;
  color:rgba(199,155,69,.45);
}

.quote-text{
  color:var(--ink);
  font-size:16px;
  line-height:1.7;
}

.quote-by{
  margin:10px 0 0;
  color:var(--muted);
  font-size:13px;
}


.founder-quote{
  max-width:900px;
  margin:40px auto 0;
  padding:28px 32px;
  display:flex;
  gap:24px;
  align-items:center;
  background:linear-gradient(180deg,#fff,#fbf3f5);
  border-radius:22px;
  box-shadow:0 18px 40px rgba(43,38,34,.08);
}

.founder-photo{
  width:96px;
  height:96px;
  border-radius:50%;
  object-fit:cover;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
  flex-shrink:0;
}

.founder-text .quote-text{
  font-size:16px;
  line-height:1.7;
  color:var(--ink);
  margin-bottom:10px;
}

.founder-text .quote-by{
  font-size:14px;
  color:var(--muted);
  font-weight:500;
}

/* mobil */
@media (max-width:700px){
  .founder-quote{
    flex-direction:column;
    text-align:center;
  }
}
.founder-photo{
  width: 160px;      /* ← tady zvětšuješ */
  height: 160px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

/* =====================
   LP EXAMPLE
===================== */
.lp-example{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:28px;
  align-items:center;
  margin-top:40px;
  padding:36px;
  border-radius:28px;
  background:linear-gradient(180deg,#fff 0%,#fbf3f5 100%);
  box-shadow:0 20px 50px rgba(43,38,34,.06);
}

.lp-number{
  font-family:'Fraunces',serif;
  font-size:96px;
  line-height:1;
  color:#d39aa1;
  text-align:center;
  opacity:.9;
}

.lp-text h4{
  margin-bottom:10px;
  font-size:18px;
  color:var(--ink);
}

.lp-text p{
  font-size:16px;
  color:var(--muted);
  margin-bottom:10px;
}

.lp-soft{
  font-size:15px;
  color:#8a6f73;
  font-style:italic;
}

/* =====================
   STEPS TABLE (jednou, bez duplicit)
===================== */
.steps-table{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
  margin-top:50px;
}

.step-card{
  background:#fff;
  border-radius:var(--radius);
  padding:32px 28px;
  box-shadow:var(--shadow);
  text-align:center;
  border:1px solid var(--border);
}

.step-card.highlight{
  background:linear-gradient(180deg,var(--rose-soft),#ffffff);
  border-color:rgba(216,161,168,.4);
}

.step-top{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}

.step-number{
  font-family:'Fraunces',serif;
  font-size:14px;
  color:var(--gold);
  letter-spacing:1px;
}

.step-icon{ font-size:20px; }

.step-card h3{ margin-bottom:10px; }

.step-card p{
  color:var(--muted);
  font-size:15px;
  line-height:1.6;
}

.steps-note{
  margin-top:32px;
  text-align:center;
  font-size:14px;
  color:var(--muted);
}

/* =====================
   TESTIMONIALS + STATS
===================== */
.test-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}

.t-card{
  background:var(--card);
  padding:30px;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.stars{
  color:var(--gold);
  margin-bottom:12px;
}

.t-text{
  color:var(--muted);
  font-size:15px;
}

.t-name{
  font-weight:600;
  margin-top:14px;
}

.stats-bar{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
  margin-top:40px;
  padding:28px 32px;
  background:linear-gradient(180deg,rgba(247,241,227,.6),rgba(255,255,255,.9));
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  text-align:center;
}

.stat-item strong{
  display:block;
  font-family:'Fraunces',serif;
  font-size:32px;
  color:var(--gold);
  margin-bottom:6px;
}

@media (max-width: 768px){
  .stat-item strong{
    font-size:18px !important;
  }

  .stat-item span{
    font-size:11px !important;
  }
}

.stat-item span{
  font-size:14px;
  color:var(--muted);
}

/* =====================
   PRICING
===================== */

.pricing-wrap{
  display:flex;
  gap:32px;
  justify-content:center;
  align-items:stretch;
  flex-wrap:wrap;
}

.price-card{
  width:360px;
  max-width:420px;
  padding:42px 36px;
  border-radius:var(--radius);
  text-align:center;
  background:#fff;
  border:1px solid rgba(199,155,69,.25);
  box-shadow:0 28px 60px rgba(43,38,34,.12);
  position:relative;
}

.price-card.featured{
  box-shadow:0 30px 60px rgba(0,0,0,0.1);
  border:2px solid rgba(199,155,69,0.4);
  position:relative;
  z-index:1;
}

.price-top{
  font-size:13px;
  font-weight:600;
  color:#b35f6f;
  background:rgba(216,161,168,.22);
  padding:8px 16px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
}

.price-wrap{
  display:flex;
  justify-content:center;
  align-items:baseline;
  gap:8px;
  margin:18px 0 14px;
}

.price{
  font-family:'Fraunces',serif;
  font-size:52px;
  font-weight:700;
  color:#b8893b;
  line-height:1;
}

.price-meta{
  font-size:11px;
  color:rgba(140,111,117,.75);
  letter-spacing:.3px;
  transform:translateY(-2px);
}

.price-desc{
  font-size:15px;
  color:#3b2f33;
  line-height:1.6;
  margin-bottom:22px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  font-weight:700;
  padding:14px 26px;
  border:1px solid transparent;
  transition:all .25s ease;
  position:relative;
  z-index:20;
}

.checklist{
  list-style:none;
  padding:0;
  margin:22px 0 0;
}

.checklist li{
  display:flex;
  align-items:flex-start;
  gap:14px;
  font-size:15px;
  line-height:1.6;
  color:#2b2622;
}

.checklist .check{
  width:22px;
  height:22px;
  min-width:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:1.8px solid #c79b45;
  color:#c79b45;
  font-size:13px;
  font-weight:800;
  background:rgba(199,155,69,.08);
}
/* =====================
   FAQ
===================== */
.faq-wrap{
  max-width:760px;
  margin:0 auto;
}

.faq{
  background:var(--card);
  border-radius:var(--radius);
  padding:18px 22px;
  margin-bottom:16px;
  box-shadow:var(--shadow);
}

.faq summary{
  cursor:pointer;
  font-weight:600;
}

/* =====================
   FINAL (vyčištěné – bez divných uvozovek a bez mezer)
===================== */
.final{
  background:#2b2a55;
  color:#fff;
  padding:70px 0;
  text-align:center;
}

.final-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}

.final-h2{
  font-size:clamp(34px,4vw,52px);
}

.final-p{
  max-width:720px;
  margin:0;
  color:rgba(255,255,255,.85);
}

.final-actions{
  display:flex;
  gap:18px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:6px;
}

.final-micro{
  font-size:13px;
  color:rgba(255,255,255,.70);
  letter-spacing:.2px;
  margin-top:6px;
}

/* tmavý “quote box” jen pro final */
.final-quote{
  max-width:820px;
  width:100%;
  margin-top:8px;
  padding:22px 26px 20px;
  border-radius:18px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 40px rgba(0,0,0,.25);
  backdrop-filter:blur(10px);
  position:relative;
  text-align:center;
}

.final-quote-mark{
  position:absolute;
  top:-14px;
  left:50%;
  transform:translateX(-50%);
  font-family:'Fraunces',serif;
  font-size:38px;
  line-height:1;
  color:rgba(255,255,255,.85);
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:2px 12px 0;
}

.final-quote-text{
  margin:0;
  color:rgba(255,255,255,.92);
  font-size:16px;
  line-height:1.7;
}

/* =====================
   FOOTER
===================== */
.footer{
  background:#fff;
  padding:60px 0;
  text-align:center;
}

.footer-inner{
  display:flex;
  flex-direction:column;
  gap:22px; /* víc prostoru */
}

.footer-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.footer-desc{
  max-width:620px;
  margin:0 auto;
  color:var(--muted);
  font-size:14px;
}

.footer-links{
  display:flex;
  justify-content:center;
  gap:22px;
  font-size:14px;
  margin:0;
  flex-wrap:wrap;
}

.footer-copy{
  font-size:12px;
  color:var(--muted);
}

/* =====================
   RESPONSIVE
===================== */
@media (max-width:900px){
  .grid-3,
  .grid-2,
  .test-grid,
  .steps-table{
    grid-template-columns:1fr;
  }

  .nav-links{ display:none; }

  .lp-example{
    grid-template-columns:1fr;
    text-align:center;
  }
  .lp-number{ font-size:84px; }
}

.footer-desc{
  margin-top:12px;
  margin-bottom:28px;
}

.footer-links{
  margin-bottom:26px;
}

.footer-made{
  margin-bottom:18px;
  font-size:14px;
  color:#6f665f;
}

.footer-copy{
  margin-top:10px;
  font-size:12px;
  color:#9a9087;
}
 
.footer-links{
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
  align-items:flex-start;
}

.footer-legal{
  position:relative;
  text-align:left;
}

.footer-legal summary{
  cursor:pointer;
  list-style:none;
  font-size:14px;
  color:var(--ink);
}

.footer-legal summary::-webkit-details-marker{
  display:none;
}

.footer-legal summary::after{
  content:" ⌄";
}

.footer-legal[open] summary::after{
  content:" ⌃";
}

.footer-legal-content{
  margin-top:12px;
  padding:18px;
  width:min(420px, 90vw);
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  box-shadow:var(--shadow);
  font-size:13px;
  line-height:1.7;
  color:var(--muted);
}

.footer-legal-content h3{
  font-size:18px;
  margin-bottom:12px;
}

.footer-legal-content p{
  margin-bottom:12px;
}

@media (max-width:768px){
  .footer-links{
    flex-direction:column;
    align-items:center;
    gap:12px;
  }

  .footer-legal{
    width:100%;
    max-width:420px;
    text-align:center;
  }

  .footer-legal-content{
    text-align:left;
  }
}
