:root {
     --charcoal: #15171A;
     --panel: #1D2023;
     --panel-2: #242830;
     --amber: #E8A33D;
     --amber-bright: #F5B84F;
     --copper: #B8763F;
     --off-white: #EDEAE3;
     --gray: #8B9096;
     --green: #4CAF6D;
     --border: rgba(237, 234, 227, 0.09);
     --border-strong: rgba(237, 234, 227, 0.16);
     --radius: 4px;
     --display: 'Archivo Black', sans-serif;
     --body: 'IBM Plex Sans', sans-serif;
     --mono: 'IBM Plex Mono', monospace;
 }

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 html {
     scroll-behavior: smooth;
 }

 body {
     background: var(--charcoal);
     color: var(--off-white);
     font-family: var(--body);
     line-height: 1.6;
     overflow-x: hidden;
     -webkit-font-smoothing: antialiased;
 }

 img {
     max-width: 100%;
     display: block;
 }

 a {
     color: inherit;
     text-decoration: none;
 }

 ul {
     list-style: none;
 }

 button {
     font-family: inherit;
     cursor: pointer;
     border: none;
     background: none;
     color: inherit;
 }

 h1,
 h2,
 h3 {
     font-family: var(--display);
     font-weight: 400;
     letter-spacing: 0.01em;
     line-height: 1.08;
 }

 .mono {
     font-family: var(--mono);
 }

 section {
     position: relative;
 }

 .container {
     max-width: 1180px;
     margin: 0 auto;
     padding: 0 24px;
 }

 .eyebrow {
     font-family: var(--mono);
     font-size: 0.72rem;
     letter-spacing: 0.18em;
     text-transform: uppercase;
     color: var(--amber);
     display: flex;
     align-items: center;
     gap: 10px;
     margin-bottom: 18px;
 }

 .eyebrow::before {
     content: '';
     width: 22px;
     height: 1px;
     background: var(--amber);
     display: inline-block;
 }

 .section-head {
     max-width: 640px;
     margin-bottom: 56px;
 }

 .section-head h2 {
     font-size: clamp(1.8rem, 4vw, 2.7rem);
     margin-bottom: 16px;
 }

 .section-head p {
     color: var(--gray);
     font-size: 1.02rem;
 }

 section.alt {
     background: var(--panel);
 }

 .pad {
     padding: 100px 0;
 }

 @media(max-width:768px) {
     .pad {
         padding: 64px 0;
     }
 }

 /* reduced motion */
 @media (prefers-reduced-motion: reduce) {
     * {
         animation-duration: 0.01ms !important;
         animation-iteration-count: 1 !important;
         transition-duration: 0.01ms !important;
         scroll-behavior: auto !important;
     }
 }

 /* CIRCUIT TRACE SIGNATURE */
 .circuit-divider {
     width: 100%;
     height: 46px;
     position: relative;
     overflow: hidden;
 }

 .circuit-divider svg {
     width: 100%;
     height: 100%;
     display: block;
 }

 .circuit-line {
     fill: none;
     stroke: var(--amber);
     stroke-width: 1.5;
     stroke-dasharray: 6 6;
     opacity: 0.55;
 }

 .circuit-node {
     fill: var(--amber);
 }

 /* LOADER  */
 #loader {
     position: fixed;
     inset: 0;
     background:var(--charcoal);
     z-index: 2000;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
     gap: 16px;
     transition: opacity .5s ease, visibility .5s ease;
 }

 #loader.hide {
     opacity: 0;
     visibility: hidden;
 }

 .loader-mark {
     width: 44px;
     height: 44px;
     position: relative;
 }

 .loader-mark img {
     width: 100%;
     height: 100%;
     fill: var(--amber);
     animation: flicker 1.1s infinite;
 }

 @keyframes flicker {

     0%,
     100% {
         opacity: 1;
     }

     45% {
         opacity: 0.3;
     }

     50% {
         opacity: 1;
     }

     55% {
         opacity: 0.4;
     }

     60% {
         opacity: 1;
     }
 }

 #loader .loader-label {
     font-family: var(--mono);
     font-size: 1.7rem;
     letter-spacing: 0.15em;
     color: var(--gray);
     text-transform: uppercase;
 }

 /*  NAV  */
 header {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     padding-bottom: 10px;
     z-index: 1000;
     background: rgba(21, 23, 26, 0.88);
     backdrop-filter: blur(10px);
     border-bottom: 1px solid var(--border);
     transition: border-color .3s;
 }

 header.sticky {
     padding-bottom: 5px;
 }

 .nav-wrap {
     max-width: 1180px;
     margin: 0 auto;
     padding: 16px 24px;
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .logo {
     display: flex;
     align-items: center;
     gap: 10px;
     font-family: var(--display);
     font-size: 1.1rem;
     letter-spacing: 0.01em;
 }

 .logo-mark {
     width: 34px;
     height: 34px;
     border-radius: 6px;
     background: var(--charcoal);
     border: 1px solid var(--border-strong);
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .logo-mark svg {
     width: 16px;
     height: 16px;
     margin: 8px;
     align-items: center;
     fill: var(--amber);
 }

 .logo span {
     color: var(--gray);
     font-family: var(--mono);
     font-size: 0.65rem;
     letter-spacing: 0.1em;
     display: block;
     font-weight: 400;
     text-transform: uppercase;
     margin-top: 2px;
 }

 .logo-text-wrap {
     display: flex;
     flex-direction: column;
 }

 .nav-links {
     display: flex;
     gap: 32px;
     align-items: center;
 }

 .nav-links a {
     font-size: 0.9rem;
     color: var(--off-white);
     opacity: 0.85;
     transition: opacity .2s, color .2s;
     position: relative;
 }

 .nav-links a:hover {
     opacity: 1;
     color: var(--amber);
 }

 .status-chip {
     display: flex;
     align-items: center;
     gap: 7px;
     font-family: var(--mono);
     font-size: 0.68rem;
     letter-spacing: 0.08em;
     color: var(--green);
     padding: 6px 12px;
     border: 1px solid rgba(76, 175, 109, 0.3);
     border-radius: 20px;
     background: rgba(76, 175, 109, 0.06);
 }

 .status-dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: var(--green);
     box-shadow: 0 0 0 0 rgba(76, 175, 109, 0.6);
     animation: pulse-dot 2s infinite;
 }

 @keyframes pulse-dot {
     0% {
         box-shadow: 0 0 0 0 rgba(76, 175, 109, 0.55);
     }

     70% {
         box-shadow: 0 0 0 8px rgba(76, 175, 109, 0);
     }

     100% {
         box-shadow: 0 0 0 0 rgba(76, 175, 109, 0);
     }
 }

 .nav-cta {
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .btn {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 11px 20px;
     font-size: 0.85rem;
     font-weight: 600;
     border-radius: var(--radius);
     transition: transform .2s ease, background .2s ease, border-color .2s ease;
     white-space: nowrap;
 }

 .btn svg {
     width: 15px;
     height: 15px;
     flex-shrink: 0;
 }

 .btn-primary {
     background: var(--amber);
     color: var(--charcoal);
 }

 .btn-primary:hover {
     background: var(--amber-bright);
     transform: translateY(-1px);
 }

 .btn-ghost {
     border: 1px solid var(--border-strong);
     color: var(--off-white);
 }

 .btn-ghost:hover {
     border-color: var(--amber);
     color: var(--amber);
 }

 .btn-block {
     width: 100%;
     justify-content: center;
 }

 .hamburger {
     display: none;
     flex-direction: column;
     gap: 5px;
     width: 26px;
     z-index: 1001;
 }

 .hamburger span {
     height: 2px;
     background: var(--off-white);
     border-radius: 2px;
     transition: .3s;
 }

 .hamburger.active span:nth-child(1) {
     transform: translateY(7px) rotate(45deg);
 }

 .hamburger.active span:nth-child(2) {
     opacity: 0;
 }

 .hamburger.active span:nth-child(3) {
     transform: translateY(-7px) rotate(-45deg);
 }

 .mobile-menu {
     display: none;
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.82);
     backdrop-filter: blur(20px);
     z-index: 999;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     gap: 28px;
 }

 .mobile-menu.open {
     display: flex;
 }

 .mobile-menu a {
     font-family: var(--display);
     font-size: 1.6rem;
 }

 @media(max-width:900px) {

     .nav-links,
     .status-chip.desktop-only {
         display: none;
     }

     .nav-cta .btn-ghost {
         display: none;
     }

     .btn-primary {
         margin: 10px;
     }

     .hamburger {
         display: flex;
     }
 }

 /*  HERO  */
 .hero {
     padding: 170px 0 90px;
     position: relative;
     background:
         radial-gradient(ellipse 700px 400px at 85% -10%, rgba(232, 163, 61, 0.14), transparent 60%),
         linear-gradient(var(--charcoal), var(--charcoal));
     overflow: hidden;
 }

 .hero::before {
     content: '';
     position: absolute;
     inset: 0;
     background-image:
         linear-gradient(rgba(237, 234, 227, 0.025) 1px, transparent 1px),
         linear-gradient(90deg, rgba(237, 234, 227, 0.025) 1px, transparent 1px);
     background-size: 44px 44px;
     mask-image: linear-gradient(to bottom, black, transparent 80%);
     pointer-events: none;
 }

 .hero .eyebrow::before {
     content: "";
     display: none;
 }

 .hero-inner {
     position: relative;
     z-index: 2;
     display: grid;
     grid-template-columns: 1.15fr 0.85fr;
     gap: 60px;
     align-items: center;
 }

 @media(max-width:900px) {
     .hero-inner {
         grid-template-columns: 1fr;
     }
 }

 .hero h1 {
     font-size: clamp(2.4rem, 5.4vw, 4rem);
     margin-bottom: 22px;
 }

 .hero h1 em {
     font-style: normal;
     color: var(--amber);
 }

 .hero p.lead {
     color: var(--gray);
     font-size: 1.08rem;
     max-width: 520px;
     margin-bottom: 34px;
 }

 .hero-cta {
     display: flex;
     gap: 14px;
     flex-wrap: wrap;
     margin-bottom: 40px;
 }

 .hero-meta {
     display: flex;
     gap: 28px;
     flex-wrap: wrap;
 }

 .hero-meta div {
     display: flex;
     flex-direction: column;
     gap: 2px;
 }

 .hero-meta .num {
     font-family: var(--mono);
     font-size: 1.4rem;
     color: var(--amber);
 }

 .hero-meta .lbl {
     font-size: 0.75rem;
     color: var(--gray);
     letter-spacing: 0.03em;
 }

 .panel-visual {
     background: var(--panel);
     border: 1px solid var(--border-strong);
     border-radius: 8px;
     padding: 26px;
     position: relative;
 }

 .panel-visual .panel-head {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 20px;
     font-family: var(--mono);
     font-size: 0.7rem;
     letter-spacing: 0.08em;
     color: var(--gray);
     text-transform: uppercase;
 }

 .switch-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 13px 4px;
     border-bottom: 1px solid var(--border);
     font-size: 0.88rem;
 }

 .switch-row:last-child {
     border-bottom: none;
 }

 .switch {
     width: 38px;
     height: 20px;
     border-radius: 11px;
     background: rgba(76, 175, 109, 0.15);
     border: 1px solid rgba(76, 175, 109, 0.4);
     position: relative;
     flex-shrink: 0;
 }

 .switch::after {
     content: '';
     position: absolute;
     width: 14px;
     height: 14px;
     border-radius: 50%;
     background: var(--green);
     top: 2px;
     right: 2px;
     transition: .3s;
 }

 /*  TRUST STRIP */
 .trust-strip {
     border-top: 1px solid var(--border);
     border-bottom: 1px solid var(--border);
     padding: 0;
 }

 .trust-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
 }

 .trust-cell {
     padding: 30px 24px;
     text-align: center;
     border-right: 1px solid var(--border);
 }

 .trust-cell:last-child {
     border-right: none;
 }

 .trust-cell .num {
     font-family: var(--mono);
     font-size: 1.8rem;
     color: var(--amber);
     display: block;
 }

 .trust-cell .lbl {
     font-size: 0.78rem;
     color: var(--gray);
     margin-top: 4px;
 }

 @media(max-width:768px) {
     .trust-grid {
         grid-template-columns: repeat(2, 1fr);
     }

     .trust-cell:nth-child(2) {
         border-right: none;
     }

     .trust-cell {
         border-bottom: 1px solid var(--border);
     }
 }

 /* ABOUT  */
 .about-grid {
     display: grid;
     grid-template-columns: 0.9fr 1.1fr;
     gap: 64px;
     align-items: start;
 }

 @media(max-width:900px) {
     .about-grid {
         grid-template-columns: 1fr;
         gap: 40px;
     }
 }
