/* Material, hierarchy and conversion refinements. Existing breakpoints retained. */
.glass {
  border-color: var(--glass-border);
  background: linear-gradient(125deg, rgba(110, 197, 255, .055), transparent 44%, rgba(183, 104, 255, .045)), var(--glass-fill);
  box-shadow: var(--glass-highlight), var(--glass-shadow);
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
}
.glass::before { opacity: .48; }
.header-shell { --glass-fill: rgba(8, 10, 28, .58); --glass-blur: 18px; }
.header-row { min-height: 4.35rem; padding: .5rem 1rem .5rem 1.5rem; }
/* 100px visible mark, down from the previous 121px CSS-scaled mark. */
.site-header .brand { width: 6.25rem; }
.mobile-nav [data-whatsapp] { display: flex; align-items: center; gap: .5rem; color: #d3e8ff; }
.mobile-nav .energy-toggle { position: static; margin-top: .75rem; min-height: 2.75rem; font-size: .8rem; width: auto; box-shadow: none; }
.site-header .social-link { width: 2.5rem; height: 2.5rem; flex-basis: 2.5rem; }
.button { transition: transform var(--transition-glass), box-shadow var(--transition-glass), border-color var(--transition-glass), background-color var(--transition-glass); }
.button .icon, .card-link .icon { transition: transform var(--transition-glass); }
.button-primary { background: linear-gradient(108deg, #126acb, var(--ultra-violet) 52%, #b723b7); border-color: rgba(202, 195, 255, .28); box-shadow: inset 0 1px 0 #ffffff45, 0 6px 24px #7a3cff30; }
.button-secondary { background: rgba(8, 10, 28, .35); border-color: var(--glass-border); }
.hero-baseline { border-bottom: 0; background: none; }
.hero-universe { width: min(100%, 1800px); }
.energy-art { object-fit: cover; }
.hero-universe::before { background: radial-gradient(ellipse at center, #02030aa6 30%, #02030a52 58%, transparent 76%); }
@media (min-width: 801px) {
  .energy-art, .network-light-layer, .network-energy-layer {
    mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 80%, transparent), linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
    mask-composite: intersect;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 80%, transparent), linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
    -webkit-mask-composite: source-in;
  }
}
.services-section { isolation: isolate; }
.services-section::before {
  content: ""; position: absolute; pointer-events: none; z-index: -1;
  top: -11rem; left: 0; right: 0; height: 34rem;
  background: radial-gradient(ellipse at 26% 0, #008cff12, transparent 47%), radial-gradient(ellipse at 75% 8%, #b020ff16, transparent 48%);
}
.orbit-node { --glass-fill: rgba(8, 10, 28, .4); --glass-blur: 18px; transition: transform var(--transition-glass), border-color var(--transition-glass), box-shadow var(--transition-glass); }
.node-led { border-color: #81dfff55; box-shadow: var(--glass-highlight), 0 0 24px #00c8ff16; }
.node-led .node-label { display: grid; line-height: 1.4; }
.node-led small { font-size: .6rem; letter-spacing: .06em; color: #a1e6ff; }
.service-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; }
.service-card, .service-wide { grid-column: span 3; padding: 1.5rem; --glass-fill: rgba(8, 10, 28, .36); background: radial-gradient(ellipse at 0 0, rgba(var(--accent), .075), transparent 58%), var(--glass-fill); box-shadow: var(--glass-highlight), var(--glass-shadow); transition: transform var(--transition-glass), border-color var(--transition-glass), background-color var(--transition-glass), box-shadow var(--transition-glass); }
.service-card::before { background: linear-gradient(135deg, rgba(var(--accent), .48), #ffffff33 18%, #ffffff05 52%, rgba(var(--accent), .2)); }
.reveal-ready .service-card.is-visible { transition: opacity .65s ease, transform var(--transition-glass), border-color var(--transition-glass), background-color var(--transition-glass), box-shadow var(--transition-glass); }
.service-card > p { color: #e0e1ef; text-shadow: 0 1px 8px #02030a80; }
.service-card h3 { font-size: 1.4rem; }
.card-number, .service-tag { color: #c6c6dc; }
.card-category { color: #b9dffa; }
.accent-violet .card-category, .accent-magenta .card-category { color: #dbc6fc; }
.card-top { margin-bottom: 1.5rem; }
.service-card.service-featured { grid-column: span 6; grid-row: span 2; padding: 1.75rem; border-color: rgba(147, 209, 255, .24); --glass-fill: rgba(8, 10, 28, .32); }
.service-featured h3 { font-size: clamp(2rem, 3vw, 2.7rem); }
.service-featured > p { max-width: 32rem; }
.service-featured .card-top { order: 0; }
.service-featured .card-category { order: 1; }
.service-featured h3 { order: 2; }
.service-featured .led-visual { order: 3; margin-top: .75rem; }
.service-featured > p { order: 4; }
.service-featured .card-foot { order: 5; }
.feature-badge { display: inline-flex; align-items: center; padding: .38rem .7rem; border: 1px solid #96ddff33; border-radius: 999px; color: #d2f3ff; background: #008cff12; font-size: .7rem; letter-spacing: .045em; }
.led-visual { position: relative; margin: 0 0 1.75rem; min-height: 230px; flex: 1; overflow: hidden; border-radius: 1rem; border: 1px solid #ffffff14; background: var(--ultra-bg); }
.led-visual img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 58% 45%; }
.led-visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 62%, #02030a4d); box-shadow: inset 0 1px 0 #ffffff20; border-radius: inherit; }
.service-featured .card-foot { padding-top: 1.2rem; }
.contact-panel { --glass-fill: rgba(8, 10, 28, .48); }
.briefing-form { background: #06091d33; border-color: var(--glass-border); }
.field input, .field select, .field textarea, .briefing-result textarea { background: rgba(4, 7, 20, .6); }
.contact-direct { margin-top: 1.5rem; }
.briefing-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.briefing-actions .button { flex: 1 1 12rem; }
.briefing-result textarea { font-size: .875rem; }

@media (hover: hover) and (pointer: fine) {
  .service-card:hover, .service-card:focus-within, .reveal-ready .service-card.is-visible:hover, .reveal-ready .service-card.is-visible:focus-within { transform: translateY(-4px); border-color: rgba(var(--accent), .38); background-color: rgba(8, 10, 28, .3); box-shadow: inset 0 1px 0 #ffffff30, var(--glass-shadow), 0 0 28px rgba(var(--accent), .075); }
  .button-primary:hover { box-shadow: inset 0 1px 0 #ffffff60, 0 8px 30px #7a3cff4a; }
  .button:hover .icon, .card-link:hover .icon { transform: translateX(3px); }
}
@media (min-width: 801px) and (max-width: 1100px) {
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-card, .service-wide { grid-column: span 1; }
  .service-card.service-featured { grid-column: 1 / -1; grid-row: auto; min-height: 355px; padding-right: 52%; }
  .service-featured .led-visual { position: absolute; top: 1.75rem; right: 1.75rem; bottom: 1.75rem; width: 43%; margin: 0; }
  .service-featured .card-top { gap: 1rem; }
  .service-featured .feature-badge { font-size: .65rem; }
  .service-featured .service-tag { display: none; }
}
@media (max-width: 800px) {
  :root { --glass-blur: 12px; --glass-saturation: 132%; }
  .header-shell { --glass-blur: 14px; --glass-fill: rgba(8, 10, 28, .65); }
  .header-row { min-height: 3.8rem; padding: .45rem .6rem .45rem 1rem; }
  .site-header .brand { width: clamp(78px, 19vw, 94px); }
  .site-header .social-link { width: 2.75rem; height: 2.75rem; flex-basis: 2.75rem; }
  .orbit-node { --glass-blur: 10px; --glass-fill: rgba(8, 10, 28, .5); }
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-card, .service-wide, .service-card:last-child { grid-column: span 1; --glass-fill: rgba(8, 10, 28, .5); }
  .service-card.service-featured { grid-column: 1 / -1; grid-row: auto; }
  .service-featured .led-visual { flex: none; height: 260px; }
  .service-card h3 { font-size: 1.5rem; }
  .service-featured h3 { font-size: 2rem; }
  .contact-panel { --glass-fill: rgba(8, 10, 28, .6); }
  .node-led small { font-size: .56rem; }
}
@media (max-width: 540px) {
  .service-grid { grid-template-columns: 1fr; }
  .service-card, .service-card.service-featured { padding: 1.35rem; grid-column: 1; }
  .service-featured .led-visual { height: 220px; min-height: 0; margin-bottom: 1.4rem; }
  .service-featured .card-foot { flex-wrap: wrap; }
  .service-featured .card-foot .button { width: 100%; }
  .hero-baseline { background: none; }
  .form-footer .button, .briefing-actions .button { padding-inline: .9rem; font-size: .85rem; }
  .contact-panel { padding: 1.35rem; }
}
@media (hover: none), (pointer: coarse) {
  .service-card:hover, .service-card:focus-within, .orbit-node:hover, .button:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .service-card:hover, .orbit-node:hover, .button:hover, .button:hover .icon, .reveal-ready .service-card.is-visible:hover, .reveal-ready .service-card.is-visible:focus-within { transform: none; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass { background-color: rgba(8, 10, 28, .88); }
}
