/* ====================================================================
   AndyShares — LA MAISON × L'OBJET (PREVIEW)
   House style: warm boutique flagship. Case studies & posts open with
   the L'Objet spec hero. Palette: oxblood / terracotta / blue / warm-white.
   ==================================================================== */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#E3E3D8;        /* warm canvas */
  --paper:#e9e8df;     /* lighter panel */
  --card:#dad9cd;      /* card surface */
  --ink:#2F2F2F;       /* body text */
  --head:#522419;      /* oxblood — headlines, dark sections */
  --noir:#1a0f0a;      /* deepest oxblood */
  --terra:#A2623C;     /* engraved labels, accents on light */
  --blue:#AFD0E2;      /* powder — structural blocks & accents on dark */
  --blue-deep:#1f4e8c; /* cobalt — functional blue: links, refs, hover on light */
  --cobalt:#1f4e8c;    /* alias — decisive actions */
  --muted:#8a8276;     /* captions, secondary */
  --line:rgba(82,36,25,.18);
  --line-soft:rgba(82,36,25,.10);
  --on-dark:#E3E3D8;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Jost',sans-serif;
  --mono:'Space Mono',monospace;
  --wrap:1280px;--pad:46px;
}

html{scroll-behavior:smooth;background:var(--bg)}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--head);color:var(--bg)}
img{display:block;max-width:100%}

.grain{position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.05;mix-blend-mode:multiply}
.grain svg{width:100%;height:100%}

/* ---------- TOP BAR (house nav) ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:200;background:rgba(227,227,216,.85);backdrop-filter:blur(14px);border-bottom:0.5px solid var(--line)}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);height:76px;display:flex;align-items:center;justify-content:space-between}
.brand{font-family:var(--serif);font-style:italic;font-weight:500;font-size:24px;color:var(--head);text-decoration:none;letter-spacing:-.5px}
.brand span{color:var(--terra)}
.nav-mid{display:flex;gap:36px;list-style:none}
.nav-mid a{position:relative;font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:5px 0;transition:color .25s}
.nav-mid a::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--blue-deep);transition:width .3s}
.nav-mid a:hover,.nav-mid a.on{color:var(--head)}
.nav-mid a:hover::after{width:100%}
.nav-ref{font-family:var(--mono);font-size:10px;letter-spacing:.05em;color:var(--blue-deep)}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px}
.burger span{display:block;width:24px;height:1px;background:var(--head);margin:6px 0;transition:.3s}
.mobile-menu{display:none;position:fixed;inset:0;background:var(--bg);z-index:199;flex-direction:column;align-items:center;justify-content:center;gap:34px}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:var(--serif);font-style:italic;font-size:40px;color:var(--head);text-decoration:none}
.mobile-menu a:hover{color:var(--terra)}
.mobile-close{position:absolute;top:24px;right:32px;background:none;border:none;cursor:pointer;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}

/* ---------- SHARED ATOMS ---------- */
.kicker{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--terra);text-transform:uppercase}
.enquire{display:inline-flex;align-items:center;gap:12px;font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--head);text-decoration:none;border-bottom:0.5px solid var(--head);padding-bottom:7px;transition:color .25s,border-color .25s}
.enquire b{color:var(--blue-deep);transition:transform .3s;display:inline-block}
.enquire:hover{color:var(--blue-deep);border-color:var(--blue-deep)}
.enquire:hover b{transform:translate(4px,-4px)}
.btn-cobalt{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:var(--cobalt);border:none;border-radius:40px;padding:15px 26px;text-decoration:none;transition:background .3s,transform .3s}
.btn-cobalt:hover{background:var(--head);transform:translateY(-2px)}
.pill{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;border:0.5px solid var(--line);padding:6px 13px;border-radius:40px;color:var(--muted)}
.tlink{color:var(--terra);text-decoration:none;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.tlink:hover{color:var(--blue-deep);border-color:var(--blue)}

.section{max-width:var(--wrap);margin:0 auto;padding:108px var(--pad);border-bottom:0.5px solid var(--line)}
.shead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:50px;padding-bottom:16px;border-bottom:0.5px solid var(--line)}
.shead .lab{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--head)}
.shead .lab .no{color:var(--blue-deep);margin-right:8px}
.shead a{font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);text-decoration:none;transition:color .25s}
.shead a:hover{color:var(--blue-deep)}

