/* Afric Business responsive layer — desktop, tablet and mobile */
:root{--ab-safe-x:max(16px,env(safe-area-inset-left));--ab-safe-r:max(16px,env(safe-area-inset-right))}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
body{overflow-x:hidden;min-width:0}
img,video,svg,canvas{max-width:100%;height:auto}
button,a,input,select,textarea{touch-action:manipulation}
main,section,.container,.hero-grid,.feature-item,.contact-grid,.footer-grid,.cards,.project-explorer-grid{min-width:0}
.container{width:min(1320px,calc(100% - 48px));margin-inline:auto}
.hero h1,.page-hero h1,.section-title,.solea-hero h1{overflow-wrap:anywhere;text-wrap:balance}
.hero-lead,.page-lead,.section-copy,.card p,.feature-content p{overflow-wrap:anywhere}

/* Comfortable desktop */
@media (min-width:1400px){
  .container{width:min(1380px,calc(100% - 72px))}
  .hero-grid{gap:72px}
}

/* Laptop / small desktop */
@media (max-width:1180px){
  .container{width:min(100% - 40px,1180px)}
  .nav-wrap{min-height:96px}
  .brand img{height:76px;max-width:250px}
  .hero-grid,.feature-item,.contact-grid{gap:36px}
  .cards.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:28px}
}

/* Tablet — navigation becomes touch-friendly */
@media (max-width:1040px){
  .container{width:min(100% - 36px,960px)}
  .site-header{position:relative}
  .nav-wrap{min-height:86px;gap:12px}
  .brand img{height:68px;max-width:220px}
  .nav-tools{margin-left:auto;display:flex;align-items:center;gap:8px}
  .menu-toggle{display:grid;place-items:center;min-width:44px;min-height:44px;font-size:1.25rem}
  .lang-select{min-height:44px;padding:8px 10px}
  .nav-links{left:18px;right:18px;max-height:calc(100dvh - 110px);overflow:auto;overscroll-behavior:contain}
  .nav-links a{min-height:46px;display:flex;align-items:center;padding:12px 14px}
  .hero-grid,.feature-item,.contact-grid,.section-head,.cta-grid,.footer-grid{grid-template-columns:1fr!important}
  .hero-grid,.feature-item,.contact-grid{gap:30px}
  .section-head{display:grid;gap:14px}
  .section-head>*{max-width:none}
  .hero-image{min-height:360px}
  .hero-visual{max-width:760px;width:100%;margin-inline:auto}
  .hero-card{max-width:min(86%,420px)}
  .cards.cols-3,.cards.cols-4,.pillars,.compare-grid,.revenue-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metric-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metric:nth-child(3){border-left:0}
  .footer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .footer-brand{grid-column:1/-1}
  .cta-grid{display:grid;align-items:start}
  .cta-grid .btn{justify-self:start}
  .contact-card{padding:24px}
  table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .finance-page .project-explorer-grid{grid-template-columns:1fr!important}
}

