@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  --ink: #08101e;
  --navy: #0b1220;
  --navy-2: #101b2e;
  --panel: #121f34;
  --panel-2: #17263c;
  --line: rgba(179, 214, 227, .16);
  --line-bright: rgba(179, 214, 227, .3);
  --paper: #eaf0ef;
  --muted: #95a9b5;
  --soft: #c4d1d4;
  --cyan: #53e0d0;
  --cyan-2: #9cf6e9;
  --amber: #f3b85b;
  --blue: #7ea7ff;
  --danger: #ff8f86;
  --max: 1240px;
  --ease: cubic-bezier(.22, .72, .18, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--navy); color: var(--paper); font-family: Inter, Arial, sans-serif; font-size: 15px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
body:has(.mobile-menu[aria-expanded="true"]) { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: var(--cyan); color: var(--navy); }

.grain { position: fixed; inset: 0; pointer-events: none; z-index: 20; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); }
.site-header { height: 76px; padding: 0 4.6vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10; background: rgba(11, 18, 32, .9); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: 210px; }
.brand-mark { width: 31px; height: 25px; position: relative; display: inline-block; }
.brand-mark span { display: block; height: 3px; background: var(--cyan); border-radius: 2px; position: absolute; left: 0; transform: skewY(-30deg); }
.brand-mark span:first-child { width: 25px; top: 5px; }
.brand-mark span:nth-child(2) { width: 18px; top: 15px; left: 8px; background: var(--blue); }
.brand-mark i { position: absolute; width: 3px; height: 25px; top: 0; left: 13px; border-radius: 3px; background: var(--paper); transform: rotate(33deg); opacity: .9; }
.brand-mark.small { transform: scale(.75); transform-origin: left center; margin-right: -3px; }
.brand-copy { font-family: 'Space Grotesk', Inter, sans-serif; letter-spacing: .12em; font-size: 11px; color: var(--soft); }
.brand-copy strong { color: var(--paper); font-weight: 700; }
.brand-copy em { color: var(--cyan); font-style: normal; margin-left: 3px; }
.main-nav { display: flex; align-items: center; gap: 28px; }
.main-nav a { color: var(--muted); font-size: 12px; letter-spacing: .045em; transition: color .2s ease; }
.main-nav a:hover, .main-nav a.active { color: var(--cyan); }
.header-action, .mobile-menu { color: var(--soft); background: none; border: 0; font-size: 11px; letter-spacing: .04em; cursor: pointer; }
.header-action span { display: inline-block; margin-left: 7px; color: var(--cyan); transform: translateY(1px); }
.mobile-menu { display: none; }

