/* benfulford.com — cream register. Tokens from Ben Fulford Identity v1.0. */
:root{
  --ground:#faf6ec;--ground-deep:#ede6d6;--rule:#ddd5c2;
  --ink:#1a1a18;--ink-2:#5c574c;--ink-3:#8b8776;
  --teal:#0f635b;--yellow:#f4b731;--pine:#08211e;--paper:#e4f1ee;--paper-2:#8fb4ac;
  --serif:"Source Serif 4",Georgia,serif;--sans:"Work Sans",system-ui,sans-serif;
  --measure:64ch;--gutter:clamp(16px,5vw,64px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--serif);font-size:16.5px;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:var(--teal)}
img{max-width:100%;display:block}
h1,h2,h3{font-weight:600;letter-spacing:-0.012em;line-height:1.15;margin:0}
p{margin:0}
.meta{font-family:var(--sans);font-weight:600;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3)}
.meta.teal{color:var(--teal)}
.btn{display:inline-block;padding:12px 20px;border-radius:2px;background:var(--teal);color:var(--ground);font-family:var(--sans);font-weight:500;font-size:14px;line-height:1.5;text-decoration:none}
.btn:hover{background:var(--pine);color:var(--ground)}
.link{font-family:var(--sans);font-weight:500;font-size:14px;color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.wrap{padding-left:var(--gutter);padding-right:var(--gutter);max-width:1280px;margin:0 auto}

/* masthead */
.mast{height:64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);background:var(--ground);position:sticky;top:0;z-index:10}
.mast .brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.mast .brand img{width:30px;height:30px}
.mast .brand span{font-family:var(--serif);font-size:21px;letter-spacing:-0.018em}
.mast nav{display:flex;align-items:center;gap:2px;font-family:var(--sans);font-weight:600;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase}
.mast nav a{color:var(--ink-3);text-decoration:none;padding:8px 11px;border-radius:2px}
.mast nav a:hover{color:var(--ink);background:var(--ground-deep)}
.mast nav a.sub{color:var(--ground);background:var(--teal);padding:9px 14px;margin-left:8px}
.mast nav a.sub:hover{background:var(--pine)}
@media (max-width:720px){.mast nav a:not(.sub){display:none}}

/* hero */
.hero{padding:clamp(56px,10vw,104px) 0 clamp(56px,9vw,96px);background-image:url(/images/graph-field-L-banner-transparent-ink.svg);background-repeat:no-repeat;background-position:right bottom;background-size:min(1280px,100%) auto;opacity:1}
.hero .inner{max-width:820px;display:flex;flex-direction:column;gap:24px}
.hero h1{font-size:clamp(34px,5vw,60px);line-height:1.05;letter-spacing:-0.02em}
.hero .stand{font-size:clamp(18px,2vw,21px);font-style:italic;line-height:1.4;color:var(--ink-2);max-width:var(--measure)}
.hero .cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:8px}

/* sections */
section{padding:64px 0}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:32px;align-items:center}
@media (max-width:900px){.grid3{grid-template-columns:1fr;gap:32px}.grid12{display:flex;flex-direction:column;align-items:stretch}}
.essays .lead{display:flex;flex-direction:column;gap:16px}
.essays .lead h2{font-size:30px}
.essays .lead p{color:var(--ink-2)}
.essays .list{grid-column:span 2;display:flex;flex-direction:column;border-bottom:1px solid var(--rule)}
.essays .list a{display:flex;flex-direction:column;gap:8px;padding:24px 0;border-top:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.essays .list a:hover .t{color:var(--teal)}
.essays .list .t{font-size:22px;font-weight:600;letter-spacing:-0.012em;line-height:1.25}
.essays .list .s{color:var(--ink-2);font-size:15.5px;line-height:1.6}
.about{border-top:1px solid var(--rule)}
.about img{grid-column:span 4;width:100%;height:440px;object-fit:cover;object-position:top;border-radius:2px}
.about .text{grid-column:6 / span 6;display:flex;flex-direction:column;gap:16px}
.about .text p{font-size:19px;line-height:1.65}
@media (max-width:900px){.about img{height:auto;max-width:420px}}
.doors{background:var(--ground-deep)}
.doors .head{display:flex;flex-direction:column;gap:8px;margin-bottom:32px}
.doors .head h2{font-size:30px}
.doors .cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
@media (max-width:900px){.doors .cards{grid-template-columns:1fr}}
.doors .card{display:flex;flex-direction:column;gap:12px;padding:28px;background:var(--ground);border:1px solid var(--rule);border-radius:2px;text-decoration:none;color:var(--ink)}
.doors .card:hover{border-color:var(--teal)}
.doors .card .t{font-size:26px;font-weight:600;letter-spacing:-0.012em}
.doors .card .d{color:var(--ink-2);font-size:16px;line-height:1.6}
.doors .card .l{font-family:var(--sans);font-weight:500;font-size:14px;color:var(--teal);margin-top:auto}

/* inner pages */
.page{padding:clamp(48px,8vw,88px) 0 64px}
.page .title{display:flex;flex-direction:column;gap:16px;margin-bottom:40px;max-width:820px}
.page h1{font-size:clamp(32px,4.5vw,48px);line-height:1.08;letter-spacing:-0.02em}
.prose{max-width:var(--measure)}
.prose p+p{margin-top:1.2em}
.prose h2{font-size:24px;margin:2em 0 .6em}
.contact-list{display:flex;flex-direction:column;gap:0;max-width:var(--measure);border-bottom:1px solid var(--rule)}
.contact-list a{display:flex;justify-content:space-between;gap:24px;padding:20px 0;border-top:1px solid var(--rule);text-decoration:none;color:var(--ink);font-size:19px}
.contact-list a span:last-child{font-family:var(--sans);font-size:14px;color:var(--teal);white-space:nowrap}
.contact-list a:hover span:first-child{color:var(--teal)}

/* footer */
footer{padding:40px 0;border-top:1px solid var(--rule)}
footer .row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
footer .id{display:flex;flex-direction:column;gap:6px}
footer .id .n{font-size:18px;letter-spacing:-0.012em}
footer .id .l{font-size:15px;color:var(--ink-2);font-style:italic}
footer .id .m{margin-top:8px;font-size:10.5px}
footer .links{display:flex;gap:24px;font-family:var(--sans);font-weight:500;font-size:14px}
footer .links a{color:var(--teal);text-decoration:none}
footer .links a:hover{text-decoration:underline;text-underline-offset:3px}