/* Shared LP presentation; the story page keeps its illustrated identity. */
.refined {
  --ink: #213b3a;
  --muted: #5b6d70;
  --blue: #097597;
  --green-dark: #008c3e;
  --line: #dce6e5;
  --shadow: 0 10px 28px #213b3a08;
  --shadow-strong: 0 18px 36px #213b3a18;
  --gutter: max(24px, calc((100% - 1120px) / 2));
  background: #fff;
  font-family: "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0;
  -webkit-text-size-adjust: 100%;
}
.refined *, .refined *::before, .refined *::after { letter-spacing: 0; }
.refined :is(h1,h2,h3,p) { overflow-wrap: break-word; line-break: strict; }
.refined :is(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid #e2b724; outline-offset: 5px; }
.refined :is(section,details)[id] { scroll-margin-top: 100px; }
.refined .phrase { display: inline-block; max-width: 100%; }
.refined .nav { padding: 16px var(--gutter); min-height: 80px; background: #ffffffed; border-bottom: 1px solid var(--line); box-shadow: none; gap: 24px; }
.refined .logo { flex-shrink: 0; }
.refined .logo img { width: 154px; }
.refined .nav nav { gap: 4px; }
.refined .nav nav a { color: var(--ink); font-weight: 600; font-size: .875rem; border-radius: 4px; padding: 8px 10px; }
.refined .nav nav a:hover { background: #eff7f8; transform: none; }
.refined .nav .nav-cta { background: #008c3e; color: #fff; box-shadow: none; padding-inline: 18px; }
.refined .nav .nav-juku { background: none; color: var(--blue); }
.juku-page .nav .nav-cta { background: var(--blue); }
.refined .hero, .refined .juku-hero {
  display: flex; flex-direction: column; gap: 24px; min-height: 0;
  padding: 32px var(--gutter) 28px; background: #f0f8fa;
}
.refined .hero-copy, .refined .juku-hero-copy { width: 100%; text-align: center; }
.refined .kicker { display: block; min-height: 0; border: 0; border-radius: 0; padding: 0; margin: 0 0 14px; background: none; box-shadow: none; color: var(--blue); font-size: .875rem; font-weight: 700; line-height: 1.7; }
.refined .hero-brand { display: flex; justify-content: center; align-items: center; gap: 14px; margin: 0 0 14px; font-size: 1.75rem; font-weight: 800; line-height: 1.4; }
.refined .hero-brand span { font-size: .875rem; font-weight: 600; padding-left: 14px; border-left: 1px solid #a8c5cd; }
.refined .hero h1, .refined .juku-hero h1 { max-width: none; margin: 0; font-size: 3rem; line-height: 1.5; font-weight: 800; text-wrap: initial; }
.refined h1 .phrase { display: inline-block; }
.refined .accent { color: var(--blue); }
.refined .lead { max-width: 700px; margin: 20px auto 0; font-size: 1rem; font-weight: 400; line-height: 1.9; text-wrap: pretty; }
.refined .actions { justify-content: center; gap: 12px; margin-top: 24px; }
.refined .primary, .refined .secondary { border-radius: 6px; min-height: 52px; font-size: .9375rem; font-weight: 700; padding: 13px 24px; box-shadow: none; }
.refined .primary { border: 1px solid #008c3e; background: #008c3e; }
.refined .secondary { border: 1px solid #a8bdbf; background: #fff; color: var(--ink); }
.refined .primary:hover { background: #007634; box-shadow: none; transform: translateY(-2px); }
.refined .secondary:hover { background: #e8f3f5; transform: translateY(-2px); }
.refined .line-button { display: inline-flex; width: auto; min-height: 60px; gap: 14px; border-radius: 6px; background: #008c3e; padding: 10px 18px; box-shadow: none; }
.refined .line-button strong { font-size: 1rem; line-height: 1.4; }
.refined .line-button small { font-size: .8125rem; font-weight: 400; color: #fff; line-height: 1.5; }
.refined .line-icon { width: 36px; height: 36px; border-radius: 6px; color: #008c3e; }
.refined .cta-arrow { background: none; }
.refined .business-cta { background: var(--blue); border-color: var(--blue); }
.refined .business-cta:hover { background: #075b75; }
.refined .hero-note { margin: 12px 0 0; color: var(--muted); font-size: .8125rem; }
.refined .proof, .refined .juku-proof { display: none; justify-content: center; gap: 0; margin: 24px auto 0; }
.refined .proof div, .refined .juku-proof div { flex: 0 1 235px; border: 0; border-right: 1px solid #cddfe2; border-radius: 0; background: none; box-shadow: none; padding: 0 20px; }
.refined :is(.proof,.juku-proof) div:last-child { border: 0; }
.refined :is(.proof,.juku-proof) div::before { display: none; }
.refined .proof strong, .refined .juku-proof strong { font-size: 1rem; color: var(--ink); font-weight: 700; }
.refined .proof span, .refined .juku-proof span { font-size: .8125rem; font-weight: 400; }
.refined .hero-visual, .refined .juku-hero-visual { position: relative; width: 100%; max-width: 590px; min-height: 0; margin: 0 auto; padding: 0 110px 0 24px; }
.refined .ipad-frame { border-radius: 22px; padding: 13px; background: #263636; box-shadow: var(--shadow-strong); transform: none; }
.refined .ipad-frame::before { border-radius: 16px; inset: 5px; }
.refined .ipad-camera { width: 5px; height: 5px; top: 5px; }
.refined .ipad-screen { border-radius: 10px; aspect-ratio: 2270 / 1422; }
.refined .ipad-screen img { object-fit: contain; }
.refined .hero-ipad { position: relative; inset: auto; }
.refined .mascot, .refined .juku-mascot { width: 145px; right: 0; bottom: 24px; filter: drop-shadow(0 8px 5px #213b3a0b); }
.refined .bubble { position: relative; left: auto; right: auto; bottom: auto; width: auto; margin: 12px 0 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; text-align: center; }
.refined .bubble span { color: var(--muted); font-size: .8125rem; font-weight: 400; }
.refined .bubble strong { font-size: .9375rem; margin-top: 2px; font-weight: 600; }
.refined .notice, .refined .juku-strip { padding: 20px var(--gutter); color: var(--ink); background: #fff2b3; border: 0; gap: 24px; }
.refined .notice p, .refined .juku-strip p { font-size: .9375rem; font-weight: 600; }
.refined .juku-strip a { background: none; border-radius: 0; padding: 4px 0; color: var(--ink); border-bottom: 1px solid currentColor; font-size: .875rem; font-weight: 700; }
.refined :is(.section,.demo,.final-cta,.line) { padding: 88px var(--gutter); }
.refined :is(.section,.demo,.final-cta,.line) h2 { max-width: none; font-size: 2rem; font-weight: 700; line-height: 1.65; text-wrap: pretty; }
.refined .heading { max-width: none; }
.refined .heading > p:not(.kicker) { margin-top: 20px; max-width: 760px; font-size: 1rem; line-height: 1.9; }
.refined .problems, .refined .juku-section { background: #fff; }
.refined .cards, .refined .scenario-grid { gap: 24px; }
.refined .cards article, .refined .scenario-grid article { background: #f5f8f8; border: 0; border-radius: 6px; box-shadow: none; padding: 28px; }
.refined .cards article:hover { transform: none; box-shadow: none; }
.refined .cards span, .refined .scenario-grid span { color: var(--blue); font-size: .875rem; font-weight: 700; }
.refined :is(.cards,.scenario-grid,.value-list) h3 { margin: 14px 0 12px; font-size: 1.125rem; font-weight: 700; line-height: 1.7; }
.refined :is(.cards,.scenario-grid,.value-list,.faq-list) p { font-size: 1rem; line-height: 1.9; font-weight: 400; }
.refined .scenario-grid li { font-size: .875rem; font-weight: 500; line-height: 1.85; }
.refined .scenario-grid ul { padding-top: 18px; border-top: 1px solid var(--line); }
.refined .features, .refined .juku-value { background: #f0f8fa; }
.refined .features .cards article { border: 0; border-top: 2px solid #50b7d3; background: none; border-radius: 0; padding: 22px 0 0; }
.refined .features .cards article:nth-child(2) { border-color: #ddbd42; }
.refined .features .cards article:nth-child(3) { border-color: #df819a; }
.refined .features .cards h3 { color: var(--ink); }
.refined .story-teaser { background: #fff; border: 0; gap: 64px; grid-template-columns: minmax(0,1fr) minmax(0,360px); }
.refined .story-teaser-image { border: 0; border-radius: 6px; box-shadow: none; }
.refined .flow, .refined .juku-flow { background: #fff; border-block: 1px solid var(--line); }
.refined .steps { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0; margin-top: 40px; }
.refined .steps article { background: none; border: 0; border-left: 1px solid var(--line); border-radius: 0; box-shadow: none; padding: 0 20px; min-height: 0; }
.refined .steps article:first-child { padding-left: 0; border: 0; }
.refined .steps article:last-child { padding-right: 0; }
.refined .steps article::after { display: none; }
.refined .steps span { width: 38px; height: 38px; background: #e3f1f5; color: var(--blue); border-radius: 6px; box-shadow: none; font-size: .875rem; }
.refined .steps h3 { margin: 18px 0 10px; font-size: 1rem; font-weight: 700; line-height: 1.6; }
.refined .steps p { font-size: .9375rem; line-height: 1.9; }
.refined .demo { background: #f0f8fa; gap: 40px; }
.refined .demo-ipad { max-width: 860px; }
.refined .line { background: #e8f4ee; }
.refined .line-card { max-width: 1120px; border: 0; border-radius: 0; background: none; box-shadow: none; padding: 0; gap: 24px; color: var(--ink); }
.refined .line-card h2 { color: var(--ink); }
.refined .line-card p, .refined .line-card small { color: var(--muted); }
.refined .line-steps { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.refined .line-steps div { background: none; border: 0; border-top: 1px solid #bdd8cc; border-radius: 0; padding: 20px 0; font-weight: 600; }
.refined .line-steps span { border-radius: 0; background: none; color: #338364; box-shadow: none; font-size: 1.5rem; font-weight: 500; }
.refined .price { background: #fff; gap: 32px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.refined .price > * { min-width: 0; }
.refined .price-card, .refined .corp-card { border: 1px solid var(--line); border-radius: 6px; background: #fff; box-shadow: none; padding: 32px; }
.refined .price-card { border-top: 3px solid #008c3e; }
.refined .price-card strong { font-size: 3.5rem; margin: 24px 0; font-weight: 700; }
.refined .trust { background: #f6f8f8; }
.refined .trust-grid { gap: 32px; }
.refined .trust-grid article { border: 0; border-top: 1px solid #bbcfd0; border-radius: 0; background: none; box-shadow: none; padding: 24px 0 0; }
.refined .trust-grid h3 { font-size: 1.125rem; font-weight: 700; }
.refined .trust-grid span { font-size: .875rem; color: var(--blue); }
.refined .faq { background: #fff; }
.refined .faq-list { max-width: none; gap: 0; }
.refined .faq-list article { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; padding: 24px 0; }
.refined .faq-list h3 { font-weight: 700; font-size: 1rem; }
.refined .faq-list h3::before { content: "Q."; margin-right: 14px; color: var(--blue); }
.refined .final-cta { grid-template-columns: 150px minmax(0,1fr); gap: 44px; background: #e8f4ee; color: var(--ink); }
.refined .final-cta h2 { color: var(--ink); margin-bottom: 24px; }
.refined .final-cta .kicker { color: #008c3e; background: none; }
.refined .final-cta img { max-height: 170px; filter: none; }
.refined .site-footer { padding: 48px var(--gutter) 28px; background: #213b3a; }
.refined .footer-main { grid-template-columns: 180px minmax(0,620px); gap: 32px; }
.refined .footer-main p, .refined .footer-links a { font-size: .875rem; font-weight: 400; }
.refined .footer-links { gap: 8px 24px; }
.refined .footer-bottom { font-weight: 400; font-size: .8125rem; }
.refined .value-layout { gap: 56px; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); margin-top: 40px; }
.refined .value-list { gap: 0; }
.refined .value-list article { border: 0; border-bottom: 1px solid #cbdfe4; border-radius: 0; background: none; box-shadow: none; padding: 24px 0; }
.refined .value-list strong { background: none; color: var(--blue); width: auto; height: auto; font-size: .875rem; }
.refined .value-list h3 { margin-top: 4px; }
.refined .juku-report { background: #f8f9f5; grid-template-columns: minmax(0,1fr) minmax(0,340px); }
.refined .juku-report h2 .phrase { display: block; }
.refined .phone-preview { box-shadow: var(--shadow-strong); }
.refined .juku-fit { background: #fff; }
.refined .fit-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 32px; }
.refined .fit-list div { min-height: 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; padding: 20px 0; font-size: 1rem; font-weight: 500; }
.refined .fit-list div::before { content: "✓"; color: var(--blue); margin-right: 12px; }
.juku-page .line { background: #eaf4f7; }
.juku-page .line-steps div { border-color: #bdd9e1; }
.juku-page .line-steps span { color: var(--blue); }
.refined .contact-toggle { border: 1px solid #b7cdd3; border-radius: 6px; box-shadow: none; }
.refined .contact-toggle > summary { min-height: 80px; padding: 22px 28px; }
.refined .contact-toggle summary strong { font-size: 1.125rem; font-weight: 700; }
.refined .toggle-icon { border-radius: 6px; box-shadow: none; }
.refined .juku-contact-form { gap: 24px; padding: 28px; }
.refined .form-head h3 { font-size: 1.25rem; font-weight: 700; }
.refined .form-head p { font-weight: 400; }
.refined .form-section { border: 0; border-radius: 0; background: none; padding: 18px 0; }
.refined .form-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.refined .juku-contact-form label { font-weight: 600; }
.refined .juku-contact-form :is(input,select,textarea):not([type=checkbox]):not([type=radio]) { border-radius: 4px; font-size: 1rem; font-weight: 400; }
.refined .juku-contact-form :is(input,textarea)::placeholder { color: #7b898d; }
.refined .required-badge { border-radius: 3px; font-size: .75rem; font-weight: 600; }
.refined .optional-fields { display: block; border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; background: none; padding: 0; }
.refined .optional-fields summary { padding: 20px 0; min-height: 60px; font-size: .9375rem; }
.refined .optional-fields summary small { font-size: .875rem; font-weight: 400; }
.refined .optional-fields[open] .optional-summary-text::before { font-size: 1rem; }
.refined .juku-contact-form .consent-check, .refined .juku-contact-form .checkbox-group label { display: flex; align-items: flex-start; border: 0; border-radius: 0; padding: 8px 0; background: none; font-weight: 400; }
.refined .consent-check input { margin: 3px 0 0; }
.refined .form-actions small { font-size: .875rem; font-weight: 400; }
.refined .form-status { font-weight: 500; }
@media (max-width: 1100px) {
  .refined .nav { flex-wrap: wrap; justify-content: center; gap: 10px 24px; }
  .refined .nav nav { justify-content: center; }
  .refined .scenario-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
  .refined .scenario-grid article { padding: 22px; }
  .refined .hero h1, .refined .juku-hero h1 { font-size: 2.625rem; }
  .refined .steps article { padding-inline: 14px; }
}
@media (max-width: 800px) {
  .refined { --gutter: 24px; }
  .refined .nav { position: relative; justify-content: space-between; }
  .refined .nav nav { width: 100%; justify-content: flex-start; gap: 0; }
  .refined .nav nav a { padding: 8px 10px; }
  .refined .hero, .refined .juku-hero { padding-top: 36px; }
  .refined .hero h1, .refined .juku-hero h1 { font-size: 2.25rem; }
  .refined :is(.section,.demo,.line,.final-cta) { padding-block: 64px; }
  .refined :is(.section,.demo,.line,.final-cta) h2 { font-size: 1.75rem; }
  .refined .scenario-grid, .refined .three { grid-template-columns: 1fr; gap: 16px; }
  .refined .cards article, .refined .scenario-grid article { padding: 24px; }
  .refined .story-teaser, .refined .value-layout, .refined .juku-report { grid-template-columns: 1fr; gap: 32px; }
  .refined .story-teaser-image { max-width: 360px; }
  .refined .steps { grid-template-columns: 1fr; margin-top: 24px; }
  .refined .steps article, .refined .steps article:first-child { display: grid; grid-template-columns: 40px minmax(0,1fr); column-gap: 18px; padding: 22px 0; border: 0; border-bottom: 1px solid var(--line); }
  .refined .steps span { grid-column: 1; grid-row: 1 / 3; }
  .refined .steps h3 { margin: 4px 0 8px; }
  .refined .steps p { grid-column: 2; }
  .refined .trust-grid { grid-template-columns: 1fr; }
  .refined .price { grid-template-columns: minmax(0,1fr); }
  .refined .line-steps { grid-template-columns: 1fr; gap: 0; }
  .refined .line-steps div { padding: 12px 0; }
  .refined .footer-main { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
  .refined { --gutter: 20px; }
  .refined .nav { padding-block: 12px; flex-direction: row; gap: 8px; }
  .refined .logo img { width: 122px; }
  .refined .nav nav { gap: 0 4px; }
  .refined .nav nav a { font-size: .8125rem; min-height: 40px; padding: 6px; }
  .refined .nav .nav-cta { position: absolute; top: 14px; right: 20px; padding-inline: 10px; }
  .refined .nav nav a[href="#faq"], .juku-page .nav nav a[href="#pilot"] { display: none; }
  .refined .hero, .refined .juku-hero { gap: 24px; padding-block: 28px; }
  .refined .kicker { font-size: .8125rem; }
  .refined .hero-brand { font-size: 1.5rem; margin-bottom: 16px; }
  .refined .hero h1, .refined .juku-hero h1 { font-size: 1.75rem; line-height: 1.65; }
  .refined .juku-hero h1 { font-size: 1.5rem; }
  .refined .hero h1 .phrase, .refined .juku-hero h1 .phrase { display: block; }
  .refined .lead { text-align: left; margin-top: 18px; font-size: 1rem; }
  .refined .desktop-break { display: none; }
  .refined .actions { gap: 10px; margin-top: 20px; }
  .refined .actions .primary { width: 100%; }
  .refined .actions .secondary { width: auto; min-height: 40px; border: 0; border-bottom: 1px solid #a8bdbf; border-radius: 0; padding: 6px 0; background: none; }
  .refined .hero-note { font-size: .8125rem; }
  .refined .proof, .refined .juku-proof { display: none; }
  .refined :is(.proof,.juku-proof) div { padding-inline: 8px; }
  .refined :is(.proof,.juku-proof) strong { font-size: .875rem; }
  .refined :is(.proof,.juku-proof) span { font-size: .75rem; }
  .refined .hero-visual, .refined .juku-hero-visual { padding: 0 32px 0 0; }
  .refined .mascot, .refined .juku-mascot { width: 74px; right: -4px; bottom: 44px; }
  .refined .ipad-frame { padding: 10px; border-radius: 17px; }
  .refined .ipad-screen { border-radius: 8px; }
  .refined .bubble { margin-top: 12px; }
  .refined .bubble span { font-size: .75rem; }
  .refined .bubble strong { font-size: .8125rem; }
  .refined .notice, .refined .juku-strip { flex-direction: column; align-items: flex-start; gap: 12px; padding-block: 20px; }
  .refined .notice .line-button { width: auto; }
  .refined .juku-strip a { width: auto; }
  .refined :is(.section,.demo,.line,.final-cta) { padding-block: 48px; }
  .refined :is(.section,.demo,.line,.final-cta) h2 { font-size: 1.5rem; line-height: 1.7; }
  .refined .cards article, .refined .scenario-grid article { padding: 22px; }
  .refined .price-card, .refined .corp-card { padding: 24px; }
  .refined .price-card strong { font-size: 3rem; }
  .refined .fit-list, .refined .form-grid { grid-template-columns: 1fr; }
  .refined .contact-toggle > summary { padding: 20px; gap: 12px; }
  .refined .contact-toggle summary strong { font-size: 1rem; }
  .refined .toggle-icon { width: 32px; height: 32px; }
  .refined .juku-contact-form { padding: 20px; }
  .refined .optional-fields summary { align-items: flex-start; flex-direction: column; }
  .refined .form-actions .primary { width: 100%; }
  .refined .final-cta { grid-template-columns: 1fr; gap: 24px; }
  .refined .final-cta img { max-height: 100px; justify-self: center; }
  .refined .footer-links a { white-space: normal; }
}
@media (max-width: 360px) {
  .refined { --gutter: 16px; }
  .refined .hero h1, .refined .juku-hero h1 { font-size: 1.5rem; }
  .refined .juku-hero h1 { font-size: 1.375rem; }
  .refined .price-card strong { font-size: 2.5rem; }
  .refined :is(.section,.demo,.line,.final-cta) h2 { font-size: 1.375rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .refined * { transition: none !important; }
}