/* Timber (Theme Library): a timber yard on kraft paper. Adds the double-ruled masthead, the tape-measure rule under
   headings, grade-stamp eyebrows, end-tag step numbers and the price list by the length. */
:root { --tape: repeating-linear-gradient(90deg, var(--color-primary) 0 1.5px, #0000 0 8px) 0 100% / 100% 7px no-repeat, repeating-linear-gradient(90deg, var(--color-primary) 0 2px, #0000 0 40px) 0 100% / 100% 14px no-repeat; }
.btn { font-weight: 700; letter-spacing: .04em; padding: .95em 1.7em; }
.btn--secondary { border: 2px solid var(--color-heading); color: var(--color-heading); }
.btn--secondary:hover { background: var(--color-heading); color: var(--color-background); }
.btn--primary:hover { background: color-mix(in srgb, var(--color-primary) 80%, #000); }

/* Grade-stamp eyebrow */
.kit-eyebrow, .eyebrow { display: inline-block; width: fit-content; padding: 4px 9px 3px; border: 1.5px solid currentColor; outline: 1px solid currentColor; outline-offset: 2px; color: var(--color-accent); font-weight: 700; font-size: .72rem; letter-spacing: .16em; }

/* Masthead: the yard's name in slab, the menu between a heavy and a light rule */
.hdr-masthead__name { letter-spacing: -.03em; }
.hdr-masthead__nav { border-top: 4px solid var(--color-heading); border-bottom: 1px solid var(--color-heading); box-shadow: inset 0 2px 0 var(--color-background), inset 0 3px 0 var(--color-heading); }
.hdr-masthead .site-nav__link { font-weight: 700; letter-spacing: .1em; font-size: .8rem; }
.hdr-masthead .site-nav__link:hover, .hdr-masthead .site-nav__link[aria-current=page] { color: var(--color-primary); }
.cart-count { background: var(--color-accent); color: var(--color-on-accent); }

/* Headings over a tape-measure rule */
.section-heading { padding-bottom: 18px; background: var(--tape); }
.section-heading h2 { font-size: clamp(2rem, 1.4rem + 2vw, 3rem); }
.section-heading__link { font-weight: 700; color: var(--color-primary); }

/* Story hero: framed photos, numbered captions in pine */
.hero-story h1 { letter-spacing: -.025em; }
.hero-story__media { border: 1.5px solid var(--color-heading); box-shadow: 10px 10px 0 var(--color-background-alt); }
.hero-story__index span, .hero-story__photo figcaption span { color: var(--color-accent); }
.hero-story__photo figcaption { font-weight: 600; }

/* Category cards and boxed product cards on paper */
.category-card { background: #f8f2e7; border: 1.5px solid var(--color-outline); }
.category-card__name { font-family: var(--font-heading-family); font-weight: 600; font-size: 1.12rem; }
.pc--boxed { background: #f8f2e7; border: 1.5px solid var(--color-outline); }
.pc--boxed .pc__title { font-family: var(--font-heading-family); font-weight: 600; font-size: 1.08rem; }
.pc .price__current { font-weight: 700; }
.badge--sale { background: var(--color-sale); border-radius: 0; }

/* Yard prices: dashed rows, slab prices */
.plist__item { border-bottom-style: dashed; } .plist__item:first-child { border-top-style: dashed; }
.plist__price .price { line-height: 1.15; gap: 2px; } .plist__price :is(.price__compare, .price__from) { font: 600 .82rem var(--font-body-family); }
.plist__media { border: 1.5px solid var(--color-outline); border-radius: 0; background: #fff; }
.plist__price { font-family: var(--font-heading-family); font-size: 1.25rem; color: var(--color-primary); }
.plist__price .price__current { color: inherit; }

/* Steps: paper cards with a brown top edge, square end tags */
.steps--cards .step { background: #f8f2e7; border-top: 5px solid var(--color-primary); border-radius: 0; box-shadow: 0 1px 0 var(--color-outline); }
.step::before { border-radius: 0; background: var(--color-accent); font-family: var(--font-heading-family); font-size: 1.1rem; }
.step h3 { font-size: 1.3rem; }
.step p { color: var(--color-text); }

/* Promo tiles: heavy slab headings, a tape rule along the foot */
.twin-promo .promo-tile { min-height: clamp(300px, 32vw, 420px); padding: clamp(22px, 3vw, 40px); }
.promo-tile h2 { font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.6rem) !important; }
.promo-tile .kit-eyebrow { color: inherit; }
.promo-tile--has-image::after { background: linear-gradient(180deg, #2a1d1266, #2a1d12f0 65%); }

.faq summary { font-family: var(--font-heading-family); font-size: 1.15rem; }
.booking-band { border-radius: 0; background-image: repeating-linear-gradient(90deg, #ffffff59 0 1.5px, #0000 0 10px); background-size: 100% 10px; background-repeat: no-repeat; }
.booking-band h2 { font-size: clamp(1.9rem, 1.2rem + 2vw, 3rem); }
.ftr-grid__brand { letter-spacing: -.02em; }
