/* ТЕССИНСКИЙ, V — страница «Второй свет в квартире».
   Подключается после ../css/style.css?v=19. Переменные (--terracotta, --cream,
   --paper, --ink, --stone, --charcoal, --gold, --terracotta-ink и т.д.) берутся
   из :root и парных «тёмных» правил там же — здесь только то, чего в общем
   файле нет. Структура и известные баги (шапка, hero--sub, мобильное меню)
   скопированы с /penthouses/local.css — самой свежей страницы на момент сборки. */

/* ---------- мобильная навигация: без гамбургера, прячем второстепенные пункты
   меню, оставляем логотип и кнопку заявки (как на /penthouses/, /planirovki/) ---------- */
@media (max-width:980px){
  .nav-toggle{display:none !important;}
  .nav-links{display:flex !important; gap:10px;}
  .nav-links a:not(.btn){display:none;}
  .nav-links .btn{margin-left:0;}
}

/* ---------- укороченный герой подстраницы (не на весь экран, как на главной) ---------- */
.hero--sub{height:auto;min-height:64vh;}
@media (max-width:600px){
  .hero--sub{min-height:78vh;}
}

/* ---------- защита от известного бага: шапка .nav фиксированная (~109px на
   мобильном) и наследуемый .hero align-items:flex-end прижимает контент к
   низу блока. На узких экранах с длинным h1 верх текстового блока иногда
   поднимается выше видимой зоны и заходит под логотип шапки. Явный отступ
   сверху гарантирует зазор независимо от длины заголовка. ---------- */
@media (max-width:600px){
  .hero--sub{padding-top:clamp(124px,18vh,190px);}
}

/* ---------- хлебные крошки в hero ---------- */
.breadcrumbs{
  font-family:'Jost', sans-serif;font-size:12px;letter-spacing:0.03em;
  color:rgba(255,255,255,0.92);margin-bottom:16px;display:inline-flex;gap:6px;flex-wrap:wrap;
  background:rgba(15,12,9,0.75);padding:7px 14px;border-radius:var(--radius);
}
.breadcrumbs a{color:#fff;text-decoration:underline;text-underline-offset:3px;}
.breadcrumbs a:hover{color:var(--gold);}
.breadcrumbs [aria-current]{color:rgba(255,255,255,0.92);}

/* Кадр интерьера светлый (тюль, закатное окно), и золотой курсив в h1 давал
   на нём контраст ниже нормы — заголовок и надстрочная строка тонули в
   шторе. Плёнка снизу вверх сажает текст на тёмное, не убивая сам кадр.
   (Тот же кадр и тот же приём, что на /penthouses/.) */
.hero--sub .hero-media::after,
.hero--sub::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(0deg, rgba(20,17,13,0.82) 0%, rgba(20,17,13,0.55) 42%, rgba(20,17,13,0.18) 72%, rgba(20,17,13,0.06) 100%);
}
.hero--sub .hero-content{position:relative;z-index:2;}
.hero--sub .eyebrow{color:var(--cream);text-shadow:0 1px 10px rgba(20,17,13,0.9),0 0 24px rgba(20,17,13,0.7);}
.hero--sub .hero-title,.hero--sub .hero-title em{text-shadow:0 2px 16px rgba(20,17,13,0.75),0 0 40px rgba(20,17,13,0.5);}
.hero--sub .hero-sub{text-shadow:0 1px 12px rgba(20,17,13,0.8);}

/* ---------- три термина: высокие потолки / второй свет / двухуровневая
   квартира ---------- Та же пара оттенков, что уже используется в
   .house.theme-hespera и .format-card--top на /penthouses/ (#f3e3d3 +
   var(--stone-dark) + var(--terracotta-ink)) — контраст под этот фон уже
   проверен на сайте. Средняя карточка (второй свет — наш формат) выделена. */
.term-compare{
  display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:44px;
  background:rgba(33,29,24,0.08);
}
.term-card{background:var(--paper);padding:30px 26px;}
.term-card .tc-tag{
  font-family:'Jost', sans-serif;font-size:10.5px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--terracotta-ink);
}
.term-card h3{font-size:clamp(20px,2.4vw,26px);margin-top:10px;line-height:1.15;}
.term-card p{color:var(--stone-dark);margin-top:12px;font-size:14px;line-height:1.65;}
.term-card ul{list-style:none;margin:18px 0 0;padding:0;}
.term-card li{padding:9px 0;border-top:1px solid var(--line);font-size:13px;color:var(--stone-dark);}
.term-card--top{background:#f3e3d3;}
@media (max-width:900px){
  .term-compare{grid-template-columns:1fr;}
}

/* ---------- «что даёт / что учитывать» — честные плюсы и минусы,
   двухколоночная карточка того же семейства оттенков ---------- */
.tradeoff-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:44px;
  background:rgba(33,29,24,0.08);
}
.tradeoff-card{background:var(--paper);padding:32px 28px;}
.tradeoff-card .tc-tag{
  font-family:'Jost', sans-serif;font-size:11px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--terracotta-ink);
}
.tradeoff-card ul{list-style:none;margin:20px 0 0;padding:0;}
.tradeoff-card li{padding:14px 0;border-top:1px solid var(--line);font-size:14px;color:var(--stone-dark);line-height:1.6;}
@media (max-width:760px){
  .tradeoff-grid{grid-template-columns:1fr;}
}

/* ---------- секции-разъяснения на arch-grid (картинка без принудительной
   обрезки — .arch-media img наследует height:auto из общего style.css) ---------- */
.loc-explain h2{font-size:clamp(26px,3.4vw,40px);margin-top:16px;line-height:1.2;}
.loc-explain p{color:var(--stone-dark);margin-top:16px;font-size:15px;line-height:1.75;}

/* ---------- ритм на мобильном (как на остальных подстраницах сайта) ---------- */
@media (max-width:820px){
  .architecture,.interiors,.house{
    padding-top:clamp(48px,7vh,72px);padding-bottom:clamp(48px,7vh,72px);
  }
  .term-compare,.tradeoff-grid{margin-top:28px;}
  .term-card,.tradeoff-card{padding:24px 20px;}
}