
/* MAND OUB NET • Signature landing v3 (preview draft) */
:root {--premium-ink:#102c3d;--premium-green:#0c8f55;--premium-blue:#0878c7}
html {scroll-behavior:smooth}
body {background:#f8fafb}
.container {width:min(1240px,calc(100% - 40px))}
.topbar {background:#092738;min-height:38px}
.topbar-inner{min-height:38px}
.site-header {background:rgba(255,255,255,.98);box-shadow:0 7px 25px rgba(13,40,53,.06);border-bottom:0}
.header-inner{height:75px}
.brand-icon {color:#0b865d}
.desktop-nav{gap:20px}
.header-cta .button-primary{background:linear-gradient(125deg,#0b824e,#0ca565)}
/* Cinema-style home-internet hero; use locally uploaded licensed residential photo */
.hero-v2 {
  min-height:540px;
  background-image:linear-gradient(90deg,rgba(4,24,28,.89) 2%,rgba(5,31,37,.83) 41%,rgba(7,28,36,.61) 100%),url('https://mandoubnet.online/wp-content/uploads/2026/10/واجهة-منزل-عصري-بنر-الإنترنت-المنزلي.jpg');
  background-position:center;background-size:cover;background-repeat:no-repeat;color:#fff;
}
.hero-v2:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 27% 62%,rgba(54,213,101,.22),transparent 39%);pointer-events:none}
.hero-v2 .hero-grid{min-height:540px;grid-template-columns:1.06fr .94fr;gap:35px;padding:48px 0 53px;position:relative;z-index:1}
.hero-v2 .hero-text{padding:0;align-self:center}
.hero-v2 .hero-pill{background:rgba(14,159,89,.23);border:1px solid rgba(151,242,179,.52);color:#dfffe8;box-shadow:none;padding:8px 15px;margin-bottom:17px}
.hero-v2 h1{color:#fff;font-size:clamp(2.7rem,4.55vw,4.7rem);line-height:1.16;letter-spacing:-.06em;margin:0 0 18px;max-width:700px;text-shadow:0 5px 22px rgba(0,0,0,.14)}
.hero-v2 h1 span{color:#a9ed80}
.hero-v2 .hero-sub,.hero-v2 .hero-sub strong{color:#ebf8f5}
.hero-v2 .hero-sub{font-size:1.09rem;line-height:1.85;max-width:570px;margin:0 0 25px}
.hero-v2 .hero-actions .button-primary{background:linear-gradient(105deg,#0da05d,#087a4a);box-shadow:0 10px 22px #0004}
.hero-v2 .hero-actions .button-outline{color:#fff;background:#ffffff15;border:1px solid #ffffff8a;backdrop-filter:blur(8px)}
.hero-v2 .hero-actions .button{border-radius:12px;font-size:.95rem;padding:13px 21px;min-height:54px}
.hero-v2 .hero-perks{color:#eafcf6;gap:19px;margin:22px 0 14px}
.hero-v2 .hero-disclosure{color:#d9e2e3;opacity:.88;max-width:600px;font-size:.72rem;line-height:1.7}
.hero-visual{position:relative}
.hero-v2 .hero-showcase {background:none;min-height:445px;height:445px;border:0;box-shadow:none;overflow:visible;isolation:isolate}
.hero-v2 .hero-showcase:before {width:390px;height:390px;top:49%;left:50%;border:1px solid rgba(141,255,157,.34);box-shadow:0 0 0 50px rgba(28,199,90,.04)}
.hero-v2 .hero-showcase:after {width:292px;height:292px;top:49%;left:50%;border:1px solid rgba(141,255,157,.28)}
.hero-v2 .hero-showcase-blur{background:radial-gradient(circle,#75f79b 0,transparent 66%);top:70px;left:17%;opacity:.28;filter:blur(32px)}
.hero-v2 .hero-light-orb{width:180px;height:180px;top:25%;left:30%;background:rgba(38,199,95,.23);filter:blur(32px)}
.hero-v2 .hero-device-wrap{inset:23px 18% 40px}
.hero-v2 img.router-hero{max-height:370px;height:93%;width:auto;max-width:100%;object-fit:contain;background:#fff;padding:12px;border-radius:26px;box-shadow:0 24px 55px rgba(0,0,0,.28),0 0 0 1px #e2f0e5;filter:none}
.hero-v2 .hero-signal{color:#c2fc81;text-shadow:0 2px 9px rgba(3,54,8,.35);font-size:3.6rem;right:17px;top:28px;opacity:1}
.hero-v2 .hero-offer-chip{border-radius:17px;min-width:139px;box-shadow:0 15px 36px #0004}
.hero-v2 .chip-zain{bottom:68px;right:0}
.hero-v2 .chip-mobily{top:45px;left:0}
.hero-v2 .hero-art-note{background:#ffffffea;color:#064d37;bottom:5px;font-size:.76rem}
/* Short feature rail */
.value-bar{position:relative;background:#fff;box-shadow:0 9px 30px #082c3d10;border-bottom:1px solid #e6efed}
.value-items{min-height:79px;color:#1f5560;font-size:.84rem}
.value-items span{padding:12px 20px;border-left:1px solid #edf1f2}
.value-items span:last-child{border-left:0}
/* Editorial offer banners */
.showcase-offers {padding-top:61px;padding-bottom:72px;background:#fff}
.section-heading.compact h2{color:#122d40;font-size:2.5rem}
.campaign-grid{gap:22px}
.campaign-card{min-height:320px;border-radius:25px;box-shadow:0 19px 33px #0b453023}
.campaign-zain{background:radial-gradient(circle at 17% 60%,#25984e,#06502c 67%,#042e20)}
.campaign-mobily{background:radial-gradient(circle at 17% 60%,#238bce,#064c8b 67%,#04385d)}
.campaign-router{width:34%;left:2%;height:240px;object-fit:contain;border-radius:20px;background:#fff;padding:7px;filter:none;box-shadow:0 16px 28px #0003}
.campaign-card h3{font-size:1.18rem}
.campaign-pricing strong{font-size:3.1rem}
.campaign-link{min-height:40px;box-shadow:0 8px 20px #0002}
/* Offer grid and elevated product cards */
.brand-zain-section {background:linear-gradient(180deg,#edf9ef 0,#f6fbf6 30%,#fff)}
.brand-mobily-section{background:linear-gradient(180deg,#e9f5ff 0,#f5faff 30%,#fff)}
.brand-plans{padding-top:70px;padding-bottom:76px}
.brand-title h2{font-size:2.5rem;font-weight:900}
.package-grid{gap:20px}
.package-card{border:1px solid #d8e8dd;border-radius:21px;box-shadow:0 11px 29px #195e3014;transition:transform .22s,box-shadow .22s;background:#fff}
.package-card[data-brand="mobily"]{border-color:#dceaf8}
.package-card:hover{transform:translateY(-6px);box-shadow:0 18px 34px #195e3026}
.package-visual{height:220px!important;background:radial-gradient(circle at 50% 48%,#e9fbdc,#f6fbf3 69%)!important;overflow:hidden}
.package-card[data-brand="mobily"] .package-visual{background:radial-gradient(circle at 50% 48%,#e1f1ff,#f5faff 69%)!important}
.package-visual img{height:191px;max-width:86%;object-fit:contain;transition:transform .25s;border-radius:15px;mix-blend-mode:normal;filter:drop-shadow(0 5px 9px #194c3510)}
.package-card:hover .package-visual img{transform:scale(1.035)}
.package-visual:before{content:'5G';position:absolute;bottom:-25px;left:10px;color:#126e3c;opacity:.065;font-weight:900;font:900 8rem/1 Arial,sans-serif}
.package-card[data-brand="mobily"] .package-visual:before{color:#116aab}
.package-body{padding:23px 18px 21px}
.connection-label{font-size:.75rem;letter-spacing:0;color:#6d8e81}
.package-body h3{font-size:1.13rem;color:#133b35;line-height:1.5}
.package-card[data-brand="mobily"] .package-body h3{color:#14416a}
.plan-speed{font-size:1rem}
.price-row{margin:7px 0 13px;padding-bottom:14px;min-height:70px;gap:2px 7px}
.price-row strong{font-size:2.65rem;color:#087d42;letter-spacing:-.06em}
.package-card[data-brand="mobily"] .price-row strong{color:#086dbc}
.price-row span{font-size:.79rem}
.price-row del{color:#9c6368}
.package-features li{font-size:.81rem;line-height:1.7}
.package-note{min-height:55px;font-size:.69rem}
.plan-actions .button{min-height:43px;font-size:.8rem;padding:9px 9px}
.coverage-mini{background:linear-gradient(115deg,#0c2c42,#076a61)}
@media(max-width:1020px){.hero-v2 .hero-grid{min-height:0;grid-template-columns:1fr 1fr}.hero-v2 h1{font-size:clamp(2.35rem,4.4vw,3.5rem)}.hero-v2 .hero-showcase{min-height:385px;height:385px}.hero-v2 .hero-offer-chip{min-width:122px}}
@media(max-width:760px){.hero-v2 .hero-grid{display:flex;flex-direction:column;gap:6px;padding-top:35px;padding-bottom:28px}.hero-v2 .hero-text{width:100%}.hero-v2 .hero-showcase{height:325px;min-height:325px}.hero-v2 h1{font-size:clamp(2.7rem,9vw,3.9rem)}.hero-v2 .hero-device-wrap{inset:8px 23% 34px}.hero-v2 img.router-hero{max-height:288px}.hero-v2 .hero-showcase:before{height:265px;width:265px}.hero-v2 .hero-showcase:after{width:204px;height:204px}.hero-v2 .chip-mobily{top:21px;left:5px}.hero-v2 .chip-zain{bottom:50px;right:3px}.hero-v2 .hero-art-note{bottom:0}.value-items span{border:0}.showcase-offers{padding-top:52px}}
@media(max-width:600px){.container{width:min(100% - 30px,1240px)}.header-inner{height:65px}.hero-v2 .hero-sub{font-size:.94rem;line-height:1.8}.hero-v2 h1{font-size:clamp(2.35rem,9.5vw,3rem)}.hero-v2 .hero-actions .button{font-size:.81rem;padding:10px 9px}.hero-v2 .hero-perks{gap:8px;font-size:.69rem}.hero-v2 .hero-disclosure{font-size:.68rem}.hero-v2 .hero-offer-chip{min-width:112px}.hero-v2 .hero-offer-chip strong{font-size:1.4rem}.hero-v2 .hero-signal{font-size:2.6rem}.hero-v2 .hero-showcase{height:300px;min-height:300px}.hero-v2 .hero-device-wrap{inset:12px 23% 25px}.hero-v2 img.router-hero{max-height:255px}.campaign-card{min-height:275px}.campaign-content{max-width:67%}.campaign-router{width:32%;height:210px}.section-heading.compact h2{font-size:1.9rem}.brand-title h2{font-size:1.95rem}.package-visual{height:225px!important}.package-visual img{height:198px}.package-body{padding:22px}.price-row strong{font-size:2.8rem}.package-note{min-height:0}.value-items{padding:9px 0}}
@media(prefers-reduced-motion:reduce){.hero-v2 img.router-hero{animation:none}}
