/* The Academy of Culinary Excellence — site styles */
/* ==================== style block ==================== */
/* ==========================================================================
THE ACADEMY OF CULINARY EXCELLENCE — SINGLE-FILE SITE
All 8 pages. One HTML file. Nav swaps sections.
========================================================================== */
:root{
--paper:#FAFAF7; --paper-deep:#F2EFE7; --paper-cool:#EFECE4;
--paper-dark:#151312; --paper-black:#0B0A09;
--ink:#161514; --ink-soft:#252220;
--ink-60:rgba(22,21,20,0.60); --ink-45:rgba(22,21,20,0.45);
--ink-40:rgba(22,21,20,0.40); --ink-30:rgba(22,21,20,0.30);
--ink-25:rgba(22,21,20,0.25); --ink-15:rgba(22,21,20,0.15);
--rule:rgba(22,21,20,0.14); --rule-soft:rgba(22,21,20,0.08);
--paper-60:rgba(250,250,247,0.62); --paper-40:rgba(250,250,247,0.40);
--paper-25:rgba(250,250,247,0.25); --paper-rule:rgba(250,250,247,0.14);
--red:#A0251A; --red-deep:#7B1B12;
--brand-gold:#A88547; --brand-gold-dim:rgba(168,133,71,0.35);
--red-soft:rgba(160,37,26,0.15); --red-whisper:rgba(160,37,26,0.05);
--vol-i:#8B1A1A; --vol-ii:#8B1A1A; --vol-iii:#8B1A1A;
--vol-iv:#8B1A1A; --vol-v:#8B1A1A; --vol-vi:#8B1A1A;
--vol-vii:#8B1A1A; --vol-viii:#8B1A1A;
--display:'Playfair Display',serif;
--body:'Cormorant Garamond',Georgia,serif;
--label:'Inter','Helvetica Neue',sans-serif;
--max:1320px; --max-prose:880px; --max-narrow:720px;
--gutter:clamp(1.4rem, 3vw, 2.8rem);
--nav-h:78px;
--cj-close-h:76px; /* height of the sticky "Close timeline" bar inside an open timeline */
--cj-picker-h:68px; /* height of the sticky mobile month picker */
--ease:cubic-bezier(.2,.6,.2,1); --ease-out:cubic-bezier(.4,0,.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{min-height:100%;background:var(--paper);color:var(--ink)}
body{font-family:var(--body);font-weight:400;font-size:1.08rem;line-height:1.58;
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
text-rendering:optimizeLegibility;position:relative;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;background:none;border:0;cursor:pointer;color:inherit}
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
background-image:url("data:image/svg+xml;utf8,");
opacity:0.45;mix-blend-mode:multiply}
body > *{position:relative;z-index:1}
/* TYPOGRAPHY */
.h-hero{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2.1rem + 4.2vw, 6.8rem);line-height:1.02;
letter-spacing:-0.022em;color:var(--ink)}
.h-hero em{font-style:normal;color:var(--red);font-weight:500}
.h-hero strong{font-style:normal;font-weight:500}
.h-display{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem, 1.8rem + 2.4vw, 4.6rem);line-height:1.04;
letter-spacing:-0.018em}
.h-display em{font-style:normal;color:var(--red);font-weight:500}
.h-section{font-family:var(--display);font-weight:500;font-style:italic;
font-size:clamp(1.8rem, 1.4rem + 1.2vw, 2.8rem);line-height:1.12;
letter-spacing:-0.01em}
.h-section em{font-style:normal;color:var(--red)}
.h-sub{font-family:var(--display);font-weight:500;
font-size:clamp(1.25rem, 1rem + 0.7vw, 1.7rem);line-height:1.2;
letter-spacing:-0.005em}
.lede{font-family:var(--body);font-weight:400;
font-size:clamp(1.15rem, 1.05rem + 0.4vw, 1.4rem);line-height:1.58;
color:var(--ink);max-width:38em}
.eyebrow{font-family:var(--label);font-weight:500;font-size:0.66rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:inline-flex;align-items:center;gap:0.9rem}
.eyebrow::before{content:'';width:22px;height:1px;background:var(--red)}
.cap{font-family:var(--label);font-weight:500;font-size:0.68rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60)}
.prose{font-family:var(--body);font-weight:400;font-size:1.22rem;
line-height:1.62;color:var(--ink);max-width:var(--max-prose)}
.prose p{margin-bottom:1.2em}
.prose p.lead{font-size:1.45rem;line-height:1.45;color:var(--ink);margin-bottom:1.6em}
.prose p.lead::first-letter{font-family:var(--display);font-weight:400;
font-style:italic;float:left;font-size:4.2rem;line-height:0.9;
padding:0.3rem 0.7rem 0 0;color:var(--red)}
.prose em{font-style:italic}
.prose strong{font-weight:500;color:var(--ink)}
.prose a.link-line{color:var(--ink);border-bottom:1px solid var(--red);
padding-bottom:1px;transition:color .3s,border-color .3s}
.prose a.link-line:hover{color:var(--red)}
.prose blockquote{margin:2.2em 0;padding-left:1.6rem;border-left:2px solid var(--red)}
.prose blockquote p{font-family:var(--display);font-style:italic;font-weight:400;
font-size:1.45rem;line-height:1.3;color:var(--ink)}
.prose blockquote cite{display:block;margin-top:0.9rem;font-family:var(--label);
font-style:normal;font-size:0.68rem;letter-spacing:0.28em;
text-transform:uppercase;color:var(--ink-60)}
/* NAVIGATION */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);
padding:0 var(--gutter);display:flex;align-items:center;
justify-content:space-between;background:transparent;
transition:background .5s var(--ease-out),box-shadow .5s var(--ease-out),border-color .5s;
border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(250,250,247,0.92);
backdrop-filter:blur(12px) saturate(1.1);
-webkit-backdrop-filter:blur(12px) saturate(1.1);
border-bottom-color:var(--rule-soft)}
.nav__brand{display:flex;align-items:center;gap:0.85rem;
text-decoration:none;color:inherit;cursor:pointer}
.nav__logo{height:46px;width:auto;display:block;flex-shrink:0}
.nav__links{display:flex;align-items:center;gap:2rem;margin-left:auto;margin-right:2.5rem}
.nav__link{font-family:var(--label);font-size:0.72rem;letter-spacing:0.22em;
text-transform:uppercase;font-weight:500;color:var(--ink);
padding:0.4rem 0;position:relative;transition:color .3s;cursor:pointer;
background:none;border:0}
.nav__link::after{content:'';position:absolute;left:0;right:0;bottom:-2px;
height:1px;background:var(--red);transform:scaleX(0);transform-origin:left;
transition:transform .4s var(--ease-out)}
.nav__link:hover::after,.nav__link.current::after{transform:scaleX(1)}
.nav__link:hover{color:var(--red)}
.nav__link.current{color:var(--ink)}
.nav__cta{display:inline-flex;align-items:center;gap:0.7rem;
padding:0.7rem 1.3rem;background:var(--red);color:var(--paper);
font-family:var(--label);font-size:0.66rem;letter-spacing:0.3em;
text-transform:uppercase;font-weight:500;transition:all .4s var(--ease-out);
border:1px solid var(--red);cursor:pointer}
.nav__cta:hover{background:var(--red-deep);border-color:var(--red-deep);
color:var(--paper);transform:translateY(-1px);
box-shadow:0 6px 16px rgba(160,37,26,0.28)}
.nav__cta .arrow{font-family:var(--body);font-style:italic;font-size:0.88rem;
letter-spacing:0;transition:transform .3s}
.nav__cta:hover .arrow{transform:translateX(3px)}
.nav__mobile{display:none}
@media(max-width:600px){.nav__logo{height:40px}}
@media(max-width:980px){
.nav__links,.nav__cta{display:none}
.nav__mobile{display:flex;align-items:center;justify-content:center;
width:42px;height:42px;border:1px solid var(--rule);background:transparent;cursor:pointer}
.nav__mobile svg{width:18px;height:18px}
.nav__mobile svg line{stroke:var(--ink);stroke-width:1.4}
}
.menu{position:fixed;inset:0;z-index:200;background:var(--paper);
opacity:0;pointer-events:none;transition:opacity .5s var(--ease-out);
display:flex;flex-direction:column;padding:var(--gutter)}
.menu.on{opacity:1;pointer-events:auto}
.menu__head{display:flex;justify-content:space-between;align-items:center;
height:var(--nav-h)}
.menu__close{width:42px;height:42px;border:1px solid var(--rule);
display:flex;align-items:center;justify-content:center}
.menu__links{flex:1;display:flex;flex-direction:column;justify-content:center;
gap:1.4rem;padding:2rem 0}
.menu__link{font-family:var(--display);font-style:italic;font-weight:400;
font-size:clamp(2rem,5vw,3.2rem);line-height:1;color:var(--ink);cursor:pointer;
background:none;border:0;text-align:left}
.menu__link:hover{color:var(--red)}
.menu__cta{display:inline-flex;align-items:center;gap:0.7rem;
padding:0.9rem 1.4rem;margin-top:1.6rem;background:var(--red);color:var(--paper);
font-family:var(--label);font-size:0.68rem;letter-spacing:0.3em;
text-transform:uppercase;font-weight:500;align-self:flex-start;cursor:pointer;border:0}
/* STRUCTURE */
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.wrap--prose{max-width:var(--max-prose)}
.wrap--narrow{max-width:var(--max-narrow)}
.section{padding:clamp(5rem, 8vw, 9rem) 0}
.section--tight{padding:clamp(3rem, 5vw, 5.5rem) 0}
.section--paper-deep{background:var(--paper-deep)}
.section--paper-cool{background:var(--paper-cool)}
.section--dark{background:var(--paper-dark);color:var(--paper)}
.section--dark .h-display,.section--dark .h-section,.section--dark .h-sub,
.section--dark .h-hero{color:var(--paper)}
.section--dark .lede,.section--dark .prose{color:var(--paper-60)}
.section--dark .eyebrow{color:var(--red)}
/* FIGURES */
.figure{margin:0;display:flex;flex-direction:column}
.figure__frame{position:relative;background:var(--ink);overflow:hidden;
box-shadow:0 1px 2px rgba(0,0,0,0.06),0 14px 30px rgba(30,20,10,0.10),0 30px 60px rgba(30,20,10,0.08)}
.figure__frame::before{content:'';position:absolute;inset:-8px;
border:1px solid var(--ink);opacity:0.10;pointer-events:none}
.figure__frame::after{content:'';position:absolute;inset:0;pointer-events:none;
background:linear-gradient(180deg, rgba(35,28,20,0.04) 0%, transparent 50%, rgba(35,28,20,0.08) 100%);
mix-blend-mode:multiply;z-index:2}
.figure__frame img{width:100%;height:100%;object-fit:cover;
filter:grayscale(100%) contrast(1.06)}
/* Placeholder when image hasn't been added yet */
.figure__frame img:not([src]),.figure__frame img[src=""]{
display:flex;align-items:center;justify-content:center;
background:linear-gradient(135deg, #2a2724 0%, #1a1816 100%);
color:var(--paper-40);min-height:100%;
position:relative;
}
.figure__frame:has(img:not([src])),.figure__frame:has(img[src=""]){
background:linear-gradient(135deg, #2a2724 0%, #1a1816 100%);
}
.figure__frame:has(img:not([src]))::before,.figure__frame:has(img[src=""])::before{
content:"Image slot: " attr(data-placeholder);
position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
font-family:var(--label);font-size:0.6rem;letter-spacing:0.3em;
text-transform:uppercase;color:var(--paper-40);z-index:3;
white-space:nowrap;text-align:center;
}
.figure--portrait .figure__frame{aspect-ratio:4/5}
.figure--landscape .figure__frame{aspect-ratio:3/2}
.figure--square .figure__frame{aspect-ratio:1/1}
.figure--tall .figure__frame{aspect-ratio:3/4}
.figure--wide .figure__frame{aspect-ratio:16/9}
.figure__caption{display:flex;flex-direction:column;gap:0.7rem;margin-top:1.6rem}
.figure__title{font-family:var(--display);font-weight:500;font-size:0.95rem;
color:var(--ink);line-height:1.2}
.figure__rule{width:24px;height:1px;background:var(--ink-40)}
.figure__meta{font-family:var(--label);font-weight:400;font-size:0.66rem;
letter-spacing:0.28em;text-transform:uppercase;color:var(--ink-60)}
.section--dark .figure__title{color:var(--paper)}
.section--dark .figure__meta{color:var(--paper-60)}
.section--dark .figure__rule{background:var(--paper-40)}
/* BUTTONS & LINKS */
.btn{display:inline-flex;align-items:center;gap:0.8rem;padding:1rem 1.8rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;
letter-spacing:0.3em;text-transform:uppercase;cursor:pointer;
text-decoration:none;border:1px solid transparent;
transition:all .4s var(--ease-out);position:relative;overflow:hidden}
.btn .arrow{font-family:var(--body);font-style:italic;font-size:0.9rem;
letter-spacing:0.02em;transition:transform .3s;text-transform:none}
.btn:hover .arrow{transform:translateX(3px)}
.btn--red{background:var(--red);color:var(--paper);border-color:var(--red);
box-shadow:0 3px 12px rgba(160,37,26,0.2), inset 0 1px 0 rgba(255,255,255,0.12)}
.btn--red:hover{background:var(--red-deep);border-color:var(--red-deep);
transform:translateY(-2px);
box-shadow:0 10px 24px rgba(160,37,26,0.3), inset 0 1px 0 rgba(255,255,255,0.12)}
.btn--ink{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn--ink:hover{background:var(--ink-soft);transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--paper)}
.link-line{color:inherit;border-bottom:1px solid var(--red);padding-bottom:1px;
transition:color .3s}
.link-line:hover{color:var(--red)}
.link-arrow{display:inline-flex;align-items:center;gap:0.7rem;
font-family:var(--label);font-weight:500;font-size:0.7rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink);
padding-bottom:0.3rem;border-bottom:1px solid var(--ink-25);
transition:all .3s;cursor:pointer;background:none;border-left:0;border-right:0;border-top:0}
.link-arrow:hover{color:var(--red);border-color:var(--red)}
.link-arrow .arrow{font-family:var(--body);font-style:italic;font-size:0.92rem;
letter-spacing:0.02em;text-transform:none;transition:transform .3s}
.link-arrow:hover .arrow{transform:translateX(3px)}
/* PULL QUOTE */
.pullquote{text-align:center;max-width:var(--max-prose);margin:0 auto;
position:relative;padding:2rem 0}
.pullquote__mark{font-family:var(--display);font-size:6rem;line-height:0.5;
color:var(--red);opacity:0.25;margin-bottom:1.5rem;font-style:italic}
.pullquote__text{font-family:var(--display);font-style:italic;font-weight:400;
font-size:clamp(1.8rem, 1.3rem + 1.8vw, 3rem);line-height:1.18;
color:var(--ink);letter-spacing:-0.015em;margin-bottom:2rem}
.pullquote__text em{font-style:normal;color:var(--red);font-weight:500}
.pullquote__cite{display:inline-flex;align-items:center;gap:0.9rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;
letter-spacing:0.34em;text-transform:uppercase;color:var(--ink-60)}
.pullquote__cite::before{content:'';width:28px;height:1px;background:var(--ink-60)}
/* FOOTER */
.footer{background:var(--paper-black);color:var(--paper-60);
padding:clamp(4rem, 7vw, 7rem) 0 2rem;position:relative}
.footer__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:2.4rem;
margin-bottom:4rem}
.footer__brand-col .nav__logo{height:auto;width:min(100%,300px)}
.footer__tag{margin-top:1.6rem;font-family:var(--body);font-style:italic;
font-weight:300;font-size:1.05rem;line-height:1.5;color:var(--paper-60);max-width:26ch}
.footer__col-title{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.34em;text-transform:uppercase;color:var(--paper);margin-bottom:1.4rem}
.footer__links{display:flex;flex-direction:column;gap:0.85rem}
.footer__link{font-family:var(--body);font-weight:400;font-size:1rem;
color:var(--paper-60);transition:color .3s;cursor:pointer;background:none;border:0;
text-align:left;padding:0;font-style:normal}
.footer__link:hover{color:var(--paper)}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;
padding-top:2.2rem;border-top:1px solid var(--paper-rule);
font-family:var(--label);font-size:0.62rem;letter-spacing:0.26em;
text-transform:uppercase;color:var(--paper-40)}
.footer__bottom span{display:inline-flex;align-items:center;gap:0.9rem}
@media(max-width:900px){
.footer__grid{grid-template-columns:1fr 1fr;gap:2.5rem}
.footer__brand-col{grid-column:1/-1;margin-bottom:1rem}
.footer__bottom{flex-direction:column;gap:1rem;text-align:center}
}
/* PAGE SWITCHER — core SPA mechanic */
.page{display:block;animation:pageIn .5s var(--ease-out)}
@keyframes pageIn{
from{opacity:0;transform:translateY(8px)}
to{opacity:1;transform:translateY(0)}
}
/* REVEAL */
.reveal{opacity:0;transform:translateY(28px);
transition:opacity 1.4s var(--ease),transform 1.4s var(--ease)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.d1{transition-delay:0.1s}
.reveal.d2{transition-delay:0.2s}
.reveal.d3{transition-delay:0.3s}
.reveal.d4{transition-delay:0.4s}
.d5{transition-delay:0.5s}
.d6{transition-delay:0.6s}
.d7{transition-delay:0.7s}
@media(prefers-reduced-motion:reduce){
*{transition-duration:0.3s !important;animation-duration:0.3s !important}
.reveal{opacity:1 !important;transform:none !important}
}
.center{text-align:center}
.center-mx{margin-left:auto;margin-right:auto}
.hr{height:1px;background:var(--rule);border:0;margin:0}
/* ==========================================================================
PAGE-SPECIFIC STYLES
========================================================================== */
/* ----- HOME ----- */
.hero{position:relative;padding:calc(var(--nav-h) + 2rem) 0 4rem;overflow:hidden}
.hero__grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:clamp(3rem, 6vw, 7rem);
align-items:center;min-height:calc(100vh - var(--nav-h) - 2rem)}
.hero__meta{display:flex;align-items:center;gap:1.2rem;margin-bottom:1.6rem}
.hero__meta-line{flex:0 0 38px;height:1px;background:var(--red)}
.hero__meta-text{font-family:var(--label);font-weight:500;font-size:0.66rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red)}
.hero__title{margin-bottom:1.6rem}
.hero__subtitle{font-family:var(--display);font-style:italic;font-weight:400;
font-size:clamp(1.2rem, 0.95rem + 0.7vw, 1.7rem);line-height:1.3;color:var(--ink-60);
max-width:28ch;margin-bottom:1.8rem;padding-left:1.2rem;border-left:1px solid var(--red)}
.hero__lede{font-family:var(--body);font-weight:400;font-size:1.18rem;line-height:1.6;
color:var(--ink);max-width:32em;margin-bottom:2rem}
.hero__lede em{color:var(--red);font-style:italic;font-weight:500}
.hero__cta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero__figure .figure__frame{aspect-ratio:4/5}
.hero__image-col{position:relative}
.hero__label-side{position:absolute;top:0;right:calc(100% + 1.2rem);
writing-mode:vertical-rl;transform:rotate(180deg);
font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--ink-60);
white-space:nowrap;z-index:3}
@media(max-width:980px){.hero__label-side{display:none}}
.hero__ghost-num{position:absolute;top:45%;right:-5vw;font-family:var(--display);
font-style:italic;font-weight:400;font-size:clamp(20rem, 35vw, 48rem);
line-height:0.8;color:var(--ink);opacity:0.028;pointer-events:none;z-index:0;
transform:translateY(-50%)}
@media(max-width:980px){
.hero__grid{grid-template-columns:1fr;gap:3rem}
.hero__image-col{order:-1;max-width:380px}
.hero__ghost-num{display:none}
}
.sec-num{position:relative}
.sec-num__ghost{position:absolute;top:-0.15em;left:-0.08em;
font-family:var(--display);font-style:italic;font-weight:400;
font-size:clamp(10rem, 20vw, 22rem);line-height:0.75;color:var(--ink);
opacity:0.035;pointer-events:none;z-index:0}
.section--dark .sec-num__ghost{color:var(--paper);opacity:0.04}
.sec-num__content{position:relative;z-index:1}
.lives__head{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:3rem;
margin-bottom:clamp(3rem, 5vw, 5rem)}
.lives__head-intro{max-width:38ch}
.lives{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(2.5rem, 4vw, 4.5rem)}
.life{display:flex;flex-direction:column}
.life__figure .figure__frame{aspect-ratio:4/5;margin-bottom:2rem}
.life__num{font-family:var(--display);font-style:italic;font-weight:500;
font-size:1.15rem;color:var(--red);margin-bottom:0.8rem;letter-spacing:0.02em}
.life__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.75rem;line-height:1.12;letter-spacing:-0.01em;color:var(--ink);
margin-bottom:1.2rem}
.life__title em{font-style:normal;color:var(--red);font-weight:500}
.life__body{font-family:var(--body);font-weight:400;font-size:1.05rem;
line-height:1.58;color:var(--ink-60)}
.life__meta{margin-top:1.4rem;font-family:var(--label);font-weight:400;
font-size:0.62rem;letter-spacing:0.28em;text-transform:uppercase;
color:var(--ink-60);padding-top:1rem;border-top:1px solid var(--rule)}
@media(max-width:900px){
.lives{grid-template-columns:1fr;gap:4rem}
.lives__head{grid-template-columns:1fr;gap:1.5rem}
}
.collection__head{display:grid;grid-template-columns:1.3fr 1fr;gap:4rem;
align-items:end;margin-bottom:clamp(3rem, 5vw, 5rem)}
.collection__stats{display:flex;flex-direction:column;gap:1.4rem;padding-left:2rem;
border-left:1px solid var(--rule)}
.collection__stat{display:flex;align-items:baseline;gap:1rem}
.collection__stat-num{font-family:var(--display);font-style:italic;font-weight:500;
font-size:2.4rem;color:var(--red);letter-spacing:-0.02em;line-height:1}
.collection__stat-label{font-family:var(--label);font-weight:400;font-size:0.65rem;
letter-spacing:0.26em;text-transform:uppercase;color:var(--ink-60)}
.volumes{display:grid;grid-template-columns:repeat(8,1fr);gap:1.2rem}
.volume{position:relative;aspect-ratio:2/3;background:#1d1b19;
border:1px solid rgba(250,250,247,0.08);padding:1.8rem 1.2rem;
display:flex;flex-direction:column;justify-content:space-between;
transition:all .5s var(--ease-out);text-decoration:none;color:var(--paper);
overflow:hidden;cursor:pointer}
.volume:hover{transform:translateY(-4px);border-color:var(--paper-25);
box-shadow:0 20px 40px rgba(0,0,0,0.35)}
.volume__num{font-family:var(--display);font-style:italic;font-weight:400;
font-size:0.85rem;color:var(--paper-60);letter-spacing:0.2em}
.volume__symbol{width:40px;height:40px;margin:1.8rem 0 auto 0;
display:flex;align-items:center;justify-content:center}
.volume__symbol svg{width:100%;height:100%;overflow:visible}
.volume__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.15rem;line-height:1.15;color:var(--paper);letter-spacing:-0.005em}
.volume__brand{margin-top:0.8rem;font-family:var(--label);font-size:0.54rem;
letter-spacing:0.28em;text-transform:uppercase;color:var(--paper-40)}
.volume--i .volume__symbol svg{color:var(--vol-i)}
.volume--ii .volume__symbol svg{color:var(--vol-ii)}
.volume--iii .volume__symbol svg{color:var(--vol-iii)}
.volume--iv .volume__symbol svg{color:var(--vol-iv)}
.volume--v .volume__symbol svg{color:var(--vol-v)}
.volume--vi .volume__symbol svg{color:var(--vol-vi)}
/* Photographic cover tiles (real front-cover artwork) */
.volume--img{aspect-ratio:auto;padding:0;background:none;border:0;display:block;
box-shadow:0 1px 2px rgba(0,0,0,0.12),0 10px 24px rgba(30,20,10,0.14)}
.volume--img img{display:block;width:100%;height:auto}
.volume--img:hover{border-color:transparent;box-shadow:0 20px 40px rgba(30,20,10,0.22)}
@media(max-width:1100px){.volumes{grid-template-columns:repeat(4,1fr)}}
@media(max-width:600px){
.volumes{grid-template-columns:repeat(2,1fr)}
.collection__head{grid-template-columns:1fr;gap:2.5rem}
.collection__stats{padding-left:0;border-left:0;padding-top:2rem;
border-top:1px solid var(--rule)}
}
.sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(2rem, 3.5vw, 3.5rem);
margin-top:clamp(3rem, 5vw, 5rem)}
.sector{padding:2rem 0 0;border-top:2px solid var(--ink);
display:flex;flex-direction:column}
.sector__num{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);margin-bottom:1rem}
.sector__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:2rem;line-height:1.1;margin-bottom:1.2rem;color:var(--ink);letter-spacing:-0.01em}
.sector__body{font-family:var(--body);font-size:1.05rem;line-height:1.58;
color:var(--ink-60);margin-bottom:1.4rem}
.sector__quote{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1.05rem;line-height:1.4;color:var(--ink);padding:0.2rem 0 0.2rem 1rem;
border-left:1px solid var(--red);margin-bottom:1.4rem}
.sector .link-arrow{margin-top:auto;align-self:flex-start}
@media(max-width:900px){.sectors{grid-template-columns:1fr;gap:2.5rem;margin-top:2.5rem}}
.finale{position:relative;padding:clamp(5rem, 9vw, 10rem) 0;overflow:hidden}
.finale__grid{display:grid;grid-template-columns:1.3fr 0.7fr;gap:clamp(3rem, 5vw, 6rem);
align-items:center}
.finale__title{margin-bottom:1.8rem}
.finale__lede{font-family:var(--body);font-size:1.22rem;line-height:1.6;
color:var(--ink-60);margin-bottom:2.4rem;max-width:60ch}
.finale__lede em{color:var(--ink);font-style:italic;font-weight:500}
.finale__spec{font-family:var(--body);font-style:italic;font-weight:400;
font-size:1.05rem;line-height:1.55;color:var(--ink-60);max-width:60ch;
padding:1.4rem 0 0;margin-top:1.8rem;margin-bottom:2.4rem;
border-top:1px solid var(--rule)}
.finale__spec em{color:var(--ink);font-style:normal;font-weight:500}
.finale__cta{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
.finale__figure .figure__frame{aspect-ratio:3/4}
.finale__figure{max-width:420px;margin-left:auto}
@media(max-width:900px){
.finale__grid{grid-template-columns:1fr;gap:3rem}
.finale__figure{max-width:420px;margin-left:0}
}
/* ----- MARCO ----- */
.marco-hero{position:relative;padding:calc(var(--nav-h) + 4rem) 0 4rem;overflow:hidden}
.marco-hero__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem, 6vw, 7rem);
align-items:center;min-height:70vh}
.marco-hero__meta{display:flex;align-items:center;gap:1rem;margin-bottom:2.2rem;
font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--red)}
.marco-hero__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.marco-hero__name{font-family:var(--display);font-weight:500;font-style:italic;
font-size:clamp(3.2rem, 2.4rem + 3.4vw, 6.2rem);line-height:0.98;
letter-spacing:-0.022em;margin-bottom:2.2rem}
.marco-hero__name em{font-style:normal;color:var(--red);font-weight:500}
.marco-hero__dek{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.15rem, 0.95rem + 0.6vw, 1.55rem);line-height:1.35;color:var(--ink-60);
margin-bottom:2.5rem;max-width:30ch;padding-left:1.2rem;border-left:1px solid var(--red)}
.marco-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:2rem 0}
.marco-stat{padding:0 1.6rem;border-right:1px solid var(--rule)}
.marco-stat:first-child{padding-left:0}
.marco-stat:last-child{border-right:0;padding-right:0}
.marco-stat__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:clamp(2rem, 1.5rem + 1vw, 2.8rem);line-height:1;color:var(--red);
letter-spacing:-0.01em;margin-bottom:0.3rem}
.marco-stat__label{font-family:var(--label);font-weight:400;font-size:0.62rem;
letter-spacing:0.26em;text-transform:uppercase;color:var(--ink-60);line-height:1.4}
.marco-hero__figure .figure__frame{aspect-ratio:4/5}
@media(max-width:900px){
.marco-hero__grid{grid-template-columns:1fr;gap:3rem}
.marco-hero__figure{max-width:440px}
.marco-stats{grid-template-columns:1fr 1fr;gap:1.5rem;padding:1.5rem 0}
.marco-stat{border-right:0;padding:0}
.marco-stat:last-child{grid-column:1/-1}
}
.chapter{padding:clamp(4rem, 7vw, 7rem) 0;border-top:1px solid var(--rule)}
.chapter__grid{display:grid;grid-template-columns:220px 1fr;gap:clamp(2rem, 4vw, 5rem);
align-items:start}
.chapter__aside{position:sticky;top:calc(var(--nav-h) + 2rem)}
.chapter__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:3rem;line-height:1;color:var(--red);margin-bottom:0.6rem;letter-spacing:-0.01em}
.chapter__meta{font-family:var(--label);font-weight:500;font-size:0.64rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink)}
.chapter__submeta{font-family:var(--body);font-weight:400;font-style:italic;
font-size:0.98rem;line-height:1.4;color:var(--ink-60);margin-top:0.8rem;max-width:26ch}
.chapter__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:clamp(1.8rem, 1.3rem + 1.5vw, 2.8rem);line-height:1.1;
letter-spacing:-0.01em;color:var(--ink);margin-bottom:2rem;max-width:20ch}
.chapter__title em{font-style:normal;color:var(--red);font-weight:500}
@media(max-width:900px){
.chapter__grid{grid-template-columns:1fr;gap:2rem}
.chapter__aside{position:relative;top:0}
.chapter__num{font-size:2.2rem}
}
.img-break{padding:0}
.img-break__figure{max-width:1100px;margin:0 auto;padding:0 var(--gutter)}
.img-break__figure .figure__frame{aspect-ratio:16/9}
.big-quote{padding:clamp(4rem, 8vw, 8rem) 0;background:var(--ink);color:var(--paper)}
.big-quote__text{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem, 1.4rem + 2.2vw, 3.8rem);line-height:1.15;
letter-spacing:-0.015em;color:var(--paper);max-width:18ch;margin:0 auto;text-align:center}
.big-quote__text em{color:var(--red);font-style:normal;font-weight:500}
.big-quote__cite{display:flex;align-items:center;justify-content:center;gap:0.9rem;
margin-top:3rem;font-family:var(--label);font-weight:500;font-size:0.68rem;
letter-spacing:0.34em;text-transform:uppercase;color:var(--paper-60)}
.big-quote__cite::before{content:'';width:28px;height:1px;background:var(--paper-40)}
.gallery-strip{padding:clamp(4rem, 6vw, 6rem) 0}
.gallery-strip__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.gallery-strip__figure .figure__frame{aspect-ratio:4/5}
@media(max-width:900px){.gallery-strip__grid{grid-template-columns:repeat(2,1fr)}}
.close-section{padding:clamp(5rem, 9vw, 10rem) 0;background:var(--paper-deep);
text-align:center}
.close-section__quote{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem, 1.7rem + 2.4vw, 4.2rem);line-height:1.1;
letter-spacing:-0.02em;color:var(--ink);max-width:22ch;margin:0 auto 2.6rem}
.close-section__quote em{font-style:normal;color:var(--red);font-weight:500}
/* ----- COLLECTION PAGE ----- */
.coll-hero{padding:calc(var(--nav-h) + 5rem) 0 4rem;position:relative;overflow:hidden}
.coll-hero__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:flex;align-items:center;gap:0.9rem;margin-bottom:2.4rem}
.coll-hero__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.coll-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2.2rem + 3.8vw, 6.8rem);line-height:0.98;
letter-spacing:-0.022em;margin-bottom:2rem}
.coll-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.coll-hero__lede{font-family:var(--body);font-size:1.25rem;line-height:1.55;
color:var(--ink);max-width:40em;margin-bottom:2.8rem}
.coll-hero__lede em{color:var(--red);font-style:italic;font-weight:500}
.coll-toc{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;background:var(--rule);
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:3rem}
.coll-toc__item{background:var(--paper);padding:1.6rem 1.2rem;
display:flex;flex-direction:column;gap:0.5rem;text-decoration:none;color:inherit;
transition:background .3s;cursor:pointer}
.coll-toc__item:hover{background:var(--paper-cool)}
.coll-toc__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.6rem;line-height:1;color:var(--red);letter-spacing:-0.01em}
.coll-toc__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:0.95rem;line-height:1.2;color:var(--ink)}
.coll-toc__meta{font-family:var(--label);font-weight:400;font-size:0.56rem;
letter-spacing:0.24em;text-transform:uppercase;color:var(--ink-60);margin-top:auto}
@media(max-width:1100px){.coll-toc{grid-template-columns:repeat(4,1fr)}}
@media(max-width:500px){.coll-toc{grid-template-columns:repeat(2,1fr)}}
.vol{padding:clamp(4rem,7vw,8rem) 0;position:relative;border-top:1px solid var(--rule)}
.vol--dark{background:var(--paper-dark);color:var(--paper);border-top-color:transparent}
.vol--cream{background:var(--paper-deep);border-top-color:transparent}
.vol--dark .vol__title,.vol--dark .vol__prose{color:var(--paper)}
.vol--dark .vol__prose{color:var(--paper-60)}
.vol--dark .vol__kicker{color:var(--paper-60)}
.vol--dark .vol__num-big{color:var(--paper);opacity:0.06}
.vol__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem, 5vw, 6rem);
align-items:center}
.vol--reverse .vol__grid{direction:rtl}
.vol--reverse .vol__grid > *{direction:ltr}
.vol__num-big{position:absolute;top:50%;font-family:var(--display);font-weight:400;
font-style:italic;font-size:clamp(14rem, 28vw, 28rem);line-height:0.8;
color:var(--ink);opacity:0.04;letter-spacing:-0.03em;pointer-events:none;
transform:translateY(-50%);z-index:0}
.vol:nth-of-type(odd) .vol__num-big{right:-2vw}
.vol:nth-of-type(even) .vol__num-big{left:-2vw}
.vol__content{position:relative;z-index:1}
.vol__kicker{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--ink-60);
display:flex;align-items:center;gap:0.9rem;margin-bottom:1.4rem}
.vol__kicker-num{display:inline-flex;align-items:center;justify-content:center;
width:26px;height:26px;font-family:var(--display);font-weight:500;font-style:italic;
font-size:0.8rem;color:var(--paper);border-radius:50%;letter-spacing:0}
.vol--i .vol__kicker-num{background:var(--vol-i)}
.vol--ii .vol__kicker-num{background:var(--vol-ii)}
.vol--iii .vol__kicker-num{background:var(--vol-iii)}
.vol--iv .vol__kicker-num{background:var(--vol-iv)}
.vol--v .vol__kicker-num{background:var(--vol-v)}
.vol--vi .vol__kicker-num{background:var(--vol-vi)}
.vol--vii .vol__kicker-num{background:var(--vol-vii)}
.vol--viii .vol__kicker-num{background:var(--vol-viii)}
.vol__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem, 1.7rem + 2.2vw, 4.2rem);line-height:1.02;
letter-spacing:-0.02em;color:var(--ink);margin-bottom:1.8rem}
.vol__title em{font-style:normal;font-weight:500}
.vol--i .vol__title em{color:var(--vol-i)}
.vol--ii .vol__title em{color:var(--vol-ii)}
.vol--iii .vol__title em{color:var(--vol-iii)}
.vol--iv .vol__title em{color:var(--vol-iv)}
.vol--v .vol__title em{color:var(--vol-v)}
.vol--vi .vol__title em{color:var(--vol-vi)}
.vol--vii .vol__title em{color:var(--vol-vii)}
.vol--viii .vol__title em{color:var(--vol-viii)}
.vol__prose{font-family:var(--body);font-size:1.15rem;line-height:1.6;
color:var(--ink);margin-bottom:2rem;max-width:40em}
.vol__prose p+p{margin-top:1.2em}
.vol__prose em{font-style:italic;color:var(--ink)}
.vol--dark .vol__prose em{color:var(--paper)}
.vol__quote{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1.15rem;line-height:1.45;color:var(--ink);
padding:1rem 0 1rem 1.2rem;border-left:2px solid;margin-bottom:2rem;max-width:38em}
.vol--i .vol__quote{border-color:var(--vol-i)}
.vol--ii .vol__quote{border-color:var(--vol-ii)}
.vol--iii .vol__quote{border-color:var(--vol-iii)}
.vol--iv .vol__quote{border-color:var(--vol-iv)}
.vol--v .vol__quote{border-color:var(--vol-v)}
.vol--vi .vol__quote{border-color:var(--vol-vi)}
.vol--vii .vol__quote{border-color:var(--vol-vii)}
.vol--viii .vol__quote{border-color:var(--vol-viii)}
.vol--dark .vol__quote{color:var(--paper)}
.vol__meta{display:grid;grid-template-columns:repeat(3,auto);gap:0 2.6rem;
padding:1.5rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
margin-bottom:2rem;max-width:36em}
.vol--dark .vol__meta{border-color:var(--paper-rule)}
.vol__meta-item{display:flex;flex-direction:column;gap:0.2rem;line-height:1.1}
.vol__meta-num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.4rem;color:var(--red);letter-spacing:-0.01em}
.vol__meta-label{font-family:var(--label);font-weight:400;font-size:0.58rem;
letter-spacing:0.26em;text-transform:uppercase;color:var(--ink-60)}
.vol--dark .vol__meta-label{color:var(--paper-60)}
.vol__cover{position:relative;aspect-ratio:2/3;max-width:440px;margin:0 auto;
background:var(--paper-dark);border:1px solid rgba(250,250,247,0.08);
padding:2.6rem 2rem;display:flex;flex-direction:column;justify-content:space-between;
box-shadow:0 1px 2px rgba(0,0,0,0.1),0 20px 40px rgba(30,20,10,0.14),0 50px 80px rgba(30,20,10,0.10);
overflow:hidden}
.vol__cover::before{content:'';position:absolute;inset:8px;
border:1px solid rgba(250,250,247,0.06);pointer-events:none}
.vol__cover-top{display:flex;flex-direction:column;gap:0.3rem}
.vol__cover-series{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--paper-60)}
.vol__cover-num{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1rem;color:var(--paper-60);letter-spacing:0.15em}
.vol__cover-symbol{margin:auto;width:88px;height:88px;
display:flex;align-items:center;justify-content:center}
.vol__cover-symbol svg{width:100%;height:100%;overflow:visible}
.vol--i .vol__cover-symbol svg{color:var(--vol-i)}
.vol--ii .vol__cover-symbol svg{color:var(--vol-ii)}
.vol--iii .vol__cover-symbol svg{color:var(--vol-iii)}
.vol--iv .vol__cover-symbol svg{color:var(--vol-iv)}
.vol--v .vol__cover-symbol svg{color:var(--vol-v)}
.vol--vi .vol__cover-symbol svg{color:var(--vol-vi)}
.vol__cover-bottom{display:flex;flex-direction:column;gap:0.8rem}
.vol__cover-title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.75rem;line-height:1.1;color:var(--paper);letter-spacing:-0.01em}
.vol__cover-brand{font-family:var(--label);font-weight:400;font-size:0.54rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--paper-40)}
/* Photographic cover (real front-cover artwork from the printed books) */
.vol__cover--img{aspect-ratio:auto;padding:0;background:none;border:0;display:block;
box-shadow:0 1px 2px rgba(0,0,0,0.12),0 20px 40px rgba(30,20,10,0.18),0 50px 80px rgba(30,20,10,0.12)}
.vol__cover--img::before{display:none}
.vol__cover--img img{display:block;width:100%;height:auto}
@media(max-width:900px){
.vol__grid{grid-template-columns:1fr;gap:3rem}
.vol--reverse .vol__grid{direction:ltr}
.vol__cover{max-width:340px}
.vol__num-big{display:none}
}
.coll-close{padding:clamp(5rem, 9vw, 10rem) 0;background:var(--paper-deep);
text-align:center}
.coll-close__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.2rem, 1.6rem + 2vw, 3.8rem);line-height:1.1;
letter-spacing:-0.02em;color:var(--ink);max-width:22ch;margin:0 auto 2rem}
.coll-close__title em{font-style:normal;color:var(--red);font-weight:500}
.coll-close__lede{font-family:var(--body);font-size:1.2rem;line-height:1.55;
color:var(--ink-60);max-width:46ch;margin:0 auto 2.6rem}
/* ----- ACADEMY PAGE ----- */
.aca-hero{min-height:calc(100vh - var(--nav-h));
padding:calc(var(--nav-h) + 5rem) 0 5rem;display:flex;align-items:center;
position:relative;overflow:hidden}
.aca-hero__ghost{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(28rem, 55vw, 72rem);line-height:0.7;color:var(--ink);
opacity:0.028;pointer-events:none;z-index:0}
.aca-hero__inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;text-align:center}
.aca-hero__kicker{display:inline-flex;align-items:center;gap:0.9rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;letter-spacing:0.34em;
text-transform:uppercase;color:var(--red);margin-bottom:2.4rem}
.aca-hero__kicker::before,.aca-hero__kicker::after{content:'';width:28px;height:1px;
background:var(--red)}
.aca-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.8rem, 2rem + 4vw, 7rem);line-height:1;letter-spacing:-0.022em;
color:var(--ink);margin-bottom:2.4rem}
.aca-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.aca-hero__lede{font-family:var(--body);font-style:italic;font-weight:400;
font-size:clamp(1.25rem, 1rem + 0.8vw, 1.7rem);line-height:1.4;color:var(--ink-60);
max-width:42ch;margin:0 auto 3rem}
.act{padding:clamp(5rem, 9vw, 10rem) 0;position:relative;border-top:1px solid var(--rule)}
.act--dark{background:var(--paper-dark);color:var(--paper);border-top-color:transparent}
.act__mark{position:absolute;top:3rem;left:50%;transform:translateX(-50%);
font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.36em;
text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:0.9rem}
.act__mark::before,.act__mark::after{content:'';width:28px;height:1px;background:var(--red)}
.act__num{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(6rem, 4rem + 5vw, 10rem);line-height:0.9;color:var(--red);
letter-spacing:-0.02em;text-align:center;margin-bottom:1rem}
.act__label{text-align:center;font-family:var(--display);font-weight:400;
font-style:italic;font-size:1.2rem;color:var(--ink-60);margin-bottom:3rem;
letter-spacing:0.01em}
.act--dark .act__label{color:var(--paper-60)}
.act__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem, 1.8rem + 2.2vw, 4.6rem);line-height:1.02;
letter-spacing:-0.02em;text-align:center;max-width:22ch;margin:0 auto 3rem;color:var(--ink)}
.act--dark .act__title{color:var(--paper)}
.act__title em{font-style:normal;color:var(--red);font-weight:500}
.act__prose{font-family:var(--body);font-weight:400;font-size:1.22rem;line-height:1.62;
color:var(--ink);max-width:var(--max-prose);margin:0 auto;
column-count:2;column-gap:3rem}
.act__prose p{break-inside:avoid-column;margin-bottom:1.4em}
.act__prose p:first-child::first-letter{font-family:var(--display);font-style:italic;
font-weight:400;float:left;font-size:4rem;line-height:0.88;
padding:0.25rem 0.7rem 0 0;color:var(--red)}
.act__prose em{color:var(--ink);font-style:italic}
.act--dark .act__prose{color:var(--paper-60)}
.act--dark .act__prose em{color:var(--paper)}
@media(max-width:900px){.act__prose{column-count:1}}
.act__end{display:block;text-align:center;margin:2.4rem auto 0;
font-family:var(--display);font-style:italic;font-size:2rem;color:var(--red)}
.principles{padding:clamp(5rem, 8vw, 9rem) 0}
.principles__head{text-align:center;margin-bottom:clamp(3rem, 5vw, 5rem)}
.principles__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
background:var(--rule);border:1px solid var(--rule)}
.principle{background:var(--paper);padding:2.5rem 2rem;display:flex;flex-direction:column}
.principle__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1rem;color:var(--red);margin-bottom:1rem;letter-spacing:0.02em}
.principle__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.4rem;line-height:1.15;color:var(--ink);letter-spacing:-0.01em;
margin-bottom:1rem}
.principle__body{font-family:var(--body);font-size:1rem;line-height:1.55;color:var(--ink-60)}
@media(max-width:900px){.principles__grid{grid-template-columns:1fr}}
.principle__subtitle{font-family:var(--display);font-style:italic;font-weight:400;
font-size:1.05rem;line-height:1.35;color:var(--ink-60);
margin-top:-0.4rem;margin-bottom:1.4rem;letter-spacing:-0.005em}
.aca-close{padding:clamp(3rem, 5vw, 5rem) 0 clamp(5rem, 8vw, 8rem);text-align:center;
background:var(--paper)}
.aca-close__inner{max-width:var(--max-prose);margin:0 auto;
display:flex;flex-direction:column;align-items:center;gap:2rem}
.aca-close__eyebrow{display:inline-flex;align-items:center;gap:0.9rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;letter-spacing:0.34em;
text-transform:uppercase;color:var(--red)}
.aca-close__eyebrow::before,.aca-close__eyebrow::after{content:'';width:28px;height:1px;
background:var(--red)}
.aca-close__line{font-family:var(--display);font-style:italic;font-weight:400;
font-size:clamp(1.5rem, 1.1rem + 1.2vw, 2.4rem);line-height:1.25;color:var(--ink);
letter-spacing:-0.01em;max-width:24ch}
.aca-close__line em{color:var(--red);font-style:normal;font-weight:500}
.aca-close__cta{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap;
justify-content:center;margin-top:1rem}
.principles__summary{margin-top:clamp(3rem, 5vw, 5rem);max-width:var(--max-prose);
margin-left:auto;margin-right:auto;text-align:center}
.principles__summary p{font-family:var(--display);font-style:italic;font-weight:400;
font-size:clamp(1.3rem, 1rem + 0.9vw, 1.95rem);line-height:1.4;color:var(--ink);
letter-spacing:-0.01em}
.principles__summary em{color:var(--red);font-style:normal;font-weight:500}
.interlude{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-deep);text-align:center}
.interlude__quote{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.2rem, 1.5rem + 2.4vw, 4.2rem);line-height:1.08;
letter-spacing:-0.02em;color:var(--ink);max-width:18ch;margin:0 auto 2.4rem}
.interlude__quote em{font-style:normal;color:var(--red);font-weight:500}
.interlude__cite{display:inline-flex;align-items:center;gap:0.9rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;letter-spacing:0.34em;
text-transform:uppercase;color:var(--ink-60)}
.interlude__cite::before{content:'';width:28px;height:1px;background:var(--ink-60)}
/* ----- PROGRAMMES PAGE ----- */
.prg-hero{padding:calc(var(--nav-h) + 5rem) 0 4rem}
.prg-hero__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:2.2rem}
.prg-hero__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.prg-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2.2rem + 3.6vw, 6.4rem);line-height:0.98;
letter-spacing:-0.022em;margin-bottom:2rem}
.prg-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.prg-hero__lede{font-family:var(--body);font-size:1.22rem;line-height:1.58;
color:var(--ink);max-width:40em;margin-bottom:2.5rem}
.prg-matrix{margin-top:2rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.prg-matrix__item{padding:1.6rem 1.4rem;border:1px solid var(--rule);background:var(--paper);
display:flex;flex-direction:column;gap:0.4rem;cursor:pointer;
text-decoration:none;color:inherit;transition:background .3s}
.prg-matrix__item:hover{background:var(--paper-cool)}
.prg-matrix__level{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.2rem;color:var(--red);letter-spacing:0}
.prg-matrix__code{font-family:var(--label);font-weight:400;font-size:0.58rem;
letter-spacing:0.26em;text-transform:uppercase;color:var(--ink-60)}
.prg-matrix__name{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.1rem;line-height:1.15;margin-top:0.6rem}
@media(max-width:900px){.prg-matrix{grid-template-columns:repeat(2,1fr)}}
.std{scroll-margin-top:var(--nav-h);padding:clamp(3rem, 5vw, 5rem) 0;border-top:1px solid var(--ink);position:relative}
.std:first-of-type{border-top:2px solid var(--ink)}
.std__grid{display:grid;grid-template-columns:120px 1fr 1fr;gap:clamp(2rem, 4vw, 4rem)}
.std__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:3rem;line-height:1;color:var(--red);letter-spacing:-0.01em;margin-bottom:0.6rem}
.std__code{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60);margin-bottom:0.3rem}
.std__level{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--red)}
.std__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem, 1.4rem + 1.6vw, 3rem);line-height:1.08;
letter-spacing:-0.018em;margin-bottom:1.4rem;color:var(--ink)}
.std__title em{font-style:normal;color:var(--red);font-weight:500}
.std__dek{font-family:var(--body);font-style:italic;font-weight:400;
font-size:1.15rem;line-height:1.45;color:var(--ink-60);max-width:38em;margin-bottom:1.6rem}
.std__body{font-family:var(--body);font-size:1.05rem;line-height:1.55;
color:var(--ink);max-width:38em}
.std__body p+p{margin-top:1em}
.std__spec{display:flex;flex-direction:column;gap:0;border:1px solid var(--rule)}
.std__row{display:grid;grid-template-columns:130px 1fr;padding:1rem 1.2rem;
border-bottom:1px solid var(--rule);align-items:start}
.std__row:last-child{border-bottom:0}
.std__row-key{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60);padding-top:0.15rem}
.std__row-val{font-family:var(--body);font-size:1.02rem;line-height:1.4;color:var(--ink)}
.std__row-val em{font-style:italic;color:var(--ink-60)}
.chapter-tag{display:inline-block;padding:0.2rem 0.5rem;border:1px solid var(--ink-25);
font-family:var(--label);font-size:0.56rem;letter-spacing:0.22em;
text-transform:uppercase;color:var(--ink);margin:0.2rem 0.25rem 0.2rem 0;line-height:1}
@media(max-width:900px){
.std__grid{grid-template-columns:1fr;gap:2rem}
.std__num{font-size:2.4rem}
}
.pathway{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-dark);color:var(--paper)}
.pathway__head{text-align:center;margin-bottom:4rem}
.pathway__head .h-section{color:var(--paper)}
.pathway__head .h-section em{color:var(--red)}
.pathway__diagram{position:relative;display:grid;grid-template-columns:repeat(4,1fr);
gap:1rem;max-width:1100px;margin:0 auto}
.pathway__step{position:relative;padding:2rem 1.5rem;
background:rgba(250,250,247,0.03);border:1px solid rgba(250,250,247,0.1);
text-align:center;display:flex;flex-direction:column;gap:0.6rem}
.pathway__step-num{font-family:var(--display);font-weight:400;font-style:italic;
font-size:2.4rem;color:var(--red);line-height:1;letter-spacing:-0.01em}
.pathway__step-level{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.28em;text-transform:uppercase;color:var(--paper-60)}
.pathway__step-title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.1rem;line-height:1.2;color:var(--paper)}
.pathway__step-years{font-family:var(--body);font-style:italic;font-weight:400;
font-size:0.95rem;color:var(--paper-60);margin-top:0.3rem}
@media(max-width:900px){.pathway__diagram{grid-template-columns:1fr 1fr}}
.epa{padding:clamp(4rem, 7vw, 7rem) 0}
.epa__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem, 4vw, 5rem);
align-items:center}
.epa__stats{display:grid;grid-template-columns:1fr 1fr;gap:0;
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.epa__stat{padding:2.2rem 0;text-align:center;border-right:1px solid var(--rule)}
.epa__stat:last-child{border-right:0}
.epa__stat-num{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2rem + 2.2vw, 5rem);line-height:1;color:var(--red);
letter-spacing:-0.02em;margin-bottom:0.4rem}
.epa__stat-label{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60)}
@media(max-width:900px){.epa__grid{grid-template-columns:1fr;gap:2.5rem}}
/* ----- PROGRAMMES PAGE ----- */
.prg-matrix--three{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.prg-matrix,.prg-matrix--three{grid-template-columns:1fr}}
/* MARCO STATEMENT (dramatic dark) */
.prg-marco-statement{padding:clamp(6rem, 10vw, 11rem) 0;background:var(--paper-dark);
color:var(--paper);border-top:1px solid var(--ink)}
.prg-marco-statement__inner{max-width:880px;margin:0 auto;text-align:center;padding:0 var(--gutter)}
.prg-marco-statement__eyebrow{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--paper-60);
display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:2.6rem}
.prg-marco-statement__eyebrow::before,.prg-marco-statement__eyebrow::after{
content:'';width:22px;height:1px;background:var(--red)}
.prg-marco-statement__quote{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.9rem, 1.2rem + 2.2vw, 3.2rem);line-height:1.22;
letter-spacing:-0.012em;color:var(--paper);margin-bottom:2.6rem}
.prg-marco-statement__quote em{font-style:normal;color:var(--red);font-weight:500}
.prg-marco-statement__cite{font-family:var(--label);font-weight:500;font-size:0.66rem;
letter-spacing:0.34em;text-transform:uppercase;color:var(--paper-60)}
/* MARCO PROSE */
.prg-marco-prose{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-deep);border-top:1px solid var(--rule)}
.prg-marco-prose__inner{max-width:680px;margin:0 auto}
.prg-marco-prose__head{margin-bottom:2.4rem}
.prg-marco-prose__head .h-section{font-size:clamp(2rem, 1.4rem + 1.6vw, 2.8rem);line-height:1.2}
.prg-marco-prose__body p{font-family:var(--body);font-size:1.18rem;line-height:1.62;
color:var(--ink);margin-bottom:1.4em}
.prg-marco-prose__body p:last-child{margin-bottom:0}
.prg-marco-prose__body em{font-style:italic;color:var(--ink)}
/* APPRENTICESHIP STD ENHANCEMENTS */
.std__tagline{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1.15rem;color:var(--red);margin:0.4rem 0 1.4rem;letter-spacing:0.005em}
.std__modules-section{margin-top:2.8rem;padding-top:2.4rem;border-top:1px solid var(--rule)}
.std__modules-label{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--ink-60);margin-bottom:1.6rem}
.std__modules-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0.8rem}
.std__module{padding:1.1rem 1rem;background:var(--paper-cool);
display:flex;align-items:flex-start;gap:0.9rem;border:1px solid var(--rule)}
.std__module-num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.05rem;line-height:1;color:var(--red);min-width:1.2rem}
.std__module-name{font-family:var(--body);font-size:0.95rem;line-height:1.32;color:var(--ink)}
@media(max-width:900px){.std__modules-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.std__modules-grid{grid-template-columns:1fr}}
.std__includes{margin-top:1.6rem;padding:1.6rem 1.4rem;background:var(--paper-deep);
border-left:2px solid var(--red)}
.std__includes-label{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);margin-bottom:1rem;display:block}
.std__includes-item{font-family:var(--body);font-size:0.98rem;line-height:1.42;color:var(--ink);
padding:0.7rem 0;border-bottom:1px solid var(--rule);display:block}
.std__includes-item:last-child{border-bottom:0;padding-bottom:0}
.std__includes-item:first-of-type{padding-top:0}
.std__includes-item em{font-style:italic;color:var(--red)}
/* PARTNERSHIP (kept from previous build) */
.prg-partner{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-dark);color:var(--paper);border-top:1px solid var(--ink)}
.prg-partner__head{text-align:center;max-width:880px;margin:0 auto 3rem}
.prg-partner__head .h-section{color:var(--paper)}
.prg-partner__head .h-section em{color:var(--red)}
.prg-partner__head .eyebrow{color:var(--paper-60)}
.prg-partner__head .eyebrow::before{background:var(--red)}
.prg-partner__intro{max-width:680px;margin:0 auto 4rem;font-family:var(--body);
font-size:1.18rem;line-height:1.62;color:var(--paper);text-align:center}
.prg-partner__intro em{font-style:italic;color:var(--paper)}
.prg-clients{margin:0 auto;max-width:980px;text-align:center}
.prg-clients__label{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--paper-60);margin-bottom:2.4rem}
.prg-clients__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem 2.4rem;
border-top:1px solid var(--paper-rule);border-bottom:1px solid var(--paper-rule);padding:2.4rem 0}
.prg-clients__grid span{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1.15rem;color:var(--paper);letter-spacing:-0.005em}
@media(max-width:760px){.prg-clients__grid{grid-template-columns:repeat(2,1fr);gap:1.2rem}}
/* HOW IT WORKS */
.prg-how{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper);border-top:1px solid var(--rule)}
.prg-how__head{text-align:center;max-width:780px;margin:0 auto 4rem}
.prg-how__steps{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem;max-width:980px;margin:0 auto 3.6rem}
.prg-how__step{padding:1.8rem 1.6rem;border:1px solid var(--rule);background:var(--paper-cool)}
.prg-how__step-num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.6rem;line-height:1;color:var(--red);display:block;margin-bottom:0.7rem}
.prg-how__step-title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.25rem;color:var(--ink);margin-bottom:0.8rem;line-height:1.25}
.prg-how__step-body{font-family:var(--body);font-size:1rem;line-height:1.55;color:var(--ink-soft)}
.prg-how__academy{margin:0 auto;max-width:980px;padding:clamp(2.4rem,3vw,3.6rem);
background:var(--paper-dark);color:var(--paper)}
.prg-how__academy-eyebrow{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--paper-60);
display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:1.6rem}
.prg-how__academy-eyebrow::before{content:'';width:22px;height:1px;background:var(--red)}
.prg-how__academy h3{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.5rem, 1.1rem + 1vw, 2rem);line-height:1.25;color:var(--paper);margin-bottom:1.6rem}
.prg-how__academy h3 em{font-style:normal;color:var(--red);font-weight:500}
.prg-how__academy-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.4rem;margin-top:2rem}
.prg-how__academy-item{padding-top:1.6rem;border-top:1px solid var(--paper-rule)}
.prg-how__academy-item h4{font-family:var(--display);font-weight:500;font-style:italic;
color:var(--paper);font-size:1.2rem;margin-bottom:0.8rem}
.prg-how__academy-item p{font-family:var(--body);font-size:1rem;line-height:1.6;color:var(--paper);margin-bottom:0.8em}
.prg-how__academy-item p:last-child{margin-bottom:0}
.prg-how__academy-item em{font-style:italic;color:var(--paper)}
@media(max-width:760px){.prg-how__steps,.prg-how__academy-grid{grid-template-columns:1fr}}
/* FUNDING */
.prg-funding-section{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-deep);border-top:1px solid var(--rule)}
.prg-funding-section__inner{max-width:760px;margin:0 auto;text-align:center}
.prg-funding-section__head{margin-bottom:3rem}
.prg-funding-section__body{font-family:var(--body);font-size:1.12rem;line-height:1.62;color:var(--ink);text-align:left;max-width:640px;margin:0 auto}
.prg-funding-section__body p{margin-bottom:1.4em}
.prg-funding-section__body p:last-child{margin-bottom:0}
.prg-funding-section__body em{font-style:normal;color:var(--red);font-weight:500}
/* ----- TLC LINK BUTTON (subtle outbound link to TLC subpage) ----- */
.tlc-link{display:inline-flex;align-items:center;gap:0.6rem;font-family:var(--label);
font-weight:500;font-size:0.62rem;letter-spacing:0.32em;text-transform:uppercase;
color:var(--ink-soft);padding:0.7rem 0;border-bottom:1px solid var(--rule);cursor:pointer;
background:transparent;border-top:0;border-left:0;border-right:0;border-bottom:1px solid var(--rule)}
.tlc-link:hover{color:var(--red);border-bottom-color:var(--red)}
.tlc-link .arrow{font-size:0.85rem}
.tlc-link--paper{color:var(--paper-60);border-bottom-color:var(--paper-rule)}
.tlc-link--paper:hover{color:var(--red);border-bottom-color:var(--red)}
/* ----- TLC SUBPAGE ----- */
.tlc-page{padding-top:calc(var(--nav-h) + 4rem)}
.tlc-page .wrap{max-width:920px}
.tlc-hero{padding:clamp(4rem, 6vw, 7rem) 0 clamp(3rem,4vw,5rem)}
.tlc-hero__back{font-family:var(--label);font-weight:500;font-size:0.6rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--ink-soft);background:transparent;border:0;padding:0;cursor:pointer;
display:inline-flex;align-items:center;gap:0.6rem;margin-bottom:2.4rem}
.tlc-hero__back:hover{color:var(--red)}
.tlc-hero__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:1.6rem}
.tlc-hero__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.tlc-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem, 1.8rem + 2vw, 4rem);line-height:1.05;letter-spacing:-0.012em;
color:var(--ink);margin-bottom:2rem}
.tlc-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.tlc-hero__lede{font-family:var(--body);font-size:1.18rem;line-height:1.6;color:var(--ink);max-width:42em}
.tlc-hero__lede em{font-style:italic;color:var(--ink)}
.tlc-creds{padding:clamp(3rem,4vw,4.5rem) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.tlc-creds__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-left:1px solid var(--rule)}
.tlc-creds__item{padding:1.4rem 1.8rem;border-right:1px solid var(--rule)}
.tlc-creds__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:clamp(1.6rem,1.2rem+1vw,2.1rem);line-height:1;color:var(--red);margin-bottom:0.6rem}
.tlc-creds__label{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-soft)}
@media(max-width:760px){.tlc-creds__grid{grid-template-columns:1fr}}
.tlc-section{padding:clamp(3rem,4vw,4.5rem) 0;border-bottom:1px solid var(--rule)}
.tlc-section__head{margin-bottom:2.2rem}
.tlc-section__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.7rem,1.3rem+1.2vw,2.4rem);line-height:1.2;color:var(--ink);letter-spacing:-0.01em}
.tlc-section__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.tlc-section__body{font-family:var(--body);font-size:1.1rem;line-height:1.62;color:var(--ink);max-width:42em}
.tlc-section__body p{margin-bottom:1.4em}
.tlc-section__body p:last-child{margin-bottom:0}
.tlc-section__body em{font-style:italic;color:var(--ink)}
.tlc-section__body strong{font-weight:500;color:var(--red);font-style:normal}
.tlc-clients-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem 2rem;
margin-top:1.6rem;padding-top:2rem;border-top:1px solid var(--rule)}
.tlc-clients-grid span{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1.05rem;color:var(--ink);letter-spacing:-0.005em}
@media(max-width:760px){.tlc-clients-grid{grid-template-columns:repeat(2,1fr);gap:1rem 1.2rem}}
.tlc-funding-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.6rem}
.tlc-funding-flow__step{padding:1.4rem;background:var(--paper-cool);border:1px solid var(--rule)}
.tlc-funding-flow__num{font-family:var(--display);font-weight:500;font-style:italic;font-size:1.2rem;
color:var(--red);margin-bottom:0.5rem;display:block}
.tlc-funding-flow__title{font-family:var(--display);font-style:italic;font-size:1.05rem;
color:var(--ink);margin-bottom:0.6rem;font-weight:500}
.tlc-funding-flow__body{font-family:var(--body);font-size:0.92rem;line-height:1.5;color:var(--ink)}
@media(max-width:760px){.tlc-funding-flow{grid-template-columns:1fr}}
.tlc-out{padding:clamp(3rem,5vw,5rem) 0}
.tlc-out__inner{text-align:center;max-width:540px;margin:0 auto}
.tlc-out__title{font-family:var(--display);font-weight:400;font-style:italic;font-size:1.6rem;
color:var(--ink);margin-bottom:1.4rem}
.tlc-out__body{font-family:var(--body);font-size:1.05rem;line-height:1.55;color:var(--ink-soft);margin-bottom:2rem}
/* ----- EXCELLENCE EARNED — second Marco voice section ----- */
.prg-earned{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper);border-top:1px solid var(--rule)}
.prg-earned__inner{max-width:680px;margin:0 auto}
.prg-earned__head{margin-bottom:2.4rem}
.prg-earned__head .eyebrow{color:var(--red)}
.prg-earned__head .eyebrow::before{background:var(--red)}
.prg-earned__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.9rem, 1.4rem + 1.4vw, 2.6rem);line-height:1.18;letter-spacing:-0.012em;
color:var(--ink);margin-top:1.4rem}
.prg-earned__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.prg-earned__body p{font-family:var(--body);font-size:1.18rem;line-height:1.62;
color:var(--ink);margin-bottom:1.4em}
.prg-earned__body p:last-child{margin-bottom:0}
.prg-earned__body em{font-style:italic;color:var(--ink)}
.prg-earned__pullquote{margin:3rem 0;padding:2.4rem 0;border-top:1px solid var(--rule);
border-bottom:1px solid var(--rule);text-align:center}
.prg-earned__pullquote p{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.6rem, 1.2rem + 1.2vw, 2.4rem);line-height:1.22;letter-spacing:-0.012em;
color:var(--ink);margin:0 auto;max-width:18em}
.prg-earned__pullquote p em{font-style:normal;color:var(--red);font-weight:500}
.prg-earned__pullquote-cite{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--ink-soft);margin-top:1.4rem;display:block}
/* ----- TLC RECEIVE/REQUIRE — practical employer info on TLC page ----- */
/* Boxed "what hosting requires" panel: inset the text from the panel edges,
centre the content column inside it and leave a margin below the panel */
.tlc-section--exchange{background:var(--paper-cool);border-bottom:0;
padding:clamp(2.5rem,4vw,4rem) clamp(1.5rem,5vw,4rem) clamp(3rem,5vw,4.5rem);
margin:0 0 clamp(2.5rem,4vw,4rem)}
.tlc-section--exchange .tlc-section__head,
.tlc-section--exchange .tlc-section__body{max-width:46em;margin-left:auto;margin-right:auto}
.tlc-section--exchange .tlc-section__head{text-align:center;margin-bottom:2rem}
.tlc-section--exchange .tlc-exchange-grid{gap:3rem}
.tlc-exchange-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.4rem;margin-top:1.6rem}
.tlc-exchange-block h3{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.25rem;color:var(--red);margin-bottom:1.2rem}
.tlc-exchange-block p{font-family:var(--body);font-size:1rem;line-height:1.6;color:var(--ink);margin-bottom:1.1em}
.tlc-exchange-block p:last-child{margin-bottom:0}
.tlc-exchange-block em{font-style:italic;color:var(--ink)}
@media(max-width:760px){.tlc-exchange-grid{grid-template-columns:1fr}}
/* ----- ACCREDITATION PILL on programme cards ----- */
.std__credential{display:inline-block;font-family:var(--label);font-weight:500;
font-size:0.6rem;letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
padding:0.6rem 0;margin-bottom:0.8rem;border-bottom:1px solid var(--red);
border-top:1px solid var(--red)}
.std__route-meta{display:flex;flex-wrap:wrap;gap:0.4rem 1.2rem;align-items:baseline;
font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--ink-soft);margin-top:0.4rem;margin-bottom:1.4rem}
.std__route-meta-item{display:inline-flex;gap:0.4rem;align-items:baseline}
.std__route-meta-key{color:var(--ink-soft)}
.std__route-meta-val{color:var(--ink)}
/* ----- REGISTER SUBPAGE ----- */
.reg-page{padding-top:calc(var(--nav-h) + 4rem)}
.reg-page .wrap{max-width:760px}
.reg-hero{padding:clamp(4rem,6vw,7rem) 0 clamp(3rem,4vw,5rem);text-align:center}
.reg-hero__back{font-family:var(--label);font-weight:500;font-size:0.6rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--ink-soft);background:transparent;border:0;padding:0;cursor:pointer;
display:inline-flex;align-items:center;gap:0.6rem;margin-bottom:2.4rem}
.reg-hero__back:hover{color:var(--red)}
.reg-hero__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:1.6rem}
.reg-hero__meta::before,.reg-hero__meta::after{content:'';width:22px;height:1px;background:var(--red)}
.reg-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem,1.8rem+2vw,3.6rem);line-height:1.1;letter-spacing:-0.012em;
color:var(--ink);margin-bottom:2rem}
.reg-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.reg-status{display:inline-block;padding:0.6rem 1.4rem;border:1px solid var(--red);
font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--red);margin:1.6rem auto 2.4rem}
.reg-body{padding:clamp(2rem,3vw,3rem) 0 clamp(5rem,8vw,8rem);text-align:center}
.reg-body p{font-family:var(--body);font-size:1.18rem;line-height:1.62;color:var(--ink);
margin:0 auto 1.4em;max-width:38em}
.reg-body p:last-child{margin-bottom:0}
.reg-body em{font-style:italic;color:var(--ink)}
/* ----- THE STANDARD PAGE — bridge treatments ----- */
.stdp-bridge{padding:clamp(3rem,5vw,5rem) 0;background:var(--paper);text-align:center;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.stdp-bridge__text{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.3rem,1rem+0.8vw,1.7rem);line-height:1.35;color:var(--ink);
letter-spacing:-0.008em;max-width:36em;margin:0 auto}
.stdp-bridge__text em{font-style:normal;color:var(--red);font-weight:500}
/* REALITIES BLOCK — grid using principles-style styling */
.stdp-realities{padding:clamp(5rem,8vw,9rem) 0;background:var(--paper-deep);border-top:1px solid var(--rule)}
.stdp-realities__head{text-align:center;max-width:720px;margin:0 auto clamp(3rem,5vw,4rem)}
.stdp-realities__lede{font-family:var(--body);font-size:1.18rem;line-height:1.6;color:var(--ink);
margin-top:1.8rem;max-width:52ch;margin-left:auto;margin-right:auto}
.stdp-realities__lede em{font-style:italic;color:var(--ink)}
.stdp-realities__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;max-width:1100px;
margin:0 auto;background:var(--rule);padding:1px}
.stdp-realities__item{padding:2.2rem 1.8rem;background:var(--paper)}
.stdp-realities__label{font-family:var(--display);font-weight:500;font-style:italic;font-size:1.3rem;
color:var(--red);margin-bottom:0.9rem;display:block}
.stdp-realities__body{font-family:var(--body);font-size:1rem;line-height:1.55;color:var(--ink)}
.stdp-realities__summary{max-width:620px;margin:4rem auto 0;text-align:center}
.stdp-realities__summary p{font-family:var(--display);font-weight:400;font-style:italic;font-size:1.35rem;
line-height:1.35;color:var(--ink);letter-spacing:-0.008em}
.stdp-realities__summary p em{font-style:normal;color:var(--red);font-weight:500}
@media(max-width:900px){.stdp-realities__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.stdp-realities__grid{grid-template-columns:1fr}}
/* CONTINUE BLOCK */
/* ----- STANDARD PAGE — "What it looks like" editorial ----- */
.stdp-looks{padding:clamp(5rem,9vw,10rem) 0;background:var(--paper);border-top:1px solid var(--rule)}
.stdp-looks__inner{max-width:680px;margin:0 auto}
.stdp-looks__head{margin-bottom:2.8rem}
.stdp-looks__head .eyebrow{margin-bottom:1.4rem}
.stdp-looks__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem,1.4rem+1.8vw,2.8rem);line-height:1.18;letter-spacing:-0.01em;color:var(--ink)}
.stdp-looks__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.stdp-looks__body{font-family:var(--body);font-weight:400;font-size:1.22rem;line-height:1.62;
color:var(--ink-soft)}
.stdp-looks__body p{margin-bottom:1.4em}
.stdp-looks__body p:last-child{margin-bottom:0}
.stdp-looks__body p:first-child::first-letter{font-family:var(--display);font-style:italic;
font-weight:400;font-size:3.4em;line-height:0.82;float:left;margin:0.08em 0.08em 0 0;color:var(--red)}
.stdp-looks__body em{font-style:italic;color:var(--ink)}
.stdp-looks__body strong{font-weight:500;color:var(--red);font-style:normal}
.stdp-looks__inset{margin:2.4rem 0;padding:1.8rem 0 1.8rem 2rem;border-left:2px solid var(--red)}
.stdp-looks__inset p{font-family:var(--display);font-weight:400;font-style:italic;
font-size:1.25rem;line-height:1.35;color:var(--ink);margin:0}
.stdp-looks__inset-cite{font-family:var(--label);font-weight:500;font-size:0.6rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--ink-soft);display:block;margin-top:1.2rem}
/* SHOWPIECE PULL-QUOTE (closing) */
/* ----- STANDARD PAGE POLISH ----- */
/* ===========================================================
THE SHOWPIECE — closing climactic quote on the Standard page
Simple, robust, heroic-scale typography
=========================================================== */
.showpiece{
background:var(--paper-dark);
color:var(--paper);
padding:clamp(6rem,10vw,11rem) clamp(1.5rem,4vw,3rem);
text-align:center;
border-top:1px solid var(--ink);
border-bottom:1px solid var(--ink);
position:relative;
}
.showpiece::before{
content:'';
position:absolute;
top:0;
left:50%;
transform:translateX(-50%);
width:40px;
height:2px;
background:var(--red);
margin-top:-1px;
}
.showpiece__inner{
max-width:1600px;
margin:0 auto;
}
.showpiece__eyebrow{
font-family:var(--label);
font-weight:500;
font-size:0.66rem;
letter-spacing:0.32em;
text-transform:uppercase;
color:var(--paper-60);
display:inline-flex;
align-items:center;
gap:0.9rem;
margin-bottom:2.6rem;
}
.showpiece__eyebrow::before,
.showpiece__eyebrow::after{
content:'';
width:24px;
height:1px;
background:var(--red);
}
.showpiece__quote{
font-family:var(--display);
font-weight:400;
font-style:italic;
font-size:clamp(2.6rem, 1.7rem + 2.8vw, 5rem);
line-height:1.1;
letter-spacing:-0.018em;
color:var(--paper);
margin:0 auto 3rem;
text-wrap:balance;
}
.showpiece__quote em{
font-style:normal;
color:var(--red);
font-weight:500;
}
.showpiece__cite{
font-family:var(--label);
font-weight:500;
font-size:0.7rem;
letter-spacing:0.34em;
text-transform:uppercase;
color:var(--paper-60);
}
.stdp-looks__intro{font-family:var(--body);font-style:italic;font-weight:400;
font-size:1.22rem;line-height:1.55;color:var(--ink-soft);margin-top:1.8rem;max-width:44ch}
/* Promoted pull-quote — full-width, prominent */
.stdp-looks__pull{margin:3.4rem -1rem;padding:2.6rem 2rem;background:var(--paper-cool);
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);text-align:center}
.stdp-looks__pull p{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.45rem,1.15rem+0.8vw,1.8rem);line-height:1.3;color:var(--ink);
margin:0 auto 1.2rem;max-width:26em;letter-spacing:-0.006em}
.stdp-looks__pull p em{font-style:normal;color:var(--red);font-weight:500}
.stdp-looks__pull-cite{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--ink-soft);display:block}
/* Remove drop-cap (was orphaned) */
.stdp-looks__body p:first-child::first-letter{font-size:inherit !important;float:none !important;
margin:0 !important;color:inherit !important;font-family:inherit !important;font-style:inherit !important;
line-height:inherit !important}
/* Showpiece breathing room — add extra top padding */
/* Standard page visual break */
.stdp-visual{padding:0;background:var(--paper-dark);overflow:hidden;position:relative}
.stdp-visual__frame{position:relative;width:100%;aspect-ratio:21/9;max-height:540px;overflow:hidden}
.stdp-visual__frame img{width:100%;height:100%;object-fit:cover;display:block;
filter:saturate(0.85) contrast(1.02)}
.stdp-visual__caption{position:absolute;bottom:1.6rem;left:1.6rem;
font-family:var(--label);font-weight:500;font-size:0.58rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--paper);opacity:0.8}
/* ================================================================
THE LEARNING COLLECTION — book covers (Option C: gold/gold/crimson)
Used on home page volume grid, and on Collection page vol__cover slots
================================================================ */
:root{
--cover-cream: #EDE5D2;
--cover-charcoal: #2F2F2F;
--cover-gold-deep: #A88547;
--cover-crimson: #8B1A1A;
--cover-lgrey: #888888;
}
.book-cover{
aspect-ratio:5/7;
display:flex;flex-direction:column;
padding:1.4rem 1.2rem 1.2rem;
background:var(--cover-cream);
color:var(--cover-charcoal);
/* Border and shadow tuned to context — see overrides for paper grounds below */
border:1px solid rgba(60,40,20,0.10);
box-shadow:
0 1px 0 rgba(168,133,71,0.18),
0 6px 16px rgba(60,40,20,0.08),
0 1px 3px rgba(60,40,20,0.06);
position:relative;
overflow:hidden;
text-align:center;
font-family:'Playfair Display',Georgia,serif;
text-decoration:none;
}
/* When cover sits on a dark ground (e.g. dark Collection vol section, or anywhere wrapped in
.section--dark / .vol--dark), restore the original crisper shadow + border that lift it off */
.section--dark .book-cover,
.vol--dark .book-cover{
border:1px solid rgba(11,11,11,0.18);
box-shadow:0 8px 24px rgba(0,0,0,0.30), 0 2px 6px rgba(0,0,0,0.18);
}
.book-cover::before{
content:'';position:absolute;inset:0;
background-image:url("data:image/svg+xml;utf8,");
opacity:0.45;pointer-events:none;mix-blend-mode:multiply;
}
.book-cover::after{
content:'';position:absolute;inset:0;
background:radial-gradient(ellipse at center, transparent 60%, rgba(0,0,0,0.06) 100%);
pointer-events:none;
}
.book-cover__top-mark{
font-family:'Playfair Display SC','Cormorant SC',Georgia,serif;
font-size:0.7rem;letter-spacing:0.36em;line-height:1.8;
color:var(--cover-charcoal);opacity:0.72;
position:relative;z-index:2;
}
.book-cover--lg .book-cover__top-mark{font-size:0.95rem}
.book-cover__top-rule{
width:22px;height:1px;background:var(--cover-gold-deep);
margin:0.7rem auto 0;position:relative;z-index:2;
}
.book-cover--lg .book-cover__top-rule{width:32px;margin-top:1.4rem}
.book-cover__numeral{
margin:auto 0;
font-family:'Playfair Display',Georgia,serif;
font-style:italic;font-weight:400;
color:var(--cover-gold-deep);
line-height:0.9;font-size:4.5rem;
position:relative;z-index:2;
}
.book-cover--lg .book-cover__numeral{font-size:7rem}
.book-cover__symbol{
margin:0.8rem auto;
width:22px;height:22px;
position:relative;z-index:2;
}
.book-cover--lg .book-cover__symbol{width:36px;height:36px;margin:1.2rem auto}
.book-cover__symbol svg{width:100%;height:100%}
.book-cover__symbol svg *{fill:none;stroke:var(--cover-gold-deep);stroke-width:0.7}
.book-cover--lg .book-cover__symbol svg *{stroke-width:0.8}
.book-cover__symbol svg .fill{fill:var(--cover-gold-deep);stroke:none}
.book-cover__title{
font-family:'Playfair Display',Georgia,serif;
font-weight:400;font-size:0.95rem;line-height:1.1;
color:var(--cover-charcoal);letter-spacing:0.02em;
margin-bottom:0.4rem;position:relative;z-index:2;
}
.book-cover--lg .book-cover__title{font-size:1.5rem}
.book-cover__title em{font-style:italic;color:var(--cover-crimson);font-weight:400}
.book-cover__brand{
font-family:'Playfair Display SC','Cormorant SC',Georgia,serif;
font-size:0.42rem;letter-spacing:0.22em;
color:var(--cover-lgrey);
margin-top:0.5rem;position:relative;z-index:2;
white-space:nowrap;
}
.book-cover--lg .book-cover__brand{font-size:0.62rem;letter-spacing:0.36em;margin-top:0.8rem}
/* Override the existing .volume styling on home page when wrapped as book-cover */
a.volume.book-cover{padding:1.4rem 1.2rem 1.2rem;background:var(--cover-cream)}
a.volume.book-cover:hover{transform:translateY(-2px);transition:transform .25s ease}
/* ---- TLC PAGE — At Scale section ---- */
/* Break out of .tlc-page .wrap (max-width:920px) so we can use page width */
.hiw-scale{padding:clamp(5rem,8vw,9rem) 0;background:var(--paper-deep);
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
width:100vw;position:relative;left:50%;right:50%;
margin-left:-50vw;margin-right:-50vw}
.hiw-scale > .wrap{max-width:1320px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem)}
.hiw-scale__head{max-width:760px;margin:0 auto 3.6rem;text-align:center}
.hiw-scale__head .eyebrow{display:inline-flex;margin-bottom:1.4rem}
.hiw-scale__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem,1.4rem+1.6vw,2.8rem);line-height:1.1;letter-spacing:-0.012em;
color:var(--ink);margin-bottom:1.6rem}
.hiw-scale__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.hiw-scale__intro{font-family:var(--body);font-size:1.12rem;line-height:1.55;
color:var(--ink-soft);max-width:60ch;margin:0 auto;font-style:italic}
.hiw-scale__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;
max-width:1280px;margin:0 auto}
@media (max-width:980px){.hiw-scale__grid{grid-template-columns:1fr;gap:1.4rem}}
.hiw-scale__tier{background:var(--paper);padding:2.6rem 2.2rem;border:1px solid var(--rule);
display:flex;flex-direction:column;position:relative}
.hiw-scale__tier--featured{background:var(--ink);color:var(--paper);
border-color:var(--ink)}
.hiw-scale__tier-eyebrow{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);margin-bottom:1rem}
.hiw-scale__tier--featured .hiw-scale__tier-eyebrow{color:var(--red)}
.hiw-scale__tier-num{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem,2rem+2.4vw,4.4rem);line-height:1;color:var(--ink);
margin-bottom:0.4rem;letter-spacing:-0.02em}
.hiw-scale__tier--featured .hiw-scale__tier-num{color:var(--paper)}
.hiw-scale__tier-label{font-family:var(--label);font-weight:500;font-size:0.66rem;
letter-spacing:0.28em;text-transform:uppercase;color:var(--ink-soft);
margin-bottom:1.8rem;padding-bottom:1.4rem;border-bottom:1px solid var(--rule)}
.hiw-scale__tier--featured .hiw-scale__tier-label{color:var(--paper-60);
border-bottom-color:rgba(245,245,245,0.18)}
/* The new itemised list — single line per benefit, hairline-separated */
.hiw-scale__tier-list{list-style:none;padding:0;margin:0;flex-grow:1;
display:flex;flex-direction:column}
.hiw-scale__tier-list li{font-family:var(--body);font-size:1rem;line-height:1.4;
color:var(--ink-soft);padding:1rem 0;border-top:1px solid var(--rule);
display:flex;align-items:flex-start;gap:0.7rem}
.hiw-scale__tier-list li:first-child{border-top:none;padding-top:0}
.hiw-scale__tier-list li::before{content:"";flex-shrink:0;width:14px;height:1px;
background:var(--red);margin-top:0.7rem}
.hiw-scale__tier-list li em{font-style:italic;color:var(--ink)}
.hiw-scale__tier-list li strong{font-weight:500;font-style:normal;color:var(--red)}
.hiw-scale__tier--featured .hiw-scale__tier-list li{color:var(--paper-60);
border-top-color:rgba(245,245,245,0.18)}
.hiw-scale__tier--featured .hiw-scale__tier-list li em{color:var(--paper)}
/* Section opener — the "everything above plus" line */
.hiw-scale__tier-includes{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.24em;text-transform:uppercase;color:var(--ink-soft);
margin-bottom:1.2rem;padding-bottom:1.2rem;border-bottom:1px solid var(--rule)}
.hiw-scale__tier-includes em{font-style:normal;color:var(--red);font-weight:500;letter-spacing:inherit}
.hiw-scale__tier--featured .hiw-scale__tier-includes{color:var(--paper-60);
border-bottom-color:rgba(245,245,245,0.18)}
/* ================================================================
THE ACADEMY PAGE — chef-facing (rebuilt around "what you become")
================================================================ */
.acap{color:var(--ink)}
/* HERO */
.acap-hero{padding:clamp(6rem,9vw,10rem) 0 clamp(3rem,5vw,5rem);background:var(--paper-deep);
text-align:center;border-bottom:1px solid var(--rule);position:relative;overflow:hidden}
.acap-hero__ghost{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
font-family:var(--display);font-style:italic;font-weight:300;
font-size:clamp(20rem,42vw,40rem);line-height:0.85;letter-spacing:-0.04em;
color:var(--ink);opacity:0.05;pointer-events:none;user-select:none}
.acap-hero__inner{position:relative;z-index:1;max-width:880px;margin:0 auto}
.acap-hero__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:0.9rem;
margin-bottom:2.4rem}
.acap-hero__meta::before,.acap-hero__meta::after{content:'';width:22px;height:1px;background:var(--red)}
.acap-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem,1.8rem+2.2vw,4rem);line-height:1.05;letter-spacing:-0.014em;
color:var(--ink);margin-bottom:2rem}
.acap-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.acap-hero__lede{font-family:var(--body);font-style:italic;font-size:1.18rem;line-height:1.55;
color:var(--ink);max-width:46ch;margin:0 auto}
/* CHAPTER (chef-facing) */
.acap-chapter{padding:clamp(5rem,8vw,9rem) 0;background:var(--paper)}
.acap-chapter--alt{background:var(--paper-deep)}
.acap-chapter__inner{max-width:680px;margin:0 auto}
.acap-chapter__head{margin-bottom:2.6rem}
.acap-chapter__head .eyebrow{display:inline-flex;margin-bottom:1.4rem}
.acap-chapter__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem,1.4rem+1.8vw,2.8rem);line-height:1.18;letter-spacing:-0.01em;color:var(--ink)}
.acap-chapter__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.acap-chapter__body{font-family:var(--body);font-size:1.18rem;line-height:1.62;color:var(--ink)}
.acap-chapter__body p{margin-bottom:1.4em}
.acap-chapter__body p:last-child{margin-bottom:0}
.acap-chapter__body em{font-style:italic;color:var(--ink)}
.acap-chapter__body strong{font-weight:500;color:var(--red);font-style:normal}
/* MOVEMENT (numbered subsection within a chapter) */
.acap-movement{margin:2.6rem 0;padding-top:2rem;border-top:1px solid var(--rule)}
.acap-movement:first-of-type{margin-top:1rem}
.acap-movement__num{font-family:var(--label);font-weight:500;font-size:0.6rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--red);margin-bottom:0.9rem;display:inline-block}
.acap-movement__claim{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.4rem,1.1rem+0.7vw,1.7rem);line-height:1.25;color:var(--ink);
letter-spacing:-0.008em;margin-bottom:1.2rem}
.acap-movement__claim em{font-style:normal;color:var(--red);font-weight:500}
.acap-movement__body{font-family:var(--body);font-size:1.08rem;line-height:1.6;color:var(--ink-soft)}
.acap-movement__body em{font-style:italic;color:var(--ink)}
/* MARCO QUOTE — single emotional anchor */
.acap-quote{padding:clamp(5rem,8vw,9rem) 0;background:var(--paper-dark);color:var(--paper);
text-align:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.acap-quote__inner{max-width:800px;margin:0 auto;padding:0 var(--gutter)}
.acap-quote__eyebrow{font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.32em;
text-transform:uppercase;color:var(--paper-60);display:inline-flex;align-items:center;gap:0.9rem;
margin-bottom:2.6rem}
.acap-quote__eyebrow::before,.acap-quote__eyebrow::after{content:'';width:22px;height:1px;background:var(--red)}
.acap-quote__text{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.7rem,1.3rem+1.4vw,2.4rem);line-height:1.22;letter-spacing:-0.012em;color:var(--paper);
margin-bottom:2rem}
.acap-quote__text em{font-style:normal;color:var(--red);font-weight:500}
.acap-quote__cite{font-family:var(--label);font-weight:500;font-size:0.66rem;letter-spacing:0.34em;
text-transform:uppercase;color:var(--paper-60)}
/* OPERATOR-FACING CLOSE — distinct register */
.acap-operator{padding:clamp(5rem,8vw,9rem) 0;background:var(--paper);border-top:1px solid var(--rule)}
.acap-operator__inner{max-width:680px;margin:0 auto}
.acap-operator__head{margin-bottom:2rem;text-align:center}
.acap-operator__head .eyebrow{display:inline-flex;margin-bottom:1.4rem;color:var(--ink-soft)}
.acap-operator__head .eyebrow::before{background:var(--ink-soft)}
.acap-operator__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.6rem,1.2rem+1vw,2.1rem);line-height:1.25;color:var(--ink);letter-spacing:-0.008em}
.acap-operator__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.acap-operator__body{font-family:var(--body);font-size:1.1rem;line-height:1.6;color:var(--ink-soft);
text-align:center}
.acap-operator__body p{margin-bottom:1.2em}
.acap-operator__body p:last-child{margin-bottom:0}
.acap-operator__body em{font-style:italic;color:var(--ink)}
/* CTA */
.acap-cta{padding:clamp(4rem,6vw,7rem) 0;background:var(--paper-deep);text-align:center;
border-top:1px solid var(--rule)}
.acap-cta h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.8rem,1.3rem+1.5vw,2.6rem);line-height:1.18;color:var(--ink);
margin-bottom:2rem;letter-spacing:-0.01em}
.acap-cta h2 em{font-style:normal;color:var(--red);font-weight:500}
/* COMMUNITY SUBPAGE — uses Register template */
.com-page{padding-top:calc(var(--nav-h) + 4rem)}
.com-page .wrap{max-width:760px}
/* ----- SECTORS PAGE ----- */
.sec-intro{padding:calc(var(--nav-h) + 5rem) 0 4rem}
.sec-intro__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:2.2rem}
.sec-intro__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.sec-intro__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2.2rem + 3.6vw, 6.4rem);line-height:1;
letter-spacing:-0.022em;margin-bottom:2rem}
.sec-intro__title em{font-style:normal;color:var(--red);font-weight:500}
.sec-intro__lede{font-family:var(--body);font-size:1.25rem;line-height:1.55;
color:var(--ink);max-width:40em}
.sec{position:relative;padding:clamp(5rem, 9vw, 10rem) 0;border-top:1px solid var(--rule)}
.sec--care{background:var(--paper-deep)}
.sec--hosp{background:var(--paper-dark);color:var(--paper);border-top-color:transparent}
.sec--edu{background:var(--paper-cool)}
.sec__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem, 5vw, 6rem);
align-items:center}
.sec--reverse .sec__grid > *:first-child{order:2}
.sec__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:flex;align-items:center;gap:0.9rem;margin-bottom:2rem}
.sec__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.sec__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:0.95rem;color:var(--red);letter-spacing:0.02em;margin-bottom:0.6rem}
.sec__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2rem + 3.2vw, 5.2rem);line-height:1;letter-spacing:-0.022em;
margin-bottom:2rem;color:var(--ink)}
.sec--hosp .sec__title{color:var(--paper)}
.sec__title em{font-style:normal;color:var(--red);font-weight:500}
.sec__quote{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.3rem, 1rem + 0.8vw, 1.8rem);line-height:1.3;color:var(--ink);
padding:1.2rem 0 1.2rem 1.4rem;border-left:2px solid var(--red);
margin-bottom:2rem;max-width:36em}
.sec--hosp .sec__quote{color:var(--paper)}
.sec__quote-cite{display:block;margin-top:0.8rem;font-family:var(--label);
font-weight:500;font-style:normal;font-size:0.6rem;letter-spacing:0.3em;
text-transform:uppercase;color:var(--ink-60)}
.sec--hosp .sec__quote-cite{color:var(--paper-60)}
.sec__body{font-family:var(--body);font-size:1.15rem;line-height:1.6;color:var(--ink);
max-width:42em;margin-bottom:2rem}
.sec--hosp .sec__body{color:var(--paper-60)}
.sec__body p+p{margin-top:1.2em}
.sec__body em{font-style:italic;color:var(--ink)}
.sec--hosp .sec__body em{color:var(--paper)}
.sec__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:1.6rem 0;
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
margin-bottom:2rem;max-width:36em}
.sec--hosp .sec__stats{border-color:var(--paper-rule)}
.sec__stat{padding:0 1rem;border-right:1px solid var(--rule);
display:flex;flex-direction:column;gap:0.2rem;line-height:1.1}
.sec--hosp .sec__stat{border-color:var(--paper-rule)}
.sec__stat:first-child{padding-left:0}
.sec__stat:last-child{border-right:0;padding-right:0}
.sec__stat-num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.5rem;color:var(--red);letter-spacing:-0.01em}
.sec__stat-label{font-family:var(--label);font-weight:400;font-size:0.56rem;
letter-spacing:0.26em;text-transform:uppercase;color:var(--ink-60)}
.sec--hosp .sec__stat-label{color:var(--paper-60)}
.sec__figure .figure__frame{aspect-ratio:4/5}
@media(max-width:900px){
.sec__grid{grid-template-columns:1fr;gap:3rem}
.sec--reverse .sec__grid > *:first-child{order:0}
.sec__figure{max-width:420px}
.sec__stats{grid-template-columns:1fr 1fr;gap:1rem 0}
.sec__stat{border-right:0}
.sec__stat:last-child{grid-column:1/-1;border-top:1px solid var(--rule);
padding-top:1rem;margin-top:0.5rem}
}
.sec__volumes{display:flex;gap:0.4rem;align-items:center;margin-bottom:2rem;flex-wrap:wrap}
.sec__vol-label{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60);margin-right:0.8rem}
.sec--hosp .sec__vol-label{color:var(--paper-60)}
.sec__vol-tag{display:inline-flex;align-items:center;justify-content:center;
width:28px;height:28px;border-radius:50%;background:var(--paper);
border:1px solid var(--ink-25);font-family:var(--display);font-weight:500;
font-style:italic;font-size:0.75rem;color:var(--ink);letter-spacing:0;line-height:1}
.sec--hosp .sec__vol-tag{background:transparent;border-color:var(--paper-40);color:var(--paper)}
/* ----- CARE PAGE (new Sectors page) ----- */
.care-hero{min-height:calc(100vh - var(--nav-h));
padding:calc(var(--nav-h) + 4rem) 0 4rem;
display:flex;align-items:center;position:relative;overflow:hidden}
.care-hero__ghost{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(28rem, 55vw, 72rem);line-height:0.7;color:var(--ink);
opacity:0.028;pointer-events:none;z-index:0;letter-spacing:-0.05em}
.care-hero__inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;text-align:center}
.care-hero__eyebrow{display:inline-flex;align-items:center;gap:0.9rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;letter-spacing:0.34em;
text-transform:uppercase;color:var(--red);margin-bottom:2.4rem}
.care-hero__eyebrow::before,.care-hero__eyebrow::after{content:'';width:28px;height:1px;
background:var(--red)}
.care-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.8rem, 2rem + 4vw, 7rem);line-height:1;letter-spacing:-0.022em;
color:var(--ink);margin-bottom:2.4rem}
.care-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.care-hero__lede{font-family:var(--body);font-style:italic;font-weight:400;
font-size:clamp(1.25rem, 1rem + 0.8vw, 1.7rem);line-height:1.45;color:var(--ink-60);
max-width:46ch;margin:0 auto 3rem}
.care-hero__lede em{color:var(--ink);font-style:normal;font-weight:500}
.care-hero__rule{width:40px;height:1px;background:var(--red);margin:0 auto}
.care-realities{padding:clamp(5rem, 8vw, 8rem) 0;background:var(--paper-deep);
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.care-realities__head{max-width:var(--max-prose);margin-bottom:clamp(3rem, 4vw, 4rem)}
.care-realities__head .eyebrow{margin-bottom:1.4rem}
.care-realities__head h2{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.2rem, 1.6rem + 2vw, 3.6rem);line-height:1.05;
letter-spacing:-0.018em;color:var(--ink);margin-bottom:1.6rem}
.care-realities__head h2 em{font-style:normal;color:var(--red);font-weight:500}
.care-realities__intro{font-family:var(--body);font-size:1.15rem;line-height:1.58;
color:var(--ink);max-width:42em}
.care-realities__intro em{font-style:italic;color:var(--ink)}
.care-list{display:grid;grid-template-columns:1fr 1fr;gap:0;
margin-top:clamp(2.5rem, 4vw, 4rem);
border-top:1px solid var(--rule)}
.care-list__item{padding:1.8rem 0;display:grid;
grid-template-columns:220px 1fr;gap:2rem;
border-bottom:1px solid var(--rule)}
.care-list__item:nth-child(odd){border-right:1px solid var(--rule);padding-right:2.5rem}
.care-list__item:nth-child(even){padding-left:2.5rem}
.care-list__term{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.35rem;line-height:1.15;color:var(--ink);letter-spacing:-0.01em}
.care-list__desc{font-family:var(--body);font-weight:400;font-size:1.02rem;
line-height:1.5;color:var(--ink-60)}
@media(max-width:900px){
.care-list{grid-template-columns:1fr}
.care-list__item{grid-template-columns:1fr;gap:0.5rem;padding:1.4rem 0}
.care-list__item:nth-child(odd){border-right:0;padding-right:0}
.care-list__item:nth-child(even){padding-left:0}
}
.care-realities__close{margin-top:clamp(2.5rem, 4vw, 4rem);max-width:var(--max-prose)}
.care-realities__close p{font-family:var(--body);font-size:1.2rem;line-height:1.55;
color:var(--ink);margin-bottom:1.2em}
.care-realities__close p:last-child{font-family:var(--display);font-style:italic;
font-weight:400;font-size:1.45rem;line-height:1.35;color:var(--ink);
border-left:2px solid var(--red);padding-left:1.4rem;margin-top:2rem;margin-bottom:0}
.care-realities__close p:last-child em{font-style:normal;color:var(--red);font-weight:500}
.care-pullquote{padding:clamp(5rem, 9vw, 10rem) 0;background:var(--paper-dark);
color:var(--paper);text-align:center}
.care-pullquote__text{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem, 1.3rem + 2.4vw, 3.6rem);line-height:1.2;
letter-spacing:-0.015em;color:var(--paper);max-width:22ch;margin:0 auto 2.4rem}
.care-pullquote__text em{color:var(--red);font-style:normal;font-weight:500}
.care-pullquote__cite{display:inline-flex;align-items:center;gap:0.9rem;
font-family:var(--label);font-weight:500;font-size:0.68rem;letter-spacing:0.34em;
text-transform:uppercase;color:var(--paper-60)}
.care-pullquote__cite::before{content:'';width:28px;height:1px;background:var(--paper-40)}
.care-pullquote__note{margin-top:1rem;font-family:var(--body);font-style:italic;
font-size:0.9rem;color:var(--paper-40);max-width:40ch;margin-left:auto;margin-right:auto}
.sec-close{padding:clamp(5rem, 8vw, 9rem) 0;text-align:center;
background:var(--paper)}
.sec-close__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.2rem, 1.6rem + 2vw, 3.8rem);line-height:1.1;
letter-spacing:-0.02em;color:var(--ink);max-width:22ch;margin:0 auto 2.2rem}
.sec-close__title em{font-style:normal;color:var(--red);font-weight:500}
/* ----- HOW IT WORKS PAGE ----- */
.hiw-hero{padding:calc(var(--nav-h) + 5rem) 0 4rem}
.hiw-hero__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:2.2rem}
.hiw-hero__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.hiw-hero__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(3rem, 2.2rem + 3.6vw, 6.4rem);line-height:0.98;
letter-spacing:-0.022em;margin-bottom:2rem}
.hiw-hero__title em{font-style:normal;color:var(--red);font-weight:500}
.hiw-hero__lede{font-family:var(--body);font-size:1.25rem;line-height:1.55;
color:var(--ink);max-width:38em}
.hiw-hero__lede em{color:var(--red);font-style:italic;font-weight:500}
.partnership{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-deep)}
.partnership__head{text-align:center;max-width:680px;margin:0 auto clamp(3rem, 5vw, 5rem)}
.partnership__diagram{max-width:1100px;margin:0 auto;padding:0 var(--gutter)}
.partnership__grid{display:grid;grid-template-columns:repeat(3, 1fr);
gap:clamp(1rem, 2vw, 2.5rem);position:relative}
.partnership__card{background:var(--paper);padding:2.6rem 1.8rem;
border:1px solid var(--rule);display:flex;flex-direction:column;gap:1rem;
position:relative;text-align:center}
.partnership__icon{width:56px;height:56px;margin:0 auto;
display:flex;align-items:center;justify-content:center;border-radius:50%;
background:var(--paper-cool);color:var(--red);border:1px solid var(--red)}
.partnership__icon svg{width:22px;height:22px}
.partnership__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:0.95rem;color:var(--red);letter-spacing:0.02em}
.partnership__name{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.45rem;line-height:1.15;color:var(--ink);letter-spacing:-0.01em}
.partnership__role{font-family:var(--label);font-weight:500;font-size:0.58rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60)}
.partnership__body{font-family:var(--body);font-size:1rem;line-height:1.55;color:var(--ink-60)}
@media(max-width:900px){.partnership__grid{grid-template-columns:1fr;gap:1.2rem}}
.timeline{padding:clamp(5rem, 8vw, 9rem) 0}
.timeline__head{max-width:680px;margin-bottom:clamp(3rem, 5vw, 5rem)}
.timeline__list{position:relative;border-left:2px solid var(--rule);padding-left:0;
max-width:900px;list-style:none;margin-left:110px}
.timeline__item{position:relative;padding:0 0 3rem 3.5rem}
.timeline__item:last-child{padding-bottom:0}
.timeline__item::before{content:'';position:absolute;left:-8px;top:0.3rem;
width:14px;height:14px;border-radius:50%;background:var(--paper);border:2px solid var(--red)}
.timeline__item--active::before{background:var(--red)}
.timeline__item::after{content:attr(data-week);position:absolute;left:-110px;top:0.15rem;
width:90px;text-align:right;font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--red)}
.timeline__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:0.95rem;color:var(--red);letter-spacing:0.02em;margin-bottom:0.5rem}
.timeline__title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.55rem;line-height:1.15;color:var(--ink);letter-spacing:-0.01em;
margin-bottom:0.8rem}
.timeline__body{font-family:var(--body);font-size:1.05rem;line-height:1.55;
color:var(--ink-60);max-width:50em}
.timeline__body em{color:var(--ink);font-style:italic}
@media(max-width:720px){
.timeline__item::after{display:none}
.timeline__list{margin-left:1.5rem}
}
.tlc{padding:clamp(5rem, 8vw, 9rem) 0;background:var(--paper-dark);color:var(--paper)}
.tlc__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem, 5vw, 6rem);
align-items:center}
.tlc__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.2rem, 1.6rem + 2vw, 3.6rem);line-height:1.05;
letter-spacing:-0.02em;color:var(--paper);margin-bottom:1.8rem}
.tlc__title em{font-style:normal;color:var(--red);font-weight:500}
.tlc__body{font-family:var(--body);font-size:1.15rem;line-height:1.6;
color:var(--paper-60);max-width:40em}
.tlc__body em{color:var(--paper);font-style:italic}
.tlc__body p+p{margin-top:1.2em}
.tlc__stats{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.tlc__stat{padding:2rem 1.5rem;background:rgba(250,250,247,0.04);
border:1px solid var(--paper-rule);text-align:center}
.tlc__stat-num{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.4rem, 1.6rem + 2vw, 4rem);line-height:1;color:var(--red);
letter-spacing:-0.02em;margin-bottom:0.6rem}
.tlc__stat-label{font-family:var(--label);font-weight:500;font-size:0.58rem;
letter-spacing:0.28em;text-transform:uppercase;color:var(--paper-60);line-height:1.4}
@media(max-width:900px){.tlc__grid{grid-template-columns:1fr;gap:2.5rem}}
.faq{padding:clamp(5rem, 8vw, 9rem) 0}
.faq__head{max-width:680px;margin-bottom:clamp(3rem, 5vw, 5rem)}
.faq__list{max-width:900px}
.faq__item{padding:1.8rem 0;border-top:1px solid var(--rule);
display:grid;grid-template-columns:40px 1fr;gap:1.5rem}
.faq__item:last-child{border-bottom:1px solid var(--rule)}
.faq__num{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.05rem;color:var(--red);letter-spacing:0.02em}
.faq__q{font-family:var(--display);font-weight:500;font-style:italic;
font-size:1.3rem;line-height:1.3;color:var(--ink);letter-spacing:-0.005em;margin-bottom:0.8rem}
.faq__a{font-family:var(--body);font-size:1.05rem;line-height:1.55;
color:var(--ink-60);max-width:50em}
.faq__a em{font-style:italic;color:var(--ink)}
/* ----- ENQUIRE PAGE ----- */
.enq{min-height:100vh;padding:calc(var(--nav-h) + 4rem) 0 5rem}
.enq__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(3rem, 6vw, 7rem);
align-items:flex-start;max-width:1240px;margin:0 auto}
.enq__intro{padding-top:1rem}
.enq__meta{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.32em;text-transform:uppercase;color:var(--red);
display:inline-flex;align-items:center;gap:0.9rem;margin-bottom:2rem}
.enq__meta::before{content:'';width:22px;height:1px;background:var(--red)}
.enq__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.6rem, 2rem + 2.6vw, 4.8rem);line-height:1;letter-spacing:-0.022em;
margin-bottom:2rem}
.enq__title em{font-style:normal;color:var(--red);font-weight:500}
.enq__dek{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.15rem, 0.95rem + 0.6vw, 1.5rem);line-height:1.4;color:var(--ink-60);
margin-bottom:2.4rem;padding-left:1.2rem;border-left:1px solid var(--red);max-width:28em}
.enq__prose{font-family:var(--body);font-size:1.1rem;line-height:1.58;color:var(--ink);
max-width:36em;margin-bottom:2.5rem}
.enq__prose em{font-style:italic;color:var(--ink)}
.enq__prose p+p{margin-top:1em}
.enq__contact{display:flex;flex-direction:column;gap:1rem;padding:2rem 0;
border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
margin-bottom:2.4rem;max-width:36em}
.enq__contact-row{display:grid;grid-template-columns:120px 1fr;gap:1rem;align-items:baseline}
.enq__contact-key{font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60)}
.enq__contact-val{font-family:var(--body);font-size:1.05rem;color:var(--ink)}
.enq__contact-val a{color:var(--ink);border-bottom:1px solid var(--red)}
.enq__contact-val a:hover{color:var(--red)}
.enq__contact-val em{font-style:italic;color:var(--ink-60)}
.enq__tenet{font-family:var(--display);font-style:italic;font-weight:400;
font-size:1.1rem;line-height:1.4;color:var(--red);max-width:30em}
.enq__form-wrap{background:var(--paper-deep);padding:clamp(2.4rem, 3.5vw, 3.5rem);
border:1px solid var(--rule);position:relative}
.enq__form-num{position:absolute;top:1.4rem;right:1.6rem;font-family:var(--display);
font-style:italic;font-weight:400;font-size:0.9rem;color:var(--red);letter-spacing:0.05em}
.enq__form-title{font-family:var(--display);font-weight:500;font-style:italic;
font-size:clamp(1.5rem, 1.2rem + 0.8vw, 2.1rem);line-height:1.15;color:var(--ink);
letter-spacing:-0.01em;margin-bottom:0.8rem}
.enq__form-sub{font-family:var(--body);font-style:italic;font-weight:400;
font-size:1.05rem;line-height:1.4;color:var(--ink-60);margin-bottom:2.4rem}
.enq__field{margin-bottom:1.8rem}
.enq__label{display:block;font-family:var(--label);font-weight:500;font-size:0.6rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-60);margin-bottom:0.7rem}
.enq__label-num{color:var(--red);margin-right:0.8rem}
.enq__input,.enq__textarea,.enq__select{width:100%;padding:0.9rem 0;
background:transparent;border:0;border-bottom:1px solid var(--ink-25);
font-family:var(--body);font-size:1.15rem;color:var(--ink);
transition:border-color .3s;outline:none}
.enq__input:focus,.enq__textarea:focus,.enq__select:focus{border-bottom-color:var(--red)}
.enq__input::placeholder,.enq__textarea::placeholder{color:var(--ink-40);font-style:italic}
.enq__textarea{resize:vertical;min-height:120px;line-height:1.5}
.enq__select{appearance:none;-webkit-appearance:none;-moz-appearance:none;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;background-position:right 0.3rem center;
padding-right:1.6rem;cursor:pointer}
.enq__pills{display:flex;flex-wrap:wrap;gap:0.6rem}
.enq__pill{display:inline-flex;align-items:center;padding:0.65rem 1.1rem;
background:transparent;border:1px solid var(--ink-25);font-family:var(--label);
font-weight:500;font-size:0.62rem;letter-spacing:0.26em;text-transform:uppercase;
color:var(--ink);cursor:pointer;transition:all .3s;user-select:none}
.enq__pill-input{display:none}
.enq__pill-input:checked + .enq__pill{background:var(--red);border-color:var(--red);color:var(--paper)}
.enq__pill:hover{border-color:var(--ink)}
.enq__submit-row{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;
margin-top:2.6rem;padding-top:2rem;border-top:1px solid var(--rule)}
.enq__submit-note{font-family:var(--body);font-style:italic;font-size:0.95rem;
color:var(--ink-60);line-height:1.4;flex:1;min-width:200px}
.enq__notice{margin:0 0 2rem;padding:1rem 1.2rem;border:1px solid var(--rule);
border-left:3px solid var(--red);font-family:var(--body);font-size:1.05rem;
line-height:1.45;color:var(--ink)}
.enq__notice strong{font-weight:600}
.enq__notice--err{color:var(--red-deep)}
.enq__error{margin-top:0.5rem;font-family:var(--body);font-style:italic;font-size:0.95rem;color:var(--red)}
.enq__hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
@media(max-width:980px){.enq__grid{grid-template-columns:1fr;gap:2.5rem}}
.enq-close{padding:clamp(4rem, 6vw, 6rem) 0;text-align:center;border-top:1px solid var(--rule)}
.enq-close__text{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(1.4rem, 1rem + 1.2vw, 2.2rem);line-height:1.2;color:var(--ink);
max-width:36ch;margin:0 auto}
.enq-close__text em{color:var(--red);font-style:italic;font-weight:500}
/* ---- Programmes page closing invitation ("The first step is a conversation.") ---- */
.hiw-close{padding:clamp(4rem, 7vw, 7rem) 0 clamp(5rem, 8vw, 8rem);text-align:center;border-top:1px solid var(--rule)}
.hiw-close__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2rem, 1.4rem + 2.4vw, 3.6rem);line-height:1.1;letter-spacing:-0.01em;
color:var(--ink);max-width:22ch;margin:0 auto 2.4rem}
.hiw-close__title em{color:var(--red);font-style:italic;font-weight:500}
/* ==================== style block (id="cj-tokens") ==================== */
:root {
/* --paper-mute: was used by cj-styles but never defined in the cinematic-tokens
transplant package. Adding it here as a faded cream — same hue as --paper at lower alpha,
suitable for muted body text on the dark cinematic stage. */
--paper-mute: rgba(245, 240, 230, 0.68);
--cream: #F2ECE3;
--cream-2: #ECE4D5;
--oxblood: #6B1F1F;
--oxblood-on-dark: #BA7A7A;
--gold: #B89556;
--stage: #0E0A07;
--serif: 'EB Garamond', 'Cormorant Garamond', Georgia, serif;
/* --img-* photo tokens are declared inline in includes/header.php.
They are consumed by inline style="" attributes in the HTML, and browsers
resolve a relative url() inside a custom property against the page, not
this stylesheet, so a ../img/ path here would 404. */
}
/* ==================== style block (id="cj-styles") ==================== */
.cj-stage {
position: sticky;
top: 0;
height: 100vh;
width: 100%;
overflow: hidden;
}
.cj-bg-img {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
opacity: 0;
transform: scale(1.04);
transition: opacity 1.1s cubic-bezier(0.4, 0, 0.2, 1),
transform 9s cubic-bezier(0.2, 0.8, 0.2, 1);
z-index: 1;
filter: brightness(0.88) saturate(0.95) contrast(1.02);
}
.cj-bg-img.active {
opacity: 1;
transform: scale(1);
}
.cj-bg-img::after {
content: '';
position: absolute;
inset: 0;
background:
linear-gradient(90deg,
rgba(14, 10, 7, 0.32) 0%,
rgba(14, 10, 7, 0.18) 32%,
rgba(14, 10, 7, 0.58) 62%,
rgba(14, 10, 7, 0.78) 100%),
linear-gradient(180deg,
rgba(14, 10, 7, 0.08) 0%,
rgba(14, 10, 7, 0.00) 40%,
rgba(14, 10, 7, 0.25) 100%);
}
.cj-bar {
position: absolute;
/* Clear the sticky close bar that overlays the top of the stage, otherwise
the "Skip to outcomes" link is unreachable. */
top: var(--cj-close-h); left: 0; right: 0;
z-index: 20;
display: flex;
justify-content: space-between;
align-items: center;
padding: 30px clamp(28px, 5vw, 64px);
}
.cj-bar .brand-mark { color: var(--paper); }
.cj-bar .brand-mark .dot { color: var(--paper-mute); }
.cj-bar a {
font-family: var(--serif);
font-size: 10px;
letter-spacing: 0.24em;
text-transform: uppercase;
color: var(--paper-mute);
transition: color 0.2s;
}
.cj-bar a:hover { color: var(--paper); }
.cj-step {
position: absolute;
inset: 0;
z-index: 10;
display: grid;
grid-template-columns: 1fr 1.05fr;
align-items: center;
padding: 0 clamp(40px, 6vw, 96px);
pointer-events: none;
opacity: 0;
transition: opacity 0.45s ease;
}
.cj-step.active {
opacity: 1;
pointer-events: auto;
}
.cj-num {
font-family: var(--display);
font-style: italic;
font-weight: 400;
font-size: clamp(140px, 22vw, 320px);
line-height: 0.82;
letter-spacing: -0.05em;
color: var(--paper);
grid-column: 1;
align-self: center;
padding-left: clamp(160px, 14vw, 240px);
text-shadow:
0 6px 60px rgba(14, 10, 7, 0.85),
0 2px 12px rgba(14, 10, 7, 0.6);
}
.cj-panel {
grid-column: 2;
max-width: 600px;
align-self: center;
position: relative;
padding: 40px 0;
}
.cj-panel::before {
content: '';
position: absolute;
inset: -56px -80px -56px -56px;
background: radial-gradient(ellipse at center,
rgba(14, 10, 7, 0.68) 0%,
rgba(14, 10, 7, 0.40) 45%,
rgba(14, 10, 7, 0.08) 80%,
transparent 100%);
z-index: -1;
pointer-events: none;
}
.cj-meta {
font-family: var(--serif);
font-size: 10px;
color: var(--paper-mute);
letter-spacing: 0.28em;
text-transform: uppercase;
margin-bottom: 28px;
display: flex;
align-items: center;
gap: 14px;
font-weight: 400;
}
.cj-meta::before {
content: '';
width: 32px;
height: 1px;
background: var(--paper);
}
.cj-meta .gold-dot { color: var(--gold); }
.cj-panel h3 {
font-family: var(--serif);
font-style: italic;
font-weight: 400;
font-size: clamp(34px, 4vw, 52px);
line-height: 1.08;
letter-spacing: -0.012em;
color: var(--paper);
margin-bottom: 30px;
text-shadow:
0 4px 32px rgba(14, 10, 7, 0.95),
0 2px 12px rgba(14, 10, 7, 0.7);
}
.cj-panel h3 .operative {
color: var(--oxblood-on-dark);
text-shadow:
0 4px 32px rgba(14, 10, 7, 0.95),
0 2px 12px rgba(14, 10, 7, 0.85),
0 0 2px rgba(168, 43, 43, 0.5);
}
.cj-panel p {
font-family: var(--serif);
font-size: 17px;
line-height: 1.65;
color: rgba(237, 228, 211, 0.94);
max-width: 500px;
text-shadow: 0 1px 14px rgba(14, 10, 7, 0.7);
}
.cj-detail {
margin-top: 36px;
padding-top: 26px;
border-top: 1px solid rgba(237, 228, 211, 0.24);
display: grid;
grid-template-columns: 1fr 1fr;
gap: 22px 36px;
max-width: 500px;
}
.cj-detail-row .label {
font-family: var(--serif);
font-size: 9px;
letter-spacing: 0.28em;
text-transform: uppercase;
color: var(--paper-mute);
margin-bottom: 8px;
font-weight: 400;
}
.cj-detail-row .val {
font-family: var(--serif);
font-style: italic;
font-size: 15px;
line-height: 1.35;
color: var(--paper);
text-shadow: 0 1px 10px rgba(14, 10, 7, 0.7);
}
.cj-signature {
margin-top: 32px;
padding-top: 22px;
border-top: 1px solid rgba(237, 228, 211, 0.18);
font-family: var(--serif);
font-size: 9px;
letter-spacing: 0.46em;
text-transform: uppercase;
color: var(--paper-mute);
font-weight: 400;
}
.cj-timeline {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: clamp(24px, 3.5vw, 56px);
z-index: 30;
list-style: none;
padding-left: 24px;
margin: 0;
max-height: 80vh;
overflow-y: auto;
scrollbar-width: none;
}
.cj-timeline::-webkit-scrollbar { display: none; }
.cj-timeline::before {
content: '';
position: absolute;
top: 10px;
bottom: 10px;
left: 0;
width: 1px;
background: rgba(237, 228, 211, 0.20);
}
.cj-timeline li {
position: relative;
padding: 7px 0;
}
.cj-timeline a {
display: flex;
align-items: center;
gap: 14px;
color: rgba(237, 228, 211, 0.45);
font-family: var(--serif);
font-size: 12px;
font-weight: 400;
font-style: italic;
transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
cursor: pointer;
line-height: 1.2;
text-shadow: 0 1px 8px rgba(14, 10, 7, 0.6);
}
.cj-timeline a .num {
font-family: var(--serif);
font-style: normal;
font-size: 10px;
letter-spacing: 0.18em;
color: rgba(237, 228, 211, 0.4);
width: 32px;
transition: color 0.4s ease;
}
.cj-timeline a::before {
content: '';
position: absolute;
left: -29px;
top: 50%;
transform: translateY(-50%);
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--stage);
border: 1.5px solid rgba(237, 228, 211, 0.4);
transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
z-index: 2;
}
.cj-timeline a:hover { color: rgba(237, 228, 211, 0.9); }
.cj-timeline a:hover .num { color: rgba(237, 228, 211, 0.7); }
.cj-timeline a:hover::before {
border-color: var(--paper);
transform: translateY(-50%) scale(1.2);
}
.cj-timeline a.active {
color: var(--paper);
font-style: italic;
font-weight: 500;
font-size: 15px;
}
.cj-timeline a.active .num { color: var(--gold); }
.cj-timeline a.active::before {
background: var(--gold);
border-color: var(--gold);
transform: translateY(-50%) scale(1.5);
box-shadow: 0 0 0 5px rgba(184, 149, 86, 0.20);
}
@media (max-width: 900px) {
.cj { height: auto !important; }
.cj-stage { position: relative; height: auto; overflow: visible; }
.cj-bg-img, .cj-bar, .cj-timeline { display: none; }
.cj-step {
position: relative;
/* Month-picker jumps land below the sticky close bar and picker */
scroll-margin-top: calc(var(--cj-close-h) + var(--cj-picker-h));
inset: auto;
grid-template-columns: 1fr;
padding: 0 24px;
opacity: 1;
pointer-events: auto;
}
.cj-step::before {
content: '';
display: block;
width: 100%;
aspect-ratio: 16 / 10;
background-image: var(--mob-img);
background-size: cover;
background-position: center;
filter: brightness(0.78) saturate(0.92);
grid-column: 1;
margin: 56px 0 28px;
}
.cj-num { grid-column: 1; padding-left: 0; font-size: 110px; }
.cj-panel { grid-column: 1; max-width: none; }
.cj-panel::before { display: none; }
.cj-panel p { color: rgba(237,228,211,0.92); text-shadow: none; }
.cj-num, .cj-panel h3 { text-shadow: none; }
.cj-detail { grid-template-columns: 1fr; gap: 14px; max-width: none; }
}
/* ===========================================================
REDUCED MOTION FALLBACK
=========================================================== */
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.001s !important;
transition-duration: 0.001s !important;
}
.cj-bg-img {
transform: none !important;
}
.reveal {
opacity: 1 !important;
transform: none !important;
}
.cj-stage {
position: relative !important;
}
/* For people with reduced-motion, the timeline collapses to a stacked layout */
.cj {
height: auto !important;
}
.cj-bg-img, .cj-timeline, .cj-bar { display: none !important; }
.cj-step {
position: relative !important;
inset: auto !important;
grid-template-columns: 1fr !important;
opacity: 1 !important;
pointer-events: auto !important;
padding: 64px 24px !important;
min-height: auto !important;
}
.cj-step::before {
content: '' !important;
display: block !important;
width: 100% !important;
aspect-ratio: 16 / 10 !important;
background-image: var(--mob-img) !important;
background-size: cover !important;
background-position: center !important;
grid-column: 1 !important;
margin-bottom: 24px !important;
}
.cj-num { font-size: 96px !important; padding-left: 0 !important; text-shadow: none !important; }
.cj-panel { max-width: none !important; }
.cj-panel::before { display: none !important; }
.cj-panel p { text-shadow: none !important; }
}
/* ===========================================================
MOBILE STEP PICKER for timelines (visible on mobile only)
=========================================================== */
.cj-mobile-picker {
display: none;
position: sticky;
/* Below the sticky close bar, so the jump button is clickable */
top: var(--cj-close-h);
z-index: 25;
background: var(--stage);
border-bottom: 1px solid rgba(237, 228, 211, 0.18);
padding: 14px 20px;
align-items: center;
gap: 16px;
}
@media (max-width: 900px) {
.cj-mobile-picker {
display: flex;
}
}
.cj-mobile-current {
display: flex;
align-items: baseline;
gap: 10px;
flex-shrink: 0;
}
.cj-mobile-label {
font-family: var(--serif);
font-size: 9px;
letter-spacing: 0.32em;
text-transform: uppercase;
color: rgba(237, 228, 211, 0.62);
}
.cj-mobile-num {
font-family: var(--display);
font-style: italic;
font-size: 22px;
color: var(--gold);
line-height: 1;
}
.cj-mobile-jump {
flex: 1;
background: rgba(237, 228, 211, 0.06);
border: 1px solid rgba(237, 228, 211, 0.18);
color: var(--paper);
padding: 10px 14px;
font-family: var(--serif);
font-style: italic;
font-size: 13px;
text-align: left;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
line-height: 1.3;
}
.cj-mobile-jump-arrow {
color: var(--gold);
font-size: 10px;
flex-shrink: 0;
}
.cj-mobile-menu {
display: none;
position: absolute;
top: 100%;
left: 12px; right: 12px;
max-height: 60vh;
overflow-y: auto;
background: var(--stage);
border: 1px solid rgba(237, 228, 211, 0.18);
box-shadow: 0 20px 40px rgba(0,0,0,0.6);
}
.cj-mobile-menu.open { display: block; }
.cj-mobile-menu a {
display: flex;
gap: 12px;
padding: 14px 18px;
color: rgba(237, 228, 211, 0.84);
font-family: var(--serif);
font-style: italic;
font-size: 14px;
text-decoration: none;
border-bottom: 1px solid rgba(237, 228, 211, 0.10);
transition: background 0.2s;
}
.cj-mobile-menu a:hover, .cj-mobile-menu a.active {
background: rgba(237, 228, 211, 0.08);
color: var(--gold);
}
.cj-mobile-menu a .num {
font-family: var(--serif);
font-style: normal;
font-size: 10px;
color: var(--gold);
letter-spacing: 0.2em;
width: 32px;
flex-shrink: 0;
}
/* L4 mobile-specific: more compact step articles for 24-month scroll */
@media (max-width: 900px) {
#page-level-4 .cj-step {
padding: 32px 24px 40px !important;
}
#page-level-4 .cj-step::before {
aspect-ratio: 5 / 3 !important;
margin-bottom: 18px !important;
}
#page-level-4 .cj-num {
font-size: 64px !important;
margin-bottom: 0 !important;
padding-left: 0 !important;
}
#page-level-4 .cj-meta {
font-size: 9px;
margin-bottom: 16px;
}
#page-level-4 .cj-panel h3 {
font-size: 22px !important;
line-height: 1.18;
margin-bottom: 14px;
}
#page-level-4 .cj-panel p {
font-size: 14px;
line-height: 1.5;
}
#page-level-4 .cj-detail {
grid-template-columns: 1fr 1fr;
gap: 12px 16px;
margin-top: 18px;
padding-top: 14px;
}
#page-level-4 .cj-detail-row .label { font-size: 8px; margin-bottom: 4px; }
#page-level-4 .cj-detail-row .val { font-size: 12px; line-height: 1.25; }
#page-level-4 .cj-signature {
margin-top: 16px;
padding-top: 14px;
font-size: 8px;
}
}
/* Hide redundant page-context bits on mobile for all levels */
@media (max-width: 720px) {
.cj-bar a.skip-link {
font-size: 9px;
letter-spacing: 0.20em;
}
.cj-bar .brand-mark {
font-size: 8px;
letter-spacing: 0.22em;
}
}
/* ===========================================================
COLLAPSED CINEMATIC BANNER + EXPAND TOGGLE
=========================================================== */
.cj-wrap {
position: relative;
}
/* === EXPANDED STATE: full-screen modal ===
The open timeline is lifted out of the page into a fixed, full-viewport layer
with its own scroll container. The page nav is hidden while it is open, the
page behind is scroll-locked, and wheel / arrow keys scroll the timeline. */
.cj-wrap[data-cj-state="expanded"] {
position: fixed;
inset: 0;
z-index: 500;
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
background: var(--stage);
outline: none;
}
html.cj-modal-open,
html.cj-modal-open body { overflow: hidden; }
html.cj-modal-open .nav,
html.cj-modal-open .menu { visibility: hidden; }
/* === COLLAPSED STATE === */
/* The banner is always rendered; the expanded timeline is hidden until opened. */
[data-cj-state="collapsed"] .cj-expanded { display: none; }
[data-cj-state="expanded"] .cj-banner { display: none; }
/* Banner — single-screen hero */
.cj-banner {
position: relative;
min-height: 88vh;
overflow: hidden;
background: var(--stage);
color: var(--paper);
padding: clamp(80px, 10vw, 120px) 0;
display: flex;
align-items: center;
}
.cj-banner-bg {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
z-index: 0;
filter: contrast(1.05) brightness(0.65) saturate(0.85);
}
.cj-banner-overlay {
position: absolute;
inset: 0;
background:
linear-gradient(135deg,
rgba(14, 10, 7, 0.78) 0%,
rgba(14, 10, 7, 0.55) 35%,
rgba(14, 10, 7, 0.50) 65%,
rgba(14, 10, 7, 0.82) 100%);
z-index: 1;
}
.cj-banner .container { position: relative; z-index: 2; }
/* Slim-site bridge: give the cinematic timeline's inner .container the max-width + padding
it would have had on the cinematic site (where .container was a host-page utility class) */
.cj-wrap .container,
.cj-wrap > .cj-banner .container,
.cj-wrap > .cj > .cj-stage .container,
.cj-wrap .cj-step .container{
max-width: 1320px;
margin: 0 auto;
padding: 0 clamp(1.4rem, 4vw, 3rem);
box-sizing: border-box;
}
.cj-banner-inner {
display: grid;
grid-template-columns: 1fr 1fr;
gap: clamp(40px, 6vw, 96px);
align-items: center;
}
@media (max-width: 900px) {
.cj-banner-inner { grid-template-columns: 1fr; gap: 32px; }
}
/* LEFT — roman + title + duration */
.cj-banner-roman {
font-family: var(--display);
font-style: italic;
font-weight: 400;
font-size: clamp(96px, 14vw, 200px);
line-height: 0.85;
color: var(--paper);
letter-spacing: -0.04em;
margin-bottom: 20px;
text-shadow: 0 4px 32px rgba(0,0,0,0.4);
}
.cj-banner-eyebrow {
font-family: var(--serif);
font-size: 10px;
letter-spacing: 0.42em;
text-transform: uppercase;
color: rgba(237, 228, 211, 0.7);
margin-bottom: 18px;
padding-bottom: 14px;
border-bottom: 1px solid rgba(237, 228, 211, 0.18);
}
.cj-banner-title {
font-family: var(--display);
font-style: italic;
font-weight: 400;
font-size: clamp(36px, 5vw, 64px);
line-height: 1.05;
color: var(--paper);
letter-spacing: -0.022em;
margin-bottom: 18px;
}
.cj-banner-stop { color: var(--paper); }
.cj-banner-subtitle {
font-family: var(--serif);
font-style: italic;
font-size: 15px;
color: rgba(237, 228, 211, 0.78);
margin-bottom: 24px;
line-height: 1.5;
}
.cj-banner-meta {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 10px 18px;
background: rgba(237, 228, 211, 0.08);
border: 1px solid rgba(237, 228, 211, 0.18);
font-family: var(--serif);
font-size: 11px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: rgba(237, 228, 211, 0.88);
}
.cj-banner-meta-label { color: var(--paper); }
.cj-banner-meta-sep { color: var(--paper); }
.cj-banner-meta-val { font-weight: 500; letter-spacing: 0.14em; }
/* RIGHT — quote + open button */
.cj-banner-quote {
margin-bottom: 32px;
padding: 28px 32px;
border-left: 3px solid var(--oxblood-on-dark);
background: rgba(237, 228, 211, 0.04);
position: relative;
}
.cj-banner-quote-mark {
position: absolute;
top: -4px;
left: 18px;
font-family: var(--display);
font-style: italic;
font-size: 96px;
color: var(--oxblood-on-dark);
opacity: 0.32;
line-height: 0.5;
}
.cj-banner-quote blockquote {
margin: 0;
font-family: var(--display);
font-style: italic;
font-weight: 400;
font-size: clamp(20px, 2.4vw, 30px);
line-height: 1.22;
color: var(--paper);
letter-spacing: -0.016em;
padding-left: 22px;
}
.cj-banner-quote em { color: var(--paper); font-style: italic; }
.cj-banner-quote-attr {
margin-top: 20px;
padding-top: 16px;
padding-left: 22px;
border-top: 1px solid rgba(237, 228, 211, 0.18);
font-family: var(--serif);
font-size: 10px;
letter-spacing: 0.34em;
text-transform: uppercase;
color: rgba(237, 228, 211, 0.66);
}
.cj-banner-quote-attr em { color: var(--paper); font-style: italic; letter-spacing: 0.34em; }
.cj-banner-sep { color: var(--paper); margin: 0 6px; }
/* Open button */
.cj-banner-open {
display: flex;
flex-direction: column;
gap: 8px;
padding: 20px 28px;
width: 100%;
background: var(--paper);
color: var(--ink);
border: none;
cursor: pointer;
transition: all 0.3s;
text-align: left;
margin-bottom: 18px;
}
.cj-banner-open:hover {
background: var(--cream);
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(245, 240, 230, 0.18);
}
.cj-banner-open-eb {
font-family: var(--serif);
font-size: 9px;
letter-spacing: 0.36em;
text-transform: uppercase;
opacity: 0.7;
}
.cj-banner-open-line {
font-family: var(--display);
font-style: italic;
font-size: clamp(20px, 2vw, 26px);
line-height: 1;
display: flex;
justify-content: space-between;
align-items: center;
letter-spacing: -0.014em;
}
.cj-banner-open-arrow {
transition: transform 0.3s;
font-size: 22px;
}
.cj-banner-open:hover .cj-banner-open-arrow {
transform: translateY(3px);
}
.cj-banner-hint {
font-family: var(--serif);
font-style: italic;
font-size: 12px;
color: rgba(237, 228, 211, 0.62);
line-height: 1.5;
text-align: center;
padding: 0 8px;
}
.cj-banner-hint em { color: rgba(237, 228, 211, 0.84); font-style: italic; }
/* === CLOSE BAR (sticks at top of expanded timeline) === */
.cj-close-bar {
position: sticky;
/* The open timeline is a full-screen modal above the site nav, so the bar
sticks to the very top of the modal's own scroll container. */
top: 0;
min-height: var(--cj-close-h);
box-sizing: border-box;
z-index: 30;
background: var(--stage);
border-bottom: 1px solid rgba(237, 228, 211, 0.18);
padding: 14px 0;
}
.cj-close-btn {
display: inline-flex;
align-items: center;
gap: 14px;
padding: 10px 22px;
background: transparent;
border: 1px solid rgba(237, 228, 211, 0.28);
color: var(--paper);
font-family: var(--serif);
font-size: 10px;
font-weight: 500;
letter-spacing: 0.32em;
text-transform: uppercase;
cursor: pointer;
transition: all 0.3s;
}
.cj-close-btn:hover {
background: var(--paper);
color: var(--ink);
border-color: var(--paper);
}
.cj-close-btn-icon {
font-size: 16px;
transition: transform 0.3s;
}
.cj-close-btn:hover .cj-close-btn-icon { transform: translateY(-2px); }
/* On mobile — the open button uses a different label and triggers
a simpler stacked layout instead of the sticky-stage cinematic.
The mobile-stacked CSS already exists for prefers-reduced-motion.
We piggy-back on it via a body class. */
@media (max-width: 900px) {
.cj-banner-open-line { font-size: 17px; }
.cj-banner-roman { font-size: 96px; }
.cj-banner-title { font-size: 32px; }
.cj-banner-quote blockquote { font-size: 18px; }
}
/* The mobile step picker is only ever shown on narrow screens. Keep this
override inside the media query - unscoped it also showed the picker on
desktop when a timeline was open, and its links (scrollIntoView on the
absolutely-positioned steps) do nothing useful there. */
@media (max-width: 900px) {
[data-cj-state="expanded"] .cj-mobile-picker { display: flex; }
}
/* ---- Programme module reference footer (under each transplanted timeline) ---- */
.cj-host{
margin-top:2rem;
/* Break out of the article's max-width and span the full viewport */
width:100vw;
position:relative;
left:50%;
right:50%;
margin-left:-50vw;
margin-right:-50vw;
}
/* The module-footer below the timeline should stay narrative-width, not full-bleed */
.cj-host > .cj-module-footer{
max-width:880px;
margin-left:auto;
margin-right:auto;
}
.cj-module-footer{
scroll-margin-top:var(--nav-h); /* "Skip to outcomes" anchor lands below the fixed nav */
max-width:880px;
margin:0 auto;
padding:2.4rem var(--gutter, 2rem) 0;
border-top:1px solid var(--rule, rgba(22,21,20,0.14));
}
.cj-module-footer__eyebrow{
font-family:var(--label, 'Inter', sans-serif);
font-weight:500;
font-size:0.6rem;
letter-spacing:0.32em;
text-transform:uppercase;
color:var(--red, #A0251A);
margin-bottom:1rem;
}
.cj-module-footer__list{
font-family:var(--body, 'Cormorant Garamond', Georgia, serif);
font-style:italic;
font-size:1.05rem;
line-height:1.55;
color:var(--ink-soft, #252220);
margin:0;
}
/* ==========================================================================
LEGAL PAGES — privacy.php, cookies.php, terms.php, accessibility.php, legal.php
Server-rendered, no .reveal, so they read without JavaScript.
========================================================================== */
.legal{padding:calc(var(--nav-h) + clamp(2.5rem,5vw,4.5rem)) 0 clamp(4rem,8vw,6rem)}
.legal__nav{display:flex;gap:1.6rem;flex-wrap:wrap;font-family:var(--label);
font-size:0.64rem;letter-spacing:0.22em;text-transform:uppercase;font-weight:500;
padding-bottom:1.4rem;margin-bottom:clamp(2.5rem,5vw,4rem);border-bottom:1px solid var(--rule-soft)}
.legal__nav a{color:var(--ink-60);padding:0.3rem 0;position:relative;transition:color .3s}
.legal__nav a::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:1px;
background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease-out)}
.legal__nav a:hover{color:var(--ink)}
.legal__nav a:hover::after,.legal__nav a[aria-current]::after{transform:scaleX(1)}
.legal__nav a[aria-current]{color:var(--ink)}
.legal__head{margin-bottom:2.4rem}
.legal__title{font-family:var(--display);font-weight:400;font-style:italic;
font-size:clamp(2.2rem, 1.6rem + 2.2vw, 4rem);line-height:1.06;letter-spacing:-0.018em;
margin:1rem 0 1rem}
.legal__title em{font-style:normal;color:var(--red);font-weight:500}
.legal__meta{font-family:var(--label);font-size:0.64rem;letter-spacing:0.22em;
text-transform:uppercase;color:var(--ink-60)}
.legal__brief{background:var(--paper-deep);border-left:2px solid var(--red);
padding:1.5rem 1.7rem;margin:0 0 2.8rem}
.legal__brief-label{font-family:var(--label);font-weight:500;font-size:0.62rem;
letter-spacing:0.3em;text-transform:uppercase;color:var(--red);margin-bottom:0.8rem}
.legal__brief ul{margin:0;padding-left:1.1rem;font-family:var(--body);font-size:1.15rem;line-height:1.55}
.legal__brief li{margin:0.35rem 0}
.legal__brief a{color:var(--ink);border-bottom:1px solid var(--red);padding-bottom:1px}
.legal__body{font-family:var(--body);font-size:1.2rem;line-height:1.62;color:var(--ink)}
.legal__body h2{font-family:var(--display);font-weight:500;
font-size:clamp(1.35rem, 1.15rem + 0.6vw, 1.75rem);line-height:1.25;letter-spacing:-0.005em;
margin:2.8rem 0 0.9rem;padding-top:1.4rem;border-top:1px solid var(--rule-soft)}
.legal__body h3{font-family:var(--label);font-weight:500;font-size:0.7rem;letter-spacing:0.22em;
text-transform:uppercase;color:var(--ink);margin:1.9rem 0 0.6rem}
.legal__body p{margin:0 0 1.1rem}
.legal__body ul,.legal__body ol{margin:0 0 1.2rem;padding-left:1.4rem}
.legal__body li{margin:0.4rem 0}
.legal__body strong{font-weight:500}
.legal__body em{font-style:italic}
.legal__body a{color:var(--ink);border-bottom:1px solid var(--red);padding-bottom:1px;transition:color .3s}
.legal__body a:hover{color:var(--red)}
.legal__body address{font-style:normal}
.legal__contents{columns:2;column-gap:2.4rem;font-size:1.05rem;margin:0 0 1rem;padding-left:1.4rem}
.legal__contents li{break-inside:avoid;margin:0.25rem 0}
.legal__body .legal__contents a{border-bottom-color:transparent}
.legal__body .legal__contents a:hover{border-bottom-color:var(--red)}
.legal__table{width:100%;border-collapse:collapse;margin:1rem 0 1.8rem;font-size:1.02rem;line-height:1.45}
.legal__table th,.legal__table td{text-align:left;vertical-align:top;padding:0.75rem 1rem 0.75rem 0;border-top:1px solid var(--rule)}
.legal__table th{font-family:var(--label);font-weight:500;font-size:0.62rem;letter-spacing:0.2em;
text-transform:uppercase;color:var(--ink-60);border-top:0;padding-top:0}
.legal__table tbody tr:last-child td{border-bottom:1px solid var(--rule)}
.legal__back{margin-top:3rem}
@media(max-width:700px){
.legal__body{font-size:1.1rem}
.legal__contents{columns:1}
.legal__table,.legal__table thead,.legal__table tbody,.legal__table tr,.legal__table th,.legal__table td{display:block}
.legal__table thead{display:none}
.legal__table td{border-top:0;padding:0.3rem 0}
.legal__table tbody tr{border-top:1px solid var(--rule);padding:0.7rem 0}
.legal__table tbody tr:last-child{border-bottom:1px solid var(--rule)}
.legal__table tbody tr:last-child td{border-bottom:0}
.legal__table td::before{content:attr(data-label);display:block;font-family:var(--label);
font-size:0.6rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-60);margin-bottom:0.15rem}
}
@media print{
.nav,.menu,.footer,.legal__nav,.legal__back{display:none !important}
.legal{padding-top:0}
.legal__body a{border:0}
body::before{display:none}
}
/* FOOTER — legal links row and company identity line */
.footer__legal{display:flex;flex-wrap:wrap;gap:0.5rem 1.6rem;margin-top:1.6rem;
font-family:var(--label);font-size:0.62rem;letter-spacing:0.26em;text-transform:uppercase}
.footer__legal a{color:var(--paper-60);transition:color .3s;cursor:pointer}
.footer__legal a:hover{color:var(--paper)}
.footer__company{display:block;margin-top:1.2rem;font-family:var(--label);font-size:0.58rem;
letter-spacing:0.14em;text-transform:uppercase;color:var(--paper-40);line-height:1.9}
@media(max-width:900px){
.footer__legal{justify-content:center}
.footer__company{text-align:center}
}
/* KEYBOARD FOCUS — a visible outline everywhere (the form fields set outline:none) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--red);outline-offset:3px}