/* Home page: scroll scenes and sections. */
/* ---------- Scroll scenes ---------- */
.scene{position:relative;height:var(--h,200vh)}
.scene-hero{--h:260vh}
.scene.overlap{--h:380vh;margin-top:-200vh}
.scene.overlap{pointer-events:none}.scene.overlap .scene-pin{pointer-events:auto}
#about .scene-pin{background:#123aa8}
.scene-pin{position:sticky;top:0;height:100vh;overflow:hidden;isolation:isolate;display:grid}
.scene-media{position:absolute;inset:-2%;z-index:-3;background:var(--img,none) var(--pos,center)/cover no-repeat,var(--ph);transform:scale(calc(1.14 - var(--p,0) * .14));transform-origin:var(--origin,50% 50%);will-change:transform}
.scene[data-reveal] .scene-pin{-webkit-mask-image:radial-gradient(circle,#000 calc(var(--dot,0) * 1px),transparent calc(var(--dot,0) * 1px + .8px));mask-image:radial-gradient(circle,#000 calc(var(--dot,0) * 1px),transparent calc(var(--dot,0) * 1px + .8px));-webkit-mask-size:10px 10px;mask-size:10px 10px;-webkit-mask-position:center;mask-position:center}
.scene[data-reveal].revealed .scene-pin{-webkit-mask-image:none;mask-image:none}
.scene[data-reveal].pending .scene-pin{opacity:0;pointer-events:none}
.scene-shade{position:absolute;inset:0;z-index:-2;background:var(--shade,linear-gradient(180deg,rgba(8,14,30,.28) 0%,rgba(8,14,30,0) 32%,rgba(8,14,30,0) 55%,rgba(8,14,30,.42) 100%))}
.scene-pin::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.16;mix-blend-mode:overlay;background-image:var(--grain)}
.scene-copy{align-self:var(--y,end);justify-self:var(--x,start);width:min(var(--w,720px),100%);padding:clamp(96px,14vh,140px) var(--gutter) clamp(56px,10vh,110px);color:var(--scene-ink,#fff);text-shadow:0 1px 24px rgba(5,10,25,.25)}
[data-tone="light"]{--scene-ink:var(--ink)}
[data-tone="light"] .scene-copy{text-shadow:none}
[data-tone="light"] .scene-shade{--shade:linear-gradient(180deg,rgba(248,245,238,.35),rgba(248,245,238,0) 40%)}
.reveal{opacity:var(--t,1);filter:blur(calc((1 - var(--t,1)) * 14px));transform:translateY(calc((1 - var(--t,1)) * 28px))}
.reveal-2{opacity:var(--t2,1);filter:blur(calc((1 - var(--t2,1)) * 10px));transform:translateY(calc((1 - var(--t2,1)) * 20px))}
.nowrap{white-space:nowrap}
.display{font-family:var(--serif);font-weight:200;font-size:clamp(2.5rem,7vw,6.5rem);line-height:1.18;letter-spacing:.02em;margin:0}
.display em,.scene-title em{font-family:var(--latin);font-style:italic;font-weight:300;letter-spacing:0}
.scene-title{font-family:var(--serif);font-weight:200;font-size:clamp(2.25rem,6vw,5.25rem);line-height:1.3;letter-spacing:.03em;margin:0 0 .3em}
.scene-latin{font-family:var(--latin);font-style:italic;font-weight:300;font-size:clamp(1.5rem,3vw,2.5rem);line-height:1.2;margin:0 0 22px;opacity:.92}
.scene-text{font-family:var(--serif);font-size:clamp(1rem,1.3vw,1.125rem);line-height:2.1;max-width:30em;margin:0 0 28px}
.lede{font-family:var(--serif);font-weight:300;font-size:clamp(1rem,1.6vw,1.25rem);line-height:2;margin:28px 0 0;letter-spacing:.06em}
.scroll-cue{position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);color:#fff;text-decoration:none;font-family:var(--latin);font-style:italic;font-size:1.125rem;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:calc(1 - var(--p,0) * 3)}
.scroll-cue::after{content:"";width:1px;height:44px;background:linear-gradient(#fff,transparent);animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.scene-count{position:absolute;right:var(--gutter);bottom:clamp(40px,8vh,90px);font-family:var(--latin);font-size:clamp(4rem,10vw,9rem);font-weight:300;line-height:1;color:var(--scene-ink,#fff);opacity:calc(.18 + var(--p,0) * .1)}

/* ---------- Journal ---------- */
.section{position:relative;padding:clamp(88px,14vh,160px) var(--gutter)}
.section-inner{width:min(1180px,100%);margin:0 auto}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 64px;align-items:end;margin-bottom:clamp(40px,7vh,72px)}
.section-head .copy{margin:0;max-width:34em}
.journal-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.journal-filters{display:flex;flex-wrap:wrap;gap:4px 8px}
.journal-filter{appearance:none;border:1px solid var(--line);background:transparent;border-radius:999px;min-height:44px;padding:8px 18px;font:inherit;font-size:.875rem;color:var(--ink);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.journal-filter:hover{border-color:var(--ink)}
.journal-filter.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.journal-filter .count{margin-left:8px;font-size:.75rem;opacity:.7}
.journal-search{flex:1 1 260px;max-width:360px;position:relative}
.journal-search label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.journal-search input{width:100%;min-height:46px;padding:10px 4px 10px 30px;border:0;border-bottom:1px solid rgba(27,28,25,.35);background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%231b1c19' stroke-width='1.4'%3E%3Ccircle cx='7.5' cy='7.5' r='5.5'/%3E%3Cpath d='M12 12l4.5 4.5'/%3E%3C/svg%3E") 2px center no-repeat;color:var(--ink);font:inherit;font-size:1rem;border-radius:0}
.journal-search input:focus{outline:none;border-bottom-color:var(--blue)}
.journal-search input:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.journal-search-status{margin:10px 0 0;font-size:.875rem;color:var(--muted);min-height:1.5em}
.journal-list{counter-reset:entry}
.journal-item{display:grid;grid-template-columns:120px minmax(0,1fr) 48px;gap:8px 32px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none;position:relative}
.journal-item::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.journal-item.clickable:hover::before,.journal-item.clickable:focus-visible::before{transform:scaleX(1)}
.journal-item:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.journal-date{font-family:var(--latin);font-size:1.0625rem;color:var(--muted);letter-spacing:.04em}
.journal-dot{display:none}
.journal-title{font-family:var(--serif);font-weight:300;font-size:clamp(1.25rem,2.1vw,1.75rem);line-height:1.6;transition:transform .5s cubic-bezier(.2,.7,.2,1),color .3s}
.journal-item.clickable:hover .journal-title{transform:translateX(8px);color:var(--blue)}
.journal-excerpt{font-family:var(--serif);font-size:1rem;line-height:1.9;color:#45473f;margin-top:8px}
.journal-read-time{display:inline-block;margin-top:10px;font-size:.75rem;letter-spacing:.06em;color:var(--muted)}
.journal-arrow{justify-self:end;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:1rem;transition:background .3s,color .3s,border-color .3s}
.journal-item.clickable:hover .journal-arrow{background:var(--blue);border-color:var(--blue);color:#fff}
.journal-item.is-note .journal-arrow{border-style:dashed;opacity:.5}
.journal-item.is-hidden{display:none}

/* ---------- Food & science (blue) ---------- */
.section-blue{background:radial-gradient(ellipse 70% 50% at 85% 0%,rgba(255,255,255,.14),transparent 60%),linear-gradient(170deg,#0b2f97 0%,#1442c4 60%,#2559d6 100%);color:#fff}
.section-blue .eyebrow,.section-blue .copy{color:rgba(255,255,255,.82)}
.foodscience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.science-card{position:relative;display:flex;flex-direction:column;min-height:300px;padding:clamp(26px,3vw,40px);border:1px solid rgba(255,255,255,.28);border-radius:4px;background:rgba(255,255,255,.07);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;text-decoration:none;overflow:hidden;transition:background .4s,transform .6s cubic-bezier(.2,.7,.2,1)}
.science-card:hover{background:rgba(255,255,255,.14);transform:translateY(-6px)}
.science-card:focus-visible{outline:2px solid #fff;outline-offset:4px}
.science-tag{font-size:.75rem;letter-spacing:.14em;color:rgba(255,255,255,.75);margin-bottom:auto;padding-bottom:28px}
.science-card h3{font-family:var(--serif);font-weight:300;font-size:clamp(1.375rem,2.2vw,1.875rem);line-height:1.55;margin:0 0 14px}
.science-card p{font-family:var(--serif);font-size:1rem;line-height:1.9;color:rgba(255,255,255,.85);margin:0 0 20px}
.science-more{font-family:var(--latin);font-style:italic;font-size:1.125rem}

/* ---------- Books ---------- */
.book-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.book-card{display:flex;flex-direction:column;padding:clamp(28px,3.4vw,48px);background:#fff;border:1px solid var(--line);border-radius:4px;position:relative}
.book-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--gold),#d9b46a)}
.book-category{font-size:.75rem;letter-spacing:.12em;color:var(--muted);margin:0 0 22px}
.book-title{font-family:var(--serif);font-weight:300;font-size:clamp(1.375rem,2.2vw,1.875rem);line-height:1.5;margin:0 0 12px;overflow-wrap:anywhere}
.book-title[lang="en"]{font-family:var(--latin);font-weight:400;font-size:clamp(1.5rem,2.4vw,2.125rem);line-height:1.25}
.book-subtitle{display:block;font-size:1rem;line-height:1.8;margin-top:8px;color:#45473f}
.book-author{font-size:.875rem;line-height:1.9;color:var(--muted);margin:0 0 22px}
.book-description{font-family:var(--serif);font-size:1rem;line-height:2;margin:0 0 20px}
.book-for{font-size:.9375rem;line-height:1.9;margin:0 0 26px;padding:16px 18px;background:var(--cream);border-radius:2px}
.book-for strong{display:block;font-weight:500;margin-bottom:4px}
.book-actions{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:auto}
.book-actions a{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;color:var(--ink);text-underline-offset:5px}
.book-actions .book-review-link{flex-basis:100%;justify-content:space-between;padding:12px 20px;margin-bottom:6px;background:var(--ink);color:var(--paper);border-radius:999px;text-decoration:none;transition:background .3s}
.book-actions .book-review-link:hover{background:var(--blue)}
.book-actions a:focus-visible{outline:2px solid var(--blue);outline-offset:4px}

/* ---------- Projects (night sky) ---------- */
.section-night{background:radial-gradient(ellipse 80% 60% at 20% 100%,rgba(37,89,214,.55),transparent 60%),linear-gradient(180deg,#050c2a 0%,#0a1d63 70%,#123aa8 100%);color:#fff;overflow:hidden}
.section-night .eyebrow,.section-night .copy{color:rgba(255,255,255,.8)}
.stars{position:absolute;inset:0;width:100%;height:100%;display:block}
.section-night .section-inner{position:relative;pointer-events:none}
.section-night .section-inner a,.section-night .section-inner button{pointer-events:auto}
.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.card{min-height:240px;padding:28px;border:1px solid rgba(255,255,255,.3);border-radius:4px;background:rgba(10,24,80,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;flex-direction:column;justify-content:flex-end;pointer-events:auto}
.card span{font-size:.75rem;letter-spacing:.16em;color:rgba(255,255,255,.7)}
.card h3{font-family:var(--latin);font-weight:300;font-size:2.5rem;line-height:1.1;margin:12px 0}
.card p{font-family:var(--serif);font-size:1rem;line-height:1.9;margin:0;color:rgba(255,255,255,.86)}
.card.placeholder{border-style:dashed;background:transparent}

/* ---------- About ---------- */
.about-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.about-first{margin:0 0 26px;padding:22px 24px;max-width:34em;background:rgba(248,245,238,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:4px;color:var(--ink);text-shadow:none}
.about-first .eyebrow{color:var(--muted);margin-bottom:10px}
.about-first p{font-family:var(--serif);font-size:1rem;line-height:1.9;margin:0 0 12px}
.about-first a{color:var(--ink);font-family:var(--serif);text-underline-offset:5px;display:inline-flex;min-height:44px;align-items:center}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:var(--paper);padding:clamp(80px,14vh,140px) var(--gutter) calc(40px + env(safe-area-inset-bottom,0px))}
.site-footer .quote{font-family:var(--serif);font-weight:200;font-size:clamp(2rem,6vw,5rem);line-height:1.35;margin:0}
.site-footer .quote-en{font-family:var(--latin);font-style:italic;font-weight:300;font-size:clamp(1.25rem,2.4vw,2rem);opacity:.7;margin:16px 0 0}
.footer-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;margin-top:clamp(64px,10vh,120px);padding-top:28px;border-top:1px solid rgba(248,245,238,.18);font-size:.8125rem;letter-spacing:.08em;color:rgba(248,245,238,.7)}
.footer-row a{color:inherit;text-underline-offset:4px;display:inline-flex;align-items:center;min-height:44px}

@media(max-width:860px){
 .section-head{grid-template-columns:1fr}
 .foodscience-grid,.book-grid,.projects{grid-template-columns:1fr}
 .journal-item{grid-template-columns:minmax(0,1fr) 44px;gap:6px 16px;padding:24px 0}
 .journal-date{grid-column:1/-1;font-size:1rem}
 .journal-search{max-width:none}
 .science-card{min-height:0}
 .scene-count{display:none}
 .card{min-height:180px}
}
@media(prefers-reduced-motion:reduce){
 .scene{height:auto}
 .scene.overlap{margin-top:0}
 .scene-pin{position:relative;min-height:100vh;min-height:100svh;height:auto}
 .scene-media{transform:none}
 .scene[data-reveal] .scene-pin{-webkit-mask-image:none;mask-image:none;visibility:visible;opacity:1;pointer-events:auto}
 .reveal,.reveal-2{opacity:1;filter:none;transform:none}
 .scroll-cue::after{animation:none}
}

.journal-snippet{display:block;margin-top:10px;padding:10px 14px;background:#fff;border-left:2px solid var(--blue);font-family:var(--serif);font-size:.9375rem;line-height:1.8;color:#45473f}
.journal-snippet mark{background:#fff0b8;color:inherit;padding:0 2px}

.hero-latest{display:inline-flex;align-items:center;gap:14px;max-width:min(560px,100%);margin-top:32px;padding:10px 20px 10px 10px;border:1px solid rgba(255,255,255,.55);border-radius:999px;background:rgba(10,24,80,.22);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;text-decoration:none;text-align:left;text-shadow:none;transition:background .35s}
.hero-latest:hover{background:rgba(10,24,80,.42)}
.hero-latest:focus-visible{outline:2px solid #fff;outline-offset:4px}
.hero-latest-label{flex:none;padding:4px 12px;border-radius:999px;background:#fff;color:var(--ink);font-family:var(--latin);font-style:italic;font-size:.9375rem}
.hero-latest-title{min-width:0;font-family:var(--serif);font-size:.9375rem;line-height:1.6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hero-lang{margin:18px 0 0}.hero-lang a{color:#fff;font-family:var(--latin);font-style:italic;font-size:1rem;letter-spacing:.04em;text-underline-offset:5px}
.hero-lang a:focus-visible{outline:2px solid #fff;outline-offset:4px}
@media(max-width:600px){.hero-latest{margin-top:24px}.hero-latest-title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}
.scene-hero .scene-shade{--shade:linear-gradient(180deg,rgba(8,14,30,.3) 0%,rgba(8,14,30,0) 34%,rgba(8,14,30,0) 72%,rgba(8,14,30,.12) 100%)}
#food .scene-shade{--shade:radial-gradient(ellipse 60% 55% at 50% 50%,rgba(5,12,40,.55),rgba(5,12,40,.15) 70%,rgba(5,12,40,.3) 100%)}

.journal-item.is-collapsed{display:none}
.journal-more{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;margin-top:28px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:inherit;font-size:.9375rem;letter-spacing:.04em;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.journal-more:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.journal-more:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.journal-more[hidden]{display:none}

/* ---------- Guides (front matter `guide`) ---------- */
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.guide-card{display:flex;flex-direction:column;min-height:260px;padding:clamp(24px,3vw,36px);border:1px solid var(--line);border-radius:4px;background:rgba(255,255,255,.6);color:var(--ink);text-decoration:none;transition:border-color .4s,transform .6s cubic-bezier(.2,.7,.2,1)}
.guide-card:hover{border-color:var(--blue);transform:translateY(-6px)}
.guide-card:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.guide-tag{font-size:.75rem;letter-spacing:.14em;color:#5b5d56;margin-bottom:auto;padding-bottom:24px}
.guide-card h3{font-family:var(--serif);font-weight:300;font-size:clamp(1.25rem,2vw,1.625rem);line-height:1.6;margin:0 0 12px}
.guide-card p{font-family:var(--serif);font-size:1rem;line-height:1.9;color:#45473f;margin:0 0 18px}
.guide-more{font-family:var(--latin);font-style:italic;font-size:1.0625rem;color:var(--blue)}
@media(max-width:900px){.guide-grid{grid-template-columns:1fr}.guide-card{min-height:0}}
.section-more-dark a{color:var(--blue)}
