/* =========================================
   Vars (можно убрать, если уже есть в теме)
   ========================================= */
:root{
  --color-text-secondary:#2C2C2C; /* $text-secondary-color */
  --color-bg:#FBFBF7;             /* $bg-color */
  --color-main: #865e4f; /* $main (акцент) */
  --ff-sans: "DM Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --ff-serif: "Playfair Display", Georgia, serif;
}

/* =========================================
   Breakpoints (подгони под свои, если нужно)
   onTablet ≥ 768px, Small ≥ 1024px, Medium ≥ 1280px, Large ≥ 1440px
   ========================================= */
@media (min-width:768px){ :root{ --is-tablet:1; } }
@media (min-width:1024px){ :root{ --is-ds:1; } }
@media (min-width:1280px){ :root{ --is-dm:1; } }
@media (min-width:1440px){ :root{ --is-dl:1; } }

/* =========================================
   HOME
   ========================================= */
.home{
  display:flex;
  justify-content:space-between;
  position:relative;
  margin-bottom:80px;
  width: 345px;
  margin-top: 20px;
}
@media (min-width:768px){ .home{ margin-bottom:100px; width: 620px; } }
@media (min-width:1024px){ .home{ margin-bottom:100px; width: 940px;} }
@media (min-width:1280px){ .home{ margin-bottom:100px; width: 1160px;} }
@media (min-width:1440px){ .home{ margin-bottom:100px; width: 1376px;} }

/* ---------- left ---------- */
.home__left{
  display:flex;
  flex-direction:column;
  justify-content:end;
  max-width:167px;
  z-index:1;
  position:relative;
}
@media (min-width:768px){ .home__left{ max-width:147px; } }
@media (min-width:1024px){ .home__left{ max-width:230px; } }
@media (min-width:1280px){ .home__left{ max-width:230px; } }
@media (min-width:1440px){ .home__left{ max-width:230px; } }

/* та самая точка-семечко слева сверху */
.home__left::before{
  content:"";
  position:absolute;
  top:0; left:0;
  width:5px; height:5px;
  border-radius:50%;
  background-color:var(--color-main);
}

/* ВАЖНО: декоративная линия за левым блоком (mobile only) */
.home__left::after{
  content:"";
  background-image:url("../images/line-desc.png");
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  position:absolute;
  transform:translateX(30%);
  width:243px;
  height:153px;
  z-index:-1;
}
@media (min-width:768px){
  .home__left::after{ display:none; }
}

.home__left__text{
  font-family:var(--ff-serif);
  font-size:15px;
  font-style:italic;
  font-weight:400;
  line-height:normal;
  color:var(--color-text-secondary);
  margin-bottom:70px;
  padding-top:25px;
  max-width:147px;
}
@media (min-width:768px){
  .home__left__text{ font-size:15px; margin-bottom:70px; padding-top:0; max-width:147px; }
}
@media (min-width:1024px){
  .home__left__text{ font-size:18px; margin-bottom:113px; max-width:230px; }
}
@media (min-width:1280px){
  .home__left__text{ font-size:18px; margin-bottom:113px; max-width:230px; }
}
@media (min-width:1440px){
  .home__left__text{ font-size:18px; margin-bottom:114px; max-width:230px; }
}

.home__left__img{
  max-width:167px;
}
@media (min-width:768px){ .home__left__img{ max-width:140px; } }
@media (min-width:1024px){ .home__left__img{ max-width:216px; } }
@media (min-width:1280px){ .home__left__img{ max-width:216px; } }
@media (min-width:1440px){ .home__left__img{ max-width:216px; } }

/* ---------- center ---------- */
.home__center{
  position:absolute;
  bottom:-460px;
  width:100%;
  display:flex;
  justify-content:center;
}
@media (min-width:768px){
  .home__center{
    position:relative; bottom:auto; justify-content:flex-end; width:auto;
  }
}
@media (min-width:1024px){
  .home__center{ position:relative; bottom:auto; justify-content:flex-end; width:auto; }
}
@media (min-width:1280px){
  .home__center{ position:relative; bottom:auto; justify-content:flex-end; width:auto; }
}
@media (min-width:1440px){
  .home__center{ position:relative; bottom:auto; justify-content:flex-end; width:auto; }
}

.home__center__img{
  max-width:345px;
  z-index:2;
  position:relative;
  display: none;
}
@media (min-width:768px){ .home__center__img{ max-width:301px; display: block;} }
@media (min-width:1024px){ .home__center__img{ max-width:407px; display: block;} }
@media (min-width:1280px){ .home__center__img{ max-width:410px; display: block;} }
@media (min-width:1440px){ .home__center__img{ max-width:410px; display: block;} }

