.inner-page { padding-top: var(--nav-h); }
.inner-page section { scroll-margin-top: calc(var(--nav-h) + 18px); }
.inner-page-shell { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gut); }

.inner-hero { min-height: 64svh; display: flex; align-items: center; padding: clamp(42px, 4.2vw, 68px) 0 clamp(38px, 3.8vw, 62px); }
.inner-hero .inner-page-shell { width: 100%; }
.inner-hero .section-tag { margin-bottom: clamp(24px, 2.5vw, 38px); }
.page-display { max-width: 960px; font-size: clamp(48px, 4.65vw, 82px); font-weight: 700; line-height: .95; letter-spacing: -.035em; }
.hero-lead { max-width: 620px; margin-top: clamp(22px, 2.4vw, 36px); color: var(--muted); font-size: clamp(17px, 1.28vw, 22px); line-height: 1.42; }
.stats { display: flex; flex-wrap: wrap; gap: clamp(36px, 5.6vw, 88px); margin-top: clamp(28px, 3vw, 46px); }
.stat strong { display: block; font-size: clamp(28px, 2.55vw, 42px); font-weight: 400; line-height: 1; }
.stat span { display: block; margin-top: 6px; color: var(--soft); font-size: clamp(15px, 1.02vw, 18px); }
.page-rule { max-width: var(--maxw); height: 1px; margin-inline: auto; background: var(--line); }

/* About */
.about-section { padding: clamp(68px, 6.4vw, 104px) 0; }
.about-section .section-tag { margin-bottom: clamp(38px, 4vw, 64px); }
.team-photo { aspect-ratio: 2.18 / 1; display: grid; place-items: center; background: #ffdfc9; color: rgba(10,10,10,.7); font-size: clamp(30px, 3.7vw, 60px); letter-spacing: .02em; }
.about-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(44px, 6.4vw, 104px); margin-top: clamp(50px, 5vw, 78px); }
.about-copy { color: var(--muted); font-size: clamp(18px, 1.45vw, 24px); line-height: 1.48; }
.about-copy p + p { margin-top: 26px; }
.values-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 34px 32px; }
.value { padding-top: 22px; border-top: 1px solid var(--line); }
.value h3 { font-size: clamp(24px, 1.95vw, 32px); font-weight: 400; line-height: 1; }
.value p { margin-top: 14px; color: var(--muted); font-size: clamp(15px, 1.05vw, 18px); line-height: 1.35; }

.subsection-heading { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-width: 200px; min-height: 82px; padding: 17px 24px 11px; background: var(--peach); font-size: clamp(22px, 1.75vw, 29px); line-height: .82; text-align: center; }
.subsection-heading strong { font-size: 1.45em; font-weight: 700; }
.subsection-intro { max-width: 680px; margin-top: clamp(42px, 4vw, 64px); color: var(--muted); font-size: clamp(19px, 1.58vw, 26px); line-height: 1.45; }
.materials-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(24px, 3.4vw, 54px); margin-top: clamp(56px, 5.5vw, 86px); }
.material h3 { font-size: clamp(23px, 1.75vw, 29px); font-weight: 400; line-height: 1.05; }
.material p { margin-top: 18px; color: var(--muted); font-size: clamp(15px, 1.1vw, 18px); line-height: 1.35; }
.material-note { max-width: 560px; margin-top: clamp(52px, 5vw, 78px); color: var(--muted); font-size: clamp(15px, 1.12vw, 18px); line-height: 1.35; }