.aboutimg{
    display: block;
}
.aboutimg .reveal{
    margin-bottom: 20px;
}
.imga{
    width: 80%;
}
.imga img{
    border-radius: 10px;
}
 .reveal .eyebrow::before {
     content: "";
     display: none;
 }
 

 .about-grid p {
     color: var(--gray);
     margin-bottom: 16px;
     font-size: 1rem;
 }

 .about-grid #reveals{
    margin-top: 40px;
 }
 .value-list {
     display: flex;
     flex-direction: column;
     gap: 0;
     margin-top: 8px;
 }

 .value-row {
     display: flex;
     gap: 16px;
     padding: 18px 0;
     border-top: 1px solid var(--border);
 }

 .value-row:last-child {
     border-bottom: 1px solid var(--border);
 }

 .value-row .vnum {
     font-family: var(--mono);
     color: var(--copper);
     font-size: 0.85rem;
     flex-shrink: 0;
     padding-top: 2px;
 }

 .value-row h4 {
     font-family: var(--body);
     font-weight: 600;
     font-size: 1rem;
     margin-bottom: 5px;
 }

 .value-row p {
     color: var(--gray);
     font-size: 0.92rem;
     margin: 0;
 }

 /*  SERVICES  */
 .services-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 1px;
     background: var(--border);
     border: 1px solid var(--border);
 }

 @media(max-width:900px) {
     .services-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 @media(max-width:560px) {
     .services-grid {
         grid-template-columns: 1fr;
     }
 }

 .service-card {
     background: var(--charcoal);
     padding: 32px 26px;
     transition: background .25s ease;
     opacity: 0;
     transform: translateY(16px);
 }

 .service-card.visible {
     opacity: 1;
     transform: translateY(0);
     transition: opacity .5s ease, transform .5s ease, background .25s ease;
 }

 .service-card:hover {
     background: var(--panel);
 }

 .service-card .icon-wrap {
     width: 44px;
     height: 44px;
     border-radius: 6px;
     background: var(--panel-2);
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 18px;
     transition: .25s;
 }

 .service-card:hover .icon-wrap {
     background: rgba(232, 163, 61, 0.14);
 }

 .service-card svg {
     width: 22px;
     height: 22px;
     stroke: var(--amber);
     fill: none;
     stroke-width: 1.6;
 }

 .service-card h3 {
     font-family: var(--body);
     font-weight: 600;
     font-size: 1.05rem;
     margin-bottom: 8px;
 }

 .service-card p {
     color: var(--gray);
     font-size: 0.9rem;
 }

 /* SOLAR FEATURE  */
 .solar-section {
     background: linear-gradient(135deg, var(--panel) 0%, var(--charcoal) 100%);
     border-top: 1px solid var(--border);
     border-bottom: 1px solid var(--border);
 }

 .solar-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 60px;
     align-items: center;
 }

 @media(max-width:900px) {
     .solar-grid {
         grid-template-columns: 1fr;
         gap: 36px;
     }
 }

 .solar-visual {
     aspect-ratio: 3/4;
     border-radius: 8px;
     border: 1px solid var(--border-strong);
     background-image: url(images/hagapha.jpg);
     background-size: contain;
     background-repeat:no-repeat;
     display: flex;
     align-items: center;
     justify-content: center;
     position: relative;
     overflow: hidden;
 }

 .solar-visual svg {
     width: 38%;
     stroke: var(--amber);
     fill: none;
     display: none;
     stroke-width: 1.2;
 }

 .solar-section .reveal{
    padding: 40px;
 }
 .solar-list {
     display: flex;
     flex-direction: column;
     gap: 14px;
     margin: 26px 0 32px;
 }

 .solar-list li {
     display: flex;
     gap: 12px;
     align-items: flex-start;
     color: var(--off-white);
     font-size: 0.95rem;
 }

 .solar-list svg {
     width: 16px;
     height: 16px;
     stroke: var(--green);
     flex-shrink: 0;
     margin-top: 3px;
 }

 /*  STATS COUNTER */
 .feature-strip {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 1px;
     background: var(--border);
     border: 1px solid var(--border);
     margin-top: 60px;
 }

 @media(max-width:768px) {
     .feature-strip {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 .feature-cell {
     background: var(--panel);
     padding: 26px 22px;
 }

 .feature-cell h4 {
     font-family: var(--body);
     font-weight: 600;
     font-size: 0.95rem;
     margin-bottom: 6px;
 }

 .feature-cell p {
     color: var(--gray);
     font-size: 0.85rem;
 }

 /*  TESTIMONIALS  */
 .testi-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 22px;
 }

 @media(max-width:900px) {
     .testi-grid {
         grid-template-columns: 1fr;
     }
 }

 .testi-card {
     background: var(--panel);
     border: 1px solid var(--border);
     border-radius: 8px;
     padding: 28px;
 }

 .stars {
     color: var(--amber);
     font-size: 0.9rem;
     margin-bottom: 14px;
     letter-spacing: 2px;
 }

 .testi-card p.quote {
     color: var(--off-white);
     font-size: 0.95rem;
     margin-bottom: 20px;
 }

 .testi-author {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .avatar {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     background: var(--panel-2);
     display: flex;
     align-items: center;
     justify-content: center;
     font-family: var(--mono);
     font-size: 0.8rem;
     color: var(--amber);
 }

 .testi-author .name {
     font-size: 0.88rem;
     font-weight: 600;
 }

 .testi-author .loc {
     font-size: 0.78rem;
     color: var(--gray);
 }

 /*  FAQ  */
 .faq-list {
     max-width: 760px;
 }

 .faq-item {
     border-bottom: 1px solid var(--border);
 }

 .faq-q {
     width: 100%;
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 22px 4px;
     font-family: var(--body);
     font-weight: 600;
     font-size: 1rem;
     text-align: left;
 }

 .faq-q .plus {
     font-family: var(--mono);
     color: var(--amber);
     font-size: 1.2rem;
     transition: transform .3s;
     flex-shrink: 0;
     margin-left: 16px;
 }

 .faq-item.open .plus {
     transform: rotate(45deg);
 }

 .faq-a {
     max-height: 0;
     overflow: hidden;
     transition: max-height .35s ease;
 }

 .faq-a p {
     color: var(--gray);
     padding: 0 4px 22px;
     font-size: 0.92rem;
     max-width: 640px;
 }

 /* CONTACT */
 .contact-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 60px;
 }

 @media(max-width:900px) {
     .contact-grid {
         grid-template-columns: 1fr;
         gap: 40px;
     }
 }

 .form-group {
     margin-bottom: 18px;
 }

 .form-group label {
     display: block;
     font-size: 0.8rem;
     color: var(--gray);
     margin-bottom: 7px;
     font-family: var(--mono);
     letter-spacing: 0.04em;
     text-transform: uppercase;
 }

 .form-group input,
 .form-group textarea {
     width: 100%;
     background: var(--panel);
     border: 1px solid var(--border-strong);
     border-radius: var(--radius);
     padding: 13px 14px;
     color: var(--off-white);
     font-family: var(--body);
     font-size: 0.95rem;
     transition: border-color .2s;
 }

 .form-group input:focus,
 .form-group textarea:focus {
     outline: none;
     border-color: var(--amber);
 }

 .form-group textarea {
     resize: vertical;
     min-height: 110px;
 }

 .form-note {
     font-size: 0.78rem;
     color: var(--gray);
     margin-top: 14px;
 }

 #formSuccess {
     display: none;
     background: rgba(76, 175, 109, 0.08);
     border: 1px solid rgba(76, 175, 109, 0.3);
     color: var(--green);
     padding: 14px 16px;
     border-radius: var(--radius);
     font-size: 0.88rem;
     margin-bottom: 18px;
 }

 .info-card {
     background: var(--panel);
     border: 1px solid var(--border);
     border-radius: 8px;
     padding: 28px;
     margin-bottom: 20px;
 }

 .info-row {
     display: flex;
     gap: 14px;
     padding: 14px 0;
     border-bottom: 1px solid var(--border);
     align-items: flex-start;
 }

 .info-row:last-child {
     border-bottom: none;
 }

 .info-row svg {
     width: 18px;
     height: 18px;
     stroke: var(--amber);
     fill: none;
     stroke-width: 1.6;
     flex-shrink: 0;
     margin-top: 2px;
 }

 .info-row .k {
     font-size: 0.78rem;
     color: var(--gray);
 }

 .info-row .v {
     font-size: 0.95rem;
 }

 .hours-table {
     width: 100%;
     font-size: 0.88rem;
 }

 .hours-table td {
     padding: 6px 0;
     border-bottom: 1px solid var(--border);
 }

 .hours-table td:last-child {
     text-align: right;
     color: var(--green);
     font-family: var(--mono);
     font-size: 0.8rem;
 }

 .map-embed {
     border-radius: 8px;
     overflow: hidden;
     border: 1px solid var(--border);
     margin-top: 20px;
 }

 .map-embed iframe {
     width: 100%;
     height: 260px;
     border: 0;
     filter: grayscale(0.3) invert(0.92) contrast(0.9);
 }

 /*  CTA BAND  */
 .cta-band {
     background: var(--amber);
     color: var(--charcoal);
     text-align: center;
     padding: 70px 24px;
 }

 .cta-band h2 {
     color: var(--charcoal);
     font-size: clamp(1.6rem, 3.6vw, 2.4rem);
     margin-bottom: 14px;
 }

 .cta-band p {
     color: rgba(21, 23, 26, 0.75);
     margin-bottom: 30px;
     font-size: 1rem;
 }

 .cta-band .btn-primary {
     background: var(--charcoal);
     color: var(--amber-bright);
 }

 .cta-band .btn-primary:hover {
     background: #000;
 }

 .cta-band .btn-ghost {
     border-color: rgba(21, 23, 26, 0.3);
     color: var(--charcoal);
 }

 .cta-band .btn-ghost:hover {
     border-color: var(--charcoal);
 }

 .cta-actions {
     display: flex;
     gap: 14px;
     justify-content: center;
     flex-wrap: wrap;
 }

 /*  FOOTER  */
 footer {
     background: var(--panel);
     border-top: 1px solid var(--border);
     padding: 64px 0 26px;
 }

 .footer-grid {
     display: grid;
     grid-template-columns: 1.4fr 1fr 1fr 1fr;
     gap: 40px;
     margin-bottom: 50px;
 }

 @media(max-width:768px) {
     .footer-grid {
         grid-template-columns: 1fr 1fr;
     }
 }

 .footer-grid h5 {
     font-family: var(--mono);
     font-size: 0.75rem;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     color: var(--gray);
     margin-bottom: 16px;
 }

 .footer-grid ul li {
     margin-bottom: 10px;
     font-size: 0.9rem;
 }

 .footer-grid ul li a:hover {
     color: var(--amber);
 }

 .footer-social {
     display: flex;
     gap: 12px;
     margin-top: 16px;
 }

 .footer-social a {
     width: 34px;
     height: 34px;
     border: 1px solid var(--border-strong);
     border-radius: 6px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: .2s;
 }

 .footer-social a:hover {
     border-color: var(--amber);
 }

 .footer-social svg {
     width: 15px;
     height: 15px;
     fill: var(--off-white);
 }

 .footer-bottom {
     border-top: 1px solid var(--border);
     padding-top: 24px;
     display: flex;
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 12px;
     font-size: 0.82rem;
     color: var(--gray);
 }

 .footer-bottom a:hover {
     color: var(--amber);
 }

 /*  FLOATING BUTTONS */
 .fab-group {
     position: fixed;
     bottom: 24px;
     right: 24px;
     z-index: 900;
     display: flex;
     flex-direction: column;
     gap: 12px;
     align-items: flex-end;
 }

 .fab {
     width: 52px;
     height: 52px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
     transition: transform .2s;
 }

 .fab:hover {
     transform: scale(1.08);
 }

 .fab-whatsapp {
     background: #25D366;
 }

 .fab-whatsapp svg {
     width: 26px;
     height: 26px;
     fill: #fff;
 }

 .fab-top {
     background: var(--panel-2);
     border: 1px solid var(--border-strong);
     opacity: 0;
     pointer-events: none;
     transition: opacity .3s, transform .2s;
 }

 .fab-top.show {
     opacity: 1;
     pointer-events: auto;
 }

 .fab-top svg {
     width: 18px;
     height: 18px;
     stroke: var(--off-white);
     fill: none;
     stroke-width: 2;
 }

 /*  SCROLL REVEAL  */
 .reveal {
     opacity: 0;
     transform: translateY(20px);
     transition: opacity .6s ease, transform .6s ease;
 }

 .reveal.visible {
     opacity: 1;
     transform: translateY(0);
 }