.home__center__btn{
  color:var(--color-bg);
  background:none;
  text-transform:uppercase;
  border:none;
  position:absolute;
  white-space:nowrap;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  font-family:var(--ff-sans);
  font-size:14px;
  font-weight:400;
  line-height:normal;
  letter-spacing:-0.28px;
  transition:all .3s linear;
  z-index:3;
}
.home__center__btn:hover{ text-decoration:underline; cursor:pointer; }

/* Декоративная линия справа от центрального изображения (только ≥ tablet) */
@media (min-width:768px){
  .home__center::after{
    content:"";
    background-image:url("../images/line.png");
    background-size:contain;
    background-position:center;
    background-repeat:no-repeat;
    position:absolute;
    transform:translate(65%, 141%);
    width:243px; height:154px;
    z-index:1;
  }
}
@media (min-width:1024px){
  .home__center::after{
    content:"";
    background-image:url("../images/line-desc.png");
    transform:translate(54%, 133%);
    width:343px; height:218px;
    z-index:1;
  }
}
@media (min-width:1280px){
  .home__center::after{
    content:"";
    background-image:url("../images/line-desc.png");
    transform:translate(94%, 137%);
    width:343px; height:218px;
    z-index:3;
  }
}
@media (min-width:1440px){
  .home__center::after{
    content:"";
    background-image:url("../images/line-desc.png");
    transform:translate(94%, 137%);
    width:343px; height:218px;
    z-index:1;
  }
}

/* ---------- right ---------- */
.home__right{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
}
@media (min-width:768px){ .home__right{ justify-content:end; } }
@media (min-width:1024px){ .home__right{ justify-content:end; } }
@media (min-width:1280px){ .home__right{ justify-content:end; } }
@media (min-width:1440px){ .home__right{ justify-content:end; } }

.home__right__img{
  max-width:167px;
}
@media (min-width:768px){ .home__right__img{ max-width:140px; margin-bottom:104px; } }
@media (min-width:1024px){ .home__right__img{ max-width:216px; margin-bottom:139px; } }
@media (min-width:1280px){ .home__right__img{ max-width:216px; margin-bottom:143px; } }
@media (min-width:1440px){ .home__right__img{ max-width:216px; margin-bottom:145px; } }

.home__right__text{
  font-family:var(--ff-sans);
  font-size:14px;
  font-weight:400;
  letter-spacing:-0.28px;
  line-height:normal;
  text-transform:uppercase;
  color:var(--color-text-secondary);
}

/* точка-семечко справа снизу */
.home__right::after{
  content:"";
  position:absolute;
  bottom:0; right:0;
  width:5px; height:5px;
  border-radius:50%;
  background-color:var(--color-main);
}

.text__title {
  font-size: clamp(24px, 4vw, 48px); /* гибкий размер: минимум 28, максимум 48 */
  font-weight: 400;
  line-height: 1.2;
  color: #2c2c2c;
  text-align: center;
  margin: auto;
  max-width: 900px; /* чтобы текст не был в одну строку на широких экранах */
  padding: 0 20px;  /* отступы с краёв */
  position: relative;
}
@media (min-width:768px){ .text__title{  margin: auto auto 36px auto; } }

.text__title em {
  font-family: "Playfair Display", serif;
  font-style: italic; /* если хочешь выделить слово курсивом */
}


/* =========================================
   Header Styles
   ========================================= */

.first-home-block {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.first-home-block h1 {
  font-size: clamp(32px, 12vw, 180px);
  text-align: center;
  color: #2c2c2c;
  font-weight: 500;
  line-height: .9;
  text-transform: uppercase;
  padding-top: 20px;
  margin: 0 20px;
  word-break: break-word;
  white-space: nowrap;
}

.first-home-block .subtitle {
  font-family: 'Playfair Display', serif;
  font-size: clamp(30px, 8vw, 40px);
  font-style: italic;
  text-align: center;
  color: #2c2c2c;
}

.first-home-block .subtitle2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(16px, 4vw, 20px);
  font-style: italic;
  text-align: center;
  color: #2c2c2c;
}

.first-home-block .subtitle::after {
  content: "";
  display: block;
  background-image: url("../images/icons/branch.svg"); /* заменишь на свою */
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 55px;
  height: 55px;
  margin: 0 auto 0px auto;
}