/* Hallmark · theme: brand · redesign: restyle · genre: editorial · copy: kept except user-requested pricing copy · v2.0.0 */
html, body { overflow-x: clip; }
body { font-size: 16px; }
h1, h2, h3 { overflow-wrap: break-word; min-width: 0; font-synthesis: none; }
h1 .headline-tail, h2 .headline-tail { font-style: normal; font-weight: inherit; color: inherit; }
p { text-wrap: pretty; }
button, input, select { font-family: var(--body); }
.wrap { width: min(var(--container), calc(100% - var(--gutter-page) * 2)); }
.section { padding-block: var(--space-3xl); }
.section-heading { gap: var(--space-2xl); margin-bottom: var(--space-2xl); align-items: end; }
.section-heading > p, .section-heading > div > p:not(.eyebrow) { font-size: 16px; line-height: 1.75; max-width: 48ch; }
h2 { font-size: clamp(40px, 4.6vw, 64px); line-height: 1.06; }
.button { min-height: 52px; border: 1px solid transparent; border-radius: var(--radius-pill); padding: var(--space-sm) var(--space-lg); gap: var(--space-sm); font-size: 14px; white-space: nowrap; transition: background-color var(--dur-short), color var(--dur-short); }
.button:hover { transform: none; }
.button:active { transform: translateY(1px); }
.button.secondary { color: var(--berry); background: transparent; border-color: var(--line); }
.button.secondary:hover { background: var(--blush); }
.button:disabled, button:disabled { opacity: .55; cursor: not-allowed; }
.button[aria-busy="true"] { cursor: progress; }
.button.small { min-height: 44px; padding: var(--space-xs) var(--space-lg); font-size: 13px; }
.text-link { font-size: 14px; line-height: 1.5; min-height: 44px; gap: var(--space-sm); }
.text-link svg { width: 18px; height: 18px; flex: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 2px solid var(--berry); outline-offset: 4px; }
.site-header { max-width: 1600px; left: 50%; translate: -50% 0; min-height: 88px; padding-inline: var(--gutter-page); }
.desktop-nav { font-size: 14px; gap: var(--space-lg); }
.desktop-nav a { min-height: 44px; display: flex; align-items: center; white-space: nowrap; }
.hero-content { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--space-2xl); padding-top: var(--space-3xl); padding-bottom: var(--space-xl); }
.hero h1 { font-size: clamp(60px, 6.4vw, 92px); max-width: 13ch; line-height: 1.02; }
.hero-copy { max-width: 420px; }
.hero-copy > p:first-child { font-size: 16px; line-height: 1.75; }
.hero-actions { gap: var(--space-xs); }
.prototype-note { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-md); }
.hero .prototype-note { font-size: 12px; }
.hero-bottom > p { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-lg); font-size: 12px; }
.occasion-strip { font-size: 27px; padding-block: var(--space-lg); }
.problem-comparison { gap: var(--space-xl); }
.problem-comparison article { padding-top: var(--space-lg); }
.problem-comparison h3 { font-size: 32px; }
.problem-comparison p { font-size: 15px; line-height: 1.75; }
.problem-after strong { font-size: 15px; }
.problem-after .text-link { font-size: 14px; }
.product-section { padding-top: 0; }
.live-demo { border-radius: var(--radius-panel); border-color: var(--line); box-shadow: none; background: var(--paper); }
.demo-toolbar { padding: var(--space-md) var(--space-lg); }
.demo-toolbar > div { font-size: 14px; }
.demo-toolbar > button { font-size: 12px; min-height: 44px; }
.demo-badge { font-size: 11px; }
.demo-nav { padding-inline: var(--space-sm); }
.demo-nav button { font-size: 13px; padding: var(--space-md) var(--space-sm); }
.demo-placeholder { min-height: 440px; gap: var(--space-lg); padding: var(--space-xl); }
.demo-placeholder h3 { font-size: 40px; }
.demo-placeholder p { font-size: 15px; max-width: 52ch; }
.demo-entry-actions .button { font-size: 14px; }
.demo-caption { font-size: 12px; padding: var(--space-md) var(--space-lg); }
.product-chapters { padding-top: var(--space-lg); }
.product-chapter { gap: var(--space-2xl); padding-block: var(--space-2xl); }
.chapter-copy h3, .benefit-copy h3 { font-size: clamp(34px, 3.3vw, 46px); line-height: 1.13; }
.chapter-copy > p, .chapter-copy li, .benefit-copy > p { font-size: 16px; line-height: 1.75; }
.chapter-preview, .chapter-preview.budget-example, .celebration-example { padding: var(--space-xl); border-radius: var(--radius-panel); background: var(--soft-surface); }
.chapter-preview figcaption, .celebration-example figcaption { font-size: 13px; line-height: 1.65; }
.chapter-preview .preview-result { font-size: 16px; }
.chapter-preview .preview-note { font-size: 12px; }
.guest-example table { font-size: 14px; }
.guest-example thead th { font-size: 12px; }
.guest-example td span { font-size: 12px; }
.seating-example dl > div { font-size: 14px; }
.budget-example dl { font-size: 15px; }
.budget-example > p { font-size: 13px; }
.budget-example .budget-remainder { font-size: 19px; }
.benefit-main, .tradition-language > article { gap: var(--space-2xl); }
.celebration-example li p { font-size: 14px; }
.celebration-example h4 { font-size: 16px; }
.example-footnote { font-size: 14px; }
.language-example > div > p { font-size: 30px; }
.language-example > p { font-size: 13px; }
.scenario-disclosure { border-radius: var(--radius-panel); }
.scenario-disclosure > summary { min-height: 76px; padding: var(--space-lg) var(--space-xl); font-size: 16px; }
.story-example-label, .story-disclaimer { font-size: 13px; }
.feature-hub { background: var(--night); border-radius: var(--radius-section) var(--radius-section) 0 0; padding-block: var(--space-3xl); }
.feature-hub .hub-layout { gap: var(--space-lg) var(--space-2xl); }
.feature-hub h2 { font-size: clamp(40px, 4.2vw, 60px); }
.feature-hub .module-detail { border-radius: var(--radius-panel); padding: var(--space-lg); }
.feature-hub .module-detail > p { font-size: 15px; min-height: 0; }
.module-features li { font-size: 14px; }
.module-heading > span { border-radius: var(--radius-inner); background: transparent; color: var(--hub-accent); }
.feature-hub .module-detail .button { background: var(--price-button); color: var(--night); }
.feature-hub .module-detail .button:hover { background: var(--price-accent); }
.module-connections > p, .module-related button, .hub-hint { font-size: 13px; }
.feature-hub .hub-node { font-size: 13px; }
.feature-hub .hub-node:hover > .hub-node-icon { transform: none; }
.feature-hub .hub-node[aria-pressed=true] > .hub-node-icon { transform: none; }
.supporting-details { position: relative; z-index: 1; border-radius: var(--radius-section) var(--radius-section) 0 0; background: var(--paper); margin-top: calc(var(--space-xl) * -1); padding-top: var(--space-3xl); }
.everyday-benefits { column-gap: var(--space-2xl); }
.everyday-benefits dt { font-size: 18px; }
.everyday-benefits dd { font-size: 15px; }
.everyday-benefits a { font-size: 14px; }
.planning-section { background: var(--soft-surface); border-radius: var(--radius-section) var(--radius-section) 0 0; padding-bottom: var(--space-4xl); }
.start-steps { gap: var(--space-2xl); }
.start-steps h3 { font-size: 18px; }
.start-steps p { font-size: 15px; }
.start-steps .text-link { font-size: 14px; }
.checklist-disclosure > summary, .check-row { font-size: 15px; }
.checklist-disclosure .small-note { font-size: 12px; }

