/* ============================================================
   styles.css — component layout (ported from the studio system)
   ============================================================ */
/* hidden must win over inline display on overlays (modal/chat/lightbox) */
[hidden] { display: none !important; }


/* ---------- fixed top nav ---------- */
.ae-nav { position:fixed; top:0; left:0; right:0; z-index:100; transition:background .4s, border-color .4s, backdrop-filter .4s; background:transparent; border-bottom:1px solid transparent; }
.ae-nav.is-solid { background:color-mix(in srgb, var(--bg) 80%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom-color:var(--line); }
.ae-nav__inner { display:flex; align-items:center; justify-content:space-between; height:clamp(76px,5.4vw,100px); }
.ae-brand { display:flex; align-items:center; gap:clamp(11px,.8vw,16px); }
.ae-brand img { height:clamp(36px,2.6vw,50px); width:auto; display:block; filter:drop-shadow(0 0 10px rgba(0,229,255,.5)); }
.ae-brand__name { font-family:var(--font-display); font-weight:var(--display-weight); font-style:var(--display-style); font-size:clamp(19px,1.5vw,27px); letter-spacing:-0.02em; }
.ae-navlinks { display:flex; align-items:center; gap:clamp(28px,2.4vw,48px); }
.ae-nav-a { font-size:clamp(15px,1.05vw,19px); color:var(--muted); transition:color .3s; }
.ae-nav-a:hover, .ae-nav-a.is-active { color:var(--text); }
.ae-nav-cta { font-size:clamp(14px,1vw,17px); padding:clamp(12px,.95vw,17px) clamp(22px,1.7vw,34px); }
/* inner-page sticky nav variant */
.ae-nav--inner { position:sticky; background:color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.ae-nav--inner .ae-nav__inner { height:76px; }

/* magnetic wrapper */
.ae-magnetic { display:inline-block; transition:transform .5s var(--ease); }

@media (max-width:860px){ .ae-navlinks{ display:none !important; } .ae-nav-cta{ display:none !important; } .ae-burger{ display:flex !important; } }
@media (min-width:861px){ .ae-mobilemenu{ display:none; } }

/* ---------- hero ---------- */
.ae-hero { position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden; padding-top:clamp(104px,12vh,128px); padding-bottom:clamp(48px,6vh,64px); }
/* layout = Bootstrap .row.align-items-center.gx-lg-5; styling only here */
.ae-hero-grid { align-items:center; position:relative; z-index:2; width:100%; }
.ae-hero h1 { font-size:clamp(44px,5.6vw,104px); max-width:15ch; min-height:clamp(150px,17vw,320px); }
.ae-hero h1 .ae-tw { color:var(--accent); display:block; }
.ae-stats { display:flex; gap:clamp(24px,4vw,56px); margin-top:clamp(34px,5vw,58px); flex-wrap:wrap; }
.ae-stats .num { font-size:clamp(30px,3.4vw,54px); }
.ae-stats .lbl { font-size:clamp(10.5px,.8vw,13px); letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-top:6px; }
.ae-scrollcue { position:absolute; bottom:26px; right:32px; font-size:10px; letter-spacing:.3em; color:var(--faint); display:flex; flex-direction:column; align-items:center; gap:8px; }
.ae-scrollcue span { width:1px; height:34px; background:linear-gradient(var(--accent), transparent); }
@media (max-width:991px){ .ae-hero-right{ max-width:540px; } }
@media (max-height:760px),(max-width:760px){ .ae-scrollcue{ display:none !important; } }

/* hero backdrop */
.ae-hb { position:absolute; inset:0; z-index:0; }
.ae-hb__grid { position:absolute; inset:0; background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size:56px 56px; -webkit-mask-image:radial-gradient(120% 80% at 70% 20%, #000 0%, transparent 70%); mask-image:radial-gradient(120% 80% at 70% 20%, #000 0%, transparent 70%); animation:ae-grid 6s linear infinite; opacity:.6; }
.ae-hb__blob { position:absolute; top:-12%; right:4%; width:52vw; height:52vw; max-width:760px; max-height:760px; background:radial-gradient(circle, var(--accent-soft), transparent 62%); filter:blur(20px); transform:translate(calc(var(--px,0)*-40px), calc(var(--py,0)*-40px)); transition:transform .4s ease-out; }
.ae-hb__vignette { position:absolute; inset:0; background:radial-gradient(120% 100% at 50% 0%, transparent 55%, var(--bg) 100%); }
.ae-chip { position:absolute; animation:ae-float 6s ease-in-out infinite; display:flex; align-items:center; gap:9px; padding:9px 14px; border-radius:100px; background:color-mix(in srgb, var(--surface) 70%, transparent); border:1px solid var(--line); backdrop-filter:blur(8px); font-size:12px; }
.ae-chip i { width:7px; height:7px; border-radius:50%; background:var(--accent); animation:ae-pulse 2s infinite; }
@media (max-width:760px){ .ae-chip{ display:none !important; } }

/* ---------- reel / video tile ---------- */
.reel { position:relative; border-radius:var(--radius); overflow:hidden; cursor:pointer; background:var(--surface); border:1px solid var(--line); transition:transform .55s var(--ease), border-color .4s; }
.reel:hover { transform:translateY(-4px); border-color:var(--accent); }
.reel img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.reel:hover img { transform:scale(1.06); }
.reel__shade { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.6) 0%, rgba(0,0,0,.12) 42%, rgba(0,0,0,.34) 100%); transition:background .5s; }
.reel:hover .reel__shade { background:linear-gradient(to top, rgba(0,0,0,.6) 0%, rgba(0,0,0,.12) 42%, rgba(0,0,0,.18) 100%); }
.reel__corner { position:absolute; width:14px; height:14px; border-color:var(--line-2); border-style:solid; opacity:.6; }
.reel__play { position:absolute; inset:0; display:grid; place-items:center; }
.reel__play span { width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.14); color:#fff; backdrop-filter:blur(4px); border:1px solid rgba(255,255,255,.4); transition:all .45s var(--ease); }
.reel:hover .reel__play span { background:var(--accent); color:var(--accent-ink); border:0; transform:scale(1.08); box-shadow:0 14px 44px var(--accent-soft); }
.reel--lg .reel__play span { width:74px; height:74px; }
.reel__play svg { width:18px; margin-left:2px; }
.reel--lg .reel__play svg { width:24px; }
.reel__cap { position:absolute; left:0; right:0; bottom:0; display:flex; align-items:flex-end; justify-content:space-between; padding:16px; gap:12px; }
.reel--lg .reel__cap { padding:22px; }
.reel__title { flex:1 1 auto; min-width:0; font-family:var(--font-display); font-weight:var(--display-weight); font-style:var(--display-style); font-size:17px; letter-spacing:-0.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.reel--lg .reel__title { font-size:26px; }
.reel__idx { flex:none; font-size:11px; letter-spacing:.14em; color:var(--accent); text-transform:uppercase; white-space:nowrap; opacity:.7; transition:opacity .4s; }
.reel:hover .reel__idx { opacity:1; }

/* ---------- work grid (layout = Bootstrap .row.g-4 > .col-12.col-sm-6.col-lg-4) ---------- */

/* ---------- services accordion ---------- */
.ae-srow { border-bottom:1px solid var(--line); padding:clamp(20px,2.4vw,30px) 0; cursor:pointer; position:relative; }
.ae-srow__head { display:flex; align-items:center; gap:clamp(16px,3vw,40px); }
.ae-srow__n { font-size:13px; color:var(--accent); width:28px; flex:none; }
.ae-srow__name { font-size:clamp(26px,4.4vw,52px); flex:1; color:var(--muted); transition:color .4s; }
.ae-srow.is-open .ae-srow__name { color:var(--text); }
.ae-srow__chev { flex:none; width:40px; height:40px; border-radius:50%; border:1px solid var(--line-2); display:grid; place-items:center; color:var(--muted); transition:all .4s; transform:rotate(-45deg); }
.ae-srow.is-open .ae-srow__chev { color:var(--accent); border-color:var(--accent); transform:rotate(0); }
.ae-srow__body { display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease); }
.ae-srow.is-open .ae-srow__body { grid-template-rows:1fr; }
.ae-srow__bodyin { overflow:hidden; }
.ae-srow__detail { display:flex; gap:clamp(20px,4vw,60px); flex-wrap:wrap; padding-top:18px; padding-left:clamp(0px,6vw,68px); }
.ae-srow__detail p { font-size:18px; max-width:520px; margin:0; }
.ae-srow__tags { display:flex; gap:10px; flex-wrap:wrap; align-content:flex-start; }
.ae-tag { font-size:11px; letter-spacing:.1em; text-transform:uppercase; padding:7px 13px; border-radius:100px; border:1px solid var(--line-2); color:var(--muted); }
.ae-srow__bar { position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--accent); opacity:0; transition:opacity .4s; }
.ae-srow.is-open .ae-srow__bar { opacity:1; }

/* ---------- process timeline ---------- */
.ae-procwrap { position:relative; margin-top:60px; }
.ae-procline { position:absolute; top:0; left:0; right:0; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform 1.3s var(--ease); box-shadow:0 0 14px var(--grad-glow); }
.ae-procline.in { transform:scaleX(1); }
/* layout = Bootstrap .row.g-0 > .col-12.col-sm-6.col-lg (5 equal) */
.ae-pstep { position:relative; padding:30px 22px 28px 0; opacity:0; transform:translateY(26px) scale(.85); transition:opacity .8s var(--ease), transform .8s var(--ease), color .3s; transition-delay:var(--d,0s); border-radius:12px; }
.ae-pstep.in { opacity:1; transform:none; }
.ae-pstep:hover { transform:scale(.96); }
.ae-pstep h3 { transition:color .3s, text-shadow .3s; font-size:clamp(20px,2vw,26px); margin-top:16px; }
.ae-pstep:hover h3 { color:var(--accent); text-shadow:0 0 22px var(--grad-glow); }
.ae-pstep .pn { font-size:12px; color:var(--accent); letter-spacing:.12em; }
.ae-pstep p { font-size:14.5px; margin-top:12px; line-height:1.55; }
.ae-pdot { position:absolute; top:-5px; left:0; width:12px; height:12px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px var(--grad-glow); transform:scale(0); transition:transform .5s var(--ease); transition-delay:calc(var(--d,0s) + .35s); }
.ae-pstep.in .ae-pdot { transform:scale(1); }
@media (max-width:991px){ .ae-pstep{ padding-right:22px !important; } }

/* ---------- contact ---------- */
/* layout = Bootstrap .row.align-items-start.gx-lg-5.gy-5 > .col-12.col-lg-6 */
.ae-contact-grid { align-items:flex-start; }
.ae-contact-meta { margin-top:38px; display:flex; flex-direction:column; gap:16px; }
.ae-contact-meta > div { display:flex; gap:16px; align-items:baseline; border-bottom:1px solid var(--line); padding-bottom:14px; }
.ae-contact-meta .k { font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); width:120px; flex:none; }
.ae-contact-meta .v { font-size:16px; }


