/**, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
    html, body { width: 100%; background: #fff; font-family: 'Mulish', sans-serif; color: #2b2829; overflow-x: hidden; }
    img { display: block; max-width: 100%; }
*/
   

    /* ── HERO ── */
    .hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh;}
    .hero-img { overflow: hidden; background: #e8e6e4; min-height: 500px; }
    .hero-img img { width: 100%; height: 100%; object-fit: cover; }
    .hero-content {
      background: #f3f3f3;
      display: flex; flex-direction: column; justify-content: center;
      align-items: flex-start;
      padding: clamp(40px, 6vw, 100px) clamp(28px, 5vw, 98px);
    }
    .hero-title {
        font-family: "Cera Pro";
      font-weight: 500; font-size: clamp(26px, 3.2vw, 48px);
      line-height: 1.15; letter-spacing: 0.02em; text-transform: uppercase;
      color: #2b2829; margin-bottom: clamp(20px, 3vw, 32px);
    }
    .hero-desc { display: flex; flex-direction: column; gap: 16px; margin-bottom: clamp(28px, 4vw, 40px); }
    .hero-desc p { font-size: clamp(14px, 1.3vw, 18px); font-weight: 400; line-height: 1.45; letter-spacing: 0.03em; color: #2b2829; }
    .btn-dark {
      display: inline-flex; align-items: center; justify-content: space-between; gap: 12px;
      background: #2b2829; color: #fff; 
      padding: 0 20px; height: 50px; min-width: 200px; width: fit-content;
      font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 13px;
      letter-spacing: 0.06em; text-transform: uppercase;
      text-decoration: none; border: none; cursor: pointer; transition: background 0.2s;
    }
    .btn-dark:hover { background: #444; }
    .btn-dark svg { width: 18px; height: 18px; flex-shrink: 0; }

    @media (max-width: 900px) {
      .hero { grid-template-columns: 1fr; min-height: 1px; }
      .hero-img { min-height: 56vw; max-height: 420px; order: 2;}
      .hero-content { padding: 80px 24px; }
    }
    @media (max-width: 609px) {
        .hero {margin-top: -50px;}
        .hero-content { padding: 40px 24px; }
        .hero-desc {gap: 10px;}
    }

    /* ── FEATURES BAR ── */
    .features-bar { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid #e8e8e8; }
    .feat-item { display: flex; align-items: center; gap: 14px; padding: clamp(16px, 2vw, 28px) clamp(16px, 2vw, 28px); border-right: 1px solid #e8e8e8; }
    .feat-item:last-child { border-right: none; }
    .feat-icon { width: 44px; height: 44px; flex-shrink: 0; object-fit: contain; }
    .feat-label { font-size: clamp(12px, 1.1vw, 16px); font-weight: 400; letter-spacing: 0.04em; text-transform: uppercase; line-height: 1.3; color: #2b2829; }
    @media (max-width: 700px) {
      .features-bar { grid-template-columns: 1fr 1fr; }
      .feat-item:nth-child(2) { border-right: none; }
      .feat-item:nth-child(n+3) { border-top: 1px solid #e8e8e8; }
    }
    @media (max-width: 400px) {
      .features-bar { grid-template-columns: 1fr; }
      .feat-item { border-right: none; border-bottom: 1px solid #e8e8e8; }
    }

    /* ── LAYOUT HELPERS ── */
    .section { padding: clamp(48px, 7vw, 100px) clamp(16px, 4vw, 60px); }
    .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
    .section-title {font-family: "Cera Pro"; font-weight: 500; font-size: clamp(24px, 3vw, 48px); line-height: 1.05; text-transform: uppercase; color: #2b2829; letter-spacing: 0.02em; }
    .body-text { font-weight: 400; color: #2b2829; line-height: 1.5; letter-spacing: 0.02em; }

    @media (max-width: 768px) { .two-col { grid-template-columns: 1fr; } }

    /* ── О КОМПАНИИ ── */
    .about-img img { width: 100%; aspect-ratio: 2/1.3; object-fit: cover;  border-radius: 6px;}
    .about-points { margin-top: 32px; }
    .about-point { display: flex; align-items: center; gap: 12px; padding: 16px 0; border-bottom: 1px solid #e8e8e8; font-size: clamp(13px, 1.1vw, 16px); }
    .about-point:first-child { border-top: 1px solid #e8e8e8; }
    .point-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; background: #2b2829; }

    /* ── GALLERY ── */
    .gallery-wrap { padding: 0 clamp(16px, 4vw, 60px); }
    .gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 6px;}
    .about2-wrap { padding: clamp(32px, 5vw, 64px) clamp(16px, 4vw, 60px); }
    .about2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
    .about2-title {font-family: "Cera Pro"; font-size: clamp(20px, 2.2vw, 34px); line-height: 1.35; color: #2b2829; margin-bottom: 16px; }
    .about2-body { font-size: clamp(13px, 1.1vw, 16px); line-height: 1.7; color: #555; }
    .about2-img img { width: 100%;  object-fit: cover; border-radius: 6px }
    @media (max-width: 768px) {
      .gallery { grid-template-columns: 1fr 1fr; }
      .gallery img:last-child { display: none; }
      .about2 { grid-template-columns: 1fr; }
      .about2-img { display: none; }
    }

    /* ── ADVANTAGES ── */
    .adv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 52px) clamp(24px, 4vw, 56px); margin-top: clamp(32px, 4vw, 56px); }
    .adv-item { display: flex; gap: 14px; align-items: flex-start; }
    .adv-icon { width: 44px; height: 44px; flex-shrink: 0; margin-top: 2px; }
    .adv-title { font-size: clamp(14px, 1.2vw, 17px); font-weight: 600; color: #2b2829; margin-bottom: 8px; line-height: 1.3; }
    .adv-body { font-size: clamp(12px, 1vw, 14px); font-weight: 400; line-height: 1.65; color: #666; }
    @media (max-width: 768px) { .adv-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 480px) { .adv-grid { grid-template-columns: 1fr; } }

    /* ── RESULTS ── */
    .results-img img { width: 100%; height: 560px; object-fit: cover; object-position: center top;  display: block; border-radius: 6px }
    .results-label { font-size: 11px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: #aaa; margin-bottom: 28px; line-height: 1.5; }
    .results-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 28px; }
    .result-num { font-size: clamp(24px, 2.8vw, 42px); font-weight: 300; color: #2b2829; margin-bottom: 6px; }
    .result-desc { font-size: 13px; color: #999; line-height: 1.5; }
    .results-list { list-style: none; margin-bottom: 24px; }
    .results-list li { display: flex; gap: 8px; font-size: clamp(13px, 1vw, 15px); color: #333; padding: 5px 0; line-height: 1.5; }
    .results-list li::before { content: '•'; color: #2b2829; flex-shrink: 0; }
    .results-footnote { display: flex; gap: 8px; font-size: 11px; color: #bbb; line-height: 1.6; }
    .footnote-x { color: #d4a0a0; font-size: 15px; flex-shrink: 0; }
    @media (max-width: 768px) { .results-img { display: none; } }

    /* ── ISO ── */
    .iso-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 52px) clamp(24px, 4vw, 56px); margin-top: clamp(32px, 4vw, 56px); }
    
    .iso-item-title { display: flex; align-items: center; gap: 12px; font-size: clamp(14px, 1.1vw, 16px); font-weight: 600; color: #2b2829; margin-bottom: 10px; }
    .iso-body { font-size: clamp(12px, 1vw, 14px); color: #777; line-height: 1.65; padding-left: 46px; }
    @media (max-width: 768px) { .iso-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 480px) { .iso-grid { grid-template-columns: 1fr; } .iso-body { padding-left: 0; } }

    /* ── SAFETY ── */
    .safety-title { font-weight: 500; font-size: clamp(24px, 3vw, 48px); line-height: 1.05; text-transform: uppercase; color: #2b2829; margin-bottom: 16px; }
    .safety-desc { font-size: clamp(13px, 1.1vw, 16px); color: #555; line-height: 1.75; margin-bottom: clamp(28px, 4vw, 48px); }
    .safety-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 40px; }
    .safety-item-title { font-size: clamp(14px, 1.1vw, 16px); font-weight: 600; color: #2b2829; margin-bottom: 6px; }
    .safety-item-body { font-size: clamp(12px, 1vw, 14px); color: #777; line-height: 1.65; }
    .safety-img img { width: 100%;  object-fit: cover; border-radius: 6px }
    @media (max-width: 768px) { .safety-grid { grid-template-columns: 1fr; } }

    /* ── PRODUCTS ── */
    .products-outer { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
    .products-list { margin-top: 20px; }
    .product-item { padding: 16px 0; border-bottom: 1px solid #d8d8d8; cursor: default; }
    .product-item:first-child { border-top: 1px solid #d8d8d8; }
    .product-name { font-size: clamp(14px, 1.2vw, 17px); font-weight: 600; color: #2b2829; margin-bottom: 4px; }
    .product-desc { font-size: clamp(11px, 0.9vw, 13px); color: #999; line-height: 1.5; }
    .products-sticky { position: sticky; top: 80px; }
    .products-sticky img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px; }
    @media (max-width: 768px) { .products-outer { grid-template-columns: 1fr; } .products-sticky { display: none; } }

    /* ── PROCESS ── */
    .process-bg { background: #f9f8f7; }
    .process-intro { font-size: clamp(13px, 1.1vw, 16px); color: #555; line-height: 1.75; max-width: 680px; margin: 20px 0 clamp(32px, 4vw, 56px); }
    .steps-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px, 3vw, 40px); }
    .steps-grid-2 { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px, 3vw, 40px); margin-top: clamp(20px, 3vw, 40px); }
    .step-num { font-size: clamp(24px, 2.5vw, 34px); font-weight: 700; color: #c3c3c3; margin-bottom: 12px; line-height: 1; }
    .step-title { font-size: clamp(14px, 1.2vw, 18px); font-weight: 600; color: #2b2829; margin-bottom: 8px; }
    .step-body { font-size: clamp(12px, 1vw, 14px); color: #999; line-height: 1.6; }
    @media (max-width: 768px) { .steps-grid, .steps-grid-2 { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 400px) { .steps-grid, .steps-grid-2 { grid-template-columns: 1fr; } }

    /* ── CTA ── */
    .cta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
    .cta-title { font-weight: 300; font-size: clamp(24px, 2.8vw, 46px); line-height: 1.25; color: #2b2829; margin-bottom: 16px; }
    .cta-body { font-size: clamp(13px, 1.1vw, 16px); color: #555; line-height: 1.75; margin-bottom: 28px; }
    .cta-img img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: 6px; }
    @media (max-width: 768px) { .cta-grid { grid-template-columns: 1fr; } .cta-img { display: none; } }

    

    /* ── INGREDIENTS BLOCK ── */
    .ingr-section { padding-bottom: clamp(40px, 6vw, 80px); }
    .ingr-section .section-title { margin-bottom: clamp(40px, 5vw, 64px); }
    .medals-grid { border: none; 
      display: grid; grid-template-columns: repeat(6, 1fr);
      gap: clamp(16px, 3vw, 40px); align-items: center;
    }
    .medal { width: 85%; max-width: 140px; margin: 0 auto; display: block; border: none; outline: none; box-shadow: none; filter: contrast(1.1); }
    @media (max-width: 900px) { .medals-grid { border: none;  grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 480px) { .medals-grid { border: none;  grid-template-columns: repeat(2, 1fr); } }