/* ==========================================================================
   SOPWITH GUITARS — «Poster / Ink» design layer
   --------------------------------------------------------------------------
   Подключается ПОСЛЕ site-refresh.css и переопределяет палитру, шрифты
   и компоненты публичной части.

   Логика стиля взята с постера клиента:
     • фон      — тёплая бумага
     • графика  — чёрная тушь + штриховка
     • акцент   — один кроваво-красный, без полутонов
     • формы    — прямые углы, жёсткие рамки, никаких скруглений и мягких теней
     • шрифты   — ROG (логотип) / Russo One (заголовки) / Oswald (кикеры) / Inter (текст)
   ========================================================================== */

:root{
  /* палитра из постера */
  --paper:#f2efe8;
  --paper-2:#e8e3d7;
  --paper-3:#ddd7c8;
  --ink:#141414;
  --ink-2:#000000;
  --ink-soft:#3b3831;
  --muted:#6e695e;
  --red:#9d1c14;
  --red-2:#c0211a;
  --red-dark:#78120c;
  --line:rgba(20,20,20,.16);
  --line-strong:rgba(20,20,20,.42);

  /* перекрываем палитру старого слоя, чтобы внутренние страницы
     автоматически подхватили новый акцент */
  --orange:var(--red);
  --orange-dark:var(--red-dark);
  --soft:var(--paper-2);
  --sand:var(--paper-2);

  --f-logo:'ROG','Russo One',sans-serif;
  --f-display:'Russo One','Oswald',sans-serif;
  --f-cond:'Oswald','Arial Narrow',Arial,sans-serif;
  --f-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;

  --header:84px;
  --container:1220px;
  --radius:0px;
}