.page-section { max-width: var(--max); margin: 0 auto; padding: 112px 32px; }
.hero { max-width: none; min-height: 650px; padding: 120px max(32px, calc((100vw - var(--max)) / 2 + 32px)) 0; position: relative; overflow: hidden; }
.hero::before { content: ''; position: absolute; width: 800px; height: 800px; right: -220px; top: -260px; background: radial-gradient(circle, rgba(83,224,208,.13), rgba(83,224,208,0) 66%); pointer-events: none; }
.hero-grid { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: 1.05fr .95fr; gap: 7vw; align-items: center; }
.eyebrow, .section-kicker, .index-overline { text-transform: uppercase; letter-spacing: .17em; color: var(--cyan); font-family: 'Space Grotesk', Inter, sans-serif; font-size: 10px; font-weight: 600; margin: 0; }
.eyebrow { display: flex; align-items: center; gap: 9px; }
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 5px rgba(83,224,208,.11); }
h1, h2, h3, h4 { font-family: 'Space Grotesk', Inter, sans-serif; margin: 0; font-weight: 500; letter-spacing: -.045em; }
h1 { max-width: 690px; font-size: clamp(52px, 7.3vw, 106px); line-height: .95; margin: 27px 0 29px; }
h1 span { color: var(--cyan); }
.hero-lede { max-width: 570px; color: var(--soft); font-size: 17px; line-height: 1.75; margin: 0; }
.hero-actions { display: flex; gap: 22px; align-items: center; margin-top: 35px; }
.button { display: inline-flex; align-items: center; gap: 22px; padding: 12px 16px; border: 1px solid transparent; text-transform: uppercase; letter-spacing: .12em; font-size: 10px; font-weight: 700; transition: transform .2s var(--ease), background .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-3px); }
.button-primary { background: var(--cyan); color: var(--navy); }
.button-primary:hover { background: var(--cyan-2); }
.button-quiet { padding-left: 0; color: var(--soft); }
.button-quiet span, .button-outline span { color: var(--cyan); }
.button-outline { border-color: var(--line-bright); color: var(--paper); margin-top: 22px; }
.button-outline:hover { border-color: var(--cyan); }
.hero-note { margin-top: 56px; max-width: 420px; display: flex; gap: 12px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.note-line { display: block; width: 28px; height: 1px; background: var(--amber); margin-top: 9px; flex: 0 0 auto; }
.hero-visual { min-height: 380px; position: relative; display: grid; place-items: center; }
.orbit { position: absolute; border: 1px solid var(--line-bright); border-radius: 50%; transform: rotate(-16deg); }
.orbit-one { width: 330px; height: 330px; }
.orbit-two { width: 260px; height: 390px; border-color: rgba(83,224,208,.26); }
.core-badge { width: 147px; height: 147px; border: 1px solid var(--cyan); border-radius: 50%; display: grid; place-items: center; align-content: center; gap: 2px; background: rgba(11,18,32,.8); box-shadow: 0 0 60px rgba(83,224,208,.13); z-index: 1; }
.core-symbol { font-family: 'Space Grotesk'; color: var(--cyan); font-size: 37px; font-weight: 600; letter-spacing: -.1em; margin-right: 7px; }
.core-badge small { color: var(--muted); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.orbit-label { position: absolute; z-index: 2; display: flex; flex-direction: column; text-transform: uppercase; font-size: 9px; letter-spacing: .12em; line-height: 1.4; }
.orbit-label b { color: var(--cyan); font-family: 'Space Grotesk'; font-size: 11px; }
.orbit-label span { color: var(--muted); }
.label-top { top: 5px; left: 47%; } .label-right { right: 0; top: 48%; text-align: left; } .label-bottom { bottom: 4px; left: 35%; }
.pulse { width: 5px; height: 5px; position: absolute; background: var(--cyan); border-radius: 50%; box-shadow: 0 0 0 8px rgba(83,224,208,.1); }
.pulse-a { top: 73px; left: 20%; } .pulse-b { right: 16%; top: 28%; background: var(--amber); box-shadow: 0 0 0 8px rgba(243,184,91,.08); } .pulse-c { bottom: 42px; right: 29%; background: var(--blue); }
.hero-index { max-width: var(--max); margin: 84px auto 0; min-height: 99px; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1.4fr repeat(4, 1fr) 1.2fr; align-items: center; gap: 15px; }
.index-label, .index-tail { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
.hero-index a { border-left: 1px solid var(--line); padding-left: 20px; display: flex; flex-direction: column; }
.hero-index strong { font-family: 'Space Grotesk'; font-size: 27px; color: var(--paper); line-height: 1; font-weight: 500; }
.hero-index small { color: var(--muted); font-size: 10px; margin-top: 5px; }
.hero-index a:hover strong { color: var(--cyan); }
.index-tail { text-align: right; } .index-tail i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); margin: 0 6px 1px; }
.section-rule { border-top: 1px solid var(--line); }
.section-heading { margin-bottom: 62px; }
.section-heading h2 { max-width: 760px; font-size: clamp(37px, 5vw, 65px); line-height: 1.02; margin-top: 17px; }
.section-heading h2 em { color: var(--cyan); font-style: normal; }
.split-heading { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(270px, .62fr); gap: 80px; align-items: end; }
.heading-aside { color: var(--muted); max-width: 380px; font-size: 13px; line-height: 1.7; margin: 0 0 4px; }
.overview-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 14vw; }
.overview-intro { max-width: 580px; color: var(--soft); font-size: 17px; line-height: 1.78; }
.overview-intro p { margin: 0 0 18px; } .overview-intro .muted { color: var(--muted); font-size: 13px; line-height: 1.7; }
.overview-intro strong { color: var(--amber); font-weight: 500; }
.text-link { display: inline-flex; color: var(--cyan); gap: 14px; font-size: 12px; margin-top: 14px; border-bottom: 1px solid rgba(83,224,208,.3); padding-bottom: 5px; }
.text-link span { transition: transform .2s ease; } .text-link:hover span { transform: translateX(4px); }
.overview-callout { min-height: 230px; padding: 42px 42px 32px; position: relative; border-left: 1px solid var(--cyan); background: linear-gradient(115deg, rgba(23,38,60,.8), rgba(16,27,46,.25)); }
.quote-mark { color: var(--cyan); font-family: Georgia, serif; font-size: 54px; line-height: .5; }
.overview-callout p { font-family: 'Space Grotesk'; font-size: 28px; line-height: 1.1; letter-spacing: -.04em; margin: 19px 0 33px; max-width: 410px; }
.callout-caption { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .14em; }
.discipline-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-top: 85px; display: flex; align-items: center; gap: 24px; min-height: 65px; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; flex-wrap: wrap; padding: 12px 0; }
.discipline-strip > span { color: var(--soft); margin-right: 14px; }
.discipline-strip div { display: inline-flex; align-items: center; gap: 7px; }
.discipline-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; } .civil { background: #d891ff; } .eletrica { background: var(--cyan); } .eletro { background: var(--amber); } .auto { background: var(--blue); } .safety { background: #ff8f86; } .comm { background: #9cd5a4; }

.macro-toolbar { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); min-height: 69px; display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 36px; }
.search-field { position: relative; width: min(620px, 100%); display: flex; align-items: center; }
.search-field input, .mini-search input { border: 0; outline: 0; background: transparent; color: var(--paper); width: 100%; padding: 14px 46px 14px 33px; font-size: 13px; }
.search-field input::placeholder, .mini-search input::placeholder { color: #718792; }
.search-icon, .mini-search span { color: var(--cyan); font-size: 23px; position: absolute; left: 1px; top: 7px; }
kbd { color: var(--muted); border: 1px solid var(--line); border-radius: 3px; font-size: 9px; padding: 3px 5px; letter-spacing: .08em; }
.toolbar-meta { display: flex; align-items: center; gap: 18px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.clear-button { color: var(--soft); background: transparent; border: 0; cursor: pointer; font-size: 11px; padding: 6px 0; } .clear-button span { color: var(--cyan); font-size: 16px; margin-left: 4px; }
.macro-layout { display: grid; grid-template-columns: 175px minmax(0, 1fr); gap: 48px; }
.step-index { position: relative; }
.index-sticky { position: sticky; top: 106px; }
.index-overline { color: var(--muted); display: block; margin-bottom: 22px; font-size: 9px; }
#step-nav { display: flex; flex-direction: column; border-left: 1px solid var(--line); }
.step-link { position: relative; display: grid; grid-template-columns: 33px 1fr; gap: 6px; border: 0; border-left: 1px solid transparent; margin-left: -1px; padding: 9px 0 9px 14px; background: none; color: var(--muted); text-align: left; font-family: 'Space Grotesk'; font-size: 11px; cursor: pointer; line-height: 1.2; }
.step-link .step-no { color: #577080; } .step-link.active { border-left-color: var(--cyan); color: var(--paper); background: linear-gradient(90deg, rgba(83,224,208,.09), transparent); } .step-link.active .step-no { color: var(--cyan); }
.index-progress { width: 1px; height: 86px; background: var(--line); margin: 20px 0 11px 0; position: relative; } .index-progress span { background: var(--cyan); width: 1px; display: block; height: 8%; transition: height .4s var(--ease); }
.index-sticky > small { color: var(--muted); font-size: 10px; letter-spacing: .08em; } .index-sticky > small span { color: var(--cyan); }
.macro-list { display: flex; flex-direction: column; gap: 14px; }
.macro-card { border: 1px solid var(--line); background: rgba(18,31,52,.62); transition: border-color .25s ease, background .25s ease; scroll-margin-top: 105px; }
.macro-card:hover, .macro-card.open { border-color: var(--line-bright); background: rgba(23,38,60,.8); }
.macro-card.open { border-left: 2px solid var(--cyan); }
.macro-summary { display: grid; grid-template-columns: 73px minmax(0, 1fr) 34px; gap: 20px; align-items: center; width: 100%; padding: 27px 27px; border: 0; background: none; color: var(--paper); text-align: left; cursor: pointer; }
.macro-number { align-self: start; color: var(--cyan); font-family: 'Space Grotesk'; font-size: 24px; font-weight: 500; letter-spacing: -.05em; }
.macro-summary-copy { display: block; }
.macro-title { display: block; font-family: 'Space Grotesk', Inter, sans-serif; font-size: 24px; line-height: 1.08; letter-spacing: -.045em; margin-bottom: 9px; }
.macro-excerpt { display: block; color: var(--muted); margin: 0; font-size: 12px; max-width: 660px; line-height: 1.5; }
.macro-arrow { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid var(--line-bright); border-radius: 50%; color: var(--cyan); font-size: 17px; transition: transform .25s var(--ease), background .25s ease; }
.macro-card.open .macro-arrow { transform: rotate(45deg); background: var(--cyan); color: var(--navy); }
.macro-detail { display: none; padding: 0 27px 30px 120px; border-top: 1px solid var(--line); }
.macro-card.open .macro-detail { display: block; }
.detail-lede { color: var(--soft); max-width: 760px; font-size: 14px; line-height: 1.7; margin: 26px 0; }
.detail-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.detail-block { background: rgba(11,18,32,.62); border: 1px solid rgba(179,214,227,.1); padding: 18px 18px 16px; }
.detail-block h4 { color: var(--cyan); font-size: 10px; text-transform: uppercase; letter-spacing: .13em; margin-bottom: 10px; }
.detail-block p, .detail-block ul { color: var(--muted); font-size: 12px; line-height: 1.65; margin: 0; }
.detail-block ul { list-style: none; padding: 0; } .detail-block li { position: relative; padding-left: 13px; margin: 4px 0; } .detail-block li::before { content: '—'; color: var(--amber); position: absolute; left: 0; }
.detail-block.full { grid-column: 1 / -1; }
.pill-list { display: flex; gap: 6px; flex-wrap: wrap; } .pill { display: inline-flex; padding: 4px 8px; border: 1px solid var(--line); color: var(--soft); font-size: 10px; }
.when { color: var(--amber); }
.empty-state { color: var(--muted); border: 1px dashed var(--line-bright); padding: 30px; }

.eap-tree-panel, .table-panel { background: rgba(18,31,52,.55); border: 1px solid var(--line); }
.eap-tree-panel { margin-bottom: 18px; }
.panel-topline { min-height: 61px; padding: 0 21px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; color: var(--soft); font-family: 'Space Grotesk'; font-size: 12px; }
.panel-topline small { display: inline-block; color: var(--muted); font-family: Inter; font-size: 10px; margin-left: 12px; }
.small-button { border: 1px solid var(--line-bright); background: transparent; color: var(--soft); font-size: 10px; padding: 7px 10px; cursor: pointer; } .small-button:hover { border-color: var(--cyan); color: var(--cyan); }
.eap-tree { padding: 24px 27px 29px; }
.tree-row { display: flex; align-items: baseline; gap: 13px; padding: 5px 0; color: var(--soft); font-size: 12px; }
.tree-row.level-0 { color: var(--cyan); font-family: 'Space Grotesk'; font-size: 15px; padding-bottom: 12px; }
.tree-row.level-1 { padding-left: 18px; border-left: 1px solid var(--line); margin-left: 10px; } .tree-row.level-2 { padding-left: 42px; color: var(--muted); font-size: 11px; }
.tree-code { min-width: 53px; color: var(--amber); font-family: 'Space Grotesk'; font-size: 10px; } .tree-row.level-0 .tree-code { color: var(--cyan); }
.tree-toggle { color: var(--cyan); cursor: pointer; margin-right: 2px; font-size: 13px; } .tree-row.collapsed-child { display: none; }
.table-panel { overflow: hidden; }
.table-tools { display: flex; align-items: center; gap: 12px; }
.mini-search { position: relative; width: 190px; } .mini-search input { border-bottom: 1px solid var(--line); padding: 8px 5px 8px 23px; font-size: 11px; } .mini-search span { left: 0; top: 0; font-size: 17px; }
select { background: var(--navy-2); color: var(--soft); border: 1px solid var(--line); padding: 8px 9px; font-size: 10px; outline: 0; }
.table-scroll { overflow-x: auto; max-height: 640px; }
table { border-collapse: collapse; min-width: 900px; width: 100%; font-size: 11px; } th, td { padding: 14px 18px; text-align: left; border-bottom: 1px solid rgba(179,214,227,.09); vertical-align: top; } th { color: var(--cyan); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; font-weight: 600; position: sticky; top: 0; background: var(--panel); z-index: 1; } td { color: var(--muted); } td:first-child { color: var(--amber); font-family: 'Space Grotesk'; white-space: nowrap; } td:nth-child(2) { color: var(--soft); } tr:hover td { background: rgba(83,224,208,.035); }

.sequence-track { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; border-top: 1px solid var(--line-bright); position: relative; margin-top: 18px; }
.sequence-track::before { content: ''; position: absolute; top: -2px; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--cyan), var(--blue), var(--amber)); transform: scaleX(.82); transform-origin: left; }
.sequence-item { min-height: 207px; padding: 30px 20px 18px 0; margin-right: 22px; position: relative; border-right: 1px solid var(--line); }
.sequence-item:last-child { border: 0; margin-right: 0; } .sequence-no { color: var(--cyan); font-family: 'Space Grotesk'; font-size: 11px; } .sequence-item h3 { color: var(--paper); font-size: 18px; line-height: 1.1; margin: 17px 0 10px; } .sequence-item p { color: var(--muted); font-size: 11px; line-height: 1.6; margin: 0; } .sequence-dep { display: block; color: var(--amber); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; margin-top: 19px; }
.parallel-box { margin-top: 37px; display: grid; grid-template-columns: 55px 1fr; gap: 20px; align-items: center; padding: 20px 23px; background: rgba(83,224,208,.06); border-left: 2px solid var(--cyan); } .parallel-symbol { font-family: 'Space Grotesk'; color: var(--cyan); font-size: 29px; } .parallel-box strong { font-family: 'Space Grotesk'; font-size: 15px; font-weight: 500; } .parallel-box p { color: var(--muted); font-size: 12px; margin: 5px 0 0; }

.interface-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.interface-card { min-height: 220px; padding: 24px 22px; border: 1px solid var(--line); background: rgba(18,31,52,.54); transition: transform .25s var(--ease), border-color .25s ease; } .interface-card:hover { transform: translateY(-4px); border-color: var(--line-bright); }
.interface-card h3 { font-size: 18px; line-height: 1.1; max-width: 200px; } .interface-card h3 span { color: var(--cyan); } .interface-card p { color: var(--muted); font-size: 11px; line-height: 1.65; margin: 22px 0 0; } .interface-index { color: var(--amber); font-size: 10px; letter-spacing: .13em; font-family: 'Space Grotesk'; display: block; margin-bottom: 22px; }

.confirm-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; align-items: start; }
.confirm-list { display: flex; flex-direction: column; gap: 7px; counter-reset: confirm; }
.confirm-item { display: grid; grid-template-columns: 42px 1fr; gap: 18px; align-items: start; padding: 19px 20px; border: 1px solid var(--line); background: rgba(18,31,52,.54); } .confirm-item::before { counter-increment: confirm; content: counter(confirm, decimal-leading-zero); color: var(--amber); font-family: 'Space Grotesk'; font-size: 12px; } .confirm-item strong { display: block; font-family: 'Space Grotesk'; font-weight: 500; font-size: 14px; margin-bottom: 5px; } .confirm-item p { color: var(--muted); font-size: 11px; line-height: 1.55; margin: 0; }
.forgotten-panel { padding: 29px; background: linear-gradient(145deg, var(--panel-2), rgba(18,31,52,.55)); border: 1px solid var(--line-bright); } .forgotten-panel h3 { font-size: 30px; line-height: 1; margin: 19px 0; } .forgotten-panel > p { color: var(--muted); font-size: 12px; line-height: 1.65; } .forgotten-panel ul { list-style: none; margin: 23px 0 0; padding: 0; border-top: 1px solid var(--line); } .forgotten-panel li { padding: 12px 0 12px 17px; border-bottom: 1px solid var(--line); color: var(--soft); font-size: 11px; position: relative; } .forgotten-panel li::before { content: '↗'; color: var(--cyan); position: absolute; left: 0; }
.site-footer { max-width: var(--max); margin: 0 auto; border-top: 1px solid var(--line); padding: 30px 32px 45px; display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: center; gap: 20px; color: var(--muted); font-size: 10px; } .footer-brand { display: flex; align-items: center; gap: 0; color: var(--paper); font-family: 'Space Grotesk'; letter-spacing: .13em; font-size: 11px; } .site-footer p { margin: 0; } .footer-meta { text-align: right; display: flex; flex-direction: column; gap: 6px; } .footer-meta button { color: var(--cyan); background: none; border: 0; cursor: pointer; font-size: 10px; text-align: right; padding: 0; }
.back-top { position: fixed; bottom: 23px; right: 23px; z-index: 9; width: 38px; height: 38px; border: 1px solid var(--line-bright); border-radius: 50%; color: var(--cyan); background: rgba(11,18,32,.8); cursor: pointer; opacity: 0; transform: translateY(10px); transition: opacity .2s ease, transform .2s ease; } .back-top.visible { opacity: 1; transform: none; }
.reveal { animation: rise .7s var(--ease) both; } .reveal-delay { animation-delay: .12s; } @keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }
@media (max-width: 900px) { .main-nav { gap: 14px; } .header-action { display: none; } .hero-grid { gap: 25px; } .hero-index { grid-template-columns: 1.2fr repeat(4, 1fr); } .index-tail { display: none; } .macro-layout { grid-template-columns: 1fr; } .step-index { display: none; } .macro-detail { padding-left: 27px; } .sequence-track { grid-template-columns: repeat(3, 1fr); row-gap: 20px; } .sequence-item:nth-child(3) { border-right: 0; } .sequence-item:nth-child(n+4) { border-top: 1px solid var(--line); padding-top: 25px; } }
@media (max-width: 680px) { .site-header { height: 65px; padding: 0 20px; } .brand { min-width: 0; } .mobile-menu { display: block; } .mobile-menu span { color: var(--cyan); font-size: 16px; margin-left: 5px; } .main-nav { display: none; position: absolute; top: 65px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 15px 20px 22px; background: var(--navy); border-bottom: 1px solid var(--line); } .main-nav.open { display: flex; } .main-nav a { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 12px; } .page-section { padding: 76px 20px; } .hero { padding: 76px 20px 0; min-height: 0; } h1 { font-size: clamp(50px, 16vw, 76px); } .hero-lede { font-size: 15px; } .hero-visual { min-height: 315px; margin-top: 30px; } .orbit-one { width: 280px; height: 280px; } .orbit-two { width: 220px; height: 330px; } .hero-index { margin-top: 43px; grid-template-columns: repeat(2, 1fr); padding: 22px 0; gap: 20px 0; } .index-label { grid-column: 1 / -1; } .hero-index a { border-left: 0; padding-left: 0; } .hero-index a:nth-of-type(odd) { border-right: 1px solid var(--line); } .section-heading { margin-bottom: 39px; } .section-heading h2 { font-size: 39px; } .split-heading, .overview-layout, .confirm-layout { display: block; } .heading-aside { margin-top: 25px; } .overview-callout { margin-top: 32px; padding: 28px; } .overview-callout p { font-size: 24px; } .discipline-strip { gap: 12px 17px; margin-top: 54px; } .discipline-strip > span { width: 100%; } .macro-toolbar { align-items: flex-start; flex-direction: column; padding: 12px 0; gap: 7px; } .toolbar-meta { width: 100%; justify-content: space-between; } .macro-summary { grid-template-columns: 40px minmax(0, 1fr) 27px; gap: 10px; padding: 20px 16px; } .macro-summary h3 { font-size: 18px; } .macro-summary p { font-size: 11px; } .macro-number { font-size: 18px; } .macro-detail { padding: 0 16px 20px; } .detail-grid { grid-template-columns: 1fr; } .detail-block.full { grid-column: auto; } .panel-topline { min-height: auto; padding: 15px; gap: 12px; align-items: flex-start; } .table-tools { flex-direction: column; align-items: stretch; width: 53%; } .mini-search { width: 100%; } select { width: 100%; } .eap-tree { padding: 18px 13px; } .tree-row.level-2 { padding-left: 18px; } .sequence-track { display: block; } .sequence-item, .sequence-item:nth-child(3) { border-right: 0; border-bottom: 1px solid var(--line); margin: 0; min-height: 0; padding: 22px 0; } .sequence-item:nth-child(n+4) { border-top: 0; padding-top: 22px; } .parallel-box { grid-template-columns: 35px 1fr; padding: 17px; gap: 11px; } .interface-grid { grid-template-columns: 1fr; } .interface-card { min-height: 0; } .forgotten-panel { margin-top: 25px; padding: 22px; } .site-footer { padding: 28px 20px 38px; display: block; } .site-footer p { margin: 17px 0; } .footer-meta { text-align: left; } .footer-meta button { text-align: left; } .back-top { bottom: 16px; right: 16px; } }
@media print { .site-header, .hero-visual, .hero-actions, .hero-note, .step-index, .macro-toolbar, .back-top, .button, .footer-meta button { display: none !important; } body, .site-footer { color: #101820; background: #fff; } .page-section { padding: 36px 0; max-width: none; } .hero { min-height: 0; padding-top: 30px; } .hero-index { margin-top: 25px; } .macro-card, .eap-tree-panel, .table-panel, .interface-card, .confirm-item, .forgotten-panel { border-color: #ccd5d8; background: #fff; break-inside: avoid; } .macro-detail { display: block !important; } .overview-callout { background: #f2f6f5; } .muted, .heading-aside, td, .detail-block p, .detail-block ul, .forgotten-panel p, .site-footer, .sequence-item p, .interface-card p { color: #40505a; } .section-rule { border-color: #ccd5d8; } }

@media (max-width: 680px) { .macro-title { font-size: 18px; } .macro-excerpt { font-size: 11px; } }

/* RMT AÉREA — cinematic linear infrastructure */
.rmt-cinematic { min-height: 820px; position:relative; overflow:hidden; background:linear-gradient(180deg,#07101c 0%,#101a29 58%,#172435 100%); isolation:isolate; }
.rmt-sky { position:absolute; inset:0; background:radial-gradient(ellipse at 72% 28%,rgba(119,183,255,.12),transparent 26%),linear-gradient(180deg,transparent 55%,rgba(4,8,13,.72) 100%); z-index:-2; }
.rmt-horizon { position:absolute; left:-5%; right:-5%; bottom:31%; height:34%; background:linear-gradient(180deg,transparent,#0c1825 48%,#0b121c); clip-path:polygon(0 48%,12% 34%,24% 51%,37% 28%,49% 45%,63% 26%,76% 44%,90% 29%,100% 43%,100% 100%,0 100%); z-index:-1; }
.rmt-horizon span { position:absolute; top:48%; left:0; right:0; border-top:1px solid rgba(119,183,255,.2); box-shadow:0 0 20px rgba(119,183,255,.3); }
.rmt-line { position:absolute; left:4%; width:92%; height:2px; bottom:34%; background:#77b7ff; box-shadow:0 0 16px #77b7ff; transform-origin:left; animation:rmt-line-in 1.8s ease both; }
.rmt-line-a { transform:rotate(-2deg); }.rmt-line-b { bottom:33.2%; opacity:.42; transform:rotate(-1.3deg); animation-delay:.3s; }
.rmt-poles { position:absolute; inset:0; bottom:30%; pointer-events:none; }
.rmt-pole { position:absolute; bottom:30%; width:2px; height:150px; background:linear-gradient(#91bade,#3b5872); opacity:0; transform:translateY(25px); animation:rmt-pole-in .8s ease forwards; }
.rmt-pole::before,.rmt-pole::after { content:''; position:absolute; width:72px; height:1px; background:#91bade; top:12px; left:-35px; box-shadow:0 0 10px rgba(119,183,255,.5); }.rmt-pole::after { top:30px; width:52px; left:-25px; opacity:.7; }
.rmt-pole i,.rmt-pole b,.rmt-pole em { position:absolute; width:5px; height:5px; border-radius:50%; background:#c5e1ff; top:10px; left:-2px; box-shadow:0 0 8px #77b7ff; }.rmt-pole b{left:65px}.rmt-pole em{left:-34px;top:28px}.p1{left:9%;animation-delay:.5s}.p2{left:24%;animation-delay:.75s}.p3{left:39%;animation-delay:1s}.p4{left:55%;animation-delay:1.25s}.p5{left:71%;animation-delay:1.5s}.p6{left:87%;animation-delay:1.75s}
.rmt-cinematic-copy { position:relative; z-index:2; max-width:var(--max); margin:0 auto; padding:145px 32px 0; }.rmt-cinematic-copy h1 { max-width:720px; font-size:clamp(48px,7vw,102px); line-height:.94; letter-spacing:-.07em; margin:20px 0 25px; }.rmt-cinematic-copy h1 span { color:#77b7ff; }.rmt-cinematic-copy .hero-lede { max-width:510px; }.rmt-dot,.rmt-note-line { background:#77b7ff!important; }.rmt-button { background:#77b7ff; color:#07101c; }.rmt-terminal { position:absolute; right:7%; bottom:21%; display:flex; align-items:center; gap:13px; color:#a9b8c9; font:10px 'Space Grotesk'; letter-spacing:.12em; }.rmt-terminal strong { color:#e7eef7; }.rmt-terminal i { width:45px; height:1px; background:#77b7ff; box-shadow:0 0 10px #77b7ff; }
.rmt-electric-svg { display:block; width:100%; min-width:900px; padding:18px; background:linear-gradient(180deg,#0b1523,#142537); }.rmt-diagram-card{overflow:auto}.rmt-ground{stroke:#536a80;stroke-width:1}.rmt-conductor{fill:none;stroke:#77b7ff;stroke-width:3;filter:drop-shadow(0 0 5px rgba(119,183,255,.7))}.rmt-conductor.low{stroke-width:1;opacity:.6}.rmt-structure path{stroke:#9db8d2;stroke-width:3}.rmt-structure circle{fill:#77b7ff}.rmt-equipment{fill:#172b43;stroke:#f2c14e;stroke-width:2}.rmt-substation{fill:#1c2c40;stroke:#77b7ff;stroke-width:2}.rmt-electric-svg text{fill:#cbd9e7;font:12px 'Space Grotesk';letter-spacing:.04em}.rmt-svg-label{fill:#91a9bf!important;font-size:11px!important}.rmt-arrow{fill:none;stroke:#f2c14e;stroke-width:2}.rmt-connection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}.rmt-connection-grid article,.rmt-interface-grid article,.rmt-test-grid article{border:1px solid var(--line);background:rgba(18,31,52,.48);padding:19px}.rmt-connection-grid span,.rmt-interface-grid span,.rmt-test-grid span{color:#77b7ff;font:10px 'Space Grotesk';letter-spacing:.1em}.rmt-connection-grid h4{margin:12px 0 8px;font-size:18px}.rmt-connection-grid p,.rmt-interface-grid p,.rmt-test-grid p{margin:0;color:var(--muted);font-size:11px;line-height:1.6}.rmt-list{border-top:1px solid var(--line-bright)}.rmt-card{border-bottom:1px solid var(--line)}.rmt-summary{display:grid;grid-template-columns:58px 1fr 28px;gap:18px;width:100%;padding:22px 0;background:none;border:0;color:inherit;text-align:left;cursor:pointer}.rmt-summary>span:first-child{color:#77b7ff;font:14px 'Space Grotesk'}.rmt-summary strong{display:block;font-size:20px}.rmt-summary small{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:7px}.rmt-summary b{color:#77b7ff;font-size:22px}.rmt-detail{display:none;padding:0 0 25px 76px}.rmt-card.open .rmt-detail{display:block}.rmt-chip{border-color:rgba(119,183,255,.45);color:#77b7ff}.rmt-interface-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.rmt-interface-grid h3,.rmt-test-grid h3{margin:10px 0 8px;font-size:17px}.rmt-test-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.rmt-test-grid article{min-height:145px}.rmt-sequence{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.rmt-sequence>div{min-height:140px;padding:18px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px}.rmt-sequence span{color:#77b7ff;font:12px 'Space Grotesk'}.rmt-sequence strong{font-size:17px}.rmt-sequence small{color:var(--muted);font-size:10px}.rmt-check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line)}.rmt-check-grid .check-item{background:rgba(18,31,52,.72);padding:15px}.rmt-rfp{margin-top:18px;border-left:2px solid #77b7ff;padding:20px;background:rgba(119,183,255,.06)}.rmt-rfp>span{color:#77b7ff;font:10px 'Space Grotesk';letter-spacing:.12em}.rmt-rfp p{color:var(--muted);font-size:12px;line-height:1.6;margin:10px 0 0}.rmt-discipline{width:8px;height:8px;border-radius:50%;display:inline-block;background:#77b7ff;margin-right:5px}.rmt-discipline.eletrica{background:#f2c14e}.rmt-discipline.faixa{background:#9b8cff}.rmt-discipline.ambiente{background:#72d6c0}.rmt-discipline.rede{background:#ff9b6b}.rmt-discipline.comm{background:#d7e4f1}.rmt-hero-spacer{display:none}
@keyframes rmt-line-in{from{transform:scaleX(0) rotate(-2deg);opacity:0}to{opacity:1}}@keyframes rmt-pole-in{to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.rmt-connection-grid,.rmt-interface-grid,.rmt-test-grid{grid-template-columns:repeat(2,1fr)}.rmt-sequence{grid-template-columns:repeat(3,1fr)}.rmt-terminal{right:4%;font-size:8px}}
@media(max-width:680px){.rmt-cinematic{min-height:720px}.rmt-cinematic-copy{padding:105px 20px 0}.rmt-cinematic-copy h1{font-size:52px}.rmt-pole{height:105px;bottom:28%}.rmt-pole::before{width:48px;left:-23px}.rmt-pole::after{width:36px;left:-17px}.rmt-pole b{left:43px}.rmt-terminal{left:20px;right:auto;bottom:15%;gap:7px;flex-wrap:wrap;max-width:300px}.rmt-connection-grid,.rmt-interface-grid,.rmt-test-grid,.rmt-check-grid{grid-template-columns:1fr}.rmt-sequence{grid-template-columns:repeat(2,1fr)}.rmt-summary{grid-template-columns:38px 1fr 25px;gap:10px;padding:19px 0}.rmt-summary strong{font-size:17px}.rmt-detail{padding-left:48px}.rmt-electric-svg{min-width:900px}}

/* Shared unifilar diagrams */
.diagram-card{border:1px solid var(--line);background:rgba(18,31,52,.58);overflow:hidden}.diagram-title{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid var(--line);background:rgba(18,31,52,.7)}.diagram-title span{color:var(--blue);font:10px 'Space Grotesk';letter-spacing:.12em}.diagram-title strong{font-size:15px}.diagram-title small{color:var(--muted);font-size:10px}.diagram-card>svg:not(.solar-flow-diagram):not(.rmt-electric-svg){display:block;width:100%;height:auto;min-height:300px;padding:18px;background:linear-gradient(135deg,#0b1220,#142438)}.diagram-card svg text{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:.025em}.svg-box rect{fill:#182b43;stroke:#6d8eae;stroke-width:2}.svg-box.lv-box rect{fill:#153043;stroke:#72d6c0}.svg-box.mv-box rect{fill:#202c48;stroke:#7ea7ff}.svg-box text{fill:#d5e2ef}.svg-wire{fill:none;stroke-width:3}.svg-wire.lv-wire{stroke:#72d6c0}.svg-wire.mv-wire{stroke:#7ea7ff}.svg-wire.ctrl-wire{stroke:#f3b85b;stroke-width:2;stroke-dasharray:7 6}.svg-note{fill:#9eb0c2!important;font-size:11px!important}.svg-ctrl-label{fill:#f3b85b!important;font-size:11px!important}.technical-columns{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:16px}.technical-columns>div{border:1px solid var(--line);padding:18px;background:rgba(18,31,52,.46)}.technical-columns h4{margin:0 0 8px;font-size:16px}.technical-columns p{margin:0;color:var(--muted);font-size:11px;line-height:1.6}.eolica-power-diagram{overflow:visible}.mt-diagram{overflow:visible}
/* EÓLICA and SOLAR diagram containment */
.eolica-power-card{margin-top:18px}.eolica-power-diagram{display:block;width:100%;height:auto;min-height:330px;padding:20px 15px 14px;background:linear-gradient(135deg,rgba(11,18,32,.92),rgba(20,33,56,.52))}.solar-hero::before{background:radial-gradient(circle,rgba(242,193,78,.16),rgba(242,193,78,0) 66%)}.solar-hero .hero-copy h1 span,.solar-hero .eyebrow,.solar-hero .core-symbol,.solar-hero .orbit-label b{color:#f2c14e}.solar-hero .eyebrow-dot{background:#f2c14e}.solar-button{background:#f2c14e;color:#101827}.solar-note-line{background:#f2c14e}.solar-orbit{border-color:rgba(242,193,78,.28)}.solar-flow-card{margin-top:18px;overflow:auto}.solar-flow-diagram{display:block;width:100%;min-width:900px;padding:18px;background:linear-gradient(135deg,rgba(11,18,32,.92),rgba(35,34,35,.55))}.solar-flow-wire{fill:none;stroke:#f2c14e;stroke-width:3}.solar-flow-wire.ac{stroke:#ffbd61}.solar-control-wire{fill:none;stroke:#72d6c0;stroke-width:2;stroke-dasharray:7 6}.solar-flow-box rect{fill:#172641;stroke-width:2}.solar-flow-box.dc-box rect{stroke:#72d6c0}.solar-flow-box.ac-box rect{stroke:#ffbd61}.solar-flow-box text,.solar-flow-diagram text{fill:#c5d0de;font-family:'Space Grotesk';font-size:12px;letter-spacing:.04em}.solar-flow-label{fill:#a9b8c9!important;font-size:11px!important}.solar-control-label{fill:#72d6c0!important;font-size:11px!important}.solar-reference-card svg{background:linear-gradient(135deg,rgba(11,18,32,.9),rgba(35,34,35,.55));border:1px solid rgba(242,193,78,.14)}.solar-box{fill:#172641;stroke:#72d6c0;stroke-width:2}.solar-box-hot{stroke:#f2c14e}.solar-wire{fill:none;stroke:#f2c14e;stroke-width:3}.solar-reference-card svg text{fill:#a9b8c9;font-family:'Space Grotesk';font-size:11px}.solar-connection-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}.solar-connection-cards article{border:1px solid var(--line);padding:19px;background:rgba(18,31,52,.42)}.solar-connection-cards span{color:#f2c14e;font:10px 'Space Grotesk';letter-spacing:.1em}.solar-connection-cards h4{font-size:18px;margin:12px 0 8px}.solar-connection-cards p{color:var(--muted);font-size:11px;line-height:1.6;margin:0}
@media(max-width:900px){.solar-connection-cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.diagram-title{grid-template-columns:1fr;gap:5px}.diagram-title small{display:block}.diagram-card>svg:not(.solar-flow-diagram):not(.rmt-electric-svg){min-width:900px}.technical-columns{grid-template-columns:1fr}.solar-connection-cards{grid-template-columns:1fr}}

/* Real-photo galleries: two readable cards per row on desktop */
.real-image-grid,.eolica-photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px}.real-image-card,.eolica-photo-card{min-width:0;border:1px solid var(--line);background:rgba(18,31,52,.48);overflow:hidden}.real-image-wide{grid-column:span 1}.real-image-frame,.photo-frame{position:relative;aspect-ratio:16/9;overflow:hidden;background:#101b2b}.real-image-frame img,.photo-frame img{display:block;width:100%;height:100%;object-fit:cover}.real-image-card figcaption,.eolica-photo-card figcaption{padding:16px 18px}.real-image-card figcaption strong,.eolica-photo-card figcaption strong{display:block;font-size:16px;line-height:1.25}.real-image-card figcaption p,.eolica-photo-card figcaption p{margin:8px 0;color:var(--muted);font-size:11px;line-height:1.55}.real-image-card figcaption small,.eolica-photo-card figcaption small{display:block;color:var(--muted);font-size:10px;line-height:1.45}.real-image-card figcaption a,.eolica-photo-card figcaption a{color:var(--blue)}.image-tag{position:absolute;left:12px;bottom:12px;padding:6px 8px;background:rgba(8,15,26,.86);border:1px solid rgba(114,214,192,.45);color:var(--blue);font:9px 'Space Grotesk';letter-spacing:.1em}.eolica-photo-card{background:rgba(14,29,49,.54)}.eolica-photo-card .photo-frame{aspect-ratio:16/9}.eolica-photo-card .photo-frame img{object-fit:cover}.eolica-photo-grid + *{margin-top:20px}@media(max-width:680px){.real-image-grid,.eolica-photo-grid{grid-template-columns:1fr;gap:16px}.real-image-wide{grid-column:auto}.real-image-card figcaption,.eolica-photo-card figcaption{padding:14px 15px}}

/* Connection Guidelines for BESS — complementary technical checklist */
.connection-guideline-panel{margin-top:20px;border:1px solid rgba(83,224,208,.28);background:linear-gradient(135deg,rgba(18,42,58,.75),rgba(18,31,52,.58));padding:20px}.connection-guideline-panel .panel-topline{display:flex;justify-content:space-between;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding-bottom:14px}.connection-guideline-panel .panel-topline span{color:var(--blue);font:10px 'Space Grotesk';letter-spacing:.1em}.connection-guideline-panel .panel-topline a{color:var(--blue);font:11px 'Space Grotesk'}.guideline-intro{display:grid;grid-template-columns:minmax(180px,.7fr) 1.3fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--line)}.guideline-intro strong{font-size:20px}.guideline-intro p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}.guideline-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);margin-top:18px}.guideline-grid article{background:rgba(11,25,40,.72);padding:17px;min-height:170px}.guideline-grid article span{color:var(--blue);font:10px 'Space Grotesk';letter-spacing:.1em}.guideline-grid h4{margin:11px 0 8px;font-size:16px}.guideline-grid p{margin:0;color:var(--muted);font-size:11px;line-height:1.55}@media(max-width:900px){.guideline-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guideline-intro{grid-template-columns:1fr}}@media(max-width:680px){.connection-guideline-panel{padding:15px}.connection-guideline-panel .panel-topline{align-items:flex-start;flex-direction:column}.guideline-grid{grid-template-columns:1fr}.guideline-grid article{min-height:0}}
