/* Deepwell · an imprint of Preservation, Inc. · house styles from the brand book (first edition, Sep 2026) */
@font-face{font-family:"Alegreya";src:url("/fonts/Alegreya-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Alegreya";src:url("/fonts/Alegreya-Medium.ttf") format("truetype");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"Alegreya";src:url("/fonts/Alegreya-Italic.ttf") format("truetype");font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:"Fraunces";src:url("/fonts/Fraunces-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Fraunces";src:url("/fonts/Fraunces-Medium.ttf") format("truetype");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"Fraunces";src:url("/fonts/Fraunces-Semibold.ttf") format("truetype");font-style:normal;font-weight:600;font-display:swap}
:root{
  --paper:#E9EDE3; --paper-deep:#DDE3D6; --ink:#1B2536; --brass:#A89B82; --mute:#5C5A52;
  --green:#3B5646; --oxblood:#6C2F2A; --ochre:#8C6A2E; --slate:#2C4A63;
  --accent:var(--oxblood); --measure:66ch;
}
@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} }
*{box-sizing:border-box}
html{background:var(--paper)}
html body,html body *,html body *::before,html body *::after{font-family:"Alegreya",Georgia,"Times New Roman",serif!important}
html body h1,html body h2,html body h3,html body h4,html body h5,html body h6,html body .wordmark,html body .imprint-name{font-family:"Fraunces",Georgia,"Times New Roman",serif!important}
body{
  margin:0; color:var(--ink); background:var(--paper);
  font-family:"Alegreya", Georgia, "Times New Roman", serif; font-size:19px; line-height:1.62;
  background-image:repeating-linear-gradient(0deg, rgba(27,37,54,.02) 0 1px, transparent 1px 3px);
  -webkit-font-smoothing:antialiased;
}
a{color:var(--slate); text-decoration:none; border-bottom:1px solid rgba(44,74,99,.35);}
a:hover{border-bottom-color:var(--slate);}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent); outline-offset:3px;}
.page{max-width:1120px; margin:0 auto; padding:0 clamp(20px,5vw,64px);}
.mark{ color:var(--accent); }

/* masthead */
header.mast{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:24px; padding:28px 0 20px; border-bottom:2px solid var(--ink);}
.mast .wordmark{ font-family:"Fraunces",serif; font-weight:600; font-size:28px; letter-spacing:.01em; font-variation-settings:"opsz" 96,"SOFT" 50; color:var(--ink); border:0;}
.mast .wordmark small{ display:block; font-family:"Alegreya"; font-weight:400; font-size:14px; color:var(--mute); margin-top:-2px;}
nav.top{ justify-self:end; display:flex; gap:26px; font-size:16px; flex-wrap:wrap;}
nav.top a{ color:var(--ink); border-bottom:1px solid transparent; padding-bottom:2px;}
nav.top a:hover, nav.top a[aria-current]{ border-bottom-color:var(--ink);}
.mark-sm{ width:44px; height:53px;}

/* hero */
.hero{ display:grid; grid-template-columns:minmax(200px,300px) 1fr; gap:clamp(28px,6vw,80px); align-items:end; padding:64px 0 56px; border-bottom:1px solid var(--brass);}
.hero .mark-lg{ width:100%; height:auto; display:block;}
h1{ font-family:"Fraunces",serif; font-weight:400; font-variation-settings:"opsz" 144,"SOFT" 50; font-size:clamp(38px,5.4vw,66px); line-height:1.04; letter-spacing:-.012em; margin:0 0 22px; max-width:14ch; text-wrap:balance;}
.lede{ font-size:22px; line-height:1.5; max-width:var(--measure); margin:0 0 26px;}
.byline{ font-size:16px; color:var(--mute); font-style:italic; margin:0;}