.pricing-section { position: relative; isolation: isolate; overflow: clip; width: 100%; margin-top: calc(var(--space-xl) * -1); border-radius: var(--radius-section) var(--radius-section) 0 0; padding-block: var(--space-3xl) var(--space-4xl); background: var(--night); color: var(--night-ink); }
.pricing-watermark { position: absolute; z-index: -1; pointer-events: none; user-select: none; width: min(1120px, 94%); height: auto; max-width: none; left: 50%; top: 40%; transform: translate(-50%, -50%); opacity: .04; }
.pricing-content { max-width: 1080px; }
.pricing-section .section-heading { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-lg); margin-bottom: var(--space-2xl); }
.pricing-section h2 { font-size: clamp(42px, 4.5vw, 66px); max-width: none; }
.pricing-section .section-heading > p { max-width: 64ch; font-size: 15px; color: var(--night-muted); }
.pricing-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); width: min(100%, 460px); margin-inline: auto; border: 0; border-radius: 0; overflow: visible; }
.pricing-section .price-card { display: flex; flex-direction: column; align-items: stretch; border: 1px solid var(--price-glass-border); border-radius: var(--radius-panel); padding: var(--space-xl); background: linear-gradient(180deg, var(--price-glass-top), var(--price-glass-bottom) 70%); box-shadow: 0 40px 90px -50px var(--price-card-glow); color: var(--night-ink); }
.price-heading { min-height: 0; }
.pricing-section .price-card { --night-muted: var(--price-card-muted); }
.pricing-section .price-card h3 { font: 500 23px/1.3 var(--body); letter-spacing: -.025em; }
.pricing-section .price-status { margin-top: var(--space-xs); font-size: 12px; color: var(--night-muted); }
.pricing-section .price-card .price { font: 500 68px/1 var(--display); font-variant-numeric: tabular-nums; color: var(--night-ink); margin: var(--space-lg) 0; }
.pricing-section .price-card .price span { font: 400 14px/1.6 var(--body); color: var(--night-muted); margin-top: var(--space-xs); }
.pricing-section .price-card > p:not(.price) { font-size: 14px; line-height: 1.7; color: var(--night-muted); min-height: 48px; }
.pricing-section .price-card ul { margin: var(--space-lg) 0 var(--space-xl); padding: 0; width: 100%; }
.pricing-section .price-card li { font-size: 14px; line-height: 1.65; padding: var(--space-sm) 0; border: 0; gap: var(--space-sm); }
.pricing-section .price-card li > svg { width: 17px; height: 17px; margin-top: var(--space-2xs); color: var(--price-accent); }
.pricing-section .price-card .button { min-height: 48px; font-size: 14px; padding-inline: var(--space-md); margin-top: auto; background: var(--price-button); color: var(--night); }
.pricing-section .price-card .button:hover { background: var(--price-accent); }
.pricing-section .price-card .button.secondary { color: var(--night-ink); background: transparent; border-color: var(--night-input); }
.pricing-section .price-card .button.secondary:hover { background: var(--price-warm); }
.pricing-section .guest-calculator { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: var(--space-xl); padding: var(--space-xl) 0 0; margin: var(--space-2xl) auto 0; width: min(100%, 1000px); border: 0; border-top: 1px solid var(--night-line); background: transparent; color: var(--night-ink); }
.pricing-section .guest-calculator h3 { font-size: 30px; line-height: 1.2; }
.pricing-section .guest-calculator .small-note { color: var(--night-muted); font-size: 12px; margin-top: var(--space-md); line-height: 1.7; }
.pricing-section .guest-calculator label { color: var(--night-muted); font-size: 13px; margin: 0; gap: var(--space-sm); }
.pricing-section .guest-total { margin-top: var(--space-md); gap: var(--space-sm); }
.pricing-section .guest-total output { color: var(--night-ink); font-size: 44px; font-variant-numeric: tabular-nums; }
.pricing-section .guest-total span, .pricing-section .range-ends { color: var(--night-muted); font-size: 12px; }
.pricing-section input[type=range] { accent-color: var(--price-accent); min-height: 44px; }
.pricing-section select { border: 1px solid var(--night-input); border-radius: var(--radius-inner); background: var(--price-surface); color: var(--night-ink); padding: var(--space-sm) var(--space-md); min-height: 48px; font-size: 14px; }
.pricing-section .table-result { margin-top: var(--space-md); font-size: 14px; color: var(--night-muted); }
.pricing-section .table-result strong { color: var(--night-ink); font-variant-numeric: tabular-nums; }
.pricing-section .guest-calculator .text-link { color: var(--night-ink); font-size: 13px; margin-top: var(--space-xs); gap: var(--space-xs); }
.pricing-section :focus-visible { outline-color: var(--price-accent); }
.faq-section { position: relative; z-index: 1; display: block; width: 100%; padding-top: var(--space-3xl); padding-bottom: var(--space-4xl); margin-top: calc(var(--space-xl) * -1); border-radius: var(--radius-section) var(--radius-section) 0 0; background: var(--paper); color: var(--ink); }
.faq-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); gap: var(--space-2xl); }
.faq-layout > div > p { color: var(--muted); font-size: 16px; margin-top: var(--space-lg); }
.faq-list summary { font-size: 15px; padding-block: var(--space-lg); }
.faq-list details p { font-size: 14px; line-height: 1.8; }
.blossom-ending { border-radius: var(--radius-section) var(--radius-section) 0 0; }
.ending-cta h2 { max-width: none; }
.ending-cta > p { font-size: 16px; }
.name-form input { min-height: 48px; font-size: 14px; }
.name-form .button { min-height: 48px; font-size: 14px; }
.ending-cta > .name-hint { font-size: 12px; }
.footer-columns h3 { font-size: 13px; text-transform: none; letter-spacing: normal; }
.footer-columns a, .footer-columns button { font-size: 14px; min-height: 32px; }
.footer-brand p { font-size: 13px; }
.footer-bottom, .design-credit { font-size: 12px; }
.footer-wordmark { font-variant-numeric: normal; }
@media (max-width: 1050px) {
 :root { --gutter-page: 32px; }
 .desktop-nav { gap: var(--space-md); font-size: 12px; }
 .site-header { gap: var(--space-md); }
 .brand { width: 160px; }
 .hero-content { gap: var(--space-xl); }
 .hero h1 { font-size: 68px; }
 .chapter-preview, .chapter-preview.budget-example, .celebration-example { padding: var(--space-lg); }
 .pricing-section .guest-calculator { gap: var(--space-lg); }
 .pricing-section .price-card { padding: var(--space-lg); }
}
@media (max-width: 760px) {
 :root { --gutter-page: 20px; --radius-section: 28px; --radius-panel: 24px; --radius-inner: 16px; }
 .section { padding-block: var(--space-2xl); }
 .section-heading { gap: var(--space-lg); margin-bottom: var(--space-xl); }
 .section-heading > p, .section-heading > div > p:not(.eyebrow) { font-size: 15px; }
 .site-header { padding-inline: var(--space-lg); }
 .hero { min-height: max(840px, 100svh); }
 .hero-content { grid-template-columns: minmax(0, 1fr); padding-top: 280px; padding-bottom: var(--space-lg); gap: var(--space-lg); }
 .hero h1 { font-size: clamp(46px, 11.6vw, 72px); max-width: none; }
 .hero-copy > p:first-child { font-size: 15px; max-width: 43ch; }
 .hero .prototype-note { font-size: 11px; }
 .hero-bottom > p { font-size: 11px; gap: var(--space-xs) var(--space-md); }
 .hero-actions .button { font-size: 13px; padding-inline: var(--space-lg); }
 .occasion-strip { font-size: 23px; }
 .problem-comparison p { font-size: 15px; }
 .problem-after { border-left: 0; padding-left: 0; padding-top: var(--space-md); }
 .product-section { padding-top: 0; }
 .demo-toolbar { padding: var(--space-sm); flex-wrap: wrap; gap: var(--space-xs); }
 .demo-toolbar > div { font-size: 12px; }
 .demo-toolbar > button { font-size: 12px; }
 .demo-nav button { font-size: 12px; }
 .demo-placeholder { padding: var(--space-lg); min-height: 460px; gap: var(--space-lg); }
 .demo-placeholder h3 { font-size: 32px; }
 .demo-placeholder p { font-size: 14px; }
 .demo-caption { padding: var(--space-md); font-size: 11px; }
 .product-chapters { padding-top: var(--space-lg); }
 .product-chapter { gap: var(--space-lg); padding-block: var(--space-xl); }
 .chapter-copy h3, .benefit-copy h3 { font-size: 36px; }
 .chapter-copy > p, .chapter-copy li, .benefit-copy > p { font-size: 15px; }
 .chapter-preview, .chapter-preview.budget-example, .celebration-example { padding: var(--space-lg); }
 .guest-example table { font-size: 12px; }
 .guest-example thead th, .guest-example td span { font-size: 11px; }
 .chapter-preview figcaption { font-size: 12px; }
 .seating-example dl > div { font-size: 13px; }
 .benefit-main, .tradition-language > article { gap: var(--space-lg); }
 .scenario-disclosure > summary { font-size: 14px; padding: var(--space-lg); }
 .feature-hub { padding-block: var(--space-2xl) var(--space-3xl); background: var(--night); }
 .feature-hub .hub-node { font-size: 11px; }
 .feature-hub .hub-layout { gap: var(--space-lg); }
 .feature-hub .module-detail { padding: var(--space-lg); }
 .supporting-details { padding-top: var(--space-2xl); }
 .planning-section { padding-bottom: var(--space-3xl); }
 .start-steps { gap: var(--space-xl); }
 .checklist-disclosure > summary { font-size: 14px; }
 .pricing-section { padding-block: var(--space-2xl) var(--space-3xl); }
 .pricing-section .section-heading { gap: var(--space-lg); margin-bottom: var(--space-xl); }
 .pricing-section h2 { font-size: 44px; }
 .pricing-section .section-heading > p { font-size: 14px; }
 .pricing-watermark { width: 150%; top: 32%; max-width: 900px; }
 .pricing-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); max-width: 480px; }
 .pricing-section .price-card { padding: var(--space-lg); border: 1px solid var(--price-glass-border); border-radius: var(--radius-panel); }
 .price-heading { min-height: 0; }
 .pricing-section .price-card .price { font-size: 64px; margin-block: var(--space-lg); }
 .pricing-section .price-card > p:not(.price) { min-height: 0; }
 .pricing-section .price-card li { font-size: 14px; }
 .pricing-section .price-card .button { font-size: 13px; }
 .pricing-section .guest-calculator { grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); max-width: 480px; margin-top: var(--space-xl); padding-top: var(--space-xl); }
 .pricing-section .guest-calculator select { font-size: 16px; }
 .pricing-section .guest-calculator .small-note { max-width: 42ch; }
 .faq-section { padding-block: var(--space-2xl) var(--space-3xl); }
 .faq-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
 .faq-list summary { font-size: 14px; gap: var(--space-md); }
 .faq-list details p { font-size: 14px; padding-right: 0; }
 .ending-cta h2 { font-size: clamp(48px, 12vw, 64px); }
 .ending-cta > p { font-size: 15px; }
 .name-form input { font-size: 16px; padding-inline: var(--space-xs); }
 .name-form .button { font-size: 14px; }
 .ending-cta > .name-hint { font-size: 11px; max-width: 34ch; }
 .footer-columns { gap: var(--space-lg); }
 .footer-columns h3 { font-size: 12px; }
 .footer-columns a, .footer-columns button { font-size: 13px; min-height: 36px; }
 .footer-brand p { font-size: 12px; }
 .footer-bottom, .design-credit { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
 .button { transition: none; }
 .button:active { transform: none; }
}
