/* =========================================================
   CENÍK — NOVÁ STRUKTURA (pages/page-cenik.php)
   Scoped: .mc-page-cenik
   FULL přes střed + pravý sloupec (levý sloupec = menu)
   ========================================================= */

/* --- Vynucení rozsahu na střed + pravý sloupec (když je zanořen v modulu) --- */
@media (min-width: 980px){
  :where(.mc-wrap, .mc-content, .content, .site-grid, .site-main, .container, .main)
  > :where(.vc_row, .wp-block-group, .module, .mc-section, .entry-content, .mc-card, .section):has(.mc-page-cenik){
    grid-column: 2 / -1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }
}

/* --- Wrapper + proměnné pro srovnání výšek --- */
.mc-page-cenik{
  padding: 10px clamp(14px, 4vw, 28px);
  width: 100%;
  max-width: none;

  /* ⭐ ladící proměnné: „baseline“ podle nejdelší karty (Mág) */
  --h-row1: 136px; /* 1) Soul Grimoire – max 4 body */
  --h-row2: 136px; /* 2) Vědomě k sobě – max 4 body */
  --h-row3: 84px;  /* 3) Vědomé cesty – max 2 body */
  --h-row4: 132px; /* 4) Mapa duše – max 3 body (u Mága obvykle víc textu) */
  --h-row5: 60px;  /* 5) Liliths – 1 bod */
  --h-row6: 92px;  /* 6) má CESTA – max 2 body */

  /* ⭐ mezera mezi nadpisem a barevným proužkem */
  --title-stripe-gap: 10px;
}
@supports (grid-column: 1 / -1){
  .mc-page-cenik{ grid-column: 1 / -1; } /* mimo levé menu – střed + pravý */
}