/* sections */
section{ padding:56px 0; border-bottom:1px solid var(--brass);}
section:last-of-type{ border-bottom:0;}
.two{ display:grid; grid-template-columns:1fr 2fr; gap:clamp(24px,5vw,72px); align-items:start;}
h2{ font-family:"Fraunces",serif; font-weight:500; font-variation-settings:"opsz" 96,"SOFT" 50; font-size:clamp(28px,3.2vw,38px); line-height:1.12; margin:0; letter-spacing:-.005em;}
h3{ font-family:"Fraunces",serif; font-weight:500; font-size:22px; line-height:1.2; margin:26px 0 6px;}
.whom{ margin-top:12px; font-size:16px; color:var(--mute); font-style:italic; max-width:28ch; line-height:1.45;}
.body p{ max-width:var(--measure); margin:0 0 18px;}
.body p:last-child{ margin-bottom:0;}
.body ul{ margin:0; padding:0; list-style:none; max-width:var(--measure);}
.body ul li{ padding:10px 0 10px 28px; position:relative; border-top:1px solid var(--paper-deep);}
.body ul li:first-child{ border-top:0;}
.body ul li::before{ content:""; position:absolute; left:2px; top:1.05em; width:10px; height:10px; border:1.5px solid var(--accent); border-radius:50%;}
.quiet{ color:var(--mute);}
.aside{ font-size:16px; color:var(--mute); margin-top:22px; max-width:var(--measure);}
ol.steps{ margin:0; padding:0; list-style:none; max-width:var(--measure); counter-reset:step;}
ol.steps li{ counter-increment:step; display:grid; grid-template-columns:52px 1fr; gap:14px; padding:14px 0; border-top:1px solid var(--paper-deep);}
ol.steps li:first-child{ border-top:0;}
ol.steps li::before{ content:counter(step); font-family:"Fraunces"; font-weight:500; font-size:30px; line-height:1; color:var(--accent); font-variation-settings:"opsz" 144,"SOFT" 50; padding-top:4px;}
ol.steps b{ font-weight:500; display:block;}
.price{ font-family:"Fraunces"; font-weight:500; font-size:20px; white-space:nowrap;}

/* dark band */
section.band{ background:var(--ink); color:var(--paper); margin:0 calc(50% - 50vw); padding:64px calc(50vw - 50%); border:0;}
section.band .inner{ max-width:1120px; margin:0 auto; padding:0 clamp(20px,5vw,64px);}
section.band h2{ color:var(--paper);}
section.band .whom{ color:var(--brass);}
section.band p{ color:#D9DED3;}
section.band a{ color:var(--paper); border-bottom-color:rgba(233,237,227,.4);}
section.band .mark{ color:var(--brass); width:64px; height:77px; margin-bottom:18px;}

/* pricing table */
table.rates{ width:100%; max-width:760px; border-collapse:collapse; font-size:18px;}
table.rates th{ text-align:left; font-weight:400; font-style:italic; color:var(--mute); padding:0 12px 8px 0; border-bottom:1px solid var(--brass); font-size:16px;}
table.rates td{ padding:12px 12px 12px 0; border-bottom:1px solid var(--paper-deep); vertical-align:top;}
table.rates td:last-child{ text-align:right; white-space:nowrap;}
table.rates tr:last-child td{ border-bottom:0;}

/* contact */
.contact .addr{ font-family:"Fraunces"; font-weight:500; font-size:clamp(22px,3vw,30px); font-variation-settings:"opsz" 96,"SOFT" 50;}
form.order{ max-width:var(--measure); display:grid; gap:12px; margin-top:20px;}
form.order label{ font-size:15px; color:var(--mute); font-style:italic;}
form.order input, form.order textarea{ font:inherit; width:100%; padding:10px 12px; border:1px solid var(--brass); background:var(--paper); color:var(--ink);}
.btn{ display:inline-block; font:inherit; padding:10px 18px; border:1.5px solid var(--ink); background:var(--ink); color:var(--paper); cursor:pointer; border-radius:0; justify-self:start;}
.btn.ghost{ background:transparent; color:var(--ink);}

/* footer */
footer{ border-top:2px solid var(--ink); padding:28px 0 48px; font-size:15px; color:var(--mute); line-height:1.7;}
footer .row{ display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start;}
footer .mark-sm{ width:40px; height:48px; margin-top:4px; color:var(--ink);}
footer a{ color:var(--ink); border-bottom:1px solid rgba(27,37,54,.25);}
footer .sep{ padding:0 .5ch; color:var(--brass);}
footer .line{ display:block;}
footer .fam a{ display:inline-flex; align-items:center; gap:5px; border-bottom:0;}
footer .fam a:hover{ border-bottom:0; color:var(--ink);}
footer .fm{ width:13px; height:16px; color:var(--ink); flex:none; position:relative; top:-1px;}

@media (max-width:760px){
  header.mast{ grid-template-columns:auto 1fr;}
  nav.top{ grid-column:1 / -1; justify-self:start; gap:18px;}
  .hero{ grid-template-columns:1fr; align-items:start; padding:40px 0;}
  .hero .mark-lg{ width:min(52vw,220px);}
  .two{ grid-template-columns:1fr;}
  .whom{ max-width:none;}
  body{ font-size:18px;}
}
