/*
Theme Name: dds_stayingrounded.com
Theme URI: https://stayingrounded.com/
Author: Ananya Sharma
Description: A field-journal theme for an English-language guide to mindful downsizing, intentional home buying and settling into a calm, rooted home in India. Warm earth paper, ledger rules, stamped headings and pinned journal sheets.
Version: 1.1
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: strnd
*/

/* ---------- Fonts ---------- */
@font-face { font-family: "Special Elite"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/special-elite-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Special Elite"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/special-elite-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Courier Prime"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/courier-prime-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Courier Prime"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/courier-prime-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C0, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Courier Prime"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/courier-prime-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Courier Prime"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/courier-prime-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C0, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Roboto Condensed"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/roboto-condensed-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Roboto Condensed"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/roboto-condensed-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C0, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Roboto Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/roboto-condensed-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Roboto Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/roboto-condensed-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C0, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/source-serif-4-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/source-serif-4-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C0, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Source Serif 4"; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/source-serif-4-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/source-serif-4-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/source-serif-4-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C0, U+2C60-2C7F, U+A720-A7FF; }

/* ---------- Tokens ---------- */
:root {
    --sand: #EDE4D3;
    --sand-deep: #E6DBC6;
    --olive: #DCD9C2;
    --clay: #3A2E26;
    --clay-deep: #2F251E;
    --ink: #2B2620;
    --khaki: #7A6E5D;
    --terra: #B4472A;
    --terra-dark: #93381F;
    --sage: #4E6E5A;
    --mustard: #D9A441;
    --bronze: #8C7B63;
    --grid: #C9CFB8;
    --margin-bg: #E3E3D2;
    --sheet-paper: #F3ECDE;
    --tape: rgba(198, 168, 118, 0.55);

    --f-stamp: "Special Elite", "Courier New", Courier, monospace;
    --f-type: "Courier Prime", "Courier New", Courier, monospace;
    --f-cond: "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
    --f-read: "Source Serif 4", Georgia, "Times New Roman", serif;

    --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.32 0 0 0 0 0.26 0 0 0 0 0.18 0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
    --postmark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='130' viewBox='0 0 220 130' fill='none' stroke='%238C7B63' stroke-linecap='round'%3E%3Cg opacity='.7'%3E%3Cpath d='M4 52c14-9 28 9 42 0s28 9 42 0 28 9 42 0' stroke-width='2'/%3E%3Cpath d='M4 66c14-9 28 9 42 0s28 9 42 0 28 9 42 0' stroke-width='2'/%3E%3Cpath d='M4 80c14-9 28 9 42 0s28 9 42 0 28 9 42 0' stroke-width='2'/%3E%3Cpath d='M4 94c14-9 28 9 42 0s28 9 42 0 28 9 42 0' stroke-width='2'/%3E%3Ccircle cx='160' cy='66' r='52' stroke-width='2.4' stroke-dasharray='10 5'/%3E%3Ccircle cx='160' cy='66' r='42' stroke-width='1.2'/%3E%3Cpath d='M140 58l20-14 20 14v26h-40z' stroke-width='2.4'/%3E%3Cpath d='M154 84V70h12v14' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
    margin: 0;
    overflow-x: hidden;
    color: var(--ink);
    font-family: var(--f-type);
    font-size: 1rem;
    line-height: 1.6;
    background-color: var(--margin-bg);
    background-image:
        linear-gradient(rgba(140, 150, 118, 0.32) 1px, transparent 1px),
        linear-gradient(90deg, rgba(140, 150, 118, 0.32) 1px, transparent 1px),
        linear-gradient(var(--grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid) 1px, transparent 1px);
    background-size: 60px 60px, 60px 60px, 12px 12px, 12px 12px;
}

img, svg { max-width: 100%; }
img { height: auto; }

p { margin: 0 0 1em; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 0.6em; line-height: 1.2; font-weight: 400; font-family: var(--f-stamp); color: var(--ink); overflow-wrap: break-word; hyphens: auto; }
p, li, td, th, dd, dt, figcaption, blockquote { overflow-wrap: break-word; hyphens: auto; }

a { color: var(--terra-dark); text-decoration: underline; text-decoration-style: wavy; text-decoration-color: var(--sage); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color .2s ease, text-decoration-color .2s ease; }
a:hover { color: var(--terra); text-decoration-color: var(--terra); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px dashed var(--terra); outline-offset: 3px; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 100; padding: .6em 1em; background: var(--ink); color: var(--sand); font-family: var(--f-cond); text-decoration: none; }
.skip-link:focus { top: 12px; }
.svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; border: 1px solid var(--bronze); }
th, td { border: 1px solid var(--bronze); padding: .55em .8em; text-align: start; vertical-align: top; }
th { background: rgba(140, 123, 99, 0.14); font-family: var(--f-type); font-weight: 700; }

