:root {
  --forest-950: #0d281d;
  --forest-900: #173d2b;
  --forest-800: #1d4b35;
  --forest-700: #24593f;
  --leaf-600: #3f704d;
  --leaf-500: #4d7c57;
  --leaf-300: #a6c76a;
  --leaf-150: #dce9c5;
  --sun-600: #d9852f;
  --sun-500: #f2a044;
  --sun-300: #f8c883;
  --canvas-100: #f7f4ec;
  --canvas-50: #fbfaf6;
  --mint-100: #edf4eb;
  --mint-50: #f6faf5;
  --white: #ffffff;
  --ink-950: #15221a;
  --ink-800: #293b30;
  --ink-650: #526158;
  --ink-500: #6d7971;
  --line-300: #cfd9cf;
  --line-200: #dfe6df;
  --error-700: #a33737;
  --container: 1220px;
  --header-height: 72px;
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-xl: 40px;
  --shadow-card: 0 18px 44px rgba(23, 61, 43, 0.08);
  --shadow-float: 0 26px 72px rgba(23, 61, 43, 0.16);
  --font-sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
  margin: 0;
  color: var(--ink-950);
  background: var(--white);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.8;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body.menu-open, body.dialog-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }

:focus-visible { outline: 3px solid var(--sun-500); outline-offset: 4px; }
.skip-link {
  position: fixed;
  left: 16px;
  top: 10px;
  z-index: 200;
  transform: translateY(-150%);
  padding: 10px 16px;
  color: var(--white);
  background: var(--forest-950);
  border-radius: 999px;
  font-weight: 800;
}
.skip-link:focus { transform: translateY(0); }
.container { width: min(calc(100% - 36px), var(--container)); margin-inline: auto; }
.section { position: relative; padding-block: 78px; }
.section--canvas { background: var(--canvas-50); }
.section--mint { background: var(--mint-50); }
.section--dark { color: var(--white); background: var(--forest-950); }

.demo-banner {
  min-height: 34px;
  display: grid;
  place-items: center;
  padding: 6px 18px;
  color: #fff8ec;
  background: var(--forest-950);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
  text-align: center;
}
.top-assist {
  display: none;
  min-height: 34px;
  color: var(--ink-650);
  background: var(--canvas-50);
  border-bottom: 1px solid var(--line-200);
  font-size: 12px;
}
.top-assist .container { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.top-assist__links { display: flex; gap: 18px; align-items: center; }
.top-assist a { color: var(--forest-700); font-weight: 800; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  height: var(--header-height);
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid rgba(207, 217, 207, .75);
  backdrop-filter: blur(18px);
  transition: height .22s ease, box-shadow .22s ease;
}
.site-header.is-scrolled { box-shadow: 0 12px 28px rgba(23, 61, 43, .08); }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { min-width: 0; display: inline-flex; align-items: center; gap: 11px; }
.brand-mark {
  position: relative;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--white);
  background: var(--forest-700);
  border-radius: 14px 14px 14px 5px;
  box-shadow: inset 0 -8px 16px rgba(13, 40, 29, .17);
}
.brand-mark::before, .brand-mark::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 22px;
  background: var(--leaf-300);
  border-radius: 100% 0 100% 0;
}
.brand-mark::before { transform: translate(-5px, -2px) rotate(-18deg); }
.brand-mark::after { transform: translate(6px, 2px) rotate(84deg); }
.brand-copy { min-width: 0; line-height: 1.35; }
.brand-copy strong { display: flex; align-items: center; gap: 7px; max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.brand-copy small { display: none; color: var(--ink-650); font-size: 10px; font-weight: 600; }
.demo-badge { flex: 0 0 auto; padding: 2px 7px; color: var(--forest-900); background: var(--leaf-150); border-radius: 999px; font-size: 9px; letter-spacing: .08em; }
.desktop-nav, .header-actions { display: none; }
.desktop-nav { align-items: center; gap: 23px; font-size: 13px; font-weight: 800; }
.desktop-nav a { position: relative; padding-block: 10px; }
.desktop-nav a::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 5px; height: 5px; background: var(--sun-500); border-radius: 50%; transform: translateX(-50%) scale(0); transition: transform .18s ease; }
.desktop-nav a:hover::after, .desktop-nav a.is-current::after { transform: translateX(-50%) scale(1); }
.header-actions { gap: 10px; }
.menu-button {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--forest-900);
  background: var(--mint-100);
  border: 0;
  border-radius: 16px;
}
.menu-button__lines { width: 21px; height: 16px; display: grid; align-content: space-between; }
.menu-button__lines span { display: block; width: 100%; height: 2px; background: currentColor; border-radius: 999px; transition: transform .2s ease, opacity .2s ease; }
.menu-button[aria-expanded="true"] .menu-button__lines span:first-child { transform: translateY(7px) rotate(45deg); }
.menu-button[aria-expanded="true"] .menu-button__lines span:nth-child(2) { opacity: 0; }
.menu-button[aria-expanded="true"] .menu-button__lines span:last-child { transform: translateY(-7px) rotate(-45deg); }
.menu-backdrop { position: fixed; inset: 0; z-index: 104; background: rgba(13, 40, 29, .48); border: 0; }
.mobile-menu {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 105;
  width: min(88vw, 390px);
  padding: 88px 24px 110px;
  color: var(--ink-950);
  background: var(--white);
  box-shadow: -20px 0 60px rgba(13, 40, 29, .18);
  overflow-y: auto;
  transform: translateX(104%);
  transition: transform .24s ease;
}
.mobile-menu.is-open { transform: translateX(0); }
.mobile-menu__nav { display: grid; }
.mobile-menu__nav a { display: flex; justify-content: space-between; align-items: center; min-height: 54px; border-bottom: 1px solid var(--line-200); font-weight: 800; }
.mobile-menu__nav a::after { content: "→"; color: var(--leaf-500); }
.mobile-menu__actions { display: grid; gap: 10px; margin-top: 24px; }
.mobile-menu__note { margin: 20px 0 0; color: var(--ink-650); font-size: 12px; }