/* ---------- база: бумага + тушь ---------- */
html{background:var(--paper)}
body{
  font-family:var(--f-body)!important;
  color:var(--ink)!important;
  background:var(--paper)!important;
  line-height:1.65;
}
/* мягкая «печатная» фактура бумаги */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E");
}
#site-content{position:relative;z-index:1;background:transparent!important}
::selection{background:var(--red);color:#fff}

/* ---------- типографика ---------- */
h1,h2,h3,h4{color:var(--ink)}
.sop-h1,.sop-h2,.sop-h3,.home-why h2,.section-heading h2,.about-band h2,.home-cta h2,
.about-hero h1,.blog-hero h1,.article h1,.main-content .entry-title,.main-content .page-title,
.heading-section h4,.about-layout h2,.blog-card h2{
  font-family:var(--f-display)!important;
  font-weight:400!important;
  letter-spacing:-.012em!important;
  line-height:1.06!important;
}

/* кикер: узкий гротеск, разрядка, красная засечка */
.section-kicker,.eyebrow,.blog-hero .eyebrow{
  display:flex;align-items:center;gap:10px;
  font:600 12px/1 var(--f-cond)!important;
  letter-spacing:.24em!important;
  text-transform:uppercase;
  color:var(--ink)!important;
  opacity:.72;
}
.section-kicker::before,.eyebrow::before{
  content:"";width:26px;height:3px;background:var(--red);flex:0 0 26px;
}
.home-cta .section-kicker,.home-cta .section-kicker::before,
.about-hero .section-kicker,.about-hero .section-kicker::before,
.blog-hero .eyebrow,.blog-hero .eyebrow::before{color:#fff!important;opacity:1}
.home-cta .section-kicker::before,.about-hero .section-kicker::before,
.blog-hero .eyebrow::before{background:#fff}
.about-hero .section-kicker::before{background:var(--red-2)}

/* ---------- кнопки ---------- */
.button,.cut-corner,.contact-form input[type=submit],.btn{
  display:inline-flex!important;align-items:center;justify-content:center;gap:10px;
  min-height:52px!important;padding:14px 26px!important;
  border:2px solid var(--ink)!important;border-radius:0!important;
  background:var(--ink)!important;color:#fff!important;
  font-family:var(--f-cond)!important;font-size:14px!important;font-weight:600!important;
  letter-spacing:.14em!important;text-transform:uppercase;line-height:1!important;
  text-decoration:none;box-shadow:none!important;
  transition:background .16s,border-color .16s,color .16s,transform .16s;
}
.button:hover,.contact-form input[type=submit]:hover,.btn:hover{
  background:var(--red)!important;border-color:var(--red)!important;color:#fff!important;
  transform:translateY(-2px);
}
.button-light{background:transparent!important;color:var(--ink)!important}
.button-light:hover{background:var(--ink)!important;color:#fff!important}
/* на красном фоне */
.home-cta .button{background:#fff!important;border-color:#fff!important;color:var(--ink)!important}
.home-cta .button:hover{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}

.text-link{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-cond);font-size:14px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink);text-decoration:none;
  border-bottom:2px solid var(--ink);padding-bottom:5px;
}
.text-link span,.text-link i{color:var(--red);transition:transform .18s}
.text-link:hover span,.text-link:hover i{transform:translateX(5px)}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  background:var(--paper)!important;
  border-bottom:2px solid var(--ink)!important;
  backdrop-filter:none!important;box-shadow:none!important;
}
.site-header.is-scrolled{box-shadow:0 10px 0 -8px rgba(20,20,20,.14)!important}
.header-inner{height:100%;display:flex;align-items:center;gap:20px}

.site-brand{
  display:block!important;width:auto!important;flex:0 0 auto;
  background:none!important;padding:0!important;
}
.site-brand img{display:block;height:42px;width:auto;max-height:none!important}

.main-navigation{gap:13px!important}
.main-navigation .nav-link{
  position:relative;padding:30px 0!important;
  font-family:var(--f-cond)!important;font-size:12px!important;font-weight:500!important;
  letter-spacing:.07em!important;text-transform:uppercase;
  color:var(--ink)!important;
}
.main-navigation .nav-link:after{background:var(--red);height:3px;bottom:20px}
.header-panel{gap:16px!important;min-width:0}
/* поиск: сбрасываем абсолютное позиционирование из старого style.css
   (`.header-search{position:absolute;right:20px;top:50%}` — из-за него
   поле наезжало на блок с телефоном).
   В шапке он свёрнут до иконки и раскрывается при наведении/фокусе. */
.header-search{
  position:static!important;right:auto!important;top:auto!important;transform:none!important;
  width:46px;min-width:0;overflow:hidden;flex:0 0 auto;
  justify-content:flex-end;align-items:center;
  border-bottom:2px solid transparent!important;
  transition:width .22s ease,border-color .22s;
}
.header-search:hover,.header-search:focus-within{width:210px;border-bottom-color:var(--red)!important}
.header-search input{
  width:0!important;min-width:0;padding:0;font-family:var(--f-body);font-size:13px;
  transition:width .22s ease;
}
.header-search:hover input,.header-search:focus-within input{width:100%!important;padding:0 4px}
.header-search button{
  flex:0 0 34px;background:transparent!important;border:0!important;color:var(--ink)!important;
  border-radius:0!important;padding:0!important;cursor:pointer;
}
.header-search:hover button,.header-search button:hover{color:var(--red)!important}
.header-search button{color:var(--ink)}
.header-account{border-left:1px solid var(--line)!important;padding-left:16px!important}
.header-account a{
  font-family:var(--f-cond);font-size:13px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft);
}
.header-account a:hover{color:var(--red)}

/* блок «телефон / часы» как на постере */
.header-contact{
  display:flex;flex-direction:column;align-items:flex-end;gap:1px;
  margin-left:18px;padding-left:18px;border-left:1px solid var(--line);
  font-family:var(--f-cond);line-height:1.15;white-space:nowrap;flex:0 0 auto;
}
.header-contact a{font-size:17px;font-weight:700;letter-spacing:.01em;color:var(--ink);text-decoration:none}
.header-contact a:hover{color:var(--red)}
.header-contact span{font-size:13px;font-weight:400;letter-spacing:.06em;color:var(--muted)}

/* ==========================================================================
   HERO — «постер»
   ========================================================================== */
.sop-hero{
  position:relative;overflow:hidden;
  padding:74px 0 0;
  background:var(--paper);
  border-bottom:2px solid var(--ink);
}
.sop-hero-grid{
  display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center;
  padding-bottom:70px;
}
.sop-hero-copy{position:relative;z-index:2}
.sop-hero h1{
  margin:22px 0 0;font-family:var(--f-display);
  font-size:clamp(44px,5.6vw,80px);line-height:1.02;letter-spacing:-.02em;
  text-transform:none;
}
.sop-hero h1 .accent{color:var(--red)}
.sop-hero-lead{max-width:560px;margin:26px 0 0;font-size:18px;line-height:1.7;color:var(--ink-soft)}
.sop-hero-actions{display:flex;align-items:center;gap:26px;margin-top:38px;flex-wrap:wrap}

/* красная плашка-правило, как под логотипом на постере */
.sop-rule{height:10px;background:var(--red);width:min(100%,420px);margin:20px 0 0}
.sop-hero-tagline{
  margin:16px 0 0;font-family:var(--f-cond);font-size:15px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink);opacity:.75;
}

