@font-face{font-family:"Inter";src:url(/fonts/Inter-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF}
@font-face{font-family:"Inter";src:url(/fonts/Inter-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF}
@font-face{font-family:"Inter";src:url(/fonts/Inter-SemiBold.woff) format("woff");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Inter Display";src:url(/fonts/InterDisplay-ExtraBold.woff) format("woff");font-weight:800;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Inter Display";src:url(/fonts/InterDisplay-Black.woff) format("woff");font-weight:900;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
/* Design system, Oct 29: the same Inter release for Latin Extended (Polish, Czech, Slovak, Croatian, Hungarian, Romanian,
   Turkish), Vietnamese, Greek and Cyrillic, cut by tools/make_font_ext.py; a page downloads a file only if it uses one of
   its characters, so the English pages load nothing new */
@font-face{font-family:"Inter";src:url(/fonts/Inter-Regular-ext.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+0259,U+0300-036F,U+0370-03FF,U+0400-04FF,U+1E00-1EFF,U+20AB,U+2116}
@font-face{font-family:"Inter";src:url(/fonts/Inter-Italic-ext.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0100-024F,U+0259,U+0300-036F,U+0370-03FF,U+0400-04FF,U+1E00-1EFF,U+20AB,U+2116}
@font-face{font-family:"Inter";src:url(/fonts/Inter-SemiBold-ext.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0100-024F,U+0259,U+02BB-02BC,U+0300-036F,U+0370-03FF,U+0400-04FF,U+1E00-1EFF,U+20AB,U+2116}
@font-face{font-family:"Inter Display";src:url(/fonts/InterDisplay-ExtraBold-ext.woff2) format("woff2");font-weight:800;font-display:swap;unicode-range:U+0100-024F,U+0259,U+02BB-02BC,U+0300-036F,U+0370-03FF,U+0400-04FF,U+1E00-1EFF,U+20AB,U+2116}
@font-face{font-family:"Inter Display";src:url(/fonts/InterDisplay-Black-ext.woff2) format("woff2");font-weight:900;font-display:swap;unicode-range:U+0100-024F,U+0259,U+02BB-02BC,U+0300-036F,U+0370-03FF,U+0400-04FF,U+1E00-1EFF,U+20AB,U+2116}
:root{--navy:#14233B;--coral:#E8805F;--coral-d:#A4442A;--cream:#F4EDE1;--sky:#BFE3F2;--butter:#FFE7A3;--sage:#CFE8D5;--r:20px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:17px/1.65 "Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--navy);background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--coral-d);overflow-wrap:anywhere}a:hover{color:var(--navy)}
:focus-visible{outline:3px solid var(--navy);outline-offset:3px;border-radius:4px}
.skip{position:absolute;inset-inline-start:-999px;top:0;background:var(--navy);color:#fff;padding:.6em 1em;z-index:10}.skip:focus{inset-inline-start:1em}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}.narrow{max-width:740px}.center{text-align:center}
h1,h2,h3,.h3{line-height:1.12;font-weight:800;letter-spacing:-.015em;font-family:"Inter Display","Inter",system-ui,sans-serif}
h1{font-weight:900}
h3,.h3,#nav a,.btn,.brand,.kicker,.menu{font-family:"Inter",system-ui,sans-serif;font-weight:600}
h1{font-size:clamp(2.2rem,5vw,3.8rem);margin:.2em 0 .4em}h2{font-size:clamp(1.7rem,3.4vw,2.5rem);margin:0 0 .8em}h3,.h3{font-size:1.25rem;margin:0 0 .4em}
.lead{font-size:1.2rem}.kicker{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:700;margin:0}.kicker a{color:inherit}
section,article{padding:72px 0}.cream{background:var(--cream)}.sky{background:var(--sky)}.butter{background:var(--butter)}.sage{background:var(--sage)}.white{background:#fff}
.coral{background:var(--coral);color:var(--navy)}
.top{background:#fff;border-bottom:1px solid #e9e2d6;position:sticky;top:0;z-index:5}
.bar{display:flex;align-items:center;justify-content:space-between;min-height:68px;gap:16px}
.brand{font-weight:800;font-size:1.25rem;color:var(--navy);text-decoration:none}
#nav{display:flex;gap:22px;align-items:center}#nav a{color:var(--navy);text-decoration:none;font-weight:600}#nav a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:3px;text-decoration-color:var(--coral)}
#nav a.btn{color:#fff}
.menu{display:none;background:none;border:2px solid var(--navy);border-radius:999px;padding:.35em 1em;font:inherit;font-weight:700;color:var(--navy);min-height:44px}
.btn{display:inline-block;background:var(--coral-d);color:#fff;font-weight:800;text-decoration:none;border-radius:999px;padding:.8em 1.6em;min-height:44px;transition:transform .15s,background .15s}
.btn:hover{background:var(--navy);color:#fff;transform:translateY(-1px)}.btn.big{font-size:1.15rem;padding:.9em 2em}.btn.small{padding:.5em 1.1em;font-size:.95rem}
.btn.light{background:#fff;color:var(--navy)}.btn.light:hover{background:var(--navy);color:#fff}
.link{font-weight:700;white-space:nowrap}.hero .link{margin-inline-start:16px;display:inline-block;padding:.8em 0}.linkcard .link{margin:0}
.two{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center}
.cov img{width:min(360px,100%);margin:0 auto;border-radius:6px;box-shadow:0 24px 48px rgba(20,35,59,.28)}
.mock img{width:min(540px,100%);border-radius:0;box-shadow:none}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;padding:0;list-style:none}.facts li{background:#fff;border:1px solid #e9e2d6;border-radius:999px;padding:.45em .95em;font-size:.9rem;font-weight:600;color:var(--navy)}
.hero{padding:56px 0 40px}.hero h1{margin-top:.15em}
.fmt td.price,.fmt th:last-child,.fmt td:first-child{white-space:nowrap}.rowbuy{font-weight:700}.fmt td.price{font-weight:700}.fmt{max-width:720px}
.grid2,.grid3,.grid4{display:grid;gap:24px}.grid2{grid-template-columns:repeat(2,1fr)}.grid3{grid-template-columns:repeat(3,1fr)}.grid4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border-radius:var(--r);padding:28px;box-shadow:0 2px 0 rgba(20,35,59,.06)}.card p{margin:0}
.linkcard{display:block;color:var(--navy);text-decoration:none;transition:transform .15s,box-shadow .15s}.linkcard:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,35,59,.12)}.linkcard p{margin:0 0 12px}
.buy{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.center .buy{justify-content:center}.soon{font-weight:700;font-size:1.1rem}
.fmt{border-collapse:collapse;width:100%;max-width:640px}.fmt th,.fmt td{text-align:start;padding:10px 12px;border-bottom:1px solid #e3dccf}
.ticks{padding-inline-start:1.2em}.ticks li{margin:.4em 0}
article p,article li{max-width:68ch}.byline{color:#4a5568;font-size:.95rem}
.cta{background:var(--cream);border-radius:var(--r);padding:24px 28px;margin:40px 0}
.fine{font-size:.85rem;color:#4a5568}
.foot{background:var(--navy);color:#fff;padding:56px 0 32px}.foot a{color:#fff}.foot .brand{color:#fff}.foot .fine{color:#d5dbe5;border-top:1px solid #33435e;padding-top:20px;margin-top:20px}
.cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
@media (max-width:900px){.grid3,.grid4{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.menu{display:block}#nav{display:none;position:absolute;left:0;right:0;top:68px;background:#fff;flex-direction:column;align-items:flex-start;padding:16px 24px 24px;border-bottom:1px solid #e9e2d6}#nav.open{display:flex}
.two,.grid2,.grid3,.grid4,.cols{grid-template-columns:1fr}.two .cov{order:-1}section,article{padding:48px 0}.cov img{width:220px}.mock img{width:min(360px,100%)}.hero{padding:24px 0 40px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Long unbreakable tokens (email addresses, URLs) in body text wrap instead of overflowing on narrow phones; links already do. */
p,li,td,dd,.fine{overflow-wrap:anywhere}

/* Design pass, Oct 15: announcement bar, price line, format cards with the 3D mockups, pull quotes, sticky buy bar on phones */
.announce{background:var(--navy);color:#fff;font-weight:600;font-size:.95rem;text-align:center}.announce a{color:#fff;display:block;padding:.55em 0;text-decoration:none}.announce a:hover{text-decoration:underline}
.prices{font-weight:700;margin:14px 0 0;font-size:1rem}.coral .prices{margin:0 0 6px}
.formats .card{text-align:center;padding:24px 20px}.formats img{height:250px;width:auto;max-width:90%;object-fit:contain;margin:0 auto 14px}.formats .price{font-size:1.5rem;font-weight:800;margin:0 0 4px}.formats .fine{min-height:3.2em}.formats .btn{margin-top:10px}.soon.small{display:inline-block;font-size:.95rem;margin-top:14px;color:#4a5568}
.quotes .quote{margin:0;background:#fff;border-radius:var(--r);padding:28px}.quote blockquote{margin:0 0 12px;font-size:1.1rem;line-height:1.5;font-weight:600;quotes:"“" "”"}.quote blockquote::before{content:open-quote}.quote blockquote::after{content:close-quote}.quote figcaption{color:#4a5568;font-size:.9rem}
.langs{border-top:1px solid #33435e;margin-top:28px;padding-top:20px}.langs ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px 18px}.langs a{color:#d5dbe5;text-decoration:none;font-size:.95rem}.langs a:hover,.langs a[aria-current]{color:#fff;text-decoration:underline}
.translated{background:var(--butter);margin:0;padding:.6em 24px;text-align:center}.translated a{font-weight:700}
.stickybuy{display:none}
@media (max-width:760px){.stickybuy{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:6;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-top:1px solid #e9e2d6;padding:10px 16px;box-shadow:0 -6px 20px rgba(20,35,59,.12)}.stickybuy.hide{display:none}.stickybuy span{font-size:.95rem}body{padding-bottom:72px}.quotes .grid3{grid-template-columns:1fr}}
/* Scripts Inter does not cover: the reader's system fonts carry them. Since Oct 29 the stacks are the custom properties
   --ff-text and --ff-display, which put Inter first, so Latin words, prices and numbers on these pages stay in the brand's
   type while every other character falls through to the script's own font */
:lang(ar){--ff-text:"Inter","Noto Naskh Arabic","Segoe UI",Tahoma,system-ui,sans-serif;line-height:1.9}
:lang(ur){--ff-text:"Inter","Noto Nastaliq Urdu","Jameel Noori Nastaleeq","Noto Naskh Arabic",Tahoma,system-ui,sans-serif;line-height:2.1}
:lang(he){--ff-text:"Inter","Noto Sans Hebrew",Arial,"Segoe UI",system-ui,sans-serif;}
:lang(hi){--ff-text:"Inter","Noto Sans Devanagari","Nirmala UI",Mangal,system-ui,sans-serif;line-height:1.8}
:lang(th){--ff-text:"Inter","Noto Sans Thai","Leelawadee UI",Tahoma,system-ui,sans-serif;line-height:1.85}
:lang(zh-Hans){--ff-text:"Inter","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC",system-ui,sans-serif;}
:lang(ko){--ff-text:"Inter","Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR","Noto Sans CJK KR",system-ui,sans-serif;word-break:keep-all}
:lang(ja){--ff-text:"Inter","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,"Noto Sans JP","Noto Sans CJK JP",system-ui,sans-serif;}
:is(:lang(ar),:lang(ur),:lang(he),:lang(hi),:lang(th),:lang(zh-Hans),:lang(ko),:lang(ja)){--ff-display:"Inter Display",var(--ff-text)}
/* the page font is set once on body and inherited; an element that carries its own lang (the language menu's entries)
   takes its script's stack itself */
body:is(:lang(ar),:lang(ur),:lang(he),:lang(hi),:lang(th),:lang(zh-Hans),:lang(ko),:lang(ja)),[lang]:is(:lang(ar),:lang(ur),:lang(he),:lang(hi),:lang(th),:lang(zh-Hans),:lang(ko),:lang(ja)){font-family:var(--ff-text)}
:lang(ar) h1,:lang(ar) h2,:lang(ar) h3,:lang(ur) h1,:lang(ur) h2,:lang(ur) h3,:lang(he) h1,:lang(he) h2,:lang(he) h3,:lang(hi) h1,:lang(hi) h2,:lang(hi) h3,:lang(th) h1,:lang(th) h2,:lang(th) h3,:lang(zh-Hans) h1,:lang(zh-Hans) h2,:lang(zh-Hans) h3,:lang(ko) h1,:lang(ko) h2,:lang(ko) h3,:lang(ja) h1,:lang(ja) h2,:lang(ja) h3{font-family:var(--ff-display);letter-spacing:0}
[dir="rtl"] .hero .link{margin-inline-start:16px}[dir="rtl"] .kicker{letter-spacing:0}
/* Long compound words (Finnish, Dutch, German, Hungarian) in big headings: hyphenate where the browser knows the language, else break rather than scroll sideways */
h1,h2,h3,.h3{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto}
/* On the narrowest phones a long translated "read more" link wraps instead of pushing the page sideways */
@media (max-width:480px){.link{white-space:normal}}

/* ===== Design system, Oct 29, 2026 (kit/site/DESIGN-SYSTEM-2026-10-29.md) =========================================
   The owner, Oct 29: "make sure our website is as visually stunning as possible, just like https://www.primary.com/".
   One system with the cover concepts of the same day (kit/cover-concepts-2026-10-29/, direction C, "two tones"): the
   decisions file's orange, navy and cream as solid colour blocks, Inter Display Black headlines, and the thin five-colour
   bar of the brand's accents (BRAND.md's workshop palette) as the signature. Flat: no gradients (the bar is drawn with
   hard colour stops, so it renders as five solid bars), no blurred shadows except under the book itself. No dark mode.
   body.v2 = the design approved Oct 16, which every live language uses; this section replaces its Oct 16 and Oct 20
   layers. Every text colour sits on a ground it passes WCAG AA against (tools/check_contrast.py). */
:root{
 --c-orange:#E8805F;--c-navy:#14233B;--c-cream:#F4EDE1;--c-white:#FFFFFF;--c-rust:#A4442A;--c-ink2:#3B4A63;--c-line:#E6DCCB;
 --c-tomato:#EE5A36;--c-sun:#F5B820;--c-grass:#2FA36B;--c-sky:#3D86D8;--c-plum:#8A5CC7;
 --t-tomato:#FDE9E3;--t-sun:#FEF4D8;--t-sky:#E3EEFA;--t-grass:#DFF3E9;--t-plum:#EFE6FA;
 --stripe:linear-gradient(90deg,var(--c-tomato) 0 20%,var(--c-sun) 20% 40%,var(--c-grass) 40% 60%,var(--c-sky) 60% 80%,var(--c-plum) 80% 100%);
 --stripe-h:6px;
 --ff-text:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
 --ff-display:"Inter Display","Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
 --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;
 --gutter:clamp(16px,4vw,32px);--radius:20px;--radius-s:14px;--pill:999px;
 color-scheme:light}
/* ---- base */
body.v2{background:var(--c-white);color:var(--c-navy);font-family:var(--ff-text);font-size:1.0625rem;line-height:1.65}
.v2 .wrap{max-width:1200px;margin-inline:auto;padding-inline:var(--gutter)}
.v2 :where(h1,h2){font-family:var(--ff-display);font-weight:900;letter-spacing:-.025em}
.v2 :where(h3,.h3){font-family:var(--ff-display);font-weight:800;letter-spacing:-.01em;line-height:1.22}
.v2 :where(h1,h2,h3,.h3){text-wrap:balance}
.v2 :where(p,li,dd,summary,figcaption,blockquote){text-wrap:pretty}
.v2 a{color:var(--c-rust)}.v2 a:hover{color:var(--c-navy)}
.v2 :focus-visible{outline:3px solid var(--c-navy);outline-offset:3px;border-radius:6px}
.v2 .announce :focus-visible,.v2 .v-facts :focus-visible,.v2 .v-group :focus-visible,.v2 .v-foot :focus-visible{outline-color:var(--c-sun)}
.v2 .fine{color:var(--c-ink2)}
.v2 #formats,.v2 #pta,.v2 #merch,.v2 #main,.v2 #buy{scroll-margin-top:96px}
.v-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.v2 .skip{background:var(--c-navy);color:var(--c-white);border-radius:0 0 10px 10px}
/* ---- the announcement band: slim, navy, one line */
.v2 .announce{background:var(--c-navy);color:var(--c-cream);font-size:.88rem;font-weight:400;text-align:center}
.v2 .announce .wrap{display:flex;flex-wrap:wrap;gap:.2rem .9rem;align-items:center;justify-content:center;padding-block:.5rem}
.v2 .announce .wrap>span:first-child{text-wrap:balance}
.v2 .announce b{color:var(--c-sun);font-weight:600}
.v2 .announce a{display:inline-block;padding:.2rem 0;color:var(--c-cream);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.v2 .announce a:hover{color:var(--c-white);text-decoration-thickness:2px}
@media (max-width:700px){.v2 .announce .v-sep{display:none}}
/* ---- the top bar, with the five-colour stripe along its bottom edge (it stays with the header while the page scrolls) */
.v-top{position:sticky;top:0;z-index:9;background:var(--c-white);border-bottom:var(--stripe-h) solid var(--c-navy);border-image:var(--stripe) 1}
.v-bar{display:flex;align-items:center;gap:1.25rem;min-height:72px;padding-block:.5rem}
.v-top .brand{display:flex;align-items:center;gap:.6rem;min-height:44px;font-family:var(--ff-display);font-size:1.25rem;font-weight:900;letter-spacing:-.015em;color:var(--c-navy);text-decoration:none;white-space:nowrap}
.v-top .emblem{width:52px;height:auto;flex:none}
.v2 #nav{margin-inline-start:auto;display:flex;gap:1.4rem;flex-wrap:wrap;align-items:center}
.v2 #nav a{color:var(--c-navy);font-family:var(--ff-text);font-weight:600;font-size:.95rem;padding-block:.55rem;text-decoration:none;border-bottom:3px solid transparent}
.v2 #nav a:hover{border-bottom-color:var(--c-orange)}
.v2 #nav a[aria-current]{border-bottom-color:var(--c-navy)}
.v-drawer-only{display:none}
.v-actions{display:flex;align-items:center;gap:.6rem}
.v-actions .btn{white-space:nowrap}
.v2 .v-cart{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:2px solid var(--c-navy);border-radius:var(--pill);color:var(--c-navy)}
.v2 .v-cart:hover{background:var(--c-navy);color:var(--c-white)}
.v2 .menu{display:none;align-items:center;min-height:44px;padding:.45rem 1.15rem;border:2px solid var(--c-navy);border-radius:var(--pill);background:var(--c-white);color:var(--c-navy);font:600 1rem/1.2 var(--ff-text);cursor:pointer}
.v2 .menu[aria-expanded="true"]{background:var(--c-navy);color:var(--c-white)}
@media (max-width:380px){.v-top .brand{font-size:1.05rem}.v-top .emblem{width:40px}}
/* the menu panel: phones and tablets, and wide screens whose translated menu does not fit on one line (build.py adds
   .v-compact after measuring). Same links, same button, same Escape key; only the look changed */
@media (max-width:900px){
 .v-bar{flex-wrap:wrap}.v-actions{margin-inline-start:auto}.v2 .v-actions .btn{display:none}.v2 .menu{display:inline-flex}
 .v2 #nav{display:none;order:3;flex-basis:100%;position:static;margin:0;flex-direction:column;align-items:stretch;gap:0;padding:.25rem 0 1.25rem;background:none;border:0;border-top:2px solid var(--c-navy)}
 .v2 #nav.open{display:flex}
 .v2 #nav a{padding:.8rem 0;border-bottom:1px solid var(--c-line);font-family:var(--ff-display);font-weight:800;font-size:1.2rem;color:var(--c-navy)}
 .v2 #nav a[aria-current]{border-bottom-color:var(--c-line);text-decoration:underline;text-decoration-color:var(--c-orange);text-decoration-thickness:4px;text-underline-offset:7px}
 .v2 #nav .v-drawer-only{display:flex;align-items:center;justify-content:center;min-height:52px;margin-top:1rem;border:0;border-radius:var(--pill);background:var(--c-navy);color:var(--c-white);font-family:var(--ff-text);font-weight:600;font-size:1.05rem}
}
.v-top.v-compact .v-bar{flex-wrap:wrap}
.v-top.v-compact .v-actions{margin-inline-start:auto}
.v-top.v-compact .menu{display:inline-flex}
.v-top.v-compact #nav{display:none;order:3;flex-basis:100%;position:static;margin:0;flex-direction:column;align-items:stretch;gap:0;padding:.25rem 0 1.25rem;border-top:2px solid var(--c-navy)}
.v-top.v-compact #nav.open{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));column-gap:2rem}
.v-top.v-compact #nav a{padding:.8rem 0;border-bottom:1px solid var(--c-line);font-family:var(--ff-display);font-weight:800;font-size:1.2rem;color:var(--c-navy)}
.v-top.v-compact #nav .v-drawer-only{display:flex;align-items:center;justify-content:center;min-height:52px;margin-top:.75rem;border:0;border-radius:var(--pill);background:var(--c-navy);color:var(--c-white);font-family:var(--ff-text);font-weight:600}
/* ---- buttons: one navy pill everywhere (white text 15.8:1), the outlined ghost for the second choice, orange on navy grounds */
.v2 .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.8rem 1.6rem;border:2px solid var(--c-navy);border-radius:var(--pill);background:var(--c-navy);color:var(--c-white);font:600 1rem/1.2 var(--ff-text);text-align:center;text-decoration:none;box-shadow:none;transition:background-color .15s,color .15s,border-color .15s,transform .15s}
.v2 .btn:hover{background:var(--c-orange);border-color:var(--c-navy);color:var(--c-navy);transform:translateY(-2px)}
.v2 .btn.v-ghost{background:transparent;border-color:var(--c-navy);color:var(--c-navy)}
.v2 .btn.v-ghost:hover{background:var(--c-navy);color:var(--c-white)}
.v2 .btn.small{min-height:44px;padding:.55rem 1.15rem;font-size:.95rem}
.v2 .btn.big,.v2 .v-hero .btn{min-height:56px;padding:.95rem 1.9rem;font-size:1.1rem}
.v2 .v-hero .btn:not(.v-ghost):hover,.v2 .cta .btn:not(.v-ghost):hover{background:var(--c-cream);color:var(--c-navy)}
.v2 #buy>.wrap>.buy .btn{min-height:52px;background:transparent;color:var(--c-navy);border-color:var(--c-navy)}
.v2 #buy>.wrap>.buy .btn:hover{background:var(--c-navy);color:var(--c-white)}
@media (max-width:480px){.v2 .v-ctas .btn,.v2 .buy .btn,.v2 .v-group .btn{width:100%}}
/* ---- type */
.v2 .v-eyebrow{font:600 .8rem/1.3 var(--ff-text);letter-spacing:.12em;text-transform:uppercase;color:var(--c-rust);margin:0}
.v-lede{font-size:clamp(1.12rem,1.6vw,1.3rem);line-height:1.55;color:var(--c-ink2);max-width:36rem;margin:0}
.v2home h2{font-size:clamp(2rem,1rem + 3.4vw,3.4rem);line-height:1.04;margin:0}
.v2home h3{margin:0}
/* ---- the hero: one solid orange block, the headline as big as the column allows, the not-a-diagnosis line on it */
.v2 section.v-hero{padding:0;position:relative;overflow:hidden;background:var(--c-orange);color:var(--c-navy)}
.v-hero .wrap{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(2rem,4vw,3.5rem);align-items:center;padding-block:clamp(2.5rem,6vw,5.5rem)}
.v-hero-copy{display:grid;gap:1.4rem;min-width:0}
.v2 .v-hero .v-eyebrow{color:var(--c-navy)}
.v-hero h1{font-size:clamp(2.75rem,1rem + 7.4vw,5.75rem);line-height:.98;letter-spacing:-.035em;margin:0}
.v-hero h1.v-long{font-size:clamp(2.25rem,.9rem + 4.6vw,4.5rem);line-height:1.02}
.v-hero .v-lede{color:var(--c-navy);max-width:34rem}
.v-nad{display:flex;flex-wrap:wrap;width:fit-content;max-width:100%;margin:0;border:2px solid var(--c-navy);border-radius:var(--radius-s);overflow:hidden;font:600 .95rem/1.35 var(--ff-text)}
.v-nad>span{flex:1 1 auto;padding:.5rem .85rem}
.v-nad-term{background:var(--c-navy);color:var(--c-cream)}
.v-nad-text{background:var(--c-cream);color:var(--c-navy)}
.v-ctas{display:flex;gap:.8rem;flex-wrap:wrap}
.v-note{font-size:.95rem;color:var(--c-navy);margin:0}.v-note b{color:var(--c-navy)}
.v-stage{position:relative;min-height:520px;display:grid;place-items:center;perspective:1600px}
.v-blob,.v-book,.v-book span,.v-phone,.v-screen{display:block}
.v-blob{position:absolute;border-radius:50%}
.v-blob.a{width:min(88%,470px);aspect-ratio:1;background:var(--c-navy);left:50%;top:50%;transform:translate(-50%,-50%)}
.v-blob.b{width:min(26%,140px);aspect-ratio:1;background:var(--c-sun);right:4%;top:2%}
.v-book{position:relative;width:min(300px,62%);aspect-ratio:5/8;transform:rotateY(-22deg) rotateX(4deg) rotateZ(-3deg);transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.v-stage:hover .v-book{transform:rotateY(-12deg) rotateX(2deg) rotateZ(-2deg)}
.v-book span{position:absolute}
.v-face{inset:0;border-radius:4px 12px 12px 4px;background:var(--c-orange) url(/cover-800.jpg) center/cover no-repeat;box-shadow:0 40px 60px -30px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.08)}
.v-spine{left:0;top:0;bottom:0;width:34px;background:var(--c-rust);transform-origin:left;transform:rotateY(-90deg) translateX(-34px);border-radius:3px 0 0 3px}
.v-pages{display:none}
.v-pb{inset:0;transform:translate3d(-26%,8%,-120px) rotateZ(-6deg);border-radius:4px 12px 12px 4px;background:var(--c-orange) url(/cover-800.jpg) center/cover no-repeat;box-shadow:0 30px 50px -30px rgba(0,0,0,.6)}
.v-phone{position:absolute;right:4%;bottom:6%;width:22%;aspect-ratio:9/19;border-radius:22px;background:var(--c-navy);padding:6px;box-shadow:0 0 0 3px var(--c-cream)}
.v-screen{width:100%;height:100%;border-radius:17px;background:var(--c-orange) url(/cover-400.jpg) center bottom/100% auto no-repeat}
.v-chip{position:absolute;display:flex;gap:.45rem;align-items:center;background:var(--c-white);color:var(--c-navy);font:600 .85rem/1.2 var(--ff-text);padding:.55rem .9rem;border-radius:var(--pill);white-space:nowrap;box-shadow:0 3px 0 var(--c-navy)}
.v-chip i{width:10px;height:10px;border-radius:50%;background:var(--c-tomato);flex:none}
.v-chip.c1{left:0;top:9%}.v-chip.c2{right:2%;top:46%}.v-chip.c2 i{background:var(--c-grass)}.v-chip.c3{left:0;bottom:1%}.v-chip.c3 i{background:var(--c-sky)}
@media (max-width:900px){.v-hero .wrap{grid-template-columns:1fr;gap:2rem}.v-stage{min-height:430px}.v-book{width:min(240px,58%)}}
@media (max-width:420px){.v-stage{min-height:370px}.v-chip{font-size:.78rem;padding:.45rem .7rem}}
/* ---- the facts strip: the navy half of the two tones, four numbers in four crayon colours (large text: 4.2:1 or more) */
.v-facts{background:var(--c-navy);color:var(--c-cream);border:0}
.v-facts ul{list-style:none;margin:0;padding:clamp(1.6rem,3vw,2.4rem) 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem}
.v-facts li{text-align:center}
.v-facts b{display:block;font-family:var(--ff-display);font-weight:900;font-size:clamp(2.4rem,1.2rem + 3.4vw,3.6rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--c-tomato)}
.v-facts li:nth-child(4n+2) b{color:var(--c-sun)}.v-facts li:nth-child(4n+3) b{color:var(--c-grass)}.v-facts li:nth-child(4n+4) b{color:var(--c-sky)}
.v-facts span{display:block;margin-top:.5rem;font:600 .8rem/1.35 var(--ff-text);letter-spacing:.08em;text-transform:uppercase;color:var(--c-cream)}
@media (max-width:700px){.v-facts ul{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:1.75rem}}
/* ---- section bands: white and colour in turn */
.v2 section.v-band{padding-block:clamp(4rem,9vw,7.5rem)}
.v-cream{background:var(--c-cream)}
.v-sky{background:var(--c-sun)}   /* the promises band (class name kept: test_site.py and the Squarespace copy look for it) */
.v-head{display:grid;gap:.75rem;max-width:46rem;margin-bottom:clamp(2rem,4vw,3rem)}
.v-head.center{margin-inline:auto;text-align:center}.v-head.center .v-lede{margin-inline:auto}
.v-grid{display:grid;gap:clamp(1rem,2vw,1.5rem)}
.v-three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:860px){.v-three{grid-template-columns:1fr}}
.v-card{background:var(--c-white);border-radius:var(--radius);padding:clamp(1.4rem,2.5vw,1.9rem);min-width:0;box-shadow:none}
.v-card h3{font-size:1.3rem;margin-bottom:.45rem}
.v-card p{color:var(--c-ink2);margin:0}
/* text cards on a white band: the palette's tints in turn (navy and ink text, 7.4:1 or more) */
.v-three>.v-card:nth-child(3n+1){background:var(--t-sun)}.v-three>.v-card:nth-child(3n+2){background:var(--t-sky)}.v-three>.v-card:nth-child(3n+3){background:var(--t-grass)}
.v-kit>.v-card:nth-child(5n+1){background:var(--t-tomato)}.v-kit>.v-card:nth-child(5n+2){background:var(--t-sun)}.v-kit>.v-card:nth-child(5n+3){background:var(--t-sky)}.v-kit>.v-card:nth-child(5n+4){background:var(--t-grass)}.v-kit>.v-card:nth-child(5n+5){background:var(--t-plum)}
/* "what it means": a big and a small dot, the emblem's two faces taking turns */
.v-dot{display:block;width:18px;height:18px;border-radius:50%;margin:0 0 1.1rem;background:var(--c-tomato);box-shadow:26px 4px 0 -4px var(--c-navy)}
.v-dot.d2{background:var(--c-sky)}.v-dot.d3{background:var(--c-grass)}
[dir="rtl"] .v-dot{box-shadow:-26px 4px 0 -4px var(--c-navy)}
/* ---- the story and the evidence: each photo on a flat block of colour (no new image; hands only, as before) */
.v-stack{display:grid;gap:clamp(3rem,7vw,6rem)}
.v-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,5vw,4rem);align-items:center}
.v-split.flip{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.v-split.flip .v-photo{order:2}
.v-photo{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:var(--c-white);box-shadow:16px 16px 0 0 var(--c-sky);margin:0 16px 16px 0}
.v-split.flip .v-photo{box-shadow:16px 16px 0 0 var(--c-grass)}
[dir="rtl"] .v-photo{box-shadow:-16px 16px 0 0 var(--c-sky);margin:0 0 16px 16px}[dir="rtl"] .v-split.flip .v-photo{box-shadow:-16px 16px 0 0 var(--c-grass)}
.v-photo img{width:100%;height:100%;object-fit:cover}
.v-copy{display:grid;gap:1rem;min-width:0;justify-items:start}
.v-copy p{color:var(--c-ink2);max-width:32rem;margin:0}
.v-copy ul{margin:0;padding-inline-start:1.2rem;color:var(--c-ink2);display:grid;gap:.45rem}.v-copy li::marker{color:var(--c-rust)}
@media (max-width:860px){.v-split,.v-split.flip{grid-template-columns:1fr;gap:2rem}.v-split.flip .v-photo{order:0}}
/* ---- product tiles: the three formats. A solid block of colour holds the name and the price (large text only), the
   cream card below holds the details and the store rows. Grounds turn sun, sky, grass */
.v-formats{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.v-format{display:grid;gap:1rem;align-content:start;padding:0;overflow:hidden;background:var(--c-cream)}
.v-format>:not(.v-tile){margin-inline:clamp(1.25rem,2.4vw,1.6rem)}
.v-format>:last-child{margin-bottom:clamp(1.25rem,2.4vw,1.6rem)}
.v-tile{display:grid;gap:.4rem;padding:clamp(1.4rem,2.6vw,2rem) clamp(1.25rem,2.4vw,1.6rem);background:var(--c-sun);color:var(--c-navy)}
.v-format:nth-child(3n+2) .v-tile{background:var(--c-sky)}.v-format:nth-child(3n+3) .v-tile{background:var(--c-grass)}
.v-tile h3{font-size:1.5rem;margin:0}
.v-card .v-price{font-family:var(--ff-display);font-weight:900;font-size:clamp(2.6rem,1.6rem + 2.4vw,3.4rem);line-height:1;letter-spacing:-.03em;color:var(--c-navy);font-variant-numeric:tabular-nums;margin:0}
.v-card .v-spec{font-size:.95rem;color:var(--c-ink2)}
/* links in a card's small print (the live Kindle card's "Outside the US?" stores) are underlined: colour alone is not enough (WCAG 1.4.1) */
.v-card .v-spec a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.v-stores{display:grid;gap:.6rem}
.v2 .v-store{display:flex;justify-content:space-between;align-items:center;gap:.75rem;min-height:56px;padding-block:.5rem;padding-inline:1rem .5rem;border-radius:var(--radius-s);border:2px solid var(--c-white);background:var(--c-white);color:var(--c-navy);font:600 1.02rem/1.25 var(--ff-text);text-decoration:none}
.v2 a.v-store:hover{border-color:var(--c-navy);color:var(--c-navy)}
a.v-store:hover .v-pill.go{background:var(--c-orange);color:var(--c-navy)}
.v2 .v-store.soon{background:transparent;border:2px dashed rgba(20,35,59,.35)}
.v-pill{display:inline-flex;align-items:center;font:600 .78rem/1.2 var(--ff-text);color:var(--c-ink2);background:var(--c-white);padding:.3rem .65rem;border-radius:var(--pill);white-space:nowrap}
.v-pill.go{min-height:40px;padding:.5rem 1.15rem;background:var(--c-navy);color:var(--c-white);font-size:.95rem;text-decoration:none}
.v-pill.tag{letter-spacing:.06em;text-transform:uppercase;color:var(--c-white);background:var(--c-navy)}
@media (min-width:861px){.v-format{grid-row:span 3;grid-template-rows:subgrid;row-gap:1rem}.v-format:has(>:nth-child(4)){grid-row:span 4}.v-format:has(>:nth-child(5)){grid-row:span 5}.v-format:has(>:nth-child(6)){grid-row:span 6}.v-format .v-stores{align-self:start}}
@media (max-width:860px){.v-formats{grid-template-columns:1fr;max-width:32rem;margin-inline:auto}}
/* ---- the promises: white cards on the sun band */
.v-promises{grid-template-columns:repeat(4,minmax(0,1fr))}
.v-sky .v-card{background:var(--c-white);padding:clamp(1.3rem,2.2vw,1.6rem)}
.v-sky .v-card p{color:var(--c-ink2)}
.v2 .v-sky .v-eyebrow{color:var(--c-navy)}
@media (max-width:1000px){.v-promises{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.v-promises{grid-template-columns:1fr}}
/* ---- Bring it to your PTA: six tinted cards, the link on each card's bottom line, the group box as a navy block */
.v-kit{grid-template-columns:repeat(3,minmax(0,1fr))}
.v-kit .v-card{display:flex;flex-direction:column;align-items:flex-start;gap:.6rem}
.v-kit .v-card h3{margin:0}
.v-kit .v-card .v-more{margin-top:auto}
.v-card .v-meta{font:600 .8rem/1.3 var(--ff-text);letter-spacing:.08em;text-transform:uppercase;color:var(--c-rust)}
.v2 .v-more{display:inline-flex;align-items:center;min-height:44px;padding:0;font-weight:600;color:var(--c-navy);text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:4px;justify-self:start}
.v-more::after{content:"\00a0\2192";content:"\00a0\2192" / ""}[dir="rtl"] .v-more::after{content:"\00a0\2190";content:"\00a0\2190" / ""}
.v2 .v-more:hover{color:var(--c-navy);text-decoration-color:currentColor}
.v-group{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:center;justify-content:space-between;margin-top:clamp(1.5rem,3vw,2.2rem);padding:clamp(1.4rem,3vw,2rem) clamp(1.4rem,3vw,2.2rem);border-radius:var(--radius);background:var(--c-navy);color:var(--c-cream)}
.v-group h3{margin:0 0 .3rem;color:var(--c-cream);font-size:1.45rem}.v-group p{color:var(--c-cream);max-width:40rem;margin:0}
.v2 .v-group .btn{background:var(--c-orange);border-color:var(--c-orange);color:var(--c-navy)}
.v2 .v-group .btn:hover{background:var(--c-cream);border-color:var(--c-cream);color:var(--c-navy)}
@media (max-width:860px){.v-kit{grid-template-columns:1fr}}
/* ---- the shop preview (English site only): large product tiles on solid grounds, the five accents in turn, the name
   below on the cream band; "Coming soon" is a navy badge on the picture */
.v-merch{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.5rem,3vw,2.25rem) clamp(.75rem,1.6vw,1.25rem)}
.v-merch .v-card{position:relative;display:grid;gap:.85rem;align-content:start;background:transparent;padding:0}
.v-art{aspect-ratio:1;border-radius:var(--radius);display:grid;place-items:center;background:var(--c-sun)}
.v-merch>.v-card:nth-child(5n+2) .v-art{background:var(--c-sky)}.v-merch>.v-card:nth-child(5n+3) .v-art{background:var(--c-grass)}.v-merch>.v-card:nth-child(5n+4) .v-art{background:var(--c-plum)}.v-merch>.v-card:nth-child(5n+5) .v-art{background:var(--c-tomato)}
.v-art svg{width:80%;height:auto}
.v-card .v-item{display:grid;justify-items:start;gap:.5rem;color:var(--c-navy);margin:0}
.v-item b{font-weight:600;line-height:1.35}
.v-merch .v-pill.tag{position:absolute;top:.75rem;inset-inline-start:.75rem;padding:.3rem .7rem}
.v-merch a.v-pill.go{min-height:44px}
@media (max-width:1000px){.v-merch{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.v-merch{grid-template-columns:repeat(2,minmax(0,1fr))}.v-item b{font-size:.92rem}.v-merch .v-pill.tag{top:.5rem;inset-inline-start:.5rem;font-size:.7rem}}
/* ---- the author: the two-faces emblem on an orange disc over a navy one (the two tones again) */
.v-author{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:center}
.v-mark{width:clamp(96px,12vw,136px);aspect-ratio:1;border-radius:50%;background:var(--c-orange);display:grid;place-items:center;box-shadow:10px 10px 0 0 var(--c-navy);margin:0 10px 10px 0}
[dir="rtl"] .v-mark{box-shadow:-10px 10px 0 0 var(--c-navy);margin:0 0 10px 10px}
.v-mark .emblem{width:72%;height:auto}
.v-author-copy{display:grid;gap:.75rem;min-width:0;justify-items:start}
.v2home .v-author-copy h2{font-size:clamp(1.6rem,1rem + 2vw,2.4rem);line-height:1.1}
.v-author-copy p{color:var(--c-ink2);max-width:40rem;margin:0}
@media (max-width:600px){.v-author{grid-template-columns:1fr}}
/* ---- questions: outlined rows, a navy plus */
.v-faq{display:grid;gap:.75rem;max-width:56rem;margin-inline:auto}
.v-faq details{background:var(--c-white);border:2px solid var(--c-navy);border-radius:var(--radius-s);padding:0 1.25rem}
.v-faq summary{cursor:pointer;font-family:var(--ff-display);font-weight:800;font-size:1.08rem;line-height:1.35;padding:.9rem 0;min-height:56px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.v-faq summary::-webkit-details-marker{display:none}
.v-faq summary::after{content:"+";content:"+" / "";flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--c-navy);color:var(--c-white);font:600 1.25rem/1 var(--ff-text)}
.v-faq details[open] summary::after{content:"\2013";content:"\2013" / ""}
.v-faq details p{color:var(--c-ink2);margin:0;padding-bottom:1.1rem}
.v-faq-more{text-align:center;margin:2rem 0 0}
/* ---- the footer: navy, the stripe again along its top edge, and the language menu as a dropdown */
.v-foot{background:var(--c-navy);color:var(--c-cream);padding:clamp(3rem,6vw,4.5rem) 0 2rem;border-top:var(--stripe-h) solid var(--c-navy);border-image:var(--stripe) 1}
.v-foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2rem}
.v-foot .v-foot-h{font:600 .8rem/1.3 var(--ff-text);letter-spacing:.12em;text-transform:uppercase;color:var(--c-orange);margin:0 0 .8rem}
.v-foot .v-foot-brand{display:flex;align-items:center;gap:.6rem;font-family:var(--ff-display);font-weight:900;font-size:1.35rem;letter-spacing:-.015em;text-transform:none;color:var(--c-cream)}
.v-foot-brand .emblem{width:60px;height:auto;flex:none;background:var(--c-orange);border-radius:var(--pill);padding:3px 6px}
.v-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.3rem}
.v-foot li a{display:inline-block;padding:.15rem 0}
.v-foot a{color:var(--c-cream);text-decoration:none}
.v-foot a:hover{color:var(--c-white);text-decoration:underline;text-underline-offset:3px}
.v-foot .fine{font-size:.9rem;color:var(--c-cream);max-width:34rem;margin:0}
.v-foot .fine+.fine{margin-top:.8rem}
.v-foot .fine a{font-size:1rem;text-decoration:underline;text-underline-offset:3px}
.v-copyright{margin:1.5rem 0 0;border-top:1px solid rgba(244,237,225,.22);padding-top:1.2rem;font-size:.85rem;color:var(--c-cream);display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem}
.v-foot .langs{border-top:1px solid rgba(244,237,225,.22);margin-top:2.25rem;padding-top:1.5rem}
.v-lang>summary{display:inline-flex;align-items:center;gap:.6rem;min-height:48px;padding:.5rem 1.15rem;border:2px solid var(--c-cream);border-radius:var(--pill);color:var(--c-cream);cursor:pointer;list-style:none;font:600 1rem/1.2 var(--ff-text)}
.v-lang>summary::-webkit-details-marker{display:none}
.v-lang>summary::after{content:"";flex:none;width:.5em;height:.5em;margin-inline-start:.25rem;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-.15em) rotate(45deg)}
.v-lang[open]>summary::after{transform:translateY(.12em) rotate(-135deg)}
.v-lang>summary:hover,.v-lang[open]>summary{background:var(--c-cream);color:var(--c-navy)}
.v-lang svg{width:20px;height:20px;flex:none}
.v-lang-cur{color:var(--c-sun)}
.v-lang>summary:hover .v-lang-cur,.v-lang[open]>summary .v-lang-cur{color:var(--c-rust)}
.v-lang ul{list-style:none;margin:.9rem 0 0;padding:clamp(.6rem,2vw,1.1rem);display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:0 .75rem;background:var(--c-cream);border-radius:var(--radius)}
.v-foot .v-lang li a{display:flex;align-items:center;min-height:44px;padding:0 .6rem;border-radius:10px;color:var(--c-navy);line-height:1.25;text-decoration:none}
.v-foot .v-lang li a:hover{background:var(--c-white);color:var(--c-navy);text-decoration:underline}
.v-foot .v-lang li a[aria-current]{background:var(--c-navy);color:var(--c-cream)}
.v-foot .v-lang :focus-visible{outline-color:var(--c-navy)}
.v-foot .v-lang>summary:focus-visible{outline-color:var(--c-sun)}
@media (max-width:900px),(pointer:coarse){
 .v-foot ul{gap:0}
 .v-foot li a,.v-foot .fine a{display:inline-flex;align-items:center;min-height:44px;padding-block:0}
 .v2 .announce a{display:inline-flex;align-items:center;min-height:44px;padding:0}
}
@media (max-width:760px){.v-foot-grid{grid-template-columns:1fr 1fr;gap:1.8rem 1.2rem}.v-foot-grid>div:first-child{grid-column:1/-1}}
/* ---- the "automatically translated" line, above every translated page */
.v2 .translated{background:var(--c-cream);color:var(--c-navy);margin:0;padding:.65rem var(--gutter);text-align:center;font-size:.88rem}
.v2 .translated a{color:var(--c-rust);font-weight:600}
/* ---- inner pages: Inter Display Black titles, a 70-character measure, orange call-to-action blocks */
.v2 main>:is(section,article):not(.v-band):not(.v-hero){padding-block:clamp(3rem,7vw,5.5rem)}
.v2 .cream{background:var(--c-cream)}
.v2 .white{background:transparent}
.v2:not(.v2home) main h1{font-size:clamp(2.5rem,1.2rem + 4.6vw,4.25rem);line-height:1.02;letter-spacing:-.03em;margin:.1em 0 .45em}
.v2 .lead{font-size:clamp(1.15rem,1.8vw,1.35rem);line-height:1.55}
.v2 .narrow{max-width:42rem;font-size:1.125rem;line-height:1.7}
.v2 .narrow :is(h2,h3){font-family:var(--ff-display);font-weight:800;font-size:clamp(1.35rem,2.3vw,1.65rem);line-height:1.22;letter-spacing:-.015em;margin:1.9em 0 .5em}
.v2 .narrow h1+:is(h2,h3){margin-top:1.1em}
.v2 .narrow :is(ul,ol){padding-inline-start:1.3em}.v2 .narrow li{margin:.45em 0}.v2 .narrow li::marker{color:var(--c-rust)}
.v2 .narrow a:not(.btn){text-decoration-thickness:1px;text-underline-offset:.2em}
.v2 .narrow .fine{line-height:1.6}
.v2 .byline{color:var(--c-ink2)}
.v2 .cta{background:var(--c-orange);color:var(--c-navy);border-radius:var(--radius);padding:clamp(1.5rem,3vw,2.2rem);margin:2.75rem 0 2rem}
.v2 .cta p{margin:0 0 1.1rem;color:var(--c-navy)}
.v2 .cta strong{font-family:var(--ff-display);font-weight:800;font-size:1.2rem}
.v2 .cta a:not(.btn){color:var(--c-navy);text-decoration:underline;text-decoration-thickness:2px}
/* the "Articles" link above an article: the eyebrow style, with a back arrow */
.v2 .kicker{font:600 .8rem/1.3 var(--ff-text);letter-spacing:.12em;text-transform:uppercase;color:var(--c-rust)}
.v2 .kicker a{display:inline-flex;align-items:center;min-height:44px;color:var(--c-rust);text-decoration:none}
.v2 .kicker a::before{content:"\2190\00a0";content:"\2190\00a0" / ""}[dir="rtl"] .v2 .kicker a::before{content:"\2192\00a0";content:"\2192\00a0" / ""}
.v2 .kicker a:hover{text-decoration:underline;text-underline-offset:3px}
/* cards on the inner pages: flat */
.v2 .card{background:var(--c-white);border-radius:var(--radius);box-shadow:none;border:0;padding:clamp(1.3rem,2.4vw,1.75rem)}
/* the articles list: white tiles on the cream band, each with a bar of one accent along its top edge, in turn */
.v2 .linkcard{display:flex;flex-direction:column;color:var(--c-navy);text-decoration:none;border:2px solid transparent;border-top:8px solid var(--c-tomato);transition:border-color .15s,transform .15s}
.v2 .grid2>.linkcard:nth-child(5n+2){border-top-color:var(--c-sun)}.v2 .grid2>.linkcard:nth-child(5n+3){border-top-color:var(--c-grass)}.v2 .grid2>.linkcard:nth-child(5n+4){border-top-color:var(--c-sky)}.v2 .grid2>.linkcard:nth-child(5n+5){border-top-color:var(--c-plum)}
.v2 .linkcard:hover{border-inline-color:var(--c-navy);border-bottom-color:var(--c-navy);box-shadow:none;transform:translateY(-3px)}
.v2 .linkcard .h3{font-size:1.3rem;line-height:1.25;margin-bottom:.5rem}
.v2 .linkcard p{margin:0 0 1rem;color:var(--c-ink2)}
.v2 .linkcard .link{margin-top:auto;color:var(--c-rust);font-weight:600}
.v2 .linkcard .link::after{content:"\00a0\2192";content:"\00a0\2192" / ""}[dir="rtl"] .v2 .linkcard .link::after{content:"\00a0\2190";content:"\00a0\2190" / ""}
.v2 main .wrap>p.fine>a[href*="substack.com"]{display:inline-flex;align-items:center;min-height:44px;font-size:1rem;font-weight:600}
.v2 main .wrap>p.fine:has(>a[href*="substack.com"]){margin:0 0 1.4rem}
/* the book page: the cover on a navy panel (the two tones), the formats as tiles, "What readers will find" on orange */
.v2 .two{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,5vw,4rem)}
.v2 .cov{background:var(--c-navy);border-radius:var(--radius);padding:clamp(1.75rem,4vw,3.25rem);display:grid;place-items:center}
.v2 .cov img{width:min(340px,100%);margin:0;border-radius:4px;box-shadow:0 24px 40px -18px rgba(0,0,0,.55)}
.v2 .formats .card{display:flex;flex-direction:column;align-items:stretch;text-align:center;padding:0;overflow:hidden;background:var(--c-cream)}
.v2 .formats .card img{width:100%;max-width:none;height:300px;object-fit:contain;padding:28px 24px;margin:0 0 1.2rem;background:var(--c-sun);border-radius:0;box-shadow:none}
.v2 .formats .card:nth-child(3n+2) img{background:var(--c-sky)}.v2 .formats .card:nth-child(3n+3) img{background:var(--c-grass)}
.v2 .formats .card>:not(img){margin-inline:1.4rem}
.v2 .formats h3{font-size:1.5rem;margin:0 0 .3rem}
.v2 .formats .price{font-family:var(--ff-display);font-weight:900;font-size:2.6rem;line-height:1;letter-spacing:-.03em;margin:0 0 .5rem;font-variant-numeric:tabular-nums}
.v2 .formats .fine{min-height:0;margin-bottom:1.2rem}
.v2 .formats .card>.btn,.v2 .formats .card>.soon{margin-top:auto;margin-bottom:1.4rem}
.v2 .formats .card>.btn{min-height:56px;font-size:1.08rem}
.v2 main>section.sky{background:var(--c-orange)}   /* orange then the navy footer: the two tones again; orange is in the Squarespace palette, so the live Book page can match */
.v2 .ticks{columns:2 22rem;column-gap:3rem;max-width:none}.v2 .ticks li{break-inside:avoid;margin:0 0 .7em}.v2 .ticks li::marker{color:var(--c-rust)}
.v2 .sky .ticks li::marker{color:var(--c-navy)}
@media (max-width:760px){.v2 .two{grid-template-columns:1fr}.v2 .cov img{width:220px}}
/* the previous design's sticky buy bar on phones (no live language uses it since Oct 22; kept in the same colours) */
@media (max-width:760px){.stickybuy{background:var(--c-navy);color:var(--c-cream);border-top:var(--stripe-h) solid var(--c-navy);border-image:var(--stripe) 1;box-shadow:none}.stickybuy .btn{background:var(--c-orange);color:var(--c-navy)}}
/* ---- motion: one small lift on hover, none at all for readers who ask for less */
@media (prefers-reduced-motion:reduce){.v2 *,.v2 *::before,.v2 *::after{transition:none!important;animation:none!important}.v2 .btn:hover,.v2 .linkcard:hover{transform:none}.v-book,.v-stage:hover .v-book{transition:none;transform:rotateY(-22deg) rotateX(4deg) rotateZ(-3deg)}}
/* ---- scripts: heading line height, no tracking or italics where the script has neither, larger small labels */
:is(:lang(ar),:lang(he),:lang(hi),:lang(th)) :is(h1,h2,h3,.h3,summary){line-height:1.4}
:lang(ur) :is(h1,h2,h3,.h3,summary){line-height:1.75}
:is(:lang(zh-Hans),:lang(ja),:lang(ko)) :is(h1,h2,h3,.h3){line-height:1.35}
:is(:lang(ar),:lang(he),:lang(hi),:lang(th)) .v-hero h1{line-height:1.3}
:is(:lang(zh-Hans),:lang(ja),:lang(ko)) .v-hero h1{line-height:1.2;font-size:clamp(2.1rem,.8rem + 4.8vw,4.25rem)}
:lang(ur) .v-hero h1{line-height:1.65}
:is(:lang(ar),:lang(ur),:lang(he),:lang(hi),:lang(th)) :is(h1,h2,h3,.h3,.v-eyebrow,.kicker,.v-meta,.v-pill,.v-facts span,.v-facts b,.v-chip,.v-foot-h,.v-price,.price){letter-spacing:0}
:is(:lang(zh-Hans),:lang(ja),:lang(ko)) :is(h1,h2,h3,.h3){letter-spacing:0}
:is(:lang(zh-Hans),:lang(ja),:lang(ko)) :is(.v-eyebrow,.kicker,.v-meta,.v-pill.tag,.v-facts span,.v-foot-h){letter-spacing:.04em}
:is(:lang(ar),:lang(ur),:lang(he),:lang(hi),:lang(th),:lang(zh-Hans),:lang(ja),:lang(ko)) :is(em,i){font-style:normal}
:is(:lang(ar),:lang(ur),:lang(hi),:lang(th)) :is(.v-pill,.v-eyebrow,.kicker,.v-meta,.v-facts span,.v-foot-h){font-size:.88rem}
:is(:lang(ar),:lang(he),:lang(hi),:lang(th)) :is(.v-nad,.v-store,.v-pill,.btn,.v-chip,.v-eyebrow,.v-meta,.kicker,.v-foot-h,.v-lang>summary,.v-faq summary,.v-facts span){line-height:1.6}
:lang(ur) :is(.v-nad,.v-store,.v-pill,.btn,.v-chip,.v-eyebrow,.v-meta,.kicker,.v-foot-h,.v-lang>summary,.v-faq summary,.v-facts span){line-height:1.9}
/* Japanese: break section headings, questions and labels between phrases, not inside words. Not the h1s: at display
   sizes a Japanese phrase can be longer than the line, and the browser then splits it mid-word */
:lang(ja) :is(h2,h3,.h3,summary,.btn,.v-store,.v-chip,.v-facts span,.translated,.v-item b,.v-nad span){word-break:auto-phrase}