@import url('https://fonts.googleapis.com/css2?family=Allura&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,700&family=Montserrat:wght@500;600;700;800&display=swap');
:root { --ink:#0b0d0d; --surface:#121615; --paper:#f4f1e9; --muted:#b8b8ae; --gold:#d9ae55; --line:rgba(244,241,233,.14); --serif:Georgia,"Times New Roman",serif; --display:"Montserrat",Arial,sans-serif; --sans:"DM Sans",Inter,ui-sans-serif,system-ui,sans-serif; --script:"Allura",cursive; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:var(--sans); line-height:1.55; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1280px,100%); margin:auto; padding-inline:clamp(1.25rem,5vw,5rem); }
.site-header { position:sticky; z-index:10; top:0; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.1rem clamp(1.25rem,5vw,5rem); background:rgba(11,13,13,.9); border-bottom:1px solid var(--line); backdrop-filter:blur(18px); }
.brand { position:relative; display:grid; gap:.28rem; padding-right:3.2rem; }
.brand::before { content:""; position:absolute; right:0; top:50%; width:34px; height:34px; transform:translateY(-64%); background:url("assets/gridtech-25plus-years-badge.svg") center / contain no-repeat; }
.brand img { display:none; }
.brand-line { display:flex; align-items:center; gap:.55rem; }
.brand img.brand-mark { display:block; width:30px; height:30px; object-fit:contain; }
.brand-name { display:flex; align-items:baseline; gap:.48rem; color:var(--paper); font-family:var(--display); font-size:1.05rem; font-weight:700; letter-spacing:.13em; line-height:1; }
.brand-name strong { color:var(--paper); font-weight:800; }
.brand-name span { color:var(--gold); font-size:.62em; font-weight:600; letter-spacing:.30em; }
.brand-unit { color:var(--muted); font-size:.45rem; font-weight:700; letter-spacing:.02em; text-transform:uppercase; white-space:nowrap; }
nav { display:flex; gap:1.5rem; color:var(--muted); font-size:.88rem; }
nav a:hover { color:var(--gold); }
.header-cta,.button { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; min-height:46px; padding:.78rem 1.1rem; border-radius:999px; font-size:.9rem; font-weight:750; transition:transform .2s ease,background .2s ease; }
.header-cta { color:var(--gold); border:1px solid var(--gold); }
.button:hover,.header-cta:hover { transform:translateY(-2px); }
.button.primary { color:var(--ink); background:var(--gold); }
.button.ghost { color:var(--paper); border:1px solid var(--line); }
.eyebrow { margin:0 0 1rem; color:var(--gold); font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:var(--serif); font-weight:400; letter-spacing:-.05em; line-height:.96; }
h1 { max-width:11ch; margin-bottom:1.5rem; font-size:clamp(3.5rem,7vw,7.2rem); }
h2 { margin-bottom:1rem; font-size:clamp(2.35rem,4.5vw,4.9rem); }
h3 { margin-bottom:.55rem; font-size:1.2rem; }
.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.83fr); align-items:center; min-height:calc(100svh - 74px); gap:clamp(2.5rem,7vw,8rem); padding-top:4rem; padding-bottom:5rem; }
.hero-copy > p:not(.eyebrow) { max-width:47ch; color:var(--muted); font-size:1.12rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin:2rem 0; }
.micro-proof { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; padding:0; margin:0; list-style:none; color:var(--muted); font-size:.83rem; }
.micro-proof li::before { content:"•"; color:var(--gold); margin-right:.45rem; }
.hero-visual { position:relative; }
.hero-visual img { display:block; width:100%; min-height:520px; max-height:670px; object-fit:cover; border:1px solid rgba(217,174,85,.55); }
.hero-visual::after { content:"Kitchen + wardrobe inspiration"; position:absolute; right:0; bottom:0; padding:.65rem .85rem; color:var(--ink); background:var(--gold); font-size:.73rem; font-weight:750; }
.hero.hero-catalogue { gap:clamp(2rem,6vw,7rem); }
.hero-catalogue .eyebrow { margin:0 0 -.25rem; color:var(--gold); font-family:var(--script); font-size:clamp(2.4rem,4vw,4rem); font-weight:400; letter-spacing:0; text-transform:none; }
.hero-catalogue h1 { max-width:none; margin-bottom:1.25rem; font-family:var(--display); font-size:clamp(3.7rem,7vw,7.7rem); font-weight:700; letter-spacing:.015em; line-height:.83; }
.hero-catalogue h1 span { display:block; color:var(--paper); }
.hero-catalogue h1 em { display:block; color:var(--gold); font-style:normal; }
.hero-catalogue .hero-copy > p:not(.eyebrow) { max-width:38ch; font-size:1.08rem; }
.hero-catalogue .hero-visual { border:1px solid rgba(217,174,85,.42); padding:.65rem .65rem 0; background:linear-gradient(145deg,rgba(217,174,85,.28),transparent 35%); }
.hero-catalogue .hero-visual img { border:0; }
.hero-catalogue .hero-visual::after { content:attr(data-label); font-family:var(--display); font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; }
.hero-catalogue .micro-proof { margin-top:2.15rem; font-family:var(--display); font-size:.66rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.hero-catalogue .micro-proof li::before { content:"|"; color:var(--gold); }
.home-proof { display:grid; grid-template-columns:1.15fr repeat(3,1fr); gap:0; margin-top:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.home-proof-intro { padding:2rem 2rem 2rem 0; border-right:1px solid var(--line); }
.home-proof-intro h2 { max-width:8ch; margin:0; font-size:clamp(2rem,3.2vw,3.35rem); }
.home-proof-card { min-height:230px; padding:1.25rem; border-right:1px solid var(--line); display:flex; flex-direction:column; justify-content:end; background:#101312; overflow:hidden; }
.home-proof-card:last-child { border-right:0; }
.home-proof-card img { width:46px; height:46px; margin-bottom:auto; object-fit:contain; }
.home-proof-card .proof-image { width:100%; height:78px; margin:-1.25rem -1.25rem 1.2rem; width:calc(100% + 2.5rem); object-fit:cover; opacity:.72; filter:saturate(.78) contrast(.95); }
.home-proof-card h3 { font-family:var(--serif); font-size:1.45rem; font-weight:400; line-height:1.05; }
.home-proof-card h3 span { display:block; margin-bottom:.1rem; color:var(--gold); font-family:var(--script); font-size:2.15rem; font-weight:400; line-height:.7; }
.home-proof-card p { margin:0; color:var(--muted); font-size:.88rem; }
.section { padding-top:clamp(4rem,9vw,9rem); padding-bottom:clamp(4rem,9vw,9rem); }
.split-heading { display:grid; grid-template-columns:.8fr 1.2fr; gap:2rem; align-items:start; }
.split-heading p:not(.eyebrow) { max-width:42ch; color:var(--muted); font-size:1.04rem; }
.split-heading h2,.consultation h2 { max-width:12ch; font-family:var(--display); font-size:clamp(2rem,4vw,4.4rem); font-weight:700; letter-spacing:.01em; line-height:.9; text-transform:uppercase; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:4rem; border-top:1px solid var(--line); }
.service-card { min-height:350px; padding:1.5rem; border-right:1px solid var(--line); display:flex; flex-direction:column; align-items:flex-start; }
.service-card:last-child { border-right:0; }
.service-card img { width:56px; height:56px; margin-bottom:auto; }
.service-card p { color:var(--muted); }
.service-card h3,.step h3 { font-family:var(--display); font-size:1rem; font-weight:700; letter-spacing:.075em; text-transform:uppercase; }
.text-link { margin-top:1rem; color:var(--gold); font-weight:750; font-size:.9rem; }
.statement { padding:clamp(3rem,8vw,7rem) clamp(1.25rem,8vw,9rem); background:var(--gold); color:var(--ink); }
.statement p { max-width:30ch; margin:0; font-family:var(--serif); font-size:clamp(1.9rem,4vw,4rem); line-height:1.02; letter-spacing:-.045em; }
.method { background:var(--surface); }
.steps { display:grid; grid-template-columns:repeat(4,1fr); margin-top:4rem; border-top:1px solid var(--line); }
.step { padding:1.5rem 1.2rem 1.5rem 0; border-right:1px solid var(--line); }
.step+ .step { padding-left:1.2rem; }
.step:last-child { border-right:0; }
.step-number { color:var(--gold); font-size:.75rem; font-weight:800; letter-spacing:.12em; }
.step p { margin-bottom:0; color:var(--muted); font-size:.94rem; }
.consultation { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,7vw,7rem); align-items:start; }
.consultation p:not(.eyebrow) { max-width:43ch; color:var(--muted); }
.consultation-card { padding:clamp(1.5rem,4vw,3rem); border:1px solid var(--line); background:linear-gradient(135deg,#171b19,#101211); }
.consultation-card p { color:var(--muted); }
.contact-number { display:block; margin-top:1.15rem; color:var(--gold); font-weight:750; }
.page-hero { padding-top:clamp(5rem,12vw,10rem); padding-bottom:4rem; border-bottom:1px solid var(--line); }
.page-hero p:not(.eyebrow) { max-width:55ch; color:var(--muted); font-size:1.08rem; }
.page-hero .eyebrow,.split-heading .eyebrow,.consultation .eyebrow { margin-bottom:.15rem; color:var(--gold); font-family:var(--script); font-size:clamp(2.05rem,3.4vw,3.35rem); font-weight:400; letter-spacing:0; text-transform:none; }
.page-hero h1 { max-width:10ch; font-family:var(--display); font-size:clamp(3.25rem,6.1vw,6.7rem); font-weight:700; letter-spacing:.01em; line-height:.84; text-transform:uppercase; }
.page-hero.visual-right { display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,.8fr); gap:clamp(2rem,7vw,7rem); align-items:center; }
.page-hero.visual-right h1 { margin-bottom:1.3rem; }
.page-hero-visual { position:relative; min-height:340px; }
.page-hero-visual img { width:100%; height:100%; min-height:340px; object-fit:cover; display:block; border:1px solid rgba(217,174,85,.5); }
.page-hero-visual::after { display:none; }
.legacy-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2rem; }
.legacy-gallery figure { margin:0; border:1px solid var(--line); background:#121514; }
.legacy-gallery img { width:100%; aspect-ratio:1.48; object-fit:cover; display:block; }
.legacy-gallery figcaption { padding:.85rem 1rem; color:var(--muted); font-size:.78rem; line-height:1.45; }
.heritage-ledger { display:grid; grid-template-columns:.7fr 1.3fr; gap:clamp(2rem,7vw,7rem); padding:clamp(4rem,8vw,7rem) 0; border-top:1px solid var(--line); }
.heritage-year { color:var(--gold); font-family:var(--display); font-size:clamp(4.5rem,9vw,8rem); font-weight:700; letter-spacing:-.08em; line-height:.8; }
.heritage-ledger h2 { font-family:var(--display); font-size:clamp(2rem,4vw,4.2rem); font-weight:700; letter-spacing:.01em; line-height:.95; }
.heritage-ledger p { max-width:60ch; color:var(--muted); }
.heritage-list { display:grid; gap:.85rem; margin-top:2rem; padding:0; list-style:none; }
.heritage-list li { padding:.95rem 0; border-bottom:1px solid var(--line); color:var(--paper); }
.heritage-list strong { display:block; margin-bottom:.16rem; color:var(--gold); font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.icon-ribbon { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin:0 0 clamp(4rem,8vw,7rem); }
.icon-ribbon article { min-height:130px; display:grid; grid-template-columns:60px 1fr; gap:1rem; align-items:center; padding:1rem; border:1px solid var(--line); background:#111412; }
.icon-ribbon img { width:50px; height:50px; object-fit:contain; }
.icon-ribbon h3 { margin:0 0 .25rem; font-family:var(--display); font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.icon-ribbon p { margin:0; color:var(--muted); font-size:.8rem; line-height:1.4; }
.solution-showcase { position:relative; min-height:470px; display:flex; align-items:end; overflow:hidden; margin-top:2rem; border:1px solid var(--line); background:#151917; }
.solution-showcase>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.solution-showcase::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,9,9,.92) 0%,rgba(7,9,9,.64) 42%,rgba(7,9,9,.08) 78%); }
.showcase-copy { position:relative; z-index:1; max-width:560px; padding:clamp(2rem,6vw,5rem); }
.showcase-copy h2 { margin-bottom:1rem; }
.showcase-copy p:not(.eyebrow) { color:var(--muted); }
.form-stage { position:relative; overflow:hidden; padding:clamp(2rem,5vw,5rem); border:1px solid var(--line); background:#111412; }
.form-stage>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.28; }
.form-stage form { position:relative; z-index:1; background:rgba(11,13,13,.86); padding:clamp(1.3rem,3vw,2.4rem); border:1px solid var(--line); backdrop-filter:blur(4px); }
.planning-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:3rem; }
.planning-grid article { min-height:195px; padding:1.4rem; background:#151917; border:1px solid var(--line); }
.planning-grid img { width:42px; height:42px; margin-bottom:1.5rem; }
.planning-grid p { margin-bottom:0; color:var(--muted); font-size:.92rem; }
.process-list { list-style:none; padding:0; margin:3.5rem 0 0; border-top:1px solid var(--line); }
.process-list li { display:grid; grid-template-columns:90px 1fr 1fr; gap:2rem; padding:2rem 0; border-bottom:1px solid var(--line); }
.process-list strong { color:var(--gold); font-size:.8rem; letter-spacing:.12em; }
.process-list p { margin-bottom:0; color:var(--muted); }
.visit-form { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.visit-form label { display:grid; gap:.45rem; color:var(--muted); font-size:.84rem; }
.visit-form input,.visit-form select,.visit-form textarea { width:100%; padding:.82rem .9rem; color:var(--paper); background:#0d100f; border:1px solid var(--line); border-radius:4px; font:inherit; }
.visit-form .consent { display:flex; grid-template-columns:20px 1fr; align-items:start; gap:.7rem; color:var(--muted); font-size:.79rem; line-height:1.45; }
.visit-form .consent input { width:17px; height:17px; margin:.12rem 0 0; accent-color:var(--gold); }
.visit-form .consent a { color:var(--gold); text-decoration:underline; text-underline-offset:3px; }
.visit-form input:focus,.visit-form select:focus,.visit-form textarea:focus { outline:2px solid var(--gold); outline-offset:2px; }
.full { grid-column:1/-1; }
.visit-form button { border:0; cursor:pointer; justify-self:start; }
.form-note { grid-column:1/-1; margin:0; color:var(--muted); font-size:.77rem; }
footer { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:2rem clamp(1.25rem,5vw,5rem); border-top:1px solid var(--line); color:var(--muted); font-size:.78rem; }
footer img { display:none; } footer p { margin:0; }
.footer-brand { color:var(--paper); font-size:1rem; font-weight:750; letter-spacing:.015em; } .footer-brand strong { color:var(--gold); }
.footer-privacy { color:var(--muted); font-size:.78rem; } .footer-privacy:hover { color:var(--gold); }
footer::after { content:"◎  f  in  ▶"; display:block; color:var(--gold); font-weight:800; font-size:1rem; letter-spacing:.55rem; white-space:nowrap; opacity:.9; }
.policy { max-width:800px; padding-top:clamp(4rem,10vw,8rem); padding-bottom:clamp(4rem,10vw,8rem); }
.policy h1 { max-width:12ch; font-family:var(--display); font-size:clamp(3rem,6vw,6.2rem); font-weight:700; letter-spacing:.01em; line-height:.85; text-transform:uppercase; }
.policy h2 { margin-top:3rem; font-family:var(--display); font-size:1.05rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.policy p,.policy li { color:var(--muted); }
.policy a { color:var(--gold); text-decoration:underline; text-underline-offset:3px; }
.thank-you { min-height:calc(100svh - 160px); display:grid; align-content:center; grid-template-columns:minmax(0,1fr) minmax(260px,.65fr); gap:clamp(2rem,8vw,8rem); padding-top:clamp(5rem,12vw,10rem); padding-bottom:clamp(5rem,12vw,10rem); }
.thank-you h1 { max-width:10ch; font-family:var(--display); font-size:clamp(3.2rem,6vw,6.5rem); font-weight:700; letter-spacing:.01em; line-height:.85; text-transform:uppercase; }
.thank-you p { max-width:52ch; color:var(--muted); font-size:1.06rem; }
.thank-you-card { padding:2rem; border:1px solid var(--line); background:#111412; }
@media(max-width:760px){ nav,.header-cta{display:none}.brand img{width:150px}.brand img.brand-mark{width:28px;height:28px}.hero,.consultation,.split-heading,.page-hero.visual-right,.home-proof,.heritage-ledger,.icon-ribbon{grid-template-columns:1fr;min-height:auto}.hero{padding-top:4rem}.hero-visual{max-width:500px}.hero-visual img{min-height:390px}.home-proof-intro,.home-proof-card{padding:1.5rem 0;border-right:0;border-bottom:1px solid var(--line)}.home-proof-card .proof-image{width:100%;height:125px;margin:0 0 1.2rem}.service-grid,.steps,.planning-grid{grid-template-columns:1fr}.service-card,.step,.step+.step{min-height:auto;padding:1.5rem 0;border-right:0;border-bottom:1px solid var(--line)}.service-card img{margin-bottom:2rem}.steps{margin-top:2.5rem}.process-list li{grid-template-columns:1fr;gap:.75rem}.visit-form{grid-template-columns:1fr}.page-hero{padding-top:5rem}.page-hero-visual,.page-hero-visual img{min-height:260px}.solution-showcase{min-height:400px}.consultation{gap:2rem}footer{flex-direction:column;align-items:flex-start}}