/* GardenBlocks — home hero (first screen). Keeps the brand language: paper, pine, hard offset shadows. */
.gbh{position:relative;isolation:isolate;padding:clamp(28px,5vw,72px) 0 clamp(48px,7vw,96px);overflow:clip}
.gbh::before{content:"";position:absolute;z-index:-1;inset:-10% -20% auto auto;width:min(980px,90vw);aspect-ratio:1;background:radial-gradient(closest-side,rgb(255 250 241/90%),rgb(255 250 241/0));pointer-events:none}
.gbh-grid{display:grid;gap:clamp(28px,4vw,40px);align-items:center}
@media (min-width:1000px){.gbh-grid{grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);gap:clamp(48px,5vw,80px)}}
.gbh-copy{min-width:0}

/* eyebrow: provenance first — it is the strongest trust signal for wood that touches food and kids */
.gbh-eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 clamp(14px,1.6vw,22px);padding:6px 12px 6px 10px;background:var(--card);border:1.5px solid var(--line-2);border-radius:99px;font:700 .8rem/1.2 var(--font-body);letter-spacing:.02em;color:var(--ink-2)}
.gbh-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-tint)}

.gbh-title{margin:0;max-width:19ch;font:800 clamp(2.35rem,1.35rem + 3vw,3.75rem)/1.02 var(--font-display);letter-spacing:-.022em;color:var(--ink);text-wrap:balance}
.gbh-mark{position:relative;white-space:nowrap;background:linear-gradient(transparent 60%,rgb(201 138 75/42%) 60%,rgb(201 138 75/42%) 92%,transparent 92%) no-repeat 0 0/100% 100%;padding:0 .04em;margin:0 -.04em}
.gbh-lead{margin:clamp(16px,1.8vw,24px) 0 0;max-width:46ch;font-size:clamp(1.04rem,.98rem + .3vw,1.2rem);line-height:1.6;color:var(--ink-2);text-wrap:pretty}
.gbh-lead b{color:var(--ink);font-weight:700}

.gbh-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(22px,2.4vw,32px)}
.gbh-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding-inline:22px;font-size:1.02rem}
.gbh-btn svg{flex:none;transition:transform .2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.gbh-btn:hover svg.gbh-arrow{transform:translateX(3px)}}
@media (max-width:519px){.gbh-ctas .gbh-btn{flex:1 1 100%}}

