/* Brownstone — Style 3: Elegant (Architecturer-inspired: cinematic, light Jost sans, boxed logo) */
:root{
  --bg:#F7F4EE;--bg-2:#EFEAE0;--paper:#FCFAF5;
  --ink:#1F1C18;--ink-2:#5E574B;--brass:#A07C44;--brass-2:#C2A064;
  --line:#E0D8C9;--char:#16140F;
  --serif:"Jost",system-ui,sans-serif;--sans:"Jost",system-ui,sans-serif;
  --maxw:1300px;--ease:cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.85;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{display:block;max-width:100%;}a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;line-height:1.14;margin:0;letter-spacing:-.01em;}
em{font-style:normal;color:var(--brass);}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 44px;}
.eyebrow{font-family:var(--sans);text-transform:uppercase;letter-spacing:.42em;font-size:10.5px;font-weight:400;color:var(--brass);margin:0;}
.eyebrow.light{color:#D7B884;}
.rule{width:46px;height:1px;background:var(--brass);margin:22px auto;}
.rule.left{margin-left:0;}
.btn{display:inline-block;font-family:var(--sans);text-transform:uppercase;letter-spacing:.26em;font-size:11px;font-weight:400;padding:18px 40px;border:1px solid var(--ink);color:var(--ink);background:transparent;transition:all .4s var(--ease);}
.btn:hover{background:var(--ink);color:var(--bg);}
.btn.light{border-color:rgba(255,255,255,.7);color:#fff;}
.btn.light:hover{background:#fff;color:var(--ink);}
.btn.gold{border-color:var(--brass);color:var(--brass);}
.btn.gold:hover{background:var(--brass);color:#fff;}
.linklike{font-family:var(--sans);text-transform:uppercase;letter-spacing:.26em;font-size:11px;border-bottom:1px solid var(--brass);padding-bottom:4px;color:inherit;transition:.3s;}
.linklike:hover{color:var(--brass);}
/* header (inner: sticky solid) */
.el-head{position:sticky;top:0;z-index:50;background:rgba(247,244,238,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);transition:background .4s,border-color .4s;}
.el-bar{max-width:var(--maxw);margin:0 auto;padding:22px 44px;display:flex;align-items:center;justify-content:space-between;gap:24px;}
.el-brand{border:1px solid var(--ink);padding:12px 20px;font-family:var(--sans);font-weight:400;font-size:14px;letter-spacing:.36em;text-transform:uppercase;line-height:1;transition:color .4s,border-color .4s;}
.el-brand small{display:none;}
.el-nav{display:flex;gap:36px;align-items:center;}
.el-nav a{font-family:var(--sans);text-transform:uppercase;letter-spacing:.18em;font-size:11.5px;font-weight:400;color:var(--ink-2);transition:color .3s;position:relative;padding:3px 0;}
.el-nav a:hover,.el-nav a.active{color:var(--ink);}
.el-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--brass);}
.el-nav .styles{color:var(--brass);}
.burger{display:none;background:none;border:0;cursor:pointer;padding:6px;}
.burger span{display:block;width:24px;height:1px;background:var(--ink);margin:6px 0;}
/* header over hero (home) */
.el-head.over{position:fixed;top:0;left:0;right:0;background:transparent;backdrop-filter:none;border-bottom:1px solid rgba(255,255,255,.18);}
.el-head.over .el-brand{border-color:rgba(255,255,255,.8);color:#fff;}
.el-head.over .el-nav a{color:rgba(255,255,255,.85);}
.el-head.over .el-nav a:hover,.el-head.over .el-nav a.active{color:#fff;}
.el-head.over .burger span{background:#fff;}
.el-head.over.solid{position:fixed;background:rgba(247,244,238,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.el-head.over.solid .el-brand{border-color:var(--ink);color:var(--ink);}
.el-head.over.solid .el-nav a{color:var(--ink-2);}
.el-head.over.solid .burger span{background:var(--ink);}
/* hero — cinematic full screen */
.el-hero{position:relative;min-height:100vh;display:flex;align-items:center;color:#fff;overflow:hidden;}
.el-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-color:#1a1610;}
.el-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,12,8,.72),rgba(16,12,8,.48) 55%,rgba(16,12,8,.34));}
.el-hero-inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 44px;width:100%;text-align:left;}
.el-hero .eyebrow{color:#D7B884;}
.el-hero .rule{margin-left:0;background:var(--brass-2);}
.el-hero h1{font-size:clamp(44px,6.6vw,96px);font-weight:200;line-height:1.1;max-width:16ch;letter-spacing:-.01em;}
.el-hero .sub{font-family:var(--sans);font-weight:300;font-size:clamp(15px,1.5vw,19px);max-width:44ch;margin:0;color:rgba(255,255,255,.88);line-height:1.85;}
.el-hero-actions{display:flex;gap:16px;margin-top:38px;flex-wrap:wrap;}
.el-hero-scroll{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.7);font-size:12px;letter-spacing:.2em;text-transform:uppercase;writing-mode:vertical-rl;}
/* page head — cinematic centered */
.pagehead{position:relative;color:#fff;text-align:center;padding:170px 0 120px;overflow:hidden;}
.pagehead-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-color:#1a1610;}
.pagehead::after{content:"";position:absolute;inset:0;background:rgba(16,12,8,.55);}
.pagehead .wrap{position:relative;z-index:2;}
.pagehead h1{font-size:clamp(38px,5.2vw,76px);font-weight:200;}
.pagehead p{max-width:52ch;margin:0 auto;color:rgba(255,255,255,.9);font-size:16.5px;}
.pagehead .rule{background:var(--brass-2);}
/* sections */
.section{padding:120px 0;}.section.tight{padding:80px 0;}
.section.ivory2{background:var(--bg-2);}
.section.dark{background:var(--char);color:var(--bg);}
.section.dark .eyebrow{color:#D7B884;}
.sechead{text-align:center;max-width:680px;margin:0 auto 66px;}
.sechead h2{font-size:clamp(30px,4vw,56px);font-weight:200;}
.sechead p{color:var(--ink-2);margin-top:12px;}
.section.dark .sechead p{color:rgba(247,244,238,.72);}
/* services - numbered */
.el-services{display:grid;grid-template-columns:repeat(3,1fr);gap:0;}
.el-service{text-align:center;padding:36px 32px;border-right:1px solid var(--line);}
.el-service:last-child{border-right:0;}
.el-service .rn{font-family:var(--sans);font-size:13px;letter-spacing:.3em;color:var(--brass);}
.el-service h3{font-size:25px;font-weight:300;margin:18px 0 12px;}
.el-service p{color:var(--ink-2);font-size:15px;margin:0;}
/* figure grid */
.figs{display:grid;grid-template-columns:repeat(12,1fr);gap:46px 38px;}
.fig{position:relative;}
.fig .fig-img{position:relative;overflow:hidden;background:#e2d8c5;}
.fig .fig-img .ph{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.04);transition:transform 1.3s var(--ease);}
.fig:hover .fig-img .ph{transform:scale(1.0);}
.fig figcaption{text-align:center;margin-top:20px;}
.fig .cat{font-family:var(--sans);text-transform:uppercase;letter-spacing:.32em;font-size:10px;color:var(--brass);}
.fig .ttl{font-family:var(--serif);font-size:23px;font-weight:300;margin-top:9px;}
.c4{grid-column:span 4;}.c5{grid-column:span 5;}.c6{grid-column:span 6;}.c7{grid-column:span 7;}.c8{grid-column:span 8;}.c12{grid-column:span 12;}
.r-32{aspect-ratio:3/2;}.r-43{aspect-ratio:4/3;}.r-45{aspect-ratio:4/5;}.r-11{aspect-ratio:1/1;}.r-169{aspect-ratio:16/9;}.r-219{aspect-ratio:21/9;}
.push{margin-top:54px;}
/* split */
.el-split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.el-split.alt .m{order:2;}
.el-split .m{position:relative;overflow:hidden;}
.el-split .m .ph{aspect-ratio:4/5;background-size:cover;background-position:center;background-color:#e2d8c5;transform:scale(1.04);}
.el-split .m .frame{position:absolute;inset:16px;border:1px solid rgba(255,255,255,.5);pointer-events:none;}
.el-split h2{font-size:clamp(28px,3.4vw,46px);font-weight:200;margin:14px 0 18px;}
.el-split p{color:var(--ink-2);margin:0 0 16px;}
.section.dark .el-split p{color:rgba(247,244,238,.78);}
.el-list{list-style:none;padding:0;margin:24px 0 0;}
.el-list li{padding:16px 0;border-bottom:1px solid var(--line);display:flex;gap:18px;align-items:baseline;font-size:18px;font-weight:300;}
.el-list li i{font-style:normal;color:var(--brass);font-size:13px;letter-spacing:.2em;}
.section.dark .el-list li{border-color:rgba(255,255,255,.16);}
/* quote */
.quote{text-align:center;max-width:920px;margin:0 auto;}
.quote p{font-family:var(--serif);font-size:clamp(26px,3.6vw,44px);line-height:1.4;font-weight:200;}
.section.dark .quote p{color:var(--bg);}
.quote .by{font-family:var(--sans);text-transform:uppercase;letter-spacing:.32em;font-size:11px;margin-top:22px;color:var(--brass);}
/* cta */
.cta{position:relative;color:#fff;text-align:center;padding:132px 0;overflow:hidden;}
.cta-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-color:#1a1610;}
.cta::after{content:"";position:absolute;inset:0;background:rgba(16,12,8,.62);}
.cta .wrap{position:relative;z-index:2;}
.cta h2{font-size:clamp(32px,4.4vw,60px);font-weight:200;max-width:18ch;margin:0 auto 8px;}
.cta .rule{background:var(--brass-2);}
.cta p{max-width:46ch;margin:0 auto 30px;color:rgba(255,255,255,.88);}
/* contact */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;}
.cinfo .row{padding:20px 0;border-bottom:1px solid var(--line);}
.cinfo .label{font-family:var(--sans);text-transform:uppercase;letter-spacing:.28em;font-size:10px;color:var(--brass);margin-bottom:8px;}
.cinfo .val{font-family:var(--serif);font-size:21px;font-weight:300;}
.cinfo a:hover{color:var(--brass);}
form .field{margin-bottom:20px;}
form label{display:block;font-family:var(--sans);text-transform:uppercase;letter-spacing:.22em;font-size:10px;color:var(--ink-2);margin-bottom:8px;}
form input,form textarea{width:100%;background:var(--paper);border:1px solid var(--line);padding:15px 16px;font-family:var(--sans);font-size:15px;color:var(--ink);font-weight:300;}
form input:focus,form textarea:focus{outline:none;border-color:var(--brass);}
form textarea{min-height:140px;resize:vertical;}
/* footer */
.el-foot{background:var(--char);color:#C7BBA6;padding:90px 0 36px;text-align:center;}
.el-foot .wm{display:inline-block;border:1px solid rgba(255,255,255,.5);padding:14px 24px;font-family:var(--sans);font-size:15px;letter-spacing:.36em;text-transform:uppercase;color:#fff;}
.el-foot .wm small{display:none;}
.el-foot .rule{background:var(--brass);margin-top:30px;}
.el-foot .links{display:flex;gap:34px;justify-content:center;flex-wrap:wrap;margin:26px 0;}
.el-foot .links a{font-family:var(--sans);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:#C7BBA6;transition:color .3s;}
.el-foot .links a:hover{color:#fff;}
.el-foot .det{color:#9C8E78;font-size:14px;font-family:var(--sans);}
.el-foot .det a:hover{color:#fff;}
.el-foot-bottom{margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-family:var(--sans);text-transform:uppercase;letter-spacing:.16em;font-size:10.5px;color:#7E7160;}
/* feature blocks — 2x2 with hover image-morph */
.el-blocks{display:grid;grid-template-columns:1fr 1fr;}
.el-block{position:relative;min-height:56vh;overflow:hidden;display:flex;align-items:flex-end;color:#fff;}
.el-block .ph{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity 1s var(--ease),transform 7s var(--ease);}
.el-block .ph2{opacity:0;}
.el-block:hover .ph{opacity:0;}
.el-block:hover .ph2{opacity:1;transform:scale(1.06);}
.el-block::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,12,8,.12) 28%,rgba(16,12,8,.68));}
.el-block .bk{position:relative;z-index:2;padding:48px;max-width:46ch;}
.el-block .q{font-family:var(--serif);font-size:clamp(20px,1.9vw,27px);font-weight:300;line-height:1.44;}
.el-block .lk{display:inline-block;margin-top:20px;font-family:var(--sans);text-transform:uppercase;letter-spacing:.24em;font-size:11px;color:#fff;border-bottom:1px solid var(--brass-2);padding-bottom:5px;}
.el-block .date{font-family:var(--sans);text-transform:uppercase;letter-spacing:.26em;font-size:11px;color:#D7B884;}
.el-block h3{color:#fff;font-size:clamp(24px,2.4vw,36px);font-weight:300;margin-top:8px;}
@media(max-width:760px){.el-blocks{grid-template-columns:1fr;}.el-block{min-height:64vw;}}

/* motion */
.reveal{will-change:opacity,transform;}.js-motion .reveal{opacity:0;}.reveal.in{opacity:1!important;transform:none!important;}
.js-motion .wipe{clip-path:inset(0 0 100% 0);}.wipe{will-change:clip-path;}.wipe.in{clip-path:inset(0 0 0 0)!important;}
@media(prefers-reduced-motion:reduce){.js-motion .reveal,.js-motion .wipe{opacity:1;clip-path:none;}}
@media(max-width:1000px){
  .el-split{grid-template-columns:1fr;gap:34px;}.el-split.alt .m{order:0;}
  .el-services{grid-template-columns:1fr;}.el-service{border-right:0;border-bottom:1px solid var(--line);}
  .contact-grid{grid-template-columns:1fr;gap:32px;}
  .c4,.c5,.c6,.c7,.c8{grid-column:span 12;}.push{margin-top:0;}
}
@media(max-width:760px){
  .wrap,.el-bar{padding-left:22px;padding-right:22px;}
  .el-nav{position:fixed;inset:0 0 0 auto;width:min(82vw,320px);background:var(--bg);flex-direction:column;align-items:flex-start;justify-content:center;padding:40px 32px;gap:22px;transform:translateX(100%);transition:transform .45s var(--ease);box-shadow:-20px 0 60px rgba(0,0,0,.12);}
  .el-nav.open{transform:none;}
  .el-head.over .el-nav{background:var(--bg);}
  .el-head.over .el-nav a{color:var(--ink-2);}
  .burger{display:block;z-index:60;}
  .section{padding:78px 0;}
}