/* ================================================================
   S7.CSS — Мастерство состояния (тёмный)
================================================================ */


#s7 .bg { background-image: url('../img/bg-s7.jpg'); }

.s7-layout { height:100%; display:grid; grid-template-columns:1fr 482px; }

.s7-left { display:flex; flex-direction:column; justify-content:center; padding:0px 20px 0 150px; }

.s7-kicker { font-size:18px; color: var(--cream); margin-bottom:12px; }

.s7-title {
  font-family:'Cormorant Garamond',serif; font-size:52px;
  font-weight:600; text-transform:uppercase;
  color:var(--cream); line-height:1.1; margin-bottom:28px;
}

.s7-desc   { font-size:18px; line-height:1.2; color:var(--cream); margin-bottom:48px; }

.s7-name   { font-family:'Cormorant Garamond',serif; font-size:36px; color:var(--cream); margin-bottom:6px; font-weight: 600;}

.s7-name span  { color: #DE8B23 }

.s7-name-title { font-size:18px; color:var(--cream); margin-bottom:20px; }
.s7-bio    { font-size:16px; line-height:1.2; color:var(--cream); max-width:580px; margin-bottom:48px; }
.btn-book {
  width:max-content;
}
.s7-right { position:relative; overflow:hidden; }
.s7-photo {
  position:absolute; inset:0;
  background-image: url('../img/s7-anna.jpg');
  background-size:cover; background-position:center top; background-color:#4a2810;
}
.s7-photo-placeholder {
  position:absolute; inset:0;
  background: linear-gradient(180deg, #4a2810 0%, #2a1408 100%);
  display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond',serif; font-size:14px;
  color:rgba(245,240,232,0.3); 
}


/* Утилиты показа/скрытия */
.hide-mobile  { display: block; }
.hide-desktop { display: none;  }

@media (max-width: 480px) {
  .hide-mobile  { display: none;  }
  .hide-desktop { display: block; }
}

/* ================================================================
   S7 MOBILE
================================================================ */
#s7m .bg { background-image: url('../img/bg-s7.jpg'); }

#s7m.panel {
height: auto;

}

.s7m-content {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.s7m-top {
  padding: 48px 24px 28px;
}

.s7m-kicker {
  font-size: 13px;
  letter-spacing: 1px;
  color: rgba(245,240,232,0.6);
  margin-bottom: 8px;
  text-transform: uppercase;
}

.s7m-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--cream);
  line-height: 1.1;
  margin-bottom: 16px;
}

.s7m-desc {
  font-size: 15px;
  line-height: 1.6;
  color: var(--cream);
  margin-bottom: 28px;
}

.s7m-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 4px;
}
.s7m-name span { color: #DE8B23; }

.s7m-role {
  font-size: 15px;
  color: var(--cream);
}

/* Фото — на всю ширину */
.s7m-photo {
  width: 100%;
  height: 320px;
  background-image: url('../img/s7-anna.jpg');
  background-size: cover;
  background-position: center top;
  flex-shrink: 0;
}

.s7m-bottom {
  padding: 28px 24px 48px;
}

.s7m-subtitle {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  font-weight: 400;
  color: var(--cream);
  margin-bottom: 12px;
}

.s7m-bio {
  font-size: 15px;
  line-height: 1.6;
  color: var(--cream);
  margin-bottom: 28px;
}

.s7m-bottom .btn-book {
  width: 100%;
  text-align: center;
}

#s7m .bg {
  background-image: url('../img/bg-s7.jpg');
  position: absolute;
  inset: 0;
  z-index: 0;
}

.s7m-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}


/* ================================================================
   S8.CSS — DNA качества (светлый)
================================================================ */
#s8 .bg { background-image: url('../img/bg-s8.jpg'); }

.s8-layout {
  height:100%; display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; padding:0 150px; gap:40px;
}
.s8-col { display:flex; flex-direction:column; gap: 200px; }
.s8-col-right { align-items:flex-end; }
.s8-dna-img {
  width:380px; height:380px;
  display:flex; align-items:center; justify-content:center; position:relative;
}
.s8-dna-img img {position: absolute; width:200%; height:200%; object-fit:contain; }
.s8-dna-placeholder {
  width:100%; height:100%;
  background: radial-gradient(circle, rgba(201,169,110,0.3) 0%, transparent 70%);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
}
.s8-dna-label {
  position:absolute; top:-60px; left:50%; transform:translateX(-50%);
  font-family:'Cormorant Garamond',serif; font-size:36px; font-weight:600;
   color:var(--text-dark);
}
.s8-trait-title {
  font-family:'Cormorant Garamond',sans-serif; font-size:28px; font-weight:600;
   text-transform:uppercase; color:var(--text-dark); margin-bottom:10px;
}
.s8-trait-body { font-size:14px; line-height:1.2; color:var(--text-dark); max-width:260px; }
/* .s8-col-right .s8-trait-body { margin-left:auto; } */


