/* =========================================================
   ARABIA GROUP — HOME V7 / CINEMATIC PRECISION
   Solar + Obsidian / compact typography / deterministic intro
   ========================================================= */

html[data-theme='cinematic'],
html[data-theme='light'],
html[data-theme='dark']{
  --page-bg:#F3C600;
  --page-text:#0D0F10;
  --muted-text:#292C2F;
  color-scheme:light;
  scroll-behavior:smooth;
}

body.ag-home-v7{
  --ag-solar:#F3C600;
  --ag-obsidian:#0D0F10;
  --ag-paper:#F4F1E8;
  --ag-carbon:#292C2F;
  --ag-ash:#A8A9A4;
  --ag-red:#A63825;
  --ag-container:min(calc(100vw - 52px),1580px);
  background:var(--ag-solar);
  color:var(--ag-obsidian);
  overflow-x:hidden;
}

body.ag-home-v7 .site-shell{
  opacity:1;
  transform:none;
  transition:opacity .55s cubic-bezier(.22,.78,.25,1),filter .55s ease;
}

body.ag-home-v7.ag-intro-active{overflow:hidden}
body.ag-home-v7.ag-intro-active .site-shell{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  filter:blur(2px);
}

body.ag-home-v7 .theme-switcher{display:none!important}
.ag-future-targets{height:0;overflow:hidden;position:relative}
.ag-future-targets>span{position:absolute;top:-90px}

/* =========================================================
   INTRO V3 — three-piece core assembly -> full wordmark
   Deterministic exit: JS min ~3.35s / hard cap 5.2s.
   ========================================================= */
.ag-intro-v3{
  position:fixed;
  z-index:100000;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#050606;
  color:var(--ag-paper);
  opacity:1;
  visibility:visible;
  transition:opacity .62s cubic-bezier(.2,.75,.2,1),visibility .62s;
}
.ag-intro-v3.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.ag-intro-v3__field{
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(circle at 50% 49%,rgba(243,198,0,.105),transparent 18%),
    radial-gradient(circle at 50% 50%,rgba(244,241,232,.035),transparent 38%),
    repeating-linear-gradient(90deg,transparent 0 68px,rgba(244,241,232,.018) 69px,transparent 70px);
  transform:perspective(900px) rotateX(66deg) translateY(25%);
  transform-origin:center bottom;
  animation:agV3Field 4.8s cubic-bezier(.2,.7,.2,1) both;
}
.ag-intro-v3__core{
  position:absolute;
  width:clamp(210px,27vw,360px);
  aspect-ratio:1;
  border:1px solid rgba(243,198,0,.14);
  border-radius:50%;
  box-shadow:0 0 0 1px rgba(244,241,232,.025) inset,0 0 80px rgba(243,198,0,.045);
  animation:agV3Core 4.4s cubic-bezier(.18,.75,.2,1) both;
}
.ag-intro-v3__core::before,
.ag-intro-v3__core::after,
.ag-intro-v3__core i,
.ag-intro-v3__core b{
  content:'';
  position:absolute;
  background:var(--ag-solar);
}
.ag-intro-v3__core::before{width:7px;height:7px;border-radius:50%;left:50%;top:-4px;box-shadow:0 0 22px rgba(243,198,0,.8)}
.ag-intro-v3__core::after{width:1px;height:58%;left:50%;top:21%;opacity:.12}
.ag-intro-v3__core i{height:1px;width:58%;top:50%;left:21%;opacity:.12}
.ag-intro-v3__core b{width:3px;height:3px;border-radius:50%;right:9%;bottom:22%;opacity:.75}
.ag-intro-v3__stage{
  position:relative;
  width:min(720px,80vw);
  height:330px;
  display:grid;
  place-items:center;
  isolation:isolate;
}
.ag-intro-v3__symbol-stack{
  position:absolute;
  width:clamp(116px,15vw,172px);
  aspect-ratio:1;
}
.ag-intro-v3__symbol{
  position:absolute;
  inset:0;
  width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 16px 35px rgba(243,198,0,.11));
  will-change:transform,opacity,clip-path,filter;
}
.ag-intro-v3__symbol--a{clip-path:polygon(0 0,39% 0,39% 100%,0 100%);animation:agV3SliceA 4.15s cubic-bezier(.18,.8,.22,1) both}
.ag-intro-v3__symbol--b{clip-path:polygon(34% 0,69% 0,69% 100%,34% 100%);animation:agV3SliceB 4.15s cubic-bezier(.18,.8,.22,1) both}
.ag-intro-v3__symbol--c{clip-path:polygon(64% 0,100% 0,100% 100%,64% 100%);animation:agV3SliceC 4.15s cubic-bezier(.18,.8,.22,1) both}
.ag-intro-v3__beam{
  position:absolute;
  top:50%;left:50%;
  width:0;height:1px;
  transform:translate(-50%,-50%);
  background:linear-gradient(90deg,transparent,var(--ag-solar),#fff7c8,var(--ag-solar),transparent);
  box-shadow:0 0 22px rgba(243,198,0,.4);
  animation:agV3Beam 4.5s ease both;
}
.ag-intro-v3__wordmark{
  position:absolute;
  width:clamp(250px,38vw,490px);
  height:auto;
  object-fit:contain;
  opacity:0;
  clip-path:inset(0 50% 0 50%);
  filter:blur(5px) drop-shadow(0 16px 36px rgba(243,198,0,.08));
  animation:agV3Wordmark 4.55s cubic-bezier(.19,.78,.2,1) both;
}
@keyframes agV3Field{0%{opacity:0;transform:perspective(900px) rotateX(72deg) translateY(33%) scale(.92)}30%{opacity:1}100%{opacity:.42;transform:perspective(900px) rotateX(66deg) translateY(25%) scale(1.05)}}
@keyframes agV3Core{0%{opacity:0;transform:scale(.45) rotate(-35deg)}16%{opacity:1}52%{transform:scale(1) rotate(178deg);opacity:1}73%,100%{transform:scale(1.35) rotate(270deg);opacity:0}}
@keyframes agV3SliceA{0%{opacity:0;transform:translate(-52px,28px) rotate(-7deg);filter:blur(8px)}15%{opacity:1}36%{transform:translate(0,0) rotate(0);filter:blur(0)}55%{opacity:1;transform:scale(1)}67%,100%{opacity:0;transform:scale(.72)}}
@keyframes agV3SliceB{0%{opacity:0;transform:translateY(-58px) scale(.78);filter:blur(8px)}9%{opacity:0}20%{opacity:1}39%{transform:translateY(0) scale(1);filter:blur(0)}55%{opacity:1}67%,100%{opacity:0;transform:scale(.72)}}
@keyframes agV3SliceC{0%{opacity:0;transform:translate(54px,28px) rotate(7deg);filter:blur(8px)}14%{opacity:0}23%{opacity:1}42%{transform:translate(0,0) rotate(0);filter:blur(0)}55%{opacity:1}67%,100%{opacity:0;transform:scale(.72)}}
@keyframes agV3Beam{0%,47%{width:0;opacity:0}55%{width:min(510px,68vw);opacity:1}66%{width:min(260px,36vw);opacity:.55}78%,100%{width:0;opacity:0}}
@keyframes agV3Wordmark{0%,49%{opacity:0;clip-path:inset(0 50% 0 50%);transform:scale(.93);filter:blur(6px)}60%{opacity:1;clip-path:inset(0 0 0 0);transform:scale(1.015);filter:blur(0)}73%,100%{opacity:1;clip-path:inset(0 0 0 0);transform:scale(1);filter:blur(0)}}

/* =========================================================
   FIXED HEADER — cinematic only / compact typography
   ========================================================= */
body.ag-home-v7 .site-header.ag-fixed-header{
  position:fixed;z-index:9000;top:10px;left:0;right:0;pointer-events:none;
}
body.ag-home-v7 .site-header .navbar{
  min-height:62px;
  padding:6px 7px 6px 12px;
  border:1px solid rgba(244,241,232,.13);
  border-radius:14px;
  background:rgba(7,8,8,.965);
  color:var(--ag-paper);
  box-shadow:0 12px 32px rgba(0,0,0,.18);
  backdrop-filter:blur(18px);
  pointer-events:auto;
}
body.ag-home-v7 .navbar__left{gap:10px}
body.ag-home-v7 .navbar__brand img{width:clamp(126px,9.8vw,158px);max-height:44px}
body.ag-home-v7 .navbar__links{gap:clamp(8px,1vw,15px)}
body.ag-home-v7 .navbar__links a{
  color:rgba(244,241,232,.78);
  font-size:clamp(.69rem,.72vw,.79rem);
  font-weight:600;
  white-space:nowrap;
}
body.ag-home-v7 .navbar__links a:hover,
body.ag-home-v7 .navbar__links a.is-active{color:#fff}
body.ag-home-v7 .navbar__links a.is-active::after{background:var(--ag-solar)}
body.ag-home-v7 .navbar__cta{min-height:39px;padding:7px 13px;border-radius:9px;font-size:.75rem;box-shadow:inset 0 0 0 1px rgba(13,15,16,.12)}
body.ag-home-v7 .language-switcher{font-size:.72rem}

/* =========================================================
   PROGRESSIVE MEDIA — LQIP/blur-up, never a white/empty box
   ========================================================= */
.ag-progressive-shell{position:relative;isolation:isolate;overflow:hidden;background:#181a1b}
.ag-progressive-shell::before{
  content:'';
  position:absolute;z-index:0;inset:-8%;
  background-image:
    var(--ag-lqip,linear-gradient(135deg,rgba(243,198,0,.7),rgba(13,15,16,.72))),
    linear-gradient(135deg,rgba(243,198,0,.72),rgba(13,15,16,.74));
  background-size:cover;background-position:center;
  filter:blur(13px) saturate(.84);
  transform:scale(1.08);
  opacity:.92;
  transition:opacity .45s ease;
  pointer-events:none;
}
.ag-progressive-shell::after{
  content:'';position:absolute;z-index:0;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.055) 45%,transparent 62%);
  transform:translateX(-110%);
  animation:agV3Placeholder 1.7s ease-in-out infinite;
  opacity:.72;
}
.ag-progressive-shell.is-decoded::before,.ag-progressive-shell.is-decoded::after{opacity:0;animation:none}
@keyframes agV3Placeholder{0%{transform:translateX(-110%)}70%,100%{transform:translateX(115%)}}
img[data-ag-progressive]{position:relative;z-index:1;opacity:0;filter:blur(5px);transform:scale(1.008);transition:opacity .36s ease,filter .5s ease,transform .55s ease}
img[data-ag-progressive].is-decoded{opacity:1;filter:none;transform:none}

/* =========================================================
   HERO — compact, no huge dead spaces
   ========================================================= */
body.ag-home-v7 .hero-section{
  position:relative;
  min-height:730px;
  padding-top:98px;
  padding-bottom:10px;
  overflow:hidden;
  isolation:isolate;
  background:var(--ag-solar);
}
body.ag-home-v7 .hero-section::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 18% 15%,rgba(255,255,255,.15),transparent 24%),linear-gradient(180deg,rgba(255,255,255,.035),transparent 34%);
}
body.ag-home-v7 .hero-layout{
  min-height:590px;
  display:grid;
  grid-template-columns:minmax(0,59%) minmax(330px,41%);
  grid-template-areas:'visual copy';
  align-items:center;
  direction:ltr;
  gap:0;
}
body.ag-home-v7 .hero-copy{
  grid-area:copy;position:relative;z-index:20;
  width:min(100%,545px);justify-self:end;
  margin-top:-24px;padding-left:34px;padding-bottom:112px;
}
html[dir='rtl'] body.ag-home-v7 .hero-copy{direction:rtl;text-align:right}
html[dir='ltr'] body.ag-home-v7 .hero-copy{direction:ltr;text-align:left}
body.ag-home-v7 .hero-copy h1{
  max-width:535px;margin:0;
  font-size:clamp(2.05rem,3.15vw,3.55rem);
  line-height:1.12;font-weight:900;letter-spacing:-.018em;
}
html[dir='rtl'] body.ag-home-v7 .hero-copy h1{line-height:1.3;letter-spacing:0}
body.ag-home-v7 .section-eyebrow{font-size:.72rem;margin-bottom:10px}
body.ag-home-v7 .hero-copy__description{
  max-width:510px;margin:15px 0 0;
  color:rgba(13,15,16,.76);
  font-size:clamp(.9rem,.92vw,1.01rem);line-height:1.8;
}
body.ag-home-v7 .hero-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
body.ag-home-v7 .hero-actions .arabia-button{min-height:43px;padding:8px 16px;border-radius:9px;font-size:.82rem}
body.ag-home-v7 .hero-visual{grid-area:visual;position:relative;align-self:stretch;min-height:590px;background:transparent;overflow:visible}
body.ag-home-v7 .hero-screen-wrap{position:absolute;width:min(71%,665px);top:22px;left:21%;pointer-events:auto;z-index:12}
body.ag-home-v7 .hero-channel-number{margin-bottom:6px;font-size:.78rem;display:flex;justify-content:center;align-items:baseline;gap:4px;color:var(--ag-red);font-weight:900}
body.ag-home-v7 .hero-channel-number small{font-size:.62rem;opacity:.72}
body.ag-home-v7 .hero-screen{position:relative;z-index:5;width:100%;aspect-ratio:16/9;overflow:hidden;border:6px solid var(--ag-obsidian);border-radius:12px;background:var(--ag-obsidian);box-shadow:0 15px 33px rgba(13,15,16,.19)}
body.ag-home-v7 .hero-channel-slide{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;background:#111415;transition:none}
body.ag-home-v7 .hero-channel-slide.is-active{opacity:1;visibility:visible;pointer-events:auto}
body.ag-home-v7 .hero-channel-slide img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:transparent}
body.ag-home-v7 .channel-controls{
  position:relative;z-index:100;pointer-events:auto;
  width:max-content;min-height:39px;margin:8px auto 0;padding:4px 7px;
  border:1px solid rgba(244,241,232,.13);border-radius:999px;background:rgba(13,15,16,.97);color:var(--ag-paper);
  display:flex;align-items:center;gap:7px;box-shadow:0 8px 18px rgba(13,15,16,.16);
}
body.ag-home-v7 .channel-controls>button{position:relative;z-index:3;width:30px;height:30px;border:0;border-radius:50%;background:rgba(244,241,232,.075);color:var(--ag-paper);cursor:pointer;pointer-events:auto}
body.ag-home-v7 .channel-controls>button:hover{background:var(--ag-solar);color:var(--ag-obsidian)}
body.ag-home-v7 .hero-channel-progress{display:flex;align-items:center;gap:5px}
body.ag-home-v7 .hero-channel-progress button{width:20px;height:24px;padding:0;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;pointer-events:auto}
body.ag-home-v7 .hero-channel-progress button span{display:block;width:11px;height:2px;border-radius:999px;background:rgba(244,241,232,.28);transition:width .18s ease,background .18s ease}
body.ag-home-v7 .hero-channel-progress button.is-active span{width:19px;background:var(--ag-solar)}

