/* ===================================================================
   AGH2O – promo blok pro /registrace/  (ČISTÉ CSS)
   Soubor: /user/documents/registrace-promo.css
   Barvy z e-shopu: navy #1f407a, zelená #64ac5a, text #333.
   Breakpointy sladěné se Shoptetem: 991 / 767 / 480 px.
   =================================================================== */

/* Firemní font z e-shopu (Open Sans – stejný jako Shoptet) */
@import url('https://cdn.myshoptet.com/prj/dist/master/cms/templates/frontend_templates/shared/css/font-face/open-sans.css');

.agh2o-promo,
.agh2o-promo * { box-sizing: border-box; }

.agh2o-promo {
  font-family: 'Open Sans', Arial, sans-serif;
  margin: 32px 0;
  border: 1px solid #e8e8e8;
  border-radius: 14px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(31, 64, 122, .08);
}

/* ----- Horní část: obrázek + text ----- */
.agh2o-promo__hero {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  align-items: stretch;
}

/* === MÍSTO PRO OBRÁZEK === (URL je v JS: AGH2O_PROMO.imageUrl) */
.agh2o-promo__media {
  position: relative;
  min-height: 240px;
  background-color: #eef2f8;
  background-size: cover;
  background-position: center;
}
.agh2o-promo__media-placeholder {
  position: absolute;
  inset: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
  color: #8f9fbc;
  font-size: 13px;
  border: 2px dashed #c3cfe2;
  border-radius: 10px;
}
.agh2o-promo__media-placeholder svg { width: 34px; height: 34px; opacity: .6; }

.agh2o-promo__body {
  padding: 30px 34px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.agh2o-promo__badge {
  display: inline-block;
  align-self: flex-start;
  background: #eaf3e8;
  color: #4f8a47;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 20px;
  margin-bottom: 14px;
}

/* Vyšší specificita (.agh2o-promo …) – přebije typografii Shoptetu
   pro h2/p v obsahu, takže není potřeba !important. */
.agh2o-promo .agh2o-promo__title {
  margin: 0;
  color: #1f407a;
  font-size: clamp(26px, 2vw + 16px, 38px);
  line-height: 1.05;
  font-weight: 800;
}
.agh2o-promo .agh2o-promo__title strong { color: #1f407a; }

.agh2o-promo .agh2o-promo__subtitle {
  margin: 8px 0 0;
  color: #1f407a;
  font-size: clamp(18px, 1vw + 13px, 22px);
  font-weight: 700;
}

.agh2o-promo .agh2o-promo__text {
  margin: 14px 0 22px;
  color: #555;
  font-size: 15px;
  line-height: 1.6;
  max-width: 600px;
}
.agh2o-promo .agh2o-promo__text b { color: #333; }

.agh2o-promo .agh2o-promo__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  align-self: flex-start;
  background: #1f407a;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 14px 28px;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}
.agh2o-promo .agh2o-promo__cta:hover { background: #16315e; transform: translateY(-1px); color: #fff; }
.agh2o-promo__cta svg { width: 16px; height: 16px; }

/* ----- Spodní část: 3 výhody ----- */
.agh2o-promo__benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #eef0f4;
  background: #f7f9fc;
}
.agh2o-promo__benefit {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 26px;
  min-width: 0;
}
.agh2o-promo__benefit + .agh2o-promo__benefit { border-left: 1px solid #eef0f4; }
.agh2o-promo__benefit-icon {
  flex: 0 0 46px;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eaf0f9;
  color: #1f407a;
}
.agh2o-promo__benefit-icon svg { width: 22px; height: 22px; }
.agh2o-promo .agh2o-promo__benefit-title {
  margin: 0 0 5px;
  color: #1f407a;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
}
.agh2o-promo .agh2o-promo__benefit-text {
  margin: 0 0 5px;
  color: #6b7a90;
  font-size: 13px;
  line-height: 1.3;
}

/* ===================================================================
   RESPONSIVITA – breakpointy dle Shoptetu
   =================================================================== */

/* ----- Tablet a menší notebooky (≤ 991px) ----- */
@media (max-width: 991px) {
  .agh2o-promo__hero { grid-template-columns: 240px minmax(0, 1fr); }
  .agh2o-promo__media { min-height: 220px; }
  .agh2o-promo__body { padding: 26px 28px; }
  .agh2o-promo__benefit { padding: 18px 20px; gap: 12px; }
}

/* ----- Mobil (≤ 767px) – vše pod sebe ----- */
@media (max-width: 767px) {
  .agh2o-promo__hero { grid-template-columns: 1fr; }
  .agh2o-promo__media { min-height: 0; height: 210px; }
  .agh2o-promo__body { padding: 24px; }
  .agh2o-promo__benefits { grid-template-columns: 1fr; }
  .agh2o-promo__benefit + .agh2o-promo__benefit { border-left: 0; border-top: 1px solid #eef0f4; }
}

/* ----- Malé telefony (≤ 480px) ----- */
@media (max-width: 480px) {
  .agh2o-promo__media { height: 380px; }
  .agh2o-promo__body { padding: 20px; }
  .agh2o-promo .agh2o-promo__cta { width: 100%; justify-content: center; }
}

p.agh2o-promo__benefit-title, p.agh2o-promo__benefit-text {
    margin: 0 0 5px !important;
}