/* ================================================================
   S8 MOBILE
================================================================ */
#s8m.panel {
  height: auto;
}

#s8m .bg {
  background-image: url('../img/bg-s8.jpg');
  position: absolute;
  inset: 0;
  z-index: 0;
}

.s8m-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding-bottom: 48px;
}

/* ДНК блок */
.s8m-dna {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 40px;
  margin-bottom: 32px;
}

.s8m-dna-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 8px;
}

.s8m-dna img {
  width: 360px;
  object-fit: contain;
}

/* Трейты */
.s8m-traits {
  display: flex;
  flex-direction: column;
  padding: 0 24px;
}

.s8m-trait {
  padding: 20px 0;
  border-top: 1px solid rgba(100, 70, 40, 0.2);
}

.s8m-trait:last-child {
  border-bottom: 1px solid rgba(100, 70, 40, 0.2);
}

.s8m-trait-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-dark);
  margin-bottom: 8px;
}

.s8m-trait-body {
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-dark);
}


/* ================================================================
   S9.CSS — Архетипы RI / Венн (светлый)
================================================================ */

#s9.panel {
  height: 670px;
}
#s9 .bg { background-image: url('../img/bg-s9.jpg');}

.s9-layout {
  height:100%; display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; padding:0 60px; gap:20px; position:relative;
}
.s9-title {
  position:absolute; top:100px; right:150px;
  font-family:'Cormorant Garamond',serif; font-size:36px; font-weight:600;
  color:var(--text-dark);
  /* text-shadow:
  0 0 8px #F8E0D5,
  0 0 16px #F8E0D5,
  0 0 24px #F8E0D5,
  0 0 48px #F8E0D5;
  background-color: #F8E0D5;
  backdrop-filter: background-blur(20px); */
}

.s9-title::before, .s9-caption::before {
  content: '';
  position: absolute;
  inset: -20px; /* выходит за границы элемента */
  background: #F8E0D5;
  filter: blur(20px); /* чем больше — тем размазаннее */
  z-index: -1;
}

.s9-caption {
  position:absolute; bottom:100px; left:150px;
  font-size:18px; line-height:1.2; color:var(--text-dark); max-width:320px;
}
.s9-venn-wrap { width:400px; height:400px; position:relative; flex-shrink:0; }
.venn-svg { width:100%; height:100%; }
.venn-circle { animation: vennPulse 4s ease-in-out infinite; }
@keyframes vennPulse { 0%,100%{ fill-opacity:.08 } 50%{ fill-opacity:.15 } }

.s9-left-img  { position:relative; height:100%; display:flex; align-items:center; justify-content:flex-start; }
.s9-photo-left {
  position:absolute; left:-60px; top:0; bottom:0; width:55%;
  /* background-image: url('../img/s9-hand-organic.jpg');
  background-size:cover; background-position:center; background-color:#c8b8a8; */
}
.s9-right-img { position:relative; height:100%; display:flex; align-items:center; justify-content:flex-end; }
.s9-photo-right {
  position:absolute; right:-60px; top:0; bottom:0; width:55%;
  /* background-image: url('../img/s9-hand-tech.jpg');
  background-size:cover; background-position:center; background-color:#b8c8d8; */
}

/* ================================================================
   S9 MOBILE
================================================================ */
#s9m .bg {
  background-image: url('../img/bg-mob-s9.jpg'); /* отдельный фон для мобилки */
  position: absolute;
  inset: 0;
  z-index: 0;
}

#s9m.panel {

  height: 994px;
}

.s9m-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 48px;
}

/* Заголовок */
.s9m-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 600;
  color: var(--text-dark);
  text-align: center;
  padding-top: 40px;
  margin-bottom: 0;
  position: relative;
  line-height: 1.2;
}
.s9m-title::before {
  content: '';
  position: absolute;
  inset: -16px;
  background: #F8E0D5;
  filter: blur(20px);
  z-index: -1;
}

/* Фото рук — на всю ширину */
.s9m-photo {
  width: 100%;
  height: 260px;
  /* background-image: url('../img/bg-mob-s9.jpg'); */
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
  margin: -20px 0;
}

