/* Hallmark · shape: Manifesto (/) and Portfolio (/products/rafit/) · genre: editorial · theme: brand · redesign: full
 * paper: existing ivory · accent: existing lime · display: Manrope · body: DM Sans · hero: Poster (/) and Stage (/products/rafit/) · nav: edge-aligned · footer: mast · signature: an open typographic horizon and the first real product
 * axes: light/grotesk-sans/cool · posture: ink used as surface · job: explore products · contrast: browser-verified · fold: browser-verified · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S3 R4 V4 · weakest: S, replaced abstract product card with the actual RaFit Today screen */
/* Hallmark · hero-review: ship · fresh-context reviewer · 0 findings */
/* Hallmark · finish-review: subagent · ship · 0 findings · gap: none */
/* Hallmark · reworded "RaFit" to "RaFit." · 63 removes the old heading arrow while retaining the product name */
/* Hallmark · reworded "Our first wave. Meet RaFit." to "RaFit." · 19 removes the stock Meet opener; first-wave fact stays in the following sentence */
/* Hallmark · reworded "A routine that fits. A coach in your corner." from h2 into the hero lede · 58 reduces the hero to one headline and one sentence */
/* Hallmark · dismissed 58 · the eight-word Sporade headline is the existing sea-of-ideas brand line; this redesign preserves its wording */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600&display=swap');
@import url('./tokens.css');
@import url('./base.css');
html { scroll-behavior: smooth; }
a,button { -webkit-tap-highlight-color: var(--color-transparent); }
a { text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: .25em; }
a:active,button:active { opacity: .72; }
button:disabled,[aria-disabled="true"] { opacity: .5; cursor: not-allowed; text-decoration: line-through; }
.site-header { height: 104px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; gap: var(--space-xs); align-items: center; font-family: var(--font-display); font-size: 32px; font-weight: 600; letter-spacing: -.06em; }
.brand svg { width: 36px; height: 36px; }
.site-header nav { display: flex; align-items: center; gap: var(--space-row); font-size: var(--text-sm); }
.site-header nav a { display: inline-flex; align-items: center; min-height: 44px; white-space: nowrap; }
.hero { min-height: calc(100svh - 104px); max-height: 900px; display: flex; flex-direction: column; justify-content: center; padding-block: var(--space-2xl) var(--space-xl); }
.hero h1 { font-size: var(--text-hero); max-width: 18ch; letter-spacing: -.06em; line-height: 1.02; font-weight: 500; }
.hero-floor { display: flex; align-items: end; justify-content: space-between; gap: var(--space-row); margin-top: var(--space-2xl); }
.hero-floor p { max-width: 34ch; }
.hero-end { margin-top: var(--space-hero); display: flex; align-items: center; justify-content: space-between; font-size: var(--text-sm); color: var(--color-muted); }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: var(--space-sm) var(--space-lg); background: var(--color-ink); color: var(--color-paper); font-size: var(--text-sm); white-space: nowrap; border: 1px solid var(--color-ink); }
.button:hover { background: var(--color-ink-2); text-decoration: none; }
.link { display: inline-flex; align-items: center; min-height: 48px; width: fit-content; border-bottom: 1px solid currentColor; white-space: nowrap; font-size: var(--text-sm); }
.link:hover { text-decoration: none; border-bottom-width: 2px; }
@media(max-width:60rem){.site-header{height:88px}.hero{min-height:calc(90svh - 88px);max-height:none}.hero h1{font-size:clamp(3.25rem,8.5vw,6rem)}.hero-floor{gap:var(--space-xl);margin-top:var(--space-xl)}.hero-end{margin-top:var(--space-2xl)}}
@media(max-width:40rem){.brand{font-size:26px}.brand svg{width:28px;height:28px}.site-header nav{gap:var(--space-md)}.site-header nav a{font-size:var(--text-xs)}.hero{min-height:calc(100svh - 88px);padding-block:var(--space-xl)}.hero h1{font-size:clamp(3rem,10.4vw,4rem);max-width:15ch;letter-spacing:-.055em}.hero-floor{align-items:start;flex-direction:column;gap:var(--space-lg)}.hero-floor p{font-size:var(--text-md)}.hero-end{margin-top:var(--space-2xl);gap:var(--space-lg);font-size:var(--text-xs)}.hero-end span:last-child{max-width:12ch;text-align:right}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.project { background: var(--color-ink); color: var(--color-on-ink); padding-block: var(--space-3xl); --color-focus: var(--color-on-ink); }
.project-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); align-items: center; }
.project h2 { font-size: clamp(4rem,8vw,7.5rem); }
.project .lead { margin-block: var(--space-lg) var(--space-xl); color: var(--color-on-ink); }
.project-copy>p:not(.lead) { max-width: 45ch; color: var(--color-on-ink-muted); }
.product-facts { display: flex; gap: var(--space-row); margin-block: var(--space-xl); font-size: var(--text-sm); }
.product-facts div { padding-right: var(--space-xl); }
.product-facts dt { color: var(--color-on-ink-muted); margin-bottom: var(--space-xs); }
.product-facts dd { margin: 0; }
figure { margin: 0; }
.product-picture { display: flex; flex-direction: column; align-items: center; gap: var(--space-lg); padding-block: var(--space-lg); }
.product-picture img { max-width: 270px; width: 62%; height: auto; }
figcaption { color: var(--color-muted); font-size: var(--text-sm); margin-top: var(--space-lg); }
.project figcaption { color: var(--color-on-ink-muted); }
.approach { padding-block: var(--section-gap) var(--section-gap-s); }
.approach-opening { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); align-items: end; }
.approach-opening .lead { max-width: 36ch; }
.approach-note { margin-top: var(--space-2xl); margin-left: auto; width: calc(50% - 16px); color: var(--color-muted); }
.journey { list-style-position: inside; margin: var(--space-3xl) 0 0; padding: 0; }
.journey li { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); padding-block: var(--space-xl); border-top: 1px solid var(--color-rule); align-items: baseline; }
.journey li::marker { color: var(--color-muted); }
.journey h3 { font-size: clamp(1.75rem,3vw,2.75rem); }
.journey p { max-width: 45ch; color: var(--color-muted); }
.horizons { background: var(--color-paper-2); padding-block: var(--section-gap-s); }
.horizons h2 { max-width: 22ch; }
.places { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); margin-top: var(--space-2xl); }
.places article { border-top: 1px solid var(--color-rule); padding-block: var(--space-xl) var(--space-lg); }
.places h3 { font-size: clamp(2.5rem,5vw,4.5rem); }
.places p { margin-top: var(--space-md); color: var(--color-muted); max-width: 45ch; }
.places p:last-child { margin-top: var(--space-xl); }
.ocean-section { padding-block: var(--section-gap-s) var(--space-2xl); }
.ocean-caption { display: flex; justify-content: space-between; align-items: center; gap: var(--space-row); margin-bottom: var(--space-lg); }
.ocean-caption p { font-size: var(--text-lead); }
.pause,.back { border: none; background: none; color: inherit; padding: 0; font-size: var(--text-sm); min-height: 48px; cursor: pointer; white-space: nowrap; }
.pause:hover,.back:hover { text-decoration: underline; text-underline-offset: .25em; }
.ocean { height: 260px; background: var(--color-ink); }
.ocean canvas { display: block; width: 100%; height: 100%; }
.ocean-note { margin-top: var(--space-md); font-size: var(--text-sm); color: var(--color-muted); }
.site-footer { padding-block: var(--space-2xl) var(--space-lg); }
.footer-heading { display: flex; justify-content: space-between; align-items: end; gap: var(--space-row); }
.footer-wordmark { font-family: var(--font-display); font-size: clamp(4rem,15vw,13rem); letter-spacing: -.07em; font-weight: 500; line-height: 1.1; }
.footer-heading p { margin-bottom: var(--space-lg); font-size: var(--text-sm); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: var(--space-row); border-top: 1px solid var(--color-rule); padding-top: var(--space-lg); margin-top: var(--space-xl); font-size: var(--text-sm); color: var(--color-muted); }
.profile-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); align-items: center; min-height: calc(100svh - 104px); padding-block: var(--space-xl); }
.profile-title h1 { font-size: clamp(6rem,12vw,11rem); letter-spacing: -.065em; }
.profile-title .lead { font-family: var(--font-display); font-size: clamp(1.75rem,3.25vw,3rem); line-height: 1.18; letter-spacing: -.04em; margin-block: var(--space-xl); }
.release-meta { font-size: var(--text-sm); color: var(--color-muted); margin-top: var(--space-xl); }
.profile-screen { display: flex; flex-direction: column; align-items: center; }
.profile-screen img { width: 68%; max-width: 280px; height: auto; }
.profile-intro { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); padding-block: var(--section-gap-s); border-top: 1px solid var(--color-rule); align-items: end; }
.profile-intro .lead { max-width: 45ch; }
.capabilities { padding-bottom: var(--section-gap-s); }
.capabilities article { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); align-items: baseline; padding-block: var(--space-xl); border-top: 1px solid var(--color-rule); }
.capabilities h2 { font-size: clamp(2rem,3.5vw,3.25rem); max-width: 18ch; }
.capabilities h3 { font-family: var(--font-body); font-size: var(--text-md); letter-spacing: 0; margin-bottom: var(--space-md); }
.capabilities p { color: var(--color-muted); max-width: 45ch; }
.coach-section { background: var(--color-paper-2); padding-block: var(--section-gap-s); }
.coach-opening { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); align-items: end; }
.coach-opening p { color: var(--color-muted); max-width: 45ch; }
.coach-picture { margin-top: var(--space-2xl); }
.coach-picture img { width: 100%; height: auto; }
.availability { padding-block: var(--section-gap); display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-row); align-items: start; }
.availability p { color: var(--color-muted); max-width: 45ch; margin-bottom: var(--space-xl); }
@media(max-width:60rem){.project-grid,.approach-opening,.journey li,.profile-intro,.capabilities article,.coach-opening,.availability{grid-template-columns:minmax(0,1fr);row-gap:var(--space-xl)}.project-copy>p:not(.lead){max-width:45ch}.project-grid{gap:var(--space-2xl)}.project{padding-block:var(--space-2xl)}.approach-note{width:100%;max-width:65ch;margin-left:0}.journey{margin-top:var(--space-2xl)}.journey li{row-gap:var(--space-lg)}.profile-hero{min-height:calc(100svh - 88px)}.profile-screen img{width:90%}.footer-heading{align-items:center}.capabilities article{padding-block:var(--space-xl)}}
@media(max-width:40rem){.project h2{font-size:4.5rem}.project .lead{margin-block:var(--space-lg)}.product-facts{gap:var(--space-xl)}.product-facts div{padding-right:0}.product-picture img{width:70%;max-width:240px}.places{grid-template-columns:minmax(0,1fr)}.ocean-caption{align-items:start;flex-direction:column;gap:var(--space-xs)}.ocean{height:180px}.footer-heading{align-items:start;flex-direction:column;gap:var(--space-lg)}.footer-wordmark{font-size:25vw}.footer-heading p{margin:0}.footer-bottom{flex-wrap:wrap;gap:var(--space-lg);align-items:center}.footer-bottom>span:nth-child(2){order:3;width:100%}.profile-hero{grid-template-columns:minmax(0,1fr);gap:var(--space-2xl);padding-block:var(--space-xl) var(--space-2xl);min-height:auto}.profile-title h1{font-size:6rem}.profile-title .lead{margin-block:var(--space-lg);font-size:2rem}.release-meta{margin-top:var(--space-lg)}.profile-screen img{max-width:240px;width:65%}.profile-intro .lead{font-size:var(--text-md)}.coach-picture{margin-top:var(--space-xl)}.availability{padding-block:var(--section-gap-s)}}

@media(min-width:90rem){.profile-intro h2,.availability h2{font-size:4.5rem}}
