/* Top page only. top_a.jpg is the PC reference; mobile layout is provisional.
   Keep asset URLs in the template (partnership background below is the exception).
   Shared dimensions and photo crops can be adjusted here when final assets arrive. */
:root {
  --top-width: 1000px;
  --top-gutter: 24px;
  --top-section-space: 60px;
  --top-paper: #fcf6f6;
  --top-contact: #f4f0e4;
  --top-accent: #b52c29;
  --top-rule: #c9c3c1;
  --top-photo-position: center;
  --color-accent: var(--top-accent);
  --color-accent-2: #91201e;
}
body { background: var(--top-paper); color: #111; letter-spacing: 0; }
.btn--outline-accent { background: rgba(255,255,255,.88); color: #9f2421; border: 2px solid var(--top-accent); font-weight: 500; }
.btn--outline-accent:hover, .btn--outline-accent:focus-visible { background: var(--top-accent); color: #fff; border-color: var(--top-accent); }
.btn--outline-accent:hover .btn__arrow, .btn--outline-accent:focus-visible .btn__arrow { color: #fff; }
.btn--ghost { color: var(--top-accent); background: #fff; }
.service__header-photo { overflow: hidden; }
.service__header-photo img { width: calc(100% + 40px); max-width: none; transform: translateX(-40px); }
.section-block { padding: var(--top-section-space) 0; }
.section-block__inner { width: min(var(--top-width), calc(100% - var(--top-gutter) * 2)); margin-inline: auto; }
.section-block__eyebrow { display: block; position: relative; width: fit-content; padding-bottom: 12px; margin: 0 0 32px; font-size: 16px; line-height: 1.5; font-weight: 400; }
.section-block__eyebrow::after { content: ''; position: absolute; left: -4px; bottom: 0; width: 103px; height: 13px; background: url('../img/decoration/eyebrow-brush.png') left center / contain no-repeat; }
.section-block__title { font-size: 36px; line-height: 1.45; font-weight: 500; margin-bottom: 24px; }
.section-block__lead { font-size: 14px; line-height: 1.9; margin-bottom: 32px; }
.section-block__body { font-size: 16px; line-height: 1.9; }
/* Hero: the reference is about 784px tall at a 1400px width. */
.fv { position: relative; min-height: 784px; overflow: hidden; }
.fv__bg { position: absolute; inset: 0; width: 104%; height: 100%; max-width: none; object-fit: cover; object-position: var(--top-photo-position); }
.fv::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.3) 55%,transparent 80%); }
.fv__inner { position: relative; z-index: 1; text-align: center; padding: 150px var(--top-gutter) 100px; }
.fv__eyebrow { font-family: var(--font-en); font-size: 14px; margin-bottom: 16px; }
.fv__title { font-size: clamp(40px,5vw,70px); line-height: 1.4; font-weight: 500; margin-bottom: 16px; letter-spacing: .02em; }
.fv__copy { position: relative; isolation: isolate; width: fit-content; max-width: min(860px, 100%); margin: 0 auto 38px; padding: 20px 48px 22px; border: 0; background: none; }
.fv__copy::before { content: ''; position: absolute; z-index: -1; inset: -46px -120px; background: radial-gradient(ellipse at center, rgba(255,255,255,.9) 0%, rgba(255,255,255,.66) 38%, rgba(255,255,255,.14) 62%, transparent 76%); pointer-events: none; }
.fv__summary { font-size: 16px; line-height: 1.8; margin-bottom: 10px; }
.fv__lead { font-size: 16px; line-height: 1.9; }
.fv__summary, .fv__lead { text-shadow: none; }
.fv__cta { display: flex; justify-content: center; gap: 22px; }
.fv__cta .btn { min-width: 188px; }
/* Photo and text sections. Photo areas reach the right edge, text keeps the 1000px grid. */
.numbers__header, .service__header { position: relative; min-height: 330px; margin-bottom: 38px; }
.numbers__text, .service__header-text { position: relative; z-index: 1; width: 44%; }
.numbers__hero, .service__header-photo { position: absolute; top: 12px; left: 46%; width: calc(54% + max(var(--top-gutter), (100vw - var(--top-width)) / 2)); height: 260px; }
.numbers__hero picture, .service__header-photo picture { display: block; width: 100%; height: 100%; }
.numbers__hero img, .service__header-photo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--top-photo-position); mask-image: linear-gradient(to right, transparent, #000 18%); }
.numbers__list { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); }
.numbers__item { display: flex; flex-direction: column; align-items: center; border-left: 1px solid var(--top-rule); padding: 0 12px; gap: 20px; }
.numbers__item:first-child { border: 0; }
.numbers__value { order: 1; white-space: nowrap; font-size: 44px; line-height: 1.25; }
.numbers__unit { font-size: 13px; }
.numbers__label { order: 2; font-size: 14px; }
.numbers__icon { order: 4; width: 84px; height: 84px; object-fit: contain; }
.numbers__note { margin-top: 30px; color: #666; font-size: 12px; text-align: center; }
.about { position: relative; padding: 0; background: #fff; }
.about__inner { position: relative; min-height: 600px; padding-block: 50px; }
.about__body-col { position: relative; width: 44%; z-index: 1; }
.about__lead { font-size: 14px; line-height: 1.9; margin-bottom: 40px; }
.about__body { font-size: 16px; line-height: 1.9; margin-bottom: 32px; }
.about__photo { position: absolute; top: 0; bottom: 0; left: -10%; width: calc(110% + max(var(--top-gutter), (100vw - var(--top-width)) / 2)); }
.about__photo picture { display: block; height: 100%; }
.about__photo img { width: 100%; height: 100%; object-fit: cover; object-position: right center; mask-image: linear-gradient(to right,transparent 0%,rgba(0,0,0,.05) 27%,#000 65%); }
.strengths .section-block__title, .strengths__intro { text-align: center; }
.strengths .section-block__eyebrow { margin-bottom: 12px; }
.strengths__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; margin: 40px 0 24px; }
.strengths__diagram { max-width: 440px; width: 100%; margin: auto; }
.strengths__diagram-img { width: 100%; }
.strengths__reason { display: grid; grid-template-columns: 56px 1fr; gap: 14px; align-items: center; margin-bottom: 22px; }
.strengths__reason-num { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; background: url('../img/index/strengths/strengths_bg.png') center / contain no-repeat; filter: grayscale(1); color: #fff; font: 32px/1 var(--font-en); }
.strengths__reason-title { font-size: 17px; line-height: 1.6; font-weight: 400; margin-bottom: 4px; }
.strengths__reason-body { font-size: 13px; line-height: 1.8; }
.strengths__cta, .service__cta, .results__cta { text-align: center; }
.service { padding-top: 40px; padding-bottom: 32px; }
.service__header { min-height: 300px; margin-bottom: 34px; }
.service__header-photo { top: -40px; height: 330px; }
.service__list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 24px; }
.service__card { position: relative; padding: 8px 18px 16px 60px; border-left: 1px solid var(--top-rule); }
.service__card:first-child { border: 0; }
.service__num { position: absolute; top: 5px; left: 18px; width: 34px; height: 43px; display: grid; place-items: center; color: var(--top-accent); background: url('../img/index/service/service-number.svg') center / contain no-repeat; font: 28px/1 var(--font-en); }
.service__title { font-size: 16px; line-height: 1.6; font-weight: 400; margin-bottom: 24px; }
.service__desc { font-size: 13px; line-height: 1.8; }
.message { padding: 0; }
.message__grid { position: relative; min-height: 500px; padding-block: 36px; }
.message__body-col { position: relative; z-index: 1; width: 44%; }
.message__quote { font-size: 16px; line-height: 1.9; margin: 38px 0 24px; }
.message__english { padding-top: 20px; border-top: 1px solid var(--top-rule); font-family: var(--font-en); font-size: 14px; line-height: 1.75; letter-spacing: .015em; }
.message__english-signature { margin-top: 12px; font-size: 13px; text-align: right; }
.message__photo { position: absolute; top: 0; bottom: 0; left: 46%; width: calc(54% + max(var(--top-gutter), (100vw - var(--top-width)) / 2)); }
.message__photo picture { display: block; height: 100%; }
.message__photo-img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; mask-image: linear-gradient(to right,transparent,#000 20%); }
.results { border-top: 2px solid #fff; }
.results__header-text { max-width: 460px; }
.results__row { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 36px; }
.results__block-title { font-size: 18px; font-weight: 600; margin-bottom: 14px; }
.results__block-desc { font-size: 14px; line-height: 1.8; margin-bottom: 34px; }
.results__figure--map { width: 100%; }
.results__figure-img { width: 100%; height: 260px; object-fit: contain; }
.results__kpi-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.results__kpi { border-left: 1px solid var(--top-rule); padding: 12px 6px 24px; text-align: center; }
.results__kpi:first-child { border: 0; }
.results__kpi-icon { width: 84px; height: 84px; object-fit: contain; margin: 0 auto 12px; }
.results__kpi-label { display: block; font-size: 13px; margin-bottom: 8px; }
.results__kpi-value { white-space: nowrap; font-size: 40px; line-height: 1.3; }
.results__kpi-unit { font-size: 12px; }
.results__row--bottom { display: block; margin-top: 30px; }
/* One supplied diagram includes the logo, connections, headings and descriptions. */
.partnership { position: relative; background: url('../img/home/partnership/bg-mountain.png') center / cover; }
.partnership::before { content: ''; position: absolute; inset: 0; background: rgba(255,250,245,.8); }
.partnership > .section-block__inner { position: relative; display: grid; grid-template-columns: 44% 52%; gap: 4%; }
.partnership__text { display: flex; flex-direction: column; align-items: flex-start; }
.partnership__cta { margin-top: auto; padding-top: 48px; }
.partnership__visual { width: 100%; min-width: 0; margin: 0; align-self: center; }
.partnership__diagram { display: block; width: 100%; height: auto; }
.partnership__placeholder { width: 100%; aspect-ratio: 1 / 1; border: 1px dashed rgba(90,70,50,.3); background: rgba(235,226,215,.3); }
.news .section-block__inner { display: grid; grid-template-columns: 36% 1fr; gap: 32px; }
.news__head { display: flex; flex-direction: column; align-items: flex-start; }
.news__cta { margin-top: auto; padding-top: 50px; }
.news__list { padding-top: 60px; }
.news__item { border-top: 1px solid var(--top-rule); }
.news__item:last-child { border-bottom: 1px solid var(--top-rule); }
.news__link { min-height: 98px; display: grid; grid-template-columns: 94px 1fr 20px; column-gap: 12px; align-items: center; padding: 20px 10px; font-size: 14px; }
.news__date { grid-column: 1; grid-row: 1; }
.news__category { grid-column: 2; grid-row: 1; border-left: 1px solid var(--top-rule); padding-left: 10px; color: var(--top-accent); }
.news__title { grid-column: 2; grid-row: 2; padding-left: 10px; }
.news__arrow { grid-column: 3; grid-row: 1 / 3; }
.news__link:hover { background: #f6eae4; }
.news__link--static:hover { background: transparent; }
.news__link:not(.news__link--static) .news__arrow { display: grid; width: 26px; height: 26px; border: 1px solid var(--top-accent); border-radius: 50%; place-items: center; background: #fff; color: var(--top-accent); font-size: 15px; font-weight: 600; line-height: 1; transition: transform .2s ease, background-color .2s ease, color .2s ease; }
.news__link:not(.news__link--static):hover .news__arrow, .news__link:not(.news__link--static):focus-visible .news__arrow { background: var(--top-accent); color: #fff; transform: translate(2px,-2px); }
.contact { background: var(--top-contact); text-align: center; padding-block: 60px 80px; }
.contact .section-block__eyebrow { text-align: left; }
.contact__intro { margin-bottom: 24px; }
.contact__body { font-size: 16px; line-height: 1.9; margin-bottom: 32px; }
.contact__buttons { display: flex; justify-content: center; }
/* Tablet: scale content, then stack photo sections before text gets narrow. */
@media (max-width: 1100px) {
  .numbers__value { font-size: 36px; }
  .results__kpi-value { font-size: 32px; }
  .service__card { padding-left: 46px; padding-right: 12px; }
  .service__num { left: 8px; }
}
/* Provisional SP layout: adjust this breakpoint and these variables independently of PC. */
@media (max-width: 800px) {
  :root { --top-gutter: 24px; --top-section-space: 48px; }
  .section-block__title { font-size: 28px; }
  .section-block__eyebrow { font-size: 14px; margin-bottom: 24px; }
  .section-block__body, .about__body, .message__quote, .contact__body { font-size: 15px; line-height: 1.95; }
  .fv { min-height: 720px; }
  .fv__bg { object-position: 61% center; }
  .fv__inner { padding-top: 126px; padding-bottom: 64px; }
  .fv__eyebrow { font-size: 12px; }
  .fv__title { font-size: clamp(30px,7.6vw,48px); margin-bottom: 24px; }
  .fv__copy { max-width: 540px; margin-bottom: 30px; padding: 18px 20px 20px; background: none; }
  .fv__copy::before { inset: -38px -64px; background: radial-gradient(ellipse at center, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 38%, rgba(255,255,255,.14) 64%, transparent 78%); }
  .fv__summary, .fv__lead { max-width: 540px; margin-inline: auto; font-size: 14px; line-height: 1.9; }
  .fv__summary { margin-bottom: 10px; }
  .br-pc { display: none; }
  .br-sp { display: inline; }
  .fv__eyebrow .br-sp { display: none; }
  .fv__cta { flex-wrap: wrap; gap: 12px; }
  .fv__cta .btn { min-width: 188px; }
  .numbers__header, .service__header { min-height: 0; margin: 0 0 32px; }
  .numbers__text, .service__header-text, .about__body-col, .message__body-col { width: 100%; }
  .about__cta { text-align: center; }
  .numbers__hero, .service__header-photo, .about__photo, .message__photo { position: relative; inset: auto; width: 100%; height: auto; aspect-ratio: 3 / 2; margin-top: 28px; }
  .numbers__hero img, .service__header-photo img, .about__photo img, .message__photo-img { mask-image: none; object-fit: cover; }
  .service__header-photo { overflow: hidden; }
  .service__header-photo img { width: calc(100% + 40px); max-width: none; transform: translateX(-40px); }
  .numbers__list { grid-template-columns: 1fr; }
  .numbers__item, .numbers__item:first-child { display: grid; grid-template-columns: 1fr 70px; gap: 6px 20px; border: 0; border-bottom: 1px solid var(--top-rule); padding: 20px 8px; }
  .numbers__value { grid-column: 1; grid-row: 1; font-size: 38px; }
  .numbers__label { grid-column: 1; grid-row: 2; }
  .numbers__icon { grid-column: 2; grid-row: 1 / 3; width: 64px; height: 64px; }
  .numbers__note { font-size: 11px; }
  .about__inner { min-height: 0; padding-block: 48px; }
  .about__lead { margin-bottom: 24px; }
  .strengths .section-block__title, .strengths__intro { text-align: left; }
  .strengths__grid { grid-template-columns: 1fr; gap: 30px; margin-top: 28px; }
  .strengths__diagram { max-width: 360px; }
  .strengths__reasons { display: grid; grid-auto-rows: 1fr; gap: 22px; }
  .strengths__reason { grid-template-columns: 44px 1fr; gap: 12px; margin-bottom: 0; }
  .strengths__reason-num { width: 42px; height: 42px; font-size: 26px; }
  .strengths__reason-title { font-size: 16px; }
  .service { padding-block: 48px; }
  .service__list { grid-template-columns: 1fr 1fr; gap: 24px 0; }
  .service__card { padding: 0 16px 12px 50px; }
  .service__card:nth-child(odd) { border-left: 0; }
  .service__title { margin-bottom: 12px; }
  .message__grid { min-height: 0; padding-block: 0 48px; }
  .message__quote { margin: 24px 0 20px; }
  .message__english { padding-top: 18px; font-size: 13px; line-height: 1.75; }
  .message__english-signature { margin-top: 10px; font-size: 12px; }
  .results__row { grid-template-columns: 1fr; gap: 32px; }
  .results__block-desc { margin-bottom: 20px; }
  .results__figure-img { height: auto; max-height: 280px; }
  .results__kpi-icon { width: 64px; height: 64px; }
  .results__kpi-label { font-size: 12px; }
  .results__kpi-value { font-size: clamp(25px,5vw,38px); }
  .results__kpi-unit { font-size: 10px; }
  .partnership > .section-block__inner { display: flex; flex-direction: column; gap: 32px; }
  .partnership__text { display: contents; }
  .partnership__text > * { margin-bottom: 0; }
  .partnership__cta { order: 2; padding-top: 0; text-align: center; }
  .news .section-block__inner { display: flex; flex-direction: column; gap: 28px; }
  .news__head { display: contents; }
  .news__head > * { margin-bottom: 0; }
  .news__list { padding: 0; }
  .news__cta { order: 2; padding-top: 0; text-align: center; }
  .news__link { min-height: 104px; padding-inline: 0; font-size: 13px; grid-template-columns: 85px 1fr 28px; gap: 8px; }
  .news__link:not(.news__link--static) .news__arrow { width: 24px; height: 24px; font-size: 14px; }
  .news__title { grid-column: 1 / 3; padding: 0; }
  .contact { padding-block: 48px; }
}
@media (max-width: 420px) {
  :root { --top-gutter: 20px; }
  .service__list { grid-template-columns: 1fr; gap: 20px; }
  .service__card { border-left: 0; border-bottom: 1px solid var(--top-rule); }
  .service__card:first-child { border-bottom: 1px solid var(--top-rule); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
/* PC fine tuning after comparison at 1400px. */
@media (min-width: 801px) {
  .numbers__header { min-height: 310px; margin-bottom: 28px; }
  .strengths__grid { margin-top: 28px; }
  .strengths__diagram { max-width: 400px; }
  .results { padding-block: 48px; }
  .results__figure-img { height: 230px; }
  .news__link { grid-template-columns: 92px 128px minmax(0,1fr) 30px; column-gap: 10px; font-size: 13px; }
  .news__title { grid-column: 3; grid-row: 1; padding-left: 0; }
  .news__arrow { grid-column: 4; grid-row: 1; }
}

/* Crop the supplied stock number without altering the original image. */
.service__header-photo { overflow: hidden; }
.service__header-photo img { width: calc(100% + 40px); max-width: none; transform: translateX(-40px); }