/* ---------- HOME HERO ---------- */
.hero{max-width:var(--wrap);margin:0 auto;padding:120px var(--pad) 0}
.hero-split{display:grid;grid-template-columns:1fr 380px;gap:0;border-bottom:0.5px solid var(--line)}
.hero-left{padding:40px 56px 64px 0;display:flex;flex-direction:column;justify-content:center}
.hero-left .kicker{margin-bottom:26px}
.hero-left h1{font-family:var(--serif);font-weight:300;font-size:clamp(64px,8.5vw,116px);line-height:.9;letter-spacing:-2px;color:var(--head)}
.hero-left h1 em{font-style:italic;color:var(--terra)}
.hero-left .enquire{margin-top:38px;align-self:flex-start}
.hero-right{position:relative;background:var(--blue);min-height:460px;overflow:hidden;border-left:0.5px solid var(--line)}
.hero-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-right .mono-mark{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-family:var(--serif);font-weight:400;font-size:210px;line-height:.78;color:var(--head);letter-spacing:-5px}
.hero-right .ed{position:absolute;top:18px;right:18px;z-index:2;font-family:var(--mono);font-size:9px;letter-spacing:.12em;color:#fff;background:rgba(31,78,140,.85);border:none;padding:6px 11px;border-radius:40px}
.hero-right .cap{position:absolute;bottom:22px;left:18px;z-index:2;font-family:var(--mono);font-size:9px;letter-spacing:.12em;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.hero-right .cobalt-bar{position:absolute;left:0;bottom:0;width:100%;height:8px;background:var(--cobalt)}
.hero-index{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);background:var(--head)}
.hero-index a{padding:24px var(--pad);text-decoration:none;border-right:0.5px solid rgba(227,227,216,.14);transition:background .3s}
.hero-index a:last-child{border-right:none}
.hero-index a:hover{background:var(--noir)}
.hero-index .ci{font-family:var(--mono);font-size:10px;color:var(--blue);margin-bottom:8px}
.hero-index .ct{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--bg)}
.hero-index a:hover .ct{color:var(--blue)}