/* Phones */
@media (max-width:700px){
  :root{--mobile-pad:18px}
  .container{width:calc(100% - 36px)}
  .site-header{border-top-width:2px}
  .nav-wrap{min-height:76px;padding-block:4px}
  .brand img{height:58px;max-width:182px}
  .nav-tools{gap:6px}
  .lang-select{font-size:.78rem;min-width:56px;padding-inline:8px}
  .menu-toggle{min-width:42px;min-height:42px}
  .nav-links{left:10px;right:10px;border-radius:0 0 16px 16px;padding:10px}
  .hero,.page-hero,.solea-hero{padding-top:46px;padding-bottom:48px}
  .hero h1,.page-hero h1,.solea-hero h1{font-size:clamp(2.15rem,10.5vw,3.25rem);line-height:1.02}
  .section-title{font-size:clamp(1.85rem,8.3vw,2.6rem)}
  .hero-lead,.page-lead,.section-copy{font-size:.98rem;line-height:1.7}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .hero-actions .btn,.cta-grid .btn{width:100%;justify-content:center;min-height:48px}
  .hero-image{min-height:250px;border-width:4px}
  .hero-card{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin-top:12px;max-width:none;width:100%}
  .section{padding:52px 0}
  .cards.cols-2,.cards.cols-3,.cards.cols-4,.pillars,.compare-grid,.revenue-grid,.metric-strip,.footer-grid{grid-template-columns:1fr!important}
  .card,.pillar,.contact-card{border-radius:13px}
  .card-body,.pillar,.contact-card{padding:21px}
  .feature-item{display:grid!important;grid-template-columns:1fr!important;gap:20px!important}
  .feature-item:nth-child(even){direction:ltr}
  .feature-media{order:-1}
  .process-row{grid-template-columns:48px 1fr;gap:14px;padding:20px 18px}
  .process-no{font-size:1.55rem}
  .metric+.metric{border-left:0;border-top:1px solid rgba(23,56,76,.09)}
  .metric{padding:20px}
  .solea-subnav{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .solea-subnav a{display:flex;align-items:center;justify-content:center;min-height:44px;text-align:center;padding:9px}
  .contact-grid{display:grid!important}
  input,select,textarea{font-size:16px!important;max-width:100%}
  textarea{min-height:130px}
  .chat-button{right:14px;bottom:14px;width:48px;height:48px}
  .chat-panel{right:10px;bottom:72px;width:calc(100vw - 20px);max-height:70dvh}
  .footer-bottom{display:grid;gap:10px;text-align:left}
  .finance-hero-stats{grid-template-columns:1fr!important}
  .finance-hero-panel{padding:28px 22px!important}
  .finance-intro,.sovereign-editorial{grid-template-columns:1fr!important;gap:32px!important}
  .fin-role-list{padding-left:18px}
  .project-explorer-grid{display:grid!important;grid-template-columns:1fr!important;gap:28px!important}
  .spiral-shell{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;min-height:0!important;padding:0!important}
  .spiral-ring,.spiral-center,.spiral-shell:before,.spiral-shell:after,.spiral-aura,.active-connector{display:none!important}
  .sector-orbit{position:static!important;transform:none!important;width:auto!important;height:auto!important;min-height:92px;border-radius:14px!important;padding:15px!important;text-align:left!important}
  .sector-detail{padding:24px!important;min-height:0!important}
  .sector-detail h3{font-size:1.75rem!important}
  .detail-controls{justify-content:space-between;flex-wrap:wrap}
  .structure-strip{gap:7px}
  .structure-pill{font-size:.72rem;padding:7px 9px}
  .sovereign-heading{position:static!important}
  .sovereign-row{grid-template-columns:34px 1fr;gap:12px;padding:20px 0}
}

/* Narrow phones */
@media (max-width:430px){
  .container{width:calc(100% - 28px)}
  .brand img{height:52px;max-width:160px}
  .nav-wrap{min-height:70px}
  .solea-subnav{grid-template-columns:1fr}
  .spiral-shell{grid-template-columns:1fr!important}
  .footer-col{min-width:0}
  .footer-col a,.contact-line a{overflow-wrap:anywhere}
}

/* Portal pages */
@media (max-width:900px){
  .portal-shell,.portal-grid,.dashboard-grid,.auth-grid{grid-template-columns:1fr!important}
  .portal-sidebar{position:static!important;width:100%!important}
  .portal-main{margin:0!important;width:100%!important}
}
@media (max-width:600px){
  .portal-wrap,.portal-main,.auth-card{padding-left:16px!important;padding-right:16px!important}
  .portal-card,.auth-card{border-radius:14px!important}
}

/* 2026-08-28 mobile navigation reliability patch */
@media(max-width:1040px){
  .site-header{position:relative;z-index:1000}
  .nav-wrap{position:relative}
  .menu-toggle{position:relative;z-index:1002;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .menu-toggle.open{background:#10243a;color:#fff;border-color:#10243a}
  .nav-links{z-index:1001}
  .nav-links.open{display:flex!important;animation:abMenuIn .2s ease-out both}
  body.nav-open{overflow:hidden}
}
@keyframes abMenuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
