/* Заголовок страницы портфолио */
h1 {
    margin: 20px 0 22px;
    padding: 0 12px;

    font-family: 'Manrope', 'Segoe UI', Arial, sans-serif;
    font-size: clamp(32px, 3.5vw, 48px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.055em;

    color: #1b2425;
    text-align: center;
    text-transform: none;

    text-shadow: none !important;
    -webkit-text-stroke: 0;
}

/* Тонкая архитектурная линия */
h1::after {
    content: '';
    display: block;

    width: 38px;
    height: 2px;
    margin: 13px auto 0;

    background: #d5b999;
    border-radius: 2px;
}

/* Мобильная версия */
@media (max-width: 768px) {
    h1 {
        margin: 14px 0 18px;
        padding: 0 10px;

        font-size: 34px;
        font-weight: 800;
        line-height: 1.12;
        letter-spacing: -0.05em;
    }

    h1::after {
        width: 32px;
        margin-top: 10px;
    }
}

.wrapper {
    max-width: 1440px;}
.se-case {
  --se-ink: #1b2425;
  --se-cream: #f8f8f5;
  --se-muted: #697172;
  --se-warm: #d5b999;
  display: block;
  width: min(100% - 48px, 1320px);
  margin: 48px auto;
  font-family: 'Manrope', 'Segoe UI', Arial, sans-serif;
  color: var(--se-ink);
  -webkit-font-smoothing: antialiased;
}
.se-case *, .se-case *::before, .se-case *::after { box-sizing: border-box; }
.se-case__shell { overflow: hidden; border-radius: 17px; background: #fff; box-shadow: 0 16px 64px rgba(20, 30, 31, .075); }

/* КОМПАКТНОЕ ХИРО: 232px вместо прежнего ~600px на десктопе. */
.se-case__hero {
  display: grid;
  grid-template-columns: minmax(0, 48%) minmax(0, 52%);
  height: 292px;
  background: #172021;
  color: #fff;
  overflow: hidden;
}
.se-case__hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  padding: 26px 36px 24px 40px;
  position: relative;
  z-index: 1;
}
.se-case__hero-top {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #c8ccca;
  font: 500 10px/1.5 'IBM Plex Mono', monospace;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.se-case__brandmark { width: 21px; height: 1px; background: var(--se-warm); flex: 0 0 21px; }
.se-case__hero-title {
text-align:left;
  max-width: 550px;
  margin: 10px 0;
  color: #f6f6f2;
  font-size: clamp(28px, 2.85vw, 39px);
  font-weight: 650;
  text-wrap: balance;
}
.se-case__hero-title span { color: #bdc4c0; 
    font-size: 24px;}
.se-case__hero-bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid rgba(255,255,255,.22);
  padding-top: 13px;
}
.se-case__price-kicker, .se-case__spec-caption {
  display: block;
  margin-bottom: 5px;
  color: #b0bcb9;
  font: 500 9px/1.4 'IBM Plex Mono', monospace;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.se-case__price-value {
  display: block;
  color: #fff;
  font-size: clamp(22px, 2.25vw, 31px);
  font-weight: 750;
  letter-spacing: -.052em;
  line-height: 1.1;
  white-space: nowrap;
}
.se-case__price-value small { font-size: .65em; font-weight: 650; }
.se-case__spec { text-align: right; flex: 0 0 auto; }
.se-case__spec-value {
  font-size: clamp(13px, 1.3vw, 17px);
  color: #e5e8e5;
  line-height: 1.25;
  letter-spacing: -.03em;
  font-weight: 650;
  white-space: nowrap;
}
.se-case__hero-image {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: linear-gradient(135deg, #626d6f, #1a2325);
}
.se-case__hero-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  transition: transform .7s ease;
}
.se-case__hero:hover .se-case__hero-image img { transform: scale(1.025); }
.se-case__hero-image::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(10,19,20,.24), transparent 40%),
              linear-gradient(0deg, rgba(10,19,20,.35), transparent 50%);
}
.se-case__photo-label {
  position: absolute;
  right: 25px;
  bottom: 22px;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 9px;
  color: #fff;
  font: 500 10px/1.2 'IBM Plex Mono', monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
  text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
.se-case__photo-label::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--se-warm); }

