/* Dossier layout — Bulletinmere only.
   Ivory paper, navy ink, rust file-tab, gold rule.
   Iowan/Georgia heads, Avenir/Gill Sans body.
   Cover sheet with punch-hole rail first, then a 16:9 photo with caption under.
   Guide files: type on the left, 4:3 thumb on the right, hanging-tab number.
   Sticky navy mast; Home–Contact stay nowrap at 390 and 360. */
:root{
  --ivory:#f3eee4;--sheet:#faf6ee;--navy:#1b2a4a;--rust:#b5522a;--gold:#c9a15b;
  --ink:#1e1a16;--mute:#5a5348;--rule:#c9bfb0;--wash:#e8e0d2;--tab:#efe6d4;
  --hd:"Iowan Old Style",Iowan,Georgia,"Times New Roman",serif;
  --bd:"Avenir Next",Avenir,"Nunito Sans","Gill Sans",Calibri,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--ivory);color:var(--ink);font-family:var(--bd);line-height:1.66;font-size:17px}
img,picture,svg{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--rust)}
.w{width:min(1080px,calc(100% - 40px));margin:0 auto}
.w.n{width:min(740px,calc(100% - 40px))}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:8px 12px;z-index:40}
.skip:focus{left:8px}

/* hero framing: start below the header, cover + object-position on the faces, text off the faces */
header,.hd,.hdr,.mast{position:sticky;top:0;z-index:20}
.hero{margin:0;padding:0}
.hero img,.hero picture img{object-fit:cover;object-position:center top}

.mast{position:sticky;top:0;z-index:20;background:var(--navy);color:var(--sheet);border-bottom:4px solid var(--gold)}
.mast .bar{display:flex;align-items:center;gap:14px;padding:8px 0;flex-wrap:nowrap;min-width:0}
.mast .brand{flex:0 0 auto}
.mast .brand img{height:26px;width:auto}
.mast nav{flex:1 1 auto;min-width:0}
.mn{display:flex;gap:12px;list-style:none;margin:0;padding:0;flex-wrap:nowrap;min-width:0}
.mn a{color:var(--sheet);text-decoration:none;font-weight:650;font-size:.84rem;white-space:nowrap;padding:6px 0;letter-spacing:.04em;text-transform:uppercase}
.mn a[aria-current=page],.mn a:hover{color:var(--gold);box-shadow:inset 0 -2px 0 var(--gold)}
.mast .cta{margin-left:auto;display:inline-block;background:var(--rust);color:#fff;text-decoration:none;font-weight:700;padding:7px 14px;white-space:nowrap;border:1px solid var(--rust)}
.mast .cta:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}

@media (max-width:768px){
  .mast .bar{flex-wrap:wrap;gap:8px 12px}
  .mast nav{flex:1 1 100%;min-width:0}
  .mn{flex-wrap:nowrap;gap:10px;justify-content:flex-start}
  .mn a{font-size:.78rem;letter-spacing:.02em;padding:4px 0}
  .mast .cta{margin-left:0;flex:1 1 100%;text-align:center}
  .mast .brand img{max-width:min(190px,100%);height:auto}
}
@media (max-width:390px){
  .w,.w.n{width:calc(100% - 24px)}
  .mn{gap:6px}
  .mn a{font-size:.68rem;letter-spacing:0}
}
@media (max-width:360px){
  .w,.w.n{width:calc(100% - 32px)}
}

