/* The gardener look: everything here is scoped to .site[data-look="gardener"]. Appended after base.css (bun run --filter @platform/sections css).
   The page is a walk through a garden: the planting full-bleed, a big
   kwekerij label pushed into a strip of soil, steeketiketten with price
   stickers and month strips, the drawing table with a beplantingsplan, a
   mown lawn, stepping stones in gravel, and a clipped hedge at the foot. */

.site[data-look="gardener"] {
  /* Materials. Text on each was checked for 4.5:1 (see the report). */
  --gd-label: #ffffff;
  --gd-paper: #f5f7f0;
  --gd-leaf: #e9eedf;
  --gd-ink: #18231b;
  --gd-ink-soft: #3f4c43;
  --gd-name: #2f6b3a;
  --gd-hedge: #1f3326;
  --gd-hedge-lit: #2b4a34;
  --gd-hedge-dark: #142219;
  --gd-soil: #3a2a1f;
  --gd-soil-lit: #5a4331;
  --gd-soil-dark: #231810;
  --gd-on-soil: #f4efe6;
  --gd-on-soil-soft: #dccfbd;
  --gd-gravel: #dcd7cb;
  --gd-stone: #cbc7bc;
  --gd-sticker: #ffd23f;
  --gd-lawn-a: #2c5b36;
  --gd-lawn-b: #336a3e;
  --gd-on-green: #f3f7ee;
  --gd-on-green-soft: #d6e4cf;
  --gd-line: #c9d2bf;
  --gd-plan-ink: #2f4a36;

  /* Drawn materials, reused by several sections: one crumb, pebble or leaf per
     gradient layer, each on its own prime-sized tile, so no repeat shows. */
  --gd-soil-tex:
    radial-gradient(2.0px 2.4px at 50% 69%, #1f150e 80%, #0000) 0 0 / 67px 109px,
    radial-gradient(1.8px 2.8px at 41% 20%, #6b5240 80%, #0000) 0 0 / 41px 103px,
    radial-gradient(3.3px 2.9px at 46% 87%, #241810 80%, #0000) 0 0 / 73px 29px,
    radial-gradient(2.1px 1.5px at 29% 72%, #7a604b 80%, #0000) 0 0 / 109px 157px,
    radial-gradient(1.9px 1.6px at 83% 50%, #1b120c 80%, #0000) 0 0 / 29px 149px,
    radial-gradient(3.7px 3.0px at 68% 18%, #241810 80%, #0000) 0 0 / 31px 73px,
    radial-gradient(4.4px 3.3px at 17% 49%, #1f150e 80%, #0000) 0 0 / 101px 151px,
    radial-gradient(2.6px 1.8px at 12% 69%, #1b120c 80%, #0000) 0 0 / 37px 53px,
    radial-gradient(1.4px 2.3px at 46% 26%, #2a1d14 80%, #0000) 0 0 / 71px 131px,
    radial-gradient(2.7px 2.9px at 31% 67%, #7a604b 80%, #0000) 0 0 / 103px 101px,
    radial-gradient(3.3px 3.0px at 80% 45%, #7a604b 80%, #0000) 0 0 / 139px 41px,
    radial-gradient(3.8px 4.6px at 39% 29%, #241810 80%, #0000) 0 0 / 97px 61px,
    radial-gradient(1.5px 2.3px at 72% 85%, #5c4533 80%, #0000) 0 0 / 47px 79px,
    radial-gradient(1.4px 2.5px at 57% 88%, #1b120c 80%, #0000) 0 0 / 107px 107px,
    radial-gradient(4.5px 3.7px at 89% 16%, #1f150e 80%, #0000) 0 0 / 137px 37px,
    radial-gradient(4.3px 3.7px at 81% 60%, #7a604b 80%, #0000) 0 0 / 131px 139px,
    radial-gradient(2.9px 1.7px at 17% 34%, #241810 80%, #0000) 0 0 / 83px 97px,
    radial-gradient(3.3px 4.6px at 86% 16%, #241810 80%, #0000) 0 0 / 149px 59px,
    radial-gradient(1.1px 1.8px at 56% 88%, #4b382a 80%, #0000) 0 0 / 127px 67px,
    radial-gradient(1.3px 2.0px at 42% 54%, #1b120c 80%, #0000) 0 0 / 151px 31px,
    radial-gradient(1.9px 3.1px at 69% 71%, #1f150e 80%, #0000) 0 0 / 59px 113px,
    radial-gradient(2.7px 1.6px at 43% 71%, #5c4533 80%, #0000) 0 0 / 79px 89px,
    radial-gradient(3.2px 2.1px at 56% 28%, #4b382a 80%, #0000) 0 0 / 23px 43px,
    radial-gradient(3.9px 2.6px at 21% 43%, #1b120c 80%, #0000) 0 0 / 61px 23px,
    radial-gradient(3.0px 4.3px at 79% 74%, #1b120c 80%, #0000) 0 0 / 157px 163px,
    radial-gradient(3.6px 2.8px at 34% 40%, #7a604b 80%, #0000) 0 0 / 53px 47px,
    radial-gradient(3.9px 2.5px at 55% 13%, #4b382a 80%, #0000) 0 0 / 163px 127px,
    radial-gradient(3.0px 4.0px at 87% 54%, #1f150e 80%, #0000) 0 0 / 89px 71px,
    var(--gd-soil);
  --gd-hedge-tex:
    radial-gradient(1.9px 3.7px at 82% 23%, #1b3022 80%, #0000) 0 0 / 83px 23px,
    radial-gradient(1.1px 2.2px at 12% 10%, #152619 80%, #0000) 0 0 / 151px 149px,
    radial-gradient(1.5px 2.5px at 60% 63%, #2b4a34 80%, #0000) 0 0 / 101px 97px,
    radial-gradient(3.2px 1.5px at 53% 21%, #335a3d 80%, #0000) 0 0 / 137px 31px,
    radial-gradient(2.7px 1.8px at 25% 27%, #152619 80%, #0000) 0 0 / 163px 29px,
    radial-gradient(1.4px 3.6px at 72% 32%, #122016 80%, #0000) 0 0 / 139px 139px,
    radial-gradient(1.7px 3.2px at 26% 63%, #122016 80%, #0000) 0 0 / 97px 47px,
    radial-gradient(2.8px 1.4px at 10% 44%, #3b6644 80%, #0000) 0 0 / 103px 53px,
    radial-gradient(1.7px 2.7px at 60% 87%, #122016 80%, #0000) 0 0 / 47px 107px,
    radial-gradient(1.3px 3.3px at 66% 43%, #2b4a34 80%, #0000) 0 0 / 43px 163px,
    radial-gradient(1.8px 3.7px at 19% 19%, #2b4a34 80%, #0000) 0 0 / 131px 83px,
    radial-gradient(1.4px 2.5px at 57% 57%, #3b6644 80%, #0000) 0 0 / 89px 67px,
    radial-gradient(1.9px 3.0px at 83% 27%, #1b3022 80%, #0000) 0 0 / 109px 113px,
    radial-gradient(2.4px 1.1px at 88% 41%, #122016 80%, #0000) 0 0 / 37px 131px,
    radial-gradient(2.4px 1.4px at 35% 59%, #1b3022 80%, #0000) 0 0 / 149px 127px,
    radial-gradient(1.7px 3.3px at 14% 75%, #335a3d 80%, #0000) 0 0 / 41px 103px,
    radial-gradient(1.5px 2.5px at 86% 72%, #335a3d 80%, #0000) 0 0 / 31px 41px,
    radial-gradient(3.1px 2.0px at 26% 39%, #1b3022 80%, #0000) 0 0 / 29px 89px,
    radial-gradient(3.2px 2.0px at 45% 37%, #152619 80%, #0000) 0 0 / 59px 109px,
    radial-gradient(1.5px 3.6px at 41% 17%, #2b4a34 80%, #0000) 0 0 / 67px 101px,
    radial-gradient(2.4px 1.2px at 26% 21%, #335a3d 80%, #0000) 0 0 / 23px 137px,
    radial-gradient(1.2px 2.3px at 76% 84%, #152619 80%, #0000) 0 0 / 113px 73px,
    radial-gradient(2.1px 3.3px at 55% 49%, #2b4a34 80%, #0000) 0 0 / 53px 79px,
    radial-gradient(1.1px 2.0px at 49% 50%, #152619 80%, #0000) 0 0 / 157px 37px,
    radial-gradient(4.2px 1.8px at 15% 26%, #335a3d 80%, #0000) 0 0 / 71px 59px,
    radial-gradient(2.8px 1.6px at 63% 13%, #1b3022 80%, #0000) 0 0 / 127px 71px,
    radial-gradient(1.8px 3.3px at 84% 11%, #3b6644 80%, #0000) 0 0 / 73px 157px,
    radial-gradient(0.9px 2.2px at 42% 63%, #122016 80%, #0000) 0 0 / 79px 61px,
    radial-gradient(closest-side, rgb(80 130 85 / 0.16), transparent) 0 0 / 260px 190px, radial-gradient(closest-side, rgb(5 15 8 / 0.28), transparent) 120px 80px / 330px 240px,
    var(--gd-hedge);
  --gd-gravel-tex:
    radial-gradient(3.6px 5.0px at 53% 13%, #8f887a 80%, #0000) 0 0 / 53px 43px,
    radial-gradient(5.3px 6.6px at 51% 79%, #a0998a 80%, #0000) 0 0 / 103px 137px,
    radial-gradient(5.6px 3.7px at 83% 44%, #8f887a 80%, #0000) 0 0 / 101px 103px,
    radial-gradient(3.6px 2.7px at 71% 21%, #f6f3ed 80%, #0000) 0 0 / 41px 29px,
    radial-gradient(4.3px 5.9px at 47% 64%, #bcb4a4 80%, #0000) 0 0 / 71px 61px,
    radial-gradient(6.2px 3.8px at 15% 58%, #f6f3ed 80%, #0000) 0 0 / 107px 157px,
    radial-gradient(4.4px 5.1px at 40% 14%, #8f887a 80%, #0000) 0 0 / 89px 23px,
    radial-gradient(3.2px 2.0px at 35% 62%, #8f887a 80%, #0000) 0 0 / 109px 59px,
    radial-gradient(3.4px 5.3px at 53% 50%, #f6f3ed 80%, #0000) 0 0 / 157px 89px,
    radial-gradient(5.6px 6.5px at 68% 76%, #bcb4a4 80%, #0000) 0 0 / 31px 107px,
    radial-gradient(5.4px 4.2px at 89% 74%, #8f887a 80%, #0000) 0 0 / 137px 73px,
    radial-gradient(3.8px 4.7px at 48% 65%, #8f887a 80%, #0000) 0 0 / 23px 79px,
    radial-gradient(3.8px 5.0px at 63% 84%, #f6f3ed 80%, #0000) 0 0 / 131px 109px,
    radial-gradient(3.3px 2.6px at 17% 90%, #f6f3ed 80%, #0000) 0 0 / 59px 83px,
    radial-gradient(3.8px 4.8px at 45% 72%, #b4ad9e 80%, #0000) 0 0 / 163px 41px,
    radial-gradient(4.6px 5.2px at 57% 42%, #7f786b 80%, #0000) 0 0 / 37px 97px,
    radial-gradient(3.3px 4.2px at 33% 50%, #f6f3ed 80%, #0000) 0 0 / 139px 163px,
    radial-gradient(6.1px 4.1px at 23% 13%, #efebe3 80%, #0000) 0 0 / 151px 149px,
    radial-gradient(4.3px 2.8px at 40% 51%, #efebe3 80%, #0000) 0 0 / 97px 131px,
    radial-gradient(4.4px 5.5px at 86% 51%, #f6f3ed 80%, #0000) 0 0 / 79px 31px,
    radial-gradient(5.5px 3.7px at 31% 20%, #f6f3ed 80%, #0000) 0 0 / 73px 53px,
    radial-gradient(5.7px 3.8px at 44% 38%, #a0998a 80%, #0000) 0 0 / 47px 37px,
    radial-gradient(2.9px 3.3px at 83% 33%, #8f887a 80%, #0000) 0 0 / 127px 113px,
    radial-gradient(3.7px 4.4px at 89% 54%, #efebe3 80%, #0000) 0 0 / 29px 151px,
    radial-gradient(4.6px 3.5px at 69% 54%, #bcb4a4 80%, #0000) 0 0 / 43px 127px,
    radial-gradient(3.2px 4.2px at 62% 29%, #cdc6b8 80%, #0000) 0 0 / 67px 67px,
    radial-gradient(3.2px 2.8px at 75% 65%, #cdc6b8 80%, #0000) 0 0 / 83px 47px,
    radial-gradient(3.3px 2.4px at 76% 46%, #f6f3ed 80%, #0000) 0 0 / 61px 139px,
    radial-gradient(6.2px 5.3px at 46% 25%, #cdc6b8 80%, #0000) 0 0 / 113px 101px,
    radial-gradient(3.4px 2.9px at 35% 65%, #b4ad9e 80%, #0000) 0 0 / 149px 71px,
    var(--gd-gravel);
  --gd-grid:
    linear-gradient(rgb(47 107 58 / 0.13) 1px, transparent 1px) 0 0 / 120px 120px,
    linear-gradient(90deg, rgb(47 107 58 / 0.13) 1px, transparent 1px) 0 0 / 120px 120px,
    linear-gradient(rgb(47 107 58 / 0.06) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, rgb(47 107 58 / 0.06) 1px, transparent 1px) 0 0 / 24px 24px,
    var(--gd-paper);

  /* A broken top edge (clods of soil, the hedge's clipped leaves). */
  --gd-edge:
    radial-gradient(ellipse 52% 100% at 50% 100%, #000 94%, #0000) 0px 4px / 19px 11px repeat-x, radial-gradient(ellipse 52% 100% at 50% 100%, #000 94%, #0000) 7px 0px / 31px 15px repeat-x, radial-gradient(ellipse 52% 100% at 50% 100%, #000 94%, #0000) 13px 2px / 43px 13px repeat-x, radial-gradient(ellipse 52% 100% at 50% 100%, #000 94%, #0000) 5px 6px / 26px 9px repeat-x, radial-gradient(ellipse 52% 100% at 50% 100%, #000 94%, #0000) 21px 1px / 57px 14px repeat-x, radial-gradient(ellipse 52% 100% at 50% 100%, #000 94%, #0000) 11px 3px / 23px 12px repeat-x, linear-gradient(#000, #000) 0 12px / 100% 100% no-repeat;
  --fs-base: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --gd-h2: calc(clamp(2.5rem, 1.55rem + 4vw, 5.5rem) * var(--heading-scale, 1));
  position: relative;
  background: var(--gd-paper);
  color: var(--gd-ink);
}
.site[data-look="gardener"] main > .s + .s { border-top: 0; }
/* Dutch compounds are long ("bedrijfsterreinen"): headings break them at a
   hyphen rather than mid-letter. */
.site[data-look="gardener"] :is(h1, h2) { overflow-wrap: break-word; hyphens: auto; hyphenate-limit-chars: 10 4 4; }
.site[data-look="gardener"] main > .s + .s-trust, .site[data-look="gardener"] main > .s-trust + .s { border-top: 0; }
.site[data-look="gardener"] h2 { font-size: var(--gd-h2); line-height: 0.98; letter-spacing: -0.02em; }
.site[data-look="gardener"] main > .s:first-child:not(.s-hero) > .wrap :is(h1, h2):first-child,
.site[data-look="gardener"] main > .s:first-child:not(.s-hero) .gd-services-head h1 { font-size: var(--gd-h2); }
.site[data-look="gardener"] .lead { color: var(--gd-ink-soft); font-size: clamp(1.1rem, 1rem + 0.45vw, 1.35rem); line-height: 1.5; }
.site[data-look="gardener"] .btn { border-radius: 0.45rem; font-weight: 700; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.site[data-look="gardener"] .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 6px 0 -2px rgb(24 35 27 / 0.25); text-decoration: none; }
.site[data-look="gardener"] :focus-visible { outline-color: currentColor; }

/* --- Header: over the planting on the home page, a strip of hedge elsewhere */
.site[data-look="gardener"] .site-header { --text: var(--gd-on-green); --bg: var(--gd-hedge); background: var(--gd-hedge-tex); color: var(--gd-on-green); border-bottom: 0; }
.site[data-look="gardener"] .brand { font-size: calc(clamp(1.2rem, 1rem + 0.6vw, 1.6rem) * var(--heading-scale)); }
.site[data-look="gardener"] .site-header nav a { color: var(--gd-on-green); font-weight: 600; }
.site[data-look="gardener"] .site-header .btn-primary { background: var(--gd-label); color: var(--gd-hedge); border-color: var(--gd-label); }
.site[data-look="gardener"]:has(> main > .gd-hero.has-photo:first-child) > .site-header { position: absolute; inset: 0 0 auto; background: transparent; text-shadow: 0 1px 12px rgb(0 0 0 / 0.45); }
.site[data-look="gardener"]:has(> main > .gd-hero.has-photo:first-child) > .site-header .btn { text-shadow: none; }

/* --- Hero: the garden, the big label, the soil ------------------------------ */
.site[data-look="gardener"] .gd-hero {
  --soil-h: clamp(4.25rem, 3rem + 3vw, 5.75rem);
  position: relative; isolation: isolate; padding: 0;
  min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end;
  background: var(--gd-hedge-tex);
}
.site[data-look="gardener"] .gd-hero-photo { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.site[data-look="gardener"] .gd-hero-img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.site[data-look="gardener"] .gd-hero-hedge { position: absolute; inset: 0; background: var(--gd-hedge-tex); }
/* Shade under the header so its white name reads on any planting. */
.site[data-look="gardener"] .gd-hero.has-photo .gd-hero-photo::after { content: ''; position: absolute; inset: 0 0 auto; height: 10rem; background: linear-gradient(rgb(12 22 15 / 0.55), rgb(12 22 15 / 0)); }
.site[data-look="gardener"] .gd-hero-inner { position: relative; z-index: 2; padding-top: clamp(6rem, 14vh, 10rem); }
.site[data-look="gardener"] .gd-tag {
  --pt: clamp(1.25rem, 0.8rem + 2.2vw, 3rem); --px: clamp(1.25rem, 0.8rem + 2.6vw, 3.25rem);
  --sw: clamp(3.75rem, 2rem + 6vw, 7.5rem); --taper: clamp(1.25rem, 0.5rem + 2.5vw, 3rem);
  display: flex; flex-direction: column; align-items: flex-start; width: min(100%, 54rem);
  filter: drop-shadow(0 28px 26px rgb(8 16 10 / 0.42));
}
/* One piece of white plastic: the printed top tapering into the stake. */
.site[data-look="gardener"] .gd-tag-card {
  position: relative; width: 100%;
  background: var(--gd-label); color: var(--gd-ink);
  border-radius: 1.6rem 1.6rem 0 0;
  padding: var(--pt) var(--px) calc(clamp(1rem, 0.6rem + 1.4vw, 1.9rem) + var(--taper));
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--taper)), calc(50% + var(--sw) / 2) 100%, calc(50% - var(--sw) / 2) 100%, 0 calc(100% - var(--taper)));
}
/* The punched hole at the top of a kwekerij label. */
.site[data-look="gardener"] .gd-tag-card::before { content: ''; position: absolute; z-index: 1; top: 0.95rem; right: calc(var(--px) * 0.6); width: 1rem; height: 1rem; border-radius: 50%; background: var(--gd-hedge-dark); box-shadow: 0 0 0 2px rgb(255 255 255 / 0.85); }
/* The grower's printed band across the top of the label. */
.site[data-look="gardener"] .gd-tag-imprint {
  display: block; margin: calc(-1 * var(--pt)) calc(-1 * var(--px)) clamp(1rem, 2.5vw, 1.75rem); padding: 0.75rem calc(var(--px) + 2rem) 0.7rem var(--px);
  background: var(--gd-name); color: #ffffff; border-radius: inherit;
  font-weight: 700; font-size: clamp(0.88rem, 0.82rem + 0.25vw, 1.02rem); letter-spacing: 0.05em; font-variant-numeric: tabular-nums;
}
.site[data-look="gardener"] .gd-hero h1 {
  font-size: calc(clamp(2.6rem, 1.3rem + 5.6vw, 7.25rem) * var(--heading-scale, 1));
  line-height: 0.95; letter-spacing: -0.025em; margin: 0 0 0.3em; color: var(--gd-ink); max-width: none;
}
.site[data-look="gardener"] .gd-hero.is-long h1 { font-size: calc(clamp(2.2rem, 1.3rem + 3.6vw, 5rem) * var(--heading-scale, 1)); line-height: 1; }
.site[data-look="gardener"] .gd-tag-care { font-size: clamp(1.08rem, 1rem + 0.45vw, 1.4rem); line-height: 1.45; color: var(--gd-ink-soft); max-width: 36rem; margin: 0; }
.site[data-look="gardener"] .gd-hero .actions { margin-top: clamp(1.1rem, 2.5vw, 2rem); }
.site[data-look="gardener"] .gd-hero .btn { min-height: 54px; padding-inline: 1.6rem; font-size: 1.08rem; }
.site[data-look="gardener"] .gd-hero .cta-alt { color: var(--gd-ink); }
/* The stake: the label's own plastic narrowing to a point, into the soil. */
.site[data-look="gardener"] .gd-stake {
  display: block; flex: none; align-self: center; position: relative; z-index: 0;
  width: 2.75rem; height: 4.5rem; margin-top: -1px;
  background: linear-gradient(90deg, #e7ece0, #ffffff 30%, #ffffff 65%, #dfe6d7);
  clip-path: polygon(0 0, 100% 0, 100% 74%, 50% 100%, 0 74%);
}
.site[data-look="gardener"] .gd-tag .gd-stake { width: var(--sw); height: calc(var(--soil-h) + 2.75rem); margin-top: -1px; margin-bottom: calc(-1 * var(--soil-h) + 0.6rem); background: var(--gd-label); clip-path: polygon(0 0, 100% 0, 100% 78%, 50% 100%, 0 78%); }
/* Soil: crumbly, its top edge broken into clods. */
.site[data-look="gardener"] .gd-soil { background: var(--gd-soil-tex); }
.site[data-look="gardener"] .gd-hero-soil {
  position: relative; z-index: 3; height: var(--soil-h); margin-top: -0.75rem;
  -webkit-mask: var(--gd-edge); mask: var(--gd-edge);
}

/* --- Claims: small labels stuck in the soil ----------------------------------- */
.site[data-look="gardener"] .gd-trust { background: var(--gd-soil-tex); color: var(--gd-ink); padding-block: 0.25rem clamp(1.75rem, 4vw, 2.75rem); margin-top: -1px; }
.site[data-look="gardener"] .gd-pegs { display: flex; flex-wrap: wrap; gap: 1.6rem clamp(1rem, 2.5vw, 2rem); align-items: flex-end; }
.site[data-look="gardener"] .gd-pegs li { display: flex; flex-direction: column; align-items: center; }
.site[data-look="gardener"] .gd-peg {
  display: block; background: var(--gd-label); color: var(--gd-ink);
  padding: 0.55rem 1rem 0.5rem; border-radius: 0.6rem 0.6rem 0.2rem 0.2rem;
  font-weight: 700; font-size: 1.02rem; line-height: 1.25; text-align: center;
}
.site[data-look="gardener"] .gd-pegs li::after { content: ''; width: 0.9rem; height: 1.2rem; background: linear-gradient(#ffffff 35%, rgb(255 255 255 / 0)); clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%); }
.site[data-look="gardener"] .gd-pegs li:nth-child(odd) { rotate: -1.5deg; }
.site[data-look="gardener"] .gd-pegs li:nth-child(3n) { rotate: 1.2deg; }

/* --- Services: the nursery bed of steeketiketten ----------------------------- */
.site[data-look="gardener"] .gd-services { background: var(--gd-leaf); padding-bottom: 0; }
.site[data-look="gardener"] .gd-services-head { display: grid; gap: 1rem clamp(2rem, 5vw, 5rem); align-items: end; margin-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.site[data-look="gardener"] .gd-services-head :is(h1, h2) { margin: 0; }
@media (min-width: 64rem) { .site[data-look="gardener"] .gd-services-head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.site[data-look="gardener"] .gd-services-intro .lead { margin-bottom: 1rem; }
.site[data-look="gardener"] .gd-key { margin: 0; font-size: 0.95rem; color: var(--gd-ink-soft); max-width: 36rem; }
.site[data-look="gardener"] .gd-key-marks { display: inline-flex; flex-wrap: wrap; gap: 0.3rem 1rem; margin-top: 0.4rem; font-weight: 700; }
.site[data-look="gardener"] :is(.gd-key-best, .gd-key-also)::before { content: ''; display: inline-block; width: 0.85rem; height: 0.85rem; margin-right: 0.4rem; vertical-align: -0.08rem; border-radius: 2px; background: var(--gd-name); }
.site[data-look="gardener"] .gd-key-also::before { background: #b5d0a4; }
.site[data-look="gardener"] .gd-bed { padding-bottom: clamp(3rem, 6vw, 5rem); }
.site[data-look="gardener"] .gd-labels {
  display: grid; gap: clamp(3rem, 5vw, 4rem) clamp(1.25rem, 2.2vw, 2rem);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 16.5rem), 1fr));
  padding-top: 1rem;
}
.site[data-look="gardener"] .gd-bed { overflow-x: clip; }
.site[data-look="gardener"] .gd-labels.is-few { grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 24rem)); }
.site[data-look="gardener"] .gd-label {
  --tilt: -2.5deg; position: relative; display: flex; flex-direction: column; align-items: center; padding-bottom: 0.6rem;
  /* Labels from different trays: white, cream and black plastic, a round
     or an arched top, pushed into the soil at different depths. */
  --tag: var(--gd-label); --tag-edge: var(--gd-line); --tag-name: var(--gd-name); --tag-soft: var(--gd-ink-soft); --tag-ink: var(--gd-ink);
  --cut: 1rem 1rem 0.3rem 0.3rem; --depth: 4.25rem;
}
.site[data-look="gardener"] .gd-label:nth-child(even) { --tilt: 2deg; --cut: 50% 50% 0.3rem 0.3rem / 1.5rem 1.5rem 0.3rem 0.3rem; --depth: 3.25rem; }
.site[data-look="gardener"] .gd-label:nth-child(3n) { --tilt: -1.2deg; --tag: var(--label-black); --tag-edge: #101812; --tag-name: var(--label-black-name); --tag-soft: var(--label-black-soft); --tag-ink: var(--label-black-ink); --depth: 5rem; }
.site[data-look="gardener"] .gd-label:nth-child(3n + 2) { --tag: var(--label-cream); --tag-edge: #d8cca8; --tag-name: var(--label-cream-name); --tag-soft: var(--label-cream-soft); --tag-ink: var(--label-cream-ink); }
.site[data-look="gardener"] .gd-label:nth-child(5n + 4) { --depth: 2.75rem; }
.site[data-look="gardener"] .gd-label-piece { flex: 1; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; transform-origin: 50% 100%; transition: transform 0.35s cubic-bezier(0.3, 1.4, 0.5, 1); }
/* One row of soil across the page under each row of labels (each label
   draws the whole row; the bed clips it at the page edge). */
.site[data-look="gardener"] .gd-label::after {
  content: ''; position: absolute; z-index: 1; left: -100vw; right: -100vw; bottom: 0; height: 2.4rem;
  background: var(--gd-soil-tex); -webkit-mask: var(--gd-edge); mask: var(--gd-edge);
}
.site[data-look="gardener"] .gd-label-card {
  position: relative; width: 100%; display: flex; flex-direction: column;
  background: var(--tag); color: var(--tag-ink);
  border-radius: var(--cut); padding: 1.5rem 1.35rem 1.25rem;
  /* The plastic's own edge and thickness, no soft drop shadow. */
  box-shadow: 0 0 0 1px var(--tag-edge), inset 0 -3px 0 rgb(0 0 0 / 0.07);
}
.site[data-look="gardener"] .gd-label .gd-stake { height: var(--depth); background: linear-gradient(90deg, color-mix(in srgb, var(--tag) 86%, #000), var(--tag) 30%, var(--tag) 65%, color-mix(in srgb, var(--tag) 88%, #000)); }
.site[data-look="gardener"] .gd-label:hover .gd-label-piece { transform: translateY(-0.7rem); }
.site[data-look="gardener"] .gd-label-card:has(.gd-sticker) { padding-top: 2.75rem; }
.site[data-look="gardener"] .gd-label-name {
  font-family: var(--font-body); font-weight: 800; letter-spacing: -0.01em; text-transform: none;
  font-size: clamp(1.35rem, 1.2rem + 0.4vw, 1.6rem); line-height: 1.12; color: var(--tag-name); margin: 0 0 0.55rem;
  overflow-wrap: break-word;
}
.site[data-look="gardener"] .gd-label-care { font-size: 1.0625rem; line-height: 1.5; color: var(--tag-soft); margin: 0 0 1rem; }
.site[data-look="gardener"] .gd-sticker {
  position: absolute; top: -0.95rem; right: 1rem; z-index: 1; margin: 0;
  display: grid; justify-items: center; min-width: 5.5rem; max-width: 7.5rem; padding: 0.45rem 0.6rem 0.5rem;
  background: var(--gd-sticker); color: var(--gd-ink); border-radius: 0.35rem; rotate: 4deg;
  box-shadow: 0 1px 0 rgb(0 0 0 / 0.12), 0 6px 10px -6px rgb(0 0 0 / 0.35);
  font-weight: 800; font-size: 1.2rem; line-height: 1.05; text-align: center; font-variant-numeric: tabular-nums;
}
.site[data-look="gardener"] .gd-sticker :is(.price-from, .price-unit) { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.site[data-look="gardener"] .gd-sticker .price-amount { white-space: nowrap; }
/* The month strip, as printed for flowering time on a nursery label. */
.site[data-look="gardener"] .gd-months { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2px; margin-top: auto; padding-top: 0.25rem; }
.site[data-look="gardener"] .gd-months span { display: block; padding: 0.22rem 0 0.18rem; text-align: center; font-size: 0.7rem; font-weight: 700; line-height: 1; background: #eef1e8; color: #4d5a51; }
.site[data-look="gardener"] .gd-months span:first-child { border-radius: 3px 0 0 3px; }
.site[data-look="gardener"] .gd-months span:last-child { border-radius: 0 3px 3px 0; }
.site[data-look="gardener"] .gd-months .is-best { background: var(--gd-name); color: #ffffff; }
.site[data-look="gardener"] .gd-months .is-also { background: #b5d0a4; color: var(--gd-ink); }

/* --- Gallery: a walk through the garden ------------------------------------ */
.site[data-look="gardener"] .s-gallery { background: var(--gd-hedge-tex); color: var(--gd-on-green); padding-bottom: 0; }
.site[data-look="gardener"] .gd-gallery-head :is(h1, h2) { color: var(--gd-on-green); margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.site[data-look="gardener"] .s-gallery .gallery-items { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: clamp(10rem, 4rem + 13vw, 17rem); grid-auto-flow: dense; gap: 6px; }
.site[data-look="gardener"] .s-gallery .gallery-items li { position: relative; overflow: hidden; grid-column: span 4; grid-row: span 2; background: var(--gd-hedge-dark); }
.site[data-look="gardener"] .s-gallery .gallery-items img { width: 100%; height: 100%; max-width: none; object-fit: cover; transition: scale 0.8s ease; }
.site[data-look="gardener"] .s-gallery .gallery-items li:hover img { scale: 1.04; }
.site[data-look="gardener"] .gallery-items li:nth-child(6n + 1) { grid-column: span 7; }
.site[data-look="gardener"] .gallery-items li:nth-child(6n + 2), .site[data-look="gardener"] .gallery-items li:nth-child(6n + 3) { grid-column: span 5; grid-row: span 1; }
.site[data-look="gardener"] .s-gallery[data-count="2"] .gallery-items li { grid-column: span 6; }
.site[data-look="gardener"] .s-gallery[data-count="4"] .gallery-items li:nth-child(4) { grid-column: span 12; }
.site[data-look="gardener"] .s-gallery[data-count="5"] .gallery-items li:nth-child(n + 4) { grid-column: span 6; }
.site[data-look="gardener"] .s-gallery[data-count="many"] .gallery-items li:nth-child(n + 7) { grid-column: span 4; grid-row: span 1; }
/* The photo's description on a kwekerij hang tag: notched end, punched hole. */
.site[data-look="gardener"] .gd-hangtag {
  position: absolute; left: clamp(0.75rem, 2vw, 1.25rem); bottom: clamp(0.75rem, 2vw, 1.25rem); max-width: calc(100% - 2.5rem);
  padding: 0.4rem 0.8rem 0.4rem 1.75rem; background: var(--gd-label); color: var(--gd-ink);
  font-weight: 700; font-size: 0.92rem; line-height: 1.25;
  clip-path: polygon(0.75rem 0, 100% 0, 100% 100%, 0.75rem 100%, 0 50%);
  rotate: -2deg; transform-origin: 0 50%; transition: rotate 0.4s ease;
}
.site[data-look="gardener"] .gd-hangtag::before { content: ''; position: absolute; left: 0.7rem; top: 50%; width: 0.5rem; height: 0.5rem; margin-top: -0.25rem; border-radius: 50%; background: var(--gd-hedge); }
.site[data-look="gardener"] .s-gallery li:hover .gd-hangtag { rotate: 1deg; }

/* --- About: the drawing table ----------------------------------------------- */
.site[data-look="gardener"] .gd-about { background: var(--gd-grid); padding-top: 0; }
.site[data-look="gardener"] .gd-about:not(.has-photo) { padding-top: var(--section-pad); }
.site[data-look="gardener"] .gd-about-photo { height: clamp(15rem, 6rem + 30vw, 36rem); overflow: hidden; }
.site[data-look="gardener"] .gd-about-img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.site[data-look="gardener"] .gd-about-inner { display: grid; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.site[data-look="gardener"] .gd-about.has-photo .gd-about-inner { padding-top: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 64rem) {
  .site[data-look="gardener"] .gd-about-inner { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .site[data-look="gardener"] .gd-about.has-photo .gd-plan { margin-top: clamp(-14rem, -12vw, -6rem); }
}
.site[data-look="gardener"] .gd-about-text p { font-size: clamp(1.06rem, 1rem + 0.25vw, 1.2rem); line-height: 1.6; max-width: 34rem; }
.site[data-look="gardener"] .gd-about-text p:first-of-type { font-size: clamp(1.2rem, 1.05rem + 0.55vw, 1.5rem); line-height: 1.45; color: var(--gd-ink); }
.site[data-look="gardener"] .gd-plan { position: relative; margin: 0; background: #ffffff; padding: clamp(0.75rem, 2vw, 1.5rem); box-shadow: 0 0 0 1px #c6cfbd, 0 40px 60px -40px rgb(24 35 27 / 0.55); }
.site[data-look="gardener"] .gd-plan-drawing { display: block; width: 100%; height: auto; font-family: var(--font-body); }
.site[data-look="gardener"] .gd-plan-drawing :is(.pl-edge) { fill: none; stroke: var(--gd-plan-ink); stroke-width: 1.5; }
.site[data-look="gardener"] .gd-plan-drawing pattern :is(line, path) { stroke: var(--gd-plan-ink); stroke-width: 0.7; fill: none; }
.site[data-look="gardener"] .gd-plan-drawing .pl-house { stroke: var(--gd-plan-ink); stroke-width: 1.6; }
.site[data-look="gardener"] .gd-plan-drawing .pl-terrace { stroke: var(--gd-plan-ink); stroke-width: 1.2; }
.site[data-look="gardener"] .gd-plan-drawing .pl-lawn { stroke: var(--gd-plan-ink); stroke-width: 1; }
.site[data-look="gardener"] .gd-plan-drawing .pl-hedge { stroke: var(--gd-plan-ink); stroke-width: 1.1; }
.site[data-look="gardener"] .gd-plan-drawing .pl-tree { fill: rgb(47 107 58 / 0.12); stroke: var(--gd-plan-ink); stroke-width: 1.2; }
.site[data-look="gardener"] .gd-plan-drawing .pl-trunk { fill: var(--gd-plan-ink); }
.site[data-look="gardener"] .gd-plan-drawing .pl-group circle { fill: rgb(47 107 58 / 0.1); stroke: var(--gd-plan-ink); stroke-width: 0.8; }
.site[data-look="gardener"] .gd-plan-drawing .pl-group:nth-of-type(odd) circle { fill: rgb(122 92 160 / 0.14); }
.site[data-look="gardener"] .gd-plan-drawing circle.pl-code-ring { fill: #ffffff; stroke: var(--gd-plan-ink); stroke-width: 1; }
.site[data-look="gardener"] .gd-plan-drawing .pl-code { font-size: 10px; font-weight: 800; text-anchor: middle; fill: var(--gd-plan-ink); }
.site[data-look="gardener"] .gd-plan-drawing .pl-label { font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; text-anchor: middle; fill: #4b5a4f; }
.site[data-look="gardener"] .gd-plan-drawing .pl-label-small { font-size: 9px; }
.site[data-look="gardener"] .gd-plan-drawing .pl-north path { fill: var(--gd-plan-ink); }
.site[data-look="gardener"] .gd-plan-drawing :is(.pl-north, .pl-scale) text { font-size: 10px; font-weight: 700; text-anchor: middle; fill: var(--gd-plan-ink); }
.site[data-look="gardener"] .gd-plan-drawing .pl-scale path { stroke: var(--gd-plan-ink); stroke-width: 1.2; fill: none; }
.site[data-look="gardener"] .gd-plan-foot { display: grid; gap: 1rem 1.5rem; margin-top: 1rem; align-items: start; }
@media (min-width: 40rem) { .site[data-look="gardener"] .gd-plan-foot { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.site[data-look="gardener"] .gd-plan-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; font-size: 0.92rem; line-height: 1.25; }
.site[data-look="gardener"] .gd-plan-legend li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.5rem; align-items: start; }
.site[data-look="gardener"] .gd-plan-legend li > span:last-child { display: grid; }
.site[data-look="gardener"] .gd-plan-legend i { font-weight: 700; }
.site[data-look="gardener"] .gd-plan-common { color: var(--gd-ink-soft); }
.site[data-look="gardener"] .gd-plan-code { display: inline-grid; place-items: center; width: 1.35rem; height: 1.35rem; border: 1px solid var(--gd-plan-ink); border-radius: 50%; font-size: 0.72rem; font-weight: 800; vertical-align: 0.05rem; }
.site[data-look="gardener"] .gd-cartouche { margin: 0; border: 1.5px solid var(--gd-plan-ink); font-size: 0.9rem; line-height: 1.3; }
.site[data-look="gardener"] .gd-cartouche div { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); }
.site[data-look="gardener"] .gd-cartouche div + div { border-top: 1px solid var(--gd-plan-ink); }
.site[data-look="gardener"] .gd-cartouche dt { padding: 0.35rem 0.55rem; border-right: 1px solid var(--gd-plan-ink); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gd-ink-soft); }
.site[data-look="gardener"] .gd-cartouche dd { margin: 0; padding: 0.35rem 0.55rem; font-weight: 700; overflow-wrap: break-word; hyphens: auto; font-variant-numeric: tabular-nums; }
.site[data-look="gardener"] .gd-cartouche div:first-child dd { font-family: var(--font-heading); font-weight: var(--heading-weight); font-size: 1.1rem; }

/* --- Reviews: set large on the mown lawn ------------------------------------ */
.site[data-look="gardener"] .gd-reviews {
  --text: var(--gd-on-green); color: var(--gd-on-green);
  background:
    radial-gradient(circle at 30% 40%, rgb(255 255 255 / 0.05) 0 1px, transparent 1.6px) 0 0 / 7px 9px,
    radial-gradient(circle at 70% 70%, rgb(0 0 0 / 0.08) 0 1.2px, transparent 1.8px) 3px 2px / 9px 8px,
    repeating-linear-gradient(90deg, var(--gd-lawn-a) 0 clamp(4.5rem, 10vw, 9rem), var(--gd-lawn-b) clamp(4.5rem, 10vw, 9rem) clamp(9rem, 20vw, 18rem));
  padding-block: clamp(3.25rem, 9vw, 8rem);
}
.site[data-look="gardener"] .gd-reviews :is(h1, h2) { color: var(--gd-on-green); margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.site[data-look="gardener"] .gd-quotes { display: grid; gap: clamp(2.5rem, 5vw, 4rem) clamp(2rem, 5vw, 5rem); }
@media (min-width: 52rem) { .site[data-look="gardener"] .gd-quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .site[data-look="gardener"] .gd-quotes > li:first-child { grid-column: 1 / -1; } }
.site[data-look="gardener"] .gd-quotes figure { margin: 0; }
.site[data-look="gardener"] .gd-quotes blockquote { margin: 0; }
.site[data-look="gardener"] .gd-quotes blockquote p { font-family: var(--font-heading); font-weight: var(--heading-weight); font-size: clamp(1.45rem, 1.15rem + 1.2vw, 2.2rem); line-height: 1.22; letter-spacing: -0.01em; margin: 0 0 1.1rem; text-indent: -0.4em; }
.site[data-look="gardener"] .gd-quotes > li:first-child blockquote p { font-size: clamp(1.8rem, 1.1rem + 2.9vw, 4rem); line-height: 1.1; max-width: 24em; }
.site[data-look="gardener"] .gd-quotes blockquote p::before { content: '„'; }
.site[data-look="gardener"] .gd-quotes blockquote p::after { content: '”'; }
.site[data-look="gardener"] .gd-quotes figcaption {
  display: inline-block; padding: 0.3rem 0.8rem 0.3rem 0.7rem; background: var(--gd-label); color: var(--gd-ink);
  border-radius: 0.3rem; font-weight: 700; font-size: 0.98rem;
}

/* --- Werkgebied: stepping stones through the gravel ------------------------- */
.site[data-look="gardener"] .gd-area { background: var(--gd-gravel-tex); color: var(--gd-ink); padding-block: clamp(3.25rem, 8vw, 7rem); overflow: clip; }
.site[data-look="gardener"] .gd-area-inner { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 64rem) { .site[data-look="gardener"] .gd-area-inner { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); } }
/* The text on the lawn's edge, behind a strip of wooden edging. */
.site[data-look="gardener"] .gd-area-text { position: relative; background: var(--gd-paper); box-shadow: 0 0 0 100vmax var(--gd-paper); clip-path: inset(-100vmax -100vmax calc(-1 * clamp(2rem, 5vw, 4rem) + 0.5rem) -100vmax); padding-bottom: 0.5rem; }
.site[data-look="gardener"] .gd-area-text::after { content: ''; position: absolute; left: -100vmax; right: -100vmax; bottom: calc(-1 * clamp(2rem, 5vw, 4rem) + 0.5rem); height: 0.6rem; background: linear-gradient(#8a6a4a, #5f4630); }
@media (min-width: 64rem) {
  .site[data-look="gardener"] .gd-area-text { clip-path: inset(-100vmax calc(-1 * clamp(2rem, 5vw, 4rem) / 2) -100vmax -100vmax); padding-bottom: 0; }
  .site[data-look="gardener"] .gd-area-text::after { left: auto; right: calc(-1 * clamp(2rem, 5vw, 4rem) / 2); top: -100vmax; bottom: -100vmax; width: 0.6rem; height: auto; background: linear-gradient(90deg, #8a6a4a, #5f4630); }
}
.site[data-look="gardener"] .gd-area-text .lead { margin: 0; color: var(--gd-ink); }
.site[data-look="gardener"] .gd-area-text :is(h1, h2) { font-size: calc(clamp(2.4rem, 1.6rem + 3vw, 4.5rem) * var(--heading-scale, 1)); }
.site[data-look="gardener"] .gd-stones { display: flex; flex-wrap: wrap; gap: 0.6rem clamp(0.9rem, 1.8vw, 1.5rem); align-items: flex-start; }
.site[data-look="gardener"] .gd-stone { filter: drop-shadow(0 3px 0 rgb(70 62 50 / 0.35)) drop-shadow(0 8px 10px rgb(40 32 20 / 0.3)); }
.site[data-look="gardener"] .gd-stone span {
  --shape: polygon(4% 18%, 22% 3%, 51% 0, 80% 5%, 97% 22%, 100% 58%, 90% 88%, 62% 100%, 30% 97%, 8% 86%, 0 52%);
  display: block; clip-path: var(--shape);
  padding: clamp(1rem, 2vw, 1.5rem) clamp(1.4rem, 2.6vw, 2.25rem);
  background: linear-gradient(160deg, var(--stone-hi, #d8d6ce), var(--stone, #c0bdb3) 55%, var(--stone-lo, #aeaba1));
  font-family: var(--font-heading); font-weight: var(--heading-weight); font-size: clamp(1.15rem, 1rem + 0.7vw, 1.65rem); line-height: 1.1; text-align: center;
  color: var(--gd-ink);
}
.site[data-look="gardener"] .gd-stone:nth-child(4n + 2) { margin-top: 1.4rem; --stone-hi: #cfd3d2; --stone: #b6bcbc; --stone-lo: #a3aaab; }
.site[data-look="gardener"] .gd-stone:nth-child(4n + 2) span { --shape: polygon(0 30%, 12% 6%, 45% 0, 76% 3%, 96% 16%, 100% 50%, 94% 84%, 70% 98%, 36% 100%, 10% 92%, 2% 68%); }
.site[data-look="gardener"] .gd-stone:nth-child(4n + 3) { margin-top: 0.4rem; --stone-hi: #ddd4c2; --stone: #c9bea8; --stone-lo: #b8ac94; }
.site[data-look="gardener"] .gd-stone:nth-child(4n + 3) span { --shape: polygon(6% 10%, 34% 0, 68% 4%, 92% 0, 100% 34%, 97% 72%, 84% 96%, 50% 100%, 18% 94%, 0 70%, 2% 36%); }
.site[data-look="gardener"] .gd-stone:nth-child(4n) { margin-top: 1rem; }
.site[data-look="gardener"] .gd-stone:nth-child(4n) span { --shape: polygon(0 20%, 20% 0, 58% 6%, 88% 0, 100% 28%, 98% 66%, 86% 100%, 48% 94%, 14% 100%, 0 76%); }
.site[data-look="gardener"] .gd-stone.is-home span { font-size: clamp(1.45rem, 1.1rem + 1.5vw, 2.5rem); padding: clamp(1.2rem, 2.4vw, 1.9rem) clamp(1.8rem, 3.6vw, 3.2rem); }

/* --- Questions: on label paper, each answer under a row of plants ----------- */
.site[data-look="gardener"] .s-faq { background: var(--gd-label); }
@media (min-width: 64rem) {
  .site[data-look="gardener"] .s-faq > .wrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
  .site[data-look="gardener"] .s-faq > .wrap > :is(h1, h2) { position: sticky; top: 2rem; }
}
.site[data-look="gardener"] .faq-items { max-width: none; margin-top: 0; }
.site[data-look="gardener"] .faq-items :is(details, dl > div) {
  border: 0; padding-top: 0.25rem;
  background: radial-gradient(circle, var(--gd-name) 0 3px, transparent 3.5px) 0 0 / 1.1rem 0.5rem repeat-x;
}
.site[data-look="gardener"] .faq-items details:first-child { border-top: 0; }
.site[data-look="gardener"] .faq-items summary { font-family: var(--font-heading); font-weight: var(--heading-weight); font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.7rem); line-height: 1.2; padding-block: 1.1rem; min-height: 4rem; }
.site[data-look="gardener"] .faq-items summary::after {
  content: ''; width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 1.5px solid var(--gd-name);
  background: linear-gradient(var(--gd-name), var(--gd-name)) center / 0.9rem 2px no-repeat, linear-gradient(var(--gd-name), var(--gd-name)) center / 2px 0.9rem no-repeat;
  transition: transform 0.3s ease;
}
.site[data-look="gardener"] .faq-items details[open] summary::after { content: ''; transform: rotate(45deg); }
.site[data-look="gardener"] .faq-items summary:hover { color: var(--gd-name); }
.site[data-look="gardener"] .faq-items details p, .site[data-look="gardener"] .faq-items dd { color: var(--gd-ink-soft); font-size: 1.0625rem; max-width: 40rem; }
.site[data-look="gardener"] .faq-items dt { font-family: var(--font-heading); font-weight: var(--heading-weight); font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.6rem); padding-top: 1.1rem; }
.site[data-look="gardener"] .faq-items dd { margin-bottom: 1.25rem; }

/* --- Hours: the hang tag ------------------------------------------------------ */
.site[data-look="gardener"] .s-hours { background: var(--gd-leaf); }
@media (min-width: 52rem) { .site[data-look="gardener"] .hours-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); align-items: center; } }
.site[data-look="gardener"] .hours-call { font-family: var(--font-heading); font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2.2rem); }
.site[data-look="gardener"] .hours-card {
  position: relative; max-width: 26rem; width: 100%; justify-self: center;
  background: var(--gd-label); color: var(--gd-ink); padding: 3.6rem clamp(1.25rem, 3vw, 2rem) 1.5rem;
  border-radius: 1.3rem 1.3rem 0.4rem 0.4rem; rotate: -1.5deg;
  box-shadow: 0 0 0 1px var(--gd-line), 0 30px 40px -30px rgb(24 35 27 / 0.5);
}
.site[data-look="gardener"] .hours-card::before { content: ''; position: absolute; top: 1.2rem; left: 50%; width: 1.1rem; height: 1.1rem; margin-left: -0.55rem; border-radius: 50%; background: var(--gd-leaf); box-shadow: inset 0 0 0 2px #a8b49e; }
.site[data-look="gardener"] .hours-card::after { content: ''; position: absolute; bottom: calc(100% - 1.75rem); left: 50%; width: 2px; height: 4rem; background: #8a7a5c; transform-origin: bottom; rotate: 12deg; }
.site[data-look="gardener"] .hours-table th, .site[data-look="gardener"] .hours-table td { border-bottom-color: var(--gd-line); font-size: 1.05rem; }
.site[data-look="gardener"] .hours-table td { white-space: nowrap; }
.site[data-look="gardener"] .hours-table th::before { background: var(--gd-name) !important; }
.site[data-look="gardener"] .hours-table th::after { background: var(--gd-name) !important; color: #ffffff !important; }
.site[data-look="gardener"] .hours-place { font-size: 1.0625rem; color: var(--gd-ink-soft); }
.site[data-look="gardener"] .hours-table th { white-space: normal; }

/* --- Call to action: in front of the clipped hedge ---------------------------- */
.site[data-look="gardener"] .gd-cta { position: relative; isolation: isolate; overflow: hidden; background: var(--gd-hedge-tex); padding-block: clamp(3.25rem, 10vw, 9rem); }
.site[data-look="gardener"] .gd-cta-img { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 35% 50%; }
.site[data-look="gardener"] .gd-cta-card { max-width: 40rem; background: var(--gd-label); color: var(--gd-ink); padding: clamp(1.5rem, 4vw, 3rem); border-radius: 1.3rem 1.3rem 0.35rem 0.35rem; }
.site[data-look="gardener"] .gd-cta-card :is(h1, h2) { font-size: calc(clamp(2rem, 1.4rem + 2.4vw, 3.6rem) * var(--heading-scale, 1)); }
.site[data-look="gardener"] .gd-cta-card p { font-size: var(--fs-lead); color: var(--gd-ink-soft); }
.site[data-look="gardener"] .gd-cta-card .btn { min-height: 52px; }

/* --- Contact: on the soil, the request on a white sheet -------------------- */
.site[data-look="gardener"] .s-contact {
  --text: var(--gd-on-soil); --muted: var(--gd-on-soil-soft); --border: rgb(244 239 230 / 0.25); --ink-line: 1.5px solid rgb(244 239 230 / 0.6);
  background: var(--gd-soil-tex); color: var(--gd-on-soil); padding-block: clamp(3.25rem, 8vw, 7rem) clamp(3.25rem, 7vw, 6rem);
}
.site[data-look="gardener"] .s-contact .contact-details > :is(h1, h2) { color: var(--gd-on-soil); }
.site[data-look="gardener"] .s-contact .lead { color: var(--gd-on-soil-soft); }
.site[data-look="gardener"] .s-contact .contact-value { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.6rem); }
.site[data-look="gardener"] .s-contact .contact-list li:first-child .contact-value { font-size: clamp(2rem, 1.2rem + 3.2vw, 4rem); }
.site[data-look="gardener"] .s-contact .contact-label { font-weight: 700; letter-spacing: 0.04em; }
.site[data-look="gardener"] :is(.contact-form, .request-form) {
  --text: var(--gd-ink); --muted: var(--gd-ink-soft); --bg: var(--gd-label); --surface: var(--gd-leaf);
  color: var(--gd-ink); background: var(--gd-label); border: 0; border-radius: 1.3rem 1.3rem 0.35rem 0.35rem;
  padding: clamp(1.25rem, 3.5vw, 2.5rem);
  box-shadow: 0 0 0 1px var(--gd-line), 0 40px 60px -40px rgb(0 0 0 / 0.6);
}
.site[data-look="gardener"] :is(.contact-form, .request-form) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), textarea, select) { border: 0; border-bottom: 2px solid #7d8a80; border-radius: 0; background: var(--gd-paper); }
.site[data-look="gardener"] :is(.contact-form, .request-form) :is(input, textarea, select):focus-visible { border-bottom-color: var(--gd-name); outline: 3px solid var(--gd-name); outline-offset: 1px; }
.site[data-look="gardener"] :is(.contact-form, .request-form) .btn-primary { min-height: 54px; }
.site[data-look="gardener"] .s-request { background: var(--gd-grid); }
.site[data-look="gardener"] .s-request .request-form { box-shadow: 0 0 0 1px #c6cfbd, 0 40px 60px -40px rgb(24 35 27 / 0.45); }

/* --- Booking: the plants on the bench, each a label line --------------------- */
.site[data-look="gardener"] .s-booking { background: var(--gd-leaf); }
.site[data-look="gardener"] .booking-services { border-top: 0; display: grid; gap: 0.6rem; }
.site[data-look="gardener"] .booking-services li { border: 0; }
.site[data-look="gardener"] .booking-services a { background: var(--gd-label); padding: 0.9rem 1.2rem; border-radius: 0.8rem 0.8rem 0.25rem 0.25rem; box-shadow: 0 0 0 1px var(--gd-line); transition: transform 0.25s ease; color: var(--gd-ink); }
.site[data-look="gardener"] .booking-services a:hover { transform: translateY(-3px); }

/* --- Footer: the clipped hedge ------------------------------------------------- */
.site[data-look="gardener"] .gd-footer { --deep: var(--gd-hedge); position: relative; z-index: 1; background: var(--gd-hedge-tex); padding-top: clamp(3rem, 6vw, 5rem); }
.site[data-look="gardener"] .gd-hedge-top { position: absolute; left: 0; right: 0; bottom: calc(100% - 1px); height: 1.1rem; background: var(--gd-hedge-tex); -webkit-mask: var(--gd-edge); mask: var(--gd-edge); }
.site[data-look="gardener"] .gd-footer-name { font-family: var(--font-heading); font-weight: var(--heading-weight); font-size: calc(clamp(2.2rem, 1.2rem + 4.4vw, 6.5rem) * var(--heading-scale, 1)); line-height: 0.98; letter-spacing: -0.025em; margin: 0 0 clamp(2rem, 4vw, 3rem); color: var(--gd-on-green); overflow-wrap: break-word; hyphens: auto; max-width: 16em; }
.site[data-look="gardener"] .gd-footer-cols { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); padding-bottom: 2.5rem; }
.site[data-look="gardener"] .gd-footer .footer-title { font-size: 0.85rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gd-on-green-soft); margin-bottom: 0.6rem; }
.site[data-look="gardener"] .gd-footer .footer-col ul { display: grid; gap: 0.35rem; }
.site[data-look="gardener"] .gd-footer .footer-col a { color: var(--gd-on-green); }
.site[data-look="gardener"] .gd-footer .footer-col li { color: var(--gd-on-green); overflow-wrap: anywhere; font-size: 1.0625rem; }
.site[data-look="gardener"] .gd-footer .footer-bottom { border-top: 1px solid rgb(240 244 234 / 0.2); }

/* --- Quick bar on phones: a strip of label --------------------------------- */
@media (max-width: 51.99rem) {
  .site[data-look="gardener"] .quickbar { --on-deep: var(--gd-ink); background: var(--gd-label); border-top: 4px solid var(--gd-soil); }
  .site[data-look="gardener"] .quick { font-weight: 800; font-size: 1.05rem; }
  .site[data-look="gardener"] .quick-primary { background: var(--gd-name); color: #ffffff; }
}

/* --- Phones ------------------------------------------------------------------- */
@media (max-width: 40rem) {
  .site[data-look="gardener"] .gd-hero { --soil-h: 3.75rem; }
  .site[data-look="gardener"] .gd-hero-inner { padding-top: 5.5rem; }
  .site[data-look="gardener"] .gd-tag-card { border-radius: 1.1rem 1.1rem 0.3rem 0.3rem; }
  .site[data-look="gardener"] .gd-tag-card::before { top: 0.85rem; right: 0.9rem; width: 0.7rem; height: 0.7rem; }
  .site[data-look="gardener"] .gd-tag-imprint { font-size: 0.8rem; margin-right: 1.5rem; }
  .site[data-look="gardener"] .gd-hero .actions { gap: 0.25rem 1rem; }
  .site[data-look="gardener"] .gd-hero .btn { width: 100%; }
  .site[data-look="gardener"] .s-gallery .gallery-items { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 8.25rem; gap: 4px; }
  .site[data-look="gardener"] .s-gallery .gallery-items li { grid-column: span 1 !important; grid-row: span 1 !important; }
  .site[data-look="gardener"] .s-gallery .gallery-items li:nth-child(3n + 1) { grid-column: span 2 !important; grid-row: span 2 !important; }
  .site[data-look="gardener"] .gd-hangtag { font-size: 0.8rem; padding-left: 1.5rem; }
  .site[data-look="gardener"] .s-gallery li:not(:nth-child(3n + 1)) .gd-hangtag { display: none; }
  .site[data-look="gardener"] .gd-cartouche div { grid-template-columns: 5.5rem minmax(0, 1fr); }
  .site[data-look="gardener"] .gd-pegs { gap: 1rem 0.75rem; }
  .site[data-look="gardener"] .gd-peg { font-size: 0.95rem; padding: 0.45rem 0.8rem; }
  /* Phones: the labels stand in the bed left and right of a path, shorter
     stakes, less soil between them. */
  .site[data-look="gardener"] .gd-labels { gap: 1.25rem; padding-top: 0.5rem; }
  .site[data-look="gardener"] .gd-label { width: 88%; padding-bottom: 0.3rem; }
  .site[data-look="gardener"] .gd-label:nth-child(even) { justify-self: end; }
  .site[data-look="gardener"] .gd-label .gd-stake { height: calc(var(--depth) * 0.55); width: 2.25rem; }
  .site[data-look="gardener"] .gd-label::after { height: 1.6rem; }
  .site[data-look="gardener"] .gd-label-card { padding: 1.2rem 1.1rem 0.6rem; }
  .site[data-look="gardener"] .gd-label-card:has(.gd-sticker) { padding-top: 2.3rem; }
  .site[data-look="gardener"] .gd-label-care { margin-bottom: 0.5rem; }
  .site[data-look="gardener"] .gd-bed { padding-bottom: 2.5rem; }
  .site[data-look="gardener"] .gd-plan-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem 0.75rem; }
  .site[data-look="gardener"] .gd-quotes { gap: 2rem; }
  .site[data-look="gardener"] .gd-quotes > li:not(:first-child) blockquote p { font-size: 1.25rem; }
}

/* --- Life: labels rise from the soil as they come into view ---------------- */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    /* Never hidden before they move: a page shown without scrolling (the
       gallery frames) sees them a little crooked, never missing. */
    .site[data-look="gardener"] .gd-label-piece { animation: gd-straighten linear forwards; animation-timeline: view(); animation-range: entry 0% cover 40%; }
    .site[data-look="gardener"] .gd-stone { animation: gd-settle linear forwards; animation-timeline: view(); animation-range: entry 0% cover 35%; }
  }
}
@keyframes gd-straighten { from { rotate: var(--tilt, -2deg); } to { rotate: 0deg; } }
@keyframes gd-settle { from { scale: 0.92; } to { scale: 1; } }