/* ============================================================
     OT MAZATA — BRAND DESIGN SYSTEM
     Единен визуален език, изведен от етикетите на марката.
     Всички цветове, рамки, сенки и фонове се дефинират тук.
     ============================================================ */
  :root{
    /* --- хартия --- */
    --paper:#F3E8CF;          /* основна кремава хартия */
    --paper-2:#E5D4B2;        /* вторично кремаво */
    --paper-3:#F7F0DE;        /* най-светло, за етикетни полета */

    /* --- акцентни цветове от етикетите --- */
    --bordo:#713E3E;          /* основно бордо (рамки, заглавия) */
    --bordo-deep:#5E2C2C;     /* дълбоко бордо, за контури */
    --brick:#A9432F;          /* керемидено червено */
    --copper:#B7793E;         /* меден акцент */
    --copper-ink:#875226;     /* тъмно медно, за дребен текст */
    --gold:#C39132;           /* приглушено златно */

    /* --- тъмна страна --- */
    --maza:#263229;           /* тъмна „маза“ */
    --green-deep:#3F5945;     /* дълбоко зелено */

    /* --- текст --- */
    --ink:#322C24;            /* основен тъмен текст */
    --ink-soft:#5F5748;       /* приглушен тъмен текст */
    --light:#F7EFD9;          /* светъл текст */
    --light-soft:rgba(247,239,217,.84);

    /* --- гравюри --- */
    --engrave:#8A6D4F;        /* сепия линия на гравюрите */
    --engrave-soft:#A98F72;

    /* --- линии и рамки (етикетен език) --- */
    --rule-bordo:rgba(113,62,62,.55);
    --rule-copper:rgba(183,121,62,.45);
    --rule-light:rgba(247,239,217,.18);
    --frame-outer:1.5px solid var(--bordo);
    --frame-inner:1px solid var(--rule-copper);
    --radius-label:4px;

    /* --- сенки --- */
    --shadow-card:0 6px 18px rgba(50,44,36,.15);
    --shadow-card-hover:0 12px 26px rgba(50,44,36,.22);
    --shadow-soft:0 3px 10px rgba(50,44,36,.14);
    --shadow-modal:0 24px 60px rgba(20,16,12,.45);

    /* --- фонове (хартиена текстура + петна) --- */
    --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23p)' opacity='0.05'/%3E%3C/svg%3E");
    --ornament:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='12' viewBox='0 0 140 12'%3E%3Cg stroke='%23B7793E' stroke-width='1' fill='none'%3E%3Cline x1='2' y1='6' x2='52' y2='6'/%3E%3Cline x1='88' y1='6' x2='138' y2='6'/%3E%3C/g%3E%3Cg fill='%23713E3E'%3E%3Cpath d='M70 0.5 L74.5 6 L70 11.5 L65.5 6 Z'/%3E%3Cpath d='M59 3.5 L61.8 6 L59 8.5 L56.2 6 Z'/%3E%3Cpath d='M81 3.5 L83.8 6 L81 8.5 L78.2 6 Z'/%3E%3C/g%3E%3Cg fill='%23B7793E'%3E%3Ccircle cx='49' cy='6' r='1.4'/%3E%3Ccircle cx='91' cy='6' r='1.4'/%3E%3C/g%3E%3C/svg%3E");
    --ornament-light:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='12' viewBox='0 0 140 12'%3E%3Cg stroke='%23C39132' stroke-width='1' fill='none'%3E%3Cline x1='2' y1='6' x2='52' y2='6'/%3E%3Cline x1='88' y1='6' x2='138' y2='6'/%3E%3C/g%3E%3Cg fill='%23C39132'%3E%3Cpath d='M70 0.5 L74.5 6 L70 11.5 L65.5 6 Z'/%3E%3Cpath d='M59 3.5 L61.8 6 L59 8.5 L56.2 6 Z'/%3E%3Cpath d='M81 3.5 L83.8 6 L81 8.5 L78.2 6 Z'/%3E%3C/g%3E%3C/svg%3E");
    --sprig:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%23F7EFD9' stroke-width='2'%3E%3Cpath d='M100 190 C100 140 96 100 80 60'/%3E%3Cpath d='M92 150 C70 145 56 130 50 110 C74 112 90 126 92 150 Z'/%3E%3Cpath d='M96 118 C118 112 134 96 138 76 C114 80 98 94 96 118 Z'/%3E%3Cpath d='M88 92 C68 86 56 70 54 50 C76 56 88 70 88 92 Z'/%3E%3Ccircle cx='80' cy='52' r='7'/%3E%3Ccircle cx='96' cy='38' r='6'/%3E%3C/g%3E%3C/svg%3E");
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    color:var(--ink);
    font-family:'PT Sans', sans-serif;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    background-color:var(--paper);
    background-image:
      var(--grain),
      radial-gradient(ellipse 50% 40% at 12% 8%, rgba(183,121,62,.07), transparent 70%),
      radial-gradient(ellipse 45% 35% at 88% 30%, rgba(113,62,62,.05), transparent 70%),
      radial-gradient(ellipse 60% 40% at 50% 92%, rgba(183,121,62,.05), transparent 70%),
      linear-gradient(172deg, #F5EAD2 0%, #F1E4C8 45%, #E9DCBE 100%);
    background-attachment:fixed, fixed, fixed, fixed, fixed;
  }
  h1,h2,h3,.display{
    font-family:'PT Serif', serif;
    margin:0;
    font-weight:700;
  }
  .accent-script{
    font-family:'Caveat', cursive;
    font-weight:700;
  }
  a{color:inherit;}
  img,svg{display:block;max-width:100%;}
  .wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

  /* ---------- Header ---------- */
  header{
    position:sticky;top:0;z-index:40;
    background:rgba(243,232,207,0.94);
    backdrop-filter:blur(8px);
    border-bottom:1.5px solid var(--rule-bordo);
    box-shadow:0 2px 0 rgba(183,121,62,.28), var(--shadow-soft);
  }
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 24px;max-width:1120px;margin:0 auto;
  }
  .brand{
    display:flex;align-items:center;gap:11px;
    font-size:22px;color:var(--bordo);
  }
  .brand-mark{
    width:36px;height:36px;flex-shrink:0;
  }
  .nav-links{display:flex;gap:28px;font-size:14.5px;list-style:none;padding:0;margin:0;}
  .nav-links a{
    text-decoration:none;color:var(--ink-soft);
    border-bottom:1px solid transparent;padding-bottom:3px;transition:.15s;
    letter-spacing:.02em;
  }
  .nav-links a:hover, .nav-links a:focus-visible{color:var(--bordo);border-color:var(--copper);}
  .nav-cta{
    background:var(--bordo);color:var(--light);
    border:1px solid var(--bordo-deep);border-radius:var(--radius-label);
    padding:9px 18px;font-family:'PT Sans';font-weight:700;font-size:13.5px;cursor:pointer;
    letter-spacing:.03em;box-shadow:var(--shadow-soft);transition:background .15s;
  }
  .nav-cta:hover{background:var(--bordo-deep);}
  .menu-toggle{
    display:none;background:none;border:1px solid var(--rule-bordo);color:var(--bordo);
    border-radius:var(--radius-label);padding:7px 10px;font-size:19px;cursor:pointer;
  }

  /* ---------- Hero ---------- */
  .hero{
    padding:76px 24px 64px;
    position:relative;
    overflow:hidden;
    color:var(--light);
    background-color:#2A3529;
    background-image:
      var(--grain),
      radial-gradient(ellipse 45% 50% at 72% 34%, rgba(183,121,62,.20), transparent 70%),
      radial-gradient(ellipse 40% 45% at 20% 80%, rgba(113,62,62,.20), transparent 70%),
      linear-gradient(150deg, #34412F 0%, #2A3529 42%, #241F1A 100%);
    border-bottom:1.5px solid var(--copper);
  }
  /* фини гравирани линии от печатния етикет */
  .hero::before{
    content:"";position:absolute;left:24px;right:24px;top:16px;bottom:16px;
    border:1px solid rgba(183,121,62,.20);
    border-radius:3px;pointer-events:none;
  }
  .hero::after{
    content:"";position:absolute;left:30px;right:30px;top:22px;bottom:22px;
    border:1px solid rgba(247,239,217,.07);
    border-radius:2px;pointer-events:none;
  }
  .hero-decor{
    position:absolute;inset:0;pointer-events:none;z-index:0;
    color:var(--light);opacity:.055;
  }
  .hero-grid{
    max-width:1120px;margin:0 auto;position:relative;z-index:1;
    display:grid;grid-template-columns:1.1fr 0.9fr;gap:48px;align-items:center;
  }
  .eyebrow{
    font-family:'Caveat';font-size:23px;color:var(--gold);
    display:inline-block;margin-bottom:6px;
  }
  .hero h1{
    font-size:clamp(33px,5vw,52px);
    line-height:1.1;
    color:var(--light);
    letter-spacing:.01em;
  }
  .hero p{
    font-size:16.5px;color:var(--light-soft);max-width:46ch;margin-top:18px;line-height:1.7;
  }
  .hero-actions{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap;}

  /* ---------- Бутони в печатен стил ---------- */
  .btn-primary{
    background:var(--copper);color:#1E150C;
    border:1px solid #8E5A2A;border-radius:var(--radius-label);
    padding:12px 24px;font-weight:700;font-size:14.5px;cursor:pointer;
    text-decoration:none;display:inline-block;letter-spacing:.03em;
    box-shadow:var(--shadow-soft);transition:background .15s;
  }
  .btn-primary:hover{background:#C2874A;}
  .btn-ghost{
    border:1px solid rgba(195,145,50,.6);color:var(--light);
    border-radius:var(--radius-label);background:rgba(247,239,217,.04);
    padding:12px 24px;font-weight:700;font-size:14.5px;text-decoration:none;display:inline-block;
    letter-spacing:.03em;transition:background .15s, border-color .15s;
  }
  .btn-ghost:hover{border-color:var(--gold);background:rgba(247,239,217,.09);}

  .hero-jars{position:relative;height:340px;}
  .float-jar{filter:drop-shadow(0 14px 20px rgba(0,0,0,.4));}

  /* ---------- Section headers ---------- */
  .section{padding:64px 24px;}
  .section-head{max-width:640px;margin:0 auto 42px;text-align:center;}
  .section-head .eyebrow{display:block;color:var(--copper);}
  .section-head h2{
    font-size:clamp(26px,3.4vw,36px);color:var(--bordo);margin-top:4px;
    letter-spacing:.02em;
  }
  .section-head h2::after{
    content:"";display:block;width:140px;height:12px;margin:14px auto 0;
    background:var(--ornament) center/contain no-repeat;
  }
  .section-head p{color:var(--ink-soft);margin-top:12px;font-size:15.5px;}

  /* ---------- About / Story ---------- */
  .about{
    position:relative;
    padding-top:80px;padding-bottom:80px;
    color:var(--light);
    background-color:#2C3428;
    background-image:
      var(--grain),
      radial-gradient(ellipse 55% 50% at 50% 40%, rgba(183,121,62,.16), transparent 72%),
      radial-gradient(ellipse 40% 40% at 85% 85%, rgba(113,62,62,.16), transparent 72%),
      linear-gradient(165deg, #37402C 0%, #2C3428 50%, #262019 100%);
    border-top:1.5px solid var(--copper);
    border-bottom:1.5px solid var(--copper);
  }
  /* дискретни гравирани растения в ъглите */
  .about::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background-image:var(--sprig), var(--sprig);
    background-repeat:no-repeat, no-repeat;
    background-position:left -30px top 40px, right -30px bottom 40px;
    background-size:190px auto, 190px auto;
    opacity:.05;
  }
  .about > .wrap{position:relative;z-index:1;}

  .brand-slogan{text-align:center;max-width:840px;margin:0 auto 42px;}
  .slogan-mark{
    display:block;color:var(--gold);font-size:clamp(29px,4.8vw,46px);line-height:1.2;margin:0;
  }
  .brand-slogan::after{
    content:"";display:block;width:140px;height:12px;margin:18px auto 0;
    background:var(--ornament-light) center/contain no-repeat;
    opacity:.75;
  }

  .about-photo-wide{
    max-width:1000px;margin:0 auto 56px;overflow:hidden;
    border:1.5px solid var(--copper);
    border-radius:var(--radius-label);
    background:linear-gradient(140deg,#3B4634,#272E25);
    color:rgba(247,239,217,.62)!important;
    box-shadow:inset 0 0 0 1px rgba(113,62,62,.5), inset 0 0 70px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.3);
    position:relative;
  }
  .about-photo-wide::before{
    content:"";position:absolute;inset:7px;
    border:1px solid rgba(247,239,217,.16);border-radius:2px;pointer-events:none;
  }
  .about-photo-wide img{
    width:100%;height:auto;display:block;
  }

  .story{max-width:720px;margin:0 auto;}
  .story-title{
    text-align:center;font-size:clamp(26px,3.4vw,36px);color:var(--light);margin:6px 0 10px;
    letter-spacing:.02em;
  }
  .story-title::after{
    content:"";display:block;width:140px;height:12px;margin:16px auto 24px;
    background:var(--ornament-light) center/contain no-repeat;opacity:.8;
  }
  .story p{
    color:var(--light-soft);font-size:16.5px;line-height:1.85;margin:0 0 20px;
  }
  .story p:first-of-type::first-letter{
    font-family:'PT Serif',serif;font-size:3.1em;line-height:.86;
    float:left;margin:6px 10px 0 0;color:var(--gold);
  }
  .story-closing{
    color:var(--gold)!important;font-family:'PT Serif',serif;font-style:italic;
    font-size:18.5px!important;text-align:center;margin-top:30px!important;
    padding-top:22px;border-top:1px solid rgba(195,145,50,.28);
  }
  .story-closing::first-letter{font-size:1em!important;float:none!important;margin:0!important;color:inherit!important;}

  /* ---------- Продуктови карти = дигитални етикети ---------- */
  .grid{
    max-width:1120px;margin:0 auto;
    display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:26px;
  }
  .jar-card{
    position:relative;
    color:var(--ink);
    border-radius:var(--radius-label);
    overflow:hidden;
    display:flex;flex-direction:column;
    background-color:var(--paper-3);
    background-image:
      var(--grain),
      linear-gradient(178deg, #F8F1DF 0%, #F1E5C9 100%);
    border:var(--frame-outer);
    box-shadow:var(--shadow-card);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  /* вътрешна медна линия — двойна етикетна рамка */
  .jar-card::after{
    content:"";position:absolute;inset:4px;
    border:var(--frame-inner);border-radius:2px;
    pointer-events:none;z-index:3;
  }
  .jar-card:hover{
    transform:translateY(-3px);
    box-shadow:var(--shadow-card-hover);
  }
  /* капачка — печатна лента в цвета на продукта */
  .jar-lid{
    height:30px;position:relative;z-index:1;
    box-shadow:inset 0 -1px 0 rgba(247,239,217,.35), inset 0 -3px 0 rgba(0,0,0,.10);
  }
  .jar-lid::after{
    content:"";position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);
    width:30px;height:12px;border-radius:0 0 6px 6px;
    background:inherit;
    box-shadow:0 2px 3px rgba(0,0,0,.18);
  }
  .jar-body{padding:22px 18px 18px;flex:1;display:flex;flex-direction:column;position:relative;z-index:2;}
  /* квадратна media зона — обща за реални снимки и SVG гравюри, за да не "скача" картата между двата вида */
  .jar-media{
    width:100%;aspect-ratio:1/1;margin-bottom:10px;
    border-radius:2px;overflow:hidden;
    background:var(--paper-3);
    display:flex;align-items:center;justify-content:center;
  }
  .jar-illustration{width:100%;height:100%;display:block;}
  .jar-photo{width:100%;height:100%;object-fit:cover;display:block;}
  .jar-name{
    font-family:'PT Serif',serif;font-size:19px;font-weight:700;line-height:1.22;
    color:var(--bordo);text-align:center;letter-spacing:.01em;
  }
  .jar-name::after{
    content:"";display:block;width:120px;height:11px;margin:9px auto 0;
    background:var(--ornament) center/contain no-repeat;
  }
  /* jar-info е винаги наличен, гъвкав spacer (дори без описание), за да остане бутонът в еднаква позиция между картите */
  .jar-info{flex:1;}
  .jar-desc{
    font-size:13px;color:var(--ink-soft);margin-top:8px;
    text-align:center;line-height:1.55;
  }
  .jar-meta{
    display:flex;justify-content:center;align-items:baseline;
    margin-top:14px;padding-top:11px;
    border-top:1px solid var(--rule-copper);
    font-size:12.5px;color:var(--copper-ink);
    letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  }
  .order-btn{
    margin-top:14px;width:100%;
    border:1px solid var(--bordo-deep);border-radius:var(--radius-label);
    padding:11px;background:var(--bordo);color:var(--light);
    font-family:'PT Sans';font-weight:700;font-size:14px;cursor:pointer;
    letter-spacing:.05em;box-shadow:var(--shadow-soft);
    transition:background .15s;
  }
  .order-btn:hover{background:var(--bordo-deep);}

  /* ---------- How it works ---------- */
  .how{
    background-color:rgba(229,212,178,.5);
    background-image:var(--grain), linear-gradient(180deg, rgba(229,212,178,.55) 0%, rgba(243,232,207,.4) 100%);
    border-top:1px solid var(--rule-copper);
    border-bottom:1px solid var(--rule-copper);
  }
  .steps{max-width:900px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
  .step{text-align:center;padding:0 12px;}
  .step-num{
    font-family:'PT Serif',serif;font-size:16px;color:var(--bordo);
    border:1px solid var(--copper);background:rgba(247,240,222,.7);
    width:38px;height:38px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;margin:0 auto 14px;
    box-shadow:var(--shadow-soft);
  }
  .step h3{color:var(--bordo);font-size:16.5px;font-family:'PT Serif',serif;font-weight:700;letter-spacing:.02em;}
  .step p{color:var(--ink-soft);font-size:14px;margin-top:8px;line-height:1.6;}

  /* ---------- Footer ---------- */
  footer{
    background-color:var(--maza);color:var(--light);
    background-image:var(--grain), linear-gradient(170deg,#2B3429 0%, #221D18 100%);
    border-top:1.5px solid var(--copper);
    padding:44px 24px 28px;
  }
  .footer-grid{max-width:1120px;margin:0 auto;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;}
  .footer-brand{font-family:'PT Serif',serif;font-size:21px;color:var(--gold);letter-spacing:.03em;}
  .footer-note{color:var(--light-soft);font-size:13.5px;margin-top:8px;max-width:38ch;line-height:1.6;}
  .footer-contacts{display:flex;gap:12px;}
  .icon-btn{
    width:42px;height:42px;border-radius:50%;
    border:1px solid rgba(195,145,50,.5);color:var(--gold);
    display:flex;align-items:center;justify-content:center;text-decoration:none;
    font-family:'PT Serif',serif;font-size:15px;
  }
  .icon-btn:hover{border-color:var(--gold);}
  .fine{
    text-align:center;color:rgba(247,239,217,.55);font-size:12.5px;margin-top:32px;
    padding-top:18px;border-top:1px solid rgba(247,239,217,.12);
  }

  /* ---------- Order modal = кремав етикет ---------- */
  .overlay{
    position:fixed;inset:0;background:rgba(26,22,17,.68);display:none;align-items:center;justify-content:center;
    z-index:100;padding:20px;
  }
  .overlay.open{display:flex;}
  .modal{
    position:relative;
    color:var(--ink);border-radius:var(--radius-label);max-width:380px;width:100%;padding:28px 26px 26px;
    background-color:var(--paper-3);
    background-image:var(--grain), linear-gradient(178deg,#F8F1DF 0%, #F0E3C6 100%);
    border:var(--frame-outer);
    box-shadow:var(--shadow-modal);
    text-align:center;
  }
  .modal::after{
    content:"";position:absolute;inset:5px;
    border:var(--frame-inner);border-radius:2px;pointer-events:none;
  }
  .modal-close{
    position:absolute;top:10px;right:12px;background:none;border:none;
    font-size:22px;cursor:pointer;color:var(--copper);z-index:2;line-height:1;
  }
  .modal-close:hover{color:var(--bordo);}
  .modal .eyebrow{color:var(--copper);font-size:19px;margin-bottom:2px;}
  .modal h3{font-family:'PT Serif',serif;font-size:21px;margin-top:2px;color:var(--bordo);}
  .modal h3::after{
    content:"";display:block;width:130px;height:11px;margin:10px auto 0;
    background:var(--ornament) center/contain no-repeat;
  }
  .modal p{font-size:13px;color:var(--ink-soft);margin-top:8px;line-height:1.6;}
  .channels{display:flex;flex-direction:column;gap:10px;margin-top:20px;position:relative;z-index:2;}
  .channel-btn{
    display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);
    border:1px solid var(--rule-copper);border-radius:var(--radius-label);
    padding:11px 14px;font-weight:700;font-size:14.5px;
    background:rgba(255,255,255,.3);transition:background .15s, border-color .15s;
    text-align:left;
  }
  .channel-btn:hover{background:rgba(229,212,178,.65);border-color:var(--copper);}
  button.channel-btn{width:100%;font-family:'PT Sans';font-size:14.5px;cursor:pointer;}
  .channel-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}

  /* Viber: указание за копиране + резервно поле */
  .viber-note{
    margin-top:12px;font-size:12.5px;color:var(--copper-ink);line-height:1.5;
    background:rgba(183,121,62,.12);border:1px solid var(--rule-copper);
    border-radius:var(--radius-label);padding:9px 11px;
    position:relative;z-index:2;text-align:left;
  }
  .copy-fallback{
    display:block;margin-top:10px;font-size:12px;color:var(--ink-soft);
    text-align:left;position:relative;z-index:2;
  }
  .copy-fallback textarea{
    width:100%;margin-top:6px;resize:vertical;
    border:1px solid var(--rule-copper);border-radius:var(--radius-label);
    background:rgba(255,255,255,.5);color:var(--ink);
    font-family:'PT Sans';font-size:12.5px;line-height:1.5;padding:8px;
  }
  #viberOpenManual{margin-top:10px;width:100%;}
  #orderSentClear{margin-top:16px;width:100%;}

  /* ---------- Cart button (header) ---------- */
  .nav-actions{display:flex;align-items:center;gap:12px;}
  .cart-btn{
    display:flex;align-items:center;gap:7px;position:relative;
    background:none;border:1px solid var(--rule-bordo);color:var(--bordo);
    border-radius:var(--radius-label);padding:7px 12px;cursor:pointer;
    font-family:'PT Sans';font-weight:700;font-size:13.5px;letter-spacing:.03em;
    transition:background .15s,border-color .15s;
  }
  .cart-btn:hover{background:rgba(229,212,178,.5);border-color:var(--copper);}
  .cart-ico{width:19px;height:19px;flex-shrink:0;}
  .cart-badge{
    min-width:18px;height:18px;padding:0 5px;border-radius:9px;
    background:var(--bordo);color:var(--light);
    font-size:11.5px;font-weight:700;line-height:18px;text-align:center;
  }

  /* ---------- Quantity control (карти + количка) ---------- */
  .jar-order{margin-top:14px;display:flex;flex-direction:column;gap:10px;}
  .qty{
    display:flex;align-items:stretch;justify-content:center;
    border:1px solid var(--rule-copper);border-radius:var(--radius-label);
    overflow:hidden;background:rgba(255,255,255,.35);
  }
  .qty-btn{
    flex:0 0 auto;width:34px;padding:6px 0;border:none;background:transparent;
    color:var(--bordo);font-family:'PT Sans';font-size:18px;line-height:1;cursor:pointer;
    transition:background .15s;
  }
  .qty-btn:hover{background:rgba(183,121,62,.16);}
  .qty-input{
    flex:1 1 auto;min-width:0;width:44px;padding:6px 2px;text-align:center;
    border:none;border-left:1px solid var(--rule-copper);border-right:1px solid var(--rule-copper);
    background:transparent;color:var(--ink);
    font-family:'PT Sans';font-weight:700;font-size:14px;
  }
  .qty-btn:focus-visible,.qty-input:focus-visible{outline:2px solid var(--copper);outline-offset:-2px;}
  .add-btn{margin-top:0;letter-spacing:.03em;}

  /* ---------- Cart modal ---------- */
  .cart-modal{max-width:440px;}
  .cart-body{
    margin-top:16px;max-height:52vh;overflow-y:auto;padding-right:2px;
    display:flex;flex-direction:column;gap:10px;
    position:relative;z-index:2;text-align:left;
  }
  .cart-empty{text-align:center;color:var(--ink-soft);font-size:14px;padding:18px 0;}
  .cart-row{
    display:grid;grid-template-columns:1fr auto;gap:8px 10px;align-items:center;
    padding-bottom:10px;border-bottom:1px solid var(--rule-copper);
  }
  .cart-row:last-child{border-bottom:none;padding-bottom:0;}
  .cart-row-name{
    grid-column:1 / -1;font-family:'PT Serif',serif;font-weight:700;
    font-size:14.5px;color:var(--bordo);line-height:1.25;
  }
  .cart-row-qty{width:132px;}
  .cart-row-remove{
    justify-self:end;background:none;cursor:pointer;
    border:1px solid var(--rule-copper);border-radius:var(--radius-label);
    color:var(--copper-ink);font-family:'PT Sans';font-size:12px;font-weight:700;
    letter-spacing:.04em;padding:6px 10px;transition:background .15s,border-color .15s,color .15s;
  }
  .cart-row-remove:hover{background:rgba(169,67,47,.1);border-color:var(--brick);color:var(--brick);}
  .cart-actions{margin-top:18px;display:flex;flex-direction:column;gap:10px;position:relative;z-index:2;}
  .cart-actions .order-btn{margin-top:0;}
  .order-btn[disabled]{opacity:.5;cursor:not-allowed;}
  .cart-clear{
    background:none;cursor:pointer;
    border:1px solid var(--rule-bordo);border-radius:var(--radius-label);
    color:var(--bordo);font-family:'PT Sans';font-weight:700;font-size:13px;
    letter-spacing:.04em;padding:10px;transition:background .15s;
  }
  .cart-clear:hover{background:rgba(113,62,62,.08);}

  /* ---------- Toast ---------- */
  .cart-toast{
    position:fixed;left:50%;bottom:22px;z-index:120;
    transform:translateX(-50%) translateY(8px);
    max-width:calc(100vw - 32px);
    background:var(--paper-3);color:var(--ink);
    border:1.5px solid var(--bordo);border-radius:var(--radius-label);
    box-shadow:var(--shadow-modal);
    padding:10px 16px;font-size:13px;font-weight:700;letter-spacing:.02em;
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .2s,transform .2s,visibility .2s;
  }
  .cart-toast.is-visible{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}

  /* ---------- Responsive ---------- */
  @media (max-width:860px){
    .nav-links,.nav-cta{display:none;}
    .menu-toggle{display:block;}
    /* мобилно падащо меню: разгъва скритата навигация под хедъра */
    .nav-links.is-open{
      display:flex;flex-direction:column;gap:0;
      position:absolute;top:100%;left:0;right:0;
      margin:0;padding:4px 24px 14px;
      background:rgba(243,232,207,0.98);
      border-bottom:1.5px solid var(--rule-bordo);
      box-shadow:0 2px 0 rgba(183,121,62,.28), var(--shadow-soft);
    }
    .nav-links.is-open li{list-style:none;}
    .nav-links.is-open a{
      display:block;padding:12px 2px;
      border-bottom:1px solid var(--rule-copper);
    }
    .hero-grid{grid-template-columns:1fr;}
    .hero-jars{height:230px;order:-1;}
    .steps{grid-template-columns:1fr;gap:34px;}
    .story p{font-size:16px;}
    .hero::before{left:12px;right:12px;}
    .hero::after{left:18px;right:18px;}
    .about::before{background-size:130px auto, 130px auto;opacity:.04;}
  }
  @media (max-width:430px){
    .hero{padding:52px 18px 48px;}
    .section{padding:52px 18px;}
    .wrap{padding:0 18px;}
    .grid{grid-template-columns:1fr;gap:20px;}
    .hero h1{font-size:31px;}
    .hero p{font-size:15.5px;}
    .story p{font-size:15.5px;line-height:1.8;}
    .slogan-mark{font-size:27px;}
    .about{padding-top:56px;padding-bottom:56px;}
    .about::before{background-size:110px auto, 110px auto;opacity:.035;}
    .footer-grid{flex-direction:column;}
    /* компактна количка в хедъра: само икона + badge */
    .nav-actions{gap:8px;}
    .cart-btn{padding:7px 9px;gap:0;}
    .cart-label{display:none;}
    .cart-badge{margin-left:6px;}
    /* редовете в количката се подреждат вертикално на тесни екрани */
    .cart-row{grid-template-columns:1fr;}
    .cart-row-qty{width:100%;max-width:150px;}
    .cart-row-remove{justify-self:start;}
  }