@layer theme {
  :root, :host { --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --spacing: .25rem; --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); }
}
@layer base {
  *, ::after, ::before, ::backdrop { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; }
  ::file-selector-button { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; }
  html, :host { text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings,normal); font-variation-settings: var(--default-font-variation-settings,normal); -webkit-tap-highlight-color: transparent; }
  hr { height: 0px; color: inherit; border-top-width: 1px; }
  abbr:where([title]) { text-decoration: underline dotted; }
  h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
  a { color: inherit; text-decoration: inherit; }
  b, strong { font-weight: bolder; }
  code, kbd, samp, pre { font-family: var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings,normal); font-variation-settings: var(--default-mono-font-variation-settings,normal); font-size: 1em; }
  small { font-size: 80%; }
  sub, sup { vertical-align: baseline; font-size: 75%; line-height: 0; position: relative; }
  sub { bottom: -0.25em; }
  sup { top: -0.5em; }
  table { text-indent: 0px; border-color: inherit; border-collapse: collapse; }
  progress { vertical-align: baseline; }
  summary { display: list-item; }
  ol, ul, menu { list-style: none; }
  img, svg, video, canvas, audio, iframe, embed, object { vertical-align: middle; display: block; }
  img, video { max-width: 100%; height: auto; }
  button, input, select, optgroup, textarea { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; }
  ::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; }
  :where(select:is([multiple], [size])) optgroup { font-weight: bolder; }
  :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; }
  ::file-selector-button { margin-inline-end: 4px; }
  ::placeholder { opacity: 1; }
  @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
  ::placeholder { color: currentcolor; }
  @supports (color:color-mix(in lab, red, red)) {
  ::placeholder { color: color-mix(currentcolor, transparent); }
}
}
  textarea { resize: vertical; }
  ::-webkit-search-decoration { appearance: none; }
  ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; }
  ::-webkit-datetime-edit { display: inline-flex; }
  ::-webkit-datetime-edit-fields-wrapper { padding: 0px; }
  ::-webkit-datetime-edit { padding-block: 0px; }
  ::-webkit-datetime-edit-year-field { padding-block: 0px; }
  ::-webkit-datetime-edit-month-field { padding-block: 0px; }
  ::-webkit-datetime-edit-day-field { padding-block: 0px; }
  ::-webkit-datetime-edit-hour-field { padding-block: 0px; }
  ::-webkit-datetime-edit-minute-field { padding-block: 0px; }
  ::-webkit-datetime-edit-second-field { padding-block: 0px; }
  ::-webkit-datetime-edit-millisecond-field { padding-block: 0px; }
  ::-webkit-datetime-edit-meridiem-field { padding-block: 0px; }
  ::-webkit-calendar-picker-indicator { line-height: 1; }
  button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; }
  ::file-selector-button { appearance: button; }
  ::-webkit-inner-spin-button { height: auto; }
  ::-webkit-outer-spin-button { height: auto; }
  [hidden]:where(:not([hidden="until-found"])) { display: none !important; }
}
@layer components;
@layer utilities {
  .relative { position: relative; }
  .start { inset-inline-start: var(--spacing); }
  .table { display: table; }
}
:root { --ink: #25323a; --muted: #657078; --purple: #7556b2; --purple-dark: #60449a; --lav: #f2edfb; --lav2: #e6dcf7; --mint: #dff3ed; --green: #3f8c79; --cream: #fffaf3; --line: #e5e2e8; --white: #fff; --shadow: 0 18px 45px #5642701f; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { color: var(--ink); letter-spacing: 0.035em; background: rgb(255, 255, 255); margin: 0px; font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif; line-height: 1.8; }
a { color: inherit; text-decoration: none; }
em { color: var(--purple); font-style: normal; }
main { overflow: hidden; }
.site-header { backdrop-filter: blur(12px); z-index: 20; background: rgba(255, 255, 255, 0.94); border-bottom: 1px solid rgb(241, 239, 243); align-items: center; gap: 32px; height: 82px; padding: 0px max(28px, -590px + 50vw); display: flex; position: relative; }
.brand { align-items: center; gap: 12px; margin-right: auto; font-size: 17px; font-weight: 800; line-height: 1.25; display: flex; }
.brand small { letter-spacing: 0.16em; color: var(--green); margin-bottom: 2px; font-size: 9px; display: block; }
.brand-mark { background: var(--purple); border-radius: 12px; justify-content: center; align-items: end; gap: 3px; width: 38px; height: 38px; padding: 9px; display: flex; }
.brand-mark i { background: rgb(255, 255, 255); border-radius: 4px; width: 5px; display: block; }
.brand-mark i:first-child { height: 10px; }
.brand-mark i:nth-child(2) { height: 18px; }
.brand-mark i:nth-child(3) { height: 14px; }
.site-header nav { gap: 30px; font-size: 13px; font-weight: 700; display: flex; }
.site-header nav a:hover { color: var(--purple); }
.header-cta { background: var(--purple); color: rgb(255, 255, 255); border-radius: 10px; padding: 10px 19px; font-size: 13px; font-weight: 800; box-shadow: rgba(117, 86, 178, 0.25) 0px 7px 16px; }
.arrow { margin-left: 8px; display: inline-block; }
.hero { grid-template-columns: 1.02fr 0.98fr; align-items: center; gap: 20px; max-width: 1180px; min-height: 690px; margin: auto; padding: 70px 24px 76px; display: grid; }
.eyebrow, .kicker { letter-spacing: 0.16em; color: var(--purple); font-size: 11px; font-weight: 900; }
.eyebrow span { color: var(--green); margin-right: 16px; }
.hero h1 { letter-spacing: 0.02em; margin: 16px 0px 18px; font-size: 49px; font-weight: 800; line-height: 1.45; }
.hero h1 em { z-index: 1; position: relative; }
.hero h1 em::after { content: ""; background: var(--mint); z-index: -1; border-radius: 9px; height: 14px; position: absolute; bottom: 2px; left: -4px; right: -4px; }
.hero-lead { color: var(--muted); margin-bottom: 23px; font-size: 16px; }
.hero-price { align-items: baseline; gap: 8px; margin-bottom: 21px; display: flex; }
.hero-price > span { background: var(--lav); color: var(--purple); border-radius: 4px; padding: 4px 10px; font-size: 13px; font-weight: 800; }
.hero-price strong { color: var(--purple); font-size: 22px; }
.hero-price strong b { font-size: 42px; line-height: 1; }
.hero-price small { font-size: 11px; }
.btn { border-radius: 12px; justify-content: center; align-items: center; padding: 16px 23px; font-size: 15px; font-weight: 800; transition: 0.2s; display: inline-flex; }
.btn:hover { transform: translateY(-2px); }
.btn.primary { background: var(--purple); color: rgb(255, 255, 255); box-shadow: rgba(117, 86, 178, 0.28) 0px 10px 24px; }
.hero-actions p { color: var(--muted); margin: 9px 5px; font-size: 11px; }
.hero-actions p span { color: var(--green); font-weight: 700; }
.hero-art { height: 520px; position: relative; }
.blob { border-radius: 48% 52% 63% 37% / 38% 48% 52% 62%; position: absolute; }
.blob-a { background: var(--lav); width: 470px; height: 445px; top: 23px; right: -20px; transform: rotate(8deg); }
.blob-b { background: var(--mint); opacity: 0.9; width: 290px; height: 250px; bottom: 0px; right: 135px; }
.clinic-card { width: 285px; height: 260px; position: absolute; top: 120px; right: 85px; }
.clinic-sign { width: 48px; height: 48px; color: var(--purple); text-align: center; box-shadow: var(--shadow); z-index: 2; background: rgb(255, 255, 255); border-radius: 50%; font-size: 29px; line-height: 48px; position: absolute; top: -45px; right: 28px; }
.clinic-roof { background: rgb(201, 183, 233); border-radius: 12px 12px 4px 4px; width: 208px; height: 50px; position: absolute; top: 24px; left: 14px; transform: skew(-14deg); }
.clinic-body { border: 3px solid var(--ink); background: rgb(255, 255, 255); border-radius: 5px; width: 190px; height: 135px; position: absolute; top: 67px; left: 28px; }
.clinic-body span { border: 2px solid var(--ink); background: rgb(223, 243, 237); width: 31px; height: 32px; position: absolute; top: 22px; }
.clinic-body span:first-child { left: 20px; }
.clinic-body span:nth-child(2) { left: 69px; }
.clinic-body span:nth-child(3) { left: 118px; }
.clinic-body b { border: 2px solid var(--ink); background: rgb(239, 232, 250); width: 49px; height: 61px; position: absolute; bottom: 0px; left: 70px; }
.plant { position: absolute; bottom: 48px; right: 3px; }
.plant b { background: var(--ink); width: 8px; height: 56px; margin: auto; display: block; }
.plant i { border: 2px solid var(--ink); background: rgb(139, 199, 184); border-radius: 80% 10%; width: 35px; height: 20px; position: absolute; }
.plant i:first-child { top: 8px; right: 2px; transform: rotate(-25deg); }
.plant i:nth-child(2) { top: 27px; left: 1px; transform: rotate(25deg); }
.person { z-index: 3; width: 105px; height: 190px; position: absolute; }
.person .head { border: 3px solid var(--ink); background: rgb(244, 201, 168); border-radius: 48%; width: 54px; height: 62px; position: absolute; top: 15px; left: 25px; }
.person .hair { background: var(--ink); border-radius: 55% 55% 20% 10%; width: 58px; height: 33px; position: absolute; top: 10px; left: 23px; }
.person .body { border: 3px solid var(--ink); text-align: center; border-radius: 35px 35px 8px 8px; width: 96px; height: 116px; padding-top: 42px; font-size: 28px; position: absolute; bottom: 0px; }
.doctor { bottom: 19px; left: 85px; }
.doctor .body { background: rgb(255, 255, 255); }
.advisor { bottom: 12px; right: 18px; }
.advisor .body { background: rgb(140, 203, 187); }
.advisor .body i { background: var(--ink); width: 30px; height: 3px; margin: 10px auto; display: block; }
.advisor .hair { border-radius: 55% 55% 30% 15%; transform: rotate(-5deg); }
.float-card { box-shadow: var(--shadow); z-index: 5; background: rgb(255, 255, 255); border: 1px solid rgb(238, 233, 244); border-radius: 13px; position: absolute; }
.float-card.chart { width: 175px; padding: 14px; top: 65px; left: 10px; }
.float-card.chart span { font-size: 9px; font-weight: 800; }
.float-card.chart div { align-items: end; gap: 7px; height: 46px; margin-top: 5px; display: flex; }
.float-card.chart i { background: rgb(211, 195, 236); border-radius: 4px 4px 0px 0px; width: 17px; display: block; }
.float-card.chart i:first-child { height: 14px; }
.float-card.chart i:nth-child(2) { height: 26px; }
.float-card.chart i:nth-child(3) { height: 33px; }
.float-card.chart i:nth-child(4) { background: rgb(127, 192, 174); height: 44px; }
.float-card.chart b { color: var(--green); position: absolute; top: 12px; right: 13px; }
.float-card.search { align-items: center; gap: 7px; padding: 11px 15px; font-size: 10px; display: flex; top: 70px; right: -5px; }
.float-card.search i { color: var(--purple); font-size: 17px; font-style: normal; }
.spark { color: rgb(209, 183, 100); font-size: 21px; position: absolute; }
.s1 { top: 216px; right: 6px; }
.s2 { top: 298px; left: 78px; }
.trust-bar { z-index: 5; background: rgb(255, 255, 255); border: 1px solid rgb(236, 231, 241); border-radius: 15px; justify-content: center; align-items: center; gap: 24px; max-width: 1080px; margin: -18px auto 0px; padding: 17px 28px; font-size: 12px; font-weight: 800; display: flex; position: relative; box-shadow: rgba(62, 51, 77, 0.08) 0px 10px 35px; }
.trust-bar > span:first-child { color: var(--purple); }
.trust-bar strong { color: var(--purple); font-size: 25px; }
.trust-bar strong small { font-size: 10px; }
.trust-bar i { background: var(--line); width: 1px; height: 25px; }
.section { padding: 105px 24px; }
.section-head { text-align: center; max-width: 760px; margin: 0px auto 48px; }
.section-head.left { text-align: left; margin-left: 0px; }
.section-head .kicker { margin: 0px 0px 10px; }
.section-head h2, .detail-copy h2, .profile-copy h2 { margin: 0px 0px 15px; font-size: 35px; line-height: 1.45; }
.section-head p:not(.kicker) { color: var(--muted); font-size: 14px; }
.worries { max-width: 1050px; margin: auto; }
.worry-grid { grid-template-columns: 0.85fr 1.15fr; align-items: center; gap: 65px; display: grid; }
.worry-illustration { background: var(--lav); border-radius: 50% 48% 46% 52%; height: 350px; position: relative; }
.desk { background: var(--ink); border-radius: 5px; width: 250px; height: 18px; position: absolute; bottom: 77px; left: 55px; }
.desk::before, .desk::after { content: ""; background: var(--ink); width: 8px; height: 75px; position: absolute; top: 12px; }
.desk::before { left: 24px; }
.desk::after { right: 24px; }
.mini-person i { border: 3px solid var(--ink); background: rgb(242, 197, 161); border-radius: 50%; width: 65px; height: 69px; position: absolute; top: 52px; left: 118px; }
.mini-person i::before { content: ""; background: var(--ink); border-radius: 50% 55% 20% 15%; width: 68px; height: 38px; position: absolute; top: -6px; left: -4px; }
.mini-person b { border: 3px solid var(--ink); background: rgb(255, 255, 255); border-radius: 42px 42px 5px 5px; width: 120px; height: 123px; position: absolute; top: 113px; left: 90px; }
.papers { border: 2px solid var(--ink); background: rgb(255, 255, 255); border-radius: 5px; padding: 12px 24px; font-size: 12px; font-weight: 900; line-height: 2; position: absolute; bottom: 92px; right: 38px; transform: rotate(7deg); }
.sweat { color: var(--purple); font-size: 25px; font-weight: 700; position: absolute; top: 45px; left: 62px; }
.check-list { gap: 11px; margin: 0px; padding: 0px; list-style: none; display: grid; }
.check-list li { border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 10px; padding: 14px 17px; font-size: 14px; font-weight: 700; }
.check-list span { background: var(--mint); width: 23px; height: 23px; color: var(--green); border-radius: 50%; place-items: center; margin-right: 10px; display: inline-grid; }
.bridge { text-align: center; margin: 65px 0px 0px; font-size: 18px; }
.bridge strong { color: var(--purple); border-bottom: 5px solid var(--mint); }
.support { background: rgb(250, 248, 253); }
.support, .price-section, .details, .reasons, .cases, .profile, .workload, .plans, .flow, .faq { max-width: none; }
.support > .section-head, .support > .service-grid, .support > .notice, .price-section > *, .details > *, .reasons > *, .cases > *, .profile > *, .workload > *, .plans > *, .flow > *, .faq > * { max-width: 1080px; margin-left: auto; margin-right: auto; }
.service-grid { grid-template-columns: repeat(4, 1fr); gap: 15px; display: grid; }
.service-card { background: rgb(255, 255, 255); border: 1px solid rgb(235, 230, 241); border-radius: 14px; min-height: 225px; padding: 21px 19px; transition: 0.2s; position: relative; }
.service-card:hover { box-shadow: var(--shadow); transform: translateY(-4px); }
.service-card > span { color: rgb(166, 156, 175); font-size: 10px; font-weight: 900; position: absolute; top: 10px; right: 14px; }
.service-icon { background: var(--lav); width: 48px; height: 48px; color: var(--purple); border-radius: 13px; place-items: center; margin-bottom: 17px; font-size: 19px; font-weight: 900; display: grid; }
.service-card:nth-child(3n) .service-icon { background: var(--mint); color: var(--green); }
.service-card h3 { margin: 0px 0px 9px; font-size: 15px; }
.service-card p { color: var(--muted); margin: 0px; font-size: 12px; }
.notice { color: rgb(126, 120, 130); font-size: 10px; margin-top: 22px !important; }
.price-section { background: var(--purple); color: rgb(255, 255, 255); }
.price-panel { grid-template-columns: 1.1fr 0.9fr; align-items: center; gap: 55px; display: grid; }
.price-copy .kicker { color: rgb(207, 193, 234); }
.price-copy h2 { margin: 7px 0px; font-size: 35px; }
.price-copy > p:not(.kicker) { color: rgb(232, 224, 246); }
.price-copy ul { gap: 8px; padding: 0px; list-style: none; display: grid; }
.price-copy li::before { content: "✓"; color: rgb(165, 223, 206); margin-right: 9px; display: inline-block; }
.price-box { color: var(--ink); text-align: center; background: rgb(255, 255, 255); border-radius: 20px; padding: 34px; box-shadow: rgba(49, 33, 78, 0.3) 0px 22px 50px; }
.price-box > span { color: var(--purple); font-size: 12px; font-weight: 900; display: block; }
.price-box strong { color: var(--purple); font-size: 25px; display: inline-block; }
.price-box strong b { font-size: 48px; }
.price-box small { font-size: 11px; }
.price-box p { color: var(--muted); margin: 0px 0px 16px; font-size: 11px; }
.price-box .btn { width: 100%; font-size: 13px; }
.range { border-top: 1px solid rgba(255, 255, 255, 0.24); align-items: center; gap: 30px; padding-top: 25px; display: flex; margin-top: 45px !important; }
.range strong { font-size: 12px; }
.range div { flex-wrap: wrap; gap: 8px; display: flex; }
.range span { border: 1px solid rgba(255, 255, 255, 0.36); border-radius: 20px; padding: 5px 12px; font-size: 10px; }
.details { max-width: 1080px; margin: auto; }
.detail-row { grid-template-columns: 1fr 1fr; align-items: center; gap: 80px; padding: 20px 0px 95px; display: grid; }
.detail-row.reverse .detail-art { order: 2; }
.detail-art { background: var(--lav); border-radius: 45% 55% 50% 50%; height: 380px; position: relative; }
.result-card { border: 2px solid var(--ink); width: 280px; box-shadow: var(--shadow); background: rgb(255, 255, 255); border-radius: 24px; padding: 14px 18px; font-size: 12px; position: absolute; top: 76px; left: 55px; }
.result-card i { color: var(--purple); margin-right: 12px; font-size: 22px; font-style: normal; }
.ai-bubble { background: var(--purple); color: rgb(255, 255, 255); width: 78px; height: 78px; box-shadow: var(--shadow); border: 5px solid rgb(255, 255, 255); border-radius: 50%; place-items: center; font-size: 24px; font-weight: 900; display: grid; position: absolute; top: 143px; right: 55px; }
.page-stack { border: 2px solid var(--ink); background: rgb(255, 255, 255); border-radius: 8px; width: 190px; padding: 22px; position: absolute; bottom: 70px; left: 100px; transform: rotate(-5deg); }
.page-stack b { background: rgb(216, 203, 237); border-radius: 4px; height: 6px; margin: 8px; display: block; }
.page-stack b:nth-child(2) { background: rgb(151, 205, 191); width: 70%; }
.detail-copy .kicker { margin: 0px; }
.detail-copy > p:not(.kicker, .mini-note) { color: var(--muted); font-size: 14px; }
.detail-copy ul { padding: 0px; list-style: none; }
.detail-copy li { border-bottom: 1px solid var(--line); padding: 8px 0px; font-size: 13px; }
.detail-copy li::before { content: "✓"; color: var(--green); margin-right: 10px; font-weight: 700; }
.map-art { background: var(--mint); }
.map-pin { background: var(--purple); clip-path: polygon(50% 100%, 10% 48%, 11% 33%, 20% 15%, 36% 4%, 56% 1%, 75% 11%, 89% 29%, 90% 49%); color: rgb(255, 255, 255); place-items: center; width: 110px; height: 140px; padding-bottom: 35px; font-size: 45px; display: grid; position: absolute; top: 55px; left: 80px; }
.review-card { border: 2px solid var(--ink); width: 245px; box-shadow: var(--shadow); z-index: 2; background: rgb(255, 255, 255); border-radius: 14px; padding: 17px; position: absolute; bottom: 63px; right: 30px; }
.review-card span, .review-card i { font-size: 10px; font-style: normal; display: block; }
.review-card b { color: rgb(211, 170, 67); letter-spacing: 4px; }
.map-lines { background: linear-gradient(155deg, rgba(0, 0, 0, 0) 48%, rgba(37, 50, 58, 0.2) 49%, rgba(0, 0, 0, 0) 50%), linear-gradient(25deg, rgba(0, 0, 0, 0) 53%, rgba(37, 50, 58, 0.15) 54%, rgba(0, 0, 0, 0) 55%); position: absolute; inset: 0px; }
.mini-note { color: var(--muted); font-size: 10px; }
.reasons { background: rgb(255, 250, 244); }
.reason-grid { grid-template-columns: repeat(4, 1fr); gap: 17px; display: grid; }
.reason-grid article { background: rgb(255, 255, 255); border: 1px solid rgb(236, 230, 220); border-radius: 14px; padding: 25px 20px; position: relative; }
.reason-grid article > span { color: rgb(198, 189, 176); font-size: 11px; font-weight: 900; position: absolute; top: 13px; right: 15px; }
.reason-grid article > div { color: var(--purple); margin-bottom: 13px; font-size: 28px; }
.reason-grid h3 { font-size: 15px; line-height: 1.55; }
.reason-grid p { color: var(--muted); font-size: 12px; }
.cases { background: rgb(250, 248, 253); }
.case-grid { grid-template-columns: 1fr 1fr; gap: 22px; display: grid; }
.case-grid article { background: rgb(255, 255, 255); border: 1px solid rgb(233, 227, 240); border-radius: 18px; padding: 30px; }
.case-label { color: var(--purple); letter-spacing: 0.15em; font-size: 10px; font-weight: 900; }
.case-label span { color: var(--ink); letter-spacing: 0.02em; margin-top: 4px; font-size: 15px; display: block; }
.case-result { background: var(--lav); justify-content: space-between; align-items: end; margin: 22px -30px; padding: 20px 30px; display: flex; }
.case-result strong { line-height: 1.5; }
.case-result b { color: var(--purple); font-size: 32px; }
.case-result span { color: var(--green); background: rgb(255, 255, 255); border-radius: 20px; padding: 5px 9px; font-size: 11px; font-weight: 800; }
.case-grid article > p { color: var(--muted); font-size: 12px; }
.tags { gap: 7px; display: flex; }
.tags span { border: 1px solid var(--line); border-radius: 10px; padding: 3px 8px; font-size: 9px; }
.profile { background: rgb(255, 255, 255); }
.profile-card { background: var(--purple); color: rgb(255, 255, 255); border-radius: 22px; grid-template-columns: 0.72fr 1.28fr; display: grid; overflow: hidden; }
.profile-visual { background: var(--lav2); flex-direction: column; justify-content: end; align-items: center; min-height: 410px; display: flex; position: relative; }
.profile-visual small { color: var(--purple); z-index: 3; background: rgb(255, 255, 255); border-radius: 20px; margin: 0px 0px 27px; padding: 8px 14px; font-weight: 800; }
.portrait { width: 215px; height: 310px; position: absolute; bottom: 0px; }
.portrait span { border: 3px solid var(--ink); background: rgb(237, 189, 154); border-radius: 50%; width: 110px; height: 120px; position: absolute; top: 12px; left: 52px; }
.portrait span::before { content: ""; background: var(--ink); border-radius: 55% 55% 25% 10%; width: 115px; height: 65px; position: absolute; top: -10px; left: -5px; }
.portrait i { border: 3px solid var(--ink); background: rgb(255, 255, 255); border-radius: 65px 65px 0px 0px; width: 204px; height: 215px; position: absolute; bottom: 0px; left: 5px; }
.portrait b { background: var(--purple); clip-path: polygon(10% 0px, 90% 0px, 70% 100%, 50% 85%, 30% 100%); z-index: 2; width: 50px; height: 60px; position: absolute; top: 125px; left: 82px; }
.profile-copy { padding: 55px; }
.profile-copy .kicker { color: rgb(212, 199, 234); }
.profile-copy > p:not(.kicker, .name) { color: rgb(235, 229, 244); font-size: 13px; }
.name { font-size: 23px; font-weight: 900; }
.name span { font-size: 11px; font-weight: 400; display: block; }
.credentials { flex-wrap: wrap; gap: 7px; display: flex; }
.credentials span { border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 15px; padding: 5px 9px; font-size: 10px; }
.workload { background: rgb(249, 252, 251); }
.work-grid { grid-template-columns: 1fr 120px 1fr; align-items: center; display: grid; }
.work-grid > div:not(.work-arrow) { border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 16px; padding: 28px; }
.work-grid .ours { background: rgb(242, 251, 248); border-color: rgb(185, 223, 212); }
.role { color: var(--green); margin-bottom: 15px; font-size: 14px; font-weight: 900; display: block; }
.clinic-role { color: var(--muted); }
.work-grid ul { margin: 0px; padding: 0px; list-style: none; }
.work-grid li { border-bottom: 1px dotted rgb(221, 221, 221); padding: 7px 0px; font-size: 12px; }
.work-grid li::before { content: "✓"; color: var(--green); margin-right: 8px; }
.work-arrow { text-align: center; color: var(--purple); font-size: 32px; }
.work-arrow small { font-size: 8px; display: block; }
.plans { background: rgb(255, 255, 255); }
.plan-grid { grid-template-columns: repeat(3, 1fr); align-items: center; gap: 17px; display: grid; }
.plan-grid article { border: 1px solid var(--line); text-align: center; border-radius: 14px; padding: 27px 20px; position: relative; }
.plan-grid article > span { color: var(--purple); letter-spacing: 0.12em; font-size: 11px; font-weight: 900; display: block; }
.plan-grid strong { font-size: 24px; }
.plan-grid small { font-size: 10px; }
.plan-grid p { color: var(--muted); font-size: 11px; }
.plan-grid .featured { border: 2px solid var(--purple); background: var(--lav); padding: 38px 20px; }
.plan-grid .featured i { background: var(--purple); color: rgb(255, 255, 255); border-radius: 15px; padding: 3px 18px; font-size: 9px; font-style: normal; position: absolute; top: -12px; left: 50%; transform: translate(-50%); }
.text-link { width: max-content; color: var(--purple); border-bottom: 1px solid var(--purple); font-size: 13px; font-weight: 900; display: block; margin: 30px auto 0px !important; }
.flow { background: var(--lav); }
.flow ol { counter-reset: flow 0; grid-template-columns: repeat(5, 1fr); gap: 14px; padding: 0px; list-style: none; display: grid; }
.flow li { text-align: center; background: rgb(255, 255, 255); border-radius: 14px; padding: 23px 10px; position: relative; }
.flow li:not(:last-child)::after { content: "→"; z-index: 2; color: var(--purple); font-weight: 700; position: absolute; top: 50%; right: -13px; }
.flow li > span { color: rgb(181, 168, 200); font-size: 9px; font-weight: 900; position: absolute; top: 8px; left: 10px; }
.flow li > div { color: var(--purple); font-size: 27px; }
.flow h3 { margin: 8px 0px 3px; font-size: 13px; }
.flow li p { color: var(--muted); margin: 0px; font-size: 9px; }
.faq { background: rgb(255, 255, 255); }
.faq-list { max-width: 820px !important; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { cursor: pointer; align-items: center; padding: 20px 4px; font-size: 14px; font-weight: 800; list-style: none; display: flex; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span, .faq-list details > div > span { color: var(--purple); margin-right: 16px; font-family: Arial; font-size: 21px; font-weight: 900; }
.faq-list summary i { color: var(--purple); margin-left: auto; font-style: normal; font-weight: 400; }
.faq-list details[open] summary i { transform: rotate(45deg); }
.faq-list details > div { color: var(--muted); padding: 0px 4px 19px 1px; font-size: 12px; display: flex; }
.faq-list details > div span { color: var(--green); }
.faq-list details p { margin: 5px 0px; }
.contact { background: var(--purple); color: rgb(255, 255, 255); border-radius: 26px; grid-template-columns: 0.8fr 1.2fr; align-items: center; max-width: 1080px; min-height: 430px; margin: 0px auto 100px; padding: 55px; display: grid; position: relative; overflow: hidden; }
.contact::before { content: ""; background: rgba(255, 255, 255, 0.08); border-radius: 50%; width: 340px; height: 340px; position: absolute; top: -80px; left: -80px; }
.contact-art { height: 300px; position: relative; }
.contact-person { width: 120px; height: 180px; position: absolute; bottom: 15px; }
.contact-person i { border: 3px solid var(--ink); background: rgb(241, 196, 162); border-radius: 50%; width: 65px; height: 70px; position: absolute; left: 27px; }
.contact-person i::after { content: ""; background: var(--ink); border-radius: 50% 50% 20% 10%; width: 67px; height: 37px; position: absolute; top: -5px; left: -4px; }
.contact-person b { border: 3px solid var(--ink); background: rgb(255, 255, 255); border-radius: 40px 40px 0px 0px; width: 110px; height: 113px; position: absolute; bottom: 0px; left: 5px; }
.contact-person.p2 { right: 10px; }
.contact-person.p2 b { background: rgb(149, 208, 193); }
.chat { color: var(--ink); z-index: 3; background: rgb(255, 255, 255); border-radius: 16px; padding: 12px 17px; font-size: 10px; font-weight: 800; line-height: 1.4; position: absolute; }
.chat::after { content: ""; border-width: 9px; border-style: solid; border-color: rgb(255, 255, 255) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0); border-image: none; position: absolute; bottom: -9px; }
.chat.one { top: 5px; left: 5px; }
.chat.two { top: 30px; right: 2px; }
.contact-copy { z-index: 3; padding-left: 45px; position: relative; }
.contact-copy .kicker { color: rgb(216, 203, 234); }
.contact-copy h2 { margin: 7px 0px; font-size: 35px; line-height: 1.5; }
.contact-copy > p:not(.kicker) { font-size: 14px; }
.contact-copy > p strong { color: rgb(200, 240, 227); font-size: 22px; }
.btn.white { color: var(--purple); background: rgb(255, 255, 255); margin: 9px 0px 15px; box-shadow: rgba(34, 21, 58, 0.2) 0px 10px 24px; }
.contact-copy > div { color: rgb(231, 222, 244); flex-wrap: wrap; gap: 13px; font-size: 9px; display: flex; }
footer { color: rgb(255, 255, 255); background: rgb(36, 48, 56); align-items: center; gap: 40px; padding: 45px max(25px, -540px + 50vw); display: flex; }
.brand.light small { color: rgb(158, 216, 201); }
.brand.light .brand-mark { background: rgb(255, 255, 255); }
.brand.light .brand-mark i { background: var(--purple); }
footer > div:nth-child(2) { gap: 22px; margin-left: auto; font-size: 10px; display: flex; }
footer > p { color: rgb(157, 165, 170); font-size: 9px; }
@media (width <= 900px) {
  .site-header nav { display: none; }
  .hero { grid-template-columns: 1fr; padding-top: 50px; }
  .hero-art { height: 460px; }
  .trust-bar { flex-wrap: wrap; gap: 12px; margin: 0px 18px; }
  .service-grid, .reason-grid { grid-template-columns: repeat(2, 1fr); }
  .detail-row { gap: 40px; }
  .contact { margin: 0px 20px 70px; }
  .contact-art { display: none; }
  .contact { grid-template-columns: 1fr; }
  .contact-copy { padding-left: 0px; }
  .section { padding: 80px 20px; }
}
@media (width <= 650px) {
  .site-header { height: 68px; padding: 0px 15px; }
  .brand { font-size: 14px; }
  .brand-mark { width: 34px; height: 34px; }
  .header-cta { padding: 9px 12px; font-size: 11px; }
  .hero { padding: 42px 20px 45px; }
  .hero h1 { font-size: 34px; line-height: 1.5; }
  .hero-lead { font-size: 13px; }
  .desktop { display: none; }
  .hero-price { flex-wrap: wrap; }
  .hero-price strong b { font-size: 35px; }
  .hero-actions .btn { width: 100%; font-size: 12px; }
  .hero-art { transform-origin: center top; height: 380px; margin-top: 15px; transform: scale(0.88); }
  .blob-a { right: -70px; }
  .clinic-card { right: 25px; }
  .person.doctor { left: 35px; }
  .float-card.chart { left: -15px; }
  .trust-bar { padding: 14px; }
  .trust-bar i { display: none; }
  .trust-bar > span, .trust-bar strong { font-size: 10px; }
  .trust-bar strong { font-size: 19px; }
  .section { padding: 68px 18px; }
  .section-head h2, .detail-copy h2, .profile-copy h2, .contact-copy h2 { font-size: 27px; }
  .section-head { margin-bottom: 35px; }
  .worry-grid { grid-template-columns: 1fr; gap: 35px; }
  .worry-illustration { height: 310px; margin: -15px; transform: scale(0.9); }
  .check-list li { font-size: 12px; }
  .bridge { font-size: 15px; }
  .service-grid, .reason-grid { grid-template-columns: 1fr; }
  .service-card { min-height: auto; }
  .price-panel { grid-template-columns: 1fr; }
  .price-copy h2 { font-size: 28px; }
  .price-box { padding: 25px 18px; }
  .price-box strong b { font-size: 39px; }
  .range { display: block; }
  .range div { margin-top: 13px; }
  .detail-row, .detail-row.reverse { grid-template-columns: 1fr; gap: 35px; padding-bottom: 70px; }
  .detail-row.reverse .detail-art { order: 0; }
  .detail-art { height: 320px; }
  .result-card { width: 230px; left: 25px; }
  .page-stack { left: 50px; }
  .ai-bubble { right: 25px; }
  .map-pin { left: 30px; }
  .review-card { width: 220px; right: 14px; }
  .case-grid, .profile-card { grid-template-columns: 1fr; }
  .profile-visual { min-height: 360px; }
  .profile-copy { padding: 33px 24px; }
  .work-grid { grid-template-columns: 1fr; }
  .work-arrow { height: 80px; padding-top: 12px; transform: rotate(90deg); }
  .plan-grid { grid-template-columns: 1fr; }
  .plan-grid .featured { padding: 30px 20px; }
  .flow ol { grid-template-columns: 1fr 1fr; }
  .flow li:not(:last-child)::after { display: none; }
  .contact { min-height: auto; padding: 38px 24px; }
  .contact-copy > div, .contact-copy > div span { display: block; }
  .btn.white { width: 100%; padding: 14px 8px; font-size: 12px; }
  footer { text-align: center; display: block; }
  footer .brand { justify-content: center; margin-bottom: 25px; }
  footer > div:nth-child(2) { flex-wrap: wrap; justify-content: center; }
  footer > p { margin-top: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .btn, .service-card { transition: none; }
}
.generated-art { background: var(--cream); border: 1px solid rgb(238, 231, 221); overflow: hidden; box-shadow: rgba(86, 66, 112, 0.1) 0px 18px 45px; }
.generated-art img { object-fit: cover; width: 100%; height: 100%; display: block; }
.hero-art.generated-art { aspect-ratio: 3 / 2; border-radius: 38% 18% 34% 16%; height: auto; transform: rotate(1deg); }
.hero-art.generated-art img { transform: scale(1.015); }
.worry-illustration.generated-art { border-radius: 46% 54% 48% 52%; }
.detail-art.generated-art { border-radius: 26% 14% 24% 12%; }
@media (width <= 900px) {
  .hero-art.generated-art { width: 100%; max-width: 650px; height: auto; margin: 20px auto 0px; }
  .worry-illustration.generated-art { max-width: 460px; margin: auto; }
}
@media (width <= 650px) {
  .hero-art.generated-art { aspect-ratio: 3 / 2; height: auto; margin-top: 22px; transform: none; }
  .worry-illustration.generated-art { aspect-ratio: 1 / 1; height: auto; margin: auto; transform: none; }
  .detail-art.generated-art { aspect-ratio: 1 / 1; height: auto; }
}
.profile-photo { object-fit: cover; object-position: center top; width: 100%; height: 100%; position: absolute; inset: 0px; }
.profile-visual::after { content: ""; pointer-events: none; background: linear-gradient(rgba(0, 0, 0, 0), rgba(49, 33, 78, 0.2)); height: 30%; position: absolute; inset: auto 0px 0px; }
.profile-visual small { position: relative; }
.compact-profile-section { background: rgb(250, 252, 255); padding-top: 70px; padding-bottom: 70px; }
.compact-profile { color: var(--ink); background: rgb(255, 255, 255); border: 1px solid rgb(221, 231, 240); border-radius: 18px; grid-template-columns: 130px 1fr; align-items: center; gap: 28px; padding: 30px 36px; overflow: visible; box-shadow: rgba(60, 82, 104, 0.08) 0px 14px 35px; max-width: 920px !important; }
.compact-profile-visual { border: 5px solid var(--lav2); background: rgb(255, 255, 255); border-radius: 50%; justify-self: center; width: 116px; height: 116px; min-height: 0px; overflow: hidden; }
.compact-profile-visual::after { display: none; }
.compact-profile-visual .profile-photo { object-fit: cover; object-position: center 15%; width: 100%; height: 100%; position: static; }
.compact-profile-copy { padding: 0px; }
.compact-profile-copy .kicker { color: var(--purple); margin: 0px 0px 3px; }
.compact-profile-copy .name { color: var(--ink); margin: 0px 0px 2px; font-size: 23px; line-height: 1.5; }
.compact-profile-copy .name span { color: var(--purple); font-size: 11px; font-weight: 800; }
.compact-profile-copy .profile-role { font-weight: 800; color: var(--ink) !important; margin: 0px 0px 10px !important; font-size: 11px !important; }
.compact-profile-copy > p:not(.kicker, .name, .profile-role) { color: var(--muted); margin: 0px 0px 14px; font-size: 12px; line-height: 1.9; }
.compact-profile-copy .credentials span { color: var(--green); background: rgb(243, 250, 248); border-color: rgb(204, 229, 222); }
@media (width <= 650px) {
  .compact-profile-section { padding-top: 52px; padding-bottom: 52px; }
  .compact-profile { text-align: center; grid-template-columns: 1fr; gap: 17px; padding: 26px 22px; }
  .compact-profile-visual { width: 104px; height: 104px; }
  .compact-profile-copy .credentials { justify-content: center; }
}
.contact.contact-clean{display:block;min-height:0;max-width:1000px;padding:68px 40px;text-align:center;background:var(--purple);isolation:isolate}.contact.contact-clean:before{width:290px;height:290px;left:-105px;top:-145px;background:rgba(223,243,237,.13);z-index:-1}.contact.contact-clean:after{content:"";position:absolute;width:240px;height:240px;right:-95px;bottom:-135px;border-radius:44% 56% 62% 38%;background:rgba(242,237,251,.12);z-index:-1}.contact-clean .contact-copy{max-width:680px;margin:auto;padding:0}.contact-clean .contact-copy h2{font-size:38px;margin:8px 0 10px}.contact-clean .contact-copy>p:not(.kicker){margin:0 0 13px}.contact-clean .contact-copy>div{justify-content:center}.contact-clean .btn.white{min-width:390px}@media(max-width:650px){.contact.contact-clean{padding:48px 22px;margin-left:18px;margin-right:18px}.contact-clean .contact-copy h2{font-size:27px}.contact-clean .btn.white{min-width:0}}

/* Keep the case-study heading aligned with its cards on the production site. */
#case.clinic-cases > .section-head,
#case.clinic-cases > .case-grid,
#case.clinic-cases > .notice {
  width: 100% !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#case.clinic-cases > .section-head { margin-bottom: 48px !important; }
@media (width <= 650px) {
  #case.clinic-cases > .section-head { margin-bottom: 35px !important; }
}