/* СОДЕРЖАНИЕ ПРОЕКТА */
.se-case__details { padding: 43px 40px 27px; background: #fff; }
.se-case__detail-top, .se-case__group-num, .se-case__footer {
  font-family: 'IBM Plex Mono', monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.se-case__detail-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 20px;
  color: #89908c;
  font-size: 10px;
  font-weight: 500;
}
.se-case__detail-top span:first-child { color: #4e5751; }
.se-case__detail-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 42px;
  align-items: end;
  margin-bottom: 28px;
}
.se-case__detail-title {
  margin: 0;
  max-width: 520px;
  color: #202829;
  font-size: clamp(32px, 3.3vw, 48px);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.055em;
}
.se-case__detail-desc {
  max-width: 500px;
  margin: 0 0 2px auto;
  color: #66706c;
  font-size: 13px;
  line-height: 1.8;
}
.se-case__groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.se-case__group {
  min-width: 0;
  padding: 23px 24px 29px;
  background: var(--se-cream);
  border: 1px solid #ecede8;
  border-radius: 11px;
  transition: border-color .25s, transform .25s;
}
.se-case__group:hover { border-color: #d7c2a7; transform: translateY(-3px); }
.se-case__group-num { display: block; margin-bottom: 26px; color: #8b8d83; font-size: 10px; font-weight: 500; }
.se-case__group-title {
  min-height: 57px;
  margin: 0 0 18px;
  color: #242d2c;
  font-size: clamp(20px, 2vw, 25px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.043em;
}
.se-case__list { padding: 17px 0 0; margin: 0; border-top: 1px solid #e1e4df; list-style: none; }
.se-case__list li {
  position: relative;
  padding-left: 17px;
  margin-bottom: 12px;
  color: #55605b;
  font-size: 12.5px;
  line-height: 1.6;
}
.se-case__list li:last-child { margin-bottom: 0; }
.se-case__list li::before {
  content: ''; position: absolute; left: 0; top: 8px;
  width: 6px; height: 6px; background: #c7ad8c; border-radius: 1px;
}
.se-case__footer {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin-top: 31px;
  border-top: 1px solid #e5e7e2;
  padding-top: 17px;
  color: #8c938f;
  font-size: 9px;
}
@media (max-width: 1080px) {
  .se-case__hero-copy { padding: 25px 26px 23px 30px; }
  .se-case__hero-title { font-size: clamp(27px, 3vw, 34px); }
  .se-case__price-value { font-size: 24px; }
  .se-case__details { padding: 39px 30px 25px; }
  .se-case__group { padding: 21px 18px 26px; }
}
@media (max-width: 760px) {
  .se-case { width: min(100% - 24px, 620px); margin: 22px auto; }
  .se-case__shell { border-radius: 13px; }
  .se-case__hero { position: relative; display: block; height: 282px; }
  .se-case__hero-image { position: absolute; inset: 0; z-index: 0; }
  .se-case__hero-image::after {
    background: linear-gradient(90deg, rgba(13,20,21,.94) 0%, rgba(13,20,21,.7) 65%, rgba(13,20,21,.28) 100%),
                linear-gradient(0deg, rgba(13,20,21,.48), transparent 70%);
  }
  .se-case__hero-copy { height: 100%; padding: 25px 25px 23px; }
  .se-case__hero-title { max-width: 460px; margin: 14px 0; font-size: clamp(28px, 6.4vw, 39px); }
  .se-case__price-value { font-size: clamp(22px, 4.7vw, 27px); }
  .se-case__spec-value { font-size: 15px; }
  .se-case__photo-label { display: none; }
  .se-case__details { padding: 34px 24px 22px; }
  .se-case__detail-header { display: block; margin-bottom: 24px; }
  .se-case__detail-title { font-size: clamp(31px, 7.2vw, 42px); }
  .se-case__detail-desc { max-width: none; margin: 16px 0 0; }
  .se-case__groups { grid-template-columns: 1fr; }
  .se-case__group { padding: 23px; }
  .se-case__group-num { margin-bottom: 19px; }
  .se-case__group-title { min-height: 0; margin-bottom: 17px; }
}
@media (max-width: 390px) {
  .se-case__hero-copy { padding: 22px 20px 21px; }
  .se-case__hero { height: 270px; }
  .se-case__hero-title { font-size: 27px; }
  .se-case__spec-value { font-size: 13px; }
  .se-case__hero-bottom { gap: 8px; }
  .se-case__detail-top, .se-case__footer { font-size: 8px; }
  .se-case__details { padding-inline: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .se-case__hero-image img, .se-case__group { transition: none; }
  .se-case__hero:hover .se-case__hero-image img, .se-case__group:hover { transform: none; }
}