/* Shared finishing layer: restrained colour, readable type, and consistent controls. */
:root { --ink:#263d35; --muted:#5e6862; --paper:#faf9f5; --line:#dce1d9; --accent:#a54432; }
html { scroll-behavior:smooth; scroll-padding-top:95px; }
body.conversion-home { background:var(--paper); color:var(--ink); font-family:Inter,system-ui,sans-serif; }
.conversion-home *, .conversion-home *::before, .conversion-home *::after { box-sizing:border-box; }
.conversion-home a { color:var(--accent); }
.conversion-home h1,.conversion-home h2,.conversion-home h3 { color:var(--ink); letter-spacing:-.035em; }
.conversion-home h2 { font-size:clamp(1.65rem,3vw,2.4rem); line-height:1.18; }
.conversion-home p { line-height:1.65; }
.conversion-home .site-header { background:rgba(250,249,245,.97); border-bottom:1px solid var(--line); box-shadow:none; }
.conversion-home .header-container { max-width:1120px; }
.conversion-home .logo { color:var(--ink); font-weight:700; letter-spacing:-.05em; }
.conversion-home .site-header nav a { color:var(--ink); }
.conversion-home .hero { max-width:850px; margin:0 auto; padding:65px 24px 35px; }
.conversion-home .hero h1 { font-family:Georgia,serif; font-size:clamp(2.4rem,5.5vw,4.2rem); font-weight:400; line-height:1.07; max-width:760px; margin:12px auto 22px; }
.conversion-home .hero-subheadline { max-width:630px; color:var(--muted); font-size:1.08rem; }
.conversion-home .eyebrow,.conversion-home .home-eyebrow { color:var(--accent); font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; }
.conversion-home .upload-section { width:100%; max-width:650px; margin:25px auto 0; }
.conversion-home .upload-box { position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:auto; min-height:195px; margin:0; padding:25px; background:#fff; border:1px dashed #9aa89c; border-radius:12px; box-shadow:none; overflow:hidden; }
.conversion-home .hero .upload-box:not(.has-images) { min-height:195px; background:#fff; border:1px dashed #9aa89c; box-shadow:none; }
.conversion-home .hero .upload-label { position:static; transform:none; width:100%; pointer-events:none; }
.conversion-home .hero .camera-icon { display:none; }
.conversion-home .hero .upload-label p { margin:0; }
.conversion-home .hero .upload-label strong { display:block; font-size:1rem; margin-bottom:12px; }
.conversion-home .hero .upload-box:not(.has-images) .upload-action { display:inline-block; background:var(--ink); color:#fff; padding:13px 24px; border-radius:6px; box-shadow:none; font-size:1rem; }
.conversion-home .upload-hint { display:block; margin-top:12px; font-size:.8rem; color:var(--muted); }
.conversion-home .file-input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; z-index:2; }
.conversion-home .upload-box:focus-within { outline:3px solid var(--accent); outline-offset:3px; }
.conversion-home .trust-points { gap:18px; font-size:.8rem; color:var(--muted); flex-wrap:wrap; }
.conversion-home .busy-message { position:static; height:auto; min-height:0; color:var(--ink); font-size:.95rem; margin:15px auto; }
.conversion-home .busy-message:empty { display:none; }
.conversion-home .busy-message.is-error { padding:15px; background:#fff1e9; border:1px solid #d8aa92; border-radius:6px; color:#762c21; }
.conversion-home .preview-container { position:static; display:grid; grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); gap:10px; width:100%; height:auto; margin:18px 0; }
.photo-selection { min-width:0; background:#fff; border:1px solid var(--line); border-radius:6px; padding:8px; }
.photo-selection img { width:100%; height:100px; object-fit:contain; display:block; }
.photo-selection span { display:block; font-size:.8rem; margin:5px; }
.photo-selection button { background:none; border:0; text-decoration:underline; color:var(--accent); cursor:pointer; padding:8px; }
.conversion-home #compare-button,.conversion-home .result-actions button,.conversion-home .cta-button { background:var(--ink); color:#fff; border:0; border-radius:6px; padding:14px 22px; font:inherit; font-weight:600; cursor:pointer; box-shadow:none; }
.conversion-home [hidden] { display:none!important; }
.conversion-home button:disabled { opacity:.6; cursor:wait; }
.conversion-home .example-section { max-width:1100px; margin:35px auto 75px; padding:35px 24px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:55px; }
.example-section figure { margin:0; }
.example-section img { width:100%; height:auto; border-radius:8px; border:1px solid var(--line); }
.example-section figcaption { font-size:.75rem; line-height:1.5; color:var(--muted); margin-top:10px; }
.simple-steps { padding-left:22px; line-height:1.7; }
.simple-steps li { margin:12px 0; }
.small { font-size:.85rem; color:var(--muted); }
.conversion-home .pricing { max-width:1100px; margin:0 auto; padding:40px 24px; background:none; border:0; box-shadow:none; }
.conversion-home .pricing-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:stretch; }
.conversion-home .pricing-card { width:auto; max-width:none; margin:0; background:#fff; border:1px solid var(--line); border-radius:10px; padding:35px 22px 24px; box-shadow:none; transform:none; display:flex; flex-direction:column; }
.conversion-home .pricing-card:first-child { border:2px solid var(--ink); }
.conversion-home .pricing-card.pro,.conversion-home .pricing-card.premium { background:#fff; box-shadow:none; transform:none; }
.conversion-home .pricing-card .price { font-size:1.9rem; color:var(--ink); }
.conversion-home .pricing-card .cta-button { margin-top:auto; display:block; text-decoration:none; font-size:.9rem; }
.conversion-home .pricing-card ul { flex:1; }
.conversion-home .card-badge { background:#e9ede6; color:var(--ink); box-shadow:none; border-radius:0 0 5px 5px; font-size:.7rem; }
.conversion-home .slider { background:#abb5ad; }
.conversion-home input:checked + .slider { background:var(--ink); }
.conversion-home .faq-section { max-width:800px; margin:50px auto; padding:25px 24px; background:none; border:0; border-radius:0; box-shadow:none; text-align:left; }
.conversion-home .faq-section h2 { text-align:left; margin-bottom:25px; }
.conversion-home details { border-top:1px solid var(--line); padding:0; background:none; }
.conversion-home details:last-child { border-bottom:1px solid var(--line); }
.conversion-home summary { padding:22px 28px 22px 0; cursor:pointer; font-weight:600; line-height:1.5; }
.conversion-home details > div { padding:0 0 22px; line-height:1.75; color:var(--muted); }
.conversion-home .blog-teaser { max-width:1100px; padding:35px 24px; margin:35px auto; }
.conversion-home .blog-card { border:1px solid var(--line); border-radius:8px; box-shadow:none; background:#fff; }
.conversion-home .home-final-cta { max-width:1052px; margin:35px auto; padding:35px; background:#e9ede6; border:0; border-radius:10px; box-shadow:none; }
.conversion-home .home-final-cta a { background:var(--ink); border-radius:6px; color:#fff; }
.conversion-home .home-editorial-footer { background:transparent; border-top:1px solid var(--line); box-shadow:none; }
.conversion-home .result-section { max-width:1100px; margin:0 auto; padding:0 24px; }
.conversion-home .result-section:has(#result:empty) { display:none; }
.conversion-home #result { scroll-margin-top:100px; }
.conversion-home .results-heading { text-align:left; margin:35px 0; }
.conversion-home .results-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; align-items:start; }
.conversion-home .image-result { width:auto; padding:18px; border:1px solid var(--line); background:#fff; border-radius:8px; box-shadow:none; text-align:left; }
.conversion-home .result-image { display:block; width:100%; height:300px; max-height:300px; object-fit:contain; border-radius:5px; }
.result-feedback { padding-left:18px; font-size:.9rem; line-height:1.65; }
.result-feedback li { margin-bottom:10px; }
.result-actions { display:flex; flex-wrap:wrap; align-items:center; gap:15px; margin:25px 0; }
.next-step { background:#e9ede6; padding:25px; border-radius:8px; margin:25px 0 50px; text-align:left; }
.conversion-home .mobile-menu.show { display:block; transform:none; opacity:1; visibility:visible; z-index:1001; }
.conversion-home :focus-visible { outline:3px solid #a54432; outline-offset:4px; }
.no-script { padding:20px; text-align:center; }
@media(max-width:700px) {
 .conversion-home .hero { padding-top:35px; }
 .conversion-home .example-section { grid-template-columns:1fr; gap:25px; margin-bottom:20px; }
 .conversion-home .pricing-cards { grid-template-columns:1fr; }
 .conversion-home .pricing-card { max-width:450px; width:100%; margin:auto; }
 .conversion-home .home-final-cta { margin:20px; padding:25px; }
 .conversion-home .results-grid { grid-template-columns:1fr; }
 .conversion-home .trust-points { gap:8px 16px; }
 .conversion-home .home-section-heading { display:block; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }
.conversion-home .switch { display:inline-flex; align-items:center; position:relative; width:auto; height:auto; padding:8px; }
.conversion-home .switch input { position:static; opacity:1; width:22px; height:22px; margin:0; accent-color:var(--ink); cursor:pointer; }
.conversion-home .switch .slider { display:none; }
.conversion-home .toggle-container { display:flex; align-items:center; justify-content:center; gap:8px; }
/* Homepage foundation; independent of the retired landing-page stylesheet. */
body.conversion-home { margin:0; font-size:16px; line-height:1.5; }
.conversion-home h1,.conversion-home h2,.conversion-home h3 { margin-top:0; }
.conversion-home h3 { font-size:1.2rem; line-height:1.35; }
.conversion-home .site-header { position:sticky; top:0; z-index:100; }
.conversion-home .header-container { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:auto; padding:18px 24px; }
.conversion-home .logo { font-size:1.5rem; text-decoration:none; }
.conversion-home .nav-cta-container,.conversion-home .site-header nav ul { display:flex; align-items:center; gap:24px; }
.conversion-home .site-header nav ul { list-style:none; margin:0; padding:0; font-size:.85rem; gap:20px; }
.conversion-home .site-header nav a { text-decoration:none; }
.conversion-home .site-header nav a:hover { text-decoration:underline; }
.conversion-home .navbar-analyses-counter { display:inline-block; border:1px solid var(--line); padding:4px 10px; border-radius:4px; }
.conversion-home .hamburger { border:0; background:none; color:var(--ink); cursor:pointer; font-size:1.4rem; padding:4px; }
.conversion-home .mobile-menu { display:none; position:fixed; z-index:101; top:76px; right:20px; width:min(340px,calc(100vw - 40px)); max-height:calc(100dvh - 100px); overflow:auto; background:var(--paper); border:1px solid var(--line); border-radius:8px; box-shadow:0 10px 30px #263d351a; padding:22px; }
.conversion-home .mobile-menu ul { list-style:none; padding:0; margin:25px 0 0; }
.conversion-home .mobile-menu li { padding:9px 0; }
.conversion-home .mobile-menu a { color:var(--ink); text-decoration:none; }
.conversion-home .mobile-menu .mobile-auth-only { display:none; }
.conversion-home .menu-close { position:absolute; right:12px; top:8px; font-size:1.7rem; color:var(--ink); border:0; background:none; cursor:pointer; }
.conversion-home .hero { text-align:center; background:none; }
.conversion-home .hero-subheadline { margin:0 auto; }
.conversion-home .trust-points { display:flex; justify-content:center; list-style:none; padding:0; margin:20px 0 0; }
.conversion-home .trust-points li::before { content:'✓'; margin-right:6px; color:var(--ink); }
.conversion-home .selected-photo-count { color:var(--muted); font-size:.85rem; }
.conversion-home .example-section { text-align:left; }
.conversion-home .example-section h2 { margin:10px 0 20px; }
.conversion-home .pricing { text-align:center; }
.conversion-home .pricing-guarantee { max-width:650px; margin:15px auto 25px; color:var(--muted); }
.conversion-home #banner-text { font-size:.85rem; max-width:650px; margin:20px auto 30px; color:var(--muted); }
.conversion-home .pricing-card { position:relative; text-align:left; }
.conversion-home .pricing-card ul { padding-left:18px; font-size:.9rem; color:var(--muted); margin-bottom:25px; }
.conversion-home .pricing-card li { margin-bottom:12px; }
.conversion-home .pricing-card .price { margin:15px 0; font-weight:600; }
.conversion-home .pricing-card .cta-button { text-align:center; }
.conversion-home .card-badge { position:absolute; top:0; right:15px; padding:4px 10px; }
.conversion-home .home-section-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:25px; }
.conversion-home .home-section-heading h2 { margin-bottom:0; }
.conversion-home .home-text-link { font-size:.9rem; white-space:nowrap; }
.conversion-home .blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.conversion-home .blog-card { padding:24px; }
.conversion-home .blog-card a { text-decoration:none; }
.conversion-home .blog-card h3 { margin-bottom:12px; font-size:1.1rem; }
.conversion-home .blog-card p { font-size:.9rem; color:var(--muted); margin:0; }
.conversion-home .home-final-cta { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.conversion-home .home-final-cta h2 { margin:10px 0; }
.conversion-home .home-final-cta p { color:var(--muted); margin:0; }
.conversion-home .home-final-cta a { flex-shrink:0; padding:14px 22px; text-decoration:none; }
.conversion-home .home-editorial-footer { max-width:1100px; margin:auto; padding:35px 24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; }
.conversion-home .home-editorial-footer nav { display:flex; flex-wrap:wrap; gap:16px; font-size:.8rem; }
.conversion-home .home-editorial-footer nav a { color:var(--muted); }
.conversion-home .home-editorial-footer > p { width:100%; font-size:.75rem; color:var(--muted); }
.conversion-home .visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:800px) { .conversion-home .site-header nav { display:none; } }
@media(max-width:700px) {
 .conversion-home .home-section-heading,.conversion-home .home-final-cta { display:block; }
 .conversion-home .home-text-link { display:inline-block; margin-top:15px; }
 .conversion-home .blog-grid { grid-template-columns:1fr; }
 .conversion-home .home-final-cta a { display:inline-block; margin-top:20px; }
 .conversion-home .hero { padding-bottom:15px; }
 .conversion-home .example-section { margin-top:15px; }
}
/* A full-size keyboard-accessible switch, with both billing choices visible. */
.conversion-home .switch { position:relative; width:48px; height:28px; padding:0; }
.conversion-home .switch input { position:absolute; inset:0; width:48px; height:28px; opacity:0; margin:0; z-index:2; }
.conversion-home .switch .slider { display:block; position:absolute; inset:0; background:#8b988d; border-radius:20px; pointer-events:none; }
.conversion-home .switch .slider::before { content:''; position:absolute; width:20px; height:20px; left:4px; top:4px; border-radius:50%; background:white; transition:transform .15s; }
.conversion-home .switch input:checked + .slider { background:var(--ink); }
.conversion-home .switch input:checked + .slider::before { transform:translateX(20px); }
.conversion-home .switch:focus-within { outline:3px solid var(--accent); outline-offset:4px; border-radius:20px; }
/* Selected photos replace the empty picker, in a contained, swipeable review panel. */
.conversion-home .selection-panel { padding:20px; background:#fff; border:1px solid var(--line); border-radius:12px; text-align:left; }
.selection-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.selection-toolbar button { border:0; padding:6px 0; background:none; color:var(--accent); font:inherit; font-size:.85rem; text-decoration:underline; cursor:pointer; }
.conversion-home .selection-panel .preview-container { display:flex; gap:12px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding:5px 0 12px; margin:16px 0 4px; }
.selection-panel .photo-selection { flex:0 0 155px; scroll-snap-align:start; text-align:center; }
.selection-panel .photo-selection img { height:150px; }
.preview-controls { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:.75rem; color:var(--muted); }
.preview-controls button { border:1px solid var(--line); border-radius:5px; background:var(--paper); padding:8px; color:var(--ink); font:inherit; cursor:pointer; }
.conversion-home .preview-controls button:disabled { cursor:default; opacity:.4; }
.conversion-home #compare-button { margin-top:18px; }
/* All rows inherit the tallest card's natural height; no feedback is clipped. */
.conversion-home .results-grid { grid-auto-rows:1fr; align-items:stretch; }
.conversion-home .image-result { display:flex; flex-direction:column; height:100%; min-width:0; }
.conversion-home .image-result > h3 { min-height:2.7em; margin-bottom:12px; }
.conversion-home .result-image { flex-shrink:0; }
.conversion-home .result-score { flex-shrink:0; }
.conversion-home .result-feedback { padding:0; overflow-wrap:anywhere; }
.result-feedback .feedback-headline { font-weight:600; margin:0 0 20px; line-height:1.5; color:var(--ink); }
.result-feedback h4 { margin:20px 0 10px; font-size:.9rem; color:var(--ink); }
.result-feedback ul { margin:0 0 16px; padding-left:19px; }
.result-feedback .feedback-platform { font-size:.85rem; padding-top:14px; border-top:1px solid var(--line); }
@media(max-width:480px) { .preview-controls span { display:none; } .selection-panel .photo-selection { flex-basis:140px; } }
/* The dropdown belongs to its header trigger, not the viewport edge. */
.conversion-home .account-menu-anchor { position:relative; display:flex; align-items:center; }
.conversion-home .account-menu-anchor .mobile-menu { position:absolute; top:calc(100% + 14px); right:0; width:min(320px,calc(100vw - 40px)); text-align:left; }
/* Account forms stay on the page, so selected photos and checkout context survive. */
.auth-dialog { box-sizing:border-box; width:min(480px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow-y:auto; padding:32px; border:1px solid var(--line); border-radius:14px; background:var(--paper); color:var(--ink); font:15px/1.55 Inter,system-ui,sans-serif; box-shadow:0 24px 90px #12231c40; }
.auth-dialog::backdrop { background:#10231cc2; backdrop-filter:blur(3px); }
.auth-dialog:not([open]) { display:none; }
.auth-dialog * { box-sizing:border-box; }
.auth-close { position:absolute; top:10px; right:15px; background:none; border:0; color:var(--ink); font-size:28px; cursor:pointer; padding:0 8px; }
.auth-dialog h2 { font:400 2.1rem/1.15 Georgia,serif; margin:10px 0 15px; letter-spacing:-.025em; padding-right:12px; }
.auth-eyebrow { text-transform:uppercase; color:var(--accent); font-weight:600; font-size:.7rem; letter-spacing:.1em; margin:0; }
#auth-intro { color:var(--muted); margin:0 0 20px; }
#auth-order { background:#e8ede5; border-radius:6px; padding:12px; font-size:.85rem; }
.auth-field { display:block; font-weight:600; margin:14px 0; }
.auth-field input,.auth-field select { display:block; width:100%; padding:12px; margin-top:6px; background:white; border:1px solid #b3c0b6; border-radius:6px; font:400 16px/1.3 Inter,system-ui,sans-serif; color:var(--ink); }
.auth-field input:focus,.auth-field select:focus { outline:2px solid var(--ink); outline-offset:2px; }
.auth-name-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.auth-show-password { display:block; margin:-7px 0 16px auto; border:0; background:none; color:var(--accent); font:inherit; font-size:.8rem; cursor:pointer; }
.auth-submit { width:100%; padding:14px; margin:10px 0; border:0; border-radius:6px; background:var(--ink); color:white; font:600 1rem/1.3 Inter,system-ui,sans-serif; cursor:pointer; }
.auth-terms,.auth-hint { font-size:.75rem; color:var(--muted); }
.auth-dialog a { color:var(--accent); }
.auth-error:not(:empty) { border-left:3px solid #a54432; background:#fff0e9; padding:12px; color:#762c21; font-size:.9rem; }
.auth-notice { font-size:.9rem; }
#auth-links { display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin-top:15px; }
#auth-links button,.auth-fallback button { border:0; padding:0; background:none; color:var(--accent); text-decoration:underline; text-underline-offset:3px; cursor:pointer; font:inherit; font-size:.85rem; text-align:left; }
.auth-fallback { margin:25px 0 0; padding-top:18px; border-top:1px solid var(--line); }
.auth-fallback button { font-size:.75rem; color:var(--muted); }
.auth-dialog button:disabled { opacity:.55; cursor:wait; }
.auth-setup-key { display:block; overflow-wrap:anywhere; padding:12px; background:white; border:1px solid var(--line); }
@media(max-width:480px) { .auth-dialog { padding:26px 22px; } .auth-dialog h2 { font-size:1.9rem; } }
