/* Mobile-first compositions; palette, Newsreader and components inherited from styles.css. */
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.wa-icon { width: 1.3rem; height: 1.3rem; fill: currentColor; flex: 0 0 auto; }
.button, .tf-sticky .sticky-buy__button { gap: .65rem; }
.photo-frame { display: block; width: 100%; aspect-ratio: var(--photo-ratio); }
.photo-frame > img { display: block; width: 100%; height: auto; }
.tf-hero::before { background-image: url("assets/tf-editorial-hero.webp"); background-position: 62% 25%; }
.tf-hero::after { background: linear-gradient(180deg,rgba(36,27,33,.48),rgba(36,27,33,.84) 52%,rgba(36,27,33,.97)); }
.tf-hero .hero__header { justify-content: space-between; gap: .75rem; }
.tf-hero .brand-link img { width: min(54vw,14rem); }
.tf-nav { display: flex; gap: 1.5rem; font-size: .92rem; }
.tf-nav a { text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.tf-nav a:first-child { display: none; }
.tf-hero .hero__layout { display: block; padding-top: 2.5rem; padding-bottom: 3rem; }
.tf-hero h1 { font-size: clamp(3rem,14vw,6.5rem); line-height: .94; }
.tf-hero .hero__subhead { font-size: 1.14rem; margin-block: 1.6rem; }
.tf-hero__cta { max-width: 35rem; margin-top: 1.75rem; }
.tf-lead { font-size: 1.14rem; line-height: 1.65; margin-bottom: 0; }
.tf-section-intro { max-width: 64rem; }
.tf-section-intro .tf-lead { max-width: 54rem; }
.section-kicker { margin: 0 0 1rem; color: var(--wine-dark); font: 700 .82rem/1.5 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.section--ink .section-kicker, .section--wine .section-kicker { color: var(--gold-light); }
.membership { position: relative; isolation: isolate; overflow: hidden; background: #eee4d4; text-align: center; }
.membership h2 em { color: var(--wine-dark); }
.membership .membership-intro { position: relative; z-index: 1; max-width: 66rem; margin-inline: auto; }
.membership-intro .tf-lead { max-width: 51rem; margin-inline: auto; }
/* The central row reserves the model's entire silhouette. One photographic
   background continues into the quiet wall above and pale floor below. */
.membership-scene { position: relative; height: max(25rem, 56vw); margin-top: 2.5rem; pointer-events: none; }
.membership-background { position: absolute; z-index: -1; top: -50%; left: 50%; width: 100vw; height: 192.3%; transform: translateX(-50%); -webkit-mask-image: linear-gradient(transparent, #000 12%, #000 86%, transparent); mask-image: linear-gradient(transparent, #000 12%, #000 86%, transparent); }
.membership-background > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.membership-pillars { position: relative; z-index: 1; display: grid; gap: 2.75rem; max-width: 69rem; margin: 3rem auto 0; }
.membership-card { width: 100%; min-width: 0; max-width: 24rem; margin-inline: auto; }
.membership-icon { width: 2.75rem; height: 2.75rem; margin: 0 auto 1.25rem; color: var(--wine-dark); }
.membership h3 { font: 700 1.2rem/1.25 var(--sans); letter-spacing: normal; margin-bottom: .85rem; }
.membership .prose p { font-size: 1.05rem; line-height: 1.65; margin-bottom: 0; }
.andrea-intro { display: grid; gap: 1.75rem; margin-bottom: 2.5rem; }
.andrea-intro h2 { margin-bottom: 0; }
.andrea-intro h2 em { color: var(--wine); }
.andrea-avatar { border-radius: 50%; width: 100px; height: 100px; object-fit: cover; }
.andrea-story { display: grid; gap: 3rem; }
.andrea-story .prose p { font-size: 1.08rem; }
.andrea-quote { position: relative; margin: 0; padding-top: 3.5rem; border-top: 1px solid var(--line); }
.andrea-quote::before { content: "“"; position: absolute; top: -.1rem; color: var(--wine); font-family: var(--serif); font-size: 7rem; line-height: 1; }
.andrea-quote blockquote { margin: 0; }
.andrea-quote p { font-family: var(--serif); color: var(--wine-dark); font-size: 2rem; letter-spacing: -.025em; line-height: 1.18; margin-bottom: 1.5rem; }
.andrea-quote figcaption { font-weight: 700; font-size: 1rem; }
.pathways h2 em { color: var(--wine-dark); }
.pathways-gallery { display: grid; grid-template-columns: minmax(0,1fr); gap: 1.5rem; align-items: start; margin-top: 3.5rem; }
.pathways-gallery img { display: block; width: 100%; height: auto; }
.pathways-gallery__column { display: contents; }
.pathways-photo--1 { order: 1; }
.pathways-photo--2 { order: 2; }
.pathways-photo--3 { order: 3; }
.pathways-photo--4 { order: 4; }
.platform-placeholder { min-height: 12rem; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .6rem; padding: 1.5rem; border: 1px dashed rgba(36,27,33,.3); background: rgba(255,253,248,.5); text-align: center; }
.platform-placeholder span { text-transform: uppercase; letter-spacing: .1em; font-size: .82rem; color: var(--wine-dark); }
.platform-placeholder strong { font-size: 1.12rem; line-height: 1.4; }
.platform-placeholder small { font-size: .9rem; }
.platform-placeholder--dark, .platform-placeholder--wine { color: var(--paper-bright); border-color: rgba(255,253,248,.35); background: rgba(255,253,248,.05); }
.platform-placeholder--dark span, .platform-placeholder--wine span { color: var(--gold-light); }
.course-layout { display: grid; gap: 3rem; }
.course-copy .course-interface { margin-top: 2.5rem; }
.tf-editorial { margin: 0; min-width: 0; }
.tf-editorial img { width: 100%; height: auto; display: block; }
.tf-editorial figcaption { font-size: .9rem; margin-top: .65rem; opacity: .8; }
.calls-intro { display: grid; gap: .5rem; }
.calls-intro h2 em { color: var(--gold-light); }
.calls-highlight { font: 400 2rem/1.17 var(--serif); letter-spacing: -.025em; padding-block: 2rem; margin-block: 2.5rem; border-block: 1px solid rgba(255,253,248,.3); color: var(--gold-light); }
.calls-media { display: block; }
.calls-screenshot { display: block; width: 100%; height: auto; }
.calls-schedule { font-size: 1rem; line-height: 1.6; margin: 1.25rem 0 0; }
.project-interface { margin-top: 3.5rem; }
.project-gallery { display: grid; gap: 1.5rem; margin-top: 3.5rem; }
.monthly-projects h2 em { color: var(--wine); }
.editorial-note { font-size: .95rem; max-width: 47rem; margin: 1.5rem 0 0; color: var(--ink-soft); }
.tf-faq { padding-top: 0; }
.tf-faq .faq summary { font-size: 1.08rem; }
.subscription-layout { display: grid; gap: 3rem; }
.subscription h2 em { color: var(--wine-dark); }
.subscription-label { font-size: 1.2rem; margin-block: 2rem 1rem; }
.subscription-benefits { list-style: none; padding: 0; margin: 0; }
.subscription-benefits li { padding-block: 1.15rem; border-top: 1px solid var(--line); font-size: 1.05rem; line-height: 1.65; }
.subscription-benefits li:last-child { border-bottom: 1px solid var(--line); }
.subscription-purchase { padding-block: 2rem; border-top: 1px solid var(--line); }
.subscription-price { margin-bottom: .65rem; font: 400 clamp(2.25rem,4vw,3rem)/1 var(--serif); letter-spacing: -.045em; color: var(--wine-dark); }
.subscription-price span { font: 400 1.05rem/1.5 var(--sans); letter-spacing: 0; display: block; margin-top: .7rem; }
.subscription-prices { display: grid; gap: 1.75rem; margin-bottom: 1.5rem; }
.subscription-region { margin-bottom: .65rem; font-size: 1.05rem; font-weight: 600; }
.subscription-purchase .button { margin-block: 1rem; }
.subscription-help, .subscription-terms { font-size: 1rem; line-height: 1.6; }
.subscription-terms { margin: 1.5rem 0 0; }
.tf-sticky .sticky-buy__button { font-size: .9rem; padding-inline: .9rem; }
.tf-sticky .sticky-buy__details strong { font-size: .8rem; }
.tf-sticky .sticky-buy__details span { font-size: .8rem; }
.tf-sticky .wa-icon { width: 1.1rem; height: 1.1rem; }
@media(min-width:44rem) {
 .membership-pillars { grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(1.5rem,4vw,4rem); }
 .membership-scene { margin-top: 3.5rem; }
 .tf-nav a:first-child { display: inline-flex; }
 .tf-hero h1 { font-size: clamp(4.8rem,8.5vw,7.6rem); }
 .tf-hero .hero__subhead { font-size: 1.3rem; }
 .tf-lead { font-size: 1.25rem; }
 .andrea-intro { grid-template-columns: 100px minmax(0,1fr); align-items: center; gap: 2.5rem; }
 /* Independent stacks keep the editorial rhythm without a fixed square canvas. */
 .pathways-gallery { grid-template-columns: minmax(0,52fr) minmax(0,46fr); gap: 1.25rem; align-items: end; padding-bottom: 125px; }
 .pathways-gallery__column { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
 .pathways-gallery__column:nth-child(1) { padding-top: clamp(3rem,8vw,7rem); }
 .pathways-gallery__column:nth-child(2) { position: relative; top: 125px; }
 .pathways-gallery .pathways-photo--3 { width: 94%; align-self: flex-end; }
 .project-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; align-items: start; }
 .project-gallery figure:nth-child(2) { margin-top: 5rem; }
 .project-gallery figure:nth-child(3) { grid-column: span 2; width: 65%; }
 .calls-highlight { font-size: 2.75rem; }
 .tf-sticky .sticky-buy__button { font-size: 1rem; padding-inline: 1.9rem; }
 .tf-sticky .sticky-buy__details strong { font-size: 1rem; }
 .tf-sticky .sticky-buy__details span { font-size: .9rem; }
}
@media(min-width:56rem) {
 .tf-hero::before { background-position: right 22%; }
 .tf-hero::after { background: linear-gradient(90deg,rgba(36,27,33,.98),rgba(36,27,33,.90) 43%,rgba(36,27,33,.10)); }
 .tf-hero .hero__layout { padding-top: clamp(3rem,7vw,6.5rem); padding-bottom: 5rem; }
 .tf-hero .hero__content { max-width: 60%; }
 .tf-hero h1 { max-width: 55rem; }
 .andrea-story { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 4.5rem; }
 .andrea-quote { border-top: 0; padding-top: 3.25rem; }
 .andrea-quote p { font-size: 2.75rem; }
 .course-layout { grid-template-columns: minmax(0,1.1fr) minmax(0,.8fr); align-items: start; gap: 4rem; }
 .course-photo { margin-top: 5rem; }
 .calls-intro { grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); align-items: end; gap: 4rem; }
 .calls-intro h2 { margin-bottom: 0; }
 .subscription-layout { grid-template-columns: minmax(0,1.4fr) minmax(0,.75fr); gap: 5rem; }
 .subscription-purchase { align-self: start; position: sticky; top: 2rem; border-top: 0; padding-top: 1rem; }
 .subscription-purchase .button { min-width: 0; width: 100%; }
}
@media(min-width:68rem) {
 .project-gallery { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .project-gallery figure:nth-child(3) { grid-column: auto; width: 100%; margin-top: 2rem; }
}
@media(max-width:22rem) {
 .tf-sticky .sticky-buy__details strong { font-size: .75rem; }
 .tf-sticky .sticky-buy__button { font-size: .8rem; padding-inline: .75rem; gap: .4rem; }
 .tf-sticky .wa-icon { width: 1rem; height: 1rem; }
}


/* Mobile background requests match the responsive preload. */
@media(max-width:43.999rem) {
 .tf-hero::before { background-image: url("assets/tf-editorial-hero-960.webp"); }
}