/* Compact aerial, cohesive unit details, and a consistent section rhythm. */
:root{--section-space:80px;--section-heading-gap:32px}
main>.sec{padding-block:var(--section-space)}
.sec-head{margin-bottom:var(--section-heading-gap)}

/* Overview: the picture is not enlarged and does not open a lightbox. */
#overview .ov-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:32px;align-items:stretch}
.overview-visual{display:flex;flex-direction:column;gap:20px;min-width:0}
#overview .ov-img{width:100%;max-width:720px;align-self:center;cursor:default;line-height:0;flex:none}
#overview .ov-img img{display:block;width:100%;height:auto;object-fit:contain;transform:none;animation:none}
#overview .ov-img .cap{line-height:1.5}
#overview .mix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:0;flex:1}
#overview .mix div{padding:22px 24px;display:flex;flex-direction:column;justify-content:center;min-height:118px}
#overview .mix b{font-size:32px;margin-bottom:8px}
#overview .spec{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(7,1fr);align-self:stretch;border:1px solid var(--line);border-top:3px solid var(--navy);border-radius:0 0 14px 14px;min-width:0}
#overview .spec div{grid-column:auto;grid-template-columns:128px minmax(0,1fr);gap:16px;padding:16px 20px;min-height:0;border-right:0}

/* The plan is a static image. Type, action, measurements and features form one card. */
.unit-plan{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff}
.unit-plan img{display:block;width:100%;height:auto;object-fit:contain}
#units .unit{gap:24px}
#units .ucard{display:grid;grid-template-columns:minmax(0,1fr) 260px;grid-template-areas:"title action" "specs specs" "features features";gap:24px 32px;padding:30px 32px;align-items:center}
#units .ucard .ty{grid-area:title;font-size:48px;line-height:1.1}
#units .ucard .btn{grid-area:action;width:100%;max-width:none;justify-self:stretch;margin:0;min-height:62px;height:62px;font-size:20px;white-space:nowrap}
#units .ucard dl{grid-area:specs;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:0;padding-top:24px;border-top:1px solid var(--line)}
#units .ucard dl div{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;padding:0;border-bottom:0;min-width:0}
#units .ucard dt{font-size:20px;line-height:1.5;font-weight:600;color:var(--mute)}
#units .ucard dd{font-size:24px;line-height:1.5;font-weight:750;text-align:left;color:var(--navy);white-space:nowrap}
#units .ucard .pts{grid-area:features;margin:0;gap:10px}
#units .ucard .pts li{padding:7px 16px;font-size:20px}
.film .sec-head{display:block}

@media(max-width:1100px){
  :root{--section-space:64px}
  #overview .ov-grid{gap:24px}
  #overview .spec div{grid-template-columns:110px minmax(0,1fr);gap:12px;padding:16px}
  #overview .mix div{padding:20px 16px}
  #units .ucard{grid-template-columns:minmax(0,1fr) 240px;padding:28px;gap:24px}
  #units .ucard dl{gap:20px}
  #units .ucard dd{font-size:22px}
}
@media(max-width:1000px){
  #overview .ov-grid{grid-template-columns:1fr}
  #overview .overview-visual{gap:24px}
  #overview .spec{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none}
  #overview .spec div{padding:20px;grid-template-columns:114px minmax(0,1fr)}
  #overview .spec div:nth-child(odd){border-right:1px solid var(--line)}
  #overview .spec div:last-child{grid-column:1/-1;border-right:0}
  #overview .mix{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  #overview .mix div{padding:20px 14px}
}
@media(max-width:767px){
  :root{--section-space:48px;--section-heading-gap:28px}
  #overview .ov-grid{gap:22px}
  #overview .overview-visual{gap:18px}
  #overview .mix{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  #overview .mix div{padding:20px 16px;min-height:118px}
  #overview .mix b{font-size:30px}
  #overview .spec{grid-template-columns:1fr}
  #overview .spec div{grid-template-columns:118px minmax(0,1fr);gap:12px;padding:18px 16px}
  #overview .spec div:nth-child(odd){border-right:0}
  #units .unit{gap:20px}
  #units .ucard{grid-template-columns:1fr;grid-template-areas:"title" "specs" "features" "action";gap:22px;padding:24px}
  #units .ucard .ty{font-size:44px}
  #units .ucard dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;padding-top:22px}
  #units .ucard dd{font-size:20px}
  #units .ucard .pts{gap:8px}
  #units .ucard .pts li{padding:7px 12px}
  #units .ucard .btn{height:62px;min-height:62px;margin-top:2px}
}
@media(max-width:380px){
  #overview .spec div{grid-template-columns:1fr;gap:6px}
  #overview .mix{grid-template-columns:1fr}
  #units .ucard dl{grid-template-columns:1fr;gap:14px}
  #units .ucard dl div{flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px}
}
