/* Injazat Framework v1.10.4 — premium About / Story page */
body.ij-about-page{--about-navy:#071a30;--about-navy-2:#0b3358;--about-blue:#006fdb;--about-cyan:#31c0dc;--about-ice:#eff8fc;--about-ink:#102c50;--about-muted:#5f7489;--about-line:#dbe8f1;--about-card:#fff;background:#fff}
body.ij-about-page .ref-page-hero,body.ij-about-page .ref-page-content{display:none!important}
body.ij-about-page .ij-about-shell{overflow:hidden;background:#fff;color:var(--about-ink)}
body.ij-about-page .ij-about-shell *{box-sizing:border-box}
body.ij-about-page .ij-about-shell h1,body.ij-about-page .ij-about-shell h2,body.ij-about-page .ij-about-shell h3{margin:0;letter-spacing:-.04em;line-height:1.08}
html[dir=rtl] body.ij-about-page .ij-about-shell h1,html[dir=rtl] body.ij-about-page .ij-about-shell h2,html[dir=rtl] body.ij-about-page .ij-about-shell h3{letter-spacing:0;line-height:1.35}
body.ij-about-page .ij-about-shell p{margin:0}
body.ij-about-page .ij-about-eyebrow{display:inline-flex;align-items:center;gap:10px;margin-bottom:20px;color:#0783bf;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
body.ij-about-page .ij-about-eyebrow:before{content:"";width:30px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--about-cyan),var(--about-blue))}
html[dir=rtl] body.ij-about-page .ij-about-eyebrow{letter-spacing:0}

/* Hero */
body.ij-about-page .ij-about-hero{position:relative;isolation:isolate;padding:clamp(78px,8vw,118px) 0 clamp(88px,10vw,138px);background:radial-gradient(circle at 88% 14%,rgba(49,192,220,.19),transparent 28%),radial-gradient(circle at 12% 84%,rgba(0,111,219,.18),transparent 30%),linear-gradient(145deg,#061727 0%,#092b49 52%,#0b3c62 100%);color:#fff}
body.ij-about-page .ij-about-hero:after{content:"";position:absolute;inset:auto 0 0;height:100px;background:linear-gradient(180deg,transparent,rgba(3,18,31,.24));pointer-events:none}
body.ij-about-page .ij-about-orb{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.08);pointer-events:none;z-index:-1}
body.ij-about-page .ij-about-orb-one{width:520px;height:520px;inset-inline-end:-210px;top:-190px;box-shadow:0 0 0 65px rgba(255,255,255,.018),0 0 0 130px rgba(255,255,255,.012)}
body.ij-about-page .ij-about-orb-two{width:280px;height:280px;inset-inline-start:-110px;bottom:-130px;background:radial-gradient(circle,rgba(49,192,220,.12),transparent 68%)}
body.ij-about-page .ij-about-hero-grid{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);gap:clamp(50px,7vw,96px);align-items:center}
body.ij-about-page .ij-about-breadcrumb{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-bottom:36px;color:#a9bed0;font-size:12px;font-weight:650}
body.ij-about-page .ij-about-breadcrumb a{color:#d9e9f4;text-decoration:none}
body.ij-about-page .ij-about-breadcrumb a:hover{color:#fff}
body.ij-about-page .ij-about-hero .ij-about-eyebrow{color:#74d9ee}
body.ij-about-page .ij-about-hero .ij-about-eyebrow:before{background:#74d9ee}
body.ij-about-page .ij-about-hero h1{max-width:780px;color:#fff;font-size:clamp(46px,5.7vw,78px);font-weight:760}
body.ij-about-page .ij-about-lead{max-width:760px;margin-top:28px!important;color:#c6d8e5;font-size:clamp(17px,1.55vw,20px);line-height:1.9}
body.ij-about-page .ij-about-actions{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:36px}
body.ij-about-page .ij-about-primary{min-height:55px;padding:14px 24px;border-radius:13px;background:linear-gradient(135deg,var(--about-cyan),#64d6eb);color:#062640;font-weight:820;box-shadow:0 18px 38px rgba(49,192,220,.18)}
body.ij-about-page .ij-about-primary:hover{transform:translateY(-2px);box-shadow:0 22px 46px rgba(49,192,220,.25)}
body.ij-about-page .ij-about-text-link{display:inline-flex;gap:9px;align-items:center;color:#e7f2f9;font-size:14px;font-weight:760;text-decoration:none}
body.ij-about-page .ij-about-text-link span{color:#74d9ee}
body.ij-about-page .ij-about-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:39px}
body.ij-about-page .ij-about-chips>span{display:inline-flex;gap:9px;align-items:center;padding:9px 12px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(255,255,255,.055);color:#c6d8e5;font-size:12px;font-weight:650;backdrop-filter:blur(8px)}
body.ij-about-page .ij-about-chips i{width:7px;height:7px;border-radius:50%;background:#5ed5ec;box-shadow:0 0 0 4px rgba(94,213,236,.10)}
body.ij-about-page .ij-about-hero-visual{position:relative;display:grid;place-items:center;min-height:520px}
body.ij-about-page .ij-about-visual-frame{position:relative;width:min(500px,100%);aspect-ratio:1/1;display:grid;place-items:center;border:1px solid rgba(255,255,255,.11);border-radius:44px;background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.035));box-shadow:0 45px 110px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.10);backdrop-filter:blur(15px)}
body.ij-about-page .ij-about-grid-pattern{position:absolute;inset:24px;border-radius:32px;opacity:.34;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom right,#000,transparent 82%)}
body.ij-about-page .ij-about-visual-frame>img{position:relative;z-index:1;width:min(79%,390px);height:auto;filter:drop-shadow(0 28px 40px rgba(0,0,0,.24))}
body.ij-about-page .ij-about-stat-card,body.ij-about-page .ij-about-saudi-card{position:absolute;z-index:2;border:1px solid rgba(255,255,255,.14);background:rgba(6,28,47,.82);box-shadow:0 24px 52px rgba(0,0,0,.22);backdrop-filter:blur(16px)}
body.ij-about-page .ij-about-stat-card{inset-inline-start:-42px;bottom:58px;min-width:154px;padding:20px 22px;border-radius:20px}
body.ij-about-page .ij-about-stat-card strong{display:block;color:#fff;font-size:31px;line-height:1;font-weight:820}
body.ij-about-page .ij-about-stat-card span{display:block;margin-top:8px;color:#9fc5d9;font-size:12px;font-weight:700}
body.ij-about-page .ij-about-saudi-card{inset-inline-end:-24px;top:48px;width:188px;padding:17px;border-radius:18px}
body.ij-about-page .ij-about-saudi-card>span{display:grid;place-items:center;width:31px;height:31px;margin-bottom:11px;border-radius:10px;background:rgba(49,192,220,.16);color:#73d9ed;font-weight:900}
body.ij-about-page .ij-about-saudi-card b{display:block;color:#fff;font-size:14px}
body.ij-about-page .ij-about-saudi-card small{display:block;margin-top:5px;color:#9eb9ca;font-size:10px;line-height:1.45}

/* General sections */
body.ij-about-page .ij-about-section{position:relative;padding:clamp(78px,8.5vw,116px) 0}
body.ij-about-page .ij-about-section h2{color:var(--about-ink);font-size:clamp(38px,4.6vw,60px);font-weight:760}
body.ij-about-page .ij-about-section h3{color:var(--about-ink);font-size:25px;font-weight:760}
body.ij-about-page .ij-about-heading{max-width:800px;margin-bottom:48px}
body.ij-about-page .ij-about-heading>p:last-child{max-width:690px;margin-top:20px;color:var(--about-muted);font-size:17px;line-height:1.85}
body.ij-about-page .ij-about-heading-centered{margin-inline:auto;text-align:center}
body.ij-about-page .ij-about-heading-centered .ij-about-eyebrow{justify-content:center}

/* v1.10.4 — Dark-surface heading contrast contract.
 * The generic inner-page rule `body.ij-premium-inner #main h1/h2/h3` has
 * higher specificity than the About-page component rules. Keep headings on
 * the three navy surfaces explicitly white so they cannot inherit the dark
 * content-heading color. */
body.ij-about-page #main .ij-about-hero h1,
body.ij-about-page #main .ij-about-vision-card h3,
body.ij-about-page #main .ij-about-transform-panel h2{color:#fff!important}

/* Story */
body.ij-about-page .ij-about-story{background:#fff}
body.ij-about-page .ij-about-story-grid{display:grid;grid-template-columns:minmax(340px,.86fr) minmax(0,1.14fr);gap:clamp(54px,8vw,112px);align-items:center}
body.ij-about-page .ij-about-story-media{position:relative}
body.ij-about-page .ij-about-story-image-wrap{position:relative;max-width:520px;padding:18px;border:1px solid var(--about-line);border-radius:34px;background:linear-gradient(145deg,#f4f9fc,#fff);box-shadow:0 30px 80px rgba(7,26,48,.10)}
body.ij-about-page .ij-about-story-image-wrap:before{content:"";position:absolute;inset:38px -22px -22px 38px;z-index:-1;border-radius:34px;background:linear-gradient(145deg,#dff2f9,#edf6fc)}
body.ij-about-page .ij-about-story-image-wrap img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:24px}
body.ij-about-page .ij-about-story-badge{position:absolute;inset-inline-end:-30px;bottom:38px;max-width:220px;padding:15px 18px;border:1px solid #d5e8f2;border-radius:16px;background:rgba(255,255,255,.94);box-shadow:0 18px 45px rgba(7,26,48,.13);color:#224864;font-size:13px;font-weight:750;line-height:1.55;backdrop-filter:blur(12px)}
body.ij-about-page .ij-about-story-copy>p:not(.ij-about-eyebrow){margin-top:22px;color:var(--about-muted);font-size:18px;line-height:1.92}
body.ij-about-page .ij-about-story-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:34px}
body.ij-about-page .ij-about-story-points span{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid var(--about-line);border-radius:16px;background:#fbfdff;color:#456178;font-size:12px;font-weight:700;line-height:1.45}
body.ij-about-page .ij-about-story-points b{color:var(--about-blue);font-size:11px;letter-spacing:.08em}

/* Purpose */
body.ij-about-page .ij-about-purpose{background:radial-gradient(circle at 12% 10%,rgba(49,192,220,.12),transparent 24%),linear-gradient(180deg,#f3f9fd 0%,#edf7fb 100%)}
body.ij-about-page .ij-about-purpose-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
body.ij-about-page .ij-about-purpose-card{position:relative;min-height:350px;padding:clamp(34px,4vw,52px);overflow:hidden;border:1px solid #d8e8f2;border-radius:30px;background:#fff;box-shadow:0 26px 70px rgba(7,26,48,.075)}
body.ij-about-page .ij-about-purpose-card:after{content:"";position:absolute;width:220px;height:220px;inset-inline-end:-88px;bottom:-105px;border-radius:50%;background:radial-gradient(circle,rgba(49,192,220,.12),transparent 70%)}
body.ij-about-page .ij-about-vision-card{background:linear-gradient(145deg,#071a30,#0b3358);border-color:rgba(255,255,255,.08)}
body.ij-about-page .ij-about-card-number{position:absolute;inset-inline-end:28px;top:26px;color:#8ba5b8;font-size:11px;font-weight:800;letter-spacing:.12em}
body.ij-about-page .ij-about-icon{display:grid;place-items:center;width:54px;height:54px;margin-bottom:36px;border:1px solid #cde5f0;border-radius:17px;background:#eff8fc;color:#0783bf;font-size:25px;font-weight:800}
body.ij-about-page .ij-about-purpose-card h3{font-size:30px}
body.ij-about-page .ij-about-purpose-card p{margin-top:20px;color:#60778c;font-size:17px;line-height:1.9}
body.ij-about-page .ij-about-vision-card .ij-about-card-number{color:#7290a6}
body.ij-about-page .ij-about-vision-card .ij-about-icon{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.07);color:#70d7ec}
body.ij-about-page .ij-about-vision-card h3{color:#fff}
body.ij-about-page .ij-about-vision-card p{color:#bfd2df}

/* Why cards */
body.ij-about-page .ij-about-why{background:#fff}
body.ij-about-page .ij-about-why-heading{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);column-gap:72px;align-items:end;max-width:none}
body.ij-about-page .ij-about-why-heading .ij-about-eyebrow{grid-column:1/-1}
body.ij-about-page .ij-about-why-heading>p:last-child{margin:0}
body.ij-about-page .ij-about-feature-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
body.ij-about-page .ij-about-feature-card{position:relative;grid-column:span 2;min-height:295px;padding:30px;border:1px solid var(--about-line);border-radius:24px;background:linear-gradient(180deg,#fff,#fbfdff);box-shadow:0 18px 48px rgba(7,26,48,.055);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
body.ij-about-page .ij-about-feature-card:nth-last-child(2){grid-column:2/span 2}
body.ij-about-page .ij-about-feature-card:last-child{grid-column:4/span 2}
body.ij-about-page .ij-about-feature-card:hover{transform:translateY(-6px);border-color:#c6e1ee;box-shadow:0 28px 65px rgba(7,26,48,.09)}
body.ij-about-page .ij-about-feature-index{position:absolute;inset-inline-end:24px;top:22px;color:#9cb0bf;font-size:10px;font-weight:850;letter-spacing:.1em}
body.ij-about-page .ij-about-feature-mark{display:grid;place-items:center;width:48px;height:48px;margin-bottom:32px;border-radius:15px;background:#edf8fc}
body.ij-about-page .ij-about-feature-mark i{width:18px;height:18px;border:5px solid #24a8d2;border-top-color:var(--about-blue);border-radius:7px;transform:rotate(45deg)}
body.ij-about-page .ij-about-feature-card h3{font-size:22px}
body.ij-about-page .ij-about-feature-card p{margin-top:15px;color:var(--about-muted);font-size:15px;line-height:1.82}

/* Transformation band */
body.ij-about-page .ij-about-transform{padding-top:36px;background:#fff}
body.ij-about-page .ij-about-transform-panel{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.65fr);gap:60px;align-items:center;padding:clamp(42px,5.5vw,70px);overflow:hidden;border-radius:34px;background:radial-gradient(circle at 92% 22%,rgba(49,192,220,.18),transparent 27%),linear-gradient(140deg,#061727,#0a3154);box-shadow:0 34px 90px rgba(7,26,48,.18)}
body.ij-about-page .ij-about-transform-panel:after{content:"";position:absolute;width:360px;height:360px;inset-inline-end:-190px;bottom:-230px;border:1px solid rgba(255,255,255,.07);border-radius:50%;box-shadow:0 0 0 60px rgba(255,255,255,.015),0 0 0 120px rgba(255,255,255,.01)}
body.ij-about-page .ij-about-transform .ij-about-eyebrow{color:#70d7ec}
body.ij-about-page .ij-about-transform .ij-about-eyebrow:before{background:#70d7ec}
body.ij-about-page .ij-about-transform h2{color:#fff;font-size:clamp(36px,4.3vw,56px)}
body.ij-about-page .ij-about-transform-copy>p:last-child{max-width:750px;margin-top:22px;color:#bfd1de;font-size:17px;line-height:1.9}
body.ij-about-page .ij-about-transform-side{position:relative;z-index:1;padding-inline-start:30px;border-inline-start:1px solid rgba(255,255,255,.12)}
body.ij-about-page .ij-about-transform-line{display:flex;gap:7px;margin-bottom:26px}
body.ij-about-page .ij-about-transform-line span{display:block;width:32px;height:4px;border-radius:999px;background:#44c3dd}
body.ij-about-page .ij-about-transform-line span:nth-child(2){width:18px;background:#1d80c6}
body.ij-about-page .ij-about-transform-line span:nth-child(3){width:9px;background:#fff}
body.ij-about-page .ij-about-transform-side strong{display:block;color:#fff;font-size:23px;line-height:1.55}
body.ij-about-page .ij-about-transform-side a{display:inline-flex;gap:10px;align-items:center;margin-top:25px;color:#73d8ec;font-size:14px;font-weight:800;text-decoration:none}

/* One final CTA + form only */
body.ij-about-page .ij-about-contact{padding-bottom:clamp(90px,10vw,140px);background:linear-gradient(180deg,#fff 0%,#f1f8fc 100%)}
body.ij-about-page .ij-about-contact>.container{display:grid;grid-template-columns:minmax(0,.72fr) minmax(560px,1.28fr);gap:clamp(38px,5vw,72px);align-items:start}
body.ij-about-page .ij-about-contact-intro{position:sticky;top:125px;padding-top:26px}
body.ij-about-page .ij-about-contact-intro h2{font-size:clamp(38px,4.5vw,58px)}
body.ij-about-page .ij-about-contact-intro>p:not(.ij-about-eyebrow){margin-top:18px;color:var(--about-muted);font-size:17px;line-height:1.86}
body.ij-about-page .ij-about-form-shell{position:relative;padding:14px;border:1px solid #d5e6f0;border-radius:32px;background:rgba(255,255,255,.76);box-shadow:0 30px 85px rgba(7,26,48,.09)}
body.ij-about-page .ij-about-form-shell:before{content:"";position:absolute;inset:0;border-radius:32px;background:linear-gradient(135deg,rgba(49,192,220,.12),transparent 32%);pointer-events:none}
body.ij-about-page .ij-about-form-shell .ij-demo-form{position:relative;z-index:1;margin:0!important}

/* Form alignment with current v1.9.8 SaaS form renderer */
body.ij-about-page .ij-about-form-shell .ij-saas-form-layout{min-height:0}
body.ij-about-page .ij-about-form-shell .ij-demo-form{border-radius:22px!important}

/* RTL */
html[dir=rtl] body.ij-about-page .ij-about-breadcrumb{direction:rtl}
html[dir=rtl] body.ij-about-page .ij-about-story-image-wrap:before{inset:38px 38px -22px -22px}
html[dir=rtl] body.ij-about-page .ij-about-feature-mark i{transform:rotate(45deg)}

/* Responsive */
@media(max-width:1080px){
  body.ij-about-page .ij-about-hero-grid{grid-template-columns:minmax(0,1fr) minmax(330px,.78fr);gap:44px}
  body.ij-about-page .ij-about-stat-card{inset-inline-start:-18px}
  body.ij-about-page .ij-about-saudi-card{inset-inline-end:-10px}
  body.ij-about-page .ij-about-story-grid{grid-template-columns:.8fr 1.2fr;gap:58px}
  body.ij-about-page .ij-about-contact>.container{grid-template-columns:.72fr 1.28fr;gap:36px}
  body.ij-about-page .ij-about-feature-card{padding:26px}
}
@media(max-width:860px){
  body.ij-about-page .ij-about-hero{padding-top:72px}
  body.ij-about-page .ij-about-hero-grid,body.ij-about-page .ij-about-story-grid,body.ij-about-page .ij-about-transform-panel,body.ij-about-page .ij-about-contact>.container{grid-template-columns:1fr}
  body.ij-about-page .ij-about-hero-copy{max-width:760px}
  body.ij-about-page .ij-about-hero-visual{min-height:0;margin-top:12px}
  body.ij-about-page .ij-about-visual-frame{max-width:560px}
  body.ij-about-page .ij-about-story-image-wrap{margin-inline:auto}
  body.ij-about-page .ij-about-story-copy{max-width:760px;margin-inline:auto}
  body.ij-about-page .ij-about-purpose-grid{grid-template-columns:1fr}
  body.ij-about-page .ij-about-why-heading{display:block}
  body.ij-about-page .ij-about-why-heading>p:last-child{margin-top:20px}
  body.ij-about-page .ij-about-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.ij-about-page .ij-about-feature-card,body.ij-about-page .ij-about-feature-card:nth-last-child(2),body.ij-about-page .ij-about-feature-card:last-child{grid-column:auto}
  body.ij-about-page .ij-about-feature-card:last-child{grid-column:1/-1;min-height:230px}
  body.ij-about-page .ij-about-transform-side{padding-inline-start:0;padding-top:30px;border-inline-start:0;border-top:1px solid rgba(255,255,255,.12)}
  body.ij-about-page .ij-about-contact-intro{position:static;padding-top:0;max-width:760px}
  body.ij-about-page .ij-about-form-shell{max-width:760px;width:100%;margin-inline:auto}
}
@media(max-width:620px){
  body.ij-about-page .ij-about-hero{padding:58px 0 88px}
  body.ij-about-page .ij-about-breadcrumb{margin-bottom:28px}
  body.ij-about-page .ij-about-hero h1{font-size:clamp(39px,11vw,54px)}
  body.ij-about-page .ij-about-lead{font-size:16px;line-height:1.8}
  body.ij-about-page .ij-about-actions{align-items:flex-start;flex-direction:column}
  body.ij-about-page .ij-about-primary{width:100%}
  body.ij-about-page .ij-about-chips{display:grid;width:100%}
  body.ij-about-page .ij-about-chips>span{width:max-content;max-width:100%}
  body.ij-about-page .ij-about-visual-frame{border-radius:28px}
  body.ij-about-page .ij-about-grid-pattern{inset:15px;border-radius:20px}
  body.ij-about-page .ij-about-stat-card{inset-inline-start:10px;bottom:18px;min-width:132px;padding:15px 16px}
  body.ij-about-page .ij-about-stat-card strong{font-size:25px}
  body.ij-about-page .ij-about-saudi-card{inset-inline-end:10px;top:18px;width:155px;padding:13px}
  body.ij-about-page .ij-about-section{padding:68px 0}
  body.ij-about-page .ij-about-section h2{font-size:clamp(33px,9vw,43px)}
  body.ij-about-page .ij-about-story-image-wrap{padding:12px;border-radius:25px}
  body.ij-about-page .ij-about-story-image-wrap img{border-radius:18px}
  body.ij-about-page .ij-about-story-badge{inset-inline:18px;bottom:18px;max-width:none}
  body.ij-about-page .ij-about-story-points{grid-template-columns:1fr}
  body.ij-about-page .ij-about-purpose-card{min-height:0;padding:30px 24px;border-radius:24px}
  body.ij-about-page .ij-about-feature-grid{grid-template-columns:1fr}
  body.ij-about-page .ij-about-feature-card,body.ij-about-page .ij-about-feature-card:last-child{grid-column:auto;min-height:0}
  body.ij-about-page .ij-about-transform{padding-top:18px}
  body.ij-about-page .ij-about-transform-panel{gap:30px;padding:38px 24px;border-radius:26px}
  body.ij-about-page .ij-about-transform-side strong{font-size:20px}
  body.ij-about-page .ij-about-form-shell{padding:8px;border-radius:24px}
  body.ij-about-page .ij-about-contact{padding-bottom:82px}
}
@media(prefers-reduced-motion:reduce){
  body.ij-about-page .ij-about-feature-card,body.ij-about-page .ij-about-primary{transition:none!important;transform:none!important}
}