.btn {
  min-height: 52px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 900;
  line-height: 1.3;
  text-align: center;
  transition: transform .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
button.btn { width: auto; }
.btn:hover { transform: translateY(-2px); }
.btn--primary { color: var(--ink-950); background: var(--sun-500); box-shadow: 0 12px 26px rgba(217, 133, 47, .2); }
.btn--primary:hover { background: var(--sun-300); box-shadow: 0 16px 32px rgba(217, 133, 47, .26); }
.btn--secondary { color: var(--forest-700); background: var(--white); border-color: var(--forest-700); }
.btn--secondary:hover { color: var(--white); background: var(--forest-700); }
.btn--quiet { color: var(--forest-700); background: var(--mint-100); }
.btn--small { min-height: 44px; padding: 10px 17px; font-size: 13px; }
.btn__arrow { font-size: 1.1em; }

.hero {
  position: relative;
  overflow: clip;
  background:
    radial-gradient(circle at 88% 8%, rgba(166, 199, 106, .32), transparent 30%),
    radial-gradient(circle at 4% 90%, rgba(242, 160, 68, .12), transparent 24%),
    linear-gradient(135deg, var(--canvas-100), #fff 50%, var(--mint-100));
}
.hero::before { content: ""; position: absolute; width: 440px; height: 440px; left: -290px; top: 40px; border: 1px solid rgba(77, 124, 87, .18); border-radius: 50%; }
.hero-inner { min-height: 690px; display: grid; align-items: center; gap: 40px; padding-block: 56px 70px; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px; color: var(--forest-700); font-size: 13px; font-weight: 900; letter-spacing: .06em; }
.eyebrow::before { content: ""; width: 30px; height: 2px; background: var(--leaf-500); }
.hero h1 { max-width: 720px; margin: 0; font-size: clamp(36px, 9.2vw, 62px); line-height: 1.25; letter-spacing: -.045em; }
.hero h1 span { color: var(--forest-700); }
.hero-lead { max-width: 670px; margin: 22px 0 0; color: var(--ink-650); font-size: 17px; font-weight: 600; }
.hero-actions { display: grid; gap: 11px; margin-top: 30px; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 9px; margin: 24px 0 0; padding: 0; list-style: none; }
.hero-meta li { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; color: var(--forest-700); background: rgba(255, 255, 255, .82); border: 1px solid var(--line-200); border-radius: 999px; font-size: 12px; font-weight: 800; }
.hero-meta li::before { content: "✓"; width: 20px; height: 20px; display: grid; place-items: center; color: var(--white); background: var(--leaf-500); border-radius: 50%; font-size: 10px; }
.hero-media { position: relative; z-index: 1; margin: 0; }
.hero-media__frame { position: relative; padding: 10px; background: rgba(255, 255, 255, .72); border: 1px solid rgba(255, 255, 255, .9); border-radius: var(--radius-xl); box-shadow: var(--shadow-float); backdrop-filter: blur(10px); }
.hero-media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: calc(var(--radius-xl) - 8px); }
.hero-note { margin: 10px 6px 0; color: var(--ink-650); font-size: 12px; }
.hero-float {
  position: absolute;
  left: -12px;
  bottom: 28px;
  max-width: 220px;
  display: flex;
  gap: 11px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(255, 255, 255, .96);
  border: 1px solid var(--line-200);
  border-radius: 18px;
  box-shadow: var(--shadow-card);
}
.hero-float__icon { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; color: var(--white); background: var(--forest-700); border-radius: 13px; font-weight: 900; }
.hero-float strong { display: block; font-size: 13px; line-height: 1.45; }
.hero-float small { display: block; color: var(--ink-650); font-size: 11px; line-height: 1.45; }

.audience-strip { border-block: 1px solid var(--line-200); background: var(--white); }
.audience-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 0; padding: 18px 0; list-style: none; }
.audience-list li { min-height: 42px; display: flex; align-items: center; gap: 8px; color: var(--forest-700); font-size: 12px; font-weight: 900; }
.audience-list li::before { content: ""; flex: 0 0 8px; width: 8px; height: 8px; background: var(--sun-500); border-radius: 50%; box-shadow: 0 0 0 5px rgba(242, 160, 68, .13); }

