@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@700;900&family=Yomogi&family=Zen+Maru+Gothic:wght@500;700;900&display=swap');

:root {
  --blue: #0068b7;
  --deep-blue: #004c87;
  --green: #1a977e;
  --deep-green: #0c5547;
  --orange: #ff4514;
  --cta-green: #13bc4b;
  --cream: #fff6ec;
  --pale-blue: #edf7ff;
  --ink: #1d2c36;
  --muted: #5b6973;
  --line: #dce5eb;
  --paper: #fff;
  --shadow: 0 13px 34px rgba(3, 56, 96, .11);
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  color: var(--ink);
  background: #fff;
  line-height: 1.75;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
main { overflow: hidden; }
.container { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
.narrow { width: min(800px, calc(100% - 40px)); }
.skip { position: fixed; top: -100px; left: 8px; z-index: 100; padding: 8px 14px; background: #fff; color: var(--blue); }
.skip:focus { top: 8px; }

.site-header { position: relative; z-index: 20; background: #fff; box-shadow: 0 3px 18px rgba(0,0,0,.08); }
.header-top { width: min(1240px, calc(100% - 32px)); min-height: 92px; margin: auto; display: flex; align-items: center; gap: 22px; }
.logo { display: inline-flex; align-items: center; flex-shrink: 0; }
.logo__image { display: block; width: auto; max-width: none; object-fit: contain; }
.logo--header .logo__image { height: 76px; }
.phone { margin-left: auto; display: grid; text-align: center; line-height: 1.2; }
.phone small { font-size: 11px; }
.phone a { color: var(--blue); font-size: clamp(19px, 2vw, 28px); font-weight: 900; letter-spacing: .04em; }
.button { display: inline-flex; min-height: 52px; padding: 10px 18px; align-items: center; justify-content: center; gap: 12px; border-radius: 6px; background: var(--blue); color: #fff; font-weight: 800; line-height: 1.35; transition: transform .2s, filter .2s; }
.button--orange { background: var(--orange); box-shadow: 0 6px 0 #c8320c; }
.button--green { background: var(--cta-green); box-shadow: 0 5px 0 #0d9138; max-width: 240px; text-align: center; }
.button--line { background: #06c755; box-shadow: 0 5px 0 #049f44; }
.header-line { display: grid; width: 64px; height: 64px; flex: 0 0 64px; place-items: center; overflow: hidden; border-radius: 14px; box-shadow: 0 4px 0 #049f44; transition: transform .2s, filter .2s; }
.header-line img { display: block; width: 100%; height: 100%; object-fit: cover; }
.header-line:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.button--outline { color: var(--blue); background: #fff; border: 2px solid var(--blue); box-shadow: none; }
.button--white { color: var(--blue); background: #fff; box-shadow: none; }
.button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 5px var(--deep-blue);
}
.button--outline:focus-visible { color: #fff; background: var(--blue); }
.button--white:focus-visible { color: var(--deep-blue); background: var(--pale-blue); }

@media (hover: hover) and (pointer: fine) {
  .button:hover { color: #fff; transform: translateY(-2px); filter: brightness(1.06); }
  .button--outline:hover { color: #fff; background: var(--blue); }
  .button--white:hover { color: var(--deep-blue); background: var(--pale-blue); }
}
.global-nav { background: var(--blue); display: flex; justify-content: center; overflow: auto; }
.global-nav a { padding: 12px 17px; color: #fff; font-size: 13px; font-weight: 700; white-space: nowrap; border-left: 1px solid rgba(255,255,255,.22); }
.global-nav a:hover { background: var(--deep-blue); }
.menu-toggle { display: none; }

.breadcrumbs { width: min(1160px, calc(100% - 40px)); margin: 16px auto 0; display: flex; gap: 9px; color: var(--muted); font-size: 13px; }
.breadcrumbs a { text-decoration: underline; color: var(--blue); }
.home-hero, .page-hero { position: relative; background: linear-gradient(125deg, #eaf8ff 0%, #fff 51%, #e7f5ee 100%); }
.home-hero .container, .page-hero .container { min-height: 560px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 38px; }
.home-hero h1, .page-hero h1 { margin: 8px 0 18px; color: var(--blue); font-size: clamp(35px, 5.2vw, 68px); line-height: 1.25; letter-spacing: .04em; }
.home-hero h1 span, .page-hero h1 span, .section-heading h2 span { color: var(--orange); }
.home-hero h1 span { font-family: "Noto Sans JP", "Arial Black", sans-serif; }
.ribbon { display: inline-block; margin: 0; padding: 5px 14px; background: #ffdc54; color: #3b3121; font-size: 12px; font-weight: 800; transform: rotate(-2deg); }
.eyebrow { margin: 0 0 7px; color: var(--green); font-size: 12px; letter-spacing: .16em; font-weight: 900; }
.hero-lead { max-width: 600px; font-weight: 600; }
.hero-image { margin: 0; position: relative; filter: drop-shadow(0 20px 20px rgba(0, 75, 120, .15)); }
.hero-image img { border-radius: 22px; }
.badge-row { display: flex; gap: 13px; margin: 18px 0; }
.badge-row b, .voice-summary b { width: 100px; height: 100px; display: grid; place-content: center; text-align: center; border-radius: 50%; background: #fff; color: var(--orange); border: 4px solid var(--orange); font-size: 32px; line-height: 1; transform: rotate(-7deg); }
.badge-row small, .voice-summary small { display: block; color: var(--ink); font-size: 10px; line-height: 1.3; }
.button-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 23px; }
.hero-phone { display: grid; color: var(--blue); font-weight: 900; font-size: 27px; line-height: 1.2; }
.hero-phone small { color: var(--ink); font-size: 11px; font-weight: 500; }
.feature-strip { border-bottom: 1px solid var(--line); background: #fff; }
.feature-strip .container { display: grid; grid-template-columns: repeat(5, 1fr); }
.feature-strip article { min-height: 130px; padding: 17px 13px; text-align: center; border-left: 1px solid var(--line); display: grid; align-content: center; gap: 4px; }
.feature-strip article:last-child { border-right: 1px solid var(--line); }
.feature-strip i { color: var(--green); font-size: 26px; font-style: normal; }
.feature-strip small { color: var(--muted); font-size: 11px; }
.feature-strip strong { color: var(--blue); font-size: 14px; line-height: 1.4; }

.section { padding: clamp(60px, 8vw, 110px) 0; }
.section--cream { background: var(--cream); }
.section--blue { background: var(--pale-blue); }
.section--green { background: var(--deep-green); color: #fff; }
.section--green .eyebrow { color: #bde8da; }
.section--green .section-heading h2 { color: #fff; }
.section-heading { max-width: 770px; margin: 0 auto 34px; text-align: center; }
.section-heading h2 { margin: 0; color: var(--blue); font-size: clamp(27px, 3.8vw, 44px); line-height: 1.38; letter-spacing: .03em; }
.section-heading > p:last-child { color: var(--muted); margin: 15px 0 0; }
.section--green .section-heading > p:last-child { color: #e3f5ee; }
.media-grid, .three-cards, .number-grid, .service-grid, .voice-grid, .article-grid, .price-grid { display: grid; gap: 20px; }
.media-grid { grid-template-columns: repeat(3, 1fr); }
.media-grid div { min-height: 135px; display: grid; place-items: center; border: 2px dashed #b9a993; background: #fff; color: #856f54; text-align: center; font-weight: 800; }
.service-grid { grid-template-columns: repeat(3, 1fr); }
.service-grid > a { position: relative; display: block; overflow: hidden; padding-bottom: 22px; border-radius: 12px; background: #fff; box-shadow: var(--shadow); }
.service-grid > a:hover { color: var(--ink); transform: translateY(-4px); }
.service-image { margin: 0 0 15px; overflow: hidden; }
.service-image img { height: 165px; object-fit: cover; }
.service-grid > a > span, .service-grid > a h3, .service-grid > a p, .service-grid > a > b { margin-left: 20px; margin-right: 20px; display: block; }
.service-grid > a > span { color: var(--orange); font-size: 13px; font-weight: 900; }
.service-grid h3 { margin-top: 0; margin-bottom: 7px; color: var(--blue); font-size: 23px; }
.service-grid p { margin-top: 0; min-height: 52px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.service-grid > a > b { color: var(--green); font-size: 13px; }
.results-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.result-card { display: grid; grid-template-columns: .96fr 1.04fr; overflow: hidden; background: #fff; box-shadow: var(--shadow); }
.result-card > div:last-child { padding: 20px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.before-after figure { margin: 0; position: relative; }
.before-after figure:first-child::after { content: "Before"; }
.before-after figure:last-child::after { content: "After"; }
.before-after figure::after { position: absolute; top: 7px; left: 7px; padding: 2px 6px; color: #fff; background: rgba(0,0,0,.6); font-size: 11px; font-weight: 700; }
.result-image { margin: 0; height: 100%; }
.result-image img { height: 100%; min-height: 210px; object-fit: cover; }
.tag { display: inline-block; margin-right: 5px; padding: 3px 8px; color: #fff; background: var(--green); font-size: 11px; font-weight: 800; line-height: 1.4; }
.result-card h3 { margin: 10px 0; font-size: 18px; line-height: 1.5; }
.big-price { margin: 0 0 10px; color: var(--muted); font-size: 12px; }
.big-price strong { display: block; color: var(--orange); font-size: 26px; line-height: 1.2; }
.spec { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 13px 0; }
.spec div { padding: 4px; background: #f1f6f8; text-align: center; }
.spec dt { color: var(--muted); font-size: 10px; }
.spec dd { margin: 0; font-size: 11px; font-weight: 700; }
.result-card .button { width: 100%; min-height: 37px; padding: 5px; font-size: 11px; }
.result-card--actual .result-card__copy {
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
  padding: 18px !important;
}
.result-card--actual .result-card__copy > * { grid-column: 1 / -1; }
.result-card--actual .tag { width: fit-content; }
.result-card--actual .big-price strong small {
  display: inline;
  margin-left: 4px;
  color: var(--muted);
  font-family: "Noto Sans JP", sans-serif;
  font-size: 11px;
  text-shadow: none;
}
.notice { padding: 10px 14px; border-left: 5px solid var(--orange); color: var(--muted); background: #fff; font-size: 12px; }
.split { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 50px; }
.side-image { margin: 0; overflow: hidden; border-radius: 16px; box-shadow: var(--shadow); }
.formula { display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 22px; color: var(--blue); background: #eff8fc; font-size: 17px; }
.formula b { padding: 7px 10px; background: #fff; }
.formula strong { color: var(--orange); }

.cta-block { width: min(1160px, calc(100% - 40px)); margin: clamp(45px, 8vw, 90px) auto; display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: center; padding: clamp(26px, 5vw, 56px); color: #fff; background: linear-gradient(118deg, #0068b7, #00a27d); box-shadow: var(--shadow); }
.cta-block .eyebrow { color: #f6dc6c; }
.cta-block h2 { margin: 0; font-size: clamp(27px, 4vw, 44px); line-height: 1.35; }
.cta-block h2 em { color: #ffec82; font-style: normal; }
.cta-phone { display: grid; width: max-content; margin-top: 14px; color: #fff; line-height: 1.2; }
.cta-phone strong { font-size: clamp(27px, 4vw, 42px); letter-spacing: .05em; }
.cta-image { margin: 0; align-self: stretch; }
.cta-image img { height: 100%; min-height: 260px; object-fit: cover; border-radius: 15px; }
.number-grid { grid-template-columns: repeat(3, 1fr); }
.number-grid article { padding: 24px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.28); }
.section:not(.section--green) .number-grid article { background: #fff; border: 0; box-shadow: var(--shadow); }
.number-grid b, .three-cards b { color: var(--orange); font-size: 30px; line-height: 1; }
.number-grid h3, .three-cards h3 { margin: 9px 0; font-size: 18px; line-height: 1.45; }
.number-grid p, .three-cards p { margin: 0; font-size: 14px; color: inherit; }
.voice-summary { display: flex; align-items: center; justify-content: center; gap: 25px; margin: 0 auto 26px; }
.voice-summary b { background: var(--cream); }
.voice-summary p { max-width: 270px; color: var(--muted); font-size: 12px; }
.voice-grid { grid-template-columns: repeat(4, 1fr); }
.voice-grid article { padding: 20px; border-top: 5px solid var(--green); background: #fff; box-shadow: var(--shadow); }
.voice-grid h3 { font-size: 16px; line-height: 1.65; }
.voice-grid p { color: var(--muted); font-size: 12px; }
.voice-grid a, .article-grid a { color: var(--blue); font-weight: 800; font-size: 13px; }
.steps, .timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 17px; padding: 0; list-style: none; counter-reset: none; }
.steps li, .timeline li { position: relative; padding: 23px 18px; background: #fff; box-shadow: var(--shadow); }
.steps li:not(:last-child)::after { content: "›"; position: absolute; right: -17px; top: 35%; z-index: 1; color: #fff; font-size: 34px; }
.steps b, .timeline b { color: var(--orange); font-size: 12px; }
.steps h3, .timeline h2 { margin: 8px 0; color: var(--blue); font-size: 18px; line-height: 1.4; }
.steps p, .timeline p { margin: 0; color: var(--muted); font-size: 13px; }
.center { text-align: center; margin-top: 35px; }
.faq-list { display: grid; gap: 12px; }
.faq-list details { border: 1px solid var(--line); background: #fff; }
.faq-list summary { padding: 18px 52px 18px 20px; position: relative; color: var(--blue); font-weight: 800; cursor: pointer; list-style: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 19px; top: 13px; font-size: 27px; color: var(--green); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list summary b, .faq-list details > div > b { display: inline-block; margin-right: 11px; color: var(--orange); font-size: 18px; }
.faq-list details > div { display: flex; padding: 16px 20px; border-top: 1px solid var(--line); background: #f7fbfd; }
.faq-list details > div p { margin: 0; }
.area-links { display: flex; flex-wrap: wrap; gap: 10px; }
.area-links a { padding: 6px 15px; color: var(--blue); border: 1px solid var(--blue); font-weight: 800; }
.article-grid { grid-template-columns: repeat(3, 1fr); }
.article-grid article { padding: 25px; background: #fff; box-shadow: var(--shadow); }
.article-grid time { display: block; margin: 11px 0; color: var(--muted); font-size: 12px; }
.article-grid h2, .article-grid h3 { margin: 8px 0 17px; font-size: 19px; line-height: 1.55; }

.anchor-nav { width: min(1160px, calc(100% - 40px)); display: flex; justify-content: center; gap: 0; margin: 27px auto; overflow: auto; border: 1px solid var(--line); }
.anchor-nav a { padding: 11px 22px; color: var(--blue); font-size: 13px; font-weight: 800; white-space: nowrap; border-right: 1px solid var(--line); }
.anchor-nav a:last-child { border: 0; }
.price-grid { grid-template-columns: repeat(4, 1fr); }
.price-grid article { padding: 24px 16px; text-align: center; border-top: 6px solid var(--blue); background: #fff; box-shadow: var(--shadow); }
.price-grid h3 { margin: 0; color: var(--blue); }
.price-grid strong { display: block; margin: 9px 0; color: var(--orange); font-size: 30px; }
.price-grid p { min-height: 45px; color: var(--muted); font-size: 12px; }
.price-grid a { color: var(--green); font-weight: 800; font-size: 13px; }
.table-scroll { overflow: auto; box-shadow: var(--shadow); }
table { width: 100%; min-width: 650px; border-collapse: collapse; background: #fff; }
th, td { padding: 12px 16px; text-align: left; border: 1px solid var(--line); }
th { color: #fff; background: var(--blue); }
td { font-size: 14px; }
.filter-tabs { display: flex; justify-content: center; gap: 10px; margin-bottom: 25px; }
.filter-tabs button { padding: 8px 20px; color: var(--blue); background: #fff; border: 2px solid var(--blue); font-weight: 800; }
.filter-tabs button.is-active { color: #fff; background: var(--blue); }
.voice-filter { margin: 0 auto 28px; text-align: center; }
.voice-filter__label { margin: 0 0 12px; color: var(--ink); font-size: 14px; font-weight: 800; }
.voice-filter__buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.voice-filter__buttons button {
  min-height: 44px;
  padding: 9px 18px;
  border: 2px solid var(--blue);
  border-radius: 999px;
  color: var(--blue);
  background: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  cursor: pointer;
  transition: color .18s ease, background-color .18s ease, transform .18s ease;
}
.voice-filter__buttons button.is-active,
.voice-filter__buttons button[aria-pressed="true"] { color: #fff; background: var(--blue); }
.voice-filter__buttons button:focus-visible { outline: 3px solid #f4c84c; outline-offset: 3px; }
.voice-filter__status { margin: 12px 0 0; color: var(--muted); font-size: 12px; }
.voice-filter__empty {
  margin: 0;
  padding: 30px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: var(--cream);
  text-align: center;
  font-weight: 700;
}
.voice-grid article[hidden],
.voice-filter__empty[hidden] { display: none !important; }
@media (hover: hover) and (pointer: fine) {
  .voice-filter__buttons button:hover { color: #fff; background: var(--blue); transform: translateY(-1px); }
}
.case-price { margin: 28px auto; padding: 20px; text-align: center; background: var(--cream); }
.case-price p { margin: 0; color: var(--muted); }
.case-price strong { display: block; color: var(--orange); font-size: clamp(35px, 5vw, 58px); line-height: 1.2; }
.case-price span { font-size: 11px; color: var(--muted); }
.concerns { max-width: 800px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 22px; margin: auto; padding: 0; list-style: none; font-weight: 800; }
.concerns li { padding: 12px; background: var(--cream); }
.resolve { margin-top: 30px; padding: 31px; color: #fff; background: var(--green); text-align: center; }
.resolve p { margin: 0; font-weight: 800; }
.resolve h2 { margin: 7px 0 0; font-size: 27px; line-height: 1.4; }
.voice-image { margin: -20px -20px 16px; }
.voice-image img { height: 150px; object-fit: cover; }
.survey, .map-placeholder { min-height: 220px; display: grid; place-items: center; color: #856f54; background: var(--cream); border: 2px dashed #baa887; text-align: center; font-weight: 800; }
.area-accordion { display: grid; gap: 13px; }
.area-accordion details { padding: 0 20px; background: #fff; box-shadow: var(--shadow); }
.area-accordion summary { padding: 18px 0; color: var(--blue); font-size: 21px; font-weight: 900; cursor: pointer; }
.area-accordion ul { display: flex; flex-wrap: wrap; gap: 9px; padding: 0 0 20px; list-style: none; }
.area-accordion a { display: block; padding: 5px 11px; color: var(--blue); background: var(--pale-blue); font-size: 13px; font-weight: 700; }
.timeline { grid-template-columns: 1fr; max-width: 830px; margin: auto; }
.timeline li { padding: 26px 30px 26px 130px; }
.timeline li b { position: absolute; left: 25px; top: 28px; font-size: 14px; }
.speech { max-width: 660px; margin: 35px auto 0; padding: 16px; color: var(--blue); background: var(--cream); text-align: center; font-weight: 800; }
.speech small { color: var(--muted); font-weight: 400; }
.form-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 46px; align-items: start; }
.form-layout h2 { margin-top: 0; color: var(--blue); font-size: 37px; line-height: 1.4; }
.phone-panel { display: grid; margin-top: 25px; padding: 19px; color: #fff; background: var(--blue); text-align: center; line-height: 1.2; }
.phone-panel strong { font-size: 35px; }
.line-panel { margin-top: 15px; padding: 18px; border: 2px solid var(--cta-green); }
.estimate-form { display: grid; gap: 16px; padding: clamp(22px, 4vw, 42px); background: #f4fafc; box-shadow: var(--shadow); }
.estimate-form label { display: grid; gap: 6px; color: var(--blue); font-weight: 800; }
.estimate-form label b { width: max-content; padding: 1px 5px; color: #fff; background: var(--orange); font-size: 10px; }
.estimate-form input, .estimate-form select, .estimate-form textarea { width: 100%; padding: 11px; color: var(--ink); border: 1px solid #bfcdd5; background: #fff; }
.estimate-form .check { display: flex; align-items: center; color: var(--ink); font-size: 12px; }
.estimate-form .check input { width: auto; }
.estimate-form .check a { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
.home-estimate { background: #eef8fc; }
.home-estimate > .container > .section-heading { max-width: 760px; margin: 0 auto 34px; text-align: center; }
.home-estimate__contact { align-self: start; }
.home-estimate__contact h3 { margin: 0 0 12px; color: var(--blue); font-size: clamp(24px, 3vw, 36px); line-height: 1.4; }
.home-estimate__line { width: 100%; margin-top: 16px; }
.article { padding-top: 30px; }
.article h2 { margin-top: 45px; color: var(--blue); font-size: 28px; line-height: 1.5; border-left: 6px solid var(--green); padding-left: 14px; }
.article li { margin-bottom: 8px; }
.lead-copy { font-size: 18px; font-weight: 700; }
.article-image { margin: 28px 0; }
.article-image img { border-radius: 12px; }
.article aside { margin-top: 35px; padding: 22px; background: var(--cream); }
.article aside h2 { margin: 0 0 10px; border: 0; padding: 0; }
.blog-list { display: grid; gap: 20px; }
.blog-entry { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); overflow: hidden; border-top: 2px solid var(--blue); border-bottom: 1px solid var(--line); background: #fff; transition: transform .2s, box-shadow .2s; }
.blog-entry__copy { padding: clamp(24px, 4vw, 46px); }
.blog-entry h2 { margin: 14px 0 12px; color: var(--blue); font-size: clamp(25px, 3vw, 38px); line-height: 1.45; }
.blog-entry p { margin: 0 0 22px; }
.blog-entry strong { color: var(--blue); }
.blog-entry__image { margin: 0; min-height: 280px; }
.blog-entry__image img { height: 100%; object-fit: cover; }
.company-brand__logo { display: grid; min-height: 360px; margin: 0; padding: clamp(8px, 2vw, 20px); place-items: center; border: 0; background: transparent; }
.company-brand__logo img { width: min(100%, 390px); height: auto; }
.company-location { background: #fff; }
.company-map { position: relative; width: min(100%, 980px); height: clamp(320px, 42vw, 460px); margin: 0 auto; overflow: hidden; border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(0,65,105,.12); }
.company-map iframe { display: block; width: 100%; height: 100%; border: 0; pointer-events: none; }
.company-map__cover { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: flex-end; padding: 18px; }
.company-map__cover span { min-height: 48px; display: inline-flex; align-items: center; padding: 10px 16px; color: #fff; border-radius: 5px; background: var(--blue); box-shadow: 0 4px 12px rgba(0,0,0,.2); font-weight: 800; }
.company-map__cover:focus-visible { outline: 4px solid var(--orange); outline-offset: -5px; }
.company-address { max-width: 980px; margin: 0 auto; padding: 22px 24px; color: var(--blue); border-bottom: 1px solid var(--line); text-align: center; font-size: clamp(18px, 2.5vw, 25px); font-style: normal; font-weight: 800; }
.phrase-keep { display: inline-block; white-space: nowrap; }

@media (hover: hover) and (pointer: fine) {
  .blog-entry:hover { color: var(--ink); transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,65,105,.12); }
  .header-line:hover { transform: translateY(-2px); filter: brightness(1.04); }
  .company-map__cover:hover span { background: var(--green); }
}

footer { padding: 0 0 35px; color: #dfeffc; background: #093c5e; }
.trust { display: grid; grid-template-columns: repeat(2, 1fr); }
.trust div { min-height: 120px; display: grid; place-content: center; text-align: center; background: var(--blue); border-right: 1px solid rgba(255,255,255,.3); }
.trust div:last-child { background: var(--green); border: 0; }
.trust strong { font-size: 22px; }
.trust span { font-size: 12px; }
.footer-grid { width: min(1160px, calc(100% - 40px)); display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 35px; margin: 0 auto; padding: 58px 0 35px; }
.footer-grid .logo--footer { width: fit-content; padding: 10px 14px; border-radius: 6px; background: #fff; }
.footer-grid .logo--footer .logo__image { height: 118px; }
.footer-grid > div > p { font-size: 13px; }
.social { font-size: 23px; letter-spacing: 8px; }
.footer-grid h2 { margin: 0 0 12px; color: #fff; font-size: 15px; }
.footer-grid ul { padding: 0; margin: 0; list-style: none; }
.footer-grid li { margin: 7px 0; font-size: 13px; }
.footer-grid a:hover { text-decoration: underline; }
.company-info, .footer-legal, .copyright { width: min(1160px, calc(100% - 40px)); margin: auto; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.2); font-size: 11px; }
.footer-legal { display: flex; justify-content: center; }
.footer-legal a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: underline; text-underline-offset: 3px; }
.copyright { color: #a9c8dd; }

.policy-hero { padding: clamp(58px, 8vw, 92px) 0; background: var(--pale-blue); text-align: center; }
.policy-hero h1 { margin: 8px 0 18px; color: var(--blue); font-size: clamp(34px, 5vw, 56px); line-height: 1.35; }
.policy-hero p:last-child { max-width: 680px; margin: 0 auto; color: var(--muted); font-weight: 700; }
.policy-body .narrow { max-width: 860px; }
.policy-section { padding: 28px 0; border-bottom: 1px solid var(--line); }
.policy-section:first-child { padding-top: 0; }
.policy-section h2 { margin: 0 0 12px; color: var(--blue); font-size: clamp(20px, 2.5vw, 26px); line-height: 1.5; }
.policy-section p { margin: 0; }
.policy-section ul { margin: 0; padding-left: 1.4em; }
.policy-section li + li { margin-top: 7px; }
.policy-section a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.policy-contact { margin-top: 18px; padding: 26px 28px; border: 0; border-left: 5px solid var(--green); background: var(--pale-blue); }
.policy-contact p + p { margin-top: 12px; }
.policy-date { margin: 28px 0 0; text-align: right; font-size: 13px; }
.mobile-cta { display: none; }
.back-top { position: fixed; right: 18px; bottom: 20px; z-index: 19; display: grid; width: 46px; height: 46px; place-items: center; border-radius: 50%; color: #fff; background: var(--blue); opacity: 0; pointer-events: none; transition: opacity .2s; }
.back-top.is-visible { opacity: 1; pointer-events: auto; }

@media (max-width: 900px) {
  .header-top { min-height: 68px; gap: 10px; }
  .header-top > .button--green, .phone { display: none; }
  .logo--header .logo__image { height: 56px; }
  .header-line { width: 52px; height: 52px; min-height: 0; flex-basis: 52px; margin-left: auto; padding: 0; border-radius: 12px; box-shadow: 0 3px 0 #049f44; }
  .menu-toggle { display: grid; flex: 0 0 42px; gap: 4px; margin-left: 0; padding: 6px; color: var(--blue); border: 0; background: transparent; font-size: 9px; line-height: 1; }
  .menu-toggle span { display: block; width: 29px; height: 3px; background: var(--blue); }
  .global-nav { display: none; position: absolute; top: 68px; left: 0; width: 100%; background: #fff; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
  .global-nav.is-open { display: grid; }
  .global-nav a { padding: 13px 20px; color: var(--blue); border-bottom: 1px solid var(--line); }
  .home-hero .container, .page-hero .container { min-height: auto; grid-template-columns: 1fr; gap: 20px; padding: 42px 0 48px; }
  .home-hero h1, .page-hero h1 { font-size: 40px; }
  .hero-image { max-width: 530px; margin: auto; }
  .feature-strip .container { grid-template-columns: repeat(2, 1fr); }
  .feature-strip article:last-child { grid-column: 1 / -1; }
  .media-grid, .service-grid, .price-grid, .number-grid { grid-template-columns: repeat(2, 1fr); }
  .voice-grid { grid-template-columns: repeat(2, 1fr); }
  .article-grid { grid-template-columns: 1fr; }
  .results-grid { grid-template-columns: 1fr; }
  .cta-block, .split, .form-layout { grid-template-columns: 1fr; }
  .cta-image img { min-height: 200px; }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .steps li:nth-child(2)::after { display: none; }
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-grid > div { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
  body { padding-bottom: 60px; }
  .container, .breadcrumbs { width: min(100% - 26px, 1160px); }
  .section { padding: 55px 0; }
  .home-hero h1, .page-hero h1 { font-size: 33px; }
  .hero-lead { font-size: 14px; }
  .hero-phone { font-size: 22px; }
  .button { width: 100%; min-height: 51px; }
  .button-row { display: grid; }
  .badge-row b { width: 80px; height: 80px; font-size: 25px; }
  .feature-strip article { min-height: 102px; }
  .media-grid, .service-grid, .price-grid, .number-grid, .three-cards, .voice-grid { grid-template-columns: 1fr; }
  .service-image img { height: 190px; }
  .result-card { grid-template-columns: 1fr; }
  .result-image img { min-height: 155px; }
  .split { gap: 28px; }
  .formula { display: grid; text-align: center; justify-content: stretch; }
  .cta-block { width: calc(100% - 26px); padding: 26px 18px; }
  .cta-block h2 { font-size: 29px; }
  .voice-summary { align-items: flex-start; gap: 10px; }
  .voice-summary b { width: 78px; height: 78px; font-size: 25px; flex-shrink: 0; }
  .voice-filter { margin-bottom: 22px; }
  .voice-filter__buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .voice-filter__buttons button { width: 100%; min-width: 0; padding: 9px 8px; font-size: 12px; }
  .voice-filter__buttons button:first-child { grid-column: 1 / -1; }
  .steps { grid-template-columns: 1fr; }
  .steps li::after { display: none; }
  .concerns { grid-template-columns: 1fr; }
  .timeline li { padding: 55px 18px 20px; }
  .timeline li b { top: 18px; left: 18px; }
  .trust { grid-template-columns: 1fr; }
  .trust div { min-height: 96px; }
  .trust strong { font-size: 18px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 25px; }
  .footer-grid > div { grid-column: 1 / -1; }
  .mobile-cta { position: fixed; bottom: 0; left: 0; right: 0; z-index: 30; display: grid; grid-template-columns: repeat(3, 1fr); box-shadow: 0 -3px 12px rgba(0,0,0,.18); }
  .mobile-cta a { display: grid; min-height: 60px; place-content: center; color: #fff; background: var(--blue); text-align: center; line-height: 1.25; }
  .mobile-cta a:nth-child(2) { background: var(--orange); }
  .mobile-cta a:nth-child(3) { background: var(--cta-green); }
  .mobile-cta small { font-size: 9px; }
  .mobile-cta b { font-size: 12px; }
  .mobile-cta a:nth-child(3) b { max-width: 100px; font-size: 10px; line-height: 1.12; word-break: keep-all; }
  .back-top { bottom: 72px; right: 10px; }
  .home-estimate > .container > .section-heading { margin-bottom: 24px; text-align: left; }
  .home-estimate .form-layout { gap: 22px; }
  .home-estimate .estimate-form { order: 1; padding: 20px 14px; gap: 13px; }
  .home-estimate__contact { order: 2; }
  .home-estimate__contact h3 { font-size: 24px; }
  .blog-entry { grid-template-columns: 1fr; }
  .blog-entry__copy { padding: 20px 16px; }
  .blog-entry h2 { font-size: 23px; }
  .blog-entry__image { order: -1; min-height: 190px; }
  .company-brand__logo { min-height: 240px; padding: 4px 12px; }
  .company-map { height: 280px; }
  .company-map__cover { padding: 12px; }
  .company-map__cover span { min-height: 44px; padding: 8px 12px; font-size: 13px; }
  .company-address { padding: 18px 10px; font-size: 16px; overflow-wrap: anywhere; }
  .policy-hero { padding: 48px 0; }
  .policy-hero h1 { font-size: 31px; overflow-wrap: anywhere; }
  .policy-section { padding: 23px 0; }
  .policy-contact { padding: 22px 18px; }
  .page-company .table-scroll { overflow: visible; box-shadow: none; }
  .page-company .table-scroll table,
  .page-company .table-scroll tbody,
  .page-company .table-scroll tr,
  .page-company .table-scroll td { display: block; width: 100%; min-width: 0; }
  .page-company .table-scroll thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .page-company .table-scroll tr { margin-bottom: 12px; border: 1px solid var(--line); background: #fff; }
  .page-company .table-scroll td { border: 0; }
  .page-company .table-scroll td:first-child { padding: 9px 12px; color: #fff; background: var(--blue); font-size: 12px; font-weight: 800; }
  .page-company .table-scroll td:last-child { padding: 13px 12px; font-size: 14px; }
}

@media (max-width: 340px) {
  .header-line { width: 48px; height: 48px; flex-basis: 48px; }
}

/* 強弱のあるチラシ型レイアウト: 言葉・数字・手書き風注釈を主役にする */
.is-home, .is-lower {
  font-family: "Zen Maru Gothic", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

h1, h2, h3, .button, .phone a, .big-price strong, .price-grid strong {
  font-family: "Noto Sans JP", "Arial Black", "Hiragino Kaku Gothic ProN", sans-serif;
  font-weight: 900;
}

.impact-word {
  display: inline-block;
  position: relative;
  color: var(--orange);
  font-family: "Arial Black", "Noto Sans JP", sans-serif;
  font-size: 1.22em;
  line-height: .95;
  letter-spacing: .07em;
  text-shadow: 2px 2px 0 #ffe3cc;
  transform: rotate(-2deg);
  text-emphasis: filled circle var(--orange);
  -webkit-text-emphasis: filled circle var(--orange);
  text-emphasis-position: over right;
  -webkit-text-emphasis-position: over right;
}

.impact-word::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -.08em;
  bottom: -.08em;
  left: -.08em;
  height: .26em;
  background: #ffe575;
  transform: rotate(-2deg);
}

.impact-word--hero {
  color: var(--blue);
  font-size: 1.15em;
  text-shadow: 3px 3px 0 #bde5fb;
}

.impact-word--orange { color: var(--orange); }

.home-hero h1 {
  max-width: 660px;
  font-size: clamp(42px, 5.7vw, 76px);
  font-family: "Noto Sans JP", "Arial Black", sans-serif;
  font-weight: 900;
  letter-spacing: .02em;
  text-shadow: 3px 3px 0 #fff;
}

.home-hero h1 > span {
  display: inline-block;
  color: var(--green);
  font-family: "Noto Sans JP", "Arial Black", sans-serif;
  font-size: 1.12em;
  letter-spacing: .04em;
  transform: rotate(-1.4deg);
}

.home-hero::before, .page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(#fedc4a 1.4px, transparent 1.8px), radial-gradient(#38aa91 1.2px, transparent 1.7px);
  background-size: 19px 19px, 27px 27px;
  background-position: 4% 12%, 88% 22%;
  opacity: .24;
}

.home-hero .container, .page-hero .container { position: relative; }

.hero-sticker {
  width: max-content;
  max-width: 100%;
  margin: 7px 0 3px;
  padding: 4px 13px 6px;
  color: #134e45;
  background: #ffe577;
  border-radius: 58% 42% 54% 46% / 44% 56% 42% 58%;
  font-family: "Yomogi", "Hiragino Maru Gothic ProN", cursive;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  transform: rotate(-3deg);
  box-shadow: 3px 3px 0 rgba(24, 87, 67, .18);
}

.ribbon {
  position: relative;
  z-index: 1;
  margin-bottom: 17px;
  padding: 8px 14px 7px;
  color: #134e45;
  background: #fff16b;
  font-family: "Yomogi", "Hiragino Maru Gothic ProN", cursive;
  font-size: 15px;
  box-shadow: 4px 4px 0 rgba(0,104,183,.22);
}

.ribbon::after {
  content: "まずは無料でお話を聞かせてください!";
  position: absolute;
  top: 31px;
  right: -24px;
  width: max-content;
  color: var(--green);
  font-family: "Yomogi", "Hiragino Maru Gothic ProN", cursive;
  font-size: 18px;
  transform: rotate(3deg);
}

.page-hero h1 {
  font-family: "Noto Sans JP", "Arial Black", sans-serif;
  font-weight: 900;
  font-size: clamp(38px, 5.1vw, 64px);
  text-shadow: 2px 2px 0 #fff;
}

.page-hero h1 span {
  color: var(--orange);
  font-family: "Noto Sans JP", "Arial Black", sans-serif;
  font-size: 1.12em;
}

.section-heading {
  position: relative;
  max-width: 900px;
  margin-bottom: 48px;
}

.section-heading::before {
  content: "●";
  display: block;
  margin-bottom: -9px;
  color: #ffc426;
  font-size: 24px;
  letter-spacing: 7px;
  text-align: center;
}

.section-heading h2 {
  font-size: clamp(30px, 4.4vw, 52px);
  line-height: 1.27;
  text-shadow: 2px 2px 0 rgba(255,255,255,.9);
}

.section--green .section-heading h2 { text-shadow: 2px 2px 0 rgba(0,0,0,.14); }
.section-heading > p:last-child { font-size: 15px; font-weight: 700; }

.is-home .media-grid {
  position: relative;
  padding-top: 42px;
}

.is-home .media-grid::before {
  content: "さまざまなメディアで取り上げられています!";
  position: absolute;
  top: -5px;
  left: 50%;
  z-index: 2;
  width: max-content;
  max-width: 100%;
  padding: 3px 17px 5px;
  color: #134e45;
  background: #fff278;
  border-radius: 50%;
  font-family: "Yomogi", "Hiragino Maru Gothic ProN", cursive;
  font-size: clamp(16px, 2.2vw, 24px);
  font-weight: 700;
  transform: translateX(-50%) rotate(-2deg);
  box-shadow: 4px 4px 0 rgba(21,89,69,.2);
}

.media-grid div {
  position: relative;
  min-height: 170px;
  border-width: 3px;
  border-radius: 10px;
  font-size: 16px;
  transform: rotate(-1deg);
}

.media-grid div:nth-child(2) { transform: translateY(10px) rotate(1.4deg); }
.media-grid div:nth-child(3) { transform: rotate(-.3deg); }

.feature-strip article { position: relative; overflow: hidden; }
.feature-strip article::after {
  content: "";
  position: absolute;
  right: -28px;
  bottom: -28px;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: #fff0a0;
  opacity: .47;
}
.feature-strip i {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  margin: auto;
  color: #fff;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 3px 3px 0 #cae9df;
}
.feature-strip strong { font-size: 16px; }

.service-grid > a {
  border: 3px solid #fff;
  border-radius: 5px 24px 8px 22px;
  transition: transform .2s, box-shadow .2s;
}
.service-grid > a:nth-child(3n+2) { transform: translateY(15px) rotate(.6deg); }
.service-grid > a:nth-child(3n+3) { transform: rotate(-.5deg); }
.service-grid > a:hover { transform: translateY(-5px) rotate(0); box-shadow: 0 20px 33px rgba(3,56,96,.22); }
.service-grid > a > span { font-size: 22px; line-height: 1; color: var(--orange); }
.service-grid h3 { font-size: 29px; line-height: 1.25; }

.results-grid { gap: 36px 24px; }
.result-card {
  overflow: visible;
  border-radius: 13px;
  border: 4px solid #fff;
  box-shadow: 0 16px 0 rgba(0,104,183,.13), var(--shadow);
}
.result-card:nth-child(even) { transform: rotate(.45deg); }
.result-card__copy { position: relative; padding-right: 116px !important; }
.pick-up {
  display: inline-block;
  margin-left: 4px;
  color: #fff;
  background: var(--orange);
  padding: 2px 7px;
  font-family: "Arial Black", sans-serif;
  font-size: 10px;
  line-height: 1.3;
  transform: rotate(-5deg);
}
.big-price > span {
  display: block;
  color: var(--blue);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .1em;
}
.big-price strong {
  color: var(--orange);
  font-family: "Arial Black", "Noto Sans JP", sans-serif;
  font-size: clamp(25px, 3vw, 39px);
  letter-spacing: -.04em;
  text-shadow: 2px 2px 0 #ffe3cc;
}
.cutout-slot {
  position: absolute;
  top: 17px;
  right: 5px;
  z-index: 3;
  width: 109px;
  min-height: 161px;
  margin: 0;
  padding: 25px 5px 4px;
  background: radial-gradient(circle at 30% 25%, #fff 0 4px, transparent 5px), #ffdc52;
  border: 3px solid #fff;
  border-radius: 44% 53% 38% 47% / 31% 42% 55% 52%;
  box-shadow: 3px 4px 0 var(--orange);
  transform: rotate(4deg);
  text-align: center;
}
.cutout-slot > span {
  position: absolute;
  top: 4px;
  left: 50%;
  width: 118px;
  padding: 2px 3px;
  color: #fff;
  background: var(--green);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.25;
  transform: translateX(-50%) rotate(-5deg);
}
.cutout-slot img { width: 84px; height: 122px; margin: auto; object-fit: contain; }

.number-grid article {
  position: relative;
  overflow: hidden;
  min-height: 205px;
  padding: 31px 24px 24px 113px;
  border-radius: 8px 31px 12px 27px;
}
.number-grid b {
  position: absolute;
  top: 18px;
  left: 15px;
  color: #ffdc52;
  font-family: "Arial Black", sans-serif;
  font-size: 72px;
  font-style: italic;
  letter-spacing: -.14em;
  text-shadow: 3px 3px 0 var(--orange);
  transform: rotate(-8deg);
}
.section:not(.section--green) .number-grid b { color: var(--orange); text-shadow: 3px 3px 0 #ffe28d; }
.number-grid h3 { font-size: 21px; }
.three-cards article { border-top: 7px solid var(--orange); box-shadow: var(--shadow); }
.three-cards b { font-size: 54px; font-family: "Arial Black", sans-serif; line-height: .9; }

.price-grid article { border-top-width: 10px; border-radius: 5px 25px 9px 21px; }
.price-grid article:nth-child(even) { transform: translateY(13px) rotate(.6deg); }
.price-grid strong { font-family: "Arial Black", sans-serif; font-size: clamp(37px, 4.5vw, 55px); text-shadow: 2px 2px 0 #ffe3cc; }
.timeline li { border-left: 10px solid var(--orange); box-shadow: 8px 8px 0 #e4f2f8, var(--shadow); }
.timeline li b { color: var(--orange); font-family: "Arial Black", sans-serif; font-size: 18px; }
.faq-list summary { font-size: 17px; }
.faq-list summary b { display: inline-grid; place-items: center; width: 31px; height: 31px; color: #fff; background: var(--orange); border-radius: 50%; }

@media (max-width: 900px) {
  .result-card__copy { padding-right: 128px !important; }
  .number-grid article { min-height: 182px; }
}

@media (max-width: 600px) {
  .home-hero h1, .page-hero h1 { font-size: 35px; }
  .hero-sticker { font-size: 15px; }
  .section-heading h2 { font-size: 32px; }
  .media-grid { padding-top: 41px; }
  .media-grid div:nth-child(2), .service-grid > a:nth-child(3n+2), .service-grid > a:nth-child(3n+3), .result-card:nth-child(even), .price-grid article:nth-child(even) { transform: none; }
  .result-card__copy { padding-right: 20px !important; }
  .cutout-slot { position: relative; top: auto; right: auto; margin: 12px 0 15px auto; }
  .number-grid article { min-height: 155px; padding-left: 97px; }
  .number-grid b { font-size: 61px; }
}

/* Lower pages: centre the first view and leave room for a future photo collage. */
.section { padding: clamp(44px, 6vw, 76px) 0; }
.page-hero .container {
  display: block;
  min-height: 460px;
  padding: 68px 9% 82px;
  overflow: hidden;
  text-align: center;
}
.page-hero .container > div:first-child { position: relative; z-index: 2; max-width: 790px; margin: 0 auto; }
.page-hero .hero-sticker { margin: 7px auto 5px; }
.page-hero .button-row { justify-content: center; }
.page-hero .hero-phone { text-align: center; }
.page-hero .hero-image {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 3.5%;
  width: min(27vw, 305px);
  margin: 0;
  opacity: .52;
  transform: translateY(-50%) rotate(5deg);
}
.page-hero .hero-image img { border: 9px solid #fff; border-radius: 5px 22px 9px 19px; box-shadow: 11px 12px 0 rgba(0,104,183,.16); }
.three-cards article, .price-grid article, .voice-grid article, .article-grid article { text-align: center; }
.three-cards article { padding: 25px 22px; }
.three-cards p { max-width: 34em; margin-right: auto; margin-left: auto; }
.section-heading { margin-bottom: 30px; }
.cta-block { max-width: 1120px; margin: clamp(30px, 5vw, 52px) auto; padding: clamp(23px, 3.8vw, 42px); }
.cta-block .button-row { margin-top: 16px; }

.compliance-strip { padding: 36px 0; color: #fff; background: linear-gradient(120deg, #12486c, #0a765e); }
.compliance-strip .container { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px, .8fr); gap: 35px; align-items: center; }
.compliance-strip h2 { margin: 5px 0 10px; font-size: clamp(25px, 3.3vw, 39px); line-height: 1.28; }
.compliance-strip h2 span { color: #ffe36b; }
.compliance-strip p { max-width: 770px; margin: 0; line-height: 1.8; }
.compliance-strip dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin: 17px 0 0; }
.compliance-strip dl div { padding: 10px 12px; border-left: 4px solid #ffe36b; background: rgba(255,255,255,.12); }
.compliance-strip dt { font-weight: 900; }
.compliance-strip dd { margin: 3px 0 0; font-size: 12px; }
.compliance-actions { display: grid; gap: 11px; }
.compliance-actions .button { width: 100%; }
.compliance-actions small { line-height: 1.5; }

.item-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.item-grid article { position: relative; overflow: hidden; min-height: 285px; padding: 31px 25px 22px; color: var(--ink); background: #fff; border: 3px solid #fff; border-radius: 7px 30px 9px 24px; box-shadow: var(--shadow); text-align: center; }
.item-grid article::before { content: ""; position: absolute; inset: 0; opacity: .17; background: linear-gradient(130deg, rgba(255,255,255,.2), rgba(0,104,183,.2)), url("../img/generated/estate-work-card.jpg") center / cover; }
.item-grid article > * { position: relative; }
.item-grid b { display: inline-block; color: var(--orange); font-family: "Arial Black", sans-serif; font-size: 44px; line-height: 1; transform: rotate(-5deg); }
.item-grid h3 { margin: 8px 0 9px; color: var(--blue); font-size: 23px; }
.item-grid ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; margin: 0; padding: 0; list-style: none; text-align: left; }
.item-grid li { padding: 5px 6px; background: rgba(255,255,255,.82); border-radius: 3px; font-size: 13px; font-weight: 700; }
.item-grid li::before { content: "✓"; margin-right: 5px; color: var(--green); }
.item-grid article > span { display: block; margin-top: 11px; color: var(--muted); font-size: 11px; }
.item-note { text-align: center; }
.item-note h2 { color: var(--blue); font-size: clamp(25px, 3vw, 35px); }
.item-note p { line-height: 1.9; }
.item-note .button-row { justify-content: center; }

/* The photo overlay keeps the six-strength cards lively without tilting every component. */
.number-grid article::after { content: ""; position: absolute; inset: 0; z-index: 0; opacity: .17; background: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/estate-work-card.jpg") center / cover; }
.number-grid article:nth-child(2)::after { background-position: 20% center; }
.number-grid article:nth-child(3)::after { background-position: 80% center; }
.number-grid article:nth-child(4)::after { background-position: 35% bottom; }
.number-grid article:nth-child(5)::after { background-position: 65% top; }
.number-grid article:nth-child(6)::after { background-position: right center; }
.number-grid article > * { position: relative; z-index: 1; }

@media (max-width: 760px) {
  .page-hero .container { min-height: auto; padding: 47px 20px 56px; }
  .page-hero .hero-image { position: relative; top: auto; right: auto; width: min(72vw, 315px); margin: 24px auto 0; opacity: .86; transform: rotate(3deg); }
  .compliance-strip .container, .item-grid { grid-template-columns: 1fr; }
  .compliance-strip { padding: 30px 0; }
  .compliance-strip dl { grid-template-columns: 1fr; }
}

/* Real-photo pass: fixed navigation, varied emphasis, and less repeated card rhythm. */
html { scroll-padding-top: 132px; }
body, h1, h2, h3, .impact-word, .logo strong, .phone a, .big-price strong, .number-grid b { letter-spacing: 0; }
.site-header {
  position: sticky;
  top: 0;
  z-index: 80;
}
.back-top { z-index: 79; }

.home-hero .hero-image img,
.page-hero .hero-image img,
.service-image img,
.side-image img,
.article-image img,
.voice-image img,
.cta-image img {
  object-fit: cover;
}
.home-hero .hero-image img { aspect-ratio: 16 / 10; object-position: 42% center; }
.page-hero .hero-image img { aspect-ratio: 4 / 3; object-position: center; }
.service-grid > a:nth-child(2) .service-image img { object-position: 46% 42%; }
.service-grid > a:nth-child(3) .service-image img { object-position: 52% 55%; }
.service-grid > a:nth-child(4) .service-image img { object-position: 48% 60%; }
.service-grid > a:nth-child(5) .service-image img { object-position: 60% 48%; }
.service-grid > a:nth-child(6) .service-image img { object-position: 38% 54%; }
.voice-grid article:nth-child(2n) .voice-image img { object-position: 35% 50%; }
.voice-grid article:nth-child(3n) .voice-image img { object-position: 62% 44%; }

.impact-word {
  text-emphasis: none;
  -webkit-text-emphasis: none;
  font-size: 1.18em;
  transform: rotate(-1.6deg);
}
.home-hero h1 .impact-word,
.page-hero h1 .impact-word:nth-of-type(odd) {
  text-emphasis: filled sesame var(--orange);
  -webkit-text-emphasis: filled sesame var(--orange);
  text-emphasis-position: over right;
  -webkit-text-emphasis-position: over right;
}
.section-heading h2 .impact-word:nth-of-type(3n+1) {
  color: var(--orange);
  font-size: 1.16em;
}
.section-heading h2 .impact-word:nth-of-type(3n+2) {
  color: var(--blue);
  font-family: "Noto Sans JP", "Arial Black", sans-serif;
  font-size: 1.08em;
  text-shadow: 2px 2px 0 #cfefff;
  transform: rotate(1deg);
}
.section-heading h2 .impact-word:nth-of-type(3n+2)::after {
  right: -.12em;
  bottom: .06em;
  left: -.12em;
  height: .18em;
  background: rgba(255, 196, 38, .62);
  transform: rotate(1deg);
}
.section-heading h2 .impact-word:nth-of-type(3n) {
  color: var(--green);
  font-size: 1.06em;
  text-shadow: none;
  transform: rotate(0);
}
.section-heading h2 .impact-word:nth-of-type(3n)::after {
  bottom: -.02em;
  height: .14em;
  background: linear-gradient(90deg, #ffe36b 0 42%, transparent 42% 52%, #ffe36b 52%);
}

.section-heading::before {
  content: "";
  width: 68px;
  height: 7px;
  margin: 0 auto 14px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--orange), #ffe36b 52%, var(--green));
  transform: rotate(-2deg);
}
.section--cream .section-heading::before {
  width: 86px;
  height: 0;
  border-top: 4px solid var(--blue);
  border-bottom: 4px solid #ffe36b;
  background: transparent;
  transform: rotate(2deg);
}
.section--blue .section-heading::before {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: radial-gradient(circle, #ffe36b 0 32%, transparent 34%), radial-gradient(circle at 68% 68%, var(--orange) 0 18%, transparent 20%);
}
.section--green .section-heading::before {
  width: 72px;
  height: 8px;
  background: #ffe36b;
  box-shadow: 18px 10px 0 rgba(255,255,255,.35);
}

.result-card { grid-template-columns: .9fr 1.1fr; }
.result-card__copy {
  position: relative;
  min-height: 232px;
  padding-right: 138px !important;
}
.cutout-slot {
  top: 14px;
  right: 12px;
  width: 124px;
  min-height: 186px;
  padding-top: 26px;
  border-radius: 42% 54% 37% 49% / 30% 44% 54% 53%;
  box-shadow: 5px 6px 0 rgba(255,69,20,.86);
}
.cutout-slot img {
  width: 102px;
  height: 148px;
  object-fit: contain;
}
.cutout-slot > span {
  width: 124px;
  font-size: 8px;
}

.result-card:nth-child(2n) .cutout-slot {
  top: 30px;
  transform: rotate(-4deg);
}
.result-card:nth-child(3n) .cutout-slot {
  background: radial-gradient(circle at 32% 24%, #fff 0 4px, transparent 5px), #dff6ee;
  box-shadow: 5px 6px 0 rgba(0,104,183,.32);
  transform: rotate(2deg);
}
.result-card:nth-child(3n) .cutout-slot > span { background: var(--blue); }

.item-grid article:nth-child(1)::before {
  background: linear-gradient(130deg, rgba(255,255,255,.42), rgba(0,104,183,.22)), url("../img/generated/items-arranged.jpg") center / cover;
}
.item-grid article:nth-child(2)::before {
  background: linear-gradient(130deg, rgba(255,255,255,.42), rgba(26,151,126,.24)), url("../img/generated/work-carrying.jpg") center / cover;
}
.item-grid article:nth-child(3)::before {
  background: linear-gradient(130deg, rgba(255,255,255,.44), rgba(255,69,20,.18)), url("../img/generated/sorting-keepsakes.jpg") center / cover;
}
.number-grid article:nth-child(1)::after { background-image: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/work-carrying.jpg"); }
.number-grid article:nth-child(2)::after { background-image: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/sorting-keepsakes.jpg"); }
.number-grid article:nth-child(3)::after { background-image: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/items-arranged.jpg"); }
.number-grid article:nth-child(4)::after { background-image: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/handover-consultation.jpg"); }
.number-grid article:nth-child(5)::after { background-image: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/room-after.jpg"); }
.number-grid article:nth-child(6)::after { background-image: linear-gradient(135deg, transparent, rgba(0,104,183,.55)), url("../img/generated/hero-consultation.jpg"); }

.page-hero .hero-image {
  width: min(31vw, 370px);
  opacity: .62;
}
.page-hero::after {
  background: rgba(255,248,213,.92);
}

@media (max-width: 900px) {
  html { scroll-padding-top: 78px; }
  .result-card__copy {
    min-height: 226px;
    padding-right: 164px !important;
  }
  .cutout-slot {
    width: 148px;
    min-height: 206px;
  }
  .cutout-slot img {
    width: 124px;
    height: 166px;
  }
}

@media (max-width: 600px) {
  html { scroll-padding-top: 70px; }
  .global-nav { top: 68px; }
  .page-hero .container { padding: 42px 18px 74px; }
  .page-hero .hero-image {
    position: absolute;
    right: 50%;
    bottom: 13px;
    top: auto;
    width: min(88vw, 390px);
    height: 168px;
    margin: 0;
    opacity: .22;
    transform: translateX(50%) rotate(2deg);
  }
  .page-hero .hero-image img { height: 100%; }
  .page-hero::after { display: none; }
  .result-card__copy {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 112px;
    column-gap: 12px;
    min-height: 0;
    padding: 16px !important;
  }
  .result-card__copy > :not(.cutout-slot) { grid-column: 1; }
  .result-card__copy .spec,
  .result-card__copy .button { grid-column: 1 / -1; }
  .cutout-slot,
  .result-card:nth-child(2n) .cutout-slot,
  .result-card:nth-child(3n) .cutout-slot {
    position: static;
    grid-column: 2;
    grid-row: 1 / 6;
    width: 112px;
    min-height: 154px;
    margin: 0;
    padding-top: 22px;
    align-self: start;
    transform: rotate(3deg);
  }
  .cutout-slot img {
    width: 92px;
    height: 122px;
  }
  .cutout-slot > span {
    width: 108px;
    font-size: 7px;
  }
  .voice-summary { justify-content: center; }
}

/* 2026-07 feedback pass: 写真コラージュ、セクション柄、控えめな強調点、品目説明の追加 */
.home-hero {
  isolation: isolate;
  overflow: hidden;
}

.home-hero .container > * {
  position: relative;
  z-index: 2;
}

.home-hero .hero-image {
  z-index: 4;
  overflow: visible;
  transform: rotate(2.4deg) translateY(4px);
}

.home-hero .hero-image::after,
.home-hero .container::before,
.home-hero .container::after {
  content: "";
  position: absolute;
  display: block;
  aspect-ratio: 4 / 3;
  border: 5px solid rgba(255,255,255,.95);
  border-radius: 7px 24px 9px 20px;
  background-position: center;
  background-size: cover;
  box-shadow: 0 18px 28px rgba(3, 56, 96, .18), 8px 8px 0 rgba(255,196,38,.38);
  pointer-events: none;
}

.home-hero .container::before {
  z-index: 1;
  top: 46px;
  right: clamp(250px, 27vw, 390px);
  width: clamp(142px, 17vw, 242px);
  background-image: url("../img/generated/hero-family-table.jpg");
  transform: rotate(-8deg);
  opacity: .88;
}

.home-hero .container::after {
  z-index: 5;
  right: 0;
  bottom: 44px;
  width: clamp(132px, 15vw, 214px);
  background-image: url("../img/generated/hero-keepsakes-hands.jpg");
  border-radius: 21px 8px 23px 7px;
  box-shadow: 0 18px 28px rgba(3, 56, 96, .17), -8px 7px 0 rgba(26,151,126,.22);
  transform: rotate(8deg);
}

.home-hero .hero-image::after {
  z-index: 6;
  left: clamp(-78px, -5vw, -40px);
  bottom: -46px;
  width: clamp(128px, 14vw, 205px);
  background-image: url("../img/generated/hero-house-exterior.jpg");
  border-radius: 26px 8px 14px 10px;
  box-shadow: 0 18px 28px rgba(3, 56, 96, .18), 8px -7px 0 rgba(255,69,20,.18);
  transform: rotate(-5deg);
}

.home-hero .hero-image img {
  border: 7px solid #fff;
  border-radius: 9px 28px 8px 24px;
  box-shadow: 14px 14px 0 rgba(0,104,183,.13);
}

.section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.section > .container {
  position: relative;
  z-index: 1;
}

.section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .72;
  background:
    radial-gradient(circle at 13% 16%, rgba(255,196,38,.22) 0 74px, transparent 75px),
    radial-gradient(circle at 87% 82%, rgba(0,104,183,.10) 0 92px, transparent 93px),
    radial-gradient(circle, rgba(0,104,183,.12) 1px, transparent 1.5px) 0 0 / 24px 24px;
}

.section--cream::before {
  opacity: .78;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,151,90,.28) 0 96px, transparent 98px),
    radial-gradient(circle at 78% 18%, rgba(255,226,119,.40) 0 68px, transparent 70px),
    radial-gradient(circle, rgba(255,69,20,.16) 1.1px, transparent 1.7px) 4px 7px / 22px 22px,
    linear-gradient(135deg, rgba(255,255,255,.42), transparent 42%);
}

.section--blue::before {
  opacity: .62;
  background:
    linear-gradient(120deg, rgba(0,104,183,.09) 0 1px, transparent 1px 18px) 0 0 / 28px 28px,
    radial-gradient(circle at 82% 22%, rgba(26,151,126,.18) 0 82px, transparent 84px),
    radial-gradient(circle at 16% 76%, rgba(255,196,38,.26) 0 66px, transparent 68px);
}

.section--green::before {
  opacity: .35;
  background:
    radial-gradient(circle at 12% 16%, rgba(255,226,119,.32) 0 84px, transparent 86px),
    radial-gradient(circle at 82% 72%, rgba(255,255,255,.18) 0 112px, transparent 114px),
    repeating-linear-gradient(-25deg, rgba(255,255,255,.12) 0 1px, transparent 1px 19px);
}

.section:nth-of-type(4n+1)::before {
  background:
    radial-gradient(circle at 12% 18%, rgba(26,151,126,.13) 0 82px, transparent 84px),
    radial-gradient(circle at 86% 78%, rgba(255,196,38,.28) 0 78px, transparent 80px),
    radial-gradient(circle, rgba(255,69,20,.11) 1px, transparent 1.6px) 2px 4px / 26px 26px;
}

.section:nth-of-type(4n+3)::before {
  background:
    linear-gradient(135deg, transparent 0 46%, rgba(255,255,255,.55) 46% 50%, transparent 50%),
    radial-gradient(circle at 82% 20%, rgba(0,104,183,.12) 0 86px, transparent 88px),
    radial-gradient(circle, rgba(26,151,126,.13) 1px, transparent 1.6px) 10px 10px / 25px 25px;
}

.compliance-strip {
  position: relative;
  overflow: hidden;
}

.compliance-strip::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .23;
  background:
    repeating-linear-gradient(135deg, #fff 0 2px, transparent 2px 18px),
    radial-gradient(circle at 22% 50%, #ffe36b 0 62px, transparent 64px);
}

.impact-word,
.home-hero h1 .impact-word,
.page-hero h1 .impact-word:nth-of-type(odd) {
  text-emphasis: none !important;
  -webkit-text-emphasis: none !important;
}

.impact-word::before {
  content: "";
  position: absolute;
  top: -.34em;
  right: .08em;
  left: .08em;
  height: 5px;
  background: radial-gradient(circle, currentColor 0 1.15px, transparent 1.7px) 0 50% / .45em 5px repeat-x;
  opacity: .72;
  transform: rotate(1deg);
}

.section-heading::before {
  content: "";
  width: 46px;
  height: 5px;
  margin: 0 auto 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--orange), #ffe36b, var(--green));
  transform: rotate(-2deg);
}

.request-items .section-heading {
  max-width: 860px;
}

.request-item-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.request-item-grid article,
.decision-grid article {
  position: relative;
  overflow: hidden;
  padding: 24px;
  background: rgba(255,255,255,.86);
  border: 2px solid rgba(255,255,255,.95);
  border-radius: 7px 24px 10px 22px;
  box-shadow: 0 14px 28px rgba(3, 56, 96, .10);
}

.request-item-grid article:nth-child(2n) {
  transform: translateY(10px) rotate(.45deg);
}

.request-item-grid article:nth-child(3n) {
  transform: rotate(-.5deg);
}

.request-item-grid b {
  color: var(--orange);
  font-size: 26px;
  line-height: 1;
  text-shadow: 2px 2px 0 #ffe9b0;
}

.request-item-grid h3,
.decision-panel h2 {
  color: var(--blue);
}

.request-item-grid h3 {
  margin: 9px 0 10px;
  font-size: 24px;
}

.request-item-grid p,
.decision-grid p {
  margin: 0;
  color: #425466;
  line-height: 1.8;
}

.guide-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 34px;
  padding: 20px 22px;
  background: rgba(255,248,213,.92);
  border: 3px solid #fff;
  border-radius: 18px;
  box-shadow: var(--shadow);
}

.guide-note p {
  margin: 0;
  color: #35485a;
  font-weight: 700;
  line-height: 1.8;
}

.decision-panel {
  padding: clamp(24px, 4vw, 42px);
  background: rgba(255,255,255,.76);
  border: 3px solid #fff;
  border-radius: 30px 12px 32px 14px;
  box-shadow: var(--shadow);
}

.decision-panel h2 {
  margin: 0 0 22px;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.32;
}

.decision-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.decision-grid b {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--green);
  font-size: 21px;
}

.before-after .result-image:first-child img,
.result-card .before-after .result-image:first-child img {
  object-position: 47% 50%;
}

.before-after .result-image:nth-child(2) img,
.result-card .before-after .result-image:nth-child(2) img {
  object-position: 48% 52%;
}

.result-card__copy {
  min-height: 272px;
  padding-right: 174px !important;
}

.cutout-slot {
  width: 154px;
  min-height: 226px;
  padding-top: 24px;
}

.cutout-slot img {
  width: 132px;
  height: 188px;
}

.cutout-slot > span {
  width: 148px;
}

@media (max-width: 980px) {
  .request-item-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .decision-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guide-note { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 900px) {
  .home-hero .container::before {
    top: auto;
    right: auto;
    bottom: 182px;
    left: 8px;
    width: 148px;
  }
  .home-hero .container::after {
    right: 8px;
    bottom: 104px;
    width: 138px;
  }
  .home-hero .hero-image::after {
    left: auto;
    right: -10px;
    bottom: -30px;
    width: 138px;
  }
  .result-card__copy {
    min-height: 260px;
    padding-right: 188px !important;
  }
  .cutout-slot {
    width: 170px;
    min-height: 232px;
  }
  .cutout-slot img {
    width: 142px;
    height: 196px;
  }
}

@media (max-width: 600px) {
  .home-hero .container::before {
    bottom: 238px;
    width: 118px;
    opacity: .72;
  }
  .home-hero .container::after {
    bottom: 88px;
    width: 112px;
    opacity: .78;
  }
  .home-hero .hero-image::after {
    width: 118px;
    opacity: .86;
  }
  .request-item-grid,
  .decision-grid {
    grid-template-columns: 1fr;
  }
  .request-item-grid article:nth-child(n) {
    transform: none;
  }
  .result-card__copy {
    grid-template-columns: minmax(0, 1fr) 128px;
    padding: 16px !important;
  }
  .cutout-slot,
  .result-card:nth-child(2n) .cutout-slot,
  .result-card:nth-child(3n) .cutout-slot {
    width: 126px;
    min-height: 178px;
  }
  .cutout-slot img {
    width: 108px;
    height: 150px;
  }
  .cutout-slot > span {
    width: 122px;
  }
}

/* 2026-07 semantic section visuals: generated scene backgrounds, not just dots/circles */
.section::before {
  opacity: .16;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.9)),
    url("../img/generated/section-family-consultation.jpg");
  background-position: center;
  background-size: cover;
}

.section--cream::before {
  opacity: .72;
  background-image:
    linear-gradient(180deg, rgba(255,250,238,.82), rgba(255,247,229,.88)),
    url("../img/generated/section-family-consultation.jpg");
}

.section--blue::before {
  opacity: .74;
  background-image:
    linear-gradient(180deg, rgba(236,249,255,.82), rgba(242,250,255,.88)),
    url("../img/generated/section-moving-work.jpg");
}

.section--green::before {
  opacity: .42;
  background-image:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.22), rgba(7,70,62,.72) 68%),
    linear-gradient(90deg, rgba(12,84,74,.84), rgba(12,84,74,.62)),
    url("../img/generated/section-sorting-keepsakes.jpg");
}

.section--stage,
.compliance-strip.section--stage {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.section--stage > .container,
.compliance-strip.section--stage > .container {
  position: relative;
  z-index: 1;
}

.section--stage::before,
.compliance-strip.section--stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 1;
  background-position: center;
  background-size: cover;
  pointer-events: none;
}

.stage-family::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,249,237,.9)),
    url("../img/generated/section-family-consultation.jpg");
}

.stage-sorting::before {
  background-image:
    linear-gradient(180deg, rgba(244,253,255,.80), rgba(244,250,248,.90)),
    url("../img/generated/section-sorting-keepsakes.jpg");
}

.stage-moving::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(250,249,244,.90)),
    url("../img/generated/section-moving-work.jpg");
}

.stage-compliance::before {
  background-image:
    linear-gradient(180deg, rgba(245,252,255,.82), rgba(247,252,249,.92)),
    url("../img/generated/section-compliance-disposal.jpg");
}

.stage-area::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(238,249,255,.88)),
    url("../img/generated/section-gunma-area.jpg");
}

.section.section--cream::before {
  background-image:
    linear-gradient(180deg, rgba(255,250,238,.82), rgba(255,247,229,.88)),
    url("../img/generated/section-family-consultation.jpg") !important;
}

.section.section--blue::before {
  background-image:
    linear-gradient(180deg, rgba(236,249,255,.82), rgba(242,250,255,.88)),
    url("../img/generated/section-moving-work.jpg") !important;
}

.section.section--green::before {
  background-image:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.22), rgba(7,70,62,.72) 68%),
    linear-gradient(90deg, rgba(12,84,74,.84), rgba(12,84,74,.62)),
    url("../img/generated/section-sorting-keepsakes.jpg") !important;
}

.section.section--stage.stage-family::before,
.section.section--stage.stage-sorting::before,
.section.section--stage.stage-moving::before,
.section.section--stage.stage-compliance::before,
.section.section--stage.stage-area::before,
.compliance-strip.section--stage.stage-compliance::before {
  opacity: 1 !important;
}

.section.section--stage.stage-family::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,249,237,.9)),
    url("../img/generated/section-family-consultation.jpg") !important;
}

.section.section--stage.stage-sorting::before {
  background-image:
    linear-gradient(180deg, rgba(244,253,255,.80), rgba(244,250,248,.90)),
    url("../img/generated/section-sorting-keepsakes.jpg") !important;
}

.section.section--stage.stage-moving::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(250,249,244,.90)),
    url("../img/generated/section-moving-work.jpg") !important;
}

.section.section--stage.stage-compliance::before,
.compliance-strip.section--stage.stage-compliance::before {
  background-image:
    linear-gradient(180deg, rgba(245,252,255,.82), rgba(247,252,249,.92)),
    url("../img/generated/section-compliance-disposal.jpg") !important;
}

.section.section--stage.stage-area::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(238,249,255,.88)),
    url("../img/generated/section-gunma-area.jpg") !important;
}

.service-depth .section-heading,
.price-depth .section-heading,
.results-feedback .section-heading,
.area-coverage-deep .section-heading,
.aio-answer-guide .section-heading {
  max-width: 900px;
}

.insight-grid,
.detail-lanes,
.answer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.detail-lanes,
.answer-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.insight-grid article,
.detail-lanes article,
.answer-grid article,
.case-data-card,
.client-check {
  background: rgba(255,255,255,.86);
  border: 2px solid rgba(255,255,255,.96);
  border-radius: 10px 26px 12px 24px;
  box-shadow: 0 16px 30px rgba(3,56,96,.11);
  backdrop-filter: blur(6px);
}

.insight-grid article,
.detail-lanes article,
.answer-grid article {
  padding: 23px;
}

.insight-grid article:nth-child(2n),
.detail-lanes article:nth-child(2n),
.answer-grid article:nth-child(2n) {
  transform: translateY(8px) rotate(.35deg);
}

.insight-grid b {
  display: inline-block;
  color: var(--orange);
  font-size: 25px;
  line-height: 1;
  text-shadow: 2px 2px 0 #ffe6a6;
}

.insight-grid h3,
.detail-lanes h3,
.answer-grid h3,
.client-check h3,
.case-data-card h3 {
  margin: 8px 0 10px;
  color: var(--blue);
  font-size: 22px;
}

.insight-grid p,
.detail-lanes p,
.answer-grid p {
  margin: 0;
  color: #3d5366;
  line-height: 1.85;
}

.client-check {
  margin-top: 26px;
  padding: 24px 26px;
  color: #334b5f;
}

.client-check ul,
.check-list {
  margin: 12px 0 0;
  padding-left: 1.25em;
  line-height: 1.9;
  font-weight: 700;
}

.client-check .button {
  margin-top: 16px;
}

.results-feedback .split {
  align-items: stretch;
}

.case-data-card {
  align-self: center;
  padding: 28px;
}

.case-data-card dl {
  margin: 0;
}

.case-data-card div {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px dashed rgba(0,104,183,.22);
}

.case-data-card dt {
  color: var(--green);
  font-weight: 900;
}

.case-data-card dd {
  margin: 0;
  color: #3d5366;
}

.area-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 22px;
}

.area-chip-grid a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 7px 13px;
  color: var(--blue);
  background: rgba(255,255,255,.82);
  border: 2px solid rgba(0,104,183,.12);
  border-radius: 999px;
  font-weight: 900;
  text-decoration: none;
}

.area-photo img {
  object-position: center 56%;
}

.area-coverage-embed .button {
  margin-top: 22px;
}

.compliance-strip.section--stage::after {
  display: none;
}

@media (max-width: 980px) {
  .insight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .insight-grid,
  .detail-lanes,
  .answer-grid {
    grid-template-columns: 1fr;
  }

  .insight-grid article:nth-child(n),
  .detail-lanes article:nth-child(n),
  .answer-grid article:nth-child(n) {
    transform: none;
  }

  .case-data-card div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* 2026-07-18 review fixes: customer-facing copy, readable legal strip, compact result cards, full-card routes */
.impact-word,
.home-hero h1 .impact-word,
.page-hero h1 .impact-word:nth-of-type(odd),
.section-heading h2 .impact-word:nth-of-type(n) {
  text-emphasis: none !important;
  -webkit-text-emphasis: none !important;
}

.impact-word::before,
.impact-word::after,
.section-heading h2 .impact-word::before,
.section-heading h2 .impact-word::after {
  content: none !important;
  display: none !important;
}

.customer-answer-guide .section-heading,
.service-depth .section-heading,
.price-depth .section-heading,
.results-feedback .section-heading,
.area-coverage-deep .section-heading {
  max-width: 880px;
}

.compliance-strip.section--stage {
  color: #17384c !important;
  background: #eef7f6 !important;
}

.compliance-strip.section--stage.stage-compliance::before {
  background-image:
    linear-gradient(90deg, rgba(245,252,255,.91), rgba(247,252,249,.86) 48%, rgba(255,255,255,.74)),
    url("../img/generated/section-compliance-disposal.jpg") !important;
}

.compliance-strip.section--stage .eyebrow {
  color: var(--green);
}

.compliance-strip.section--stage h2 {
  color: var(--blue);
  text-shadow: none;
}

.compliance-strip.section--stage h2 span {
  color: var(--orange);
}

.compliance-strip.section--stage p,
.compliance-strip.section--stage dd,
.compliance-strip.section--stage small {
  color: #334b5f;
  text-shadow: none;
}

.compliance-strip.section--stage dl div {
  background: rgba(255,255,255,.78);
  border-left-color: var(--orange);
  box-shadow: 0 10px 24px rgba(3,56,96,.08);
}

.compliance-strip.section--stage dt {
  color: var(--blue);
}

.is-clickable-card {
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.is-clickable-card:hover {
  filter: brightness(1.01);
  box-shadow: 0 18px 34px rgba(3,56,96,.16);
}

.is-clickable-card:focus-visible {
  outline: 3px solid rgba(255,69,20,.55);
  outline-offset: 4px;
}

@media (min-width: 981px) {
  .results-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
  }

  .result-card,
  .result-card:nth-child(even) {
    grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
    align-items: stretch;
    min-height: 0;
    transform: none !important;
  }

  .result-card .before-after {
    min-height: 0;
    height: 242px;
  }

  .result-card .result-image,
  .result-card .result-image img {
    height: 242px;
    min-height: 0;
  }

  .result-card .result-image img {
    object-fit: cover;
  }

  .result-card__copy {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 108px;
    column-gap: 14px;
    align-content: start;
    min-height: 0 !important;
    padding: 16px 16px 14px !important;
  }

  .result-card__copy > :not(.cutout-slot) {
    grid-column: 1;
  }

  .result-card h3 {
    margin: 8px 0;
    font-size: 17px;
    line-height: 1.35;
  }

  .big-price {
    margin-bottom: 7px;
  }

  .big-price strong {
    font-size: clamp(27px, 2.1vw, 34px);
    line-height: 1.08;
  }

  .spec {
    margin: 8px 0 10px;
  }

  .result-card .button {
    min-height: 42px;
    padding: 6px 8px;
  }

  .cutout-slot,
  .result-card:nth-child(2n) .cutout-slot,
  .result-card:nth-child(3n) .cutout-slot {
    position: relative;
    top: auto;
    right: auto;
    grid-column: 2;
    grid-row: 1 / 8;
    align-self: start;
    width: 106px;
    min-height: 154px;
    margin: 0;
    padding-top: 22px;
    transform: rotate(3deg);
  }

  .cutout-slot img {
    width: 88px;
    height: 120px;
  }

  .cutout-slot > span {
    width: 106px;
    font-size: 7px;
  }
}

@media (min-width: 1280px) {
  .results-grid {
    width: min(1320px, calc(100vw - 96px));
    margin-inline: auto;
  }
}

/* 2026-07-18 second review: clearer photo cards, real item backgrounds, tighter PC grids */
@media (min-width: 981px) {
  .price-include .section-heading h2 {
    white-space: nowrap;
    font-size: clamp(28px, 3.05vw, 42px);
  }
}

.number-grid article {
  min-height: 148px !important;
  padding: 22px 20px 20px 74px !important;
  color: #fff;
  background: #123f63 !important;
  border: 0 !important;
  box-shadow: 0 14px 28px rgba(3,56,96,.16) !important;
}

.section:not(.section--green) .number-grid article {
  color: #fff;
}

.number-grid article::after {
  opacity: .76 !important;
  background-size: cover !important;
  background-position: center !important;
  filter: none !important;
}

.number-grid article::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(0,42,76,.76), rgba(0,42,76,.38) 58%, rgba(0,42,76,.08));
  pointer-events: none;
}

.number-grid article > * {
  position: relative;
  z-index: 2;
}

.number-grid b,
.section:not(.section--green) .number-grid b {
  top: 16px !important;
  left: 16px !important;
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  color: #fff !important;
  background: var(--orange);
  border-radius: 13px 13px 13px 3px;
  font-size: 18px !important;
  font-style: normal;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  transform: rotate(-4deg);
}

.number-grid h3 {
  margin: 0 0 7px;
  color: #fff;
  font-size: 20px;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
}

.number-grid p {
  color: rgba(255,255,255,.92);
  font-size: 13px;
  line-height: 1.65;
  text-shadow: 0 2px 10px rgba(0,0,0,.22);
}

.section--green {
  background: linear-gradient(135deg, #063c63, #0d7968 58%, #f0a22b 140%);
}

.section--green::before {
  opacity: .26 !important;
}

.request-item-grid article {
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 22px !important;
  color: #fff;
  background-position: center !important;
  background-size: cover !important;
  border: 0 !important;
  box-shadow: 0 15px 30px rgba(3,56,96,.18) !important;
  backdrop-filter: none !important;
}

.request-item-grid article::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(180deg, rgba(0,28,48,.10), rgba(0,36,64,.82));
  pointer-events: none;
}

.request-item-grid article > * {
  position: relative;
  z-index: 1;
}

.request-item-grid article:nth-child(1) { background-image: url("../img/generated/item-furniture-large.jpg") !important; }
.request-item-grid article:nth-child(2) { background-image: url("../img/generated/item-appliances.jpg") !important; }
.request-item-grid article:nth-child(3) { background-image: url("../img/generated/item-documents-valuables.jpg") !important; }
.request-item-grid article:nth-child(4) { background-image: url("../img/generated/item-keepsakes.jpg") !important; }
.request-item-grid article:nth-child(5) { background-image: url("../img/generated/item-hobbies-collections.jpg") !important; }
.request-item-grid article:nth-child(6) { background-image: url("../img/generated/item-clothing-bedding.jpg") !important; }

.request-item-grid b {
  width: max-content;
  padding: 5px 9px;
  color: #fff;
  background: var(--orange);
  border-radius: 999px;
  font-size: 15px;
  text-shadow: none;
}

.request-item-grid h3 {
  color: #fff;
  margin: 10px 0 8px;
  text-shadow: 0 2px 12px rgba(0,0,0,.32);
}

.request-item-grid p {
  color: rgba(255,255,255,.94);
  line-height: 1.72;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
}

.insight-grid article,
.detail-lanes article,
.answer-grid article,
.case-data-card,
.client-check,
.decision-panel,
.decision-grid article {
  background: rgba(255,255,255,.72);
  backdrop-filter: none;
}

@media (min-width: 1280px) {
  .results-grid {
    width: min(1480px, calc(100vw - 44px));
    gap: 22px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }

  .result-card {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  }

  .result-card .before-after,
  .result-card .result-image,
  .result-card .result-image img {
    height: 250px;
  }

  .result-card__copy {
    grid-template-columns: minmax(0, 1fr) 130px;
    column-gap: 14px;
  }

  .cutout-slot,
  .result-card:nth-child(2n) .cutout-slot,
  .result-card:nth-child(3n) .cutout-slot {
    width: 128px;
    min-height: 184px;
  }

  .cutout-slot img {
    width: 108px;
    height: 150px;
  }

  .cutout-slot > span {
    width: 126px;
    font-size: 7px;
  }
}

@media (max-width: 600px) {
  .number-grid article {
    padding: 72px 18px 18px !important;
  }

  .request-item-grid article {
    min-height: 238px;
  }
}

/* 2026-07-18 third review: clear photo cards, corner numbers, two-photo lower heroes, compact mobile cards */
.number-grid article,
.request-item-grid article {
  background-color: #17384c !important;
}

.number-grid article::after {
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

.number-grid article:nth-child(1)::after { background-image: url("../img/generated/work-carrying.jpg") !important; }
.number-grid article:nth-child(2)::after { background-image: url("../img/generated/sorting-keepsakes.jpg") !important; }
.number-grid article:nth-child(3)::after { background-image: url("../img/generated/items-arranged.jpg") !important; }
.number-grid article:nth-child(4)::after { background-image: url("../img/generated/handover-consultation.jpg") !important; }
.number-grid article:nth-child(5)::after { background-image: url("../img/generated/room-after.jpg") !important; }
.number-grid article:nth-child(6)::after { background-image: url("../img/generated/hero-consultation.jpg") !important; }

.number-grid article::before {
  background: linear-gradient(180deg, rgba(0,0,0,0) 36%, rgba(0,0,0,.68) 100%) !important;
}

.number-grid b,
.section:not(.section--green) .number-grid b,
.request-item-grid b {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 42px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  color: #fff !important;
  background: var(--orange) !important;
  border-radius: 0 0 14px 0 !important;
  font-family: "Arial Black", "Noto Sans JP", sans-serif !important;
  font-size: 15px !important;
  font-style: normal !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  transform: none !important;
}

.number-grid article {
  padding: 58px 22px 20px !important;
}

.request-item-grid article::before {
  background: linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.70) 100%) !important;
}

.request-item-grid article {
  min-height: 248px;
}

.section--green {
  background: linear-gradient(135deg, #07516d 0%, #168a78 72%, #f7b64b 145%) !important;
}

.section--green::before {
  opacity: .13 !important;
}

.page-hero .container {
  overflow: hidden;
}

.page-hero-photos {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.page-hero .hero-image {
  position: absolute !important;
  top: auto !important;
  right: auto !important;
  margin: 0 !important;
  opacity: .72 !important;
  filter: drop-shadow(0 18px 20px rgba(0,75,120,.12));
}

.page-hero .hero-image--primary {
  right: clamp(18px, 6.5vw, 118px) !important;
  top: 50% !important;
  width: min(31vw, 370px) !important;
  transform: translateY(-43%) rotate(4deg) !important;
}

.page-hero .hero-image--secondary {
  left: clamp(10px, 6vw, 92px) !important;
  bottom: 38px !important;
  width: min(23vw, 278px) !important;
  opacity: .58 !important;
  transform: rotate(-7deg) !important;
}

.page-hero .hero-image--secondary img {
  border-radius: 24px 8px 18px 6px;
  box-shadow: -10px 10px 0 rgba(26,151,126,.14);
}

.ribbon::after {
  top: 8px !important;
  right: auto !important;
  left: calc(100% + 24px) !important;
  padding: 2px 0;
  white-space: nowrap;
  transform: rotate(1deg) !important;
}

.voice-grid article .voice-image img {
  object-position: center;
}

@media (max-width: 760px) {
  .page-hero .container {
    padding: 42px 18px 74px;
  }

  .page-hero .hero-image--primary {
    left: auto !important;
    right: 5vw !important;
    bottom: 20px !important;
    top: auto !important;
    width: min(48vw, 230px) !important;
    opacity: .22 !important;
    transform: rotate(4deg) !important;
  }

  .page-hero .hero-image--secondary {
    right: auto !important;
    left: 3vw !important;
    bottom: 38px !important;
    width: min(38vw, 178px) !important;
    opacity: .18 !important;
    transform: rotate(-7deg) !important;
  }

  .ribbon::after {
    position: static;
    display: block;
    width: max-content;
    max-width: 100%;
    margin-top: 3px;
    font-size: 13px;
    white-space: normal;
    transform: rotate(0deg) !important;
  }
}

@media (max-width: 600px) {
  .media-grid,
  .service-grid,
  .price-grid,
  .number-grid,
  .three-cards,
  .voice-grid,
  .article-grid,
  .request-item-grid,
  .decision-grid,
  .answer-grid,
  .insight-grid,
  .detail-lanes,
  .results-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .section {
    padding: 38px 0;
  }

  .section-heading {
    margin-bottom: 24px;
  }

  .number-grid article,
  .request-item-grid article,
  .three-cards article,
  .answer-grid article,
  .insight-grid article,
  .detail-lanes article,
  .decision-grid article {
    min-height: 142px !important;
    padding: 40px 10px 12px !important;
    border-radius: 6px 17px 7px 15px !important;
  }

  .number-grid b,
  .section:not(.section--green) .number-grid b,
  .request-item-grid b {
    width: 31px !important;
    height: 27px !important;
    font-size: 11px !important;
    border-radius: 0 0 10px 0 !important;
  }

  .number-grid h3,
  .request-item-grid h3,
  .three-cards h3,
  .answer-grid h3,
  .insight-grid h3,
  .detail-lanes h3,
  .decision-grid b {
    margin: 0 0 6px !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
  }

  .number-grid p,
  .request-item-grid p,
  .three-cards p,
  .answer-grid p,
  .insight-grid p,
  .detail-lanes p,
  .decision-grid p,
  .service-grid p,
  .voice-grid p,
  .article-grid p {
    font-size: 10.5px !important;
    line-height: 1.48 !important;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .number-grid p,
  .answer-grid p,
  .insight-grid p,
  .detail-lanes p,
  .decision-grid p {
    -webkit-line-clamp: 3;
  }

  .request-item-grid p {
    -webkit-line-clamp: 4;
  }

  .service-grid > a,
  .voice-grid article,
  .article-grid article,
  .price-grid article {
    padding: 10px !important;
    border-radius: 6px 17px 7px 15px !important;
    transform: none !important;
  }

  .service-image,
  .voice-image {
    margin: -10px -10px 9px !important;
  }

  .service-image img,
  .voice-image img {
    height: 96px !important;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }

  .service-grid h3,
  .voice-grid h3,
  .article-grid h3,
  .price-grid h3 {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  .service-grid b,
  .voice-grid a,
  .article-grid a,
  .price-grid a {
    font-size: 10.5px !important;
  }

  .results-grid {
    width: 100% !important;
  }

  .result-card,
  .result-card:nth-child(even) {
    display: block !important;
    min-height: 0 !important;
    border-radius: 6px 17px 7px 15px !important;
    transform: none !important;
  }

  .result-card .before-after {
    display: grid;
    grid-template-columns: 1fr 1fr;
    height: 126px !important;
  }

  .result-card .result-image,
  .result-card .result-image img {
    height: 126px !important;
  }

  .result-card__copy {
    display: block !important;
    grid-template-columns: none !important;
    min-height: 0 !important;
    padding: 10px !important;
  }

  .result-card h3 {
    font-size: 12.5px !important;
    line-height: 1.45 !important;
  }

  .big-price strong {
    font-size: 24px !important;
    line-height: 1.05 !important;
  }

  .spec {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 3px !important;
  }

  .spec div {
    padding: 4px 2px !important;
  }

  .spec dt,
  .spec dd {
    font-size: 9px !important;
  }

  .cutout-slot {
    display: none !important;
  }

  .result-card .button {
    width: 100%;
    min-height: 0;
    padding: 7px 8px;
    font-size: 10px;
  }
}

/* Smartphone-only refinement: first-view clarity, cleaner headlines, and shorter repeated legal flow. */
@media (max-width: 760px) {
  body.is-lower:not(.page-guide):not(.page-faq) .compliance-strip {
    display: none !important;
  }

  .is-home .home-hero {
    min-height: auto;
  }

  .is-home .home-hero .container {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    min-height: auto !important;
    padding: 24px 18px 34px !important;
    gap: 12px !important;
    text-align: center;
  }

  .is-home .home-hero .container > div:first-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  .is-home .home-hero .container::before,
  .is-home .home-hero .container::after,
  .is-home .home-hero .hero-image::after {
    display: none !important;
  }

  .is-home .ribbon {
    max-width: 292px;
    margin: 0 auto 6px !important;
    padding: 5px 11px 6px;
    font-size: 11px;
    line-height: 1.35;
    text-align: center;
    transform: rotate(-1.5deg);
  }

  .is-home .ribbon::after {
    position: static !important;
    display: block;
    margin-top: 2px;
    color: var(--green);
    font-size: 12px;
    line-height: 1.35;
    white-space: normal;
    transform: none !important;
  }

  .hero-service-label {
    display: grid !important;
    place-items: center;
    gap: 2px;
    width: min(100%, 330px);
    margin: 4px auto 8px !important;
    padding: 8px 12px 10px;
    color: #fff !important;
    background: linear-gradient(135deg, var(--blue), #15977e);
    border: 3px solid #fff;
    border-radius: 16px 5px 16px 5px;
    box-shadow: 0 10px 22px rgba(3,56,96,.14), 5px 5px 0 rgba(255,196,38,.34);
    font-family: "Noto Sans JP", sans-serif;
    text-align: center;
    letter-spacing: 0;
  }

  .hero-service-label span,
  .hero-service-label strong {
    display: block;
    color: #fff;
    line-height: 1.15;
  }

  .hero-service-label span {
    font-size: 19px;
    font-weight: 900;
  }

  .hero-service-label strong {
    font-size: 26px;
    font-weight: 950;
  }

  .is-home .home-hero h1 {
    margin: 3px auto 10px !important;
    width: 100%;
    color: var(--blue);
    font-size: clamp(25px, 7.25vw, 31px) !important;
    line-height: 1.22 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap;
  }

  .is-home .home-hero h1 br {
    display: none;
  }

  .is-home .home-hero h1 span {
    display: inline;
    font-size: 1em;
  }

  .is-home .hero-lead {
    max-width: 335px;
    margin: 0 auto 8px;
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
  }

  .is-home .home-hero .button-row {
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin-top: 2px;
  }

  .is-home .home-hero .button-row .button {
    min-height: 0;
    padding: 11px 13px;
    font-size: 12px;
  }

  .is-home .home-hero .hero-phone {
    font-size: 18px;
    text-align: center;
  }

  .is-home .home-hero .hero-image {
    position: relative;
    order: 2;
    width: min(86vw, 340px);
    margin: 10px auto 0 !important;
    transform: rotate(1.2deg) !important;
    opacity: 1 !important;
    z-index: 3;
  }

  .is-home .home-hero .hero-image img {
    aspect-ratio: 16 / 10;
    border-width: 6px;
    border-radius: 8px 24px 7px 20px;
    object-position: 50% center;
  }

  .is-home .badge-row {
    position: absolute;
    left: 50%;
    bottom: 108px;
    z-index: 8;
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 0;
    transform: translateX(-50%);
    pointer-events: none;
  }

  .is-home .badge-row b {
    width: 62px;
    height: 62px;
    border-width: 3px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 8px 18px rgba(3,56,96,.18);
    font-size: 20px;
    transform: rotate(-7deg);
  }

  .is-home .badge-row b:nth-child(2) {
    transform: rotate(6deg);
  }

  .is-home .badge-row small {
    font-size: 8px;
  }

  .is-home .feature-strip article {
    min-height: 78px;
    padding: 10px 8px;
  }

  .is-home .feature-strip i {
    font-size: 20px;
  }

  .is-home .feature-strip strong {
    font-size: 12px;
  }

  .is-home .feature-strip small {
    font-size: 9px;
  }

  .section-heading h2 {
    text-wrap: balance;
  }

  .page-price .page-hero h1,
  .page-results .section-heading h2,
  .request-items .section-heading h2 {
    line-height: 1.28 !important;
  }

  .area-coverage-deep .container.split,
  .page-area main > .section .container.split {
    text-align: center;
    justify-items: center;
  }

  .area-coverage-deep h2,
  .page-area h2 {
    text-align: center;
  }

  .area-chip-grid,
  .area-links {
    justify-content: center;
  }

  .area-photo {
    max-width: 330px;
    margin-inline: auto;
  }
}

@media (max-width: 380px) {
  .hero-service-label span {
    font-size: 17px;
  }

  .hero-service-label strong {
    font-size: 24px;
  }

  .is-home .home-hero h1 {
    font-size: 24px !important;
  }

  .is-home .home-hero .button-row {
    flex-direction: column;
  }
}

/* 2026-07-18 mobile sequence polish: FV badge placement, four-photo collage, tighter price/area cards */
.home-hero .button-row {
  flex-wrap: wrap;
}

.home-hero .button-row .badge-row {
  order: -1;
  flex-basis: 100%;
  justify-content: flex-start;
}

@media (max-width: 760px) {
  .is-home .home-hero .container {
    padding: 24px 18px 38px !important;
    gap: 10px !important;
  }

  .is-home .home-hero .container > div:first-child {
    position: relative;
    max-width: 360px;
    margin-inline: auto;
  }

  .is-home .home-hero .button-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 72px;
    grid-template-areas:
      "cta badges"
      "phone badges";
    align-items: center;
    justify-items: center;
    column-gap: 7px;
    row-gap: 3px;
    width: min(100%, 330px);
    margin: 4px auto 0 !important;
  }

  .is-home .home-hero .button-row .button {
    grid-area: cta;
    width: 100%;
    max-width: none;
  }

  .is-home .home-hero .hero-phone {
    grid-area: phone;
    width: 100%;
    font-size: 18px;
  }

  .is-home .badge-row {
    position: static !important;
    grid-area: badges;
    left: auto !important;
    bottom: auto !important;
    z-index: 8;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 0 !important;
    transform: none !important;
    pointer-events: none;
  }

  .is-home .badge-row b {
    width: 42px !important;
    height: 42px !important;
    border-width: 2px !important;
    font-size: 13px !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 5px 13px rgba(3,56,96,.15);
  }

  .is-home .badge-row small {
    font-size: 6px !important;
    line-height: 1.12 !important;
  }

  .is-home .home-hero .hero-image {
    width: min(74vw, 306px) !important;
    height: 184px;
    margin: 16px auto 0 !important;
  }

  .is-home .home-hero .hero-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: cover;
    border-width: 5px;
    border-radius: 8px 24px 7px 20px;
  }

  .is-home .home-hero .container::before,
  .is-home .home-hero .container::after,
  .is-home .home-hero .hero-image::after {
    content: "" !important;
    position: absolute !important;
    display: block !important;
    aspect-ratio: 4 / 3;
    background-size: cover;
    background-position: center;
    border: 4px solid rgba(255,255,255,.96);
    border-radius: 7px 20px 8px 18px;
    box-shadow: 0 12px 22px rgba(3,56,96,.18), 5px 5px 0 rgba(255,196,38,.24);
    pointer-events: none;
  }

  .is-home .home-hero .container::before {
    z-index: 6;
    top: auto !important;
    left: max(12px, calc(50% - 174px));
    right: auto !important;
    bottom: 178px;
    width: 86px;
    background-image: url("../img/generated/hero-family-table.jpg") !important;
    opacity: .95;
    transform: rotate(-8deg);
  }

  .is-home .home-hero .container::after {
    z-index: 7;
    right: max(10px, calc(50% - 178px));
    bottom: 48px;
    width: 92px;
    background-image: url("../img/generated/hero-keepsakes-hands.jpg") !important;
    opacity: .96;
    transform: rotate(8deg);
  }

  .is-home .home-hero .hero-image::after {
    z-index: 8;
    left: -18px;
    bottom: -17px;
    width: 86px;
    background-image: url("../img/generated/hero-house-exterior.jpg") !important;
    opacity: .98;
    transform: rotate(-6deg);
  }

  .page-guide .page-hero h1 {
    text-wrap: balance;
  }

  .price-depth .section-heading h2 {
    line-height: 1.24 !important;
  }

  .price-depth .section-heading h2 .impact-word {
    display: inline-block;
  }

  .price-depth .insight-grid article {
    position: relative;
    min-height: 108px !important;
    padding: 11px 10px 12px 42px !important;
    text-align: left;
  }

  .price-depth .insight-grid b {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 34px !important;
    height: 30px !important;
    display: inline-grid !important;
    place-items: center;
    color: #fff !important;
    background: var(--orange) !important;
    border-radius: 0 0 12px 0;
    font-size: 12px !important;
    text-shadow: none !important;
  }

  .price-depth .insight-grid h3 {
    display: block;
    margin: 0 0 5px !important;
    font-size: 13px !important;
    line-height: 1.28 !important;
  }

  .price-depth .insight-grid p {
    margin: 0 !important;
    font-size: 10.5px !important;
    line-height: 1.45 !important;
    -webkit-line-clamp: 3;
  }

  .area-coverage-deep h2 {
    line-height: 1.25 !important;
  }

  .area-coverage-deep .container.split > div:first-child > p:not(.eyebrow) {
    max-width: 31em;
    margin-inline: auto;
    line-height: 1.68;
    text-wrap: balance;
  }

  .area-chip-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: 360px;
    gap: 7px !important;
    margin-inline: auto;
  }

  .area-chip-grid a {
    justify-content: center;
    min-height: 40px;
    padding: 7px 4px;
    font-size: 12px;
  }
}

@media (max-width: 380px) {
  .is-home .home-hero .button-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 66px;
  }

  .is-home .badge-row b {
    width: 39px !important;
    height: 39px !important;
  }

  .is-home .home-hero .hero-image {
    width: min(72vw, 276px) !important;
    height: 168px;
  }

  .area-chip-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Final readability pass: green-section emphasis should stay warm/red, not blue. */
.section--green .section-heading h2 .impact-word:nth-of-type(n),
.section--green .section-heading h2 .impact-word--orange {
  color: var(--orange) !important;
  font-family: inherit !important;
  text-shadow: 2px 2px 0 rgba(0,0,0,.16) !important;
  transform: rotate(-1.2deg) !important;
}

/* 2026-08 mobile usability pass: keep every item readable without changing copy. */
@media (max-width: 760px) {
  /* The home headline has intentional markup for two lines.  Do not force it onto
     one line: on narrow physical screens that clipped the last characters. */
  .is-home .home-hero h1 {
    width: 100%;
    max-width: none;
    white-space: normal;
    text-wrap: balance;
  }

  .is-home .home-hero h1 br {
    display: block;
  }

  /* Give each lower-page hero its full available measure, then balance the
     existing copy instead of letting its hard-coded desktop break create 4+ lines. */
  .page-hero .container > div:first-child {
    width: 100%;
  }

  .page-hero h1 {
    width: 100%;
    margin-inline: auto;
    font-size: clamp(23px, 7vw, 28px) !important;
    line-height: 1.32 !important;
    letter-spacing: 0 !important;
    text-wrap: balance;
  }

  .page-hero h1 br {
    display: none;
  }

  .page-hero h1 span {
    font-size: 1.04em;
  }

  /* This service name is substantially longer than the other hero labels.
     Keep the same wording but give it a two-line treatment on phones. */
  .page-service-house-cleaning .page-hero h1 {
    font-size: 20px !important;
    letter-spacing: -.04em !important;
  }

  .page-service-house-cleaning .page-hero h1 span {
    font-size: 1em;
  }

  .page-hero .button-row,
  .page-hero .hero-phone {
    width: 100%;
  }

  .page-hero .button-row .button {
    width: min(100%, 330px);
    min-height: 50px;
    padding-inline: 12px;
    font-size: 13px;
    line-height: 1.35;
  }

  /* Never crop card copy on a phone.  Cards may grow vertically, but all
     supplied information remains available without a hidden line clamp. */
  .number-grid p,
  .request-item-grid p,
  .three-cards p,
  .answer-grid p,
  .insight-grid p,
  .detail-lanes p,
  .decision-grid p,
  .service-grid p,
  .voice-grid p,
  .article-grid p,
  .price-grid p {
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }
}

@media (max-width: 380px) {
  .page-hero .container {
    padding-inline: 10px;
  }

  .page-hero h1 {
    font-size: 21px !important;
  }

  .page-service-house-cleaning .page-hero h1 {
    font-size: 17.5px !important;
    letter-spacing: -.055em !important;
  }

  .is-home .home-hero h1 {
    font-size: 25px !important;
    line-height: 1.22 !important;
  }

  .is-home .home-hero .button-row .button {
    font-size: 11.5px;
    white-space: nowrap;
  }

  /* Keep the four-photo collage clear of the phone number on compact screens. */
  .is-home .home-hero .container::before {
    bottom: 116px;
    width: 72px;
  }
}

/* 2026-08 Mobile UX pass: preserve every word, give each card one clear job,
   and keep the established desktop design untouched. */
@media (max-width: 760px) {
  h1, h2, h3, summary, dt,
  .button, .tag, .ribbon, .hero-sticker, .hero-lead {
    word-break: auto-phrase;
    line-break: strict;
  }

  h1, h2, h3, summary {
    text-wrap: balance;
  }

  p, li, dd {
    text-wrap: pretty;
  }

  .impact-word,
  .page-hero h1 span,
  .section-heading h2 span,
  .cta-block h2 em {
    display: inline-block;
    max-width: 100%;
  }
}

@media (max-width: 600px) {
  /* Read-first cards: do not compress copy just to retain a two-column grid. */
  .number-grid,
  .request-item-grid,
  .three-cards,
  .answer-grid,
  .insight-grid,
  .detail-lanes,
  .decision-grid,
  .voice-grid,
  .article-grid,
  .results-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  .number-grid article,
  .request-item-grid article,
  .three-cards article,
  .answer-grid article,
  .insight-grid article,
  .detail-lanes article,
  .decision-grid article {
    min-height: 0 !important;
    padding: 52px 18px 20px !important;
  }

  .three-cards article,
  .answer-grid article,
  .insight-grid article,
  .detail-lanes article,
  .decision-grid article {
    padding-top: 20px !important;
  }

  .number-grid h3,
  .request-item-grid h3,
  .three-cards h3,
  .answer-grid h3,
  .insight-grid h3,
  .detail-lanes h3,
  .decision-grid h3 {
    margin-bottom: 8px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .number-grid p,
  .request-item-grid p,
  .three-cards p,
  .answer-grid p,
  .insight-grid p,
  .detail-lanes p,
  .decision-grid p,
  .voice-grid p,
  .article-grid p {
    display: block !important;
    margin: 0 !important;
    overflow: visible !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    -webkit-line-clamp: none !important;
  }

  /* Photo-led choice cards stay compact, but their image and type regain room. */
  .service-grid,
  .price-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .service-grid > a,
  .price-grid article {
    padding: 12px !important;
  }

  .service-image,
  .voice-image {
    margin: -12px -12px 12px !important;
  }

  .service-image img,
  .voice-image img {
    width: 100%;
    height: auto !important;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }

  .service-grid h3,
  .price-grid h3,
  .voice-grid h3,
  .article-grid h3 {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  .service-grid p,
  .price-grid p {
    display: block !important;
    overflow: visible !important;
    font-size: 12px !important;
    line-height: 1.65 !important;
    -webkit-line-clamp: none !important;
  }

  /* A work result is a reading task on a phone: give its photos and actions
     a full-width, touch-friendly composition. */
  .result-card,
  .result-card:nth-child(even) {
    min-height: 0 !important;
  }

  .result-card .before-after,
  .result-card .result-image,
  .result-card .result-image img {
    height: clamp(150px, 48vw, 180px) !important;
  }

  .result-card .result-image img {
    object-fit: cover;
  }

  .result-card__copy {
    padding: 16px !important;
  }

  .result-card h3 {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .big-price strong {
    font-size: 30px !important;
    line-height: 1.15 !important;
  }

  .result-card .button {
    min-height: 44px !important;
    padding: 10px 12px !important;
    font-size: 12px !important;
  }

  /* The price explanation is information-first, even inside its deeper section. */
  .price-depth .insight-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  .price-depth .insight-grid article {
    min-height: 0 !important;
    padding: 20px 18px 18px 52px !important;
  }

  .price-depth .insight-grid h3 {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .price-depth .insight-grid p {
    display: block !important;
    overflow: visible !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    -webkit-line-clamp: none !important;
  }
}

@keyframes memorie-fade-in {
  from { opacity: 0; }
}

@keyframes memorie-settle-in {
  from { opacity: 0; transform: translateY(12px); }
}

/* Initial visit only: a short, gentle settling motion for the mobile home FV. */
@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  .mobile-enter--fade { animation: memorie-fade-in .7s ease-out both; }
  .mobile-enter--settle { animation: memorie-settle-in .7s cubic-bezier(.22,.61,.36,1) both; }

  .is-home .home-hero .ribbon {
    animation: memorie-fade-in .55s ease-out .05s backwards;
  }

  .is-home .hero-service-label {
    animation: memorie-settle-in .65s cubic-bezier(.22,.61,.36,1) .14s backwards;
  }

  .is-home .home-hero h1 {
    animation: memorie-settle-in .7s cubic-bezier(.22,.61,.36,1) .28s backwards;
  }

  .is-home .home-hero .hero-lead {
    animation: memorie-settle-in .7s cubic-bezier(.22,.61,.36,1) .42s backwards;
  }

  .is-home .home-hero .button-row {
    animation: memorie-settle-in .7s cubic-bezier(.22,.61,.36,1) .56s backwards;
  }

  .is-home .home-hero .hero-image img {
    animation: memorie-fade-in .75s ease-out .7s backwards;
  }

  .is-home .home-hero .container::before,
  .is-home .home-hero .container::after,
  .is-home .home-hero .hero-image::after {
    animation: memorie-fade-in .65s ease-out .86s backwards;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* A lower-page hero can contain one long emphasized phrase.  Let that phrase
   use the browser's Japanese phrase wrapping instead of turning it into a
   single unbreakable box on compact screens. */
@media (max-width: 760px) {
  .page-hero h1 span {
    display: inline;
    max-width: none;
  }
}

@media (max-width: 380px) {
  .page-service-fuyouhin .page-hero h1 {
    font-size: 19px !important;
    letter-spacing: -.035em !important;
  }
}

/* 2026-08 Mobile FV focus pass: the family-facing promise leads the first view. */
@media (max-width: 760px) {
  .is-home .home-hero .container {
    padding-top: 22px !important;
    padding-bottom: 42px !important;
    gap: 9px !important;
  }

  /* Keep required provisional information present, but let it support rather
     than compete with the core promise. */
  .is-home .home-hero .ribbon {
    max-width: 268px;
    margin-bottom: 4px !important;
    padding: 4px 9px 5px;
    color: #5f542b;
    background: rgba(255, 225, 100, .76);
    box-shadow: none;
    font-size: 9.5px;
    line-height: 1.35;
  }

  .is-home .hero-service-label {
    width: min(100%, 292px);
    margin: 2px auto 10px !important;
    padding: 7px 11px 8px;
    box-shadow: 0 7px 16px rgba(3,56,96,.12), 4px 4px 0 rgba(255,196,38,.22);
  }

  .is-home .hero-service-label span {
    font-size: 17px;
  }

  .is-home .hero-service-label strong {
    font-size: 22px;
  }

  .is-home .home-hero h1 {
    width: 100%;
    max-width: none;
    margin: 8px auto 12px !important;
    color: #005b9f;
    font-size: clamp(29px, 9vw, 35px) !important;
    font-weight: 900;
    line-height: 1.13 !important;
    letter-spacing: -.025em !important;
    text-align: center;
    text-shadow: 0 2px 0 rgba(255,255,255,.92), 0 8px 16px rgba(0,104,183,.10);
  }

  .is-home .home-hero h1 br,
  .is-home .home-hero h1 span {
    display: block;
  }

  .is-home .home-hero h1 span {
    margin-top: 3px;
    color: #07826e;
  }

  .is-home .hero-lead {
    max-width: 338px;
    margin: 0 auto 12px !important;
    color: #263b47;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.76;
  }

  .is-home .home-hero .button-row {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "cta"
      "phone"
      "badges";
    row-gap: 6px;
    width: min(100%, 322px);
    margin-top: 5px !important;
  }

  .is-home .home-hero .button-row .button {
    min-height: 50px;
    padding: 12px 14px;
    font-size: 12.5px;
    white-space: nowrap;
  }

  .is-home .home-hero .hero-phone {
    font-size: 18px;
    line-height: 1.1;
  }

  .is-home .badge-row {
    flex-direction: row !important;
    gap: 7px;
    padding-top: 2px;
  }

  .is-home .badge-row b {
    width: 36px !important;
    height: 36px !important;
    border-width: 2px !important;
    box-shadow: 0 3px 9px rgba(3,56,96,.10);
    font-size: 10px !important;
  }

  .is-home .badge-row small {
    font-size: 5.5px !important;
  }

  .is-home .home-hero .hero-image {
    width: min(78vw, 324px) !important;
    height: 198px;
    margin-top: 24px !important;
  }

  .is-home .home-hero .container::before {
    bottom: 132px;
  }
}

@media (max-width: 380px) {
  .is-home .home-hero h1 {
    font-size: 29px !important;
  }

  .is-home .home-hero .container::before {
    bottom: 128px;
    width: 68px;
  }
}

@keyframes memorie-concept-rise {
  from { opacity: 0; transform: translateY(18px); }
}

@keyframes memorie-soft-appear {
  from { opacity: 0; }
}

/* CSS alone can finish before the browser paints.  The ready class is added
   after two animation frames in main.js, so this progression is visible. */
@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  .is-home .home-hero .ribbon,
  .is-home .hero-service-label,
  .is-home .home-hero h1,
  .is-home .home-hero .hero-lead,
  .is-home .home-hero .button-row,
  .is-home .home-hero .hero-image img,
  .is-home .home-hero .container::before,
  .is-home .home-hero .container::after,
  .is-home .home-hero .hero-image::after {
    animation: none;
    will-change: opacity, transform;
  }

  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .ribbon,
  html.has-fv-motion:not(.is-fv-ready) .is-home .hero-service-label,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero h1,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .hero-lead,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .button-row,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .hero-image img,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .container::before,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .container::after,
  html.has-fv-motion:not(.is-fv-ready) .is-home .home-hero .hero-image::after {
    opacity: 0;
  }

  html.has-fv-motion.is-fv-ready .is-home .home-hero .ribbon {
    animation: memorie-soft-appear .36s ease-out .04s both;
  }

  html.has-fv-motion.is-fv-ready .is-home .hero-service-label {
    animation: memorie-concept-rise .56s cubic-bezier(.22,.61,.36,1) .11s both;
  }

  html.has-fv-motion.is-fv-ready .is-home .home-hero h1 {
    animation: memorie-concept-rise .72s cubic-bezier(.22,.61,.36,1) .20s both;
  }

  html.has-fv-motion.is-fv-ready .is-home .home-hero .hero-lead {
    animation: memorie-concept-rise .62s cubic-bezier(.22,.61,.36,1) .38s both;
  }

  html.has-fv-motion.is-fv-ready .is-home .home-hero .button-row {
    animation: memorie-concept-rise .60s cubic-bezier(.22,.61,.36,1) .51s both;
  }

  html.has-fv-motion.is-fv-ready .is-home .home-hero .hero-image img {
    animation: memorie-soft-appear .72s ease-out .45s both;
  }

  html.has-fv-motion.is-fv-ready .is-home .home-hero .container::before,
  html.has-fv-motion.is-fv-ready .is-home .home-hero .container::after,
  html.has-fv-motion.is-fv-ready .is-home .home-hero .hero-image::after {
    animation: memorie-soft-appear .55s ease-out .72s both;
  }
}

/* 2026-09 Home opening: let the official logo emerge softly before revealing
   the existing FV as one coherent scene. */
@keyframes memorie-intro-bloom {
  0% { opacity: .1; transform: scale(.68); }
  48% { opacity: .82; transform: scale(1.04); }
  100% { opacity: .58; transform: scale(1.18); }
}

@keyframes memorie-intro-logo {
  0% { opacity: 0; filter: blur(18px); transform: translateY(14px) scale(.92); }
  58% { opacity: .94; filter: blur(3px); }
  100% { opacity: 1; filter: blur(0); transform: translateY(0) scale(1); }
}

@keyframes memorie-intro-line {
  from { transform: scaleX(0); opacity: 0; }
  to { transform: scaleX(1); opacity: 1; }
}

html.has-fv-intro {
  overflow: hidden;
}

@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  html.has-fv-intro .site-header,
  html.has-fv-intro .home-hero {
    opacity: 0;
    transform: translateY(10px);
  }

  html.has-fv-intro.is-fv-ready .site-header,
  html.has-fv-intro.is-fv-ready .home-hero {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 1.3s ease-out, transform 1.3s cubic-bezier(.22,.61,.36,1);
  }

  .home-intro {
    position: fixed;
    z-index: 120;
    inset: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    isolation: isolate;
    color: #075c81;
    background:
      linear-gradient(140deg, rgba(244,252,255,.96), rgba(255,252,243,.96) 48%, rgba(236,249,241,.98)),
      url("../img/generated/hero-consultation.jpg") center / cover;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .home-intro::before,
  .home-intro::after {
    position: absolute;
    z-index: -1;
    content: "";
    border-radius: 50%;
    pointer-events: none;
  }

  .home-intro::before {
    width: 92vw;
    height: 92vw;
    max-width: 480px;
    max-height: 480px;
    background: radial-gradient(circle, rgba(255,223,105,.64), rgba(255,223,105,0) 70%);
    filter: blur(7px);
    animation: memorie-intro-bloom 3.2s ease-in-out both;
  }

  .home-intro::after {
    width: 130vw;
    height: 130vw;
    background: radial-gradient(circle, rgba(93,190,169,.25), rgba(93,190,169,0) 68%);
    transform: translate(28%, -32%);
  }

  .home-intro__bloom {
    position: absolute;
    z-index: -1;
    width: 54vw;
    height: 54vw;
    min-width: 205px;
    min-height: 205px;
    border: 1px solid rgba(7,130,110,.2);
    border-radius: 50%;
    box-shadow: 0 0 0 17px rgba(255,255,255,.32), 0 0 0 39px rgba(255,255,255,.15);
    animation: memorie-intro-bloom 3.2s ease-in-out both;
  }

  .home-intro__inner {
    width: min(80vw, 330px);
    padding: 22px;
    text-align: center;
  }

  .home-intro__logo {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
    filter: drop-shadow(0 10px 24px rgba(79,45,25,.12));
    animation: memorie-intro-logo 1.65s cubic-bezier(.22,.61,.36,1) .28s both;
  }

  .home-intro__line {
    display: block;
    width: min(152px, 42vw);
    height: 2px;
    margin: 16px auto 0;
    transform-origin: center;
    background: linear-gradient(90deg, transparent, #e2b934 18%, #e2b934 82%, transparent);
    animation: memorie-intro-line .85s ease-out 1.68s both;
  }

  .home-intro.is-leaving {
    opacity: 0;
    transform: scale(1.025);
    transition: opacity 1.7s ease-in, transform 1.7s ease-in;
    pointer-events: none;
  }

  .home-intro.is-leaving .home-intro__inner {
    opacity: 0;
    transform: translateY(-12px);
    transition: opacity .8s ease-in, transform 1.1s ease-in;
  }

  .home-intro.is-skipped {
    transition-duration: .62s;
  }

  /* In the actual FV the service label supports the promise instead of
     competing with it. The h1 remains intentionally two lines. */
  .is-home .hero-service-label {
    width: min(100%, 250px);
    margin-bottom: 8px !important;
    padding: 5px 9px 6px;
    box-shadow: 0 5px 12px rgba(3,56,96,.1), 3px 3px 0 rgba(255,196,38,.18);
  }

  .is-home .hero-service-label span {
    font-size: 12px;
  }

  .is-home .hero-service-label strong {
    font-size: 17px;
  }

  .is-home .home-hero h1 {
    margin: 10px auto 14px !important;
    font-size: clamp(34px, 10.6vw, 42px) !important;
    line-height: 1.1 !important;
    letter-spacing: -.035em !important;
  }

  .is-home .home-hero h1 span {
    margin-top: 5px;
  }

  .is-home .hero-lead {
    max-width: 340px;
    font-size: 13px;
  }
}

/* The desktop opening uses the same restrained logo treatment as mobile. */
@media (min-width: 761px) and (prefers-reduced-motion: no-preference) {
  html.has-fv-intro .site-header,
  html.has-fv-intro .home-hero {
    opacity: 0;
    transform: translateY(14px);
  }

  html.has-fv-intro.is-fv-ready .site-header,
  html.has-fv-intro.is-fv-ready .home-hero {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 1.45s ease-out, transform 1.45s cubic-bezier(.22,.61,.36,1);
  }

  .home-intro {
    position: fixed;
    z-index: 120;
    inset: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    isolation: isolate;
    color: #075c81;
    background:
      linear-gradient(140deg, rgba(244,252,255,.96), rgba(255,252,243,.96) 48%, rgba(236,249,241,.98)),
      url("../img/generated/hero-consultation.jpg") center / cover;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .home-intro::before,
  .home-intro::after {
    position: absolute;
    z-index: -1;
    content: "";
    border-radius: 50%;
    pointer-events: none;
  }

  .home-intro::before {
    width: min(62vw, 880px);
    height: min(62vw, 880px);
    background: radial-gradient(circle, rgba(255,223,105,.64), rgba(255,223,105,0) 70%);
    filter: blur(10px);
    animation: memorie-intro-bloom 3.2s ease-in-out both;
  }

  .home-intro::after {
    width: 72vw;
    height: 72vw;
    background: radial-gradient(circle, rgba(93,190,169,.25), rgba(93,190,169,0) 68%);
    transform: translate(32%, -34%);
  }

  .home-intro__bloom {
    position: absolute;
    z-index: -1;
    width: min(32vw, 460px);
    height: min(32vw, 460px);
    min-width: 280px;
    min-height: 280px;
    border: 1px solid rgba(7,130,110,.2);
    border-radius: 50%;
    box-shadow: 0 0 0 23px rgba(255,255,255,.32), 0 0 0 56px rgba(255,255,255,.15);
    animation: memorie-intro-bloom 3.2s ease-in-out both;
  }

  .home-intro__inner {
    width: min(38vw, 470px);
    padding: 34px;
    text-align: center;
  }

  .home-intro__logo {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
    filter: drop-shadow(0 14px 32px rgba(79,45,25,.12));
    animation: memorie-intro-logo 1.65s cubic-bezier(.22,.61,.36,1) .28s both;
  }

  .home-intro__line {
    display: block;
    width: min(220px, 22vw);
    height: 2px;
    margin: 20px auto 0;
    transform-origin: center;
    background: linear-gradient(90deg, transparent, #e2b934 18%, #e2b934 82%, transparent);
    animation: memorie-intro-line .85s ease-out 1.68s both;
  }

  .home-intro.is-leaving {
    opacity: 0;
    transform: scale(1.025);
    transition: opacity 1.7s ease-in, transform 1.7s ease-in;
    pointer-events: none;
  }

  .home-intro.is-leaving .home-intro__inner {
    opacity: 0;
    transform: translateY(-14px);
    transition: opacity .8s ease-in, transform 1.1s ease-in;
  }

  .home-intro.is-skipped {
    transition-duration: .62s;
  }
}

/* 2026-08 mobile art direction: retain every existing word, but let imagery
   establish each section and keep compact cards from becoming tall columns. */
@media (max-width: 760px) {
  /* Section scenes use the same assets as desktop.  The translucent veil keeps
     copy legible while making the image unmistakably present on a phone. */
  .section::before {
    opacity: 1 !important;
    background-image:
      linear-gradient(180deg, rgba(255,255,255,.62), rgba(255,255,255,.72)),
      url("../img/generated/section-family-consultation.jpg") !important;
    background-position: 52% center !important;
    background-size: cover !important;
  }

  .section.section--cream::before {
    background-image:
      linear-gradient(180deg, rgba(255,250,238,.60), rgba(255,247,229,.71)),
      url("../img/generated/section-family-consultation.jpg") !important;
    background-position: 48% center !important;
  }

  .section.section--blue::before {
    background-image:
      linear-gradient(180deg, rgba(236,249,255,.58), rgba(242,250,255,.70)),
      url("../img/generated/section-moving-work.jpg") !important;
    background-position: 55% center !important;
  }

  .section.section--green::before {
    opacity: 1 !important;
    background-image:
      linear-gradient(135deg, rgba(5,65,90,.70), rgba(13,119,104,.66)),
      url("../img/generated/section-sorting-keepsakes.jpg") !important;
    background-position: 51% 36% !important;
  }

  .section.section--stage.stage-family::before {
    background-image:
      linear-gradient(180deg, rgba(255,255,255,.57), rgba(255,249,237,.72)),
      url("../img/generated/section-family-consultation.jpg") !important;
    background-position: 54% center !important;
  }

  .section.section--stage.stage-sorting::before {
    background-image:
      linear-gradient(180deg, rgba(244,253,255,.58), rgba(244,250,248,.70)),
      url("../img/generated/section-sorting-keepsakes.jpg") !important;
    background-position: 50% 36% !important;
  }

  .section.section--stage.stage-moving::before {
    background-image:
      linear-gradient(180deg, rgba(255,255,255,.59), rgba(250,249,244,.71)),
      url("../img/generated/section-moving-work.jpg") !important;
    background-position: 54% center !important;
  }

  .section.section--stage.stage-area::before {
    background-image:
      linear-gradient(180deg, rgba(255,255,255,.57), rgba(238,249,255,.70)),
      url("../img/generated/section-gunma-area.jpg") !important;
    background-position: 50% center !important;
  }

  .compliance-strip.section--stage.stage-compliance::before,
  .section.section--stage.stage-compliance::before {
    background-image:
      linear-gradient(90deg, rgba(245,252,255,.66), rgba(247,252,249,.62) 54%, rgba(255,255,255,.55)),
      url("../img/generated/section-compliance-disposal.jpg") !important;
    background-position: 52% center !important;
  }

  /* Service cards read as short, horizontal rows rather than six tall tiles.
     The image remains fully useful while every existing detail stays visible. */
  .service-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  .service-grid > a {
    display: grid !important;
    grid-template-columns: 112px minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    column-gap: 12px;
    min-height: 144px;
    padding: 0 12px 0 0 !important;
    overflow: hidden;
    border-radius: 7px 20px 8px 18px !important;
  }

  .service-grid .service-image {
    grid-column: 1;
    grid-row: 1 / -1;
    align-self: stretch;
    margin: 0 !important;
  }

  .service-grid .service-image img {
    width: 100%;
    height: 100% !important;
    aspect-ratio: auto;
    border-radius: 0;
    object-fit: cover;
  }

  .service-grid > a > span,
  .service-grid > a h3,
  .service-grid > a p,
  .service-grid > a > b {
    grid-column: 2;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .service-grid > a > span {
    align-self: end;
    margin-top: 11px;
    font-size: 12px !important;
  }

  .service-grid h3 {
    margin-top: 2px !important;
    margin-bottom: 3px !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
  }

  .service-grid p {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  .service-grid > a > b {
    margin-bottom: 11px;
    font-size: 11px !important;
  }

  .service-grid > a:nth-child(1) .service-image img { object-position: 48% 50%; }
  .service-grid > a:nth-child(2) .service-image img { object-position: 51% 31%; }
  .service-grid > a:nth-child(3) .service-image img { object-position: 52% 46%; }
  .service-grid > a:nth-child(4) .service-image img { object-position: 57% 35%; }
  .service-grid > a:nth-child(5) .service-image img { object-position: 58% 51%; }
  .service-grid > a:nth-child(6) .service-image img { object-position: 55% 29%; }

  /* The service-page consultation examples are photo cards. Use purposeful
     scenes and crop around the work, faces and valuables—not their edges. */
  .page-service .number-grid article {
    min-height: 218px !important;
    background-position: center !important;
  }

  .page-service .number-grid article:nth-child(1)::after {
    background-image: url("../img/generated/room-before.jpg") !important;
    background-position: 49% 52% !important;
  }

  .page-service .number-grid article:nth-child(2)::after {
    background-image: url("../img/generated/sorting-keepsakes.jpg") !important;
    background-position: 52% 31% !important;
  }

  .page-service .number-grid article:nth-child(3)::after {
    background-image: url("../img/generated/room-after.jpg") !important;
    background-position: 53% 51% !important;
  }

  .page-service .number-grid article:nth-child(4)::after {
    background-image: url("../img/generated/items-arranged.jpg") !important;
    background-position: 50% 46% !important;
  }

  .page-service .number-grid article:nth-child(5)::after {
    background-image: url("../img/generated/hero-house-exterior.jpg") !important;
    background-position: 50% 52% !important;
  }

  .page-service .number-grid article:nth-child(6)::after {
    background-image: url("../img/generated/hero-consultation.jpg") !important;
    background-position: 55% 28% !important;
  }

  .result-card .before-after {
    height: auto !important;
  }

  .result-card .result-image {
    height: auto !important;
    aspect-ratio: 4 / 3;
  }

  .result-card .result-image img {
    width: 100%;
    height: 100% !important;
    min-height: 0 !important;
  }

  .result-card .result-image:first-child img { object-position: 49% 48%; }
  .result-card .result-image:nth-child(2) img { object-position: 51% 50%; }

  .voice-grid .voice-image img {
    height: auto !important;
    aspect-ratio: 3 / 2;
    object-position: 50% 32% !important;
  }

  /* The primary promise and its photo share one screen. The image becomes a
     diagonal, soft-focus stage behind the label instead of a separate block
     below the CTAs. */
  .is-home .home-hero {
    min-height: calc(100svh - 68px) !important;
    background: linear-gradient(135deg, #eaf8ff 0%, #fffdf6 54%, #e7f5ee 100%);
  }

  .is-home .home-hero .container {
    display: block !important;
    min-height: calc(100svh - 68px) !important;
    padding: 18px 18px 26px !important;
    text-align: left;
  }

  .is-home .home-hero .container > div:first-child {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: calc(100svh - 112px);
    max-width: none;
    text-align: left;
  }

  .is-home .home-hero .container::before,
  .is-home .home-hero .container::after,
  .is-home .home-hero .hero-image::after {
    display: none !important;
  }

  .is-home .home-hero .hero-image {
    position: absolute !important;
    z-index: 1 !important;
    inset: 106px -6px 22px -6px;
    display: block;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    overflow: hidden;
    opacity: .40 !important;
    filter: saturate(.82) contrast(.93) !important;
    transform: none !important;
  }

  .is-home .home-hero .hero-image::before {
    position: absolute;
    z-index: 1;
    inset: 0;
    content: "";
    background: linear-gradient(180deg, rgba(255,253,246,.10), rgba(255,253,246,.82) 88%);
    pointer-events: none;
  }

  .is-home .home-hero .hero-image img {
    width: 100%;
    height: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    clip-path: polygon(0 8%, 100% 0, 100% 91%, 0 100%);
    box-shadow: none !important;
    object-fit: cover;
    object-position: 53% 46%;
  }

  .is-home .home-hero .ribbon {
    max-width: 258px;
    margin: 0 0 8px !important;
    text-align: left;
  }

  .is-home .hero-service-label {
    width: min(100%, 248px);
    margin: 0 0 12px !important;
    text-align: center;
  }

  .is-home .home-hero h1 {
    width: min(100%, 365px);
    margin: 0 0 13px !important;
    color: #005b9f;
    font-size: clamp(36px, 10.8vw, 44px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.045em !important;
    text-align: left !important;
    text-shadow: 0 3px 0 rgba(255,255,255,.96), 0 10px 20px rgba(0,104,183,.12);
  }

  .is-home .home-hero h1 span {
    margin-top: 6px;
  }

  .is-home .hero-lead {
    width: min(100%, 344px);
    max-width: none;
    margin: 0 !important;
    padding: 8px 10px;
    border-left: 3px solid rgba(7,130,110,.68);
    color: #173c4b;
    background: rgba(255,255,255,.73);
    font-size: 12px;
    line-height: 1.65;
  }

  .is-home .home-hero .button-row {
    grid-template-columns: minmax(0, 1fr) 60px !important;
    grid-template-areas:
      "cta badges"
      "phone badges";
    align-items: center;
    width: min(100%, 334px);
    margin-top: auto !important;
    padding-top: 16px;
  }

  .is-home .home-hero .button-row .button {
    min-height: 48px;
    font-size: 12px;
  }

  .is-home .home-hero .hero-phone {
    align-self: start;
    padding: 3px 6px 0;
    color: #075f92;
    background: rgba(255,255,255,.67);
    font-size: 17px;
  }

  .is-home .badge-row {
    gap: 4px;
  }

  .is-home .badge-row b {
    width: 30px !important;
    height: 30px !important;
    font-size: 8px !important;
  }

  .is-home .badge-row small {
    font-size: 4.8px !important;
  }
}

@media (max-width: 380px) {
  .service-grid > a {
    grid-template-columns: 98px minmax(0, 1fr);
    column-gap: 10px;
    min-height: 138px;
  }

  .is-home .home-hero h1 {
    font-size: 34px !important;
  }

  .is-home .home-hero .button-row {
    width: min(100%, 316px);
  }

}

/* Keep the hero photo as a tangible card inside the mobile first view.  The
   wide, softened scene stays behind the copy, while this original figure uses
   the open space above the CTA instead of extending the section vertically. */
@media (max-width: 760px) {
  .is-home .home-hero::after {
    position: absolute;
    z-index: 0;
    inset: 106px -6px 22px;
    display: block;
    content: "";
    background:
      linear-gradient(180deg, rgba(255,253,246,.10), rgba(255,253,246,.84) 88%),
      url("../img/generated/hero-consultation.jpg") 53% 46% / cover;
    clip-path: polygon(0 8%, 100% 0, 100% 91%, 0 100%);
    opacity: .38;
    filter: saturate(.82) contrast(.93);
    pointer-events: none;
  }

  .is-home .home-hero .hero-image {
    z-index: 2 !important;
    inset: auto auto clamp(174px, 25svh, 220px) 50% !important;
    width: min(82vw, 310px) !important;
    height: clamp(154px, 47vw, 186px) !important;
    overflow: visible;
    opacity: 1 !important;
    filter: drop-shadow(0 13px 18px rgba(3,56,96,.20)) !important;
    transform: translateX(-50%) rotate(1.4deg) !important;
  }

  .is-home .home-hero .hero-image::before {
    display: none;
  }

  .is-home .home-hero .hero-image img {
    display: block;
    height: 100%;
    border: 5px solid #fff !important;
    border-radius: 8px 22px 7px 19px !important;
    clip-path: none;
    box-shadow: 7px 8px 0 rgba(0,104,183,.14) !important;
    object-position: 53% 42%;
  }
}

@media (max-width: 380px) {
  .is-home .home-hero .hero-image {
    bottom: 168px !important;
    width: min(80vw, 272px) !important;
    height: 154px !important;
  }
}

/* 2026-08 mobile FV composition: two small trust cues share one row, the
   promise owns the centre, and the photo collage returns without adding height. */
@keyframes memorie-title-bloom {
  from { opacity: 0; transform: translateY(8px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 760px) {
  .is-home .home-hero .container > div:first-child {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    grid-template-areas:
      "ribbon service"
      "title title"
      "lead lead"
      ". ."
      "actions actions";
    grid-template-rows: auto auto auto 1fr auto;
    column-gap: 8px;
    row-gap: 0;
  }

  .is-home .home-hero .ribbon {
    grid-area: ribbon;
    align-self: start;
    width: 100%;
    max-width: none;
    min-height: 47px;
    margin: 0 !important;
    padding: 5px 7px 6px;
    font-size: 8.5px;
    line-height: 1.25;
    text-align: left;
    transform: rotate(-1.2deg);
  }

  .is-home .home-hero .ribbon::after {
    position: static !important;
    display: block !important;
    width: auto !important;
    max-width: none !important;
    margin: 3px 0 0 !important;
    color: #07826e;
    font-size: 8.5px !important;
    line-height: 1.25;
    white-space: normal !important;
    transform: none !important;
  }

  .is-home .hero-service-label {
    grid-area: service;
    align-self: start;
    justify-self: stretch;
    width: auto;
    min-height: 47px;
    margin: 0 !important;
    padding: 6px 7px;
  }

  .is-home .hero-service-label span {
    font-size: 10.5px;
  }

  .is-home .hero-service-label strong {
    font-size: 16px;
  }

  .is-home .home-hero h1 {
    grid-area: title;
    align-self: center;
    width: 100%;
    margin: 18px 0 14px !important;
    font-size: clamp(35px, 10.25vw, 42px) !important;
    line-height: 1.1 !important;
    text-align: center !important;
  }

  .is-home .hero-lead {
    grid-area: lead;
    justify-self: center;
    width: min(100%, 342px);
    margin: 0 auto !important;
  }

  .is-home .home-hero .button-row {
    grid-area: actions;
    align-self: end;
    margin-top: 0 !important;
  }

  /* The background stays soft but no longer requires a scrolling filter layer. */
  .is-home .home-hero::after {
    filter: none;
    opacity: .32;
  }

  .is-home .home-hero .hero-image {
    bottom: clamp(164px, 23.8svh, 210px) !important;
    filter: none !important;
    transform: translateX(-50%) rotate(1.4deg) !important;
  }

  /* Restore the three supporting snapshots around the real hero photograph.
     They are decorative only and remain out of the copy's reading path. */
  .is-home .home-hero .container::before,
  .is-home .home-hero .container::after,
  .is-home .home-hero .hero-image::after {
    position: absolute !important;
    display: block !important;
    z-index: 2;
    width: clamp(56px, 16vw, 72px) !important;
    aspect-ratio: 4 / 3;
    height: auto !important;
    content: "" !important;
    border: 3px solid rgba(255,255,255,.96) !important;
    border-radius: 6px 15px 7px 14px !important;
    background-position: center !important;
    background-size: cover !important;
    box-shadow: 0 8px 14px rgba(3,56,96,.16) !important;
    opacity: .96 !important;
    pointer-events: none;
  }

  .is-home .home-hero .container::before {
    top: auto !important;
    right: auto !important;
    bottom: clamp(340px, 46svh, 388px) !important;
    left: 4px !important;
    background-image: url("../img/generated/hero-family-table.jpg") !important;
    transform: rotate(-7deg) !important;
  }

  .is-home .home-hero .container::after {
    top: auto !important;
    right: 5px !important;
    bottom: clamp(220px, 30svh, 260px) !important;
    left: auto !important;
    background-image: url("../img/generated/hero-keepsakes-hands.jpg") !important;
    transform: rotate(7deg) !important;
  }

  .is-home .home-hero .hero-image::after {
    top: auto !important;
    right: -18px !important;
    bottom: -22px !important;
    left: auto !important;
    background-image: url("../img/generated/hero-house-exterior.jpg") !important;
    transform: rotate(5deg) !important;
  }
}

@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  html.has-fv-motion.is-fv-ready .is-home .home-hero h1 {
    animation: memorie-title-bloom .95s cubic-bezier(.22,.61,.36,1) .22s both;
  }
}

@media (max-width: 380px) {
  .is-home .home-hero .container > div:first-child {
    column-gap: 6px;
  }

  .is-home .home-hero .ribbon,
  .is-home .home-hero .ribbon::after {
    font-size: 7.5px !important;
  }

  .is-home .hero-service-label span {
    font-size: 9px;
  }

  .is-home .hero-service-label strong {
    font-size: 14px;
  }

  .is-home .home-hero h1 {
    margin-top: 15px !important;
    font-size: 33px !important;
  }

  .is-home .home-hero .hero-image {
    /* Keep the photograph clear of both the lead copy and the CTA on 320px screens. */
    bottom: 144px !important;
    height: 144px !important;
  }

  .is-home .home-hero .container::before {
    bottom: 315px !important;
  }

  .is-home .home-hero .container::after {
    bottom: 208px !important;
  }
}

/* 2026-08 mobile FV legibility: let the two proof cues use their allotted
   space without changing the CTA/phone anchor on the left. */
@media (max-width: 760px) {
  .is-home .home-hero .ribbon {
    padding: 4px 5px 5px !important;
    font-size: clamp(8.5px, 2.6vw, 10px) !important;
    line-height: 1.18 !important;
    text-align: center !important;
  }

  .is-home .home-hero .ribbon::after {
    margin-top: 2px !important;
    font-size: clamp(8.5px, 2.6vw, 10px) !important;
    line-height: 1.18 !important;
    text-align: center !important;
  }

  .is-home .home-hero .button-row {
    grid-template-columns: minmax(0, 1fr) 86px !important;
  }

  .is-home .badge-row {
    gap: 5px !important;
  }

  .is-home .badge-row b {
    width: 38px !important;
    height: 38px !important;
    font-size: 11px !important;
  }

  .is-home .badge-row small {
    font-size: 6.2px !important;
    line-height: 1.06 !important;
  }
}

@media (max-width: 380px) {
  .is-home .home-hero .button-row {
    grid-template-columns: minmax(0, 1fr) 60px !important;
  }

  .is-home .home-hero .button-row .button {
    padding-inline: 10px !important;
    gap: 6px !important;
  }

  .is-home .badge-row {
    justify-content: flex-start !important;
    gap: 3px !important;
    margin-left: 3px !important;
  }

  .is-home .badge-row b {
    width: 32px !important;
    height: 32px !important;
    font-size: 9.5px !important;
  }

  .is-home .badge-row small {
    font-size: 5.5px !important;
  }
}

/* 2026-08-19 client feedback 02: make the service unmistakable in the FV.
   The service and brand lead; the existing promise becomes supporting copy. */
.is-home .home-hero .hero-title {
  display: flex;
  align-items: baseline;
  flex-wrap: nowrap;
  gap: clamp(10px, 1.6vw, 20px);
  width: 100%;
  max-width: 680px;
  white-space: nowrap;
}

.is-home .home-hero .hero-title .hero-industry {
  display: inline-block;
  margin: 0;
  color: var(--green);
  font-size: 1em;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .025em;
  transform: none;
}

.is-home .home-hero .hero-title .hero-brand-name {
  display: inline-block;
  color: var(--blue);
  font-family: "Noto Sans JP", sans-serif;
  font-size: .43em;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .08em;
}

.is-home .hero-concept {
  margin: -3px 0 14px;
  color: var(--blue);
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(18px, 2vw, 25px);
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: .035em;
}

@media (max-width: 760px) {
  .is-home .home-hero .container > div:first-child {
    grid-template-areas:
      "ribbon service"
      "title title"
      "concept concept"
      "lead lead"
      ". ."
      "actions actions";
    grid-template-rows: auto auto auto auto 1fr auto;
  }

  .is-home .home-hero .hero-title {
    justify-content: center;
    gap: clamp(8px, 3vw, 13px);
    margin: 16px 0 6px !important;
    font-size: clamp(33px, 10.25vw, 42px) !important;
    line-height: 1 !important;
    text-align: center !important;
  }

  .is-home .home-hero .hero-title .hero-industry,
  .is-home .home-hero .hero-title .hero-brand-name {
    display: inline-block !important;
    margin: 0 !important;
  }

  .is-home .home-hero .hero-title .hero-brand-name {
    font-size: .44em;
  }

  .is-home .hero-concept {
    grid-area: concept;
    justify-self: center;
    width: 100%;
    margin: 0 0 9px;
    font-size: clamp(16px, 4.75vw, 19px);
    line-height: 1.35;
    text-align: center;
    white-space: nowrap;
  }

  /* Claude review: the service name leads inside the existing right-hand cue;
     "専門相談窓口" remains readable but no longer outranks it. */
  .is-home .hero-service-label span {
    display: block;
    font-size: clamp(12.5px, 3.5vw, 14px) !important;
    font-weight: 900;
    line-height: 1.22;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .is-home .hero-service-label strong {
    display: block;
    font-size: clamp(10.5px, 2.8vw, 11.5px) !important;
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: .04em;
    white-space: nowrap;
  }
}

@media (max-width: 340px) {
  .is-home .home-hero .hero-title {
    gap: 7px;
    font-size: 31px !important;
  }

  .is-home .hero-concept {
    font-size: 15px;
    letter-spacing: 0;
  }

  .is-home .hero-service-label span {
    font-size: 11.5px !important;
  }
}

@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  html.has-fv-motion:not(.is-fv-ready) .is-home .hero-concept {
    opacity: 0;
  }

  html.has-fv-motion.is-fv-ready .is-home .hero-concept {
    animation: memorie-concept-rise .62s cubic-bezier(.22,.61,.36,1) .34s both;
  }
}

/* 2026-08-19 mobile price navigation: show three complete shortcuts without clipping.
   The fourth section remains in the page; only its shortcut is hidden on phones. */
@media (max-width: 760px) {
  .page-price .anchor-nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: visible;
  }

  .page-price .anchor-nav a {
    min-width: 0;
    padding: 11px 5px;
    font-size: clamp(11px, 3vw, 12.5px);
    text-align: center;
  }

  .page-price .anchor-nav a:nth-child(4) {
    display: none;
  }

  .page-price .anchor-nav a:nth-child(3) {
    border-right: 0;
  }
}

/* 2026-08-20 basic service guide: reuse the existing cards, split layouts,
   colors and CTA while making the six shared tasks an explicit 01-06 flow. */
.page-service-basic #basic-service-flow,
.page-service-basic .basic-service-step {
  scroll-margin-top: 128px;
}

.page-service-basic .page-hero::after {
  display: none;
}

.basic-service-overview {
  padding-bottom: clamp(44px, 6vw, 76px);
}

.basic-service-position {
  max-width: 820px;
  margin: 0 auto 30px;
  color: var(--ink);
  font-size: clamp(14px, 1.7vw, 17px);
  font-weight: 700;
  line-height: 1.8;
  text-align: center;
}

.basic-service-flow {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.basic-service-flow a {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 92px;
  align-content: center;
  justify-items: center;
  gap: 4px;
  padding: 12px 8px;
  border: 1px solid var(--line);
  border-top: 5px solid var(--green);
  border-radius: 8px;
  color: var(--blue);
  background: #fff;
  box-shadow: var(--shadow);
  text-align: center;
}

.basic-service-flow a:not(:last-child)::after {
  content: "→";
  position: absolute;
  z-index: 1;
  top: 50%;
  right: -17px;
  color: var(--orange);
  font-size: 18px;
  transform: translateY(-50%);
}

.basic-service-flow b {
  color: var(--orange);
  font-size: 19px;
  line-height: 1;
}

.basic-service-flow span {
  font-size: clamp(11px, 1.15vw, 14px);
  font-weight: 900;
  line-height: 1.35;
}

.basic-service-flow a:focus-visible,
.basic-service-card:focus-visible,
.basic-service-return:focus-visible,
.basic-service-dialog__close:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 5px var(--deep-blue);
}

.basic-service-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.basic-service-card {
  display: block;
  min-width: 0;
  min-height: 44px;
  border-radius: 8px;
}

.basic-service-card > article {
  height: 100%;
  min-height: 174px;
  color: var(--ink);
}

.basic-service-card strong {
  display: block;
  margin-top: 14px;
  color: var(--green);
  font-size: 13px;
}

.basic-service-step__layout {
  align-items: stretch;
}

.basic-service-step__copy {
  align-self: center;
}

.basic-service-step__intro {
  position: relative;
}

.basic-service-step__copy h2 {
  margin: 0 0 22px;
  color: var(--blue);
  font-size: clamp(30px, 4vw, 46px);
  line-height: 1.3;
}

.basic-service-step__copy h3 {
  margin: 20px 0 6px;
  color: var(--deep-green);
  font-size: 17px;
}

.basic-service-step__copy > p:not(.eyebrow):not(.basic-service-family) {
  margin: 0;
  color: var(--muted);
}

.basic-service-progress {
  display: grid;
  gap: 8px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  counter-reset: basic-progress;
}

.basic-service-progress li {
  position: relative;
  min-height: 44px;
  padding: 9px 12px 9px 46px;
  border-left: 3px solid var(--green);
  background: var(--pale-blue);
  counter-increment: basic-progress;
}

.basic-service-progress li::before {
  content: counter(basic-progress);
  position: absolute;
  top: 9px;
  left: 15px;
  color: var(--orange);
  font-weight: 900;
}

.basic-service-family {
  margin: 18px 0 0;
  padding: 14px 16px;
  border-left: 5px solid var(--orange);
  background: #fff;
}

.basic-service-family strong {
  display: block;
  margin-bottom: 3px;
  color: var(--blue);
}

.basic-service-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 22px;
}

.basic-service-return {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 8px 2px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.basic-service-step__image {
  height: 100%;
}

.basic-service-step__image img {
  height: 100%;
  min-height: 430px;
  object-fit: cover;
}

.basic-service-back {
  padding-top: 34px;
}

.basic-service-dialog {
  width: min(680px, calc(100% - 40px));
  max-height: min(780px, calc(100dvh - 40px));
  padding: 0;
  border: 0;
  border-radius: 14px;
  color: var(--ink);
  background: #fff;
  box-shadow: 0 24px 70px rgba(0, 40, 70, .28);
}

.basic-service-dialog::backdrop {
  background: rgba(5, 32, 48, .68);
}

.basic-service-dialog__inner {
  position: relative;
  padding: clamp(26px, 5vw, 48px);
  border-top: 8px solid var(--green);
}

.basic-service-dialog__inner h2 {
  margin: 0 0 14px;
  color: var(--blue);
  font-size: clamp(27px, 4vw, 38px);
}

.basic-service-dialog__inner h3 {
  margin: 22px 0 8px;
  color: var(--deep-green);
  font-size: 17px;
}

.basic-service-dialog__inner ul {
  margin: 0 0 26px;
  padding-left: 1.3em;
}

.basic-service-dialog__inner li + li {
  margin-top: 7px;
}

.basic-service-dialog__close {
  position: absolute;
  top: 12px;
  right: 12px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  padding: 0;
  border: 2px solid var(--blue);
  border-radius: 50%;
  color: var(--blue);
  background: #fff;
  font-size: 27px;
  line-height: 1;
}

@media (hover: hover) and (pointer: fine) {
  .basic-service-flow a:hover,
  .basic-service-card:hover {
    color: var(--ink);
    transform: translateY(-3px);
  }

  .basic-service-return:hover {
    color: var(--deep-blue);
  }

  .basic-service-dialog__close:hover {
    color: #fff;
    background: var(--blue);
  }
}

@media (max-width: 760px) {
  .page-service-basic #basic-service-flow,
  .page-service-basic .basic-service-step {
    scroll-margin-top: 92px;
  }

  .basic-service-overview {
    padding-top: 46px;
  }

  .basic-service-position br {
    display: none;
  }

  .basic-service-flow,
  .basic-service-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .basic-service-flow a {
    min-height: 76px;
    padding: 9px 6px;
  }

  .basic-service-flow a::after {
    display: none;
  }

  .basic-service-flow span {
    font-size: clamp(11px, 3.4vw, 13px);
  }

  .basic-service-card > article {
    min-height: 164px;
    padding: 18px 13px;
  }

  .basic-service-card > article h3 {
    font-size: clamp(15px, 4.4vw, 18px);
  }

  .basic-service-card > article p {
    font-size: 12px;
  }

  .basic-service-step__layout {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .basic-service-step__intro {
    isolation: isolate;
    overflow: hidden;
    margin: -8px -8px 22px;
    padding: 24px 20px;
    border: 1px solid rgba(0, 108, 174, .14);
    border-radius: 14px;
    background: #fff;
  }

  .basic-service-step__intro::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
      linear-gradient(rgba(255, 255, 255, .78), rgba(255, 255, 255, .78)),
      var(--basic-service-intro-image);
    background-position: center;
    background-size: cover;
    transform: scale(1.02);
  }

  .section--cream.basic-service-step .basic-service-step__intro::before {
    background-image:
      linear-gradient(rgba(255, 249, 240, .78), rgba(255, 249, 240, .78)),
      var(--basic-service-intro-image);
  }

  .basic-service-step__intro h2 {
    margin-bottom: 18px;
  }

  .basic-service-step__intro h3 {
    margin-top: 14px;
  }

  .basic-service-step__image {
    display: none;
  }

  .basic-service-step__image img {
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  .basic-service-actions {
    display: grid;
    gap: 9px;
  }

  .basic-service-return {
    justify-content: center;
  }

  .basic-service-dialog {
    width: calc(100% - 24px);
    max-height: calc(100dvh - 24px);
  }

  .basic-service-dialog__inner {
    padding: 30px 20px 24px;
  }
}

@media (max-width: 340px) {
  .basic-service-card > article {
    padding-inline: 10px;
  }

  .basic-service-card strong {
    font-size: 11.5px;
  }
}

/* 2026-08-20 feedback pass: responsive area lists, compact voice proof cues,
   three FAQ shortcuts and a denser mobile first view. */
.area-city-mobile,
.area-regions__mobile,
.voice-summary--hero {
  display: none;
}

.area-city-details {
  margin-top: 10px;
  border: 1px solid rgba(0, 104, 183, .18);
  border-radius: 12px;
  background: rgba(255, 255, 255, .84);
}

.area-city-details summary {
  position: relative;
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 10px 42px 10px 14px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.35;
  text-align: center;
  cursor: pointer;
  list-style: none;
}

.area-city-details summary::-webkit-details-marker {
  display: none;
}

.area-city-details summary::after {
  position: absolute;
  right: 16px;
  content: "+";
  color: var(--green);
  font-size: 24px;
  line-height: 1;
}

.area-city-details[open] summary::after {
  content: "−";
}

.area-city-details summary:focus-visible {
  outline: 3px solid #f4c84c;
  outline-offset: 3px;
}

.area-city-details .area-chip-grid {
  margin: 0;
  padding: 0 10px 12px;
}

.page-area .stage-area .section-heading h2,
.page-area .stage-area .section-heading h2 .impact-word {
  color: var(--blue) !important;
  text-shadow: none !important;
}

.page-faq .anchor-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: visible;
}

.page-faq .anchor-nav a {
  display: grid;
  min-width: 0;
  min-height: 44px;
  place-items: center;
  text-align: center;
}

.page-voice .page-hero-title-row > h1 {
  margin-block: 8px 18px;
}

@media (max-width: 760px) {
  .area-chip-grid--desktop,
  .area-regions__desktop {
    display: none !important;
  }

  .area-city-mobile,
  .area-regions__mobile {
    display: block;
    width: 100%;
  }

  .area-city-mobile .area-chip-grid--featured,
  .area-city-mobile .area-chip-grid--remaining {
    display: grid !important;
  }

  .area-city-mobile .area-chip-grid--featured {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .area-city-mobile .area-chip-grid--remaining {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .page-faq .anchor-nav {
    width: calc(100% - 26px);
  }

  .page-faq .anchor-nav a {
    padding: 10px 5px;
    font-size: clamp(11px, 3.1vw, 12.5px);
    white-space: normal;
  }

  .page-voice .page-hero-title-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 5px;
    width: min(100%, 330px);
    margin-inline: auto;
  }

  .page-voice .page-hero-title-row > h1 {
    margin: 8px 0 18px !important;
    text-align: center;
  }

  .page-voice .voice-summary--hero {
    display: flex;
    align-items: center;
    gap: 3px;
    margin: 0 0 8px;
    pointer-events: none;
  }

  .page-voice .voice-summary--hero b {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    font-size: 15px;
  }

  .page-voice .voice-summary--hero small {
    font-size: 7px;
    line-height: 1.05;
  }

  .page-voice .voice-summary--hero b:first-child {
    transform: rotate(-6deg) translateY(5px);
  }

  .page-voice .voice-summary--hero b:last-child {
    transform: rotate(4deg) translateY(-2px);
  }

  .page-voice .voice-summary--content {
    display: none;
  }

  .is-home .home-hero,
  .is-home .home-hero .container {
    min-height: clamp(590px, calc(100svh - 220px), 625px) !important;
  }

  .is-home .home-hero .container {
    padding: 14px 14px 18px !important;
  }

  .is-home .home-hero .container > div:first-child {
    min-height: clamp(558px, calc(100svh - 252px), 593px) !important;
  }

  .is-home .home-hero .hero-title {
    align-items: center;
    justify-content: center;
    gap: clamp(6px, 2vw, 9px);
    margin: 12px 0 5px !important;
    font-size: clamp(29px, 8.5vw, 36px) !important;
    letter-spacing: 0 !important;
  }

  .is-home .home-hero .hero-title .hero-industry,
  .is-home .home-hero .hero-title .hero-brand-name {
    font-size: 1em !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
  }

  .is-home .home-hero .hero-title-separator {
    display: block;
    width: 2px;
    height: .88em;
    flex: 0 0 2px;
    background: linear-gradient(180deg, var(--green), var(--blue));
    border-radius: 99px;
    opacity: .72;
  }

  .is-home .hero-concept {
    margin-bottom: 6px;
  }

  .is-home .home-hero .hero-image {
    bottom: clamp(148px, 20.5svh, 174px) !important;
    height: clamp(142px, 40vw, 166px) !important;
  }

  .is-home .home-hero .hero-image img {
    object-position: 53% 38%;
  }

  .is-home .home-hero .container::before {
    bottom: clamp(292px, 39svh, 332px) !important;
  }

  .is-home .home-hero .container::after {
    bottom: clamp(188px, 25svh, 220px) !important;
  }
}

@media (max-width: 380px) {
  .area-city-mobile .area-chip-grid--featured,
  .area-city-mobile .area-chip-grid--remaining {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .is-home .home-hero .hero-title {
    gap: 5px;
    font-size: clamp(27px, 8.45vw, 31px) !important;
  }

  .is-home .home-hero .hero-image {
    bottom: 140px !important;
    height: 138px !important;
  }

  .is-home .home-hero .container::before {
    bottom: 282px !important;
  }

  .is-home .home-hero .container::after {
    bottom: 181px !important;
  }
}

/* 2026-08-20 area cleanup: use a second Gunma landscape so adjacent
   coverage sections do not repeat the same photograph. */
.section.section--stage.stage-area.area-gunma-guide-v2::before {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.70), rgba(238,249,255,.88)),
    url("../img/generated/section-gunma-area-v2.jpg") !important;
}

.area-gunma-guide-v2 .area-photo img {
  object-position: center 58%;
}

/* 2026-08-20 FV hierarchy: make both the service name and brand the
   unmistakable primary lockup, while moving the desktop photo right. */
@media (min-width: 900px) {
  .is-home .home-hero .container {
    width: min(1240px, calc(100% - 40px));
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
    gap: 22px;
  }

  .is-home .home-hero .hero-title {
    align-items: center;
    max-width: none;
    gap: clamp(10px, 1.1vw, 16px);
    font-size: clamp(48px, 4.8vw, 70px);
    letter-spacing: 0;
  }

  .is-home .home-hero .hero-service-label {
    position: relative;
    top: 18px;
  }

  .is-home .home-hero .hero-title .hero-industry,
  .is-home .home-hero .hero-title .hero-brand-name {
    font-size: 1em;
    letter-spacing: 0;
  }

  .is-home .home-hero .hero-title-separator {
    display: block;
    width: 3px;
    height: .86em;
    flex: 0 0 3px;
    align-self: center;
    background: linear-gradient(180deg, var(--green), var(--blue));
    border-radius: 99px;
    opacity: .72;
  }

  .is-home .home-hero .hero-image {
    transform: translate(clamp(10px, 2vw, 32px), 4px) rotate(2.4deg) !important;
  }
}

@media (max-width: 760px) {
  .is-home .home-hero .container {
    width: 100%;
    max-width: none;
    padding-inline: 8px !important;
  }

  .is-home .home-hero .hero-title {
    gap: 4px;
    font-size: clamp(34px, 10.8vw, 44px) !important;
  }

  .is-home .home-hero .hero-title .hero-industry,
  .is-home .home-hero .hero-title .hero-brand-name {
    letter-spacing: 0 !important;
  }
}

@media (max-width: 340px) {
  .is-home .home-hero .hero-title {
    font-size: clamp(32px, 10.5vw, 35px) !important;
  }
}

/* 2026-08-29 client review: remove draft cues and tighten the primary flows. */
.page-hero::after {
  display: none !important;
  content: none !important;
}

.page-blog-before-consultation .page-hero .container > div:first-child {
  max-width: 1100px;
}

.page-blog-before-consultation .page-hero h1 {
  font-size: clamp(38px, 3.1vw, 52px);
  line-height: 1.28;
}

.page-blog-before-consultation .blog-title-line {
  display: inline-block;
  color: var(--orange) !important;
  white-space: nowrap;
}

.page-blog-before-consultation .blog-title-line--primary,
.page-blog-before-consultation .blog-title-line--primary .impact-word {
  color: var(--blue) !important;
}

.home-estimate > .container > .section-heading {
  text-align: center !important;
}

.home-estimate__heading-line {
  display: block;
  color: var(--orange) !important;
}

.home-estimate__heading-line--primary {
  color: var(--blue) !important;
}

.is-home .home-hero .hero-brand-logo {
  display: block !important;
  overflow: hidden;
  flex: 0 0 auto;
  width: clamp(180px, 16vw, 230px);
  aspect-ratio: 651 / 390;
  margin: 0 !important;
  align-self: center;
  transform: none !important;
}

.is-home .home-hero .hero-brand-logo img {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
}

@media (min-width: 761px) {
  .is-home .home-hero .container {
    min-height: 520px;
  }
}

@media (max-width: 760px) {
  .page-blog-before-consultation .page-hero h1 {
    font-size: clamp(30px, 8.8vw, 38px);
  }

  .page-blog-before-consultation .blog-title-line--primary {
    white-space: normal;
  }

  .is-home .home-hero .container > div:first-child {
    grid-template-areas:
      "ribbon service"
      "title title"
      "lead lead"
      ". ."
      "actions actions";
    grid-template-rows: auto auto auto 1fr auto;
    min-height: clamp(525px, calc(100svh - 270px), 565px) !important;
  }

  .is-home .home-hero,
  .is-home .home-hero .container {
    min-height: clamp(555px, calc(100svh - 240px), 595px) !important;
  }

  .is-home .home-hero .hero-brand-logo {
    width: clamp(120px, 36vw, 150px);
  }

  .is-home .home-hero .button-row {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "cta"
      "phone" !important;
    width: min(100%, 316px);
  }

  .is-home .area-coverage-embed {
    padding-bottom: 32px;
  }

  .is-home .area-coverage-embed .area-photo {
    display: none;
  }
}

/* 2026-09-03 supplied case studies: compact, evidence-led results and voices. */
.case-index__intro {
  max-width: 760px;
  margin: 0 auto 42px;
  text-align: center;
}

.case-index__intro h2 {
  margin: 8px 0 14px;
  color: var(--blue);
  font-size: clamp(30px, 3.2vw, 46px);
  line-height: 1.28;
  letter-spacing: 0;
}

.case-index__intro h2 span {
  color: var(--orange);
}

.case-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

.case-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cfe0e9;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(10, 70, 107, .08);
}

.case-card__link {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.case-photo-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.case-photo {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 2 / 3;
  background: #edf4f7;
}

.case-photo > span {
  position: absolute;
  z-index: 1;
  top: 10px;
  left: 10px;
  min-width: 70px;
  padding: 6px 10px;
  border-radius: 4px;
  background: rgba(255, 255, 255, .94);
  color: var(--blue);
  font-family: "Noto Sans JP", sans-serif;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: center;
  box-shadow: 0 2px 8px rgba(0, 39, 66, .14);
}

.case-photo:last-child > span {
  background: var(--green);
  color: #fff;
}

.case-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.case-card__photos {
  gap: 3px;
  padding: 12px 12px 0;
}

.case-card__photos .case-photo {
  border-radius: 6px;
}

.case-card__body {
  padding: 22px 24px 24px;
}

.case-card__tags,
.voice-detail__heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  color: #526b7a;
  font-size: 13px;
  font-weight: 700;
}

.case-card__tags .tag,
.voice-detail__heading .tag {
  margin: 0;
}

.case-card h2,
.voice-case-card h2 {
  margin: 14px 0 10px;
  color: #082f49;
  font-size: clamp(20px, 1.8vw, 26px);
  line-height: 1.45;
  letter-spacing: 0;
}

.case-card__body > p:not(.case-price) {
  margin: 0 0 18px;
  line-height: 1.9;
}

.case-specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 22px 0;
  border-top: 1px solid #d8e5eb;
  border-left: 1px solid #d8e5eb;
}

.case-specs > div {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  min-width: 0;
  border-right: 1px solid #d8e5eb;
  border-bottom: 1px solid #d8e5eb;
}

.case-specs dt,
.case-specs dd {
  min-width: 0;
  margin: 0;
  padding: 10px 12px;
  overflow-wrap: anywhere;
}

.case-specs dt {
  background: #eff7fa;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
}

.case-specs dd {
  font-size: 14px;
  font-weight: 700;
}

.case-specs--compact {
  grid-template-columns: 1fr;
  margin: 18px 0;
}

.case-specs--compact > div {
  grid-template-columns: 76px minmax(0, 1fr);
}

.case-card .case-price,
.case-detail .case-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 20px 0;
  padding: 14px 16px;
  border-left: 4px solid var(--orange);
  background: #fff7ed;
}

.case-card .case-price span,
.case-detail .case-price span {
  color: #526b7a;
  font-size: 13px;
  font-weight: 800;
}

.case-card .case-price strong,
.case-detail .case-price strong {
  color: var(--orange);
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(26px, 2.5vw, 36px);
  line-height: 1.2;
  letter-spacing: 0;
}

.case-card .case-price small,
.case-detail .case-price small {
  color: #526b7a;
  font-size: 12px;
}

.case-card__more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--blue);
  font-size: 14px;
}

.case-card__link:hover .case-card__more,
.case-card__link:focus-visible .case-card__more {
  color: var(--orange);
}

.case-card__link:focus-visible {
  outline: 3px solid #ffb547;
  outline-offset: -3px;
}

.case-note {
  margin: 28px auto 0;
  color: #526b7a;
  font-size: 13px;
  line-height: 1.8;
  text-align: center;
}

.case-detail__overview {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  align-items: start;
  gap: 42px;
}

.case-detail__photos {
  max-width: 660px;
}

.case-detail__photos .case-photo,
.voice-detail__photos .case-photo {
  border-radius: 8px;
}

.case-detail__summary h2 {
  margin: 14px 0 12px;
  color: var(--blue);
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.38;
  letter-spacing: 0;
}

.case-detail__story h2,
.case-detail__voice h2 {
  margin: 8px 0 18px;
  color: var(--blue);
  font-size: clamp(28px, 3vw, 40px);
  letter-spacing: 0;
}

.case-detail__story > p:last-child {
  line-height: 2.1;
}

.case-detail__voice blockquote,
.voice-detail blockquote {
  margin: 0;
  padding: 30px 34px;
  border: 1px solid #cfe0e9;
  border-left: 5px solid var(--green);
  border-radius: 6px;
  background: #f7fbfc;
}

.case-detail__voice blockquote p,
.voice-detail blockquote p {
  margin: 0;
  font-size: 17px;
  line-height: 2.1;
}

.case-detail__voice cite,
.voice-detail cite {
  display: block;
  margin-top: 16px;
  color: #526b7a;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  text-align: right;
}

.voice-index .voice-filter {
  margin-top: 0;
}

.voice-case-list {
  display: grid;
  gap: 28px;
}

.voice-case-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  align-items: center;
  gap: 34px;
  padding: 30px;
  border: 1px solid #cfe0e9;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(10, 70, 107, .07);
}

.voice-case-card__customer {
  margin: 0 0 16px;
  color: #526b7a;
  font-size: 13px;
  font-weight: 700;
}

.voice-case-card blockquote {
  margin: 0 0 18px;
  padding: 18px 20px;
  border-left: 4px solid var(--green);
  background: #f4faf8;
}

.voice-case-card blockquote p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-height: 1.9;
}

.voice-case-card__copy > a {
  color: var(--blue);
  font-weight: 800;
}

.voice-case-card__photos {
  gap: 4px;
}

.voice-case-card__photos .case-photo {
  border-radius: 6px;
}

.voice-detail__heading {
  margin-bottom: 18px;
}

.voice-detail__photos {
  width: min(100%, 760px);
  margin: 28px auto;
}

.voice-detail__case-link {
  width: min(100%, 760px);
  margin: 0 auto;
  padding: 24px;
  border: 1px solid #cfe0e9;
  border-radius: 8px;
  background: #fff;
}

.voice-detail__case-link h3 {
  margin: 0;
  color: var(--blue);
  font-size: 24px;
  line-height: 1.5;
  letter-spacing: 0;
}

@media (max-width: 900px) {
  .case-list,
  .case-detail__overview,
  .voice-case-card {
    grid-template-columns: 1fr;
  }

  .case-detail__photos,
  .voice-case-card__photos {
    width: min(100%, 660px);
    margin-inline: auto;
  }
}

@media (max-width: 760px) {
  .case-index__intro {
    margin-bottom: 28px;
  }

  .case-index__intro h2 {
    font-size: 30px;
  }

  .case-list,
  .voice-case-list {
    gap: 20px;
  }

  .case-card__photos {
    padding: 8px 8px 0;
  }

  .case-card__body {
    padding: 18px 18px 20px;
  }

  .case-photo > span {
    top: 7px;
    left: 7px;
    min-width: 58px;
    padding: 5px 7px;
    font-size: 11px;
  }

  .case-specs,
  .case-specs--compact {
    grid-template-columns: 1fr;
  }

  .case-specs > div,
  .case-specs--compact > div {
    grid-template-columns: 74px minmax(0, 1fr);
  }

  .case-specs dt,
  .case-specs dd {
    padding: 9px 10px;
  }

  .case-card .case-price,
  .case-detail .case-price {
    padding: 12px;
  }

  .case-detail__overview {
    gap: 26px;
  }

  .case-detail__voice blockquote,
  .voice-detail blockquote {
    padding: 22px 20px;
  }

  .case-detail__voice blockquote p,
  .voice-detail blockquote p {
    font-size: 15px;
    line-height: 2;
  }

  .voice-case-card {
    gap: 22px;
    padding: 20px 18px;
  }

  .voice-case-card__photos {
    grid-row: 1;
  }

  .voice-case-card blockquote p {
    -webkit-line-clamp: 5;
  }

  .voice-detail__case-link {
    padding: 20px 18px;
  }

  .voice-detail__case-link h3 {
    font-size: 21px;
  }
}

/* WordPress-managed blog: native posts, categories and featured images. */
.blog-entry time {
  display: block;
  margin: 12px 0 0;
  color: #617583;
  font-size: 12px;
  font-weight: 700;
}

.blog-entry__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blog-archive__heading {
  margin: 0 0 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid #d8e5eb;
  text-align: center;
}

.blog-archive__heading h2 {
  margin: 8px 0;
  color: var(--blue);
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.4;
  letter-spacing: 0;
}

.blog-empty {
  padding: 44px 28px;
  border: 1px solid #d8e5eb;
  background: #f7fbfc;
  text-align: center;
}

.blog-empty h2 {
  margin: 0 0 10px;
  color: var(--blue);
  font-size: 26px;
  letter-spacing: 0;
}

.navigation.pagination {
  margin-top: 36px;
}

.navigation.pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.navigation.pagination .page-numbers {
  display: inline-grid;
  min-width: 44px;
  min-height: 44px;
  padding: 8px 12px;
  place-items: center;
  border: 1px solid #bfd5e0;
  background: #fff;
  color: var(--blue);
  font-weight: 800;
  text-decoration: none;
}

.navigation.pagination .page-numbers.current {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}

.page-blog-single .page-hero h1 {
  overflow-wrap: anywhere;
  font-size: clamp(36px, 4vw, 58px);
  line-height: 1.35;
  letter-spacing: 0;
}

.blog-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
}

.blog-post__meta .tag {
  margin: 0;
}

.blog-post__meta time {
  color: #617583;
  font-size: 13px;
  font-weight: 700;
}

.blog-post__featured {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 8px;
  background: #edf4f7;
}

.blog-post__featured img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blog-post__content {
  line-height: 2;
}

.blog-post__content > * {
  max-width: 100%;
}

.blog-post__content img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

.blog-post__content figure {
  margin: 28px 0;
}

.blog-post__content figcaption {
  margin-top: 8px;
  color: #617583;
  font-size: 12px;
  line-height: 1.7;
  text-align: center;
}

.blog-post__content .wp-block-image,
.blog-post__content .wp-block-gallery,
.blog-post__content .wp-block-quote,
.blog-post__content .wp-block-table {
  margin-block: 30px;
}

.blog-post__content .wp-block-quote {
  padding: 18px 22px;
  border-left: 5px solid var(--green);
  background: #f4faf8;
}

.blog-post__navigation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 44px 0 30px;
  padding-top: 24px;
  border-top: 1px solid #d8e5eb;
}

.blog-post__navigation > div:last-child {
  text-align: right;
}

.blog-post__navigation a {
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
}

@media (max-width: 760px) {
  .page-blog-single .page-hero h1 {
    font-size: 31px;
  }

  .blog-entry__image {
    aspect-ratio: 16 / 9;
    min-height: 0;
  }

  .blog-post__navigation {
    grid-template-columns: 1fr;
  }

  .blog-post__navigation > div:last-child {
    text-align: left;
  }
}

/* Customer voice detail titles use editorial line breaks, not viewport-driven wrapping. */
:is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero .container > div:first-child {
  max-width: 860px;
}

:is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero h1 {
  max-width: 820px;
  margin-inline: auto;
  font-size: clamp(42px, 4.4vw, 58px);
  line-height: 1.28;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
  text-wrap: balance;
}

@media (min-width: 901px) {
  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero .hero-image--primary {
    right: 0 !important;
    width: min(22vw, 230px) !important;
    opacity: .58 !important;
  }

  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero .hero-image--secondary {
    left: 12px !important;
    width: min(19vw, 210px) !important;
    opacity: .48 !important;
  }
}

@media (min-width: 761px) and (max-width: 900px) {
  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero .hero-image--primary {
    top: auto !important;
    right: 3vw !important;
    bottom: 18px !important;
    width: min(31vw, 230px) !important;
    opacity: .2 !important;
    transform: rotate(4deg) !important;
  }

  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero .hero-image--secondary {
    left: 3vw !important;
    bottom: 30px !important;
    width: min(24vw, 178px) !important;
    opacity: .16 !important;
    transform: rotate(-7deg) !important;
  }
}

@media (max-width: 760px) {
  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero h1 {
    font-size: clamp(22px, 6.7vw, 28px) !important;
    line-height: 1.3 !important;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero h1 br {
    display: block;
  }
}

@media (max-width: 380px) {
  :is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero h1 {
    font-size: 21px !important;
  }
}

/* Japanese copy needs phrase-aware wrapping on both desktop and mobile. */
:is(h1, h2, h3, p, li, summary, dt, dd, blockquote, .button, .tag, .hero-phone) {
  line-break: strict;
  word-break: normal;
  word-break: auto-phrase;
}

.page-hero h1 .hero-title-line {
  display: block !important;
  max-width: none !important;
  color: var(--orange);
  font-size: 1em;
  white-space: nowrap;
}

.page-hero h1 .hero-title-line--primary,
.page-hero h1 .hero-title-line--primary .impact-word {
  color: var(--blue) !important;
}

/* Fixed title lines stay level even when popWords() adds an emphasis span. */
.page-hero h1 .hero-title-line .impact-word,
.page-blog-before-consultation .page-hero h1 .blog-title-line .impact-word,
:is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero h1 .impact-word {
  display: inline;
  font-size: inherit;
  line-height: inherit;
  text-shadow: inherit;
  transform: none;
  text-emphasis: none;
  -webkit-text-emphasis: none;
}

.page-hero h1 .hero-title-line .impact-word::after,
.page-blog-before-consultation .page-hero h1 .blog-title-line .impact-word::after,
:is(.page-voice-example-01, .page-voice-example-02, .page-voice-example-03, .page-voice-example-04) .page-hero h1 .impact-word::after {
  content: none;
}

:is(
  .page-guide,
  .page-service-ihinseiri,
  .page-service-seizen-seiri,
  .page-service-tokusyu-seisou,
  .page-service-fuyouhin,
  .page-service-kaitori,
  .page-service-house-cleaning,
  .page-column-ihinseiri-cost-guide,
  .page-items
) .page-hero .container > div:first-child {
  max-width: 900px;
}

:is(
  .page-guide,
  .page-service-ihinseiri,
  .page-service-seizen-seiri,
  .page-service-tokusyu-seisou,
  .page-service-fuyouhin,
  .page-service-kaitori,
  .page-service-house-cleaning,
  .page-column-ihinseiri-cost-guide,
  .page-items
) .page-hero h1 {
  font-size: clamp(36px, 4vw, 48px);
  line-height: 1.3;
}

:is(.page-results-case-01, .page-results-case-02, .page-results-case-03, .page-results-case-04) .page-hero .container > div:first-child {
  max-width: 900px;
}

:is(.page-results-case-01, .page-results-case-02, .page-results-case-03, .page-results-case-04) .page-hero h1 {
  max-width: 880px;
  margin-inline: auto;
  font-size: clamp(38px, 4.2vw, 54px);
  line-height: 1.25;
}

.case-detail__summary h2 .case-title-line,
.voice-detail__case-link h3 .case-title-line {
  display: block;
  white-space: nowrap;
}

.case-detail__summary h2 {
  font-size: clamp(25px, 2.8vw, 36px);
}

.case-specs dt,
.case-specs dd {
  overflow-wrap: normal;
}

.voice-related {
  background: #fff;
}

.voice-related__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.voice-related__item {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cfe0e9;
  border-top: 5px solid var(--blue);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(10, 70, 107, .08);
  transition: transform .18s ease, box-shadow .18s ease;
}

.voice-related__item.is-current {
  border-top-color: var(--green);
  background: #f4faf8;
}

.voice-related__item figure {
  aspect-ratio: 4 / 3;
  margin: 0;
  overflow: hidden;
  background: #edf4f7;
}

.voice-related__item figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.voice-related__item > div {
  padding: 17px 16px 19px;
}

.voice-related__item h3 {
  min-height: 4.5em;
  margin: 10px 0 8px;
  color: var(--blue);
  font-size: 16px;
  line-height: 1.5;
}

.voice-related__item p {
  margin: 0 0 10px;
  color: #526b7a;
  font-size: 12px;
}

.voice-related__item b {
  color: var(--blue);
  font-size: 13px;
}

.voice-related__item:focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  .voice-related__item:hover {
    color: inherit;
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(10, 70, 107, .13);
  }
}

@media (max-width: 900px) {
  .voice-related__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  :is(.page-results-case-01, .page-results-case-02, .page-results-case-03, .page-results-case-04) .page-hero h1 {
    font-size: clamp(18px, 5.4vw, 22px) !important;
    line-height: 1.32 !important;
  }

  :is(
    .page-service-ihinseiri,
    .page-service-seizen-seiri,
    .page-service-tokusyu-seisou,
    .page-service-fuyouhin,
    .page-service-kaitori,
    .page-service-house-cleaning
  ) .page-hero h1 {
    font-size: clamp(17px, 5vw, 20px) !important;
  }

  :is(.page-guide, .page-column-ihinseiri-cost-guide, .page-items) .page-hero h1 {
    font-size: clamp(20px, 5.6vw, 23px) !important;
  }

  .page-blog-before-consultation .page-hero h1 {
    font-size: clamp(19px, 5.4vw, 22px) !important;
  }

  .page-blog-before-consultation .blog-title-line,
  .page-blog-before-consultation .blog-title-line--primary {
    display: block;
    white-space: nowrap;
  }

  .case-detail__summary h2 {
    font-size: clamp(24px, 7vw, 30px);
  }

  .voice-related__list {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: min(76vw, 280px);
    justify-content: start;
    gap: 14px;
    margin-right: -13px;
    padding: 2px 13px 18px 2px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
  }

  .voice-related__item {
    scroll-snap-align: start;
  }

  .voice-related__item h3 {
    min-height: 0;
  }
}

@media (max-width: 380px) {
  :is(.page-guide, .page-column-ihinseiri-cost-guide, .page-items) .page-hero h1,
  .page-blog-before-consultation .page-hero h1 {
    font-size: 19px !important;
  }
}

/* Bind each basic-service photo to its meaning, independent of card order or wrappers. */
.basic-service-card-grid > .basic-service-card--sorting > article::after {
  background-image: url("../img/generated/sorting-keepsakes.jpg") !important;
  background-position: 52% 31% !important;
}

.basic-service-card-grid > .basic-service-card--kaitori > article::after {
  background-image: url("../img/generated/items-arranged.jpg") !important;
  background-position: 50% 46% !important;
}

.basic-service-card-grid > .basic-service-card--valuables > article::after {
  background-image: url("../img/generated/item-documents-valuables.jpg") !important;
  background-position: 50% 50% !important;
}

.basic-service-card-grid > .basic-service-card--carry-out > article::after {
  background-image: url("../img/generated/work-carrying.jpg") !important;
  background-position: 49% 52% !important;
}

.basic-service-card-grid > .basic-service-card--cleaning > article::after {
  background-image: url("../img/generated/room-after.jpg") !important;
  background-position: 53% 51% !important;
}

.basic-service-card-grid > .basic-service-card--kuyou > article::after {
  background-image: url("../img/generated/hero-keepsakes-hands.jpg") !important;
  background-position: 50% 45% !important;
}