.process-list { margin-top: clamp(62px, 5.5vw, 90px); border-top: 1px solid var(--line); }
.process-row { display: grid; grid-template-columns: 48px 200px 1fr; align-items: center; min-height: clamp(64px, 5vw, 80px); border-bottom: 1px solid var(--line); }
.process-number { color: var(--muted); font-size: clamp(17px, 1.2vw, 20px); letter-spacing: .08em; }
.process-name { font-size: clamp(25px, 2.05vw, 34px); line-height: 1; }
.process-bar { width: 100%; height: clamp(20px, 2vw, 30px); background: #252122; transform: scaleX(0); transform-origin: left center; transition: background-color .25s ease, transform 1.25s cubic-bezier(.22, 1, .36, 1); will-change: transform; }
.process-row:nth-child(1) { --process-progress: .24; --process-delay: 0s; }
.process-row:nth-child(2) { --process-progress: .5; --process-delay: .1s; }
.process-row:nth-child(3) { --process-progress: .75; --process-delay: .2s; }
.process-row:nth-child(4) { --process-progress: 1; --process-delay: .3s; }
.process-list.is-animated .process-bar { transform: scaleX(var(--process-progress)); transition-delay: var(--process-delay); }
.process-row:hover .process-bar { background: var(--orange); }

.about-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: clamp(56px, 5.5vw, 86px); }
.about-gallery a { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #eee; }
.about-gallery img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); transition: filter .4s ease, transform .65s ease; }
.about-gallery a:hover img, .about-gallery a:focus-visible img { filter: grayscale(0); transform: scale(1.035); }
.view-all { display: inline-block; margin-top: 18px; padding-bottom: 2px; border-bottom: 1px solid currentColor; color: var(--muted); font-size: clamp(17px, 1.25vw, 20px); text-decoration: none; transition: color .22s ease; }
.view-all:hover, .view-all:focus-visible { color: var(--orange); }
/* Contact */
.contact-hero { min-height: 68svh; }
.contact-hero .section-tag { align-items: center; text-align: center; }
.contact-hero .section-tag strong { align-self: center; }
.contact-hero .page-display { max-width: 1080px; font-size: clamp(46px, 4.4vw, 78px); line-height: .98; }
.contact-stats { margin-top: clamp(28px, 3vw, 46px); }
.contact-info { padding: clamp(58px, 5.5vw, 88px) 0 clamp(54px, 5vw, 80px); }
.info-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.info-cell { min-height: clamp(170px, 15vw, 220px); padding: clamp(32px, 3.2vw, 50px); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.info-cell h2 { color: var(--muted); font-size: clamp(22px, 1.85vw, 30px); font-weight: 400; }
.info-cell p, .info-cell a { display: block; margin-top: 14px; color: var(--ink); font-size: clamp(19px, 1.55vw, 26px); line-height: 1.25; text-decoration: none; transition: color .22s ease; }
.info-cell a + a { margin-top: 4px; }
.info-cell a:hover, .info-cell a:focus-visible { color: var(--orange); }
.contact-actions { display: flex; flex-wrap: wrap; gap: clamp(18px, 2.2vw, 34px); margin-top: clamp(26px, 2.8vw, 42px); }
.contact-button { min-height: 68px; display: inline-flex; align-items: center; gap: 14px; padding: 14px 26px; border: 2px solid var(--ink); color: var(--ink); font-size: clamp(19px, 1.55vw, 26px); line-height: 1; text-decoration: none; transition: background-color .25s ease, color .25s ease, border-color .25s ease; }
.contact-button svg { width: 30px; height: 30px; fill: currentColor; }
.contact-button:hover, .contact-button:focus-visible { background: var(--ink); border-color: var(--ink); color: #fff; }

.message-section { padding: clamp(72px, 6.8vw, 110px) 0 clamp(82px, 7.5vw, 124px); }
.message-section .section-tag { margin-bottom: clamp(48px, 5vw, 78px); }
.message-layout { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(48px, 7vw, 110px); align-items: start; }
.message-copy h2 { max-width: 520px; font-size: clamp(58px, 6.25vw, 98px); font-weight: 400; line-height: .9; letter-spacing: -.045em; }
.message-copy p { max-width: 640px; margin-top: clamp(34px, 3.5vw, 54px); color: var(--muted); font-size: clamp(18px, 1.55vw, 26px); line-height: 1.45; }
.availability { display: flex; align-items: center; gap: 14px; margin-top: clamp(38px, 4vw, 62px); color: var(--muted); font-size: clamp(17px, 1.3vw, 22px); }
.availability::before { content: ''; flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%; background: #079c4b; }

.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; }
.field { display: flex; flex-direction: column; gap: 9px; }
.field.full { grid-column: 1 / -1; }
.field label { color: var(--muted); font-size: clamp(17px, 1.25vw, 21px); }
.required { color: #ee1d23; }
.field input, .field select, .field textarea { width: 100%; border: 1px solid #e5bfa6; border-radius: 0; background: #fff0e6; color: var(--ink); outline: none; transition: border-color .22s ease, box-shadow .22s ease; }
.field input, .field select { height: 56px; padding: 0 16px; }
.field textarea { min-height: 220px; resize: vertical; padding: 16px; line-height: 1.4; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--orange); box-shadow: 0 0 0 2px rgba(236,94,39,.14); }
.form-submit { grid-column: 1 / -1; justify-self: start; min-height: 58px; padding: 10px 28px; border: 0; background: var(--orange); color: #fff; font-size: clamp(19px, 1.5vw, 25px); cursor: pointer; transition: background-color .22s ease, transform .22s ease; }
.form-submit:hover, .form-submit:focus-visible { background: #d94d1a; transform: translateY(-2px); }
.form-status { grid-column: 1 / -1; padding: 14px 18px; border-left: 4px solid currentColor; font-size: 18px; }
.form-status.success { color: #08783d; background: #edf9f2; }
.form-status.error { color: #a92b17; background: #fff2ed; }
.hp-field { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

@media (max-width: 900px) {
  .about-story, .message-layout { grid-template-columns: 1fr; }
  .materials-grid { grid-template-columns: 1fr 1fr; }
  .about-gallery { grid-template-columns: 1fr 1fr; }
  .process-row { grid-template-columns: 44px 180px 1fr; }
}

@media (max-width: 700px) {
  .inner-hero, .contact-hero { min-height: auto; padding-top: 76px; padding-bottom: 72px; }
  .page-display, .contact-hero .page-display { font-size: clamp(48px, 12.5vw, 72px); }
  .hero-lead { font-size: 20px; }
  .stats { display: grid; grid-template-columns: 1fr 1fr; gap: 34px 24px; }
  .about-story, .values-grid, .info-grid, .contact-form { grid-template-columns: 1fr; }
  .field.full, .form-submit, .form-status { grid-column: auto; }
  .team-photo { aspect-ratio: 4 / 3; }
  .materials-grid { grid-template-columns: 1fr; }
  .process-row { grid-template-columns: 38px 138px 1fr; }
  .process-name { font-size: 24px; }
  .info-cell { min-height: 170px; }
  .contact-button { width: 100%; justify-content: center; }
  .message-copy h2 { font-size: clamp(58px, 17vw, 92px); }
}

@media (max-width: 480px) {
  .about-gallery { grid-template-columns: 1fr; }
  .process-row { grid-template-columns: 34px 118px 1fr; }
  .process-number { font-size: 15px; }
  .process-name { font-size: 20px; }
  .info-cell { padding: 38px 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .process-list .process-bar { transform: scaleX(var(--process-progress)); }
}
