/* Homepage-only presentation; embedded creators keep their existing layout. */
.home-page { background:#fffdf8; --muted:#655e56; --ink:#182e35; }
.home-page .skip-link { position:absolute; left:16px; top:-100px; z-index:20; padding:12px 20px; background:white; color:var(--ink); }
.home-page .skip-link:focus { top:12px; }
.home-announcement { background:#153e47; color:#fffdf8; text-align:center; padding:10px 20px; font-size:14px; }
.home-page .site-header { max-width:1240px; width:calc(100% - 64px); padding:20px 0; gap:22px; }
.home-page .brand-logo { width:52px; height:52px; flex-basis:52px; }
.home-page .brand strong { font-size:22px; }
.home-page .brand small { font-size:12px; letter-spacing:.06em; }
.home-page .discovery-nav { align-items:center; gap:24px; font-size:14px; }
.home-page .discovery-nav a { color:var(--ink); text-decoration:none; }
.home-page .discovery-nav a:hover { text-decoration:underline; text-underline-offset:5px; }
.home-page .discovery-nav .nav-create { padding:12px 18px; background:#153e47; color:white; border-radius:8px; }
.home-page .language-switch { margin:0; }
.home-page .language-switch>span { display:none; }
.home-page .language-switch select { font-size:14px; padding:10px; }
.home-page .hero { width:min(1240px,calc(100% - 64px)); padding:44px 48px; min-height:530px; border:0; border-radius:20px; box-shadow:none; background:#f4ecdc; gap:35px; grid-template-columns:1fr 1fr; }
.home-page .hero h1 { font-size:clamp(42px,4.7vw,66px); line-height:1.08; letter-spacing:-.045em; }
.home-page .hero h1 em { margin-top:2px; color:#c84c21; font-style:normal; }
html[lang="ja"] .home-page .hero h1 { font-size:clamp(32px,4.1vw,58px); line-height:1.35; letter-spacing:-.03em; }
.home-page .hero-description { font-size:18px; line-height:1.7; margin:22px 0 24px; max-width:470px; }
.home-page .eyebrow { font-size:12px; color:#9d3b19; letter-spacing:.13em; line-height:1.6; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:20px; }
.home-page .hero-cta { margin:0; background:#c84c21; min-height:52px; border-radius:8px; font-size:16px; box-shadow:none; font-weight:750; padding:14px 24px; }
.home-page .hero-cta:hover { background:#a93914; transform:translateY(-2px); box-shadow:none; }
.hero-browse { color:var(--ink); font-size:15px; font-weight:700; text-underline-offset:5px; }
.hero-free-note { margin:16px 0 24px; font-size:14px; line-height:1.6; color:#4b5554; }
.hero-proof { display:flex; flex-wrap:wrap; gap:12px 20px; font-size:14px; color:#394b4e; }
.hero-proof span::before { content:'✓'; margin-right:6px; }
.hero-story { position:relative; display:grid; grid-template-columns:36% 64%; align-items:center; min-width:0; padding:0 0 38px; }
.hero-story figure { margin:0; }
.story-photo { background:#fffdf8; padding:10px; border-radius:6px; transform:rotate(-7deg); z-index:1; box-shadow:0 10px 22px #172e3517; }
.story-photo img { width:100%; height:auto; aspect-ratio:1; display:block; object-fit:cover; border-radius:3px; }
.story-photo figcaption { text-align:center; padding-top:10px; font-size:14px; font-weight:700; }
.story-badge { margin-left:-5%!important; }
.story-badge img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; filter:drop-shadow(0 12px 9px #182e3520); }
.story-badge figcaption { text-align:center; font:italic 20px Georgia,serif; padding-top:8px; }
.story-caption { position:absolute; margin:0; bottom:0; left:0; right:0; text-align:center; font-size:14px; color:#655e56; }
.home-assurances { display:flex; justify-content:center; gap:44px; padding:24px; color:#394b4e; font-size:14px; border-bottom:1px solid var(--line); }
.home-page .discovery-section,.home-page .examples-section,.home-how,.home-order-info,.home-faq { width:min(1180px,calc(100% - 64px)); margin:76px auto; scroll-margin-top:24px; }
.home-section-heading { display:flex; align-items:end; justify-content:space-between; gap:32px; margin-bottom:28px; }
.home-section-heading>p { max-width:320px; color:var(--muted); font-size:16px; line-height:1.7; margin:0; }
.home-page h2 { font-family:Georgia,serif; font-size:clamp(30px,3.2vw,44px); line-height:1.16; letter-spacing:-.03em; margin:6px 0 0; }
.home-page .product-grid { gap:22px; margin:0; }
.home-page .product-entry { display:block; padding:0; border:1px solid #dedbd3; border-radius:12px; overflow:hidden; background:white; }
.home-page .product-entry:hover { outline:none; }
.product-image-link { display:block; background:#f3f0eb; overflow:hidden; }
.product-image-link img { width:100%; height:auto; aspect-ratio:1.13; object-fit:cover; display:block; transition:transform .25s; }
.product-image-link:hover img { transform:scale(1.035); }
.home-page .product-entry:last-child .product-image-link img { object-fit:contain; background:white; }
.product-copy { padding:23px; }
.product-title-row { display:flex; gap:10px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.home-page .product-entry h3 { font:700 27px Georgia,serif; margin:0; }
.home-price { color:#36565a; font-size:14px; font-weight:650; }
.home-page .product-entry p { font-size:16px; line-height:1.65; margin:14px 0 20px; color:var(--muted); }
.home-page .entry-link { display:block; font-size:16px; color:#153e47; text-underline-offset:5px; }
.home-product-details { display:block; margin-top:14px; font-size:14px; color:#655e56; text-underline-offset:3px; }
.home-small-print { font-size:14px; line-height:1.7; color:#655e56; margin:20px 0 0; max-width:100%!important; }
.home-how { padding:38px; border-radius:16px; background:#153e47; color:white; }
.home-how .eyebrow { color:#f0b48b; }
.home-how .secondary-button { color:white; background:transparent; border-color:#ffffff70; }
.home-steps { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; margin:26px 0 0; padding:0; }
.home-steps li { border-top:1px solid #ffffff40; padding-top:20px; }
.home-step-number { color:#f0b48b; font:24px Georgia,serif; }
.home-steps h3 { font-size:20px; margin:16px 0 12px; }
.home-steps p { color:#e1e7e3; font-size:16px; line-height:1.7; margin:0; }
.home-page .examples-heading h2 { font-size:clamp(30px,3.2vw,44px); }
.home-page .examples-heading p:last-child { font-size:16px; }
.home-page .examples-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.home-page .example-card { border-radius:12px; box-shadow:none; border:1px solid var(--line); padding:12px; background:white; }
.home-page .example-pair { gap:10px; }
.home-page .example-stage { border-radius:7px; padding:8px; background:#f6f2e9; }
.home-page .example-stage img { width:100%; aspect-ratio:1; height:auto; object-fit:contain; padding:0; border-radius:4px; }
.home-page .example-stage-label { position:static; display:block; padding:0; background:transparent; text-align:center; font-size:12px; color:#4d5553; margin:0 0 8px; }
.home-page .example-card figcaption { padding:16px 5px 5px; gap:6px; }
.home-page .example-card figcaption strong { font-size:20px; }
.home-page .example-card figcaption span { font-size:14px; }
.home-page .theme-grid { gap:18px; }
.home-page .theme-entry { padding:18px; border-radius:12px; background:#f4ecdc; border:0; }
.home-page .theme-entry:nth-child(2) { background:#fcebe9; }
.home-page .theme-entry:nth-child(3) { background:#193444; color:white; }
.home-page .theme-entry:nth-child(4) { background:#e6ece2; }
.theme-entry img { display:block; width:100%; aspect-ratio:1; height:auto; object-fit:contain; margin-bottom:20px; }
.home-page .theme-entry h3 { font-size:19px; }
.home-page .theme-entry p { font-size:15px; line-height:1.6; }
.home-order-info { display:grid; grid-template-columns:.85fr 1.15fr; gap:65px; padding:42px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.home-order-info>div>p:last-child { font-size:17px; line-height:1.7; color:var(--muted); }
.home-info-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.home-info-grid h3 { font-size:18px; margin:0 0 12px; }
.home-info-grid p { font-size:15px; line-height:1.7; color:var(--muted); margin:0 0 12px; }
.home-info-grid a,.home-faq a { color:var(--blue-dark); font-size:15px; text-underline-offset:5px; font-weight:650; }
.home-faq details { border-bottom:1px solid var(--line); padding:20px 0; }
.home-faq details:first-of-type { border-top:1px solid var(--line); }
.home-faq summary { cursor:pointer; font-weight:650; font-size:18px; line-height:1.6; }
.home-faq details p { font-size:16px; line-height:1.8; color:var(--muted); max-width:820px; }
.home-page .creator-section { width:min(1180px,calc(100% - 64px)); margin:76px auto; }
.home-page .section-heading { max-width:760px; margin-bottom:30px; }
.home-page .creator-card,.home-page .result-card { border-radius:16px; box-shadow:none; }
.home-page .template-card-content small,.home-page .template-note { font-size:14px; }
.home-page .template-card-content { min-height:120px; }
.home-page .support-footer { width:min(1180px,calc(100% - 64px)); }
.home-page .brand:focus-visible,.home-page a:focus-visible,.home-page summary:focus-visible { outline:3px solid #c84c21; outline-offset:4px; }
@media(max-width:1100px) { .home-page .site-header { flex-wrap:wrap; gap:14px; } .home-page .discovery-nav { order:3; width:100%; justify-content:space-between; margin:0; } .home-page .language-switch { margin-left:auto; } .home-page .hero { padding:34px; } .home-price { width:100%; } }
@media(max-width:760px) { .home-page .site-header,.home-page .hero,.home-page .discovery-section,.home-page .examples-section,.home-how,.home-order-info,.home-faq,.home-page .creator-section,.home-page .support-footer { width:calc(100% - 36px); } .home-page .hero { grid-template-columns:1fr; padding:28px; gap:26px; } .home-page .hero h1 { font-size:46px; } .hero-story { max-width:480px; width:100%; margin:auto; } .home-assurances { flex-wrap:wrap; gap:12px 24px; padding:20px 18px; } .home-section-heading,.home-page .examples-heading { display:block; } .home-section-heading>p { max-width:100%; margin-top:16px; } .home-section-heading>a,.home-page .examples-heading>a { display:inline-flex; margin-top:18px; } .home-page .product-grid { grid-template-columns:1fr; } .product-image-link img { aspect-ratio:1.35; } .home-price { width:auto; } .home-steps { grid-template-columns:1fr; gap:24px; } .home-how { padding:28px; } .home-page .examples-grid { grid-template-columns:1fr; } .home-page .example-pair { gap:14px; } .home-page .theme-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .home-page .theme-entry { padding:14px; } .home-page .theme-entry h3 { font-size:18px; line-height:1.4; } .home-page .theme-entry p { font-size:14px; } .home-order-info { grid-template-columns:1fr; gap:28px; } .home-page .discovery-section,.home-page .examples-section,.home-how,.home-order-info,.home-faq,.home-page .creator-section { margin-top:48px; margin-bottom:48px; } }
@media(max-width:400px) { .home-page .brand strong { font-size:19px; } .home-page .brand small { font-size:11px; } .home-page .brand-logo { width:42px; height:42px; flex-basis:42px; } .home-page .brand { gap:8px; } .home-page .discovery-nav { gap:12px; font-size:13px; } .home-page .discovery-nav .nav-create { padding:10px; } .home-page .hero { padding:22px; } .home-page .hero h1 { font-size:40px; } .home-info-grid { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .home-page * { transition:none!important; } html { scroll-behavior:auto; } }
@media(max-width:600px) { .home-page .brand small { display:none; } .home-page .discovery-nav { gap:12px; font-size:13px; } .home-page .discovery-nav .nav-create { padding:10px 12px; } html[lang="ja"] .home-page .hero h1 { font-size:32px; } }
@media(max-width:600px) {
 .home-page .hero { display:flex; flex-direction:column; align-items:stretch; gap:16px; }
 .hero-copy { display:contents; }
 .hero-copy .eyebrow { order:0; margin:0; }
 .home-page .hero h1 { order:1; font-size:40px; }
 .hero-story { order:2; max-width:300px; padding-bottom:24px; }
 .story-badge figcaption { font-size:16px; }
 .story-photo figcaption,.story-caption { font-size:12px; }
 .home-page .hero-description { order:3; font-size:16px; line-height:1.65; margin:0; }
 .hero-actions { order:4; }
 .home-page .hero-cta { width:100%; }
 .hero-browse,.hero-proof { display:none; }
 .hero-free-note { order:5; margin:0; }
}