﻿/* Raphael-inspired warm dark color system shared by the full site. */
:root {
  --color-primary: #df9a5e;
  --color-primary-hover: #f0b06b;
  --color-accent: #fdb931;
  --color-text: #f2ece5;
  --color-text-muted: #b6aa9f;
  --color-border: rgba(239, 188, 113, .18);
  --color-surface: #1c1510;
  --color-surface-muted: #211811;
  --color-surface-accent: #2c2016;
  --color-danger: #e05256;
  --shadow-elevated: 0 24px 64px rgba(0, 0, 0, .28);
  color-scheme: dark;
}
html, body { background: #17110d; color: var(--color-text); }
body { background-image: radial-gradient(circle at 12% 0, rgba(223,154,94,.08), transparent 32rem); }
a { color: #f0b06b; }
.eyebrow, .hero-title-highlight { color: #f0b06b; }
.site-header { border-bottom-color: rgba(239,188,113,.12); background: rgba(28,21,16,.9); box-shadow: 0 10px 32px rgba(0,0,0,.2); }
.brand, .site-header .brand, .site-footer .brand { color: #f0a45f; }
.site-nav-links { border-color: rgba(239,188,113,.14); background: rgba(44,32,22,.72); }
.site-nav-links > a { color: #d8cec4; }
.site-nav-links > a:hover, .site-nav-links > a[aria-current="page"] { background: #35271e; color: #ffd4a7; box-shadow: 0 5px 16px rgba(0,0,0,.22); }
.nav-toggle, .nav-icon-button, .nav-sign-in, .user-menu-toggle { border-color: var(--color-border); background: #2a1f18; color: #e8ded5; }
.nav-toggle-icon span { background: currentColor; }
.nav-icon-button:hover, .nav-sign-in:hover,
.user-menu-toggle:hover, .user-menu-toggle[aria-expanded="true"] { background: #35271e; color: #ffd4a7; }
.nav-extension-cta, .button { border-color: #df9a5e; background: #df9a5e; color: #24170f; box-shadow: 0 10px 26px rgba(223,154,94,.18); }
.nav-extension-cta:hover, .button:hover { border-color: #f0b06b; background: #f0b06b; color: #1d1510; box-shadow: 0 12px 30px rgba(223,154,94,.24); }
.button-secondary { border-color: rgba(239,188,113,.22); background: #2a1f18; color: #eee5dc; box-shadow: none; }
.button-secondary:hover { border-color: rgba(239,188,113,.34); background: #35271e; color: #fff6eb; }
.site-nav-links > a:focus-visible, .nav-sign-in:focus-visible, .nav-extension-cta:focus-visible,
.nav-icon-button:focus-visible, .user-menu-toggle:focus-visible, .button:focus-visible {
  outline-color: rgba(223,154,94,.42);
}
.language-menu-list, .user-menu-panel { border-color: var(--color-border); background: #2a1f18; box-shadow: 0 22px 54px rgba(0,0,0,.36); }
.language-menu-list a, .user-menu-links a, .user-menu-footer button { color: #ded4ca !important; }
.language-menu .nav-icon-button { border-color: transparent; background: transparent; color: #c7b9ac; }
.language-menu .nav-icon-button:hover, .language-menu .nav-icon-button[aria-expanded="true"] { border-color: var(--color-border); background: #2a1f18; color: #f0b06b; }
.language-menu .nav-icon-button .language-globe-icon { fill: none; stroke: currentColor; stroke-width: 1.7; }
.nav-sign-in { color: #c7b9ac !important; }
.nav-sign-in:hover { background: #35271e; color: #ffd4a7 !important; }
.language-menu-list .language-translate-icon { stroke: #c49a72; }
.language-menu-list a:hover .language-translate-icon, .language-menu-list a:focus-visible .language-translate-icon { stroke: #f0b06b; }
.language-menu-list a:hover, .language-menu-list a:focus-visible,
.user-menu-links a:hover, .user-menu-links a:focus-visible,
.user-menu-footer button:hover, .user-menu-footer button:focus-visible { background: #3a2b20; color: #ffd4a7 !important; }
.user-menu-identity, .user-menu-footer { border-color: rgba(239,188,113,.12); }
.user-menu-identity strong { color: #f2ece5; }
.user-menu-identity span { color: var(--color-text-muted); }
.user-menu-avatar { background: linear-gradient(135deg, #df9a5e, #b68d40); color: #21150e; }
.user-menu-toggle:focus-visible, .language-menu .nav-icon-button:focus-visible, .nav-sign-in:focus-visible { outline: 3px solid rgba(223,154,94,.3); outline-offset: 2px; }

.landing-hero, .hero, .legal-hero, .pricing-hero, .account-section, .auth-callback-section { border-color: var(--color-border); background: #1c1510; }
.landing-hero::before, .pricing-hero::before { background-image: linear-gradient(rgba(255,229,160,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,229,160,.035) 1px, transparent 1px); }
.hero-glow-one { background: radial-gradient(circle, rgba(223,154,94,.16), transparent 70%); }
.hero-glow-two { background: radial-gradient(circle, rgba(253,185,49,.1), transparent 70%); }
.pricing-hero::after { background: rgba(223,154,94,.13); }
.landing-hero h1, .pricing-hero h1, .legal-hero h1, .account-page-heading h1 { color: #f7f1eb; }
.landing-hero-copy, .hero-lead, .pricing-hero > .pricing-hero-inner > p, .legal-hero p,
.account-page-heading p:last-child { color: var(--color-text-muted); }
.trust-pill, .hero-heading .rating-line, .pricing-hero-badge { border-color: var(--color-border); background: rgba(44,32,22,.88); color: #d8cec4; }
.trust-pill span, .pricing-hero-badge span, .hero-proof-row span, .pricing-hero-proof span { background: rgba(223,154,94,.14); color: #f0b06b; }
.hero-announcement { padding: 5px 13px 5px 5px !important; }
.hero-announcement-badge { display: inline-flex; min-height: 30px; align-items: center; padding: 4px 13px; background: #df9a5e; color: #24170f; font-weight: 750; }
.hero-announcement-icon { display: grid; flex: 0 0 22px; width: 22px; height: 22px; place-items: center; color: #fdb931; }
.hero-announcement-icon svg { width: 18px; height: 18px; fill: currentColor; }
.hero-announcement-text { color: #d8cec4; }
.hero-proof-row, .pricing-hero-proof, .rating-line { color: var(--color-text-muted); }
.stars, .testimonial-stars { color: #fdb931; }

.section { background: #1c1510; }
.section-tint, .soft-section, .pricing-plans-section, .export-options-section { border-color: var(--color-border); background: #211811; }
.pricing-plans-section { background: linear-gradient(180deg, #241a13 0, #1c1510 52%); }
.final-cta { background: linear-gradient(135deg, #2c2016, #211811); }
.section-heading h2, .split h2, .notice h2, .final-cta h2, .planner-section h2 { color: #f4eee8; }
.section-heading p, .rich-copy p, .final-cta p, .planner-section > .center > p:last-child { color: var(--color-text-muted); }
.check-list li, .notice ul, .legal-copy p, .legal-copy li { color: #c5b9ae; }
.check-list li::before { color: #df9a5e; }

/* New product-page sections use a separate naming system from the legacy pages. */
.content-section { border-color: var(--color-border); background: #17110d; }
.content-section.surface-muted { background: #211811; }
.section-heading-block h2, .content-section h3, .callout-card h2 { color: #f4eee8; }
.section-heading-block > p:last-child, .content-section p { color: var(--color-text-muted); }
.callout-section { background: #17110d; }
.accordion-list { border-color: rgba(239,188,113,.16); }
.accordion-list details { border-bottom: 1px solid rgba(239,188,113,.12); }
.accordion-list summary { color: #e8ded5; cursor: pointer; }
.accordion-list summary span { color: #f0b06b; }
.process-steps li:not(:last-child)::after { background: rgba(239,188,113,.2); }

.product-demo, .product-preview, .hero-video-card, .feature-demo-card, .planner, .feature-visual,
.export-output-panel, .export-option-card, .step-grid li, .feature-card, .audience-grid article,
.testimonial-grid figure, .output-grid article, .industry-panel, .plan-card, .price-card,
.pricing-page-card, .pricing-included-grid article, .table-wrap, .notice, .callout-card,
.auth-callback-card, .auth-dialog, .account-plan-card, .account-content-card, .account-danger-card,
.account-sign-in, .account-activation {
  border-color: var(--color-border);
  background: #261c15;
  color: var(--color-text);
  box-shadow: 0 18px 48px rgba(0,0,0,.18);
}
.product-demo-toolbar, .preview-bar, .hero-video-bar, .feature-demo-bar,
.account-panel-header, .pricing-comparison-table thead th, th { border-color: var(--color-border); background: #30231c; color: #cbbdb0; }
.product-demo-sidebar, .planner-result { border-color: var(--color-border); background: #211811; }
.product-demo-main, .preview-list, .preview-output, .planner-form, .privacy-note,
.export-output-panel > ul li, .local-path { border-color: var(--color-border); background: #2a1f18; color: #e8ded5; }
.product-demo-row, .product-demo-actions, .feature-list article, .process-steps::before { border-color: rgba(239,188,113,.12); }
.product-demo-row, .demo-status-card p, .demo-output p, .preview-output p, .preview-output small,
.feature-card p, .testimonial-grid blockquote, .output-grid p, .industry-panel p,
.pricing-card-description, .pricing-billing-line, .pricing-card-price small, .pricing-page-note,
.pricing-cta-note, .pricing-comparison-table td { color: var(--color-text-muted); }
.product-demo-sidebar b, .product-demo-actions button, .demo-check, .setting-action, .pdf-mark,
.industry-tabs button[aria-selected="true"] > span, .feature-card:hover .feature-card-icon {
  background: #df9a5e;
  color: #24170f;
}
.demo-status-card { border-color: rgba(223,154,94,.3); background: #30231c; box-shadow: 0 18px 44px rgba(0,0,0,.32); }
.demo-complete, .price-badge, .plan-badge, .output-badge, .pricing-savings-badge {
  background: rgba(223,154,94,.15);
  color: #f0b06b;
}
.feature-demo-glow, .hero-video-glow { background: linear-gradient(45deg, rgba(223,154,94,.16), rgba(253,185,49,.05), transparent); }
.audience-icon, .feature-card-icon, .feature-list article > span, .option-number,
.process-steps > li > span, .privacy-strip > span, .testimonial-grid figcaption > span,
.export-output-panel > ul li > span, .account-panel-header .account-section-icon,
.account-panel-header .account-plan-icon, .account-dialog-icon {
  border-color: rgba(223,154,94,.22);
  background: rgba(223,154,94,.12);
  color: #f0b06b;
}
.industry-tabs button { border-color: var(--color-border); background: rgba(44,32,22,.7); color: var(--color-text-muted); }
.industry-tabs button > span { background: rgba(223,154,94,.12); color: #f0b06b; }
.industry-tabs button[aria-selected="true"] { border-color: #df9a5e; background: #30231c; color: #fff4e9; }
.industry-tags span { border-color: var(--color-border); background: #30231c; color: #c8bcb1; }
.feature-card:hover { border-color: rgba(223,154,94,.42); box-shadow: 0 12px 34px rgba(0,0,0,.2); }
.industry-panel a, .privacy-strip a, .export-option-card > a { border-color: var(--color-border); color: #f0b06b; }

.pricing-page-card { border-color: rgba(239,188,113,.18); background: #261c15; box-shadow: 0 16px 42px rgba(0,0,0,.2); }
.pricing-free-strip { border-color: rgba(239,188,113,.18); background: #261c15; box-shadow: 0 16px 42px rgba(0,0,0,.16); }
.pricing-free-summary h2, .pricing-free-strip .pricing-card-price { color: #f2ece5; }
.pricing-free-summary p, .pricing-free-benefit, .pricing-free-detail-list li { color: var(--color-text-muted); }
.pricing-free-benefit span, .pricing-free-detail-list span { background: rgba(223,154,94,.14); color: #f0b06b; }
.pricing-page-card::before { background: linear-gradient(90deg, #4a3526, rgba(223,154,94,.25)); }
.pricing-page-card:hover { border-color: rgba(223,154,94,.45); box-shadow: 0 22px 54px rgba(0,0,0,.3); }
.pricing-plan-free { background: #211811; }
.pricing-page-card-featured { border-color: #df9a5e; background: linear-gradient(180deg, #35271e 0, #261c15 42%); box-shadow: 0 24px 60px rgba(223,154,94,.12); }
.pricing-page-card-featured::before { background: linear-gradient(90deg, #d77b42, #f0b06b); }
.pricing-recommended-badge { background: #df9a5e; color: #24170f; box-shadow: 0 8px 22px rgba(223,154,94,.22); }
.pricing-selected-badge { border-color: rgba(223,154,94,.38); background: #3a2b20; color: #ffd4a7; }
.pricing-selected-badge > span { background: #df9a5e; color: #24170f; }
.pricing-page-card h3, .pricing-card-price, .pricing-comparison-table th[scope="row"] { color: #f2ece5; }
.pricing-feature-list-primary, .pricing-feature-list-secondary { border-color: rgba(239,188,113,.14); }
.pricing-feature-list li { color: #c9bdb2; }
.pricing-feature-list li span { background: rgba(223,154,94,.14); color: #f0b06b; }
.pricing-comparison-table { box-shadow: 0 18px 48px rgba(0,0,0,.22); }
.pricing-comparison-table { background: #261c15; }
.pricing-comparison-table tbody tr { border-color: rgba(239,188,113,.1); }
.pricing-comparison-table tbody tr:hover, .account-orders-table tbody tr:hover { background: #2d2119; }

.account-section { background: #17110d; }
.account-panel-header { background: #30231c; }
.account-panel-header h2, .account-current-plan strong, .account-profile-details dd,
.account-plan-benefit, .account-plan-details dd, .account-dialog h2 { color: #f2ece5; }
.account-panel-header p, .account-profile-details dt, .account-current-plan,
.account-plan-details dt, .account-danger-body p, .account-danger-body ul { color: var(--color-text-muted); }
.account-profile-avatar { border-color: #fff0df; background: #3a2b20; color: #f0b06b; box-shadow: 0 0 0 1px rgba(223,154,94,.32), 0 10px 28px rgba(0,0,0,.25); }
.account-profile-details div + div, .account-profile-usage, .account-actions { border-color: rgba(239,188,113,.12); }
.account-plan-subscription { border-color: rgba(239,188,113,.12); }
.account-plan-benefit, .account-plan-details dl { border-color: var(--color-border); background: #211811; }
.account-plan-upgrade { border-color: rgba(223,154,94,.28); background: #35271e; }
.account-plan-upgrade strong { color: #ffd4a7; }
.account-plan-upgrade span { color: #bfae9f; }
.account-status-pill { background: rgba(182,141,64,.18); color: #ffe5a0; }
.account-status-pill.is-free { background: rgba(255,255,255,.07); color: #c9bdb2; }
.account-activation {
  position: relative;
  overflow: hidden;
  gap: 16px;
  padding: 20px 22px;
  border-color: rgba(223,154,94,.28);
  background: linear-gradient(135deg, #30231c 0%, #261c15 100%);
  box-shadow: 0 14px 38px rgba(0,0,0,.2);
}
.account-activation::before {
  content: "";
  position: absolute;
  top: 16px;
  bottom: 16px;
  left: 0;
  width: 3px;
  border-radius: 0 999px 999px 0;
  background: #df9a5e;
}
.account-activation[data-state="success"] {
  border-color: rgba(151,159,113,.34);
  background: linear-gradient(135deg, rgba(119,128,86,.14), #261c15 58%);
}
.account-activation[data-state="success"]::before { background: #aeb984; }
.account-activation[data-state="failed"] {
  border-color: rgba(185,83,73,.36);
  background: linear-gradient(135deg, rgba(185,83,73,.14), #261c15 58%);
}
.account-activation[data-state="failed"]::before { background: #c46b62; }
.account-activation[data-state="delayed"] {
  border-color: rgba(182,141,64,.36);
  background: linear-gradient(135deg, rgba(182,141,64,.14), #261c15 58%);
}
.account-activation[data-state="delayed"]::before { background: #d6ae62; }
.account-activation-icon {
  flex-basis: 38px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(223,154,94,.3);
  background: rgba(223,154,94,.14);
  color: #f0b06b;
  box-shadow: inset 0 0 0 4px rgba(0,0,0,.08);
}
.account-activation[data-state="success"] .account-activation-icon {
  border-color: rgba(174,185,132,.38);
  background: rgba(119,128,86,.2);
  color: #dfe7bd;
}
.account-activation[data-state="failed"] .account-activation-icon {
  border-color: rgba(196,107,98,.38);
  background: rgba(185,83,73,.18);
  color: #efb0aa;
}
.account-activation[data-state="delayed"] .account-activation-icon {
  border-color: rgba(214,174,98,.38);
  background: rgba(182,141,64,.18);
  color: #f1d28f;
}
.account-activation h2 { margin-top: 0; color: #f4eee8; font-size: 1.04rem; }
.account-activation p { color: #c7b9ac; line-height: 1.55; }
.account-activation small {
  display: inline-flex;
  max-width: 100%;
  margin-top: 10px;
  padding: 5px 9px;
  overflow-wrap: anywhere;
  border: 1px solid rgba(239,188,113,.14);
  border-radius: 8px;
  background: rgba(18,13,10,.38);
  color: #a99b90;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .74rem;
  line-height: 1.45;
}
.account-activation-actions { margin-top: 14px; }
.account-activation-actions .button { min-height: 44px; }
.account-success-message {
  border: 1px solid rgba(151,159,113,.3);
  background: rgba(119,128,86,.14);
  color: #dfe7bd;
}
.account-subscription-item, .account-orders-wrap, .account-delete-preview { border-color: var(--color-border); background: #211811; }
.account-subscription-item p, .account-muted, .account-orders-table td { color: var(--color-text-muted); }
.account-orders-table th { background: #30231c; color: #c7b9ac; }
.account-orders-table th, .account-orders-table td { border-color: rgba(239,188,113,.12); }
.account-orders-table code { color: #f0b06b; }
.account-order-status { border-color: rgba(239,188,113,.12); background: rgba(255,255,255,.055); color: #c9bdb2; }
.account-order-status.is-paid, .account-order-status.is-completed, .account-order-status.is-active {
  border-color: rgba(151,159,113,.28);
  background: rgba(119,128,86,.16);
  color: #cbd2ae;
}
.account-order-status.is-pending { border-color: rgba(182,141,64,.26); background: rgba(182,141,64,.16); color: #e9ca83; }
.account-order-status.is-failed, .account-order-status.is-expired { border-color: rgba(185,83,73,.25); background: rgba(185,83,73,.14); color: #dfa099; }
.account-danger-card { border-color: rgba(185,83,73,.24); }
.account-danger-card .account-panel-header { border-color: rgba(185,83,73,.18); background: rgba(135,60,51,.1); }
.account-danger-card h2 { color: #eee4dc; }
.account-danger-card h3 { color: #d8cec4; }
.account-danger-icon, .account-dialog-icon-danger { border-color: rgba(185,83,73,.2); background: rgba(185,83,73,.12); color: #dfa099; }
.account-delete-button { border-color: #ad554e; background: #b85c55; color: #fff8f5; box-shadow: 0 10px 24px rgba(120,42,36,.18); }
.account-delete-button:hover { border-color: #c46b62; background: #c46b62; color: #fff; }
.account-dialog::backdrop, .auth-dialog::backdrop { background: rgba(8,5,3,.76); }
.account-dialog-panel, .auth-dialog { border-color: var(--color-border); background: #261c15; }
.account-dialog-close, .auth-dialog-close { color: #c7b9ac; }
.account-dialog-close:hover, .auth-dialog-close:hover { background: #35271e; }
.account-delete-preview { color: #e7ddd4; }
.account-dialog-field { color: #e7ddd4; }
.account-dialog-field input, .planner-form input[type=number], .planner-form select {
  border-color: rgba(239,188,113,.25);
  background: #1c1510;
  color: #f2ece5;
}
.account-dialog-field input:focus, .planner-form input:focus, .planner-form select:focus {
  border-color: #df9a5e;
  outline-color: rgba(223,154,94,.2);
}
.account-dialog-note { color: #c9a48c; }
.google-sign-in-button { background: #fff; color: #202124; }

.site-footer { border-top-color: rgba(239,188,113,.12); background: #120d0a; color: #d8cec4; }
.site-footer .footer-brand p, .site-footer .footer-brand .footer-support-email,
.site-footer > div:not(.footer-bottom) a, .site-footer .footer-bottom-links a { color: #a99b90 !important; }
.site-footer h2 { color: #f2ece5; }
.site-footer > div:not(.footer-bottom) a:hover, .site-footer .footer-bottom a:hover { color: #f0b06b !important; }
.site-footer .footer-bottom { border-color: rgba(239,188,113,.12); color: #81756c; }
.footer-language { border-color: var(--color-border); background: #211811; color: #c7b9ac; }

@media (max-width: 1240px) {
  .site-nav { border-color: var(--color-border); background: #211811; box-shadow: 0 22px 55px rgba(0,0,0,.38); }
  .site-nav-links { background: transparent; }
  .site-nav-actions { border-color: rgba(239,188,113,.12); }
}
@media (max-width: 620px) {
  .account-activation { gap: 13px; padding: 18px 16px 18px 18px; }
  .account-activation-icon { flex-basis: 36px; width: 36px; height: 36px; }
  .account-activation-actions { align-items: stretch; flex-direction: column; }
  .account-activation-actions .button { width: 100%; }
}

