/* Hallmark custom editorial chapters; campus illustration and Motion choreography.
 * Native HTML, native scrolling, reduced-motion fallback; no hidden content default. */
:root { --color-note: #f1e8e4; --text-chapter: clamp(2.5rem, 5vw, 5rem); --duration-ink: 420ms; }
.page { animation: none; }
.contact-privacy-note { margin: calc(-1 * var(--space-xs)) 0 var(--space-md); }
.headline-accent, .campus-heading-accent { color: var(--color-accent); position: relative; width: fit-content; }
.editorial-underline { position: absolute; left: 0; bottom: -.16em; width: 2.65em; height: .22em; fill: none; stroke: var(--color-accent); stroke-width: 2.5; stroke-linecap: round; transform-origin: left center; animation: ink-arrive var(--duration-ink) var(--ease-out) 160ms both; }
@keyframes ink-arrive { from { opacity: .4; transform: scaleX(.2); } to { opacity: 1; transform: scaleX(1); } }
.button svg, .text-link svg { stroke-width: 1.6; transition: transform var(--dur-short) var(--ease-out); }
.home-editorial { --chapter-space: 3.5rem; }
.home-hero { padding-bottom: var(--chapter-space); border-bottom: var(--rule-hair) solid var(--color-rule); }
.home-hero .hero-copy { min-width: 0; }
.home-hero .hero-copy > p { font-size: var(--text-lg); line-height: 1.8; }
.home-hero .auth-home-status { font-size: var(--text-xs) !important; color: var(--color-muted); }
.home-hero .hero-copy h1 span { display: block; }
.home-hero .hero-copy h1 { font-size: clamp(3rem, 12vw, 4.5rem); line-height: 1.18; margin-bottom: var(--space-lg); }
.home-hero .ticket-tail { display: none; }
.home-hero-art { min-width: 0; }
.home-hero .invitation-illustrated .invite-inner { padding-top: var(--space-2xs); }
.home-hero .invitation-illustrated h2 { margin: var(--space-2xs) 0 var(--space-xs); }
.home-letter { position: relative; isolation: isolate; display: grid; gap: var(--space-lg); padding: var(--chapter-space) 0; }
.home-letter::before { content: ''; position: absolute; inset: 0 calc(-1 * var(--space-sm)); z-index: -1; background: var(--color-note); clip-path: polygon(0 1%, 13% 0, 29% 1%, 46% 0, 64% 1%, 82% 0, 100% 1%, 100% 99%, 84% 100%, 69% 99%, 53% 100%, 36% 99%, 19% 100%, 0 99%); }
.home-letter-art img { display: block; width: 100%; height: auto; }
.home-letter h2, .home-story h2 { font-family: var(--font-display); font-size: var(--text-chapter); line-height: 1.25; font-weight: 500; letter-spacing: -.035em; margin: 0 0 var(--space-md); }
.home-letter h2 span, .home-story h2 span { display: block; }
.home-letter h2 span:last-child { color: var(--color-accent); }
.home-letter-copy p, .home-story-intro p { font-size: var(--text-lg); color: var(--color-ink); line-height: 1.85; margin: 0 0 var(--space-xs); }
.home-letter-copy .text-link { margin-top: var(--space-xs); }
.home-story { display: grid; gap: var(--space-xl); padding: var(--chapter-space) 0; }
.home-story-intro { min-width: 0; align-self: start; }
.home-coffee-art { display: block; width: min(100%, 20rem); height: auto; margin: var(--space-md) 0 0; }
.home-story-steps { border-left: var(--rule-hair) solid var(--color-rule); margin-left: var(--space-xs); }
.story-step { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: var(--space-sm); min-height: 10rem; padding: var(--space-lg) 0 var(--space-lg) var(--space-md); position: relative; }
.story-step::before { content: ''; position: absolute; width: 8px; height: 8px; left: -4.5px; top: 3rem; background: var(--color-accent); border-radius: 50%; }
.story-step:not(:last-child)::after { content: ''; position: absolute; bottom: 0; left: var(--space-md); right: 0; height: var(--rule-hair); background: var(--color-rule); }
.story-number { font-family: var(--font-outlier); font-size: 2.5rem; color: var(--color-accent); line-height: 1.2; }
.story-step h3 { font-family: var(--font-display); font-size: 1.6rem; font-weight: 500; line-height: 1.4; margin: 0 0 var(--space-xs); }
.story-step p { font-size: var(--text-md); line-height: 1.85; color: var(--color-muted); margin: 0; }
.home-close { border-top: var(--rule-hair) solid var(--color-rule); padding: var(--chapter-space) 0; text-align: center; }
.home-close h2 { font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.4; font-weight: 500; margin: 0 0 var(--space-sm); letter-spacing: -.025em; }
.home-close p { font-size: var(--text-md); line-height: 1.8; color: var(--color-muted); margin: 0 0 var(--space-md); }
.home-close .button { min-height: 56px; padding-inline: var(--space-lg); font-family: var(--font-display); font-size: var(--text-lg); }
.home-close .text-link { min-height: 44px; margin-top: var(--space-xs); }
.faq details[open] > p { animation: detail-arrive 220ms var(--ease-out) both; }
@keyframes detail-arrive { from { opacity: .3; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (hover: hover) and (pointer: fine) {
  .button:not(:disabled):hover svg, .text-link:hover svg { transform: translateX(3px); }
  .campus-page .button:not(.secondary):not(:disabled):hover::after { transform: translateX(3px); }
  .home-hero .campus-walk-art { transition: transform 400ms var(--ease-out); }
  .home-hero-art:hover .campus-walk-art { transform: translateY(-3px) rotate(-.4deg); }
}
.startup-panel { display: grid; justify-items: start; align-content: center; gap: var(--space-sm); min-height: 60vh; padding: var(--space-xl) 0; }
.startup-panel h1 { margin: 0 0 var(--space-sm); font-size: clamp(2.25rem, 7vw, 4rem); line-height: 1.4; }
.startup-panel p { margin: 0; }
.startup-panel .startup-hint { color: var(--color-muted); }
.startup-panel .button { margin-top: var(--space-sm); }
@media (max-width: 39.99rem) {
  .invitation-illustrated .ticket-fields {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    text-align: left;
  }
  .invitation-illustrated .ticket-fields > div {
    grid-template-columns: 3rem minmax(0, 1fr);
    min-width: 0;
  }
  .invitation-illustrated .ticket-fields dd { min-width: 0; }
}
@media (min-width: 40rem) {
  .home-letter::before { inset-inline: calc(-1 * var(--space-lg)); }
  .home-letter { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: center; gap: var(--space-lg); }
  .home-story { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--space-lg); }
  .home-story-intro { position: sticky; top: var(--space-xl); }
  .story-step { min-height: 13rem; }
}
@media (min-width: 64rem) {
  .site-header { padding-top: var(--space-lg); gap: var(--space-sm); }
  .site-header nav button { font-size: var(--text-md); }
  .home-editorial { --chapter-space: 6rem; }
  .home-hero { grid-template-columns: minmax(0, .85fr) minmax(0, 1.45fr); gap: var(--space-sm); padding: var(--space-xs) 0 var(--space-md) var(--space-xl); }
  .home-hero .hero-copy h1 { font-size: clamp(4rem, 6.25vw, 6rem); font-weight: 500; }
  .home-hero .hero-copy > p { font-family: var(--font-display); font-size: var(--text-xl); margin-bottom: var(--space-lg); }
  .home-hero .auth-home-status { margin-top: var(--space-md) !important; font-size: var(--text-sm) !important; }
  .home-hero .campus-walk-art { max-width: 51rem; margin-left: auto; }
  .home-hero .invitation-illustrated .invite-inner { max-width: 44rem; margin-left: auto; }
  .home-hero .invitation-illustrated h2 { font-size: 1.75rem; }
  .home-letter { padding-inline: var(--space-xl); gap: var(--space-xl); }
  .home-letter::before { inset-inline: calc(-1 * var(--space-page-gutter)); }
  .home-letter-copy p { font-size: 1.25rem; }
  .home-story { padding-inline: var(--space-xl); gap: var(--space-2xl); }
  .home-story h2 { font-size: clamp(3rem, 4.75vw, 4.5rem); }
  .home-story-intro p { font-size: 1.125rem; max-width: 31rem; }
  .story-step { grid-template-columns: 5rem minmax(0, 1fr); gap: var(--space-lg); min-height: 15rem; padding-left: var(--space-xl); }
  .story-step::before { top: 3.5rem; }
  .story-step:not(:last-child)::after { left: var(--space-xl); }
  .story-number { font-size: 4.5rem; }
  .story-step h3 { font-size: 2rem; }
  .story-step p { font-size: var(--text-lg); }
  .campus-page { min-height: 0; padding-top: 8rem; padding-bottom: var(--space-lg); }
  .campus-welcome-copy { margin-bottom: var(--space-sm); }
  .campus-welcome-ending { max-width: none; }
  .desk-note-art { width: 26rem; max-width: 65%; margin-top: -6rem; }
}
@media (prefers-reduced-motion: reduce) {
  .editorial-underline, .faq details[open] > p { animation: none; }
  .home-hero .campus-walk-art, .button svg, .text-link svg, .campus-page .button::after { transition: none; transform: none !important; }
}