/* Grainhouse Floors: a warm showroom. Linen white, espresso, one orange. Lato caps headings. */
:root {
  --bg: #faf8f4; --surface: #f3eee6; --surface-2: #e9e1d5; --ink: #2b2622; --muted: #6b625a; --line: rgba(43, 38, 34, .13);
  --accent: #f68e1e; --accent-ink: #1f1408; --accent-text: #a85600;
  --dark: #1f1b18; --dark-2: #2b2622; --on-dark: #faf6f0; --on-dark-muted: rgba(250, 246, 240, .72);
  --font-display: "Lato", system-ui, sans-serif; --font-body: "Lato", system-ui, sans-serif;
  --h-weight: 900; --h-case: uppercase; --h-track: -0.005em; --h-leading: 1;
  --radius: 10px; --radius-sm: 6px; --radius-btn: 6px;
  --shadow: 0 1px 2px rgba(43, 38, 34, .06), 0 18px 40px -22px rgba(43, 38, 34, .35);
  --shadow-lg: 0 40px 90px -36px rgba(31, 27, 24, .55);
  --white: #fff; --orange-soft: #fde7cf;
}
body { font-size: 17.5px; }
[id] { scroll-margin-top: 92px; }
h2 { font-size: clamp(30px, 4.2vw, 54px); }
h3 { text-transform: none; font-weight: 900; letter-spacing: -.01em; }
.i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.k-btn { font-weight: 700; letter-spacing: .02em; }
.k-btn .i { width: 18px; height: 18px; }
.gh-btn-dark { --b: var(--dark); --t: #fff; }
.gh-btn-line { background: transparent; color: var(--ink); --b: var(--ink); border-color: rgba(43, 38, 34, .35); }
.gh-btn-line:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.k-eyebrow { font-weight: 700; font-size: 12.5px; letter-spacing: .22em; }
.k-eyebrow::before { height: 3px; width: 22px; background: var(--accent); }
.k-dark .k-eyebrow { color: var(--accent); }
.k-head.center .k-lead { margin-inline: auto; }
.k-logo { font-weight: 900; text-transform: uppercase; letter-spacing: .04em; font-size: 19px; }
.k-logo small { letter-spacing: .16em; }
.k-footer .k-logo { color: var(--on-dark); } .k-footer .k-logo small { color: var(--on-dark-muted); }
.k-who i { background: var(--orange-soft); color: var(--accent-text); }
.k-faq summary::after { color: var(--accent-text); }
.gh-white { background: var(--white); }
.gh-warm { background: var(--surface); }
@media (max-width: 640px) { .gh-hide-sm { display: none; } }

/* ---------- CSS materials (also used in cards + the room planner) ---------- */
.gh-tex { --w1: #b27a45; --w2: #a46a37; --w3: #bf8a55; --w4: #96602f; --bw: 46px;
  background:
    repeating-linear-gradient(90deg, rgba(40, 20, 6, .28) 0 1px, transparent 1px var(--bw)),
    linear-gradient(0deg, transparent 0 63%, rgba(40, 20, 6, .22) 63% calc(63% + 1px), transparent calc(63% + 1px)) 0 0 / calc(var(--bw) * 2) 220px,
    linear-gradient(0deg, transparent 0 28%, rgba(40, 20, 6, .22) 28% calc(28% + 1px), transparent calc(28% + 1px)) var(--bw) 0 / calc(var(--bw) * 2) 190px,
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .06) 0 2px, transparent 2px 6px, rgba(60, 30, 10, .05) 6px 7px, transparent 7px 11px),
    linear-gradient(90deg, var(--w1) 0 25%, var(--w2) 25% 50%, var(--w3) 50% 75%, var(--w4) 75%) 0 0 / calc(var(--bw) * 4) 100%; }