/* ---------- Sheet (single width container) ---------- */
.sheet {
    width: min(100%, 1210px);
    margin-inline: auto;
    background-color: var(--sand);
    background-image: var(--grain);
    box-shadow: 0 0 0 1px rgba(140, 123, 99, 0.25), 0 10px 40px rgba(58, 46, 38, 0.16);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.sheet__main { flex: 1 0 auto; min-width: 0; }

/* ---------- Header ---------- */
.masthead {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.2rem 2rem;
    padding: 2.4rem 4.5% 1.6rem;
}
.masthead__brand { display: flex; align-items: flex-start; gap: 1.1rem; min-width: 0; flex: 1 1 520px; }
.masthead__logo { flex: 0 0 auto; display: block; line-height: 0; text-decoration: none; transition: transform .35s ease; }
.masthead__logo:hover { transform: rotate(-8deg); }
.masthead__logo .seal, .brand-logo { width: 104px; height: 104px; object-fit: contain; display: block; }
.masthead__words { min-width: 0; }
.masthead__name { margin: .2rem 0 .45rem; max-width: 48ch; font-family: var(--f-stamp); font-size: clamp(1.02rem, 0.88rem + 0.45vw, 1.28rem); line-height: 1.3; letter-spacing: -0.01em; hyphens: manual; }
.masthead__name a { color: var(--ink); text-decoration: none; }
.masthead__name a:hover { color: var(--terra); }
.masthead__tagline { margin: 0; max-width: 64ch; hyphens: manual; color: #4A4238; font-family: var(--f-cond); font-size: 0.95rem; line-height: 1.4; color: var(--ink); }

.nav-toggle { display: none; align-items: center; gap: .55rem; padding: .55rem .9rem; border: 2px solid var(--ink); background: transparent; color: var(--ink); font-family: var(--f-cond); font-size: 1rem; cursor: pointer; }
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after { display: block; width: 20px; height: 2px; background: currentColor; position: relative; content: ""; }
.nav-toggle__bars::before { position: absolute; top: -6px; }
.nav-toggle__bars::after { position: absolute; top: 6px; }

.topnav { padding-top: .5rem; }
.topnav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.topnav__list li { display: flex; align-items: center; }
.topnav__list li + li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--ink); margin: 0 .85rem; opacity: .8; }
.topnav__list a { font-family: var(--f-cond); font-size: 1.08rem; color: var(--ink); text-decoration: none; padding: .2rem 0; border-bottom: 2px solid transparent; transition: border-color .2s ease, color .2s ease; }
.topnav__list a:hover, .topnav__list .current-menu-item > a { color: var(--terra); border-bottom-color: var(--mustard); }

/* ---------- Generic section ("leaf") ---------- */
.leaf { position: relative; padding: 3.6rem 0; }
.leaf__inner { width: 85%; margin-inline: auto; position: relative; z-index: 1; }
.leaf--sand { background-color: var(--sand); background-image: var(--grain); }
.leaf--olive { background-color: var(--olive); background-image: var(--grain), linear-gradient(rgba(78, 110, 90, 0.05), rgba(78, 110, 90, 0.05)); }
.leaf--ledger { background-image: var(--grain), repeating-linear-gradient(to bottom, transparent 0 31px, rgba(140, 123, 99, 0.16) 31px 32px); }

.sec-title { position: relative; font-size: clamp(1.7rem, 1.2rem + 1.8vw, 2.6rem); letter-spacing: -0.02em; margin-bottom: 1.6rem; padding-inline-start: 1.6rem; }
.sec-title::before { content: ""; position: absolute; inset-inline-start: 0; top: 0.42em; width: 0.62rem; height: 0.62rem; border-radius: 50%; border: 2px solid var(--terra); box-shadow: inset 0 0 0 2px var(--sand); background: var(--terra); }
.sec-title--center { text-align: center; padding-inline-start: 0; }
.sec-title--center::before { position: static; display: inline-block; vertical-align: middle; margin-inline-end: .7rem; transform: translateY(-0.12em); }
.sec-title--rule { padding-bottom: .55rem; background-image: linear-gradient(var(--ink), var(--ink)); background-size: 100% 2px; background-repeat: no-repeat; background-position: 0 100%; }

.postmark { position: absolute; width: 190px; height: 112px; background: var(--postmark) center / contain no-repeat; pointer-events: none; z-index: 0; }
.postmark--right { right: 1.2rem; bottom: -2.2rem; transform: rotate(-8deg); }
.postmark--top { right: 1.5rem; top: -1.6rem; transform: rotate(6deg); }
.postmark--left { left: -1.4rem; bottom: -.6rem; transform: rotate(-12deg) scale(.6); opacity: .7; }

.wavy-link { font-family: var(--f-type); font-weight: 700; color: var(--terra-dark); }