/* издания/цифры справа, как телефон на постере */
.sop-hero-art{
  position:relative;display:flex;align-items:center;justify-content:center;
  min-height:520px;
}
.sop-hero-art img{
  position:relative;z-index:2;width:min(100%,470px);height:auto;max-height:660px;
  object-fit:contain;filter:drop-shadow(10px 14px 0 rgba(20,20,20,.08));
}
.sop-hero-art::after{
  content:"";position:absolute;z-index:1;width:min(78%,430px);aspect-ratio:1;
  border:2px solid var(--line);transform:rotate(-6deg);
}
.sop-hero-scroll{
  position:absolute;left:50%;bottom:22px;width:26px;height:42px;
  border:2px solid var(--ink);border-radius:0;transform:translateX(-50%);
  display:block;overflow:hidden;
}
.sop-hero-scroll span{
  position:absolute;left:50%;top:9px;width:3px;height:9px;margin-left:-1.5px;
  background:var(--red);border-radius:0;
  animation:sop-scroll 1.8s cubic-bezier(.6,0,.4,1) infinite;
}
@keyframes sop-scroll{
  0%{transform:translateY(0);opacity:1}
  70%{transform:translateY(15px);opacity:0}
  100%{transform:translateY(0);opacity:0}
}

/* ---------- красная бегущая строка ---------- */
.sop-strip{
  background:var(--red);color:#fff;overflow:hidden;
  border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);
}
.sop-strip-track{
  display:flex;width:max-content;
  animation:sop-marquee 34s linear infinite;
}
.sop-strip-track span{
  display:block;padding:13px 0;white-space:nowrap;
  font-family:var(--f-cond);font-size:14px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
}
.sop-strip-track span i{font-style:normal;opacity:.55;padding:0 22px}
@keyframes sop-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.sop-strip-track{animation:none}}

/* ---------- полоса цифр ---------- */
.sop-proof{background:var(--ink);color:#fff;border-bottom:2px solid var(--ink)}
.proof-grid{padding-top:42px!important;padding-bottom:42px!important}
.proof-grid div{border-right:1px solid #3a3a36!important;gap:16px}
.proof-grid strong{
  font-family:var(--f-display)!important;font-size:clamp(30px,3vw,44px)!important;
  color:#fff!important;line-height:1;
}
.proof-grid strong em{font-style:normal;color:var(--red-2)}
/* «∞» нет в Russo One — рисуем его текстовым шрифтом, чтобы не выбивался */
.proof-grid strong .glyph{font-family:var(--f-body);font-weight:800;font-size:.92em}
/* в Russo One двоеточие почти неразличимо («1:1» читается как «11») —
   разделитель берём из текстового шрифта */
.proof-grid strong .sep{
  font-family:var(--f-body);font-weight:800;font-size:.86em;
  color:var(--red-2);padding:0 .05em;
}
.proof-grid span{
  font-family:var(--f-cond);font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:#b9b5aa!important;
}

/* ---------- секции ---------- */
.sop-section{padding:104px 0}
.sop-section--tight{padding:88px 0}
.sop-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:52px}
.sop-section-head h2{margin:14px 0 0;font-size:clamp(34px,4.2vw,56px)}
.sop-h2{margin:14px 0 0;font-size:clamp(34px,4.2vw,56px)}
.sop-section > .container > .sop-h2{margin-bottom:46px}

/* карточки работ */
.sop-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.sop-card{
  display:block;position:relative;text-decoration:none;color:var(--ink);
  background:var(--paper);border:2px solid var(--ink);
  box-shadow:8px 8px 0 rgba(20,20,20,.10);
  transition:transform .18s,box-shadow .18s;
}
.sop-card:hover{transform:translate(-3px,-3px);box-shadow:12px 12px 0 rgba(157,28,20,.28)}
.sop-card-media{height:360px;overflow:hidden;background:var(--paper-3);border-bottom:2px solid var(--ink)}
.sop-card-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(.18) contrast(1.04);transition:transform .6s ease,filter .3s}
.sop-card:hover .sop-card-media img{transform:scale(1.04);filter:none}
.sop-card-body{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:20px 22px}
.sop-card-num{
  font-family:var(--f-cond);font-size:13px;font-weight:700;letter-spacing:.1em;
  color:#fff;background:var(--red);padding:4px 7px;
}
.sop-card-body h3{margin:0;font-family:var(--f-cond);font-size:17px;font-weight:600;letter-spacing:.02em}
.sop-card-body i{color:var(--red);transition:transform .18s}
.sop-card:hover .sop-card-body i{transform:translateX(5px)}

/* почему мы */
.sop-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:2px solid var(--ink)}
.sop-why-card{
  padding:38px 34px 42px;border-bottom:2px solid var(--ink);
}
.sop-why-card:not(:first-child){border-left:1px solid var(--line)}
.sop-why-card>span{
  display:block;font-family:var(--f-display);font-size:15px;color:var(--red);letter-spacing:.06em;
}
.sop-why-card h3{margin:22px 0 14px;font-family:var(--f-display);font-size:23px;line-height:1.2;letter-spacing:-.01em}
.sop-why-card p{margin:0;color:var(--muted);font-size:16px}