/* proof: three wooden blocks with pegs — the product itself is the stat card */
.gbh-proof{list-style:none;padding:12px 0 0;margin:clamp(30px,3vw,40px) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:540px}
.gbh-proof li{position:relative;display:grid;align-content:start;gap:3px;min-width:0;padding:12px 12px 13px;margin-left:-2px;background:var(--wood) var(--grain);color:#2a1607;border:2px solid var(--wood-deep);box-shadow:inset 0 3px 0 rgb(255 255 255/22%),inset 0 -4px 0 rgb(59 36 20/22%)}
.gbh-proof li:first-child{margin-left:0}
.gbh-proof li::before,.gbh-proof li::after{content:"";position:absolute;top:-11px;width:12px;height:10px;background:#ddb47c;border:2px solid var(--wood-deep);border-bottom:0}
.gbh-proof li::before{left:22%}.gbh-proof li::after{right:22%}
.gbh-proof b{font:800 clamp(1.15rem,1rem + .55vw,1.5rem)/1.05 var(--font-display);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.gbh-proof span{font-size:clamp(.78rem,.74rem + .15vw,.86rem);font-weight:650;line-height:1.25;opacity:.88}
.gbh-ship{display:flex;align-items:center;gap:8px;margin:16px 0 0;font-size:.88rem;font-weight:600;color:var(--ink-3)}
.gbh-ship svg{flex:none;color:var(--green)}

/* visual: two moments of the same Saturday */
.gbh-visual{position:relative;min-width:0;padding:0 0 clamp(64px,9vw,104px) 0}
.gbh-shot{margin:0;position:relative;border:3px solid var(--wood-deep);background:var(--paper-2)}
.gbh-shot img{display:block;width:100%;height:100%;object-fit:cover}
.gbh-main{width:88%;aspect-ratio:1/1;box-shadow:-14px 14px 0 var(--wood)}
.gbh-main img{object-position:58% 50%}
.gbh-side{position:absolute;right:0;bottom:0;width:42%;aspect-ratio:3/4;box-shadow:8px 8px 0 var(--green)}
.gbh-tag{position:absolute;display:flex;align-items:baseline;gap:8px;max-width:calc(100% - 20px);padding:6px 12px 6px 10px;background:var(--card);color:var(--ink);border:2px solid var(--wood-deep);box-shadow:3px 3px 0 var(--wood-deep);font-size:.86rem;font-weight:650;line-height:1.25}
.gbh-tag b{font:800 1rem/1 var(--font-display);color:var(--green)}
.gbh-main .gbh-tag{top:16px;left:16px}
.gbh-side .gbh-tag{left:10px;bottom:10px}
.gbh-sticker{position:absolute;left:-14px;bottom:clamp(8px,1.6vw,18px);display:grid;gap:2px;min-width:0;max-width:58%;padding:12px 44px 12px 14px;background:var(--wood) var(--grain);color:#2a1607;border:2px solid var(--wood-deep);box-shadow:4px 4px 0 var(--wood-deep);text-decoration:none;transition:transform .16s var(--ease-out),box-shadow .16s var(--ease-out)}
.gbh-sticker small{font:800 .68rem/1.2 var(--font-display);letter-spacing:.1em;text-transform:uppercase;opacity:.8}
.gbh-sticker span{font-weight:750;font-size:.98rem;line-height:1.2}
.gbh-sticker b{font:800 1.3rem/1.1 var(--font-display)}
.gbh-sticker svg{position:absolute;right:14px;top:50%;translate:0 -50%;transition:translate .2s var(--ease-out)}
.gbh-sticker:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--wood-deep)}
@media (hover:hover) and (pointer:fine){.gbh-sticker:hover svg{translate:3px -50%}}

@media (max-width:999px){
  .gbh-visual{max-width:620px;padding-left:14px}
  .gbh-main{width:92%;aspect-ratio:4/3.4}
  .gbh-side{width:36%}
  .gbh-sticker{left:0}
}
@media (max-width:519px){
  .gbh-proof li{padding:10px 8px 11px}
  .gbh-proof li::before{left:16%}.gbh-proof li::after{right:16%}
  .gbh-sticker{max-width:70%;padding:10px 38px 10px 12px}
  .gbh-sticker b{font-size:1.12rem}
  .gbh-tag{font-size:.78rem;padding:4px 8px}
  .gbh-tag b{font-size:.9rem}
  .gbh-main .gbh-tag{top:10px;left:10px}
}

/* First visit only: the marker draws under "kopā ar ģimeni", supporting elements settle in.
   The headline and the main photo never fade (they are what loads first and what Google measures). */
@media (prefers-reduced-motion:no-preference){
  .gbh-mark{animation:gbh-mark .7s var(--ease-out) .35s both}
  .gbh-lead,.gbh-ctas,.gbh-proof,.gbh-ship{animation:gbh-rise .5s var(--ease-out) both}
  .gbh-lead{animation-delay:.06s}.gbh-ctas{animation-delay:.12s}.gbh-proof{animation-delay:.18s}.gbh-ship{animation-delay:.24s}
  .gbh-side{animation:gbh-rise .6s var(--ease-out) .2s both}
  .gbh-sticker{animation:gbh-pop .45s var(--ease-out) .45s both}
}
@keyframes gbh-mark{from{background-size:0% 100%}to{background-size:100% 100%}}
@keyframes gbh-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes gbh-pop{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:none}}