:root{
  --stone:#E7E3D9; --stone2:#DDD8CC; --paper:#F1EEE6; --ink:#1A1815; --ink2:#2E2A25; --mut:#514B42; --dim:#6E675C;
  --ox:#8A2B1E; --ox2:#A6371F; --steel:#B0ADA6;
  --line:#CEC9BE; --line-d:rgba(26,24,21,.14);
  --fd:'Playfair Display',Georgia,serif; --ft:'Inter',system-ui,sans-serif; --fm:'IBM Plex Mono',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--stone);color:var(--ink);font-family:var(--ft);font-weight:400;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
.wrap{max-width:1220px;margin:0 auto;padding:0 46px}
@media(max-width:800px){.wrap{padding:0 22px}}
.mono{font-family:var(--fm);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ox)}
.fd{font-family:var(--fd)}

/* nav */
nav{position:sticky;top:0;z-index:100;background:rgba(231,227,217,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:18px 46px}
.logo{font-family:var(--fd);font-weight:700;font-size:23px;letter-spacing:.18em}
.nlinks{display:flex;gap:34px}
.nlinks a{font-family:var(--ft);font-weight:500;font-size:12.5px;letter-spacing:.04em;color:var(--mut);text-decoration:none;transition:.2s}
.nlinks a:hover{color:var(--ink)}
.nbtn{font-family:var(--fm);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);text-decoration:none;padding:11px 20px;border:1px solid var(--ink);border-radius:1px;transition:.25s}
.nbtn:hover{background:var(--ink);color:var(--stone)}
@media(max-width:860px){.nlinks{display:none}nav{padding:14px 22px}}

/* hero editorial */
.hero{padding:70px 0 90px}
.hero .top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:34px;margin-bottom:44px}
.hero h1{font-family:var(--fd);font-weight:500;font-size:clamp(3rem,7.5vw,7rem);line-height:.98;letter-spacing:-.01em;max-width:14ch}
.hero h1 em{font-style:italic;color:var(--ox)}
.hero .top .r{font-family:var(--fm);font-size:11.5px;letter-spacing:.08em;color:var(--mut);text-align:right;line-height:2;text-transform:uppercase}
.hero .fig{position:relative;border:1px solid var(--line)}
.hero .fig img{width:100%;height:min(60vh,560px);object-fit:cover;display:block}
.hero .fig .cap{position:absolute;left:0;bottom:0;background:var(--ink);color:var(--stone);font-family:var(--fm);font-size:11px;letter-spacing:.06em;padding:9px 15px}
.hero .lede{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:44px;align-items:start}
.hero .lede .big{font-family:var(--fd);font-weight:400;font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.3}
.hero .lede p{color:var(--mut);font-size:1.02rem}
@media(max-width:800px){.hero .lede{grid-template-columns:1fr;gap:20px}.hero .fig img{height:48vh}}

section{position:relative}
.eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.eyebrow span{font-family:var(--fm);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ox)}
.eyebrow::before{content:"";width:30px;height:1px;background:var(--ox)}

/* SIGNATURE configurator */
.cfg{padding:104px 0;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cfg h2{font-family:var(--fd);font-weight:500;font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.05;margin-bottom:10px}
.cfg h2 em{font-style:italic;color:var(--ox)}
.cfg .sub{color:var(--mut);max-width:52ch;margin-bottom:40px}
.cfg .field{margin-bottom:26px}
.cfg .flabel{font-family:var(--fm);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin-bottom:12px}
.cfg .opts{display:flex;gap:10px;flex-wrap:wrap}
.cfg .opt{font-family:var(--ft);font-weight:500;font-size:14px;padding:12px 18px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;border-radius:1px;transition:.2s}
.cfg .opt small{display:block;font-family:var(--fm);font-size:10px;color:var(--dim);letter-spacing:.04em;margin-top:3px;text-transform:none}
.cfg .opt:hover{border-color:var(--ink)}
.cfg .opt.on{background:var(--ink);color:var(--stone);border-color:var(--ink)}
.cfg .opt.on small{color:var(--steel)}
.cfg-out{display:grid;grid-template-columns:1.3fr 1fr;gap:0;border:1px solid var(--ink);margin-top:16px}
.cfg-out .l{padding:38px 40px;border-right:1px solid var(--line)}
.cfg-out .l .ap{font-family:var(--fd);font-style:italic;font-size:1.9rem;line-height:1;margin-bottom:14px}
.cfg-out .l p{color:var(--mut);font-size:1rem;margin-bottom:22px}
.cfg-out .l ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.cfg-out .l li{font-size:14px;padding-left:22px;position:relative;color:var(--ink)}
.cfg-out .l li::before{content:"—";position:absolute;left:0;color:var(--ox)}
.cfg-out .r{padding:38px 40px;background:var(--ink);color:var(--stone);display:flex;flex-direction:column;justify-content:center}
.cfg-out .r .row{margin-bottom:24px}
.cfg-out .r .k{font-family:var(--fm);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);margin-bottom:6px}
.cfg-out .r .v{font-family:var(--fd);font-weight:500;font-size:2.4rem;line-height:1}
.cfg-out .r .v small{font-family:var(--ft);font-size:.85rem;color:var(--steel);font-weight:400}
.cfg-out .r .note{font-family:var(--ft);font-size:12px;color:var(--steel);line-height:1.6;border-top:1px solid rgba(255,255,255,.16);padding-top:16px}
@media(max-width:820px){.cfg-out{grid-template-columns:1fr}.cfg-out .l{border-right:none;border-bottom:1px solid var(--line)}.cfg-out .l,.cfg-out .r{padding:28px 24px}}