/* ---------- Stamp buttons ---------- */
.stamp-btn {
    position: relative;
    display: inline-block;
    padding: .5em 1.05em;
    font-family: var(--f-type);
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2;
    color: var(--terra);
    text-decoration: none;
    background: rgba(255, 248, 236, 0.45);
    border: 0;
    border-radius: 0;
    cursor: pointer;
    transform: rotate(-1.2deg);
    transition: transform .2s ease, color .2s ease, background-color .2s ease;
    isolation: isolate;
}
.stamp-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    border: 2px solid var(--terra);
    box-shadow: inset 0 0 0 1px rgba(180, 71, 42, 0.35);
    filter: url(#strnd-rough);
    z-index: -1;
    pointer-events: none;
}
.stamp-btn:hover, .stamp-btn:focus-visible { color: var(--sand); background: var(--terra); transform: rotate(0deg) translate(-1px, -2px); }
.stamp-btn--solid { color: var(--sand); background: var(--terra); }
.stamp-btn--solid:hover, .stamp-btn--solid:focus-visible { background: var(--terra-dark); color: var(--sand); }

/* ---------- Block 1: wheel ---------- */
.leaf--wheel { padding-top: 1.2rem; padding-bottom: 4rem; }
.wheel-block { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: center; gap: 2rem 3rem; }
.wheel { position: relative; margin: 0; width: min(100%, 520px); justify-self: center; aspect-ratio: 940 / 960; }
.wheel__img { display: block; width: 100%; height: 100%; object-fit: contain; }
.wheel__labels { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.wheel__arc { font-family: var(--f-stamp); font-size: 50px; fill: var(--ink); letter-spacing: 1px; }
.wheel__q { font-family: var(--f-stamp); font-size: 52px; fill: var(--ink); }
.wheel__core { font-family: var(--f-type); font-size: 32px; fill: var(--ink); }
.wheel__stamp { stroke: var(--bronze); fill: none; opacity: .75; }
.wheel__stamp circle[r="2.4"] { fill: var(--bronze); stroke: none; }
.wheel__stamp--soft { opacity: .6; }
.wheel:hover .wheel__q { fill: var(--terra-dark); transition: fill .3s ease; }

.wheel-notes { min-width: 0; }
.wheel-notes__lead { font-family: var(--f-cond); font-size: 1.12rem; line-height: 1.55; max-width: 44ch; color: var(--ink); margin-bottom: 1.4rem; }
.ring-list { list-style: none; margin: 0 0 1.6rem; padding: 0; }
.ring-list li { position: relative; padding-inline-start: 2.6rem; margin-bottom: 1.05rem; font-family: var(--f-cond); font-size: clamp(1.1rem, 1rem + .4vw, 1.4rem); line-height: 1.3; }
.ring-list li::before { content: ""; position: absolute; inset-inline-start: 0; top: -0.05em; width: 1.6rem; height: 1.6rem; border-radius: 50%; border: 1.6px solid var(--ink); }
.ring-list li::after { content: ""; position: absolute; inset-inline-start: .48rem; top: .22em; width: .55rem; height: .9rem; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(40deg); }

/* ---------- Block 2: rooms ---------- */
.leaf--rooms { padding-top: 2.8rem; padding-bottom: 2.6rem; }
.rooms { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1.5px solid var(--bronze); }
.rooms__panel { min-width: 0; padding: 1.4rem 1rem 1.2rem; text-align: center; display: flex; flex-direction: column; align-items: center; transition: background-color .25s ease; }
.rooms__panel + .rooms__panel { border-inline-start: 1.5px solid rgba(78, 110, 90, 0.55); }
.rooms__panel img { display: block; height: 96px; width: auto; max-width: 100%; object-fit: contain; margin-bottom: .9rem; transition: transform .3s ease; }
.rooms__panel:hover { background-color: rgba(237, 228, 211, 0.55); }
.rooms__panel:hover img { transform: translateY(-4px); }
.rooms__name { font-family: var(--f-type); font-size: 1.2rem; margin: 0 0 .4rem; }
.rooms__tip { margin: 0; font-family: var(--f-cond); font-size: .9rem; line-height: 1.4; color: #5E5446; }

/* ---------- Journal cards ---------- */
.journal-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .4rem 1.5rem; margin-bottom: 2.2rem; }
.journal-head .sec-title { flex: 1 1 420px; margin-bottom: 0; }
.journal-head__all { margin-bottom: .7rem; }

.jr-grid { display: grid; gap: 2.4rem 2.6rem; }
.jr-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.jr-grid--list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.2rem 2rem; }
.layout-single .jr-grid--list { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.jr-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 1rem 1rem 1.2rem;
    background: #F6EFE1;
    box-shadow: 0 1px 0 rgba(140, 123, 99, .3), 0 10px 18px -8px rgba(58, 46, 38, 0.35);
    transition: transform .3s ease, box-shadow .3s ease;
}
.jr-card::before, .jr-card::after { content: ""; position: absolute; width: 74px; height: 24px; background: var(--tape); box-shadow: 0 1px 2px rgba(58, 46, 38, .12); z-index: 2; pointer-events: none; }
.jr-card::before { top: -8px; left: -22px; transform: rotate(-38deg); }
.jr-card::after { bottom: -6px; right: -20px; transform: rotate(-36deg); }
.jr-grid > .jr-card:nth-child(3n+1) { transform: rotate(-2deg); }
.jr-grid > .jr-card:nth-child(3n+2) { transform: rotate(.8deg) translateY(8px); }
.jr-grid > .jr-card:nth-child(3n+2)::before { left: auto; right: -20px; transform: rotate(38deg); }
.jr-grid > .jr-card:nth-child(3n) { transform: rotate(1.8deg); }
.jr-grid > .jr-card:nth-child(3n)::after { right: auto; left: -18px; transform: rotate(36deg); }
.jr-grid > .jr-card:hover { transform: rotate(0deg) translateY(-6px); box-shadow: 0 1px 0 rgba(140, 123, 99, .3), 0 18px 26px -10px rgba(58, 46, 38, 0.4); }
.jr-grid--list > .jr-card:nth-child(3n+1) { transform: rotate(-.8deg); }
.jr-grid--list > .jr-card:nth-child(3n+2) { transform: rotate(.5deg); }
.jr-grid--list > .jr-card:nth-child(3n) { transform: rotate(.9deg); }
.jr-grid--list > .jr-card:hover { transform: rotate(0deg) translateY(-5px); }
.jr-card.is-pinned .jr-card__title::before { content: "Pinned \00B7\00A0"; color: var(--terra); font-family: var(--f-type); font-size: .8em; }