/* ---------- WORK COLLECTION (product cards) ---------- */
.coll{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.obj-card{background:var(--card);text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:background .35s}
.obj-card .thumb{aspect-ratio:4/3;background:linear-gradient(150deg,#caa78f,#522419);position:relative;overflow:hidden}
.obj-card .thumb .rn{position:absolute;top:14px;left:14px;font-family:var(--mono);font-size:9px;letter-spacing:.1em;color:rgba(227,227,216,.85)}
.obj-card .thumb .st{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:8px;letter-spacing:.12em;color:var(--head);background:var(--blue);padding:4px 9px;border-radius:40px}
.obj-card .body{padding:26px 26px 30px}
.obj-card .cat{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-bottom:12px}
.obj-card h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:25px;line-height:1.14;color:var(--head);margin-bottom:14px}
.obj-card p{font-size:12.5px;font-weight:300;line-height:1.65;color:var(--muted)}
.obj-card:hover{background:var(--paper)}
.obj-card:hover h3{color:var(--terra)}

/* ---------- JOURNAL LIST ---------- */
.jlist{display:flex;flex-direction:column}
.jrow{display:grid;grid-template-columns:64px 1fr 150px 120px;gap:24px;align-items:baseline;padding:26px 0;border-top:0.5px solid var(--line-soft);text-decoration:none;color:inherit;transition:padding-left .35s}
.jrow:hover{padding-left:16px}
.jrow .rn{font-family:var(--mono);font-size:11px;color:var(--blue-deep)}
.jrow .t{font-family:var(--serif);font-style:italic;font-size:24px;color:var(--head);transition:color .3s}
.jrow:hover .t{color:var(--blue-deep)}
.jrow .c{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--terra)}
.jrow .d{font-family:var(--mono);font-size:10px;color:var(--muted);text-align:right}

/* ---------- ATELIER / ABOUT BAND ---------- */
.band{position:relative;background:var(--head);color:var(--on-dark);overflow:hidden}
.band-in{max-width:var(--wrap);margin:0 auto;padding:118px var(--pad);position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.band-ghost{position:absolute;right:-2vw;top:50%;transform:translateY(-50%);font-family:var(--serif);font-style:italic;font-size:clamp(120px,20vw,320px);line-height:.8;color:rgba(175,208,226,.06);z-index:1;pointer-events:none;white-space:nowrap}
.band h2{font-family:var(--serif);font-weight:300;font-size:clamp(38px,4.6vw,64px);line-height:1.04;letter-spacing:-1px}
.band h2 em{font-style:italic;color:var(--blue)}
.band p{font-size:14px;font-weight:300;line-height:1.85;color:rgba(227,227,216,.72);margin-top:24px;max-width:480px}
.spec-rows{display:flex;flex-direction:column}
.srow{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;border-top:0.5px solid rgba(227,227,216,.15)}
.srow:first-child{border-top:none}
.srow .l{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(227,227,216,.5)}
.srow .v{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--blue)}

/* ---------- ENQUIRE / CONTACT ---------- */
.enq-section{background:var(--noir);color:var(--on-dark)}
.enq-in{max-width:var(--wrap);margin:0 auto;padding:120px var(--pad);text-align:center}
.enq-in h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,6vw,84px);line-height:1.02;letter-spacing:-1px}
.enq-in h2 em{font-style:italic;color:var(--blue)}
.enq-in .mail{display:inline-block;margin-top:36px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--blue);text-decoration:none;border-bottom:0.5px solid var(--blue);padding-bottom:6px}

/* ---------- PAGE MASTHEAD (listings) ---------- */
.masthead{max-width:var(--wrap);margin:0 auto;padding:140px var(--pad) 60px;border-bottom:0.5px solid var(--line)}
.masthead .kicker{margin-bottom:24px;display:inline-block}
.masthead h1{font-family:var(--serif);font-weight:300;font-size:clamp(54px,8vw,110px);line-height:.9;letter-spacing:-2px;color:var(--head)}
.masthead h1 em{font-style:italic;color:var(--terra)}
.masthead p{font-size:15px;font-weight:300;line-height:1.7;color:var(--muted);max-width:520px;margin-top:24px}

