@import url('https://fonts.googleapis.com/css2?family=Qwitcher+Grypen:wght@400;700&display=swap');
@font-face{font-family:Inter;src:url('./assets/fonts/Inter-VariableFont_opsz,wght.ttf')}@font-face{font-family:Mono;src:url('./assets/fonts/SpaceMono-Regular.ttf')}
:root{--ink:#11100e;--paper:#f3efe4;--cream:#fff9eb;--teal:#58b7aa;--teal-dark:#194f49;--rose:#b77d6b;--pink:#f0b7c1;--line:rgba(17,16,14,.25)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,Arial,sans-serif;overflow-x:hidden}a{color:inherit}.skip-link{position:fixed;left:1rem;top:-4rem;background:var(--ink);color:white;padding:.8rem 1rem;z-index:100}.skip-link:focus{top:1rem}.site-header{min-height:92px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid var(--ink);padding:0 clamp(1.2rem,4vw,4rem);position:relative;z-index:20;background:var(--paper)}.wordmark{text-decoration:none;display:flex;align-items:center;gap:.35rem;font-size:clamp(1.55rem,2.7vw,2.5rem);font-weight:850;letter-spacing:-.09em}.wordmark i{font:italic 1rem Georgia,serif;color:var(--rose);letter-spacing:0}.site-header nav{display:flex;align-items:center;gap:2rem;font-size:.78rem;font-weight:750;text-transform:uppercase;letter-spacing:.08em}.site-header nav a{text-decoration:none;border-bottom:1px solid transparent;padding:.4rem 0}.site-header nav a:hover,.site-header nav a:focus{border-color:var(--ink)}.issue-stamp{justify-self:end;border:1px solid var(--ink);display:grid;grid-template-columns:auto auto;align-items:center;transform:rotate(2deg);font:700 .62rem Mono,monospace;text-transform:uppercase}.issue-stamp span{padding:.45rem}.issue-stamp strong{font-size:1.1rem;background:var(--rose);padding:.35rem}.menu-toggle{display:none;border:0;background:none;padding:.4rem;color:inherit}.menu-toggle span{display:block;width:24px;height:2px;background:currentColor;margin:4px}.menu-toggle b{position:absolute;width:1px;height:1px;overflow:hidden}
.hero{min-height:calc(100vh - 92px);position:relative;padding:clamp(2rem,5vw,5rem) clamp(1.2rem,4vw,4rem);display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:auto 1fr auto;overflow:hidden}.hero:before{content:"";position:absolute;width:38vw;height:38vw;border-radius:50%;border:1px solid var(--ink);right:-18vw;top:-14vw}.hero-kicker{grid-column:1/-1;display:flex;justify-content:space-between;border-bottom:1px solid var(--ink);padding-bottom:.65rem;font:700 .66rem Mono,monospace;text-transform:uppercase;letter-spacing:.12em}.hero-title{grid-column:1/-1;display:flex;flex-direction:column;justify-content:center;font-weight:900;letter-spacing:-.09em;text-transform:uppercase;line-height:.74;z-index:1;padding:3vw 0}.hero-title span{display:block}.hero-title .real{font-size:clamp(4.6rem,13vw,13.5rem)}.hero-title .rewritten{font:italic clamp(4.4rem,12vw,12.5rem)/.75 Georgia,serif;text-transform:none;color:var(--teal-dark);padding-left:10vw;transform:rotate(-2deg);text-shadow:3px 3px 0 var(--rose)}.hero-title .in-time{font-size:clamp(3.3rem,9.4vw,9.8rem);text-align:right}.hero-story{align-self:end;max-width:38rem;z-index:2}.hero-story p{font-size:clamp(1.15rem,2vw,1.65rem);font-weight:650;line-height:1.25;max-width:32ch}.hero-story .scribble{font:italic 1.35rem Georgia,serif;color:var(--rose);transform:rotate(-2deg)}.arrow-link{display:inline-flex;align-items:center;gap:1.2rem;border:1px solid var(--ink);padding:.9rem 1rem;text-decoration:none;font:700 .72rem Mono,monospace;text-transform:uppercase;background:var(--rose);box-shadow:5px 5px 0 var(--ink);transition:transform .2s,box-shadow .2s}.arrow-link:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}.arrow-link span{font-size:1.3rem}.hero-portrait{position:absolute;width:clamp(170px,21vw,340px);right:10vw;top:31%;z-index:0;transform:rotate(4deg)}.photo-frame{border:10px solid var(--cream);border-bottom-width:38px;box-shadow:0 10px 30px rgba(0,0,0,.18)}.photo-frame img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(100%) contrast(1.07)}.photo-note{display:block;font:italic 1rem Georgia,serif;text-align:center;margin-top:-29px;position:relative}.live-note{justify-self:end;align-self:end;width:min(100%,270px);border-top:6px solid var(--rose);padding-top:.8rem}.live-note strong{font-size:1.4rem}.live-note p{margin:.45rem 0 0;line-height:1.45}.live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--rose);margin-right:.4rem;animation:pulse 1.5s infinite}@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(183,125,107,.12)}}
.manifesto{background:var(--ink);color:var(--cream);padding:clamp(3rem,8vw,8rem) clamp(1.2rem,6vw,6rem);overflow:hidden}.manifesto p{margin:0;font-size:clamp(2rem,6vw,6.5rem);line-height:.98;font-weight:760;letter-spacing:-.055em;max-width:18ch}.manifesto p:last-child{margin-left:auto;text-align:right;color:var(--rose);margin-top:2rem}.manifesto em{font-family:Georgia,serif;font-weight:400;color:var(--teal);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.12em}
.story-section{padding:clamp(4rem,8vw,8rem) clamp(1.2rem,4vw,4rem)}.section-heading{display:flex;justify-content:space-between;align-items:end;border-bottom:2px solid var(--ink);padding-bottom:1rem;margin-bottom:2rem}.section-heading div{display:flex;flex-direction:column}.section-heading span{font:700 .7rem Mono,monospace;text-transform:uppercase}.section-heading strong{font-size:clamp(3rem,8vw,8rem);line-height:.85;letter-spacing:-.08em}.section-heading p{max-width:28ch;margin:0;font:italic 1.1rem Georgia,serif;text-align:right}.story-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1.2rem}.story-card{min-height:470px;border:1px solid var(--ink);position:relative;overflow:hidden;transition:transform .25s}.story-card:hover{transform:translateY(-6px)}.story-card>a{min-height:100%;padding:clamp(1.3rem,3vw,3rem);display:flex;flex-direction:column;text-decoration:none}.story-card h2{font-size:clamp(2.6rem,6vw,6rem);line-height:.86;letter-spacing:-.065em;margin:auto 0 1.2rem}.story-card p{max-width:34ch;line-height:1.5}.category,.read{font:700 .68rem Mono,monospace;text-transform:uppercase;letter-spacing:.08em}.read{margin-top:auto;padding-top:2rem;text-decoration:underline;text-underline-offset:.3em}.story-card--lead{background:var(--teal);grid-row:span 2;min-height:800px}.story-card--lead:after{content:"MINE";position:absolute;font-size:19vw;font-weight:900;color:rgba(255,255,255,.17);transform:rotate(-90deg);right:-17vw;top:30%;pointer-events:none}.story-card--lead h2{font-size:clamp(4rem,9vw,10rem);position:relative;z-index:1}.story-card--lead h2 em{font-family:Georgia,serif;color:var(--cream);text-shadow:4px 4px 0 var(--ink)}.story-card--google{background:var(--cream)}.story-card--google s{text-decoration-color:var(--rose);text-decoration-thickness:.12em}.search-label{margin-top:4rem;background:white;border:1px solid #bbb;border-radius:30px;padding:.75rem 1.2rem;color:#777;font-size:.75rem}.story-card--quiet{background:white;min-height:600px}.story-card--quiet h2{margin-top:3rem}.quiet-space{flex:1;min-height:120px;border-left:1px solid var(--line);margin-left:1rem}.story-card--keys{background:var(--rose);min-height:600px}.key-mark{font-size:clamp(5rem,13vw,12rem);font-weight:900;letter-spacing:-.1em;color:transparent;-webkit-text-stroke:2px var(--ink);transform:rotate(-6deg);margin-top:2rem}.story-card--keys h2{margin-top:.5rem}
.dispatches{background:var(--pink);display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;padding:clamp(4rem,8vw,8rem) clamp(1.2rem,5vw,5rem);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}.eyebrow{font:700 .68rem Mono,monospace;text-transform:uppercase;letter-spacing:.1em}.dispatch-intro h2{font-size:clamp(4rem,9vw,9rem);line-height:.72;letter-spacing:-.08em;margin:2rem 0}.dispatch-intro p{max-width:36ch;line-height:1.55;font-size:1.08rem}.dispatch-stack{display:flex;flex-direction:column;justify-content:center}.dispatch{display:grid;grid-template-columns:110px 1fr auto;gap:1.2rem;align-items:center;padding:2rem 0;border-top:1px solid var(--ink);text-decoration:none;transition:padding .2s,background .2s}.dispatch:last-child{border-bottom:1px solid var(--ink)}.dispatch:hover{padding-left:1rem;background:rgba(255,255,255,.2)}.dispatch-date{font:700 .65rem Mono,monospace;text-transform:uppercase}.dispatch strong{font-size:clamp(1.2rem,2.5vw,2rem);line-height:1.1}.dispatch-arrow{font-size:1.5rem}
.archive-strip{background:var(--rose);border-bottom:1px solid var(--ink);overflow:hidden;padding:1rem 0}.ticker{display:flex;align-items:center;gap:1.5rem;width:max-content;animation:ticker 24s linear infinite;font-size:1.35rem;font-weight:800;text-transform:uppercase}.ticker i{font-style:normal;color:var(--rose)}@keyframes ticker{to{transform:translateX(-50%)}}
.about{background:var(--teal-dark);color:var(--cream);padding:clamp(4rem,8vw,8rem) clamp(1.2rem,7vw,7rem);display:grid;grid-template-columns:.7fr 1fr;gap:6vw;position:relative}.about-photo img{width:100%;display:block;border-radius:50% 50% 4px 4px;border:1px solid var(--cream)}.about-copy{align-self:center}.about-copy h2{font-size:clamp(3rem,6vw,6.5rem);line-height:.9;letter-spacing:-.06em;margin:1.5rem 0}.about-copy p{font-size:1.2rem;line-height:1.55;max-width:39ch}.arrow-link--light{border-color:var(--cream);box-shadow:5px 5px 0 var(--cream);color:var(--ink)}.about blockquote{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.4);margin:2rem 0 0;padding-top:2rem;font:italic clamp(2rem,5vw,5rem) Georgia,serif;text-align:center;color:var(--rose)}
footer{background:var(--ink);color:var(--cream);display:flex;justify-content:space-between;align-items:center;padding:2.2rem clamp(1.2rem,4vw,4rem)}.footer-mark{font-size:2rem;font-weight:900;letter-spacing:-.08em}.footer-mark i{font:italic .9rem Georgia,serif;color:var(--rose)}footer p{font:italic 1rem Georgia,serif}footer a{font:700 .7rem Mono,monospace;text-transform:uppercase}
.footer-logo{display:block;width:clamp(180px,23vw,320px);height:auto;padding:.75rem 1.4rem;object-fit:contain;background:radial-gradient(ellipse at center,rgba(255,249,235,.98) 0%,rgba(255,249,235,.9) 48%,rgba(255,249,235,.38) 72%,rgba(255,249,235,0) 100%)}
@media(max-width:900px){.site-header{grid-template-columns:1fr auto auto}.menu-toggle{display:block;grid-column:2}.issue-stamp{grid-column:3}.site-header nav{display:none;position:absolute;top:91px;left:0;right:0;background:var(--ink);color:var(--cream);padding:2rem;flex-direction:column;align-items:stretch}.site-header nav.open{display:flex}.hero{grid-template-columns:1fr;grid-template-rows:auto 1fr auto auto;min-height:auto}.hero-title{padding:5rem 0 14rem}.hero-title .rewritten{padding-left:2vw}.hero-portrait{width:180px;right:10vw;top:47%}.hero-story{margin-top:2rem}.live-note{justify-self:start;margin-top:3rem}.story-grid{grid-template-columns:1fr}.story-card--lead{grid-row:auto;min-height:650px}.story-card--lead:after{font-size:35vw;right:-29vw}.dispatches{grid-template-columns:1fr}.about{grid-template-columns:1fr}.about-photo{max-width:430px}.about blockquote{grid-column:auto}.section-heading{align-items:start;flex-direction:column;gap:1rem}.section-heading p{text-align:left}.dispatch{grid-template-columns:90px 1fr auto}}
@media(max-width:560px){.site-header{min-height:72px;padding:0 1rem}.site-header nav{top:71px}.issue-stamp span{display:none}.wordmark{font-size:1.45rem}.hero{padding:1.2rem 1rem 3rem}.hero-kicker span:last-child{display:none}.hero-title{padding:3.5rem 0 12rem}.hero-title .real{font-size:18vw}.hero-title .rewritten{font-size:17vw}.hero-title .in-time{font-size:14vw}.hero-portrait{top:36%;right:8vw;width:145px}.photo-frame{border-width:7px;border-bottom-width:30px}.photo-note{font-size:.8rem;margin-top:-24px}.manifesto{padding:4rem 1rem}.story-section{padding:4rem 1rem}.section-heading strong{font-size:18vw}.story-card{min-height:500px}.story-card--lead{min-height:600px}.dispatches{padding:4rem 1rem}.dispatch-intro h2{font-size:20vw}.dispatch{grid-template-columns:1fr auto}.dispatch-date{grid-column:1/-1}.about{padding:4rem 1rem}.about-copy h2{font-size:14vw}footer{flex-wrap:wrap;gap:1rem}footer p{order:3;width:100%;margin:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.live-dot,.ticker{animation:none}.story-card,.arrow-link{transition:none}}

.hero-title .rewritten{font-family:'Qwitcher Grypen',cursive;font-style:normal;font-weight:700;font-size:clamp(6.5rem,17vw,17rem);line-height:.55;color:var(--teal);text-shadow:none;writing-mode:horizontal-tb;text-orientation:mixed;align-self:auto;padding-left:10vw;margin-top:-.1em;margin-bottom:-.08em;transform:translateY(-25px) rotate(-3deg);position:relative;z-index:2}
.hero-title .time-word{display:inline;color:var(--ink)}
.hero-story .arrow-link{background:var(--teal)}
.hero-story .hero-after-button{margin:.9rem 0 0;font:italic 1.35rem Georgia,serif;line-height:1.35;color:var(--rose)}
.live-note{transform:translateY(-65px)}
.hero-title .in-time{padding-right:clamp(220px,25vw,380px);white-space:nowrap}
.hero-portrait{z-index:3;transform:translate(100px,-50px) rotate(15deg)}

/* Brand integration: rose-gold seal and publication signature. */
.brand-seal{width:52px;height:52px;object-fit:cover;border-radius:50%;border:1px solid var(--rose);flex:0 0 auto}
.horizontal-logo{display:block;width:auto;height:76px;object-fit:contain;object-position:left center}
.dispatches{background:var(--rose)}
.brand-signature{background:var(--cream);padding:clamp(3rem,7vw,6rem) clamp(1rem,8vw,8rem);display:grid;place-items:center;border-bottom:1px solid var(--ink)}
.brand-signature img{display:block;width:min(70%,546px);height:auto;mix-blend-mode:multiply}

@media (min-width: 1101px) {
  .site-header:not(.global-header) { min-height: 110px; padding-inline: clamp(1.44rem, 4.8vw, 4.8rem); }
  .site-header:not(.global-header) .horizontal-logo { height: 91px; }
  .site-header:not(.global-header) nav { gap: 2.4rem; font-size: .94rem; }
}

@media(max-width:560px){
  .brand-seal{width:40px;height:40px}
  .wordmark span,.wordmark i{display:none}
  .horizontal-logo{height:58px;max-width:175px}
  .brand-signature{padding:2.5rem 1rem}
  .hero-title .rewritten{font-size:23vw;padding-left:2vw;margin-top:-.06em;margin-bottom:-.04em}
  .hero-title .in-time{padding-right:0;text-align:left}
}

/* Shared editorial pages */
:root { --teal-deep: var(--teal-dark); --teal-pale: color-mix(in srgb, var(--teal) 24%, white); }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 4px; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 1000; padding: .75rem 1rem; background: var(--teal); color: #111; font-weight: 800; }
.skip-link:focus { top: 1rem; }
.global-header { min-height: 110px; grid-template-columns: minmax(216px, 324px) 1fr; align-items: center; gap: 2.4rem; }
.global-header .wordmark { width: min(100%, 324px); }
.global-header .horizontal-logo { display: block; width: 100%; height: auto; }
.global-header nav { justify-self: end; display: flex; align-items: center; flex-wrap: wrap; gap: .84rem 1.62rem; }
.global-header nav a { color: var(--ink); text-decoration: none; font-size: .94rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.global-header nav a:hover, .global-header nav a[aria-current="page"] { color: var(--teal-deep); }
.global-header nav a[aria-current="page"] { border-bottom: 2px solid var(--rose); }
.page-hero { min-height: 50vh; padding: clamp(6rem, 11vw, 10rem) clamp(1.25rem, 7vw, 7rem) clamp(4rem, 8vw, 7rem); background: var(--paper); border-bottom: 1px solid rgba(17,16,14,.16); position: relative; overflow: hidden; }
.page-hero::after { content: ""; position: absolute; width: 19rem; height: 19rem; border: 1px solid rgba(17,16,14,.22); border-radius: 50%; right: -7rem; top: -9rem; }
.page-hero h1 { margin: .25rem 0 1.5rem; max-width: 12ch; font-size: clamp(3.8rem, 10vw, 8.8rem); line-height: .82; letter-spacing: -.07em; text-transform: uppercase; }
.page-hero h1 em { color: var(--teal); font-family: "Qwitcher Grypen", cursive; font-size: 1.25em; font-weight: 700; text-transform: none; }
.page-hero > p:last-child { max-width: 47rem; font-family: Georgia, serif; font-size: clamp(1.15rem, 2vw, 1.55rem); line-height: 1.55; }
.page-hero--pals { background: var(--teal-deep); color: #fff; }
.page-hero--pals h1 em { color: var(--rose); }
.archive-section, .editorial-page, .story-page, .connection-page { width: min(100% - 2.5rem, 1180px); margin-inline: auto; }
.archive-section { padding: clamp(4rem, 8vw, 7rem) 0; }
.archive-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2.5rem; }
.archive-toolbar h2 { font-size: clamp(2.4rem, 5vw, 4.5rem); line-height: .95; margin: 0; }
.archive-mode-note { margin: .65rem 0 0; color: #68615a; font-size: .85rem; }
.filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; }
.filters button { border: 1px solid var(--ink); background: transparent; color: var(--ink); padding: .65rem .9rem; font: inherit; font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.filters button:hover, .filters button.is-active { color: #fff; background: var(--teal-deep); border-color: var(--teal-deep); }
.filters .reading-order-button { border-color: var(--rose); color: #70473b; }
.filters .reading-order-button:hover, .filters .reading-order-button.is-active { background: var(--rose); border-color: var(--rose); color: #11100e; }
.archive-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1.5rem; }
.archive-card { display: grid; grid-template-columns: minmax(150px, 42%) 1fr; background: #fff; border: 1px solid rgba(17,16,14,.15); min-height: 280px; }
.archive-card[hidden] { display: none; }
.archive-card > img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; filter: saturate(.88); }
.card-number { display: grid; place-items: center; min-height: 280px; background: var(--teal-pale); color: var(--teal-deep); font-family: Georgia, serif; font-size: 5rem; }
.archive-card-copy { padding: 1.35rem; display: flex; flex-direction: column; align-items: flex-start; }
.archive-card-copy h2 { margin: .5rem 0 .8rem; font-family: Georgia, serif; font-size: clamp(1.35rem, 2vw, 2rem); line-height: 1.05; }
.archive-card-copy h2 a { color: inherit; text-decoration: none; }
.archive-card-copy > p:not(.story-meta) { line-height: 1.55; color: #56514b; }
.archive-card-copy .text-link { margin-top: auto; }
.story-meta { display: flex; flex-wrap: wrap; gap: .45rem .85rem; margin: 0; font-size: .68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.story-meta a, .story-meta span { color: var(--teal-deep); }
.story-meta .written-timeline { color: var(--teal-deep); }
.story-timeline-intro { display: inline-block; margin: 0 0 1.75rem; padding: .55rem .75rem; border: 1px solid var(--teal-dark); color: var(--teal-dark); font-family: Arial, sans-serif; font-size: .78rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.text-link, .back-link { color: var(--ink); font-weight: 850; text-decoration-thickness: 2px; text-underline-offset: .25em; }
.button-link, button.button-link { display: inline-flex; align-items: center; justify-content: center; border: 0; padding: .95rem 1.25rem; background: var(--teal); color: #10201e; font: inherit; font-weight: 900; letter-spacing: .04em; text-decoration: none; text-transform: uppercase; cursor: pointer; }
.load-more { margin: 3rem auto 0; }
.editorial-page, .connection-page { padding: clamp(4rem, 8vw, 7rem) 0; }
.article-content { width: min(100%, 760px); margin-inline: auto; font-family: Georgia, serif; font-size: clamp(1.08rem, 1.6vw, 1.26rem); line-height: 1.78; }
.article-content h2, .article-content h3 { margin: 2.6em 0 .7em; font-family: Arial, sans-serif; line-height: 1.05; }
.article-content h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
.article-content h3 { font-size: clamp(1.35rem, 3vw, 2rem); }
.article-content img { display: block; max-width: 100%; height: auto; margin: 2.5rem auto; }
.article-content blockquote { margin: 2.5rem 0; padding: .5rem 0 .5rem 1.5rem; border-left: 5px solid var(--rose); font-size: 1.15em; font-style: italic; }
.article-content a { color: var(--teal-deep); text-decoration-thickness: 2px; }
.start-categories, .recommended-story, .support-note { width: min(100%, 900px); margin: 5rem auto 0; }
.start-categories { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.start-categories h2 { grid-column: 1 / -1; }
.start-categories a { display: flex; justify-content: space-between; gap: 1rem; padding: 1.25rem; border: 1px solid var(--ink); color: var(--ink); text-decoration: none; }
.recommended-story, .article-subscribe { padding: clamp(2rem, 5vw, 4rem); background: var(--teal-pale); }
.support-note { border-top: 1px solid var(--ink); padding-top: 2rem; }
.start-here-hero { min-height: 62vh; padding: clamp(5rem, 9vw, 8rem) max(1.25rem, calc((100vw - 1060px) / 2)); display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 285px); align-items: center; gap: clamp(3rem, 8vw, 7rem); background: var(--paper); border-bottom: 1px solid rgba(17,16,14,.16); overflow: hidden; }
.start-here-intro h1 { max-width: 9ch; margin: .25rem 0 1.5rem; font-size: clamp(3.8rem, 8vw, 7.4rem); line-height: .84; letter-spacing: -.065em; text-transform: uppercase; }
.start-here-intro h1 em { color: var(--teal); font-family: "Qwitcher Grypen", cursive; font-size: 1.2em; font-weight: 700; text-transform: none; }
.start-here-intro > p:not(.eyebrow) { margin: 0 0 1.6rem; font: clamp(1.2rem, 2vw, 1.55rem)/1.5 Georgia, serif; }
.start-here-polaroid { width: 100%; max-width: 270px; justify-self: center; padding: .5rem .5rem 2.5rem; transform: rotate(6deg); }
.start-here-polaroid img { width: 100%; height: 245px; object-fit: cover; object-position: 50% 28%; }
.start-here-page { background: var(--cream); }
.start-here-story, .start-here-categories, .start-here-close { padding: clamp(4rem, 8vw, 7rem) max(1.25rem, calc((100vw - 900px) / 2)); }
.start-here-story { font: clamp(1.12rem, 1.7vw, 1.32rem)/1.75 Georgia, serif; }
.start-here-story p { max-width: 62ch; margin: 0 auto 1.35em; }
.start-here-categories { background: var(--teal-dark); color: #fffaf1; }
.start-here-categories > p, .start-here-categories > h2 { width: min(100%, 900px); margin-inline: auto; }
.start-here-categories h2 { margin-top: .3rem; font-size: clamp(2.8rem, 6vw, 5.8rem); line-height: .9; letter-spacing: -.05em; text-transform: uppercase; }
.start-category-list { width: min(100%, 900px); margin: 2.8rem auto 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.start-category-list a { display: flex; flex-direction: column; gap: .65rem; padding: clamp(1.4rem, 3vw, 2.25rem); border: 1px solid rgba(255,255,255,.48); color: inherit; text-decoration: none; }
.start-category-list a:hover { background: rgba(255,255,255,.08); }
.start-category-list strong { color: var(--teal); font-size: clamp(1.35rem, 2vw, 1.75rem); text-transform: uppercase; }
.start-category-list em { font: italic 1.08rem/1.35 Georgia, serif; }
.start-category-list span { font: 1rem/1.6 Georgia, serif; }
.start-here-close { text-align: center; font: clamp(1.08rem, 1.6vw, 1.25rem)/1.7 Georgia, serif; }
.start-here-close > * { max-width: 680px; margin-inline: auto; }
.start-here-statement { margin-block: 2rem; padding-block: 1.5rem; border-block: 1px solid var(--ink); font-size: clamp(1.4rem, 2.5vw, 2rem); }
.start-here-close .button-link { margin-top: .75rem; }
.editorial-page--about { display: grid; grid-template-columns: minmax(260px, 390px) 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.editorial-page--about .article-content { width: 100%; }
.about-page-photo { width: 100%; height: auto; }
.story-page { padding: clamp(4rem, 8vw, 7rem) 0; }
.article-header { width: min(100%, 980px); margin: 0 auto 4rem; }
.article-header h1 { margin: 2rem 0; font-size: clamp(3.2rem, 8vw, 7.5rem); line-height: .88; letter-spacing: -.065em; text-wrap: balance; }
.article-featured { width: 100%; max-height: 690px; object-fit: cover; }
.story-pagination { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; width: min(100%, 900px); margin: 5rem auto; }
.story-pagination a { display: flex; flex-direction: column; gap: .4rem; border-top: 1px solid var(--ink); padding-top: 1rem; color: var(--ink); text-decoration: none; }
.story-pagination a:last-child { text-align: right; }
.story-pagination span { font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.article-subscribe { width: min(100%, 900px); margin-inline: auto; }
.connection-page { max-width: 760px; font-family: Georgia, serif; font-size: 1.2rem; line-height: 1.7; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, .8fr); gap: clamp(3rem, 8vw, 8rem); max-width: 1180px; }
.contact-layout h2 { font-size: clamp(2.6rem, 6vw, 5rem); line-height: .95; margin: .5rem 0 1.25rem; }
.contact-form { display: grid; gap: .55rem; margin-top: 2rem; }
.contact-form label { margin-top: .75rem; font-family: Arial, sans-serif; font-size: .8rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.contact-form label span { font-weight: 500; opacity: .7; }
.contact-form input:not([type="checkbox"]), .contact-form textarea { width: 100%; border: 1px solid var(--ink); border-radius: 0; padding: .9rem 1rem; background: #fffaf1; color: var(--ink); font: inherit; }
.contact-form textarea { resize: vertical; }
.contact-form input:focus-visible, .contact-form textarea:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
.checkbox-label { display: flex; gap: .75rem; align-items: flex-start; text-transform: none !important; letter-spacing: 0 !important; line-height: 1.45; }
.checkbox-label input { width: 1.15rem; height: 1.15rem; margin-top: .15rem; accent-color: var(--teal-dark); flex: 0 0 auto; }
.contact-form .button-link { justify-self: start; margin-top: 1rem; border: 0; cursor: pointer; }
.form-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.form-success { margin: 1.5rem 0; border-left: .35rem solid var(--teal); padding: 1rem 1.15rem; background: #fffaf1; font-weight: 700; }
.connection-options { border-top: 8px solid var(--teal); padding-top: 1.5rem; }
.connection-options h2 { font-size: clamp(2rem, 4vw, 3.4rem); }
.connection-options h3 { margin: 2.5rem 0 .4rem; font-family: Arial, sans-serif; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.social-link { display: flex; align-items: center; gap: .65rem; margin-bottom: .75rem; color: var(--teal-dark); font-family: Arial, sans-serif; font-weight: 800; text-decoration: none; }
.social-link:hover span { text-decoration: underline; }
.connection-options .text-link { display: inline-block; margin-top: 1.75rem; }
.site-footer { display: grid; grid-template-columns: 1.3fr .8fr 1fr; gap: 3rem; padding: clamp(3rem, 7vw, 6rem) clamp(1.25rem, 6vw, 6rem) 1.5rem; background: #0e0d0c; color: #f5efe5; }
.footer-logo { width: min(100%, 330px); height: auto; }
.site-footer p { max-width: 34rem; color: #cfc5ba; line-height: 1.6; }
.site-footer nav { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; }
.site-footer a { color: #fff; }
.footer-connect strong { color: var(--rose); text-transform: uppercase; letter-spacing: .08em; }
.footer-socials { display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; margin: 1rem 0 1.25rem; }
.footer-socials a { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; }
.footer-socials a:hover span { text-decoration: underline; }
.facebook-icon { width: 1.45rem; height: 1.45rem; color: var(--teal); flex: 0 0 auto; }
.footer-legal { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 1rem 2rem; padding-top: 1.5rem; border-top: 1px solid #48423c; font-size: .78rem; }

@media (max-width: 1100px) {
  .global-header { min-height: 92px; grid-template-columns: minmax(160px, 230px) auto; gap: 1.5rem; }
  .global-header .menu-toggle { display: flex; justify-self: end; }
  .global-header .menu-toggle { align-items: center; border: 1px solid var(--ink); padding: .65rem .85rem; font-family: Mono, monospace; font-size: .72rem; font-weight: 700; letter-spacing: .1em; line-height: 1; text-transform: uppercase; }
  .global-header .menu-toggle:hover, .global-header .menu-toggle:focus-visible, .global-header .menu-toggle[aria-expanded="true"] { background: var(--teal); }
  .global-header .menu-toggle span { display: none; }
  .global-header .menu-toggle b { position: static; display: inline; width: auto; height: auto; overflow: visible; }
  .global-header nav { display: none; position: absolute; inset: 100% 0 auto; z-index: 50; padding: 1.5rem; background: var(--paper); border-block: 1px solid var(--ink); box-shadow: 0 1rem 2rem rgba(0,0,0,.15); }
  .global-header nav.open { display: grid; gap: 0; }
  .global-header nav a { padding: .9rem 0; border-bottom: 1px solid rgba(17,16,14,.14); }
  .archive-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .site-header:not(.global-header) .menu-toggle { display: flex; align-items: center; justify-self: end; border: 1px solid var(--ink); padding: .65rem .85rem; font-family: Mono, monospace; font-size: .72rem; font-weight: 700; letter-spacing: .1em; line-height: 1; text-transform: uppercase; }
  .site-header:not(.global-header) .menu-toggle:hover, .site-header:not(.global-header) .menu-toggle:focus-visible, .site-header:not(.global-header) .menu-toggle[aria-expanded="true"] { background: var(--teal); }
  .site-header:not(.global-header) .menu-toggle span { display: none; }
  .site-header:not(.global-header) .menu-toggle b { position: static; display: inline; width: auto; height: auto; overflow: visible; }
}
@media (max-width: 760px) {
  .global-header { padding: .8rem 1rem; gap: 1rem; }
  .global-header .wordmark { max-width: 185px; }
  .page-hero { min-height: 0; padding-top: 5rem; }
  .page-hero h1 { font-size: clamp(3.2rem, 17vw, 5.8rem); letter-spacing: -.055em; }
  .archive-toolbar { align-items: flex-start; flex-direction: column; }
  .filters { justify-content: flex-start; }
  .archive-card { grid-template-columns: 1fr; }
  .archive-card > img, .card-number { height: 280px; min-height: 0; }
  .editorial-page--about { grid-template-columns: 1fr; }
  .contact-layout { grid-template-columns: 1fr; }
  .about-page-photo { width: min(100%, 420px); margin-inline: auto; }
  .start-categories { grid-template-columns: 1fr; }
  .start-here-hero { min-height: 0; grid-template-columns: 1fr; gap: 2.5rem; padding-top: 4.5rem; text-align: center; }
  .start-here-intro h1 { margin-inline: auto; font-size: clamp(3.4rem, 16vw, 5.8rem); }
  .start-here-polaroid { width: min(65vw, 250px); }
  .start-here-polaroid img { height: min(59vw, 225px); }
  .start-category-list { grid-template-columns: 1fr; }
  .story-pagination { grid-template-columns: 1fr; }
  .story-pagination a:last-child { text-align: left; }
  .site-footer { grid-template-columns: 1fr; }
  .footer-legal { grid-column: auto; }
  .site-footer p { order: initial; width: auto; }
  .hero-title .real { letter-spacing: -.035em; margin-right: .08em; }
}
@media (max-width: 420px) {
  .global-header .wordmark { max-width: 145px; }
  .global-header .menu-toggle b { display: inline; }
  .site-header:not(.global-header) .menu-toggle b { display: inline; }
  .article-header h1 { font-size: 3.2rem; }
  .archive-card > img, .card-number { height: 230px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* About Amy — an editorial scrapbook built from real-life snapshots. */
.about-hero { min-height: 0; padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 7vw, 7rem); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .7fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); background: var(--paper); border-bottom: 1px solid rgba(17,16,14,.16); overflow: hidden; }
.about-hero-copy h1 { max-width: 7ch; margin: .2rem 0 .7rem; font-size: clamp(4.6rem, 11vw, 10rem); line-height: .76; letter-spacing: -.075em; text-transform: uppercase; }
.about-hero-copy > p:last-child { margin: 0; color: var(--rose); font: 700 clamp(2.1rem, 4.5vw, 4.8rem)/.9 "Qwitcher Grypen", cursive; transform: rotate(-2deg); }
.printed-photo { position: relative; margin: 0; padding: clamp(.55rem, 1.2vw, .85rem) clamp(.55rem, 1.2vw, .85rem) clamp(2.4rem, 4vw, 3.5rem); background: #fffaf1; border: 1px solid rgba(17,16,14,.16); box-shadow: 12px 16px 0 rgba(17,16,14,.11); }
.printed-photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: saturate(.9) contrast(1.02); }
.printed-photo figcaption { position: absolute; inset: auto .8rem .75rem; color: var(--ink); font: italic clamp(.85rem, 1.5vw, 1.05rem) Georgia, serif; text-align: center; }
.about-collage { justify-self: center; width: min(100%, 430px); display: flex; align-items: center; justify-content: center; gap: 1.5rem; padding: 1rem 0; }
.about-collage-photo { position: relative; flex: 0 0 clamp(105px, 10vw, 145px); padding: .4rem .4rem 1.9rem; box-shadow: 6px 8px 0 rgba(17,16,14,.1); }
.about-collage-photo + .about-collage-photo { margin-left: 0; }
.about-collage-photo img { height: clamp(105px, 10vw, 145px); aspect-ratio: 1 / 1; object-fit: cover; }
.about-collage-photo--one { z-index: 1; transform: rotate(-7deg) scale(1.2); }
.about-collage-photo--one img { object-position: 50% 30%; }
.about-collage-photo--two { z-index: 3; transform: translateY(-8px) rotate(2deg) scale(1.2); }
.about-collage-photo--two img { object-position: 50% 27%; }
.about-collage-photo--three { z-index: 2; transform: rotate(7deg) scale(1.2); }
.about-collage-photo--three img { object-position: 50% 31%; }
.about-collage-photo figcaption { bottom: .48rem; font-size: .72rem; }
.about-chapters { position: sticky; top: 0; z-index: 20; display: flex; justify-content: center; flex-wrap: wrap; gap: .2rem 1.6rem; padding: .9rem 1.25rem; background: rgba(17,16,14,.96); }
.about-chapters a { color: var(--cream); font-size: .84rem; font-weight: 850; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
.about-chapters a:hover { color: var(--teal); }
.about-story { background: var(--cream); }
.about-section { padding: clamp(4rem, 9vw, 8rem) max(1.25rem, calc((100vw - 1180px) / 2)); display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.25fr); align-items: center; gap: clamp(3rem, 8vw, 8rem); scroll-margin-top: 4rem; }
.about-section--opening { grid-template-columns: minmax(0, 1.25fr) minmax(260px, .72fr); }
.about-section--text-only { grid-template-columns: minmax(0, 1fr) minmax(220px, 265px); align-items: start; gap: clamp(2rem, 5vw, 5rem); }
.about-section--opening-photo { grid-template-columns: minmax(0, 1fr) minmax(220px, 265px); }
.about-section--text-only .about-section-copy { margin-inline: auto; }
.about-section-copy { width: min(100%, 730px); font-family: Georgia, serif; font-size: clamp(1.08rem, 1.5vw, 1.25rem); line-height: 1.75; }
.about-section-copy h2, .about-start h2 { margin: .35rem 0 .8em; font-family: Arial, sans-serif; font-size: clamp(2.8rem, 6vw, 6rem); line-height: .88; letter-spacing: -.055em; text-transform: uppercase; text-wrap: balance; }
.about-section-copy p { max-width: 57ch; }
.about-pullquote { margin: 1.7em 0; padding: .4em 0 .4em 1em; border-left: 6px solid var(--rose); font-size: clamp(1.45rem, 2.5vw, 2.25rem); line-height: 1.25; }
.printed-photo--writing { transform: rotate(-3deg); }
.printed-photo--work { transform: rotate(-2.5deg); }
.printed-photo--dog, .printed-photo--playful { transform: rotate(2.5deg); }
.about-section > .printed-photo:not(.printed-photo--playful) { width: min(100%, 240px); justify-self: center; }
.printed-photo--playful { width: min(100%, 210px); justify-self: center; }
.printed-photo--writing img { object-position: 52% 50%; }
.printed-photo--work img { object-position: 51% 50%; }
.about-section--teal { background: var(--teal-dark); color: #fffaf1; }
.about-section--teal .eyebrow { color: var(--teal); }
.about-section--teal .about-pullquote { border-left-color: var(--rose); }
.about-section--rose { background: color-mix(in srgb, var(--rose) 72%, var(--cream)); }
.about-section--rose { grid-template-columns: minmax(0, 1fr) minmax(220px, 265px); gap: clamp(2rem, 5vw, 5rem); }
.about-section--rose .eyebrow { color: #56372f; }
.section-polaroid { width: 100%; max-width: 262px; justify-self: center; align-self: start; margin-top: 2.4rem; padding: .38rem .38rem 2rem; box-shadow: 6px 8px 0 rgba(17,16,14,.12); }
.section-polaroid img { width: 100%; height: 232px; aspect-ratio: 1 / 1; object-fit: cover; }
.section-polaroid figcaption { inset: auto .45rem .5rem; font-size: .72rem; line-height: 1.1; }
.section-polaroid--writing { transform: rotate(-15deg); }
.section-polaroid--writing img { object-position: 52% 29%; }
.section-polaroid--dog { transform: rotate(15deg); }
.section-polaroid--dog img { object-position: 55% 26%; }
.section-polaroid--work { transform: rotate(-15deg); }
.section-polaroid--work img { object-position: 50% 23%; }
.section-polaroid--start { width: 150px; margin: 0; transform: rotate(6deg); }
.section-polaroid--start img { height: 132px; object-position: 50% 30%; }
.about-section .printed-photo--playful.section-polaroid { width: 100%; max-width: 262px; transform: rotate(15deg); }
.about-section--teal .section-polaroid { box-shadow: 6px 8px 0 rgba(0,0,0,.24); }
.about-start { padding: clamp(5rem, 10vw, 9rem) max(1.25rem, calc((100vw - 900px) / 2)); background: var(--paper); text-align: center; scroll-margin-top: 4rem; }
.about-start > p { width: min(100%, 680px); margin: 1em auto; font: clamp(1.08rem, 1.6vw, 1.25rem)/1.7 Georgia, serif; }
.about-start-heading { width: min(100%, 680px); margin: 0 auto 2rem; display: flex; align-items: center; justify-content: center; gap: clamp(1.5rem, 5vw, 4rem); }
.about-start-heading h2 { margin-bottom: 0; }
.about-start .button-link { margin: 1.4rem 0; }
.about-signoff { margin-top: 3rem !important; color: var(--teal-dark); font-size: clamp(1.4rem, 3vw, 2rem) !important; }

@media (max-width: 900px) {
  .about-hero { min-height: 0; grid-template-columns: 1fr; padding-block: 3rem 4.5rem; }
  .about-hero-copy h1 { font-size: clamp(4.1rem, 21vw, 7rem); }
  .about-hero-copy > p:last-child { font-size: clamp(2.3rem, 12vw, 3.6rem); }
  .about-collage { width: min(96vw, 430px); gap: 1rem; margin-top: .5rem; }
  .about-collage-photo { flex-basis: min(31vw, 125px); }
  .about-collage-photo img { height: min(31vw, 125px); }
  .about-chapters { position: static; justify-content: center; padding-block: 1rem; overflow: visible; flex-wrap: wrap; gap: .7rem 1.15rem; }
  .about-chapters a { white-space: normal; text-align: center; }
  .about-section, .about-section--opening { grid-template-columns: 1fr; gap: 3rem; }
  .about-section--text-only, .about-section--rose { grid-template-columns: 1fr; }
  .about-section .printed-photo { width: min(65vw, 250px); justify-self: center; }
  .about-section .printed-photo--playful { width: min(62vw, 245px); }
  .about-section .section-polaroid { width: min(62vw, 245px); max-width: 245px; margin-top: 0; }
  .about-section .section-polaroid img { height: min(55vw, 215px); }
  .about-start-heading { align-items: center; }
  .about-section--opening .about-section-copy, .about-section--teal .about-section-copy, .about-section--rose .about-section-copy { order: 1; }
  .about-section--opening .printed-photo, .about-section--teal .printed-photo, .about-section--rose .printed-photo { order: 2; }
}

@media (max-width: 420px) {
  .about-hero { padding-inline: 1rem; }
  .about-section { padding-inline: 1rem; }
  .about-section-copy { font-size: 1.04rem; line-height: 1.68; }
  .about-section-copy h2, .about-start h2 { font-size: 2.65rem; }
  .about-pullquote { font-size: 1.35rem; }
  .about-collage { width: 100%; gap: .75rem; }
  .about-collage-photo { flex-basis: min(31vw, 112px); padding: .32rem .32rem 1.7rem; }
  .about-collage-photo img { height: min(31vw, 112px); }
  .about-collage-photo figcaption { bottom: .55rem; font-size: .74rem; }
  .about-start-heading { gap: 1rem; }
  .about-start-heading .section-polaroid--start { width: 105px; flex: 0 0 105px; }
  .about-start-heading .section-polaroid--start img { height: 90px; }
}

@media(max-width:900px){
  .hero-portrait{transform:translateY(-50px) rotate(15deg)}
}

/* Keep the opening composition readable across browsers, zoom levels, and devices. */
@media(min-width:901px){
  .hero-portrait{transform:translate(clamp(30px,6vw,100px),-50px) rotate(15deg)}
  .hero-title .in-time{padding-right:clamp(200px,24vw,360px)}
}

@media(max-width:900px){
  .hero{
    grid-template-columns:1fr;
    grid-template-rows:auto auto auto auto auto;
    min-height:auto;
    row-gap:0;
  }
  .hero-kicker{grid-row:1}
  .hero-title{grid-row:2;padding:clamp(2.75rem,7vw,4rem) 0 1rem}
  .hero-title .rewritten{padding-left:3vw}
  .hero-title .in-time{padding-right:0;text-align:right;white-space:nowrap}
  .hero-portrait{
    position:relative;
    grid-row:3;
    top:auto;
    right:auto;
    width:clamp(170px,28vw,230px);
    justify-self:end;
    margin:1.25rem clamp(1rem,7vw,4rem) 2.5rem 0;
    transform:rotate(15deg);
  }
  .hero-story{grid-row:4;margin-top:0}
  .live-note{
    grid-row:5;
    justify-self:end;
    margin-top:2.5rem;
    transform:none;
  }
}

@media(max-width:560px){
  .hero-title{padding:2.75rem 0 .5rem}
  .hero-title .rewritten{
    font-size:23vw;
    padding-left:2vw;
    transform:translateY(-10px) rotate(-3deg);
  }
  .hero-title .in-time{font-size:13.5vw;text-align:right}
  .hero-portrait{
    width:min(42vw,165px);
    margin:1rem .75rem 2rem 0;
  }
  .hero-story p{font-size:1.05rem}
  .hero-story .scribble,.hero-story .hero-after-button{font-size:1.2rem}
  .live-note{justify-self:start;width:min(100%,270px);margin-top:2.5rem}
}

/* Narrow desktop / split-pane view: protect TIME from the portrait without
   changing the full-width laptop composition. */
@media(min-width:901px) and (max-width:1180px){
  .hero-title .in-time{padding-right:clamp(260px,28vw,330px)}
  .hero-portrait{
    width:clamp(165px,18vw,215px);
    right:1.5vw;
    transform:translate(0,-35px) rotate(15deg);
  }
}