/* ===== FONTS (self-contained, base64) — IBM Plex Sans + IBM Plex Mono ===== */
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/plex-sans-400-cyrl.woff2') format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/plex-sans-400-latin.woff2') format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/plex-sans-500-cyrl.woff2') format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/plex-sans-500-latin.woff2') format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/plex-sans-600-cyrl.woff2') format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/plex-sans-600-latin.woff2') format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/plex-sans-700-cyrl.woff2') format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face {font-family:"Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/plex-sans-700-latin.woff2') format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face {font-family:"Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/plex-mono-400-cyrl.woff2') format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face {font-family:"Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/plex-mono-400-latin.woff2') format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face {font-family:"Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/plex-mono-500-cyrl.woff2') format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face {font-family:"Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/plex-mono-500-latin.woff2') format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* ===== TOKENS =====
   Палитра выведена из боевого strom-trade.ru (светлый, белый+зелёный):
   primary --wd-primary-color = rgb(14,126,80) #0e7e50 (кнопки/акценты/цены),
   заголовки #242424, текст #767676, фон #ffffff, тинты #e5ffef/#fafffc. */
.sh-home{--ground:#ffffff;
  --ground-2:#f1f7f3;     /* бледно-зелёный off-white, чередование секций */
  --ground-3:#e8f2ec;     /* тинт карточек/плейсхолдеров */
  --green-soft:#e7f4ed;   /* зелёная плашка/чипы */
  --ink:#232624;          /* заголовки (~#242424) */
  --ink-2:#3e3e3e;        /* сильный текст / ссылки */
  --text:#6f756f;         /* body (~#767676, лёгкий зелёный уклон) */
  --line:rgba(35,38,36,.13);
  --line-2:rgba(35,38,36,.07);

  --green:#0e7e50;        /* PRIMARY */
  --green-hover:#0b6a43;
  --green-dark:#0a5738;   /* акцент-текст на светлом */
  --gold:#c98a2b;         /* редкий вторичный акцент (звёзды/бейджи) */

  --on-green:#ffffff;
  --on-green-2:rgba(255,255,255,.84);
  --green-line:rgba(255,255,255,.24);

  --scrim:linear-gradient(to top,rgba(16,26,21,.93),rgba(16,26,21,.55) 40%,rgba(16,26,21,.16) 70%,transparent);

  --max:1300px;
  --pad:clamp(20px,5vw,68px);
  --r:6px;
  --sans:"Plex Sans",system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  --mono:"Plex Mono","Plex Sans",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.22,.61,.36,1);}
/* Макет реального ЛАЙТ-сайта: фиксируем один визуальный мир,
   тумблер темы вьюера его не инвертирует. */
.sh-home *{box-sizing:border-box;}
.sh-home{margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.55;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;}
.sh-home a{color:inherit;text-decoration:none;}
.sh-home button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;}
.sh-home img{max-width:100%;display:block;}
.sh-home h1,.sh-home h2,.sh-home h3,.sh-home h4{margin:0;font-weight:700;letter-spacing:-.02em;text-wrap:balance;}
.sh-home p{margin:0;}
.sh-home ::selection{background:var(--green);color:#fff;}
.sh-home :focus-visible{outline:2px solid var(--green);outline-offset:3px;}
.sh-home .sh-wrap{width:min(100% - var(--pad)*2,var(--max));margin-inline:auto;}
/* ===== TYPE PRIMITIVES ===== */
.sh-home .sh-mono{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;}
.sh-home .sh-eyebrow{display:inline-flex;align-items:center;gap:.7em;
  font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--green);margin:0 0 20px;}
.sh-home .sh-eyebrow::before{content:"";width:24px;height:2px;background:currentColor;}
.sh-home .sh-eyebrow--light{color:var(--on-green);}
.sh-home .sh-h-display{font-weight:700;font-size:clamp(2.3rem,5vw,4.6rem);line-height:1;letter-spacing:-.025em;text-transform:uppercase;}
.sh-home .sh-h-section{font-weight:700;font-size:clamp(1.9rem,3.6vw,3.3rem);line-height:1.02;letter-spacing:-.025em;}
.sh-home .sh-lead{font-size:clamp(1.02rem,1.35vw,1.24rem);line-height:1.55;color:var(--text);max-width:56ch;}
/* ===== BUTTONS / LINKS ===== */
.sh-home .sh-btn{display:inline-flex;align-items:center;justify-content:center;gap:.7em;
  min-height:54px;padding:0 28px;font-weight:600;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
  border-radius:var(--r);border:1.5px solid transparent;
  transition:transform .25s var(--ease),background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);}
