/* ARKHE / Bespoke commissioned-style concept sites. Three design systems, real source data. */
:root{color-scheme:dark;--bg:#0c1218;--ink:#f6f7f6;--muted:#a9bac7;--accent:#e5ae7a;--line:#ffffff22;--font:Manrope,Inter,system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.6 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}[hidden]{display:none!important}button,input,select,textarea{font:inherit}button,a{transition:background .2s,border-color .2s,color .2s,transform .2s}button{cursor:pointer}a{color:inherit;text-decoration:none}a:hover,button:hover{filter:brightness(1.1)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}h1,h2,h3,p{margin:0}
.theme-roof{--bg:#0d131b;--ink:#f8f6f1;--muted:#a9b4c0;--accent:#e7ae78;--line:#d8bd9b38;--display:Outfit,Inter,sans-serif;--font:Manrope,Inter,sans-serif}
.theme-land{--bg:#f1eee5;--ink:#172a25;--muted:#5b685f;--accent:#677f56;--line:#172a2533;--display:"Cormorant Garamond",Georgia,serif;--font:Manrope,Inter,sans-serif;color-scheme:light}
.theme-auto{--bg:#080b11;--ink:#f8fbff;--muted:#a9b8c7;--accent:#fd995e;--line:#4daee736;--display:Outfit,Inter,sans-serif;--font:Manrope,Inter,sans-serif}
.site-header{position:sticky;z-index:90;top:0;display:flex;align-items:center;gap:22px;padding:12px clamp(15px,3vw,58px);min-height:74px;background:#0b121bea;border-bottom:1px solid #ffffff24;color:#f5f8ff;backdrop-filter:blur(18px)}
.theme-land .site-header{background:#eeeae4f4;color:#172a25;border-color:#172a252b}
.brand{display:flex;align-items:center;gap:13px;border:0;background:none;color:inherit;padding:0;text-align:left;letter-spacing:.14em;font:800 15px var(--font);margin-right:auto;flex:none}
.brand .symbol{display:grid;place-items:center;border:1px solid var(--accent);width:36px;height:36px;transform:rotate(-15deg);border-radius:8px;color:var(--accent);font-size:21px}
.brand small{display:block;font-size:9px;color:var(--muted);letter-spacing:.095em;margin-top:3px}
.site-header nav{display:flex;gap:4px;align-items:center;overflow:auto;scrollbar-width:none}
.site-header nav button{background:none;border:1px solid transparent;border-radius:50px;padding:9px 11px;color:inherit;font-size:11px;white-space:nowrap}
.site-header nav button[aria-current="page"]{border-color:var(--accent);color:var(--accent);background:#869bb111}
.header-call{font:800 10px var(--font);letter-spacing:.05em;padding:12px 14px;border-radius:5px;background:var(--accent);color:#0b1018;white-space:nowrap}
.theme-land .header-call{color:white}
.hero{position:relative;overflow:hidden;display:flex;align-items:center;min-height:clamp(520px,75vh,800px);isolation:isolate;background:#111b24}
.hero-visual{position:absolute;inset:0;z-index:-3}.hero-visual img{height:100%;width:100%;object-fit:cover;object-position:center;filter:saturate(.8) contrast(1.08)}
.hero-visual.image-failed{background:linear-gradient(120deg,#1d2837,#252931)}
.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#09121df5 0%,#09121dd7 39%,#0d17205e 75%,#09121d1b)}
.hero-content{width:min(100%,1480px);margin:auto;padding:clamp(55px,7vw,125px) clamp(22px,6vw,95px);z-index:3}
.eyebrow,.page-head>small,.about-grid small,.contact-grid small{font:800 10px/1.6 var(--font);letter-spacing:.18em;color:var(--accent);text-transform:uppercase}
.hero h1{font:700 clamp(57px,7.3vw,124px)/.95 var(--display);letter-spacing:-.06em;max-width:890px;margin:21px 0 22px;text-wrap:balance}
.hero p{font:500 clamp(15px,1.3vw,19px)/1.75 var(--font);max-width:555px;color:#dbe4e9}
.actions{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-top:29px}
.actions button,.primary,.secondary,.source-action{border-radius:5px;padding:13px 20px;min-height:45px;font:800 12px var(--font);display:inline-flex;align-items:center;justify-content:center}
.primary,.actions .primary{border:1px solid var(--accent);background:var(--accent);color:#08111c}
.secondary,.actions .secondary{border:1px solid #f5f6ff88;background:#0a152155;color:#f5f6ff}
.hero-tags{display:flex;gap:12px;flex-wrap:wrap;margin-top:55px;font:700 9px var(--font);letter-spacing:.13em;color:#e0e9ed}.hero-tags span{padding-left:12px;border-left:2px solid var(--accent)}
.photo-credit{position:absolute;bottom:14px;right:18px;z-index:2;background:#07111ce3;color:#e6ecf4;padding:6px 10px;font:600 9px var(--font);border:1px solid #ffffff32;max-width:330px}
.intro-band{display:grid;grid-template-columns:1fr .8fr;gap:30px;max-width:1450px;margin:0 auto;padding:80px clamp(20px,5vw,75px);align-items:center}
.intro-band>div:first-child{display:grid;gap:22px;align-content:center}.intro-band small{font:800 10px var(--font);letter-spacing:.15em;color:var(--accent)}
.intro-band h2{font:600 clamp(35px,5vw,72px)/1.05 var(--display);letter-spacing:-.05em}.intro-band p{color:var(--muted);max-width:570px;font-size:16px}
.band-image{height:320px;overflow:hidden;background:#233146}.band-image img{width:100%;height:100%;object-fit:cover}
.service-teasers{max-width:1450px;margin:0 auto 95px;padding:0 clamp(20px,5vw,75px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.service-teasers button{display:flex;flex-direction:column;align-items:flex-start;min-height:210px;gap:13px;padding:23px;text-align:left;border:1px solid var(--line);background:#8898a112;color:var(--ink)}
.service-teasers button:hover,.service:hover{transform:translateY(-4px);border-color:var(--accent)}
.service-teasers b{font:650 25px var(--display)}.service-teasers span{color:var(--muted);font-size:12px}.service-teasers em{margin-top:auto;color:var(--accent);font-size:11px;font-style:normal;font-weight:800}.service-teasers small{color:var(--accent)}
.page-head{max-width:1450px;margin:auto;padding:clamp(58px,8vw,110px) clamp(23px,5vw,75px) clamp(36px,5vw,80px)}
.page-head h2{margin:17px 0 18px;font:600 clamp(52px,7vw,109px)/.99 var(--display);letter-spacing:-.055em;max-width:1140px}.page-head p{max-width:730px;color:var(--muted);font-size:17px}
.services-grid{max-width:1450px;margin:0 auto 110px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;padding:0 clamp(20px,5vw,75px)}
.service{border:1px solid var(--line);min-height:280px;padding:28px;display:flex;align-items:flex-start;flex-direction:column;gap:19px;background:#859bb10b;transition:transform .2s}
.service small{color:var(--accent);font-size:12px;font-weight:800}.service h3{font:600 clamp(28px,3vw,40px)/1.1 var(--display);letter-spacing:-.04em}.service p{font:500 13px/1.8 var(--font);color:var(--muted)}.service button{margin-top:auto;padding:0;border:0;color:var(--accent);font:800 12px var(--font);background:none}
.project-mosaic{display:grid;grid-template-columns:1.65fr .85fr;gap:13px;max-width:1450px;margin:0 auto;padding:0 clamp(20px,5vw,75px)}
.project-mosaic figure{position:relative;overflow:hidden;min-height:440px;margin:0;background:#0f1a25}.project-mosaic figure:nth-child(2){min-height:440px}
.project-mosaic img{width:100%;height:100%;position:absolute;object-fit:cover}.project-mosaic figcaption{position:absolute;bottom:12px;left:12px;right:12px;padding:8px 10px;background:#081420d6;color:white;font-size:10px}
.source-bar{max-width:1300px;margin:24px auto 90px;border:1px solid var(--line);padding:25px;display:flex;justify-content:space-between;align-items:center;gap:18px}
.source-bar div{display:grid;gap:5px}.source-bar strong{font-size:12px;letter-spacing:.1em}.source-bar span{color:var(--muted);font-size:13px}.source-action{background:var(--accent);color:#071019;white-space:nowrap}
.about-grid{max-width:1450px;margin:0 auto 90px;padding:0 clamp(20px,5vw,75px);display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px}.about-image{height:480px}.about-image img{width:100%;height:100%;object-fit:cover}
.about-grid h3{font:600 clamp(44px,5vw,70px)/1.05 var(--display);margin:14px 0}.about-grid p{color:var(--muted);font-size:17px}.about-grid ul{list-style:none;padding:0;margin:25px 0}.about-grid li{padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.06em}.about-grid li:before{content:'↗';margin-right:12px;color:var(--accent)}
.reviews-grid{max-width:1450px;margin:0 auto 100px;padding:0 clamp(20px,5vw,75px);display:grid;grid-template-columns:1.2fr .8fr;gap:14px}
.reviews-grid blockquote,.review-source{margin:0;padding:clamp(27px,4vw,55px);border:1px solid var(--line);background:#919f9e0e}
.stars{color:var(--accent);letter-spacing:.15em;font-size:20px}
.reviews-grid blockquote p{font:500 clamp(27px,3.3vw,50px)/1.22 var(--display);margin:22px 0 32px}
.reviews-grid blockquote footer{display:grid;gap:5px}.reviews-grid blockquote footer span{font-size:12px;color:var(--muted)}
.review-source h3{font:600 38px/1.1 var(--display);margin:14px 0}.review-source small{color:var(--accent);font-weight:800}.review-source p{font-size:14px;color:var(--muted);margin:0 0 25px}
.area-grid{max-width:1450px;padding:0 clamp(20px,5vw,75px);margin:0 auto 100px;display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.area-display{position:relative;isolation:isolate;min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at center,#346c8398,transparent 48%),#142c3a;color:#d8f3fc}
.area-display:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#bcf6ff13 1px,transparent 1px),linear-gradient(90deg,#bcf6ff13 1px,transparent 1px);background-size:31px 31px;transform:perspective(410px) rotateX(24deg)}
.radar-rings{position:absolute;border:1px solid #80d9ff86;width:340px;height:340px;border-radius:50%;box-shadow:0 0 0 38px #75d8ff08,inset 0 0 70px #2ba7d847}.area-display span,.area-display b,.area-display small{position:relative;z-index:2}.area-display b{font:700 55px var(--display)}.area-display span,.area-display small{font:700 11px var(--font);letter-spacing:.18em}
.area-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start}.area-list span{display:flex;align-items:center;padding:17px 14px;background:#829eb10b;border:1px solid var(--line);font:700 12px var(--font)}
.contact-grid{max-width:1450px;margin:0 auto 100px;padding:0 clamp(20px,5vw,75px);display:grid;grid-template-columns:1fr 1fr;gap:22px}
.contact-grid>div{padding:35px;border:1px solid var(--line)}.contact-grid h3{font:600 40px var(--display);margin:13px 0}.phone{display:block;font:600 clamp(29px,3vw,49px) var(--display);margin:30px 0;color:var(--accent)}.contact-grid p{color:var(--muted);margin:13px 0 28px}
.contact-notes label{display:grid;gap:6px;margin:18px 0;font-size:12px}.contact-notes select,.contact-notes textarea{width:100%;border:1px solid var(--line);background:#141b2422;color:inherit;padding:12px;resize:vertical}.contact-notes select option{color:#111}.contact-notes .secondary{background:var(--accent);color:#09111b;border-color:var(--accent)}
.footer{border-top:1px solid var(--line);padding:33px clamp(20px,5vw,75px) 57px;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer>div{display:grid;gap:4px}.footer b{font-size:13px;letter-spacing:.13em}.footer small{color:var(--muted);font-size:10px}.footer a{color:var(--accent);font-size:12px}
.site-notice{position:fixed;bottom:0;left:0;right:0;z-index:100;background:#071018e9;color:#c9d9e2;font:700 9px/1.3 var(--font);letter-spacing:.08em;text-align:center;padding:8px 12px;border-top:1px solid #c9d9e231}
.theme-land .hero{background:#e9e5da}.theme-land .hero-shade{background:linear-gradient(90deg,#e9e6def4 0%,#e9e6ded9 39%,#e9e6de3b 75%,transparent)}.theme-land .hero h1{color:#172a25;font-weight:500;max-width:900px}.theme-land .hero p{color:#46554b}.theme-land .hero-tags{color:#4b644e}.theme-land .hero-content .secondary{color:#203d31;border-color:#496b59;background:#e6e9df91}
.theme-land .hero-visual img{filter:saturate(.86) contrast(1.03)}.theme-land .service-teasers button,.theme-land .service{background:#e5e8da}.theme-land .site-header nav button[aria-current="page"]{background:#61795717}
.theme-roof .hero h1,.theme-auto .hero h1{text-transform:uppercase;font-weight:800}
.theme-roof .hero:after{content:'01 / BUILT TO PROTECT';position:absolute;right:26px;top:52%;writing-mode:vertical-rl;color:#e2b88980;letter-spacing:.22em;font-size:9px;font-weight:800}
.theme-auto .hero-shade{background:linear-gradient(90deg,#050910f5,#09121be6 44%,#0b172168 70%,#08111b26)}.theme-auto .site-header{background:#05080ef5}.theme-auto .hero h1{max-width:920px;font-style:italic;letter-spacing:-.075em}.theme-auto .service-teasers button{background:linear-gradient(145deg,#142434,#10141b)}.theme-auto .hero-photo img{filter:contrast(1.1)}
.image-failed{background:linear-gradient(145deg,#172735,#2a3338)}.image-failed:after{content:'View photography at original company website';display:grid;place-items:center;padding:35px;color:white;text-align:center}
@media(max-width:1190px){.site-header{gap:10px;padding:9px 13px}.site-header nav button{padding:8px 6px;font-size:10px}.header-call{font-size:9px;padding:10px}.brand{font-size:12px}.brand small{font-size:8px}}
@media(max-width:850px){.site-header{flex-wrap:wrap}.site-header nav{order:3;flex:1 0 100%;justify-content:flex-start}.hero{min-height:625px}.hero h1{font-size:clamp(54px,10vw,88px)}.intro-band,.about-grid,.reviews-grid,.contact-grid,.area-grid{grid-template-columns:1fr}.services-grid{grid-template-columns:repeat(2,1fr)}.intro-band{gap:14px;padding-top:44px}.band-image{height:270px}.header-call{margin-left:auto}.project-mosaic{grid-template-columns:1fr 1fr}.project-mosaic figure{min-height:290px!important}}
@media(max-width:550px){.site-header{min-height:56px;padding:7px 9px;gap:6px}.site-header nav{padding:3px 0}.site-header nav button{font-size:10px}.brand{font-size:11px}.brand .symbol{width:29px;height:29px}.brand small{display:none}.header-call{font-size:8px;max-width:142px;text-overflow:ellipsis;overflow:hidden;padding:8px}.hero{min-height:650px}.hero-content{padding:46px 21px}.hero h1{font-size:clamp(49px,12vw,75px);margin:20px 0}.hero p{font-size:13px}.hero-tags{gap:8px;font-size:8px}.photo-credit{font-size:8px;left:8px;right:8px;bottom:5px;max-width:none}.intro-band{padding:55px 20px}.intro-band h2{font-size:43px}.service-teasers,.services-grid{grid-template-columns:1fr}.service-teasers{margin-bottom:45px}.service-teasers button{min-height:175px}.page-head{padding-top:50px}.page-head h2{font-size:clamp(48px,12vw,69px)}.project-mosaic{grid-template-columns:1fr}.project-mosaic figure{min-height:240px!important}.source-bar{margin:22px 20px 55px;flex-direction:column;align-items:flex-start}.area-display{min-height:310px}.area-display b{font-size:37px}.area-list span{font-size:10px;padding:11px}.contact-grid>div{padding:24px}.footer{flex-wrap:wrap;padding-bottom:70px}.reviews-grid blockquote p{font-size:34px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
