
/* ICODE MEDIA · About Premium V6 */
.about-premium{
  --ab-bg:#05070a;
  --ab-panel:#0b1016;
  --ab-panel2:#101722;
  --ab-line:rgba(255,255,255,.095);
  --ab-muted:#8f98a6;
  --ab-copper:#dda06e;
  --ab-copper-light:#f3c58c;
  --ab-ink:#f7f5f2;
  --ab-max:1440px;
  position:relative;
  overflow:hidden;
  padding-top:132px;
  background:
    radial-gradient(circle at 82% 4%,rgba(29,69,126,.20),transparent 29%),
    radial-gradient(circle at 0 24%,rgba(221,160,110,.075),transparent 25%),
    var(--ab-bg);
  color:var(--ab-ink);
}
.about-premium *{box-sizing:border-box}
.about-premium a{text-decoration:none}

.about-hero,
.about-statement,
.about-pillars,
.about-capabilities,
.about-method,
.about-manifesto,
.about-final{
  width:min(calc(100% - 40px),var(--ab-max));
  margin-inline:auto;
}

.about-hero{
  min-height:calc(100svh - 132px);
  padding:58px 0 80px;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:70px;
  align-items:center;
}
.about-kicker,
.about-section-head>div>span,
.about-method-copy>span,
.about-manifesto-copy>span,
.about-final>div>span{
  display:block;
  color:var(--ab-copper);
  font-size:9px;
  font-weight:900;
  letter-spacing:.22em;
}
.about-hero h1,
.about-section-head h2,
.about-method-copy h2,
.about-manifesto h2,
.about-final h2{
  margin:14px 0 22px;
  font-size:clamp(58px,6.5vw,104px);
  line-height:.85;
  letter-spacing:-.075em;
}
.about-hero h1 em,
.about-section-head h2 em,
.about-method-copy h2 em,
.about-manifesto h2 em,
.about-final h2 em{
  color:var(--ab-copper);
  font-style:normal;
}
.about-hero-copy>p{
  max-width:680px;
  margin:0;
  color:#a0a8b4;
  font-size:15px;
  line-height:1.76;
}
.about-actions{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  margin-top:30px;
}
.about-btn{
  min-height:58px;
  padding:0 20px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  font-size:10px;
  font-weight:900;
  transition:.25s ease;
}
.about-btn.primary{
  background:linear-gradient(135deg,var(--ab-copper-light),var(--ab-copper));
  color:#0a0b0e;
  box-shadow:0 16px 45px rgba(221,160,110,.13);
}
.about-btn.primary:hover{transform:translateY(-3px);box-shadow:0 22px 55px rgba(221,160,110,.24)}
.about-btn.ghost{
  border:1px solid rgba(221,160,110,.4);
  color:#fff;
  background:rgba(11,16,22,.65);
}
.about-btn.ghost:hover{background:#fff;color:#080a0d;border-color:#fff}
.about-tags{
  display:flex;
  align-items:center;
  gap:11px;
  flex-wrap:wrap;
  margin-top:27px;
  color:#68727f;
  font-size:7px;
  letter-spacing:.12em;
}
.about-tags i{width:4px;height:4px;border-radius:50%;background:var(--ab-copper)}

.about-system{
  position:relative;
  aspect-ratio:1;
  min-height:570px;
  overflow:hidden;
  border:1px solid var(--ab-line);
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,rgba(29,69,126,.18),transparent 32%),
    #070b10;
  box-shadow:0 55px 130px rgba(0,0,0,.46);
  transition:transform .16s ease;
}
.about-system-grid{
  position:absolute;inset:0;opacity:.25;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle,#000 55%,transparent 76%);
}
.about-radar{
  position:absolute;
  border:1px solid rgba(221,160,110,.18);
  border-radius:50%;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
}
.radar-a{width:68%;height:68%}
.radar-b{width:42%;height:42%}
.about-system:after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:1px;height:82%;
  background:linear-gradient(transparent,rgba(255,255,255,.12),transparent);
  transform:translate(-50%,-50%) rotate(42deg);
}
.about-center{
  position:absolute;z-index:3;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  width:235px;height:235px;
  border-radius:50%;
  border:1px solid rgba(221,160,110,.32);
  background:rgba(5,7,10,.86);
  backdrop-filter:blur(12px);
  display:grid;
  place-content:center;
  text-align:center;
  box-shadow:0 0 80px rgba(221,160,110,.08);
}
.about-center img{display:block;width:165px;max-width:85%;height:auto;margin:0 auto}
.about-center small{display:block;margin-top:16px;color:#68727f;font-size:6px;letter-spacing:.14em}
.about-node{
  position:absolute;z-index:4;
  width:168px;
  min-height:104px;
  padding:13px;
  border:1px solid var(--ab-line);
  border-radius:16px;
  background:rgba(11,16,22,.86);
  backdrop-filter:blur(12px);
  color:#fff;
  transition:.25s ease;
}
.about-node:hover{
  transform:translateY(-5px);
  border-color:rgba(221,160,110,.5);
  background:var(--ab-panel2);
}
.about-node small{display:block;color:#58626e;font-size:6px}
.about-node b{display:block;margin-top:14px;font-size:16px}
.about-node span{display:block;margin-top:5px;color:#7f8996;font-size:7px}
.about-node.n1{left:4%;top:15%}
.about-node.n2{right:3%;top:20%}
.about-node.n3{left:8%;bottom:13%}
.about-node.n4{right:5%;bottom:11%}

.about-statement{
  padding:34px 0 56px;
  border-top:1px solid var(--ab-line);
  display:grid;
  grid-template-columns:130px 1fr auto;
  gap:28px;
  align-items:start;
}
.about-statement>span{color:var(--ab-copper);font-size:7px;letter-spacing:.17em}
.about-statement p{
  margin:0;
  max-width:1040px;
  font-size:clamp(28px,3.1vw,50px);
  line-height:1.08;
  letter-spacing:-.04em;
}
.about-statement>b{
  writing-mode:vertical-rl;
  color:#343e49;
  font-size:8px;
  letter-spacing:.14em;
}

.about-pillars,
.about-capabilities,
.about-method{
  padding:85px 0;
  border-top:1px solid var(--ab-line);
}
.about-section-head{
  display:grid;
  grid-template-columns:1fr .62fr;
  gap:55px;
  align-items:end;
}
.about-section-head h2,
.about-method-copy h2,
.about-manifesto h2,
.about-final h2{
  font-size:clamp(48px,5.2vw,82px);
  line-height:.89;
}
.about-section-head>p,
.about-method-copy>p,
.about-manifesto-copy>p,
.about-final>div>p{
  margin:0;
  color:var(--ab-muted);
  font-size:13px;
  line-height:1.75;
}

.about-pillar-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin-top:34px;
}
.about-pillar-grid article{
  min-height:370px;
  padding:20px;
  border:1px solid var(--ab-line);
  border-radius:18px;
  background:var(--ab-panel);
  display:flex;
  flex-direction:column;
  transition:.28s ease;
}
.about-pillar-grid article:hover{
  transform:translateY(-5px);
  border-color:rgba(221,160,110,.42);
  background:
    radial-gradient(circle at 100% 0,rgba(29,69,126,.16),transparent 38%),
    var(--ab-panel2);
}
.about-pillar-grid small{color:#46515d;font-size:7px}
.about-pillar-grid>article>span{margin-top:45px;color:var(--ab-copper);font-size:7px;letter-spacing:.15em}
.about-pillar-grid h3{margin:auto 0 12px;font-size:27px;line-height:1;letter-spacing:-.045em}
.about-pillar-grid p{margin:0;color:#7e8996;font-size:10px;line-height:1.67}

.about-capability-board{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  margin-top:34px;
}
.about-capability-board>a{
  min-height:315px;
  padding:25px;
  border:1px solid var(--ab-line);
  border-radius:20px;
  background:
    linear-gradient(145deg,rgba(16,23,34,.88),rgba(7,11,16,.95));
  color:#fff;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
  transition:.28s ease;
}
.about-capability-board>a:before{
  content:"";
  position:absolute;
  width:230px;height:230px;
  right:-100px;top:-100px;
  border-radius:50%;
  background:rgba(29,69,126,.16);
  filter:blur(35px);
  transition:.28s;
}
.about-capability-board>a:hover{
  transform:translateY(-5px);
  border-color:rgba(221,160,110,.44);
}
.about-capability-board>a:hover:before{background:rgba(221,160,110,.15)}
.about-capability-board small{position:relative;z-index:2;color:var(--ab-copper);font-size:7px;letter-spacing:.15em}
.about-capability-board h3{position:relative;z-index:2;margin:auto 0 10px;font-size:38px;letter-spacing:-.05em}
.about-capability-board p{position:relative;z-index:2;margin:0;max-width:580px;color:#7f8995;line-height:1.65;font-size:10px}
.about-capability-board b{position:relative;z-index:2;margin-top:20px;color:var(--ab-copper);font-size:8px}

.about-method{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:60px;
  align-items:start;
}
.about-method-copy{position:sticky;top:145px}
.about-method-steps{display:grid;gap:8px}
.about-method-steps article{
  min-height:158px;
  padding:20px;
  border:1px solid var(--ab-line);
  border-radius:16px;
  background:var(--ab-panel);
  display:grid;
  grid-template-columns:55px 1fr;
  gap:22px;
  align-items:center;
}
.about-method-steps small{color:#46515d;font-size:7px}
.about-method-steps b{display:block;color:var(--ab-copper);font-size:25px}
.about-method-steps p{margin:9px 0 0;color:#7c8794;font-size:10px;line-height:1.6}

.about-manifesto{
  min-height:610px;
  padding:60px;
  margin-top:12px;
  border:1px solid var(--ab-line);
  border-radius:30px;
  background:
    radial-gradient(circle at 15% 20%,rgba(29,69,126,.28),transparent 31%),
    radial-gradient(circle at 90% 85%,rgba(221,160,110,.13),transparent 30%),
    #070b10;
  display:grid;
  grid-template-columns:1fr 390px;
  gap:55px;
  align-items:center;
  overflow:hidden;
}
.about-manifesto-copy>p{max-width:830px}
.about-flow{
  display:flex;
  gap:9px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:30px;
  color:#66717f;
  font-size:7px;
  letter-spacing:.09em;
}
.about-flow span{
  padding:8px 10px;
  border:1px solid var(--ab-line);
  border-radius:999px;
  background:rgba(11,16,22,.74);
}
.about-flow i{color:var(--ab-copper);font-style:normal}
.about-manifesto-card{
  justify-self:end;
  width:100%;
  padding:35px;
  border:1px solid rgba(221,160,110,.3);
  border-radius:24px;
  background:rgba(5,7,10,.76);
  backdrop-filter:blur(15px);
}
.about-manifesto-card img{display:block;width:235px;max-width:100%;height:auto}
.about-manifesto-card small{display:block;margin-top:38px;color:#66717f;font-size:6px;letter-spacing:.16em}
.about-manifesto-card strong{display:block;margin-top:8px;color:var(--ab-copper);font-size:42px;letter-spacing:-.05em}

.about-final{
  padding:95px 0 100px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:45px;
  align-items:end;
}
.about-final>div>p{max-width:720px}
.about-final .about-actions{margin:0}

.about-reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .65s ease,transform .65s ease;
}
.about-reveal.in{
  opacity:1;
  transform:none;
}

@media(max-width:1120px){
  .about-hero{grid-template-columns:1fr}
  .about-system{max-width:760px}
  .about-pillar-grid{grid-template-columns:repeat(2,1fr)}
  .about-method{grid-template-columns:1fr}
  .about-method-copy{position:relative;top:auto}
  .about-manifesto{grid-template-columns:1fr}
  .about-manifesto-card{justify-self:start;max-width:460px}
}
@media(max-width:760px){
  .about-premium{padding-top:105px}
  .about-hero,.about-statement,.about-pillars,.about-capabilities,.about-method,.about-manifesto,.about-final{
    width:calc(100% - 20px);
  }
  .about-hero{padding-top:34px;gap:45px}
  .about-hero h1{font-size:53px}
  .about-hero-copy>p{font-size:12px}
  .about-btn{width:100%}
  .about-system{min-height:0;aspect-ratio:1/1.08;border-radius:28px}
  .about-center{width:180px;height:180px}
  .about-center img{width:125px}
  .about-node{width:138px;min-height:88px;padding:10px}
  .about-node b{font-size:13px;margin-top:10px}
  .about-node.n1{left:3%;top:8%}
  .about-node.n2{right:3%;top:11%}
  .about-node.n3{left:3%;bottom:7%}
  .about-node.n4{right:3%;bottom:5%}
  .about-statement{grid-template-columns:1fr;gap:15px}
  .about-statement>b{display:none}
  .about-section-head{grid-template-columns:1fr;gap:20px}
  .about-section-head h2,.about-method-copy h2,.about-manifesto h2,.about-final h2{font-size:45px}
  .about-pillar-grid,.about-capability-board{grid-template-columns:1fr}
  .about-pillar-grid article{min-height:300px}
  .about-manifesto{padding:28px;min-height:auto}
  .about-final{grid-template-columns:1fr;padding-top:70px}
  .about-final .about-actions{margin-top:0}
}
@media(max-width:470px){
  .about-system{min-height:530px;aspect-ratio:auto}
  .about-center{width:165px;height:165px}
  .about-node{width:125px}
  .about-node span{font-size:6px}
}
@media(prefers-reduced-motion:reduce){
  .about-reveal{opacity:1;transform:none;transition:none}
  .about-system{transition:none}
}
