/* Seva Journal. Brand values inherit tokens.css; darkroom and 6px tile radius are brief-specific. */
.journal { --darkroom: #0B1A2A; --photo-radius: 6px; }
.journal-hero { padding-top:calc(var(--s11) + var(--s9)); padding-bottom:var(--s9); }
.journal-hero::after { display:none; }
.journal-hero .breadcrumb { position:relative; margin-bottom:var(--s5); color:var(--ivory); }
.journal-hero .page-hero__inner { gap:var(--s5); grid-template-columns:1.05fr 1fr; }
.journal-chapter-line { font:italic var(--text-xl)/1.4 var(--font-display); color:var(--gold-light); margin-bottom:var(--s2); }
.journal-hero .page-hero__heading { font-size:clamp(2.375rem,3.8vw,3.5rem); }
.journal-chips { display:flex; flex-wrap:wrap; gap:var(--s1); margin:var(--s3) 0 var(--s4); }
.journal-chips>span { display:inline-flex; align-items:center; gap:var(--s1); padding:var(--s1) var(--s2); border:1px solid var(--gold-line); border-radius:var(--r-pill); color:var(--ivory); font-size:var(--text-xs); }
.journal-chips svg { flex:none; width:var(--s2); height:var(--s2); color:var(--gold-light); }
.journal-cover { margin:0; align-self:center; }
.journal-cover .page-hero__image { border-radius:var(--r-sm); border:1px solid var(--gold-line); }
.journal-cover .page-hero__image img { height:auto; aspect-ratio:4/3; object-fit:cover; }
.journal-cover figcaption { display:flex; gap:var(--s2); color:var(--ivory); font-size:var(--text-xs); padding-top:var(--s2); }
.journal-cover figcaption span { color:var(--gold-light); }
.journal-facts-wrap { position:relative; margin-top:calc(-1 * var(--s5)); z-index:var(--z-above); }
.journal-facts { display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; background:var(--white); padding:var(--s4); border-radius:var(--r-sm); box-shadow:var(--shadow-lg); }
.journal-facts>div { padding:0 var(--s3); border-right:1px solid var(--border); }
.journal-facts>div:first-child { padding-left:0; }
.journal-facts>div:last-child { border:0; padding-right:0; }
.journal-facts dt { color:var(--gold); font-size:var(--text-xs); font-weight:800; text-transform:uppercase; letter-spacing:.13em; margin-bottom:var(--s1); }
.journal-facts dd { color:var(--royal-blue); font-size:var(--text-sm); font-weight:600; }
.journal-overview { display:grid; grid-template-columns:1.45fr 1fr; gap:var(--s8); align-items:start; }
.journal-overview .h2 { margin-bottom:var(--s4); }
.journal-overview .lead + .lead { margin-top:var(--s3); }
.journal-dropcap::first-letter { float:left; font:400 4.5rem/.9 var(--font-display); color:var(--gold); padding-right:var(--s1); padding-top:var(--s1); }
.journal-mission { position:sticky; top:var(--s10); padding:var(--s5); color:var(--ivory); background:var(--royal-blue); border-radius:var(--r-sm); border-bottom:3px solid var(--gold); }
.journal-quote-mark { display:block; font:400 5rem/.7 var(--font-display); color:var(--gold); }
.journal-mission p { font:400 var(--text-3xl)/1.35 var(--font-display); margin-bottom:var(--s3); }
.journal-mission cite,.journal-together-quote cite { display:block; font:500 var(--text-xs)/1.7 var(--font-body); color:var(--gold-light); }
.journal-highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s3); }
.journal-highlight { border-top:3px solid var(--gold); padding:var(--s4); background:var(--white); border-radius:var(--r-sm); box-shadow:var(--shadow-sm); transition:transform var(--t-base),box-shadow var(--t-base); }
.journal-highlight:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.journal-icon { display:grid; place-items:center; width:var(--s7); height:var(--s7); border-radius:var(--r-pill); background:var(--gold-pale); color:var(--royal-blue); margin-bottom:var(--s3); }
.journal-icon svg { width:var(--s4); height:var(--s4); }
.journal-highlight h3 { font:400 var(--text-2xl)/1.3 var(--font-display); color:var(--royal-blue); margin-bottom:var(--s2); }
.journal-highlight p { font-size:var(--text-sm); color:var(--muted); }
.journal-process { margin-top:var(--s7); }
.journal-process ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s4); margin-top:var(--s3); position:relative; }
.journal-process ol::before { content:''; position:absolute; top:var(--s3); left:0; right:0; border-top:1px dashed var(--gold); }
.journal-process li { position:relative; }
.journal-step-num { display:grid; place-items:center; width:var(--s6); height:var(--s6); border:1px solid var(--gold); background:var(--bg-section); color:var(--royal-blue); border-radius:var(--r-pill); font:400 var(--text-xl)/1 var(--font-display); margin-bottom:var(--s2); }
.journal-process h3 { font-size:var(--text-base); color:var(--royal-blue); margin-bottom:var(--s1); }
.journal-process p { color:var(--muted); font-size:var(--text-sm); }
.journal-album { background:radial-gradient(ellipse at 5% 0%,var(--royal-blue),transparent 35%),radial-gradient(ellipse at 100% 65%,var(--gold-tint),transparent 45%),var(--darkroom); color:var(--ivory); }
.journal-album-head { padding-bottom:var(--s6); }
.journal-album-head h2 { font:400 var(--text-hero)/1.05 var(--font-display); margin:var(--s2) 0 var(--s4); }
.journal-album-head h2 em { color:var(--gold-light); font-weight:400; }
.journal-album-meta { font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.2em; color:var(--gold-light); }
.journal-chapter-nav { display:flex; flex-wrap:wrap; gap:var(--s2); margin-top:var(--s4); }
.journal-chapter-nav a { display:flex; gap:var(--s2); align-items:center; border:1px solid var(--gold-line); border-radius:var(--r-pill); color:var(--gold-light); padding:var(--s1) var(--s3); min-height:var(--s6); font-family:var(--font-display); }
.journal-chapter-nav a span { color:var(--ivory); font:500 var(--text-sm)/1 var(--font-body); }
.journal-chapter-nav a:hover { border-color:var(--gold); background:var(--gold-tint); }
.journal-chapter { padding-top:var(--s5); margin-bottom:var(--s8); scroll-margin-top:var(--s10); }
#gallery { scroll-margin-top:var(--s7); }
.journal-chapter-head { display:flex; gap:var(--s4); align-items:center; padding-bottom:var(--s3); margin-bottom:var(--s4); border-bottom:1px solid var(--gold-line); }
.journal-roman { flex:none; font:400 clamp(5rem,9vw,8rem)/1 var(--font-display); color:transparent; -webkit-text-stroke:1px var(--gold); min-width:var(--s10); }
.journal-label { color:var(--gold-light); font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.15em; margin-bottom:var(--s1); }
.journal-chapter-head h3 { font:400 var(--text-3xl)/1.2 var(--font-display); margin-bottom:var(--s1); }
.journal-chapter-head p:last-child { color:var(--muted-light); font-size:var(--text-sm); }
.journal-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:var(--s3); align-items:start; }
.journal-tile { display:block; position:relative; overflow:hidden; border-radius:var(--photo-radius); background:var(--darkroom); box-shadow:0 var(--s2) var(--s6) color-mix(in srgb,var(--darkroom) 85%,transparent); color:var(--white); }
.journal-tile img { width:100%; height:auto; object-fit:cover; transition:transform 1.1s ease; }
.journal-tile:hover img { transform:scale(1.025); }
.tile-large { grid-column:span 8; }
.tile-side { grid-column:span 4; align-self:end; }
.tile-half { grid-column:span 6; }
.tile-third { grid-column:span 4; }
.tile-full,.tile-wide { grid-column:1/-1; }
.tile-full { width:80%; justify-self:center; }
.journal-caption { position:absolute; bottom:0; left:0; right:0; display:flex; gap:var(--s2); align-items:start; padding:var(--s5) var(--s3) var(--s3); color:var(--white); background:linear-gradient(transparent,color-mix(in srgb,var(--darkroom) 95%,transparent)); font-size:var(--text-sm); line-height:1.5; opacity:0; transform:translateY(var(--s1)); transition:opacity var(--t-slow),transform var(--t-slow); }
.journal-caption em { font:italic var(--text-2xl)/1.2 var(--font-display); color:var(--gold-light); }
.journal-tile:hover .journal-caption,.journal-tile:focus-visible .journal-caption { opacity:1; transform:none; }
.journal-together-quote { grid-column:span 4; align-self:stretch; display:flex; flex-direction:column; justify-content:center; border:1px solid var(--gold); border-radius:var(--photo-radius); padding:var(--s4); }
.journal-together-quote p { font:italic var(--text-3xl)/1.35 var(--font-display); margin-bottom:var(--s3); }
.journal-complete { position:absolute; top:var(--s3); right:var(--s3); border:1px solid var(--gold-line); background:color-mix(in srgb,var(--darkroom) 65%,transparent); backdrop-filter:blur(12px); border-radius:var(--r-pill); color:var(--ivory); padding:var(--s1) var(--s2); font-size:var(--text-xs); letter-spacing:.08em; }
.journal-credit { border-top:1px solid var(--gold-line); padding-top:var(--s3); font-size:var(--text-xs); color:var(--muted-light); text-align:center; }
.journal-closing { text-align:center; }
.journal-closing .h2 { max-width:24ch; margin:auto auto var(--s4); }
.journal-closing em { color:var(--gold-light); font-weight:400; }
.journal-closing .btn-group { justify-content:center; }
.journal-viewer { --darkroom:#0B1A2A; position:fixed; inset:0; width:100%; max-width:none; height:100%; height:100dvh; max-height:none; margin:0; padding:var(--s3); border:0; background:var(--darkroom); color:var(--ivory); overflow:hidden; }
.journal-viewer[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; gap:var(--s2); }
.journal-viewer::backdrop { background:var(--darkroom); }
.journal-viewer-top { display:flex; align-items:center; gap:var(--s3); font-size:var(--text-xs); letter-spacing:.1em; color:var(--gold-light); }
#viewer-counter { margin-left:auto; white-space:nowrap; }
.journal-viewer button { color:var(--ivory); min-width:var(--s6); min-height:var(--s6); border:1px solid var(--gold-line); border-radius:var(--r-pill); font-size:var(--text-xl); }
.journal-viewer button:hover { background:var(--gold-tint); }
.journal-viewer-stage { display:grid; grid-template-columns:var(--s6) minmax(0,1fr) var(--s6); gap:var(--s3); align-items:center; min-height:0; touch-action:pan-y; }
#viewer-image { width:100%; height:100%; min-height:0; object-fit:contain; }
.journal-viewer-caption { text-align:center; font:italic var(--text-xl)/1.4 var(--font-display); max-width:70ch; margin-inline:auto; }
.journal-viewer-thumbs { display:flex; gap:var(--s1); overflow-x:auto; padding:var(--s1); width:100%; max-width:100%; justify-self:center; overscroll-behavior:contain; }
.journal-viewer-thumbs button { flex:0 0 var(--s8); padding:3px; border-radius:var(--r-xs); border:2px solid transparent; min-height:0; }
.journal-viewer-thumbs img { width:100%; height:var(--s6); object-fit:cover; border-radius:var(--r-xs); }
.journal-viewer-thumbs button[aria-current="true"] { border-color:var(--gold); }
.journal-story { margin-bottom:var(--s8); }
.journal-story .story-card__image img { height:auto; aspect-ratio:4/3; }
.journal-story .story-card__location { line-height:1.6; }
.journal-milestone { display:grid; grid-template-columns:1fr 1.1fr; background:var(--white); border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-md); }
.journal-milestone img { width:100%; height:100%; object-fit:cover; }
.journal-milestone-content { padding:var(--s5); }
.journal-milestone h3 { font:400 var(--text-3xl)/1.25 var(--font-display); color:var(--royal-blue); margin-bottom:var(--s3); }
.journal-milestone-content>p:not(.eyebrow) { color:var(--muted); margin-bottom:var(--s3); }
@media(max-width:1000px) {
 .journal-hero .page-hero__inner { grid-template-columns:1fr; }
 .journal-cover { max-width:800px; }
 .journal-facts { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s3); }
 .journal-facts>div { padding:0; border:0; }
 .journal-overview { gap:var(--s4); }
 .journal-highlights { gap:var(--s2); }
 .journal-highlight { padding:var(--s3); }
 .journal-together-quote { padding:var(--s3); }
 .journal-together-quote p { font-size:var(--text-2xl); }
}
@media(max-width:640px) {
 .journal-hero { padding-top:var(--s10); padding-bottom:var(--s7); }
 .journal-hero .page-hero__heading { font-size:var(--text-4xl); }
 .journal-hero .breadcrumb { line-height:1.5; margin-bottom:var(--s3); }
 .journal-facts-wrap { margin-top:calc(-1 * var(--s3)); }
 .journal-facts { grid-template-columns:1fr; padding:var(--s3); }
 .journal-facts>div+div { border-top:1px solid var(--border); padding-top:var(--s2); }
 .journal-overview,.journal-highlights,.journal-milestone { grid-template-columns:1fr; }
 .journal-mission { position:static; margin-top:var(--s3); padding:var(--s4); }
 .journal-process ol { grid-template-columns:1fr; gap:var(--s3); }
 .journal-process ol::before { left:var(--s3); right:auto; bottom:var(--s3); border-top:0; border-left:1px dashed var(--gold); }
 .journal-process li { padding-left:var(--s7); min-height:var(--s6); }
 .journal-step-num { position:absolute; left:0; }
 .journal-album-meta { line-height:2; letter-spacing:.1em; }
 .journal-chapter-nav { gap:var(--s1); }
 .journal-chapter-nav a { padding:var(--s1) var(--s2); gap:var(--s1); }
 .journal-chapter-head { gap:var(--s2); align-items:start; }
 .journal-roman { min-width:0; font-size:4rem; }
 .journal-chapter-head h3 { font-size:var(--text-2xl); }
 .journal-grid { grid-template-columns:1fr; gap:var(--s3); }
 .journal-tile,.journal-together-quote { grid-column:1; width:100%; }
 .journal-caption { position:static; opacity:1; transform:none; padding:var(--s2); background:color-mix(in srgb,var(--royal-blue) 25%,var(--darkroom)); font-size:var(--text-xs); }
 .journal-tile:hover img { transform:none; }
 .journal-complete { top:var(--s1); right:var(--s1); font-size:.65rem; }
 .journal-together-quote { padding:var(--s4); }
 .journal-viewer { padding:var(--s2); }
 .journal-viewer-top { gap:var(--s1); letter-spacing:0; }
 .journal-viewer-stage { grid-template-columns:1fr 1fr; gap:var(--s1); grid-template-rows:minmax(0,1fr) var(--s6); }
 #viewer-image { grid-row:1; grid-column:1/-1; }
 #viewer-prev,#viewer-next { grid-row:2; width:var(--s6); justify-self:center; }
 .journal-viewer-caption { font-size:var(--text-base); }
 .journal-milestone-content { padding:var(--s3); }
}
@media(hover:none) { .journal-caption { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 .journal *, .journal-story *, .journal-milestone * { transition:none!important; animation:none!important; }
 .journal-tile:hover img,.journal-highlight:hover { transform:none; }
}
