.journal-page { min-height:100%; overflow-x:hidden; overflow-y:auto; }
.journal-page .site-header nav a[aria-current="page"] { color:var(--clay); }
.journal-menu-toggle,.journal-menu-backdrop,.journal-mobile-whatsapp { display:none; }
.journal-hero { max-width:1280px; margin:auto; padding:82px 8.5% 96px; display:grid; grid-template-columns:1fr .78fr; align-items:center; gap:80px; }
.journal-hero h1,.article-header h1 { margin:0; font:600 clamp(50px,6.5vw,84px)/.98 "Playfair Display",Georgia,serif; letter-spacing:-.055em; }
.journal-hero h1 em,.article-header h1 em { color:var(--clay); }
.journal-intro { max-width:590px; margin:26px 0 0; color:#5f5852; font-size:16px; line-height:1.75; }
.journal-hero-visual { position:relative; min-height:460px; display:grid; place-items:center; background:#e9dfd2; }
.journal-hero-visual:before { content:""; position:absolute; inset:22px; border:1px solid rgba(29,27,25,.2); }
.journal-hero-visual img { position:relative; width:76%; max-height:390px; object-fit:contain; mix-blend-mode:multiply; }
.journal-hero-note { position:absolute; right:23px; bottom:18px; margin:0; color:#6e655e; font-size:9px; letter-spacing:.14em; writing-mode:vertical-rl; transform:rotate(180deg); }
.journal-list { background:var(--sand); padding:92px max(8.5%,calc((100vw - 1060px)/2)); }
.journal-list-heading { max-width:740px; margin-bottom:42px; }
.journal-list-heading h2 { margin:0; font:600 clamp(40px,5vw,58px)/1.05 "Playfair Display",Georgia,serif; letter-spacing:-.045em; }
.journal-list-heading p:last-child { max-width:590px; margin:20px 0 0; color:#625c55; font-size:14px; line-height:1.7; }
.journal-card { display:grid; grid-template-columns:.82fr 1.18fr; min-height:380px; background:var(--paper); }
.journal-card-image { position:relative; display:grid; place-items:center; overflow:hidden; background:#ddd4c8; }
.journal-card-image img { width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; transition:transform .3s ease; }
.journal-card:hover .journal-card-image img { transform:scale(1.025); }
.journal-card-copy { display:flex; flex-direction:column; justify-content:center; padding:56px; }
.journal-meta { margin:0 0 16px; color:#847b73; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.journal-card h3 { max-width:650px; margin:0; font:600 clamp(34px,4vw,50px)/1.05 "Playfair Display",Georgia,serif; letter-spacing:-.04em; }
.journal-card-copy>p:not(.journal-meta) { max-width:590px; margin:20px 0 28px; color:#625c55; font-size:14px; line-height:1.7; }
.read-link { display:inline-flex; width:max-content; align-items:center; gap:20px; padding-bottom:5px; border-bottom:1px solid var(--ink); font-size:12px; font-weight:700; }
.read-link:hover { color:var(--clay); border-color:var(--clay); }
.journal-cta { max-width:1280px; margin:auto; padding:88px 8.5%; display:grid; grid-template-columns:1fr .8fr; align-items:center; gap:70px; }
.journal-cta h2 { margin:0; font:600 clamp(38px,4.8vw,58px)/1.04 "Playfair Display",Georgia,serif; letter-spacing:-.045em; }
.journal-cta-copy { display:grid; justify-items:start; gap:22px; }
.journal-cta-copy p { margin:0; color:#625c55; font-size:14px; line-height:1.7; }

.article-page { background:#f8f4ee; }
.article-header { max-width:1060px; margin:auto; padding:78px 32px 58px; text-align:center; }
.article-breadcrumbs { display:flex; justify-content:center; align-items:center; gap:10px; margin-bottom:28px; color:#766d65; font-size:11px; }
.article-breadcrumbs a { text-decoration:underline; text-underline-offset:3px; }
.article-header h1 { max-width:930px; margin:auto; font-size:clamp(47px,6vw,78px); }
.article-deck { max-width:760px; margin:26px auto 0; color:#5d5650; font-size:17px; line-height:1.75; }
.article-byline { display:flex; justify-content:center; flex-wrap:wrap; gap:8px 20px; margin:24px 0 0; color:#81776f; font-size:11px; }
.article-hero { max-width:1080px; height:540px; margin:0 auto; position:relative; display:grid; place-items:center; overflow:hidden; background:#e7ded1; }
.article-hero:before { content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:#c78d73; right:-90px; bottom:-150px; }
.article-hero:after { content:"AUTHENTICITY STARTS WITH THE WHOLE STORY"; position:absolute; left:28px; bottom:26px; max-width:150px; color:#5e564f; font-size:9px; font-weight:700; letter-spacing:.14em; line-height:1.5; }
.article-hero img { position:relative; z-index:1; width:min(58%,560px); height:84%; object-fit:contain; mix-blend-mode:multiply; }
.article-layout { max-width:1120px; margin:auto; padding:76px 32px 110px; display:grid; grid-template-columns:230px minmax(0,720px); justify-content:space-between; gap:72px; }
.article-toc { position:sticky; top:28px; align-self:start; padding:22px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.article-toc strong { display:block; margin-bottom:13px; color:var(--clay); font-size:10px; letter-spacing:.13em; text-transform:uppercase; }
.article-toc a { display:block; padding:7px 0; color:#625c55; font-size:12px; line-height:1.45; }
.article-toc a:hover { color:var(--clay); }
.article-body { color:#312d29; }
.article-body .lead { margin:0 0 38px; font:600 27px/1.45 "Playfair Display",Georgia,serif; letter-spacing:-.02em; }
.article-body h2 { scroll-margin-top:24px; margin:64px 0 18px; font:600 38px/1.1 "Playfair Display",Georgia,serif; letter-spacing:-.035em; }
.article-body h3 { margin:30px 0 10px; font-size:17px; }
.article-body p,.article-body li { color:#554e48; font-size:15px; line-height:1.82; }
.article-body p { margin:0 0 20px; }
.article-body ul,.article-body ol { margin:18px 0 24px; padding-left:24px; }
.article-body li+li { margin-top:9px; }
.article-body a { color:#8e4f37; text-decoration:underline; text-underline-offset:3px; }
.fact-box,.warning-box,.quick-check { margin:34px 0; padding:26px 28px; border:1px solid var(--line); background:#eee5da; }
.warning-box { border-left:4px solid var(--clay); background:#fffaf5; }
.fact-box strong,.warning-box strong,.quick-check strong { display:block; margin-bottom:10px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.fact-box p,.warning-box p,.quick-check p { margin:0; font-size:14px; }
.quick-check ol { display:grid; gap:8px; margin:14px 0 18px; padding-left:22px; }
.quick-check li { padding-left:4px; font-size:14px; line-height:1.65; }
.inspection-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:26px 0 32px; }
.inspection-card { padding:22px; border:1px solid var(--line); background:#fffaf5; }
.inspection-card span { display:block; margin-bottom:10px; color:var(--clay); font:600 24px "Playfair Display",Georgia,serif; }
.inspection-card h3 { margin:0 0 8px; font-size:14px; }
.inspection-card p { margin:0; font-size:13px; line-height:1.65; }
.photo-checklist { columns:2; column-gap:38px; }
.decision-list { list-style:none; padding:0 !important; counter-reset:decision; }
.decision-list li { position:relative; padding:18px 18px 18px 54px; border-top:1px solid var(--line); counter-increment:decision; }
.decision-list li:last-child { border-bottom:1px solid var(--line); }
.decision-list li:before { content:counter(decision,decimal-leading-zero); position:absolute; left:10px; top:19px; color:var(--clay); font-size:11px; font-weight:700; }
.article-sources { margin-top:68px; padding-top:26px; border-top:1px solid var(--line); }
.article-sources h2 { margin:0 0 18px; font-size:26px; }
.article-sources>p { margin:0 0 18px; color:var(--muted); font-size:12px; line-height:1.7; }
.article-sources ol { margin:0; padding-left:20px; }
.article-sources li { font-size:12px; line-height:1.65; }
.article-disclaimer { margin-top:32px; color:#766e67 !important; font-size:12px !important; line-height:1.65 !important; }
.article-share { margin-top:44px; padding:34px; background:var(--ink); color:#fff; }
.article-share h2 { margin:0; color:#fff; font-size:31px; }
.article-share p { margin:12px 0 22px; color:#c9c0b7; font-size:13px; }
.article-share .button { background:#1f6f43; color:#fff; text-decoration:none; }
.article-share .button:hover { background:var(--clay); }

@media (prefers-reduced-motion:reduce) { .journal-card-image img { transition:none; } }
@media (max-width:900px) {
  .journal-hero { grid-template-columns:1fr; gap:44px; padding-top:58px; }
  .journal-hero-visual { min-height:390px; }
  .journal-card { grid-template-columns:1fr; }
  .journal-card-image { min-height:390px; }
  .journal-cta { grid-template-columns:1fr; gap:30px; }
  .article-layout { grid-template-columns:1fr; gap:32px; }
  .article-toc { position:static; display:grid; grid-template-columns:repeat(2,1fr); column-gap:20px; }
  .article-toc strong { grid-column:1/-1; }
}
@media (max-width:760px) {
  .journal-page.journal-menu-open { overflow:hidden; }
  .journal-page .site-header { position:relative; z-index:100; }
  .journal-page .journal-menu-toggle { display:grid; width:42px; height:42px; padding:10px; border:1px solid var(--line); background:transparent; place-content:center; gap:5px; color:var(--ink); cursor:pointer; }
  .journal-page .journal-menu-toggle span { display:block; width:19px; height:1.5px; background:currentColor; transition:transform .2s ease,opacity .2s ease; }
  .journal-page.journal-menu-open .journal-menu-toggle { position:fixed; top:16px; right:20px; z-index:130; background:var(--paper); }
  .journal-page.journal-menu-open .journal-menu-toggle span:first-child { transform:translateY(6.5px) rotate(45deg); }
  .journal-page.journal-menu-open .journal-menu-toggle span:nth-child(2) { opacity:0; }
  .journal-page.journal-menu-open .journal-menu-toggle span:last-child { transform:translateY(-6.5px) rotate(-45deg); }
  .journal-page .site-header nav { position:fixed; z-index:120; top:0; right:0; display:flex; visibility:hidden; width:min(84vw,350px); height:100vh; height:100dvh; padding:94px 28px 34px; flex-direction:column; align-items:stretch; gap:0; overflow-y:auto; background:var(--paper); box-shadow:-18px 0 50px rgba(29,27,25,.18); transform:translateX(105%); transition:transform .24s ease,visibility .24s; }
  .journal-page.journal-menu-open .site-header nav { visibility:visible; transform:translateX(0); }
  .journal-page .site-header nav a { display:flex; align-items:center; justify-content:space-between; min-height:54px; padding:13px 0; border-top:1px solid var(--line); font:600 22px/1.1 "Playfair Display",Georgia,serif; }
  .journal-page .site-header nav a:last-child { border-bottom:1px solid var(--line); }
  .journal-page .site-header nav a::after { content:"→"; color:var(--clay); font:400 18px "DM Sans",Arial,sans-serif; }
  .journal-page .site-header nav .journal-mobile-whatsapp { display:flex; margin-top:20px; padding:14px 16px; border:0; background:#1f6f43; color:#fff; font:700 11px "DM Sans",Arial,sans-serif; letter-spacing:.04em; }
  .journal-page .site-header nav .journal-mobile-whatsapp::after { color:#fff; }
  .journal-page .journal-menu-backdrop { position:fixed; z-index:110; inset:0; display:block; border:0; background:rgba(29,27,25,.46); opacity:0; visibility:hidden; transition:opacity .2s ease,visibility .2s; }
  .journal-page.journal-menu-open .journal-menu-backdrop { opacity:1; visibility:visible; }
  .journal-hero { padding:50px 20px 66px; }
  .journal-hero h1 { font-size:48px; }
  .journal-hero-visual { min-height:340px; }
  .journal-list { padding:66px 20px; }
  .journal-card-image { min-height:310px; }
  .journal-card-copy { padding:34px 25px 40px; }
  .journal-card h3 { font-size:35px; }
  .journal-cta { padding:65px 24px; }
  .article-header { padding:54px 20px 42px; }
  .article-header h1 { font-size:45px; }
  .article-deck { font-size:15px; }
  .article-hero { height:390px; }
  .article-hero img { width:78%; height:82%; }
  .article-layout { padding:48px 20px 78px; }
  .article-body .lead { font-size:23px; }
  .article-body h2 { margin-top:52px; font-size:33px; }
  .inspection-grid { grid-template-columns:1fr; }
  .photo-checklist { columns:1; }
  .article-share { margin-left:-20px; margin-right:-20px; padding:32px 20px; }
}
@media (prefers-reduced-motion:reduce) {
  .journal-page .site-header nav,.journal-page .journal-menu-backdrop,.journal-page .journal-menu-toggle span { transition:none; }
}
