:root { --ink:#111; --paper:#fbfaf6; --magenta:#ff2bd6; --heather:#6e737c; }
* { box-sizing: border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Outfit,system-ui,sans-serif; line-height:1.55; }
a { color:var(--ink); }
.site-header { display:flex; justify-content:space-between; align-items:center; padding:1rem 1.3rem; border-bottom:1px solid var(--ink); position:relative; }
.brand { display:flex; align-items:center; gap:.7rem; font-weight:500; text-decoration:none; }
.mark { width:38px; height:38px; }
.nav { display:flex; gap:1rem; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; }
.nav a:hover, .nav a[aria-current="page"], .mark-word { color:var(--magenta); }
.nav-toggle { display:none; background:#fff; border:1px solid var(--ink); padding:.35rem .6rem; }
main { padding:1.4rem 1.3rem 3rem; max-width:46rem; }
.eyebrow { color:var(--magenta); letter-spacing:.14em; text-transform:uppercase; font-size:.72rem; }
h1 { font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; font-size:clamp(2.3rem,6.5vw,4.4rem); line-height:1.06; margin:.2rem 0 .6rem; }
h2 { font-family:"Cormorant Garamond",Georgia,serif; font-weight:500; font-size:1.8rem; margin:0 0 .35rem; }
.lede { color:var(--heather); max-width:36rem; }
.rule { border:0; height:1px; background:var(--ink); margin:1.2rem 0; }
.index-list,.steps { padding-left:1.15rem; }
article, .index-list li, .steps li { margin:.7rem 0 1.1rem; }
.note { color:var(--heather); }
.btn { display:inline-block; margin-top:.4rem; padding:.7rem 1rem; border:1.5px solid var(--ink); background:#fff; color:var(--ink); text-decoration:none; text-transform:uppercase; letter-spacing:.06em; font-size:.78rem; cursor:pointer; font:inherit; }
.btn:hover { border-color:var(--magenta); color:var(--magenta); }
.log time { color:var(--magenta); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
.contact-form { display:grid; gap:.9rem; max-width:32rem; }
.contact-form label { display:grid; gap:.3rem; font-size:.85rem; color:var(--heather); }
.contact-form input,.contact-form select,.contact-form textarea { border:1px solid var(--ink); background:#fff; padding:.65rem .7rem; font:inherit; color:var(--ink); }
.hidden { position:absolute; left:-9999px; }
.site-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; padding:1rem 1.3rem 2rem; border-top:1px solid var(--ink); font-size:.9rem; }
.work-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.work-card { border:1px solid var(--ink); padding:1rem; }
.work-card .eyebrow { margin-top:0; }
.work-card h2 { font-size:1.6rem; }
.work-card a:hover { color:var(--magenta); }
.concept-banner { border:1px solid var(--ink); border-left:3px solid var(--magenta); padding:.7rem 1rem; }
.concept-banner .eyebrow { margin:0; }
.concept-screens { display:grid; gap:1.4rem; margin:1.4rem 0; }
.concept-screen { margin:0; }
.screen-frame { border:1px solid var(--ink); background:#fff; padding:1rem; }
.screen-topline { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; padding-bottom:.6rem; border-bottom:1px solid var(--ink); font-size:.72rem; }
.screen-title { font-family:"Cormorant Garamond",Georgia,serif; font-size:1.65rem; margin:.8rem 0; }
.screen-row { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; border-top:1px solid var(--ink); padding:.7rem 0; }
.screen-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.screen-art { display:block; width:100%; height:7rem; fill:none; stroke:var(--ink); stroke-width:1.5; }
.screen-art .accent { stroke:var(--magenta); }
.concept-screen figcaption { margin-top:.5rem; color:var(--heather); font-size:.85rem; }
.concept-screen figcaption strong { color:var(--ink); font-weight:500; }
@media (max-width:700px) {
  .work-cards { grid-template-columns:1fr; gap:0; }
  .nav-toggle { display:block; }
  .nav { display:none; position:absolute; right:1.3rem; top:4.2rem; flex-direction:column; background:#fff; border:1px solid var(--ink); padding:.8rem 1rem; z-index:5; }
  .nav.open { display:flex; }
}