.sh-home .sh-btn__arw{transition:transform .25s var(--ease);}
.sh-home .sh-btn:hover .sh-btn__arw{transform:translateX(4px);}
.sh-home .sh-btn--primary{background:var(--green);color:#fff;}
.sh-home .sh-btn--primary:hover{background:var(--green-hover);transform:translateY(-2px);}
.sh-home .sh-btn--ghost{border-color:var(--line);color:var(--ink);}
.sh-home .sh-btn--ghost:hover{border-color:var(--green);color:var(--green);}
.sh-home .sh-btn--white{background:#fff;color:var(--green-dark);}
.sh-home .sh-btn--white:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(0,0,0,.35);}
.sh-home .sh-arrow-link{display:inline-flex;align-items:center;gap:.75em;
  font-family:var(--mono);font-size:.74rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;
  color:var(--green);white-space:nowrap;}
.sh-home .sh-arrow-link .sh-dot{width:40px;height:40px;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center;
  /* Стрелка не наследует от ссылки ни моно-кегль (.74rem = 11px при корне 15px),
     ни моно-шрифт: в Plex Mono глиф → рисуется 11px в ширину против 16px в Plex Sans
     при одинаковом font-size. Оба свойства нужны, чтобы совпасть с .sh-product__go
     в карточке «Выбор покупателей». Заодно снимаем letter-spacing ссылки: он
     наследуется в абсолютных 1.33px и хвостом справа сдвигает стрелку из центра. */
  font-family:var(--sans);font-size:16px;line-height:1;letter-spacing:normal;padding-bottom:2px;
  transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease);}
.sh-home .sh-arrow-link:hover .sh-dot{transform:translate(3px,-3px);background:var(--green);color:#fff;}
.sh-home .sh-arrow-link--light{color:var(--on-green);}
.sh-home .sh-arrow-link--light:hover .sh-dot{background:#fff;color:var(--green-dark);}
/* ===== SECTION SHELL ===== */
.sh-home .sh-section{padding:clamp(66px,8vw,128px) 0;position:relative;}
.sh-home .sh-section-alt{background:var(--ground-2);}
.sh-home .sh-section-green{background:var(--green);color:var(--on-green);}
.sh-home .sh-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:clamp(38px,4.5vw,60px);}
.sh-home .sh-section-head__copy{max-width:50ch;}
.sh-home .sh-section-head .sh-h-section{max-width:17ch;}
/* ===== PLACEHOLDER (art-direction) ===== */
.sh-home .sh-ph{position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(14,126,80,.08),rgba(14,126,80,.02)),var(--ground-3);
  border:1px dashed rgba(14,126,80,.34);color:var(--green-dark);
  display:grid;place-items:center;text-align:center;padding:min(7%,38px);}
.sh-home .sh-ph::before,.sh-home .sh-ph::after{content:"";position:absolute;width:13px;height:13px;border:1.5px solid rgba(14,126,80,.42);pointer-events:none;}
.sh-home .sh-ph::before{top:12px;left:12px;border-right:0;border-bottom:0;}
.sh-home .sh-ph::after{bottom:12px;right:12px;border-left:0;border-top:0;}
.sh-home .sh-ph__tag{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(14,126,80,.72);}
.sh-home .sh-ph__body{max-width:44ch;}
.sh-home .sh-ph__k{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;opacity:.72;margin-bottom:9px;}
.sh-home .sh-ph__prompt{font-size:clamp(.86rem,1.2vw,1rem);line-height:1.42;color:var(--ink-2);}
/* ===== HERO (light) ===== */
.sh-home .sh-hero{position:relative;background:var(--ground);overflow:hidden;border-bottom:1px solid var(--line);}
.sh-home .sh-hero::before{/* subtle green blueprint grid */
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(14,126,80,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(14,126,80,.05) 1px,transparent 1px);
  background-size:74px 74px;
  mask-image:radial-gradient(120% 105% at 82% 26%,#000,transparent 70%);
  -webkit-mask-image:radial-gradient(120% 105% at 82% 26%,#000,transparent 70%);}
.sh-home .sh-hero::after{content:"";position:absolute;top:-16%;right:-8%;width:56vw;height:56vw;max-width:720px;max-height:720px;background:radial-gradient(circle,rgba(14,126,80,.1),transparent 62%);pointer-events:none;}
.sh-home .sh-hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);gap:clamp(32px,4vw,58px);align-items:center;padding-block:clamp(56px,7vw,100px);}
.sh-home .sh-hero__copy{max-width:840px;min-width:0;}
.sh-home .sh-hero__kicker{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--green);margin-bottom:24px;display:flex;align-items:center;gap:.7em;}
.sh-home .sh-hero__kicker::before{content:"";width:24px;height:2px;background:currentColor;}
.sh-home .sh-hero h1{font-weight:700;font-size:clamp(2.4rem,5.4vw,5rem);line-height:1;letter-spacing:-.03em;text-transform:uppercase;color:var(--ink);}
.sh-home .sh-hero h1 em{font-style:normal;color:var(--green);}
.sh-home .sh-hero__lead{margin-top:24px;max-width:50ch;font-size:clamp(1.02rem,1.35vw,1.22rem);color:var(--text);}
.sh-home .sh-hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;}
.sh-home .sh-hero__meta{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(38px,4.5vw,56px);padding-top:24px;border-top:1px solid var(--line);}
.sh-home .sh-hero__meta dt{font-weight:700;font-size:clamp(1.5rem,2.3vw,2.15rem);letter-spacing:-.02em;color:var(--green);}
.sh-home .sh-hero__meta dd{margin:5px 0 0;font-size:.82rem;line-height:1.35;color:var(--text);}
.sh-home .sh-hero__visual{position:relative;min-height:clamp(360px,50vh,560px);align-self:stretch;}
.sh-home .sh-hero__visual .sh-ph{position:absolute;inset:0;}
.sh-home .sh-hero__badge{position:absolute;left:18px;bottom:18px;z-index:2;background:rgba(255,255,255,.94);border:1px solid var(--line);box-shadow:0 10px 30px -16px rgba(14,126,80,.4);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:15px 18px;max-width:280px;border-radius:var(--r);}
.sh-home .sh-hero__badge b{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:5px;}
.sh-home .sh-hero__badge span{font-size:.82rem;line-height:1.4;color:var(--text);}
/* ===== PHOTO CARD (shared: catalog / services / projects / offer media) ===== */
.sh-home .sh-pcard{position:relative;overflow:hidden;border-radius:var(--r);background:var(--ground-3);display:block;isolation:isolate;}
.sh-home .sh-pcard .sh-ph{position:absolute;inset:0;border:0;border-radius:0;transition:transform .6s var(--ease);}
.sh-home .sh-pcard__scrim{position:absolute;inset:0;z-index:1;background:var(--scrim);pointer-events:none;transition:opacity .6s var(--ease);}
.sh-home .sh-pcard:hover .sh-ph{transform:scale(1.05);}
/* На ховер карточки затемнение приглушаем — фото раскрывается, текст ещё читается.
   Второй селектор — мини-плитки «Наших объектов»: у них тот же скрим, но родитель
   не .sh-pcard, а .sh-project-mini. Длительность равна зуму .sh-ph, чтобы шли вместе. */
