/* ==========================================================================
   ГавKit — лендинг ласощів. Стилі (стикер-стиль, namespacing .gk-).
   Усі класи з префіксом gk- щоб не конфліктувати з основним styles.css.
   Для Django: підключайте через {% static 'css/gavkit.css' %}.
   ========================================================================== */

:root {
  --gk-ink:        #3A2516;   /* темно-коричневий: текст, обводки */
  --gk-ink-soft:   #5A4326;
  --gk-muted:      #7A6249;
  --gk-label:      #A8845A;
  --gk-cream:      #FFF8EC;   /* фон сторінки */
  --gk-cream-2:    #FFE9C2;
  --gk-yellow:     #FFC53D;   /* сонячний жовтий */
  --gk-yellow-dp:  #F7A823;
  --gk-orange:     #F26F1C;   /* акцент / CTA */
  --gk-sale:       #E23B2E;
  --gk-green:      #9DD17A;
  --gk-white:      #ffffff;
  --gk-dark:       #2B1B10;   /* футер */

  --gk-border:     2.5px solid var(--gk-ink);
  --gk-shadow:     5px 6px 0 var(--gk-ink);
  --gk-shadow-sm:  3px 4px 0 var(--gk-ink);
  --gk-radius:     24px;
  --gk-maxw:       1180px;

  --gk-font-display: 'Fredoka', 'Nunito', system-ui, sans-serif;
  --gk-font-body:    'Nunito', system-ui, sans-serif;
}

/* ----- base ----- */
.gk-root *{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body.gk-body{
  margin:0; background:var(--gk-cream); color:var(--gk-ink);
  font-family:var(--gk-font-body); font-weight:600;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.gk-root img{ display:block; max-width:100%; }
.gk-root h1,.gk-root h2,.gk-root h3,.gk-root p{ margin:0; }
.gk-root a{ color:inherit; }
.gk-root button{ font-family:inherit; }
.gk-wrap{ max-width:var(--gk-maxw); margin:0 auto; padding:0 22px; }
[hidden]{ display:none !important; }

/* ----- buttons ----- */
.gk-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:var(--gk-border); border-radius:999px; font-weight:800; cursor:pointer;
  text-decoration:none; line-height:1; transition:transform .08s ease, box-shadow .08s ease, background .12s ease;
}
.gk-btn--primary{ background:var(--gk-orange); color:#fff; box-shadow:var(--gk-shadow); padding:16px 30px; font-size:17px; }
.gk-btn--ghost{   background:#fff; color:var(--gk-ink); box-shadow:var(--gk-shadow); padding:16px 26px; font-size:17px; }
.gk-btn--primary:hover, .gk-btn--ghost:hover{ transform:translate(2px,3px); box-shadow:2px 2px 0 var(--gk-ink); }
.gk-btn--yellow{ background:var(--gk-yellow); color:var(--gk-ink); box-shadow:var(--gk-shadow-sm); padding:9px 15px; font-size:14px; }
.gk-btn--yellow:hover{ background:var(--gk-yellow-dp); transform:translate(1px,2px); box-shadow:1px 1px 0 var(--gk-ink); }
.gk-btn--sm{ padding:11px 17px; font-size:14.5px; box-shadow:var(--gk-shadow-sm); }
.gk-btn--sm:hover{ transform:translate(1px,2px); box-shadow:1px 1px 0 var(--gk-ink); }
.gk-btn--block{ width:100%; }

/* ----- eyebrow / headings ----- */
.gk-eyebrow{ color:var(--gk-orange); font-weight:800; font-size:14px; letter-spacing:1.5px; text-transform:uppercase; }
.gk-pill-eyebrow{
  display:inline-block; background:var(--gk-ink); color:var(--gk-yellow);
  font-weight:800; font-size:13px; letter-spacing:1.2px; text-transform:uppercase;
  padding:7px 15px; border-radius:999px; white-space:nowrap;
}
.gk-h2{ font-family:var(--gk-font-display); font-weight:700; font-size:42px; margin-top:8px; line-height:1.05; }
.gk-section{ padding:72px 0 8px; }
.gk-section--pad{ padding:78px 0; }
.gk-center{ text-align:center; }
.gk-head-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:30px; }
.gk-link-arrow{ font-weight:800; text-decoration:none; border-bottom:3px solid var(--gk-yellow-dp); padding-bottom:2px; }
.gk-link-arrow:hover{ color:var(--gk-orange); }

/* ----- announcement bar ----- */
.gk-announce{ background:var(--gk-ink); color:var(--gk-cream-2); font-weight:700; font-size:13.5px; }
.gk-announce .gk-wrap{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 20px; padding:9px 22px; }
.gk-announce span{ display:inline-flex; align-items:center; gap:7px; }
.gk-announce span::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--gk-yellow-dp); }