body.ag-home-v7 .hero-character-shell{
  position:absolute;z-index:8;
  width:min(61vw,940px);aspect-ratio:16/9;
  left:calc((100vw - var(--ag-container)) / -2 - 82px);
  bottom:24px;
  overflow:visible;background:transparent;
  pointer-events:none;user-select:none;
}
body.ag-home-v7 .hero-character-shell::before,body.ag-home-v7 .hero-character-shell::after{border-radius:22px}
body.ag-home-v7 .hero-character-shell .hero-sofa-character{
  position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center bottom;left:auto;bottom:auto;pointer-events:none;
}
body.ag-home-v7 .hero-v143-fallback.is-suppressed{opacity:0!important}
body.ag-home-v7 .hero-v143-canvas{z-index:3;opacity:0;transition:opacity .18s ease}
body.ag-home-v7 .hero-v143-canvas.is-ready{opacity:1}

body.ag-home-v7 .hero-popcorn-shell{
  position:absolute;z-index:9;
  width:min(24vw,360px);aspect-ratio:1.48;
  right:clamp(18px,3.3vw,62px);bottom:20px;
  overflow:visible;background:transparent;pointer-events:none;
}
body.ag-home-v7 .hero-popcorn-shell .hero-popcorn{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;object-position:right bottom;right:auto;bottom:auto;pointer-events:none}
body.ag-home-v7 .hero-discover{
  position:absolute;z-index:30;left:50%;bottom:7px;transform:translateX(-50%);
  min-height:42px;padding:7px 12px 7px 16px;border:1px solid rgba(244,241,232,.13);border-radius:999px;background:var(--ag-obsidian);color:var(--ag-paper);
  display:flex;align-items:center;justify-content:center;gap:10px;font-size:.78rem;font-weight:700;white-space:nowrap;box-shadow:0 8px 18px rgba(13,15,16,.17);
}
body.ag-home-v7 .hero-scroll-cue{position:relative;width:16px;height:24px;border:1px solid rgba(244,241,232,.5);border-radius:999px;display:block}
body.ag-home-v7 .hero-scroll-cue b{position:absolute;left:50%;top:4px;width:3px;height:4px;border-radius:99px;background:var(--ag-solar);transform:translateX(-50%);animation:agV3Scroll 1.45s ease-in-out infinite}
@keyframes agV3Scroll{0%{transform:translate(-50%,0);opacity:.35}48%{opacity:1}100%{transform:translate(-50%,8px);opacity:.15}}

/* =========================================================
   ABOUT — clean copy, smaller type, character overlaps work
   ========================================================= */
.ag-who{
  position:relative;z-index:4;
  min-height:610px;
  padding:58px 0 0;
  overflow:visible;
  background:var(--ag-solar);
  border-top:1px solid rgba(13,15,16,.12);
}
.ag-who__grid{
  min-height:550px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.82fr);
  grid-template-areas:'copy visual';
  align-items:center;gap:clamp(28px,5vw,70px);direction:ltr;
}
.ag-who__copy{grid-area:copy;align-self:center;max-width:650px;padding-bottom:62px}
html[dir='rtl'] .ag-who__copy{direction:rtl;text-align:right}
html[dir='ltr'] .ag-who__copy{direction:ltr;text-align:left}
.ag-who h2,.ag-work h2{
  margin:0;font-size:clamp(2rem,3.2vw,3.55rem);line-height:1.18;font-weight:900;letter-spacing:-.018em;
}
html[dir='rtl'] .ag-who h2,html[dir='rtl'] .ag-work h2{line-height:1.3;letter-spacing:0}
.ag-who__body{max-width:620px;margin:17px 0 0;color:rgba(13,15,16,.76);font-size:clamp(.92rem,.98vw,1.04rem);line-height:1.9}
.ag-who__statement{max-width:630px;margin:18px 0 0;padding-inline-start:15px;border-inline-start:3px solid var(--ag-obsidian);font-size:clamp(.94rem,1.03vw,1.08rem);font-weight:700;line-height:1.85;color:rgba(13,15,16,.9)}
.ag-who__chips{margin-top:21px;display:flex;flex-wrap:wrap;gap:7px}
.ag-who__chips span{padding:8px 12px;border:1px solid rgba(13,15,16,.3);border-radius:7px;font-size:.76rem;font-weight:700;background:rgba(244,241,232,.08)}
.ag-who__visual{
  grid-area:visual;position:relative;z-index:12;
  min-height:565px;margin:0 0 -118px;
  display:flex;align-items:flex-end;justify-content:center;
  overflow:visible;background:transparent;
}
.ag-who__visual img{width:min(100%,505px);max-height:665px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 20px 33px rgba(13,15,16,.12))}

/* =========================================================
   WORK — four COVER cards, 2×2, compact copy
   ========================================================= */