/* ---------- BLOG: FEATURE + GRID ---------- */
.feature{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr;border-bottom:0.5px solid var(--line)}
.feature .fimg{background:linear-gradient(150deg,#caa78f,#522419);min-height:440px;position:relative}
.feature .fimg .badge{position:absolute;top:20px;left:20px;font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--head);background:var(--blue);padding:6px 13px;border-radius:40px}
.feature .fimg .rn{position:absolute;bottom:18px;left:20px;font-family:var(--mono);font-size:9px;color:rgba(227,227,216,.85);letter-spacing:.1em}
.feature .fbody{padding:60px 54px;display:flex;flex-direction:column;justify-content:center;border-left:0.5px solid var(--line)}
.feature .fbody .cat{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-bottom:18px}
.feature .fbody h2{font-family:var(--serif);font-weight:400;font-style:italic;font-size:clamp(34px,4vw,50px);line-height:1.04;color:var(--head);margin-bottom:20px}
.feature .fbody p{font-size:14px;font-weight:300;line-height:1.75;color:var(--muted);margin-bottom:30px;max-width:430px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;max-width:var(--wrap);margin:0 auto;padding:2px 0 0}
.grid3.pad-bottom{padding-bottom:120px}

/* ---------- PROJECTS COLLECTION ---------- */
.proj{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) 120px}
.prow{display:grid;grid-template-columns:64px 150px 1.3fr 1fr 60px;gap:30px;align-items:center;padding:30px 0;border-top:0.5px solid var(--line);text-decoration:none;color:inherit;transition:padding-left .35s}
.prow:last-child{border-bottom:0.5px solid var(--line)}
.prow:hover{padding-left:14px}
.prow .rn{font-family:var(--mono);font-size:11px;color:var(--blue-deep)}
.prow .pim{width:100%;height:84px;background:linear-gradient(150deg,#caa78f,#522419);border-radius:2px}
.prow .pcat{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--terra);margin-bottom:8px}
.prow h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:27px;line-height:1.08;color:var(--head);transition:color .3s}
.prow:hover h3{color:var(--blue-deep)}
.prow .pd{font-size:12.5px;font-weight:300;line-height:1.6;color:var(--muted)}
.prow .arr{justify-self:end;font-size:18px;color:var(--terra);transition:transform .3s,color .3s}
.prow:hover .arr{color:var(--blue-deep);transform:translate(5px,-5px)}
.prow .soon{justify-self:end;font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* ---------- L'OBJET HERO (case study / post) ---------- */
.objet{max-width:var(--wrap);margin:0 auto;padding:110px 0 0}
.objet-in{display:grid;grid-template-columns:1.05fr 1fr;border-top:0.5px solid var(--line);border-bottom:0.5px solid var(--line)}
.objet .obj-vis{position:relative;background:radial-gradient(70% 70% at 50% 40%,#d8b89e,#522419);min-height:500px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.objet .obj-vis .portrait{width:62%;height:74%;background:linear-gradient(160deg,#c9a587,#3a2014);border-radius:2px;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.objet .obj-vis .num{position:absolute;top:22px;left:22px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:rgba(227,227,216,.85)}
.objet .obj-vis .back{position:absolute;top:22px;right:22px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:rgba(227,227,216,.85);text-decoration:none}
.objet .spec{padding:54px 50px;display:flex;flex-direction:column;justify-content:center;border-left:0.5px solid var(--line)}
.objet .spec .kicker{margin-bottom:18px}
.objet .spec h1{font-family:var(--serif);font-weight:300;font-size:clamp(38px,4.4vw,60px);line-height:.98;letter-spacing:-1px;color:var(--head);margin-bottom:8px}
.objet .spec h1 em{font-style:italic;color:var(--terra)}
.objet .spec .lede{font-family:var(--serif);font-weight:300;font-size:19px;line-height:1.4;color:var(--ink);margin:14px 0 26px}
.objet .orow{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-top:0.5px solid var(--line)}
.objet .orow .l{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.objet .orow .v{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--head)}

/* ---------- ARTICLE BODY ---------- */
.article-body{max-width:var(--wrap);margin:0 auto;padding:80px var(--pad) 100px;display:grid;grid-template-columns:1fr 270px;gap:80px;align-items:start}
.article-content{max-width:680px}
.article-content p{font-size:16px;font-weight:300;line-height:1.9;color:var(--ink);margin-bottom:26px}
.article-content h2{font-family:var(--serif);font-weight:400;font-size:34px;line-height:1.12;color:var(--head);margin:48px 0 20px}
.article-content h2 .nbr{font-style:italic;color:var(--terra)}
.article-content ul,.article-content ol{margin:0 0 26px 0;padding-left:22px}
.article-content li{font-size:16px;font-weight:300;line-height:1.8;color:var(--ink);margin-bottom:14px}
.article-content strong{font-weight:500;color:var(--head)}
.divider{border:none;border-top:0.5px solid var(--line);margin:40px 0}
.pull-quote{margin:48px 0;padding:8px 0 8px 32px;border-left:2px solid var(--blue-deep)}
.pull-quote p{font-family:var(--serif);font-style:italic;font-weight:400;font-size:30px;line-height:1.25;color:var(--head);margin:0}
.conclusion{margin:48px 0 0;padding:40px;background:var(--head);border-radius:4px}
.conclusion p{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.5;color:var(--on-dark);margin:0}
.conclusion p em{color:var(--blue)}
.article-side{position:sticky;top:110px;display:flex;flex-direction:column;gap:34px}
.aside-h{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.aside-author .nm{font-family:var(--serif);font-style:italic;font-size:24px;color:var(--head);margin-bottom:6px}
.aside-author .tt{font-size:12px;font-weight:300;line-height:1.5;color:var(--muted)}
.toc{list-style:none}
.toc li{margin-bottom:11px}
.toc a{font-size:13px;color:var(--ink);text-decoration:none;border-left:1px solid var(--line);padding-left:14px;display:block;transition:color .25s,border-color .25s}
.toc a:hover{color:var(--terra);border-color:var(--terra)}
.taglist{display:flex;flex-wrap:wrap;gap:7px}

/* case study results */
.results{background:var(--head);color:var(--on-dark)}
.results-in{max-width:var(--wrap);margin:0 auto;padding:100px var(--pad)}
.results-in h2{font-family:var(--serif);font-weight:300;font-size:clamp(34px,4.5vw,60px);margin-bottom:54px}
.results-in h2 em{font-style:italic;color:var(--blue)}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}
.rstat .v{font-family:var(--serif);font-style:italic;font-size:64px;font-weight:300;color:var(--blue);line-height:1}
.rstat .l{font-size:12px;font-weight:300;line-height:1.5;color:rgba(227,227,216,.65);margin-top:14px}

/* related */
.related{background:var(--paper);border-top:0.5px solid var(--line)}
.related-in{max-width:var(--wrap);margin:0 auto;padding:90px var(--pad)}
.related-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:40px}
.related-head .lab{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--head)}
.related-head a{font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);text-decoration:none}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.rcard{background:var(--bg);padding:32px 28px;text-decoration:none;color:inherit;transition:background .3s}
.rcard:hover{background:var(--card)}
.rcard .rc{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--terra);margin-bottom:12px}
.rcard h3{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.2;color:var(--head);margin-bottom:12px}
.rcard .rd{font-family:var(--mono);font-size:10px;color:var(--muted)}

