/* =========================================================================
   ANAGHA — THE FRONTIER  (deeper intelligence · where tech goes next)
   Loads after engine.css. Dark "intelligence" band with a live neural mesh.
   ========================================================================= */
.frontier{
  position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(180deg,#06050F 0%, #0A0820 55%, #08071C 100%);
  padding:120px 0 124px;border-top:1px solid rgba(255,255,255,.06);
}
#neural{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.6;
  -webkit-mask-image:radial-gradient(1200px 820px at 72% 26%, #000 0%, transparent 74%);
  mask-image:radial-gradient(1200px 820px at 72% 26%, #000 0%, transparent 74%);}
.frontier::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(700px 460px at 6% 96%, rgba(243,180,48,.07), transparent 56%);}
.frontier .wrap{position:relative;z-index:3;}
.frontier .section-head h2{color:#fff;}
.frontier .section-head .eyebrow{color:var(--cyan-300);}

.fr-head{max-width:920px;}
.fr-head h2{font-size:clamp(32px,4.1vw,52px);letter-spacing:-.035em;line-height:1.04;}
.fr-head h2 .gl{
  background:linear-gradient(100deg,var(--cyan-300),var(--indigo-200));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.fr-head p{font-size:18px;color:rgba(255,255,255,.72);max-width:760px;}

/* pillars */
.fr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:54px;}
.fr-pillar{
  position:relative;border:1px solid rgba(255,255,255,.1);border-radius:18px;
  padding:26px 28px 22px;overflow:hidden;transition:transform .25s,border-color .25s,background .25s;
  background:linear-gradient(160deg, rgba(26,24,58,.46), rgba(9,8,26,.5));
  backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 26px 60px -38px #000;
}
.fr-pillar:hover{transform:translateY(-4px);border-color:rgba(70,210,255,.34);background:linear-gradient(160deg, rgba(28,30,70,.55), rgba(10,12,34,.55));}
.fr-pillar::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--cyan-400),rgba(70,210,255,.1));transform:scaleY(0);transform-origin:top;transition:transform .35s;}
.fr-pillar:hover::before{transform:scaleY(1);}
.fr-pillar .fnum{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;color:rgba(255,255,255,.4);}
.fr-pillar h3{display:flex;align-items:center;gap:13px;font-size:21px;margin:14px 0 18px;letter-spacing:-.02em;}
.fr-pillar h3 .fi{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;background:linear-gradient(150deg,var(--indigo-700),var(--indigo-600));color:var(--cyan-300);}
.fr-pillar h3 .fi svg{width:18px;height:18px;}
.fr-row{display:grid;grid-template-columns:104px 1fr;gap:14px;padding:12px 0;border-top:1px solid rgba(255,255,255,.07);}
.fr-row .lab{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;padding-top:3px;}
.fr-row.gap .lab{color:rgba(255,255,255,.4);}
.fr-row.nxt .lab{color:var(--cyan-300);}
.fr-row p{font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.8);}
.fr-row.gap p{color:rgba(255,255,255,.56);}

/* horizon footer banner */
.fr-foot{
  margin-top:22px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  border:1px solid rgba(70,210,255,.2);border-radius:18px;padding:22px 28px;
  background:linear-gradient(120deg, rgba(70,210,255,.06), rgba(243,180,48,.04));
}
.fr-foot .fh-now,.fr-foot .fh-next{display:flex;flex-direction:column;gap:4px;}
.fr-foot .fh-k{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.45);}
.fr-foot .fh-v{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.01em;}
.fr-foot .fh-next .fh-v{color:var(--cyan-300);}
.fr-foot .fh-arrow{color:rgba(255,255,255,.35);display:flex;align-items:center;}
.fr-foot .fh-arrow svg{width:30px;height:30px;}
.fr-foot .fh-note{margin-left:auto;font-size:13.5px;color:rgba(255,255,255,.66);max-width:360px;line-height:1.5;}

@media(max-width:880px){
  .fr-grid{grid-template-columns:1fr;}
  #neural{opacity:.4;}
  .fr-foot .fh-note{margin-left:0;flex-basis:100%;}
}
@media(max-width:680px){
  .frontier{padding:80px 0;}
  .fr-row{grid-template-columns:1fr;gap:4px;}
}