/* Венн */
.s9m-venn-wrap {
  width: 100%;
  max-width: 360px;
  padding: 0 16px;
}
.s9m-venn-wrap .venn-svg {
  width: 100%;
  height: auto;
}

/* Подпись */
.s9m-caption {
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-dark);
  text-align: center;
  margin-top: 150px;
  padding: 24px 32px 0;
  position: relative;
}
.s9m-caption::before {
  content: '';
  position: absolute;
  inset: -16px;
  background: #F8E0D5;
  filter: blur(20px);
  z-index: -1;
}


/* ================================================================
   S10.CSS — Сила в единстве (тёмный)
================================================================ */
#s10 .bg { background-image: url('../img/bg-s10.jpg');}

.s10-layout { 
  height:100%;
}

.s10-left { 
  padding:80px 0 0 150px; 
  display:flex; 
  flex-direction:column; 
}

.s10-title {
  font-family:'Cormorant Garamond',serif; 
  font-size:52px;
  font-weight:300; 
  text-transform:uppercase;
  color:var(--cream); 
  line-height:1; 
  margin-bottom:20px;
}
.s10-sub   { 
  font-size:15px; 
  color:var(--cream);
  margin-bottom:120px; 
}

.s10-items { 
  display:flex; 
  flex-direction:column; 
  gap: 20px;
}

.s10-item  {
  padding:20px 0; 
  border-bottom:1px solid rgba(245,240,232,0.12);
  font-size:15px; 
  line-height:1.6; 
  color:var(--cream);
  max-width: 325px;
}

.s10-item-2 {
  margin-left: 115px;
}
.s10-item-3 {
  margin-left: 230px;
}

/* ================================================================
   S10 MOBILE
================================================================ */
#s10m .bg {
  background-image: url('../img/bg-mob-s10.jpg');
  position: absolute;
  inset: 0;
  z-index: 0;
}

#s10m.panel {

  height: 994px;
}

.s10m-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

/* Заголовок и подзаголовок */
.s10m-top {
  padding: 48px 24px 24px;
}

.s10m-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 48px;
  font-weight: 300;
  text-transform: uppercase;
  color: var(--cream);
  line-height: 1;
  margin-bottom: 16px;
}

.s10m-sub {
  font-size: 15px;
  color: var(--cream);
  line-height: 1.5;
}

/* Фото по центру */
.s10m-photo {
  width: 100%;
  height: 300px;
  /* background-image: url('../img/bg-s10.jpg'); */
  background-size: cover;
  background-position: center top;
  flex-shrink: 0;
  margin: 16px 0;
}

/* Айтемы */
.s10m-items {
  display: flex;
  flex-direction: column;
  gap: 25px;
  padding: 20px 24px 48px;
}

.s10m-item {
  padding: 20px 0;
  /* border-top: 1px solid rgba(201, 169, 110, 0.4); */
  font-size: 16px;
  line-height: 1.6;
  color: var(--cream);
  max-width: 200px;
}

/*  */

/* ================================================================
   S11.CSS — Эволюция состояния (светлый)
================================================================ */
#s11 .bg { background-image: url('../img/bg-s11.jpg');}

.s11-content { height:100%; display:flex; flex-direction:column; justify-content:center; padding:0 150px; }
.s11-title {
  font-family:'Cormorant Garamond',serif; font-size:36px; font-weight:600;
  color:var(--text-dark); margin-bottom:60px;
}
.s11-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:78px }
.s11-col-title {
  font-family:'Cormorant Garamond',serif; font-size:28px; font-weight:500;
  color:var(--text-dark); margin-bottom:16px;
}
.s11-col-body { font-size:18px; line-height:1.2; color:var(--text-dark); margin-bottom:40px; font-weight:500;}
.s11-col-sub  {
  font-size:16px; line-height:1.2; color:var(--text-dark);
  /* border-top:1px solid rgba(74,56,40,0.15); padding-top:16px; */
}

/* ================================================================
   S11 MOBILE
================================================================ */
#s11m .bg {
  background-image: url('../img/bg-mob-s11.jpg');
  position: absolute;
  inset: 0;
  z-index: 0;
}

#s11m.panel {
  height: 998px;
}

.s11m-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding: 48px 24px 48px;
}

.s11m-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 600;
  color: var(--cream);
  margin-bottom: 40px;
}

.s11m-cols {
  display: flex;
  flex-direction: column;
}

.s11m-col {
  padding: 24px 0;
  border-top: 1px solid rgba(74, 56, 40, 0.2);
}

