/* Light, continuous paper with stronger side details fading into a clear centre. */
:root{--paper:#f4f1e8;--ink:#131313;--muted:#62625d;--line:#ded8c8}
body{background:var(--paper);color:var(--ink)}
.page-curtain{isolation:isolate;background:var(--paper)}
.page-curtain::before,.page-curtain::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1}
.page-curtain::before{background:url('assets/honeycomb-soft-glow.svg') left top/360px 520px repeat-y,url('assets/honeycomb-soft-glow.svg') right 260px/360px 520px repeat-y;opacity:.43;mask-image:linear-gradient(90deg,#000,transparent 31%,transparent 69%,#000)}
.page-curtain::after{background:url('assets/soft-grey-smoke.webp') center top/1250px 940px repeat-y;opacity:.5}
.page-curtain>.about-section,.page-curtain>.services.wrap,.page-curtain>.hub-work,.page-curtain>.hub-faq,.page-curtain>.hub-reviews,.page-curtain>.process{background:transparent;border:0}
.page-curtain>section:not(.hero)::before,.page-curtain>section:not(.hero)::after{display:none}
.page-curtain>.hero{background:radial-gradient(ellipse at 88% 40%,#312b18,transparent 62%),#111}
.hero-bottom{border-top:0}
.hero::before,.hero::after{background-image:url('assets/honeycomb-soft-glow.svg');opacity:.3}
.hero-art{isolation:isolate}.hero-art::before{content:"";position:absolute;inset:-25%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,rgba(233,225,185,.22),rgba(255,202,5,.13) 35%,transparent 67%),url('assets/soft-brand-smoke.webp') center/contain no-repeat;filter:blur(20px);opacity:.9}
.about-copy,.section-heading,.hub-section-intro,.design-heading,.review-intro{position:relative;isolation:isolate}
.about-copy::before,.section-heading::before,.hub-section-intro::before,.design-heading::before,.review-intro::before{content:"";position:absolute;inset:-70px -45px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,rgba(255,255,255,.95),rgba(255,252,230,.58) 45%,transparent 73%);filter:blur(27px)}
/* Keep the approved charcoal project frames. */
.design-card{display:flex;flex-direction:column;background:radial-gradient(ellipse at 0 0,#ffca0518,transparent 60%),linear-gradient(145deg,#353630,#1d1e1b 65%,#171815);border-color:#8e793e;color:#fff;box-shadow:0 14px 34px #21201624}
.design-cover{flex:none;background:#25251f;padding:18px 18px 46px;border-bottom:1px solid #ffca053d}.design-cover img{background:#fff;border:8px solid #fff;border-radius:8px}
.design-card-copy{flex:1;display:flex;flex-direction:column}.design-card h4{color:#fff}.design-category{color:#f4ce59}.design-card p{color:#cbcdc3}.design-variants{margin-top:auto}.design-variants a{color:#f7e4a1;border-color:#7d6a35;background:#303128}.design-variants a:hover{background:#ffca05;color:#111}
.contact-section{border-top:0;background:linear-gradient(0deg,#111,transparent 35%),radial-gradient(ellipse at 0 75%,#302810,transparent 60%),#111}
footer.wrap{width:100%;padding-inline:max(48px,calc((100% - 1200px)/2));background:#111;color:#fff;border:0;position:relative}
footer .footer-brand{color:#fff}footer p,footer>a:last-child{color:#bdbfb3}.footer-review{color:#ebd17b}.footer-review:hover,footer>a:last-child:hover{color:#fff}
footer>a[href="#home"]:not(.footer-brand){color:#c4c6b9}footer>a[href="#home"]:not(.footer-brand):hover{color:#fff}
.motion-control{background:#1a1b16;color:#e6d49b;border-color:#8d773d}.motion-control:hover{background:#302b18}
/* Match the header divider; favour honeycombs on the dark areas. */
footer.wrap{border-top:1px solid #30302a}
.page-curtain::before{opacity:.24}
.header{position:relative;isolation:isolate}
.header::before,.page-curtain>.hero::before,.contact-section::before{content:"";position:absolute;inset:0;width:100%;height:100%;background:url('assets/honeycomb-soft-glow.svg') center top/360px 520px repeat;mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.32) 40%,rgba(0,0,0,.32) 60%,#000);opacity:.5;transform:none;translate:none;animation:none!important;pointer-events:none;z-index:-1}
.header::before{opacity:.35}
.page-curtain>.hero::before{background-position:center -94px}
.page-curtain>.hero::after,.contact-section::after{display:none}
@media(max-width:680px){.page-curtain.page-curtain::before{opacity:.2}.header::before,.page-curtain>.hero::before,.contact-section::before{background-size:260px 376px;opacity:.46}.header::before{opacity:.32}.page-curtain>.hero::before{background-position:center -80px}}
@media(max-width:680px){.page-curtain::before{background-size:240px 347px,240px 347px;mask-image:linear-gradient(90deg,#000,transparent 38%,transparent 62%,#000);opacity:.34}.page-curtain::after{background-size:780px 585px;opacity:.42}.about-copy::before,.section-heading::before,.hub-section-intro::before,.design-heading::before,.review-intro::before{inset:-45px -15px;filter:blur(21px)}footer.wrap{padding-inline:20px}.hero-art::before{inset:-18%;filter:blur(14px)}}

/* One viewport-anchored grid gives every surface the same phase and scale. */
.page-curtain.page-curtain::before,.header::before,.page-curtain>.hero::before,.contact-section::before{
 background-image:url('assets/honeycomb-soft-glow.svg?v=seamless-2');
 background-size:360px 498.83063px;background-repeat:repeat;
 background-position:center top;background-attachment:fixed;
 transform:none;translate:none;animation:none!important;
}
.page-curtain.page-curtain::before{opacity:.24}
/* Diffuse dark haze clears the pattern directly behind dark-section copy. */
.hero-copy,.contact-grid>div,.contact-grid>form{position:relative;isolation:isolate}
.hero-copy::before,.contact-grid>div::before,.contact-grid>form::before{
 content:"";position:absolute;inset:-55px -65px;pointer-events:none;z-index:-1;
 background:url('assets/soft-brand-smoke.webp') center/100% 100% no-repeat,
 radial-gradient(ellipse at center,rgba(17,17,17,.98) 15%,rgba(17,17,17,.9) 45%,rgba(17,17,17,.65) 60%,transparent 76%);
 filter:blur(24px);
}
.hero-copy::after{content:"";position:absolute;inset:-55px -65px;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 35% 35%,rgba(228,220,181,.13),transparent 64%);filter:blur(26px)}
.header>.brand,.header>nav{position:relative;isolation:isolate}
.header>.brand::before,.header>nav::before{content:"";position:absolute;inset:-18px -24px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#111d 20%,#111a 48%,transparent 76%);filter:blur(12px)}
@media(max-width:680px){
 .page-curtain.page-curtain::before,.header::before,.page-curtain>.hero::before,.contact-section::before{background-size:260px 360.26657px;background-position:center top;background-attachment:fixed}
 .page-curtain.page-curtain::before{opacity:.2}
 .hero-copy::before,.hero-copy::after,.contact-grid>div::before,.contact-grid>form::before{inset:-35px -20px;filter:blur(18px)}
}

/* Approved refinement: quieter haze, smaller desktop badge, uniform gallery frames. */
@media(min-width:681px){.hero-art{width:90%;justify-self:center}}
.hero-art::before{opacity:.65}
.hero-copy::before,.contact-grid>div::before,.contact-grid>form::before{
 background:radial-gradient(ellipse at center,rgba(17,17,17,.98) 15%,rgba(17,17,17,.9) 45%,rgba(17,17,17,.65) 60%,transparent 76%);
}
.hero-copy::after,.contact-grid>div::after,.contact-grid>form::after{
 content:"";position:absolute;inset:-55px -65px;pointer-events:none;z-index:-1;
 background:url('assets/soft-brand-smoke.webp') center/100% 100% no-repeat,
 radial-gradient(ellipse at 35% 35%,rgba(228,220,181,.13),transparent 64%);
 opacity:.42;filter:blur(32px);
}
.design-cover{height:clamp(280px,28vw,350px);aspect-ratio:auto;padding:20px 20px 48px;display:flex;align-items:center;justify-content:center}
.design-cover img{object-fit:contain;object-position:center;width:100%;height:100%}
.design-card-copy{padding:24px}
.design-card h4{line-height:1.25;min-height:2.5em;margin:12px 0}
.design-category{line-height:1.5;min-height:3em}
.design-card p{flex:1}
@media(max-width:680px){
 .hero-copy::after,.contact-grid>div::after,.contact-grid>form::after{inset:-35px -20px;filter:blur(24px)}
 .design-cover{height:320px;max-height:none;padding:20px 20px 48px}
 .design-card h4,.design-category{min-height:0}
}

/* Charcoal surrounds; the source artwork keeps its own colours and background. */
.design-cover{background:#25251f}
.design-cover img{background:transparent;border:0;border-radius:0}
.viewer-image-wrap{background:#25251f}