/* Cover sheet — punch-hole rail, hanging file tab, type first */
.cover{padding:34px 0 22px;background:var(--sheet);border-bottom:1px solid var(--rule)}
.cover .inner{position:relative;padding:8px 0 8px 36px}
.cover .inner:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:18px;background:
  radial-gradient(circle at 8px 18px,#fff 4px,transparent 5px),
  radial-gradient(circle at 8px 54px,#fff 4px,transparent 5px),
  radial-gradient(circle at 8px 90px,#fff 4px,transparent 5px),
  var(--navy);border-radius:2px}
.cover .kicker{display:inline-block;margin:0 0 12px;padding:5px 14px 6px;background:var(--tab);border:1px solid var(--rule);border-bottom:0;color:var(--navy);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;border-radius:8px 8px 0 0}
.cover h1{font-family:var(--hd);font-weight:600;font-size:clamp(1.9rem,4vw,2.85rem);line-height:1.16;margin:0 0 14px;color:var(--navy);max-width:22ch}
.cover .lead{font-size:1.08rem;color:var(--mute);margin:0 0 18px;max-width:58ch}
.btn,.btn-ghost{display:inline-block;padding:10px 18px;text-decoration:none;font-weight:700;margin:0 8px 8px 0}
.btn{background:var(--navy);color:var(--sheet);border:1px solid var(--navy)}
.btn:hover{background:var(--rust);border-color:var(--rust);color:#fff}
.btn-ghost{background:transparent;color:var(--navy);border:1px solid var(--navy)}
.btn-ghost:hover{background:var(--wash)}

.hero{background:var(--ivory);padding:0 0 8px}
.hero .frame{margin:0}
.hero img,.hero picture img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:center top}
.cap{font-size:.88rem;color:var(--mute);margin:8px 0 18px;font-style:italic}

/* Hanging-file facts — tabbed heads, not a left-bar row */
.hang{background:var(--wash);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:26px 0 22px}
.hang ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;list-style:none;margin:0;padding:0}
.hang li{background:var(--sheet);border:1px solid var(--rule);padding:0 0 14px;min-width:0;box-shadow:2px 2px 0 var(--rule)}
.hang b{display:block;font-family:var(--hd);font-size:1.12rem;font-weight:600;color:var(--sheet);background:var(--navy);margin:0 0 10px;padding:8px 12px 7px;letter-spacing:.02em}
.hang span{display:block;color:var(--ink);font-size:.95rem;padding:0 12px}

.sec{padding:34px 0}
.sec.tint{background:var(--sheet);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.sec h2,.sheet h1,.legal h2{font-family:var(--hd);font-weight:600;line-height:1.2;color:var(--navy)}
.sec h2{font-size:1.8rem;margin:0 0 12px}
.sec p,.sheet p{margin:0 0 14px}
.sec h3{font-family:var(--hd);font-size:1.22rem;margin:18px 0 8px}

/* Horizontal hanging files: type left, thumb right */
.files{display:flex;flex-direction:column;gap:16px;margin-top:16px}
.file{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:0;background:var(--sheet);border:1px solid var(--rule);min-width:0;align-items:stretch;box-shadow:3px 3px 0 var(--wash)}
.file .body{padding:16px 18px 18px;border-right:1px dashed var(--rule)}
.file .tab{display:inline-block;background:var(--rust);color:#fff;font-family:var(--hd);font-size:.8rem;letter-spacing:.12em;padding:2px 8px;margin:0 0 6px}
.file h3{margin:0 0 6px;font-size:1.28rem}
.file h3 a{color:var(--navy);text-decoration:none}
.file h3 a:hover{color:var(--rust)}
.file .thumb img,.file .thumb picture img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:center top;aspect-ratio:4/3}
@media (max-width:800px){
  .hang ul,footer.site .grid,.notes{grid-template-columns:1fr}
  .file{grid-template-columns:1fr}
  .file .body{border-right:0;border-bottom:1px dashed var(--rule)}
}

.notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.note{background:var(--sheet);border:1px solid var(--rule);border-bottom:5px solid var(--gold);padding:16px 16px 18px;min-width:0}
.note h3{margin:0 0 8px;font-family:var(--hd);color:var(--navy);font-size:1.18rem}
.note p{margin:0;font-size:.95rem}

.sheet{padding:28px 0 8px}
.sheet .kicker{margin:0 0 8px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--rust);font-weight:700}
.sheet h1{font-size:clamp(1.75rem,3.5vw,2.5rem);margin:0 0 10px}
.art-hero,.guides-hero,.about-hero{background:var(--wash)}
.art-hero img,.art-hero picture img,
.guides-hero img,.guides-hero picture img,
.about-hero img,.about-hero picture img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center top}

.drop::first-letter{font-family:var(--hd);float:left;font-size:3.3rem;line-height:.8;padding:6px 10px 0 0;color:var(--rust)}

table.ref{width:100%;max-width:100%;border-collapse:collapse;margin:16px 0 22px;background:var(--sheet);border:1px solid var(--rule);table-layout:fixed}
table.ref th,table.ref td{border:1px solid var(--rule);padding:8px 10px;text-align:left;vertical-align:top;word-wrap:break-word;overflow-wrap:anywhere}
table.ref th{background:var(--navy);color:var(--sheet);font-family:var(--hd);font-weight:600}
table.ref td:before{display:none}

.formwrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px;align-items:start}
.formwrap > *,#lead-form,fieldset,.form-grid{min-width:0;max-width:100%}
#lead-form{background:var(--sheet);border:1px solid var(--rule);border-left:6px solid var(--navy);padding:22px 24px}
#lead-form fieldset{border:0;margin:0;padding:0}
#lead-form legend{font-family:var(--hd);font-size:1.4rem;font-weight:600;margin-bottom:12px;color:var(--navy)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
@media (max-width:600px){.form-grid{grid-template-columns:1fr}}
label.field{display:block;font-weight:650;margin:0 0 12px;min-width:0}
label.field input,label.field select,#lead-form input[type=text],#lead-form input[type=email],#lead-form input[type=tel],#lead-form select{
  display:block;width:100%;margin-top:6px;padding:8px 10px;border:1px solid var(--rule);background:#fff;font:inherit;min-width:0;max-width:100%}
.consent-block{margin:12px 0;display:flex;align-items:flex-start;gap:8px;min-width:0;background:var(--tab);border:1px solid var(--rule);padding:12px 14px;font-size:.92rem;line-height:1.5}
.consent-block input[type=checkbox]{flex:0 0 auto;margin-top:.35em;margin-right:0;width:18px;height:18px}
.consent-block label{flex:1 1 auto;min-width:0}
label[for=lead-privacy]{display:block;position:relative;padding-left:28px;margin:14px 0;line-height:1.5;font-size:.95rem}
#lead-privacy{position:absolute;left:0;top:.35em;width:18px;height:18px;margin:0}
#lead-form button{background:var(--navy);border:0;color:var(--sheet);font-weight:700;font-size:1.02rem;padding:12px 22px;cursor:pointer}
#lead-form button:hover{background:var(--rust);color:#fff}
.hint{font-size:.9rem;color:var(--mute)}
.status{font-size:.9rem;color:var(--mute)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.aside{background:var(--tab);border:1px solid var(--rule);border-top:4px solid var(--gold);padding:18px 20px}
.aside h2,.aside h3{font-family:var(--hd);margin:0 0 8px;color:var(--navy)}
.ticks{margin:0 0 14px;padding:0 0 0 18px}
.ticks li{margin:0 0 6px}
.smp{background:var(--sheet);border:1px dashed var(--navy);padding:12px 16px;margin:12px 0 18px}
.smp p{margin:0 0 12px}
.legal h2{font-size:1.32rem;margin:22px 0 8px}

.ex{background:var(--sheet);border:1px solid var(--rule);border-top:6px solid var(--rust);padding:18px 20px;margin:22px 0}
.ex h2{margin-top:0}
.checks,.asks{padding-left:1.3rem;margin:8px 0 22px}
.checks li,.asks li{margin:0 0 .55em}
.terms{margin:12px 0 22px}
.terms div{margin:0 0 12px;padding:0 0 10px;border-bottom:1px solid var(--rule)}
.terms dt{font-family:var(--hd);color:var(--navy);font-size:1.15rem}
.terms dd{margin:4px 0 0;color:var(--ink)}
.fine{font-size:.88rem;color:var(--mute);margin:18px 0 0}

footer.site{background:var(--navy);color:var(--wash);padding:28px 0 36px;margin-top:8px;border-top:4px solid var(--gold)}
footer.site a{color:#e8c9a0}
footer.site h2{font-family:var(--hd);color:#fff;font-size:1.2rem;margin:0 0 8px}
footer.site .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
footer.site p{margin:0 0 8px}

@media (max-width:768px){
  .formwrap{grid-template-columns:1fr}
  .cover .inner{padding-left:28px}
}
@media (max-width:360px){
  table.ref thead{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
  table.ref,table.ref tbody,table.ref tr,table.ref td{display:block;width:100%;max-width:100%}
  table.ref tr{border-bottom:2px solid var(--navy);margin:0 0 12px;background:var(--sheet)}
  table.ref td{border:0;border-top:1px solid var(--rule);padding:8px 12px 10px}
  table.ref td:before{content:attr(data-label);display:block;font-weight:700;font-family:var(--hd);margin-bottom:4px;color:var(--navy)}
}