/* ---------- forms (field pairs = Bootstrap .row.g-3 > .col-12.col-sm-6) ---------- */
.ae-flabel { display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); margin-bottom:9px; }
.ae-input { width:100%; padding:13px 15px; background:var(--bg); color:var(--text); border:1px solid var(--line-2); border-radius:10px; font-family:var(--font-body); font-size:15.5px; outline:none; transition:border-color .25s; }
.ae-input:focus { border-color:var(--accent); }
textarea.ae-input { resize:vertical; min-height:104px; }

/* ---------- marquee ---------- */
.ae-marquee { overflow:hidden; width:100%; -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ae-marquee__row { display:flex; width:max-content; animation:ae-marquee 38s linear infinite; }
.ae-marquee__row > span { display:inline-flex; align-items:center; gap:38px; padding-right:38px; }
.ae-marquee__sep { color:var(--accent); font-size:13px; }

/* ---------- footer ---------- */
.ae-foot { padding:70px 0 40px; }
.ae-foot__top { display:flex; justify-content:space-between; flex-wrap:wrap; gap:30px; align-items:flex-end; }
.ae-foot__big { font-family:var(--font-display); font-weight:var(--display-weight); font-style:var(--display-style); font-size:clamp(40px,7vw,90px); line-height:.9; }
.ae-foot__cols { display:flex; gap:50px; flex-wrap:wrap; }
.ae-foot__h { font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-bottom:16px; }
.ae-foot__links { display:flex; flex-direction:column; gap:10px; }
.ae-foot-a { color:var(--muted); font-size:15px; transition:color .25s, text-shadow .25s; width:fit-content; }
.ae-foot-a:hover { color:var(--accent); text-shadow:0 0 18px var(--grad-glow); }
/* layout = Bootstrap .row.g-4 > .col-12.col-md-4 */
.ae-foot-offices { margin-top:54px; padding-top:30px; border-top:1px solid var(--line); }
.ae-foot-office__h { display:flex; align-items:center; gap:10px; margin-bottom:9px; }
.ae-foot-office__h span.flag { font-size:22px; line-height:1; }
.ae-foot-office__h span.city { font-family:var(--font-display); font-weight:600; font-size:16px; letter-spacing:-0.01em; }
.ae-foot-office__addr { font-size:13.5px; line-height:1.55; }
.ae-foot__bar { margin-top:40px; padding-top:26px; border-top:1px solid var(--line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.ae-foot__bar span { font-size:12px; color:var(--faint); }


/* ---------- section heading ---------- */
.ae-sechead { max-width:880px; }
.ae-sechead.center { max-width:760px; margin:0 auto; text-align:center; }
.ae-sechead h2 { font-size:clamp(34px,5vw,62px); margin-top:22px; }
.ae-sechead p { font-size:18px; margin-top:20px; max-width:620px; }
.ae-sechead.center p { margin-left:auto; margin-right:auto; }

/* page header (inner pages) */
.ae-pagehead { padding:clamp(86px,11vw,140px) 0 clamp(0px,1vw,10px); position:relative; }
.ae-pagehead h1 { font-size:clamp(40px,7vw,92px); margin-top:20px; max-width:15ch; }
.ae-pagehead p { font-size:clamp(16px,1.7vw,19px); margin-top:22px; max-width:600px; }