:root {
  --ms-teal-900:#0F4A4E; --ms-teal-800:#145C61; --ms-teal-700:#1D6C72;
  --ms-oxblood-900:#6A1F2C; --ms-oxblood-800:#7A2433; --ms-red-ink:#8D2235;
  --ms-gold-500:#C79A3B; --ms-brass-500:#B08D57; --ms-ochre-500:#C58A4C;
  --ms-cream-100:#F5EFE4; --ms-cream-200:#F2EADF; --ms-cream-300:#E8DDCC;
  --ms-espresso-900:#1F1714; --ms-ink-900:#171311; --ms-charcoal-800:#2A2320;
  --bg-page:#F2EADF; --bg-page-alt:#F5EFE4; --bg-panel-light:#E8DDCC;
  --bg-panel-dark:#0F4A4E; --bg-panel-warm:#C58A4C; --bg-panel-accent:#6A1F2C;
  --text-primary:#1F1714; --text-inverse:#F5EFE4; --text-accent:#0F4A4E;
  --text-secondary-accent:#6A1F2C; --line-brass:#B08D57; --line-gold:#C79A3B; --line-ink:#1F1714;
  --paint-teal:#0F4A4E; --paint-teal-bright:#145C61; --paint-oxblood:#6A1F2C;
  --paint-red-ink:#8D2235; --paint-gold:#C79A3B; --paint-brass:#B08D57;
  --paint-cream:#F2EADF; --paint-cream-deep:#E8DDCC; --paint-espresso:#1F1714;
  --shadow-soft:0 8px 24px rgba(31,23,20,.08);
  --shadow-medium:0 12px 30px rgba(31,23,20,.12);
  --shadow-deep:0 18px 40px rgba(31,23,20,.18);
  --teal: #0F4A4E;
  --oxblood: #6A1F2C;
  --cognac: #B9784A;
  --cream: #F2EADF;
  --espresso: #1F1714;
  --brass: #B08D57;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--cream); color: var(--espresso); font-family: Arial, sans-serif; }
a { color: inherit; text-underline-offset: .22em; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
header { background: var(--cream); display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding: 25px 5vw; border-bottom: 1px solid var(--brass); }
.brand { color: var(--teal); font: 700 1.35rem Georgia, serif; text-decoration: none; }
.brand:after { content: ""; display: block; height: 1px; background: var(--brass); margin-top: 8px; }
nav { display: flex; flex-wrap: wrap; gap: 14px 28px; }
nav a, .social a { font-size: .875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .055em; }
nav a { color: var(--teal); }
nav a:hover { color: var(--teal); text-decoration-thickness: 2px; }
h1,h2,h3 { font-family: Georgia, serif; font-weight: 400; letter-spacing: -.035em; }
.hero { background: var(--cream); }
.hero > div:first-child { padding: clamp(3rem, 6vw, 5.5rem) 5vw clamp(2.5rem, 4vw, 4rem); }
.kicker { font: 700 .8rem/1.5 Arial, sans-serif; letter-spacing: .16em; color: var(--teal); }
.hero h1 { color: var(--espresso); font-size: clamp(3.4rem, 6.7vw, 7rem); line-height: .98; letter-spacing: -.04em; margin: 20px 0 28px; max-width: 1000px; }
.hero h1 em { color: var(--oxblood); font-weight: 400; }
.lede, .intro, .section p { font-family: Georgia, serif; line-height: 1.7; }
.lede { font-size: 1.2rem; max-width: 760px; }
.actions, .social { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 28px; }
.btn { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; padding: 14px 18px; border: 1px solid var(--espresso); font: 700 .8rem/1.4 Arial,sans-serif; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; }
.wine { background: var(--teal); color: var(--cream); border-color: var(--teal); }
.btn:hover { background: var(--cognac); color: var(--espresso); border-color: var(--cognac); }
.hero .social { color: var(--teal); padding-top: 22px; border-top: 1px solid var(--brass); max-width: 760px; }
/* A two-column graphic panel: the warm annotation column frames the words. */
.art { position: relative; display: grid; grid-template-columns: 1.4fr 1fr; align-items: stretch; background: var(--espresso); color: var(--cream); border-block: 2px solid var(--brass); }
.paint { display: none; }
.art p { margin: 0; padding: 48px 7vw; font-size: clamp(2rem, 3.8vw, 3.75rem); line-height: 1.06; font-weight: 900; letter-spacing: -.025em; }
.art i { display: flex; align-items: end; margin: 0; padding: 48px clamp(1.5rem, 5vw, 5rem); background: var(--cognac); color: var(--espresso); border-left: 8px solid var(--oxblood); font: italic clamp(1.5rem, 3vw, 2.75rem)/1.25 Georgia,serif; }
.manifesto { background: var(--cream); color: var(--teal); padding: 36px 7vw; text-align: center; border-bottom: 1px solid var(--brass); font: italic clamp(1.45rem, 2.5vw, 2.5rem)/1.35 Georgia,serif; }
.section { padding: clamp(3rem, 6vw, 6rem) 5vw; border-bottom: 1px solid var(--brass); }
.section h2, .closing h2 { font-size: clamp(2.5rem, 4.7vw, 5.2rem); line-height: 1.06; margin: 18px 0 28px; }
.section h2 { color: var(--teal); }
#work h2 { color: var(--espresso); max-width: 1000px; }
.intro { max-width: 720px; font-size: 1.15rem; }
.cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; margin-top: 36px; align-items: stretch; }
.cards article, .books article { padding: clamp(24px, 3vw, 38px); border: 1px solid var(--brass); box-shadow: 0 18px 45px rgba(31,23,20,.08); height: auto; min-height: 0; }
.cards h3, .books h3 { font-size: clamp(2rem, 2.9vw, 2.8rem); line-height: 1.12; margin: 28px 0 20px; }
.cards small { display: block; margin-top: 30px; padding-top: 16px; border-top: 1px solid var(--brass); font-size: .8rem; letter-spacing: .06em; font-weight: 700; }
.winebg { background: var(--teal); color: var(--cream); }
.cards .tealbg { background: var(--cream); color: var(--teal); border-top: 5px solid var(--oxblood); }
.cognacbg { background: var(--cognac); color: var(--espresso); border-top: 5px solid var(--oxblood) !important; }
.cognacbg small { border-color: var(--espresso); }
.writing { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; background: var(--cream); }
.books { display: grid; gap: 26px; }
.books article:first-child { border-left: 5px solid var(--oxblood); }
.books .tealbg { background: var(--teal); color: var(--cream); border-left: 5px solid var(--cognac); box-shadow: inset 0 1px 0 rgba(242,234,223,.08), 0 15px 30px rgba(31,23,20,.12); }
.books small { font-size: .8rem; line-height: 1.5; }
.textlink { font-weight: 700; color: var(--teal); }
.textlink:hover { color: var(--oxblood); }
.quote { background: var(--teal); color: var(--cream); padding: clamp(3rem, 5vw, 5rem) 7vw; border-block: 1px solid var(--brass); }
.quote:before { content: "“"; display: block; color: var(--brass); font: 5rem/.6 Georgia,serif; margin: 1rem 0; }
.quote blockquote { margin: 0; max-width: 1160px; font: italic clamp(1.45rem, 2.65vw, 2.6rem)/1.45 Georgia,serif; }
.quote cite { display: block; border-top: 1px solid var(--brass); margin-top: 26px; padding-top: 20px; color: var(--cream); font: 400 .875rem/1.5 Arial,sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.table { background: var(--cream); color: var(--espresso); }
.table .kicker { color: var(--oxblood); }
.twocol { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; }
.pill { display: inline-block; padding: 12px 16px; background: var(--oxblood); color: var(--cream); border: 1px solid var(--oxblood); font-size: .8rem; font-weight: 700; letter-spacing: .09em; line-height: 1.5; }
.about { display: grid; grid-template-columns: .7fr 1.3fr; gap: 8vw; align-items: center; background: var(--cream); }
/* Saturated backing under the existing portrait; copy remains on paper. */
.about > div:first-child { position: relative; isolation: isolate; padding-bottom: 12px; }
.about > div:first-child:before { content: ""; position: absolute; z-index: -1; inset: 18% -18px 0 -18px; background: var(--espresso); border-bottom: 5px solid var(--oxblood); box-shadow: 0 18px 30px rgba(31,23,20,.12); }
.portrait { padding: 12px; background: var(--cream); border: 1px solid var(--brass); box-shadow: 10px 10px 0 var(--teal); transform: rotate(-1.5deg); }
.portrait img { display: block; width: 100%; }
.note { display: inline-block; margin: 24px 0 18px 14%; font: italic 1.25rem/1.4 Georgia,serif; color: var(--cream); transform: rotate(-5deg); }
.about .social { color: var(--teal); }
.closing { text-align: center; padding: clamp(3rem, 6vw, 6rem) 5vw; background: var(--teal); color: var(--cream); border-top: 1px solid var(--brass); }
.closing .kicker, .closing h2 { color: var(--cream); }
.closing > p { max-width: 700px; margin: 0 auto; font: 1.1rem/1.7 Georgia,serif; }
.closing .actions { justify-content: center; }
.closing .btn { border-color: var(--cream); color: var(--cream); background: transparent; }
.closing .wine { background: var(--cream); color: var(--teal); }
.closing .btn:hover { background: var(--cognac); color: var(--espresso); border-color: var(--cognac); }
footer { background: var(--espresso); color: var(--cream); border-top: 1px solid var(--brass); padding: 44px 5vw; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
footer strong, footer small { display: block; font-family: Georgia,serif; }
footer small { margin-top: 7px; line-height: 1.5; color: var(--cream); }
@media(max-width:1100px) { header { flex-wrap: wrap; } }
@media(max-width:850px) {
  header { display: block; }
  nav { margin-top: 18px; gap: 14px 20px; }
  nav a, .social a { font-size: .8rem; }
  .writing, .twocol, .about { grid-template-columns: 1fr; }
  .cards { grid-template-columns: 1fr; }
  .section { padding: 52px 6vw; }
  .cards article { padding: 28px; }
  .cards h3, .books h3 { font-size: 2.25rem; }
  .cards h3 { margin-top: 22px; }
  footer { display: block; }
  footer > span { display: block; margin-top: 28px; }
  .about > div:first-child { max-width: 420px; width: 100%; }
  .about { gap: 40px; }
  .about > div:first-child:before { inset-inline: -10px; }
  .portrait { max-width: 420px; }
  .art { grid-template-columns: 1fr; }
  .art p { padding: 38px 7vw 28px; font-size: 2.3rem; }
  .art i { padding: 22px 7vw; border-left: 0; border-top: 2px solid var(--brass); background: var(--espresso); color: var(--cream); font-size: 1.8rem; }
  .art p { border-left: 12px solid var(--cognac); }
  .art i { border-left: 12px solid var(--oxblood); }
  .hero h1 { font-size: clamp(3.25rem, 10.8vw, 4.75rem); }
}
@media(max-width:520px) {
  .hero > div:first-child { padding: 38px 6vw 32px; }
  .hero h1 { font-size: clamp(2.9rem, 10.8vw, 3.25rem); line-height: .98; }
  .lede { font-size: 1.1rem; }
  .hero .actions { display: grid; gap: 14px; justify-items: stretch; }
  .hero .btn { width: 100%; }
  .hero .social { gap: 18px; }
  .section h2, .closing h2 { font-size: clamp(2.4rem, 10vw, 2.85rem); }
  .books article { padding: 26px; }
  .quote { padding: 44px 7vw; }
  .quote blockquote { font-size: 1.45rem; }
  .manifesto { padding: 30px 7vw; }
  .closing .actions { display: grid; }
  footer .social { line-height: 1.6; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Painterly editorial surfaces. Artwork lives behind, never over, readable copy. */
:root { --brush: url('assets/editorial-brush.png'); --halo: url('assets/portrait-halo.png'); }
body { background-image: repeating-linear-gradient(0deg, transparent 0 3px, rgba(31,23,20,.018) 3px 4px); }
header, .hero h1, .hero .social, .manifesto, .section, .cards article, .books article, .closing, footer { position: relative; isolation: isolate; }
header { border: 0; }
.brand:after { display: none; }
header:after, .hero .social:after, .section:after, footer:before {
  content: ''; position: absolute; pointer-events: none; height: 7px; left: 5%; right: 5%; bottom: 0;
  background: var(--brass); mask: var(--brush) center / 100% 100% no-repeat;
}
.hero h1:after { content: ''; position: absolute; z-index: -1; inset: 60% 12% 2% 0; background: var(--teal); opacity: .1; mask: var(--brush) center / 100% 100% no-repeat; transform: rotate(-2deg); }
.hero .social { border: 0; padding-bottom: 26px; }
.hero .social:after { left: 0; right: 0; height: 5px; background: var(--espresso); }
.art { background: transparent; border: 0; padding: 34px 2vw; isolation: isolate; }
.art:before { content: ''; position: absolute; z-index: -1; inset: 0; background: var(--brush) center / 125% 140% no-repeat; }
.art p { border: 0; padding: 42px 7vw; }
.art i { background: none; border: 0; color: var(--cream); padding: 42px 7vw; align-items: center; }
.manifesto { border: 0; padding-block: 44px; }
.manifesto:before { content: ''; position: absolute; z-index: -1; left: 15%; right: 15%; top: 40%; height: 30%; background: var(--brass); mask: var(--brush) center / 100% 100% no-repeat; opacity: .16; }
.section { border: 0; background-color: transparent; }
.section:after { height: 5px; background: var(--espresso); opacity: .55; }
.cards article, .books article { border: 0 !important; box-shadow: none; background: transparent; }
.cards article:before, .books article:before { content: ''; position: absolute; z-index: -1; pointer-events: none; inset: -8px -10px; }
.cards .winebg:before, .books .tealbg:before { background: var(--teal); mask: var(--brush) center / 125% 165% no-repeat; }
.cards .winebg { padding-left: clamp(32px,4vw,48px); }
.cards .tealbg:before { inset: -8px -10px; height: auto; background: var(--oxblood); mask: var(--brush) center / 125% 165% no-repeat; }
.cards .tealbg:after { content: ''; position: absolute; z-index: -1; right: 8%; left: 25%; bottom: 0; height: 9px; background: var(--brass); mask: var(--brush) center / 100% 100% no-repeat; opacity: .7; }
.cards .cognacbg:before { background: linear-gradient(135deg,rgba(185,120,74,.9),rgba(185,120,74,.55)); mask: var(--brush) center / 115% 130% no-repeat; }
.cards small { border: 0; }
.cards .winebg small { color: var(--cream); }
.books article:first-child:before { inset: 0 auto 0 -3px; width: 9px; background: var(--oxblood); mask: var(--brush) center / 100% 100% no-repeat; }
.books article:first-child h3 { text-decoration: underline; text-decoration-color: var(--teal); text-decoration-thickness: 2px; text-underline-offset: .18em; }
.books .tealbg { padding: 38px; box-shadow: none; background: transparent; }
.quote { position: relative; isolation: isolate; background: transparent; border: 0; padding-block: clamp(4rem,6vw,6rem); }
.quote:after { content: ''; position: absolute; z-index: -1; inset: 0; background: var(--brush) center / 135% 165% no-repeat; }
.quote cite { border: 0; }
.quote cite:before { content: ''; display: block; width: 110px; height: 6px; background: var(--brass); mask: var(--brush) center / 100% 100% no-repeat; margin-bottom: 18px; }
.table .kicker { position: relative; isolation: isolate; display: inline-block; }
.table .kicker:before { content: ''; position: absolute; z-index: -1; inset: -6px -15px; background: var(--brass); opacity: .32; mask: var(--brush) center / 100% 100% no-repeat; }
.about > div:first-child:before { inset: -9% -6% 8%; background: var(--halo) center / 100% 100% no-repeat; border: 0; box-shadow: none; }
.portrait { border: 0; box-shadow: none; background: transparent; padding: 12px; }
.note { color: var(--espresso); }
.closing { border: 0; background: var(--teal); }
.closing:before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--brush) center / 100% 100% no-repeat; opacity: .3; }
.closing h2 { position: relative; isolation: isolate; }
.closing h2:after { content: ''; position: absolute; z-index: -1; height: 8px; width: 150px; bottom: -12px; left: calc(50% - 75px); background: var(--oxblood); mask: var(--brush) center / 100% 100% no-repeat; }
footer { border: 0; }
footer:before { top: 0; bottom: auto; height: 9px; }
@media(max-width:850px) {
  .art { padding: 32px 0; }
  .art p { padding: 30px 9vw 12px; }
  .art i { padding: 22px 9vw 30px; }
  .cards { gap: 34px; }
  .cards article { padding: 34px; }
  .about > div:first-child:before { inset: -6% -4% 8%; }
}
@media(max-width:520px) {
  .hero h1:after { opacity: .07; }
  .manifesto:before { opacity: .11; }
  .books .tealbg { padding: 32px; }
  .quote { padding: 58px 9vw; }
}
.books .tealbg:before { background: var(--ms-ink-900); }
.cards .tealbg { color: var(--text-inverse); background: transparent; }
.cards .tealbg:after { background: var(--paint-gold); bottom: 8px; height: 7px; }
.cards .winebg:after { content: ''; position: absolute; z-index: -1; pointer-events:none; top: -9px; left: 8%; width: 68%; height: 15px; background: var(--paint-gold); mask: var(--brush) center / 100% 100% no-repeat; transform:rotate(-3deg); }
.cards .cognacbg:before { background: linear-gradient(125deg,var(--ms-ochre-500),var(--ms-cream-300)); }
.cards .cognacbg:after { content:''; position:absolute; z-index:-1; bottom:0; right:0; width:50%; height:16px; background:var(--paint-oxblood); mask:var(--brush) center / 100% 100% no-repeat; }
.hero h1:after { background:var(--paint-gold); opacity:.22; }
.hero .wine { background:var(--bg-panel-accent); border-color:var(--bg-panel-accent); }
.hero .social:after { height:12px; background:var(--paint-oxblood); }
.hero > div:first-child { position:relative; isolation:isolate; }
.hero > div:first-child:after { content:''; position:absolute; z-index:-1; right:4%; top:20%; width:22%; height:40%; background:var(--halo) center/contain no-repeat; opacity:.08; mask:linear-gradient(90deg,transparent,#000); }
.art { overflow:hidden; }
.art:before { background-image:url('assets/mixed-media-sweep.png'); }
.manifesto:before { background:var(--paint-gold); opacity:.22; }
.manifesto:after { content:''; position:absolute; z-index:-1; bottom:12px; right:10%; width:22%; height:10px; background:var(--paint-red-ink); mask:var(--brush) center/100% 100% no-repeat; }
.writing:after { background:var(--paint-oxblood); opacity:1; height:10px; }
.books article:first-child:before { width:14px; }
.quote:after { background-image:url('assets/mixed-media-sweep.png'); }
.quote:before { color:var(--paint-gold); }
.table .kicker:before { background:var(--paint-gold); opacity:.45; }
.table:after { background:var(--paint-red-ink); height:8px; opacity:.9; }
.portrait { transform:none; padding:12px; }
.portrait img { position:relative; z-index:1; }
.about > div:first-child:before { inset:-4% -5% 10%; }
.note { position:relative; isolation:isolate; margin-top:16px; padding:8px 16px; color:var(--text-inverse); }
.note:before { content:''; position:absolute; z-index:-1; inset:-8px -18px; background:var(--paint-oxblood); mask:var(--brush) center/120% 145% no-repeat; }
.closing { background:var(--ms-ink-900); }
.closing:before { background-image:url('assets/mixed-media-sweep.png'); background-size:120% 150%; opacity:.8; }
.closing h2:after { background:var(--paint-gold); }
footer { background:var(--ms-teal-900); color:var(--text-inverse); }
footer:before { height:12px; background:var(--paint-gold); }
@media(max-width:640px) {
 .hero > div:first-child:after { display:none; }
 .hero h1:after { opacity:.17; }
 .cards .winebg:after { height:10px; }
 .note { margin-left:12%; }
}

.book-buy { display: inline-block; margin-top: 18px; }

/* Final content revision */
.paint-panel-title {
  color: #F5EBDD;
  text-shadow: 0 2px 3px rgba(30,20,17,.75), 0 0 1px rgba(30,20,17,.9);
}
.paint-panel-tagline {
  color: #FFF7E8;
  text-shadow: 0 2px 4px rgba(15,74,78,.9), 0 0 2px rgba(30,20,17,.75);
}
.two-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
.inverse { color: var(--cream) !important; }
.table { max-width: 1200px; margin: 0 auto; }
.table h2 { max-width: 980px; }
.table-copy { max-width: 860px; margin-left: auto; }
.table-signoff, .about-signoff { font-size: 1.25rem; }
.table-signoff { color: var(--teal); font-weight: 700; }
.memoir-pill { margin-top: 8px; background: var(--cognac); border-color: var(--cognac); color: var(--espresso); }
.about > div:last-child { max-width: 900px; }
@media(max-width:850px) {
  .two-cards { grid-template-columns: 1fr; }
  .table-copy { margin-left: 0; }
}

/* v5 richer mixed-media panels + resilient typography */
.cards .winebg:before {
  background:
    linear-gradient(115deg, rgba(15,74,78,.94) 0 58%, rgba(20,92,97,.88) 58% 72%, rgba(106,31,44,.88) 72% 83%, rgba(31,23,20,.92) 83% 100%),
    url('assets/mixed-media-sweep.png') center / 145% 180% no-repeat;
  mask: var(--brush) center / 125% 165% no-repeat;
}
.cards .winebg:after {
  background: linear-gradient(90deg,var(--paint-gold),var(--paint-oxblood),var(--paint-gold));
  height: 14px; opacity:.95;
}
.cards .tealbg:before {
  background:
    linear-gradient(125deg, rgba(106,31,44,.96) 0 58%, rgba(141,34,53,.9) 58% 72%, rgba(31,23,20,.92) 72% 86%, rgba(15,74,78,.82) 86% 100%),
    url('assets/mixed-media-sweep.png') center / 145% 180% no-repeat;
  mask: var(--brush) center / 125% 165% no-repeat;
}
.cards .tealbg:after {
  background: linear-gradient(90deg,var(--paint-gold),var(--paint-teal-bright),var(--paint-gold));
  height: 11px; opacity:.95;
}
.books .tealbg:before {
  background:
    linear-gradient(120deg, rgba(23,19,17,.97) 0 58%, rgba(31,23,20,.96) 58% 72%, rgba(106,31,44,.86) 72% 84%, rgba(15,74,78,.78) 84% 100%),
    url('assets/mixed-media-sweep.png') center / 150% 185% no-repeat;
  mask: var(--brush) center / 125% 165% no-repeat;
}
/* Cream/gold dry-brush interruptions without sacrificing the dominant panel color. */
.cards .winebg, .cards .tealbg, .books .tealbg { overflow:hidden; }
.cards .winebg > *, .cards .tealbg > *, .books .tealbg > * { position:relative; z-index:2; }

/* Editorial ink separation for all type placed directly over paint. */
.cards .winebg h3, .cards .tealbg h3, .books .tealbg h3 {
  text-shadow: 0 2px 3px rgba(23,19,17,.88), 0 0 1px rgba(23,19,17,1);
}
.cards .winebg p, .cards .tealbg p, .books .tealbg p,
.books .tealbg em, .books .tealbg strong {
  text-shadow: 0 1px 2px rgba(23,19,17,.9), 0 0 1px rgba(23,19,17,.95);
}
.cards .winebg small, .cards .tealbg small, .books .tealbg small {
  color:#FFF7E8;
  text-shadow: 0 2px 3px rgba(23,19,17,.98), 0 0 2px rgba(23,19,17,1);
  -webkit-text-stroke:.25px rgba(23,19,17,.78);
}
.quote blockquote, .quote cite {
  text-shadow: 0 2px 4px rgba(23,19,17,.92), 0 0 2px rgba(23,19,17,.98);
}
.quote cite { -webkit-text-stroke:.2px rgba(23,19,17,.72); }

@media(max-width:520px) {
  .cards .winebg h3, .cards .tealbg h3, .books .tealbg h3 {
    text-shadow: 0 2px 3px rgba(23,19,17,.95), 0 0 2px rgba(23,19,17,1);
  }
  .cards .winebg small, .cards .tealbg small, .books .tealbg small {
    -webkit-text-stroke:.35px rgba(23,19,17,.88);
  }
}


/* v6: high resolution, fluid mixed media panels */
.cards .winebg:before,
.cards .tealbg:before,
.books .tealbg:before {
  inset: 0;
  mask: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transform: none;
}
.cards .winebg:before { background-image:url('assets/paint-kitchen-v6.jpg'); }
.cards .tealbg:before { background-image:url('assets/paint-writing-v6.jpg'); }
.books .tealbg:before { background-image:url('assets/paint-memoir-v6.jpg'); }

/* Remove the repetitive lower corner bars from the prior pass. */
.cards .winebg:after,
.cards .tealbg:after,
.books .tealbg:after { content:none !important; display:none !important; }

/* Let the paint do the composition instead of stretching the card. */
.cards .winebg,
.cards .tealbg,
.books .tealbg {
  min-height:0;
  height:auto;
  overflow:hidden;
}

/* Fine ink edge for readability over changing paint, without a heavy digital glow. */
.cards .winebg h3, .cards .tealbg h3, .books .tealbg h3,
.cards .winebg p, .cards .tealbg p, .books .tealbg p,
.cards .winebg small, .cards .tealbg small, .books .tealbg small,
.cards .winebg .kicker, .cards .tealbg .kicker {
  color:#FFF7E8;
  text-shadow:
    -1px -1px 0 rgba(23,19,17,.58),
     1px -1px 0 rgba(23,19,17,.58),
    -1px  1px 0 rgba(23,19,17,.58),
     1px  1px 0 rgba(23,19,17,.58),
     0 2px 4px rgba(23,19,17,.72);
}
.cards .winebg small, .cards .tealbg small, .books .tealbg small { -webkit-text-stroke:.2px rgba(23,19,17,.55); }

@media(max-width:850px){
  .cards .winebg:before,.cards .tealbg:before,.books .tealbg:before{background-position:center top;}
  .cards article,.books .tealbg{padding:30px 28px;}
}