/* fable.css: small additions only. The site design lives in site.css and is not overridden here. */

/* self-hosted type: same families, same weight ranges as before, served from this domain */
@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 800;font-display:swap;src:url(/assets/fonts/bodoni-moda.woff2) format("woff2")}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:400 700;font-display:swap;src:url(/assets/fonts/bodoni-moda-italic.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 800;font-display:swap;src:url(/assets/fonts/inter.woff2) format("woff2")}
@font-face{font-family:"Mrs Saint Delafield";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/signature.woff2) format("woff2")}

/* portrait caption: the name sits on the photograph instead of a bar across it */
html[data-theme] .letter-art.portrait-art figcaption{left:0;right:0;bottom:0;padding:88px 24px 22px;border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(180deg,rgba(9,11,18,0),rgba(9,11,18,.5) 46%,rgba(9,11,18,.86));color:#FFFDF8;text-transform:none;letter-spacing:0;font:400 16px/1.2 var(--font);display:flex;flex-direction:column;gap:9px;pointer-events:none}
html[data-theme] .letter-art.portrait-art figcaption b{font:500 clamp(28px,2.5vw,36px)/1 var(--serif);letter-spacing:-.02em;color:#FFFDF8;text-transform:none}
html[data-theme] .letter-art.portrait-art figcaption span{display:flex;align-items:center;gap:10px;font:700 11px/1 var(--font);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,253,248,.9)}
html[data-theme] .letter-art.portrait-art figcaption span::before{content:"";width:26px;height:2px;background:var(--red,#D71F27);flex:none}

/* email desks: an address never breaks in the middle of a word */
@media (min-width:641px){
  html[data-theme] .v58-m{flex-wrap:wrap;gap:8px}
  html[data-theme] .v58-m a{overflow-wrap:normal;word-break:normal;white-space:nowrap;font-size:13.5px;letter-spacing:-.01em}
}

/* WhatsApp: two quick choices before the chat opens (the button itself is unchanged) */
.fwa{position:fixed;right:18px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:901;width:min(380px,calc(100vw - 24px));max-height:min(640px,calc(100svh - 104px));overflow:auto;background:#FFFDF8;color:#141414;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(20,20,20,.1),0 40px 80px -30px rgba(40,28,16,.55);padding:20px 20px 0;opacity:0;transform:translateY(12px) scale(.985);transform-origin:100% 100%;pointer-events:none;visibility:hidden;transition:opacity .28s cubic-bezier(.16,1,.3,1),transform .4s cubic-bezier(.16,1,.3,1),visibility 0s .4s}
.fwa.in{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition-delay:0s}
.fwa-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;background:none;border-radius:50%;cursor:pointer;color:#6B625A;font-size:20px;line-height:1}
.fwa-x:hover{background:rgba(20,20,20,.06);color:#141414}
.fwa-k{font:650 12px/1 var(--font);color:#6B625A;display:flex;align-items:center;gap:8px;margin:0 0 12px}
.fwa-k i{width:7px;height:7px;border-radius:50%;background:#1F8F4E;flex:none}
.fwa h2{font:500 22px/1.12 var(--serif);letter-spacing:-.02em;margin:0 30px 4px 0;color:#141414}
.fwa p{font-size:13.5px;line-height:1.45;color:#3B3631;margin:0}
.fwa fieldset{border:0;padding:0;margin:13px 0 0;min-width:0}
.fwa legend{font:650 12.5px/1.3 var(--font);padding:0;margin:0 0 7px;color:#141414}
.fwa-o{display:flex;flex-wrap:wrap;gap:6px}
.fwa-o label{position:relative;cursor:pointer}
.fwa-o input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.fwa-o span{display:block;font:500 12.75px/1.2 var(--font);padding:7px 11px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(20,20,20,.2);transition:background-color .2s,color .2s,box-shadow .2s}
.fwa-o label:hover span{box-shadow:inset 0 0 0 1px #141414}
.fwa-o input:checked+span{background:var(--red,#D71F27);color:#fff;box-shadow:none}
.fwa-o input:focus-visible+span{outline:2px solid var(--red,#D71F27);outline-offset:2px}
.fwa-f{position:sticky;bottom:0;background:linear-gradient(rgba(255,253,248,0),#FFFDF8 14px);padding:16px 0 14px;margin-top:2px}
.fwa-go{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:48px;border-radius:999px;background:var(--red,#D71F27);color:#fff;font:650 15px/1 var(--font);text-decoration:none;transition:background-color .25s,transform .25s}
.fwa-go:hover{background:#B3161D;color:#fff}
.fwa-go:active{transform:scale(.98)}
.fwa-go svg{width:19px;height:19px;fill:currentColor;flex:none}
.fwa-n{font-size:12px!important;color:#6B625A!important;margin-top:9px!important;text-align:center}
.fwa-n a{color:#141414;font-weight:600}
@media (max-width:560px){.fwa{right:12px;left:12px;width:auto;bottom:calc(78px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.fwa{transition:none}}

/* ---------- hero journey: nothing sits on top of anything else ---------- */
/* desktop: the chapter counter and progress ruler stop short of the WhatsApp button */
@media (min-width:861px){
  .pl-frame .hf-bl,.pl-frame .hf-ticks{right:max(24px,calc(178px - var(--gutter)))}
}
/* phones */
@media (max-width:860px){
  .pl-frame .hf-ticks{left:0;right:auto;transform:none;gap:4px}
  html[data-theme] .jp-hero .h1 .ln{white-space:nowrap}
}
@media (max-width:379px){html[data-theme] .jp-hero .h1{font-size:10.2vw}}
/* phones, fold phones and small tablets: the plate is capped by screen height as well as width, so every panel and CTA fits above the fold
   (iPhone Duo outer 466x678 and inner 626x890, Galaxy Fold 344 and 690 wide, Surface Duo 540x720, Pixel Fold 841x701, with or without browser bars) */
@media (max-width:860px){
  .plate{width:min(100vw,58vh)}
  .pl-arch{width:min(74vw,50vh)}
  .pl-words{padding-top:calc(62px + min(30vw,20vh))}
  html[data-theme] .jp-side{top:calc(92px + min(64vw,37vh))}
  html[data-theme] .jp-hero,html[data-theme] .jp-outro{top:calc(90px + min(50vw,34vh))}
}
@media (max-width:860px) and (max-height:800px){
  html[data-theme] .jp-hero .hero-proof{display:none}
}
@media (max-width:860px) and (max-height:760px){
  .plate{width:min(84vw,58vh)}
  .pl-arch{width:min(64vw,50vh)}
  .pl-hud text{font-size:34px}
  .pl-frame .hf-ticks{display:none}
  html[data-theme] .jp-side{top:calc(92px + min(56vw,38vh));bottom:12px}
  html[data-theme] .jp-hero,html[data-theme] .jp-outro{top:calc(88px + min(43vw,34vh));bottom:12px}
  html[data-theme] .jp-side h2{font-size:clamp(24px,6.5vw,30px);margin-bottom:8px}
  html[data-theme] .jp-side p{font-size:14px;line-height:1.46}
}
@media (max-width:860px) and (max-height:640px){
  .plate{width:min(70vw,56vh)}
  .pl-arch{width:min(56vw,48vh)}
  .pl-hud text{font-size:40px}
  .pl-words{padding-top:calc(56px + min(18vw,16vh))}
  html[data-theme] .jp-side{top:calc(90px + min(47vw,37vh))}
  html[data-theme] .jp-hero,html[data-theme] .jp-outro{top:calc(84px + min(37vw,33vh))}
  html[data-theme] .jp-side p{font-size:13.5px;line-height:1.42}
}
@media (max-width:860px) and (max-height:580px){
  .pl-arch{width:min(46vw,44vh)}
  .pl-words{padding-top:calc(48px + min(10vw,10vh))}
  html[data-theme] .jp-side p{font-size:13px;line-height:1.4}
  html[data-theme] .jp-hero,html[data-theme] .jp-outro{top:calc(82px + min(30vw,30vh))}
  html[data-theme] .jp-outro .h1{font-size:min(7.4vw,30px)}
  html[data-theme] .jp-outro .law{font-size:15px;margin-top:10px}
  html[data-theme] .jp-outro .cta{margin-top:14px}
}
/* wide fold screens in landscape use the desktop layout in a narrow frame: the small sub-labels would touch the text column */
@media (min-width:861px) and (max-width:1100px){.pl-hud .hl-sub{display:none}}
/* the WhatsApp button steps aside whenever a journey panel needs that corner */
.wa-fab{transition:opacity .25s,transform .25s,background-color .2s}
.wa-fab.af-yield{opacity:0;pointer-events:none;transform:translateY(10px)}

/* footer: social row, same hairline circles as the site's outline buttons */
.ft-social{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.ft-social a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#141414;box-shadow:inset 0 0 0 1px rgba(20,20,20,.22);transition:color .2s,box-shadow .2s,transform .2s}
.ft-social svg{width:16px;height:16px;fill:currentColor}
.ft-social a:hover{color:var(--red,#D71F27);box-shadow:inset 0 0 0 1px var(--red,#D71F27);transform:translateY(-1px)}
@media (max-width:640px){.ft-social a{width:44px;height:44px}.ft-social svg{width:18px;height:18px}}

/* home: publications strip (books, magazine, show), built from the site's own card */
.pubs-sec{padding-block:clamp(48px,5vw,76px)!important}
.pubs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:28px}
.pubs .pub{display:flex;flex-direction:column;gap:16px;text-decoration:none;color:inherit;padding:18px}
.pubs .pub img,.pubs .pub-num{width:auto;height:128px;align-self:flex-start;max-width:none;border-radius:8px;box-shadow:0 10px 24px -12px rgba(40,28,16,.45),inset 0 0 0 1px rgba(20,20,20,.08);flex:none}
.pubs .pub-num{width:96px;display:grid;place-items:center;background:#F3EBDD;font:600 26px/1 var(--serif);letter-spacing:-.02em;color:var(--red,#D71F27)}
.pubs .pub h3{font:500 clamp(19px,1.5vw,22px)/1.15 var(--serif);letter-spacing:-.015em;margin:6px 0 8px;color:#141414}
.pubs .pub p{margin:0;font-size:14px;line-height:1.5}
.pubs .pub .meta{margin:0}
.pubs-more{display:flex;flex-wrap:wrap;gap:10px 28px;margin:26px 0 0}
@media (max-width:1100px){.pubs{grid-template-columns:repeat(2,minmax(0,1fr))}.pubs .pub{flex-direction:row;align-items:flex-start}}
@media (max-width:560px){.pubs{grid-template-columns:1fr;gap:12px}.pubs .pub img,.pubs .pub-num{height:100px}.pubs .pub-num{width:75px;font-size:21px}}

/* partner features: the statement shown in full */
.ft-quote{max-width:820px;margin:28px 0 0}
html[data-theme] .ft-quote .pull{font:500 clamp(22px,2.1vw,30px)/1.18 var(--serif);letter-spacing:-.015em;color:#141414}
.ft-quote p:not(.pull){margin:14px 0 0}

/* on-site chat (GHL), offered inside the WhatsApp card; once it is open the WhatsApp button sits above the chat bubble */
.fwa-chat{display:block;width:100%;margin-top:8px;min-height:44px;border-radius:999px;border:0;background:none;box-shadow:inset 0 0 0 1.5px #141414;color:#141414;font:650 14px/1 var(--font);cursor:pointer;transition:background-color .2s}
.fwa-chat:hover{background:rgba(20,20,20,.05)}
html.af-chat .wa-fab{bottom:calc(96px + env(safe-area-inset-bottom,0px))}
html.af-chat .fwa{bottom:calc(160px + env(safe-area-inset-bottom,0px))}

.pubs-sec .nw{white-space:nowrap}

/* home: In the news (links out to posts on other websites) */
.news-sec{padding-block:0 clamp(48px,5vw,76px)!important}
.news-grid{margin-top:28px}
.news-grid .news-card{padding:0;overflow:hidden;display:flex;flex-direction:column}
.news-card>img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:0}
.news-card .nb{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.news-card .nb .foot{margin-top:auto}