/* Blue Spa journal — shared typography and liquid surfaces come from design-system.css. */
.journal-page { overflow-x:clip; }
.journal { color:var(--green); }
.journal h1,.journal h2,.journal h3 { font-family:var(--font-serif); font-weight:500; letter-spacing:-.035em; }
.journal h2 { font-size:var(--type-section); line-height:1.1; }
.journal em { font-weight:400; }
.journal p { line-height:1.8; }
.journal .label { font-size:var(--type-label); letter-spacing:.18em; }
.journal a:not(.btn):focus-visible { outline:2px solid var(--green); outline-offset:5px; }
.journal-heading { max-width:740px; margin:0 auto 48px; text-align:center; padding:0 24px; }
.journal-heading h2 { margin:15px 0 20px; }
.journal-heading > p:last-child { max-width:49ch; margin:auto; color:var(--muted); font-size:15px; }
.journal-home { position:relative; padding:100px 0 110px; overflow:clip; }
.journal-leaf { position:absolute; z-index:0; width:240px; left:-90px; top:170px; transform:rotate(-25deg); pointer-events:none; }
.journal-leaf.second { left:auto; right:-110px; top:auto; bottom:100px; transform:rotate(160deg); }
.journal-rows { position:relative; display:grid; gap:18px; }
.journal-row { display:flex; width:max-content; gap:18px; margin-left:calc(50% - 700px); }
.journal-row:nth-child(2) { margin-left:calc(50% - 840px); }
.journal-card { display:flex; flex-direction:column; justify-content:space-between; flex:none; width:300px; min-height:256px; padding:12px; border-radius:28px; color:var(--green); transition:box-shadow .2s; }
.journal-card:hover { box-shadow:inset 0 1px 2px #fff,0 18px 32px -20px #253d3066; }
.journal-card img { height:160px; width:100%; object-fit:cover; object-position:center 36%; border-radius:19px; }
.journal-card-copy { padding:12px 10px 6px; }
.journal-card h3 { font-size:24px; line-height:1.12; margin:7px 0 14px; }
.journal-meta { font:500 10px/1.4 var(--font-body); letter-spacing:.1em; text-transform:uppercase; }
.journal-card-bottom { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:11px; }
.journal-card-bottom b { font-size:21px; font-weight:400; }
.journal-card.quote { padding:28px; width:255px; }
.journal-card.quote h3 { font-size:32px; line-height:1.14; }
.journal-card.quote .quote-no { font:400 52px/1 var(--font-serif); opacity:.45; }
.journal-card.wide { width:380px; }
.journal-card.wide img { object-position:center 48%; }
.journal-home-cta { text-align:center; margin-top:44px; }
.journal-home-cta .btn { color:var(--green); min-height:46px; }
.journal-index { max-width:1280px; margin:auto; padding:150px 40px 100px; }
.journal-index-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:45px; }
.journal-index h1 { font-size:clamp(60px,8vw,112px); line-height:1; margin:20px 0 0; }
.journal-index-heading > p { max-width:34ch; font-size:15px; color:var(--muted); }
.journal-feature { display:grid; grid-template-columns:1.25fr 1fr; align-items:stretch; border-radius:38px; padding:14px; gap:0; }
.journal-feature > img { height:460px; width:100%; object-fit:cover; object-position:50% 32%; border-radius:27px; }
.journal-feature-copy { display:flex; flex-direction:column; align-items:start; justify-content:center; padding:40px; }
.journal-feature h2 { font-size:clamp(36px,4vw,54px); margin:20px 0; }
.journal-feature p { font-size:15px; margin-bottom:26px; color:var(--muted); }
.journal-grid-heading { display:flex; justify-content:space-between; align-items:center; margin:80px 0 28px; gap:20px; }
.journal-grid-heading h2 { font-size:36px; }
.journal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.journal-grid .journal-card { width:auto; min-width:0; }
.journal-grid .journal-card img { height:230px; }
.journal-breadcrumb { display:flex; gap:10px; flex-wrap:wrap; font-size:11px; color:var(--muted); margin-bottom:34px; }
.article-hero { padding:135px 40px 0; max-width:1440px; margin:auto; }
.article-heading { display:grid; grid-template-columns:1fr 230px; gap:50px; align-items:end; padding:15px 40px 50px; }
.article-heading h1 { font-size:clamp(52px,7.1vw,102px); line-height:1.02; max-width:15ch; margin:22px 0 0; }
.article-heading h1 em { display:block; }
.article-heading .article-deck { font-size:14px; margin:0 0 20px; color:var(--muted); }
.article-byline { font-size:11px; line-height:1.7; border-top:1px solid #45523f30; padding-top:18px; }
.article-cover { position:relative; min-height:550px; border-radius:42px; overflow:hidden; }
.article-cover > img { width:100%; height:550px; object-fit:cover; object-position:50% 35%; }
.article-cover-note { position:absolute; left:30px; bottom:30px; width:310px; padding:28px; }
.article-cover-note p { font:400 30px/1.2 var(--font-serif); margin-top:14px; }
.article-layout { display:grid; grid-template-columns:220px minmax(0,720px); gap:75px; max-width:1160px; padding:85px 40px; margin:auto; align-items:start; }
.article-toc { position:sticky; top:110px; padding:24px; font-size:12px; }
.article-toc nav { display:grid; gap:14px; margin-top:22px; }
.article-toc a { padding-bottom:10px; border-bottom:1px solid #45523f20; }
.article-body { min-width:0; }
.article-body .article-lead { font:400 clamp(23px,2.5vw,30px)/1.5 var(--font-serif); margin:0 0 60px; }
.article-body section { scroll-margin-top:115px; margin-bottom:65px; }
.article-body h2 { font-size:clamp(32px,3.2vw,44px); margin:12px 0 25px; }
.article-body p { font-size:15px; margin-bottom:20px; }
.article-pull { margin:50px 0; padding:38px; position:relative; }
.article-pull p { font:400 clamp(25px,3vw,38px)/1.3 var(--font-serif); margin:0; }
.article-checklist { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:30px 0; }
.article-checklist > div { padding:25px; }
.article-checklist h3 { font-size:25px; margin:14px 0 10px; }
.article-checklist p { font-size:13px; margin:0; }
.article-inline-photo { margin:36px 0; }
.article-inline-photo img { width:100%; max-height:410px; object-fit:cover; border-radius:30px; }
.article-inline-photo figcaption { font-size:11px; color:var(--muted); margin:12px 4px; }
.article-ending { max-width:1200px; margin:0 auto 100px; padding:55px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.article-ending h2 { font-size:clamp(36px,4vw,56px); }
.article-ending p { font-size:15px; margin-bottom:24px; }
.article-ending .btn { margin:0 8px 10px 0; }
@media(max-width:1000px) {
 .article-heading { grid-template-columns:1fr; gap:25px; padding-inline:0; }
 .article-heading aside { max-width:500px; }
 .article-layout { grid-template-columns:180px minmax(0,1fr); gap:35px; }
 .journal-feature-copy { padding:25px; }
 .journal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
 .journal-home { padding:72px 0; }
 .journal-heading { margin-bottom:30px; }
 .journal-row,.journal-row:nth-child(2) { margin:0; width:100%; padding:4px 22px 15px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:22px; gap:14px; }
 .journal-card,.journal-card.wide,.journal-card.quote { width:76vw; max-width:320px; scroll-snap-align:center; min-height:240px; }
 .journal-card img { height:145px; }
 .journal-card h3 { font-size:24px; }
 .journal-leaf { width:170px; }
 .journal-index { padding:120px 22px 70px; }
 .journal-index-heading { display:block; }
 .journal-index-heading > p { margin-top:22px; }
 .journal-feature { grid-template-columns:1fr; border-radius:30px; }
 .journal-feature > img { height:300px; border-radius:22px; }
 .journal-feature-copy { padding:26px 15px; }
 .journal-grid { grid-template-columns:1fr; }
 .journal-grid .journal-card { max-width:none; }
 .journal-grid-heading { margin-top:55px; }
 .article-hero { padding:115px 20px 0; }
 .article-heading { padding-bottom:30px; }
 .article-heading h1 { font-size:clamp(44px,11.8vw,70px); }
 .article-cover,.article-cover > img { min-height:480px; height:480px; border-radius:30px; }
 .article-cover > img { object-position:53% 35%; }
 .article-cover-note { width:calc(100% - 36px); left:18px; bottom:18px; padding:23px; }
 .article-cover-note p { font-size:27px; }
 .article-layout { display:block; padding:40px 22px 15px; }
 .article-toc { position:static; margin-bottom:40px; }
 .article-toc nav { grid-template-columns:1fr 1fr; gap:12px; }
 .article-body section { margin-bottom:45px; }
 .article-body .article-lead { margin-bottom:40px; }
 .article-pull { padding:28px; }
 .article-checklist { grid-template-columns:1fr; }
 .article-ending { margin:0 20px 65px; padding:30px; grid-template-columns:1fr; gap:24px; }
}

/* One continuous journal ribbon on phones; three scroll-linked rows on desktop. */
.journal-duplicate { display:none; }
@keyframes journal-marquee { to { transform:translateX(calc(-50% - 7px)); } }
@media(max-width:760px) {
 .journal-home .journal-rows { overflow:hidden; display:block; padding:4px 0 18px; }
 .journal-home .journal-row:nth-child(n+2) { display:none; }
 .journal-home .journal-row:first-child { width:max-content; overflow:visible; padding:0; gap:14px; animation:journal-marquee 45s linear infinite; }
 .journal-home .journal-duplicate { display:flex; }
 .journal-home .journal-row:hover, .journal-home .journal-row:focus-within { animation-play-state:paused; }
}
@media(max-width:760px) and (prefers-reduced-motion:reduce) {
 .journal-home .journal-row:first-child { animation:none; width:100%; overflow-x:auto; padding-inline:22px; }
 .journal-home .journal-duplicate { display:none; }
}