.s11m-col:last-child {
  border-bottom: 1px solid rgba(74, 56, 40, 0.2);
}

.s11m-col-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  font-weight: 500;
  color: var(--cream);
  margin-bottom: 12px;
}

.s11m-col-body {
  font-size: 15px;
  line-height: 1.6;
  color: var(--cream);
  font-weight: 500;
  margin-bottom: 12px;
}

.s11m-col-sub {
  font-size: 14px;
  line-height: 1.5;
  color: var(--cream);
  opacity: 0.65;
}



/* ================================================================
   S12.CSS — Footer (тёмный)
================================================================ */
#s12 .bg { background-image: url('../img/bg-s12.jpg'); }

.s12-layout {
  position: relative;
  height: 100%;
}

/* Лого — абсолютно, левый нижний угол */
.s12-logo-wrap {
  position: absolute;
  left: 40px;
  bottom: 81px;
}

/* Заголовок — 150px слева, 150px сверху */
.s12-headline {
  position: absolute;
  top: 150px;
  left: 150px;
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--cream);
  line-height: 1.2;
}
.s12-headline .hl { color: var(--accent); }

.s12-tagline {
  position: absolute;
  top: 210px; /* под заголовком */
  left: 150px;
  font-size: 15px;
  color: var(--cream);
}

/* Состояние — правый блок, 150px от правого края */
.s12-currency {
  position: absolute;
  top: 382px;
  right: 73px;
  transform: translateY(-50%);
  max-width: 407px;
}
.s12-currency-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px;
  font-weight: 600;
  color: var(--cream);
  margin-bottom: 12px;
}
.s12-currency-body {
  font-size: 14px;
  line-height: 1.2;
  color: var(--cream);
}

/* Соцсети — снизу по центру */
.s12-social-wrap {
  position: absolute;
  bottom: 48px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.s12-social {
  display: flex;
  gap: 28px;
}
.s12-social a {
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  text-decoration: none;
  transition: all .25s;
}
.s12-social a:hover { border-color: var(--gold); color: var(--gold); }
.s12-copyright {
  font-size: 12px;
  color: var(--cream);

}

/* Книга — правый нижний угол */
.s12-right {
  position: absolute;
  bottom: 48px;
  right: 50px;
}
.s12-book-label {
  font-size: 12px; 
  color: rgba(255,250,252,0.5);
  margin-bottom: 8px;
}
.s12-book-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px; font-weight: 300;
  text-transform: uppercase; 
  color: var(--cream);
}
.s12-links {
  display: flex; gap: 24px;
  justify-content: flex-end;
  margin-top: 16px;
}
.s12-links a {
  font-size: 12px;
  color: rgba(255,250,252,0.5);
  text-decoration: none;
  transition: color .2s;

}
.s12-links a:hover { color: var(--cream); }


/* ================================================================
   S12 MOBILE
================================================================ */
#s12m .bg {
  background-image: url('../img/bg-mob-s12.jpg');
  position: absolute;
  inset: 0;
  z-index: 0;
}

.s12m-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding: 48px 24px 32px;
  min-height: 100%;
}

/* Заголовок */
.s12m-top {
  margin-bottom: 40px;
}

.s12m-headline {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--cream);
  line-height: 1.15;
  margin-bottom: 16px;
}
.s12m-headline .hl { color: var(--accent); }

.s12m-tagline {
  font-size: 15px;
  line-height: 1.6;
  color: var(--cream);
}

/* Состояние */
.s12m-currency {
  margin-bottom: 40px;
}

.s12m-currency-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 400;
  color: var(--cream);
  line-height: 1.2;
  margin-bottom: 10px;
}

.s12m-currency-body {
  font-size: 13px;
  line-height: 1.6;
  color: rgba(245,240,232,0.6);
}

/* Книга */
.s12m-book {
  margin-bottom: 48px;
}

.s12m-book-label {
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(245,240,232,0.4);
  margin-bottom: 6px;
}

.s12m-book-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--cream);
}

/* Лого + соцсети в ряд */
.s12m-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}

.s12m-logo {
  flex-direction: column;
  gap: 4px;
  align-items: center;
}

.s12m-social {
  display: flex;
  gap: 24px;
  align-items: center;
}

.s12m-social a {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
}

/* Ссылки */
.s12m-links {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.s12m-links a {
  font-size: 12px;
  color: rgba(245,240,232,0.4);
  text-decoration: none;
}

/* Copyright */
.s12m-copyright {
  font-size: 12px;
  color: rgba(245,240,232,0.3);
  letter-spacing: 1px;
  text-align: center;
}