.gh-tex--lvp { --w1: #b8aa96; --w2: #a99a86; --w3: #c5b7a4; --w4: #9d8e7b; --bw: 54px; }
.gh-tex--lam { --w1: #d6a064; --w2: #c99255; --w3: #ddac72; --w4: #be8749; --bw: 40px; }
.gh-tex--tile { background:
    linear-gradient(90deg, rgba(90, 80, 70, .28) 2px, transparent 2px) 0 0 / 64px 64px,
    linear-gradient(0deg, rgba(90, 80, 70, .28) 2px, transparent 2px) 0 0 / 64px 64px,
    radial-gradient(circle at 30% 25%, rgba(255, 255, 255, .55), transparent 55%) 0 0 / 64px 64px,
    linear-gradient(135deg, #ece6dc, #ddd4c7); }
.gh-tex--stairs { background:
    linear-gradient(180deg, rgba(255, 255, 255, .18), transparent 30%) 0 0 / 100% 48px,
    repeating-linear-gradient(180deg, #a86c3a 0 16px, #7a4a24 16px 20px, #f2ede6 20px 46px, #ddd5ca 46px 48px); }
.gh-tex--sub { background:
    repeating-radial-gradient(ellipse 120% 60% at 20% 40%, rgba(120, 80, 40, .16) 0 3px, transparent 3px 9px),
    repeating-radial-gradient(ellipse 90% 50% at 80% 70%, rgba(120, 80, 40, .12) 0 2px, transparent 2px 8px),
    linear-gradient(90deg, rgba(60, 40, 20, .25) 1px, transparent 1px) 0 0 / 50% 100%,
    linear-gradient(135deg, #dcbf93, #cfae7e); }

/* ---------- hero ---------- */
.gh-hero { position: relative; overflow: hidden; isolation: isolate; padding: clamp(40px, 5vw, 72px) 0 clamp(64px, 7vw, 96px);
  background: radial-gradient(800px 500px at 100% 0%, rgba(246, 142, 30, .12), transparent 60%), radial-gradient(700px 500px at 0% 100%, rgba(185, 140, 90, .1), transparent 60%), var(--bg); }
.gh-hero::before { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 120px; opacity: .06;
  background: repeating-linear-gradient(90deg, #2b2622 0 1px, transparent 1px 70px); -webkit-mask-image: linear-gradient(180deg, transparent, #000); mask-image: linear-gradient(180deg, transparent, #000); }
.gh-hero-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(36px, 5vw, 84px); align-items: center; }
.gh-hero h1 { font-size: clamp(40px, 5.8vw, 84px); line-height: .96; letter-spacing: -.012em; margin-bottom: .36em; }
.gh-hero h1 em { font-style: normal; position: relative; white-space: nowrap; }
.gh-hero h1 em::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.08em; height: .14em; border-radius: 2px;
  background: linear-gradient(90deg, #f68e1e, #f8a94f); transform: scaleX(0); transform-origin: left; animation: gh-plank .9s 1.05s var(--ease) forwards; }
@keyframes gh-plank { to { transform: scaleX(1); } }
.gh-hero .k-lead { color: #574e46; max-width: 46ch; }
.gh-hero .k-btn-row { margin: 30px 0 28px; }
.gh-proof { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 18px; }
.gh-hero .k-rating { background: var(--white); border-color: var(--line); box-shadow: 0 10px 24px -16px rgba(43, 38, 34, .4); }
.gh-hero .k-chips li { background: var(--white); border-color: var(--line); }
.gh-hero .k-chips svg { color: var(--accent-text); }

.gh-show { position: relative; padding-left: 70px; }
.gh-stage { position: relative; height: clamp(460px, 44vw, 620px); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); background: #a46a37; }
.gh-stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .8s var(--ease), transform 6s var(--ease); }
.gh-stage img.on { opacity: 1; transform: scale(1); }
.gh-stage img[data-m="lvp"] { filter: saturate(.32) sepia(.18) brightness(1.32) contrast(.92); }
.gh-stage img[data-m="tile"] { transform-origin: 50% 100%; transform: scale(1.42); object-position: 50% 100%; }
.gh-stage img[data-m="tile"].on { transform: scale(1.36); }
.gh-stage img[data-m="lam"] { object-position: 40% 50%; }
.gh-stage::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 14, 10, .35), transparent 22%, transparent 70%, rgba(20, 14, 10, .25)); pointer-events: none; }
.gh-board { position: absolute; z-index: 2; top: 18px; right: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
  background: rgba(31, 27, 24, .62); backdrop-filter: blur(10px); color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.gh-board::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--accent); }
.gh-rail { position: absolute; z-index: 3; left: 0; top: 50%; transform: translateY(-50%); display: grid; gap: 10px; }
.gh-rail button { display: grid; grid-template-columns: 52px auto; gap: 12px; align-items: center; padding: 7px 16px 7px 7px; border-radius: var(--radius); border: 2px solid transparent; background: var(--white);
  box-shadow: 0 14px 30px -16px rgba(31, 27, 24, .55); cursor: pointer; text-align: left; transition: border-color .25s, transform .25s var(--ease), box-shadow .25s; min-width: 150px; }
.gh-rail button:hover { transform: translateX(4px); }
.gh-rail button[aria-selected="true"] { border-color: var(--accent); transform: translateX(8px); box-shadow: 0 18px 36px -16px rgba(246, 142, 30, .55); }
.gh-rail img { width: 52px; height: 52px; border-radius: var(--radius-sm); object-fit: cover; }
.gh-rail img.lvp { filter: saturate(.32) sepia(.18) brightness(1.32) contrast(.92); }
.gh-rail b { display: block; font-size: 14px; font-weight: 900; text-transform: uppercase; letter-spacing: .06em; }
.gh-rail small { display: block; font-size: 12.5px; color: var(--muted); }
.gh-spec { position: absolute; z-index: 3; right: -22px; bottom: 26px; width: 300px; background: var(--white); border-radius: var(--radius); box-shadow: 0 34px 70px -28px rgba(31, 27, 24, .6); padding: 20px 22px; }
.gh-spec-in { transition: opacity .3s, transform .3s var(--ease); }
.gh-spec.swap .gh-spec-in { opacity: 0; transform: translateY(6px); }
.gh-spec small.gh-tag { display: inline-block; font-size: 11px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; color: var(--accent-text); margin-bottom: 4px; }
.gh-spec h3 { font-size: 22px; text-transform: uppercase; letter-spacing: .01em; margin: 0 0 14px; }
.gh-meter { display: grid; grid-template-columns: 116px minmax(0, 1fr); align-items: center; gap: 10px; font-size: 13.5px; color: var(--muted); margin-bottom: 9px; }
.gh-seg { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; }
.gh-seg i { height: 7px; border-radius: 2px; background: var(--surface-2); transition: background .4s; }
.gh-seg i.f { background: var(--accent); }
.gh-spec dl { margin: 14px 0 12px; display: grid; gap: 8px; font-size: 14px; }
.gh-spec dl div { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 8px; }
.gh-spec dt { font-weight: 700; color: var(--muted); }
.gh-spec dd { margin: 0; }
.gh-spec a { font-weight: 900; font-size: 14px; color: var(--accent-text); text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }
.gh-spec a .i { width: 16px; height: 16px; }

/* ---------- stats band ---------- */
.gh-band { background: var(--dark); color: var(--on-dark); padding: clamp(34px, 4vw, 52px) 0; position: relative; overflow: hidden; }
.gh-band::before { content: ""; position: absolute; inset: 0; opacity: .07; background: repeating-linear-gradient(90deg, #fff 0 1px, transparent 1px 90px); }
.gh-band .k-stats { background: transparent; border: 0; gap: 0; }
.gh-band .k-stats > div { background: transparent; padding: 6px 24px; border-left: 1px solid rgba(255, 255, 255, .12); }
.gh-band .k-stats > div:first-child { border-left: 0; padding-left: 0; }
.gh-band .k-stats b { color: var(--accent); font-weight: 900; }
.gh-band .k-stats span { color: var(--on-dark-muted); }
@media (max-width: 760px) { .gh-band .k-stats > div:nth-child(3) { border-left: 0; padding-left: 0; } .gh-band .k-stats > div { padding: 14px 16px; } }

/* ---------- services ---------- */
.gh-head-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 18px 64px; align-items: end; margin-bottom: clamp(36px, 5vw, 60px); }
.gh-head-split h2 { margin: 0; }
.gh-head-split p { margin: 0; color: var(--muted); }
@media (max-width: 860px) { .gh-head-split { grid-template-columns: minmax(0, 1fr); } }
a.gh-svc { padding: 0; overflow: hidden; display: flex; flex-direction: column; background: var(--white); border-color: rgba(43, 38, 34, .08); }
.gh-svc-tex { height: 132px; position: relative; transition: transform .8s var(--ease); }
.gh-svc-tex::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(31, 27, 24, .18)); }
a.gh-svc:hover .gh-svc-tex { transform: scale(1.05); }
.gh-svc-body { position: relative; padding: 0 clamp(22px, 2.4vw, 30px) clamp(22px, 2.4vw, 30px); display: flex; flex-direction: column; flex: 1; background: var(--white); }
.gh-svc .k-icon { margin-top: -28px; width: 56px; height: 56px; border-radius: 50%; background: var(--white); color: var(--accent-text); box-shadow: 0 10px 24px -10px rgba(43, 38, 34, .45); }
.gh-svc h3 { font-size: 21px; }
.gh-svc .k-more { margin-top: auto; padding-top: 16px; color: var(--accent-text); text-transform: uppercase; font-size: 13.5px; letter-spacing: .08em; font-weight: 900; align-items: center; }
.gh-svc .k-more .i { width: 16px; height: 16px; transition: transform .25s var(--ease); }
a.gh-svc:hover .k-more .i { transform: translateX(4px); }
a.gh-svc:hover { border-color: rgba(246, 142, 30, .6); }

/* ---------- compare table ---------- */
.gh-table-wrap { border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.gh-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 15.5px; }
.gh-table th, .gh-table td { padding: 16px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); transition: background .35s; }
.gh-table thead th { padding: 18px; vertical-align: bottom; border-bottom: 2px solid var(--ink); }
.gh-table thead th button { all: unset; cursor: pointer; display: grid; gap: 10px; font: 900 15px/1.1 var(--font-display); text-transform: uppercase; letter-spacing: .06em; }
.gh-table thead th button span { display: block; height: 54px; border-radius: var(--radius-sm); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.gh-table thead th button:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.gh-table tbody th { width: 170px; font-size: 12.5px; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.gh-table tbody tr:last-child th, .gh-table tbody tr:last-child td { border-bottom: 0; }
.gh-table .col-on { background: #fff6ec; }
.gh-table thead .col-on { box-shadow: inset 0 4px 0 var(--accent); }
.gh-table .gh-seg { max-width: 130px; }
.gh-table-note { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; align-items: center; margin-top: 20px; color: var(--muted); font-size: 15px; }
.gh-swipe { display: none; font-size: 13px; color: var(--muted); margin-bottom: 10px; }
@media (max-width: 860px) { .gh-swipe { display: block; } }

/* ---------- room planner ---------- */
.gh-calc-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.gh-calc { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow-lg); overflow: hidden; }
.gh-calc-top { padding: clamp(20px, 2.6vw, 30px); }
.gh-calc-top h3 { font-size: 20px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.gh-calc-top > p { color: var(--muted); font-size: 15px; margin: 0 0 18px; }
.gh-rooms { display: grid; gap: 10px; }
.gh-room { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr) 14px minmax(0, .8fr) 78px 36px; gap: 8px; align-items: center; }
.gh-room input { width: 100%; min-width: 0; padding: 11px 12px; border-radius: var(--radius-sm); border: 1px solid rgba(43, 38, 34, .2); background: var(--bg); font-size: 16px; }
.gh-room input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px rgba(246, 142, 30, .2); }
.gh-room .x { text-align: center; color: var(--muted); font-weight: 700; }
.gh-room output { font-weight: 900; font-size: 15px; text-align: right; font-variant-numeric: tabular-nums; }
.gh-room button { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); background: transparent; cursor: pointer; color: var(--muted); font-size: 18px; line-height: 1; }
.gh-room button:hover { color: var(--ink); border-color: var(--ink); }
.gh-room-h { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr) 14px minmax(0, .8fr) 78px 36px; gap: 8px; font-size: 11.5px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.gh-room-h span:nth-child(5) { text-align: right; }
.gh-add { margin-top: 12px; border: 1px dashed rgba(43, 38, 34, .3); background: transparent; border-radius: var(--radius-sm); padding: 11px; width: 100%; font-weight: 700; cursor: pointer; color: var(--ink); }
.gh-add:hover { border-color: var(--accent); color: var(--accent-text); }
.gh-lay { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.gh-lay button { border: 1px solid var(--line); background: var(--bg); padding: 9px 14px; border-radius: 999px; font-size: 14px; font-weight: 700; cursor: pointer; }
.gh-lay button[aria-pressed="true"] { background: var(--dark); color: #fff; border-color: var(--dark); }
.gh-plan { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; min-height: 120px; padding: 20px clamp(20px, 2.6vw, 30px); background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gh-plan div { position: relative; border-radius: 3px; box-shadow: inset 0 0 0 2px rgba(31, 27, 24, .55), 0 6px 14px -8px rgba(31, 27, 24, .5); transition: width .35s var(--ease), height .35s var(--ease); --bw: 12px; min-width: 18px; min-height: 18px; }
.gh-plan span { position: absolute; left: 6px; top: 6px; right: 6px; font-size: 11.5px; font-weight: 900; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); line-height: 1.15; overflow: hidden; }
.gh-out { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: end; padding: clamp(20px, 2.6vw, 30px); }
.gh-out small { display: block; font-size: 12px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.gh-out b { display: block; font: 900 clamp(38px, 4.4vw, 54px)/1 var(--font-display); letter-spacing: -.02em; margin: 4px 0 6px; font-variant-numeric: tabular-nums; }
.gh-out b em { font-style: normal; font-size: .42em; letter-spacing: .02em; color: var(--muted); }
.gh-out p { margin: 0; font-size: 14.5px; color: var(--muted); }
.gh-calc-side ul { list-style: none; padding: 0; margin: 26px 0 0; display: grid; gap: 16px; }
.gh-calc-side li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; font-size: 16px; color: var(--muted); }
.gh-calc-side li b { display: block; color: var(--ink); }
.gh-calc-side .gh-n { width: 44px; height: 44px; border-radius: var(--radius-sm); display: grid; place-items: center; background: var(--orange-soft); color: var(--accent-text); font-weight: 900; }
@media (max-width: 900px) { .gh-calc-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 520px) {
  .gh-room, .gh-room-h { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 12px minmax(0, 1fr) 32px; }
  .gh-room input:first-child { grid-column: 1 / -1; }
  .gh-room output { grid-column: 1; grid-row: 2; text-align: left; }
  .gh-room-h span:first-child, .gh-room-h span:nth-child(5) { display: none; }
  .gh-room-h { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 12px minmax(0, 1fr) 32px; }
  .gh-room-h::before { content: ""; }
  .gh-room { padding-bottom: 10px; border-bottom: 1px dashed var(--line); }
  .gh-out { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- three visits ---------- */
.gh-visits { background: radial-gradient(700px 420px at 100% 0%, rgba(246, 142, 30, .14), transparent 60%), var(--dark); overflow: hidden; }
.gh-visits-top { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 5vw, 80px); align-items: center; margin-bottom: clamp(48px, 6vw, 80px); }
.gh-tape { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 16 / 10; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7); }
.gh-tape img { width: 100%; height: 100%; object-fit: cover; }
.gh-tape-chip { position: absolute; left: 16px; bottom: 16px; padding: 10px 14px; border-radius: var(--radius-sm); background: rgba(31, 27, 24, .8); backdrop-filter: blur(8px); color: #fff; font-size: 14px; font-weight: 700; }
.gh-tape-chip b { color: var(--accent); }
.gh-visits .k-steps { gap: 0; }
.gh-visits .k-steps li { padding: 92px 32px 0 0; }
.gh-visits .k-steps li + li { padding-left: 32px; border-left: 1px solid rgba(255, 255, 255, .12); }
.gh-visits .k-steps li::before { content: "Visit " counter(s); font-size: 15px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); top: 0; }
.gh-visits .k-steps li::after { display: none; }
.gh-visits .k-steps li + li::before { left: 32px; }
.gh-big-n { position: absolute; top: 18px; font: 900 64px/1 var(--font-display); color: rgba(255, 255, 255, .08); }
.gh-visits .k-steps h3 { font-size: 22px; }
.gh-visits .k-steps small { display: inline-block; margin-bottom: 10px; font-size: 13px; font-weight: 700; color: var(--accent); background: rgba(246, 142, 30, .12); padding: 4px 10px; border-radius: 999px; }
@media (max-width: 860px) {
  .gh-visits-top { grid-template-columns: minmax(0, 1fr); }
  .gh-visits .k-steps li, .gh-visits .k-steps li + li { padding: 70px 0 28px; border-left: 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
  .gh-visits .k-steps li + li::before { left: 0; }
}

/* ---------- about ---------- */
.gh-about-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.gh-about-media { position: relative; padding: 0 40px 50px 0; }
.gh-about-media .k-frame { aspect-ratio: 4 / 5; }
.gh-about-small { position: absolute; right: 0; bottom: 0; width: 46%; aspect-ratio: 1; border-radius: var(--radius); overflow: hidden; border: 8px solid var(--bg); box-shadow: var(--shadow-lg); }
.gh-about-small img { width: 100%; height: 100%; object-fit: cover; }
.gh-owner { left: -18px; top: 28px; }
.gh-owner i { width: 48px; height: 48px; border-radius: var(--radius-sm); background: var(--accent); color: var(--accent-ink); display: grid; place-items: center; font: 900 17px/1 var(--font-display); font-style: normal; flex: none; }
.gh-owner b { font-size: 18px !important; }
.gh-owner small { color: var(--muted); font-size: 13px; }
.gh-quote { margin: 26px 0; padding: 0 0 0 22px; border-left: 4px solid var(--accent); font-size: clamp(20px, 2.1vw, 25px); line-height: 1.38; font-weight: 700; }
.gh-quote cite { display: block; margin-top: 10px; font-size: 14px; font-weight: 400; font-style: normal; color: var(--muted); letter-spacing: .04em; }
.gh-creds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; list-style: none; margin: 0; padding: 0; }
.gh-creds li { display: flex; gap: 10px; align-items: center; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--white); border: 1px solid var(--line); font-weight: 700; font-size: 15px; }
.gh-creds .i { color: var(--accent-text); }
@media (max-width: 860px) { .gh-about-grid { grid-template-columns: minmax(0, 1fr); } .gh-about-media { max-width: 520px; padding-right: 24px; } .gh-owner { left: 8px; } }
@media (max-width: 480px) { .gh-creds { grid-template-columns: minmax(0, 1fr); } }

/* ---------- work ---------- */
.gh-gallery.k-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 250px; }
.gh-gallery.k-gallery button { border-radius: var(--radius); grid-column: auto; grid-row: auto; }
.gh-gallery.k-gallery button:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.gh-gallery.k-gallery button:nth-child(4), .gh-gallery.k-gallery button:nth-child(5), .gh-gallery.k-gallery button:nth-child(6) { grid-column: span 2; grid-row: auto; }
.gh-gallery.k-gallery button:nth-child(6) { grid-column: span 4; }
.gh-gallery.k-gallery span { background: var(--white); color: var(--ink); font-weight: 700; border-radius: 4px; font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; }
.gh-gallery.k-gallery span::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 2px; background: var(--accent); margin-right: 8px; vertical-align: 1px; }
@media (max-width: 760px) {
  .gh-gallery.k-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 170px; }
  .gh-gallery.k-gallery button:nth-child(n) { grid-column: auto; grid-row: auto; }
  .gh-gallery.k-gallery button:nth-child(1), .gh-gallery.k-gallery button:nth-child(6) { grid-column: span 2; }
  .gh-gallery.k-gallery button:nth-child(1) { grid-row: span 2; }
}

/* ---------- reviews ---------- */
.gh-rev-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 40px; align-items: end; margin-bottom: clamp(36px, 5vw, 56px); }
.gh-rev-head h2 { margin: 0; }
.gh-rev-side { display: grid; justify-items: end; gap: 10px; }
.gh-rev-side .k-rating { background: var(--white); border-color: var(--line); }
.gh-sample { font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--muted); }
.gh-reviews .k-review { background: var(--white); border-color: rgba(43, 38, 34, .08); border-radius: var(--radius); box-shadow: 0 18px 36px -28px rgba(43, 38, 34, .5); border-top: 3px solid var(--accent); }
@media (max-width: 760px) { .gh-rev-head { grid-template-columns: minmax(0, 1fr); } .gh-rev-side { justify-items: start; } }