.jr-card__thumb { overflow: hidden; background: #D8CDB8; }
.jr-card__thumb a { display: block; text-decoration: none; }
.jr-card__thumb img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(.92) contrast(1.02); transition: transform .5s ease; }
.jr-card:hover .jr-card__thumb img { transform: scale(1.04); }
.jr-card__body { flex: 1; display: flex; flex-direction: column; min-width: 0; padding: 1rem .35rem 0; }
.jr-card__title { font-family: var(--f-stamp); font-size: 1.32rem; line-height: 1.25; margin: 0 0 .3rem; }
.jr-card__title a { color: var(--ink); text-decoration: none; }
.jr-card__title a:hover { color: var(--terra); }
.jr-card__date { display: block; font-family: var(--f-type); font-size: .85rem; color: var(--khaki); margin-bottom: .55rem; }
.jr-card__excerpt { font-family: var(--f-type); font-size: .9rem; line-height: 1.5; color: #4A4238; margin-bottom: 1rem; }
.jr-card__excerpt p { margin: 0 0 0.5em; background: none; }
.jr-card__more { align-self: flex-end; margin-top: auto; font-size: .95rem; }
.empty-note { font-family: var(--f-type); color: var(--khaki); padding: 1.2rem 1.4rem; border: 1.5px dashed var(--bronze); background: rgba(255, 250, 240, 0.4); }

/* ---------- Block 3: checklist ---------- */
.leaf--checklist { padding-top: 1rem; padding-bottom: 4.2rem; }
.checklist-block { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 1.2rem 3rem; align-items: center; }
.checklist-block__title { grid-column: 1 / -1; justify-self: start; margin-bottom: .4rem; }
.checklist-block__table { min-width: 0; align-self: start; }
.ledger { margin: 0; border: 1.5px solid var(--bronze); background: rgba(246, 239, 225, 0.6); font-family: var(--f-type); }
.ledger td { border: 1px solid var(--bronze); padding: .62em 1em; font-size: 1.02rem; vertical-align: middle; }
.ledger tr { cursor: pointer; transition: background-color .2s ease; }
.ledger tr:hover { background: rgba(217, 164, 65, 0.12); }
.ledger__tick { width: 5.4rem; text-align: center; }
.ledger__blank { width: 3.4rem; }
.ledger__ring { position: relative; display: inline-block; width: 1.65rem; height: 1.5rem; border: 1.5px solid var(--ink); border-radius: 50% 46% 52% 48%; vertical-align: middle; }
.ledger tr.is-ticked .ledger__ring::after { content: ""; position: absolute; left: .45rem; top: -.35rem; width: .55rem; height: 1.1rem; border-right: 3px solid var(--terra); border-bottom: 3px solid var(--terra); transform: rotate(38deg); }
.ledger tr.is-ticked td:first-child { color: var(--sage); }

.big-five { text-align: center; min-width: 0; padding-bottom: .4rem; }
.big-five__num { display: block; font-family: var(--f-stamp); font-size: clamp(7rem, 5rem + 7vw, 11rem); line-height: .85; color: var(--mustard); text-shadow: 2px 2px 0 rgba(147, 56, 31, 0.15); transform: rotate(-3deg); }
.big-five__label { font-family: var(--f-stamp); font-size: clamp(1.4rem, 1.1rem + .8vw, 1.8rem); line-height: 1.15; margin: .6rem 0 .5rem; }
.big-five__note { font-family: var(--f-cond); font-size: .95rem; color: var(--khaki); margin: 0; }

/* ---------- Block 4: timeline ---------- */
.leaf--timeline { padding-bottom: 3.4rem; background-image: var(--grain), repeating-linear-gradient(to bottom, transparent 0 27px, rgba(78, 110, 90, 0.14) 27px 28px); overflow: hidden; }
.settle { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); position: relative; }
.settle::before { content: ""; position: absolute; top: 9px; left: calc(100% / 12); right: -1.5rem; height: 2px; background: var(--ink); }
.settle::after { content: ""; position: absolute; top: 2px; right: -1.4rem; width: 14px; height: 14px; border-top: 2px solid var(--ink); border-right: 2px solid var(--ink); transform: rotate(45deg); }
.settle__step { position: relative; text-align: center; padding: 0 .4rem; min-width: 0; }
.settle__dot { display: block; width: 20px; height: 20px; margin: 0 auto 1rem; border-radius: 50%; background: #3F3730; box-shadow: 0 0 0 3px var(--olive), 0 0 0 4.5px rgba(43, 38, 32, .6); position: relative; z-index: 1; transition: background-color .2s ease, transform .2s ease; }
.settle__step:hover .settle__dot { background: var(--terra); transform: scale(1.15); }
.settle__step strong { display: block; font-family: var(--f-type); font-weight: 400; font-size: 1.12rem; line-height: 1.3; margin-bottom: .35rem; }
.settle__month { display: block; }
.settle__step > span:last-child { display: block; font-family: var(--f-cond); font-size: .9rem; line-height: 1.35; color: #5E5446; }

/* ---------- Inner pages ---------- */
.inner-leaf { width: 90%; margin-inline: auto; padding: .6rem 0 4rem; }
.crumbs { font-family: var(--f-type); font-size: .88rem; color: var(--khaki); padding: .6rem 0 1.4rem; border-bottom: 1px dashed var(--bronze); margin-bottom: 2.2rem; }
.crumbs a { color: var(--sage); }
.crumbs__sep { margin: 0 .35rem; color: var(--bronze); }
.crumbs span[aria-current] { color: var(--ink); }

.layout-with-sidebar { display: flex; justify-content: space-between; align-items: flex-start; gap: 0; }
.layout-with-sidebar > .content-area { flex: 0 0 67%; min-width: 0; }
.layout-with-sidebar > .sidebar { flex: 0 0 27%; min-width: 0; }
.layout-single { display: block; }
.layout-single > .content-area { width: 85%; margin-left: auto; margin-right: auto; }

.page-head { margin-bottom: 2rem; }
.entry-head { margin-bottom: 1.8rem; }
.page-head__title, .entry-head__title { font-size: clamp(1.9rem, 1.3rem + 2vw, 2.9rem); letter-spacing: -0.02em; margin-bottom: .6rem; padding-bottom: .5rem; background-image: linear-gradient(var(--ink), var(--ink)); background-size: 120px 2px; background-repeat: no-repeat; background-position: 0 100%; }
.page-head__intro { font-family: var(--f-read); font-size: 1.08rem; color: #4A4238; }
.entry-head__meta { font-family: var(--f-type); font-size: .9rem; color: var(--khaki); margin: .6rem 0 0; }
.entry-head__dot { margin: 0 .45rem; }
.entry-photo { margin: 1.6rem 0 2rem; padding: .8rem; background: #F6EFE1; box-shadow: 0 10px 18px -10px rgba(58, 46, 38, .4); transform: rotate(-.6deg); }
.entry-photo img { display: block; width: 100%; height: auto; }

.entry-content { font-family: var(--f-read); font-size: 1.1rem; line-height: 1.75; color: var(--ink); }
.entry-content > * { max-width: 100%; }
.entry-content h2 { font-size: 1.8rem; margin: 2rem 0 .8rem; }
.entry-content h3 { font-size: 1.45rem; margin: 1.7rem 0 .7rem; }
.entry-content h4 { font-size: 1.2rem; margin: 1.5rem 0 .6rem; }
.entry-content ul, .entry-content ol { padding-inline-start: 1.6em; margin: 0 0 1.2em; }
.entry-content li { margin-bottom: .4em; }
.entry-content ul li::marker { color: var(--terra); }
.entry-content ol li::marker { color: var(--terra); font-family: var(--f-type); font-weight: 700; }
.entry-content blockquote { margin: 1.8em 0; padding: 1.3rem 1.6rem 1.3rem 1.8rem; background: var(--olive); border-inline-start: 4px solid var(--sage); font-family: var(--f-stamp); font-size: 1.2rem; line-height: 1.5; }
.entry-content blockquote p:last-child { margin-bottom: 0; }
.entry-content img { display: block; height: auto; }
.entry-content figure { margin: 1.6em 0; }
.entry-content figcaption { font-family: var(--f-type); font-size: .85rem; color: var(--khaki); margin-top: .5em; }
.entry-content pre { overflow-x: auto; padding: 1rem 1.2rem; background: #E4D9C4; font-family: var(--f-type); font-size: .9rem; }
.entry-content code { font-family: var(--f-type); background: rgba(140, 123, 99, .15); padding: 0 .3em; }
.entry-content hr { border: 0; height: 2px; margin: 2em 0; background: repeating-linear-gradient(90deg, var(--bronze) 0 10px, transparent 10px 16px); }
.entry-content table { font-family: var(--f-type); font-size: .95rem; background: rgba(246, 239, 225, .6); }
.entry-content .alignleft { float: left; margin: .3em 1.4em 1em 0; }
.entry-content .alignright { float: right; margin: .3em 0 1em 1.4em; }
.entry-content .aligncenter { margin-left: auto; margin-right: auto; }
.entry-tags { margin: 2rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem; font-family: var(--f-type); font-size: .9rem; }
.entry-tags a { text-decoration: none; padding: .2em .7em; border: 1px solid var(--sage); color: var(--sage); }
.entry-tags a:hover { background: var(--sage); color: var(--sand); }
.page-links { margin-top: 1.5rem; font-family: var(--f-type); }

/* ---------- Sidebar & widgets ---------- */
.sidebar { padding: 1.6rem 1.5rem; background-color: var(--sand-deep); background-image: var(--grain), repeating-linear-gradient(to bottom, transparent 0 29px, rgba(140, 123, 99, 0.18) 29px 30px); border: 1px solid rgba(140, 123, 99, .45); box-shadow: 4px 4px 0 rgba(140, 123, 99, .25); color: var(--ink); }
.sidebar .ledger-widget + .ledger-widget { margin-top: 2rem; }
.sidebar .ledger-widget__title { position: relative; padding-inline-start: 1.3rem; font-size: 1.3rem; color: var(--ink); padding-bottom: .4rem; border-bottom: 1.5px solid var(--ink); }
.sidebar .ledger-widget__title::before { content: ""; position: absolute; inset-inline-start: 0; top: .38em; width: .55rem; height: .55rem; border-radius: 50%; background: var(--terra); }
.sidebar ul { list-style: none; margin: 0; padding: 0; }
.sidebar li { padding: .55rem 0; border-bottom: 1px dashed rgba(140, 123, 99, .6); font-family: var(--f-type); font-size: .95rem; line-height: 1.45; color: var(--ink); }
.sidebar a { color: var(--ink); text-decoration-color: var(--sage); }
.sidebar a:hover { color: var(--terra); }
.sidebar .post-date { display: block; color: var(--khaki); font-size: .82rem; }
.sidebar p, .sidebar .textwidget { font-family: var(--f-cond); color: var(--ink); }

/* ---------- Pagination ---------- */
.pager { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 3rem; font-family: var(--f-type); }
.pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 2.6rem; height: 2.6rem; padding: 0 .8rem; border: 1.5px solid var(--bronze); color: var(--ink); background: rgba(246, 239, 225, .7); text-decoration: none; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.pager a.page-numbers:hover { background: var(--olive); border-color: var(--sage); transform: translateY(-2px); }
.pager .page-numbers.current { background: var(--terra); border-color: var(--terra); color: var(--sand); transform: rotate(-2deg); }
.pager .page-numbers.dots { border-color: transparent; background: none; min-width: auto; }

/* ---------- Search form ---------- */
.lookup { display: flex; flex-wrap: wrap; gap: .7rem; margin: 1.4rem 0; }
.lookup__field { flex: 1 1 220px; min-width: 0; padding: .7rem .9rem; font-family: var(--f-type); font-size: 1rem; color: var(--ink); background: #F6EFE1; border: 1.5px solid var(--bronze); border-radius: 0; }
.lookup__field::placeholder { color: var(--khaki); }

/* ---------- Comments ---------- */
.notes { margin-top: 3.2rem; padding-top: 2rem; border-top: 2px solid var(--ink); }
.notes__title, .comment-reply-title { font-size: 1.6rem; }
.notes__list, .notes__list .children { list-style: none; margin: 0; padding: 0; }
.notes__list .children { padding-inline-start: 1.6rem; border-inline-start: 2px dashed var(--bronze); margin-top: 1rem; }
.note { margin-bottom: 1.2rem; }
.note__body { padding: 1rem 1.2rem; background: #F6EFE1; border: 1px solid rgba(140, 123, 99, .45); }
.note__head { display: flex; align-items: center; gap: .8rem; margin-bottom: .6rem; }
.note__avatar { border-radius: 50%; display: block; }
.note__author { display: block; font-family: var(--f-type); font-weight: 700; }
.note__date { font-family: var(--f-type); font-size: .82rem; color: var(--khaki); }
.note__text { font-family: var(--f-read); }
.note__pending { font-family: var(--f-type); color: var(--terra); font-size: .9rem; }
.note__reply a { font-family: var(--f-type); font-size: .9rem; }
.comment-respond { margin-top: 2rem; padding: 1.6rem 1.6rem 1.8rem; background: var(--olive); border: 1px solid rgba(78, 110, 90, .4); }
.comment-form p { margin-bottom: 1rem; }
.comment-form label { display: block; font-family: var(--f-type); font-size: .9rem; margin-bottom: .3rem; }
.comment-form-cookies-consent label { display: inline; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea { width: 100%; padding: .65rem .8rem; font-family: var(--f-type); font-size: 1rem; color: var(--ink); background: #F6EFE1; border: 1.5px solid var(--bronze); border-radius: 0; }
.comment-form textarea { resize: vertical; }
.comment-notes, .logged-in-as { font-family: var(--f-cond); color: #5E5446; }
.req { color: var(--terra); }

/* ---------- 404 ---------- */
.lost { text-align: center; padding: 1rem 0 2rem; }
.lost .page-head__title { background-position: 50% 100%; }
.lost__stamp { display: inline-block; font-family: var(--f-stamp); font-size: clamp(4.5rem, 3rem + 6vw, 8rem); line-height: 1; color: var(--terra); border: 4px solid var(--terra); padding: .1em .35em; transform: rotate(-6deg); margin-bottom: 1.4rem; opacity: .9; }
.lost__text { font-family: var(--f-read); font-size: 1.1rem; max-width: 52ch; margin-inline: auto; }
.lost .lookup { max-width: 520px; margin-inline: auto; }

/* ---------- Footer ---------- */
.colophon { position: relative; overflow: hidden; background-color: var(--clay); color: #EBDFCB; padding: 3.4rem 0 2rem; }
.colophon::before, .colophon::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; background: repeating-radial-gradient(circle, transparent 0 20px, rgba(237, 228, 211, 0.07) 20px 22px); }
.colophon::before { width: 460px; height: 460px; left: -170px; bottom: -200px; }
.colophon::after { width: 380px; height: 380px; right: -140px; bottom: -190px; }
.colophon__cols { position: relative; z-index: 1; width: 85%; margin-inline: auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 3rem; }
.colophon__col { min-width: 0; }
.colophon .ledger-widget + .ledger-widget { margin-top: 1.6rem; }
.colophon .ledger-widget__title { font-family: var(--f-stamp); font-size: 1.65rem; color: var(--mustard); margin-bottom: .7rem; }
.colophon .textwidget, .colophon .textwidget p, .colophon p { font-family: var(--f-type); font-size: 1.02rem; line-height: 1.55; color: #EBDFCB; }
.colophon a { color: #F2E7D4; text-decoration-color: rgba(217, 164, 65, .7); }
.colophon a:hover { color: var(--mustard); }
.colophon ul { list-style: none; margin: 0; padding: 0; }
.colophon li { margin-bottom: .35rem; font-family: var(--f-type); font-size: 1.05rem; color: #EBDFCB; }
.colophon__col--two { text-align: center; }
.colophon__col--two a { text-decoration: none; border-bottom: 1px solid transparent; }
.colophon__col--two a:hover { border-bottom-color: var(--mustard); }
.colophon .post-date { color: #BFB09A; }
.colophon__copy { position: relative; z-index: 1; width: 85%; margin: 2.8rem auto 0; padding-top: 1.2rem; text-align: center; font-family: var(--f-type); font-size: .92rem; color: var(--mustard); border-top: 1px solid rgba(235, 223, 203, .16); }

/* ---------- Cookie banner ---------- */
.cookie-banner[hidden] { display: none !important; }
.cookie-banner {
    position: fixed;
    left: 50%;
    bottom: 1rem;
    z-index: 90;
    width: min(92%, 720px);
    transform: translateX(-50%) rotate(-.4deg);
    display: flex;
    align-items: center;
    gap: 1rem 1.4rem;
    padding: 1.1rem 1.4rem;
    background: #F6EFE1;
    border: 1.5px solid var(--bronze);
    box-shadow: 0 14px 30px -10px rgba(58, 46, 38, .5);
}
.cookie-banner::before { content: ""; position: absolute; top: -10px; left: 50%; width: 80px; height: 22px; margin-left: -40px; background: var(--tape); transform: rotate(-3deg); }
.cookie-banner__text { margin: 0; flex: 1; min-width: 0; font-family: var(--f-type); font-size: .9rem; line-height: 1.45; color: var(--ink); }
.cookie-banner__btn { flex: 0 0 auto; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
    .masthead { padding: 1.6rem 5% 1.2rem; }
    .masthead__logo .seal, .brand-logo { width: 84px; height: 84px; }
    .nav-toggle { display: inline-flex; }
    .topnav { flex: 1 0 100%; display: none; }
    .topnav.is-open { display: block; }
    .topnav__list { flex-direction: column; align-items: stretch; border-top: 1.5px solid var(--ink); }
    .topnav__list li { border-bottom: 1px dashed var(--bronze); }
    .topnav__list li + li::before { display: none; }
    .topnav__list a { display: block; width: 100%; padding: .75rem .2rem; }

    .wheel-block { grid-template-columns: minmax(0, 1fr); }
    .wheel { width: min(100%, 460px); }
    .wheel-notes { width: min(100%, 560px); justify-self: center; }

    .rooms { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rooms__panel:nth-child(4) { border-inline-start: 0; }
    .rooms__panel:nth-child(n+4) { border-top: 1.5px solid rgba(78, 110, 90, 0.55); }

    .jr-grid--three, .layout-single .jr-grid--list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checklist-block { grid-template-columns: minmax(0, 1fr); }
    .big-five { display: flex; align-items: center; justify-content: center; gap: 1.2rem; text-align: start; flex-wrap: wrap; }
    .big-five__num { font-size: 7rem; }

    .settle { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 2.2rem; }
    .settle::before, .settle::after { display: none; }
    .settle__step::before { content: ""; position: absolute; top: 9px; left: 0; right: 0; height: 2px; background: var(--ink); }

    .layout-with-sidebar { flex-direction: column; }
    .layout-with-sidebar > .content-area, .layout-with-sidebar > .sidebar { flex: none; width: 100%; }
    .layout-with-sidebar > .sidebar { margin-top: 3rem; }
    .layout-single > .content-area { width: 100%; }

    .colophon__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .colophon__col--three { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
    body { font-size: .97rem; }
    .masthead__brand { flex-basis: 100%; gap: .8rem; }
    .masthead__logo .seal, .brand-logo { width: 68px; height: 68px; }
    .masthead__tagline { font-size: .88rem; }
    .leaf { padding: 2.6rem 0; }
    .leaf__inner, .inner-leaf, .colophon__cols, .colophon__copy { width: 90%; }
    .postmark { display: none; }

    .rooms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rooms__panel:nth-child(4) { border-inline-start: 1.5px solid rgba(78, 110, 90, 0.55); }
    .rooms__panel:nth-child(odd) { border-inline-start: 0; }
    .rooms__panel:nth-child(n+3) { border-top: 1.5px solid rgba(78, 110, 90, 0.55); }
    .rooms__panel:last-child { grid-column: 1 / -1; }
    .rooms__panel img { height: 78px; }

    .jr-grid--three, .jr-grid--list, .layout-single .jr-grid--list { grid-template-columns: minmax(0, 1fr); gap: 2.4rem; }
    .jr-grid > .jr-card:nth-child(n) { transform: rotate(0deg); }
    .jr-card::before { left: -10px; }
    .jr-card::after { right: -8px; }

    .ledger td { padding: .55em .6em; font-size: .92rem; }
    .ledger__tick { width: 3.2rem; }
    .ledger__blank { width: 1.6rem; }

    .settle { grid-template-columns: minmax(0, 1fr); row-gap: 0; padding-inline-start: .4rem; }
    .settle__step { display: grid; grid-template-columns: 34px minmax(0, 1fr); column-gap: .9rem; text-align: start; padding: 0 0 1.4rem; }
    .settle__step::before { top: 0; bottom: 0; left: 9px; right: auto; width: 2px; height: auto; }
    .settle__step:last-child::before { bottom: 50%; }
    .settle__dot { grid-row: 1 / span 2; margin: 0; }
    .settle__step strong, .settle__step > span:last-child { grid-column: 2; }

    .entry-content { font-size: 1.03rem; }
    .entry-content blockquote { padding: 1.1rem 1.2rem; }
    .comment-respond { padding: 1.2rem 1.1rem 1.4rem; }
    .sidebar { padding: 1.3rem 1.2rem; }

    .colophon__cols { grid-template-columns: minmax(0, 1fr); }
    .colophon__col--two { text-align: start; }
    .cookie-banner { flex-direction: column; align-items: flex-start; padding: 1rem 1.1rem; }
}
