/* WebHatim V7 — desktop restores centered classic proportions; V6 mobile sizing is left intact. */
.wh7-brand-text{display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;line-height:1.16;gap:3px}
.brand .wh7-brand-text strong{display:block;font-size:19px;font-weight:850;letter-spacing:-.45px;line-height:1.15}
.brand .wh7-brand-text small{display:block;font-size:12px;color:#668276;font-weight:650;letter-spacing:0;line-height:1.25}
.wh5-footer-brand .wh7-brand-text b,.wh5-footer-brand .wh7-brand-text small{display:block;line-height:1.25}
.wh5-footer-brand .wh7-brand-text small{opacity:.79;font-weight:500;font-size:12px;margin-top:3px}
.wh5-splash .wh7-splash-title{line-height:1.15}
.wh7-splash-title span{display:block;margin-top:8px;font-size:.55em;color:#d9e9df;font-weight:680;letter-spacing:.1px}
.wh7-brand-text>*{max-width:100%;overflow-wrap:anywhere}
@media (min-width:881px){
  /* Undo V6 .container {max-width:100%} regression without touching narrow screens. */
  .container{width:100%;max-width:1180px;padding-inline:26px;margin-left:auto;margin-right:auto}
  .site-header{height:88px}
  .header-row{gap:18px}
  .nav-links{gap:clamp(9px,1vw,17px);margin-left:auto;margin-right:0}
  .nav-links a{font-size:12px;white-space:nowrap}
  .nav-action{flex:0 0 auto;white-space:nowrap}
  .brand{flex:0 0 auto}
  .hero{width:calc(100% - 48px);max-width:1240px;margin:20px auto 0;border-radius:22px;box-shadow:0 16px 45px rgba(10,43,34,.08)}
  .hero-inner{min-height:450px;overflow:hidden}
  .hero-copy{width:60%;max-width:630px;padding:70px 0 60px}
  .hero h1{font-size:clamp(41px,3.9vw,59px);letter-spacing:-2px}
  .hero-art{display:grid;position:relative;right:auto;bottom:auto;opacity:1;width:355px;height:355px;max-width:35%;margin-left:auto;flex-shrink:0}
  .content-layout{grid-template-columns:minmax(0,1fr) 298px;gap:28px}
  .site-sidebar{min-width:0}
  .stats-grid{gap:16px}
  .feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:881px) and (max-width:1100px){
  .container{max-width:1040px;padding-inline:22px}
  .nav-links{gap:8px}
  .nav-links a{font-size:11px}
  .brand .wh7-brand-text strong{font-size:16px}
  .brand .wh7-brand-text small{font-size:11px}
  .hero{width:calc(100% - 32px)}
  .hero-art{max-width:30%;opacity:.7}
  .content-layout{grid-template-columns:minmax(0,1fr) 245px;gap:18px}
}
@media (max-width:880px){
  .brand .wh7-brand-text strong{font-size:17px}
  .brand .wh7-brand-text small{font-size:11px}
  .wh7-splash-title span{font-size:.55em}
}
@media (max-width:380px){
  /* Keep the two-line brand even on the smallest phones. */
  .brand .wh7-brand-text strong{font-size:15px}
  .brand .wh7-brand-text small{display:block;font-size:10px}
  .header-row{gap:6px}
}
