
  :root{
    --bg:#E7E4DC;
    --panel:#F3F1EA;
    --panel-dark:#EAE6DB;
    --ink:#201D18;
    --ink-soft:#5B564C;
    --wood:#B8823E;
    --wood-dark:#8C6430;
    --steel:#3E4A52;
    --steel-light:#6B7A82;
    --safety:#E8541E;
    --safety-dark:#C24312;
    --line:#C9C4B7;
    --line-dark:#3E4A52;
    --green:#4B6B4E;
    --radius:2px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    font-size:16px;
    line-height:1.5;
  }
  img,svg{display:block;max-width:100%;}
  .mono{font-family:'IBM Plex Mono',monospace;}
  .display{font-family:'Big Shoulders Display',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:0.01em;}

  .wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
  @media (max-width:640px){.wrap{padding:0 18px;}}

  a{color:inherit;}
  button{font-family:inherit;cursor:pointer;}

  /* ---------- HEADER ---------- */
  .site-header{
    position:sticky;top:0;z-index:50;
    background:var(--ink);
    color:var(--bg);
    border-bottom:3px solid var(--wood);
  }
  .site-header .wrap{
    display:flex;align-items:center;justify-content:space-between;
    min-height:64px;
  }
  .brand{display:flex;align-items:center;gap:10px;flex-shrink:0;}
  .brand-mark{
    width:30px;height:30px;background:var(--wood);
    display:grid;place-items:center;
    font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:12px;color:var(--ink);
  }
  .brand-name{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:19px;letter-spacing:0.02em;text-transform:uppercase;}
  .brand-sub{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--steel-light);letter-spacing:0.06em;text-transform:uppercase;}
  @media (min-width:981px){
    .brand-sub{white-space:nowrap;}
  }
  .header-cta{
    background:var(--safety);color:#fff;border:none;
    padding:11px 20px;font-weight:600;font-size:13.5px;
    letter-spacing:0.02em;text-transform:uppercase;
    border-radius:var(--radius);
  }
  .header-cta:hover{background:var(--safety-dark);}

  /* ---------- HERO ---------- */
  .hero{
    background:
      repeating-linear-gradient(90deg, transparent 0 118px, var(--line) 118px 119px),
      var(--bg);
    padding:76px 0 64px;
    border-bottom:1px solid var(--line);
  }
  .hero-eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:12.5px;letter-spacing:0.08em;text-transform:uppercase;
    color:var(--wood-dark);
    display:flex;align-items:center;gap:10px;margin-bottom:18px;
  }
  .hero-eyebrow::before{content:"";width:22px;height:1px;background:var(--wood-dark);}
  .hero h1{
    font-size:clamp(38px,6vw,64px);
    line-height:0.98;margin:0 0 22px;
    max-width:15ch;
  }
  .hero h1 span{color:var(--wood-dark);}
  .hero-lead{
    font-size:18px;color:var(--ink-soft);max-width:46ch;margin:0 0 32px;
  }
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:44px;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:15px 26px;font-weight:600;font-size:15px;
    border-radius:var(--radius);border:none;
    text-transform:uppercase;letter-spacing:0.02em;
  }
  .btn-primary{background:var(--safety);color:#fff;}
  .btn-primary:hover{background:var(--safety-dark);}
  .btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink);}
  .btn-ghost:hover{background:var(--ink);color:var(--bg);}
  .btn-small{padding:10px 16px;font-size:12.5px;}

  .hero-stats{
    display:grid;grid-template-columns:repeat(3,1fr);
    border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);
  }
  .hero-stat{padding:18px 20px 18px 0;border-right:1px solid var(--line);}
  .hero-stat:last-child{border-right:none;}
  .hero-stat b{
    display:block;font-family:'Big Shoulders Display',sans-serif;font-weight:800;
    font-size:30px;color:var(--steel);
  }
  .hero-stat span{font-size:12.5px;color:var(--ink-soft);}
  @media (max-width:640px){.hero-stats{grid-template-columns:1fr;}.hero-stat{border-right:none;border-bottom:1px solid var(--line);padding:14px 0;}}

  /* ---------- SECTION generic ---------- */
  section{padding:72px 0;}
  .section-head{margin-bottom:40px;max-width:60ch;}
  .kicker{
    font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:0.09em;
    text-transform:uppercase;color:var(--wood-dark);margin-bottom:10px;
  }
  .section-head h2{font-size:clamp(26px,3.4vw,38px);margin:0 0 12px;}
  .section-head p{color:var(--ink-soft);font-size:16px;margin:0;}

  /* ---------- CALCULATOR ---------- */
  .calc-section{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line-dark);background:var(--ink);}
  @media (max-width:860px){.calc-grid{grid-template-columns:1fr;}}

  .calc-inputs{background:var(--panel);padding:38px;}
  .field-label{
    font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.06em;
    text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;display:block;
  }
  .seg{display:flex;border:1.5px solid var(--ink);border-radius:var(--radius);overflow:hidden;margin-bottom:26px;}
  .seg button{
    flex:1;background:transparent;border:none;padding:12px 6px;
    font-weight:600;font-size:13.5px;text-transform:uppercase;letter-spacing:0.01em;
    border-right:1.5px solid var(--ink);color:var(--ink);
  }
  .seg button:last-child{border-right:none;}
  .seg button.active{background:var(--ink);color:var(--bg);}

  .num-row{display:flex;gap:14px;margin-bottom:26px;}
  .field{flex:1;}
  .field input, .field select{
    width:100%;padding:13px 14px;font-family:'IBM Plex Mono',monospace;font-size:16px;
    border:1.5px solid var(--ink);border-radius:var(--radius);background:#fff;color:var(--ink);
  }
  .field small{display:block;margin-top:6px;color:var(--ink-soft);font-size:12px;}

  .calc-note{
    font-size:12.5px;color:var(--ink-soft);border-left:2px solid var(--wood);
    padding-left:12px;margin-top:4px;
  }

  .calc-result{
    background:var(--ink);color:var(--bg);padding:38px;
    display:flex;flex-direction:column;justify-content:space-between;
  }
  .result-top .kicker{color:var(--wood);}
  .result-figure{margin-bottom:22px;}
  .result-figure b{
    font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:56px;
    display:block;line-height:1;
  }
  .result-figure span{font-size:13px;color:var(--steel-light);text-transform:uppercase;letter-spacing:0.05em;}
  .result-sub{display:flex;gap:28px;margin-bottom:26px;flex-wrap:wrap;}
  .result-sub div b{display:block;font-family:'IBM Plex Mono',monospace;font-size:20px;}
  .result-sub div span{font-size:11.5px;color:var(--steel-light);text-transform:uppercase;letter-spacing:0.04em;}

  .pallet-viz{
    display:flex;flex-wrap:wrap;gap:5px;margin-bottom:26px;min-height:34px;align-items:flex-end;
  }
  .pallet-viz .p{
    width:22px;height:26px;background:var(--wood);border:1px solid var(--wood-dark);
    position:relative;
  }
  .pallet-viz .p::after{
    content:"";position:absolute;left:0;right:0;top:6px;height:1px;background:rgba(0,0,0,0.25);
    box-shadow:0 5px 0 rgba(0,0,0,0.2), 0 10px 0 rgba(0,0,0,0.15);
  }
  .pallet-viz .more{
    font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--steel-light);
    align-self:center;margin-left:4px;
  }

  .calc-cta{
    background:var(--safety);color:#fff;border:none;width:100%;
    padding:16px;font-weight:600;font-size:14.5px;text-transform:uppercase;
    letter-spacing:0.02em;border-radius:var(--radius);
  }
  .calc-cta:hover{background:var(--safety-dark);}

  /* ---------- CATALOG ---------- */
  .catalog-filters{display:flex;gap:10px;margin-bottom:26px;flex-wrap:wrap;}
  .filter-btn{
    background:transparent;border:1.5px solid var(--ink);padding:9px 16px;
    font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.02em;
    border-radius:var(--radius);
  }
  .filter-btn.active{background:var(--ink);color:var(--bg);}

  .catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  @media (max-width:900px){.catalog-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:600px){.catalog-grid{grid-template-columns:1fr;}}

  .product-card{
    background:var(--panel);border:1px solid var(--line);padding:20px;
    display:flex;flex-direction:column;gap:12px;
  }

  /* ---- Слот фото товара: соотношение 4:3, оптимизировано под быструю загрузку ---- */
  .p-image{
    position:relative;width:100%;aspect-ratio:4/3;
    background:var(--panel-dark);border:1.5px solid #32CD32;
    border-radius:var(--radius);overflow:hidden;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
  }
  .p-image img{
    width:100%;height:100%;object-fit:cover;display:block;
  }
  .p-image-placeholder{
    text-align:center;font-size:12px;color:var(--ink-soft);
    font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:0.04em;
    padding:0 14px;line-height:1.5;
  }
  .p-image.has-photo .p-image-placeholder{display:none;}
  .p-image-placeholder .plus{font-size:22px;display:block;margin-bottom:4px;color:var(--wood-dark);}
  .p-image input[type=file]{display:none;}
  .p-image-remove{
    position:absolute;top:6px;right:6px;width:24px;height:24px;
    background:rgba(32,29,24,0.75);color:#fff;border:none;border-radius:50%;
    font-size:14px;line-height:1;display:none;align-items:center;justify-content:center;
  }
  .p-image.has-photo .p-image-remove{display:flex;}
  .p-image-spec{font-size:10.5px;color:var(--ink-soft);margin-top:-4px;}

  /* ---- Лупа увеличения фото товара: только десктоп, только если фото загружено ---- */
  .p-image-zoom{
    position:absolute;bottom:6px;right:6px;width:24px;height:24px;
    background:rgba(32,29,24,0.75);color:#fff;border:none;border-radius:50%;
    display:none;align-items:center;justify-content:center;cursor:zoom-in;z-index:2;
    transition:background .15s;
  }
  .p-image-zoom:hover{background:rgba(32,29,24,0.92);}

  .product-card .p-type{
    align-self:flex-start;font-family:'IBM Plex Mono',monospace;font-size:10.5px;
    text-transform:uppercase;letter-spacing:0.05em;padding:3px 8px;
    background:var(--steel);color:#fff;
  }
  .product-card .p-type.tu{background:var(--wood-dark);}
  .product-card h4{margin:0;font-size:17px;line-height:1.3;}
  .product-card .p-meta{font-size:12.5px;color:var(--ink-soft);margin:0;}
  .product-card .p-price{
    display:flex;align-items:baseline;gap:8px;margin-top:auto;padding-top:10px;
    border-top:1px dashed var(--line);
  }
  .product-card .p-price b{font-family:'IBM Plex Mono',monospace;font-size:20px;}
  .product-card .p-price span{font-size:11.5px;color:var(--ink-soft);}
  .p-pack-price{font-size:12px;color:var(--ink-soft);}
  /* ---- Карточки товаров без цены (раздел "Доп. товары") ---- */
  .dop-card .p-meta{font-size:12.5px;line-height:1.5;}
  .dop-card .p-meta-noprice{font-style:italic;color:var(--ink-soft);}
  .dop-card .p-subtitle{
    font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;
    letter-spacing:0.04em;text-transform:uppercase;color:var(--wood-dark);margin:2px 0 4px;
  }
  .dop-card .p-controls{margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);}
  .p-price-request{
    margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);
    font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--wood-dark);
    text-transform:uppercase;letter-spacing:0.03em;
  }
  .p-price-pair{
    margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);
    display:flex;gap:8px;
  }
  .price-box{
    flex:1;min-width:0;border:1px solid var(--line);border-radius:var(--radius);
    padding:6px 8px;background:var(--panel-dark);
  }
  .price-box .price-label{
    display:block;font-family:'IBM Plex Mono',monospace;font-size:9px;
    text-transform:uppercase;letter-spacing:0.02em;color:var(--ink-soft);margin-bottom:2px;
  }
  .price-box .price-value{
    display:block;font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:14px;color:var(--ink);
  }
  .price-box.price-discount{background:#FBF0E4;border-color:var(--wood);}
  .price-box.price-discount .price-value{color:var(--wood-dark);}
  .p-controls{display:flex;gap:8px;align-items:center;}
  .qty-box{display:flex;align-items:center;border:1.5px solid var(--ink);border-radius:var(--radius);}
  .qty-box button{background:transparent;border:none;width:30px;height:34px;font-size:16px;font-weight:700;}
  .qty-box input{
    width:38px;border:none;text-align:center;font-family:'IBM Plex Mono',monospace;
    font-size:14px;padding:0;-moz-appearance:textfield;
  }
  .add-btn{
    flex:1;background:var(--ink);color:var(--bg);border:none;padding:10px 12px;
    font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.02em;
    border-radius:var(--radius);
  }
  .add-btn:hover{background:var(--safety);}
  .add-btn.added{background:var(--green);}

  /* ---------- CART BAR ---------- */
  .cart-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--ink);color:#fff;
    transform:translateY(110%);transition:transform 0.25s ease;
    border-top:3px solid var(--safety);
  }
  .cart-bar.show{transform:translateY(0);}
  .cart-bar .wrap{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 28px;gap:16px;flex-wrap:wrap;
  }
  .cart-bar .cart-info{font-size:14px;}
  .cart-bar .cart-info b{font-family:'IBM Plex Mono',monospace;color:var(--wood);}

  /* ---------- PRICE TIERS ---------- */
  .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-dark);border:1px solid var(--line-dark);}
  @media (max-width:760px){.tiers{grid-template-columns:1fr;}}
  .tier{background:var(--panel);padding:30px 26px;}
  .tier.featured{background:var(--steel);color:#fff;}
  .tier .tier-vol{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--wood-dark);margin-bottom:10px;}
  .tier.featured .tier-vol{color:var(--wood);}
  .tier h3{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:26px;margin:0 0 14px;text-transform:uppercase;}
  .tier ul{list-style:none;margin:0 0 22px;padding:0;font-size:14px;color:var(--ink-soft);}
  .tier.featured ul{color:#D8DEE1;}
  .tier li{padding:7px 0;border-top:1px solid var(--line);}
  .tier.featured li{border-top:1px solid rgba(255,255,255,0.15);}
  .tier li:first-child{border-top:none;}
  .tier-link{
    display:inline-block;font-weight:600;font-size:13.5px;text-transform:uppercase;
    letter-spacing:0.02em;border-bottom:2px solid var(--safety);padding-bottom:2px;
  }
  .tier.featured .tier-link{border-bottom-color:var(--wood);}

  /* ---------- ARGUMENTS ---------- */
  .args-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-bottom:56px;}
  @media (max-width:900px){.args-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.args-grid{grid-template-columns:1fr;}}
  .arg-card{background:var(--panel);border-top:3px solid var(--wood);padding:24px 20px;}
  .arg-card .arg-num{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--wood-dark);margin-bottom:12px;}
  .arg-card h4{font-size:16px;margin:0 0 8px;}
  .arg-card p{font-size:13.5px;color:var(--ink-soft);margin:0;}

  .compare-table{width:100%;border-collapse:collapse;font-size:14.5px;background:var(--panel);}
  .compare-table caption{
    text-align:left;font-family:'IBM Plex Mono',monospace;font-size:11.5px;
    color:var(--ink-soft);margin-bottom:10px;text-transform:uppercase;letter-spacing:0.05em;
  }
  .compare-table th, .compare-table td{padding:13px 16px;border-bottom:1px solid var(--line);text-align:left;}
  .compare-table thead th{
    font-family:'IBM Plex Mono',monospace;font-size:12px;text-transform:uppercase;
    letter-spacing:0.04em;color:var(--ink-soft);border-bottom:2px solid var(--ink);
  }
  .compare-table td.hl, .compare-table th.hl{background:rgba(184,130,62,0.12);}
  .compare-table tbody tr:last-child td{border-bottom:none;}

  /* ---------- CONDITIONS ---------- */
  .cond-strip{
    display:grid;grid-template-columns:repeat(4,1fr);
    border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);
  }
  @media (max-width:860px){.cond-strip{grid-template-columns:repeat(2,1fr);}}
  .cond-item{padding:26px 22px;border-right:1px solid var(--line);}
  .cond-item:last-child{border-right:none;}
  .cond-item .n{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:22px;color:var(--wood-dark);display:block;margin-bottom:8px;}
  .cond-item p{margin:0;font-size:13.5px;color:var(--ink-soft);}

  .dealer-banner{
    margin-top:44px;background:var(--ink);color:var(--bg);padding:36px 40px;
    display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  }
  .dealer-banner h3{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:26px;margin:0 0 6px;text-transform:uppercase;}
  .dealer-banner p{margin:0;color:var(--steel-light);font-size:14px;max-width:44ch;}

  /* ---------- FORM ---------- */
  .form-section{background:var(--panel-dark);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .form-shell{
    display:grid;grid-template-columns:0.9fr 1.1fr;background:var(--panel);border:1px solid var(--line-dark);
  }
  @media (max-width:860px){.form-shell{grid-template-columns:1fr;}}
  .form-side{background:var(--steel);color:#fff;padding:40px;}
  .form-side h3{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:28px;margin:0 0 16px;text-transform:uppercase;}
  .form-side p{color:#CFD7DA;font-size:14.5px;margin:0 0 24px;}
  .form-side ul{list-style:none;padding:0;margin:0;font-size:13.5px;color:#CFD7DA;}
  .form-side li{padding:9px 0;border-top:1px solid rgba(255,255,255,0.15);}
  .form-side li:first-child{border-top:none;}

  .lead-form{padding:40px;}
  .lead-form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
  @media (max-width:520px){.lead-form .row{grid-template-columns:1fr;}}
  .lead-form label{display:block;font-family:'IBM Plex Mono',monospace;font-size:11.5px;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);margin-bottom:7px;}
  .lead-form input, .lead-form textarea{
    width:100%;padding:12px 13px;border:1.5px solid var(--ink);border-radius:var(--radius);
    font-family:'Inter',sans-serif;font-size:14.5px;background:#fff;color:var(--ink);
  }
  .lead-form textarea{resize:vertical;min-height:70px;}
  .checkbox-label{
    display:flex !important;align-items:center;gap:8px;margin-top:9px;
    font-family:'Inter',sans-serif !important;font-size:13.5px !important;
    text-transform:none !important;letter-spacing:normal !important;
    color:var(--ink) !important;cursor:pointer;user-select:none;
  }
  .checkbox-label input[type="checkbox"]{
    width:16px;height:16px;margin:0;accent-color:var(--wood);cursor:pointer;flex-shrink:0;
  }
  .lead-form input#f-city:disabled{
    background:var(--panel-dark);color:var(--ink-soft);text-decoration:line-through;
  }
  .lead-summary{
    background:var(--bg);border:1px dashed var(--wood-dark);padding:12px 14px;
    margin-bottom:18px;display:none;
  }
  .lead-summary.show{display:block;}
  .lead-summary-text{
    font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--wood-dark);
    white-space:pre-line;
  }
  .lead-summary-actions{
    display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:12px;
    border-top:1px dashed var(--line);
  }
  .lead-summary-actions .btn-small{padding:8px 14px;font-size:12px;}
  .submit-row{display:flex;align-items:center;gap:16px;margin-top:6px;flex-wrap:wrap;}
  .form-note{font-size:12px;color:var(--ink-soft);}
  .form-success{
    display:none;background:var(--green);color:#fff;padding:16px 18px;font-size:14px;margin-top:14px;border-radius:var(--radius);
  }
  .form-success.show{display:block;}
  .form-error{
    display:none;background:var(--safety-dark);color:#fff;padding:16px 18px;font-size:14px;margin-top:14px;border-radius:var(--radius);
  }
  .form-error.show{display:block;}

  /* ---------- FAQ ---------- */
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-item summary{
    padding:20px 0;font-weight:600;font-size:16px;cursor:pointer;list-style:none;
    display:flex;justify-content:space-between;align-items:center;gap:20px;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{
    content:"+";font-family:'IBM Plex Mono',monospace;font-size:20px;color:var(--wood-dark);flex-shrink:0;
  }
  .faq-item[open] summary::after{content:"–";}
  .faq-item p{margin:0 0 22px;color:var(--ink-soft);font-size:14.5px;max-width:65ch;}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink);color:var(--steel-light);padding:48px 0 28px;font-size:13.5px;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px;margin-bottom:36px;}
  @media (max-width:760px){.footer-grid{grid-template-columns:1fr;}}
  .footer-grid h5{
    font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.06em;text-transform:uppercase;
    color:#8A9298;margin:0 0 14px;
  }
  .footer-grid p, .footer-grid a{display:block;color:#B7BEC2;text-decoration:none;margin-bottom:8px;}
  .footer-bottom{border-top:1px solid #37414A;padding-top:20px;color:#788087;font-size:12px;}

  body{padding-bottom:0;}

  /* ============================================================
     НАВИГАЦИЯ САЙТА (десктоп + мобильная) — добавлено при переходе
     с одностраничного лендинга на многостраничный сайт
     ============================================================ */
  .site-header .wrap{gap:18px;}
  .main-nav{display:flex;align-items:center;gap:2px;}
  .main-nav, .main-nav li{list-style:none;margin:0;padding:0;}
  .main-nav > li{position:relative;}
  .main-nav{display:flex;}
  .main-nav > li > a{
    display:block;padding:10px 13px;font-size:13.5px;font-weight:500;
    text-decoration:none;color:var(--bg);white-space:nowrap;
  }
  .main-nav > li > a:hover, .main-nav > li.active > a{color:var(--wood);}
  .main-nav .has-drop > a::after{content:" ▾";font-size:10px;opacity:0.7;}
  .main-nav .drop{
    display:none;position:absolute;top:100%;left:0;min-width:230px;
    background:var(--ink);border:1px solid var(--line-dark);border-top:2px solid var(--wood);
    padding:6px;z-index:80;
  }
  .main-nav .has-drop:hover .drop{display:block;}
  .main-nav .drop a{
    display:block;padding:9px 12px;font-size:13px;color:var(--bg);text-decoration:none;border-radius:2px;
  }
  .main-nav .drop a:hover{background:rgba(184,130,62,0.18);color:var(--wood);}

  .nav-toggle{
    display:none;background:transparent;border:1.5px solid var(--bg);color:var(--bg);
    width:40px;height:36px;border-radius:2px;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  }
  .nav-toggle span{display:block;width:18px;height:2px;background:var(--bg);}

  /* ---- Телефоны в шапке (только мобильная версия) ---- */
  .header-phones{display:none;}

  @media (max-width:980px){
    .site-header .wrap{
      display:grid;
      grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
      align-items:stretch;
      column-gap:10px;row-gap:6px;
      padding-top:10px;padding-bottom:10px;
    }
    .main-nav{
      display:none;position:fixed;top:var(--header-h,64px);left:0;right:0;bottom:0;
      background:var(--ink);flex-direction:column;align-items:stretch;
      overflow-y:auto;padding:8px 0 100px;border-top:1px solid var(--line-dark);z-index:70;
    }
    .main-nav.open{display:flex;}
    .main-nav > li > a{padding:15px 24px;font-size:15.5px;border-bottom:1px solid rgba(255,255,255,0.08);}
    .main-nav .drop{
      display:block;position:static;border:none;padding:0 0 0 14px;background:transparent;min-width:0;
    }
    .main-nav .has-drop > a::after{float:right;}
    /* <nav> — пустая обёртка (сам список меню position:fixed или display:none),
       убираем её из сетки, чтобы не занимала лишнюю ячейку и не сдвигала
       кнопку и телефоны на вторую строку. */
    nav{display:contents;}
    /* Сетка из 3 колонок: лого — слева, кнопка меню — строго по центру
       шапки, телефоны — справа. Все три блока растянуты (align-items:stretch)
       на одинаковую высоту, равную высоте блока логотипа. */
    .brand{grid-column:1;grid-row:1;justify-self:start;min-width:0;}
    .brand-mark{width:56px;height:56px;font-size:16px;}
    .nav-toggle{
      display:flex;grid-column:2;grid-row:1;justify-self:center;margin:0;
      height:auto;width:40px;
    }
    .header-cta{display:none;}
    .header-phones{
      grid-column:3;grid-row:1;justify-self:end;
      display:flex;flex-direction:column;justify-content:space-between;
      align-items:flex-end;min-width:0;
    }
    .header-phones a{
      color:var(--bg);text-decoration:none;font-family:'IBM Plex Mono',monospace;
      font-size:14px;font-weight:600;white-space:nowrap;line-height:1.1;
    }
    .header-phones a:hover{color:var(--wood);}
  }
  @media (max-width:400px){
    .brand-mark{width:38px;height:38px;font-size:12px;}
    .brand-name{font-size:13px;}
    .brand-sub{font-size:8.5px;letter-spacing:0.01em;}
    .header-phones a{font-size:10.5px;}
    .nav-toggle{width:34px;}
    .site-header .wrap{column-gap:4px;}
  }
  @media (min-width:981px){
    .mobile-cta{display:none;}
  }

  /* ---- Только на главной странице (index.html), только десктоп:
     скрыть «Главная» и заменить «Вопросы» на телефон в меню ---- */
  .nav-item-faq-phone{display:none;}
  @media (min-width:981px){
    .page-home .nav-item-home{display:none;}
    .page-home .nav-item-faq{display:none;}
    .page-home .nav-item-faq-phone{display:block;}
  }

  /* ============================================================
     ВНУТРЕННИЕ СТРАНИЦЫ (категории ОСП, статьи, сервисные страницы)
     ============================================================ */
  .breadcrumbs{font-size:12.5px;color:var(--ink-soft);padding:16px 0;font-family:'IBM Plex Mono',monospace;}
  .breadcrumbs a{color:var(--ink-soft);text-decoration:none;border-bottom:1px dotted var(--line-dark);}
  .breadcrumbs a:hover{color:var(--wood-dark);}
  .breadcrumbs .sep{margin:0 6px;opacity:0.5;}

  .page-hero{padding:20px 0 44px;border-bottom:1px solid var(--line);}
  .page-hero .kicker{margin-bottom:14px;}
  .page-hero h1{font-size:clamp(30px,4.4vw,46px);line-height:1.05;margin:0 0 16px;max-width:22ch;}
  .page-hero .lead{font-size:17px;color:var(--ink-soft);max-width:64ch;margin:0;}

  .content-page{max-width:840px;}
  .content-page h2{font-size:clamp(22px,2.8vw,30px);margin:44px 0 14px;}
  .content-page h2:first-child{margin-top:0;}
  .content-page h3{font-size:19px;margin:26px 0 10px;color:var(--steel);}
  .content-page p{font-size:15.5px;color:var(--ink-soft);margin:0 0 16px;max-width:70ch;text-align:justify;text-align-last:left;}
  .content-page ul, .content-page ol{color:var(--ink-soft);font-size:15.5px;max-width:68ch;padding-left:22px;}
  .content-page li{margin-bottom:8px;}
  .content-page a.inline-link{color:var(--wood-dark);font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--wood);}
  .section-head a.inline-link{color:var(--wood-dark);font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--wood);}
  .content-page a.inline-link:hover{color:var(--safety);border-color:var(--safety);}

  /* ---- Фото товара на странице толщины: видно и на мобильном, и на десктопе ---- */
  .product-photo{margin:0 0 32px;}
  .product-photo img{
    width:100%;height:auto;max-height:440px;object-fit:cover;
    border:1.5px solid #32CD32;border-radius:var(--radius);display:block;
  }
  .product-photo figcaption{
    margin-top:8px;font-size:11.5px;color:var(--ink-soft);
    font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:0.03em;
  }

  .spec-table{width:100%;border-collapse:collapse;font-size:14.5px;background:var(--panel);margin:18px 0 32px;}
  .spec-table th, .spec-table td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left;}
  .spec-table thead th{font-family:'IBM Plex Mono',monospace;font-size:11.5px;text-transform:uppercase;letter-spacing:0.04em;color:var(--ink-soft);border-bottom:2px solid var(--ink);}
  .table-scroll{overflow-x:auto;margin:18px 0 8px;-webkit-overflow-scrolling:touch;}
  .table-scroll .spec-table{margin:0;min-width:760px;}
  .table-scroll .spec-table th:first-child,
  .table-scroll .spec-table td:first-child{position:sticky;left:0;background:var(--panel);}
  .table-note{font-size:12.5px;color:var(--ink-soft);margin:0 0 32px;}
  .spec-table-framed{border:1.5px solid var(--ink);}
  .spec-table-framed th, .spec-table-framed td{border:1px solid var(--line-dark);}
  .spec-table-framed thead th{border-bottom:1.5px solid var(--ink);}

  .mini-cta{
    background:var(--steel);color:#fff;padding:30px 32px;margin:36px 0;display:flex;
    justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  }
  .mini-cta p{color:#D8DEE1;margin:0;font-size:14.5px;max-width:46ch;}
  .mini-cta h3{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:22px;margin:0 0 6px;text-transform:uppercase;}

  .related-pages{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:16px 0 40px;}
  @media (max-width:760px){.related-pages{grid-template-columns:1fr 1fr;}}
  @media (max-width:520px){.related-pages{grid-template-columns:1fr;}}
  .related-pages a{
    display:block;background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--wood);
    padding:16px 16px;text-decoration:none;color:var(--ink);font-size:13.5px;font-weight:600;
  }
  .related-pages a:hover{border-top-color:var(--safety);}
  .related-pages a span{display:block;font-weight:400;color:var(--ink-soft);font-size:12px;margin-top:4px;}

  .case-links{font-size:13.5px;color:var(--ink-soft);border-top:1px dashed var(--line);margin-top:40px;padding-top:20px;}
  .case-links a{color:var(--wood-dark);text-decoration:none;border-bottom:1px dotted var(--wood-dark);}

  /* ============================================================
     HERO PHOTO — фото-зона рядом с h1, только десктоп
     ============================================================ */
  .hero-grid{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:clamp(24px,4vw,64px);
    align-items:center;
  }
  .hero-photo{
    position:relative;
    width:100%;
    /* адаптивная высота: масштабируется от ширины колонки, но в разумных границах
       на узких/широких десктопных экранах (1024px–1920px+) */
    aspect-ratio:4/5;
    max-height:clamp(360px,38vw,560px);
    background:var(--panel-dark);
    border:1.5px solid #32CD32;
    border-radius:var(--radius);
    overflow:hidden;
    cursor:pointer;
    display:flex;align-items:center;justify-content:center;
  }
  .hero-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  .hero-photo-placeholder{
    text-align:center;font-size:12.5px;color:var(--ink-soft);
    font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:0.04em;
    padding:0 24px;line-height:1.6;
  }
  .hero-photo-placeholder .plus{font-size:26px;display:block;margin-bottom:8px;color:var(--wood-dark);}
  .hero-photo.has-photo .hero-photo-placeholder{display:none;}
  .hero-photo-spec{display:block;margin-top:6px;font-size:10.5px;text-transform:none;letter-spacing:0;opacity:0.8;}
  .hero-photo input[type=file]{display:none;}
  .hero-photo-remove{
    position:absolute;top:10px;right:10px;width:28px;height:28px;
    background:rgba(32,29,24,0.75);color:#fff;border:none;border-radius:50%;
    font-size:15px;line-height:1;display:none;align-items:center;justify-content:center;z-index:2;
  }
  .hero-photo.has-photo .hero-photo-remove{display:flex;}

  /* ---- Лупа увеличения hero-фото: только десктоп, только если фото загружено ---- */
  .hero-photo-zoom{
    position:absolute;bottom:12px;right:12px;width:32px;height:32px;
    background:rgba(32,29,24,0.75);color:#fff;border:none;border-radius:50%;
    display:none;align-items:center;justify-content:center;cursor:zoom-in;z-index:2;
    transition:background .15s;
  }
  .hero-photo-zoom:hover{background:rgba(32,29,24,0.92);}

  /* Лупа появляется, только если фото уже загружено — и только на десктопе
     (совпадает с брейкпоинтом hero-photo и требованием «десктопная версия») */
  @media (min-width:901px){
    .hero-photo.has-photo .hero-photo-zoom,
    .p-image.has-photo .p-image-zoom{display:flex;}
  }

  /* ---- Лайтбокс: полноэкранный просмотр увеличенного фото ---- */
  .lightbox-overlay{
    position:fixed;inset:0;background:rgba(20,18,15,0.94);
    display:none;align-items:center;justify-content:center;
    z-index:1000;padding:48px;cursor:zoom-out;
  }
  .lightbox-overlay.show{display:flex;}
  .lightbox-overlay img{
    max-width:90vw;max-height:88vh;width:auto;height:auto;
    object-fit:contain;border-radius:6px;
    box-shadow:0 24px 64px rgba(0,0,0,0.55);
    cursor:default;
  }
  .lightbox-close{
    position:absolute;top:26px;right:26px;width:44px;height:44px;
    background:rgba(255,255,255,0.1);color:#fff;border:1.5px solid rgba(255,255,255,0.3);
    border-radius:50%;font-size:22px;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:background .15s;
  }
  .lightbox-close:hover{background:rgba(255,255,255,0.2);}
  body.lightbox-open{overflow:hidden;}

  /* < 900px — мобильная и планшетная версия: фото-зона полностью убирается,
     hero становится одноколоночным (только текстовый блок) */
  @media (max-width:900px){
    .hero-grid{display:block;}
    .hero-photo{display:none;}
  }

  /* ---- Публичная замена фото отключена везде (десктоп и мобильная версия) ----
     Клик по фото больше не открывает выбор файла (см. JS-проверку в catalog.js/
     hero-photo.js), крестик-удаление скрыт полностью. Доступно только
     увеличение через лупу. */
  .hero-photo,
  .p-image{cursor:default;}
  .hero-photo-remove,
  .p-image-remove{display:none !important;}