/* --- Hero --- */
.mc-page-cenik .mc-hero{
  border-radius: 16px;
  padding: 24px clamp(16px, 4vw, 40px);
  margin: 0 0 14px;
  width: 100%;
  background:
    linear-gradient(135deg, rgba(15,122,67,.10), rgba(22,57,80,.10)),
    #fff;
}
.mc-page-cenik .mc-hero h1{ margin:0; font-weight:900; color:var(--wp--preset--color--foreground, #111); }
.mc-page-cenik .mc-hero p{ margin:8px 0 0; max-width:980px; opacity:.9; }

/* --- Grid karet --- */
.mc-page-cenik .mc-box-grid{
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch; /* karty stejné výšky */
}
@media (max-width: 1280px){ .mc-page-cenik .mc-box-grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 980px){  .mc-page-cenik .mc-box-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px){  .mc-page-cenik .mc-box-grid{ grid-template-columns: 1fr; } }

/* --- Karta --- */
/* ⭐ přechod na grid, aby CTA vždy sedělo dole a „těla“ se vyrovnala */
.mc-page-cenik .mc-box{
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(11,59,92,.14);
  box-shadow: 0 4px 22px rgba(0,0,0,.05);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr auto; /* head | body (roztáhne se) | CTA */
  height: 100%;
  transition: box-shadow .15s ease, border-color .15s ease, transform .06s ease;
}
.mc-page-cenik .mc-box:hover,
.mc-page-cenik .mc-box:focus-within{
  border-color: rgba(11,59,92,.35);
  box-shadow: 0 8px 22px rgba(11,59,92,.14);
}

/* --- Header (1. řádek: ikona | cena, 2. řádek: název) --- */
.mc-page-cenik .mc-box-head{ padding: 18px 20px; text-align: left; }
.mc-page-cenik .mc-box-top{
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas:
    "icon . price"
    "title title title";
  align-items: center;
  gap: 12px 14px;
}
.mc-page-cenik .mc-tiericon{ grid-area: icon; }
.mc-page-cenik .mc-price   { grid-area: price; justify-self: end; }
.mc-page-cenik .mc-box-title{
  grid-area: title;
  margin: 2px 0 0;
  line-height:1.15;
  position: relative;                /* ⭐ kvůli proužku */
}
.mc-page-cenik .mc-tiericon svg{ width:34px; height:34px; display:block; color:#0B3B5C; }
.mc-page-cenik .mc-box-title .mc-line1{ display:block; font-size:.85rem; opacity:.75; }
.mc-page-cenik .mc-box-title .mc-line2{ display:block; font-weight:800; font-size:1.25rem; color:#0B3B5C; }

.mc-page-cenik .mc-price{
  font-weight: 700;
  font-size: 18px;  /* menší než název */
  line-height: 1;
  color:#0B3B5C;
}

@media (max-width:520px){
  .mc-page-cenik .mc-box-top{
    grid-template-columns: 1fr;
    grid-template-areas:
      "icon"
      "price"
      "title";
    text-align:center;
  }
  .mc-page-cenik .mc-price{ justify-self:center; font-size:17px; }
}

/* popisek pod title (větší odsazení pod proužkem) */
.mc-page-cenik .mc-sub{ margin:14px 0 0; opacity:.82; }
.mc-page-cenik .mc-quote{ margin:10px 0 0; font-style:italic; color:#123; opacity:.9; }

/* --- Body + loga (logo NAD seznamem) --- */
.mc-page-cenik .mc-box-body{
  padding: 6px 20px 16px;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 10px;
}
.mc-page-cenik .mc-box-body h4{
  margin: 14px 0 6px;
  min-height: 52px;
  display: flex;
  align-items: center;
}
.mc-page-cenik .mc-box-body h4 img{
  height: 40px; width:auto; max-width:100%;
  vertical-align: middle; display:inline-block;
}
@media (min-width:1280px){
  .mc-page-cenik .mc-box-body h4{ min-height: 60px; }
  .mc-page-cenik .mc-box-body h4 img{ height:48px; }
}
.mc-page-cenik .mc-ul{ margin: 0 0 12px 18px; padding-left: 0; }
.mc-page-cenik .mc-ul li{ margin:4px 0; }

/* --- CTA --- */
.mc-page-cenik .mc-cta{ padding: 12px 20px 18px; }
.mc-page-cenik .mc-btn{ display:inline-block; padding:.7rem 1.05rem; border-radius:14px; text-decoration:none; }
.mc-page-cenik .mc-btn--primary{
  background: linear-gradient(90deg,#0B3B5C,#0E6D88);
  color:#fff; border:0; box-shadow:0 6px 18px rgba(11,59,92,.18);
  transition: transform .06s ease, filter .06s ease;
}
.mc-page-cenik .mc-btn--primary:hover{ filter:brightness(1.04); transform: translateY(-1px); }

/* --- Barevné akcenty (proužek pod názvem) --- */
/* ⭐ proužek odsazený níž: ovládá ho --title-stripe-gap */
.mc-page-cenik .mc-box:nth-of-type(1) .mc-box-title::after,
.mc-page-cenik .mc-box:nth-of-type(2) .mc-box-title::after,
.mc-page-cenik .mc-box:nth-of-type(3) .mc-box-title::after,
.mc-page-cenik .mc-box:nth-of-type(4) .mc-box-title::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom: calc(-1 * var(--title-stripe-gap));  /* bylo -4px */
  height:2px;
}
.mc-page-cenik .mc-box:nth-of-type(1) .mc-box-title::after{
  background: linear-gradient(90deg, rgba(62,143,97,0), rgba(62,143,97,.9), rgba(62,143,97,0));
}
.mc-page-cenik .mc-box:nth-of-type(2) .mc-box-title::after{
  background: linear-gradient(90deg, rgba(11,59,92,0), rgba(11,59,92,.9), rgba(11,59,92,0));
}
.mc-page-cenik .mc-box:nth-of-type(3) .mc-box-title::after{
  background: linear-gradient(90deg, rgba(142,86,156,0), rgba(142,86,156,.9), rgba(142,86,156,0));
}
.mc-page-cenik .mc-box:nth-of-type(4) .mc-box-title::after{
  background: linear-gradient(90deg, rgba(236,142,47,0), rgba(236,142,47,.9), rgba(236,142,47,0));
}

/* --- Srovnání výšek bloků značek napříč kartami (logo + body) --- */
/* ⭐ stejné jako dřív, ale napojené na proměnné (baseline = Mág) */
.mc-page-cenik .mc-box-body h4:nth-of-type(1) + .mc-ul{ min-height: var(--h-row1); } /* Soul Grimoire */
.mc-page-cenik .mc-box-body h4:nth-of-type(2) + .mc-ul{ min-height: var(--h-row2); } /* Vědomě k sobě */
.mc-page-cenik .mc-box-body h4:nth-of-type(3) + .mc-ul{ min-height: var(--h-row3); } /* Vědomé cesty */
.mc-page-cenik .mc-box-body h4:nth-of-type(4) + .mc-ul{ min-height: var(--h-row4); } /* Mapa duše */
.mc-page-cenik .mc-box-body h4:nth-of-type(5) + .mc-ul{ min-height: var(--h-row5); } /* Liliths */
.mc-page-cenik .mc-box-body h4:nth-of-type(6) + .mc-ul{ min-height: var(--h-row6); } /* má CESTA */

/* --- Mobile drobnosti --- */
@media (max-width: 420px){
  .mc-page-cenik .mc-box-head{ padding: 16px 14px; }
  .mc-page-cenik .mc-box-body{ padding: 6px 14px 14px; }
  .mc-page-cenik .mc-cta{ padding: 12px 14px 16px; }
  .mc-page-cenik .mc-tiericon svg{ width:26px; height:26px; }
  .mc-page-cenik .mc-line2{ font-size: 1.15rem; }
  .mc-page-cenik .mc-price{ font-size: 17px; }
  /* na velmi úzkých displejích můžeš lehce stáhnout gap proužku */
  .mc-page-cenik{ --title-stripe-gap: 8px; }
}
/* --- Zarovnání výšky hlavičky napříč kartami --- */
/* doladíš jedním číslem podle reality, 112–124px bývá safe */
.mc-page-cenik{ --head-min: 118px; }

.mc-page-cenik .mc-box-head{
  min-height: var(--head-min);
  display: grid;
  align-content: start;   /* obsah zůstane nahoře */
}

/* na úzkých displejích nepotřebujeme fixní výšku */
@media (max-width:520px){
  .mc-page-cenik .mc-box-head{ min-height: auto; }
}