/*
Theme Name: Tecton Corporate Arabic
Theme URI: https://www.tecton.iq/
Author: Tecton Software & Accounting Solutions
Author URI: https://www.tecton.iq/
Description: ثيم عربي احترافي متكامل لشركة تِكتون للحلول البرمجية والمحاسبية، مخصص للمحاسبة الحكومية والرواتب والموارد البشرية والمخازن.
Version: 1.4.1
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tecton-corporate-arabic
Tags: rtl-language-support, custom-logo, featured-images, one-column, accessibility-ready
*/


:root{
  --ink:#061521;
  --navy:#081c2b;
  --navy-2:#0d2636;
  --teal:#099c98;
  --teal-bright:#15b9b0;
  --violet:#6436c7;
  --warm:#f7f8f6;
  --paper:#ffffff;
  --text:#10242f;
  --muted:#66747c;
  --line:#dce4e5;
  --shadow:0 24px 70px rgba(4,22,34,.13);
  --radius:24px;
  --container:1180px;
  --nav-height:72px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;font-family:"Tajawal",Arial,Tahoma,sans-serif;background:var(--warm);color:var(--text);overflow-x:hidden}
body.modal-open{overflow:hidden}
button,input,textarea,select{font:inherit}
button,a{webkit-tap-highlight-color:transparent}
button{border:0}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
p{line-height:1.9}
::selection{background:rgba(21,185,176,.25)}
.container{width:min(var(--container),calc(100% - 42px));margin-inline:auto}
.section{padding:105px 0}
.section-anchor{scroll-margin-top:105px}
.skip-link{position:fixed;top:10px;right:10px;z-index:200;transform:translateY(-160%);background:#fff;color:var(--ink);padding:12px 18px;border-radius:12px;font-weight:800}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid rgba(21,185,176,.8);outline-offset:4px}
em{font-style:normal;color:var(--teal-bright)}
.image-shell{position:relative;overflow:hidden;background:linear-gradient(135deg,#e8efef,#fff)}
.image-shell:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.2);border-radius:inherit}
.image-shell.is-broken{display:grid;place-items:center;background:linear-gradient(145deg,#0d2636,#12384a)}
.image-shell.is-broken:before{content:"تِكتون";color:#fff;font-family:"Alexandria";font-size:28px;font-weight:800}
.drive-image{width:100%;height:100%;object-fit:cover}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:999px;font-weight:800;cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,background .22s ease,border-color .22s ease}
.btn:hover{transform:translateY(-2px)}
.btn-large{min-height:56px;padding:0 30px;font-size:16px}
.btn-primary{background:var(--teal-bright);color:#03151e;box-shadow:0 15px 35px rgba(21,185,176,.26)}
.btn-primary:hover{background:#23cbc1;box-shadow:0 18px 42px rgba(21,185,176,.34)}
.btn-glass{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#fff;backdrop-filter:blur(16px)}
.btn-glass:hover{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.33)}
.btn-white{background:#fff;color:var(--ink);box-shadow:0 16px 40px rgba(0,0,0,.2)}
.btn-outline{border:1px solid var(--line);background:#fff;color:var(--text)}
.btn-outline:hover{border-color:var(--teal)}
.section-kicker,.mini-label{display:inline-flex;align-items:center;gap:8px;color:var(--teal);font-size:13px;font-weight:800;letter-spacing:.03em}
.section-kicker:before,.mini-label:before{content:"";width:24px;height:2px;border-radius:3px;background:currentColor}
.section-kicker.light{color:#64d9d1}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:42px;margin-bottom:50px}
.section-heading.centered{display:block;text-align:center;max-width:760px;margin:0 auto 56px}
.section-heading h2,.about-copy h2,.contact-copy h2{font-family:"Alexandria";font-size:clamp(34px,4vw,58px);line-height:1.25;margin:12px 0 0;letter-spacing:-.035em}
.section-heading>p{max-width:490px;margin:0;color:var(--muted);font-size:17px}
.section-heading.centered>p{margin:18px auto 0}

/* Floating navigation */
.floating-header{position:fixed;inset:14px 0 auto;z-index:100;pointer-events:none}
.floating-nav{height:var(--nav-height);display:flex;align-items:center;gap:24px;padding:8px 10px 8px 18px;border:1px solid rgba(190,231,230,.15);border-radius:999px;background:rgba(6,21,33,.78);box-shadow:0 18px 50px rgba(0,0,0,.24);backdrop-filter:blur(22px);pointer-events:auto}
.brand{display:flex;align-items:center;gap:10px;min-width:185px}
.brand-logo{width:54px;height:54px;border-radius:50%;background:#fff;flex:none}
.brand-logo img{object-fit:contain;padding:4px}
.brand-copy strong{display:block;color:#fff;font-family:"Alexandria";font-size:17px}
.brand-copy small{display:block;color:rgba(255,255,255,.47);font-size:10px;margin-top:3px}
.desktop-links{margin-inline:auto;display:flex;align-items:center;gap:3px;padding:4px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);border-radius:999px}
.desktop-links a{padding:10px 17px;border-radius:999px;color:rgba(255,255,255,.6);font-size:13px;font-weight:800;transition:.2s}
.desktop-links a:hover{color:#fff}
.desktop-links a.active{background:#c8f5f1;color:#06312f;box-shadow:0 7px 20px rgba(21,185,176,.18)}
.nav-cta{min-height:52px;white-space:nowrap}
.menu-toggle{display:none;width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);cursor:pointer}
.menu-toggle span{display:block;width:20px;height:2px;background:#fff;margin:5px auto;border-radius:3px}
.mobile-menu{margin-top:9px;padding:12px;border:1px solid rgba(190,231,230,.15);border-radius:24px;background:rgba(6,21,33,.95);box-shadow:0 24px 60px rgba(0,0,0,.3);backdrop-filter:blur(22px);pointer-events:auto}
.mobile-menu a:not(.btn){display:block;padding:13px 15px;border-radius:12px;color:rgba(255,255,255,.72);font-weight:700}
.mobile-menu a:not(.btn):hover,.mobile-menu a.active:not(.btn){background:rgba(255,255,255,.08);color:#fff}
.mobile-menu .btn{width:100%;margin-top:8px}

/* Hero */
.hero{position:relative;min-height:980px;padding:150px 0 105px;background:
radial-gradient(circle at 83% 25%,rgba(13,156,152,.22),transparent 31%),
radial-gradient(circle at 9% 82%,rgba(100,54,199,.18),transparent 30%),
linear-gradient(120deg,#04131e,#061b29 52%,#07262d);color:#fff;overflow:hidden}
.hero-grid-pattern,.impact-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(to bottom,#000,transparent 94%)}
.hero-glow{position:absolute;width:400px;height:400px;border-radius:50%;filter:blur(90px);opacity:.18}
.hero-glow-one{right:-120px;top:70px;background:var(--teal-bright)}
.hero-glow-two{left:-150px;bottom:10px;background:var(--violet)}
.hero-layout{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center}
.hero-copy{position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:10px 15px;border:1px solid rgba(80,222,213,.24);border-radius:999px;background:rgba(9,156,152,.12);color:#94e6e1;font-size:13px;font-weight:800}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:#63e3db;box-shadow:0 0 0 6px rgba(99,227,219,.09)}
.hero h1{max-width:720px;margin:26px 0 22px;font-family:"Alexandria";font-size:clamp(52px,6.2vw,92px);line-height:1.12;letter-spacing:-.055em}
.hero h1 em{display:block;background:linear-gradient(90deg,#e4ffff 0%,#3bd1c8 48%,#15b9b0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-copy>p{max-width:690px;margin:0;color:rgba(255,255,255,.64);font-size:20px;line-height:2}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.trust-line{display:flex;flex-wrap:wrap;gap:22px;margin-top:26px;color:rgba(255,255,255,.53);font-size:13px;font-weight:700}
.trust-line span:before{content:"✓";color:#4bd2ca;margin-left:7px}
.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:36px}
.metric-grid article{padding:20px 22px;border:1px solid rgba(255,255,255,.11);border-radius:20px;background:rgba(255,255,255,.045);backdrop-filter:blur(12px)}
.metric-grid small{display:block;color:#63d7d0;font-size:10px;font-weight:800}
.metric-grid strong{display:block;margin:8px 0 3px;font-family:"Alexandria";font-size:27px}
.metric-grid span{color:rgba(255,255,255,.42);font-size:11px;font-weight:700}
.hero-visual{position:relative;z-index:2}
.suite-frame{position:relative;padding:18px;border:1px solid rgba(169,232,229,.18);border-radius:34px;background:rgba(255,255,255,.065);box-shadow:0 34px 90px rgba(0,0,0,.34);backdrop-filter:blur(16px)}
.suite-frame-head{display:flex;align-items:center;justify-content:space-between;padding:1px 3px 14px;color:rgba(255,255,255,.55);font-size:11px;font-weight:800}
.suite-frame-head i{font-style:normal}
.suite-frame-head i:after{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#5ee0d8}
.suite-art{border-radius:26px;aspect-ratio:2/3;background:#fff}
.suite-art img{object-fit:cover}
.floating-note{position:absolute;padding:13px 18px;border:1px solid rgba(255,255,255,.12);border-radius:17px;background:rgba(5,21,33,.86);box-shadow:0 15px 38px rgba(0,0,0,.24);color:rgba(255,255,255,.6);font-size:10px;line-height:1.6;backdrop-filter:blur(16px)}
.floating-note b{color:#fff;font-size:13px}
.note-top{right:-20px;top:82px}
.note-bottom{left:-28px;bottom:-20px;background:#fff;color:#6f7b81}
.note-bottom b{color:var(--ink)}
.sector-strip{padding:36px 0;background:#fff;border-bottom:1px solid #e8eeee}
.sector-inner{display:flex;align-items:center;justify-content:space-between;gap:35px}
.sector-inner h2{margin:5px 0 0;font-family:"Alexandria";font-size:22px}
.sector-chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px}
.sector-chips span{display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid #e3e9e9;border-radius:999px;background:#fbfcfc;color:#59686f;font-size:12px;font-weight:800}
.sector-chips i{width:8px;height:8px;border:2px solid var(--teal);border-radius:2px;transform:rotate(45deg)}

/* About */
.about{background:#fff;overflow:hidden}
.about-layout{display:grid;grid-template-columns:.92fr 1.08fr;gap:86px;align-items:center}
.about-media{position:relative}
.image-frame{aspect-ratio:4/5;border-radius:32px;box-shadow:var(--shadow)}
.image-frame img{object-fit:cover}
.image-frame:before{content:"";position:absolute;inset:20px auto auto -20px;width:110px;height:110px;border:1px solid rgba(9,156,152,.18);border-radius:24px;z-index:-1}
.made-in-iraq{position:absolute;bottom:-18px;right:26px;padding:15px 20px;border:1px solid #e1e9e9;border-radius:16px;background:#fff;box-shadow:0 15px 45px rgba(5,34,47,.12);font-size:12px;font-weight:800}
.about-copy>p{margin:24px 0 32px;color:var(--muted);font-size:17px}
.value-list{display:grid;gap:11px}
.value-list article{display:flex;gap:17px;padding:18px 19px;border:1px solid #e5ebeb;border-radius:18px;background:#fbfcfc;transition:.22s}
.value-list article:hover{transform:translateX(-4px);border-color:rgba(9,156,152,.35);box-shadow:0 12px 30px rgba(5,34,47,.07)}
.value-list article>span{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:13px;background:#e8f8f6;color:var(--teal);font-family:"Alexandria";font-size:12px;font-weight:800}
.value-list h3{margin:0;font-size:15px}
.value-list p{margin:5px 0 0;color:#78858b;font-size:12px;line-height:1.7}

/* Products */
.solutions{background:var(--warm)}
.product-explorer{display:grid;grid-template-columns:320px 1fr;gap:18px}
.product-tabs{display:grid;gap:9px;align-content:start}
.product-tab{display:grid;grid-template-columns:52px 1fr auto;gap:13px;align-items:center;width:100%;padding:13px;border:1px solid #e0e6e6;border-radius:18px;background:#fff;text-align:right;cursor:pointer;transition:.22s}
.product-tab:hover{transform:translateX(-3px);border-color:#b9cecd}
.product-tab.active{border-color:rgba(9,156,152,.25);background:var(--ink);color:#fff;box-shadow:0 18px 42px rgba(5,25,37,.17)}
.product-tab-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;font-family:"Alexandria";font-size:20px;font-weight:800}
.product-tab strong{display:block;font-family:"Alexandria";font-size:16px}
.product-tab small{display:block;margin-top:4px;color:#869298;font-size:10px;line-height:1.4}
.product-tab.active small{color:rgba(255,255,255,.48)}
.product-tab-arrow{font-size:20px;color:#a0aaae}
.product-tab.active .product-tab-arrow{color:#65d8d1}
.product-panel{position:relative;min-height:665px;overflow:hidden;border:1px solid #e0e7e7;border-radius:30px;background:#fff;box-shadow:0 24px 65px rgba(6,30,42,.07)}
.product-panel:before{content:"";position:absolute;left:-160px;bottom:-190px;width:440px;height:440px;border-radius:50%;background:var(--product-glow);filter:blur(30px)}
.product-panel-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr .92fr;gap:40px;align-items:center;min-height:665px;padding:48px}
.product-label{display:inline-flex;padding:8px 13px;border-radius:999px;font-size:12px;font-weight:800}
.product-copy h3{margin:19px 0 15px;font-family:"Alexandria";font-size:clamp(30px,3.3vw,47px);line-height:1.25}
.product-copy>p{margin:0 0 27px;color:var(--muted);font-size:16px}
.product-features{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.product-feature{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid #e6ebeb;border-radius:13px;background:rgba(255,255,255,.75);font-size:12px;font-weight:700}
.product-feature i{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;font-style:normal}
.product-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.product-media{position:relative}
.product-main-image{aspect-ratio:4/5;border-radius:25px;box-shadow:0 25px 60px rgba(5,30,43,.14);background:#eef4f4}
.product-main-image img{object-fit:cover}
.product-dots{display:flex;justify-content:center;gap:7px;margin-top:16px}
.product-dot{width:10px;height:10px;border-radius:50%;background:#ccd5d6;cursor:pointer;padding:0}
.product-dot.active{width:28px;border-radius:999px;background:var(--active-color)}

/* Impact */
.impact{position:relative;background:linear-gradient(125deg,#04131e,#092534);color:#fff;overflow:hidden}
.impact-grid{opacity:.65}
.impact-content{position:relative}
.impact-statement{display:grid;grid-template-columns:1fr 250px;gap:60px;align-items:end}
.impact-statement h2{max-width:850px;margin:14px 0 0;font-family:"Alexandria";font-size:clamp(40px,5.6vw,76px);line-height:1.22;letter-spacing:-.045em}
.impact-counter{padding:28px;border:1px solid rgba(255,255,255,.1);border-radius:23px;background:rgba(255,255,255,.04);text-align:center}
.impact-counter strong{display:block;color:#55d7d0;font-family:"Alexandria";font-size:54px}
.impact-counter span{display:block;color:rgba(255,255,255,.48);font-size:11px;line-height:1.7}
.impact-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:56px}
.impact-pillars article{padding:29px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(255,255,255,.035)}
.impact-pillars span{color:#55d7d0;font-family:"Alexandria";font-size:11px}
.impact-pillars h3{margin:18px 0 8px;font-family:"Alexandria";font-size:20px}
.impact-pillars p{margin:0;color:rgba(255,255,255,.48);font-size:13px}
.tech-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:24px}
.tech-row span{padding:9px 14px;border:1px solid rgba(255,255,255,.1);border-radius:999px;color:rgba(255,255,255,.54);font-size:11px;font-weight:800}

/* Process */
.process{background:#fff}
.process-line{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.process-line:before{content:"";position:absolute;top:27px;right:9%;left:9%;height:1px;background:linear-gradient(90deg,transparent,var(--teal),transparent)}
.process-line article{position:relative;padding-top:74px;text-align:center}
.process-line b{position:absolute;top:0;right:50%;transform:translateX(50%);display:grid;place-items:center;width:56px;height:56px;border:6px solid #fff;border-radius:50%;background:var(--ink);color:#5bd7d0;font-family:"Alexandria";font-size:11px;box-shadow:0 10px 25px rgba(5,26,38,.16)}
.process-line h3{margin:0;font-family:"Alexandria";font-size:16px}
.process-line p{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.8}

/* Media */
.media{background:#eef3f2}
.channel-card{display:grid;grid-template-columns:74px 1fr auto;gap:18px;align-items:center;padding:20px 24px;border:1px solid #dce5e4;border-radius:22px;background:#fff;box-shadow:0 15px 40px rgba(5,30,42,.06)}
.channel-mark{display:grid;place-items:center;width:64px;height:64px;border-radius:19px;background:#f42f3c;color:#fff;font-size:24px;box-shadow:0 12px 28px rgba(244,47,60,.23)}
.channel-card small{color:var(--teal);font-size:11px;font-weight:800}
.channel-card h3{margin:5px 0 2px;font-family:"Alexandria";font-size:19px}
.channel-card p{margin:0;color:#879297;font-size:11px}
.channel-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.channel-links a{padding:9px 12px;border:1px solid #dce4e4;border-radius:999px;background:#fafcfc;font-size:10px;font-weight:800}
.youtube-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:24px}
.video-card{overflow:hidden;padding:0;border:1px solid #dce5e4;border-radius:20px;background:#fff;text-align:right;cursor:pointer;transition:.22s}
.video-card:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(5,30,42,.11)}
.video-thumb{position:relative;aspect-ratio:16/10;background:#0a1e2a}
.video-thumb img{width:100%;height:100%;object-fit:cover}
.play-circle{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:56px;height:56px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:rgba(4,22,34,.78);color:#fff;font-size:18px;box-shadow:0 12px 30px rgba(0,0,0,.24);backdrop-filter:blur(10px)}
.video-tag{position:absolute;right:12px;top:12px;padding:6px 10px;border-radius:999px;background:rgba(5,23,34,.82);color:#fff;font-size:9px;font-weight:800}
.video-copy{padding:16px}
.video-copy h3{min-height:45px;margin:0;font-family:"Alexandria";font-size:13px;line-height:1.7}
.video-copy span{display:block;margin-top:8px;color:var(--teal);font-size:10px;font-weight:800}
.subheading,.gallery-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-top:70px;margin-bottom:22px}
.subheading span,.gallery-head span{color:var(--teal);font-size:11px;font-weight:800}
.subheading h3,.gallery-head h3{margin:6px 0 0;font-family:"Alexandria";font-size:27px}
.subheading p,.gallery-head p{max-width:460px;margin:0;color:var(--muted);font-size:12px}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.quick-card{position:relative;overflow:hidden;aspect-ratio:16/10;padding:0;border-radius:22px;background:#071b27;color:#fff;cursor:pointer}
.quick-card:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,18,27,.88),transparent 62%)}
.quick-card img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.quick-card:hover img{transform:scale(1.04)}
.quick-card strong{position:absolute;right:20px;bottom:17px;z-index:2;font-family:"Alexandria";font-size:14px}
.quick-card .play-circle{z-index:2}
.gallery-section{margin-top:70px;padding:38px;border:1px solid #dbe4e4;border-radius:30px;background:#fff}
.gallery-head{margin:0 0 22px}
.gallery-filters{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.filter-button{padding:9px 14px;border:1px solid #dce5e5;border-radius:999px;background:#f8fafa;color:#607078;font-size:11px;font-weight:800;cursor:pointer}
.filter-button.active{border-color:var(--ink);background:var(--ink);color:#fff}
.gallery-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.gallery-card{overflow:hidden;padding:0;border:1px solid #e0e7e7;border-radius:16px;background:#fff;text-align:right;cursor:pointer;transition:.22s}
.gallery-card:hover{transform:translateY(-4px);box-shadow:0 14px 35px rgba(5,30,42,.1)}
.gallery-card .image-shell{aspect-ratio:1/1.2}
.gallery-card img{width:100%;height:100%;object-fit:cover}
.gallery-caption{padding:12px}
.gallery-caption small{display:block;color:var(--teal);font-size:8px;font-weight:800}
.gallery-caption strong{display:block;margin-top:4px;font-size:10px;line-height:1.6}
.gallery-more{display:block;margin:22px auto 0;padding:11px 20px;border:1px solid #d8e2e2;border-radius:999px;background:#fff;color:var(--text);font-weight:800;cursor:pointer}

/* CTA + contact */
.final-cta{padding:30px 0;background:#eef3f2}
.final-cta-panel{display:flex;align-items:center;justify-content:space-between;gap:50px;padding:55px 60px;border-radius:30px;background:
radial-gradient(circle at 5% 100%,rgba(100,54,199,.25),transparent 35%),
radial-gradient(circle at 90% 0,rgba(21,185,176,.25),transparent 35%),
var(--ink);color:#fff;box-shadow:0 30px 75px rgba(4,23,34,.2)}
.final-cta-panel span{color:#5fd8d1;font-size:11px;font-weight:800}
.final-cta-panel h2{max-width:720px;margin:8px 0 8px;font-family:"Alexandria";font-size:clamp(30px,4vw,48px);line-height:1.35}
.final-cta-panel p{margin:0;color:rgba(255,255,255,.52);font-size:13px}
.final-cta-panel>div:last-child{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;min-width:320px}
.contact{background:#fff}
.contact-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:start}
.contact-copy>p{margin:22px 0 30px;color:var(--muted);font-size:16px}
.contact-form{display:grid;gap:14px}
.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}
.contact-form label{display:grid;gap:7px;color:#405159;font-size:12px;font-weight:800}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #dbe3e4;border-radius:14px;background:#f9fbfb;color:var(--text);padding:14px 15px;outline:0;transition:.2s}
.contact-form textarea{resize:vertical}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--teal);background:#fff;box-shadow:0 0 0 4px rgba(9,156,152,.08)}
.contact-form .invalid{border-color:#d94646}
.error{min-height:14px;color:#c63f3f;font-size:10px}
.contact-form button{justify-self:start;margin-top:5px}
.contact-card{overflow:hidden;border:1px solid #e0e6e6;border-radius:29px;background:var(--ink);color:#fff;box-shadow:0 24px 65px rgba(5,28,40,.16)}
.contact-image{aspect-ratio:1.1/1}
.contact-card-body{padding:28px}
.contact-brand{display:flex;align-items:center;gap:13px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.1)}
.contact-mark{width:55px;height:55px;border-radius:50%;background:#fff}
.contact-mark img{object-fit:contain;padding:4px}
.contact-brand strong{display:block;font-family:"Alexandria";font-size:19px}
.contact-brand small{display:block;margin-top:3px;color:rgba(255,255,255,.43);font-size:9px}
.contact-items{display:grid;gap:9px;margin-top:21px}
.contact-items>a,.contact-items>div{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 14px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.035)}
.contact-items span{color:rgba(255,255,255,.43);font-size:10px}
.contact-items b{color:#fff;font-size:11px;text-align:left}

/* Footer */
.footer{border-top:1px solid rgba(255,255,255,.07);background:#03101a;color:#fff}
.footer-grid{display:grid;grid-template-columns:1.1fr .7fr 1fr;gap:55px;padding-top:55px;padding-bottom:55px}
.footer-brand{display:flex;align-items:center;gap:12px}
.footer-brand strong{display:block;font-family:"Alexandria";font-size:24px}
.footer-brand small{display:block;margin-top:3px;color:rgba(255,255,255,.38);font-size:10px;font-weight:800}
.footer-grid>div>p{max-width:430px;margin:18px 0 0;color:rgba(255,255,255,.47);font-size:13px;line-height:1.85}
.footer h3{margin:0;font-family:"Alexandria";font-size:15px}
.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:17px}
.footer-links a,.footer-contact a,.footer-contact span{color:rgba(255,255,255,.48);font-size:12px;font-weight:700;transition:.2s}
.footer-links a:hover,.footer-contact a:hover{color:#66d8d0}
.footer-contact{display:grid;gap:12px;margin-top:17px}
.copyright{padding:18px;text-align:center;border-top:1px solid rgba(255,255,255,.07);color:rgba(255,255,255,.3);font-size:11px;font-weight:700}
.floating-whatsapp{position:fixed;left:25px;bottom:25px;z-index:90;display:grid;place-items:center;width:62px;height:62px;border:8px solid rgba(255,255,255,.13);border-radius:50%;background:#20d46b;box-shadow:0 15px 45px rgba(19,174,88,.35)}
.floating-whatsapp span{width:20px;height:20px;border:2px solid #fff;border-radius:50%;position:relative}
.floating-whatsapp span:after{content:"";position:absolute;left:-3px;bottom:-3px;width:7px;height:7px;border-left:2px solid #fff;transform:rotate(25deg)}

/* Modal */
.modal{position:fixed;inset:0;z-index:180;display:none;place-items:center;padding:20px}
.modal.open{display:grid}
.modal-backdrop{position:absolute;inset:0;background:rgba(2,13,21,.84);backdrop-filter:blur(12px)}
.modal-panel{position:relative;width:min(980px,100%);max-height:92vh;overflow:auto;border:1px solid rgba(255,255,255,.12);border-radius:28px;background:#081c2b;color:#fff;box-shadow:0 35px 100px rgba(0,0,0,.42)}
.modal-close{position:absolute;left:17px;top:17px;z-index:3;display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:rgba(0,0,0,.24);color:#fff;font-size:28px;cursor:pointer}
.modal-panel>header{padding:30px 78px 22px 30px}
.modal-panel>header span{color:#57d6ce;font-size:10px;font-weight:800}
.modal-panel>header h2{margin:7px 0 5px;font-family:"Alexandria";font-size:25px}
.modal-panel>header p{margin:0;color:rgba(255,255,255,.48);font-size:11px}
.modal-body{padding:0 28px 28px}
.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 28px;border-top:1px solid rgba(255,255,255,.09);color:rgba(255,255,255,.42);font-size:10px}
.modal-footer a{color:#67ddd5;font-weight:800}
.video-frame{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:20px;background:#000}
.video-frame iframe,.square-frame iframe,.square-frame video{width:100%;height:100%;border:0}
.square-frame{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:20px;background:#000}
.gallery-modal-image{max-height:68vh;border-radius:20px;background:#fff}
.gallery-modal-image img{width:100%;max-height:68vh;object-fit:contain}
.modal-tabs{display:flex;gap:7px;margin-bottom:12px}
.modal-tab{padding:9px 14px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:transparent;color:rgba(255,255,255,.55);font-size:11px;font-weight:800;cursor:pointer}
.modal-tab.active{background:#fff;color:var(--ink)}

/* Reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:none}

/* Responsive */
@media (max-width:1100px){
  :root{--container:940px}
  .desktop-links{display:none}
  .floating-nav{justify-content:space-between}
  .brand{min-width:0}
  .nav-cta{margin-right:auto}
  .menu-toggle{display:block}
  .hero{min-height:auto}
  .hero-layout{grid-template-columns:1fr 430px;gap:42px}
  .hero h1{font-size:clamp(48px,7vw,72px)}
  .product-explorer{grid-template-columns:260px 1fr}
  .product-panel-inner{padding:36px;gap:25px}
  .youtube-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:860px){
  .container{width:min(100% - 28px,var(--container))}
  .section{padding:78px 0}
  .floating-header{inset:8px 0 auto}
  .floating-nav{height:62px;padding:6px 7px 6px 12px}
  .brand-logo{width:48px;height:48px}
  .brand-copy{display:none}
  .nav-cta{display:inline-flex}
  .hero{padding-top:115px}
  .hero-layout{grid-template-columns:1fr}
  .hero-copy{text-align:center}
  .eyebrow{margin-inline:auto}
  .hero h1{max-width:700px;margin-inline:auto;font-size:clamp(48px,11vw,78px)}
  .hero-copy>p{margin-inline:auto}
  .hero-actions,.trust-line{justify-content:center}
  .metric-grid{max-width:700px;margin-inline:auto;margin-top:34px}
  .hero-visual{max-width:520px;margin:30px auto 0}
  .note-top{right:-8px}
  .note-bottom{left:-8px}
  .sector-inner{display:block;text-align:center}
  .sector-chips{justify-content:center;margin-top:20px}
  .about-layout,.contact-layout{grid-template-columns:1fr;gap:55px}
  .about-media{max-width:600px;margin-inline:auto}
  .section-heading{display:block}
  .section-heading>p{margin-top:17px}
  .product-explorer{display:block}
  .product-tabs{display:flex;overflow-x:auto;padding:0 0 12px;scroll-snap-type:x mandatory}
  .product-tab{min-width:245px;scroll-snap-align:start}
  .product-panel-inner{grid-template-columns:1fr;min-height:auto}
  .product-main-image{max-width:470px;margin-inline:auto}
  .impact-statement{grid-template-columns:1fr}
  .impact-counter{max-width:260px}
  .impact-pillars{grid-template-columns:1fr}
  .process-line{grid-template-columns:1fr;gap:6px}
  .process-line:before{right:28px;left:auto;top:25px;bottom:25px;width:1px;height:auto}
  .process-line article{padding:15px 80px 15px 0;text-align:right}
  .process-line b{right:0;top:9px;transform:none}
  .quick-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:repeat(3,1fr)}
  .final-cta-panel{display:block;padding:45px 35px}
  .final-cta-panel>div:last-child{justify-content:flex-start;min-width:0;margin-top:28px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-grid>div:first-child{grid-column:1/-1}
}
@media (max-width:560px){
  .container{width:calc(100% - 24px)}
  .section{padding:66px 0}
  .mobile-menu{width:calc(100% - 24px)}
  .menu-toggle{display:block;width:48px;height:48px}
  .hero{padding:112px 0 70px}
  .hero-layout{gap:20px}
  .hero h1{font-size:clamp(43px,13.6vw,62px);line-height:1.16}
  .hero-copy>p{font-size:17px;line-height:1.95}
  .hero-actions{display:grid}
  .hero-actions .btn{width:100%}
  .trust-line{gap:10px;font-size:11px}
  .metric-grid{grid-template-columns:1fr;gap:8px}
  .metric-grid article{display:grid;grid-template-columns:1fr auto;align-items:center;text-align:right;padding:14px 16px}
  .metric-grid small{grid-column:1}
  .metric-grid strong{grid-row:1/3;grid-column:2;margin:0;font-size:24px}
  .metric-grid span{grid-column:1}
  .hero-visual{margin-top:22px}
  .suite-frame{padding:11px;border-radius:25px}
  .suite-art{border-radius:19px}
  .floating-note{display:none}
  .sector-inner h2{font-size:18px}
  .sector-chips span{font-size:10px;padding:8px 10px}
  .section-heading h2,.about-copy h2,.contact-copy h2{font-size:36px}
  .about-copy>p,.contact-copy>p{font-size:15px}
  .made-in-iraq{right:12px;bottom:-14px}
  .product-tab{min-width:220px}
  .product-panel{border-radius:23px}
  .product-panel-inner{padding:25px 19px}
  .product-copy h3{font-size:30px}
  .product-features{grid-template-columns:1fr}
  .product-actions{display:grid}
  .product-actions .btn{width:100%}
  .impact-statement h2{font-size:39px}
  .impact-counter{max-width:none}
  .youtube-grid{grid-template-columns:1fr}
  .channel-card{grid-template-columns:58px 1fr;padding:16px}
  .channel-mark{width:54px;height:54px}
  .channel-links{grid-column:1/-1;justify-content:flex-start}
  .subheading,.gallery-head{display:block}
  .subheading p,.gallery-head p{margin-top:10px}
  .gallery-section{padding:22px 14px;border-radius:23px}
  .gallery-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .gallery-caption{padding:9px}
  .final-cta-panel{padding:36px 22px;border-radius:24px}
  .final-cta-panel h2{font-size:31px}
  .final-cta-panel>div:last-child{display:grid}
  .form-row{grid-template-columns:1fr}
  .contact-card-body{padding:22px}
  .contact-items>a,.contact-items>div{display:block}
  .contact-items b{display:block;margin-top:5px;text-align:right}
  .footer-grid{grid-template-columns:1fr;gap:35px;padding-top:42px;padding-bottom:42px}
  .footer-grid>div:first-child{grid-column:auto}
  .floating-whatsapp{left:13px;bottom:13px;width:58px;height:58px}
  .modal{padding:9px}
  .modal-panel{border-radius:22px}
  .modal-panel>header{padding:25px 65px 18px 18px}
  .modal-body{padding:0 14px 18px}
  .modal-footer{display:block;padding:14px}
  .modal-footer a{display:block;margin-top:6px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
}

/* WordPress integration */
html { margin-top: 0 !important; }
body.admin-bar .floating-header { top: 46px; }
body.admin-bar .section-anchor { scroll-margin-top: 140px; }

/* Professional Arabic typography */
.floating-nav,
.mobile-menu,
.btn,
.contact-form input,
.contact-form select,
.contact-form textarea,
.product-tab,
.filter-button,
.gallery-more {
  font-family: "Tajawal", Arial, Tahoma, sans-serif;
}

/* Restrained animation system */
@keyframes tecton-float {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -12px, 0); }
}
@keyframes tecton-glow-drift {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(28px, -20px, 0) scale(1.08); }
}
@keyframes tecton-panel-in {
  from { opacity: 0; transform: translateY(16px) scale(.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes tecton-whatsapp-pulse {
  0%, 100% { box-shadow: 0 15px 45px rgba(19,174,88,.35), 0 0 0 0 rgba(32,212,107,.25); }
  50% { box-shadow: 0 15px 45px rgba(19,174,88,.35), 0 0 0 14px rgba(32,212,107,0); }
}
.hero-glow-one { animation: tecton-glow-drift 13s ease-in-out infinite; }
.hero-glow-two { animation: tecton-glow-drift 17s ease-in-out infinite reverse; }
.suite-frame { animation: tecton-float 7s ease-in-out infinite; }
.product-panel-inner { animation: tecton-panel-in .46s cubic-bezier(.22,.78,.28,1); }
.floating-whatsapp { animation: tecton-whatsapp-pulse 2.8s ease-in-out infinite; }

/* Generic WordPress content templates */
.wp-inner-header {
  min-height: 310px;
  padding: 120px 0 64px;
  color: #fff;
  background: radial-gradient(circle at 80% 20%, rgba(21,185,176,.22), transparent 34%), linear-gradient(120deg,#04131e,#092534);
}
.wp-inner-header__bar { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.wp-inner-brand { display:flex; align-items:center; gap:12px; color:#fff; }
.wp-inner-brand img { width:58px; height:58px; object-fit:contain; border-radius:50%; background:#fff; padding:4px; }
.wp-inner-brand strong { display:block; font-family:"Alexandria"; font-size:22px; }
.wp-inner-brand small { color:rgba(255,255,255,.5); font-size:11px; }
.wp-inner-header h1 { margin:54px 0 0; font-family:"Alexandria"; font-size:clamp(36px,5vw,64px); line-height:1.3; }
.wp-content-shell { min-height:45vh; padding:72px 0 100px; background:#fff; }
.wp-content-card { max-width:920px; margin:auto; padding:36px; border:1px solid #e2e9e9; border-radius:24px; background:#fff; box-shadow:0 20px 60px rgba(6,30,42,.08); }
.wp-content-card h1,.wp-content-card h2,.wp-content-card h3 { font-family:"Alexandria"; line-height:1.4; }
.wp-content-card a { color:var(--teal); text-decoration:underline; text-underline-offset:4px; }
.wp-content-card img { border-radius:18px; }
.wp-post-list { display:grid; gap:18px; }
.wp-post-item { padding:24px; border:1px solid #e1e8e8; border-radius:18px; }
.wp-post-item h2 { margin:0 0 8px; font-size:24px; }
.wp-post-meta { color:#7b878c; font-size:12px; }
.wp-pagination { margin-top:32px; }
.wp-pagination .page-numbers { display:inline-flex; min-width:38px; height:38px; align-items:center; justify-content:center; margin:3px; border:1px solid #dce4e4; border-radius:10px; }
.wp-pagination .current { background:var(--ink); color:#fff; }
.wp-generic-footer { padding:28px 0; background:#03101a; color:rgba(255,255,255,.55); text-align:center; font-size:12px; }

/* Mobile navigation keeps a compact CTA visible */
@media (max-width:860px) {
  .floating-nav { gap:8px; }
  .floating-nav .nav-cta {
    display:inline-flex;
    min-height:46px;
    min-width:118px;
    padding-inline:12px;
    margin-right:auto;
    font-size:12px;
  }
}
@media (max-width:782px) {
  body.admin-bar .floating-header { top:54px; }
  body.admin-bar .section-anchor { scroll-margin-top:150px; }
}
@media (max-width:560px) {
  .menu-toggle { flex:none; }
  .wp-inner-header { padding-top:100px; }
  .wp-content-card { padding:23px 18px; }
}


/* =========================================================
   Tecton v1.2 — standalone visual system and richer motion
   ========================================================= */

:root{
  --tecton-cyan:#35ddd1;
  --tecton-blue:#1678c8;
  --tecton-amber:#d38a19;
  --tecton-orange:#e36425;
}

body{
  background:#f3f7f6;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

.floating-nav{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.nav-progress{
  position:absolute;
  inset:auto 18px 0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#4ee5dc,#15b9b0,#7d61df);
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .08s linear;
  z-index:4;
}

/* --------------- hero --------------- */
.hero-v2{
  min-height:930px;
  padding:150px 0 110px;
  background:
    radial-gradient(circle at 78% 23%,rgba(21,185,176,.22),transparent 29%),
    radial-gradient(circle at 17% 76%,rgba(100,54,199,.16),transparent 34%),
    linear-gradient(124deg,#03111b 0%,#061b29 54%,#062733 100%);
}
.hero-noise{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.16;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E");
  mix-blend-mode:soft-light;
}
.hero-v2 .hero-grid-pattern{
  background-size:72px 72px;
  opacity:.72;
}
.hero-v2 .hero-layout{
  direction:ltr;
  grid-template-areas:"visual copy";
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:74px;
  align-items:center;
}
.hero-v2 .hero-copy{
  grid-area:copy;
  direction:rtl;
  text-align:right;
}
.hero-v2 .hero-visual{
  grid-area:visual;
  direction:rtl;
}
.hero-v2 .hero h1,
.hero-v2 h1{
  max-width:690px;
  margin:24px 0 20px;
  font-size:clamp(48px,5.45vw,78px);
  line-height:1.17;
  letter-spacing:-.045em;
}
.hero-v2 h1 em{
  display:inline;
  background:linear-gradient(90deg,#d7fffb 0%,#40d8cf 50%,#15b9b0 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-v2 .hero-copy>p{
  max-width:650px;
  font-size:18px;
  line-height:1.95;
}
.hero-v2 .metric-grid article{
  position:relative;
  overflow:hidden;
}
.hero-v2 .metric-grid article:before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:70px;
  height:70px;
  border-radius:50%;
  background:rgba(21,185,176,.12);
  filter:blur(18px);
}
.hero-v2 .metric-grid strong{
  font-size:25px;
}

/* Hero interactive composition */
.hero-v2 .hero-visual{
  position:relative;
  min-height:680px;
  perspective:1500px;
  --parallax-x:0px;
  --parallax-y:0px;
}
.stage-ring{
  position:absolute;
  border:1px solid rgba(91,227,218,.15);
  border-radius:50%;
  pointer-events:none;
  transform:translate(var(--parallax-x),var(--parallax-y));
  transition:transform .35s ease-out;
}
.stage-ring-one{
  width:520px;
  height:520px;
  left:28px;
  top:72px;
}
.stage-ring-two{
  width:385px;
  height:385px;
  left:94px;
  top:139px;
  border-style:dashed;
  animation:tecton-spin 24s linear infinite;
}
.stage-scan{
  position:absolute;
  left:68px;
  right:64px;
  top:102px;
  height:2px;
  z-index:6;
  opacity:.5;
  background:linear-gradient(90deg,transparent,#5ce9df,transparent);
  box-shadow:0 0 22px rgba(92,233,223,.72);
  animation:tecton-scan 5.8s ease-in-out infinite;
  pointer-events:none;
}
.hero-console{
  position:absolute;
  width:min(390px,68%);
  left:50%;
  top:50%;
  transform:
    translate(calc(-50% + var(--parallax-x)),calc(-50% + var(--parallax-y)))
    rotateX(var(--tilt-x,0deg))
    rotateY(var(--tilt-y,0deg));
  transform-style:preserve-3d;
  padding:15px;
  border:1px solid rgba(190,242,238,.18);
  border-radius:32px;
  background:
    radial-gradient(circle at var(--glow-x,50%) var(--glow-y,50%),rgba(74,224,214,.13),transparent 36%),
    rgba(6,27,40,.84);
  box-shadow:0 42px 95px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
  transition:transform .2s ease-out,box-shadow .25s ease;
  z-index:4;
}
.hero-console:hover{
  box-shadow:0 48px 105px rgba(0,0,0,.45),0 0 0 1px rgba(83,224,215,.12);
}
.hero-console-head,
.hero-console-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.hero-console-head{
  padding:2px 4px 13px;
  color:rgba(255,255,255,.64);
  font-size:11px;
  font-weight:800;
}
.hero-console-head>div{
  display:flex;
  align-items:center;
  gap:8px;
}
.console-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#4ee0d6;
  box-shadow:0 0 0 6px rgba(78,224,214,.08),0 0 18px rgba(78,224,214,.48);
}
.hero-console-head b{
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:#7fe6df;
  font-size:9px;
}
.hero-console-media{
  aspect-ratio:4/5;
  border-radius:24px;
  background:#fff;
}
.hero-console-media img{
  object-fit:cover;
}
.hero-console-foot{
  flex-wrap:wrap;
  justify-content:center;
  padding:14px 4px 3px;
}
.hero-console-foot span{
  display:flex;
  align-items:center;
  gap:6px;
  color:rgba(255,255,255,.5);
  font-size:9px;
  font-weight:700;
}
.hero-console-foot i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#47dcd2;
}
.hero-satellite{
  position:absolute;
  display:flex;
  align-items:center;
  gap:10px;
  width:190px;
  padding:10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  background:rgba(5,24,36,.84);
  box-shadow:0 20px 45px rgba(0,0,0,.26);
  backdrop-filter:blur(16px);
  transform:
    translate3d(calc(var(--sat-x,0px) + var(--parallax-x)),calc(var(--sat-y,0px) + var(--parallax-y)),0)
    rotateX(var(--tilt-x,0deg))
    rotateY(var(--tilt-y,0deg));
  transition:transform .22s ease-out,border-color .22s ease;
  z-index:5;
}
.hero-satellite:hover{
  border-color:rgba(75,227,217,.38);
}
.satellite-image{
  flex:none;
  width:58px;
  height:58px;
  border-radius:15px;
}
.satellite-image img{
  object-fit:cover;
}
.hero-satellite small{
  display:block;
  color:rgba(255,255,255,.42);
  font-size:8px;
  font-weight:700;
}
.hero-satellite strong{
  display:block;
  margin-top:4px;
  color:#fff;
  font-family:"Alexandria";
  font-size:14px;
}
.satellite-namo{
  left:0;
  top:100px;
  --sat-x:-4px;
  --sat-y:0px;
  animation:tecton-satellite-a 6.8s ease-in-out infinite;
}
.satellite-qandeel{
  right:0;
  top:195px;
  --sat-x:4px;
  --sat-y:0px;
  animation:tecton-satellite-b 7.6s ease-in-out infinite;
}
.satellite-thameen{
  left:25px;
  bottom:68px;
  --sat-x:-3px;
  --sat-y:0px;
  animation:tecton-satellite-c 7.2s ease-in-out infinite;
}
.hero-live-card{
  position:absolute;
  right:35px;
  bottom:85px;
  z-index:6;
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 16px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.94);
  color:var(--ink);
  box-shadow:0 22px 48px rgba(0,0,0,.25);
}
.live-wave{
  display:flex;
  align-items:flex-end;
  gap:3px;
  height:28px;
}
.live-wave i{
  width:3px;
  border-radius:999px;
  background:linear-gradient(#15b9b0,#6a4cd2);
  animation:tecton-wave 1.2s ease-in-out infinite;
}
.live-wave i:nth-child(1){height:11px}
.live-wave i:nth-child(2){height:24px;animation-delay:-.25s}
.live-wave i:nth-child(3){height:17px;animation-delay:-.5s}
.live-wave i:nth-child(4){height:26px;animation-delay:-.7s}
.hero-live-card small{
  display:block;
  color:#8a969b;
  font-size:8px;
}
.hero-live-card strong{
  display:block;
  margin-top:3px;
  font-size:11px;
}

/* --------------- about --------------- */
.about-mosaic{
  position:relative;
  min-height:650px;
}
.about-main{
  position:absolute;
  inset:0 70px 70px 0;
  border-radius:32px;
  box-shadow:var(--shadow);
  transform:
    rotateX(var(--tilt-x,0deg))
    rotateY(var(--tilt-y,0deg));
  transition:transform .2s ease-out;
}
.about-main img,
.about-secondary img{
  object-fit:cover;
}
.about-secondary{
  position:absolute;
  width:230px;
  height:285px;
  left:0;
  bottom:0;
  border:10px solid #fff;
  border-radius:27px;
  box-shadow:0 25px 55px rgba(5,30,42,.17);
}
.about-proof{
  position:absolute;
  right:15px;
  bottom:18px;
  width:245px;
  padding:20px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  background:rgba(6,27,40,.92);
  color:#fff;
  box-shadow:0 20px 45px rgba(4,24,35,.24);
  backdrop-filter:blur(14px);
}
.about-proof span{
  color:#5ddbd3;
  font-size:9px;
  font-weight:800;
}
.about-proof strong{
  display:block;
  margin-top:6px;
  font-family:"Alexandria";
  font-size:16px;
}
.about-proof small{
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.45);
  font-size:9px;
}
.about-v2 .made-in-iraq,
.about .made-in-iraq{
  right:auto;
  left:30px;
  bottom:-18px;
}

/* --------------- product explorer v2 --------------- */
.product-panel{
  min-height:690px;
}
.product-panel:before{
  width:500px;
  height:500px;
  background:var(--product-soft);
  opacity:.8;
}
.product-panel-inner{
  grid-template-columns:1.02fr .98fr;
  min-height:690px;
  padding:48px 48px 44px;
}
.product-copy-top{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px;
}
.product-label{
  background:var(--product-soft);
  color:var(--product-accent);
}
.product-media-note{
  color:#849095;
  font-size:10px;
  font-weight:800;
}
.product-copy h3{
  margin-top:18px;
}
.product-feature i{
  background:var(--product-soft);
  color:var(--product-accent);
}
.product-media-action{
  display:grid;
  grid-template-columns:46px 1fr auto;
  align-items:center;
  gap:12px;
  width:100%;
  margin-top:22px;
  padding:12px;
  border:1px solid #dfe7e7;
  border-radius:17px;
  background:linear-gradient(135deg,#fff,#f6f9f9);
  text-align:right;
  cursor:pointer;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.product-media-action:hover{
  transform:translateY(-3px);
  border-color:var(--product-accent);
  box-shadow:0 15px 35px rgba(5,30,42,.08);
}
.media-action-play{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:15px;
  background:var(--product-accent);
  color:#fff;
  box-shadow:0 10px 24px color-mix(in srgb,var(--product-accent) 28%,transparent);
}
.product-media-action small{
  display:block;
  color:var(--product-accent);
  font-size:9px;
  font-weight:800;
}
.product-media-action strong{
  display:block;
  margin-top:4px;
  color:var(--text);
  font-size:11px;
  line-height:1.6;
}
.product-media-action b{
  color:var(--product-accent);
  font-size:10px;
}
.product-primary-action{
  background:var(--product-accent);
  color:#fff;
  box-shadow:0 15px 34px color-mix(in srgb,var(--product-accent) 25%,transparent);
}
.product-media-stack{
  position:relative;
  min-height:590px;
  perspective:1300px;
}
.product-main-image{
  position:absolute;
  inset:0 64px 70px 0;
  aspect-ratio:auto;
  border-radius:27px;
  transform:
    rotateX(var(--tilt-x,0deg))
    rotateY(var(--tilt-y,0deg));
  transition:transform .2s ease-out;
}
.product-main-image:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to top,rgba(4,23,34,.26),transparent 40%);
}
.product-main-image img{
  object-fit:cover;
}
.product-image-index{
  position:absolute;
  right:15px;
  bottom:14px;
  z-index:2;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(4,22,34,.72);
  color:#fff;
  font-family:"Alexandria";
  font-size:9px;
  backdrop-filter:blur(12px);
}
.product-secondary-image{
  position:absolute;
  left:0;
  bottom:24px;
  width:180px;
  height:215px;
  z-index:3;
  border:9px solid #fff;
  border-radius:23px;
  box-shadow:0 22px 50px rgba(5,30,42,.19);
}
.product-secondary-image img{
  object-fit:cover;
}
.product-media-status{
  position:absolute;
  right:15px;
  bottom:20px;
  z-index:4;
  display:flex;
  align-items:center;
  gap:14px;
  padding:11px 14px;
  border:1px solid #e2e8e8;
  border-radius:15px;
  background:#fff;
  box-shadow:0 15px 35px rgba(5,30,42,.12);
}
.product-media-status span{
  display:flex;
  align-items:center;
  gap:6px;
  color:#78868b;
  font-size:9px;
}
.product-media-status i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#35c99d;
  box-shadow:0 0 0 5px rgba(53,201,157,.1);
}
.product-media-status b{
  color:var(--product-accent);
  font-family:"Alexandria";
  font-size:11px;
}
.product-dots{
  position:absolute;
  left:50%;
  bottom:-4px;
  transform:translateX(-50%);
  z-index:6;
}
.product-dot.active{
  background:var(--product-accent);
}

/* --------------- impact redesign --------------- */
.impact{
  padding:110px 0;
}
.impact-glow{
  position:absolute;
  width:500px;
  height:500px;
  left:-170px;
  top:80px;
  border-radius:50%;
  background:rgba(100,54,199,.18);
  filter:blur(110px);
  pointer-events:none;
}
.impact-layout{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:80px;
  align-items:center;
  direction:rtl;
}
.impact-copy{
  direction:rtl;
}
.impact-copy h2{
  margin:15px 0 18px;
  font-family:"Alexandria";
  font-size:clamp(42px,4.5vw,64px);
  line-height:1.28;
  letter-spacing:-.04em;
}
.impact-copy>p{
  margin:0;
  color:rgba(255,255,255,.58);
  font-size:17px;
}
.impact-copy .impact-counter{
  max-width:270px;
  margin-top:28px;
}
.impact-visual{
  position:relative;
  min-height:610px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:34px;
  background:
    radial-gradient(circle at var(--glow-x,50%) var(--glow-y,50%),rgba(44,220,208,.12),transparent 34%),
    rgba(255,255,255,.035);
  box-shadow:0 30px 85px rgba(0,0,0,.26);
  overflow:hidden;
  transform:
    rotateX(var(--tilt-x,0deg))
    rotateY(var(--tilt-y,0deg));
  transition:transform .2s ease-out;
  perspective:1200px;
}
.impact-visual:before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:42px 42px;
  pointer-events:none;
}
.impact-device{
  position:absolute;
  width:330px;
  left:50%;
  top:50%;
  z-index:3;
  transform:translate(-50%,-50%);
  padding:13px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:rgba(5,24,36,.88);
  box-shadow:0 35px 70px rgba(0,0,0,.36);
  backdrop-filter:blur(14px);
}
.impact-device header,
.impact-device footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.impact-device header{
  padding:2px 4px 11px;
  color:rgba(255,255,255,.56);
  font-size:10px;
  font-weight:800;
}
.impact-device header span{
  display:flex;
  align-items:center;
  gap:7px;
}
.impact-device header i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#42d7cf;
  box-shadow:0 0 0 5px rgba(66,215,207,.08);
}
.impact-device header b{
  color:#4be1d8;
  font-size:8px;
}
.impact-device-media{
  aspect-ratio:4/5;
  border-radius:20px;
  background:#fff;
}
.impact-device-media img{
  object-fit:cover;
}
.impact-device footer{
  justify-content:center;
  flex-wrap:wrap;
  padding:12px 2px 1px;
}
.impact-device footer span{
  color:rgba(255,255,255,.42);
  font-size:8px;
}
.impact-connections{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:1;
  overflow:visible;
}
.impact-connections path{
  fill:none;
  stroke:rgba(68,222,212,.32);
  stroke-width:2;
  stroke-dasharray:8 11;
  animation:tecton-dash 8s linear infinite;
}
.flow-node{
  position:absolute;
  z-index:4;
  min-width:130px;
  padding:12px 14px 12px 37px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(5,24,36,.88);
  box-shadow:0 16px 38px rgba(0,0,0,.24);
  backdrop-filter:blur(12px);
}
.flow-node i{
  position:absolute;
  right:14px;
  top:18px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#4be0d7;
  box-shadow:0 0 0 6px rgba(75,224,215,.08);
  animation:tecton-node-pulse 2.2s ease-in-out infinite;
}
.flow-node b{
  display:block;
  color:#fff;
  font-size:11px;
}
.flow-node small{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.4);
  font-size:8px;
}
.flow-node-one{
  right:32px;
  top:72px;
}
.flow-node-two{
  left:25px;
  top:135px;
}
.flow-node-three{
  right:42px;
  bottom:92px;
}
.impact-status{
  position:absolute;
  left:28px;
  bottom:35px;
  z-index:5;
  display:flex;
  align-items:center;
  gap:11px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:#fff;
  color:var(--ink);
  box-shadow:0 18px 40px rgba(0,0,0,.24);
}
.impact-status>span{
  width:13px;
  height:13px;
  border:3px solid #20ba91;
  border-radius:50%;
  box-shadow:0 0 0 5px rgba(32,186,145,.11);
}
.impact-status small{
  display:block;
  color:#869296;
  font-size:8px;
}
.impact-status strong{
  display:block;
  margin-top:3px;
  font-size:10px;
}
.impact .impact-pillars{
  margin-top:65px;
}
.impact .tech-row{
  margin-top:18px;
}

/* --------------- richer media section --------------- */
.media-v2{
  background:
    radial-gradient(circle at 8% 10%,rgba(21,185,176,.1),transparent 28%),
    #eef3f2;
}
.channel-card-v2{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#fff,#f8fbfb);
}
.channel-card-v2:after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  left:-70px;
  bottom:-95px;
  border-radius:50%;
  background:rgba(244,47,60,.08);
}
.media-showcase{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(330px,.55fr);
  gap:17px;
  margin-top:22px;
}
.featured-video{
  min-height:590px;
}
.featured-video-button{
  position:relative;
  width:100%;
  height:100%;
  min-height:590px;
  overflow:hidden;
  padding:0;
  border-radius:28px;
  background:#071b27;
  color:#fff;
  text-align:right;
  cursor:pointer;
  box-shadow:0 28px 70px rgba(5,30,42,.17);
}
.featured-video-button>img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s cubic-bezier(.2,.75,.25,1);
}
.featured-video-button:hover>img{
  transform:scale(1.035);
}
.featured-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to top,rgba(3,17,26,.92) 0%,rgba(3,17,26,.12) 58%,rgba(3,17,26,.2) 100%),
    linear-gradient(100deg,rgba(3,17,26,.55),transparent 55%);
}
.featured-product{
  position:absolute;
  right:24px;
  top:24px;
  padding:8px 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(5,24,36,.62);
  font-size:10px;
  font-weight:800;
  backdrop-filter:blur(10px);
}
.featured-play{
  position:absolute;
  left:50%;
  top:47%;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  width:86px;
  height:86px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:50%;
  background:rgba(5,24,36,.72);
  font-size:25px;
  box-shadow:0 18px 45px rgba(0,0,0,.32);
  backdrop-filter:blur(14px);
  transition:transform .25s ease,background .25s ease;
}
.featured-video-button:hover .featured-play{
  transform:translate(-50%,-50%) scale(1.08);
  background:rgba(21,185,176,.85);
}
.featured-copy{
  position:absolute;
  right:28px;
  left:28px;
  bottom:28px;
  z-index:2;
}
.featured-copy small{
  color:#62ddd6;
  font-size:10px;
  font-weight:800;
}
.featured-copy strong{
  display:block;
  margin-top:8px;
  font-family:"Alexandria";
  font-size:clamp(24px,3vw,40px);
  line-height:1.35;
}
.featured-copy em{
  display:block;
  margin-top:8px;
  color:rgba(255,255,255,.58);
  font-size:12px;
}
.media-playlist{
  display:grid;
  gap:10px;
  align-content:start;
}
.playlist-item{
  display:grid;
  grid-template-columns:105px 1fr 28px;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:135px;
  padding:11px;
  border:1px solid #dce5e4;
  border-radius:20px;
  background:#fff;
  text-align:right;
  cursor:pointer;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.playlist-item:hover{
  transform:translateX(-4px);
  box-shadow:0 14px 34px rgba(5,30,42,.08);
}
.playlist-item.active{
  border-color:rgba(9,156,152,.35);
  background:linear-gradient(135deg,#fff,#edf9f8);
  box-shadow:0 16px 38px rgba(5,30,42,.09);
}
.playlist-thumb{
  width:105px;
  height:108px;
  border-radius:15px;
}
.playlist-thumb img{
  object-fit:cover;
}
.playlist-item small{
  display:block;
  color:var(--teal);
  font-size:8px;
  font-weight:800;
}
.playlist-item strong{
  display:block;
  margin-top:5px;
  font-family:"Alexandria";
  font-size:12px;
  line-height:1.55;
}
.playlist-item em{
  display:block;
  margin-top:5px;
  color:#879297;
  font-size:8px;
  line-height:1.55;
}
.playlist-item>b{
  color:#bdc8ca;
  font-family:"Alexandria";
  font-size:10px;
}
.product-channel-section,
.brand-reels-section{
  margin-top:72px;
}
.subheading.compact{
  margin-top:0;
}
.product-channel-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}
.product-channel-card{
  position:relative;
  overflow:hidden;
  border:1px solid #dce4e4;
  border-radius:22px;
  background:#fff;
  transition:transform .24s ease,box-shadow .24s ease;
}
.product-channel-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 45px rgba(5,30,42,.11);
}
.product-channel-image{
  position:relative;
  aspect-ratio:1/1;
}
.product-channel-image:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(4,23,34,.55),transparent 52%);
}
.product-channel-image img{
  object-fit:cover;
}
.product-channel-image>span{
  position:absolute;
  right:14px;
  bottom:12px;
  z-index:2;
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:13px;
  background:rgba(5,24,36,.72);
  color:#fff;
  font-family:"Alexandria";
  font-size:15px;
  backdrop-filter:blur(10px);
}
.product-channel-copy{
  padding:17px;
}
.product-channel-copy>small{
  color:var(--card-accent);
  font-size:9px;
  font-weight:800;
}
.product-channel-copy h3{
  min-height:54px;
  margin:6px 0 7px;
  font-family:"Alexandria";
  font-size:14px;
  line-height:1.7;
}
.product-channel-copy p{
  min-height:38px;
  margin:0 0 13px;
  color:#7d898e;
  font-size:9px;
  line-height:1.7;
}
.product-channel-action{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:42px;
  padding:0 12px;
  border-radius:12px;
  background:var(--card-soft);
  color:var(--card-accent);
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}
.brand-reels{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px;
}
.brand-reel-card{
  position:relative;
  min-height:390px;
  overflow:hidden;
  padding:0;
  border-radius:24px;
  background:#071b27;
  color:#fff;
  text-align:right;
  cursor:pointer;
  box-shadow:0 20px 50px rgba(5,30,42,.13);
}
.brand-reel-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .55s ease;
}
.brand-reel-card:hover img{
  transform:scale(1.045);
}
.brand-reel-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(3,17,26,.93),transparent 58%);
}
.brand-reel-index{
  position:absolute;
  top:17px;
  right:17px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(5,24,36,.65);
  font-family:"Alexandria";
  font-size:9px;
  backdrop-filter:blur(10px);
}
.brand-reel-play{
  position:absolute;
  left:20px;
  top:20px;
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:50%;
  background:rgba(5,24,36,.68);
  backdrop-filter:blur(10px);
}
.brand-reel-copy{
  position:absolute;
  right:20px;
  left:20px;
  bottom:20px;
}
.brand-reel-copy small{
  color:#62ddd6;
  font-size:9px;
  font-weight:800;
}
.brand-reel-copy strong{
  display:block;
  margin-top:7px;
  font-family:"Alexandria";
  font-size:17px;
  line-height:1.6;
}
.brand-reel-copy em{
  display:block;
  margin-top:5px;
  color:rgba(255,255,255,.48);
  font-size:9px;
}
.local-video-frame video{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}

/* Remove the previous gallery presentation entirely. */
.gallery-section,
.gallery-grid,
.gallery-filters,
.gallery-more,
.gallery-head{
  display:none!important;
}

/* generic interactive tilt */
.tilt-card{
  transform-style:preserve-3d;
  will-change:transform;
}
.tilt-card:after{
  background:
    radial-gradient(circle at var(--glow-x,50%) var(--glow-y,50%),rgba(255,255,255,.13),transparent 35%),
    transparent;
}

/* reveal refinement */
.reveal{
  transition:
    opacity .72s cubic-bezier(.22,.75,.28,1) var(--reveal-delay,0ms),
    transform .72s cubic-bezier(.22,.75,.28,1) var(--reveal-delay,0ms);
}

/* --------------- animations --------------- */
@keyframes tecton-spin{
  to{transform:rotate(360deg)}
}
@keyframes tecton-scan{
  0%,100%{transform:translateY(0);opacity:0}
  12%{opacity:.65}
  50%{transform:translateY(455px);opacity:.45}
  88%{opacity:.65}
}
@keyframes tecton-wave{
  0%,100%{transform:scaleY(.55);opacity:.55}
  50%{transform:scaleY(1);opacity:1}
}
@keyframes tecton-satellite-a{
  0%,100%{margin-top:0}
  50%{margin-top:-12px}
}
@keyframes tecton-satellite-b{
  0%,100%{margin-top:0}
  50%{margin-top:10px}
}
@keyframes tecton-satellite-c{
  0%,100%{margin-bottom:0}
  50%{margin-bottom:12px}
}
@keyframes tecton-dash{
  to{stroke-dashoffset:-190}
}
@keyframes tecton-node-pulse{
  0%,100%{box-shadow:0 0 0 5px rgba(75,224,215,.08)}
  50%{box-shadow:0 0 0 11px rgba(75,224,215,0)}
}

/* --------------- responsive v1.2 --------------- */
@media (max-width:1180px){
  .hero-v2 .hero-layout{
    gap:42px;
    grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  }
  .hero-v2 .hero-visual{
    min-height:620px;
  }
  .hero-console{
    width:min(360px,70%);
  }
  .stage-ring-one{
    width:470px;
    height:470px;
  }
  .stage-ring-two{
    width:350px;
    height:350px;
  }
  .product-channel-grid{
    grid-template-columns:repeat(3,1fr);
  }
}
@media (max-width:960px){
  .hero-v2{
    min-height:auto;
    padding-bottom:88px;
  }
  .hero-v2 .hero-layout{
    direction:rtl;
    grid-template-areas:"copy" "visual";
    grid-template-columns:1fr;
    gap:45px;
  }
  .hero-v2 .hero-copy{
    text-align:center;
  }
  .hero-v2 .eyebrow{
    margin-inline:auto;
  }
  .hero-v2 h1,
  .hero-v2 .hero-copy>p{
    margin-inline:auto;
  }
  .hero-v2 .hero-actions,
  .hero-v2 .trust-line{
    justify-content:center;
  }
  .hero-v2 .metric-grid{
    max-width:720px;
    margin-inline:auto;
    margin-top:34px;
  }
  .hero-v2 .hero-visual{
    width:min(680px,100%);
    min-height:650px;
    margin-inline:auto;
  }
  .about-mosaic{
    max-width:650px;
    margin-inline:auto;
  }
  .product-panel-inner{
    grid-template-columns:1fr;
  }
  .product-media-stack{
    min-height:630px;
    max-width:590px;
    width:100%;
    margin-inline:auto;
  }
  .impact-layout{
    grid-template-columns:1fr;
    gap:48px;
  }
  .impact-copy{
    text-align:center;
  }
  .impact-copy .impact-counter{
    margin-inline:auto;
  }
  .impact-visual{
    width:min(680px,100%);
    margin-inline:auto;
  }
  .media-showcase{
    grid-template-columns:1fr;
  }
  .featured-video,
  .featured-video-button{
    min-height:540px;
  }
  .media-playlist{
    grid-template-columns:repeat(2,1fr);
  }
  .playlist-item{
    min-height:130px;
  }
  .product-channel-grid{
    grid-template-columns:repeat(2,1fr);
  }
}
@media (max-width:680px){
  .hero-v2{
    padding-top:112px;
  }
  .hero-v2 h1{
    font-size:clamp(41px,12vw,58px);
  }
  .hero-v2 .hero-copy>p{
    font-size:16px;
  }
  .hero-v2 .hero-visual{
    min-height:565px;
  }
  .hero-console{
    width:min(315px,70%);
  }
  .stage-ring-one{
    width:395px;
    height:395px;
    left:50%;
    top:82px;
    transform:translateX(-50%);
  }
  .stage-ring-two{
    width:290px;
    height:290px;
    left:50%;
    top:135px;
    transform:translateX(-50%);
  }
  .satellite-namo{
    left:0;
    top:82px;
  }
  .satellite-qandeel{
    right:0;
    top:205px;
  }
  .satellite-thameen{
    left:8px;
    bottom:55px;
  }
  .hero-satellite{
    width:158px;
  }
  .satellite-image{
    width:48px;
    height:48px;
  }
  .hero-live-card{
    right:12px;
    bottom:40px;
  }
  .about-mosaic{
    min-height:545px;
  }
  .about-main{
    inset:0 30px 70px 0;
  }
  .about-secondary{
    width:165px;
    height:210px;
  }
  .about-proof{
    right:0;
    width:215px;
  }
  .product-panel-inner{
    padding:25px 18px 30px;
  }
  .product-copy-top{
    align-items:flex-start;
  }
  .product-media-action{
    grid-template-columns:42px 1fr;
  }
  .product-media-action b{
    display:none;
  }
  .product-media-stack{
    min-height:520px;
  }
  .product-main-image{
    inset:0 34px 75px 0;
  }
  .product-secondary-image{
    width:145px;
    height:178px;
  }
  .product-media-status{
    right:5px;
    bottom:25px;
  }
  .impact-copy h2{
    font-size:37px;
  }
  .impact-visual{
    min-height:535px;
  }
  .impact-device{
    width:270px;
  }
  .flow-node{
    min-width:112px;
    padding:10px 12px 10px 30px;
  }
  .flow-node-one{
    right:14px;
    top:48px;
  }
  .flow-node-two{
    left:9px;
    top:125px;
  }
  .flow-node-three{
    right:14px;
    bottom:62px;
  }
  .impact-status{
    left:10px;
    bottom:24px;
  }
  .featured-video,
  .featured-video-button{
    min-height:450px;
  }
  .featured-play{
    width:70px;
    height:70px;
  }
  .featured-copy strong{
    font-size:25px;
  }
  .media-playlist{
    grid-template-columns:1fr;
  }
  .playlist-item{
    grid-template-columns:88px 1fr 24px;
    min-height:110px;
  }
  .playlist-thumb{
    width:88px;
    height:88px;
  }
  .product-channel-grid{
    grid-template-columns:1fr;
  }
  .product-channel-card{
    display:grid;
    grid-template-columns:140px 1fr;
  }
  .product-channel-image{
    aspect-ratio:auto;
    min-height:200px;
  }
  .brand-reels{
    grid-template-columns:1fr;
  }
  .brand-reel-card{
    min-height:340px;
  }
}
@media (max-width:460px){
  .hero-v2 .hero-visual{
    min-height:525px;
  }
  .hero-console{
    width:255px;
  }
  .hero-satellite{
    width:132px;
    padding:7px;
  }
  .hero-satellite small{
    display:none;
  }
  .hero-satellite strong{
    font-size:11px;
  }
  .satellite-image{
    width:42px;
    height:42px;
  }
  .satellite-namo{
    top:75px;
  }
  .satellite-qandeel{
    top:205px;
  }
  .satellite-thameen{
    bottom:58px;
  }
  .hero-live-card{
    right:4px;
    padding:10px 11px;
  }
  .stage-scan{
    left:38px;
    right:38px;
  }
  .about-mosaic{
    min-height:475px;
  }
  .about-main{
    inset:0 20px 60px 0;
  }
  .about-secondary{
    width:135px;
    height:170px;
    border-width:7px;
  }
  .about-proof{
    width:190px;
    padding:15px;
  }
  .product-media-stack{
    min-height:450px;
  }
  .product-secondary-image{
    width:118px;
    height:145px;
    border-width:6px;
  }
  .product-media-status{
    max-width:190px;
  }
  .product-media-status span{
    display:none;
  }
  .impact-visual{
    min-height:490px;
  }
  .impact-device{
    width:230px;
  }
  .flow-node small{
    display:none;
  }
  .flow-node{
    min-width:90px;
  }
  .featured-video,
  .featured-video-button{
    min-height:390px;
  }
  .featured-copy{
    right:20px;
    left:20px;
    bottom:20px;
  }
  .featured-copy strong{
    font-size:22px;
  }
  .product-channel-card{
    grid-template-columns:112px 1fr;
  }
  .product-channel-image{
    min-height:180px;
  }
  .product-channel-copy{
    padding:14px;
  }
  .product-channel-copy h3{
    min-height:auto;
  }
}

@media (prefers-reduced-motion:reduce){
  .stage-ring-two,
  .stage-scan,
  .satellite-namo,
  .satellite-qandeel,
  .satellite-thameen,
  .live-wave i,
  .impact-connections path,
  .flow-node i,
  .floating-whatsapp,
  .hero-glow-one,
  .hero-glow-two{
    animation:none!important;
  }
  .hero-console,
  .hero-satellite,
  .about-main,
  .product-main-image,
  .impact-visual{
    transform:none!important;
  }
}


/* =========================================================
   TECTON 1.3 — CONTINUOUS EXHIBITION HERO
   ========================================================= */
.hero-exhibition{
  --scene-accent:#15b9b0;
  --scene-accent-2:#6436c7;
  position:relative;
  min-height:1000px;
  padding:146px 0 70px;
  background:
    radial-gradient(circle at 86% 20%,color-mix(in srgb,var(--scene-accent) 26%,transparent),transparent 33%),
    radial-gradient(circle at 8% 80%,color-mix(in srgb,var(--scene-accent-2) 23%,transparent),transparent 31%),
    linear-gradient(120deg,#03131f,#061f2d 54%,#072c31);
  color:#fff;
  overflow:hidden;
  transition:background 1.2s ease;
}
.hero-exhibition .hero-grid-pattern{opacity:.9;background-size:64px 64px;animation:exhibition-grid-drift 28s linear infinite}
.hero-beam{position:absolute;width:52vw;height:2px;opacity:.35;background:linear-gradient(90deg,transparent,var(--scene-accent),transparent);filter:blur(.3px);transform-origin:center;pointer-events:none}
.hero-beam-one{left:-18vw;top:28%;transform:rotate(21deg);animation:exhibition-beam 8s ease-in-out infinite}
.hero-beam-two{right:-24vw;bottom:18%;transform:rotate(-17deg);animation:exhibition-beam 11s ease-in-out infinite reverse}
.hero-exhibition-shell{position:relative;z-index:3}
.hero-showcase-grid{display:grid;grid-template-columns:minmax(480px,.93fr) minmax(580px,1.07fr);grid-template-areas:"visual copy";gap:70px;align-items:center;direction:ltr}
.hero-exhibition-copy{grid-area:copy;direction:rtl;position:relative;z-index:4}
.hero-exhibition-stage{--showcase-x:0px;--showcase-y:0px;--showcase-rx:0deg;--showcase-ry:0deg;grid-area:visual;direction:rtl;position:relative;min-height:720px;perspective:1400px;isolation:isolate}
.hero-scene-headline-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.hero-scene-badge{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border:1px solid color-mix(in srgb,var(--scene-accent) 46%,transparent);border-radius:999px;background:color-mix(in srgb,var(--scene-accent) 11%,transparent);color:#e9fffd;font-size:11px;font-weight:800;box-shadow:inset 0 0 18px color-mix(in srgb,var(--scene-accent) 8%,transparent)}
.hero-exhibition-copy h1{max-width:760px;margin:26px 0 18px;font-family:"Alexandria",Arial,Tahoma,sans-serif;font-size:clamp(54px,5.7vw,88px);line-height:1.12;letter-spacing:-.055em;text-wrap:balance}
.hero-exhibition-copy h1 span,.hero-exhibition-copy h1 em{display:block}
.hero-exhibition-copy h1 em{background:linear-gradient(90deg,#f5ffff 0%,color-mix(in srgb,var(--scene-accent) 88%,#fff) 48%,var(--scene-accent) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 12px 34px color-mix(in srgb,var(--scene-accent) 15%,transparent))}
.hero-exhibition-copy>p{max-width:720px;margin:20px 0 0;color:rgba(255,255,255,.62);font-size:18px;line-height:2}
.hero-typing-line{display:flex;align-items:center;gap:10px;min-height:54px;max-width:700px;padding:11px 15px;margin-top:18px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.045);box-shadow:inset 0 1px rgba(255,255,255,.05);backdrop-filter:blur(16px)}
.hero-typing-line>span{flex:none;padding:6px 9px;border-radius:9px;background:color-mix(in srgb,var(--scene-accent) 16%,transparent);color:color-mix(in srgb,var(--scene-accent) 80%,#fff);font-size:9px;font-weight:900}
.hero-typing-line strong{min-width:0;color:#fff;font-family:"Alexandria",Arial,Tahoma,sans-serif;font-size:14px;line-height:1.7}
.typing-caret{display:inline-block;flex:none;width:2px;height:22px;border-radius:3px;background:var(--scene-accent);box-shadow:0 0 12px var(--scene-accent);animation:typing-caret 1s steps(1) infinite}
.hero-scene-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:30px}
.hero-scene-metrics article{position:relative;overflow:hidden;padding:18px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.04);backdrop-filter:blur(14px)}
.hero-scene-metrics article:after{content:"";position:absolute;right:0;left:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--scene-accent),transparent);transform:scaleX(.4);opacity:.6}
.hero-scene-metrics strong{display:block;color:#fff;font-family:"Alexandria",Arial,Tahoma,sans-serif;font-size:22px}
.hero-scene-metrics span{display:block;margin-top:6px;color:rgba(255,255,255,.43);font-size:10px;font-weight:800}
.showcase-frame{position:absolute;inset:48px 54px 80px 18px;z-index:3;display:flex;flex-direction:column;padding:16px;border:1px solid rgba(185,235,231,.18);border-radius:34px;background:linear-gradient(145deg,rgba(255,255,255,.095),rgba(255,255,255,.03));box-shadow:0 42px 95px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.12);backdrop-filter:blur(21px);transform:translate3d(var(--showcase-x),var(--showcase-y),0) rotateX(var(--showcase-rx)) rotateY(var(--showcase-ry));transform-style:preserve-3d;transition:transform .22s ease,border-color .8s ease}
.showcase-frame:before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,color-mix(in srgb,var(--scene-accent) 62%,transparent),transparent 34%,rgba(255,255,255,.18));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.showcase-frame-head,.showcase-frame-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;color:rgba(255,255,255,.5);font-size:10px;font-weight:800}
.showcase-frame-head>div{display:flex;align-items:center;gap:8px}
.showcase-status-dot{width:8px;height:8px;border-radius:50%;background:var(--scene-accent);box-shadow:0 0 0 7px color-mix(in srgb,var(--scene-accent) 10%,transparent),0 0 17px var(--scene-accent);animation:status-pulse 1.8s ease-in-out infinite}
.showcase-frame-head>b{color:#fff;font-size:11px}
.showcase-frame-head>span{direction:ltr;font-family:"Alexandria";letter-spacing:.08em}
.showcase-main-media{position:relative;flex:1;min-height:460px;border-radius:24px;background:#f4f7f7;box-shadow:0 22px 54px rgba(0,0,0,.22);transform:translateZ(38px)}
.showcase-main-media img{width:100%;height:100%;object-fit:cover;object-position:center;transition:filter .7s ease,transform .9s cubic-bezier(.22,.78,.24,1),opacity .45s ease}
.showcase-media-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(2,18,28,.55),transparent 37%);pointer-events:none}
.showcase-scanline{position:absolute;right:0;left:0;top:-10%;height:18%;background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--scene-accent) 12%,transparent),transparent);mix-blend-mode:screen;animation:showcase-scan 5.4s linear infinite;pointer-events:none}
.showcase-media-label{position:absolute;right:18px;bottom:17px;padding:9px 13px;border:1px solid rgba(255,255,255,.17);border-radius:999px;background:rgba(4,22,34,.72);color:#fff;font-size:10px;font-weight:800;backdrop-filter:blur(12px)}
.showcase-frame-foot{justify-content:flex-start;flex-wrap:wrap;padding-top:10px}
.showcase-frame-foot span{display:flex;align-items:center;gap:7px;padding:7px 9px;border-radius:999px;background:rgba(255,255,255,.045);color:rgba(255,255,255,.52)}
.showcase-frame-foot i{width:6px;height:6px;border-radius:50%;background:var(--scene-accent);box-shadow:0 0 10px var(--scene-accent)}
.showcase-secondary-card{position:absolute;left:-18px;bottom:32px;z-index:7;width:215px;aspect-ratio:1.16/1;border:1px solid rgba(255,255,255,.18);border-radius:21px;background:#fff;box-shadow:0 27px 65px rgba(0,0,0,.29);transform:translate3d(calc(var(--showcase-x) * -.45),calc(var(--showcase-y) * -.4),70px) rotate(-3deg);transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .45s ease}
.showcase-secondary-card img{width:100%;height:100%;object-fit:cover}
.showcase-secondary-card span{position:absolute;right:10px;left:10px;bottom:9px;padding:7px 9px;border-radius:10px;background:rgba(4,23,34,.82);color:#fff;font-size:8px;font-weight:800;text-align:center;backdrop-filter:blur(8px)}
.showcase-data-card{position:absolute;z-index:8;min-width:160px;padding:15px 17px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(4,24,36,.82);box-shadow:0 22px 52px rgba(0,0,0,.25);backdrop-filter:blur(16px);transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .45s ease}
.showcase-data-card small{display:block;color:rgba(255,255,255,.43);font-size:9px;font-weight:800}
.showcase-data-card strong{display:block;margin-top:5px;color:#fff;font-family:"Alexandria";font-size:14px}
.showcase-data-card-one{right:2px;top:102px;transform:translate3d(calc(var(--showcase-x) * -.7),calc(var(--showcase-y) * -.55),88px)}
.showcase-data-card-two{right:25px;bottom:90px;transform:translate3d(calc(var(--showcase-x) * .65),calc(var(--showcase-y) * .55),80px)}
.data-card-line{display:block;width:100%;height:2px;margin-top:12px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.data-card-line i{display:block;width:64%;height:100%;background:linear-gradient(90deg,var(--scene-accent),var(--scene-accent-2));animation:data-line 2.6s ease-in-out infinite alternate}
.data-card-bars{display:flex;align-items:end;gap:4px;height:22px;margin-top:8px;direction:ltr}
.data-card-bars i{width:5px;border-radius:3px;background:var(--scene-accent);animation:data-bars 1.2s ease-in-out infinite alternate}
.data-card-bars i:nth-child(1){height:35%;animation-delay:-.2s}.data-card-bars i:nth-child(2){height:72%;animation-delay:-.5s}.data-card-bars i:nth-child(3){height:52%;animation-delay:-.8s}.data-card-bars i:nth-child(4){height:92%;animation-delay:-1s}
.showcase-live-state{position:absolute;left:82px;top:6px;z-index:8;display:flex;align-items:center;gap:11px;padding:10px 13px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(4,24,36,.74);box-shadow:0 18px 45px rgba(0,0,0,.2);backdrop-filter:blur(14px)}
.showcase-live-state small{display:block;color:rgba(255,255,255,.38);font-size:8px;font-weight:800}.showcase-live-state strong{display:block;margin-top:2px;color:#fff;font-size:10px}
.live-wave{display:flex;align-items:center;gap:3px;height:22px}.live-wave i{width:3px;border-radius:3px;background:var(--scene-accent);animation:live-wave 1s ease-in-out infinite alternate}.live-wave i:nth-child(1){height:35%;animation-delay:-.2s}.live-wave i:nth-child(2){height:85%;animation-delay:-.6s}.live-wave i:nth-child(3){height:55%;animation-delay:-.4s}.live-wave i:nth-child(4){height:100%;animation-delay:-.8s}.live-wave i:nth-child(5){height:43%;animation-delay:-.1s}
.showcase-orbit{position:absolute;z-index:1;border:1px solid color-mix(in srgb,var(--scene-accent) 25%,transparent);border-radius:50%;pointer-events:none;transition:border-color .8s ease}
.showcase-orbit:after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:var(--scene-accent);box-shadow:0 0 20px var(--scene-accent)}
.showcase-orbit-one{width:540px;height:540px;left:18px;top:77px;animation:orbit-one 21s linear infinite}.showcase-orbit-one:after{right:40px;top:50px}
.showcase-orbit-two{width:400px;height:400px;left:95px;top:145px;border-style:dashed;animation:orbit-two 16s linear infinite reverse}.showcase-orbit-two:after{left:23px;bottom:80px}
.showcase-signal{position:absolute;right:20px;top:20px;z-index:2;width:70px;height:70px}
.showcase-signal i{position:absolute;inset:50%;border:1px solid color-mix(in srgb,var(--scene-accent) 35%,transparent);border-radius:50%;animation:signal-ripple 3.4s ease-out infinite}.showcase-signal i:nth-child(2){animation-delay:.8s}.showcase-signal i:nth-child(3){animation-delay:1.6s}.showcase-signal i:nth-child(4){animation-delay:2.4s}
.hero-exhibition-controls{display:grid;grid-template-columns:auto 1fr minmax(260px,340px);align-items:center;gap:22px;margin-top:26px;padding:13px 16px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:rgba(255,255,255,.045);box-shadow:0 18px 52px rgba(0,0,0,.18);backdrop-filter:blur(17px)}
.hero-control-buttons{display:flex;align-items:center;gap:7px;direction:ltr}.hero-control-buttons button{display:grid;place-items:center;min-width:43px;height:43px;padding:0 12px;border:1px solid rgba(255,255,255,.11);border-radius:13px;background:rgba(255,255,255,.055);color:#fff;font-weight:800;cursor:pointer;transition:.2s}.hero-control-buttons button:hover{border-color:color-mix(in srgb,var(--scene-accent) 60%,transparent);background:color-mix(in srgb,var(--scene-accent) 14%,transparent)}
.hero-control-buttons .hero-pause-control{display:flex;gap:8px;min-width:104px}.hero-pause-control b{font-size:10px}.pause-icon{font-family:Arial;font-size:12px}.play-icon{font-size:10px}
.hero-scene-navigation{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;direction:ltr}
.hero-scene-dot{display:flex;align-items:center;gap:7px;overflow:hidden;width:42px;height:42px;padding:0 12px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:transparent;color:rgba(255,255,255,.4);cursor:pointer;transition:width .45s cubic-bezier(.2,.8,.2,1),background .25s,border-color .25s,color .25s}
.hero-scene-dot i{flex:none;width:7px;height:7px;border-radius:50%;background:currentColor}.hero-scene-dot span{font-family:"Alexandria";font-size:9px}.hero-scene-dot b{display:none;white-space:nowrap;font-size:9px}
.hero-scene-dot.active{width:128px;border-color:color-mix(in srgb,var(--scene-accent) 42%,transparent);background:color-mix(in srgb,var(--scene-accent) 12%,transparent);color:#fff}.hero-scene-dot.active i{background:var(--scene-accent);box-shadow:0 0 13px var(--scene-accent)}.hero-scene-dot.active b{display:block}
.hero-progress-wrap{display:grid;gap:8px}.hero-progress-wrap>span{display:flex;align-items:center;justify-content:space-between;gap:12px}.hero-progress-wrap b{color:#fff;font-size:10px}.hero-progress-wrap small{color:rgba(255,255,255,.35);font-size:8px}
.hero-progress-track{height:3px;overflow:hidden;border-radius:5px;background:rgba(255,255,255,.08);direction:ltr}.hero-progress-track i{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--scene-accent),var(--scene-accent-2));box-shadow:0 0 16px var(--scene-accent)}
.hero-is-paused .showcase-scanline,.hero-is-paused .showcase-orbit,.hero-is-paused .showcase-signal i,.hero-is-paused .live-wave i,.hero-is-paused .data-card-bars i,.hero-is-paused .data-card-line i{animation-play-state:paused!important}
.hero-scene-changing .hero-exhibition-copy h1,.hero-scene-changing .hero-exhibition-copy>p,.hero-scene-changing .hero-typing-line{animation:scene-copy-out .42s ease both}
.hero-direction-back.hero-scene-changing .hero-exhibition-copy h1,.hero-direction-back.hero-scene-changing .hero-exhibition-copy>p,.hero-direction-back.hero-scene-changing .hero-typing-line{animation-name:scene-copy-out-back}
.hero-scene-changing .showcase-main-media img,.hero-scene-changing .showcase-secondary-card,.hero-scene-changing .showcase-data-card{opacity:0}
.hero-transition-iris.hero-scene-changing .showcase-main-media{animation:transition-iris .9s cubic-bezier(.2,.8,.2,1)}
.hero-transition-wipe.hero-scene-changing .showcase-main-media{animation:transition-wipe .9s cubic-bezier(.2,.8,.2,1)}
.hero-transition-zoom.hero-scene-changing .showcase-main-media{animation:transition-zoom .9s cubic-bezier(.2,.8,.2,1)}
.hero-transition-rise.hero-scene-changing .showcase-frame{animation:transition-rise .9s cubic-bezier(.2,.8,.2,1)}
.hero-transition-flip.hero-scene-changing .showcase-frame{animation:transition-flip .9s cubic-bezier(.2,.8,.2,1)}
.hero-transition-focus.hero-scene-changing .showcase-main-media{animation:transition-focus .9s cubic-bezier(.2,.8,.2,1)}
@keyframes exhibition-grid-drift{to{background-position:64px 64px}}
@keyframes exhibition-beam{0%,100%{opacity:.1;translate:-8% 0}50%{opacity:.48;translate:10% 0}}
@keyframes typing-caret{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes status-pulse{0%,100%{scale:.88;opacity:.7}50%{scale:1.08;opacity:1}}
@keyframes showcase-scan{0%{top:-20%}100%{top:112%}}
@keyframes data-line{to{width:92%}}
@keyframes data-bars{to{height:100%;opacity:.55}}
@keyframes live-wave{to{height:22%;opacity:.55}}
@keyframes orbit-one{to{transform:rotate(360deg)}}
@keyframes orbit-two{to{transform:rotate(360deg)}}
@keyframes signal-ripple{0%{inset:50%;opacity:.8}100%{inset:0;opacity:0}}
@keyframes scene-copy-out{0%{opacity:1;transform:translateX(0)}50%,100%{opacity:0;transform:translateX(-28px)}}
@keyframes scene-copy-out-back{0%{opacity:1;transform:translateX(0)}50%,100%{opacity:0;transform:translateX(28px)}}
@keyframes transition-iris{0%{clip-path:circle(150% at 50% 50%)}45%{clip-path:circle(0 at 50% 50%)}100%{clip-path:circle(150% at 50% 50%)}}
@keyframes transition-wipe{0%{clip-path:inset(0 0 0 0)}45%{clip-path:inset(0 100% 0 0)}55%{clip-path:inset(0 0 0 100%)}100%{clip-path:inset(0)}}
@keyframes transition-zoom{0%,100%{transform:scale(1)}45%{transform:scale(.88);filter:blur(8px)}}
@keyframes transition-rise{0%,100%{transform:translate3d(var(--showcase-x),var(--showcase-y),0) rotateX(var(--showcase-rx)) rotateY(var(--showcase-ry))}45%{transform:translate3d(var(--showcase-x),80px,0) scale(.92);opacity:.1}}
@keyframes transition-flip{0%,100%{transform:translate3d(var(--showcase-x),var(--showcase-y),0) rotateX(var(--showcase-rx)) rotateY(var(--showcase-ry))}45%{transform:rotateY(82deg) scale(.9);opacity:.1}}
@keyframes transition-focus{0%,100%{filter:blur(0);transform:scale(1)}45%{filter:blur(18px) saturate(.4);transform:scale(1.06)}}
@media (min-width:1700px){.hero-exhibition{min-height:1060px;padding-top:160px}.hero-showcase-grid{grid-template-columns:minmax(590px,.96fr) minmax(720px,1.04fr);gap:100px}.hero-exhibition-stage{min-height:770px}.hero-exhibition-copy h1{font-size:94px}.showcase-frame{inset:40px 70px 80px 20px}.showcase-main-media{min-height:510px}}
@media (max-width:1180px){.hero-showcase-grid{grid-template-columns:minmax(430px,.9fr) minmax(500px,1.1fr);gap:42px}.hero-exhibition-stage{min-height:650px}.showcase-frame{inset:46px 46px 74px 8px}.showcase-main-media{min-height:410px}.hero-exhibition-copy h1{font-size:clamp(49px,5.8vw,72px)}.hero-exhibition-controls{grid-template-columns:auto 1fr}.hero-progress-wrap{grid-column:1/-1}.hero-scene-dot.active{width:112px}}
@media (max-width:900px){.hero-exhibition{min-height:auto;padding:118px 0 58px}.hero-showcase-grid{grid-template-columns:1fr;grid-template-areas:"copy" "visual";gap:36px}.hero-exhibition-copy{text-align:center}.hero-scene-headline-row,.hero-actions{justify-content:center}.hero-exhibition-copy h1,.hero-exhibition-copy>p,.hero-typing-line{margin-right:auto;margin-left:auto}.hero-exhibition-copy h1{font-size:clamp(48px,9vw,70px)}.hero-scene-metrics{max-width:680px;margin-right:auto;margin-left:auto}.hero-exhibition-stage{max-width:650px;width:100%;min-height:680px;margin:auto}.hero-exhibition-controls{grid-template-columns:1fr;gap:12px}.hero-control-buttons,.hero-scene-navigation{justify-content:center}.hero-progress-wrap{grid-column:auto}.showcase-data-card-one{right:-4px}.showcase-data-card-two{right:20px}.showcase-secondary-card{left:0}}
@media (max-width:560px){.hero-exhibition{padding-top:105px}.hero-scene-headline-row{display:grid;justify-items:center}.hero-scene-badge{font-size:9px}.hero-exhibition-copy h1{font-size:clamp(40px,12vw,55px);line-height:1.2;margin-top:20px}.hero-exhibition-copy>p{font-size:15px;line-height:1.95}.hero-typing-line{min-height:64px;align-items:flex-start;text-align:right}.hero-typing-line strong{font-size:12px}.hero-scene-metrics{grid-template-columns:1fr}.hero-scene-metrics article{display:flex;align-items:center;justify-content:space-between;padding:13px 15px}.hero-scene-metrics strong{font-size:18px}.hero-exhibition-stage{min-height:535px}.showcase-frame{inset:35px 20px 72px 4px;padding:11px;border-radius:25px}.showcase-frame-head{min-height:34px}.showcase-main-media{min-height:315px;border-radius:18px}.showcase-frame-foot{gap:4px}.showcase-frame-foot span{padding:5px 7px;font-size:8px}.showcase-secondary-card{width:140px;left:0;bottom:30px;border-radius:16px}.showcase-data-card{min-width:122px;padding:11px 12px}.showcase-data-card-one{right:0;top:76px}.showcase-data-card-two{right:5px;bottom:74px}.showcase-data-card strong{font-size:11px}.showcase-live-state{display:none}.showcase-orbit-one{width:390px;height:390px;left:0;top:65px}.showcase-orbit-two{width:290px;height:290px;left:45px;top:118px}.hero-exhibition-controls{padding:12px;border-radius:18px}.hero-scene-navigation{overflow-x:auto;justify-content:flex-start;padding-bottom:3px}.hero-scene-dot{flex:none}.hero-scene-dot.active{width:96px}.hero-scene-dot.active b{display:none}.hero-control-buttons .hero-pause-control{min-width:96px}}
@media (prefers-reduced-motion:reduce){.hero-exhibition *{animation-duration:.001ms!important;animation-iteration-count:1!important}.typing-caret{display:none}.hero-scene-navigation,.hero-control-buttons{display:none}.hero-progress-track i{transform:scaleX(1)!important}}


/* =========================================================
   TECTON 1.4 — LIGHT HERO + WHITE GLASS NAV (overrides)
   ========================================================= */

/* --- White glass navigation --- */
.floating-nav{
  border-color:rgba(8,28,43,.08);
  background:rgba(255,255,255,.78);
  box-shadow:0 18px 50px rgba(8,28,43,.13);
  backdrop-filter:blur(22px) saturate(1.6);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);
}
.brand-logo{border:1px solid var(--line)}
.brand-copy strong{color:var(--ink)}
.brand-copy small{color:var(--muted)}
.desktop-links{border-color:rgba(8,28,43,.06);background:rgba(8,28,43,.045)}
.desktop-links a{color:#43545e}
.desktop-links a:hover{color:var(--ink)}
.desktop-links a.active{background:var(--ink);color:#fff;box-shadow:0 7px 20px rgba(8,28,43,.22)}
.menu-toggle{background:rgba(8,28,43,.05);border-color:rgba(8,28,43,.14)}
.menu-toggle span{background:var(--ink)}
.mobile-menu{
  border-color:rgba(8,28,43,.08);
  background:rgba(255,255,255,.96);
  box-shadow:0 24px 60px rgba(8,28,43,.16);
}
.mobile-menu a:not(.btn){color:#3c4c56}
.mobile-menu a:not(.btn):hover,.mobile-menu a.active:not(.btn){background:rgba(8,28,43,.06);color:var(--ink)}

/* --- Light exhibition hero --- */
.hero-exhibition{
  min-height:0;
  padding:150px 0 95px;
  color:var(--text);
  background:
    radial-gradient(circle at 88% 14%,color-mix(in srgb,var(--scene-accent) 11%,transparent),transparent 34%),
    radial-gradient(circle at 6% 86%,color-mix(in srgb,var(--scene-accent-2) 8%,transparent),transparent 30%),
    linear-gradient(180deg,#ffffff 0%,#f4f9f8 100%);
}
.hero-exhibition .hero-grid-pattern{
  opacity:1;
  animation:none;
  background-image:
    linear-gradient(rgba(8,28,43,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(8,28,43,.05) 1px,transparent 1px);
  background-size:64px 64px;
}
.hero-exhibition .hero-glow{opacity:.1}
.hero-exhibition .eyebrow{border-color:color-mix(in srgb,var(--scene-accent) 32%,transparent);background:#fff;color:color-mix(in srgb,var(--scene-accent) 72%,#06312f)}
.hero-exhibition .eyebrow i{background:var(--scene-accent);box-shadow:0 0 0 6px color-mix(in srgb,var(--scene-accent) 12%,transparent)}
.hero-scene-badge{border-color:color-mix(in srgb,var(--scene-accent) 34%,transparent);background:color-mix(in srgb,var(--scene-accent) 9%,#fff);color:color-mix(in srgb,var(--scene-accent) 68%,#06312f);box-shadow:none}
.hero-exhibition-copy h1{color:var(--ink)}
.hero-exhibition-copy h1 em{
  background:linear-gradient(90deg,var(--ink) 0%,color-mix(in srgb,var(--scene-accent) 78%,var(--ink)) 45%,var(--scene-accent) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;filter:none;
}
.hero-exhibition-copy>p{color:var(--muted)}
.hero-typing-line{
  border:1px solid var(--line);
  background:#fff;
  box-shadow:0 14px 34px rgba(8,28,43,.07);
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.hero-typing-line strong{color:var(--ink);transition:opacity .26s ease,transform .26s ease}
.hero-typing-line strong.phrase-fading{opacity:0;transform:translateY(7px)}
.hero-exhibition .hero-actions .btn-glass{border:1px solid var(--line);background:#fff;color:var(--text);backdrop-filter:none;-webkit-backdrop-filter:none}
.hero-exhibition .hero-actions .btn-glass:hover{border-color:var(--teal);background:#fff}
.hero-scene-metrics article{border:1px solid var(--line);background:#fff;box-shadow:0 14px 34px rgba(8,28,43,.06);backdrop-filter:none;-webkit-backdrop-filter:none}
.hero-scene-metrics strong{color:var(--ink)}
.hero-scene-metrics span{color:var(--muted)}

/* Showcase stage on light */
.showcase-frame{
  border:1px solid var(--line);
  background:#fff;
  box-shadow:0 34px 80px rgba(8,28,43,.14);
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.showcase-frame:before{content:none}
.showcase-frame-head,.showcase-frame-foot{color:var(--muted)}
.showcase-frame-head>b{color:var(--ink)}
.showcase-main-media{box-shadow:0 18px 44px rgba(8,28,43,.12)}
.showcase-media-shade{background:linear-gradient(to top,rgba(6,21,33,.30),transparent 32%)}
.showcase-media-label{border-color:rgba(8,28,43,.1);background:rgba(255,255,255,.93);color:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
.showcase-frame-foot span{background:rgba(8,28,43,.05);color:#43545e}
.showcase-secondary-card{border-color:var(--line);box-shadow:0 22px 52px rgba(8,28,43,.16)}
.showcase-secondary-card span{background:rgba(255,255,255,.94);color:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
.showcase-data-card{border-color:var(--line);background:#fff;box-shadow:0 18px 44px rgba(8,28,43,.11);backdrop-filter:none;-webkit-backdrop-filter:none}
.showcase-data-card small{color:var(--muted)}
.showcase-data-card strong{color:var(--ink)}
.data-card-line{background:rgba(8,28,43,.08)}

/* Softer scene change (fade only) */
.hero-scene-changing .hero-exhibition-copy h1,
.hero-scene-changing .hero-exhibition-copy>p,
.hero-scene-changing .hero-typing-line{animation:scene-copy-fade .5s ease both}
@keyframes scene-copy-fade{0%{opacity:1}45%,100%{opacity:0}}

@media (max-width:900px){.hero-exhibition{padding:118px 0 58px}}
@media (max-width:560px){.hero-exhibition{padding:105px 0 52px}}

/* --------------- mobile declutter: kill overlapping floating cards --------------- */
@media (max-width:960px){
  /* hero: drop the floating data/secondary cards and orbit decoration */
  .showcase-secondary-card,
  .showcase-data-card,
  .showcase-live-state,
  .showcase-orbit{display:none!important}
  .hero-exhibition-stage{min-height:0;perspective:none}
  .showcase-frame{position:static;inset:auto;transform:none!important}
  .showcase-main-media{transform:none}

  /* about: drop the overlapping "أتمتة الدورة المحاسبية" inset, let the mosaic flow */
  .about-secondary{display:none!important}
  .about-mosaic{min-height:0}
  .about-main{position:static;inset:auto;transform:none!important}
  .about-proof{position:static;width:auto;margin-top:16px}
  .about-media .made-in-iraq{position:static;display:inline-block;margin-top:14px}
}