.sh-home .sh-pcard:hover .sh-pcard__scrim,
.sh-home .sh-project-mini:hover .sh-pcard__scrim{opacity:.5;}
/* в фото-карточках промпт держим у ВЕРХА, чтобы не пересекался с заголовком внизу */
.sh-home .sh-pcard .sh-ph{place-items:start;}
.sh-home .sh-pcard .sh-ph__body{align-self:start;padding-top:6px;max-width:38ch;}
.sh-home .sh-pcard .sh-ph__prompt{font-size:clamp(.74rem,.95vw,.88rem);opacity:.9;}
.sh-home .sh-pcard .sh-ph__tag{color:rgba(14,126,80,.7);}
/* ===== CATALOG (recomposed bento) ===== */
.sh-home .sh-catalog{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(196px,20vw,258px);gap:12px;}
.sh-home .sh-cat-card--a{grid-column:span 6;grid-row:span 2;}
.sh-home .sh-cat-card--b{grid-column:span 6;}
.sh-home .sh-cat-card--c{grid-column:span 3;}
.sh-home .sh-cat-card--d{grid-column:span 3;}
.sh-home .sh-cat-card--e{grid-column:span 6;}
.sh-home .sh-cat-card--f{grid-column:span 6;}
.sh-home .sh-cat-card__body{position:absolute;inset:auto 0 0 0;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:clamp(18px,2vw,26px);color:#fff;}
.sh-home .sh-cat-card__cat{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;opacity:.8;}
.sh-home .sh-cat-card__title{margin:9px 0 7px;font-weight:600;font-size:clamp(1.1rem,1.85vw,1.7rem);line-height:1.06;letter-spacing:-.02em;}
.sh-home .sh-cat-card__count{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:rgba(255,255,255,.78);}
.sh-home .sh-cat-card__arw{flex:0 0 46px;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(255,255,255,.55);display:grid;place-items:center;transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);}
.sh-home .sh-cat-card:hover .sh-cat-card__arw{background:var(--green);color:#fff;border-color:var(--green);transform:translate(3px,-3px);}
/* ===== OFFER SLIDER (light) ===== */
.sh-home .sh-offer-slider{position:relative;}
.sh-home .sh-offer-slider__vp{overflow:hidden;border-radius:var(--r);border:1px solid var(--line);}
.sh-home .sh-offer-slider__track{display:flex;transition:transform .6s var(--ease);will-change:transform;}
.sh-home .sh-offer-slider.sh-dragging .sh-offer-slider__track{transition:none;}
.sh-home .sh-offer-slide{flex:0 0 100%;min-width:0;display:grid;grid-template-columns:1.06fr .94fr;background:var(--ground);}
.sh-home .sh-offer-slide__media{position:relative;min-height:clamp(310px,40vw,500px);background:var(--ground-3);}
.sh-home .sh-offer-slide__media .sh-ph{position:absolute;inset:0;border:0;border-radius:0;}
.sh-home .sh-offer-slide__badge{position:absolute;top:18px;left:18px;z-index:2;background:var(--green);color:#fff;font-family:var(--mono);font-size:.64rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:var(--r);}
.sh-home .sh-offer-slide__info{padding:clamp(28px,3.6vw,60px);display:flex;flex-direction:column;justify-content:center;border-left:1px solid var(--line);}
.sh-home .sh-offer-status{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:16px;}
.sh-home .sh-offer-status::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(14,126,80,.16);}
.sh-home .sh-offer-slide__info h3{font-weight:700;font-size:clamp(1.6rem,2.8vw,2.7rem);line-height:1.04;letter-spacing:-.03em;color:var(--ink);}
.sh-home .sh-offer-slide__info p{margin-top:18px;color:var(--text);max-width:46ch;font-size:1rem;}
.sh-home .sh-offer-price{margin:26px 0 24px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;}
.sh-home .sh-offer-price b{font-weight:700;font-size:clamp(1.8rem,2.8vw,2.6rem);letter-spacing:-.02em;color:var(--green);font-variant-numeric:tabular-nums;}
.sh-home .sh-offer-price s{color:#a7aca7;font-size:1.05rem;font-variant-numeric:tabular-nums;}
.sh-home .sh-offer-price .sh-unit{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;color:var(--text);text-transform:uppercase;}
.sh-home .sh-offer-slider__controls{display:flex;align-items:center;gap:16px;margin-top:24px;}
.sh-home .sh-offer-nav{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--line);color:var(--ink);display:grid;place-items:center;font-size:1.05rem;transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);}
.sh-home .sh-offer-nav:hover{background:var(--green);color:#fff;border-color:var(--green);}
.sh-home .sh-offer-dots{display:flex;gap:9px;margin-left:4px;}
.sh-home .sh-offer-dot{display:flex;padding:0;min-height:0;width:9px;height:9px;border-radius:50%;background:var(--line);transition:transform .25s var(--ease),background .25s var(--ease);}
.sh-home .sh-offer-dot[aria-current="true"]{background:var(--green);transform:scale(1.35);}
.sh-home .sh-offer-count{margin-left:auto;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;color:var(--text);font-variant-numeric:tabular-nums;}
/* ===== SERVICES ===== */
.sh-home .sh-process{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);margin-bottom:clamp(30px,3.5vw,48px);}
.sh-home .sh-process__step{padding:22px 20px 24px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);}
.sh-home .sh-process__step:last-child{border-right:0;}
.sh-home .sh-process__no{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:var(--green);margin-bottom:36px;}
.sh-home .sh-process__step b{font-weight:600;font-size:1rem;letter-spacing:-.01em;}
.sh-home .sh-process__step span{display:block;margin-top:5px;font-size:.84rem;color:var(--text);}
.sh-home .sh-services{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:clamp(240px,19vw,310px);gap:12px;}
.sh-home .sh-svc--w,.sh-home .sh-svc--n{grid-column:span 1;}
.sh-home .sh-svc__body{position:absolute;inset:auto 0 0 0;z-index:2;padding:clamp(18px,2vw,25px);color:#fff;}
.sh-home .sh-svc__no{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;color:#fff;opacity:.82;}
.sh-home .sh-svc__body h3{margin-top:8px;font-weight:600;font-size:clamp(1.12rem,1.6vw,1.5rem);line-height:1.08;letter-spacing:-.02em;}
/* ===== PROJECTS ===== */
.sh-home .sh-project-feature{min-height:clamp(400px,52vw,580px);border:0;}
.sh-home .sh-project-feature__body{position:absolute;inset:auto 0 0 0;z-index:2;display:grid;grid-template-columns:auto 1fr auto;gap:clamp(20px,3vw,42px);align-items:end;padding:clamp(24px,3.6vw,52px);color:#fff;}
.sh-home .sh-project-no{font-family:var(--mono);font-weight:400;font-size:clamp(2.2rem,4vw,3.6rem);line-height:.8;color:#fff;opacity:.55;letter-spacing:-.02em;}
.sh-home .sh-project-feature__body h3{font-weight:700;font-size:clamp(1.8rem,4vw,3.4rem);line-height:.98;letter-spacing:-.03em;}
.sh-home .sh-project-feature__body p{margin-top:11px;color:rgba(255,255,255,.82);font-size:.94rem;}
.sh-home .sh-project-list{display:grid;grid-template-columns:repeat(3,1fr);margin-top:12px;border-top:1px solid var(--line);}
.sh-home .sh-project-mini{padding:22px 22px;border-right:1px solid var(--line);display:block;transition:background .25s var(--ease);}
.sh-home .sh-project-mini:last-child{border-right:0;}
.sh-home .sh-project-mini:hover{background:var(--green-soft);}
.sh-home .sh-project-mini .sh-mono{color:var(--green);display:block;margin-bottom:8px;font-size:.64rem;}
.sh-home .sh-project-mini b{font-weight:600;font-size:1.08rem;color:var(--ink);display:block;letter-spacing:-.01em;}
.sh-home .sh-project-mini span{font-size:.85rem;color:var(--text);}
/* ===== POPULAR PRODUCTS ===== */
.sh-home .sh-products{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.sh-home .sh-product{background:var(--ground);border:1px solid var(--line);border-radius:var(--r);padding:13px;display:flex;flex-direction:column;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);}
.sh-home .sh-product:hover{transform:translateY(-5px);box-shadow:0 22px 46px -24px rgba(14,126,80,.34);border-color:rgba(14,126,80,.32);}
.sh-home .sh-product__media{position:relative;aspect-ratio:1/1;border-radius:calc(var(--r) - 2px);overflow:hidden;background:var(--ground-3);}
.sh-home .sh-product__media .sh-ph{position:absolute;inset:0;border-radius:0;}
.sh-home .sh-product__tag{position:absolute;top:11px;left:11px;z-index:2;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;background:#fff;color:var(--green);padding:5px 9px;border-radius:4px;border:1px solid var(--line);}
.sh-home .sh-product__tag--sale{background:var(--green);color:#fff;border-color:var(--green);}
.sh-home .sh-product__body{padding:17px 7px 6px;display:flex;flex-direction:column;flex:1;}
.sh-home .sh-product__cat{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);}
.sh-home .sh-product__body h3{margin:9px 0 0;font-weight:600;font-size:1.06rem;line-height:1.24;letter-spacing:-.01em;}
.sh-home .sh-product__foot{margin-top:auto;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.sh-home .sh-product__price{font-weight:700;font-size:1.14rem;letter-spacing:-.01em;color:var(--green);font-variant-numeric:tabular-nums;}
.sh-home .sh-product__price small{display:block;font-weight:500;font-size:.62rem;color:var(--text);font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;}
.sh-home .sh-product__go{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;color:var(--green);transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease);}
.sh-home .sh-product:hover .sh-product__go{background:var(--green);color:#fff;transform:translate(2px,-2px);}
/* ===== BRAND STATEMENT (light typographic moment) ===== */
.sh-home .sh-brand{position:relative;overflow:hidden;background:var(--ground-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.sh-home .sh-brand__ghost{position:absolute;top:6%;left:50%;transform:translateX(-50%);z-index:0;font-weight:700;font-size:clamp(6rem,19vw,18rem);line-height:.7;letter-spacing:-.04em;color:rgba(14,126,80,.06);white-space:nowrap;pointer-events:none;user-select:none;}
.sh-home .sh-brand__in{position:relative;z-index:2;padding-block:clamp(84px,12vw,168px);}
.sh-home .sh-brand h2{font-weight:700;font-size:clamp(2.4rem,5.6vw,5rem);line-height:.98;letter-spacing:-.03em;text-transform:uppercase;max-width:17ch;color:var(--ink);}
.sh-home .sh-brand h2 em{font-style:normal;color:var(--green);}
.sh-home .sh-brand__sub{margin-top:20px;font-size:clamp(1.05rem,1.6vw,1.45rem);color:var(--text);max-width:42ch;}
.sh-home .sh-brand__stats{display:flex;flex-wrap:wrap;gap:clamp(30px,5vw,60px);margin-top:clamp(38px,4.5vw,56px);padding-top:26px;border-top:1px solid var(--line);}
.sh-home .sh-brand__stat b{font-weight:700;font-size:clamp(1.7rem,2.5vw,2.3rem);letter-spacing:-.02em;color:var(--green);display:block;}
.sh-home .sh-brand__stat span{font-size:.82rem;color:var(--text);}
/* ===== JOURNAL ===== */
.sh-home .sh-journal{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(24px,3vw,44px);align-items:start;}
.sh-home .sh-journal-lead{display:block;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--ground);transition:box-shadow .3s var(--ease),border-color .3s var(--ease);}
.sh-home .sh-journal-lead:hover{box-shadow:0 22px 46px -28px rgba(14,126,80,.3);border-color:rgba(14,126,80,.3);}
.sh-home .sh-journal-lead .sh-ph{min-height:clamp(270px,30vw,400px);border:0;border-radius:0;}
.sh-home .sh-journal-lead__body{padding:clamp(22px,2.4vw,32px);}
.sh-home .sh-journal-meta{display:flex;gap:15px;align-items:center;font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text);}
.sh-home .sh-journal-meta .sh-cat{color:var(--green);}
.sh-home .sh-journal-lead__body h3{margin-top:15px;font-weight:700;font-size:clamp(1.45rem,2.3vw,2.2rem);line-height:1.06;letter-spacing:-.025em;}
.sh-home .sh-journal-lead__body p{margin-top:13px;color:var(--text);max-width:52ch;}
.sh-home .sh-journal-list{display:flex;flex-direction:column;}
.sh-home .sh-journal-row{display:grid;grid-template-columns:auto 1fr;gap:20px;padding:22px 0;border-top:1px solid var(--line);align-items:baseline;transition:padding-left .25s var(--ease);}
.sh-home .sh-journal-row:first-child{border-top:0;padding-top:0;}
.sh-home .sh-journal-list a.sh-journal-row:hover{padding-left:8px;}
.sh-home .sh-journal-row__date{font-family:var(--mono);font-size:.66rem;letter-spacing:.04em;color:var(--text);white-space:nowrap;padding-top:3px;}
.sh-home .sh-journal-row h4{font-weight:600;font-size:1.1rem;line-height:1.26;letter-spacing:-.01em;}
.sh-home .sh-journal-row .sh-cat{display:inline-block;margin-top:7px;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--green);}
/* ===== CTA (green band) ===== */
.sh-home .sh-cta{background:var(--green);color:#fff;padding:clamp(60px,8vw,104px) 0;position:relative;overflow:hidden;}
.sh-home .sh-cta::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:62px 62px;mask-image:linear-gradient(90deg,transparent,#000);-webkit-mask-image:linear-gradient(90deg,transparent,#000);}
.sh-home .sh-cta__in{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,60px);align-items:end;}
.sh-home .sh-cta h2{font-weight:700;font-size:clamp(2.2rem,4.8vw,4.2rem);line-height:1;letter-spacing:-.03em;text-transform:uppercase;}
.sh-home .sh-cta__right p{font-size:1.08rem;color:rgba(255,255,255,.9);max-width:46ch;}
.sh-home .sh-cta__phone{margin-top:18px;display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;}
.sh-home .sh-cta__phone a{font-family:var(--mono);font-size:.88rem;letter-spacing:.04em;color:#fff;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:2px;}
.sh-home .sh-cta .sh-btn{margin-top:24px;}
/* ===== REVEAL ===== */
.sh-home.sh-js .sh-reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.sh-home.sh-js .sh-reveal.sh-in{opacity:1;transform:none;}
/* ===== RESPONSIVE ===== */
@media (max-width:1080px){
  .sh-home .sh-hero__grid{grid-template-columns:1fr;gap:34px;}
  .sh-home .sh-hero__visual{min-height:340px;}
  .sh-home .sh-catalog{grid-auto-rows:clamp(176px,30vw,236px);}
  .sh-home .sh-cat-card--a{grid-column:span 12;grid-row:span 1;}
  .sh-home .sh-cat-card--b,.sh-home .sh-cat-card--e,.sh-home .sh-cat-card--f{grid-column:span 12;}
  .sh-home .sh-cat-card--c,.sh-home .sh-cat-card--d{grid-column:span 6;}
  .sh-home .sh-offer-slide{grid-template-columns:1fr;}
  .sh-home .sh-offer-slide__info{border-left:0;border-top:1px solid var(--line);}
  .sh-home .sh-services{grid-template-columns:repeat(3,1fr);}
  .sh-home .sh-svc--w,.sh-home .sh-svc--n{grid-column:span 1;}
  .sh-home .sh-project-feature__body{grid-template-columns:auto 1fr;}
  .sh-home .sh-project-feature__body .sh-arrow-link{grid-column:1 / -1;}
  .sh-home .sh-products{grid-template-columns:repeat(2,1fr);}
  .sh-home .sh-journal{grid-template-columns:1fr;}
  .sh-home .sh-cta__in{grid-template-columns:1fr;align-items:start;}
}
@media (max-width:640px){
  .sh-home .sh-demo-nav{display:none;}
  .sh-home .sh-section-head{flex-direction:column;align-items:flex-start;gap:22px;}
  .sh-home .sh-hero__meta{grid-template-columns:1fr 1fr;}
  .sh-home .sh-catalog{display:flex;flex-direction:column;}
  /* Селектор именно .sh-catalog>.sh-pcard: класса .sh-cat-card в разметке нет,
     у карточек только модификаторы .sh-cat-card--a…f (после скоупинга прототипа
     базовым классом стал .sh-pcard). Правило было мёртвым, а вместе с display:flex
     пропадает и grid-auto-rows — карточки становились 0px высоты и фото исчезали. */
  .sh-home .sh-catalog>.sh-pcard{min-height:290px;}
  /* Лента этапов: 5 шагов в две колонки ломались (последний висел один) →
     горизонтальная прокрутка со свайпом. grid-auto-flow:column вместо фиксированных
     колонок, чтобы число шагов можно было менять в PHP без правки CSS.
     Ширина шага 76% — следующий выглядывает и подсказывает, что можно тянуть. */
  .sh-home .sh-process{grid-template-columns:none;grid-auto-flow:column;
    grid-auto-columns:minmax(200px,76%);
    overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;scrollbar-color:var(--green) rgba(35,38,36,.08);}
  .sh-home .sh-process__step{scroll-snap-align:start;}
  /* Самый тонкий скролл, который даёт WebKit. */
  .sh-home .sh-process::-webkit-scrollbar{height:3px;}
  .sh-home .sh-process::-webkit-scrollbar-track{background:rgba(35,38,36,.08);}
  .sh-home .sh-process::-webkit-scrollbar-thumb{background:var(--green);border-radius:3px;}
  .sh-home .sh-process::-webkit-scrollbar-button{display:none;width:0;height:0;} /* стрелки по краям (Linux/Win) */
  .sh-home .sh-process__no{margin-bottom:18px;}
  /* Карточки услуг: столбец во всю ширину с отступом между ними. */
  .sh-home .sh-services{display:flex;flex-direction:column;gap:12px;grid-template-columns:none;}
  .sh-home .sh-svc--w,.sh-home .sh-svc--n{grid-column:auto;width:100%;}
  .sh-home .sh-services>.sh-pcard{min-height:270px;} /* было .sh-svc — тоже мёртвый класс */
  .sh-home .sh-project-feature__body{grid-template-columns:1fr;gap:14px;}
  .sh-home .sh-project-list{grid-template-columns:1fr;}
  .sh-home .sh-project-mini{border-right:0;border-bottom:1px solid var(--line);}
  .sh-home .sh-products{grid-template-columns:1fr;}
  .sh-home .sh-offer-slide__info{padding:26px 22px 30px;}
  /* header mobile */
  /* footer mobile */
}
@media (prefers-reduced-motion:reduce){
  .sh-home *{transition-duration:.001ms !important;animation-duration:.001ms !important;}
  .sh-home.sh-js .sh-reveal{opacity:1;transform:none;}
}

/* ===== РЕАЛЬНЫЕ ФОТО (замена плейсхолдеров прототипа) =====
   Контейнер кадра остаётся .sh-ph — на нём висят позиционирование внутри карточек,
   hover-зум и Г-образные уголки ::before/::after. Модификатор --img снимает
   декор плейсхолдера (пунктир, тинт, сетка) и отдаёт всё место картинке. */
.sh-home .sh-ph--img{display:block;border:0;background:none;padding:0;}
.sh-home .sh-ph--img picture{display:block;width:100%;height:100%;}
.sh-home .sh-ph__img{display:block;width:100%;height:100%;object-fit:cover;}
/* уголки поверх фото: светло-зелёные засечки по углам кадра, без тени */
/* На фото уголки белые с микротенью — так они читаются и на светлом, и на тёмном
   кадре. Отступ остаётся базовый, 12px из .sh-ph. */
.sh-home .sh-ph--img::before,.sh-home .sh-ph--img::after{z-index:2;
  border-color:rgba(255,255,255,.9);filter:drop-shadow(0 0 1px rgba(0,0,0,.45));opacity:.7;}
/* По нулям и тёмно-зелёные — только в «Чаще выбирают» (.sh-product есть лишь в этом
   блоке): там кадр товара на белом фоне карточки, белая засечка на нём не видна. */
.sh-home .sh-product__media .sh-ph--img::before,
.sh-home .sh-product__media .sh-ph--img::after{border-color:var(--green);filter:none;opacity:.4;}
.sh-home .sh-product__media .sh-ph--img::before{top:0;left:0;}
.sh-home .sh-product__media .sh-ph--img::after{bottom:0;right:0;}

/* высоты, которые раньше задавал текст плейсхолдера */
.sh-home .sh-journal-lead .sh-ph--img{height:clamp(270px,30vw,400px);min-height:0;}
.sh-home .sh-hero__visual .sh-ph--img{position:absolute;inset:0;}

/* ===== ОБЪЕКТЫ: мини-плитки с фото ===== */
/* Прототип держал 3 мини-объекта текстом. Фото под все четыре объекта есть,
   поэтому мини-плитки — компактные фото-карточки в том же языке, что .sh-pcard. */
.sh-home .sh-project-list{grid-template-columns:repeat(3,1fr);gap:12px;border-top:0;margin-top:12px;}
.sh-home .sh-project-mini{position:relative;overflow:hidden;padding:0;border:0;border-radius:var(--r);
  background:var(--ground-3);min-height:clamp(190px,17vw,232px);isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end;}
.sh-home .sh-project-mini:hover{background:var(--ground-3);}
.sh-home .sh-project-mini .sh-ph{position:absolute;inset:0;border:0;border-radius:0;
  transition:transform .6s var(--ease);}
.sh-home .sh-project-mini:hover .sh-ph{transform:scale(1.05);}
.sh-home .sh-project-mini__body{position:relative;z-index:2;padding:clamp(16px,1.6vw,22px);color:#fff;}
.sh-home .sh-project-mini .sh-mono{color:rgba(255,255,255,.86);margin-bottom:6px;}
.sh-home .sh-project-mini b{color:#fff;font-size:clamp(1rem,1.3vw,1.16rem);}
.sh-home .sh-project-mini span{color:rgba(255,255,255,.78);}

/* ===== ТОВАРНЫЕ БЛОКИ: карточка целиком ссылка ===== */
/* В прототипе .sh-product — просто <article>. В WP это <a>, чтобы вся плитка кликалась. */
.sh-home a.sh-product{display:block;color:inherit;}
.sh-home a.sh-product:hover{color:inherit;}

/* Второй ряд «Чаще выбирают» — тот же грид, без карусели: просто перенос строки. */
.sh-home .sh-products{row-gap:clamp(14px,1.6vw,22px);}

/* Единственное правило вне .sh-home: гасим вертикальный padding <main> темы
   (.wd-content-layout{padding-block:40px}), чтобы hero шёл сразу под хедером.
   Класс sh-home-main вешается на <main> только на главной. */
.sh-home-main{padding-block:0;}

/* ===== ПЕРЕБИВАЕМ ТИПОГРАФИКУ ТЕМЫ =====
   Woodmart красит и капсит заголовки ПРЯМЫМ правилом
   `h1,h2,…,h6{color:var(--wd-title-color);text-transform:var(--wd-title-transform)}`.
   Наследование от .sh-home / .sh-cta его не перебивает, поэтому цвет и регистр
   задаём явно — иначе белые заголовки на фото становятся тёмными,
   а hero-заголовок уезжает в верхний регистр. */
.sh-home h1,.sh-home h2,.sh-home h3,.sh-home h4{color:var(--ink);text-transform:none;
  font-family:var(--sans);}
/* Заголовки в неймспейсе — шрифтом блока: тема прописывает h1–h6 брендовый Rubik
   (--wd-title-font), а редизайн построен на IBM Plex Sans. */
.sh-home .sh-cat-card__title,
.sh-home .sh-svc__body h3,
.sh-home .sh-project-feature__body h3,
.sh-home .sh-cta h2{color:#fff;}
.sh-home .sh-cta h2{text-transform:uppercase;}
.sh-home .sh-hero h1 em,.sh-home .sh-brand h2 em{color:var(--green);}

/* Мобильная раскладка объектов: базовое правило .sh-project-list выше идёт ПОСЛЕ
   медиазапросов прототипа, поэтому адаптив для него дублируем здесь. */
@media (max-width:900px){
  .sh-home .sh-project-list{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .sh-home .sh-project-list{grid-template-columns:1fr;}
  .sh-home .sh-project-mini{min-height:clamp(170px,44vw,210px);}
}

/* ===== «ЧАЩЕ ВЫБИРАЮТ» — КАРУСЕЛЬ =====
   Тот же движок, что у «Лучшего предложения», но 4 карточки в кадре
   (data-per-view="4,2,1"). Гэп даёт не gap трека, а внутренний padding слайда:
   иначе страница сдвигалась бы на 100% + лишние гэпы и карточки уезжали. */
.sh-home .sh-products-slider{position:relative;--sh-pv:4;}
/* overflow:hidden режет по краю ПАДДИНГ-БОКСА, поэтому место для ховера карточки
   (подъём -5px и тень ~20px под ней) даём паддингом, а влияние на ритм снимаем
   отрицательными margin — они гасят паддинг полностью, поэтому зазоры «голова →
   карточки» и «карточки → контролы» остаются те же 60 и 24px. По горизонтали паддинг
   не даём: vp.clientWidth участвует в расчёте свайпа (home.js), да и тень по бокам
   не выходит (spread -24 гасит блюр 46). */
.sh-home .sh-products-slider__vp{overflow:hidden;padding:8px 0 20px;margin:-8px 0 -20px;}
.sh-home .sh-products-slider__track{display:flex;margin-inline:-6px;
  transition:transform .6s var(--ease);will-change:transform;}
.sh-home .sh-products-slider.sh-dragging .sh-products-slider__track{transition:none;}
.sh-home .sh-products-slider__item{flex:0 0 calc(100% / var(--sh-pv));min-width:0;
  padding-inline:6px;display:flex;}
.sh-home .sh-products-slider__item>.sh-product{flex:1 1 auto;}
@media (max-width:1080px){
  .sh-home .sh-products-slider{--sh-pv:2;}
}
@media (max-width:640px){
  .sh-home .sh-products-slider{--sh-pv:1;}
}

/* Товарная карточка: packshot показываем целиком (не кропаем), центрируем в кадре,
   подложку не заливаем — у фото товаров свой фон.
   height:auto только здесь: в фото-блоках (слайдер, обложка журнала, каталог)
   он оставлял пустые полосы под картинкой. */
.sh-home .sh-product__media{background-color:transparent;}
.sh-home .sh-product__media .sh-ph{display:flex;align-items:center;justify-content:center;}
.sh-home .sh-product__media .sh-ph__img{height:auto;}