:root {
  --paper: #efe8dd;
  --paper-2: #e8ded0;
  --ink: #4a2f22;
  --rust: #9d4d20;
  --rust-light: #b56c42;
  --line: rgba(74, 47, 34, .22);
  --shadow: rgba(56, 39, 28, .13);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: 'Montserrat', sans-serif;
  background-image: radial-gradient(circle at 20% 30%, rgba(255,255,255,.3), transparent 30%), radial-gradient(circle at 70% 65%, rgba(157,77,32,.04), transparent 34%);
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}
a { color: inherit; }
.container { width: min(1120px, calc(100% - 40px)); margin: 0 auto; position: relative; }
.hero { min-height: 760px; border-bottom: 1px solid var(--line); padding: 24px 0 48px; }
.nav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; letter-spacing: .18em; font-family: 'Cormorant Garamond', serif; font-size: 25px; }
.brand-star { color: var(--rust); font-size: 28px; }
.main-nav { display: flex; gap: 30px; }
.main-nav a, .footer-links a, .footer-links span { text-decoration: none; text-transform: uppercase; letter-spacing: .18em; font-size: 11px; }
.menu-toggle { display:none; border:1px solid var(--line); background:transparent; color:var(--ink); padding:8px 12px; }
.hero-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 72px; align-items: center; min-height: 650px; }
.logo-stage img { width: 100%; display:block; mix-blend-mode: multiply; }
.hero-copy h1, h2, h3 { font-family: 'Cormorant Garamond', serif; font-weight: 400; margin: 0; }
.hero-copy h1 { font-size: clamp(66px, 9vw, 118px); line-height: .82; letter-spacing: .03em; }
.rule { height:1px; background: var(--rust-light); margin: 24px 0 20px; position:relative; }
.rule span { position:absolute; left:-4px; top:-11px; color:var(--rust); background:var(--paper); padding-right:10px; }
.tagline { font-family:'Cormorant Garamond', serif; font-size: 28px; font-style:italic; margin:0 0 30px; }
.kicker { text-transform:uppercase; letter-spacing:.24em; font-size:12px; line-height:1.7; max-width:430px; }
.section { padding: 74px 0; border-bottom:1px solid var(--line); }
.two-col { display:grid; grid-template-columns: .95fr 1.05fr; gap:80px; }
.eyebrow { color:var(--rust); text-transform:uppercase; letter-spacing:.22em; font-size:12px; font-weight:600; margin:0 0 18px; }
h2 { font-size: clamp(42px, 5.6vw, 72px); line-height:.98; }
.short-rule { width:160px; height:1px; background:var(--rust-light); margin:22px 0; }
.lead { font-family:'Cormorant Garamond', serif; font-size:24px; }
.italic { font-style:italic; font-family:'Cormorant Garamond', serif; }
.body-copy { font-size:15px; line-height:1.65; }
.body-copy p { margin-top:0; margin-bottom:18px; }
.centered-heading { text-align:center; max-width:760px; }
.centered-heading p:last-child { line-height:1.6; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:34px; }
.card { background:rgba(255,255,255,.25); border:1px solid rgba(74,47,34,.12); box-shadow:0 10px 25px var(--shadow); }
.art { height:220px; }
.art-rust { background: linear-gradient(145deg, #dcc7af 4%, #a45122 34%, #3a3331 62%, #d4bea3 100%); }
.art-wine { background: radial-gradient(circle at 25% 35%, #8e2f31, transparent 34%), linear-gradient(135deg,#3b1e1e,#b37b6c 55%,#e8d8c6); }
.art-sea { background: linear-gradient(145deg,#d9d3c9 5%,#6e8b95 42%,#243f49 72%,#b57a4b); }
.card-copy { padding:18px 20px 20px; }
.card-label, .meta-line { text-transform:uppercase; letter-spacing:.16em; font-size:10px; color:var(--rust); }
.card h3 { font-size:31px; }
.meta-line { color:var(--ink); }
.card button { border:0; background:transparent; color:var(--rust); text-transform:uppercase; letter-spacing:.16em; font-size:10px; padding:8px 0 0; cursor:pointer; }
.featured-grid { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.featured-art { aspect-ratio: 1.45; background: linear-gradient(145deg,#d9d0c2 4%,#46606a 38%,#243d47 68%,#ad6639 100%); box-shadow:0 16px 34px var(--shadow); position:relative; overflow:hidden; }
.featured-art::after { content:''; position:absolute; left:68%; top:-10%; width:2px; height:120%; background:#b56832; transform:rotate(6deg); }
.work-meta { display:grid; grid-template-columns:repeat(4,1fr); margin:26px 0; border-top:1px solid var(--line); }
.work-meta div { padding:14px 12px 0 0; border-right:1px solid var(--line); }
.work-meta div:last-child { border-right:0; }
dt { text-transform:uppercase; letter-spacing:.14em; font-size:9px; font-weight:600; }
dd { margin:5px 0 0; font-size:11px; }
.outline-btn { display:inline-flex; align-items:center; gap:18px; border:1px solid var(--rust-light); padding:13px 18px; text-decoration:none; text-transform:uppercase; letter-spacing:.16em; font-size:10px; }
.auth-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; align-items:center; }
.auth-grid > div:first-child p:last-child { line-height:1.6; max-width:400px; }
.certificate { background:rgba(255,255,255,.35); border:1px solid var(--rust-light); outline:1px solid rgba(157,77,32,.35); outline-offset:-8px; padding:34px 42px; text-align:center; box-shadow:0 10px 24px var(--shadow); }
.certificate h3 { font-size:42px; letter-spacing:.1em; }
.cert-small { text-transform:uppercase; letter-spacing:.2em; font-size:10px; }
.certificate > p:not(.cert-small) { font-size:11px; line-height:1.6; max-width:520px; margin:10px auto 0; }
.cert-bottom { display:flex; justify-content:center; align-items:center; gap:44px; margin-top:20px; }
.seal { width:64px; height:64px; border-radius:50%; border:1px solid var(--rust); display:grid; place-items:center; color:var(--rust); font-size:30px; }
.signature { font-family:'Cormorant Garamond', serif; font-style:italic; font-size:30px; }
.contact-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:60px; align-items:end; }
.contact h2 { font-size:48px; }
.contact form { display:grid; grid-template-columns:1fr 1fr auto; gap:18px; }
.contact input, .contact button { height:48px; border:1px solid var(--line); background:rgba(255,255,255,.22); color:var(--ink); padding:0 14px; }
.contact button { border-color:var(--rust-light); text-transform:uppercase; letter-spacing:.16em; font-size:10px; cursor:pointer; }
#form-status { grid-column:1/-1; margin:0; min-height:18px; font-size:12px; color:var(--rust); }
footer { padding:26px 0 34px; }
.footer-grid { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; }
.footer-brand { font-family:'Cormorant Garamond', serif; letter-spacing:.18em; margin:0; }
.footer-grid p { margin:4px 0 0; }
.footer-star { color:var(--rust); font-size:34px; }
.footer-links { display:flex; justify-content:flex-end; gap:22px; }
dialog { max-width:520px; border:1px solid var(--rust-light); background:var(--paper); color:var(--ink); padding:34px; box-shadow:0 24px 80px rgba(0,0,0,.25); }
dialog::backdrop { background:rgba(39,24,18,.45); }
.dialog-close { position:absolute; right:12px; top:10px; border:0; background:transparent; color:var(--ink); font-size:28px; }
#dialog-title { font-size:44px; }
@media (max-width: 840px) {
  .main-nav { display:none; position:absolute; top:52px; right:0; flex-direction:column; background:var(--paper); border:1px solid var(--line); padding:18px; z-index:10; }
  .main-nav.open { display:flex; }
  .menu-toggle { display:block; }
  .hero-grid, .two-col, .featured-grid, .auth-grid, .contact-grid { grid-template-columns:1fr; }
  .hero-grid { gap:12px; padding-top:40px; }
  .logo-stage { max-width:520px; margin:auto; }
  .hero-copy { text-align:center; }
  .kicker { margin-inline:auto; }
  .cards { grid-template-columns:1fr; }
  .work-meta { grid-template-columns:1fr 1fr; }
  .contact form { grid-template-columns:1fr; }
  #form-status { grid-column:1; }
  .footer-grid { grid-template-columns:1fr; gap:20px; text-align:center; }
  .footer-links { justify-content:center; flex-wrap:wrap; }
}
