.en-guide-intro,
.en-project-config,
.en-measure-hero,
.en-guide-section,
.en-quote-checklist {
  padding: 84px 8vw;
}

.en-guide-intro,
.en-project-config {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .7fr);
  gap: 8vw;
  align-items: center;
  background: #fff;
}

.en-guide-intro h2,
.en-project-config h2,
.en-measure-hero h1,
.en-guide-section h2,
.en-quote-checklist h2 {
  margin: 8px 0 16px;
  color: var(--en-navy);
  font-size: clamp(34px, 4.5vw, 62px);
  line-height: 1.02;
  letter-spacing: -.055em;
}

.en-guide-intro p,
.en-project-config p,
.en-measure-hero p,
.en-guide-section p,
.en-quote-checklist p,
.en-guide-section li,
.en-project-config li {
  color: var(--en-muted);
  font-size: 17px;
  line-height: 1.7;
}

.en-guide-actions,
.en-project-config-card {
  padding: 30px;
  border-radius: 24px;
  background: var(--en-soft);
  border: 1px solid var(--en-line);
}

.en-guide-actions { display: grid; gap: 18px; align-content: center; }
.en-guide-entry-label { margin: 0; color: var(--en-blue); font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.en-product-knowledge { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(260px, .55fr); gap: 44px; align-items: center; padding: 72px 8vw; background: var(--en-soft); border-top: 1px solid var(--en-line); }
.en-product-knowledge h2, .en-guide-hub h2, .en-faq-page h2 { margin: 8px 0 16px; color: var(--en-navy); font-size: clamp(32px, 4.5vw, 56px); line-height: 1.02; letter-spacing: -.055em; }
.en-product-knowledge p, .en-guide-hub-intro > p, .en-faq-page-intro > p { max-width: 680px; color: var(--en-muted); font-size: 17px; line-height: 1.7; }
.en-product-knowledge > div:last-child { display: grid; gap: 18px; justify-items: start; }
.en-guide-hub, .en-faq-page { padding: 84px 8vw; }
.en-guide-hub-intro, .en-faq-page-intro { max-width: 760px; }
.en-guide-hub-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 38px; }
.en-guide-hub-card { min-height: 260px; display: flex; flex-direction: column; justify-content: space-between; padding: 28px; border: 1px solid var(--en-line); border-radius: 24px; background: #fff; }
.en-guide-hub-card:nth-child(2) { background: var(--en-navy); border-color: var(--en-navy); color: #fff; }
.en-guide-hub-card:nth-child(3) { background: var(--en-green); }
.en-guide-hub-card span { color: var(--en-blue); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.en-guide-hub-card:nth-child(2) span { color: var(--en-green); }
.en-guide-hub-card h3 { margin: 28px 0 12px; font-size: 27px; line-height: 1.08; letter-spacing: -.04em; }
.en-guide-hub-card p { margin: 0; color: var(--en-muted); line-height: 1.6; }
.en-guide-hub-card:nth-child(2) p { color: rgba(255,255,255,.72); }
.en-guide-hub-card a { margin-top: 24px; color: var(--en-navy); font-size: 13px; font-weight: 800; }
.en-guide-hub-card:nth-child(2) a { color: var(--en-green); }
.en-faq-list { display: grid; gap: 12px; margin-top: 38px; }
.en-faq-list details { padding: 20px 24px; border: 1px solid var(--en-line); border-radius: 16px; background: #fff; }
.en-faq-list summary { cursor: pointer; color: var(--en-navy); font-size: 18px; font-weight: 800; line-height: 1.4; }
.en-faq-list p { max-width: 820px; margin: 16px 0 0; color: var(--en-muted); line-height: 1.7; }
.en-project-config { margin-top: 0; border-top: 1px solid var(--en-line); }
.en-project-config-card { background: var(--en-navy); border-color: var(--en-navy); }
.en-project-config-card h3 { margin: 0 0 14px; color: #fff; font-size: 26px; letter-spacing: -.035em; }
.en-project-config-card ol { margin: 0 0 24px; padding-left: 21px; }
.en-project-config-card li { color: rgba(255,255,255,.76); padding: 4px 0; }
.en-project-config-card .en-text-link { display: inline-block; margin-top: 20px; color: #fff; }
.en-project-use { margin-top: 22px; }
.en-project-use strong { color: var(--en-navy); }
.en-text-link { color: var(--en-navy); font-size: 14px; font-weight: 800; }

.en-measure-hero { min-height: 520px; display: flex; align-items: center; background: linear-gradient(105deg, rgba(239,244,248,.97), rgba(239,244,248,.86), rgba(239,244,248,.35)), url('../../assets/images/catalog-hero-architecture.jpg') center/cover; }
.en-measure-hero > div { max-width: 760px; }
.en-measure-hero p { max-width: 620px; }
.en-guide-section { background: #fff; }
.en-guide-section--soft { background: var(--en-soft); }
.en-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 30px; }
.en-guide-card { padding: 28px; border: 1px solid var(--en-line); border-radius: 22px; background: #fff; }
.en-guide-card h3 { margin: 0 0 10px; color: var(--en-navy); font-size: 26px; letter-spacing: -.035em; }
.en-guide-card ol, .en-guide-card ul { margin: 14px 0 0; padding-left: 20px; }
.en-function-table { width: 100%; margin-top: 26px; border-collapse: collapse; background: #fff; border: 1px solid var(--en-line); }
.en-function-table th, .en-function-table td { padding: 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--en-line); color: var(--en-muted); line-height: 1.5; }
.en-function-table th { color: var(--en-navy); font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.en-quote-checklist { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .65fr); gap: 8vw; background: var(--en-navy); }
.en-quote-checklist h2 { color: #fff; }
.en-quote-checklist p, .en-quote-checklist li { color: rgba(255,255,255,.75); }
.en-quote-checklist ul { margin: 18px 0 0; padding-left: 20px; }
.en-quote-checklist .en-button { align-self: center; justify-self: start; }
.en-inquiry-template { padding: 84px 8vw; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr); gap: 8vw; align-items: center; background: #fff; }
.en-inquiry-template h2 { margin: 8px 0 16px; color: var(--en-navy); font-size: clamp(34px, 4.5vw, 58px); line-height: 1.02; letter-spacing: -.055em; }
.en-inquiry-template p { color: var(--en-muted); font-size: 17px; line-height: 1.7; }
.en-inquiry-template pre { margin: 0 0 18px; padding: 24px; overflow: auto; border: 1px solid var(--en-line); border-radius: 20px; background: var(--en-soft); color: var(--en-navy); font: 14px/1.75 Arial,"Helvetica Neue",sans-serif; white-space: pre-wrap; }
.en-system-compare { padding: 84px 8vw; background: var(--en-soft); }
.en-system-compare-heading { max-width: 760px; }
.en-system-compare-heading h2 { margin: 8px 0 16px; color: var(--en-navy); font-size: clamp(34px, 4.5vw, 58px); line-height: 1.02; letter-spacing: -.055em; }
.en-system-compare-heading p { color: var(--en-muted); font-size: 17px; line-height: 1.7; }
.en-system-compare-table { margin-top: 30px; overflow-x: auto; border: 1px solid var(--en-line); border-radius: 22px; background: #fff; }
.en-system-compare-table table { width: 100%; min-width: 820px; border-collapse: collapse; }
.en-system-compare-table th, .en-system-compare-table td { padding: 18px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--en-line); color: var(--en-muted); line-height: 1.5; }
.en-system-compare-table th { color: var(--en-navy); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.en-system-compare-table td:first-child { color: var(--en-navy); font-weight: 800; }
.en-system-compare-table a { color: var(--en-navy); font-size: 13px; font-weight: 800; white-space: nowrap; }

/* Product-page conversion layer: uses a drawing-brief rhythm rather than a
   generic feature-card grid, so each field maps to a real selection input. */
.en-opening-brief { padding: 84px 8vw; background: #eef3f7; }
.en-opening-brief-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .64fr); gap: 8vw; align-items: end; }
.en-opening-brief h2, .en-related-systems h2 { margin: 8px 0 0; color: var(--en-navy); font-size: clamp(34px, 4.5vw, 58px); line-height: 1.02; letter-spacing: -.055em; }
.en-opening-brief-heading > p:last-child { margin: 0; color: var(--en-muted); font-size: 17px; line-height: 1.7; }
.en-opening-brief-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 34px; }
.en-opening-brief-grid article { position: relative; min-height: 218px; padding: 25px 25px 24px; overflow: hidden; border: 1px solid rgba(20,43,79,.14); border-radius: 20px; background: #fff; }
.en-opening-brief-grid article::after { content: ''; position: absolute; right: 0; bottom: 0; width: 38%; height: 3px; background: var(--en-green); }
.en-opening-brief-grid span { display: block; color: var(--en-green); font-size: 13px; font-weight: 900; letter-spacing: .12em; }
.en-opening-brief-grid h3 { margin: 42px 0 8px; color: var(--en-navy); font-size: 26px; letter-spacing: -.04em; }
.en-opening-brief-grid p { max-width: 250px; margin: 0; color: var(--en-muted); line-height: 1.55; }
.en-related-systems { padding: 84px 8vw; background: #fff; }
.en-related-systems > div:first-child { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .6fr); gap: 8vw; }
.en-related-system-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 34px; }
.en-related-system { display: grid; gap: 10px; min-height: 214px; padding: 26px; border: 1px solid var(--en-line); border-radius: 22px; color: var(--en-navy); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.en-related-system:hover { transform: translateY(-4px); border-color: rgba(20,43,79,.28); box-shadow: 0 18px 38px rgba(20,43,79,.1); }
.en-related-system span { color: #637282; font-size: 11px; font-weight: 900; letter-spacing: .1em; }
.en-related-system strong { max-width: 400px; font-size: 29px; line-height: 1.04; letter-spacing: -.045em; }
.en-related-system p { max-width: 470px; margin: 0; color: var(--en-muted); line-height: 1.55; }
.en-related-system b { align-self: end; color: var(--en-navy); font-size: 13px; }

@media (max-width: 860px) {
  .en-guide-intro, .en-project-config, .en-quote-checklist, .en-inquiry-template, .en-opening-brief-heading, .en-related-systems > div:first-child, .en-product-knowledge { grid-template-columns: 1fr; gap: 32px; }
  .en-guide-intro, .en-project-config, .en-measure-hero, .en-guide-section, .en-quote-checklist, .en-inquiry-template, .en-system-compare, .en-opening-brief, .en-related-systems, .en-product-knowledge, .en-guide-hub, .en-faq-page { padding: 64px 24px; }
  .en-guide-hub-grid { grid-template-columns: 1fr; }
  .en-guide-grid { grid-template-columns: 1fr; }
  .en-function-table { display: block; overflow-x: auto; }
  .en-opening-brief-grid, .en-related-system-grid { grid-template-columns: 1fr; }
}