.section-heading { max-width: 760px; margin-bottom: 34px; }
.section-heading--center { margin-inline: auto; text-align: center; }
.section-label { margin: 0 0 9px; color: var(--leaf-600); font-size: 12px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.section-title { margin: 0; font-size: clamp(29px, 6.2vw, 46px); line-height: 1.38; letter-spacing: -.035em; }
.section-lead { margin: 15px 0 0; color: var(--ink-650); font-size: 16px; }
.section-actions { margin-top: 26px; }

.problem-grid, .reason-grid, .service-grid, .benefit-grid { display: grid; gap: 16px; }
.problem-card, .reason-card, .service-card, .benefit-card {
  position: relative;
  overflow: hidden;
  padding: 24px;
  background: var(--white);
  border: 1px solid var(--line-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}
.problem-card { padding-top: 62px; }
.problem-card__number { position: absolute; left: 24px; top: 20px; color: var(--leaf-300); font-size: 12px; font-weight: 900; letter-spacing: .1em; }
.problem-card__icon, .reason-card__icon, .service-card__icon, .benefit-card__icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  color: var(--forest-700);
  background: var(--mint-100);
  border-radius: 17px;
}
.problem-card h3, .reason-card h3, .service-card h3, .benefit-card h3 { margin: 0 0 10px; font-size: 20px; line-height: 1.5; }
.problem-card p, .reason-card p, .service-card p, .benefit-card p { margin: 0; color: var(--ink-650); font-size: 14px; }
.reason-card { padding-top: 28px; }
.reason-card::after { content: ""; position: absolute; width: 110px; height: 110px; right: -55px; top: -55px; background: var(--mint-100); border-radius: 50%; }
.reason-card__index { position: relative; z-index: 1; display: inline-flex; margin-bottom: 16px; color: var(--leaf-600); font-size: 12px; font-weight: 900; }
.service-card { display: grid; align-content: start; }
.service-card__tag { display: inline-flex; width: max-content; margin-top: 18px; padding: 5px 9px; color: var(--forest-700); background: var(--mint-100); border-radius: 999px; font-size: 11px; font-weight: 900; }

.service-intro { display: grid; gap: 26px; align-items: end; margin-bottom: 34px; }
.service-intro .section-heading { margin: 0; }
.service-intro__note { padding: 20px; color: var(--forest-900); background: var(--leaf-150); border-radius: var(--radius-md); font-size: 13px; font-weight: 700; }

.split { display: grid; gap: 34px; align-items: center; }
.split-media { position: relative; margin: 0; }
.split-media img { width: 100%; border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.split-media__caption { margin: 9px 5px 0; color: var(--ink-650); font-size: 12px; }
.benefit-list { display: grid; gap: 13px; margin: 26px 0 0; padding: 0; list-style: none; }
.benefit-list li { display: flex; gap: 13px; align-items: flex-start; padding: 15px 16px; background: var(--white); border: 1px solid var(--line-200); border-radius: 16px; }
.benefit-list__check { flex: 0 0 28px; width: 28px; height: 28px; display: grid; place-items: center; color: var(--white); background: var(--forest-700); border-radius: 50%; font-size: 12px; font-weight: 900; }
.benefit-list strong { display: block; margin-bottom: 2px; font-size: 15px; }
.benefit-list span { color: var(--ink-650); font-size: 13px; }

.case-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(270px, 82%); gap: 16px; overflow-x: auto; padding: 4px 2px 18px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.case-card { overflow: hidden; scroll-snap-align: start; background: var(--white); border: 1px solid var(--line-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }
.case-card__media { position: relative; }
.case-card__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.case-label { position: absolute; left: 14px; top: 14px; padding: 6px 10px; color: var(--forest-900); background: rgba(255, 255, 255, .92); border-radius: 999px; font-size: 11px; font-weight: 900; }
.case-card__body { padding: 21px; }
.case-card__type { color: var(--leaf-600); font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.case-card h3 { margin: 5px 0 9px; font-size: 20px; }
.case-card p { margin: 0; color: var(--ink-650); font-size: 14px; }
.case-disclaimer { margin: 16px 0 0; color: var(--ink-650); font-size: 12px; }

.flow-grid { display: grid; gap: 14px; counter-reset: flow; }
.flow-step { position: relative; min-height: 150px; padding: 22px 20px 20px 72px; background: var(--white); border: 1px solid var(--line-200); border-radius: var(--radius-md); counter-increment: flow; }
.flow-step::before { content: counter(flow, decimal-leading-zero); position: absolute; left: 18px; top: 20px; width: 40px; height: 40px; display: grid; place-items: center; color: var(--white); background: var(--forest-700); border-radius: 50%; font-size: 12px; font-weight: 900; }
.flow-step h3 { margin: 0 0 6px; font-size: 17px; }
.flow-step p { margin: 0; color: var(--ink-650); font-size: 13px; }

.maintenance-layout { display: grid; gap: 34px; align-items: center; }
.maintenance-media { margin: 0; }
.maintenance-media img { width: 100%; max-height: 650px; object-fit: cover; border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.maintenance-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 24px; }
.maintenance-item { min-height: 84px; display: grid; place-items: center; gap: 5px; padding: 12px 8px; color: var(--forest-900); background: rgba(255, 255, 255, .82); border: 1px solid var(--line-200); border-radius: 15px; text-align: center; font-size: 12px; font-weight: 900; }
.maintenance-item svg { width: 23px; height: 23px; color: var(--leaf-600); }
.report-panel { display: grid; gap: 14px; margin-top: 24px; padding: 20px; color: var(--white); background: var(--forest-900); border-radius: var(--radius-lg); }
.report-panel__head { display: flex; gap: 12px; align-items: center; }
.report-panel__icon { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; color: var(--forest-900); background: var(--leaf-300); border-radius: 14px; }
.report-panel h3 { margin: 0; font-size: 17px; }
.report-panel p { margin: 0; color: rgba(255, 255, 255, .74); font-size: 13px; }
.report-panel__mock { display: grid; gap: 8px; padding: 14px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .15); border-radius: 14px; }
.report-panel__mock span { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; }
.report-panel__mock em { color: var(--leaf-300); font-style: normal; font-weight: 900; }

.area-card { position: relative; overflow: hidden; display: grid; gap: 28px; padding: 30px 24px; background: var(--white); border: 1px solid var(--line-200); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.area-card::after { content: ""; position: absolute; width: 340px; height: 340px; right: -190px; bottom: -230px; background: var(--mint-100); border-radius: 50%; }
.area-card__content { position: relative; z-index: 1; }
.area-card__region { display: inline-flex; align-items: center; gap: 10px; margin: 10px 0 0; padding: 10px 14px; color: var(--forest-700); background: var(--mint-100); border-radius: 999px; font-weight: 900; }
.area-card__region::before { content: "●"; color: var(--sun-500); font-size: 10px; }
.area-card__note { margin: 14px 0 0; color: var(--ink-650); font-size: 13px; }
.area-visual { position: relative; z-index: 1; min-height: 220px; display: grid; place-items: center; padding: 24px; background: linear-gradient(135deg, var(--mint-100), var(--canvas-100)); border-radius: var(--radius-lg); }
.area-visual__rings { position: relative; width: 170px; height: 170px; border: 1px solid rgba(77, 124, 87, .28); border-radius: 50%; }
.area-visual__rings::before, .area-visual__rings::after { content: ""; position: absolute; inset: 24px; border: 1px solid rgba(77, 124, 87, .32); border-radius: 50%; }
.area-visual__rings::after { inset: 51px; background: var(--forest-700); border: 0; box-shadow: 0 0 0 12px rgba(77, 124, 87, .12); }
.area-visual__label { position: absolute; max-width: 180px; padding: 8px 12px; color: var(--forest-900); background: rgba(255, 255, 255, .94); border-radius: 999px; box-shadow: var(--shadow-card); font-size: 12px; font-weight: 900; text-align: center; }

.faq-layout { display: grid; gap: 32px; align-items: start; }
.faq-side { position: sticky; top: 120px; }
.faq-side__box { margin-top: 22px; padding: 22px; color: var(--forest-900); background: var(--leaf-150); border-radius: var(--radius-lg); }
.faq-side__box strong { display: block; margin-bottom: 5px; }
.faq-side__box p { margin: 0 0 16px; font-size: 13px; }
.faq-list { display: grid; gap: 11px; }
.faq-item { overflow: hidden; background: var(--white); border: 1px solid var(--line-200); border-radius: var(--radius-md); }
.faq-question { width: 100%; min-height: 70px; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 17px 19px; color: var(--ink-950); background: transparent; border: 0; text-align: left; font-weight: 900; }
.faq-question__icon { flex: 0 0 32px; width: 32px; height: 32px; display: grid; place-items: center; color: var(--forest-700); background: var(--mint-100); border-radius: 50%; font-size: 20px; line-height: 1; transition: transform .18s ease; }
.faq-question[aria-expanded="true"] .faq-question__icon { transform: rotate(45deg); }
.faq-answer { padding: 0 19px 19px; color: var(--ink-650); font-size: 14px; }
.faq-answer p { margin: 0; }

.final-cta { position: relative; overflow: hidden; padding: 38px 24px; color: var(--white); background: var(--forest-950); border-radius: var(--radius-xl); }
.final-cta::before, .final-cta::after { content: ""; position: absolute; border: 1px solid rgba(255, 255, 255, .15); border-radius: 50%; }
.final-cta::before { width: 420px; height: 420px; right: -210px; top: -250px; }
.final-cta::after { width: 230px; height: 230px; left: -110px; bottom: -180px; }
.final-cta__inner { position: relative; z-index: 1; }
.final-cta h2 { margin: 0; font-size: clamp(29px, 7vw, 48px); line-height: 1.4; }
.final-cta p { max-width: 720px; margin: 14px 0 0; color: rgba(255, 255, 255, .75); }
.final-cta__actions { display: grid; gap: 11px; margin-top: 26px; }
.final-cta__sub { margin-top: 16px; color: rgba(255, 255, 255, .6); font-size: 12px; }

.site-footer { padding: 58px 0 112px; color: rgba(255, 255, 255, .72); background: #0a2118; }
.footer-grid { display: grid; gap: 34px; }
.footer-brand { max-width: 470px; }
.footer-brand .brand { color: var(--white); }
.footer-brand .brand-copy strong { max-width: none; }
.footer-brand p { margin: 17px 0 0; font-size: 13px; }
.footer-nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px 18px; }
.footer-nav a { min-height: 36px; display: flex; align-items: center; font-size: 13px; }
.footer-nav a:hover { color: var(--white); }
.footer-meta { margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .13); }
.footer-meta p { margin: 0; font-size: 11px; }
.footer-meta p + p { margin-top: 8px; }
#privacy-note { scroll-margin-top: 110px; }

.mobile-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  min-height: 72px;
  display: grid;
  grid-template-columns: .8fr 1fr 1.6fr;
  gap: 7px;
  padding: 7px max(8px, env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 -10px 30px rgba(23, 61, 43, .14);
  backdrop-filter: blur(15px);
}
.mobile-cta a, .mobile-cta button { min-width: 0; min-height: 56px; display: grid; place-items: center; padding: 7px 5px; border: 0; border-radius: 14px; text-align: center; font-size: 11px; font-weight: 900; line-height: 1.25; }
.mobile-cta__phone { color: var(--forest-700); background: var(--mint-100); }
.mobile-cta__line { color: var(--forest-700); background: var(--white); border: 1px solid var(--forest-700) !important; }
.mobile-cta__contact { color: var(--ink-950); background: var(--sun-500); }
.mobile-cta.is-no-phone { grid-template-columns: 1fr 1.55fr; }
.mobile-cta.is-no-line { grid-template-columns: .9fr 1.65fr; }
.mobile-cta.is-contact-only { grid-template-columns: 1fr; }
.mobile-cta.is-keyboard-open { transform: translateY(110%); }

.line-dialog { width: min(calc(100% - 30px), 560px); padding: 0; color: var(--ink-950); background: transparent; border: 0; border-radius: var(--radius-lg); }
.line-dialog::backdrop { background: rgba(13, 40, 29, .62); backdrop-filter: blur(4px); }
.line-dialog__panel { padding: 27px; background: var(--white); border-radius: var(--radius-lg); box-shadow: var(--shadow-float); }
.line-dialog__head { display: flex; justify-content: space-between; gap: 20px; align-items: start; }
.line-dialog h2 { margin: 0; font-size: 23px; }
.line-dialog__close { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; padding: 0; color: var(--forest-900); background: var(--mint-100); border: 0; border-radius: 50%; font-size: 24px; }
.line-dialog p { margin: 13px 0 0; color: var(--ink-650); font-size: 14px; }
.line-dialog label { display: block; margin-top: 20px; font-size: 13px; font-weight: 900; }
.line-dialog textarea { width: 100%; min-height: 125px; margin-top: 7px; padding: 13px; color: var(--ink-950); background: var(--canvas-50); border: 1px solid var(--line-300); border-radius: var(--radius-sm); resize: vertical; }
.line-dialog__actions { display: grid; gap: 10px; margin-top: 16px; }
.line-dialog__note { font-size: 11px !important; }

[data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .58s ease, transform .58s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }

@media (min-width: 36rem) {
  .hero-actions, .final-cta__actions { display: flex; flex-wrap: wrap; }
  .problem-grid, .reason-grid { grid-template-columns: repeat(2, 1fr); }
  .service-grid { grid-template-columns: repeat(2, 1fr); }
  .flow-grid { grid-template-columns: repeat(2, 1fr); }
  .area-card { padding: 38px; }
  .line-dialog__actions { grid-template-columns: 1fr auto; }
}

@media (min-width: 48rem) {
  .container { width: min(calc(100% - 52px), var(--container)); }
  .section { padding-block: 96px; }
  .brand-copy strong { max-width: 340px; font-size: 15px; }
  .brand-copy small { display: block; }
  .audience-list { grid-template-columns: repeat(4, 1fr); }
  .service-intro { grid-template-columns: 1.5fr .8fr; }
  .case-track { grid-auto-columns: minmax(310px, 43%); }
  .area-card { grid-template-columns: 1.15fr .85fr; align-items: center; }
  .footer-grid { grid-template-columns: 1.25fr .75fr; }
}

@media (min-width: 64rem) {
  :root { --header-height: 88px; }
  .top-assist { display: flex; }
  .site-header.is-scrolled { --header-height: 72px; }
  .container { width: min(calc(100% - 64px), var(--container)); }
  .section { padding-block: 116px; }
  .desktop-nav, .header-actions { display: flex; }
  .menu-button, .mobile-menu, .menu-backdrop, .mobile-cta { display: none; }
  .hero-inner { grid-template-columns: 1.08fr .92fr; min-height: 680px; gap: 54px; padding-block: 72px 92px; }
  .hero h1 { font-size: clamp(48px, 4.8vw, 66px); }
  .hero-lead { font-size: 18px; }
  .problem-grid, .reason-grid { grid-template-columns: repeat(4, 1fr); }
  .service-grid { grid-template-columns: repeat(4, 1fr); }
  .split { grid-template-columns: 1fr 1fr; gap: 76px; }
  .split--media-right .split-media { order: 2; }
  .case-track { grid-auto-flow: initial; grid-template-columns: repeat(4, 1fr); overflow: visible; padding-bottom: 0; }
  .flow-grid { grid-template-columns: repeat(7, 1fr); }
  .flow-step { min-height: 210px; padding: 74px 16px 20px; }
  .flow-step::before { left: 16px; top: 19px; }
  .maintenance-layout { grid-template-columns: .9fr 1.1fr; gap: 72px; }
  .faq-layout { grid-template-columns: .78fr 1.22fr; gap: 76px; }
  .final-cta { padding: 62px 66px; }
  .site-footer { padding-bottom: 62px; }
}

@media (max-width: 75rem) and (min-width: 64rem) {
  .desktop-nav { gap: 15px; font-size: 12px; }
  .header-actions .btn--secondary { display: none; }
}

@media (max-width: 24rem) {
  .container { width: min(calc(100% - 28px), var(--container)); }
  .brand-copy strong { max-width: 190px; }
  .hero h1 { font-size: 34px; }
  .maintenance-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
  [data-reveal] { opacity: 1; transform: none; }
}


/* WEB-GREEN-3 lower pages */
.breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:28px; color:var(--ink-650); font-size:12px; font-weight:800; }
.breadcrumb a:hover { color:var(--forest-700); text-decoration:underline; }
.page-hero { position:relative; overflow:hidden; padding:48px 0 62px; background:radial-gradient(circle at 88% 12%, rgba(166,199,106,.33), transparent 28%), linear-gradient(135deg,var(--canvas-100),#fff 58%,var(--mint-100)); }
.page-hero::after { content:""; position:absolute; width:360px; height:360px; right:-220px; bottom:-250px; border:1px solid rgba(77,124,87,.22); border-radius:50%; }
.page-hero__grid { position:relative; z-index:1; display:grid; gap:28px; align-items:end; }
.page-hero h1 { max-width:860px; margin:0; font-size:clamp(34px,8.4vw,60px); line-height:1.32; letter-spacing:-.035em; }
.page-hero__lead { max-width:760px; margin:18px 0 0; color:var(--ink-650); font-size:17px; font-weight:600; }
.page-hero__actions { display:grid; gap:10px; margin-top:26px; }
.page-hero__aside { padding:23px; background:rgba(255,255,255,.82); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); backdrop-filter:blur(10px); }
.page-hero__aside-mark { width:42px; height:42px; display:grid; place-items:center; color:var(--forest-900); background:var(--leaf-150); border-radius:14px; font-size:12px; font-weight:900; }
.page-hero__aside strong { display:block; margin-top:13px; font-size:17px; }
.page-hero__aside p { margin:5px 0 0; color:var(--ink-650); font-size:13px; }
.detail-grid { display:grid; gap:16px; margin-top:34px; }
.detail-card { position:relative; padding:27px 24px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.detail-card__number { display:inline-grid; place-items:center; width:42px; height:42px; color:var(--white); background:var(--forest-700); border-radius:14px; font-size:12px; font-weight:900; }
.detail-card h3 { margin:18px 0 8px; font-size:21px; }
.detail-card p { margin:0; color:var(--ink-650); font-size:14px; }
.check-list { display:grid; gap:8px; margin:18px 0 0; padding:0; list-style:none; }
.check-list li { position:relative; padding-left:26px; color:var(--ink-650); font-size:14px; }
.check-list li::before { content:"✓"; position:absolute; left:0; top:.15em; width:18px; height:18px; display:grid; place-items:center; color:var(--white); background:var(--leaf-500); border-radius:50%; font-size:10px; font-weight:900; }
.factor-list { display:grid; gap:10px; margin-top:26px; }
.factor-list > div { display:grid; grid-template-columns:68px 100px 1fr; gap:10px; align-items:center; padding:13px 0; border-bottom:1px solid var(--line-200); }
.factor-list span { color:var(--leaf-600); font-size:10px; font-weight:900; letter-spacing:.1em; }
.factor-list strong { font-size:14px; }
.factor-list p { margin:0; color:var(--ink-650); font-size:12px; }
.option-grid { display:grid; gap:14px; margin-top:30px; }
.option-card,.empty-feature-note { padding:23px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-md); }
.option-card strong,.empty-feature-note strong { display:block; color:var(--forest-900); }
.option-card p,.empty-feature-note p { margin:5px 0 0; color:var(--ink-650); font-size:13px; }
.empty-feature-note { grid-column:1/-1; background:rgba(255,255,255,.72); border-style:dashed; text-align:center; }
.option-grid:has(.option-card:not([hidden])) .empty-feature-note { display:none; }
.notice-grid { display:grid; gap:16px; }
.notice-card { padding:28px 25px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.notice-card--accent { background:var(--forest-900); border-color:var(--forest-900); color:var(--white); }
.notice-card--accent .check-list li,.notice-card--accent p { color:rgba(255,255,255,.76); }
.notice-card__icon { width:44px; height:44px; display:grid; place-items:center; color:var(--forest-900); background:var(--leaf-150); border-radius:14px; font-weight:900; }
.notice-card h2 { margin:17px 0 0; font-size:22px; }
.notice-card p { margin:10px 0 0; color:var(--ink-650); }
.case-detail-grid { display:grid; gap:20px; margin-top:34px; }
.case-detail-card { overflow:hidden; display:grid; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.case-detail-card figure { position:relative; margin:0; background:var(--mint-100); }
.case-detail-card figure img { width:100%; height:100%; min-height:240px; object-fit:cover; }
.case-detail-card figcaption { position:absolute; left:14px; bottom:14px; padding:6px 10px; background:rgba(255,255,255,.92); border-radius:999px; font-size:11px; font-weight:900; }
.case-detail-card > div { padding:25px; }
.case-detail-card > div > span { color:var(--leaf-600); font-size:10px; font-weight:900; letter-spacing:.1em; }
.case-detail-card h3 { margin:6px 0 8px; font-size:23px; }
.case-detail-card p { margin:0; color:var(--ink-650); font-size:14px; }
.pattern-grid { display:grid; gap:16px; margin-top:34px; }
.pattern-card { padding:26px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.pattern-card__scale { color:var(--leaf-600); font-size:10px; font-weight:900; letter-spacing:.12em; }
.pattern-card__visual { min-height:150px; display:flex; justify-content:center; align-items:end; gap:16px; margin:18px 0; padding:22px; background:linear-gradient(180deg,var(--mint-50),var(--canvas-100)); border-radius:var(--radius-md); }
.pattern-card__visual i { position:relative; width:56px; height:82px; display:block; background:linear-gradient(90deg,var(--forest-700) 0 4px,transparent 4px); border-bottom:24px solid #c99c6b; border-radius:50% 50% 10px 10px; }
.pattern-card__visual i::before,.pattern-card__visual i::after { content:""; position:absolute; width:34px; height:50px; top:4px; background:var(--leaf-500); border-radius:100% 0 100% 0; }
.pattern-card__visual i::before { left:2px; transform:rotate(-24deg); }
.pattern-card__visual i::after { right:2px; transform:rotate(82deg); }
.pattern-card__visual--2 i:nth-child(2){ height:110px; transform:scale(1.12); }
.pattern-card__visual--3 i:first-child{ transform:scale(1.3); }
.pattern-card h3 { margin:0; font-size:20px; }
.pattern-card p { margin:8px 0 0; color:var(--ink-650); font-size:13px; }
.photo-guide { display:grid; gap:32px; align-items:center; }
.photo-guide figure { margin:0; }
.photo-guide figure img { width:100%; border-radius:var(--radius-xl); box-shadow:var(--shadow-card); }
.photo-guide figcaption { margin-top:8px; color:var(--ink-650); font-size:11px; }
.photo-steps { display:grid; gap:12px; margin:24px 0 0; padding:0; list-style:none; }
.photo-steps li { display:flex; gap:13px; align-items:flex-start; padding:14px; background:rgba(255,255,255,.76); border:1px solid var(--line-200); border-radius:var(--radius-md); }
.photo-steps li > span { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; color:var(--white); background:var(--forest-700); border-radius:50%; font-size:12px; font-weight:900; }
.photo-steps strong { display:block; }
.photo-steps p { margin:3px 0 0; color:var(--ink-650); font-size:12px; }
.flow-detail-list { display:grid; gap:13px; margin-top:34px; counter-reset:detailflow; }
.flow-detail-card { display:grid; grid-template-columns:52px 1fr; gap:16px; padding:22px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-md); box-shadow:var(--shadow-card); }
.flow-detail-card > span { width:48px; height:48px; display:grid; place-items:center; color:var(--white); background:var(--forest-700); border-radius:16px; font-size:12px; font-weight:900; }
.flow-detail-card h3 { margin:0; font-size:19px; }
.flow-detail-card p { margin:5px 0 0; color:var(--ink-650); font-size:13px; }
.two-column-info { display:grid; gap:18px; }
.info-panel { padding:30px 26px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.info-panel--mint { background:var(--mint-50); }
.info-panel h2 { margin:0; font-size:25px; }
.info-panel > p:not(.section-label):not(.panel-note) { color:var(--ink-650); }
.panel-note { margin:18px 0 0; padding:12px 14px; color:var(--forest-900); background:var(--leaf-150); border-radius:var(--radius-sm); font-size:12px; font-weight:800; }
.prep-grid { display:grid; gap:14px; margin-top:32px; }
.prep-grid article { padding:25px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); }
.prep-grid article > span { color:var(--sun-600); font-size:11px; font-weight:900; letter-spacing:.1em; }
.prep-grid h3 { margin:10px 0 7px; font-size:19px; }
.prep-grid p { margin:0; color:var(--ink-650); font-size:13px; }
.mini-timeline { display:grid; gap:12px; margin-top:24px; }
.mini-timeline > div { padding:16px 18px; border-left:4px solid var(--leaf-500); background:var(--canvas-50); border-radius:0 var(--radius-sm) var(--radius-sm) 0; }
.mini-timeline span { color:var(--leaf-600); font-size:10px; font-weight:900; letter-spacing:.1em; }
.mini-timeline strong { display:block; margin-top:2px; }
.mini-timeline p { margin:3px 0 0; color:var(--ink-650); font-size:12px; }
.maintenance-detail-grid { display:grid; gap:14px; margin-top:34px; }
.maintenance-detail-card { padding:23px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-md); }
.maintenance-detail-card > span { color:var(--leaf-600); font-size:10px; font-weight:900; letter-spacing:.1em; }
.maintenance-detail-card h3 { margin:8px 0 5px; font-size:19px; }
.maintenance-detail-card p { margin:0; color:var(--ink-650); font-size:13px; }
.feature-list { display:grid; gap:10px; margin:24px 0 0; padding:0; list-style:none; }
.feature-list li { padding:15px 17px; background:var(--canvas-50); border:1px solid var(--line-200); border-radius:var(--radius-sm); }
.feature-list strong,.feature-list span { display:block; }
.feature-list span { margin-top:3px; color:var(--ink-650); font-size:12px; }
.role-compare { display:grid; gap:18px; margin-top:34px; }
.role-compare article { padding:28px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.role-compare__label { color:var(--leaf-600); font-size:10px; font-weight:900; letter-spacing:.1em; }
.role-compare h3 { margin:9px 0 0; font-size:22px; }
.report-feature { display:grid; gap:38px; align-items:center; }
.report-feature h2 { margin:0; font-size:clamp(30px,7vw,50px); line-height:1.4; }
.report-feature p { color:rgba(255,255,255,.76); }
.report-feature__actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.report-feature__note { font-size:11px; }
.report-phone { width:min(100%,340px); margin-inline:auto; padding:18px; color:var(--ink-950); background:var(--white); border:8px solid #0a2118; border-radius:34px; box-shadow:0 30px 70px rgba(0,0,0,.25); }
.report-phone__top { padding:10px; color:var(--white); background:var(--forest-700); border-radius:18px 18px 10px 10px; text-align:center; font-weight:900; }
.report-phone__plant { margin-top:12px; padding:18px; background:var(--mint-100); border-radius:14px; }
.report-phone__plant span,.report-phone__plant strong { display:block; }
.report-phone__plant span { color:var(--ink-650); font-size:11px; }
.report-phone__row { display:flex; justify-content:space-between; gap:12px; padding:13px 3px; border-bottom:1px solid var(--line-200); font-size:12px; }
.report-phone__row em { color:var(--leaf-600); font-style:normal; font-weight:900; }
.report-phone__button { margin-top:14px; padding:11px; background:var(--sun-500); border-radius:999px; text-align:center; font-size:12px; font-weight:900; }
.area-large-card { overflow:hidden; display:grid; gap:30px; padding:30px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); }
.area-large-card h2 { margin:0; font-size:29px; }
.area-large-card p { color:var(--ink-650); }
.area-large-card__region { display:inline-flex; margin:12px 0 !important; padding:10px 15px; color:var(--forest-900) !important; background:var(--leaf-150); border-radius:999px; font-weight:900; }
.area-map-visual { min-height:300px; display:grid; place-items:center; align-content:center; gap:10px; background:linear-gradient(145deg,var(--mint-100),var(--canvas-100)); border-radius:var(--radius-lg); text-align:center; }
.area-map-visual__rings { position:relative; width:190px; height:190px; }
.area-map-visual__rings i { position:absolute; inset:0; border:1px solid rgba(77,124,87,.3); border-radius:50%; }
.area-map-visual__rings i:nth-child(2){ inset:32px; }
.area-map-visual__rings i:nth-child(3){ inset:67px; background:var(--forest-700); border:0; box-shadow:0 0 0 14px rgba(77,124,87,.12); }
.area-map-visual > span { color:var(--forest-900); font-weight:900; }
.area-map-visual > small { color:var(--ink-650); font-size:9px; font-weight:900; letter-spacing:.16em; }
.store-info-layout { display:grid; gap:30px; align-items:start; }
.store-info { margin:0; overflow:hidden; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.store-info > div { display:grid; grid-template-columns:110px 1fr; gap:16px; padding:17px 20px; border-bottom:1px solid var(--line-200); }
.store-info > div:last-child { border-bottom:0; }
.store-info dt { color:var(--ink-650); font-size:12px; font-weight:800; }
.store-info dd { margin:0; font-weight:800; }
.map-placeholder { margin-top:22px; min-height:260px; display:grid; place-items:center; align-content:center; padding:30px; background:var(--mint-50); border:1px dashed var(--leaf-500); border-radius:var(--radius-lg); text-align:center; }
.map-placeholder p { margin:5px 0 0; color:var(--ink-650); font-size:13px; }
.faq-filter { display:flex; gap:8px; overflow-x:auto; padding-bottom:8px; scrollbar-width:thin; }
.faq-filter button { flex:0 0 auto; min-height:42px; padding:8px 16px; color:var(--forest-700); background:var(--white); border:1px solid var(--line-300); border-radius:999px; font-size:12px; font-weight:900; }
.faq-filter button.is-active { color:var(--white); background:var(--forest-700); border-color:var(--forest-700); }
.faq-full-list { display:grid; gap:11px; margin-top:24px; }
.faq-full-list .faq-question small { display:block; margin-bottom:3px; color:var(--leaf-600); font-size:10px; letter-spacing:.08em; }
.faq-full-list .faq-question { min-height:82px; }
.policy-document { max-width:900px; margin-inline:auto; padding:28px 24px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); }
.policy-alert { padding:18px; color:var(--forest-900); background:var(--leaf-150); border-radius:var(--radius-md); }
.policy-alert p { margin:5px 0 0; font-size:13px; }
.policy-document section { padding:28px 0; border-bottom:1px solid var(--line-200); }
.policy-document h2 { margin:0; font-size:21px; }
.policy-document p,.policy-document li { color:var(--ink-650); font-size:14px; }
.policy-document ul { padding-left:1.4em; }
.policy-contact { margin:18px 0 0; }
.policy-contact > div { display:grid; grid-template-columns:120px 1fr; gap:12px; padding:10px 0; border-bottom:1px solid var(--line-200); }
.policy-contact dt { color:var(--ink-650); font-size:12px; font-weight:800; }
.policy-contact dd { margin:0; }
.policy-date { margin:24px 0 0; text-align:right; }
.not-found { min-height:70vh; display:grid; place-items:center; padding:70px 0; background:linear-gradient(135deg,var(--canvas-100),var(--mint-100)); }
.not-found__card { max-width:760px; margin-inline:auto; padding:42px 28px; background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-xl); box-shadow:var(--shadow-float); text-align:center; }
.not-found__code { display:block; color:var(--leaf-500); font-size:clamp(72px,20vw,160px); font-weight:900; line-height:1; letter-spacing:-.08em; }
.not-found h1 { margin:12px 0 0; font-size:clamp(28px,7vw,48px); }
.not-found p { color:var(--ink-650); }
.not-found__actions { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:26px; }

@media (min-width:36rem){
  .page-hero__actions{display:flex;flex-wrap:wrap}.detail-grid--4,.maintenance-detail-grid{grid-template-columns:repeat(2,1fr)}.notice-grid,.two-column-info,.role-compare{grid-template-columns:repeat(2,1fr)}.pattern-grid,.prep-grid--3{grid-template-columns:repeat(3,1fr)}.prep-grid{grid-template-columns:repeat(2,1fr)}.policy-document{padding:44px 48px}
}
@media (min-width:48rem){
  .page-hero{padding:64px 0 76px}.page-hero__grid{grid-template-columns:1.35fr .65fr;gap:46px}.case-detail-card{grid-template-columns:.9fr 1.1fr}.case-detail-card:nth-child(even){grid-template-columns:1.1fr .9fr}.case-detail-card:nth-child(even) figure{order:2}.photo-guide,.area-large-card,.store-info-layout{grid-template-columns:1fr 1fr}.flow-detail-card{grid-template-columns:68px 1fr;padding:27px 30px}.flow-detail-card > span{width:56px;height:56px}.prep-grid{grid-template-columns:repeat(4,1fr)}.prep-grid--3{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:64rem){
  .detail-grid--4{grid-template-columns:repeat(4,1fr)}.case-detail-card > div{padding:40px}.pattern-grid{grid-template-columns:repeat(3,1fr)}.flow-detail-list{grid-template-columns:repeat(2,1fr)}.maintenance-detail-grid{grid-template-columns:repeat(4,1fr)}.report-feature{grid-template-columns:1.25fr .75fr}.area-large-card{padding:48px}.store-info-layout{grid-template-columns:.7fr 1.3fr}.policy-document{padding:56px 64px}
}
@media (max-width:30rem){
  .factor-list > div{grid-template-columns:56px 1fr}.factor-list p{grid-column:1/-1}.store-info > div,.policy-contact > div{grid-template-columns:1fr;gap:3px}.case-detail-card figure img{min-height:210px}
}


/* ========================================================================== 
   WEB-GREEN-4 inquiry / thanks
   ========================================================================== */
.contact-hero { background:linear-gradient(135deg,var(--canvas-100),var(--mint-100)); }
.contact-trust-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.contact-trust-row span { padding:7px 12px; color:var(--forest-900); background:rgba(255,255,255,.76); border:1px solid var(--line-200); border-radius:999px; font-size:11px; font-weight:900; }
.contact-api-card .api-state { display:inline-flex; margin-top:10px; padding:6px 10px; color:var(--ink-650); background:var(--canvas-50); border-radius:999px; font-size:10px; font-weight:900; }
.contact-api-card .api-state[data-tone="success"] { color:var(--forest-900); background:var(--leaf-150); }
.contact-api-card .api-state[data-tone="warning"] { color:#7a4a16; background:#fff0d9; }
.contact-layout { display:grid; gap:28px; align-items:start; }
.contact-guide { padding:28px; background:var(--forest-950); color:var(--white); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); }
.contact-guide h2 { margin:0; font-size:clamp(25px,5vw,35px); }
.contact-guide__steps { display:grid; gap:18px; margin:26px 0 0; padding:0; list-style:none; }
.contact-guide__steps li { display:grid; grid-template-columns:38px 1fr; gap:12px; align-items:start; }
.contact-guide__steps li > span { width:38px; height:38px; display:grid; place-items:center; color:var(--forest-950); background:var(--leaf-300); border-radius:13px; font-size:12px; font-weight:900; }
.contact-guide__steps strong { display:block; }
.contact-guide__steps p { margin:2px 0 0; color:rgba(255,255,255,.72); font-size:12px; }
.contact-guide__notice { margin-top:28px; padding:17px; color:var(--forest-950); background:var(--leaf-150); border-radius:var(--radius-md); }
.contact-guide__notice p { margin:5px 0 0; font-size:12px; }
.inquiry-form { position:relative; padding:clamp(24px,5vw,48px); background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-xl); box-shadow:var(--shadow-card); }
.inquiry-form.is-submitting::after { content:""; position:absolute; inset:0; background:rgba(255,255,255,.45); border-radius:inherit; pointer-events:none; }
.form-alert { padding:15px 17px; border-radius:var(--radius-sm); font-size:13px; font-weight:700; }
.form-alert--error { margin-bottom:24px; color:#791f1f; background:#fff0f0; border:1px solid #e5b6b6; }
.form-alert--warning { color:#71450f; background:#fff3df; border:1px solid #efcf9a; }
.submission-status { margin-bottom:22px; padding:12px 15px; color:var(--forest-900); background:var(--mint-100); border-radius:var(--radius-sm); font-size:13px; font-weight:800; }
.submission-status[data-tone="error"] { color:#791f1f; background:#fff0f0; }
.submission-status[data-tone="loading"]::before { content:""; display:inline-block; width:12px; height:12px; margin-right:8px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:green-spin .75s linear infinite; }
@keyframes green-spin { to { transform:rotate(360deg); } }
.form-section { padding:0 0 38px; margin:0 0 38px; border-bottom:1px solid var(--line-200); }
.form-section:last-of-type { margin-bottom:20px; }
.form-section__title { display:flex; gap:14px; align-items:flex-start; margin-bottom:23px; }
.form-section__title > span { flex:0 0 42px; width:42px; height:42px; display:grid; place-items:center; color:var(--white); background:var(--forest-700); border-radius:14px; font-size:11px; font-weight:900; }
.form-section__title h2 { margin:0; font-size:23px; }
.form-section__title p { margin:2px 0 0; color:var(--ink-650); font-size:12px; }
.form-grid { display:grid; gap:18px; }
.form-grid--spaced { margin-top:24px; }
.form-field--full { grid-column:1/-1; }
.inquiry-form label { display:grid; gap:8px; color:var(--ink-800); font-size:13px; font-weight:900; }
.inquiry-form label small { color:var(--ink-500); font-size:10px; font-weight:700; }
.inquiry-form label em,.consent-row em { color:var(--error-700); font-size:10px; font-style:normal; }
.inquiry-form input:not([type="checkbox"]):not([type="file"]),.inquiry-form select,.inquiry-form textarea { width:100%; min-height:50px; padding:12px 14px; color:var(--ink-950); background:var(--white); border:1px solid var(--line-300); border-radius:var(--radius-sm); outline:none; transition:border-color .18s,box-shadow .18s; }
.inquiry-form textarea { min-height:155px; resize:vertical; }
.inquiry-form input:focus,.inquiry-form select:focus,.inquiry-form textarea:focus { border-color:var(--leaf-500); box-shadow:0 0 0 4px rgba(77,124,87,.13); }
.inquiry-form input:user-invalid,.inquiry-form select:user-invalid,.inquiry-form textarea:user-invalid { border-color:#c46b6b; }
.honeypot { position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important; clip:rect(0 0 0 0)!important; opacity:0!important; }
.category-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.category-choice-grid button { min-height:112px; display:grid; align-content:center; justify-items:start; padding:16px; color:var(--ink-950); background:var(--canvas-50); border:1px solid var(--line-200); border-radius:var(--radius-md); text-align:left; transition:.18s ease; }
.category-choice-grid button:hover { transform:translateY(-2px); border-color:var(--leaf-500); }
.category-choice-grid button.is-selected { color:var(--forest-900); background:var(--leaf-150); border-color:var(--leaf-500); box-shadow:0 0 0 2px rgba(77,124,87,.12); }
.category-choice-grid b { font-size:22px; }
.category-choice-grid strong { margin-top:5px; font-size:13px; }
.category-choice-grid small { color:var(--ink-650); font-size:10px; }
.field-help { margin:12px 0 0; color:var(--ink-650); font-size:11px; }
.photo-uploader { display:grid; gap:14px; align-items:center; padding:22px; background:var(--mint-50); border:2px dashed var(--leaf-300); border-radius:var(--radius-lg); }
.photo-uploader__icon { width:58px; height:58px; display:grid; place-items:center; color:var(--forest-900); background:var(--leaf-150); border-radius:18px; font-size:11px; font-weight:900; }
.photo-uploader p { margin:3px 0 0; color:var(--ink-650); font-size:11px; }
.photo-uploader .btn { justify-self:start; }
.photo-count { color:var(--forest-700); font-size:11px; font-weight:900; }
.photo-preview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:16px; }
.photo-preview-item { position:relative; overflow:hidden; margin:0; aspect-ratio:1; background:var(--canvas-100); border:1px solid var(--line-200); border-radius:var(--radius-md); }
.photo-preview-item img { width:100%; height:100%; object-fit:cover; }
.photo-preview-item figcaption { position:absolute; left:7px; bottom:7px; padding:4px 7px; color:var(--white); background:rgba(13,40,29,.82); border-radius:999px; font-size:9px; }
.photo-remove { position:absolute; right:7px; top:7px; min-height:34px; padding:5px 10px; color:var(--white); background:rgba(163,55,55,.92); border:0; border-radius:999px; font-size:10px; font-weight:900; }
.consent-row { display:flex!important; grid-template-columns:none!important; gap:12px!important; align-items:flex-start; padding:17px; background:var(--canvas-50); border:1px solid var(--line-200); border-radius:var(--radius-md); font-weight:700!important; }
.consent-row input { flex:0 0 auto; width:22px; height:22px; margin-top:2px; accent-color:var(--forest-700); }
.consent-row a { color:var(--forest-700); text-decoration:underline; text-underline-offset:3px; }
.consent-row--photo { margin-top:16px; background:#fff7e9; border-color:#ebcf9c; }
.form-submit-area { text-align:center; }
.form-submit-area p { max-width:650px; margin:0 auto 17px; color:var(--ink-650); font-size:11px; }
.btn--submit { width:100%; min-height:62px; font-size:16px; }
.btn:disabled { cursor:wait; opacity:.62; }
.thanks-section { min-height:72vh; display:grid; align-items:center; padding:70px 0 100px; background:linear-gradient(135deg,var(--canvas-100),var(--mint-100)); }
.thanks-card { max-width:820px; margin-inline:auto; padding:clamp(28px,6vw,58px); background:var(--white); border:1px solid var(--line-200); border-radius:var(--radius-xl); box-shadow:var(--shadow-float); text-align:center; }
.thanks-icon { width:74px; height:74px; display:grid; place-items:center; margin:0 auto 18px; color:var(--white); background:var(--forest-700); border-radius:50%; font-size:34px; font-weight:900; box-shadow:0 15px 30px rgba(23,61,43,.22); }
.thanks-card h1 { margin:0; font-size:clamp(30px,7vw,48px); }
.thanks-lead { color:var(--ink-650); }
.reception-card { display:grid; gap:7px; margin:30px 0; padding:25px; background:var(--forest-950); color:var(--white); border-radius:var(--radius-lg); }
.reception-card span { color:var(--leaf-300); font-size:11px; font-weight:900; letter-spacing:.12em; }
.reception-card strong { overflow-wrap:anywhere; font-size:clamp(23px,6vw,38px); letter-spacing:.04em; }
.reception-card button { justify-self:center; padding:8px 14px; color:var(--forest-950); background:var(--leaf-300); border:0; border-radius:999px; font-size:11px; font-weight:900; }
.thanks-next { margin:32px 0 0; padding:25px; background:var(--canvas-50); border-radius:var(--radius-lg); text-align:left; }
.thanks-next h2 { margin:0; text-align:center; }
.thanks-next ol { display:grid; gap:18px; margin:22px 0 0; padding:0; list-style:none; }
.thanks-next li { display:grid; grid-template-columns:38px 1fr; gap:12px; }
.thanks-next li > span { width:38px; height:38px; display:grid; place-items:center; color:var(--white); background:var(--leaf-500); border-radius:13px; font-size:12px; font-weight:900; }
.thanks-next p { margin:2px 0 0; color:var(--ink-650); font-size:12px; }
.thanks-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:28px; }
.thanks-note { margin:22px 0 0; color:var(--ink-500); font-size:11px; }

@media (min-width:36rem){
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.photo-preview{grid-template-columns:repeat(4,minmax(0,1fr))}.photo-uploader{grid-template-columns:auto 1fr auto auto}.photo-uploader .btn{justify-self:auto}
}
@media (min-width:64rem){
  .contact-layout{grid-template-columns:minmax(260px,.72fr) minmax(0,1.55fr);gap:38px}.contact-guide{position:sticky;top:104px}.category-choice-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:30rem){
  .inquiry-form{padding:22px 16px}.form-section__title > span{width:38px;height:38px;flex-basis:38px}.category-choice-grid button{min-height:102px;padding:13px}.photo-uploader{padding:18px}.thanks-actions .btn{width:100%}
}


/* WEB-GREEN-5 / LINE & CUSTOMER ROUTES */
.line-route-section{background:linear-gradient(135deg,var(--forest-950),#153f2d);color:var(--white)}
.line-route-layout{display:grid;gap:34px;align-items:center}.line-route-copy .section-label,.line-route-copy .section-title{color:var(--white)}.line-route-copy .section-lead{color:rgba(255,255,255,.74)}
.line-route-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}.line-route-mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-xl)}
.line-route-mini a{min-height:94px;display:grid;align-content:center;padding:15px;background:var(--white);color:var(--forest-950);border-radius:16px}.line-route-mini span{color:var(--leaf-600);font-size:10px;font-weight:900;letter-spacing:.12em}.line-route-mini strong{font-size:13px}
.line-page-hero{background:radial-gradient(circle at 86% 15%,rgba(166,199,106,.32),transparent 30%),linear-gradient(135deg,var(--canvas-100),var(--mint-100))}.line-page-hero .page-hero__inner{min-height:560px}
.line-status-card{display:grid;gap:10px}.line-status-card>span{color:var(--leaf-600);font-size:10px;font-weight:900;letter-spacing:.13em}.line-status-card>strong{font-size:20px;line-height:1.5}.line-status-row{display:flex;gap:9px;align-items:center;margin-top:8px;padding:12px;background:var(--mint-100);border-radius:12px;color:var(--forest-700);font-size:11px;font-weight:800}.line-status-row i{width:10px;height:10px;background:var(--leaf-500);border-radius:50%}
.line-audience-grid{display:grid;gap:18px;margin-top:34px}.line-audience-card{padding:clamp(25px,5vw,40px);background:var(--white);border:1px solid var(--line-200);border-radius:var(--radius-xl);box-shadow:var(--shadow-card)}.line-audience-card--member{background:var(--forest-950);color:var(--white)}.line-audience-card--member p,.line-audience-card--member .check-list li{color:rgba(255,255,255,.74)}.line-audience-card__tag{display:inline-flex;padding:6px 11px;background:var(--leaf-150);color:var(--forest-900);border-radius:999px;font-size:10px;font-weight:900}.line-audience-card h3{margin:17px 0 8px;font-size:clamp(24px,4vw,34px)}.line-audience-card>p{color:var(--ink-650)}.line-audience-card__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.rich-menu-layout{display:grid;gap:36px;align-items:center}.rich-menu-notice{margin-top:25px;padding:19px;background:var(--mint-100);border-radius:var(--radius-md)}.rich-menu-notice p{margin:4px 0 0;color:var(--ink-650);font-size:13px}.rich-menu-phone{width:min(100%,480px);justify-self:center;padding:18px;background:var(--forest-950);border:8px solid #0a1d15;border-radius:38px;box-shadow:var(--shadow-float)}.rich-menu-phone__top{display:flex;gap:11px;align-items:center;padding:13px;color:var(--white)}.rich-menu-phone__top .brand-mark{flex-basis:38px;width:38px;height:38px}.rich-menu-phone__top strong{display:block;font-size:12px}.rich-menu-phone__top small{display:block;color:rgba(255,255,255,.66);font-size:9px}.rich-menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;overflow:hidden;border-radius:18px}.rich-menu-grid a,.rich-menu-grid button{min-height:112px;display:grid;align-content:center;justify-items:start;padding:16px;color:var(--forest-950);background:var(--white);border:0;text-align:left}.rich-menu-grid a:nth-child(2),.rich-menu-grid button:nth-child(3),.rich-menu-grid button:nth-child(6){background:var(--leaf-150)}.rich-menu-grid b{color:var(--leaf-600);font-size:10px}.rich-menu-grid span{font-weight:900}.rich-menu-grid small{color:var(--ink-650);font-size:9px}.rich-menu-phone>p{margin:12px 6px 0;color:rgba(255,255,255,.62);font-size:9px;text-align:center}
.portal-showcase{display:grid;gap:38px;align-items:center}.portal-window{overflow:hidden;background:var(--white);border:1px solid var(--line-200);border-radius:26px;box-shadow:var(--shadow-float)}.portal-window__bar{display:flex;gap:6px;align-items:center;padding:12px 16px;background:var(--forest-950);color:var(--white);font-size:10px}.portal-window__bar span{width:8px;height:8px;background:rgba(255,255,255,.45);border-radius:50%}.portal-window__bar b{margin-left:auto}.portal-window__hero{padding:28px;color:var(--white);background:linear-gradient(135deg,var(--forest-800),var(--forest-950))}.portal-window__hero p{margin:0;color:var(--leaf-300);font-size:10px;font-weight:900;letter-spacing:.12em}.portal-window__hero h3{margin:8px 0 0;font-size:clamp(24px,5vw,34px)}.portal-window__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-200)}.portal-window__stats span{display:grid;place-items:center;padding:17px 8px;background:var(--white);font-size:9px}.portal-window__stats strong{font-size:21px;color:var(--forest-700)}.portal-window__rows{padding:18px}.portal-window__rows p{display:flex;justify-content:space-between;gap:15px;margin:0;padding:13px 0;border-bottom:1px solid var(--line-200);font-size:11px}.portal-window__rows span{color:var(--leaf-600);font-weight:800}.image-caption{color:var(--ink-650);font-size:10px;text-align:center}.portal-feature-list{display:grid;gap:11px;margin-top:25px}.portal-feature-list article{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start;padding:15px;background:rgba(255,255,255,.76);border:1px solid var(--line-200);border-radius:14px}.portal-feature-list article>span{width:40px;height:40px;display:grid;place-items:center;color:var(--white);background:var(--forest-700);border-radius:12px;font-size:10px;font-weight:900}.portal-feature-list p{margin:2px 0 0;color:var(--ink-650);font-size:11px}.portal-action-card{display:grid;gap:14px;margin-top:22px;padding:20px;background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}.portal-action-card p{margin:3px 0 0;color:var(--ink-650);font-size:10px}.portal-action-card p[data-ready="true"]{color:var(--leaf-600)}
.message-template-grid{display:grid;gap:15px;margin-top:32px}.message-template-card{display:grid;align-content:start;padding:23px;background:var(--white);border:1px solid var(--line-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.message-template-card>span{color:var(--leaf-600);font-size:9px;font-weight:900;letter-spacing:.13em}.message-template-card h3{margin:9px 0}.message-template-card p{min-height:96px;margin:0 0 18px;padding:14px;color:var(--ink-650);background:var(--canvas-50);border-radius:12px;font-size:11px;white-space:pre-wrap}.message-template-card .btn{justify-self:start}
@media(min-width:42rem){.line-route-mini{grid-template-columns:repeat(3,minmax(0,1fr))}.line-audience-grid,.message-template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portal-action-card{grid-template-columns:1fr auto;align-items:center}}
@media(min-width:64rem){.line-route-layout{grid-template-columns:1fr .85fr}.rich-menu-layout{grid-template-columns:1fr .82fr}.portal-showcase{grid-template-columns:.92fr 1fr}.line-audience-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.message-template-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.desktop-nav{gap:17px;font-size:12px}}
@media(max-width:35rem){.line-route-actions .btn,.line-audience-card__actions .btn{width:100%}.rich-menu-grid a,.rich-menu-grid button{min-height:102px;padding:13px}.portal-action-card .btn{width:100%}}


/* WEB-GREEN-6: CSP-compatible utilities */
.section-label--light{color:var(--leaf-300)}
.clipboard-fallback{position:fixed;inset:auto auto 0 0;opacity:0;pointer-events:none}
.status-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--canvas)}
.status-card{width:min(680px,100%);padding:42px 30px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow-md);text-align:center}
.status-card h1{margin:0 0 14px;font-size:clamp(26px,5vw,40px);line-height:1.35}
.status-card p{margin:0 0 26px;line-height:1.9;color:var(--ink-600)}
.status-card small{display:block;margin-top:18px;color:var(--ink-500)}
.status-mark{width:54px;height:54px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:var(--leaf-100);color:var(--forest);font-size:28px;font-weight:800}