/* ----- header ----- */
.gk-header{ position:sticky; top:0; z-index:50; background:rgba(255,248,236,.92); backdrop-filter:blur(8px); border-bottom:var(--gk-border); }
.gk-header .gk-wrap{ display:flex; align-items:center; gap:18px; padding:11px 22px; }
.gk-brand{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.gk-brand img{ width:46px; height:46px; border-radius:50%; border:var(--gk-border); box-shadow:2px 3px 0 var(--gk-ink); object-fit:cover; }
.gk-brand b{ font-family:var(--gk-font-display); font-weight:700; font-size:25px; letter-spacing:.3px; }
.gk-nav{ margin-left:auto; display:flex; align-items:center; gap:26px; }
.gk-nav a{ text-decoration:none; font-weight:700; font-size:15.5px; }
.gk-nav a:hover{ color:var(--gk-orange); }
.gk-cart-btn{ position:relative; }
.gk-cart-btn .gk-cart-count{
  position:absolute; top:-9px; right:-9px; min-width:24px; height:24px; padding:0 6px;
  display:flex; align-items:center; justify-content:center; background:var(--gk-orange);
  color:#fff; border:var(--gk-border); border-radius:999px; font-size:12.5px; font-weight:900;
  animation:gk-pop .3s ease;
}
.gk-cart-ico{ width:18px; height:16px; border:2.5px solid var(--gk-ink); border-top:none; border-radius:0 0 6px 6px; position:relative; }
.gk-cart-ico::before{ content:""; position:absolute; top:-8px; left:1px; right:1px; height:8px; border:2.5px solid var(--gk-ink); border-bottom:none; border-radius:8px 8px 0 0; }

/* ----- hero ----- */
.gk-hero{ position:relative; border-bottom:3px solid var(--gk-ink); overflow:hidden; }
.gk-hero--a{ background:radial-gradient(120% 130% at 80% 0%, #FFD25A 0%, var(--gk-yellow) 45%, var(--gk-yellow-dp) 100%); }
.gk-hero--a .gk-wrap{ display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; padding:64px 22px 72px; }
.gk-hero h1{ font-family:var(--gk-font-display); font-weight:700; font-size:60px; line-height:1.02; margin-top:18px; text-wrap:balance; }
.gk-hero p{ font-size:19px; line-height:1.55; color:var(--gk-ink-soft); max-width:520px; margin-top:20px; }
.gk-hero-cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }
.gk-hero-tags{ display:flex; flex-wrap:wrap; gap:9px; margin-top:28px; }
.gk-hero-tags span{ background:rgba(255,255,255,.7); border:2px solid var(--gk-ink); border-radius:999px; padding:8px 15px; font-weight:800; font-size:13.5px; }
.gk-hero-art{ position:relative; display:flex; justify-content:center; align-items:center; min-height:380px; }
.gk-hero-art__ring{ position:absolute; width:330px; height:330px; border-radius:50%; background:var(--gk-cream); border:3px solid var(--gk-ink); box-shadow:8px 10px 0 var(--gk-ink); }
.gk-hero-art__logo{ position:relative; width:290px; height:290px; border-radius:50%; object-fit:cover; animation:gk-bob 5s ease-in-out infinite; }
.gk-float{ position:absolute; border:var(--gk-border); box-shadow:4px 5px 0 var(--gk-ink); display:flex; align-items:flex-end; justify-content:center; padding:6px; border-radius:24px; }
.gk-float small{ font-family:ui-monospace,Menlo,monospace; font-size:9px; font-weight:700; background:rgba(255,255,255,.78); border-radius:5px; padding:2px 5px; }
.gk-float--1{ top:6%; right:8%; width:96px; height:96px; background:repeating-linear-gradient(45deg,#FFE0B0 0 11px,#FFD089 11px 22px); animation:gk-bob-r 4.2s ease-in-out infinite; }
.gk-float--2{ bottom:4%; left:4%; width:104px; height:104px; background:repeating-linear-gradient(45deg,#FFCDA3 0 11px,#FFBA85 11px 22px); animation:gk-bob 4.8s ease-in-out infinite; }
.gk-paw{ position:absolute; opacity:.15; background-image:
  radial-gradient(circle at 28% 30%, var(--gk-ink) 0 10px, transparent 11px),
  radial-gradient(circle at 52% 20%, var(--gk-ink) 0 10px, transparent 11px),
  radial-gradient(circle at 76% 30%, var(--gk-ink) 0 10px, transparent 11px),
  radial-gradient(circle at 50% 64%, var(--gk-ink) 0 19px, transparent 20px);
}
.gk-paw--1{ left:6%; top:18%; width:74px; height:74px; transform:rotate(-12deg); }
.gk-paw--2{ right:4%; bottom:10%; width:58px; height:58px; transform:rotate(14deg); }

/* hero B */
.gk-hero--b{ background:var(--gk-cream); }
.gk-hero--b .gk-wrap{ max-width:900px; padding:62px 22px 70px; text-align:center; display:flex; flex-direction:column; align-items:center; }
.gk-hero--b .gk-blob{ position:absolute; border-radius:50%; }
.gk-hero--b .gk-blob--1{ top:-80px; left:-80px; width:300px; height:300px; background:var(--gk-yellow); opacity:.5; }
.gk-hero--b .gk-blob--2{ bottom:-110px; right:-70px; width:340px; height:340px; background:#FFD089; opacity:.55; }
.gk-hero--b__logo{ width:150px; height:150px; border-radius:50%; border:3px solid var(--gk-ink); box-shadow:6px 8px 0 var(--gk-ink); object-fit:cover; animation:gk-bob 5s ease-in-out infinite; position:relative; }
.gk-hero--b .gk-pill-eyebrow{ margin-top:24px; }
.gk-promo{ margin-top:34px; display:flex; align-items:center; gap:20px; background:#fff; border:var(--gk-border); border-radius:28px; box-shadow:6px 7px 0 var(--gk-ink); padding:18px 22px; flex-wrap:wrap; justify-content:center; }
.gk-promo__ph{ width:88px; height:88px; border-radius:18px; border:var(--gk-border); background:repeating-linear-gradient(45deg,#FFE0B0 0 10px,#FFD089 10px 20px); display:flex; align-items:flex-end; justify-content:center; padding:6px; }
.gk-promo__ph small{ font-family:ui-monospace,Menlo,monospace; font-size:9px; font-weight:700; color:#6B5024; background:rgba(255,255,255,.8); border-radius:5px; padding:2px 5px; }
.gk-promo__tag{ display:inline-block; background:var(--gk-orange); color:#fff; border:2px solid var(--gk-ink); border-radius:999px; padding:4px 11px; font-weight:900; font-size:12.5px; }
.gk-promo h3{ font-family:var(--gk-font-display); font-weight:600; font-size:23px; margin-top:8px; }
.gk-promo .gk-old{ text-decoration:line-through; opacity:.55; margin-right:8px; }
.gk-promo .gk-now{ color:var(--gk-orange); font-weight:900; }

/* ----- trust strip ----- */
.gk-trust{ background:var(--gk-ink); }
.gk-trust .gk-wrap{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px 12px; padding:16px 22px; }
.gk-trust span{ background:var(--gk-cream); color:var(--gk-ink); border:2px solid var(--gk-ink); border-radius:999px; padding:7px 15px; font-weight:800; font-size:13.5px; }

/* ----- filter chips ----- */
.gk-chips{ display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-bottom:34px; }
.gk-chip{ display:inline-flex; align-items:center; gap:9px; border:var(--gk-border); border-radius:999px; padding:11px 20px; font-weight:800; font-size:15.5px; cursor:pointer; background:#fff; color:var(--gk-ink); }
.gk-chip .gk-chip-num{ background:var(--gk-cream-2); border-radius:999px; padding:1px 9px; font-size:12.5px; font-weight:900; }
.gk-chip.is-active{ background:var(--gk-orange); color:#fff; }
.gk-chip.is-active .gk-chip-num{ background:rgba(255,255,255,.25); }

/* ----- product grid ----- */
.gk-grid{ display:grid; gap:24px; }
.gk-grid--4{ grid-template-columns:repeat(4,1fr); gap:22px; }
.gk-grid--3{ grid-template-columns:repeat(3,1fr); }
.gk-product{ display:flex; flex-direction:column; background:#fff; border:var(--gk-border); border-radius:26px; box-shadow:var(--gk-shadow); overflow:hidden; transition:transform .08s ease, box-shadow .08s ease; }
.gk-product:hover{ transform:translate(2px,3px); box-shadow:2px 2px 0 var(--gk-ink); }
.gk-product__media{ position:relative; height:185px; }
.gk-product--sm .gk-product__media{ height:150px; }
.gk-product__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.gk-ph{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:10px; background:repeating-linear-gradient(45deg,#FFE3B8 0 15px,#FFD089 15px 30px); }
.gk-product[data-pet="cat"] .gk-ph{ background:repeating-linear-gradient(45deg,#FFD0A8 0 15px,#FFBA85 15px 30px); }
.gk-ph small{ font-family:ui-monospace,Menlo,monospace; font-size:10px; font-weight:700; color:#6B5024; background:rgba(255,255,255,.8); border-radius:6px; padding:3px 7px; }
.gk-badge{ position:absolute; top:11px; left:11px; background:var(--gk-orange); color:#fff; border:2px solid var(--gk-ink); border-radius:999px; padding:3px 11px; font-weight:900; font-size:11.5px; z-index:2; }
.gk-badge--sale{ background:var(--gk-sale); }
.gk-product__body{ display:flex; flex-direction:column; flex:1; padding:16px 18px 18px; }
.gk-product--sm .gk-product__body{ padding:15px 16px 17px; }
.gk-product__meta{ font-size:11px; font-weight:800; letter-spacing:.5px; color:var(--gk-label); text-transform:uppercase; }
.gk-product__body h3{ font-family:var(--gk-font-display); font-weight:600; font-size:19px; margin-top:6px; line-height:1.15; }
.gk-product--sm .gk-product__body h3{ font-size:18px; }
.gk-product__body p{ font-size:13.5px; line-height:1.45; color:var(--gk-muted); margin-top:8px; }
.gk-product__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:8px; padding-top:16px; }
.gk-price{ display:flex; flex-direction:column; line-height:1; }
.gk-price__old{ font-size:13px; font-weight:700; color:#B79877; text-decoration:line-through; margin-bottom:3px; }
.gk-price__now{ font-family:var(--gk-font-display); font-weight:700; font-size:24px; }
.gk-product--sm .gk-price__now{ font-size:22px; }

/* ----- why-us ----- */
.gk-why{ margin-top:72px; background:var(--gk-yellow); border-top:3px solid var(--gk-ink); border-bottom:3px solid var(--gk-ink); }
.gk-why .gk-wrap{ padding:64px 22px; }
.gk-why .gk-h2{ color:var(--gk-ink); }
.gk-feat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:42px; }
.gk-feat{ background:var(--gk-cream); border:var(--gk-border); border-radius:24px; box-shadow:var(--gk-shadow); padding:26px 22px; }
.gk-feat__ico{ width:54px; height:54px; border-radius:16px; border:var(--gk-border); position:relative; overflow:hidden; }
.gk-feat__ico--paw{ background:var(--gk-green); background-image:
  radial-gradient(circle at 30% 30%, var(--gk-ink) 0 6px, transparent 7px),
  radial-gradient(circle at 50% 22%, var(--gk-ink) 0 6px, transparent 7px),
  radial-gradient(circle at 70% 30%, var(--gk-ink) 0 6px, transparent 7px),
  radial-gradient(circle at 50% 60%, var(--gk-ink) 0 11px, transparent 12px); }
.gk-feat__ico--flag{ display:flex; flex-direction:column; }
.gk-feat__ico--flag i{ flex:1; display:block; }
.gk-feat__ico--flag i:first-child{ background:#0057B7; }
.gk-feat__ico--flag i:last-child{ background:#FFD700; }
.gk-feat__ico--star{ background:var(--gk-yellow); }
.gk-feat__ico--star i, .gk-feat__ico--star i::after{ content:""; position:absolute; top:50%; left:50%; background:var(--gk-ink); border-radius:6px; }
.gk-feat__ico--star i{ width:9px; height:30px; transform:translate(-50%,-50%); }
.gk-feat__ico--star i::after{ width:30px; height:9px; transform:translate(-50%,-50%); }
.gk-feat__ico--box{ background:#FF9E5E; }
.gk-feat__ico--box i{ position:absolute; left:9px; top:18px; width:20px; height:14px; background:var(--gk-ink); border-radius:3px; }
.gk-feat__ico--box i::after{ content:""; position:absolute; left:18px; top:4px; width:13px; height:10px; background:var(--gk-ink); border-radius:0 4px 4px 0; }
.gk-feat h3{ font-family:var(--gk-font-display); font-weight:600; font-size:20px; margin-top:16px; }
.gk-feat p{ font-size:14.5px; line-height:1.5; color:var(--gk-ink-soft); margin-top:8px; }

/* ----- about ----- */
.gk-about .gk-wrap{ display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; }
.gk-about__ph{ width:300px; height:300px; border-radius:34px; border:3px solid var(--gk-ink); box-shadow:8px 9px 0 var(--gk-ink); background:repeating-linear-gradient(45deg,#FFE3B8 0 17px,#FFD089 17px 34px); display:flex; align-items:flex-end; padding:14px; margin:0 auto; }
.gk-about__ph small{ font-family:ui-monospace,Menlo,monospace; font-size:11px; font-weight:700; color:#6B5024; background:rgba(255,255,255,.82); border-radius:7px; padding:4px 9px; }
.gk-about h2{ font-family:var(--gk-font-display); font-weight:700; font-size:40px; margin-top:8px; line-height:1.08; }
.gk-about p{ font-size:17px; line-height:1.6; color:var(--gk-ink-soft); margin-top:18px; }
.gk-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px; }
.gk-stat{ background:#fff; border:var(--gk-border); border-radius:20px; box-shadow:4px 5px 0 var(--gk-ink); padding:18px 16px; text-align:center; }
.gk-stat b{ display:block; font-family:var(--gk-font-display); font-weight:700; font-size:30px; color:var(--gk-orange); }
.gk-stat span{ font-weight:700; font-size:13px; color:var(--gk-ink-soft); margin-top:3px; display:block; }

/* ----- delivery ----- */
.gk-delivery{ background:var(--gk-cream-2); border-top:3px solid var(--gk-ink); border-bottom:3px solid var(--gk-ink); }
.gk-delivery .gk-wrap{ padding:64px 22px; }
.gk-pay-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:40px; }
.gk-pay{ background:var(--gk-cream); border:var(--gk-border); border-radius:22px; box-shadow:var(--gk-shadow); padding:24px 20px; }
.gk-pay h3{ font-family:var(--gk-font-display); font-weight:600; font-size:19px; }
.gk-pay p{ font-size:14px; line-height:1.5; color:var(--gk-ink-soft); margin-top:8px; }

/* ----- reviews ----- */
.gk-rev-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.gk-review{ background:#fff; border:var(--gk-border); border-radius:24px; box-shadow:var(--gk-shadow); padding:26px 24px; display:flex; flex-direction:column; }
.gk-stars{ color:var(--gk-yellow-dp); font-size:18px; letter-spacing:2px; }
.gk-review p{ font-size:16px; line-height:1.55; margin-top:14px; flex:1; }
.gk-review__who{ display:flex; align-items:center; gap:12px; margin-top:20px; }
.gk-avatar{ width:46px; height:46px; border-radius:50%; border:var(--gk-border); background:var(--gk-yellow); display:flex; align-items:center; justify-content:center; font-family:var(--gk-font-display); font-weight:700; font-size:18px; }
.gk-review__who b{ display:block; font-size:15px; }
.gk-review__who span{ font-weight:700; font-size:13px; color:var(--gk-label); }

/* ----- CTA / subscribe ----- */
.gk-cta{ background:var(--gk-ink); }
.gk-cta .gk-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; padding:66px 22px; }
.gk-cta h2{ font-family:var(--gk-font-display); font-weight:700; font-size:40px; color:var(--gk-yellow); line-height:1.08; }
.gk-cta p{ font-size:17px; line-height:1.55; color:var(--gk-cream-2); margin-top:16px; }
.gk-cta-links{ display:flex; flex-wrap:wrap; gap:18px; margin-top:26px; }
.gk-cta-links a{ color:var(--gk-yellow); font-weight:800; text-decoration:none; border-bottom:2px solid var(--gk-yellow-dp); padding-bottom:2px; }
.gk-cta-links a:hover{ color:#fff; }
.gk-card-form{ background:var(--gk-cream); border:2.5px solid #000; border-radius:26px; box-shadow:6px 7px 0 #000; padding:28px 26px; }
.gk-card-form label{ font-weight:800; font-size:14px; display:block; margin-bottom:8px; }
.gk-input{ width:100%; border:var(--gk-border); border-radius:14px; padding:14px 16px; font-family:var(--gk-font-body); font-weight:700; font-size:16px; background:#fff; color:var(--gk-ink); outline:none; }
.gk-input:focus{ border-color:var(--gk-orange); }
.gk-card-form .gk-note{ font-size:12.5px; color:var(--gk-muted); margin-top:12px; text-align:center; }
.gk-success{ text-align:center; padding:14px 0; }
.gk-success__check{ width:58px; height:58px; margin:0 auto; border-radius:50%; border:var(--gk-border); background:var(--gk-green); position:relative; }
.gk-success__check::before, .gk-success__check::after{ content:""; position:absolute; background:var(--gk-ink); border-radius:3px; }
.gk-success__check::before{ left:17px; top:28px; width:11px; height:3px; transform:rotate(45deg); }
.gk-success__check::after{ left:23px; top:26px; width:20px; height:3px; transform:rotate(-50deg); }
.gk-success h3{ font-family:var(--gk-font-display); font-weight:600; font-size:22px; margin-top:14px; }
.gk-success p{ font-size:14.5px; color:var(--gk-ink-soft); margin-top:8px; }

/* ----- footer ----- */
.gk-footer{ background:var(--gk-dark); color:#E8D6BE; }
.gk-footer .gk-wrap{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:30px; padding:46px 22px 30px; }
.gk-footer .gk-brand b{ color:var(--gk-yellow); }
.gk-footer .gk-brand img{ border-color:#E8D6BE; box-shadow:none; }
.gk-footer__about{ font-size:14px; line-height:1.55; color:#C7B299; margin-top:14px; max-width:300px; }
.gk-made{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; background:var(--gk-ink); border-radius:999px; padding:6px 13px; }
.gk-made__flag{ display:inline-flex; width:22px; height:15px; border-radius:3px; overflow:hidden; flex-direction:column; border:1px solid #5A4326; }
.gk-made__flag i{ flex:1; }
.gk-made__flag i:first-child{ background:#0057B7; }
.gk-made__flag i:last-child{ background:#FFD700; }
.gk-made b{ font-weight:800; font-size:12.5px; color:var(--gk-yellow); }
.gk-fcol h4{ font-weight:800; font-size:14px; color:var(--gk-yellow); letter-spacing:.5px; text-transform:uppercase; margin:0 0 14px; }
.gk-fcol nav{ display:flex; flex-direction:column; gap:10px; }
.gk-fcol a{ text-decoration:none; font-weight:600; font-size:14.5px; }
.gk-fcol a:hover{ color:#fff; }
.gk-copy{ border-top:1px solid #4A3522; }
.gk-copy .gk-wrap{ display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; padding:18px 22px; font-size:13px; color:#9C876E; }
.gk-powered{ opacity:.7; }
.gk-powered a{ color:#C7B299; text-decoration:none; font-weight:600; transition:color .15s; }
.gk-powered a:hover{ color:var(--gk-yellow); }

/* ----- cart drawer ----- */
.gk-overlay{ position:fixed; inset:0; z-index:90; background:rgba(43,27,16,.5); animation:gk-fade .2s ease; }
.gk-drawer{ position:fixed; top:0; right:0; z-index:91; width:min(440px,94vw); height:100%; background:var(--gk-cream); border-left:3px solid var(--gk-ink); box-shadow:-10px 0 0 rgba(58,37,22,.15); display:flex; flex-direction:column; animation:gk-drawer .28s ease; }
.gk-drawer__head{ display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:var(--gk-border); }
.gk-drawer__head h3{ font-family:var(--gk-font-display); font-weight:700; font-size:23px; }
.gk-icon-btn{ width:38px; height:38px; border:var(--gk-border); border-radius:12px; background:#fff; box-shadow:2px 3px 0 var(--gk-ink); font-weight:900; font-size:18px; cursor:pointer; color:var(--gk-ink); line-height:1; }
.gk-icon-btn:hover{ transform:translate(1px,2px); box-shadow:1px 1px 0 var(--gk-ink); }
.gk-drawer__items{ flex:1; overflow-y:auto; padding:16px 18px; display:flex; flex-direction:column; gap:12px; }
.gk-empty{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:30px; gap:14px; }
.gk-empty__paw{ width:80px; height:80px; opacity:.5; background-image:
  radial-gradient(circle at 28% 30%, var(--gk-ink) 0 11px, transparent 12px),
  radial-gradient(circle at 52% 20%, var(--gk-ink) 0 11px, transparent 12px),
  radial-gradient(circle at 76% 30%, var(--gk-ink) 0 11px, transparent 12px),
  radial-gradient(circle at 50% 64%, var(--gk-ink) 0 21px, transparent 22px); }
.gk-empty p{ font-weight:700; color:var(--gk-muted); font-size:16px; }
.gk-line{ display:flex; gap:13px; background:#fff; border:var(--gk-border); border-radius:18px; box-shadow:3px 4px 0 var(--gk-ink); padding:12px; }
.gk-line__ph{ width:62px; height:62px; flex-shrink:0; border-radius:12px; border:2px solid var(--gk-ink); background:repeating-linear-gradient(45deg,#FFE3B8 0 9px,#FFD089 9px 18px); }
.gk-line[data-pet="cat"] .gk-line__ph{ background:repeating-linear-gradient(45deg,#FFD0A8 0 9px,#FFBA85 9px 18px); }
.gk-line__main{ flex:1; min-width:0; }
.gk-line__name{ font-weight:800; font-size:14.5px; line-height:1.2; }
.gk-line__price{ font-weight:700; font-size:13px; color:var(--gk-label); margin-top:2px; }
.gk-line__row{ display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.gk-qty{ display:flex; align-items:center; border:2px solid var(--gk-ink); border-radius:999px; overflow:hidden; }
.gk-qty button{ width:30px; height:30px; border:none; background:var(--gk-cream-2); font-weight:900; font-size:17px; cursor:pointer; color:var(--gk-ink); line-height:1; }
.gk-qty span{ min-width:30px; text-align:center; font-weight:900; font-size:15px; }
.gk-line__total{ font-family:var(--gk-font-display); font-weight:700; font-size:17px; }
.gk-line__rm{ align-self:flex-start; border:none; background:none; color:#B79877; font-weight:900; font-size:17px; cursor:pointer; line-height:1; }
.gk-line__rm:hover{ color:var(--gk-sale); }
.gk-drawer__foot{ border-top:var(--gk-border); padding:18px 20px 22px; background:#FFF1D8; }
.gk-free{ font-size:13px; font-weight:700; color:#8A6A3E; background:var(--gk-cream-2); border:2px dashed #D9A85A; border-radius:12px; padding:9px 12px; text-align:center; }
.gk-total-row{ display:flex; align-items:center; justify-content:space-between; margin-top:14px; }
.gk-total-row b{ font-size:16px; }
.gk-total-row strong{ font-family:var(--gk-font-display); font-weight:700; font-size:26px; }
.gk-checkout-fields{ display:grid; gap:10px; margin-top:14px; }

/* ----- toast ----- */
.gk-toast{ position:fixed; bottom:26px; left:50%; transform:translateX(-50%); z-index:95; background:var(--gk-ink); color:var(--gk-cream-2); border:2.5px solid var(--gk-yellow); border-radius:999px; padding:13px 24px; font-weight:800; font-size:15px; box-shadow:0 8px 24px rgba(43,27,16,.35); animation:gk-slidein .3s ease; }

/* ----- hero switcher (dev tool — приберіть для продакшну) ----- */
.gk-hero-switch{ position:fixed; right:18px; bottom:18px; z-index:80; display:flex; align-items:center; gap:6px; background:#fff; border:var(--gk-border); border-radius:999px; box-shadow:var(--gk-shadow-sm); padding:6px 8px; }
.gk-hero-switch span{ font-weight:800; font-size:12px; color:var(--gk-label); padding-left:5px; }
.gk-hero-switch button{ border:none; background:none; padding:6px 14px; cursor:pointer; font-weight:900; font-size:13px; color:var(--gk-ink); border-radius:999px; white-space:nowrap; }
.gk-hero-switch button.is-active{ background:var(--gk-ink); color:#fff; }

/* ----- keyframes ----- */
@keyframes gk-bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }
@keyframes gk-bob-r{ 0%,100%{ transform:translateY(0) rotate(-6deg); } 50%{ transform:translateY(-16px) rotate(-6deg); } }
@keyframes gk-slidein{ from{ transform:translateY(28px); opacity:0; } to{ transform:translateY(0); opacity:1; } }
@keyframes gk-drawer{ from{ transform:translateX(60px); opacity:0; } to{ transform:translateX(0); opacity:1; } }
@keyframes gk-fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes gk-pop{ 0%{ transform:scale(.4); } 60%{ transform:scale(1.18); } 100%{ transform:scale(1); } }

/* ----- responsive ----- */
@media (max-width:1000px){
  .gk-grid--4{ grid-template-columns:repeat(2,1fr); }
  .gk-grid--3{ grid-template-columns:repeat(2,1fr); }
  .gk-feat-grid, .gk-pay-grid{ grid-template-columns:repeat(2,1fr); }
  .gk-rev-grid{ grid-template-columns:1fr; }
  .gk-hero--a .gk-wrap, .gk-about .gk-wrap, .gk-cta .gk-wrap{ grid-template-columns:1fr; }
  .gk-hero-art{ min-height:320px; }
  .gk-about__ph{ width:100%; max-width:340px; height:auto; aspect-ratio:1; }
  .gk-nav{ display:none; }
}
@media (max-width:620px){
  .gk-hero h1{ font-size:42px; }
  .gk-hero--b .gk-hero--b__logo{ width:120px; height:120px; }
  .gk-h2, .gk-about h2, .gk-cta h2{ font-size:32px; }
  .gk-grid--4, .gk-grid--3, .gk-feat-grid, .gk-pay-grid{ grid-template-columns:1fr; }
  .gk-stats{ grid-template-columns:1fr 1fr; }
  .gk-footer .gk-wrap{ grid-template-columns:1fr; gap:24px; }
  .gk-promo{ flex-direction:column; }
}