/* TTC site styles. Questions to the web committee. */
:root{--ink:#111110;--bone:#F3F0E7;--paper:#FBF9F3;--line:#D8D3C4;--mute:#6B675C;--ox:#7A1E12}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bone);color:var(--ink);font:400 17px/1.65 Inter,"Helvetica Neue",Arial,sans-serif}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
.notice{background:var(--ink);color:var(--bone);font-size:13px;line-height:1.5;padding:9px 24px;text-align:center}
header.top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 40px;border-bottom:1px solid var(--line);background:var(--bone)}
.mark{font:900 28px/1 "Playfair Display",Georgia,serif;letter-spacing:.14em;text-decoration:none}
nav{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
nav a{text-decoration:none}
nav a:hover{color:var(--ox)}
.btn{display:inline-block;background:var(--ink);color:var(--bone)!important;padding:14px 26px;text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;border:1px solid var(--ink);cursor:pointer}
.btn.ghost{background:transparent;color:var(--ink)!important}
.btn:hover{background:var(--ox);border-color:var(--ox);color:var(--bone)!important}
nav .btn{padding:10px 18px}
.hero{display:grid;grid-template-columns:1.05fr 1fr;min-height:min(calc(100vh - 118px),860px)}
.hero .copy{padding:9vh 7vw 8vh 40px;display:flex;flex-direction:column;justify-content:center}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin:0 0 22px}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;line-height:1.08;margin:0}
.hero h1{font-size:clamp(46px,6.3vw,92px);font-weight:900;letter-spacing:-.015em}
.hero p.pitch{font-size:21px;line-height:1.5;margin:30px 0 36px;max-width:31em}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px}
.hero .pic{background:#000 url(../img/hero.jpg) center/cover no-repeat}
.bar{background:#000;color:#000;text-decoration:none;cursor:text}
.bar,span[style*="background-color:#000000"]{padding:0 .12em}
.hero h1 .bar{background:linear-gradient(#000,#000) 0 58%/100% 66% no-repeat;color:transparent}
.strip{display:grid;grid-template-columns:repeat(4,1fr);background:var(--ink);color:var(--bone)}
.strip div{padding:40px 30px;border-right:1px solid #333}
.strip b{display:block;font:900 46px/1 "Playfair Display",Georgia,serif;margin-bottom:10px}
.strip span{font-size:13px;letter-spacing:.05em;color:#BDB8AA}
section{padding:100px 40px}
.wrap{max-width:1140px;margin:0 auto}
.sec-h{font-size:clamp(34px,4vw,54px);font-weight:900;max-width:15em;margin-bottom:48px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:44px}
.steps i{font:italic 700 26px "Playfair Display",Georgia,serif;color:var(--ox)}
.steps h3{font-size:25px;margin:10px 0 12px}
.steps p{margin:0}
.dark{background:var(--ink);color:var(--bone)}
.letter{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:start}
.letter blockquote{margin:0;font:700 clamp(28px,3.1vw,42px)/1.24 "Playfair Display",Georgia,serif}
.letter p{margin:0 0 18px}
.sig{font-weight:600;margin-top:26px}
.sig small{display:block;font-weight:400;color:#BDB8AA;font-size:14px}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line)}
.quotes figure{margin:0;padding:34px 34px 34px 0;border-right:1px solid var(--line)}
.quotes figure+figure{padding-left:34px}
.quotes figure:last-child{border-right:0}
.quotes q{font:400 22px/1.36 "Playfair Display",Georgia,serif;quotes:none}
.quotes figcaption{margin-top:18px;font-size:13px;color:var(--mute)}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tier{background:var(--paper);border:1px solid var(--line);padding:36px 32px;display:flex;flex-direction:column}
.tier.main{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.tier h3{font-size:26px}
.price{font:900 44px/1 "Playfair Display",Georgia,serif;margin:18px 0 4px}
.per{font-size:13px;opacity:.7;margin-bottom:22px}
.tier ul{margin:0 0 28px;padding:0;list-style:none;flex:1}
.tier li{padding:9px 0;border-top:1px solid rgba(128,128,128,.28);font-size:15px}
.tier.main .btn{background:var(--bone);color:var(--ink)!important;border-color:var(--bone)}
.read{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.read a{display:block;padding:44px 40px;background:var(--paper);border:1px solid var(--line);text-decoration:none}
.read a:hover{border-color:var(--ink)}
.read small{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.read h3{font-size:34px;margin:12px 0 10px}
.read p{margin:0}
footer{background:var(--ink);color:#BDB8AA;padding:44px 40px;font-size:13px}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px}
footer a{color:var(--bone);margin-right:18px}
.page{max-width:820px;margin:0 auto;padding:70px 28px 100px}
.page.wide{max-width:1120px}
.page h1{font-size:clamp(38px,5vw,60px);font-weight:900;margin-bottom:26px}
.issue-head{border-bottom:3px solid var(--ink);padding-bottom:18px;margin-bottom:38px}
.issue-head p{margin:8px 0 0;color:var(--mute);font-size:14px}
.issue{display:grid;grid-template-columns:1.25fr 1fr;gap:56px}
.issue aside hr,.page hr{border:0;border-top:1px solid var(--line);margin:26px 0}
.issue .lead-t{font:900 36px/1.1 "Playfair Display",Georgia,serif;display:block;margin-bottom:12px}
table.issues{border-collapse:collapse;width:100%;background:var(--paper)}
table.issues td{border:1px solid var(--line);padding:10px 14px;font-size:15px}
form.apply label{display:block;font-size:13px;font-weight:600;letter-spacing:.06em;margin:20px 0 6px}
form.apply input,form.apply textarea,form.apply select{width:100%;padding:13px;border:1px solid var(--ink);background:var(--paper);font:inherit}
form.apply .btn{margin-top:24px}
.thanks{display:none;background:var(--ink);color:var(--bone);padding:26px;margin-top:24px}
@media(max-width:860px){
header.top{padding:16px 20px;flex-wrap:wrap}nav{gap:14px;flex-wrap:wrap;font-size:12px}
.hero{grid-template-columns:1fr;min-height:0}.hero .copy{padding:54px 20px}.hero .pic{min-height:340px}
.strip{grid-template-columns:1fr 1fr}section{padding:64px 20px}
.steps,.letter,.quotes,.tiers,.read,.issue{grid-template-columns:1fr}
.quotes figure,.quotes figure+figure{padding:26px 0;border-right:0;border-bottom:1px solid var(--line)}
footer{padding:36px 20px}}
.tier .btn{text-align:center}
body.occ{background:#0B0A09;color:#D9D3C2}
body.occ header.top{background:#F3F0E7;color:#111110}
.occ-main{max-width:760px;margin:0 auto;padding:80px 24px 120px;font:400 19px/1.75 "Playfair Display",Georgia,serif}
.occ-main h1{font-size:clamp(38px,5vw,58px);font-weight:400;font-style:italic;margin-bottom:12px;color:#E9E3D3}
.occ-main .gr{color:#8E2A1A;font-style:italic;letter-spacing:.03em;margin:0 0 54px}
.occ-main .bar{background:#D9D3C2;color:#D9D3C2}
.occ-main .plate{margin:64px -90px}
.occ-main .plate.n{margin:64px 110px}
.occ-main .plate img{width:100%;filter:grayscale(1) contrast(1.12)}
.occ-main .pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:64px -90px}
.occ-main .pair img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.18)}
.occ-main a{color:#D9D3C2}
.feature{display:block;background:#111110;color:#F3F0E7;padding:40px 44px;margin-bottom:48px;text-decoration:none}
.feature small{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#BDB8AA}
.feature b{display:block;font:900 clamp(32px,4vw,52px)/1.08 "Playfair Display",Georgia,serif;margin:12px 0 10px}
@media(max-width:900px){.occ-main .plate,.occ-main .plate.n,.occ-main .pair{margin:44px 0}}
.words{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 44px}
.words h3{font-size:27px;margin-bottom:10px}
.words p{margin:0}
.arts{columns:2;column-gap:56px;font-size:15px;line-height:1.6}
.arts p{break-inside:avoid;margin:0 0 18px}
.lede{font:400 clamp(26px,3vw,38px)/1.3 "Playfair Display",Georgia,serif;margin:0 0 28px}
@media(max-width:860px){.words{grid-template-columns:1fr}.arts{columns:1}}
