/* Shared, cache-safe banner and content styling for every brand page. */
.brand-page { background:#f4f7fa; }
.brand-hero { min-height:560px; background:#061727; color:white; position:relative; overflow:hidden; display:flex; align-items:end; }
.brand-hero:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 82% 28%,rgba(67,216,255,.16),transparent 29%),linear-gradient(135deg,rgba(9,103,216,.18),transparent 52%); }
.brand-hero:after { content:""; position:absolute; inset:0; opacity:.11; background-image:linear-gradient(rgba(255,255,255,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.24) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 80%); }
.brand-hero-inner { position:relative; z-index:1; display:grid; grid-template-columns:1fr 310px; gap:90px; align-items:end; padding:96px 0 82px; }
.brand-hero h1 { margin-bottom:22px; max-width:780px; font-size:clamp(42px,5.2vw,68px); line-height:1.08; }
.brand-hero p { max-width:690px; color:#bfccd6; font-size:17px; line-height:1.7; }
.brand-logo-panel { width:310px; height:230px; background:white; border:1px solid rgba(255,255,255,.35); display:grid; place-items:center; padding:48px; box-shadow:0 26px 70px rgba(0,0,0,.25); }
.brand-logo-panel img { max-width:210px; max-height:100px; object-fit:contain; }
.brand-directory { padding:105px 0 120px; }
.brand-directory-heading { display:grid; grid-template-columns:1fr .75fr; gap:80px; align-items:end; margin-bottom:50px; }
.brand-directory-heading h2 { margin:0; }
.brand-directory-heading p { margin:0; color:var(--muted); }
.brand-model-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.brand-model-card { min-width:0; background:white; border:1px solid var(--line); display:flex; flex-direction:column; transition:.25s; }
.brand-model-card:hover { transform:translateY(-5px); box-shadow:0 22px 55px rgba(8,27,45,.1); border-color:#b8c8d5; }
.brand-model-image { height:235px; background:#edf2f6; display:grid; place-items:center; padding:38px; overflow:hidden; position:relative; }
.brand-model-image:before { content:""; position:absolute; width:180px; height:180px; border:1px solid #d8e1e8; border-radius:50%; box-shadow:0 0 0 28px rgba(255,255,255,.35); }
.brand-model-image img { position:relative; width:100%; height:175px; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(8,27,45,.18)); }
.brand-model-copy { padding:28px; display:flex; flex-direction:column; flex:1; }
.brand-model-copy small { color:var(--blue); font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.brand-model-copy h2 { margin:8px 0 10px; font-size:23px; line-height:1.2; }
.brand-model-copy p { color:var(--muted); font-size:13px; }
.brand-model-copy b { margin-top:auto; padding-top:18px; color:var(--blue); font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.brand-capabilities { padding:100px 0; background:white; }
.brand-capability-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:46px; }
.brand-capability { padding:34px; border:1px solid var(--line); background:var(--paper); }
.brand-capability b { color:var(--blue); font-size:10px; letter-spacing:.12em; }
.brand-capability h3 { margin:28px 0 10px; font-size:20px; }
.brand-capability p { margin:0; color:var(--muted); font-size:13px; }
.brand-cta { background:var(--blue); color:white; padding:78px 0; }
.brand-cta-inner { display:flex; justify-content:space-between; align-items:center; gap:70px; }
.brand-cta h2 { margin:0; max-width:720px; font-size:clamp(34px,3.8vw,50px); }
.brand-cta p { color:#c9e2f7; margin:0 0 20px; max-width:440px; }
.brand-cta .button { background:var(--cyan); color:var(--navy); }
@media (max-width:900px) {
  .brand-hero-inner { grid-template-columns:1fr 240px; gap:45px; }
  .brand-logo-panel { width:240px; height:190px; }
  .brand-model-grid { grid-template-columns:repeat(2,1fr); }
  .brand-directory-heading { grid-template-columns:1fr; gap:24px; }
}
@media (max-width:700px) {
  .brand-hero { min-height:620px; }
  .brand-hero-inner { grid-template-columns:1fr; padding:96px 0 70px; }
  .brand-logo-panel { width:100%; height:170px; order:-1; }
  .brand-hero h1 { font-size:clamp(36px,10vw,44px); line-height:1.13; }
  .brand-model-grid,.brand-capability-grid { grid-template-columns:1fr; }
  .brand-model-image { height:220px; }
  .brand-cta-inner { align-items:flex-start; flex-direction:column; gap:28px; }
}