/* ---------- area ---------- */
.gh-area-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(36px, 5vw, 80px); align-items: center; }
.gh-area .k-area li { background: var(--bg); text-transform: uppercase; font-size: 13.5px; font-weight: 700; letter-spacing: .06em; }
.gh-area .k-area li.home { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.gh-area .k-map { aspect-ratio: 16 / 11; border: 0; box-shadow: var(--shadow-lg); }
@media (max-width: 860px) { .gh-area-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- faq ---------- */
.gh-faq-grid { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: clamp(36px, 5vw, 80px); align-items: start; }
.gh-faq-side { position: sticky; top: 110px; }
.gh-faq-side p { color: var(--muted); }
.gh-faq .k-faq details { background: var(--white); }
@media (max-width: 860px) { .gh-faq-grid { grid-template-columns: minmax(0, 1fr); } .gh-faq-side { position: static; } }

/* ---------- booking ---------- */
.gh-book { background: linear-gradient(90deg, var(--dark) 0 55%, #2b2622 55%); }
.gh-book-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(36px, 5vw, 80px); align-items: center; }
.gh-book .k-widget { box-shadow: 0 50px 100px -40px rgba(0, 0, 0, .8); }
.gh-book .k-widget h3 { font-size: 20px; text-transform: uppercase; letter-spacing: .03em; }
.gh-book .k-days button[aria-pressed="true"], .gh-book .k-slots button[aria-pressed="true"] { color: var(--accent-ink); }
.gh-book-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
.gh-book-facts a, .gh-book-facts div { display: block; padding: 16px; border-radius: var(--radius); border: 1px solid rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .04); text-decoration: none; transition: border-color .2s, background .2s; }
.gh-book-facts a:hover { border-color: var(--accent); background: rgba(246, 142, 30, .08); }
.gh-book-facts small { display: block; font-size: 12px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin-bottom: 6px; }
.gh-book-facts b { font-size: 17px; }
.gh-done-ic { color: #16a34a; }
@media (max-width: 900px) { .gh-book { background: var(--dark); } .gh-book-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 420px) { .gh-book-facts { grid-template-columns: minmax(0, 1fr); } }

/* ---------- CTA ---------- */
.gh-cta-sec { padding-block: clamp(56px, 7vw, 100px); }
.gh-cta { display: grid; grid-template-columns: minmax(0, 1.2fr) auto; gap: 24px 40px; align-items: center; }
.gh-cta::after { content: ""; position: absolute; z-index: -1; right: 0; top: 0; bottom: 0; width: 42%; opacity: .22;
  background: repeating-linear-gradient(90deg, rgba(31, 20, 8, .5) 0 1px, transparent 1px 44px), linear-gradient(0deg, transparent 0 60%, rgba(31, 20, 8, .5) 60% calc(60% + 1px), transparent calc(60% + 1px)) 0 0 / 88px 200px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 60%); mask-image: linear-gradient(90deg, transparent, #000 60%); }
.gh-cta::before { display: none; }
.gh-cta p { margin: 0; font-size: 18px; max-width: 46ch; }
.gh-cta .k-btn { --b: var(--accent-ink); --t: #fff; }
.gh-cta .k-btn--ghost { color: var(--accent-ink); border-color: rgba(31, 20, 8, .45); }
@media (max-width: 860px) { .gh-cta { grid-template-columns: minmax(0, 1fr); } }

/* ---------- footer ---------- */
.gh-foot-blurb { margin: 18px 0 14px; max-width: 34ch; }
.gh-foot-lic { display: inline-flex; gap: 8px; align-items: center; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .16); font-size: 13.5px; color: var(--on-dark); }
.k-footer .gh-foot-phone { font: 900 20px/1.2 var(--font-display); color: var(--on-dark); }

/* ---------- hero responsive ---------- */
@media (max-width: 1100px) { .gh-spec { right: 12px; } }
@media (max-width: 960px) {
  .gh-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .gh-show { padding-left: 0; }
  .gh-stage { height: clamp(320px, 62vw, 520px); }
  .gh-rail { position: static; transform: none; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 12px; gap: 8px; }
  .gh-rail button { min-width: 0; grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; padding: 8px 6px; gap: 6px; }
  .gh-rail button:hover, .gh-rail button[aria-selected="true"] { transform: none; }
  .gh-rail img { width: 100%; height: 54px; }
  .gh-rail small { display: none; }
  .gh-rail b { font-size: 12px; letter-spacing: .04em; }
  .gh-spec { position: relative; right: auto; bottom: auto; width: auto; margin: -64px 14px 0; }
}
@media (max-width: 420px) { .gh-hero h1 { font-size: 38px; } .gh-meter { grid-template-columns: 104px minmax(0, 1fr); } }
