.public-page {
 --bg:#F5F7F8; --surface:#FFFFFF; --ink:#16212A; --text-2:#4A5660; --text-3:#66727C;
 --navy:#123A4C; --navy-50:#EAF0F3; --teal-700:#0B6E77; --teal-50:#EAF7F8;
 --control-border:#7A848B; --line:#E9EDEF; --muted:var(--text-2);
 --shadow-1:0 1px 2px rgba(22,33,42,.06),0 1px 3px rgba(22,33,42,.08);
 --shadow-2:0 4px 12px rgba(22,33,42,.08),0 2px 4px rgba(22,33,42,.05);
 color:var(--ink); background:var(--bg); font-size:16px;
}
.public-page h1,.public-page h2,.public-page h3 {letter-spacing:.01em;font-feature-settings:"palt";color:var(--navy);}
.public-page h1 {font-size:34px;line-height:1.5;text-wrap:balance;}
.public-page h2 {font-size:28px;line-height:1.5;}
.public-page h3 {font-size:18px;font-weight:700;}
.public-page p {word-break:normal;text-wrap:wrap;}
.public-page .button,.public-page button {border-radius:12px;}
.public-page .primary {min-height:52px;gap:0;padding-inline:32px;}
.public-header,.public-main,.public-footer {width:min(1080px,calc(100% - 48px));margin-inline:auto;}
.public-header {display:flex;justify-content:space-between;align-items:center;min-height:88px;gap:16px;}
.public-brand {display:inline-flex;align-items:center;min-height:44px;}
.public-brand img {width:152px;height:auto;object-fit:contain;}
.public-header nav {display:flex;gap:24px;}
.public-header nav a,.public-text-link,.public-footer nav a,.public-alternative a {display:inline-flex;align-items:center;min-height:44px;min-width:44px;color:var(--navy);font-size:15px;}
.public-header a:hover,.public-text-link:hover,.public-footer a:hover,.public-alternative a:hover {text-decoration:underline;}
.public-intro {display:grid;grid-template-columns:minmax(0,1fr);padding:48px 0;gap:24px;}
.public-intro h1 {max-width:960px;margin-bottom:24px;}
.public-eyebrow {font-size:13px;letter-spacing:.02em;color:var(--text-2);margin-bottom:12px;}
.public-lead {color:var(--text-2);line-height:1.8;margin:0;}
.public-trial-note {font-size:13px;letter-spacing:.02em;color:var(--text-3);margin:12px 0 0;}
.public-alternative {display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin-top:12px;font-size:13px;letter-spacing:.02em;color:var(--text-3);}
.public-intro.has-example {grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);column-gap:48px;align-items:start;}
.public-intro.has-example .public-intro-copy {grid-column:1;grid-row:1;align-self:end;}
.public-intro.has-example h1 {font-size:32px;}
.public-intro.has-example .desktop-break {display:none;}
.public-intro.has-example .public-intro-actions {grid-column:1;grid-row:2;}
.public-intro.has-example #featured-example {grid-column:2;grid-row:1 / 3;}
.public-section {padding:48px 0;scroll-margin-top:24px;}
.public-section-heading {margin-bottom:24px;}
.public-section-heading h2 {margin:0;}
.public-three-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.public-card {background:var(--surface);border-radius:16px;box-shadow:var(--shadow-1);padding:24px;min-width:0;}
.public-card p {color:var(--text-2);font-size:15px;margin:12px 0 0;}
.public-worries h3 {font-size:18px;}
.public-step-number {display:block;color:var(--text-3);font-variant-numeric:tabular-nums;font-size:13px;letter-spacing:.02em;margin-bottom:16px;}
.public-preview-notice {padding:16px;background:#FBF3E2;color:#7A5200;border-radius:12px;font-size:13px;letter-spacing:.02em;margin-bottom:16px;}
.public-example-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 16px;}
.public-example {margin:0;background:var(--surface);border-radius:16px;padding:12px;box-shadow:var(--shadow-1);min-width:0;}
.public-comparison-frame {position:relative;overflow:hidden;border-radius:12px;background:var(--bg);aspect-ratio:3/4;touch-action:pan-y;}
.public-comparison-frame img {display:block;width:100%;height:100%;object-fit:contain;}
.public-comparison-frame .public-before {position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--reveal,50%)) 0 0);}
.public-divider {position:absolute;top:0;bottom:0;left:var(--reveal,50%);width:2px;background:var(--navy);transform:translateX(-1px);pointer-events:none;}
.public-divider::after {content:'↔';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;display:grid;place-items:center;border:1.5px solid var(--navy);border-radius:999px;background:#fff;color:var(--navy);font-size:18px;}
.public-comparison figcaption {display:flex;justify-content:space-between;gap:8px;font-size:13px;letter-spacing:.02em;color:var(--text-2);padding:12px 4px 4px;}
/* 比較は写真の上のハンドルを動かす。別のバーは置かない。キーボードでは写真の枠にフォーカスして左右キーで動かす。 */
.public-comparison-frame {cursor:ew-resize;}
.public-comparison-frame:focus-visible {outline:2px solid var(--navy);outline-offset:3px;}
.public-comparison-frame:focus-visible .public-divider::after {box-shadow:0 0 0 3px var(--teal-50),0 0 0 5px var(--navy);}
.public-steps {list-style:none;padding:0;margin:0;}
.public-steps p {min-height:56px;}
.public-steps img {display:block;width:100%;max-width:240px;height:auto;margin:24px auto 0;border:1px solid var(--line);border-radius:12px;}
.public-footnote {font-size:13px;letter-spacing:.02em;color:var(--text-3);margin:16px 0 0;}
.public-pilot {display:grid;grid-template-columns:1fr 1fr;gap:48px;border-block:1px solid var(--line);margin-block:32px;}
.public-pilot p:not(.public-eyebrow) {color:var(--text-2);}
.public-section-description {color:var(--text-2);font-size:15px;}
.public-plan-heading {margin-top:32px;}
.public-plan-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px;}
.public-page .plan-card {background:#fff;border:0;border-radius:16px;padding:24px;box-shadow:var(--shadow-1);display:flex;flex-direction:column;min-width:0;}
.public-page .plan-card h3 {font-size:18px;font-weight:700;margin:0 0 4px;}
.public-plan-audience {font-size:13px;letter-spacing:.02em;color:var(--text-2);min-height:44px;}
.public-page .plan-price {display:flex;align-items:baseline;gap:4px;flex-wrap:wrap;margin:16px 0 4px;color:var(--navy);font-variant-numeric:tabular-nums;}
.public-page .plan-price strong {font-size:32px;line-height:1.4;}
.public-page .plan-price span {font-size:15px;font-weight:500;}
.public-page .plan-credit {display:flex;align-items:baseline;gap:4px;margin:0 0 4px;color:var(--teal-700);font-variant-numeric:tabular-nums;}
.public-page .plan-credit strong {font-size:28px;}
.public-page .plan-credit span {font-size:15px;font-weight:500;}
.public-plan-unit {font-size:15px;margin:12px 0 16px;color:var(--text-2);}
.public-plan-details {border-top:1px solid var(--line);padding-top:16px;margin-bottom:16px;}
.public-plan-details p {font-size:13px;letter-spacing:.02em;color:var(--text-2);margin:0 0 4px;}
.public-plan-details .public-plan-seats {font-size:15px;color:var(--ink);margin-bottom:8px;}
.public-page .plan-card .button {margin-top:auto;width:100%;font-size:15px;}
.public-one-time {margin-top:32px;}
.public-one-time .public-card {padding-block:8px;}
.public-page .one-time-row {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);}
.public-page .one-time-row:last-child {border-bottom:0;}
.public-page .one-time-row h4 {font-size:15px;font-weight:500;margin:0 0 4px;color:var(--ink);}
.public-page .one-time-row p {font-size:13px;letter-spacing:.02em;color:var(--text-2);margin:0;}
.public-page .one-time-row a {font-size:15px;padding:8px 12px;}
.public-payment-note {max-width:800px;}
.public-faq-list {padding-block:8px;}
.public-faq details {border-bottom:1px solid var(--line);}
.public-faq details:last-child {border:0;}
.public-faq summary {display:list-item;min-height:56px;padding:16px 24px 16px 0;color:var(--navy);font-size:16px;font-weight:500;cursor:pointer;}
.public-faq p {font-size:15px;color:var(--text-2);margin:0;padding-bottom:16px;}
.public-faq p a {display:inline-flex;align-items:center;min-width:44px;min-height:44px;}
.public-start {padding:48px 16px;text-align:center;}
.public-start h2 {margin-bottom:24px;}
.public-footer {padding:32px 0;border-top:1px solid var(--line);}
.public-footer nav {display:flex;flex-wrap:wrap;gap:4px 24px;margin-top:16px;}
.public-footer nav a {font-size:13px;letter-spacing:.02em;}
.public-footer small {display:block;margin-top:24px;color:var(--text-3);}
@media(max-width:720px) {
 .public-header,.public-main,.public-footer {width:calc(100% - 32px);}
 .public-header {min-height:72px;}
 .public-brand img {width:130px;}
 .public-header nav {gap:16px;}
 .public-intro,.public-intro.has-example {grid-template-columns:minmax(0,1fr);gap:24px;padding:32px 0;}
 .public-intro h1,.public-intro.has-example h1 {font-size:28px;}
 .desktop-break {display:none;}
 .public-intro.has-example .public-intro-copy,.public-intro.has-example #featured-example,.public-intro.has-example .public-intro-actions {grid-column:1;grid-row:auto;}
 .public-page h2 {font-size:26px;}
 .public-section {padding:32px 0;}
 .public-three-grid,.public-example-grid,.public-plan-grid {grid-template-columns:minmax(0,1fr);gap:16px;}
 .public-card,.public-page .plan-card {padding:16px;}
 .public-section-heading {margin-bottom:16px;}
 .public-pilot {grid-template-columns:minmax(0,1fr);gap:16px;}
 .public-steps p,.public-plan-audience {min-height:0;}
 .public-steps img {max-width:240px;}
 .public-start .button,.public-intro-actions>.button {width:100%;}
 .public-example-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
 .public-example-grid .public-example {padding:8px;}
 .public-example-grid figcaption {font-size:12px;}
 .public-one-time .public-card {padding-block:4px;}
 .public-page .one-time-row {gap:8px;}
 .public-faq-list {padding-block:4px;}
}
@media(prefers-reduced-motion:no-preference) {.public-page a,.public-page button {transition:background-color 120ms ease;}}
.public-page .plan-card > p {display:block;}