/* process */
.proc{padding:104px 0}
.proc h2{font-family:var(--fd);font-weight:500;font-size:clamp(2rem,4.4vw,3.2rem);margin-bottom:50px;max-width:16ch;line-height:1.05}
.proc .stages{border-top:1px solid var(--line)}
.pstage{display:grid;grid-template-columns:70px 1fr 2fr;gap:30px;align-items:baseline;padding:26px 6px;border-bottom:1px solid var(--line);transition:background .2s}
.pstage:hover{background:var(--paper)}
.pstage .no{font-family:var(--fd);font-style:italic;font-size:1.5rem;color:var(--ox)}
.pstage h4{font-family:var(--fd);font-weight:500;font-size:1.5rem}
.pstage p{color:var(--mut);font-size:.98rem}
@media(max-width:760px){.pstage{grid-template-columns:44px 1fr;gap:8px 16px}.pstage p{grid-column:2}}

/* portfolio */
.port{padding:0 0 104px}
.port .head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;margin-bottom:40px}
.port h2{font-family:var(--fd);font-weight:500;font-size:clamp(2rem,4.4vw,3.2rem);line-height:1}
.port .grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.pcard{border:1px solid var(--line);background:var(--paper)}
.pcard .im{height:340px;overflow:hidden;border-bottom:1px solid var(--line)}
.pcard .im img{width:100%;height:100%;object-fit:cover}
.pcard .b{padding:26px 28px}
.pcard .mk{font-family:var(--fm);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ox);margin-bottom:10px}
.pcard h4{font-family:var(--fd);font-weight:500;font-size:1.7rem;margin-bottom:6px}
.pcard p{color:var(--mut);font-size:.96rem;margin-bottom:18px}
.pcard .specs{display:flex;gap:30px;border-top:1px solid var(--line);padding-top:16px}
.pcard .specs .s .k{font-family:var(--fm);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.pcard .specs .s .val{font-family:var(--fd);font-size:1.2rem}
@media(max-width:760px){.port .grid{grid-template-columns:1fr}.pcard .im{height:250px}}

/* band */
.band{position:relative;height:70vh;min-height:440px;display:flex;align-items:center;overflow:hidden}
.band .bimg{position:absolute;inset:0;background:var(--ink) center/cover}
.band .bimg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,18,16,.82),rgba(20,18,16,.2) 70%)}
.band .bin{position:relative;z-index:2;color:var(--stone);padding:0 46px;max-width:760px}
.band .bin blockquote{font-family:var(--fd);font-weight:400;font-style:italic;font-size:clamp(1.6rem,3.4vw,2.8rem);line-height:1.24}
.band .bin blockquote b{font-style:normal;font-weight:500;color:#E4B9A3}
.band .bin cite{display:block;font-family:var(--fm);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(231,227,217,.6);margin-top:22px;font-style:normal}
@media(max-width:800px){.band .bin{padding:0 22px}}

/* about */
.about{padding:104px 0}
.about .row{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about h2{font-family:var(--fd);font-weight:500;font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.08;margin-bottom:18px}
.about h2 em{font-style:italic;color:var(--ox)}
.about p{color:var(--mut);font-size:1.05rem;margin-bottom:16px;max-width:46ch}
.about .stats{display:flex;gap:40px;margin-top:26px;border-top:1px solid var(--line);padding-top:24px}
.about .stats .st .v{font-family:var(--fd);font-weight:500;font-size:2.2rem;line-height:1}
.about .stats .st .k{font-family:var(--fm);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin-top:6px}
@media(max-width:800px){.about .row{grid-template-columns:1fr;gap:26px}}

/* CTA */
.cta{padding:100px 0;background:var(--ink);color:var(--stone);text-align:center}
.cta .eyebrow{justify-content:center}.cta .eyebrow span{color:#E4B9A3}.cta .eyebrow::before{background:#E4B9A3}
.cta h2{font-family:var(--fd);font-weight:500;font-size:clamp(2.2rem,5vw,4rem);line-height:1.02;margin:16px 0 14px}
.cta h2 em{font-style:italic;color:#E4B9A3}
.cta p{color:var(--steel);max-width:46ch;margin:0 auto 34px}
.cta form{display:flex;gap:0;max-width:480px;margin:0 auto;border-bottom:1px solid rgba(255,255,255,.3)}
.cta input{flex:1;background:transparent;border:none;color:var(--stone);font-family:var(--ft);font-size:16px;padding:15px 4px}
.cta input:focus{outline:none}.cta input::placeholder{color:var(--steel)}
.cta button{background:transparent;border:none;color:#E4B9A3;font-family:var(--fm);font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;padding:0 8px}

footer{background:var(--ink2);color:#CBC6BC;padding:56px 46px 40px}
.foot{max-width:1220px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:28px}
.foot .logo{color:var(--stone);font-size:24px}
.foot .fc{font-family:var(--ft);font-size:13px;line-height:1.9}
.foot .fc b{color:var(--stone);font-weight:500}
.foot .fc.mono{font-family:var(--fm);font-size:11px;letter-spacing:.04em;text-transform:none}
.foot-bot{max-width:1220px;margin:34px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-family:var(--fm);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:#938C80;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

.rv{opacity:0;transform:translateY(24px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}