/* AL-SHATIBI Academy V0.3.2 — exact approved standalone Hero+Menu, CSS isolated inside .ashv032 */
@import  url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&family=Noto+Kufi+Arabic:wght@500;600;700;800;900&display=swap");
.ashv032{--green:#0C4D2D;--emerald:#146B3A;--navy:#0B355C;--navy-deep:#092743;--gold:#C59C50;--gold2:#E0B862;--ivory:#F8F5EC;--ink:#253C49}
.ashv032, .ashv032 *{box-sizing:border-box}
html:has(.ashv032){scroll-behavior:smooth}
.ashv032{margin:0;color:var(--ink);background:#F8F5EC;font-family:"Cairo","Noto Sans Arabic",Tahoma,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.ashv032 button,.ashv032 a{font:inherit}
.ashv032 a{text-decoration:none;color:inherit}
.ashv032 button{cursor:pointer}
.ashv032 button:focus-visible,.ashv032 a:focus-visible{outline:3px solid #BF8B3F;outline-offset:4px}
.ashv032 svg{display:block}
.ashv032 .site-header{height:77px;position:relative;z-index:30;background:rgba(250,247,240,.96);border-bottom:1px solid rgba(216,180,102,.38);box-shadow:0 2px 22px #072c2510}
.ashv032 .nav-wrap{height:100%;max-width:1690px;margin:auto;padding:0 clamp(18px,4.6vw,76px);display:flex;direction:rtl;align-items:center;gap:27px;justify-content:space-between}
.ashv032 .menu{display:flex;align-items:center;gap:clamp(15px,2.5vw,44px);margin:0;padding:0;list-style:none;white-space:nowrap}
.ashv032 .menu a{height:77px;display:inline-flex;align-items:center;color:#102F4C;font-weight:800;font-size:clamp(12px,.98vw,16px);position:relative;transition:color .2s}
.ashv032 .menu a:hover,.ashv032 .menu a[aria-current]{color:#A97727}
.ashv032 .menu a[aria-current]::after{content:"";position:absolute;bottom:0;right:0;left:0;height:3px;background:linear-gradient(90deg,#9B6D24,#CF9D41);border-radius:3px}
.ashv032 .affiliation{display:flex;align-items:center;direction:ltr;gap:16px;flex-shrink:0}
.ashv032 .affiliation img{width:148px;height:68px;object-fit:contain}
.ashv032 .affiliation .divider{height:36px;width:1px;background:#A58B65}
.ashv032 .affiliation p{margin:0;text-align:right;direction:rtl;font:700 12px/1.65 "Cairo","Noto Sans Arabic",Tahoma,sans-serif;color:#254260;white-space:nowrap}
.ashv032 .mobile-brand,.ashv032 .menu-button{display:none}
.ashv032 .menu-button{order:4;border:1px solid #ddcfad;background:white;color:var(--navy);width:45px;height:45px;border-radius:11px;align-items:center;justify-content:center}
.ashv032 .hero{isolation:isolate;min-height:708px;position:relative;overflow:hidden;display:grid;grid-template-columns:51% 49%;direction:rtl;background:#f6f0e3}
.ashv032 .hero:before{position:absolute;inset:0;content:"";z-index:-3;background-image:linear-gradient(270deg,rgba(255,251,243,.91) 0%,rgba(255,251,244,.81) 33%,rgba(252,244,223,.13) 68%),url("../images/hero-architecture.webp");background-size:cover;background-position:center 48%;filter:saturate(.94)}
.ashv032 .hero:after{content:"";pointer-events:none;position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 39%,rgba(255,249,236,.45) 52%,rgba(255,249,238,.17) 100%)}
.ashv032 .hero-content{position:relative;z-index:3;direction:rtl;text-align:right;align-self:center;padding:38px clamp(35px,6.3vw,108px) 50px 5px;max-width:1000px}
.ashv032 .hero-kicker{display:flex;align-items:center;gap:16px;justify-content:center;width:max-content;max-width:100%;color:#AD843F;font-size:clamp(13px,1.12vw,18px);font-weight:650;margin:0 0 24px 0;white-space:nowrap}
.ashv032 .hero-kicker::before,.ashv032 .hero-kicker::after{content:"❖";font-size:15px;color:#BD914D}
.ashv032 .hero-title{font-family:"Noto Kufi Arabic","Cairo","Noto Sans Arabic",Tahoma,sans-serif;line-height:1.39;font-weight:900;font-size:clamp(50px,5.15vw,84px);letter-spacing:-.05em;margin:0 0 18px;text-shadow:0 2px 0 rgba(255,255,255,.4)}
.ashv032 .hero-title span,.ashv032 .hero-title strong{display:block}
.ashv032 .hero-title span{color:#00452F}
.ashv032 .hero-title strong{color:#062F58;font-weight:900;white-space:nowrap}
.ashv032 .hero-desc{font-size:clamp(16px,1.25vw,21px);line-height:2.05;font-weight:600;max-width:630px;color:#2C4053;margin:20px 0 28px 0}
.ashv032 .hero-actions{display:flex;flex-wrap:wrap;gap:15px;align-items:center;justify-content:flex-start}
.ashv032 .btn{min-height:60px;padding:12px 23px;border-radius:50px;display:inline-flex;align-items:center;gap:12px;justify-content:center;font-weight:800;font-size:clamp(13px,1vw,17px);white-space:nowrap;transition:transform .18s,box-shadow .18s}
.ashv032 .btn:hover{transform:translateY(-2px)}
.ashv032 .btn svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ashv032 .btn-primary{background:linear-gradient(145deg,#0F6544,#074A37);color:#FFF7E5;border:2px solid #CDA250;box-shadow:0 8px 17px #0642312A;padding-inline:29px}
.ashv032 .btn-primary svg{color:#E9C977}
.ashv032 .btn-secondary{color:#153E62;border:1.6px solid #173E60;background:rgba(255,253,247,.82)}
.ashv032 .btn-secondary:hover{background:white;box-shadow:0 8px 20px #0b355c14}
.ashv032 .hero-scene{direction:ltr;position:relative;z-index:0;min-height:708px;margin-left:0;overflow:hidden;mask-image:linear-gradient(to right,black 75%,transparent 100%)}
.ashv032 .hero-scene img{display:block;object-fit:cover;object-position:center 49%;width:100%;height:100%;min-height:708px;position:absolute;inset:0;filter:saturate(1.06) contrast(1.015)}
.ashv032 .feature-ribbon{background:#0B2E51;padding:0 24px 18px;position:relative;min-height:118px;z-index:10;background-image:linear-gradient(130deg,#082847,#092B4D)}
.ashv032 .feature-ribbon:before{content:"";position:absolute;inset:3px 24px 16px;border:2px solid var(--gold);border-radius:23px;pointer-events:none;opacity:.95;box-shadow:inset 0 1px 0 #f1d99b52}
.ashv032 .feature-inner{min-height:103px;max-width:1530px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);direction:rtl;align-items:center;padding:8px 24px;position:relative}
.ashv032 .feature{display:flex;align-items:center;justify-content:center;gap:16px;color:#f9f1e1;padding:12px 14px;min-width:0}
.ashv032 .feature+ .feature{border-right:1px solid #c59c50aa}
.ashv032 .feature-icon{color:var(--gold2);width:43px;height:43px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ashv032 .feature strong,.ashv032 .feature small{display:block;text-align:right;white-space:nowrap}
.ashv032 .feature strong{font-size:clamp(12px,1.08vw,18px);font-weight:800}
.ashv032 .feature small{font-size:clamp(10px,.95vw,15px);color:#e9e2d3;opacity:.9;font-weight:500}
.ashv032 .note{padding:14px 20px;text-align:center;color:#4a5f65;font-size:12px;background:#fbf8f0;border-top:1px solid #e8ddcb}
.ashv032 .dialog{border:none;border-radius:18px;padding:0;width:min(460px,calc(100% - 36px));box-shadow:0 30px 90px #031b2577;color:#24435a;background:white;font-family:"Cairo","Noto Sans Arabic",Tahoma,sans-serif}
.ashv032 .dialog::backdrop{background:#061d32a1}
.ashv032 .dialog-body{padding:25px;text-align:right;direction:rtl}
.ashv032 .dialog h2{font-size:20px;color:#0C4D2D;margin:0 0 8px}
.ashv032 .dialog p{line-height:1.9;margin:0 0 12px}
.ashv032 .dialog code{font-family:monospace;color:#0B355C}
.ashv032 .dialog button{padding:9px 20px;border-radius:25px;background:#0C4D2D;color:white;border:0}
@media (max-width:1370px){.ashv032 .nav-wrap{gap:15px;padding-inline:24px}
.ashv032 .menu{gap:clamp(12px,1.5vw,22px)}
.ashv032 .affiliation img{width:110px}
.ashv032 .affiliation p{font-size:11px}
.ashv032 .hero-title{font-size:clamp(50px,5vw,72px)}
.ashv032 .hero-content{padding-right:4.3vw}
.ashv032 .hero{grid-template-columns:53% 47%}}
@media (max-width:1110px){.ashv032 .affiliation p,.ashv032 .affiliation .divider{display:none}
.ashv032 .affiliation img{width:90px}
.ashv032 .hero-title{font-size:clamp(44px,5vw,60px)}
.ashv032 .hero-content{padding-right:28px}
.ashv032 .hero-desc{font-size:16px}
.ashv032 .feature{gap:10px}
.ashv032 .feature-icon{width:32px;height:32px}}
@media (max-width:930px){.ashv032 .site-header{height:70px}
.ashv032 .nav-wrap{padding-inline:20px}
.ashv032 .mobile-brand{display:flex;align-items:center;gap:8px;font-weight:900;color:#0B355C;font-size:15px;white-space:nowrap}
.ashv032 .mobile-brand img{width:43px;height:43px;object-fit:contain}
.ashv032 .menu-button{display:flex}
.ashv032 .affiliation{margin-right:auto}
.ashv032 .affiliation img{height:54px;width:92px}
.ashv032 .menu{display:none;position:absolute;top:70px;left:12px;right:12px;flex-direction:column;align-items:stretch;background:#fffbf4;padding:9px;border-radius:14px;box-shadow:0 13px 40px #071e2640;border:1px solid #e3d5bd;white-space:normal;gap:0}
.ashv032 .menu.is-open{display:flex}
.ashv032 .menu a{height:auto;min-height:48px;padding:6px 17px;font-size:14px}
.ashv032 .menu a[aria-current]::after{right:0;left:auto;height:70%;width:3px;bottom:15%}
.ashv032 .hero{display:flex;flex-direction:column;min-height:0}
.ashv032 .hero:before{background-position:52% center}
.ashv032 .hero:after{background:linear-gradient(0deg,#fffaf3a8,transparent 45%)}
.ashv032 .hero-content{order:0;align-self:stretch;padding:54px 6vw 32px;text-align:center}
.ashv032 .hero-kicker{margin-inline:auto}
.ashv032 .hero-title{font-size:clamp(48px,7.6vw,74px);letter-spacing:-.04em}
.ashv032 .hero-desc{max-width:710px;margin-inline:auto}
.ashv032 .hero-actions{justify-content:center}
.ashv032 .hero-scene{order:1;min-height:440px;max-height:480px;mask-image:linear-gradient(to top,black 79%,transparent 100%)}
.ashv032 .hero-scene img{min-height:0;position:relative;height:470px;object-position:center 51%}
.ashv032 .feature-inner{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px 10px}
.ashv032 .feature{border:0!important;justify-content:flex-start;padding-inline:20px}
.ashv032 .feature:nth-child(n/**/+3){border-top:1px solid #c59c5055!important}
.ashv032 .feature-ribbon:before{inset:10px 14px 13px}
.ashv032 .feature-ribbon{padding:0 15px 16px}}
@media (max-width:550px){.ashv032 .site-header{height:64px}
.ashv032 .nav-wrap{padding-inline:13px;gap:9px}
.ashv032 .mobile-brand{font-size:12px;gap:4px}
.ashv032 .mobile-brand img{width:34px;height:34px}
.ashv032 .affiliation{margin-right:auto}
.ashv032 .affiliation img{width:66px;height:48px}
.ashv032 .menu-button{width:38px;height:38px;flex:none}
.ashv032 .menu{top:64px}
.ashv032 .hero-content{padding:40px 18px 20px}
.ashv032 .hero-kicker{font-size:11px;gap:8px;margin-bottom:13px;white-space:normal}
.ashv032 .hero-kicker::before,.ashv032 .hero-kicker::after{font-size:10px}
.ashv032 .hero-title{font-size:clamp(36px,10vw,54px);line-height:1.55;margin:0 0 10px}
.ashv032 .hero-title strong{white-space:normal}
.ashv032 .hero-desc{font-size:13px;line-height:2;margin:7px auto 19px;max-width:420px}
.ashv032 .hero-actions{gap:9px}
.ashv032 .btn{padding:9px 12px;font-size:12px;min-height:49px;gap:5px;flex:1}
.ashv032 .btn svg{width:17px;height:17px}
.ashv032 .hero-scene{min-height:300px;max-height:370px}
.ashv032 .hero-scene img{height:330px}
.ashv032 .feature-inner{gap:0;padding:14px 5px}
.ashv032 .feature{padding:14px 7px;gap:7px;min-height:74px}
.ashv032 .feature strong{font-size:11px}
.ashv032 .feature small{font-size:10px;white-space:normal;line-height:1.5}
.ashv032 .feature-icon{width:26px;height:26px}
.ashv032 .feature-ribbon:before{inset:8px 8px 10px;border-radius:14px}
.ashv032 .feature-ribbon{padding:0 8px 10px}}
@media (max-width:365px){.ashv032 .mobile-brand span{font-size:10px}
.ashv032 .hero-title{font-size:34px}
.ashv032 .btn{font-size:10px}
.ashv032 .affiliation img{width:54px}
.ashv032 .nav-wrap{gap:5px}
.ashv032 .feature{gap:5px}
.ashv032 .feature strong{font-size:10px}}
@media (prefers-reduced-motion:reduce){html:has(.ashv032){scroll-behavior:auto}
.ashv032, .ashv032 *{transition:none!important}}
/* Integration safeguards */
.ashv032{font-family:'Cairo',Tahoma,Arial,sans-serif;direction:rtl;color:#253C49;background:#F8F5EC;isolation:isolate}
.ashv032, .ashv032 *{box-sizing:border-box}
.ashv032 .menu, .ashv032 .menu li{list-style:none}
.ashv032 .menu li{margin:0;padding:0}
.ashv032 a{text-decoration:none}
.ashv032 img{max-width:100%}
.ashv032 .site-header{width:100%}
.ashv032 .hero{margin:0;max-width:none}
.ashv032 .feature-ribbon{margin:0}
.ashv032 .menu .ash32-inactive{display:inline-flex;align-items:center;opacity:.54;cursor:not-allowed;font-size:inherit;font-weight:700}
.ashv032 .hero-actions .ash32-inactive{opacity:.60;cursor:not-allowed;transform:none}
.ashv032 .menu-button{font-size:initial}
@media (prefers-reduced-motion:reduce){.ashv032 *, .ashv032 *::before, .ashv032 *::after{scroll-behavior:auto!important;transition:none!important}}
