:root{--ivory:#F6F2EA;--charcoal:#1B1B19;--olive:#303526;--white:#fff;--line:#d9d3c8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--charcoal);font-family:Arial,sans-serif}a{color:inherit;text-decoration:none}header{min-height:104px;padding:22px 5vw;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:4;background:var(--ivory)}header img{width:225px}nav{display:flex;gap:28px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.eyebrow{font-size:11px;letter-spacing:.22em;font-weight:bold;text-transform:uppercase}.hero{padding:0 5vw 7vw}.hero img{display:block;width:100%;height:min(78vh,820px);object-fit:cover;object-position:center 48%;background:#e8e2d7}.heroCopy{max-width:920px;margin:42px auto 0;text-align:center}.hero h1,.intro h2,.sectionHead h2,.dark h2,.about h2,.contact h2,.projectHero h1,.process h2{font-family:Georgia,serif;font-weight:400}.hero h1{font-size:62px;line-height:1.05;margin:18px 0}.heroCopy>p:not(.eyebrow){font-size:18px;line-height:1.7;max-width:760px;margin:0 auto}.button{display:inline-block;margin-top:24px;border:1px solid currentColor;padding:15px 24px;text-transform:uppercase;font-size:11px;letter-spacing:.15em}.intro{padding:90px 18vw;text-align:center}.intro h2{font-size:48px;margin:18px}.intro>p:last-child{font-size:18px;line-height:1.8;max-width:800px;margin:auto}.work{padding:80px 5vw 120px}.sectionHead{margin-bottom:45px}.sectionHead h2{font-size:46px;margin:10px 0}.sectionHead>p:last-child{opacity:.65}.projectList{display:grid;grid-template-columns:repeat(2,1fr);gap:60px 28px}.card img{width:100%;height:auto;display:block}.card h3{font-family:Georgia,serif;font-size:30px;font-weight:400;margin:14px 0 8px}.card p{line-height:1.6;opacity:.72;margin:0}.card .view{display:inline-block;margin-top:16px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid;padding-bottom:5px}.coming{background:var(--olive);color:#fff;min-height:430px;display:flex;align-items:center;justify-content:center;text-align:center;padding:50px}.collections{padding:95px 5vw;background:#ebe5d9}.collectionGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.collectionGrid figure{margin:0}.collectionGrid img{width:100%;height:auto;display:block}.collectionGrid figcaption{font-family:Georgia,serif;font-size:26px;margin-top:14px}.dark{background:var(--olive);color:white;padding:110px 7vw}.dark>h2{font-size:52px}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;margin-top:58px}.services div{border-top:1px solid rgba(255,255,255,.4);padding-top:24px}.services h3{font-family:Georgia,serif;font-size:25px;font-weight:400}.services p{line-height:1.7;opacity:.85}.process{padding:110px 7vw}.process h2{font-size:48px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:55px}.step{border-top:1px solid var(--charcoal);padding-top:20px}.step b{font-family:Georgia,serif;font-size:32px;font-weight:400}.step h3{font-family:Georgia,serif;font-size:23px;font-weight:400}.step p{line-height:1.7;opacity:.72}.about{padding:120px 8vw;display:grid;grid-template-columns:.85fr 1.15fr;gap:9vw;align-items:center}.portrait{aspect-ratio:4/5;background:#ded8cc;overflow:hidden}.portrait img{width:100%;height:100%;display:block;object-fit:cover;object-position:center top}.about h2{font-size:48px}.about p{font-size:17px;line-height:1.8}.about .lead{font-family:Georgia,serif;font-size:24px;line-height:1.5}.contact{padding:110px 5vw;text-align:center;background:var(--charcoal);color:white}.contact img{width:280px}.contact h2{font-size:52px;margin:50px 0 10px}footer{padding:30px 5vw;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.projectHero{padding:65px 7vw 40px}.projectHero h1{font-size:60px;margin:12px 0}.projectHero p{max-width:760px;line-height:1.7;font-size:17px}.gallery{padding:20px 7vw 100px;max-width:1600px;margin:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 28px;align-items:start}.gallery figure{margin:0}.gallery img{display:block;width:100%;height:clamp(360px,48vw,700px);object-fit:cover}.gallery .projectSection{grid-column:1/-1}.gallery figcaption{padding-top:2px}.gallery figcaption{font-size:10px;letter-spacing:.16em;text-transform:uppercase;margin-top:10px;opacity:.55}.back{display:inline-block;margin:30px 7vw 0;font-size:11px;letter-spacing:.15em;text-transform:uppercase}.projectNav{padding:45px 7vw 80px;display:flex;justify-content:space-between;border-top:1px solid var(--line)}@media(max-width:800px){nav{display:none}.hero h1,.projectHero h1{font-size:43px}.intro{padding:70px 7vw}.intro h2,.sectionHead h2,.process h2{font-size:38px}.projectList,.collectionGrid,.services,.steps,.about{grid-template-columns:1fr}.dark>h2,.about h2{font-size:40px}.about{gap:40px;padding:80px 7vw}.hero{padding:0 0 60px}.heroCopy{padding:0 7vw}.work,.collections{padding-left:7vw;padding-right:7vw}footer{flex-direction:column;gap:14px}.gallery{padding-left:4vw;padding-right:4vw;grid-template-columns:1fr;gap:34px}.gallery img{height:auto;max-height:none}.gallery .projectSection{grid-column:1}}.projectSection{max-width:850px;margin:6rem auto 2rem;padding:0 1.5rem;text-align:center}.projectSection h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(2.2rem,5vw,4.5rem);line-height:1.02;margin:.45rem 0 1rem}.projectSection p:last-child{max-width:700px;margin:0 auto;line-height:1.7}.gallery .projectSection:first-child{margin-top:1rem}

/* v6 editorial / magazine direction */
.editorialHero{padding-bottom:4vw}.heroFrame{position:relative;overflow:hidden}.editorialHero .heroFrame>img{height:min(82vh,860px)}
.heroBand{position:absolute;left:5%;bottom:7%;width:min(620px,58%);padding:42px 46px;background:rgba(48,53,38,.50);color:#fff;backdrop-filter:blur(1.5px)}
.heroBand .eyebrow{margin:0 0 16px}.heroBand h1{font-size:clamp(44px,5vw,72px);margin:0 0 16px;line-height:.98}.heroBand>p:not(.eyebrow){font-family:Georgia,serif;font-size:18px;line-height:1.55;max-width:520px;margin:0}.lightButton{border-color:rgba(255,255,255,.8)}
.issueTag{position:absolute;right:2.4%;top:4%;color:#fff;font-size:12px;letter-spacing:.18em;text-transform:uppercase;writing-mode:vertical-rl;text-shadow:0 1px 5px rgba(0,0,0,.3)}.issueTag span{opacity:.75;margin-top:16px}
.editorialIntro{padding-top:110px;padding-bottom:100px}.editorialIntro h2{font-size:clamp(42px,5vw,68px);line-height:1.05}.introRule{width:80px;border-top:1px solid var(--charcoal);margin:28px auto 30px}
.manifestoBand{margin:0 5vw 70px;padding:28px 4vw;background:rgba(48,53,38,.50);display:flex;justify-content:space-around;color:white;font-size:11px;font-weight:bold;letter-spacing:.32em;text-transform:uppercase}
.work .sectionHead{display:grid;grid-template-columns:.7fr 1.3fr;column-gap:7vw;align-items:end}.work .sectionHead .eyebrow{grid-column:1}.work .sectionHead h2{grid-column:1;font-size:56px;line-height:1}.work .sectionHead>p:last-child{grid-column:2;grid-row:1/3;font-family:Georgia,serif;font-size:21px;line-height:1.6;max-width:620px;margin:0}
.card{position:relative}.card:nth-child(2n){margin-top:70px}.card h3{font-size:34px}.card .eyebrow{margin-top:18px}.coming{background:rgba(48,53,38,.82)}
.editorialQuote{margin:0 5vw;padding:90px 8vw;background:rgba(48,53,38,.50);color:#fff;text-align:center}.editorialQuote blockquote{font-family:Georgia,serif;font-size:clamp(32px,4vw,58px);line-height:1.2;max-width:1100px;margin:25px auto 0;font-weight:400}
.collections{background:#efeae1}.collections .sectionHead{max-width:760px}.collectionGrid{gap:14px}.collectionGrid figure:nth-child(2){transform:translateY(42px)}.collectionGrid figcaption{padding-bottom:34px}
.dark{position:relative}.dark:before{content:'VISION / BUILD / MANAGE';position:absolute;right:4vw;top:32px;font-size:10px;letter-spacing:.3em;opacity:.5}.services h3{font-size:27px}
.process{background:#f9f6f0}.step b{font-size:45px;color:rgba(48,53,38,.55)}
.about{position:relative}.about:before{content:'';position:absolute;left:0;top:18%;width:44%;height:62%;background:rgba(48,53,38,.12);z-index:0}.about>*{position:relative;z-index:1}.portrait{box-shadow:22px 22px 0 rgba(48,53,38,.22)}
.contact{background:linear-gradient(rgba(27,27,25,.88),rgba(27,27,25,.88)),url('assets/hero.jpg') center/cover}.contact .button{background:rgba(48,53,38,.55)}
@media(max-width:800px){.heroBand{left:5%;right:5%;bottom:5%;width:auto;padding:28px 24px}.heroBand h1{font-size:40px}.heroBand>p:not(.eyebrow){font-size:15px}.issueTag{display:none}.editorialHero .heroFrame>img{height:72vh}.manifestoBand{margin:0 0 50px;gap:18px;overflow:hidden;justify-content:flex-start;padding-left:7vw}.manifestoBand span:nth-child(n+4){display:none}.work .sectionHead{display:block}.work .sectionHead h2{font-size:44px}.work .sectionHead>p:last-child{font-size:18px;margin-top:20px}.card:nth-child(2n){margin-top:0}.editorialQuote{margin:0;padding:70px 7vw}.collectionGrid figure:nth-child(2){transform:none}.about:before{width:100%;height:35%;top:5%}.portrait{box-shadow:12px 12px 0 rgba(48,53,38,.22)}}

.gallery figure.naturalPhoto img{height:auto;max-height:none;object-fit:contain;background:transparent}

/* Version 12 — expanded client-focused approach */
.approachExpanded{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:7vw;align-items:start}
.approachExpanded>.eyebrow{grid-column:1/-1}
.approachExpanded blockquote{margin-bottom:0}
.approachCopy{max-width:720px}
.approachCopy p{font-size:17px;line-height:1.75;margin:0 0 18px}
.approachCopy .approachClosing{font-family:Georgia,'Times New Roman',serif;font-size:22px;line-height:1.45;margin-top:28px}
@media(max-width:800px){.approachExpanded{grid-template-columns:1fr;gap:22px}.approachExpanded>.eyebrow{grid-column:1}.approachCopy .approachClosing{font-size:20px}}


/* Version 14 — refined magazine homepage */
header{position:absolute;top:0;left:0;right:0;background:linear-gradient(to bottom,rgba(246,242,234,.94),rgba(246,242,234,.72),transparent);z-index:20;padding-top:24px;padding-bottom:42px}
.luxeHero{padding:0;background:#eee8de}.luxeHero .heroFrame{height:min(88vh,900px)}.luxeHero .heroFrame>img{width:100%;height:100%;object-fit:cover;object-position:center 48%}
.luxeOverlay{position:absolute;left:4.2vw;bottom:14%;color:#fff;text-shadow:0 1px 14px rgba(0,0,0,.22)}.luxeOverlay h1{font-family:Georgia,serif;font-size:clamp(48px,5.4vw,82px);font-weight:400;line-height:1.02;margin:0 0 22px}.luxeOverlay .eyebrow{margin:0;letter-spacing:.2em}.luxeOverlay .button{background:rgba(48,53,38,.72);border:0;text-shadow:none;margin-top:26px}
.heroCircle{position:absolute;right:7vw;bottom:18%;width:178px;height:178px;border-radius:50%;background:rgba(48,53,38,.72);border:1px solid rgba(255,255,255,.8);color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;font:italic 21px/1.35 Georgia,serif;backdrop-filter:blur(2px)}.heroCircle span{position:absolute;width:28px;border-top:1px solid rgba(255,255,255,.8);bottom:38px}
.heroTypes{position:absolute;right:4vw;bottom:4%;margin:0;color:#fff;font-size:10px;letter-spacing:.24em;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.luxeApproach{margin:0;padding:58px 12vw 52px;background:var(--ivory);color:var(--charcoal);display:block;text-align:center}.luxeApproach blockquote{font-size:clamp(32px,3.3vw,54px);max-width:1000px;margin:18px auto 14px}.luxeApproach .approachCopy{max-width:960px;margin:auto}.luxeApproach .approachCopy p{font-family:Georgia,serif;font-size:17px;line-height:1.55;margin:6px auto}.luxeApproach .approachClosing{font-style:italic;font-size:20px;margin-top:18px}
.homeCategories{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:0 0 70px;background:var(--ivory)}.homeCategories a{height:230px;position:relative;overflow:hidden}.homeCategories img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.67)}.homeCategories span{position:absolute;left:24px;bottom:24px;color:#fff;font-size:14px;letter-spacing:.12em}.homeCategories small{display:block;margin-top:12px;font-size:9px;letter-spacing:.22em;border-bottom:1px solid rgba(255,255,255,.7);width:max-content;padding-bottom:5px}
@media(max-width:800px){header{position:relative;background:var(--ivory);padding-bottom:22px}.luxeHero .heroFrame{height:72vh}.luxeOverlay{left:7vw;right:7vw;bottom:9%}.luxeOverlay h1{font-size:43px}.heroCircle,.heroTypes{display:none}.luxeApproach{padding:60px 7vw 50px}.homeCategories{grid-template-columns:1fr 1fr}.homeCategories a{height:210px}}

/* Version 16: supplied magazine hero + client category row */
.magazineHero{background:var(--ivory);padding:0}.magazineHero img{display:block;width:100%;height:auto}
.clientCategories{display:grid;grid-template-columns:repeat(4,1fr);background:var(--ivory);border-top:1px solid rgba(27,27,25,.12);border-bottom:1px solid rgba(27,27,25,.12);padding:0 5vw 70px}.clientCategories>div{padding:34px 34px 28px;border-right:1px solid rgba(27,27,25,.12);min-height:180px}.clientCategories>div:last-child{border-right:0}.clientCategories .categoryIcon{font-family:Georgia,serif;font-size:34px;line-height:1;display:block;margin-bottom:18px;color:var(--olive)}.clientCategories h3{text-transform:uppercase;letter-spacing:.18em;font-size:12px;margin:0 0 12px}.clientCategories p{font-family:Georgia,serif;font-size:16px;line-height:1.45;margin:0;max-width:230px;color:#4a4945}
@media(max-width:800px){.magazineHero{overflow:hidden}.magazineHero img{width:160%;max-width:none;transform:translateX(-18%)}.clientCategories{grid-template-columns:1fr 1fr;padding:0 4vw 45px}.clientCategories>div{border-bottom:1px solid rgba(27,27,25,.12);padding:26px 18px;min-height:155px}.clientCategories>div:nth-child(2){border-right:0}}

/* V17 simplified magazine homepage */
.magazineHome>header{display:none}
.portfolioTabs{padding:90px 5vw 120px;background:var(--ivory)}
.portfolioIntro{max-width:1050px;margin:0 auto 42px;text-align:center}
.portfolioIntro h2{font-family:Georgia,serif;font-weight:400;font-size:52px;margin:10px 0 14px}
.portfolioIntro>p:last-child{font-family:Georgia,serif;font-size:19px;line-height:1.6;max-width:720px;margin:0 auto;opacity:.72}
.tabControls{display:flex;justify-content:center;gap:0;margin:0 auto 55px;border-bottom:1px solid rgba(27,27,25,.22);max-width:620px}
.portfolioTab{appearance:none;background:transparent;border:0;padding:17px 48px 15px;font:inherit;font-size:12px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;color:var(--charcoal);opacity:.48;border-bottom:2px solid transparent;margin-bottom:-1px}
.portfolioTab.active{opacity:1;border-bottom-color:var(--olive)}
.tabPanel{display:none;max-width:1450px;margin:0 auto}.tabPanel.active{display:block}
.tabPanel .projectList{grid-template-columns:repeat(2,minmax(0,1fr))}
.tabPanel .coming{min-height:360px}
@media(max-width:800px){.magazineHome>header{display:none}.portfolioTabs{padding:65px 7vw 85px}.portfolioIntro h2{font-size:40px}.tabControls{margin-bottom:38px}.portfolioTab{padding:15px 22px;font-size:10px}.tabPanel .projectList{grid-template-columns:1fr}}

/* Version 29 — continuous portfolio reel + endless lightbox */
.portfolioReelSection{padding:100px 0 110px;background:#f6f2ea;overflow:hidden}.portfolioReelSection .portfolioIntro{padding:0 7vw 35px}.reelShell{position:relative}.portfolioReel{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 7vw 22px;scrollbar-width:none}.portfolioReel::-webkit-scrollbar{display:none}.reelItem{flex:0 0 clamp(280px,34vw,520px);height:clamp(390px,48vw,650px);position:relative;border:0;padding:0;background:#ddd;cursor:pointer;overflow:hidden;scroll-snap-align:center}.reelItem img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.reelItem:hover img{transform:scale(1.015)}.reelItem span{position:absolute;left:0;right:0;bottom:0;padding:34px 20px 16px;color:white;text-align:left;font-size:12px;letter-spacing:.12em;text-transform:uppercase;background:linear-gradient(transparent,rgba(0,0,0,.62))}.reelArrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:1px solid rgba(27,27,25,.22);background:rgba(246,242,234,.92);font-size:36px;line-height:1;cursor:pointer}.reelPrev{left:2vw}.reelNext{right:2vw}.lightbox{position:fixed;inset:0;z-index:9999;background:rgba(17,17,16,.96);display:none;align-items:center;justify-content:center}.lightbox.open{display:flex}.galleryOpen{overflow:hidden}.lightboxStage{width:min(86vw,1500px);height:88vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.lightboxStage img{max-width:100%;max-height:calc(88vh - 55px);width:auto;height:auto;object-fit:contain;box-shadow:0 12px 50px rgba(0,0,0,.28)}.lightboxMeta{width:100%;display:flex;justify-content:space-between;color:#f6f2ea;padding-top:14px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.lightboxArrow,.lightboxClose{position:absolute;border:0;background:transparent;color:#f6f2ea;cursor:pointer}.lightboxArrow{top:50%;transform:translateY(-50%);font-size:62px;padding:20px}.lightboxPrev{left:1.5vw}.lightboxNext{right:1.5vw}.lightboxClose{right:2vw;top:18px;font-size:42px;padding:8px 14px}@media(max-width:800px){.portfolioReelSection{padding:70px 0}.portfolioReelSection .portfolioIntro{padding:0 5vw 25px}.portfolioReel{padding:0 5vw 18px;gap:12px}.reelItem{flex-basis:82vw;height:62vh;max-height:620px}.reelArrow{display:none}.lightboxStage{width:92vw;height:84vh}.lightboxStage img{max-height:calc(84vh - 55px)}.lightboxArrow{font-size:48px;padding:10px;top:auto;bottom:10px}.lightboxPrev{left:18px}.lightboxNext{right:18px}.lightboxMeta{padding:12px 55px 0;font-size:10px}.lightboxClose{right:10px;top:8px}}

/* Version 30 — portfolio naming + stronger Vision Haus typography */
.reelItem span{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:none}
.lightboxMeta{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:none}
.lightboxMeta span{font-weight:700}

/* Version 31: founder story moved directly below the homepage hero */
.aboutEarly{padding-top:96px;padding-bottom:104px}
.aboutEarly h2{margin:.35em 0 .45em}
.aboutEarly .lead{margin-top:0}
@media(max-width:800px){.aboutEarly{padding-top:68px;padding-bottom:76px}}

/* Version 32: expanded specialties, personal/GC about story, simplified process */
.clientCategories{grid-template-columns:repeat(3,1fr);padding-bottom:0}
.clientCategories>div{min-height:170px;border-bottom:1px solid rgba(27,27,25,.12)}
.clientCategories>div:nth-child(3n){border-right:0}
.aboutEarly h2,.aboutEarly .lead,.aboutEarly p:not(.eyebrow){font-family:Georgia,'Times New Roman',serif}
.aboutEarly p:not(.eyebrow){font-size:18px;line-height:1.75}
.aboutEarly .lead{font-size:25px;line-height:1.5}
.simpleProcess{background:#ebe5d9}
.processIntro{font-family:Georgia,'Times New Roman',serif;font-size:20px;line-height:1.65;max-width:760px;margin:0 0 48px}
.simpleSteps{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.simpleStep{background:var(--ivory);padding:38px 36px;min-height:270px;border:0}
.simpleStep span{display:inline-flex;width:44px;height:44px;border-radius:50%;align-items:center;justify-content:center;background:var(--olive);color:white;font-family:Georgia,serif;font-size:16px}
.simpleStep h3{font-family:Georgia,'Times New Roman',serif;font-size:28px;font-weight:400;margin:24px 0 12px}
.simpleStep p{font-size:16px;line-height:1.7;margin:0;opacity:.78}
@media(max-width:800px){.clientCategories{grid-template-columns:1fr 1fr;padding:0}.clientCategories>div,.clientCategories>div:nth-child(3n){border-right:1px solid rgba(27,27,25,.12)}.clientCategories>div:nth-child(2n){border-right:0}.simpleSteps{grid-template-columns:1fr}.simpleStep{min-height:0;padding:30px 26px}.aboutEarly p:not(.eyebrow){font-size:17px}}
.remoteDesign{padding:90px 16vw;text-align:center;background:var(--ivory);border-top:1px solid var(--line)}
.remoteDesign h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(36px,4vw,54px);margin:16px auto 24px;max-width:850px}
.remoteDesign>p:not(.eyebrow){font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.7;max-width:880px;margin:0 auto 16px}
@media(max-width:800px){.remoteDesign{padding:70px 7vw}.remoteDesign>p:not(.eyebrow){font-size:17px}}

/* Clickable navigation layered over the magazine hero artwork */
.magazineHero{position:relative}
.heroHotspots{display:block;position:absolute;inset:0;z-index:8;pointer-events:none}
.heroHotspots a{position:absolute;display:block;pointer-events:auto;cursor:pointer}
.heroHotspots .hotHome{left:55.8%;top:2.3%;width:4.7%;height:5.2%}
.heroHotspots .hotAbout{left:61.2%;top:2.3%;width:5.7%;height:5.2%}
.heroHotspots .hotPortfolio{left:67.8%;top:2.3%;width:7.8%;height:5.2%}
.heroHotspots .hotApproach{left:76.3%;top:2.3%;width:9.9%;height:5.2%}
.heroHotspots .hotContact{left:86.8%;top:2.3%;width:7.3%;height:5.2%}
.heroHotspots .hotDiscover{left:4.4%;top:48.5%;width:15.7%;height:5.6%}
#about,#approach,#work,#contact{scroll-margin-top:24px}
@media(max-width:800px){.heroHotspots{display:none}.magazineHome:before{content:'';display:block}.magazineHome main:before{content:''}.magazineHome .mobileQuickNav{display:none}}

/* Version 36: founder imagery, design-through-completion, testimonials + FAQ */
.designThrough{display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch;background:var(--ivory);padding:0}
.designThroughCopy{padding:95px 7vw;display:flex;flex-direction:column;justify-content:center}
.designThroughCopy h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(42px,5vw,68px);line-height:1.02;margin:14px 0 12px}
.designThroughCopy h3{font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:400;margin:0 0 28px;color:var(--olive)}
.designThroughCopy>p:not(.eyebrow){font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.7;max-width:720px}
.designThroughCopy .serviceLine{font-size:13px!important;letter-spacing:.08em;line-height:1.8!important;text-transform:uppercase;margin-top:24px}
.designThroughImage{min-height:620px}.designThroughImage img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 32%}
.testimonials{padding:95px 16vw;text-align:center;background:var(--olive);color:var(--ivory)}
.testimonials h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(38px,4vw,56px);font-weight:400;max-width:900px;margin:16px auto 24px}
.testimonials>p:not(.eyebrow){font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.7;max-width:820px;margin:0 auto 15px}.testimonials .testimonialNote{opacity:.68;font-size:15px!important}
.faqSection{padding:100px 8vw 110px;background:var(--ivory);display:grid;grid-template-columns:.75fr 1.25fr;gap:8vw;align-items:start}.faqIntro{position:sticky;top:40px}.faqIntro h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(40px,4vw,58px);margin:15px 0 18px}.faqIntro>p:last-child{font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.7}.faqGrid details{border-top:1px solid rgba(27,27,25,.2);padding:0}.faqGrid details:last-child{border-bottom:1px solid rgba(27,27,25,.2)}.faqGrid summary{font-family:Georgia,'Times New Roman',serif;font-size:21px;line-height:1.4;padding:24px 42px 24px 0;cursor:pointer;position:relative;list-style:none}.faqGrid summary::-webkit-details-marker{display:none}.faqGrid summary:after{content:'+';position:absolute;right:5px;top:21px;font-size:28px;font-weight:300}.faqGrid details[open] summary:after{content:'−'}.faqGrid details p{font-size:16px;line-height:1.75;max-width:760px;padding:0 40px 26px 0;margin:0;opacity:.8}
#services,#process,#faq,#testimonials{scroll-margin-top:24px}
@media(max-width:800px){.designThrough{grid-template-columns:1fr}.designThroughCopy{padding:70px 7vw}.designThroughImage{min-height:520px}.testimonials{padding:70px 7vw}.faqSection{grid-template-columns:1fr;gap:38px;padding:75px 7vw 85px}.faqIntro{position:static}.faqGrid summary{font-size:19px}}

/* v40 portfolio presentation */
.reelItem.renderItem img{object-fit:contain;background:#eee9df}.aboutHello{font-family:Georgia,'Times New Roman',serif;font-size:24px;line-height:1.2;margin:0 0 10px;font-weight:400}

/* V49 — show full Commercial Office I boardroom image in portfolio reel */
.reelItem.fullPhoto img{object-fit:contain;background:#f6f2ea}

/* Vision Haus contact inquiry modal */
.contact .contactOpen{font:inherit;cursor:pointer;border:0}
.contactDialog{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:28px}
.contactDialog.open{display:flex}.contactDialogBackdrop{position:absolute;inset:0;background:rgba(27,27,25,.76);backdrop-filter:blur(3px)}
.contactDialogPanel{position:relative;z-index:1;width:min(760px,100%);max-height:90vh;overflow:auto;background:#F6F2EA;color:#1B1B19;padding:48px 50px 42px;box-shadow:0 24px 80px rgba(0,0,0,.28)}
.contactDialogPanel .eyebrow{letter-spacing:.18em;font-size:.75rem;margin:0 0 10px;color:#303526}.contactDialogPanel h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.02;margin:0 42px 12px 0;font-weight:400}
.contactIntro{margin:0 0 28px;max-width:600px;line-height:1.6}.contactClose{position:absolute;right:22px;top:16px;border:0;background:transparent;font-size:2.25rem;line-height:1;cursor:pointer;color:#1B1B19;font-weight:300}
.contactForm{display:grid;gap:18px}.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.contactForm label{display:grid;gap:7px;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.contactForm input,.contactForm select,.contactForm textarea{width:100%;box-sizing:border-box;border:1px solid rgba(27,27,25,.28);border-radius:0;background:#fffdf8;color:#1B1B19;padding:13px 14px;font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;outline:none}
.contactForm textarea{resize:vertical;min-height:125px}.contactForm input:focus,.contactForm select:focus,.contactForm textarea:focus{border-color:#303526;box-shadow:0 0 0 1px #303526}
.contactForm .formSubmit{justify-self:start;border:0;cursor:pointer;margin-top:2px}.formNote{font-size:.78rem;opacity:.68;margin:0}.hiddenField{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}.contactOpenBody{overflow:hidden}
@media(max-width:650px){.contactDialog{padding:14px}.contactDialogPanel{padding:38px 22px 30px}.formGrid{grid-template-columns:1fr}.contactDialogPanel h2{margin-right:30px}}
.thankYouPage{margin:0;background:#F6F2EA;color:#1B1B19;min-height:100vh}.thankYouWrap{min-height:100vh;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px}
.thankYouLogo{width:min(260px,70vw);margin-bottom:48px}.thankYouWrap h1{font-size:clamp(2.4rem,6vw,4.8rem);font-weight:400;line-height:1;margin:.15em 0 .3em}.thankYouWrap p:not(.eyebrow){max-width:620px;line-height:1.65;margin:0 0 30px}

/* Make homepage Start a conversation CTA clearly visible */
.contact .contactOpen{
  background:#F6F2EA !important;
  color:#1B1B19 !important;
  border:1px solid #F6F2EA !important;
  padding:15px 28px !important;
  opacity:1 !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  font-weight:600 !important;
  letter-spacing:.16em;
  text-transform:uppercase;
  box-shadow:0 2px 14px rgba(0,0,0,.12);
}
.contact .contactOpen:hover,
.contact .contactOpen:focus{
  background:#ffffff !important;
  color:#1B1B19 !important;
  border-color:#ffffff !important;
}


/* FINAL MOBILE RESPONSIVE + FORM SUBMISSION FIX */
.formSuccess{margin:2px 0 0;font-size:.9rem;line-height:1.5;color:#303526;font-weight:600}
.formSubmit:disabled{opacity:.72;cursor:default}

@media (max-width: 768px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  body{font-size:16px}
  img,video,svg{max-width:100%;height:auto}

  header,.nav,.navbar{max-width:100%;box-sizing:border-box}
  nav{padding-left:18px!important;padding-right:18px!important}
  nav .links{gap:12px!important;flex-wrap:wrap!important;justify-content:center!important}

  .hero{min-height:auto!important;height:auto!important;padding-top:92px!important;padding-bottom:54px!important}
  .hero-inner,.hero-content{width:auto!important;max-width:none!important;margin-left:20px!important;margin-right:20px!important;padding-left:0!important;padding-right:0!important}
  .hero h1{font-size:clamp(2.7rem,13vw,4.4rem)!important;line-height:.96!important}
  .hero p{font-size:1rem!important;line-height:1.55!important}

  section{box-sizing:border-box}
  .section,.about,.services,.process,.remote,.faq,.contact{padding-left:20px!important;padding-right:20px!important}
  h1,h2,h3,p{overflow-wrap:break-word}
  h2{font-size:clamp(2rem,9vw,3rem)!important;line-height:1.05!important}

  .about-grid,.services-grid,.service-grid,.process-grid,.remote-grid,.footer-grid{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }

  .portfolio-track,.portfolio-reel{gap:12px!important;padding-left:20px!important;padding-right:20px!important}
  .portfolio-card,.portfolio-item{max-width:82vw!important;flex:0 0 82vw!important}
  .portfolio-card img,.portfolio-item img{width:100%!important;height:auto!important;object-fit:contain!important}

  .contact{padding-top:54px!important;padding-bottom:54px!important;text-align:center!important}
  .contact img{max-width:190px!important}
  .contact h2{font-size:clamp(2.5rem,11vw,3.6rem)!important}
  .contact p{font-size:.96rem!important;line-height:1.55!important}
  .contact .contactOpen{width:auto!important;max-width:100%!important;padding:15px 22px!important;font-size:.78rem!important;letter-spacing:.13em!important}

  .contactDialog{padding:10px!important;align-items:flex-start!important;overflow-y:auto!important}
  .contactDialogPanel{
    width:100%!important;max-width:100%!important;max-height:none!important;
    margin:10px 0!important;padding:42px 20px 28px!important;box-sizing:border-box!important;
  }
  .contactDialogPanel h2{font-size:2.25rem!important;margin-right:28px!important}
  .contactIntro{font-size:.95rem!important}
  .formGrid{grid-template-columns:1fr!important;gap:16px!important}
  .contactForm{gap:16px!important}
  .contactForm input,.contactForm select,.contactForm textarea{
    min-height:48px!important;font-size:16px!important;padding:12px!important;
  }
  .contactForm textarea{min-height:120px!important}
  .contactForm .formSubmit{width:100%!important;justify-content:center!important;text-align:center!important}
  .contactClose{right:14px!important;top:10px!important}
}

@media (max-width: 480px){
  nav .links{font-size:.7rem!important}
  .hero{padding-top:80px!important}
  .hero h1{font-size:3rem!important}
  .portfolio-card,.portfolio-item{max-width:88vw!important;flex-basis:88vw!important}
}


/* FINAL MOBILE HEADER + MAGAZINE HERO + ANCHOR FIX */
#home,#about,#work,#approach,#contact{scroll-margin-top:132px}
.contactFallback{font-size:.88rem!important;line-height:1.55!important;margin:-12px 0 24px!important}
.contactFallback a{text-decoration:underline;text-underline-offset:3px;font-weight:600}

@media (max-width:800px){
  header{
    min-height:0!important;
    padding:14px 16px 12px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:12px!important;
    position:relative!important;
    background:#F6F2EA!important;
    z-index:50!important;
  }
  header .headerLogo img{width:175px!important;max-width:58vw!important}
  header .siteNav{
    display:flex!important;
    width:100%!important;
    max-width:100%!important;
    gap:0!important;
    justify-content:space-between!important;
    align-items:center!important;
    overflow-x:auto!important;
    padding:0 2px 4px!important;
    font-size:9px!important;
    line-height:1.2!important;
    letter-spacing:.07em!important;
    white-space:nowrap!important;
    scrollbar-width:none;
  }
  header .siteNav::-webkit-scrollbar{display:none}
  header .siteNav a{
    display:block!important;
    flex:0 0 auto!important;
    padding:7px 5px!important;
    border-bottom:1px solid transparent;
  }
  header .siteNav a:active,header .siteNav a:focus{border-bottom-color:#1B1B19}

  /* The magazine hero is a single designed image. Show the complete composition on phones
     instead of enlarging/cropping it beyond the viewport. */
  .magazineHero{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    padding:0!important;
    margin:0!important;
  }
  .magazineHero img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    transform:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  .heroHotspots{display:none!important}

  /* Keep the section immediately beneath the hero comfortably inside a phone viewport. */
  .luxeApproach{
    margin:0!important;
    padding:44px 20px 42px!important;
    width:100%!important;
    max-width:100%!important;
  }
  .luxeApproach blockquote{
    font-size:clamp(28px,8.5vw,38px)!important;
    line-height:1.08!important;
    margin:14px auto 20px!important;
  }
  .luxeApproach .approachCopy{width:100%!important;max-width:100%!important}
  .luxeApproach .approachCopy p{
    font-size:16px!important;
    line-height:1.6!important;
    margin:0 0 14px!important;
  }
  .luxeApproach .approachClosing{font-size:18px!important}

  #about,#work,#approach,#contact{scroll-margin-top:112px!important}

  .contactFallback{
    font-size:.86rem!important;
    overflow-wrap:anywhere!important;
    margin:-8px 0 22px!important;
  }
}

@media (max-width:390px){
  header .siteNav{font-size:8px!important;letter-spacing:.04em!important}
  header .siteNav a{padding-left:3px!important;padding-right:3px!important}
}

/* Mobile-only readability adjustment for the Our Approach section below the main image */
@media (max-width:800px){
  .luxeApproach .eyebrow{
    font-size:13px !important;
    line-height:1.4 !important;
    letter-spacing:.16em !important;
  }
  .luxeApproach blockquote{
    font-size:clamp(32px,9.5vw,42px) !important;
    line-height:1.08 !important;
  }
  .luxeApproach .approachCopy p{
    font-size:18px !important;
    line-height:1.62 !important;
  }
  .luxeApproach .approachClosing{
    font-size:20px !important;
    line-height:1.5 !important;
  }
}

/* Refined client testimonial */
.testimonialFeature{background:#303526!important;color:#F6F2EA!important;max-width:none!important;margin:0!important;padding:88px 9%!important;text-align:center!important}
.testimonialFeature .eyebrow,.testimonialFeature h2,.testimonialFeature .testimonialByline{color:#F6F2EA!important}
.testimonialFeature h2{font-size:clamp(28px,3vw,42px)!important;font-weight:400!important;margin:8px 0 30px!important}
.testimonialFeature blockquote{max-width:850px!important;margin:0 auto!important;font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive!important;font-size:clamp(18px,1.65vw,23px)!important;font-weight:300!important;line-height:1.72!important;letter-spacing:.01em!important;opacity:.94}
.testimonialFeature blockquote p{margin:0 0 18px!important}
.testimonialFeature .testimonialByline{margin-top:28px!important;font-size:11px!important;font-weight:400!important;letter-spacing:.14em!important;opacity:.82}
@media(max-width:800px){.testimonialFeature{padding:64px 24px!important}.testimonialFeature h2{font-size:30px!important;margin-bottom:24px!important}.testimonialFeature blockquote{font-size:17px!important;line-height:1.68!important;max-width:620px!important}.testimonialFeature .testimonialByline{font-size:10px!important}}

/* Softer testimonial typography — refined, light, and consistent with Vision Haus */
.testimonialFeature blockquote{
  font-family:var(--serif) !important;
  font-size:clamp(17px,1.5vw,21px) !important;
  font-weight:300 !important;
  font-style:italic !important;
  line-height:1.72 !important;
  letter-spacing:.005em !important;
  max-width:820px !important;
  opacity:.90 !important;
}
.testimonialFeature blockquote p{margin:0 0 17px !important;}
.testimonialFeature h2{
  font-family:var(--serif) !important;
  font-weight:300 !important;
  letter-spacing:.01em !important;
}
.testimonialFeature .testimonialByline{
  font-family:var(--sans) !important;
  font-weight:400 !important;
  opacity:.78 !important;
}
@media(max-width:800px){
  .testimonialFeature blockquote{
    font-size:16.5px !important;
    line-height:1.7 !important;
  }
}

/* Portfolio desktop alignment revision: exactly three equal cards across the viewport */
@media (min-width: 801px){
  .portfolioReel{
    gap:18px;
    padding-left:7vw;
    padding-right:7vw;
  }
  .portfolioReel .reelItem{
    flex:0 0 calc((86vw - 36px) / 3);
    width:calc((86vw - 36px) / 3);
    max-width:none;
  }
}