:root{
  --navy:#06265b;--blue:#0f68ff;--blue2:#eaf3ff;--ink:#0e2145;--muted:#63708a;--line:#dbe3ef;--soft:#f7f9fc;--sand:#d7bc84;--sand2:#f8f1e4;--mint:#e6f6ef;--white:#fff;--shadow:0 14px 36px rgba(16,48,95,.08);--radius:18px;--max:1440px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.45}a{color:inherit;text-decoration:none}button,input{font:inherit}.container{width:min(var(--max),calc(100% - 48px));margin:auto}
.site-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-bottom:1px solid #e9eef6}.nav-wrap{height:76px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:10px;min-width:max-content}.brand-mark{width:38px;height:44px;display:grid;gap:3px;transform:rotate(-14deg)}.brand-mark i{display:block;border-radius:3px;background:var(--navy)}.brand-mark i:nth-child(1){width:24px;height:8px;margin-left:11px}.brand-mark i:nth-child(2){width:31px;height:8px}.brand-mark i:nth-child(3){width:24px;height:8px;margin-left:6px}.brand-copy{display:flex;flex-direction:column}.brand-copy strong{font-size:26px;line-height:1;font-weight:800}.brand-copy small{font-size:9px;color:#7d8798;margin-top:4px}.main-nav{display:flex;gap:28px;margin-left:auto}.main-nav a{font-size:14px;font-weight:700}.nav-actions{display:flex;align-items:center;gap:10px}.icon-btn,.lang-btn{border:0;background:transparent;color:var(--ink);cursor:pointer}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:8px;padding:11px 20px;border:1px solid transparent;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--blue);color:#fff}.btn-outline{border-color:var(--blue);color:var(--blue);background:#fff}.btn-gold{background:#cbb17c;color:#fff}.btn-light{background:#fff;color:var(--navy);padding-inline:28px}.menu-toggle{display:none;border:0;background:#fff;font-size:24px}
.hero{position:relative;min-height:470px;overflow:hidden}.hero-media{position:absolute;inset:0;background-image:url('assets/residents_expats.jpg');background-size:cover;background-position:center}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.88) 35%,rgba(255,255,255,.15) 67%,rgba(3,26,63,.08) 100%)}.hero-grid{position:relative;min-height:470px;display:grid;grid-template-columns:1.15fr 1fr;align-items:center}.hero-copy{max-width:760px;padding:48px 0}.eyebrow{display:inline-block;font-size:13px;letter-spacing:.18em;font-weight:800;color:#244a7f;margin-bottom:16px}.hero h1{font-size:54px;line-height:1.02;margin:0 0 16px;letter-spacing:-.035em}.hero h1 em{color:#0b68ff;font-style:normal}.hero p{font-size:18px;max-width:700px;margin:0 0 22px}.hero-search{display:flex;align-items:center;background:#fff;border:1px solid #cfd9e8;border-radius:11px;padding:5px;box-shadow:0 12px 24px rgba(10,41,82,.08);max-width:810px}.search-icon{font-size:28px;margin:0 14px}.hero-search input{flex:1;border:0;outline:0;padding:13px 0;color:var(--ink);min-width:0}.popular-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:12px;margin-top:10px}.popular-row a{background:#fff;border:1px solid #d7e0ec;padding:5px 10px;border-radius:999px}.popular-row span{font-weight:800}
.audience-section{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}.audience-card{display:grid;grid-template-columns:1.1fr .9fr;border-radius:14px;overflow:hidden;min-height:190px;border:1px solid #e1e7f0;box-shadow:var(--shadow)}.audience-card>div:first-child{padding:30px}.resident-card{background:linear-gradient(90deg,#edf6ff,#fff)}.emirati-card{background:linear-gradient(90deg,#faf3e6,#fff)}.audience-card h2{font-size:26px;margin:0 0 8px}.audience-card p{margin:0 0 20px;color:#334766}.audience-image{background-size:cover;background-position:center}.residents-img{background-image:url('assets/residents_expats.jpg')}.emirati-img{background-image:url('assets/emiratis.jpg')}
.section{padding:34px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px}.section-heading h2,.section>h2,.update-grid h2{font-size:27px;margin:0}.section-heading p{margin:5px 0 0;color:var(--muted)}.section-heading.compact{align-items:center}.section-heading.small h2{font-size:22px}.text-link{color:#0b63df;font-weight:800;font-size:13px}.muted{color:#6d7a91}.muted-text{color:var(--muted);font-size:13px}
.service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.service-card{border:1px solid var(--line);min-height:90px;border-radius:10px;padding:15px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;background:#fff;transition:.2s}.service-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.service-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:19px;font-weight:900}.service-icon.blue{background:#e7f1ff;color:#0f68ff}.service-icon.sand{background:#f7efe0;color:#a47b2d}.service-icon.mint{background:#e6f6ef;color:#168c63}
.language-section{padding-top:16px}.language-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}.language-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:13px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:0 9px;text-align:left;cursor:pointer}.language-card>span{grid-row:1/3;font-size:25px}.language-card b{font-size:14px}.language-card small{color:var(--muted)}
.tri-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px}.list-panel{min-width:0}.simple-list,.profile-list,.event-list{display:flex;flex-direction:column}.simple-list>a,.profile-list>a{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:12px;border-bottom:1px solid #ebeff5;padding:12px 0}.simple-list small,.profile-list small,.event-list small{display:block;color:var(--muted)}.mini-icon{width:36px;height:36px;border-radius:8px;background:#e9f3ff;display:grid;place-items:center;color:#0f68ff}.badge{font-size:9px;border-radius:999px;padding:3px 8px;font-weight:900;width:max-content}.badge.gold{background:#ffefc7;color:#b68200}.badge.blue{background:#e8f2ff;color:#0d68ff}.profile-list>a{grid-template-columns:auto 1fr auto}.avatar{width:44px;height:44px;border-radius:50%;background-size:cover;background-position:center;display:block}.a1{background-image:url('https://images.unsplash.com/photo-1559839734-2b71ea197ec2?auto=format&fit=crop&w=200&q=80')}.a2{background-image:url('https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&w=200&q=80')}.a3{background-image:url('https://images.unsplash.com/photo-1494790108377-be9c29b29330?auto=format&fit=crop&w=200&q=80')}.a4{background-image:url('https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&w=200&q=80')}.a5{background-image:url('https://images.unsplash.com/photo-1438761681033-6461ffad8d80?auto=format&fit=crop&w=200&q=80')}.profile-list i{color:#0f68ff;font-style:normal}.event-list a{display:grid;grid-template-columns:86px 1fr;gap:12px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:7px;margin-bottom:8px}.event-thumb{height:56px;border-radius:7px;background-size:cover;background-position:center}.e1{background-image:url('assets/event_career_fair.jpg')}.e2{background-image:url('assets/event_small_business.jpg')}.e3{background-image:url('assets/event_family_day.jpg')}.e4{background-image:url('assets/event_women_business.jpg')}
.ai-banner{display:grid;grid-template-columns:auto 1.15fr .8fr 1.2fr;align-items:center;gap:24px;background:linear-gradient(90deg,#eff7ff 0%,#d9ebff 60%,#eef6ff 100%);border-radius:14px;min-height:210px;overflow:hidden;padding:28px 32px;margin-top:20px}.sparkle{font-size:42px;color:#0f68ff}.ai-copy h2{font-size:28px;margin:0 0 8px}.ai-copy p{margin:0 0 20px}.ai-person{height:180px;background:url('https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?auto=format&fit=crop&w=600&q=80') center/cover;border-radius:80px 80px 10px 10px;align-self:end}.ai-prompts{display:grid;gap:8px}.ai-prompts button{border:1px solid #dbe7f7;background:#fff;border-radius:999px;padding:10px 14px;text-align:left}
.partners{padding-bottom:20px}.partner-row{display:grid;grid-template-columns:repeat(7,1fr);gap:18px;align-items:center;border-top:1px solid #eef2f7;border-bottom:1px solid #eef2f7;padding:18px 0}.partner-row div{font-size:12px;display:flex;align-items:center;gap:8px}.partner-row span{font-size:24px;color:#0b63df}
.update-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:26px;padding:26px 0}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}.news-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;padding-bottom:14px}.news-image{height:110px;background-size:cover;background-position:center}.n1{background-image:url('assets/update_visa_rules.jpg')}.n2{background-image:url('assets/update_schools.jpg')}.n3{background-image:url('assets/update_business_setup.jpg')}.news-card .badge,.news-card h3,.news-card small{margin-left:12px}.news-card .badge{display:inline-block;margin-top:10px}.news-card h3{font-size:15px;margin-top:7px;margin-bottom:5px}.news-card small{color:var(--muted)}.testimonial{border:1px solid var(--line);border-radius:10px;padding:24px;margin:16px 0 0;font-size:17px}.testimonial footer{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;margin-top:24px}.testimonial small{display:block;color:var(--muted)}.stars{color:#f3a900}.dots{font-size:25px;color:#6d7a91}
.cta-banner{background:linear-gradient(90deg,#082e66,#003a82 60%,#082e66);color:#fff;border-radius:10px;padding:26px 34px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:20px auto 10px;position:relative;overflow:hidden}.cta-banner:after{content:"";position:absolute;right:0;top:0;bottom:0;width:45%;background:url('https://images.unsplash.com/photo-1518684079-3c830dcef090?auto=format&fit=crop&w=900&q=70') center/cover;opacity:.25}.cta-banner>*{position:relative;z-index:1}.cta-banner h2{margin:0 0 5px}.cta-banner p{margin:0}
.site-footer{background:#06265b;color:#fff;margin-top:28px;padding-top:34px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:34px}.site-footer h4{margin:0 0 12px}.site-footer a{display:block;color:#d8e3f2;font-size:13px;margin:6px 0}.footer-brand p{color:#c7d4e6;font-size:13px;max-width:280px}.brand.inverse .brand-mark i{background:#fff}.brand.inverse .brand-copy small{color:#cbd7e7}.socials{display:flex;gap:10px}.socials a{width:32px;height:32px;border:1px solid rgba(255,255,255,.3);border-radius:50%;display:grid;place-items:center}.download-title{margin-top:24px!important}.app-badges{display:flex;gap:8px;flex-wrap:wrap}.app-badges span{border:1px solid rgba(255,255,255,.4);border-radius:6px;padding:7px 10px;font-size:11px}.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:32px;padding:16px 0;display:flex;justify-content:space-between;gap:20px;color:#b9c8dc;font-size:12px}.footer-bottom div{display:flex;gap:18px}.footer-bottom a{margin:0}
@media (max-width:1100px){.main-nav{display:none}.menu-toggle{display:block;margin-left:auto}.nav-actions .lang-btn,.nav-actions .icon-btn{display:none}.hero-grid{grid-template-columns:1fr}.hero-overlay{background:rgba(255,255,255,.78)}.audience-section,.tri-grid,.update-grid{grid-template-columns:1fr}.service-grid{grid-template-columns:repeat(2,1fr)}.language-grid{grid-template-columns:repeat(4,1fr)}.partner-row{grid-template-columns:repeat(3,1fr)}.ai-banner{grid-template-columns:auto 1fr}.ai-person,.ai-prompts{display:none}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.container{width:min(100% - 28px,var(--max))}.site-header .nav-wrap{height:66px}.brand-copy strong{font-size:22px}.brand-copy small{display:none}.nav-actions .btn-outline{display:none}.nav-actions .btn-primary{padding:9px 12px}.hero{min-height:560px}.hero-grid{min-height:560px}.hero-copy{padding:50px 0 34px}.hero h1{font-size:42px}.hero p{font-size:16px}.hero-search{align-items:stretch}.hero-search .btn{padding-inline:16px}.popular-row{display:none}.audience-section{grid-template-columns:1fr}.audience-card{grid-template-columns:1fr}.audience-image{height:150px}.service-grid{grid-template-columns:1fr}.language-grid{grid-template-columns:repeat(2,1fr)}.news-grid{grid-template-columns:1fr}.partner-row{grid-template-columns:repeat(2,1fr)}.cta-banner{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{flex-direction:column}.section-heading{align-items:flex-start}.service-card{min-height:76px}.ai-banner{grid-template-columns:1fr}.sparkle{display:none}}


/* ===== Expanded sections — matched to original Towasal design ===== */
:root{
  --navy:#06265b;
  --blue:#06265b;
  --blue2:#eef4fa;
  --ink:#102b4a;
  --muted:#66788d;
  --line:#dbe3ef;
  --soft:#f8fafc;
  --shadow:0 8px 22px rgba(6,38,91,.05);
}

/* Lighter typography while preserving the original scale */
body{font-weight:400;color:var(--ink)}
.brand-copy strong{font-weight:650}
.main-nav a{font-weight:550}
.btn{font-weight:600}
.eyebrow{font-weight:600}
.hero h1{font-weight:650}
.hero h1 em{color:var(--navy);font-weight:550}
.hero p{font-weight:400}
.popular-row span{font-weight:600}
.section-heading h2,.section>h2,.update-grid h2,.audience-card h2,.ai-copy h2{font-weight:600}
.text-link{color:var(--navy);font-weight:600}
.service-card strong,.language-card b,.simple-list strong,.profile-list strong,.event-list strong,.news-card h3{font-weight:550}

/* Single official Towasal colour system */
.btn-primary,.btn-gold{background:var(--navy);color:#fff}
.btn-primary:hover,.btn-gold:hover{background:#0b356e}
.btn-outline{border-color:var(--navy);color:var(--navy)}
.service-icon,.mini-icon{background:#edf4fb!important;color:var(--navy)!important}
.profile-list i{color:var(--navy)}
.badge.blue{background:#edf4fb;color:var(--navy)}
.sparkle,.partner-row span{color:var(--navy)}

/* Better Lucide icon consistency */
svg{stroke-width:1.8}
.icon-btn svg,.lang-btn svg,.search-icon svg{width:17px;height:17px}
.service-icon svg{width:19px;height:19px}
.mini-icon svg{width:16px;height:16px}

/* Keep original compact rhythm and align sections */
.section{padding:31px 0}
.section-heading{margin-bottom:14px}
.audience-section{align-items:stretch}
.audience-card{height:100%}
.service-grid{align-items:stretch}
.service-card{height:100%}
.language-grid{align-items:stretch}
.language-card{height:100%}

/* Three-column section: aligned headings, consistent body height */
.tri-grid{align-items:stretch;padding-bottom:26px}
.list-panel{display:flex;flex-direction:column;min-width:0}
.list-panel .section-heading.small{min-height:42px;align-items:center;margin-bottom:6px}
.list-panel .section-heading.small h2{font-size:22px;line-height:1.15}
.simple-list,.profile-list,.event-list{flex:1}
.simple-list>a,.profile-list>a{min-height:62px;padding:10px 0}
.event-list a{min-height:74px}
.event-thumb{height:58px}
.profile-list .avatar{width:42px;height:42px}

/* New Emirati pathway section */
.emirati-stage{padding-top:26px;padding-bottom:24px}
.compact-tile-grid{display:grid;gap:12px}
.compact-tile-grid.six{grid-template-columns:repeat(6,1fr)}
.compact-tile-grid.four{grid-template-columns:repeat(4,1fr)}
.compact-tile-grid>a,.compact-tile-grid>div,.compact-tile-grid>article{
  border:1px solid var(--line);border-radius:10px;background:#fff;padding:15px;min-height:104px;
  display:flex;flex-direction:column;align-items:flex-start;gap:6px
}
.compact-tile-grid svg{width:19px;height:19px;color:var(--navy)}
.compact-tile-grid strong{font-size:13px;font-weight:550;line-height:1.3}
.compact-tile-grid small{font-size:10px;color:var(--muted);line-height:1.45}

/* Business / institution panels use the same Towasal card language */
.twin-panels{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-top:18px;padding-bottom:24px}
.twin-panels article{border:1px solid var(--line);border-radius:10px;padding:24px;background:#fff;min-height:180px;display:flex;flex-direction:column;align-items:flex-start}
.twin-panels h2{font-size:22px;font-weight:600;margin:4px 0 8px}
.twin-panels p{font-size:13px;color:var(--muted);margin:0 0 17px;line-height:1.5;max-width:620px}
.twin-panels .btn{margin-top:auto}

/* How it works */
.how-compact{padding-top:24px;padding-bottom:24px}
.steps>div{min-height:122px;position:relative}
.steps>div>span{font-size:10px;color:#9aaabd;align-self:flex-end}
.steps svg{margin-top:-6px}

/* Membership cards — same proportions and lighter hierarchy */
.membership-compact{padding-top:24px;padding-bottom:26px}
.plans article{min-height:168px}
.plans b{font-size:10px;color:#56708b;font-weight:500}
.plans a{margin-top:auto;width:100%;border:1px solid #cddaea;border-radius:6px;text-align:center;padding:8px 10px;font-size:11px;font-weight:600;color:var(--navy)}
.plans .active{background:#f2f7fc}
.plans .active a{background:var(--navy);color:#fff;border-color:var(--navy)}

/* AI banner remains close to approved original */
.ai-banner{margin-top:22px;margin-bottom:18px;background:linear-gradient(90deg,#eef6ff 0%,#dcecff 58%,#eef6ff 100%)}
.ai-copy h2{font-size:27px}
.sparkle svg{width:34px;height:34px}
.ai-prompts button{font-size:12px;color:#314760}

/* Real partner marks stay compact and aligned */
.partners{padding-top:26px;padding-bottom:16px}
.partner-row{display:grid;grid-template-columns:repeat(7,1fr);gap:14px}
.partner-row a{display:flex;align-items:center;gap:8px;font-size:11px;color:#263f5b;min-width:0}
.partner-row img{width:27px;height:27px;object-fit:contain;border-radius:50%;background:#fff;flex:0 0 auto}
.partner-row span{font-size:11px;line-height:1.3;color:#263f5b}

/* Updates alignment */
.update-grid{align-items:start;padding-top:28px;padding-bottom:24px}
.news-card{height:100%}
.testimonial{min-height:220px}

/* Footer official colour */
.cta-banner{background:linear-gradient(90deg,#06265b,#0b3a76 60%,#06265b)}
.site-footer{background:#06265b}

@media (max-width:1100px){
  .compact-tile-grid.six{grid-template-columns:repeat(3,1fr)}
  .compact-tile-grid.four{grid-template-columns:repeat(2,1fr)}
  .twin-panels{grid-template-columns:1fr}
  .partner-row{grid-template-columns:repeat(3,1fr)}
  .list-panel .section-heading.small{min-height:auto}
}
@media (max-width:720px){
  .compact-tile-grid.six,.compact-tile-grid.four{grid-template-columns:1fr}
  .partner-row{grid-template-columns:repeat(2,1fr)}
  .twin-panels article{min-height:auto}
}


/* ===== V11 unified Towasal refinement ===== */
/* Keep the approved upper-page style, but give added sections the same scale, density and rhythm. */
:root{--navy:#06265b;--blue:#06265b;--ink:#102b4a;--muted:#66788d;--line:#dbe3ef;--soft:#f8fafc}

/* Common section rhythm */
.section{padding:36px 0}
.section-heading{margin-bottom:17px}
.section-heading h2,.section>h2,.update-grid h2{font-size:27px;font-weight:600;line-height:1.15;letter-spacing:-.015em}
.section-heading p{font-size:13px;line-height:1.55;max-width:760px}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.17em;margin-bottom:12px}
.text-link{font-size:12px;font-weight:600}

/* FOR EMIRATIS — same visual importance as Explore Services */
.emirati-stage{padding-top:38px;padding-bottom:38px}
.emirati-stage .section-heading{margin-bottom:18px}
.emirati-stage .section-heading h2{font-size:27px}
.emirati-stage .compact-tile-grid.six{gap:14px}
.emirati-stage .compact-tile-grid>a{min-height:142px;padding:20px 18px;border-radius:11px;justify-content:flex-start}
.emirati-stage .compact-tile-grid svg{width:25px;height:25px;margin-bottom:7px}
.emirati-stage .compact-tile-grid strong{font-size:14px;font-weight:550}
.emirati-stage .compact-tile-grid small{font-size:11px;line-height:1.5}

/* Business and institution panels — match audience-card density */
.twin-panels{gap:18px;padding-top:14px;padding-bottom:36px}
.twin-panels article{min-height:206px;padding:28px;border-radius:12px;justify-content:flex-start}
.twin-panels h2{font-size:24px;font-weight:600;margin:7px 0 10px}
.twin-panels p{font-size:13px;line-height:1.6;margin-bottom:22px}

/* HOW TOWASAL WORKS — larger, unified tiles */
.how-compact{padding-top:38px;padding-bottom:38px}
.how-compact .section-heading{margin-bottom:18px}
.how-compact .section-heading h2{font-size:27px}
.how-compact .compact-tile-grid.four{gap:14px}
.how-compact .steps>div{min-height:158px;padding:19px 18px;border:1px solid var(--line);border-radius:11px;background:#fff}
.how-compact .steps>div>span{font-size:10px;color:#96a5b7;position:absolute;right:14px;top:12px}
.how-compact .steps svg{width:25px;height:25px;margin:4px 0 9px;color:var(--navy)}
.how-compact .steps strong{font-size:14px;font-weight:550}
.how-compact .steps small{font-size:11px;line-height:1.5}

/* MEMBERSHIP — same section scale and card weight as upper content */
.membership-compact{padding-top:38px;padding-bottom:40px}
.membership-compact .section-heading{margin-bottom:18px}
.membership-compact .section-heading h2{font-size:27px}
.membership-compact .plans{gap:14px}
.membership-compact .plans article{min-height:220px;padding:22px 20px;border-radius:11px}
.membership-compact .plans svg{width:24px;height:24px;margin-bottom:3px}
.membership-compact .plans strong{font-size:15px;font-weight:550}
.membership-compact .plans b{font-size:11px;margin-bottom:3px}
.membership-compact .plans small{font-size:11px;line-height:1.5}
.membership-compact .plans a{padding:9px 12px;font-size:11px}

/* AI section — match supplied reference: broader, stronger, integrated image */
.ai-banner{min-height:238px;margin-top:20px;margin-bottom:28px;padding:28px 30px;grid-template-columns:auto 1.05fr .9fr 1.08fr;gap:24px;border-radius:14px;background:linear-gradient(90deg,#eaf4ff 0%,#eef7ff 42%,#dceeff 72%,#eef7ff 100%);position:relative}
.sparkle{align-self:start;margin-top:22px}.sparkle svg{width:38px;height:38px;stroke-width:2}
.ai-copy h2{font-size:28px;font-weight:600;margin-bottom:8px}.ai-copy p{font-size:14px;line-height:1.55;margin-bottom:20px}
.ai-person{height:210px;align-self:end;border-radius:0;background:url('assets/ai_visual_custom.jpg') center center/cover no-repeat;box-shadow:none}
.ai-prompts{gap:10px}.ai-prompts button{min-height:40px;padding:10px 14px;font-size:12px;border-color:#d4e2f0;background:rgba(255,255,255,.96)}

/* TRUSTED ORGANIZATIONS — large logo strip like supplied reference */
.partners{padding-top:34px;padding-bottom:34px}
.partners .section-heading{margin-bottom:16px}.partners .section-heading h2{font-size:27px}
.partners .section-heading p{font-size:13px}
.partner-row{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.2fr 1.05fr 1fr 1.35fr;gap:24px;align-items:center;border-top:0;border-bottom:1px solid #edf1f5;padding:14px 0 24px}
.partner-row a{display:flex;justify-content:center;align-items:center;min-width:0;min-height:78px;background:#fff}
.partner-row img{width:100%;height:68px;max-width:190px;object-fit:contain;border-radius:0;background:#fff}
.partner-row a span{display:none}

/* Latest Updates + Community Says — equal tops, equal visual height */
.update-grid{grid-template-columns:1.28fr .72fr;gap:26px;padding-top:32px;padding-bottom:28px;align-items:stretch}
.update-grid>div{display:flex;flex-direction:column;min-width:0}
.update-grid>div>h2,.update-grid .section-heading.small{min-height:38px;margin:0 0 14px;align-items:center}
.update-grid .section-heading.small h2{font-size:27px}
.update-grid .dots{font-size:19px}
.news-grid{margin-top:0;flex:1;align-items:stretch}
.news-card{height:100%;min-height:244px;display:flex;flex-direction:column}
.news-image{height:126px}
.news-card h3{font-size:15px;font-weight:550;line-height:1.4;margin-right:12px}
.news-card small{margin-top:auto;padding-top:3px}
.testimonial{margin:0;flex:1;min-height:244px;height:100%;display:flex;flex-direction:column;justify-content:space-between;font-size:16px;line-height:1.55;padding:24px}
.testimonial footer{margin-top:22px}

/* keep added sections from feeling lighter than the original page */
.compact-tile-grid>a,.compact-tile-grid>div,.compact-tile-grid>article,.twin-panels article,.news-card,.testimonial{border-color:#d8e2ee}

@media(max-width:1100px){
  .partner-row{grid-template-columns:repeat(3,1fr)}
  .ai-banner{grid-template-columns:auto 1fr 1fr}.ai-prompts{grid-column:1/-1;grid-template-columns:1fr 1fr}.ai-person{height:190px}
}
@media(max-width:720px){
  .emirati-stage .compact-tile-grid.six,.how-compact .compact-tile-grid.four,.membership-compact .compact-tile-grid.four{grid-template-columns:1fr}
  .partner-row{grid-template-columns:1fr 1fr;gap:12px}.partner-row img{height:58px}
  .ai-banner{grid-template-columns:1fr}.sparkle{display:none}.ai-person{height:210px}.ai-prompts{grid-column:auto;grid-template-columns:1fr}
  .update-grid{grid-template-columns:1fr}.testimonial{min-height:210px}
}


/* FINAL GENERATED IMAGE INTEGRATION */
.hero-media{background-image:url('assets/residents_expats.jpg')!important;background-position:72% center!important;background-size:cover!important}
.residents-img{background-image:url('assets/residents_expats.jpg')!important;background-position:center center!important;background-size:cover!important}
.emirati-img{background-image:url('assets/emiratis.jpg')!important;background-position:center center!important;background-size:cover!important}
.ai-person{background-image:url('assets/ai_visual_custom.jpg')!important;background-position:center center!important;background-size:cover!important}
.e1{background-image:url('assets/event_career_fair.jpg')!important}.e2{background-image:url('assets/event_small_business.jpg')!important}.e3{background-image:url('assets/event_family_day.jpg')!important}.e4{background-image:url('assets/event_women_business.jpg')!important}
.n1{background-image:url('assets/update_visa_rules.jpg')!important}.n2{background-image:url('assets/update_schools.jpg')!important}.n3{background-image:url('assets/update_business_setup.jpg')!important}
.audience-card>div:first-child{display:flex!important;flex-direction:column!important;align-items:flex-start!important;height:100%!important}
.audience-card>div:first-child p{flex:1 1 auto!important}
.audience-card>div:first-child .btn{margin-top:auto!important}
.audience-card h2{min-height:64px!important}
@media(max-width:900px){.audience-card h2{min-height:auto!important}}


/* ===== V14: preserve original list design, align all three sections ===== */

.tri-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
  align-items:start;
}

.list-panel{
  min-width:0;
  display:flex;
  flex-direction:column;
}

.list-panel .section-heading.small{
  min-height:48px;
  margin-bottom:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.list-panel .section-heading.small h2{
  margin:0;
  line-height:1.2;
}

.simple-list,
.profile-list,
.event-list{
  display:flex;
  flex-direction:column;
  width:100%;
}

/* Keep the original flat-list appearance */
.simple-list>a,
.profile-list>a{
  min-height:68px;
  padding:10px 0;
  border-bottom:1px solid #ebeff5;
  align-items:center;
}

.event-list a{
  min-height:68px;
  margin-bottom:0;
  border:0;
  border-bottom:1px solid #ebeff5;
  border-radius:0;
  padding:7px 0;
  align-items:center;
}

/* Make rows line up visually across the three columns */
.simple-list>a,
.profile-list>a,
.event-list a{
  height:68px;
}

.event-thumb{
  width:78px;
  height:52px;
  border-radius:7px;
}

.profile-list .avatar{
  width:42px;
  height:42px;
}

.simple-list strong,
.profile-list strong,
.event-list strong{
  line-height:1.25;
}

.simple-list small,
.profile-list small,
.event-list small{
  line-height:1.35;
}

/* Prevent the last rows from creating different bottom spacing */
.simple-list>a:last-child,
.profile-list>a:last-child,
.event-list a:last-child{
  border-bottom:1px solid #ebeff5;
}

/* Align major sections to the same container rhythm */
.audience-section,
.section,
.ai-banner,
.partners,
.update-grid,
.cta-banner{
  scroll-margin-top:90px;
}

.section-heading,
.section-heading.compact,
.section-heading.small{
  width:100%;
}

@media(max-width:1100px){
  .tri-grid{
    grid-template-columns:1fr;
    gap:26px;
  }
  .list-panel .section-heading.small{
    min-height:auto;
  }
  .simple-list>a,
  .profile-list>a,
  .event-list a{
    height:auto;
    min-height:68px;
  }
}

/* V15 — fifth professional and event for equal column depth */
.e5{background-image:url('assets/event_startup_meetup.jpg')}


/* ===== V16 FINAL POLISH — preserve structure, unify visual rhythm ===== */

/* Hero: slightly calmer fade, stronger balance, wider search */
.hero-copy{padding:58px 0 42px}
.hero-overlay{
  background:linear-gradient(90deg,
    rgba(255,255,255,.96) 0%,
    rgba(255,255,255,.86) 34%,
    rgba(255,255,255,.34) 54%,
    rgba(255,255,255,.06) 72%,
    rgba(6,38,91,.05) 100%);
}
.hero-search{max-width:860px}
.hero h1{font-weight:600}
.hero p{line-height:1.58}

/* Audience cards: exact internal balance and aligned calls to action */
.audience-section{gap:20px}
.audience-card{min-height:212px;grid-template-columns:1fr 1fr}
.audience-card>div:first-child{padding:30px 30px 26px}
.audience-card h2{font-weight:600;line-height:1.16;margin-bottom:10px}
.audience-card p{font-size:14px;line-height:1.55;max-width:100%;margin-bottom:20px}
.audience-image{min-height:212px}

/* Services: more confident icons, slightly lighter text */
.service-grid{gap:13px}
.service-card{min-height:92px;padding:15px 16px}
.service-card strong{font-weight:500;line-height:1.35}
.service-icon{width:44px;height:44px;border-radius:11px}
.service-icon svg{width:20px;height:20px;stroke-width:1.7}

/* Languages: reduce empty gap and make the row feel substantial */
.language-section{padding-top:24px;padding-bottom:28px}
.language-grid{gap:11px}
.language-card{min-height:64px;padding:12px 14px;align-items:center}
.language-card b{font-weight:500}
.language-card small{line-height:1.2}

/* Opportunities / professionals / community: exact header baseline + equal row rhythm */
.tri-grid{padding-top:30px;padding-bottom:34px;gap:30px}
.list-panel .section-heading.small{
  min-height:50px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  column-gap:14px;
  margin-bottom:7px;
}
.list-panel .section-heading.small h2{
  font-size:22px;
  font-weight:600;
  line-height:1.15;
  padding-bottom:1px;
}
.list-panel .section-heading.small .text-link{
  align-self:end;
  padding-bottom:3px;
  white-space:nowrap;
}
.simple-list>a,.profile-list>a,.event-list a{
  height:70px;
  min-height:70px;
  border-bottom:1px solid #e9eef4;
}
.event-list a{padding:8px 0}
.event-thumb{width:80px;height:54px}
.profile-list .avatar{width:43px;height:43px}
.simple-list strong,.profile-list strong,.event-list strong{font-weight:500}
.simple-list small,.profile-list small,.event-list small{font-size:10px}

/* Emirati pathways: visually as important as upper service blocks */
.emirati-stage{padding-top:42px;padding-bottom:42px}
.emirati-stage .compact-tile-grid.six{gap:14px}
.emirati-stage .compact-tile-grid>a{
  min-height:154px;
  padding:21px 18px;
}
.emirati-stage .compact-tile-grid svg{
  width:27px;height:27px;margin-bottom:9px;stroke-width:1.7
}
.emirati-stage .compact-tile-grid strong{font-size:14px;font-weight:500}
.emirati-stage .compact-tile-grid small{font-size:11px}

/* Business & Institutions: same design language but with custom generated imagery */
.twin-panels{gap:20px;padding-top:10px;padding-bottom:40px}
.twin-panels article{
  position:relative;
  overflow:hidden;
  min-height:220px;
  padding:30px 47% 28px 28px;
  border-radius:12px;
  background-color:#fff;
  background-repeat:no-repeat;
  background-position:right center;
  background-size:44% auto;
}
.twin-panels article:first-child{background-image:linear-gradient(90deg,#fff 0%,#fff 55%,rgba(255,255,255,.15) 73%),url('assets/business_panel.jpg')}
.twin-panels article:last-child{background-image:linear-gradient(90deg,#fff 0%,#fff 55%,rgba(255,255,255,.15) 73%),url('assets/institutions_panel.jpg')}
.twin-panels h2{font-size:23px;font-weight:600}
.twin-panels p{font-size:12px;line-height:1.6}

/* How Towasal Works: clearer process hierarchy */
.how-compact{padding-top:40px;padding-bottom:42px}
.how-compact .steps>div{
  min-height:172px;
  padding:22px 19px 20px;
}
.how-compact .steps>div>span{
  width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;
  background:#edf4fb;color:var(--navy);
  font-size:10px;font-weight:600;
  top:14px;right:14px;
}
.how-compact .steps svg{width:27px;height:27px;margin:5px 0 12px;stroke-width:1.7}
.how-compact .steps strong{font-size:14px;font-weight:500}
.how-compact .steps small{font-size:11px}

/* Membership: clearer choice hierarchy without heavy blocks */
.membership-compact{padding-top:40px;padding-bottom:42px}
.membership-compact .plans article{
  position:relative;
  min-height:228px;
  padding:24px 20px 20px;
}
.membership-compact .plans strong{font-weight:500}
.membership-compact .plans .active{
  background:#f6f9fd;
  border:1px solid #9fb7d0;
}
.membership-compact .plans .active::before{
  content:"Recommended";
  position:absolute;
  top:13px;right:14px;
  font-size:9px;font-weight:600;
  color:#fff;background:var(--navy);
  border-radius:999px;padding:5px 9px;
}
.membership-compact .plans .active svg{margin-top:18px}

/* AI: larger human visual, more compact prompts, same reference-style banner */
.ai-banner{
  grid-template-columns:auto 1.05fr 1.05fr 1.02fr;
  min-height:250px;
  padding:26px 30px 0;
  gap:24px;
}
.ai-copy{padding-bottom:26px}
.ai-copy h2{font-size:27px;font-weight:600}
.ai-person{
  height:235px;
  align-self:end;
  background-size:cover!important;
  background-position:center 38%!important;
}
.ai-prompts{gap:8px;padding-bottom:26px}
.ai-prompts button{
  min-height:36px;
  padding:8px 13px;
  font-size:11px;
}

/* Partners: stronger institutional strip */
.partners{padding-top:36px;padding-bottom:36px}
.partner-row{
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:30px;
  padding:18px 4px 26px;
}
.partner-row a{min-height:88px}
.partner-row img{
  height:76px;
  max-width:205px;
  width:100%;
  object-fit:contain;
}

/* Latest updates + testimonial: exact top and height alignment */
.update-grid{
  grid-template-columns:1.30fr .70fr;
  gap:28px;
  padding-top:34px;
  padding-bottom:30px;
}
.update-grid>div>h2,
.update-grid .section-heading.small{
  height:42px;
  min-height:42px;
  margin:0 0 14px;
  display:flex;
  align-items:center;
}
.update-grid .section-heading.small{
  justify-content:space-between;
}
.news-grid{height:248px;align-items:stretch}
.news-card{min-height:248px;height:248px}
.news-image{height:128px}
.testimonial{
  min-height:248px;
  height:248px;
  padding:24px 25px;
  font-size:15px;
}

/* Footer/CTA remain the reference for the brand */
.cta-banner,.site-footer{background-color:var(--navy)}

@media(max-width:1100px){
  .twin-panels article{
    padding-right:28px;
    background-image:none!important;
  }
  .ai-banner{padding-bottom:22px}
}
@media(max-width:720px){
  .hero-copy{padding-top:46px}
  .audience-card{grid-template-columns:1fr}
  .audience-image{min-height:180px}
  .twin-panels article{min-height:auto}
  .news-grid{height:auto}
  .news-card,.testimonial{height:auto;min-height:220px}
}


/* ===== V17 refinement: tighter unified rhythm + true logo strip ===== */

/* Overall section cadence */
.section{padding-top:32px;padding-bottom:32px}
.audience-section{margin-top:20px}
.emirati-stage,
.how-compact,
.membership-compact{padding-top:34px;padding-bottom:34px}

/* Business / Institution: cleaner split layout with full generated images */
.twin-panels article{
  position:relative;
  overflow:hidden;
  padding:28px 46% 28px 28px;
  min-height:214px;
  background:#fff !important;
}
.twin-panels article::after{
  content:"";
  position:absolute;
  top:0;right:0;bottom:0;
  width:42%;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  border-left:1px solid #edf1f5;
}
.twin-panels article:first-child::after{
  background-image:url('assets/business_panel.jpg');
}
.twin-panels article:last-child::after{
  background-image:url('assets/institutions_panel.jpg');
}
.twin-panels article>*{
  position:relative;
  z-index:1;
}
.twin-panels h2{max-width:410px}
.twin-panels p{max-width:500px}

/* Keep process + membership visually compact and consistent */
.how-compact .steps>div{
  min-height:158px;
}
.membership-compact .plans article{
  min-height:214px;
}

/* AI banner: improve proportions and reduce cropping feel */
.ai-banner{
  min-height:244px;
  grid-template-columns:auto 1.08fr 1.12fr 1fr;
}
.ai-person{
  height:230px;
  background-size:cover!important;
  background-position:center 35%!important;
}
.ai-prompts button{
  min-height:35px;
}

/* Trusted organizations: actual logos, large, centered, equal optical weight */
.partners{
  padding-top:34px;
  padding-bottom:34px;
}
.partner-row{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:18px;
  align-items:center;
  padding:16px 0 22px;
  border-top:1px solid #eef2f6;
  border-bottom:1px solid #eef2f6;
}
.partner-row a{
  min-height:104px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 10px;
  background:#fff;
  border:0;
}
.partner-row img{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:74px;
  object-fit:contain;
}
.partner-row a:nth-child(1) img{max-width:180px}
.partner-row a:nth-child(2) img{max-width:150px}
.partner-row a:nth-child(3) img{max-width:170px}
.partner-row a:nth-child(4) img{max-width:180px}
.partner-row a:nth-child(5) img{max-width:150px}
.partner-row a:nth-child(6) img{max-width:150px}
.partner-row a:nth-child(7) img{max-width:190px}
.partner-row a span{display:none}

/* Latest Updates + Community Says: cleaner equal box footprint */
.update-grid{
  align-items:start;
}
.update-grid>div{
  min-width:0;
}
.news-grid{
  height:252px;
}
.news-card,
.testimonial{
  height:252px;
  min-height:252px;
}
.testimonial{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

/* Reduce overly-large vertical dead zones between lower sections */
.twin-panels + .how-compact{padding-top:26px}
.how-compact + .membership-compact{padding-top:28px}
.membership-compact + .ai-banner{margin-top:10px}

/* Maintain responsive behavior */
@media(max-width:1100px){
  .partner-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .twin-panels article{
    padding-right:28px;
    min-height:190px;
  }
  .twin-panels article::after{display:none}
}
@media(max-width:720px){
  .partner-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .partner-row a{min-height:88px}
  .partner-row img{max-height:58px}
  .news-grid{height:auto}
  .news-card,.testimonial{height:auto;min-height:220px}
}


/* ===== V18: improve AI visual + partner logos ===== */

/* AI banner image: show the portrait nicely inside the wide banner */
.ai-banner{
  grid-template-columns:auto 1.02fr .86fr 1.08fr !important;
  min-height:246px !important;
  gap:24px !important;
  padding:26px 30px !important;
}
.ai-copy{
  align-self:center;
}
.ai-copy h2{
  margin-bottom:10px;
}
.ai-copy p{
  max-width:520px;
  line-height:1.55;
}
.ai-person{
  height:228px !important;
  align-self:center !important;
  background-color:transparent !important;
  background-image:url('assets/ai_visual_custom.jpg') !important;
  background-repeat:no-repeat !important;
  background-size:contain !important;
  background-position:center bottom !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.ai-prompts{
  align-self:center;
}
.ai-prompts button{
  min-height:38px !important;
  padding:9px 14px !important;
}

/* Trusted organizations: use the logo artwork cleanly, no circles/crops */
.partner-row{
  display:grid !important;
  grid-template-columns:1.15fr .95fr 1.05fr 1.1fr 1.05fr .95fr 1.25fr !important;
  gap:20px !important;
  align-items:center !important;
  padding:18px 0 26px !important;
  border-top:1px solid #eef2f6 !important;
  border-bottom:1px solid #eef2f6 !important;
}
.partner-row a{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:96px !important;
  padding:10px 8px !important;
  background:#fff !important;
}
.partner-row img{
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:62px !important;
  object-fit:contain !important;
  border-radius:0 !important;
  background:transparent !important;
}
.partner-row a span{
  display:none !important;
}

/* Fine-tune specific partner logo optical sizes */
.partner-row a:nth-child(1) img{max-height:60px !important;}
.partner-row a:nth-child(2) img{max-height:50px !important;}
.partner-row a:nth-child(3) img{max-height:56px !important;}
.partner-row a:nth-child(4) img{max-height:54px !important;}
.partner-row a:nth-child(5) img{max-height:56px !important;}
.partner-row a:nth-child(6) img{max-height:46px !important;}
.partner-row a:nth-child(7) img{max-height:58px !important;}

@media (max-width:1100px){
  .ai-banner{
    grid-template-columns:auto 1fr 1fr !important;
  }
  .ai-prompts{
    grid-column:1 / -1;
  }
  .partner-row{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}
@media (max-width:720px){
  .ai-banner{
    grid-template-columns:1fr !important;
    padding:22px 18px !important;
  }
  .sparkle{display:none !important;}
  .ai-person{
    height:220px !important;
  }
  .partner-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
  }
  .partner-row a{
    min-height:82px !important;
  }
  .partner-row img{
    max-height:46px !important;
  }
}


/* ===== V19: transparent AI image + cleaner actual logo strip ===== */

/* AI section rebuilt around a transparent cutout image */
.ai-banner{
  grid-template-columns:auto 1.02fr .92fr 1.06fr !important;
  align-items:center !important;
  min-height:260px !important;
  padding:26px 28px !important;
  gap:26px !important;
  background:linear-gradient(90deg,#eef6ff 0%,#e8f2fd 46%,#edf6ff 100%) !important;
  border-radius:16px !important;
}
.ai-copy{
  align-self:center !important;
}
.ai-copy h2{
  font-size:28px !important;
  line-height:1.15 !important;
  margin:0 0 10px !important;
}
.ai-copy p{
  margin:0 0 18px !important;
  line-height:1.55 !important;
  max-width:500px !important;
}
.ai-person{
  height:230px !important;
  align-self:end !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:
    url('assets/ai_person_transparent.png') center bottom / contain no-repeat !important;
}
.ai-prompts{
  gap:9px !important;
  align-self:center !important;
}
.ai-prompts button{
  min-height:38px !important;
  padding:9px 14px !important;
  font-size:11px !important;
  background:#ffffff !important;
  border:1px solid #d7e3f1 !important;
  border-radius:999px !important;
}

/* Trusted organizations — display the actual logo artwork more clearly */
.partners{
  padding-top:34px !important;
  padding-bottom:28px !important;
}
.partner-row{
  display:grid !important;
  grid-template-columns:1.15fr .95fr 1.05fr 1.12fr 1.08fr .95fr 1.28fr !important;
  gap:16px !important;
  align-items:center !important;
  border-top:1px solid #eef2f6 !important;
  border-bottom:1px solid #eef2f6 !important;
  padding:18px 0 20px !important;
}
.partner-row a{
  min-height:86px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px 8px !important;
  background:#fff !important;
}
.partner-row a span{
  display:none !important;
}
.partner-row img{
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:58px !important;
  object-fit:contain !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Slight optical size tweaks so logos don't all feel identical */
.partner-row a:nth-child(1) img{max-height:56px !important;}
.partner-row a:nth-child(2) img{max-height:45px !important;}
.partner-row a:nth-child(3) img{max-height:54px !important;}
.partner-row a:nth-child(4) img{max-height:52px !important;}
.partner-row a:nth-child(5) img{max-height:54px !important;}
.partner-row a:nth-child(6) img{max-height:44px !important;}
.partner-row a:nth-child(7) img{max-height:56px !important;}

@media (max-width:1100px){
  .ai-banner{
    grid-template-columns:auto 1fr 1fr !important;
  }
  .ai-prompts{
    grid-column:1 / -1 !important;
    grid-template-columns:1fr 1fr !important;
  }
  .partner-row{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}
@media (max-width:720px){
  .ai-banner{
    grid-template-columns:1fr !important;
    padding:22px 18px !important;
    min-height:auto !important;
  }
  .sparkle{
    display:none !important;
  }
  .ai-person{
    height:220px !important;
    align-self:center !important;
  }
  .ai-prompts{
    grid-column:auto !important;
    grid-template-columns:1fr !important;
  }
  .partner-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
  }
  .partner-row a{
    min-height:78px !important;
  }
  .partner-row img{
    max-height:42px !important;
  }
}


/* ===== V20: enlarged transparent AI cutout + trimmed official logo artwork ===== */
.ai-banner{
  grid-template-columns:auto 1.02fr 1.02fr 1.08fr !important;
  min-height:270px !important;
  padding:24px 30px 0 !important;
  gap:24px !important;
}
.ai-copy{padding-bottom:24px !important}
.ai-person{
  height:262px !important;
  align-self:end !important;
  background-image:url('assets/ai_person_transparent_trimmed.png') !important;
  background-repeat:no-repeat !important;
  background-size:auto 116% !important;
  background-position:center bottom !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.ai-prompts{
  align-self:center !important;
  padding-bottom:22px !important;
}
.ai-prompts button{
  min-height:39px !important;
  padding:9px 14px !important;
  font-size:11px !important;
}

/* Partner logos: use trimmed official artwork so each mark is visibly larger. */
.partner-row{
  grid-template-columns:1.15fr .92fr 1.05fr 1.08fr 1fr .92fr 1.25fr !important;
  gap:24px !important;
  align-items:center !important;
  padding:20px 0 24px !important;
}
.partner-row a{
  min-height:92px !important;
  padding:7px 6px !important;
}
.partner-row img{
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:64px !important;
  object-fit:contain !important;
  border-radius:0 !important;
  background:transparent !important;
}
.partner-row a:nth-child(1) img{max-height:64px !important;}
.partner-row a:nth-child(2) img{max-height:54px !important;}
.partner-row a:nth-child(3) img{max-height:62px !important;}
.partner-row a:nth-child(4) img{max-height:56px !important;}
.partner-row a:nth-child(5) img{max-height:60px !important;}
.partner-row a:nth-child(6) img{max-height:52px !important;}
.partner-row a:nth-child(7) img{max-height:58px !important;}

@media(max-width:1100px){
  .ai-banner{grid-template-columns:auto 1fr 1.08fr !important;padding-bottom:20px !important;}
  .ai-prompts{grid-column:1/-1 !important;grid-template-columns:1fr 1fr !important;padding-bottom:0 !important;}
  .partner-row{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media(max-width:720px){
  .ai-banner{grid-template-columns:1fr !important;padding:20px 18px !important;}
  .ai-person{height:250px !important;background-size:auto 112% !important;}
  .ai-prompts{grid-column:auto !important;grid-template-columns:1fr !important;}
  .partner-row{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important;}
  .partner-row img{max-height:48px !important;}
}


/* ===== V21: wide transparent AI figure + verified organization logo presentation ===== */

/* AI assistant — use the transparent image as a real element, not as a background */
.ai-banner{
  grid-template-columns:auto 1.02fr 1.15fr 1.08fr !important;
  min-height:272px !important;
  padding:26px 30px 0 !important;
  gap:22px !important;
  align-items:center !important;
  overflow:hidden !important;
}
.ai-copy{
  padding-bottom:28px !important;
}
.ai-copy h2{
  font-size:29px !important;
  line-height:1.12 !important;
}
.ai-copy p{
  font-size:13px !important;
  line-height:1.55 !important;
  max-width:520px !important;
}
.ai-person{
  height:272px !important;
  align-self:end !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  background:none !important;
  overflow:visible !important;
  border-radius:0 !important;
}
.ai-person img{
  display:block !important;
  width:118% !important;
  max-width:none !important;
  height:282px !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  transform:translateY(10px) !important;
}
.ai-prompts{
  align-self:center !important;
  padding-bottom:28px !important;
}
.ai-prompts button{
  min-height:39px !important;
  padding:9px 14px !important;
  font-size:11px !important;
}

/* Trusted Organizations — do not crop the marks; give every organization its own proper lockup space */
.partner-row{
  display:grid !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
  border-top:1px solid #eef2f6 !important;
  border-bottom:1px solid #eef2f6 !important;
  padding:18px 0 22px !important;
}
.partner-row .partner-item{
  min-width:0 !important;
  min-height:118px !important;
  padding:12px 10px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  background:#fff !important;
  border:0 !important;
  text-align:center !important;
}
.partner-logo-box{
  width:100% !important;
  height:66px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.partner-logo-box img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:62px !important;
  object-fit:contain !important;
  object-position:center !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.partner-item span{
  display:block !important;
  font-size:10px !important;
  line-height:1.25 !important;
  color:#40566d !important;
  font-weight:500 !important;
}

/* Optical balancing only — no cropping */
.partner-item:nth-child(1) .partner-logo-box img{max-height:58px !important;}
.partner-item:nth-child(2) .partner-logo-box img{max-height:44px !important;}
.partner-item:nth-child(3) .partner-logo-box img{max-height:52px !important;}
.partner-item:nth-child(4) .partner-logo-box img{max-height:52px !important;}
.partner-item:nth-child(5) .partner-logo-box img{max-height:50px !important;}
.partner-item:nth-child(6) .partner-logo-box img{max-height:44px !important;}
.partner-item:nth-child(7) .partner-logo-box img{max-height:58px !important;}

@media(max-width:1100px){
  .ai-banner{
    grid-template-columns:auto 1fr 1.08fr !important;
    padding-bottom:20px !important;
  }
  .ai-prompts{
    grid-column:1/-1 !important;
    grid-template-columns:1fr 1fr !important;
    padding-bottom:0 !important;
  }
  .partner-row{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}
@media(max-width:720px){
  .ai-banner{
    grid-template-columns:1fr !important;
    padding:22px 18px 0 !important;
  }
  .sparkle{display:none !important;}
  .ai-person{
    height:245px !important;
  }
  .ai-person img{
    height:250px !important;
    width:110% !important;
  }
  .ai-prompts{
    grid-column:auto !important;
    grid-template-columns:1fr !important;
    padding-bottom:20px !important;
  }
  .partner-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}


/* ===== Complete Towasal PWA / multi-page system ===== */
:root{--appbar:64px;--bottomnav:74px;--navy:#06265b;--ink:#102b4a;--muted:#687b90;--line:#dce5ef;--soft:#f5f8fb;--blue-soft:#edf5fd}
.main-nav a.active{color:var(--navy);font-weight:700}
.page-main{min-height:70vh}.page-hero{padding:46px 0 30px;background:linear-gradient(180deg,#f3f7fb,#fff);border-bottom:1px solid #edf1f5}.page-hero h1{font-size:40px;line-height:1.05;margin:7px 0 10px;font-weight:600;letter-spacing:-.025em}.page-hero p{max-width:720px;color:var(--muted);margin:0;font-size:14px}.page-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.content-shell{padding:28px 0 48px}.two-col{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,.8fr);gap:24px}.three-col-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.four-col-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.app-card{border:1px solid var(--line);background:#fff;border-radius:12px;padding:18px}.app-card h3{font-size:17px;margin:0 0 7px;font-weight:600}.app-card p{font-size:12px;color:var(--muted);margin:0}.card-link{display:block}.card-link:hover{border-color:#bfcddd}.icon-tile{width:42px;height:42px;border-radius:10px;background:var(--blue-soft);display:grid;place-items:center;color:var(--navy);margin-bottom:12px}.icon-tile svg{width:20px}.filter-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:18px 0}.filter-chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 12px;font-size:11px;color:#496078}.filter-chip.active{background:var(--navy);color:#fff;border-color:var(--navy)}.result-list{display:grid;gap:12px}.result-card{border:1px solid var(--line);border-radius:12px;background:#fff;padding:16px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center}.result-card:hover{border-color:#b9cadb}.result-card .thumb{width:70px;height:70px;border-radius:10px;background-size:cover;background-position:center}.result-card .round{border-radius:50%}.result-card h3{font-size:15px;margin:0 0 4px;font-weight:600}.result-card p,.result-card small{display:block;margin:0;color:var(--muted);font-size:11px}.result-card .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:7px}.tag{display:inline-flex;padding:5px 8px;border-radius:999px;background:#f1f5f9;color:#5b6f82;font-size:9px}.detail-hero{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:center}.detail-hero .visual{min-height:260px;border-radius:14px;background-size:cover;background-position:center}.detail-title h1{font-size:36px;margin:6px 0 10px;line-height:1.08;font-weight:600}.detail-title p{color:var(--muted);font-size:14px}.info-row{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;color:#62778c;font-size:12px}.side-panel{position:sticky;top:90px}.side-panel .btn{width:100%;margin-top:9px}.section-title{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:30px 0 14px}.section-title h2{font-size:23px;margin:0;font-weight:600}.section-title p{font-size:12px;color:var(--muted);margin:4px 0 0}.timeline{display:grid;gap:0}.timeline-step{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:0 0 22px;position:relative}.timeline-step:not(:last-child):before{content:"";position:absolute;left:16px;top:32px;bottom:0;width:1px;background:#dbe4ee}.timeline-step .num{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:11px}.timeline-step h3{font-size:14px;margin:4px 0 4px}.timeline-step p{font-size:11px;color:var(--muted);margin:0}.profile-cover{height:180px;border-radius:14px;background:linear-gradient(110deg,#dfeeff,#f8fbff);position:relative;overflow:hidden}.profile-head{display:flex;gap:18px;align-items:flex-end;margin-top:-52px;padding:0 18px;position:relative}.profile-head .avatar-large{width:104px;height:104px;border:5px solid #fff;border-radius:50%;background-size:cover;background-position:center}.profile-head h1{font-size:28px;margin:0 0 4px}.rating{color:#e4a100}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.stat{border:1px solid var(--line);border-radius:10px;padding:15px}.stat strong{display:block;font-size:20px}.stat span{font-size:10px;color:var(--muted)}.dashboard-layout{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 76px)}.dash-sidebar{border-right:1px solid var(--line);padding:26px 14px;background:#fbfcfe}.dash-sidebar a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:8px;font-size:12px;color:#50667d}.dash-sidebar a.active,.dash-sidebar a:hover{background:#eaf2fb;color:var(--navy)}.dash-content{padding:30px}.dash-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.dash-top h1{font-size:28px;margin:0}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.metric-card{border:1px solid var(--line);border-radius:12px;padding:18px;background:#fff}.metric-card strong{display:block;font-size:26px;margin-top:8px}.metric-card span{font-size:10px;color:var(--muted)}.table-card{margin-top:18px;border:1px solid var(--line);border-radius:12px;overflow:hidden}.table-row{display:grid;grid-template-columns:1.5fr .8fr .8fr auto;gap:12px;padding:13px 16px;border-bottom:1px solid #eef2f6;align-items:center;font-size:11px}.table-row.header{background:#f7f9fc;color:#66798b;font-size:9px;text-transform:uppercase;letter-spacing:.08em}.table-row:last-child{border-bottom:0}.auth-layout{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.auth-visual{background:linear-gradient(150deg,rgba(6,38,91,.9),rgba(6,38,91,.5)),url('assets/residents_expats.jpg') center/cover;color:#fff;padding:54px;display:flex;flex-direction:column;justify-content:flex-end}.auth-visual h1{font-size:42px;max-width:540px;margin:0 0 14px}.auth-form-wrap{display:grid;place-items:center;padding:40px}.auth-card{width:min(460px,100%)}.auth-card h1{font-size:28px;margin:0 0 8px}.auth-card>p{color:var(--muted);font-size:12px;margin-bottom:24px}.field{display:grid;gap:6px;margin-bottom:14px}.field label{font-size:11px;font-weight:600}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:12px 13px;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:#8caac8}.auth-card .btn{width:100%}.divider{display:flex;align-items:center;gap:10px;color:#8796a6;font-size:10px;margin:18px 0}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice-card{border:1px solid var(--line);border-radius:10px;padding:14px;cursor:pointer}.choice-card.active{border-color:var(--navy);background:#f2f7fc}.chat-shell{height:calc(100vh - 77px);display:grid;grid-template-columns:260px 1fr}.chat-sidebar{border-right:1px solid var(--line);padding:18px;background:#fbfcfe}.chat-main{display:flex;flex-direction:column}.chat-head{padding:16px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.chat-messages{flex:1;padding:28px;overflow:auto;display:grid;align-content:start;gap:16px;background:#f9fbfd}.bubble{max-width:720px;padding:13px 15px;border-radius:12px;font-size:13px;line-height:1.55}.bubble.user{justify-self:end;background:var(--navy);color:#fff}.bubble.ai{background:#fff;border:1px solid var(--line)}.chat-composer{padding:14px 22px;border-top:1px solid var(--line);display:flex;gap:10px}.chat-composer input{flex:1;border:1px solid var(--line);border-radius:10px;padding:12px}.empty-state{text-align:center;padding:60px 20px}.empty-state .icon-tile{margin:0 auto 14px}.mobile-appbar,.mobile-bottom-nav{display:none}.mobile-only{display:none}.desktop-only{display:block}.mobile-search{display:none}

@media(max-width:900px){
  body{padding-bottom:calc(var(--bottomnav) + env(safe-area-inset-bottom));background:#f8fafc}.site-header{display:none}.site-footer{display:none}.mobile-appbar{position:sticky;top:0;z-index:60;height:var(--appbar);display:grid;grid-template-columns:44px 1fr 44px;align-items:center;padding:env(safe-area-inset-top) 14px 0;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.mobile-appbar>strong{text-align:center;font-size:16px}.mobile-icon-btn{width:38px;height:38px;border-radius:10px;display:grid;place-items:center}.mobile-icon-btn svg{width:20px}.mobile-bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;z-index:70;background:rgba(255,255,255,.98);border-top:1px solid var(--line);padding:7px 6px calc(8px + env(safe-area-inset-bottom));min-height:var(--bottomnav);box-shadow:0 -4px 20px rgba(6,38,91,.05)}.mobile-bottom-nav a{display:grid;place-items:center;gap:3px;color:#728397;font-size:9px}.mobile-bottom-nav a svg{width:21px;height:21px}.mobile-bottom-nav a.active{color:var(--navy)}.page-main{min-height:calc(100vh - var(--appbar) - var(--bottomnav))}.container{width:min(100% - 28px,var(--max))}.page-hero{padding:22px 0 18px;background:#fff}.page-hero h1{font-size:28px}.page-hero p{font-size:12px}.content-shell{padding:16px 0 28px}.two-col,.detail-hero,.dashboard-layout,.auth-layout,.chat-shell{grid-template-columns:1fr}.three-col-cards{grid-template-columns:1fr}.four-col-cards,.metric-grid,.stat-grid{grid-template-columns:1fr 1fr}.result-card{grid-template-columns:auto 1fr auto;padding:12px}.result-card .thumb{width:58px;height:58px}.detail-hero .visual{min-height:200px;grid-row:1}.detail-title h1{font-size:28px}.side-panel{position:static}.dashboard-layout{display:block}.dash-sidebar{display:none}.dash-content{padding:18px 14px}.dash-top h1{font-size:23px}.metric-card strong{font-size:22px}.table-row{grid-template-columns:1fr auto}.table-row>*:nth-child(2),.table-row>*:nth-child(3){display:none}.auth-layout{min-height:calc(100vh - var(--appbar))}.auth-visual{display:none}.auth-form-wrap{padding:22px 18px;align-items:start}.chat-shell{height:calc(100vh - var(--appbar) - var(--bottomnav))}.chat-sidebar{display:none}.chat-messages{padding:18px 14px}.chat-composer{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}.mobile-only{display:block}.desktop-only{display:none}.filter-bar{overflow-x:auto;flex-wrap:nowrap;padding-bottom:5px}.filter-chip{white-space:nowrap}.section-title{align-items:flex-start}.profile-cover{height:130px}.profile-head{margin-top:-42px;padding:0 10px}.profile-head .avatar-large{width:84px;height:84px}.profile-head h1{font-size:23px}.choice-grid{grid-template-columns:1fr}.app-card{border-radius:11px}.page-actions .btn{flex:1}.mobile-search{display:flex;gap:8px;margin:12px 0}.mobile-search input{flex:1;border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:#fff}.mobile-search button{width:42px;border:0;border-radius:10px;background:var(--navy);color:#fff}}


/* ===== FINAL MOBILE APP UX — v2 ===== */
@media (max-width:720px){
  :root{--appbar:58px;--bottomnav:68px;--mobile-pad:16px}
  html{background:#f4f7fb}
  body{background:#f4f7fb!important;padding-bottom:calc(var(--bottomnav) + env(safe-area-inset-bottom))!important;color:#102b4a!important}
  body,.app-page{font-size:14px!important}
  .site-header,.site-footer{display:none!important}
  .mobile-appbar{display:grid!important;position:sticky!important;top:0!important;z-index:90!important;height:calc(var(--appbar) + env(safe-area-inset-top))!important;padding:env(safe-area-inset-top) 14px 0!important;grid-template-columns:42px 1fr 42px!important;align-items:center!important;background:rgba(255,255,255,.98)!important;border-bottom:1px solid #e5ebf2!important;backdrop-filter:blur(14px)!important}
  .mobile-homebar{grid-template-columns:1fr auto!important}
  .mobile-brand{display:flex!important;align-items:center!important;gap:9px!important;font-size:16px!important;font-weight:600!important;color:var(--navy)!important}
  .mobile-brand-mark{width:22px;height:22px;display:block;background:linear-gradient(135deg,var(--navy) 0 42%,transparent 42% 49%,var(--navy) 49% 68%,transparent 68% 75%,var(--navy) 75%);transform:skewY(-13deg);border-radius:2px}
  .mobile-home-actions{display:flex;gap:4px}
  .mobile-icon-btn{width:38px!important;height:38px!important;border-radius:10px!important;display:grid!important;place-items:center!important;color:#29445f!important}
  .mobile-icon-btn svg{width:19px!important;height:19px!important}
  .mobile-bottom-nav{display:grid!important;grid-template-columns:repeat(5,1fr)!important;position:fixed!important;bottom:0!important;left:0!important;right:0!important;z-index:100!important;background:rgba(255,255,255,.98)!important;border-top:1px solid #dde5ee!important;padding:7px 5px calc(7px + env(safe-area-inset-bottom))!important;min-height:var(--bottomnav)!important;box-shadow:0 -8px 25px rgba(6,38,91,.06)!important}
  .mobile-bottom-nav a{display:grid!important;place-items:center!important;gap:2px!important;color:#7a8b9d!important;font-size:10px!important;font-weight:500!important}
  .mobile-bottom-nav a svg{width:20px!important;height:20px!important}
  .mobile-bottom-nav a.active{color:var(--navy)!important}
  .container{width:calc(100% - 28px)!important;max-width:none!important;margin-left:14px!important;margin-right:14px!important}
  main{overflow:hidden}

  /* Home hero becomes an app hero card */
  .hero{min-height:0!important;height:auto!important;background:transparent!important;margin:12px 0 0!important;overflow:visible!important}
  .hero-media{position:absolute!important;inset:0 14px!important;border-radius:18px!important;background-position:68% center!important;filter:saturate(.9)!important;overflow:hidden!important}
  .hero-overlay{position:absolute!important;inset:0 14px!important;border-radius:18px!important;background:linear-gradient(90deg,rgba(7,30,68,.92) 0%,rgba(7,30,68,.78) 47%,rgba(7,30,68,.15) 78%,rgba(7,30,68,.06) 100%)!important}
  .hero-grid{min-height:360px!important;display:flex!important;align-items:flex-end!important;padding:0!important;position:relative!important}
  .hero-copy{width:100%!important;max-width:none!important;padding:26px 20px 18px!important;color:#fff!important}
  .hero-copy .eyebrow{font-size:9px!important;letter-spacing:.14em!important;color:#dce8f5!important;margin-bottom:8px!important}
  .hero h1{font-size:34px!important;line-height:.98!important;letter-spacing:-.04em!important;color:#fff!important;margin:0 0 10px!important;max-width:310px!important;font-weight:600!important}
  .hero h1 em{color:#fff!important;font-weight:500!important}
  .hero p{font-size:12px!important;line-height:1.45!important;color:#edf4fb!important;margin:0 0 14px!important;max-width:300px!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .hero-search{max-width:none!important;width:100%!important;border:0!important;border-radius:12px!important;padding:4px!important;box-shadow:0 6px 18px rgba(0,0,0,.12)!important;background:#fff!important}
  .hero-search input{font-size:12px!important;padding:10px 4px!important}
  .hero-search .btn{min-height:38px!important;padding:0 14px!important;font-size:11px!important;border-radius:9px!important}
  .search-icon{margin:0 8px!important;color:#5c7186!important}.search-icon svg{width:16px!important;height:16px!important}
  .popular-row{display:none!important}

  /* Audience cards swipe horizontally like an app */
  .audience-section{display:flex!important;gap:12px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;margin-top:14px!important;padding-bottom:2px!important;width:auto!important;margin-left:14px!important;margin-right:0!important;-webkit-overflow-scrolling:touch}
  .audience-section::-webkit-scrollbar{display:none}
  .audience-card{flex:0 0 86%!important;display:grid!important;grid-template-columns:1fr!important;min-height:0!important;border-radius:16px!important;box-shadow:none!important;scroll-snap-align:start!important;overflow:hidden!important;background:#fff!important}
  .audience-image{grid-row:1!important;height:155px!important;min-height:155px!important}
  .audience-card>div:first-child{grid-row:2!important;padding:16px!important;display:flex!important;flex-direction:column!important;min-height:174px!important}
  .audience-card h2{font-size:20px!important;line-height:1.12!important;min-height:auto!important;margin:0 0 6px!important;font-weight:600!important}
  .audience-card p{font-size:12px!important;line-height:1.45!important;margin:0 0 14px!important;color:#65778a!important}
  .audience-card .btn{margin-top:auto!important;min-height:40px!important;padding:0 14px!important;font-size:11px!important;width:max-content!important}

  /* Every home section has a compact app heading */
  .section{padding:26px 0!important}
  .section-heading,.section-heading.compact,.section-heading.small{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:12px!important;margin-bottom:12px!important;min-height:0!important}
  .section-heading>div{min-width:0}
  .section-heading h2,.section>h2,.update-grid h2{font-size:21px!important;line-height:1.15!important;font-weight:600!important;margin:0!important}
  .section-heading p{font-size:11px!important;line-height:1.4!important;margin-top:4px!important}
  .eyebrow{font-size:8px!important;letter-spacing:.14em!important;margin-bottom:6px!important}
  .text-link{font-size:10px!important;white-space:nowrap!important}
  .muted-text{font-size:9px!important}

  /* Services: real 2-column app grid */
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .service-card{min-height:104px!important;border-radius:14px!important;padding:13px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;gap:8px!important;background:#fff!important}
  .service-card>span:last-child{display:none!important}
  .service-card strong{font-size:12px!important;line-height:1.3!important;font-weight:500!important}
  .service-icon{width:36px!important;height:36px!important;border-radius:10px!important;background:#eef4fa!important;color:var(--navy)!important}
  .service-icon svg{width:18px!important;height:18px!important}

  /* Languages become horizontal selectable chips */
  .language-section{padding-top:14px!important;padding-bottom:22px!important}
  .language-grid{display:flex!important;gap:8px!important;overflow-x:auto!important;padding-bottom:4px!important;scroll-snap-type:x proximity!important}
  .language-grid::-webkit-scrollbar{display:none}
  .language-card{flex:0 0 128px!important;min-height:56px!important;border-radius:12px!important;padding:9px 10px!important;grid-template-columns:auto 1fr!important;scroll-snap-align:start!important}
  .language-card>span{font-size:20px!important}.language-card b{font-size:11px!important}.language-card small{font-size:9px!important}

  /* Home discovery lists: one app block at a time, only 3 previews */
  .tri-grid{display:block!important;padding-top:18px!important;padding-bottom:20px!important}
  .list-panel{margin-bottom:24px!important}
  .list-panel .section-heading.small{display:flex!important;min-height:0!important;margin-bottom:8px!important}
  .list-panel .section-heading.small h2{font-size:20px!important}
  .simple-list>a,.profile-list>a,.event-list a{height:auto!important;min-height:64px!important;padding:9px 0!important}
  .simple-list>a:nth-child(n+4),.profile-list>a:nth-child(n+4),.event-list>a:nth-child(n+4){display:none!important}
  .simple-list strong,.profile-list strong,.event-list strong{font-size:12px!important}
  .simple-list small,.profile-list small,.event-list small{font-size:10px!important}
  .mini-icon{width:38px!important;height:38px!important}.profile-list .avatar{width:40px!important;height:40px!important}
  .event-list a{grid-template-columns:72px 1fr!important}.event-thumb{width:72px!important;height:52px!important}

  /* Emirati pathways become a horizontal app carousel */
  .emirati-stage{padding-top:24px!important;padding-bottom:24px!important}
  .emirati-stage .compact-tile-grid.six{display:flex!important;gap:10px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;padding-bottom:4px!important}
  .emirati-stage .compact-tile-grid.six::-webkit-scrollbar{display:none}
  .emirati-stage .compact-tile-grid.six>a{flex:0 0 170px!important;min-height:134px!important;padding:16px!important;scroll-snap-align:start!important;border-radius:14px!important}
  .emirati-stage .compact-tile-grid svg{width:22px!important;height:22px!important}
  .emirati-stage .compact-tile-grid strong{font-size:12px!important}.emirati-stage .compact-tile-grid small{font-size:10px!important}

  /* Business and institution cards */
  .twin-panels{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;padding-top:10px!important;padding-bottom:24px!important}
  .twin-panels article{min-height:190px!important;padding:18px 48% 18px 16px!important;border-radius:15px!important;background:#fff!important}
  .twin-panels article::after{display:block!important;width:46%!important}
  .twin-panels h2{font-size:18px!important;line-height:1.2!important}.twin-panels p{font-size:10px!important;line-height:1.45!important}.twin-panels .btn{min-height:38px!important;font-size:10px!important;padding:0 12px!important}

  /* How it works: 2x2, not one giant vertical list */
  .how-compact{padding:24px 0!important}
  .how-compact .compact-tile-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .how-compact .steps>div{min-height:142px!important;padding:15px!important;border-radius:14px!important}
  .how-compact .steps>div>span{width:25px!important;height:25px!important;font-size:9px!important}.how-compact .steps svg{width:21px!important;height:21px!important;margin-top:5px!important}.how-compact .steps strong{font-size:12px!important}.how-compact .steps small{font-size:9px!important}

  /* Membership becomes swipe cards */
  .membership-compact{padding:24px 0!important}
  .membership-compact .compact-tile-grid.four{display:flex!important;gap:10px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;padding:2px 0 5px!important}
  .membership-compact .compact-tile-grid.four::-webkit-scrollbar{display:none}
  .membership-compact .plans article{flex:0 0 76%!important;min-height:205px!important;padding:18px!important;scroll-snap-align:start!important;border-radius:14px!important}
  .membership-compact .plans strong{font-size:14px!important}.membership-compact .plans small{font-size:10px!important}.membership-compact .plans a{font-size:10px!important}

  /* AI becomes a compact app promo card */
  .ai-banner{display:grid!important;grid-template-columns:1fr 112px!important;min-height:178px!important;margin:8px 14px 20px!important;width:auto!important;padding:18px 14px 0!important;border-radius:16px!important;gap:6px!important;overflow:hidden!important}
  .sparkle{display:none!important}.ai-copy{padding:0 0 16px!important;align-self:center!important}.ai-copy h2{font-size:19px!important;line-height:1.15!important;margin-bottom:7px!important}.ai-copy p{font-size:10px!important;line-height:1.4!important;margin-bottom:12px!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.ai-copy .btn{min-height:38px!important;font-size:10px!important;padding:0 13px!important}.ai-person{display:flex!important;height:174px!important;grid-column:2!important;grid-row:1!important;align-self:end!important}.ai-person img{height:178px!important;width:auto!important;max-width:none!important;transform:none!important;object-fit:contain!important}.ai-prompts{display:none!important}

  /* Partners are a horizontal logo shelf */
  .partners{padding:22px 0!important}.partners .section-heading p{display:none!important}
  .partner-row{display:flex!important;gap:9px!important;overflow-x:auto!important;padding:2px 0 8px!important;border:0!important;scroll-snap-type:x proximity!important}
  .partner-row::-webkit-scrollbar{display:none}
  .partner-row .partner-item{flex:0 0 132px!important;min-height:86px!important;border:1px solid #e2e9f0!important;border-radius:13px!important;padding:8px!important;scroll-snap-align:start!important}
  .partner-logo-box{height:48px!important}.partner-logo-box img{max-height:42px!important}.partner-item span{font-size:9px!important}

  /* Updates: swipe cards + one testimonial card */
  .update-grid{display:block!important;padding:24px 0!important}
  .news-grid{display:flex!important;gap:10px!important;overflow-x:auto!important;height:auto!important;margin-top:10px!important;padding-bottom:4px!important;scroll-snap-type:x mandatory!important}
  .news-grid::-webkit-scrollbar{display:none}
  .news-card{flex:0 0 78%!important;height:240px!important;min-height:240px!important;scroll-snap-align:start!important;border-radius:14px!important}.news-image{height:125px!important}.news-card h3{font-size:13px!important}
  .update-grid>div:last-child{margin-top:24px!important}.testimonial{height:auto!important;min-height:190px!important;padding:18px!important;font-size:13px!important;border-radius:14px!important}

  .cta-banner{margin:6px 14px 18px!important;width:auto!important;padding:20px!important;border-radius:16px!important;display:block!important}.cta-banner h2{font-size:19px!important}.cta-banner p{font-size:10px!important;line-height:1.45!important;margin-bottom:14px!important}.cta-banner .btn{min-height:38px!important;font-size:10px!important}

  /* Generic app pages */
  .page-main{min-height:calc(100vh - var(--appbar) - var(--bottomnav))!important}
  .page-hero{padding:20px 0 14px!important;background:#f4f7fb!important;border:0!important}.page-hero h1{font-size:27px!important;line-height:1.07!important}.page-hero p{font-size:12px!important}
  .content-shell{padding:12px 0 24px!important}
  .four-col-cards,.three-col-cards{grid-template-columns:1fr!important;gap:10px!important}
  .four-col-cards .app-card,.three-col-cards .app-card{padding:15px!important;border-radius:14px!important}.app-card h3{font-size:15px!important}.app-card p{font-size:11px!important}
  .two-col,.detail-hero,.dashboard-layout,.auth-layout,.chat-shell{grid-template-columns:1fr!important}
  .result-list{gap:9px!important}.result-card{padding:12px!important;border-radius:14px!important}.result-card h3{font-size:14px!important}
  .detail-title h1{font-size:27px!important}.detail-hero .visual{min-height:190px!important;border-radius:14px!important}.side-panel{position:static!important}
  .metric-grid,.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.metric-card,.stat{padding:14px!important;border-radius:13px!important}
  .dash-content{padding:16px 14px!important}.dash-top{margin-bottom:15px!important}.dash-top h1{font-size:23px!important}
  .table-card{border-radius:14px!important}.table-row{grid-template-columns:1fr auto!important;padding:12px!important}.table-row>*:nth-child(2),.table-row>*:nth-child(3){display:none!important}
  .auth-layout{min-height:calc(100vh - var(--appbar) - var(--bottomnav))!important}.auth-visual{display:none!important}.auth-form-wrap{padding:18px 16px!important;align-items:start!important}.auth-card h1{font-size:26px!important}.field input,.field select,.field textarea{min-height:46px!important;border-radius:11px!important}
  .chat-shell{height:calc(100vh - var(--appbar) - var(--bottomnav))!important}.chat-sidebar{display:none!important}.chat-messages{padding:14px!important}.bubble{font-size:12px!important;border-radius:13px!important}.chat-composer{padding:10px 12px!important}
  .profile-cover{height:120px!important;border-radius:14px!important}.profile-head{margin-top:-38px!important}.profile-head .avatar-large{width:78px!important;height:78px!important}.profile-head h1{font-size:22px!important}
  .section-title{margin:22px 0 10px!important}.section-title h2{font-size:19px!important}.filter-bar{overflow-x:auto!important;flex-wrap:nowrap!important;padding-bottom:4px!important}.filter-chip{white-space:nowrap!important}
}


/* ===== V3 Mobile App UX refinement ===== */
@media(max-width:900px){
  :root{--appbar:58px;--bottomnav:70px}

  html,body{max-width:100%;overflow-x:hidden}
  body{background:#f6f8fb;padding-bottom:calc(var(--bottomnav) + 16px + env(safe-area-inset-bottom))}

  /* One app bar only. Homepage uses the branded home bar. */
  .mobile-homebar{
    display:flex!important;
    position:sticky!important;
    top:0!important;
    z-index:80!important;
    height:58px!important;
    min-height:58px!important;
    padding:0 14px!important;
    align-items:center!important;
    justify-content:space-between!important;
    background:rgba(255,255,255,.98)!important;
    border-bottom:1px solid #e5ebf2!important;
    backdrop-filter:blur(14px)!important;
  }
  .mobile-homebar .mobile-brand{display:flex!important;align-items:center!important;gap:9px!important}
  .mobile-homebar .mobile-brand strong{font-size:17px!important;font-weight:600!important;color:var(--navy)!important}
  .mobile-brand-mark{
    width:28px!important;height:30px!important;display:block!important;
    background:linear-gradient(145deg,#123d75,#06265b)!important;
    clip-path:polygon(15% 14%,85% 0,68% 28%,100% 18%,78% 52%,92% 50%,35% 100%,0 100%,30% 68%,8% 74%,35% 42%,20% 45%);
  }
  .mobile-home-actions{display:flex!important;align-items:center!important;gap:2px!important}
  .mobile-icon-btn{width:38px!important;height:38px!important;border-radius:10px!important;color:#274766!important}

  /* Hero becomes an app hero card, not a full desktop banner. */
  .hero{
    min-height:0!important;
    height:auto!important;
    padding:12px 0 0!important;
    background:transparent!important;
    overflow:visible!important;
  }
  .hero-media{
    inset:12px 14px 0!important;
    height:318px!important;
    border-radius:20px!important;
    background-position:64% center!important;
    box-shadow:0 8px 28px rgba(13,48,88,.12)!important;
  }
  .hero-overlay{
    inset:12px 14px 0!important;
    height:318px!important;
    border-radius:20px!important;
    background:linear-gradient(90deg,rgba(4,29,67,.93) 0%,rgba(4,29,67,.82) 47%,rgba(4,29,67,.24) 78%,rgba(4,29,67,.08) 100%)!important;
  }
  .hero-grid{
    min-height:318px!important;
    height:318px!important;
    padding:0 14px!important;
    align-items:flex-end!important;
  }
  .hero-copy{
    padding:22px 18px 18px!important;
    max-width:none!important;
  }
  .hero-copy .eyebrow{
    font-size:8px!important;
    letter-spacing:.15em!important;
    margin-bottom:7px!important;
  }
  .hero h1{
    font-size:29px!important;
    line-height:1.0!important;
    max-width:285px!important;
    margin:0 0 8px!important;
    letter-spacing:-.035em!important;
  }
  .hero p{
    font-size:11px!important;
    line-height:1.4!important;
    max-width:288px!important;
    -webkit-line-clamp:2!important;
    margin-bottom:12px!important;
  }
  .hero-search{
    height:48px!important;
    border-radius:13px!important;
    padding:4px!important;
    align-items:center!important;
  }
  .hero-search .search-icon{margin:0 8px!important}
  .hero-search input{
    min-width:0!important;
    width:100%!important;
    font-size:11px!important;
    padding:8px 2px!important;
    text-overflow:ellipsis!important;
  }
  .hero-search .btn{
    height:40px!important;
    min-height:40px!important;
    flex:0 0 auto!important;
    padding:0 15px!important;
    font-size:10px!important;
  }

  /* Audience cards start below hero with breathing room. */
  .audience-section{
    margin-top:14px!important;
    padding-top:0!important;
    padding-left:14px!important;
    margin-left:0!important;
    margin-right:0!important;
    gap:10px!important;
  }
  .audience-card{
    flex:0 0 82%!important;
    min-height:180px!important;
    border-radius:16px!important;
    box-shadow:none!important;
    scroll-snap-align:start!important;
  }
  .audience-card>div:first-child{padding:17px 16px!important}
  .audience-card h2{font-size:17px!important;min-height:0!important;margin-bottom:6px!important}
  .audience-card p{font-size:10px!important;line-height:1.4!important;margin-bottom:12px!important}
  .audience-card .btn{min-height:36px!important;padding:0 11px!important;font-size:9px!important}
  .audience-image{height:auto!important;min-height:180px!important}

  /* App section headers should be easy to scan. */
  .container{width:calc(100% - 28px)!important}
  .section{padding:22px 0!important}
  .section-heading h2,.section>h2,.update-grid h2{font-size:19px!important;line-height:1.18!important}
  .section-heading p{font-size:10px!important}
  .text-link{font-size:9px!important}

  /* Better bottom nav — compact, opaque, safe-area aware. */
  .mobile-bottom-nav{
    height:calc(var(--bottomnav) + env(safe-area-inset-bottom))!important;
    padding:6px 6px env(safe-area-inset-bottom)!important;
    box-shadow:0 -6px 24px rgba(25,51,79,.08)!important;
    background:rgba(255,255,255,.99)!important;
  }
  .mobile-bottom-nav a{
    min-width:0!important;
    gap:3px!important;
    font-size:9px!important;
    color:#718398!important;
  }
  .mobile-bottom-nav a svg{width:19px!important;height:19px!important}
  .mobile-bottom-nav a.active{color:var(--navy)!important}

  /* Ensure the final content never sits under the bottom navigation. */
  main{padding-bottom:8px!important}
  .cta-banner{margin-bottom:24px!important}

  /* Fix lower-page mobile density. */
  .service-grid{gap:9px!important}
  .service-card{min-height:74px!important;border-radius:13px!important;padding:11px!important}
  .service-card strong{font-size:10px!important}
  .service-icon{width:34px!important;height:34px!important}

  .list-panel{margin-bottom:20px!important}
  .simple-list>a,.profile-list>a,.event-list a{min-height:58px!important}
  .simple-list>a:nth-child(n+4),.profile-list>a:nth-child(n+4),.event-list>a:nth-child(n+4){display:none!important}

  .twin-panels article{min-height:174px!important;padding-top:16px!important;padding-bottom:16px!important}
  .how-compact .steps>div{min-height:132px!important}
  .membership-compact .plans article{min-height:188px!important}

  .ai-banner{
    min-height:166px!important;
    grid-template-columns:1fr 106px!important;
    margin-top:2px!important;
  }
  .ai-person{height:162px!important}
  .ai-person img{height:166px!important}
  .ai-copy h2{font-size:18px!important}

  .partners .section-heading{margin-bottom:10px!important}
  .partner-row .partner-item{flex-basis:122px!important;min-height:80px!important}

  .update-grid>div:last-child{margin-top:20px!important}
}


/* ===== V5 mobile UX cleanup ===== */
@media(max-width:900px){
  :root{--appbar:60px;--bottomnav:68px}

  html,body{background:#f5f7fa!important}
  body{padding-bottom:calc(var(--bottomnav) + 12px + env(safe-area-inset-bottom))!important}

  /* Native-style app bars */
  .mobile-appbar{
    height:calc(var(--appbar) + env(safe-area-inset-top))!important;
    min-height:calc(var(--appbar) + env(safe-area-inset-top))!important;
    padding:env(safe-area-inset-top) 14px 0!important;
    background:rgba(255,255,255,.985)!important;
    border-bottom:1px solid #e6ebf1!important;
    box-shadow:0 1px 8px rgba(13,48,88,.035)!important;
    backdrop-filter:blur(16px)!important;
  }

  /* Home app bar: one compact line, proper Towasal mark */
  .mobile-homebar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
  }
  .mobile-brand{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    min-width:0!important;
  }
  .mobile-towasal-mark{
    width:28px!important;
    height:30px!important;
    display:grid!important;
    gap:3px!important;
    flex:0 0 auto!important;
    transform:rotate(-14deg)!important;
  }
  .mobile-towasal-mark i{
    display:block!important;
    height:5px!important;
    border-radius:2px!important;
    background:var(--navy)!important;
  }
  .mobile-towasal-mark i:nth-child(1){width:17px!important;margin-left:8px!important}
  .mobile-towasal-mark i:nth-child(2){width:23px!important}
  .mobile-towasal-mark i:nth-child(3){width:18px!important;margin-left:4px!important}
  .mobile-brand-copy{
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
  }
  .mobile-brand-copy strong{
    font-size:17px!important;
    line-height:1.05!important;
    font-weight:650!important;
    color:#123455!important;
    letter-spacing:-.01em!important;
  }
  .mobile-brand-copy small{
    margin-top:3px!important;
    font-size:8px!important;
    line-height:1!important;
    color:#8392a1!important;
    white-space:nowrap!important;
  }
  .mobile-home-actions{
    display:flex!important;
    align-items:center!important;
    gap:2px!important;
  }
  .mobile-icon-btn{
    position:relative!important;
    width:38px!important;
    height:38px!important;
    border-radius:11px!important;
    color:#31506c!important;
  }
  .mobile-icon-btn:active{background:#eef3f8!important}
  .notify-dot{
    position:absolute!important;
    top:8px!important;
    right:8px!important;
    width:6px!important;
    height:6px!important;
    border-radius:50%!important;
    background:#1e6ed0!important;
    border:1.5px solid #fff!important;
  }

  /* Generic sub-page app bar */
  .mobile-appbar:not(.mobile-homebar){
    grid-template-columns:40px 1fr 40px!important;
  }
  .mobile-appbar:not(.mobile-homebar)>strong{
    font-size:15px!important;
    font-weight:600!important;
    color:#193a58!important;
  }

  /* Hero: shorter, clearer and less desktop-like */
  .hero{
    margin-top:10px!important;
  }
  .hero-media,
  .hero-overlay{
    inset:0 14px!important;
    height:292px!important;
    border-radius:18px!important;
  }
  .hero-media{background-position:66% center!important}
  .hero-overlay{
    background:linear-gradient(90deg,rgba(5,31,70,.94) 0%,rgba(5,31,70,.83) 48%,rgba(5,31,70,.28) 75%,rgba(5,31,70,.08) 100%)!important;
  }
  .hero-grid{
    min-height:292px!important;
    height:292px!important;
  }
  .hero-copy{
    padding:19px 18px 16px!important;
  }
  .hero-copy .eyebrow{
    font-size:7.5px!important;
    margin-bottom:6px!important;
  }
  .hero h1{
    font-size:27px!important;
    line-height:1.01!important;
    max-width:265px!important;
    margin-bottom:7px!important;
  }
  .hero p{
    font-size:10.5px!important;
    line-height:1.38!important;
    max-width:272px!important;
    -webkit-line-clamp:2!important;
    margin-bottom:10px!important;
  }
  .hero-search{
    height:45px!important;
    border-radius:12px!important;
  }
  .hero-search input{
    font-size:10.5px!important;
    min-width:0!important;
  }
  .hero-search .btn{
    min-height:37px!important;
    height:37px!important;
    padding:0 13px!important;
    font-size:9.5px!important;
  }

  /* Cards start cleanly below hero */
  .audience-section{
    margin-top:12px!important;
    padding-left:14px!important;
    gap:10px!important;
  }
  .audience-card{
    flex-basis:84%!important;
    border-radius:15px!important;
  }
  .audience-image{
    min-height:132px!important;
    height:132px!important;
  }
  .audience-card>div:first-child{
    min-height:150px!important;
    padding:14px!important;
  }
  .audience-card h2{font-size:17px!important}
  .audience-card p{font-size:10.5px!important}

  /* Section rhythm */
  .section{padding:21px 0!important}
  .section-heading,
  .section-heading.compact,
  .section-heading.small{
    align-items:flex-start!important;
    margin-bottom:10px!important;
  }
  .section-heading h2,.section>h2,.update-grid h2{font-size:19px!important}
  .section-heading p{font-size:10px!important}
  .text-link{font-size:9px!important}

  /* Services must remain app-grid, not a desktop list */
  .service-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  .service-card{
    min-height:94px!important;
    padding:12px!important;
    border-radius:13px!important;
  }
  .service-icon{
    width:34px!important;
    height:34px!important;
  }
  .service-card strong{font-size:10px!important}

  /* Discovery sections: visually separate but compact */
  .tri-grid{
    padding-top:16px!important;
  }
  .list-panel{
    background:#fff!important;
    border:1px solid #e6ebf1!important;
    border-radius:15px!important;
    padding:14px!important;
    margin-bottom:12px!important;
  }
  .list-panel .section-heading.small{margin-bottom:6px!important}
  .list-panel .section-heading.small h2{font-size:18px!important}
  .simple-list>a,.profile-list>a,.event-list a{
    min-height:58px!important;
  }

  /* Emirati pathways: keep swipe cards but reduce dead vertical space */
  .emirati-stage{padding-top:20px!important;padding-bottom:20px!important}
  .emirati-stage .compact-tile-grid.six>a{
    flex-basis:158px!important;
    min-height:124px!important;
    padding:14px!important;
  }

  /* Business / institutions: avoid overly narrow text column */
  .twin-panels article{
    min-height:176px!important;
    padding:16px 43% 16px 15px!important;
  }
  .twin-panels article::after{width:40%!important}
  .twin-panels h2{font-size:17px!important}
  .twin-panels p{font-size:9.5px!important}

  /* Process + membership */
  .how-compact .steps>div{min-height:128px!important}
  .membership-compact .plans article{
    flex-basis:80%!important;
    min-height:188px!important;
  }

  /* AI promo: image visible but not dominant */
  .ai-banner{
    grid-template-columns:1fr 100px!important;
    min-height:158px!important;
    padding:15px 12px 0!important;
    margin:4px 14px 18px!important;
  }
  .ai-copy h2{font-size:17px!important}
  .ai-copy p{-webkit-line-clamp:2!important;font-size:9.5px!important}
  .ai-person{height:154px!important}
  .ai-person img{height:158px!important}

  /* Trusted organizations */
  .partners{padding:18px 0!important}
  .partner-row .partner-item{
    flex-basis:120px!important;
    min-height:76px!important;
  }
  .partner-logo-box{height:42px!important}
  .partner-logo-box img{max-height:37px!important}

  /* Updates */
  .news-card{
    flex-basis:82%!important;
    height:222px!important;
    min-height:222px!important;
  }
  .news-image{height:116px!important}
  .testimonial{min-height:170px!important}

  /* Native bottom bar: smaller and better separated */
  .mobile-bottom-nav{
    min-height:68px!important;
    padding:6px 4px calc(7px + env(safe-area-inset-bottom))!important;
  }
  .mobile-bottom-nav a{
    font-size:8.5px!important;
    gap:2px!important;
  }
  .mobile-bottom-nav a svg{
    width:19px!important;
    height:19px!important;
  }
  .mobile-bottom-nav a.active{
    font-weight:600!important;
  }

  /* Generic pages: more mobile-native density */
  .page-hero{
    padding:17px 0 12px!important;
  }
  .page-hero h1{font-size:25px!important}
  .content-shell{padding-top:10px!important}
  .result-card{border-radius:13px!important}
  .app-card{border-radius:13px!important}
  .mobile-search{margin:10px 0 4px!important}
}

@media(max-width:390px){
  .mobile-brand-copy small{display:none!important}
  .hero h1{font-size:25px!important}
  .hero p{font-size:10px!important}
  .audience-card{flex-basis:88%!important}
  .service-card{min-height:90px!important}
}


/* ====================================================================
   V6 — Unified inner-page design system (desktop + mobile)
   ==================================================================== */
:root{--towasal-navy:#06265b;--towasal-blue:#0b5fba;--towasal-sky:#eaf4ff;--towasal-soft:#f6f9fc;--towasal-line:#dbe5ef;--towasal-text:#123353;--towasal-muted:#6c8094}

/* Inner pages now share the homepage's visual hierarchy */
.page-main{background:#fff}.content-shell{padding-top:30px;padding-bottom:50px}.rich-page-hero{padding:34px 0;background:linear-gradient(135deg,#f2f7fc 0%,#fff 72%);border-bottom:1px solid #edf1f5;overflow:hidden}.subpage-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);gap:48px;align-items:center}.subpage-hero-copy{padding:30px 0}.rich-page-hero h1{font-size:48px;line-height:1.05;letter-spacing:-.035em;margin:8px 0 12px;font-weight:600;color:var(--towasal-text)}.rich-page-hero p{font-size:16px;line-height:1.6;max-width:700px;color:var(--towasal-muted)}.subpage-hero-visual{height:280px;border-radius:18px;background-size:cover;background-position:center;box-shadow:0 12px 36px rgba(22,58,91,.09)}
.visual-services{background-image:linear-gradient(90deg,rgba(6,38,91,.03),rgba(6,38,91,.12)),url('assets/residents_expats.jpg')}.visual-opportunities{background-image:url('assets/business_panel.jpg')}.visual-professionals{background-image:url('assets/institutions_panel.jpg')}.visual-community,.visual-events{background-image:url('assets/event_career_fair.jpg')}.visual-guidance{background-image:url('assets/update_visa_rules.jpg')}.visual-organizations{background-image:url('assets/institutions_panel.jpg')}.visual-emirati{background-image:url('assets/emiratis.jpg')}.visual-membership{background-image:url('assets/business_panel.jpg')}.visual-search{background-image:linear-gradient(135deg,#dceafa,#f9fbfd);position:relative}.visual-search:after{content:'Find guidance, people and opportunities';position:absolute;left:28px;right:28px;bottom:28px;font-size:24px;font-weight:600;color:#163b60}

.quick-insight-grid,.trust-strip,.organization-value,.guidance-quick{width:min(var(--max),calc(100% - 48px));margin:22px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.quick-insight{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;border:1px solid var(--towasal-line);border-radius:14px;padding:18px;background:#fff}.quick-insight>i:first-child,.guidance-quick i,.organization-value i{width:40px;height:40px;padding:10px;background:var(--towasal-sky);border-radius:10px;color:var(--towasal-navy)}.quick-insight strong,.trust-strip strong,.organization-value strong,.guidance-quick strong{display:block;font-size:15px;font-weight:600}.quick-insight span,.trust-strip span,.organization-value span,.guidance-quick span{display:block;font-size:12px;color:var(--towasal-muted);margin-top:3px}.quick-insight>i:last-child{width:18px;color:#91a2b3}

.opportunity-feature,.community-highlight{width:min(var(--max),calc(100% - 48px));margin:22px auto 0;border:1px solid var(--towasal-line);border-radius:18px;background:linear-gradient(135deg,#eef6ff,#fff);padding:24px 28px;display:flex;align-items:center;justify-content:space-between;gap:26px}.opportunity-feature h2,.community-highlight h2{font-size:24px;margin:3px 0 7px;font-weight:600}.opportunity-feature p,.community-highlight p{margin:0;color:var(--towasal-muted);font-size:13px}.opportunity-feature-actions{display:flex;gap:9px;flex:0 0 auto}.hero-chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.hero-chip-row span{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #dce6ef;border-radius:999px;background:#fff;font-size:11px;color:#4d6277}.hero-chip-row svg{width:14px;height:14px}.community-highlight{justify-content:flex-start}.community-highlight-image{width:250px;height:150px;border-radius:14px;flex:0 0 auto;background:url('assets/event_small_business.jpg') center/cover}.community-highlight>div:last-child{max-width:650px}.community-highlight .btn{margin-top:14px}

.trust-strip{grid-template-columns:repeat(3,1fr);background:#fff}.trust-strip>div{border-left:3px solid #d9e9f9;padding:8px 14px}.guidance-quick{grid-template-columns:repeat(4,1fr)}.guidance-quick a,.organization-value>div{border:1px solid var(--towasal-line);border-radius:14px;background:#fff;padding:17px}.guidance-quick a{display:grid;grid-template-columns:auto 1fr;column-gap:11px;align-items:center}.guidance-quick a strong,.guidance-quick a span{grid-column:2}.organization-value{grid-template-columns:repeat(4,1fr)}

/* Results / cards: more compact and informative */
.result-list{display:grid;gap:12px}.result-card{min-height:105px;border-radius:14px;padding:17px 19px;background:#fff;transition:.18s}.result-card:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(17,52,84,.06);border-color:#c7d8e8}.result-card h3{font-size:16px;font-weight:600;margin-bottom:3px}.result-card p{font-size:12px}.filter-bar{padding:2px 0 17px;position:sticky;top:76px;z-index:12;background:rgba(255,255,255,.96);backdrop-filter:blur(10px)}
.four-col-cards,.three-col-cards{gap:14px}.app-card{background:#fff;border-color:var(--towasal-line);transition:.18s}.app-card:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(18,54,87,.06)}.app-card h3{font-weight:600}.icon-tile{background:#edf5fc;color:var(--towasal-navy)}

.related-section{padding-top:15px;padding-bottom:54px}.profile-mini{display:flex;align-items:center;gap:13px}.profile-mini .avatar{width:48px;height:48px;flex:0 0 auto}

/* Profile / account experience */
.profile-status{margin-top:-10px;margin-bottom:18px;border:1px solid var(--towasal-line);border-radius:15px;padding:17px 20px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(90deg,#eff7ff,#fff)}.profile-status>div{display:flex;align-items:center;gap:13px}.status-ring{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--towasal-navy);border:1px solid #d7e4f0}.profile-status strong{font-weight:600}.profile-status p{font-size:12px;color:var(--towasal-muted);margin:3px 0 0}.progress-label{font-size:11px;background:var(--towasal-navy);color:#fff;padding:7px 10px;border-radius:999px}.profile-recommendations{padding:0 0 50px}

/* Dashboards */
.dashboard-welcome{border:1px solid var(--towasal-line);border-radius:16px;background:linear-gradient(135deg,#eff7ff,#fff 70%);padding:22px 24px;margin:4px 0 20px;display:flex;align-items:center;justify-content:space-between;gap:20px}.dashboard-welcome h2{font-size:24px;margin:4px 0 5px}.dashboard-welcome p{margin:0;color:var(--towasal-muted);font-size:12px}.dashboard-quick-actions{display:flex;gap:8px;flex-wrap:wrap}.dashboard-quick-actions a{display:inline-flex;align-items:center;gap:6px;border:1px solid #d9e4ee;background:#fff;border-radius:9px;padding:9px 11px;font-size:11px}.dashboard-quick-actions svg{width:15px;height:15px}.metric-card{background:linear-gradient(180deg,#fff,#fbfdff)}.table-card{overflow:hidden}.dash-content{padding-bottom:50px}

/* Detail pages get the same polished card hierarchy */
.screen-guidance-detail .detail-layout,.screen-opportunity-detail .detail-layout,.screen-event-detail .detail-layout{gap:24px}.detail-card,.side-card{border-radius:15px!important;border-color:var(--towasal-line)!important}.side-card{position:sticky;top:100px}.screen-professional-detail .profile-cover,.screen-organization-detail .org-cover,.screen-profile .profile-cover{background:linear-gradient(135deg,#dcecff,#f7fbff)!important}.screen-professional-detail .metric-grid,.screen-organization-detail .metric-grid{gap:10px}

/* Search page */
.search-shortcuts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:18px}.search-shortcuts span{font-size:11px;color:var(--towasal-muted)}.search-shortcuts a{font-size:11px;padding:8px 11px;border:1px solid var(--towasal-line);border-radius:999px;background:#fff}

/* Mobile — real app treatment for inner pages */
@media(max-width:900px){
  body.app-page,body.dashboard-page{background:#f5f7fa!important}
  .site-header,.site-footer{display:none!important}
  .mobile-appbar{display:grid!important;position:sticky!important;top:0!important;z-index:90!important;background:rgba(255,255,255,.98)!important;border-bottom:1px solid #e7edf3!important;box-shadow:0 1px 8px rgba(14,46,76,.04)!important}
  .page-main{padding-bottom:8px!important}
  .rich-page-hero{padding:0!important;border:0!important;background:transparent!important}
  .subpage-hero-grid{display:block!important;width:auto!important;margin:10px 12px 0!important;position:relative!important;min-height:220px!important;border-radius:18px!important;overflow:hidden!important;background:#123e70!important}
  .subpage-hero-copy{position:relative!important;z-index:2!important;padding:24px 18px 22px!important;color:#fff!important;min-height:220px!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;background:linear-gradient(90deg,rgba(5,31,70,.93),rgba(5,31,70,.74) 62%,rgba(5,31,70,.24))!important}
  .subpage-hero-copy .eyebrow{color:#dcecff!important;font-size:8px!important}.subpage-hero-copy h1{font-size:27px!important;line-height:1.02!important;color:#fff!important;margin:5px 0 8px!important;max-width:285px!important}.subpage-hero-copy p{font-size:10.5px!important;line-height:1.45!important;color:#f2f7fd!important;max-width:270px!important;margin:0!important}.subpage-hero-visual{position:absolute!important;inset:0!important;height:100%!important;border-radius:0!important;box-shadow:none!important;z-index:1!important;background-position:65% center!important}.subpage-hero-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,31,70,.4),rgba(5,31,70,.06))}
  .visual-search:after{display:none!important}
  .quick-insight-grid,.trust-strip,.organization-value,.guidance-quick{width:auto!important;margin:12px 12px 0!important;display:flex!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;gap:9px!important;padding-bottom:3px!important;scrollbar-width:none}.quick-insight-grid::-webkit-scrollbar,.trust-strip::-webkit-scrollbar,.organization-value::-webkit-scrollbar,.guidance-quick::-webkit-scrollbar{display:none}.quick-insight,.trust-strip>div,.organization-value>div,.guidance-quick a{flex:0 0 78%!important;scroll-snap-align:start!important;border-radius:14px!important;min-height:92px!important;padding:14px!important;background:#fff!important}.guidance-quick a,.organization-value>div{flex-basis:58%!important}.trust-strip>div{border:1px solid var(--towasal-line)!important;border-left:3px solid #d6e9fa!important}
  .opportunity-feature,.community-highlight{width:auto!important;margin:12px!important;border-radius:16px!important;padding:16px!important;display:block!important}.opportunity-feature h2,.community-highlight h2{font-size:18px!important}.opportunity-feature p,.community-highlight p{font-size:10.5px!important}.opportunity-feature-actions{display:flex!important;margin-top:12px!important}.opportunity-feature-actions .btn{flex:1!important;font-size:9px!important;padding:0 9px!important;min-height:36px!important}.community-highlight-image{width:100%!important;height:145px!important;margin-bottom:14px!important}.hero-chip-row{gap:5px!important}.hero-chip-row span{font-size:9px!important;padding:5px 7px!important}
  .content-shell{padding-top:14px!important;padding-bottom:24px!important}.filter-bar{position:static!important;display:flex!important;overflow-x:auto!important;gap:7px!important;padding:0 0 12px!important;scrollbar-width:none}.filter-chip{flex:0 0 auto!important}.result-list{gap:9px!important}.result-card{min-height:82px!important;padding:12px!important;border-radius:14px!important}.result-card h3{font-size:13px!important}.result-card p{font-size:9.5px!important}.meta{margin-top:5px!important}.tag{font-size:8px!important}
  .four-col-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.four-col-cards .app-card{min-height:135px!important;padding:13px!important}.four-col-cards .app-card h3{font-size:12px!important}.four-col-cards .app-card p{font-size:9.5px!important;line-height:1.4!important}.three-col-cards{display:flex!important;overflow-x:auto!important;gap:9px!important;scroll-snap-type:x mandatory!important}.three-col-cards>.app-card{flex:0 0 82%!important;scroll-snap-align:start!important;min-height:120px!important}.related-section{padding:15px 14px 24px!important}
  .profile-status{margin:12px!important;padding:14px!important;display:block!important}.profile-status>div{align-items:flex-start!important}.progress-label{display:inline-block!important;margin-top:10px!important}.profile-recommendations{padding:0 14px 24px!important}
  .dashboard-layout{display:block!important}.dash-sidebar{display:none!important}.dash-content{padding:14px!important}.dash-top{align-items:flex-start!important}.dash-top h1{font-size:24px!important}.dash-top .btn{font-size:9px!important;padding:8px 10px!important}.dashboard-welcome{display:block!important;padding:16px!important;margin-bottom:14px!important}.dashboard-welcome h2{font-size:19px!important}.dashboard-quick-actions{margin-top:12px!important}.dashboard-quick-actions a{font-size:9px!important;flex:1 1 30%!important;justify-content:center!important}.metric-grid{grid-template-columns:repeat(2,1fr)!important;gap:9px!important}.metric-card{min-height:92px!important;padding:14px!important}.metric-card strong{font-size:22px!important}.table-card{overflow-x:auto!important}.table-row{min-width:580px!important}
  .side-card{position:static!important}.search-shortcuts{margin:10px 14px 0!important;overflow-x:auto!important;flex-wrap:nowrap!important}.search-shortcuts>*{flex:0 0 auto!important}
}


/* ===== V7 Fixed Header + Role Dashboards + Skill Passport ===== */
@media(min-width:901px){
  .site-header{
    position:fixed!important;
    top:0!important;left:0!important;right:0!important;
    z-index:1000!important;
    height:76px!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 1px 0 rgba(16,56,95,.08)!important;
  }
  body:not(.auth-page){padding-top:76px!important}
  .dashboard-layout{min-height:calc(100vh - 76px)!important}
  .dash-sidebar{
    position:sticky!important;
    top:76px!important;
    height:calc(100vh - 76px)!important;
    overflow:auto!important;
  }
  .filter-bar{top:76px!important}
}
.main-nav{gap:20px!important}
.main-nav a{white-space:nowrap}

.sidebar-role{margin:12px 4px 14px;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff}
.sidebar-role span{display:block;font-size:8px;letter-spacing:.12em;color:#73869a;margin-bottom:6px}
.sidebar-role a{padding:0!important;background:none!important;font-size:10px!important;display:flex!important;justify-content:space-between;color:var(--navy)!important}
.sidebar-role svg{width:14px}

.dash-top-actions{display:flex;gap:10px;align-items:center}
.metric-card small{display:block;color:#7c8d9f;font-size:9px;margin-top:5px}
.dashboard-two-col{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.75fr);gap:18px;margin-top:22px}
.dashboard-feed{display:grid;gap:10px}
.dashboard-feed>a{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:13px 14px;border:1px solid var(--line);border-radius:11px;background:#fff}
.dashboard-feed>a>span:last-child{font-size:10px;font-weight:600;color:var(--navy)}
.feed-icon{width:42px;height:42px;border-radius:10px;background:var(--blue-soft);display:grid;place-items:center;color:var(--navy)}
.feed-icon svg{width:19px}
.passport-mini>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:12px}
.passport-mini>div:first-child span{font-size:11px;color:#61778c}
.passport-mini>div:first-child strong{font-size:26px;color:var(--navy)}
.passport-mini p{margin:12px 0 15px!important;line-height:1.5}
.passport-progress{height:8px;background:#e8eef5;border-radius:999px;overflow:hidden;margin-top:10px}
.passport-progress i{display:block;height:100%;background:var(--navy);border-radius:999px}
.admin-health .verify-row{padding:10px 0;border-bottom:1px solid #edf1f5}
.admin-health .verify-row:last-child{border-bottom:0}
.talent-mini>span{font-size:9px;font-weight:700;color:var(--navy);background:#edf4fb;border-radius:999px;padding:5px 8px}
.talent-mini h3{margin-top:13px}
.member-passport-row{grid-template-columns:1fr 1fr}
.role-card{display:flex;flex-direction:column;justify-content:center}
.role-card .btn{margin-top:12px;width:max-content}

.role-dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.role-dashboard-grid>a{border:1px solid var(--line);border-radius:14px;background:#fff;padding:24px;min-height:190px;transition:.18s}
.role-dashboard-grid>a:hover{transform:translateY(-2px);border-color:#b9cadb;box-shadow:0 10px 28px rgba(17,52,84,.06)}
.role-dashboard-grid svg{width:28px;height:28px;color:var(--navy);margin-bottom:24px}
.role-dashboard-grid h3{font-size:18px;margin:0 0 8px;font-weight:600}
.role-dashboard-grid p{font-size:12px;color:var(--muted);line-height:1.55}

.passport-hero{padding:44px 0;background:linear-gradient(135deg,#edf5fd 0%,#f9fbfe 68%,#eef5fc 100%);border-bottom:1px solid #e5edf5}
.passport-hero-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:center}
.passport-hero h1{font-size:38px;line-height:1.06;margin:8px 0 12px;font-weight:600;letter-spacing:-.025em}
.passport-hero p{font-size:14px;color:var(--muted);max-width:720px}
.passport-actions{display:flex;gap:10px;margin-top:22px}
.passport-score{border:1px solid #d7e3ef;background:#fff;border-radius:14px;padding:22px}
.passport-score span{display:block;font-size:11px;color:#6b7f92}
.passport-score strong{display:block;font-size:38px;margin:6px 0 10px}
.passport-score small{font-size:10px;color:#7d8e9d}
.passport-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,.65fr);gap:24px}
.passport-profile-card{display:flex;gap:16px;align-items:center;border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px}
.passport-avatar{width:70px;height:70px;border-radius:50%;background:#eaf2fb;display:grid;place-items:center;color:var(--navy)}
.passport-avatar svg{width:28px}
.passport-profile-card h2{margin:0 0 4px;font-size:23px}
.passport-profile-card p{margin:0;color:var(--muted)}
.passport-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.passport-badges span{display:inline-flex;align-items:center;gap:5px;font-size:9px;padding:6px 8px;background:#f1f5f9;border-radius:999px;color:#53697d}
.passport-badges svg{width:13px}
.skill-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.skill-card{border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}
.skill-card>div:first-child{display:flex;justify-content:space-between;gap:10px}
.skill-card strong{font-size:14px}.skill-card span{font-size:10px;color:#5c7186}.skill-card small{font-size:9px;color:#7a8c9d}
.skill-meter{height:6px;background:#edf2f7;border-radius:999px;overflow:hidden;margin:12px 0 8px}
.skill-meter i{display:block;height:100%;background:#1c5f9e;border-radius:999px}
.passport-list{display:grid;gap:10px}
.passport-item{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}
.passport-icon{width:48px;height:48px;border-radius:11px;background:var(--blue-soft);display:grid;place-items:center;color:var(--navy)}
.passport-item strong{font-size:14px}.passport-item p{margin:3px 0;color:var(--muted);font-size:11px}.passport-item small{font-size:9px;color:#8293a3}
.verified-pill{display:inline-flex;padding:6px 9px;border-radius:999px;background:#e6f4eb;color:#276544;font-size:9px;font-weight:600}
.verified-pill.soft{background:#eef3f8;color:#607386}
.experience-timeline{display:grid;gap:0}
.experience-timeline>div{display:grid;grid-template-columns:100px 1fr;gap:16px;padding:0 0 20px}
.experience-timeline>div>span{font-size:10px;color:#657a8e;padding-top:3px}
.experience-timeline section{border-left:2px solid #d8e4ef;padding-left:16px}
.experience-timeline strong{font-size:14px}.experience-timeline p{font-size:11px;color:var(--muted);margin:5px 0}.experience-timeline small{font-size:9px}
.cert-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cert-card{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}
.cert-card>svg{width:22px;color:var(--navy)}
.cert-card strong{font-size:13px}.cert-card p{font-size:10px!important;margin-top:4px!important}
.passport-side-card{margin-bottom:14px}
.passport-side-card .btn{width:100%;margin-top:14px}
.visibility-switch{display:flex;align-items:center;gap:9px;font-size:11px;margin:15px 0}
.visibility-switch input{accent-color:var(--navy)}
.verify-row{display:grid;grid-template-columns:20px 1fr auto;gap:8px;align-items:center;font-size:10px}.verify-row svg{width:17px;color:#256f54}.verify-row b{font-size:9px}

.subpage-visual-hero{padding:32px 0;background:linear-gradient(180deg,#f3f7fb,#fff);border-bottom:1px solid #edf1f5}
.subpage-visual-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:26px;align-items:center}
.subpage-visual-hero h1{font-size:39px;line-height:1.06;margin:7px 0 11px;font-weight:600;letter-spacing:-.025em}
.subpage-visual-hero p{font-size:14px;color:var(--muted);max-width:700px}
.subpage-visual{height:240px;border-radius:14px;background-size:cover;background-position:center}
.talent-filter-panel{display:grid;grid-template-columns:1.2fr .8fr .8fr .8fr auto;gap:10px;padding:15px;border:1px solid var(--line);border-radius:13px;background:#fff}
.filter-field{display:grid;gap:5px}.filter-field label{font-size:9px;color:#61768a}.filter-field input,.filter-field select{border:1px solid var(--line);border-radius:8px;padding:10px 11px;font-size:11px;background:#fff}
.talent-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.talent-card{border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px}
.talent-top{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:12px}
.talent-avatar{width:52px;height:52px;border-radius:50%;background:#eaf2fb;display:grid;place-items:center;color:var(--navy)}
.talent-top h3{font-size:16px;margin:0 0 3px}.talent-top h3 svg{width:15px;color:#1168c8;vertical-align:middle}
.talent-top p{font-size:10px;color:var(--muted);margin:0}
.passport-match{font-size:9px;font-weight:700;background:#eaf2fb;color:var(--navy);padding:6px 8px;border-radius:999px}
.talent-skills{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0}
.talent-skills span{font-size:9px;background:#f2f5f8;color:#566c80;border-radius:999px;padding:6px 8px}
.talent-meta{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #edf1f5;padding-top:12px}
.talent-meta span{font-size:9px;color:#788b9c}.talent-meta b{display:block;color:#243f59;font-size:12px}

@media(max-width:900px){
  .dashboard-two-col,.member-passport-row,.passport-layout,.passport-hero-grid,.subpage-visual-grid{grid-template-columns:1fr!important}
  .dash-top-actions{display:flex!important;gap:7px!important}
  .dash-top-actions .btn{font-size:8px!important;padding:7px 9px!important}
  .role-dashboard-grid{grid-template-columns:1fr!important;gap:10px!important}
  .role-dashboard-grid>a{min-height:145px!important;padding:18px!important}
  .role-dashboard-grid svg{margin-bottom:15px!important}
  .passport-hero{padding:20px 0!important;background:#f3f8fd!important}
  .passport-hero h1{font-size:27px!important}
  .passport-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
  .passport-score{padding:15px!important}
  .passport-score strong{font-size:30px!important}
  .skill-grid,.cert-grid,.talent-grid{grid-template-columns:1fr!important}
  .passport-item{grid-template-columns:42px 1fr auto!important;padding:12px!important}
  .passport-icon{width:42px!important;height:42px!important}
  .experience-timeline>div{grid-template-columns:70px 1fr!important}
  .passport-layout aside{order:-1}
  .subpage-visual-hero{padding:12px 0 16px!important;background:#fff!important}
  .subpage-visual-grid{display:block!important}
  .subpage-visual-hero h1{font-size:27px!important}
  .subpage-visual{height:160px!important;margin-top:14px!important}
  .talent-filter-panel{display:flex!important;overflow-x:auto!important;padding:12px!important}
  .filter-field{min-width:160px!important}
  .talent-filter-panel .btn{min-width:110px!important}
  .talent-top{grid-template-columns:46px 1fr auto!important}
  .talent-avatar{width:46px!important;height:46px!important}
  .talent-meta{grid-template-columns:1fr 1fr 1fr!important}
  .sidebar-role{display:none!important}
}

.dashboard-account-actions{margin-left:auto}
.header-account{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:11px;color:#294762;background:#fff}
.header-avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:9px;font-weight:700}
.dashboard-account-actions .icon-btn{position:relative;display:grid;place-items:center;width:38px;height:38px}
.header-dot{position:absolute;right:7px;top:7px;width:6px;height:6px;border-radius:50%;background:#1972cf;border:1px solid #fff}
.profile-role-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(135deg,#f2f7fc,#fff);margin:20px 0 24px}
.profile-role-banner h2{font-size:21px;margin:5px 0}.profile-role-banner p{font-size:11px;color:var(--muted);margin:0}
@media(max-width:900px){
  .dashboard-account-actions{display:none!important}
  .profile-role-banner{display:block!important;padding:15px!important}
  .profile-role-banner .btn{margin-top:12px!important;width:100%!important}
}


/* ===== V9 Dashboard shell: one fixed global header + fixed role sidebar ===== */
@media(min-width:901px){
  :root{
    --desktop-header-h:76px;
    --dashboard-sidebar-w:274px;
  }

  .site-header{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    height:var(--desktop-header-h)!important;
    z-index:1200!important;
    background:#fff!important;
    border-bottom:1px solid #e4ebf2!important;
    box-shadow:0 2px 10px rgba(18,52,84,.035)!important;
  }

  body.dashboard-page{
    padding-top:var(--desktop-header-h)!important;
    overflow-x:hidden!important;
  }

  .dashboard-page .dashboard-layout{
    display:block!important;
    min-height:calc(100vh - var(--desktop-header-h))!important;
  }

  .dashboard-page .dash-sidebar{
    position:fixed!important;
    top:var(--desktop-header-h)!important;
    left:0!important;
    bottom:0!important;
    width:var(--dashboard-sidebar-w)!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    background:#f8fafc!important;
    border-right:1px solid #e4ebf2!important;
    z-index:700!important;
    padding:22px 16px!important;
  }

  .dashboard-page .dash-content{
    margin-left:var(--dashboard-sidebar-w)!important;
    width:calc(100% - var(--dashboard-sidebar-w))!important;
    min-width:0!important;
    padding:36px 38px 60px!important;
  }

  .dashboard-page .dash-sidebar .brand{
    display:none!important;
  }

  .sidebar-user{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    padding:8px 8px 16px!important;
    margin-bottom:8px!important;
    border-bottom:1px solid #e5ebf1!important;
  }

  .sidebar-avatar{
    width:38px!important;
    height:38px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    background:var(--navy)!important;
    color:#fff!important;
    font-size:10px!important;
    font-weight:700!important;
    flex:0 0 auto!important;
  }

  .sidebar-user strong{
    display:block!important;
    font-size:12px!important;
    font-weight:600!important;
    color:#173652!important;
    line-height:1.25!important;
  }

  .sidebar-user small{
    display:block!important;
    margin-top:3px!important;
    font-size:9px!important;
    color:#7a8c9d!important;
  }

  .sidebar-role{
    margin:4px 4px 12px!important;
    padding:8px 8px 10px!important;
  }

  .dash-top{
    position:relative!important;
    top:auto!important;
  }

  .dashboard-page .site-footer{
    margin-left:var(--dashboard-sidebar-w)!important;
    width:calc(100% - var(--dashboard-sidebar-w))!important;
  }

  .dashboard-page .mobile-appbar,
  .dashboard-page .mobile-bottom-nav{
    display:none!important;
  }
}

@media(max-width:900px){
  .sidebar-user{display:none!important}
  .dashboard-page .dash-content{
    margin-left:0!important;
    width:100%!important;
  }
}


/* ===== Towasal App Splash Screen ===== */
.towasal-splash{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#ffffff;
  opacity:1;
  visibility:visible;
  transition:opacity .35s ease, visibility .35s ease;
}
.towasal-splash.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.towasal-splash-inner{
  text-align:center;
  transform:translateY(-2vh);
}
.towasal-splash-mark{
  width:68px;
  height:72px;
  margin:0 auto 18px;
  display:grid;
  gap:7px;
  align-content:center;
  transform:rotate(-13deg);
}
.towasal-splash-mark span{
  display:block;
  height:11px;
  border-radius:4px;
  background:#06265b;
  box-shadow:0 0 0 1px rgba(6,38,91,.02);
}
.towasal-splash-mark span:nth-child(1){width:42px;margin-left:18px}
.towasal-splash-mark span:nth-child(2){width:58px;margin-left:2px}
.towasal-splash-mark span:nth-child(3){width:45px;margin-left:12px}
.towasal-splash-brand{
  color:#06265b;
  font-size:30px;
  line-height:1;
  font-weight:650;
  letter-spacing:-.02em;
}
.towasal-splash-tagline{
  margin-top:8px;
  font-size:10px;
  letter-spacing:.05em;
  color:#728397;
}
.towasal-splash-loader{
  width:120px;
  height:3px;
  margin:26px auto 0;
  overflow:hidden;
  border-radius:99px;
  background:#e8eef5;
}
.towasal-splash-loader i{
  display:block;
  height:100%;
  width:34%;
  border-radius:99px;
  background:#06265b;
  animation:towasalSplashLoad 1.1s ease-in-out infinite;
}
@keyframes towasalSplashLoad{
  0%{transform:translateX(-110%)}
  50%{transform:translateX(150%)}
  100%{transform:translateX(330%)}
}
@media (prefers-reduced-motion: reduce){
  .towasal-splash-loader i{animation:none;width:100%}
  .towasal-splash{transition:none}
}
@media(max-width:900px){
  .towasal-splash-inner{transform:translateY(-4vh)}
  .towasal-splash-mark{width:58px;height:64px;margin-bottom:15px}
  .towasal-splash-mark span{height:9px}
  .towasal-splash-mark span:nth-child(1){width:36px;margin-left:16px}
  .towasal-splash-mark span:nth-child(2){width:50px}
  .towasal-splash-mark span:nth-child(3){width:39px;margin-left:10px}
  .towasal-splash-brand{font-size:27px}
}