/* About only. Typography remains controlled by Nexito's existing theme. */
body[data-page="about"] .nx-about-studio {
  --nx-about-motion-ready: 1;
  gap: 22px;
}
body[data-page="about"] .nx-about-studio .nx-about-hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap: 32px;
  min-height: 370px;
  padding: clamp(26px, 3.3vw, 44px);
  border-color: rgba(105, 182, 203, .23);
  background: radial-gradient(ellipse at 5% 20%, rgba(55, 144, 166, .1), transparent 58%), linear-gradient(125deg, #0e1e2e, #0a1522 65%, #0e192b);
  box-shadow: inset 0 1px rgba(218, 247, 255, .035), 0 18px 50px rgba(0, 3, 10, .14);
  isolation: isolate;
}
body[data-page="about"] .nx-about-studio .nx-about-hero::after {
  width: 440px;
  background: radial-gradient(circle, rgba(72, 147, 181, .13), transparent 68%);
  z-index: -1;
}
body[data-page="about"] .nx-about-studio :is(h1, h2, p) {
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  -webkit-hyphens: none !important;
}
body[data-page="about"] .nx-about-studio .nx-about-hero-copy { max-width: 680px; }
body[data-page="about"] .nx-about-studio .nx-about-hero p { max-width: none; text-align: justify; text-justify: inter-word; }
body[data-page="about"] .nx-about-studio .nx-about-kicker { display: flex; align-items: center; gap: 9px; color: #80dce8; }
body[data-page="about"] .nx-about-studio .nx-about-kicker > i { width: 6px; height: 6px; border-radius: 50%; background: #8adfe9; box-shadow: 0 0 14px rgba(138, 223, 233, .35); }
body[data-page="about"] .nx-about-studio .nx-about-principles { display: flex; flex-wrap: wrap; gap: 0; margin-top: 22px; color: #b2c6d6; }
body[data-page="about"] .nx-about-studio .nx-about-principles > span { display: inline-flex; align-items: center; min-height: 28px; padding-inline: 14px; border-inline-start: 1px solid rgba(122, 183, 205, .2); }
body[data-page="about"] .nx-about-studio .nx-about-principles > span:first-child { padding-inline-start: 0; border: 0; }
body[data-page="about"] .nx-about-studio .nx-about-visual { position: relative; width: 100%; aspect-ratio: 4 / 3; max-height: 360px; min-width: 0; direction: ltr; isolation: isolate; }
body[data-page="about"] .nx-about-studio .nx-about-visual::before { content: ""; position: absolute; inset: 9% 3%; border-radius: 50%; background: radial-gradient(ellipse, rgba(73, 174, 194, .13), transparent 68%); filter: blur(12px); }
body[data-page="about"] .nx-about-studio .nx-about-visual-grid { position: absolute; inset: 15% 3% 8%; background-image: linear-gradient(rgba(124, 191, 209, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(124, 191, 209, .07) 1px, transparent 1px); background-size: 34px 34px; transform: perspective(500px) rotateX(57deg) rotateZ(-17deg); mask-image: radial-gradient(ellipse, #000 5%, transparent 72%); -webkit-mask-image: radial-gradient(ellipse, #000 5%, transparent 72%); }
body[data-page="about"] .nx-about-studio .nx-about-orbit { position: absolute; inset: 18% 9%; border: 1px solid rgba(133, 220, 232, .2); border-radius: 50%; transform: rotate(-24deg); box-shadow: 0 0 0 14px rgba(108, 186, 207, .025); }
body[data-page="about"] .nx-about-studio .nx-about-orbit::after { content: ""; position: absolute; inset: -3px; border: 1px solid transparent; border-top-color: rgba(156, 235, 243, .65); border-radius: 50%; animation: nx-about-orbit 32s linear infinite; }
body[data-page="about"] .nx-about-studio .nx-about-orbit-two { inset: 8% 21%; transform: rotate(32deg); border-color: rgba(129, 160, 224, .17); box-shadow: none; }
body[data-page="about"] .nx-about-studio .nx-about-orbit-two::after { animation-direction: reverse; animation-duration: 42s; border-top-color: rgba(148, 174, 227, .4); }
body[data-page="about"] .nx-about-studio .nx-about-flow { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
body[data-page="about"] .nx-about-studio .nx-about-flow path { stroke-width: 1.3; }
body[data-page="about"] .nx-about-studio .nx-about-flow-base { stroke: rgba(110, 188, 205, .2); }
body[data-page="about"] .nx-about-studio .nx-about-flow-light { stroke-dasharray: 60 540; animation: nx-about-flow 12s linear infinite; }
body[data-page="about"] .nx-about-studio .nx-about-flow-secondary { stroke: rgba(108, 151, 199, .13); }
body[data-page="about"] .nx-about-studio .nx-about-flow circle { fill: #91dbe6; stroke: #0c1b2b; stroke-width: 4; }
body[data-page="about"] .nx-about-studio .nx-about-emblem { position: absolute; inset: 20% 22%; display: grid; place-items: center; animation: nx-about-float 7s ease-in-out infinite; }
body[data-page="about"] .nx-about-studio .nx-about-emblem-halo { position: absolute; width: 72%; aspect-ratio: 1; border: 1px solid rgba(142, 215, 230, .12); border-radius: 50%; background: radial-gradient(circle at 30% 20%, rgba(181, 239, 248, .06), rgba(16, 44, 62, .22)); box-shadow: 0 20px 50px rgba(0, 3, 9, .18), inset 0 1px 0 rgba(218, 250, 255, .07); }
body[data-page="about"] .nx-about-studio .nx-about-emblem img { position: relative; width: min(180px, 94%); height: auto; object-fit: contain; filter: drop-shadow(0 18px 20px rgba(74, 172, 197, .14)); }
body[data-page="about"] .nx-about-studio .nx-about-node { position: absolute; z-index: 1; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; border: 1px solid rgba(130, 190, 213, .22); color: #c9e1e9; background: linear-gradient(140deg, rgba(23, 49, 65, .95), rgba(11, 27, 43, .95)); box-shadow: 0 8px 25px rgba(0, 5, 13, .2); }
body[data-page="about"] .nx-about-studio .nx-about-node i { width: 5px; height: 5px; border-radius: 50%; background: #83d6e2; box-shadow: 0 0 10px rgba(131, 214, 226, .25); }
body[data-page="about"] .nx-about-studio .nx-about-node-data { left: 3%; top: 27%; }
body[data-page="about"] .nx-about-studio .nx-about-node-structure { right: 0; top: 13%; }
body[data-page="about"] .nx-about-studio .nx-about-node-risk { right: 10%; bottom: 9%; }
body[data-page="about"] .nx-about-studio .nx-about-section-label { display: flex; align-items: center; gap: 15px; padding: 2px 2px 0; color: #7aafc1; }
body[data-page="about"] .nx-about-studio .nx-about-section-label > i { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(125, 176, 193, .22), transparent); }
body[data-page="about"] .nx-about-studio .nx-about-section-label > b { font-weight: 500; color: #a3b8c9; }
body[data-page="about"] .nx-about-studio .nx-about-grid { gap: 18px; }
body[data-page="about"] .nx-about-studio .nx-about-card { padding: clamp(22px, 2.7vw, 32px); border-color: rgba(112, 170, 191, .2); border-radius: 22px; background: radial-gradient(ellipse at 0 0, rgba(79, 153, 177, .06), transparent 65%), linear-gradient(145deg, #0d1b2a, #0a1523); box-shadow: inset 0 1px rgba(220, 244, 255, .025); transition: border-color .25s ease, box-shadow .25s ease; }
body[data-page="about"] .nx-about-studio .nx-about-card::before { inset-block: 30px; width: 2px; opacity: .55; background: linear-gradient(180deg, transparent, var(--nx-about-accent), transparent); }
body[data-page="about"] .nx-about-studio .nx-about-card::after { content: ""; position: absolute; inset-inline: 26px; top: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--nx-about-accent), transparent); opacity: .3; }
body[data-page="about"] .nx-about-studio .nx-about-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
body[data-page="about"] .nx-about-studio .nx-about-index { margin: 0; color: #607f96; font-variant-numeric: tabular-nums; }
body[data-page="about"] .nx-about-studio .nx-about-card-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: var(--nx-about-accent); background: rgba(98, 177, 199, .06); border: 1px solid rgba(134, 202, 220, .13); }
body[data-page="about"] .nx-about-studio .nx-about-card-icon svg { width: 21px; height: 21px; }
body[data-page="about"] .nx-about-studio .nx-about-founder-label { display: block; margin: -2px 0 13px; color: #79aabd; }
body[data-page="about"] .nx-about-studio .nx-about-card p { text-align: justify; text-justify: inter-word; }
body[data-page="about"] .nx-about-studio .nx-about-card a:focus-visible { outline: 2px solid #8de3ef; outline-offset: 4px; border-radius: 2px; }
body[data-page="about"] .nx-about-studio .nx-about-next { display: flex; justify-content: space-between; align-items: center; gap: 22px; padding: 26px 30px; border: 1px solid rgba(111, 173, 198, .2); border-radius: 22px; background: linear-gradient(120deg, rgba(19, 48, 64, .65), rgba(12, 24, 42, .8)); }
body[data-page="about"] .nx-about-studio .nx-about-next .nx-about-kicker { margin-bottom: 5px; }
body[data-page="about"] .nx-about-studio .nx-about-next h2 { margin: 0; }
body[data-page="about"] .nx-about-studio .nx-about-next-links { display: flex; flex-wrap: wrap; gap: 10px; flex: 0 0 auto; }
body[data-page="about"] .nx-about-studio .nx-about-next-links .nx-btn { display: inline-flex; gap: 12px; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; border: 1px solid rgba(132, 195, 214, .2); border-radius: 12px; background: rgba(26, 53, 72, .4); color: #d8eaf2; text-decoration: none; font-weight: 700; }
body[data-page="about"] .nx-about-studio .nx-about-next-links .nx-btn.primary { border-color: transparent; background: linear-gradient(120deg, #2b8cfe, #7054ff); color: #fff; }
body[data-page="about"] .nx-about-studio .nx-about-next-links .nx-btn:focus-visible { outline: 2px solid #8de3ef; outline-offset: 4px; }
body[data-page="about"] .nx-about-studio[data-about-motion="active"] [data-about-reveal="pending"] { opacity: 0; transform: translateY(12px); }
body[data-page="about"] .nx-about-studio [data-about-reveal] { transition: opacity .75s cubic-bezier(.2,.65,.3,1), transform .75s cubic-bezier(.2,.65,.3,1); }
body[data-page="about"] .nx-about-studio [data-about-reveal="seen"] { opacity: 1; transform: none; }
body[data-page="about"] .nx-about-studio[data-about-visual="paused"] .nx-about-orbit::after,
body[data-page="about"] .nx-about-studio[data-about-visual="paused"] :is(.nx-about-flow-light,.nx-about-emblem) { animation-play-state: paused; }
@keyframes nx-about-float { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-9px) rotate(1deg); } }
@keyframes nx-about-orbit { to { transform: rotate(360deg); } }
@keyframes nx-about-flow { to { stroke-dashoffset: -600; } }
@media (hover:hover) and (pointer:fine) {
  body[data-page="about"] .nx-about-studio .nx-about-card:hover { border-color: rgba(123, 207, 224, .4); box-shadow: inset 0 1px rgba(220, 244, 255, .04), 0 14px 34px rgba(0, 3, 12, .2); }
}
@media (max-width:1000px) {
  body[data-page="about"] .nx-about-studio .nx-about-hero { grid-template-columns: minmax(0,1.25fr) minmax(220px,.75fr); gap: 18px; }
  body[data-page="about"] .nx-about-studio .nx-about-node { padding: 7px 9px; }
  body[data-page="about"] .nx-about-studio .nx-about-next { flex-direction: column; align-items: flex-start; }
}
@media (max-width:760px) {
  body[data-page="about"] .nx-about-studio .nx-about-hero { grid-template-columns: 1fr; gap: 10px; padding: 26px 22px 12px; }
  body[data-page="about"] .nx-about-studio .nx-about-visual { max-width: 390px; justify-self: center; max-height: 250px; }
  body[data-page="about"] .nx-about-studio .nx-about-principles { margin-top: 17px; }
  body[data-page="about"] .nx-about-studio .nx-about-grid { grid-template-columns: 1fr; }
  body[data-page="about"] .nx-about-studio .nx-about-card { grid-column: auto; }
  body[data-page="about"] .nx-about-studio .nx-about-section-label { gap: 10px; flex-wrap: wrap; }
  body[data-page="about"] .nx-about-studio .nx-about-section-label > b { flex-basis: 100%; }
  body[data-page="about"] .nx-about-studio .nx-about-next { padding: 23px 22px; }
  body[data-page="about"] .nx-about-studio .nx-about-next-links { width: 100%; }
  body[data-page="about"] .nx-about-studio .nx-about-next-links a { flex: 1 1 180px; }
  body.is-en[data-page="about"] .nx-about-studio :is(.nx-about-hero p,.nx-about-card p) { text-align: start; }
}
@media (prefers-reduced-motion:reduce), print {
  body[data-page="about"] .nx-about-studio [data-about-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
  body[data-page="about"] .nx-about-studio .nx-about-orbit::after,
  body[data-page="about"] .nx-about-studio :is(.nx-about-flow-light,.nx-about-emblem) { animation: none !important; }
}
@media print {
  body[data-page="about"] .nx-about-studio .nx-about-visual { display: none; }
  body[data-page="about"] .nx-about-studio .nx-about-hero { display: block; }
  body[data-page="about"] .nx-about-studio .nx-about-card { break-inside: avoid; }
}