/* footer */
footer{background:var(--noir);padding:32px var(--pad)}
.foot-in{max-width:var(--wrap);margin:0 auto;display:flex;justify-content:space-between;align-items:center}
.foot-in .c{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:rgba(227,227,216,.4)}
.foot-links{display:flex;gap:22px}
.foot-links a{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(227,227,216,.5);text-decoration:none;transition:color .25s}
.foot-links a:hover{color:var(--blue)}

/* reveal */
.rv{opacity:0;transform:translateY(38px);transition:opacity .9s cubic-bezier(.2,.6,.2,1),transform .9s cubic-bezier(.2,.6,.2,1)}
.rv.in{opacity:1;transform:none}

/* responsive */
@media(max-width:1024px){
  .article-body{grid-template-columns:1fr;gap:48px}.article-side{position:static}
}
@media(max-width:880px){
  .nav-mid,.nav-ref{display:none}.burger{display:block}
  .hero-split,.feature,.objet-in,.band-in{grid-template-columns:1fr}
  .hero-right{min-height:300px;border-left:none;border-top:0.5px solid var(--line)}
  .hero-index,.coll,.grid3,.rgrid,.related-grid{grid-template-columns:1fr}
  .objet .spec,.feature .fbody{border-left:none}
  .prow{grid-template-columns:50px 1fr 40px;gap:16px}
  .prow .pim,.prow .pd{display:none}
  .jrow{grid-template-columns:40px 1fr 90px;gap:14px}.jrow .c{display:none}
  .section,.masthead{padding-left:24px;padding-right:24px}
  :root{--pad:24px}
}