@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --ink:#23282B;
  --paper:#F5F3EC;
  --card:#EFECE1;
  --navy:#1C2B3A;
  --navy-ink:#EDE8DD;
  --rust:#B5502F;
  --slate:#5B6670;
  --line:#D8D3C4;
  --max: 1040px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}

.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}

/* Header */
header.site{
  border-bottom:1px solid var(--line);
  background:var(--paper);
  position:sticky; top:0; z-index:20;
}
header.site .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:16px; padding-bottom:16px;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand img{width:42px; height:42px;}
.brand-text{line-height:1.15;}
.brand-name{font-family:'Fraunces',serif; font-weight:500; font-size:19px; color:var(--navy);}
.brand-tag{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--slate); letter-spacing:.05em; text-transform:uppercase;}
nav.main{display:flex; gap:26px; font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.03em; color:var(--slate); text-transform:uppercase;}
nav.main a{padding-bottom:3px; border-bottom:1px solid transparent;}
nav.main a:hover, nav.main a.active{color:var(--navy); border-bottom-color:var(--rust);}
.nav-toggle{display:none;}

/* Buttons */
.btn{
  display:inline-block;
  background:var(--navy); color:var(--navy-ink);
  font-size:14px; font-weight:500; font-family:'Inter',sans-serif;
  padding:12px 22px; border-radius:6px; border:none;
  cursor:pointer;
}
.btn:hover{background:#152230;}
.btn-outline{
  display:inline-block;
  font-size:14px; color:var(--navy);
  border-bottom:1px solid var(--navy); padding-bottom:2px;
}

/* Hero */
.hero{padding:60px 0 30px;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.08em;
  color:var(--rust); text-transform:uppercase; margin-bottom:16px;
}
h1{
  font-family:'Fraunces',serif; font-weight:500; font-size:38px; line-height:1.28;
  color:var(--navy); margin:0 0 18px; max-width:680px;
}
.lead{font-size:16px; color:var(--slate); max-width:560px; margin:0 0 26px;}
.cta-row{display:flex; gap:18px; align-items:center; flex-wrap:wrap;}

/* Stamps */
.stamps{display:flex; gap:22px; padding:10px 0 50px; flex-wrap:wrap;}
.stamp{border:1.5px dashed var(--slate); padding:14px 20px; min-width:150px;}
.stamp:nth-child(1){transform:rotate(-2deg);}
.stamp:nth-child(2){transform:rotate(1.5deg); margin-top:10px;}
.stamp:nth-child(3){transform:rotate(-1deg);}
.stamp-num{font-family:'Fraunces',serif; font-weight:600; font-size:24px; color:var(--rust);}
.stamp-label{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--slate); margin-top:5px; line-height:1.5;}

/* Sections */
section{padding:48px 0; border-top:1px solid var(--line);}
section:first-of-type{border-top:none;}
.section-label{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.08em;
  color:var(--slate); text-transform:uppercase; margin-bottom:24px;
}
h2.page-title{font-family:'Fraunces',serif; font-weight:500; font-size:28px; color:var(--navy); margin:0 0 20px;}
p{margin:0 0 16px;}
.text-block{max-width:680px;}
.text-block p{color:var(--ink);}

/* Timeline */
.timeline{position:relative; padding-left:22px; border-left:1.5px solid var(--line); max-width:680px;}
.tl-item{margin-bottom:24px; position:relative;}
.tl-item:last-child{margin-bottom:0;}
.tl-dot{position:absolute; left:-27.5px; top:4px; width:9px; height:9px; border-radius:50%; background:var(--slate);}
.tl-item.current .tl-dot{background:var(--rust);}
.tl-date{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--slate);}
.tl-item.current .tl-date{color:var(--rust);}
.tl-role{font-size:15px; font-weight:600; margin-top:3px;}

/* Cards grid */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px;}
.card{background:var(--card); border-radius:10px; padding:26px;}
.card-icon{font-size:22px; color:var(--rust); margin-bottom:12px; display:block;}
.card h3{font-family:'Fraunces',serif; font-size:17px; font-weight:500; margin:0 0 10px;}
.card p{font-size:13.5px; color:var(--slate); margin:0; line-height:1.65;}
.card .price-tag{
  display:inline-block; margin-top:14px; font-family:'IBM Plex Mono',monospace;
  font-size:11px; color:var(--navy); border-top:1px dashed var(--line); padding-top:12px;
}

/* Results cases */
.case{padding:26px 0; border-top:1px solid var(--line);}
.case:first-child{border-top:none; padding-top:0;}
.case-head{display:flex; align-items:baseline; gap:16px; margin-bottom:10px; flex-wrap:wrap;}
.case-num{font-family:'Fraunces',serif; font-weight:600; font-size:26px; color:var(--rust);}
.case h3{font-family:'Fraunces',serif; font-size:17px; font-weight:500; margin:0; color:var(--navy);}
.case p{color:var(--slate); max-width:640px; font-size:14.5px;}
.case-note{
  margin-top:28px; padding:16px 20px; background:var(--card); border-radius:8px;
  font-size:12.5px; color:var(--slate); font-style:italic;
}

/* Profile / photo */
.profile-row{display:flex; gap:32px; align-items:flex-start; flex-wrap:wrap; margin-bottom:34px;}
.profile-photo{width:150px; height:150px; border-radius:50%; border:3px solid var(--paper); outline:1px solid var(--line); flex-shrink:0;}
.profile-name{font-family:'Fraunces',serif; font-size:20px; color:var(--navy); margin:0 0 4px;}
.profile-role{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--slate); text-transform:uppercase; letter-spacing:.04em;}

/* Contact */
.contact-band{background:var(--navy); color:var(--navy-ink); padding:50px 0;}
.contact-band h2{font-family:'Fraunces',serif; font-size:24px; font-weight:500; margin:0 0 10px; color:var(--navy-ink);}
.contact-band p{color:#C9CDD3; max-width:460px;}
.contact-grid{display:flex; gap:50px; flex-wrap:wrap; margin-top:20px;}
.contact-info{font-family:'IBM Plex Mono',monospace; font-size:13px; color:#C9CDD3; display:flex; flex-direction:column; gap:10px;}
.contact-info a{color:#C9CDD3;}

form.contact-form{display:flex; flex-direction:column; gap:14px; max-width:420px; flex:1; min-width:260px;}
form.contact-form input, form.contact-form textarea{
  background:#24344A; border:1px solid #3A4C63; color:var(--navy-ink);
  padding:12px 14px; border-radius:6px; font-family:'Inter',sans-serif; font-size:14px;
}
form.contact-form input::placeholder, form.contact-form textarea::placeholder{color:#8B98A6;}
form.contact-form button{
  background:var(--rust); color:#fff; border:none; padding:13px 20px;
  border-radius:6px; font-size:14px; font-weight:500; cursor:pointer; width:fit-content;
}
form.contact-form button:hover{background:#9c4326;}
.form-note{font-size:11.5px; color:#8B98A6;}

/* Footer */
footer.site{padding:26px 0; text-align:center; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--slate);}

@media (max-width:640px){
  h1{font-size:28px;}
  nav.main{display:none;}
  .stamps{gap:14px;}
  .profile-row{flex-direction:column; align-items:center; text-align:center;}
}