/* тёмная полоса «о мастерской» */
.sop-band{
  background:var(--ink);color:#fff;padding:96px 0;text-align:center;
  border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);
}
.sop-band h2{margin:16px auto 24px;max-width:900px;font-family:var(--f-display);font-size:clamp(32px,4.4vw,58px);line-height:1.05;color:#fff}
.sop-band p{max-width:660px;margin:0 auto 34px;font-size:18px;color:#bdb9ae}
.sop-band .section-kicker{justify-content:center;color:#fff!important;opacity:1}
.sop-band .section-kicker::before{background:var(--red-2)}

/* CTA */
.sop-cta{
  background:var(--red);color:#fff;text-align:center;padding:88px 0;
  border-bottom:2px solid var(--ink);
}
.sop-cta h2{margin:16px auto 20px;max-width:820px;font-family:var(--f-display);font-size:clamp(32px,4.4vw,58px);line-height:1.05;color:#fff}
.sop-cta p{max-width:620px;margin:0 auto 32px;font-size:18px;color:#f0cfca}
.sop-cta .section-kicker{justify-content:center;color:#fff!important;opacity:1}
.sop-cta .section-kicker::before{background:#fff}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{background:var(--ink)!important;padding:78px 0 26px!important;border-top:4px solid var(--red)}
.site-footer img{width:auto!important;height:56px}
.site-footer h2{
  font-family:var(--f-cond)!important;font-size:12px!important;font-weight:600!important;
  letter-spacing:.22em!important;text-transform:uppercase;color:#8f8b80!important;
}
.footer-brand p,.footer-subscribe p{color:#a5a196!important;font-size:14px}
.footer-column>a,.footer-column address a{color:#cfcbc0!important;font-family:var(--f-body)}
.footer-column>a:hover,.footer-column address a:hover{color:var(--red-2)!important}
.footer-column address span{color:#8f8b80!important}
.social-links a{border:1px solid #3a3a36!important;color:#cfcbc0!important;border-radius:0}
.social-links a:hover{background:var(--red)!important;border-color:var(--red)!important;color:#fff!important}
.newsletter-form{border-bottom:2px solid #565248!important}
.newsletter-form button{color:var(--red-2)!important}
.footer-bottom{border-top:1px solid #333330!important;color:#807c72!important;font-family:var(--f-cond);letter-spacing:.1em;text-transform:uppercase;font-size:12px}

/* ==========================================================================
   ВНУТРЕННИЕ СТРАНИЦЫ — приведение к тому же языку
   ========================================================================== */

/* --- сброс «белого текста» из старого style.css на светлых фонах ---
   Там целая группа правил красит текст в white, потому что та тема была
   тёмной. На бумажном фоне он невидим. В т.ч. реальный баг: поля
   .contact-form имели color:white при background:#fff — вводимый текст
   не был виден. */
.content .entry-title,
.content .post .entry-title,
.content .post .entry-title a,
.content .post .entry-date,
.content .leading,
.page-title,
.product-title,
.product-info h4,
.item .year,
.discography-list .detail .year,
.widget .widget-title,
.widget-title,
.map-wrapper address,
.map-wrapper address a,
.event .entry-title a,
.event .entry-date{color:var(--ink)!important}

.contact-form input,.contact-form textarea{color:var(--ink)!important}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--muted)!important;opacity:1}

.widget-title,.widget .widget-title{
  font-family:var(--f-display)!important;font-weight:400!important;
  font-size:19px!important;letter-spacing:0!important;padding-bottom:14px!important;
  border-bottom:2px solid var(--ink);
}
.discography-list h3,.discography-list h3 a{color:var(--ink)}
.discography-list .track{color:var(--red);font-family:var(--f-cond);font-weight:600}

/* галерея/каталог */
.gallery .filter-links{border-bottom:2px solid var(--ink)!important}
.gallery .filter-links>a,.mobile-filter{
  border-radius:0!important;border:1px solid var(--line-strong)!important;
  font-family:var(--f-cond);letter-spacing:.1em;text-transform:uppercase;
  background:transparent!important;color:var(--ink)!important;
}
.gallery .filter-links>a.current,.gallery .filter-links>a:hover{background:var(--red)!important;border-color:var(--red)!important;color:#fff!important}
.gallery .filterable-item>a{border:2px solid var(--ink)!important;background:var(--paper)!important;box-shadow:8px 8px 0 rgba(20,20,20,.10);transition:transform .18s,box-shadow .18s}
.gallery .filterable-item>a:hover{transform:translate(-3px,-3px)!important;box-shadow:12px 12px 0 rgba(157,28,20,.28)!important}
.gallery .filterable-item img{filter:grayscale(.18) contrast(1.04);transition:filter .3s}
.gallery .filterable-item>a:hover img{filter:none}
.gallery .filterable-item figcaption{padding-top:16px!important}
.gallery .filterable-item figcaption h3{
  margin:0 0 10px!important;font-family:var(--f-cond)!important;font-weight:600!important;
  font-size:16px!important;line-height:1.35!important;letter-spacing:.01em;
}
.gallery .filterable-item .price{margin:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.gallery .filterable-item .current-price,.current-price{
  font-family:var(--f-display)!important;color:var(--red)!important;
  font-weight:400!important;font-size:19px!important;line-height:1.1;
}
.gallery .filterable-item .old-price{font-size:13px!important;color:var(--muted)!important}
.gallery .pagination a{border:1px solid var(--line-strong)!important;border-radius:0}
.gallery .pagination a.current{background:var(--red);border-color:var(--red);color:#fff}

/* hero-блоки внутренних страниц */
.about-hero,.blog-hero{background:var(--ink)!important;border-bottom:4px solid var(--red)}
.about-hero h1,.blog-hero h1{color:#fff}
.about-panel{background:var(--red)!important;box-shadow:10px 10px 0 rgba(20,20,20,.14)}
.about-section{background:var(--paper-2)!important}

/* карточки блога / поиска / виджетов */
.blog-card,.search-results .item,.sidebar .widget,.top-downloaded{
  border:2px solid var(--ink)!important;background:var(--paper)!important;
  box-shadow:8px 8px 0 rgba(20,20,20,.10)!important;border-radius:0!important;
}
.blog-card h2,.article h1{font-family:var(--f-display)!important;font-weight:400!important}
.blog-link{color:var(--red)!important;font-family:var(--f-cond);letter-spacing:.1em;text-transform:uppercase;font-size:13px}

/* формы */
.contact-form input,.contact-form textarea,.form-control,.form-select{
  border:2px solid var(--line-strong)!important;border-radius:0!important;background:#fff!important;
  font-family:var(--f-body);
}
.contact-form input:focus,.contact-form textarea:focus,.form-control:focus{
  border-color:var(--red)!important;outline:0;box-shadow:0 0 0 3px rgba(157,28,20,.14)!important;
}
.map{border:2px solid var(--ink)!important}
.map iframe{filter:grayscale(1) contrast(1.05)}

/* карточка товара */
.product-tabs .tabs{border-bottom:2px solid var(--ink)}
.product-tabs .tabs li{font-family:var(--f-cond);letter-spacing:.1em;text-transform:uppercase;font-size:13px}
.product-tabs .tabs li.active{color:var(--red);border-bottom:3px solid var(--red)}
.thumbnail.active{border-color:var(--red)}
.history-timeline{border-left:3px solid var(--red)}
.specs-table th,.specs-table td{border-bottom:1px solid var(--line)}
.specs-table th{font-family:var(--f-cond);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--red)}
.specs-table td{color:var(--ink-soft)}
.in-stock{color:#1c6b3f}.out-of-stock{color:var(--red)}

/* пустые состояния */
.empty-state{background:var(--paper-2);border:2px dashed var(--line-strong)}
.empty-state h3{font-family:var(--f-display);font-weight:400}

/* ==========================================================================
   СТРАНИЦА ТОВАРА
   ========================================================================== */
.sop-crumbs{
  display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:34px;
  font-family:var(--f-cond);font-size:12px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}
.sop-crumbs a{color:var(--ink);text-decoration:none}
.sop-crumbs a:hover{color:var(--red)}
.sop-crumbs i{color:var(--line-strong);font-style:normal}
.sop-crumbs em{font-style:normal;color:var(--red)}

.sop-product{
  display:grid;grid-template-columns:1.04fr .96fr;gap:54px;align-items:start;
  padding-bottom:56px;border-bottom:2px solid var(--ink);
}
.sop-product .main-image{
  border:2px solid var(--ink);background:var(--paper-3);
  box-shadow:11px 11px 0 rgba(20,20,20,.10);overflow:hidden;
}
.sop-product .main-image img{
  display:block;width:100%;height:auto;max-height:600px;object-fit:contain;margin:0 auto;
}
.sop-product .thumbnail-images{display:flex;gap:12px;margin-top:16px;overflow-x:auto;padding-bottom:4px}
.sop-product .thumbnail{
  width:86px;height:86px;flex:0 0 86px;object-fit:cover;cursor:pointer;
  border:2px solid var(--line-strong);background:var(--paper-3);
  opacity:.55;transition:opacity .18s,border-color .18s;
}
.sop-product .thumbnail:hover{opacity:1}
.sop-product .thumbnail.active{opacity:1;border-color:var(--red)}

.sop-product-info{
  position:sticky;top:calc(var(--header) + 26px);
}
@media(max-width:1050px){.sop-product-info{position:static}}
.sop-product-title{
  margin:16px 0 0;font-family:var(--f-display);font-weight:400;
  font-size:clamp(30px,3.6vw,50px);line-height:1.05;letter-spacing:-.015em;
}
.sop-price{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-top:26px}
.sop-price .old-price{
  font-family:var(--f-cond)!important;font-size:18px!important;
  color:var(--muted)!important;text-decoration:line-through;
}
.sop-price .current-price{
  font-family:var(--f-display)!important;font-size:clamp(30px,3.4vw,46px)!important;
  line-height:1!important;color:var(--red)!important;font-weight:400!important;
}
.sop-product-info .stock{
  display:inline-flex;align-items:center;margin-top:18px;padding:8px 14px;
  font-family:var(--f-cond);font-size:12px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;background:var(--ink);color:#fff;
}
.sop-product-info .stock.out-of-stock{background:var(--red)}
.sop-product-info .short-description{
  margin:24px 0 0;max-width:46ch;font-size:17px;line-height:1.7;color:var(--ink-soft);
}
.sop-product-info .actions{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.sop-product-meta{margin:38px 0 0;border-top:2px solid var(--ink)}
.sop-product-meta>div{
  display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  padding:14px 0;border-bottom:1px solid var(--line);
}
.sop-product-meta dt{
  font-family:var(--f-cond);font-size:12px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}
.sop-product-meta dd{margin:0;font-size:15px;font-weight:500;color:var(--ink)}
.sop-product-meta dd a{color:var(--red);text-decoration:none}
.sop-product-meta dd a:hover{text-decoration:underline}

/* вкладки */
.product-tabs{margin-top:64px!important;border-top:0!important}
.product-tabs .tabs{
  display:flex!important;gap:0!important;margin:0!important;padding:0!important;
  list-style:none;border-bottom:2px solid var(--ink)!important;
}
.product-tabs .tabs li{
  padding:18px 24px!important;margin:0 0 -2px!important;cursor:pointer;
  font-family:var(--f-cond)!important;font-size:13px!important;font-weight:600!important;
  letter-spacing:.13em;text-transform:uppercase;color:var(--muted)!important;
  border-bottom:3px solid transparent;transition:color .18s,border-color .18s;
}
.product-tabs .tabs li:first-child{padding-left:0!important}
.product-tabs .tabs li:hover{color:var(--ink)!important}
.product-tabs .tabs li.active{color:var(--ink)!important;border-bottom-color:var(--red)}
.tab-pane{padding:40px 0 0!important}
.tab-pane,.tab-pane p{font-size:17px;line-height:1.8;color:var(--ink-soft)}
.tab-pane>*:first-child{margin-top:0}
.tab-pane{max-width:78ch}

/* характеристики */
.specs-table{width:100%;border-collapse:collapse;margin:0}
.specs-table th,.specs-table td{
  padding:16px 0!important;border-bottom:1px solid var(--line)!important;text-align:left;vertical-align:top;
}
.specs-table th{
  width:42%;font-family:var(--f-cond)!important;font-size:13px!important;font-weight:600!important;
  letter-spacing:.1em;text-transform:uppercase;color:var(--red)!important;padding-right:24px!important;
}
.specs-table td{color:var(--ink)!important;font-size:16px}
.specs-table tr:last-child th,.specs-table tr:last-child td{border-bottom:0!important}

/* история */
.history-timeline{border-left:3px solid var(--red)!important;padding-left:32px!important}
.history-entry{position:relative;margin-bottom:40px!important;padding-bottom:8px}
.history-entry:last-child{margin-bottom:0!important}
.history-entry::before{
  content:"";position:absolute;left:-40px;top:7px;width:12px;height:12px;
  background:var(--red);box-shadow:0 0 0 4px var(--paper);
}
.history-header h3{
  margin:0 0 12px!important;font-family:var(--f-display)!important;font-weight:400!important;
  font-size:21px!important;line-height:1.25;color:var(--ink);
}
.history-year{
  font-family:var(--f-cond);font-size:15px;font-weight:400;color:var(--muted);white-space:nowrap;
}
.history-text{font-size:16px;line-height:1.75;color:var(--ink-soft)}
.history-image,.history-video,.history-audio{margin-top:18px}
.history-image img,.history-media img{border:2px solid var(--ink);max-width:100%}
.history-divider{display:none}

/* похожие товары */
.sop-related{margin-top:88px;padding-top:66px;border-top:2px solid var(--ink)}

/* ==========================================================================
   БЛОГ
   ========================================================================== */
.blog-hero{
  padding:92px 0 78px!important;background:var(--ink)!important;
  border-bottom:4px solid var(--red);
}
.blog-hero h1{
  font-family:var(--f-display)!important;font-weight:400!important;
  font-size:clamp(36px,5.4vw,72px)!important;line-height:1.04!important;
  letter-spacing:-.02em!important;color:#fff!important;margin:16px 0 20px!important;
}
.blog-hero p{max-width:640px;color:#bdb9ae!important;font-size:18px;line-height:1.7}
.blog-hero .eyebrow{color:#fff!important;opacity:1}

.blog-grid{gap:30px!important;padding:80px 0 100px!important}
.blog-card{
  display:flex!important;flex-direction:column;
  border:2px solid var(--ink)!important;background:var(--paper)!important;
  box-shadow:8px 8px 0 rgba(20,20,20,.10)!important;
  transition:transform .18s,box-shadow .18s;
}
.blog-card:hover{transform:translate(-3px,-3px);box-shadow:12px 12px 0 rgba(157,28,20,.28)!important}
.blog-card img{
  display:block;width:100%;height:230px;object-fit:cover;
  border-bottom:2px solid var(--ink);filter:grayscale(.18) contrast(1.04);
  transition:filter .3s;
}
.blog-card:hover img{filter:none}
.blog-card-body{display:flex;flex-direction:column;flex:1;padding:24px 24px 26px}
.blog-card h2{
  margin:0 0 12px!important;font-family:var(--f-display)!important;font-weight:400!important;
  font-size:19px!important;line-height:1.32!important;letter-spacing:-.005em!important;
}
.blog-card h2 a{color:var(--ink)!important;text-decoration:none}
.blog-card h2 a:hover{color:var(--red)}
.blog-card p{margin:0 0 20px;color:var(--muted);font-size:15px;line-height:1.65}
.blog-link{
  margin-top:auto;align-self:flex-start;
  font-family:var(--f-cond)!important;font-size:12px!important;font-weight:600;
  letter-spacing:.15em!important;text-transform:uppercase;color:var(--red)!important;
  text-decoration:none;border-bottom:2px solid var(--red);padding-bottom:3px;
}
.blog-link:hover{color:var(--ink)!important;border-bottom-color:var(--ink)}

/* статья */
.article{max-width:820px;padding:80px 20px 110px!important}
.article h1{
  font-family:var(--f-display)!important;font-weight:400!important;
  font-size:clamp(32px,4.6vw,58px)!important;line-height:1.06!important;
  letter-spacing:-.02em!important;margin:16px 0 26px!important;color:var(--ink);
}
.article>img,.article-content img{
  display:block;max-width:100%;border:2px solid var(--ink);
  box-shadow:9px 9px 0 rgba(20,20,20,.10);margin:32px 0;
}
.article-content{font-size:18px!important;line-height:1.85;color:#33302a!important}
.article-content h2{
  font-family:var(--f-display)!important;font-weight:400!important;
  font-size:30px!important;line-height:1.2;margin:48px 0 16px!important;color:var(--ink);
}
.article-content h3{
  font-family:var(--f-display)!important;font-weight:400!important;
  font-size:23px!important;line-height:1.3;margin:38px 0 14px!important;color:var(--ink);
}
.article-content a{color:var(--red);border-bottom:1px solid rgba(157,28,20,.45);text-decoration:none}
.article-content a:hover{border-bottom-color:var(--red)}
.article-content ul,.article-content ol{margin:0 0 24px;padding-left:24px}
.article-content li{margin-bottom:10px}
.article-content li::marker{color:var(--red)}
.article-content blockquote{
  margin:34px 0;padding:6px 0 6px 28px;border-left:5px solid var(--red);
  font-family:var(--f-display);font-size:21px;line-height:1.5;color:var(--ink);
}
.article-content hr{border:0;border-top:2px solid var(--ink);margin:44px 0}
.article-content code{
  font-family:ui-monospace,Consolas,monospace;font-size:.92em;
  background:var(--paper-2);border:1px solid var(--line);padding:2px 6px;
}
.article-content pre{
  background:var(--paper-2);border:2px solid var(--ink);padding:20px;overflow-x:auto;margin:0 0 24px;
}
.article-content pre code{background:none;border:0;padding:0}
.article-content table{width:100%;border-collapse:collapse;margin:0 0 26px}
.article-content th,.article-content td{
  padding:13px 0;border-bottom:1px solid var(--line);text-align:left;
}
.article-content th{
  font-family:var(--f-cond);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--red);
}

/* ==========================================================================
   АДАПТИВ
   ========================================================================== */

/* Предохранитель: у grid-элементов по умолчанию min-width:auto, из-за чего
   они не сжимаются ниже своего содержимого (например, ряд миниатюр в галерее
   товара распирал страницу на узких экранах). */
.sop-hero-grid>*,
.sop-product>*,
.sop-grid-3>*,
.sop-why-grid>*,
.sop-section-head>*,
.about-layout>*{min-width:0}

.inner-content,.page-content{padding:64px 0 80px!important}

@media(max-width:1180px){
  .header-contact{display:none}
}
@media(max-width:1050px){
  .sop-hero-grid{grid-template-columns:1fr;gap:34px;padding-bottom:56px}
  .sop-hero-art{min-height:400px;order:-1}
  .sop-hero-art img{max-height:440px}
  .sop-grid-3{grid-template-columns:repeat(2,1fr)}
  .sop-why-grid{grid-template-columns:1fr}
  .sop-why-card:not(:first-child){border-left:0}
  .sop-product{grid-template-columns:1fr;gap:38px}
  .sop-product .main-image img{max-height:460px}
  .blog-grid{grid-template-columns:repeat(2,1fr)!important}
  /* about.php — своя сетка, мобильных правил у неё не было вовсе */
  .about-layout{grid-template-columns:1fr!important;gap:42px!important}
  .about-panel{padding:38px!important}
  .gallery .filterable-items{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:780px){
  :root{--header:70px}
  .site-brand img{height:38px}
  /* в мобильном меню поиск снова занимает всю ширину —
     правило «свёрнутой иконки» действует только на десктопе */
  .header-panel{gap:22px!important}
  .main-navigation{gap:0!important}
  .header-search{
    width:100%!important;height:50px;overflow:visible!important;
    border:1px solid var(--line-strong)!important;
  }
  .header-search:hover,.header-search:focus-within{
    width:100%!important;border-color:var(--line-strong)!important;
  }
  .header-search input{width:100%!important;height:48px;padding:0 12px!important}
  .sop-hero{padding-top:48px}
  .sop-hero-art{min-height:320px}
  .sop-hero-art img{max-height:340px}
  .sop-section{padding:70px 0}
  .sop-section-head{display:block}
  .sop-section-head .text-link{margin-top:20px}
  .sop-grid-3{grid-template-columns:1fr}
  .sop-card-media{height:300px}
  .sop-strip-track span{font-size:12px}
  .blog-grid{grid-template-columns:1fr!important;padding:56px 0 70px!important}
  .product-tabs .tabs{overflow-x:auto;flex-wrap:nowrap}
  .product-tabs .tabs li{white-space:nowrap;padding:15px 16px!important}
  .sop-product .thumbnail{width:70px;height:70px;flex:0 0 70px}
  .sop-related{margin-top:64px;padding-top:48px}
  .history-timeline{padding-left:22px!important}
  .history-entry::before{left:-30px;width:11px;height:11px}
  .about-hero{padding:64px 0 56px!important}
  .about-section{padding:64px 0!important}
  .about-panel{padding:30px 26px!important}
  .inner-content,.page-content{padding:52px 0 64px!important}
  .site-footer{padding:56px 0 22px!important}
  .site-footer img{height:48px}
  .footer-grid{grid-template-columns:1fr 1fr!important;gap:34px!important}
  .specs-table th{width:46%!important;padding-right:14px!important}
  .sidebar .widget{padding:20px!important}
  .article{padding:56px 18px 76px!important}
  .blog-hero{padding:64px 0 52px!important}
  .map iframe{height:280px!important}
  .gallery .filterable-item img{height:230px!important}
  .product-tabs{margin-top:48px!important}
}
@media(max-width:480px){
  .sop-hero h1{font-size:38px}
  .sop-card-media{height:260px}
  .proof-grid{grid-template-columns:1fr!important}
  .proof-grid div{border-right:0!important;border-bottom:1px solid #3a3a36;padding:12px 0}
  .sop-product .thumbnail{width:56px;height:56px;flex:0 0 56px}
  .sop-product .thumbnail-images{gap:8px}
  .sop-crumbs{font-size:11px;gap:7px;margin-bottom:24px}
  .specs-table th{width:52%!important}
  .sop-product-meta>div{flex-direction:column;align-items:flex-start;gap:4px}
  .footer-grid{grid-template-columns:1fr!important}
  .gallery .filterable-items{grid-template-columns:1fr!important}
  .gallery .filterable-item img{height:300px!important}
  .sop-hero-art img{max-height:300px}
  .header-search{height:46px}
}
