
/* ============================================================
   IVEON — AI ENGINEERING DETAIL SYSTEM / LOT 6
   Seven distinct technical compositions. White / grey dominant,
   black as stronger editorial punctuation for engineering.
   ============================================================ */

.ae-page{overflow:hidden;background:#fff;color:#111}
.ae-page .wrap{position:relative}
.ae-kicker{margin:0 0 24px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#595953}
.ae-dark .ae-kicker,.ae-hero--image .ae-kicker,.ae-hero--dark .ae-kicker,.ae-hero--split.dark-copy .ae-kicker,.ae-cinema .ae-kicker,.ae-band .ae-kicker,.ae-quote .ae-kicker,.ae-final.dark .ae-kicker{color:#fff}
.ae-title-xl{margin:0;max-width:1420px;font-size:clamp(58px,8.2vw,140px);line-height:.89;letter-spacing:-.065em;font-weight:500}
.ae-title{margin:0;max-width:1240px;font-size:clamp(46px,6vw,102px);line-height:.94;letter-spacing:-.057em;font-weight:500}
.ae-title-sm{margin:0;max-width:980px;font-size:clamp(36px,4.55vw,76px);line-height:.985;letter-spacing:-.05em;font-weight:500}
.ae-lede{margin:0;max-width:780px;color:#4e4e48;font-size:clamp(19px,1.5vw,25px);line-height:1.55;letter-spacing:-.016em}
.ae-copy{max-width:790px;color:#50504a;font-size:clamp(17px,1.28vw,21px);line-height:1.68;letter-spacing:-.01em}
.ae-copy p{margin:0 0 25px}.ae-copy p:last-child{margin-bottom:0}
.ae-long{max-width:990px;margin-left:auto}
.ae-long p{margin:0 0 29px;color:#44443f;font-size:clamp(18px,1.38vw,23px);line-height:1.72;letter-spacing:-.012em}
.ae-long p:first-child{font-size:clamp(24px,1.95vw,33px);line-height:1.48;color:#151514}
.ae-page .link{display:inline-flex;align-items:center;gap:10px}

/* HERO SYSTEM */
.ae-hero{position:relative;min-height:94svh;padding:calc(var(--header) + 78px) 0 82px;display:flex;align-items:flex-end;background:#fff;color:#111}
.ae-hero .wrap{z-index:2}
.ae-hero .ae-kicker{margin-bottom:34px}
.ae-hero-bottom{display:grid;grid-template-columns:minmax(320px,760px) auto;gap:70px;align-items:end;margin-top:50px}
.ae-hero-bottom .button{justify-self:start}
.ae-hero--paper{background:var(--paper)}
.ae-hero--dark{background:#090909;color:#fff}
.ae-hero--dark .ae-lede{color:#d6d6d0}
.ae-hero--image{min-height:100svh;color:#fff;background:#111}
.ae-hero--image .ae-hero-media{position:absolute;inset:0;background:center/cover no-repeat;filter:saturate(.82)}
.ae-hero--image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.62))}
.ae-hero--image .ae-lede{color:#f1f1ed}
.ae-hero--split{padding:0;display:grid;grid-template-columns:1.02fr .98fr;min-height:100svh;background:#fff}
.ae-hero--split .ae-hero-copy{padding:calc(var(--header) + 88px) var(--gutter) 82px;display:flex;flex-direction:column;justify-content:flex-end}
.ae-hero--split .ae-title-xl{font-size:clamp(56px,7vw,118px)}
.ae-hero--split .ae-lede{margin-top:38px}
.ae-hero--split .button{margin-top:38px;align-self:flex-start}
.ae-hero--split .ae-hero-media{min-height:100svh;background:center/cover no-repeat}
.ae-hero--split.dark-copy .ae-hero-copy{background:#090909;color:#fff}
.ae-hero--split.dark-copy .ae-lede{color:#c8c8c1}

/* LONG FORM / CORE SECTIONS */
.ae-section{padding:clamp(100px,11vw,180px) 0;background:#fff}
.ae-section.paper{background:var(--paper)}
.ae-section.grey{background:#e8e8e4}
.ae-section.ae-dark{background:#090909;color:#fff}
.ae-section.ae-dark .ae-copy,.ae-section.ae-dark .ae-long p{color:#b9b9b2}
.ae-section.ae-dark .ae-long p:first-child{color:#fff}
.ae-intro{display:grid;grid-template-columns:.58fr 1.42fr;gap:9vw;align-items:start}
.ae-side-note{max-width:280px;margin-top:52px;color:#74746e;font-size:13px;line-height:1.6}
.ae-dark .ae-side-note{color:#96968f}

/* TECHNICAL STACK / LAYERS */
.ae-stack{margin-top:74px;border-top:1px solid var(--line)}
.ae-stack-row{display:grid;grid-template-columns:80px minmax(210px,.85fr) minmax(330px,1.3fr) auto;gap:36px;align-items:start;padding:31px 0;border-bottom:1px solid var(--line)}
.ae-stack-row .num{padding-top:7px;color:#85857e;font-size:10px;font-weight:800;letter-spacing:.15em}
.ae-stack-row h3{margin:0;font-size:clamp(29px,3vw,51px);line-height:1.03;letter-spacing:-.044em;font-weight:500}
.ae-stack-row p{margin:5px 0 0;max-width:650px;color:#62625c;font-size:15px;line-height:1.6}
.ae-dark .ae-stack{border-color:#343431}
.ae-dark .ae-stack-row{border-color:#343431}
.ae-dark .ae-stack-row p{color:#aaa9a2}

/* FLOW DIAGRAMS */
.ae-flow{display:grid;grid-template-columns:repeat(5,1fr);margin-top:72px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.ae-flow.four{grid-template-columns:repeat(4,1fr)}
.ae-flow.six{grid-template-columns:repeat(6,1fr)}
.ae-flow-step{min-height:270px;padding:29px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}
.ae-flow-step span{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#85857f}
.ae-flow-step h3{margin:48px 0 15px;font-size:clamp(25px,2.3vw,40px);line-height:1.03;letter-spacing:-.04em;font-weight:500}
.ae-flow-step p{margin:0;color:#62625c;font-size:14px;line-height:1.55}
.ae-dark .ae-flow{border-color:#363633}
.ae-dark .ae-flow-step{border-color:#363633}
.ae-dark .ae-flow-step p{color:#aaa9a2}

/* GRID / MATRIX */
.ae-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:72px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.ae-grid.two{grid-template-columns:repeat(2,1fr)}
.ae-module{min-height:325px;padding:32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}
.ae-module.wide{grid-column:span 2}
.ae-module .meta{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#7c7c76}
.ae-module h3{margin:58px 0 18px;max-width:510px;font-size:clamp(29px,2.9vw,49px);line-height:1.03;letter-spacing:-.043em;font-weight:500}
.ae-module p{margin:0;max-width:520px;color:#5f5f59;font-size:15px;line-height:1.6}
.ae-module .link{margin-top:28px;align-self:flex-start}
.ae-dark .ae-grid{border-color:#363633}
.ae-dark .ae-module{border-color:#363633}
.ae-dark .ae-module p{color:#aaa9a2}

/* ARCHITECTURE MAP */
.ae-arch{margin-top:72px;border:1px solid var(--line);background:#fff}
.ae-arch-row{display:grid;grid-template-columns:190px 1fr;min-height:120px;border-bottom:1px solid var(--line)}
.ae-arch-row:last-child{border-bottom:0}
.ae-arch-label{padding:27px;border-right:1px solid var(--line);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#75756f}
.ae-arch-nodes{padding:22px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ae-node{padding:12px 15px;border:1px solid #c8c8c2;background:#f7f7f4;font-size:13px}
.ae-node.dark{background:#111;color:#fff;border-color:#111}
.ae-node.soft{background:#ecece8}

/* SPLIT & CINEMA */
.ae-split{display:grid;grid-template-columns:1fr 1fr;min-height:82svh;background:#fff}
.ae-split.reverse .ae-split-media{order:2}
.ae-split.reverse .ae-split-copy{order:1}
.ae-split-media{min-height:620px;background:center/cover no-repeat}
.ae-split-copy{padding:clamp(78px,8vw,135px) clamp(44px,6vw,105px);display:flex;flex-direction:column;justify-content:center;background:var(--paper)}
.ae-split-copy.white{background:#fff}
.ae-split-copy.dark{background:#090909;color:#fff}
.ae-split-copy.dark .ae-copy{color:#b9b9b2}
.ae-split-copy .ae-copy{margin-top:36px}
.ae-split-copy .link{margin-top:38px;align-self:flex-start}
.ae-cinema{position:relative;min-height:76svh;background:center/cover no-repeat;color:#fff}
.ae-cinema.tall{min-height:88svh}
.ae-cinema:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.5))}
.ae-cinema .wrap{position:absolute;z-index:2;left:0;right:0;bottom:42px}
.ae-cinema-caption{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px;align-items:end}
.ae-cinema-caption p{margin:0;max-width:730px;color:#f1f1ed;font-size:18px;line-height:1.58}

/* EDITORIAL RAIL */
.ae-rail{display:grid;grid-template-columns:.66fr 1.34fr;gap:9vw;align-items:start}
.ae-rail-list{border-top:1px solid var(--line)}
.ae-rail-item{padding:31px 0;border-bottom:1px solid var(--line)}
.ae-rail-item span{display:block;margin-bottom:13px;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#7d7d77}
.ae-rail-item h3{margin:0 0 14px;font-size:clamp(28px,2.75vw,47px);line-height:1.04;letter-spacing:-.04em;font-weight:500}
.ae-rail-item p{margin:0;max-width:680px;color:#62625c;font-size:15px;line-height:1.6}
.ae-rail-item .link{margin-top:20px}
.ae-dark .ae-rail-list,.ae-dark .ae-rail-item{border-color:#363633}
.ae-dark .ae-rail-item p{color:#aaa9a2}

/* BAND / QUOTE / CALLOUT */
.ae-band{padding:78px 0;background:#111;color:#fff}
.ae-band-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:90px;align-items:center}
.ae-band .ae-title-sm{max-width:920px}
.ae-band p{max-width:740px;margin:32px 0 0;color:#bdbdb6;font-size:18px;line-height:1.6}
.ae-quote{padding:clamp(90px,10vw,150px) 0;background:#090909;color:#fff}
.ae-quote blockquote{margin:54px 0 0;max-width:1320px;font-size:clamp(42px,6vw,96px);line-height:.99;letter-spacing:-.053em;font-weight:500}

/* PROOF */
.ae-proof{padding:clamp(100px,11vw,170px) 0;background:#fff}
.ae-proof.paper{background:var(--paper)}
.ae-proof-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:9vw;align-items:start}
.ae-proof-copy .ae-title-sm{margin:24px 0 34px}
.ae-proof-copy>p:not(.ae-kicker){max-width:680px;margin:0;color:#55554f;font-size:18px;line-height:1.6}
.ae-proof-copy .link{margin-top:38px}
.ae-proof-panel{min-height:470px;background:var(--paper);padding:44px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line)}
.ae-proof.paper .ae-proof-panel{background:#fff}
.ae-proof-panel .meta{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#777771}
.ae-proof-panel h3{margin:70px 0 22px;max-width:740px;font-size:clamp(35px,3.9vw,66px);line-height:1;letter-spacing:-.049em;font-weight:500}
.ae-proof-panel p{margin:0;max-width:650px;color:#5f5f59;font-size:16px;line-height:1.6}

/* FINAL */
.ae-final{padding:clamp(105px,12vw,190px) 0;background:#fff}
.ae-final.paper{background:var(--paper)}
.ae-final.dark{background:#090909;color:#fff}
.ae-final .ae-title{margin-top:22px}
.ae-final-bottom{display:grid;grid-template-columns:minmax(300px,740px) auto;gap:70px;align-items:end;margin-top:54px}
.ae-final-bottom p{margin:0;color:#55554f;font-size:clamp(18px,1.4vw,23px);line-height:1.58}
.ae-final.dark .ae-final-bottom p{color:#bcbcb5}

/* SMALL TECH DETAILS */
.ae-specs{margin-top:70px;border-top:1px solid var(--line)}
.ae-spec{display:grid;grid-template-columns:170px 1fr;gap:42px;padding:23px 0;border-bottom:1px solid var(--line)}
.ae-spec strong{font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.ae-spec span{color:#5f5f59;font-size:15px;line-height:1.6}
.ae-dark .ae-specs,.ae-dark .ae-spec{border-color:#363633}.ae-dark .ae-spec span{color:#aaa9a2}
.ae-ecosystem{display:grid;grid-template-columns:repeat(6,1fr);margin-top:70px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.ae-eco{min-height:130px;padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:flex-end;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#686862}

@media(max-width:1120px){
  .ae-hero--split,.ae-split{grid-template-columns:1fr}
  .ae-hero--split .ae-hero-media{min-height:58svh;order:-1}
  .ae-hero--split .ae-hero-copy{min-height:70svh}
  .ae-split-media{min-height:62svh}
  .ae-split.reverse .ae-split-media{order:0}.ae-split.reverse .ae-split-copy{order:0}
  .ae-intro,.ae-rail,.ae-proof-grid{grid-template-columns:1fr;gap:60px}
  .ae-long{margin-left:0}
  .ae-stack-row{grid-template-columns:60px 1fr auto}.ae-stack-row p{grid-column:2/-1}
  .ae-grid{grid-template-columns:1fr 1fr}
  .ae-flow,.ae-flow.six{grid-template-columns:repeat(3,1fr)}
  .ae-ecosystem{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:720px){
  .ae-title-xl{font-size:clamp(54px,15vw,82px)}.ae-title{font-size:clamp(44px,12vw,68px)}.ae-title-sm{font-size:clamp(36px,9.5vw,56px)}
  .ae-hero,.ae-hero--image{min-height:calc(94svh - 72px);padding:120px 0 58px}
  .ae-hero--split .ae-hero-copy{padding:110px 22px 65px;min-height:68svh}.ae-hero--split .ae-hero-media{min-height:48svh}
  .ae-hero-bottom,.ae-cinema-caption,.ae-band-grid,.ae-final-bottom{grid-template-columns:1fr;gap:30px}
  .ae-section{padding:96px 0}.ae-intro{gap:46px}.ae-side-note{margin-top:0}
  .ae-stack-row{grid-template-columns:34px 1fr;gap:18px;padding:26px 0}.ae-stack-row p,.ae-stack-row .link{grid-column:2}.ae-stack-row .link{justify-self:start}
  .ae-flow,.ae-flow.four,.ae-flow.six,.ae-grid,.ae-grid.two{grid-template-columns:1fr}
  .ae-module.wide{grid-column:auto}.ae-flow-step{min-height:230px}.ae-module{min-height:280px}
  .ae-arch-row{grid-template-columns:1fr}.ae-arch-label{border-right:0;border-bottom:1px solid var(--line)}
  .ae-split-media{min-height:56svh}.ae-split-copy{padding:76px 22px}
  .ae-cinema,.ae-cinema.tall{min-height:66svh}
  .ae-rail{gap:48px}.ae-band{padding:70px 0}
  .ae-quote blockquote{font-size:clamp(40px,11vw,64px)}
  .ae-proof-panel{min-height:400px;padding:30px}
  .ae-spec{grid-template-columns:1fr;gap:10px}
  .ae-ecosystem{grid-template-columns:1fr 1fr}.ae-eco{min-height:105px}
  .ae-final{padding:96px 0}
}