.ag-work{
  position:relative;z-index:2;
  padding:118px 0 82px;
  overflow:hidden;background:var(--ag-obsidian);color:var(--ag-paper);
}
.ag-work::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 77% 0,rgba(243,198,0,.09),transparent 23%),linear-gradient(180deg,rgba(244,241,232,.018),transparent 38%)}
.ag-work__header{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;margin-bottom:28px}
.ag-work__header>div:first-child{max-width:690px}
.ag-work__header>div:first-child>p{max-width:610px;margin:11px 0 0;color:rgba(244,241,232,.62);font-size:.88rem;line-height:1.75}
.ag-work__filters{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ag-work__filters button{min-height:35px;padding:7px 14px;border:1px solid rgba(244,241,232,.18);border-radius:999px;background:transparent;color:rgba(244,241,232,.78);font-size:.74rem;cursor:pointer;transition:.18s ease}
.ag-work__filters button:hover,.ag-work__filters button.is-active{background:var(--ag-solar);color:var(--ag-obsidian);border-color:var(--ag-solar)}
.ag-work__grid{position:relative;z-index:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.ag-work-card{min-width:0;overflow:hidden;border:1px solid rgba(244,241,232,.14);border-radius:11px;background:#101213;transition:transform .24s ease,border-color .24s ease,opacity .2s ease}
.ag-work-card:hover{transform:translateY(-3px);border-color:rgba(243,198,0,.5)}
.ag-work-card.is-filtered-out{display:none}
.ag-work-card__media{aspect-ratio:16/9;min-height:0;overflow:hidden;background:#181a1b}
.ag-work-card__media::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent 63%,rgba(13,15,16,.2))}
.ag-work-card__media img{width:100%;height:100%;object-fit:cover;object-position:center}
.ag-work-card__placeholder{position:absolute;z-index:2;inset:0;display:grid;place-items:center;font-size:.8rem;font-weight:900;letter-spacing:.08em;color:rgba(244,241,232,.24)}
.ag-work-card__body{padding:16px 18px 18px}
.ag-work-card__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--ag-ash);font-size:.68rem}
.ag-work-card__meta b{color:var(--ag-solar)}
.ag-work-card h3{margin:7px 0 0;font-size:clamp(1.08rem,1.35vw,1.42rem);line-height:1.35}
.ag-work-card__body>p{margin:6px 0 0;color:rgba(244,241,232,.59);font-size:.79rem;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ag-work-card__body>a{margin-top:12px;display:inline-flex;align-items:center;gap:8px;color:var(--ag-paper);font-size:.77rem;font-weight:700}
.ag-work-card__body>a b{color:var(--ag-solar);font-size:1rem}
.ag-work__empty{padding:52px 20px;text-align:center;border:1px solid rgba(244,241,232,.13);color:var(--ag-ash)}

/* =========================================================
   FOOTER — simple legal center, no slogans
   ========================================================= */
.ag-footer-v3{background:#070808;color:var(--ag-paper);border-top:1px solid rgba(244,241,232,.1);padding:24px 0}
.ag-footer-v3__inner{min-height:54px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.ag-footer-v3__brand{justify-self:start;display:block}
.ag-footer-v3__brand img{display:block;width:145px;height:auto}
.ag-footer-v3__copyright{margin:0;justify-self:center;text-align:center;color:rgba(244,241,232,.56);font-size:.72rem;white-space:nowrap}
.ag-footer-v3__links{justify-self:end;display:flex;align-items:center;gap:14px}
.ag-footer-v3__links a{color:rgba(244,241,232,.66);font-size:.71rem}
.ag-footer-v3__links a:hover{color:#fff}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1280px){
  body.ag-home-v7 .navbar__links{display:none}
  body.ag-home-v7 .navbar-mobile{display:block}
  body.ag-home-v7 .hero-layout{grid-template-columns:minmax(0,58%) minmax(320px,42%)}
}

@media (max-width:1050px){
  body.ag-home-v7 .hero-section{min-height:920px;padding-top:84px}
  body.ag-home-v7 .hero-layout{grid-template-columns:1fr;grid-template-areas:'copy' 'visual';align-items:start;min-height:830px}
  body.ag-home-v7 .hero-copy{width:min(100%,720px);margin:14px 0 0;padding:0 0 12px;justify-self:end}
  body.ag-home-v7 .hero-copy h1{font-size:clamp(2rem,5.5vw,3.25rem)}
  body.ag-home-v7 .hero-visual{min-height:580px}
  body.ag-home-v7 .hero-screen-wrap{width:min(67vw,650px);left:18%;top:18px}
  body.ag-home-v7 .hero-character-shell{width:min(80vw,900px);left:-19vw;bottom:18px}
  body.ag-home-v7 .hero-popcorn-shell{width:min(34vw,350px);right:10px;bottom:15px}

  .ag-who{padding-top:46px}
  .ag-who__grid{grid-template-columns:1fr;grid-template-areas:'copy' 'visual';gap:4px}
  .ag-who__copy{max-width:760px;padding-bottom:8px}
  .ag-who__visual{min-height:500px;margin-bottom:-95px}
  .ag-who__visual img{width:min(67vw,490px)}
  .ag-work{padding-top:98px}
}

@media (max-width:760px){
  body.ag-home-v7 .site-header.ag-fixed-header{top:7px}
  body.ag-home-v7 .site-header .navbar{min-height:56px;border-radius:12px;padding:5px 6px 5px 9px}
  body.ag-home-v7 .navbar__brand img{width:112px}
  body.ag-home-v7 .language-switcher{display:none}
  body.ag-home-v7 .navbar__cta{font-size:.7rem;min-height:36px;padding:6px 10px}

  .ag-intro-v3__stage{height:270px}
  .ag-intro-v3__core{width:190px}

  body.ag-home-v7 .hero-section{min-height:825px;padding-top:76px}
  body.ag-home-v7 .hero-layout{min-height:740px}
  body.ag-home-v7 .hero-copy{margin-top:8px;padding-inline:6px}
  body.ag-home-v7 .hero-copy h1{font-size:clamp(1.9rem,9vw,2.8rem)}
  body.ag-home-v7 .hero-copy__description{font-size:.9rem;line-height:1.72}
  body.ag-home-v7 .hero-actions{margin-top:15px}
  body.ag-home-v7 .hero-actions .arabia-button{min-height:40px;font-size:.76rem}
  body.ag-home-v7 .hero-visual{min-height:500px}
  body.ag-home-v7 .hero-screen-wrap{width:82vw;top:43px;left:50%;transform:translateX(-50%)}
  body.ag-home-v7 .hero-character-shell{width:112vw;left:-39vw;bottom:13px}
  body.ag-home-v7 .hero-popcorn-shell{width:44vw;right:-4vw;bottom:8px}
  body.ag-home-v7 .hero-discover{bottom:2px;min-height:38px;font-size:.72rem}

  .ag-who{min-height:540px;padding-top:40px}
  .ag-who h2,.ag-work h2{font-size:clamp(1.9rem,8.2vw,2.65rem)}
  .ag-who__body,.ag-who__statement{font-size:.9rem;line-height:1.75}
  .ag-who__chips span{font-size:.7rem;padding:7px 10px}
  .ag-who__visual{min-height:430px;margin-bottom:-80px}
  .ag-who__visual img{width:min(88vw,470px);max-height:500px}

  .ag-work{padding:86px 0 62px}
  .ag-work__header{grid-template-columns:1fr;align-items:start;gap:14px;margin-bottom:22px}
  .ag-work__filters{justify-content:flex-start}
  .ag-work__grid{grid-template-columns:1fr;gap:12px}
  .ag-work-card__body{padding:14px 15px 16px}

  .ag-footer-v3__inner{grid-template-columns:1fr;justify-items:center;gap:12px}
  .ag-footer-v3__brand,.ag-footer-v3__links{justify-self:center}
  .ag-footer-v3__copyright{white-space:normal;order:3}
}

@media (max-width:480px){
  body.ag-home-v7 .navbar__brand img{width:102px}
  body.ag-home-v7 .hero-section{min-height:790px}
  body.ag-home-v7 .hero-visual{min-height:455px}
  body.ag-home-v7 .hero-character-shell{width:119vw;left:-45vw}
  body.ag-home-v7 .hero-popcorn-shell{width:49vw;right:-7vw}
  .ag-who__chips span{width:100%;text-align:center}
  .ag-work{padding-top:78px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
  .ag-intro-v3__field,.ag-intro-v3__core,.ag-intro-v3__symbol,.ag-intro-v3__beam,.ag-intro-v3__wordmark,.ag-progressive-shell::after,.hero-scroll-cue b{animation:none!important}
  .ag-intro-v3__symbol{opacity:0!important}
  .ag-intro-v3__wordmark{opacity:1!important;clip-path:none!important;transform:none!important;filter:none!important}
}

/* =========================================================
   HOME V7 REFINEMENT OVERRIDES
   - intro unchanged
   - larger top navigation type
   - hero screen restored behind the seated character
   - crisp progressive media (no blur-up haze)
   - tighter hero/about rhythm
   - richer portfolio controls
   - full navigation footer
   - section-to-section reveal motion
   ========================================================= */

/* Header: same structure, more readable type. */
body.ag-home-v7 .navbar__links{gap:clamp(11px,1.22vw,19px)}
body.ag-home-v7 .navbar__links a{
  font-size:clamp(.79rem,.84vw,.92rem);
  font-weight:700;
  letter-spacing:0;
}
body.ag-home-v7 .navbar__cta{
  min-height:42px;
  padding:8px 16px;
  font-size:.82rem;
  font-weight:800;
}

/* Progressive media: keep a low-res/solid preview but never blur the real media. */
.ag-progressive-shell::before{
  inset:0;
  filter:none;
  transform:none;
  opacity:1;
  background-position:center;
  background-size:cover;
  transition:opacity .22s ease;
}
.ag-progressive-shell::after{display:none!important}
img[data-ag-progressive]{
  opacity:0;
  filter:none!important;
  transform:none!important;
  transition:opacity .22s ease!important;
}
img[data-ag-progressive].is-decoded{opacity:1;filter:none;transform:none}

/* Hero geometry: restore the TV behind the sofa character, never above him. */
body.ag-home-v7 .hero-section{
  min-height:705px;
  padding-top:96px;
  padding-bottom:0;
}
body.ag-home-v7 .hero-layout{min-height:575px}
body.ag-home-v7 .hero-visual{min-height:575px}
body.ag-home-v7 .hero-screen-wrap{
  z-index:6;
  width:min(74%,720px);
  top:-8px;
  left:20.5%;
}
body.ag-home-v7 .hero-character-shell{z-index:8;bottom:12px}
body.ag-home-v7 .hero-copy{
  margin-top:-38px;
  padding-bottom:88px;
}
body.ag-home-v7 .hero-actions{gap:12px;margin-top:22px}
body.ag-home-v7 .hero-actions .arabia-button{
  min-height:49px;
  padding:11px 22px;
  border-radius:10px;
  font-size:.9rem;
  font-weight:800;
}
body.ag-home-v7 .hero-popcorn-shell{
  width:min(30vw,445px);
  right:clamp(8px,2vw,30px);
  bottom:5px;
}
body.ag-home-v7 .hero-discover{bottom:4px}

/* About: closer to hero, professional copy, character remains connected to work. */
.ag-who{
  min-height:570px;
  padding:34px 0 0;
}
.ag-who__grid{min-height:520px;gap:clamp(24px,4.1vw,60px)}
.ag-who__copy{max-width:670px;padding-bottom:44px}
.ag-who h2,.ag-work h2{
  font-size:clamp(1.92rem,2.8vw,3.18rem);
  line-height:1.2;
}
html[dir='rtl'] .ag-who h2,html[dir='rtl'] .ag-work h2{line-height:1.32}
.ag-who__body{
  margin-top:14px;
  font-size:clamp(.9rem,.94vw,1rem);
  line-height:1.82;
}
.ag-who__statement{
  margin-top:15px;
  font-size:clamp(.91rem,.97vw,1.02rem);
  line-height:1.78;
}
.ag-who__chips{margin-top:18px}
.ag-who__visual{min-height:535px;margin-bottom:-112px}
.ag-who__visual img{width:min(100%,515px);max-height:645px}

/* Portfolio toolbar: filter + shuffle + four at a time / all. */
.ag-work{padding:108px 0 78px}
.ag-work__header{align-items:end;margin-bottom:24px}
.ag-work__toolbar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
}
.ag-work__shuffle{
  min-height:35px;
  padding:7px 13px;
  border:1px solid rgba(244,241,232,.18);
  border-radius:999px;
  background:rgba(244,241,232,.045);
  color:var(--ag-paper);
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:.74rem;
  font-weight:800;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.ag-work__shuffle b{color:var(--ag-solar);font-size:.98rem;transition:transform .25s ease}
.ag-work__shuffle:hover{border-color:rgba(243,198,0,.58);background:rgba(243,198,0,.08);transform:translateY(-1px)}
.ag-work__shuffle:hover b{transform:rotate(75deg)}
.ag-work__grid{transition:opacity .14s ease,transform .18s ease}
.ag-work__grid.is-updating{opacity:.18;transform:translateY(5px)}
.ag-work-card[hidden]{display:none!important}
.ag-work-card.is-entering{animation:agV4CardIn .4s cubic-bezier(.2,.72,.25,1) both}
@keyframes agV4CardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.ag-work__more{
  position:relative;
  z-index:3;
  display:flex;
  justify-content:center;
  margin-top:25px;
}
.ag-work__more .arabia-button{min-height:43px;padding:9px 22px;font-size:.8rem;border-radius:999px}

/* Footer: useful again — brand explanation, navigation, legal row. */
.ag-footer-v4{
  background:#070808;
  color:var(--ag-paper);
  border-top:1px solid rgba(244,241,232,.1);
  padding:48px 0 20px;
}
.ag-footer-v4__top{
  display:grid;
  grid-template-columns:minmax(320px,1.35fr) minmax(170px,.58fr) minmax(210px,.72fr);
  gap:clamp(34px,5vw,82px);
  align-items:start;
  padding-bottom:30px;
}
.ag-footer-v4__brand img{width:176px;height:auto}
.ag-footer-v4__brand p{
  max-width:560px;
  margin:15px 0 0;
  color:rgba(244,241,232,.64);
  font-size:.83rem;
  line-height:1.85;
}
.ag-footer-v4__nav,.ag-footer-v4__contact{display:grid;align-content:start;gap:8px}
.ag-footer-v4__nav strong,.ag-footer-v4__contact strong{margin-bottom:5px;color:#fff;font-size:.84rem}
.ag-footer-v4__nav a,.ag-footer-v4__contact a{color:rgba(244,241,232,.64);font-size:.77rem;transition:color .18s ease}
.ag-footer-v4__nav a:hover,.ag-footer-v4__contact a:hover{color:var(--ag-solar)}
.ag-footer-v4__contact .ag-footer-v4__cta{
  width:max-content;
  margin-top:8px;
  padding:8px 12px;
  border:1px solid rgba(243,198,0,.52);
  border-radius:8px;
  color:var(--ag-paper);
}
.ag-footer-v4__contact .ag-footer-v4__cta span{color:var(--ag-solar)}
.ag-footer-v4__quick{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:7px;
  padding:18px 0;
  border-top:1px solid rgba(244,241,232,.085);
  border-bottom:1px solid rgba(244,241,232,.085);
}
.ag-footer-v4__quick a{
  min-height:32px;
  padding:6px 12px;
  border:1px solid rgba(244,241,232,.12);
  border-radius:999px;
  color:rgba(244,241,232,.7);
  font-size:.71rem;
  font-weight:700;
}
.ag-footer-v4__quick a:hover{border-color:rgba(243,198,0,.5);color:var(--ag-solar)}
.ag-footer-v4__bottom{
  min-height:48px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:16px;
  padding-top:14px;
}
.ag-footer-v4__bottom p{margin:0;text-align:center;color:rgba(244,241,232,.5);font-size:.71rem}
.ag-footer-v4__bottom>a{justify-self:end;color:rgba(244,241,232,.58);font-size:.7rem}
.ag-footer-v4__bottom>a:hover{color:#fff}

/* Section transitions: subtle, directional, never theatrical. */
html.has-ag-scroll-reveal [data-ag-reveal]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .62s cubic-bezier(.2,.72,.24,1),transform .72s cubic-bezier(.2,.72,.24,1);
}
html.has-ag-scroll-reveal [data-ag-reveal].is-in-view{opacity:1;transform:none}
.ag-section-transition::after{
  content:'';
  position:absolute;
  z-index:30;
  left:50%;
  top:0;
  width:min(220px,26vw);
  height:2px;
  transform:translateX(-50%) scaleX(0);
  transform-origin:center;
  background:linear-gradient(90deg,transparent,var(--ag-solar),transparent);
  opacity:.75;
  transition:transform .75s cubic-bezier(.2,.72,.24,1);
}
.ag-who.ag-section-transition::after{background:linear-gradient(90deg,transparent,rgba(13,15,16,.52),transparent)}
.ag-section-transition.is-section-visible::after{transform:translateX(-50%) scaleX(1)}

@media (max-width:1280px){
  body.ag-home-v7 .navbar__links a{font-size:.85rem}
  body.ag-home-v7 .hero-screen-wrap{z-index:6;width:min(69vw,690px);top:2px;left:16%}
  body.ag-home-v7 .hero-popcorn-shell{width:min(35vw,430px)}
}

@media (max-width:1050px){
  body.ag-home-v7 .hero-section{min-height:895px;padding-top:82px}
  body.ag-home-v7 .hero-layout{min-height:805px}
  body.ag-home-v7 .hero-copy{margin-top:10px;padding-bottom:10px}
  body.ag-home-v7 .hero-screen-wrap{z-index:6;width:min(66vw,640px);left:18%;top:6px}
  body.ag-home-v7 .hero-character-shell{bottom:8px}
  body.ag-home-v7 .hero-popcorn-shell{width:min(39vw,390px);bottom:5px}
  .ag-who{padding-top:32px}
  .ag-footer-v4__top{grid-template-columns:1fr 1fr}
  .ag-footer-v4__brand{grid-column:1/-1}
}

@media (max-width:760px){
  body.ag-home-v7 .navbar__cta{min-height:38px;font-size:.73rem;padding:7px 11px}
  body.ag-home-v7 .hero-section{min-height:815px;padding-top:74px}
  body.ag-home-v7 .hero-actions .arabia-button{min-height:44px;padding:9px 17px;font-size:.79rem}
  body.ag-home-v7 .hero-screen-wrap{z-index:6;width:82vw;top:43px;left:50%;transform:translateX(-50%)}
  body.ag-home-v7 .hero-character-shell{z-index:8;bottom:6px}
  body.ag-home-v7 .hero-popcorn-shell{width:51vw;right:-6vw;bottom:3px}
  .ag-who{padding-top:30px}
  .ag-who__copy{padding-bottom:6px}
  .ag-work__header{grid-template-columns:1fr;align-items:start;gap:14px}
  .ag-work__toolbar{justify-content:flex-start}
  .ag-work__grid{grid-template-columns:1fr}
  .ag-footer-v4{padding-top:38px}
  .ag-footer-v4__top{grid-template-columns:1fr;gap:28px}
  .ag-footer-v4__brand{grid-column:auto}
  .ag-footer-v4__bottom{grid-template-columns:1fr;justify-items:center;gap:9px}
  .ag-footer-v4__bottom>span{display:none}
  .ag-footer-v4__bottom>a{justify-self:center}
}

@media (prefers-reduced-motion:reduce){
  html.has-ag-scroll-reveal [data-ag-reveal]{opacity:1!important;transform:none!important;transition:none!important}
  .ag-section-transition::after{transition:none!important;transform:translateX(-50%) scaleX(1)!important}
  .ag-work-card.is-entering{animation:none!important}
}

/* =========================================================
   HOME V7 FINAL TUNING
   - larger desktop nav labels
   - hero TV + sofa shifted lower, channel controls forced visible
   - no blurry LQIP overlays; clean loading copy instead
   - polished copy rhythm and divider
   - shorter 2x2 work cards
   - more expressive but restrained section reveals
   ========================================================= */

/* Legacy intro-loading styles retained below for cascade compatibility; V7 disables that UI at the final override. */
.ag-intro-v5__loading{
  position:absolute;
  left:50%;
  bottom:8px;
  width:min(620px,82vw);
  transform:translateX(-50%) translateY(8px);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:rgba(244,241,232,.62);
  font-size:clamp(.72rem,.78vw,.84rem);
  line-height:1.7;
  text-align:center;
  opacity:0;
  animation:agV5LoadingCopy .48s ease 3.15s forwards;
}
.ag-intro-v5__loading b{
  min-width:42px;
  color:var(--ag-solar);
  font-size:.72rem;
  font-variant-numeric:tabular-nums;
}
@keyframes agV5LoadingCopy{to{opacity:1;transform:translateX(-50%) translateY(0)}}

/* Header links: visibly larger without changing the header shell. */
body.ag-home-v7 .navbar__links{gap:clamp(13px,1.34vw,21px)}
body.ag-home-v7 .navbar__links a{
  font-size:clamp(.94rem,1.02vw,1.08rem);
  font-weight:750;
  line-height:1.1;
}
body.ag-home-v7 .navbar__cta{
  min-height:44px;
  padding:9px 17px;
  font-size:.88rem;
}

/* Clean progressive state: never blur or tint real imagery. */
.ag-progressive-shell{
  background:#101213;
}
.ag-progressive-shell::before{display:none!important}
.ag-progressive-shell::after{display:none!important}
.ag-progressive-shell[data-ag-loading-text]::after{
  content:attr(data-ag-loading-text);
  position:absolute;
  z-index:3;
  inset:0;
  display:flex!important;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:
    radial-gradient(circle at 50% 42%,rgba(243,198,0,.08),transparent 34%),
    linear-gradient(145deg,#111314,#090a0a);
  color:rgba(244,241,232,.72);
  text-align:center;
  font-size:clamp(.72rem,.82vw,.86rem);
  font-weight:700;
  line-height:1.75;
  opacity:1;
  visibility:visible;
  transition:opacity .22s ease,visibility .22s ease;
  pointer-events:none;
}
.ag-progressive-shell[data-ag-loading-text]::before{
  content:'';
  display:block!important;
  position:absolute;
  z-index:4;
  left:50%;
  top:calc(50% - 34px);
  width:46px;
  height:2px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--ag-solar),transparent);
  opacity:.9;
}
.ag-progressive-shell.is-decoded[data-ag-loading-text]::after,
.ag-progressive-shell.is-decoded[data-ag-loading-text]::before{
  opacity:0;
  visibility:hidden;
}
.ag-progressive-shell--transparent{background:transparent!important}
.ag-progressive-shell--transparent::before,
.ag-progressive-shell--transparent::after{display:none!important}
img[data-ag-progressive]{opacity:0;filter:none!important;transform:none!important;transition:opacity .18s ease!important}
img[data-ag-progressive].is-decoded{opacity:1}

/* Hero: lower only the TV/sofa visual group, keep copy rhythm intact. */
body.ag-home-v7 .hero-section{
  min-height:735px;
  padding-top:102px;
}
body.ag-home-v7 .hero-layout{min-height:595px}
body.ag-home-v7 .hero-visual{min-height:595px}
body.ag-home-v7 .hero-screen-wrap{
  z-index:auto!important;
  width:min(74%,720px);
  top:18px;
  left:20.5%;
}
body.ag-home-v7 .hero-channel-number{position:relative;z-index:20}
body.ag-home-v7 .hero-screen{position:relative;z-index:6}
body.ag-home-v7 .channel-controls{
  position:relative;
  z-index:40!important;
  margin-top:10px;
  min-height:43px;
  padding:5px 8px;
  border-color:rgba(243,198,0,.28);
  box-shadow:0 9px 24px rgba(13,15,16,.22),0 0 0 1px rgba(244,241,232,.035) inset;
}
body.ag-home-v7 .channel-controls>button{width:32px;height:32px;font-size:1.05rem}
body.ag-home-v7 .hero-character-shell{z-index:8;bottom:-7px}
body.ag-home-v7 .hero-copy{
  margin-top:-30px;
  padding-bottom:92px;
}
body.ag-home-v7 .hero-copy h1{
  max-width:560px;
  font-size:clamp(2.03rem,3.02vw,3.4rem);
}
body.ag-home-v7 .hero-copy__description{
  max-width:540px;
  margin-top:17px;
  font-size:clamp(.93rem,.98vw,1.04rem);
  line-height:1.88;
}
body.ag-home-v7 .hero-actions{margin-top:23px;gap:12px}
body.ag-home-v7 .hero-actions .arabia-button{
  min-height:52px;
  padding:11px 24px;
  font-size:.92rem;
  border-radius:11px;
}
body.ag-home-v7 .hero-popcorn-shell{
  width:min(33vw,480px);
  right:clamp(4px,1.4vw,22px);
  bottom:2px;
}
body.ag-home-v7 .hero-discover{
  min-height:49px;
  bottom:7px;
  padding:8px 15px 8px 19px;
  border-color:rgba(243,198,0,.48);
  background:linear-gradient(180deg,#121414,#090a0a);
  font-size:.83rem;
  font-weight:800;
  box-shadow:0 10px 24px rgba(13,15,16,.2);
}
body.ag-home-v7 .hero-discover::before{
  content:'';
  width:6px;height:6px;border-radius:50%;
  background:var(--ag-solar);
  box-shadow:0 0 15px rgba(243,198,0,.55);
}
.ag-hero-about-divider{
  position:absolute;
  z-index:28;
  left:50%;bottom:0;
  width:min(1180px,86vw);
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(13,15,16,.18) 15%,rgba(13,15,16,.52) 50%,rgba(13,15,16,.18) 85%,transparent);
}
.ag-hero-about-divider span{
  position:absolute;left:50%;top:50%;
  width:9px;height:9px;border-radius:50%;
  transform:translate(-50%,-50%);
  background:var(--ag-solar);
  border:2px solid var(--ag-obsidian);
  box-shadow:0 0 0 5px rgba(243,198,0,.9);
}

/* About: cleaner official voice and tighter continuation from Hero. */
.ag-who{
  min-height:560px;
  padding:27px 0 0;
  border-top:0!important;
}
.ag-who.ag-section-transition::after{display:none!important}
.ag-who__grid{min-height:515px}
.ag-who__copy{max-width:690px;padding-bottom:34px}
.ag-who h2,.ag-work h2{
  font-size:clamp(1.9rem,2.68vw,3.05rem);
}
.ag-who__body{
  max-width:660px;
  margin-top:15px;
  font-size:clamp(.91rem,.96vw,1rem);
  line-height:1.9;
}
.ag-who__statement{
  max-width:665px;
  margin-top:16px;
  padding:12px 15px;
  border-inline-start:3px solid var(--ag-obsidian);
  border-radius:0 10px 10px 0;
  background:rgba(244,241,232,.11);
  font-size:clamp(.95rem,1vw,1.05rem);
  line-height:1.8;
}
html[dir='ltr'] .ag-who__statement{border-radius:10px 0 0 10px}
.ag-who__chips{margin-top:17px}
.ag-who__chips span{padding:8px 13px;border-radius:999px}
.ag-who__visual{min-height:525px;margin-bottom:-108px}
.ag-who__visual img{width:min(100%,520px);max-height:650px}

/* Work: same 2x2 structure, slightly shorter cards and clearer intro. */
.ag-work{padding:102px 0 72px}
.ag-work__header{margin-bottom:22px}
.ag-work__header>div:first-child>p{
  max-width:650px;
  font-size:.9rem;
  line-height:1.8;
}
.ag-work__grid{gap:14px}
.ag-work-card{border-radius:10px}
.ag-work-card__media{aspect-ratio:1.96/1}
.ag-work-card__body{padding:13px 16px 15px}
.ag-work-card h3{margin-top:6px;font-size:clamp(1.02rem,1.18vw,1.3rem)}
.ag-work-card__body>p{
  margin-top:5px;
  font-size:.76rem;
  line-height:1.58;
  -webkit-line-clamp:1;
}
.ag-work-card__body>a{margin-top:9px}
.ag-work__more{margin-top:22px}

/* More dimensional section reveals — still restrained. */
html.has-ag-scroll-reveal [data-ag-reveal]{
  opacity:0;
  --ag-rx:0px;
  --ag-ry:24px;
  transform:translate3d(var(--ag-rx),var(--ag-ry),0) scale(.992);
  transition:
    opacity .66s cubic-bezier(.2,.72,.24,1),
    transform .78s cubic-bezier(.2,.72,.24,1);
  will-change:opacity,transform;
}
html[dir='rtl'].has-ag-scroll-reveal [data-ag-reveal='copy']{--ag-rx:30px;--ag-ry:12px}
html[dir='ltr'].has-ag-scroll-reveal [data-ag-reveal='copy']{--ag-rx:-30px;--ag-ry:12px}
html[dir='rtl'].has-ag-scroll-reveal [data-ag-reveal='visual']{--ag-rx:-28px;--ag-ry:14px}
html[dir='ltr'].has-ag-scroll-reveal [data-ag-reveal='visual']{--ag-rx:28px;--ag-ry:14px}
html.has-ag-scroll-reveal [data-ag-reveal].is-in-view{opacity:1;transform:none}
.ag-work-card.is-entering{animation:agV5CardIn .5s cubic-bezier(.2,.72,.25,1) both}
.ag-work-card:nth-child(2).is-entering{animation-delay:.045s}
.ag-work-card:nth-child(3).is-entering{animation-delay:.09s}
.ag-work-card:nth-child(4).is-entering{animation-delay:.135s}
@keyframes agV5CardIn{from{opacity:0;transform:translateY(18px) scale(.99)}to{opacity:1;transform:none}}

@media (max-width:1280px){
  body.ag-home-v7 .navbar__links a{font-size:.95rem}
  body.ag-home-v7 .hero-screen-wrap{width:min(69vw,690px);top:26px;left:16%}
  body.ag-home-v7 .hero-popcorn-shell{width:min(37vw,455px)}
}
@media (max-width:1050px){
  body.ag-home-v7 .hero-section{min-height:915px;padding-top:86px}
  body.ag-home-v7 .hero-layout{min-height:825px}
  body.ag-home-v7 .hero-screen-wrap{width:min(66vw,640px);left:18%;top:26px}
  body.ag-home-v7 .hero-character-shell{bottom:-4px}
  body.ag-home-v7 .hero-popcorn-shell{width:min(41vw,420px);bottom:2px}
  body.ag-home-v7 .hero-copy{margin-top:10px;padding-bottom:12px}
}
@media (max-width:760px){
  .ag-intro-v5__loading{bottom:0;font-size:.68rem;gap:7px}
  body.ag-home-v7 .navbar__cta{font-size:.76rem}
  body.ag-home-v7 .hero-section{min-height:835px;padding-top:76px}
  body.ag-home-v7 .hero-screen-wrap{width:82vw;top:49px;left:50%;transform:translateX(-50%)}
  body.ag-home-v7 .hero-character-shell{bottom:-2px}
  body.ag-home-v7 .hero-popcorn-shell{width:54vw;right:-7vw;bottom:0}
  body.ag-home-v7 .hero-actions .arabia-button{min-height:46px;padding:9px 18px;font-size:.8rem}
  body.ag-home-v7 .hero-discover{min-height:43px;font-size:.75rem}
  .ag-who{padding-top:28px}
  .ag-who__statement{border-radius:8px;padding:10px 12px}
  .ag-work{padding:84px 0 60px}
  .ag-work-card__media{aspect-ratio:1.72/1}
}

@media (prefers-reduced-motion:reduce){
  .ag-intro-v5__loading{opacity:1;transform:translateX(-50%);animation:none}
}


/* =========================================================
   HOME V7 — BASELINE FROM V6.1
   Baseline inherited from V6.1; final V7 copy receives grammar-only polish.
   ========================================================= */

/* Header navigation: larger labels as explicitly requested. */
body.ag-home-v7 .navbar__links{gap:clamp(14px,1.42vw,23px)}
body.ag-home-v7 .navbar__links a{
  font-size:clamp(1.03rem,1.12vw,1.18rem)!important;
  font-weight:800;
  letter-spacing:0;
}
body.ag-home-v7 .navbar__cta{font-size:.94rem;min-height:46px;padding:10px 18px}

/* Keep page completely hidden behind the approved intro until critical media is ready. */
body.ag-home-v7.ag-intro-active .site-shell{
  opacity:0!important;
  visibility:hidden!important;
  filter:none!important;
}

/* No blur, gradient veil, tint or local loading plate over any image. */
.ag-progressive-shell,
.ag-work-card__media{background:transparent!important}
.ag-work-card__media{background:#101213!important}
.ag-progressive-shell::before,
.ag-progressive-shell::after,
.ag-progressive-shell[data-ag-loading-text]::before,
.ag-progressive-shell[data-ag-loading-text]::after{
  display:none!important;
  content:none!important;
}
img[data-ag-progressive]{
  opacity:0;
  filter:none!important;
  transform:none!important;
  transition:opacity .16s linear!important;
}
img[data-ag-progressive].is-decoded{opacity:1}

/* Legacy V6.1 intro loading block; disabled by the V7 final override below. */
.ag-intro-v5__loading{
  bottom:clamp(18px,4vh,44px);
  width:min(760px,88vw);
  flex-direction:column;
  gap:7px;
  color:rgba(244,241,232,.82);
  font-size:clamp(.82rem,.92vw,.98rem);
  font-weight:650;
}
.ag-intro-v5__loading b{
  min-width:0;
  color:var(--ag-solar);
  font-size:.78rem;
}

/* TV and seated character lower than the fixed header; controls live above the character. */
body.ag-home-v7 .hero-section{padding-top:108px;min-height:748px}
body.ag-home-v7 .hero-layout{min-height:610px}
body.ag-home-v7 .hero-visual{min-height:610px}
body.ag-home-v7 .hero-screen-wrap{
  top:46px!important;
  left:20.5%;
  width:min(74%,720px);
  z-index:auto!important;
  overflow:visible!important;
}
body.ag-home-v7 .hero-screen{z-index:5}
body.ag-home-v7 .hero-character-shell{z-index:8;bottom:-23px!important}
body.ag-home-v7 .channel-controls{
  position:absolute!important;
  z-index:80!important;
  left:50%;
  top:calc(100% + 9px);
  transform:translateX(-50%);
  margin:0!important;
  min-height:45px;
  padding:5px 9px;
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  border:1px solid rgba(243,198,0,.42);
  background:rgba(13,15,16,.985);
  box-shadow:0 12px 28px rgba(13,15,16,.28);
}
body.ag-home-v7 .channel-controls>button,
body.ag-home-v7 .hero-channel-progress button{
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
body.ag-home-v7 .channel-controls>button{width:34px;height:34px}

/* Keep popcorn/plant close to the CTA zone and preserve compact Hero→About spacing. */
body.ag-home-v7 .hero-popcorn-shell{width:min(34vw,500px);right:clamp(0px,1vw,18px);bottom:-2px}
body.ag-home-v7 .hero-discover{min-height:51px;font-size:.87rem;padding:9px 17px 9px 21px}

/* Cleaner divider: one controlled dark sweep with a solar core, no heavy bar. */
.ag-hero-about-divider{
  height:12px!important;
  bottom:-6px!important;
  background:none!important;
  overflow:visible;
}
.ag-hero-about-divider::before{
  content:'';
  position:absolute;
  left:50%;top:50%;
  width:min(980px,76vw);
  height:1px;
  transform:translate(-50%,-50%);
  background:linear-gradient(90deg,transparent,rgba(13,15,16,.18) 18%,rgba(13,15,16,.62) 50%,rgba(13,15,16,.18) 82%,transparent);
}
.ag-hero-about-divider span{
  width:28px!important;
  height:4px!important;
  border:0!important;
  border-radius:999px!important;
  background:var(--ag-obsidian)!important;
  box-shadow:inset 0 0 0 1px rgba(243,198,0,.35),0 0 0 4px rgba(243,198,0,.17)!important;
}

/* Preserve the user’s voice with calm professional typography. */
body.ag-home-v7 .hero-copy h1{font-size:clamp(2.03rem,3.02vw,3.4rem);max-width:575px}
body.ag-home-v7 .hero-copy__description{max-width:560px;line-height:1.92}
.ag-who__body{line-height:1.96}
.ag-who__statement{line-height:1.88}

/* Shorter work cards while retaining a four-card 2×2 desktop grid. */
.ag-work-card__media{aspect-ratio:2.12/1!important}
.ag-work-card__body{padding:12px 15px 13px!important}
.ag-work-card__body>p{-webkit-line-clamp:1!important;line-height:1.5!important}
.ag-work-card__body>a{margin-top:8px!important}

/* More readable section movement: direction + reveal sweep, no blur. */
.ag-section-transition{isolation:isolate}
.ag-section-transition::before{
  content:'';
  position:absolute;
  z-index:0;
  top:0;left:50%;
  width:min(1240px,90vw);
  height:1px;
  transform:translateX(-50%) scaleX(.18);
  transform-origin:center;
  opacity:0;
  background:linear-gradient(90deg,transparent,rgba(13,15,16,.2),transparent);
  transition:transform .85s cubic-bezier(.16,.8,.2,1),opacity .45s ease;
  pointer-events:none;
}
.ag-work.ag-section-transition::before{background:linear-gradient(90deg,transparent,rgba(244,241,232,.18),transparent)}
.ag-section-transition.is-section-visible::before{transform:translateX(-50%) scaleX(1);opacity:1}
html.has-ag-scroll-reveal [data-ag-reveal]{
  opacity:0;
  --ag-rx:0px;
  --ag-ry:32px;
  transform:translate3d(var(--ag-rx),var(--ag-ry),0) scale(.985);
  transition:opacity .72s cubic-bezier(.16,.8,.2,1),transform .9s cubic-bezier(.16,.8,.2,1);
}
html[dir='rtl'].has-ag-scroll-reveal [data-ag-reveal='copy']{--ag-rx:42px;--ag-ry:14px}
html[dir='rtl'].has-ag-scroll-reveal [data-ag-reveal='visual']{--ag-rx:-42px;--ag-ry:16px}
html[dir='ltr'].has-ag-scroll-reveal [data-ag-reveal='copy']{--ag-rx:-42px;--ag-ry:14px}
html[dir='ltr'].has-ag-scroll-reveal [data-ag-reveal='visual']{--ag-rx:42px;--ag-ry:16px}
html.has-ag-scroll-reveal [data-ag-reveal].is-in-view{opacity:1;transform:none}

@media (max-width:1280px){
  body.ag-home-v7 .navbar__links a{font-size:1rem!important}
  body.ag-home-v7 .hero-screen-wrap{top:42px!important;left:16%}
  body.ag-home-v7 .hero-character-shell{bottom:-18px!important}
}
@media (max-width:1050px){
  body.ag-home-v7 .hero-section{padding-top:92px}
  body.ag-home-v7 .hero-screen-wrap{top:44px!important}
  body.ag-home-v7 .hero-character-shell{bottom:-15px!important}
}
@media (max-width:760px){
  .ag-intro-v5__loading{bottom:18px;font-size:.76rem}
  body.ag-home-v7 .hero-screen-wrap{top:61px!important}
  body.ag-home-v7 .hero-character-shell{bottom:-10px!important}
  body.ag-home-v7 .channel-controls{top:calc(100% + 7px)}
  .ag-work-card__media{aspect-ratio:1.82/1!important}
}

/* =========================================================
   HOME V7 — FINAL POLISH
   - intro copy removed; approved intro visuals stay untouched
   - real tiny-image pixel previews while full media loads
   - smaller desktop navigation labels
   - more breathing room between Hero and About
   - cleaner, more expressive section entrances
   ========================================================= */

/* Header: a controlled step down from V6.1 — still readable, no oversized labels. */
body.ag-home-v7 .navbar__links{gap:clamp(12px,1.25vw,20px)}
body.ag-home-v7 .navbar__links a{
  font-size:clamp(.95rem,1.01vw,1.06rem)!important;
  font-weight:800;
}
body.ag-home-v7 .navbar__cta{font-size:.9rem}

/* The intro never contains a loading sentence/progress indicator in V7. */
.ag-intro-v5__loading,[data-ag-intro-loading],[data-ag-intro-progress]{display:none!important}

/* Real image preview system: tiny cached copy first, full image cross-fades over it. */
.ag-progressive-shell{
  position:relative;
  isolation:isolate;
}
.ag-pixel-preview{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  object-fit:cover;
  object-position:center;
  opacity:1;
  visibility:visible;
  image-rendering:crisp-edges;
  image-rendering:pixelated;
  transform:scale(1.012);
  transition:opacity .22s ease,visibility .22s ease;
  pointer-events:none;
  filter:none!important;
}
.hero-channel-slide>.ag-pixel-preview{object-fit:contain;background:#111415}
.ag-progressive-shell--transparent>.ag-pixel-preview{object-fit:contain;background:transparent}
.hero-character-shell>.ag-pixel-preview,.ag-who__visual>.ag-pixel-preview{object-position:center bottom}
.hero-popcorn-shell>.ag-pixel-preview{object-position:right bottom}

img[data-ag-progressive]{
  z-index:2;
  opacity:0;
  filter:none!important;
  transition:opacity .22s ease!important;
}
img[data-ag-progressive].is-decoded{opacity:1}
.ag-progressive-shell.is-decoded>.ag-pixel-preview{
  opacity:0!important;
  visibility:hidden!important;
}

/* Small copy over the image itself only while its full-resolution version is loading.
   It is intentionally a compact pill, never a veil or full-image overlay. */
.ag-progressive-shell[data-ag-loading-text]::before{display:none!important;content:none!important}
.ag-progressive-shell[data-ag-loading-text]::after{
  content:attr(data-ag-loading-text)!important;
  display:block!important;
  position:absolute!important;
  z-index:7!important;
  left:50%!important;
  top:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:max-content!important;
  max-width:min(86%,430px)!important;
  min-width:0!important;
  height:auto!important;
  padding:8px 12px!important;
  transform:translate(-50%,-50%)!important;
  border:1px solid rgba(244,241,232,.16)!important;
  border-radius:999px!important;
  background:rgba(13,15,16,.82)!important;
  color:#F4F1E8!important;
  box-shadow:0 8px 22px rgba(13,15,16,.18)!important;
  font-size:clamp(.64rem,.72vw,.76rem)!important;
  font-weight:700!important;
  line-height:1.45!important;
  text-align:center!important;
  white-space:normal!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none!important;
}
.ag-progressive-shell.is-decoded[data-ag-loading-text]::after{
  opacity:0!important;
  visibility:hidden!important;
  transition:opacity .16s ease,visibility .16s ease!important;
}
.ag-progressive-shell--transparent[data-ag-loading-text]::after{
  background:rgba(13,15,16,.76)!important;
  border-color:rgba(243,198,0,.28)!important;
}

/* Hero → About: restore breathing room without creating an empty dead zone. */
.ag-who{
  padding-top:clamp(68px,6.4vw,92px)!important;
}
.ag-who__grid{align-items:center}
.ag-hero-about-divider{
  width:min(1060px,80vw)!important;
  height:18px!important;
  bottom:-9px!important;
}
.ag-hero-about-divider::before{
  width:min(930px,72vw)!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(13,15,16,.12) 15%,rgba(13,15,16,.45) 44%,rgba(243,198,0,.62) 50%,rgba(13,15,16,.45) 56%,rgba(13,15,16,.12) 85%,transparent)!important;
}
.ag-hero-about-divider span{
  width:22px!important;
  height:3px!important;
  background:var(--ag-obsidian)!important;
  box-shadow:0 0 0 3px rgba(243,198,0,.22)!important;
}

/* Section motion: a soft directional arrival + line sweep. No blur and no heavy zoom. */
html.has-ag-scroll-reveal .ag-section-transition>.arabia-container{
  opacity:.72;
  transform:translate3d(0,34px,0) scale(.995);
  transition:opacity .72s cubic-bezier(.16,.8,.2,1),transform .96s cubic-bezier(.16,.8,.2,1);
  will-change:opacity,transform;
}
html.has-ag-scroll-reveal .ag-section-transition.is-section-visible>.arabia-container{
  opacity:1;
  transform:none;
}
html.has-ag-scroll-reveal [data-ag-reveal]{
  --ag-ry:28px;
  transform:translate3d(var(--ag-rx),var(--ag-ry),0) scale(.992);
  transition:opacity .76s cubic-bezier(.16,.8,.2,1),transform 1.02s cubic-bezier(.16,.8,.2,1);
}
html[dir='rtl'].has-ag-scroll-reveal [data-ag-reveal='copy']{--ag-rx:34px;--ag-ry:18px}
html[dir='rtl'].has-ag-scroll-reveal [data-ag-reveal='visual']{--ag-rx:-34px;--ag-ry:20px}
html[dir='ltr'].has-ag-scroll-reveal [data-ag-reveal='copy']{--ag-rx:-34px;--ag-ry:18px}
html[dir='ltr'].has-ag-scroll-reveal [data-ag-reveal='visual']{--ag-rx:34px;--ag-ry:20px}
html.has-ag-scroll-reveal [data-ag-reveal].is-in-view{opacity:1;transform:none}
.ag-section-transition::before{
  transition:transform 1.05s cubic-bezier(.16,.8,.2,1),opacity .55s ease!important;
}

@media (max-width:1280px){
  body.ag-home-v7 .navbar__links a{font-size:.93rem!important}
  .ag-who{padding-top:64px!important}
}
@media (max-width:1050px){
  .ag-who{padding-top:58px!important}
}
@media (max-width:760px){
  .ag-who{padding-top:50px!important}
  .ag-progressive-shell[data-ag-loading-text]::after{
    max-width:82%!important;
    padding:7px 10px!important;
    font-size:.64rem!important;
  }
  html.has-ag-scroll-reveal .ag-section-transition>.arabia-container{
    transform:translate3d(0,24px,0) scale(.997);
  }
}

@media (prefers-reduced-motion:reduce){
  .ag-pixel-preview,img[data-ag-progressive],
  html.has-ag-scroll-reveal .ag-section-transition>.arabia-container{
    transition:none!important;
  }
}

/* =========================================================
   HOME V7.6 — SMART MEDIA PIPELINE
   Research-driven priorities:
   - no loading copy / no veil / no shimmer
   - real 220px low-resolution preview while final image decodes
   - responsive optimized WebP derivatives generated at deploy
   - only true above-the-fold media gets high priority
   ========================================================= */

/* Kill every legacy loading-message layer from V5/V6/V7. */
.ag-progressive-shell[data-ag-loading-text]::before,
.ag-progressive-shell[data-ag-loading-text]::after,
.ag-progressive-shell::before,
.ag-progressive-shell::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  animation:none!important;
  background:none!important;
}

/* Never tint or blur the image container. Keep dimensions stable only. */
.ag-progressive-shell{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#111314!important;
}
.ag-progressive-shell--transparent{
  background:transparent!important;
}

/* Real low-resolution image — deliberately visible but not aggressively pixelated. */
.ag-pixel-preview{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  object-fit:cover!important;
  object-position:center!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  transform:none!important;
  image-rendering:auto!important;
  transition:opacity .24s cubic-bezier(.2,.75,.2,1),visibility .24s ease!important;
  pointer-events:none!important;
}
.hero-channel-slide>.ag-pixel-preview{
  object-fit:contain!important;
  background:#111415!important;
}
.ag-progressive-shell--transparent>.ag-pixel-preview{
  object-fit:contain!important;
  background:transparent!important;
}
.hero-character-shell>.ag-pixel-preview,
.ag-who__visual>.ag-pixel-preview{object-position:center bottom!important}
.hero-popcorn-shell>.ag-pixel-preview{object-position:right bottom!important}

/* Final responsive image cross-fades over the preview after decode. */
img[data-ag-progressive]{
  position:relative!important;
  z-index:2!important;
  opacity:0!important;
  filter:none!important;
  transform:none!important;
  transition:opacity .24s cubic-bezier(.2,.75,.2,1)!important;
}
img[data-ag-progressive].is-decoded{
  opacity:1!important;
}
.ag-progressive-shell.is-decoded>.ag-pixel-preview{
  opacity:0!important;
  visibility:hidden!important;
}

/* If a preview derivative is unavailable, do not show text or animated skeletons. */
.ag-progressive-shell.is-preview-unavailable{
  background:#111314!important;
}
.ag-progressive-shell--transparent.is-preview-unavailable{
  background:transparent!important;
}

/* Browser can skip rendering the distant portfolio until needed, while our JS can
   still warm the first four images in the network queue. */
.ag-work{
  content-visibility:auto;
  contain-intrinsic-size:1100px;
}

@media (prefers-reduced-motion:reduce){
  .ag-pixel-preview,
  img[data-ag-progressive]{transition:none!important}
}

/* =========================================================
   HOME V7.6 — FINAL NATIVE QUALITY PIPELINE
   - preview is the actual <img> source: never an empty media box
   - responsive 720/1440 WebP is the fast intermediate layer
   - untouched original file is loaded afterwards and becomes final
   - no loading sentence, blur veil, shimmer, or blocking media gate
   - popcorn/plant restored directly below the Hero actions
   ========================================================= */

/* The real preview is always visible from first paint. */
.ag-progressive-shell{
  position:relative!important;
  isolation:isolate!important;
}
.ag-progressive-shell::before,
.ag-progressive-shell::after,
.ag-progressive-shell[data-ag-loading-text]::before,
.ag-progressive-shell[data-ag-loading-text]::after,
.ag-pixel-preview{
  display:none!important;
  content:none!important;
}
.ag-progressive-shell--transparent{
  background:transparent!important;
  overflow:visible!important;
}

img[data-ag-progressive]{
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  transform:none!important;
  transition:opacity .14s ease!important;
}
img[data-ag-progressive][data-ag-quality="preview"]{
  image-rendering:crisp-edges!important;
  image-rendering:pixelated!important;
}
img[data-ag-progressive][data-ag-quality="intermediate"],
img[data-ag-progressive][data-ag-quality="final"]{
  image-rendering:auto!important;
}

/* Keep the TV image geometry identical through preview → original swaps. */
body.ag-home-v7 .hero-channel-slide img[data-ag-progressive]{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  background:transparent!important;
}

/* Sofa/person preview must retain transparency and framing. */
body.ag-home-v7 .hero-character-shell{
  overflow:visible!important;
}
body.ag-home-v7 .hero-character-shell img[data-ag-progressive],
.ag-who__visual img[data-ag-progressive]{
  object-fit:contain!important;
  object-position:center bottom!important;
}

/* Restore the approved popcorn/plant asset directly under the Hero buttons.
   Path remains /assets/hero/hero-popcorn-plant.webp?v=5; only placement changes. */
body.ag-home-v7 .hero-copy{
  padding-bottom:24px!important;
}
body.ag-home-v7 .hero-popcorn-shell{
  position:relative!important;
  z-index:22!important;
  display:block!important;
  width:min(60%,305px)!important;
  aspect-ratio:1.48!important;
  right:auto!important;
  left:auto!important;
  top:auto!important;
  bottom:auto!important;
  margin:11px 0 0 auto!important;
  overflow:visible!important;
  background:transparent!important;
  pointer-events:none!important;
}
body.ag-home-v7 .hero-popcorn-shell .hero-popcorn{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:right bottom!important;
}

@media (max-width:1050px){
  body.ag-home-v7 .hero-copy{padding-bottom:12px!important}
  body.ag-home-v7 .hero-popcorn-shell{
    width:min(46vw,285px)!important;
    margin-top:9px!important;
  }
}

@media (max-width:760px){
  body.ag-home-v7 .hero-popcorn-shell{
    width:min(48vw,230px)!important;
    margin-top:8px!important;
  }
}

@media (max-width:480px){
  body.ag-home-v7 .hero-popcorn-shell{width:min(52vw,205px)!important}
}

@media (prefers-reduced-motion:reduce){
  img[data-ag-progressive]{transition:none!important}
}

/* =========================================================
   HOME V7.6 — INSTANT TV / LARGER PLANT / REPLAYABLE MOTION
   - TV previews are embedded in HTML and also used as slide backgrounds
   - popcorn/plant returns to a visibly larger approved scale below the CTAs
   - section entrance states reset when leaving viewport and replay on re-entry
   ========================================================= */

/* The TV must never present an empty black frame while network quality improves. */
body.ag-home-v7 .hero-channel-slide{
  background-color:#17191a!important;
  background-size:contain!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
body.ag-home-v7 .hero-channel-slide img[data-ag-progressive]{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  background:transparent!important;
}

/* Restore a larger, clearer plant/popcorn composition directly below the buttons. */
body.ag-home-v7 .hero-popcorn-shell{
  width:min(88%,455px)!important;
  margin:5px 0 -4px auto!important;
  aspect-ratio:1.48!important;
}
body.ag-home-v7 .hero-popcorn-shell .hero-popcorn{
  object-fit:contain!important;
  object-position:right bottom!important;
}

/* Replayable motion: when observer removes the active state, elements return to
   their calm staging position; re-entering the viewport animates them again. */
html.has-ag-scroll-reveal [data-ag-reveal]{
  opacity:0;
  will-change:opacity,transform;
}
html.has-ag-scroll-reveal [data-ag-reveal].is-in-view{
  opacity:1;
  transform:none;
}
html.has-ag-scroll-reveal .ag-section-transition>.arabia-container{
  will-change:opacity,transform;
}

@media (max-width:1050px){
  body.ag-home-v7 .hero-popcorn-shell{
    width:min(62vw,395px)!important;
    margin-top:4px!important;
  }
}
@media (max-width:760px){
  body.ag-home-v7 .hero-popcorn-shell{
    width:min(66vw,315px)!important;
    margin-top:4px!important;
  }
}
@media (max-width:480px){
  body.ag-home-v7 .hero-popcorn-shell{
    width:min(70vw,275px)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  html.has-ag-scroll-reveal [data-ag-reveal]{opacity:1!important;transform:none!important}
}


/* =========================================================
   HOME V7.6 — THREE TV PREVIEWS + QUALITY NOTICE + HERO LOWER
   - all three TV channels keep their inline low-res preview resident
   - the low-res state is explained with a compact red notice
   - Hero copy moves slightly lower; plant remains attached below CTAs
   ========================================================= */

/* Hidden TV channels remain resident in the render tree (opacity only), so their
   inline preview pixels are ready before the user switches channels. */
body.ag-home-v7 .hero-channel-slide{
  visibility:visible!important;
  opacity:0;
  pointer-events:none!important;
  content-visibility:visible!important;
}
body.ag-home-v7 .hero-channel-slide.is-active{
  visibility:visible!important;
  opacity:1;
  pointer-events:auto!important;
}

/* Explain ONLY the temporary low-resolution state. No veil, no skeleton. */
.ag-progressive-shell.is-quality-preview::after{
  content:attr(data-ag-progress-label)!important;
  display:block!important;
  position:absolute!important;
  z-index:30!important;
  top:10px!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:max-content!important;
  max-width:calc(100% - 20px)!important;
  height:auto!important;
  transform:translateX(-50%)!important;
  padding:5px 9px!important;
  border:1px solid rgba(222,54,44,.48)!important;
  border-radius:999px!important;
  background:rgba(13,15,16,.72)!important;
  color:#ff5148!important;
  font-size:clamp(.61rem,.68vw,.72rem)!important;
  font-weight:900!important;
  line-height:1.35!important;
  text-align:center!important;
  white-space:nowrap!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none!important;
  box-shadow:0 6px 18px rgba(13,15,16,.15)!important;
}
.ag-progressive-shell:not(.is-quality-preview)::after{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Move the Hero copy down a controlled amount on desktop, while keeping the
   plant/popcorn composition directly attached beneath the CTA row. */
body.ag-home-v7 .hero-copy{
  margin-top:22px!important;
  padding-bottom:0!important;
}
body.ag-home-v7 .hero-actions{
  margin-top:19px!important;
}
body.ag-home-v7 .hero-popcorn-shell{
  width:min(90%,465px)!important;
  margin:2px 0 -5px auto!important;
}

@media (max-width:1050px){
  body.ag-home-v7 .hero-copy{margin-top:16px!important}
  body.ag-home-v7 .hero-popcorn-shell{margin-top:2px!important}
}
@media (max-width:760px){
  body.ag-home-v7 .hero-copy{margin-top:12px!important}
  .ag-progressive-shell.is-quality-preview::after{
    top:7px!important;
    max-width:calc(100% - 14px)!important;
    padding:4px 7px!important;
    font-size:.59rem!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .ag-progressive-shell.is-quality-preview::after{transition:none!important}
}

/* =========================================================
   HOME V7.6 — FINAL MEDIA STABILITY / COPY-ONLY HERO OFFSET
   - three TV previews are independent resident layers
   - TV/sofa geometry returns to the approved pre-lowering position
   - only the Hero copy/CTA/plant group moves lower
   - navigation keeps its current size but uses a lighter Thmanyah weight
   - plant/popcorn is ~12% larger and remains attached to the CTA row
   ========================================================= */

/* Same text size, slightly lighter Thmanyah Sans navigation. */
body.ag-home-v7 .navbar__links a{
  font-weight:700!important;
}

/* Restore ONLY TV + seated-character geometry; do not move them with the copy. */
body.ag-home-v7 .hero-screen-wrap{
  top:-8px!important;
}
body.ag-home-v7 .hero-character-shell{
  bottom:12px!important;
}

/* Move the textual Hero group lower without moving the TV or the seated man. */
body.ag-home-v7 .hero-copy{
  top:40px!important;
}

/* Keep buttons close to the copy and plant immediately beneath them. */
body.ag-home-v7 .hero-actions{
  margin-top:18px!important;
}
body.ag-home-v7 .hero-popcorn-shell{
  width:min(100%,525px)!important;
  margin:0 0 -7px auto!important;
}

/* Every TV channel owns a permanently resident inline low-resolution image.
   The upgrading image is a separate layer, so changing channel can never expose
   an empty/black frame while the 720/1440/original source is still downloading. */
body.ag-home-v7 .hero-channel-slide{
  background-color:#17191a!important;
  overflow:hidden!important;
}
body.ag-home-v7 .hero-channel-preview-static,
body.ag-home-v7 .hero-channel-quality-image{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:center!important;
  background:transparent!important;
  pointer-events:none!important;
}
body.ag-home-v7 .hero-channel-preview-static{
  z-index:1!important;
  opacity:1!important;
  visibility:visible!important;
  image-rendering:crisp-edges!important;
  image-rendering:pixelated!important;
  transition:opacity .22s ease!important;
}
body.ag-home-v7 .hero-channel-quality-image{
  z-index:2!important;
}
body.ag-home-v7 .hero-channel-quality-image[data-ag-quality="preview"]{
  opacity:0!important;
  visibility:visible!important;
}
body.ag-home-v7 .hero-channel-quality-image[data-ag-quality="intermediate"],
body.ag-home-v7 .hero-channel-quality-image[data-ag-quality="final"]{
  opacity:1!important;
  visibility:visible!important;
  image-rendering:auto!important;
}
body.ag-home-v7 .hero-channel-slide:not(.is-quality-preview) .hero-channel-preview-static{
  opacity:0!important;
}

/* Zero-gap native-quality promotion layer. The existing preview/intermediate
   remains underneath until the untouched original has loaded AND decoded. */
.ag-native-final-layer{
  position:absolute!important;
  inset:0!important;
  z-index:45!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  opacity:0!important;
  visibility:visible!important;
  pointer-events:none!important;
  transition:opacity .24s cubic-bezier(.2,.75,.25,1)!important;
  image-rendering:auto!important;
}
.ag-native-final-layer.is-visible{opacity:1!important}

@media (max-width:1050px){
  body.ag-home-v7 .hero-screen-wrap{top:2px!important}
  body.ag-home-v7 .hero-character-shell{bottom:8px!important}
  body.ag-home-v7 .hero-copy{top:30px!important}
  body.ag-home-v7 .hero-popcorn-shell{width:min(68vw,440px)!important;margin-top:0!important}
}
@media (max-width:760px){
  body.ag-home-v7 .hero-screen-wrap{top:43px!important}
  body.ag-home-v7 .hero-character-shell{bottom:6px!important}
  body.ag-home-v7 .hero-copy{top:18px!important}
  body.ag-home-v7 .hero-popcorn-shell{width:min(72vw,350px)!important;margin-top:0!important}
}
@media (max-width:480px){
  body.ag-home-v7 .hero-copy{top:12px!important}
  body.ag-home-v7 .hero-popcorn-shell{width:min(76vw,305px)!important}
}

@media (prefers-reduced-motion:reduce){
  .ag-native-final-layer,
  body.ag-home-v7 .hero-channel-preview-static{transition:none!important}
}

/* V7.6 zero-gap swap guard used for every progressive image promotion. */
.ag-swap-guard{
  position:absolute!important;
  inset:0!important;
  z-index:4!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none!important;
  transition:opacity .22s ease!important;
  image-rendering:auto!important;
}
.ag-swap-guard.is-leaving{opacity:0!important}
@media (prefers-reduced-motion:reduce){.ag-swap-guard{transition:none!important}}