.elementor-kit-247{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#CBDCEF;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-ea4c5cd:#5B8AC7;--e-global-typography-primary-font-family:"VazirMatn";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Estedad";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"VazirMatn";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-247 e-page-transition{background-color:#FFBC7D;}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button{background-color:#0A2342;}.elementor-kit-247 a{font-family:"VazirMatn", Sans-serif;}.elementor-kit-247 h2{font-family:"VazirMatn", Sans-serif;letter-spacing:0.4px;}.elementor-kit-247 h3{font-family:"VazirMatn", Sans-serif;}.elementor-kit-247 h4{font-family:"VazirMatn", Sans-serif;}.elementor-kit-247 h5{font-family:"VazirMatn", Sans-serif;}.elementor-kit-247 h6{font-family:"VazirMatn", Sans-serif;}.elementor-kit-247 button,.elementor-kit-247 input[type="button"],.elementor-kit-247 input[type="submit"],.elementor-kit-247 .elementor-button{font-family:"VazirMatn", Sans-serif;}.elementor-kit-247 input:not([type="button"]):not([type="submit"]),.elementor-kit-247 textarea,.elementor-kit-247 .elementor-field-textual{font-family:"VazirMatn", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button i{font-size:20px;color:#FFFAFA;}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button img{height:20px;width:20px;}.hfe-scroll-to-top-wrap .hfe-scroll-to-top-button span{color:#FFFAFA;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="widescreen"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="desktop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="laptop"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="tablet_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="tablet"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="mobile_extra"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap,
						body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.edit-mode,
						body[data-elementor-device-mode="mobile"] .hfe-scroll-to-top-wrap.single-page-off{visibility:visible;opacity:1;}}/* Start custom CSS */:root{
    --navy-deep:#0A2342;
    --navy-darker:#061529;
    --navy-darkest:#040D1A;
    --slate:#3D5875;
    --signal:#5B8AC7;
    --mist:#BFCCD2;
    --mist-dim:#8B98A1;
    --white:#FFFFFF;
    --off-white:#F4F6F7;
    --paper:#F3F6F8;
    --paper-2:#EAEFF2;
    --success:#4CAF7D;
  }
  

  /* ============================================================
     SHARED SECTION UTILITIES
  ============================================================ */
  .container{max-width:1320px;margin:0 auto;padding:0 6vw;}

  .section-head{max-width:620px;margin-bottom:56px;}
  .section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
  .section-eyebrow{
    display:inline-flex;align-items:center;gap:9px;
    color:var(--signal);font-size:13px;font-weight:700;letter-spacing:.3px;
    margin-bottom:16px;
  }
  .section-eyebrow::before{content:'';width:22px;height:2px;background:var(--signal);}
  .section-head.center .section-eyebrow::before{display:none;}
  .section-head h2{
    font-size:clamp(26px,2.8vw,38px);font-weight:800;line-height:1.4;margin-bottom:14px;
  }
  .section-head p{font-size:15.5px;line-height:1.9;color:var(--slate);}
  .on-dark h2{color:var(--white);}
  .on-dark p{color:var(--mist);}
  .on-light h2{color:var(--navy-deep);}
  .on-light p{color:var(--slate);}

  /* ============================================================
     ABOUT SECTION
  ============================================================ */
  .about-section{background:var(--paper);padding:110px 0;}
  .about-grid{display:grid;grid-template-columns:1fr 0.92fr;gap:64px;align-items:center;}
  .about-copy p.lead{font-size:16px;line-height:2;color:var(--slate);margin-bottom:18px;max-width:540px;}
  .about-stats{display:flex;gap:38px;flex-wrap:wrap;margin-top:36px;}
  .about-stats .stat-item .num{font-size:32px;font-weight:800;color:var(--navy-deep);}
  .about-stats .stat-item .num em{font-style:normal;color:var(--signal);}
  .about-stats .stat-item .label{font-size:12.5px;color:var(--mist-dim);font-weight:600;margin-top:6px;}

  .about-panel{
    position:relative;
    background:linear-gradient(155deg, var(--navy-deep), var(--navy-darker));
    border-radius:20px;
    padding:38px 34px;
    box-shadow:0 30px 60px rgba(10,35,66,0.18);
    overflow:hidden;
  }
  .about-panel .panel-grid-bg{
    position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(191,204,210,0.06) 1px, transparent 1px),
      linear-gradient(90deg, rgba(191,204,210,0.06) 1px, transparent 1px);
    background-size:32px 32px;
    mask-image:radial-gradient(ellipse 80% 70% at 60% 30%, black, transparent 75%);
  }
  .about-panel-head{position:relative;display:flex;align-items:center;gap:10px;margin-bottom:26px;}
  .about-panel-head .live-badge{
    display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--mist);font-weight:600;
  }
  .radar-wrap{position:relative;display:flex;justify-content:center;padding:10px 0 6px;}
  .radar-wrap svg{width:100%;max-width:280px;height:auto;}
  .radar-ring{fill:none;stroke:rgba(191,204,210,0.16);stroke-width:1;}
  .radar-axis{stroke:rgba(191,204,210,0.14);stroke-width:1;}
  .radar-shape{fill:rgba(91,138,199,0.18);stroke:var(--signal);stroke-width:1.8;}
  .radar-dot{fill:var(--signal);}
  .about-panel-metrics{
    position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px;
  }
  .metric-chip{
    background:rgba(255,255,255,0.05);border:1px solid rgba(191,204,210,0.16);
    border-radius:10px;padding:12px 14px;
  }
  .metric-chip .m-num{font-size:17px;font-weight:800;color:var(--white);}
  .metric-chip .m-label{font-size:11px;color:var(--mist-dim);margin-top:3px;}

  /* ============================================================
     NAME-BREAKDOWN (BRAND STORY) SECTION
  ============================================================ */
  .name-section{
    background:linear-gradient(180deg, var(--navy-darkest), var(--navy-deep) 60%, var(--navy-darkest));
    padding:110px 0;
    position:relative;
    overflow:hidden;
  }
  .name-section .grid-overlay{opacity:.6;}
  .name-strip{
    position:relative;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-top:10px;
  }
  .name-item{
    text-align:center;
    padding:0 22px;
    position:relative;
  }
  .name-item:not(:last-child)::after{
    content:'';
    position:absolute;
    top:14px;left:0;
    width:1px;height:calc(100% - 14px);
    background:rgba(191,204,210,0.14);
  }
  .name-node{
    width:14px;height:14px;border-radius:50%;
    background:var(--navy-darkest);
    border:2px solid var(--signal);
    margin:0 auto 22px;
    position:relative;
  }
  .name-node::after{
    content:'';position:absolute;inset:-7px;border-radius:50%;
    border:1px solid var(--signal);opacity:0;
    animation:nodePulse 3.4s ease-out infinite;
  }
  .name-item h3{font-size:27px;font-weight:800;color:var(--white);margin-bottom:5px;}
  .name-item h3.core{color:var(--signal);}
  .name-item .translit{font-size:11px;color:var(--mist-dim);font-weight:600;letter-spacing:.5px;margin-bottom:14px;display:block;}
  .name-item p{font-size:13.5px;line-height:1.85;color:var(--mist);max-width:220px;margin:0 auto;}
  .name-note{
    margin-top:46px;text-align:center;font-size:12.5px;color:var(--mist-dim);
  }

  /* ============================================================
     SERVICES SECTION
  ============================================================ */
  .services-section{background:var(--white);padding:110px 0;}
  .services-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  }
  .service-card{
    background:var(--paper);
    border:1px solid rgba(10,35,66,0.07);
    border-radius:16px;
    padding:30px 26px;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .service-card:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 40px rgba(10,35,66,0.10);
    border-color:rgba(91,138,199,0.35);
  }
  .service-card .sc-icon{
    width:50px;height:50px;border-radius:12px;
    background:rgba(91,138,199,0.10);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:20px;
  }
  .service-card .sc-icon svg{width:24px;height:24px;color:var(--signal);}
  .service-card h3{font-size:17.5px;font-weight:700;color:var(--navy-deep);margin-bottom:10px;}
  .service-card p{font-size:14px;line-height:1.85;color:var(--slate);margin-bottom:18px;}
  .service-card .sc-link{
    display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;
    color:var(--navy-deep);text-decoration:none;
  }
  .service-card .sc-link svg{width:14px;height:14px;transform:scaleX(-1);transition:transform .2s;}
  .service-card:hover .sc-link{color:var(--signal);}
  .service-card:hover .sc-link svg{transform:scaleX(-1) translateX(-3px);}

  /* ============================================================
     PROCESS SECTION
  ============================================================ */
  .process-section{background:var(--paper-2);padding:110px 0;}
  .process-strip{
    display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
    position:relative;
  }
  .process-item{position:relative;padding-top:8px;}
  .process-item .p-num{
    display:inline-flex;align-items:center;justify-content:center;
    width:40px;height:40px;border-radius:11px;
    background:var(--navy-deep);color:var(--white);
    font-size:15px;font-weight:800;margin-bottom:20px;
  }
  .process-item h3{font-size:16px;font-weight:700;color:var(--navy-deep);margin-bottom:9px;}
  .process-item p{font-size:13.5px;line-height:1.85;color:var(--slate);}
  .process-item:not(:last-child)::after{
    content:'';position:absolute;top:28px;right:calc(-24px - 1px);
    width:24px;height:2px;background:repeating-linear-gradient(90deg, var(--mist) 0 6px, transparent 6px 11px);
  }

  /* ============================================================
     CLIENTS SECTION
  ============================================================ */
  .clients-section{background:var(--white);padding:100px 0 110px;}
  .clients-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  }
  .client-tile{
    display:flex;align-items:center;justify-content:center;
    height:96px;border:1px solid rgba(10,35,66,0.08);border-radius:13px;
    background:var(--paper);
    color:var(--mist-dim);font-weight:700;font-size:15px;letter-spacing:.3px;
    filter:grayscale(1);opacity:.75;
    transition:opacity .2s, filter .2s, border-color .2s;
  }
  .client-tile:hover{filter:grayscale(0);opacity:1;border-color:rgba(91,138,199,0.4);color:var(--navy-deep);}
  .clients-note{margin-top:26px;text-align:center;font-size:12.5px;color:var(--mist-dim);}

  /* ============================================================
     CTA BANNER
  ============================================================ */
  .cta-banner{
    background:linear-gradient(135deg, var(--navy-deep), var(--navy-darker));
    padding:80px 0;
    position:relative;
    overflow:hidden;
  }
  .cta-banner-inner{
    position:relative;z-index:2;
    display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  }
  .cta-banner h2{font-size:clamp(22px,2.6vw,32px);font-weight:800;color:var(--white);margin-bottom:10px;}
  .cta-banner p{font-size:15px;color:var(--mist);max-width:480px;}
  .cta-banner .glow{
    position:absolute;top:-40%;left:-10%;width:420px;height:420px;border-radius:50%;
    background:radial-gradient(circle, rgba(91,138,199,0.28), transparent 70%);
    pointer-events:none;
  }

  /* ============================================================
     FOOTER
  ============================================================ */
  footer.site-footer{background:var(--navy-darkest);padding:76px 0 0;}
  .footer-grid{
    display:grid;grid-template-columns:1.3fr 0.8fr 0.8fr 1fr;gap:40px;
    padding-bottom:56px;border-bottom:1px solid rgba(191,204,210,0.10);
  }
  .footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
  .footer-brand img{height:40px;}
  .footer-brand strong{font-size:15px;color:var(--white);font-weight:700;}
  .footer-col p{font-size:13.5px;line-height:1.9;color:var(--mist-dim);max-width:280px;}
  .footer-col h4{font-size:13.5px;color:var(--white);font-weight:700;margin-bottom:18px;}
  .footer-col ul{list-style:none;display:flex;flex-direction:column;gap:11px;}
  .footer-col ul a{color:var(--mist-dim);text-decoration:none;font-size:13.5px;transition:color .2s;}
  .footer-col ul a:hover{color:var(--signal);}
  .footer-social{display:flex;gap:10px;margin-top:20px;}
  .footer-social a{
    width:34px;height:34px;border-radius:9px;border:1px solid rgba(191,204,210,0.18);
    display:flex;align-items:center;justify-content:center;color:var(--mist);text-decoration:none;
    transition:border-color .2s, color .2s;
  }
  .footer-social a:hover{border-color:var(--signal);color:var(--signal);}
  .footer-social svg{width:15px;height:15px;}
  .footer-bottom{
    max-width:1320px;margin:0 auto;padding:22px 6vw 26px;
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;
  }
  .footer-bottom p{font-size:12.5px;color:var(--mist-dim);}
  .footer-bottom-links{display:flex;gap:20px;}
  .footer-bottom-links a{font-size:12.5px;color:var(--mist-dim);text-decoration:none;}
  .footer-bottom-links a:hover{color:var(--mist);}

  /* ============================================================
     RESPONSIVE — HOMEPAGE SECTIONS
  ============================================================ */
  @media (max-width:980px){
    .about-grid{grid-template-columns:1fr;}
    .about-panel{order:-1;max-width:420px;margin:0 auto;}
    .services-grid{grid-template-columns:1fr 1fr;}
    .process-strip{grid-template-columns:1fr 1fr;row-gap:34px;}
    .process-item:nth-child(2)::after{display:none;}
    .clients-grid{grid-template-columns:1fr 1fr;}
    .name-strip{grid-template-columns:1fr 1fr;row-gap:40px;}
    .name-item:nth-child(2)::after{display:none;}
    .name-item:not(:last-child)::after{display:none;}
    .footer-grid{grid-template-columns:1fr 1fr;gap:32px 24px;}
    .cta-banner-inner{flex-direction:column;text-align:center;}
  }
  @media (max-width:640px){
    .services-grid{grid-template-columns:1fr;}
    .process-strip{grid-template-columns:1fr;}
    .clients-grid{grid-template-columns:1fr 1fr;}
    .name-strip{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr;}
    .about-stats{gap:26px;}
  }

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

  html,body{
    background:var(--navy-darkest);
    font-family:'Vazirmatn', sans-serif;
    direction:rtl;
  }

  .site-header{
    position:relative;
    overflow:hidden;
    background:
      radial-gradient(ellipse 900px 600px at 15% 15%, rgba(91,138,199,0.16), transparent 60%),
      linear-gradient(160deg, var(--navy-darkest) 0%, var(--navy-darker) 45%, var(--navy-deep) 100%);
    min-height:100vh;
    display:flex;
    flex-direction:column;
  }

  /* ---------- top utility bar ---------- */
  .utility-bar{
    border-bottom:1px solid rgba(191,204,210,0.10);
    padding:0 6vw;
  }
  .utility-bar-inner{
    max-width:1320px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    height:38px;
    font-size:12.5px;
    color:var(--mist-dim);
    letter-spacing:.2px;
  }
  .utility-bar-inner span{display:flex;align-items:center;gap:6px;}
  .status-dot{
    width:6px;height:6px;border-radius:50%;
    background:#5CD17E;
    box-shadow:0 0 0 0 rgba(92,209,126,.6);
    animation:statusPulse 2.4s ease-out infinite;
  }
  @keyframes statusPulse{
    0%{box-shadow:0 0 0 0 rgba(92,209,126,.55);}
    70%{box-shadow:0 0 0 7px rgba(92,209,126,0);}
    100%{box-shadow:0 0 0 0 rgba(92,209,126,0);}
  }
  .utility-links{display:flex;gap:22px;}
  .utility-links a{color:var(--mist-dim);text-decoration:none;transition:color .2s;}
  .utility-links a:hover{color:var(--mist);}

  /* ---------- navbar ---------- */
  nav.navbar{
    padding:0 6vw;
    position:relative;
    z-index:5;
  }
  .navbar-inner{
    max-width:1320px;
    margin:0 auto;
    height:88px;
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:14px;
  }
  .brand img{
    height:52px;
    width:auto;
    display:block;
  }
  .brand-text{
    display:flex;
    flex-direction:column;
    line-height:1.35;
  }
  .brand-text strong{
    font-size:16.5px;
    font-weight:700;
    color:var(--white);
    letter-spacing:.2px;
  }
  .brand-text span{
    font-size:11.5px;
    font-weight:500;
    color:var(--mist-dim);
    letter-spacing:.4px;
  }

  .nav-links{
    display:flex;
    align-items:center;
    gap:38px;
  }
  .nav-links a{
    color:var(--mist);
    text-decoration:none;
    font-size:14.5px;
    font-weight:500;
    position:relative;
    padding:6px 0;
    transition:color .2s;
  }
  .nav-links a::after{
    content:'';
    position:absolute;
    right:0;left:0;bottom:0;
    height:2px;
    background:var(--signal);
    transform:scaleX(0);
    transform-origin:center;
    transition:transform .25s ease;
  }
  .nav-links a:hover{color:var(--white);}
  .nav-links a:hover::after{transform:scaleX(1);}

  .nav-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--off-white);
    color:var(--navy-deep);
    font-weight:700;
    font-size:14px;
    padding:11px 22px;
    border-radius:8px;
    text-decoration:none;
    transition:transform .2s, box-shadow .2s;
  }
  .nav-cta:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 24px rgba(0,0,0,.28);
  }

  .navbar-mobile-toggle{display:none;}

  /* ---------- hero ---------- */
  .hero{
    position:relative;
    flex:1;
    display:flex;
    align-items:center;
    padding:4vw 6vw 5vw;
  }
  .hero-inner{
    max-width:1320px;
    width:100%;
    margin:0 auto;
    display:grid;
    grid-template-columns:1.05fr 0.95fr;
    gap:40px;
    align-items:center;
    position:relative;
    z-index:3;
  }

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:var(--signal);
    font-size:13.5px;
    font-weight:600;
    letter-spacing:.3px;
    margin-bottom:22px;
  }
  .eyebrow::before{
    content:'';
    width:26px;height:1px;
    background:var(--signal);
  }

  h1.headline{
    color:var(--white);
    font-weight:800;
    font-size:clamp(30px, 3.6vw, 50px);
    line-height:1.32;
    letter-spacing:.2px;
    margin-bottom:22px;
  }
  h1.headline em{
    font-style:normal;
    color:var(--signal);
    background:linear-gradient(90deg, var(--signal), var(--mist));
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
  }

  p.sub{
    color:var(--mist);
    font-size:16.5px;
    font-weight:400;
    line-height:1.9;
    max-width:560px;
    margin-bottom:34px;
  }

  .service-badges{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:38px;
  }
  .badge{
    display:flex;
    align-items:center;
    gap:9px;
    background:rgba(191,204,210,0.06);
    border:1px solid rgba(191,204,210,0.18);
    padding:10px 16px;
    border-radius:9px;
    color:var(--off-white);
    font-size:14px;
    font-weight:600;
    backdrop-filter:blur(4px);
  }
  .badge svg{width:18px;height:18px;flex-shrink:0;color:var(--signal);}

  .cta-row{
    display:flex;
    align-items:center;
    gap:18px;
    flex-wrap:wrap;
  }
  .btn-primary{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:linear-gradient(135deg, var(--signal), #4576AE);
    color:var(--white);
    font-weight:700;
    font-size:15px;
    padding:15px 30px;
    border-radius:9px;
    text-decoration:none;
    box-shadow:0 14px 30px rgba(91,138,199,0.28);
    transition:transform .2s, box-shadow .2s;
  }
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(91,138,199,0.4);}
  .btn-secondary{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--white);
    font-weight:600;
    font-size:15px;
    text-decoration:none;
    padding:15px 6px;
    border-bottom:1px solid rgba(255,255,255,0.25);
    transition:border-color .2s, color .2s;
  }
  .btn-secondary:hover{border-color:var(--signal);color:var(--signal);}
  .btn-secondary svg{width:16px;height:16px;transform:scaleX(-1);}

  /* ---------- visual / network signature ---------- */
  .hero-visual{
    position:relative;
    height:500px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .hero-visual svg{
    width:100%;
    height:100%;
    overflow:visible;
  }
  .node{
    fill:var(--mist);
  }
  .node.lit{
    fill:var(--signal);
  }
  .node-pulse{
    fill:none;
    stroke:var(--signal);
    stroke-width:1.4;
    opacity:0;
    transform-origin:center;
    animation:nodePulse 3.2s ease-out infinite;
  }
  @keyframes nodePulse{
    0%{opacity:.65; transform:scale(0.4);}
    75%{opacity:0; transform:scale(2.6);}
    100%{opacity:0; transform:scale(2.6);}
  }
  .edge{
    stroke:var(--slate);
    stroke-width:1.4;
    fill:none;
    opacity:.85;
  }
  .edge.bright{
    stroke:var(--signal);
    opacity:.55;
  }
  .logo-mark{
    filter:drop-shadow(0 18px 40px rgba(0,0,0,0.45));
  }

  .glyph-stroke{fill:none;stroke:var(--mist);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .glyph-stroke.accent{stroke:var(--signal);}
  .glyph-fill{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.6;}

  .stat-float{
    position:absolute;
    display:flex;
    align-items:center;
    gap:10px;
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(191,204,210,0.18);
    padding:10px 14px;
    border-radius:11px;
    backdrop-filter:blur(6px);
    box-shadow:0 12px 30px rgba(0,0,0,0.25);
  }
  .stat-float .stat-num{font-size:15px;font-weight:800;color:var(--white);}
  .stat-float .stat-label{font-size:10.5px;color:var(--mist-dim);font-weight:500;}
  .stat-float.top-right{top:6%;left:0%;}
  .stat-float.bottom-left{bottom:8%;right:2%;}
  .stat-float .stat-dot{
    width:7px;height:7px;border-radius:50%;background:#5CD17E;flex-shrink:0;
    box-shadow:0 0 0 0 rgba(92,209,126,.6);
    animation:statusPulse 2.4s ease-out infinite;
  }

  .grid-overlay{
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(rgba(191,204,210,0.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(191,204,210,0.045) 1px, transparent 1px);
    background-size:46px 46px;
    mask-image:radial-gradient(ellipse 70% 60% at 30% 40%, black, transparent 75%);
    pointer-events:none;
  }

  .bottom-fade{
    position:absolute;
    left:0;right:0;bottom:0;
    height:120px;
    background:linear-gradient(to top, rgba(4,13,26,0.5), transparent);
    pointer-events:none;
  }

  /* ---------- responsive ---------- */
  @media (max-width:980px){
    .hero-inner{grid-template-columns:1fr;}
    .hero-visual{height:340px; order:-1;}
    .nav-links{display:none;}
    .utility-links a:nth-child(n+3){display:none;}
  }
  @media (max-width:700px){
    .stat-float{display:none;}
  }
  @media (max-width:560px){
    .utility-bar{display:none;}
    .navbar-inner{height:76px;}
    .brand img{height:42px;}
    .brand-text strong{font-size:14.5px;}
    .brand-text span{display:none;}
    .nav-cta{padding:9px 16px;font-size:13px;}
    .hero{padding:6vw 6vw 10vw;}
    p.sub{font-size:15px;}
    .service-badges .badge{font-size:12.5px;padding:8px 12px;}
  }

  a:focus-visible, button:focus-visible{
    outline:2px solid var(--signal);
    outline-offset:3px;
  }

  @media (prefers-reduced-motion: reduce){
    .status-dot, .node-pulse{animation:none;}
  }
  
  a:focus-visible, button:focus-visible{
    outline:2px solid var(--signal);
    outline-offset:3px;
  }

  @media (prefers-reduced-motion: reduce){
    .status-dot, .node-pulse{animation:none;}
  }

  /* ============================================================
     BREADCRUMB (shared)
  ============================================================ */
  .breadcrumb{
    display:flex;align-items:center;gap:8px;
    font-size:13px;color:var(--mist-dim);margin-bottom:22px;
  }
  .breadcrumb a{color:var(--mist-dim);text-decoration:none;}
  .breadcrumb a:hover{color:var(--mist);}
  .breadcrumb span.current{color:var(--signal);font-weight:600;}

  /* ============================================================
     SERVICE HERO
  ============================================================ */
  .svc-hero{
    position:relative;overflow:hidden;
    background:
      radial-gradient(ellipse 900px 600px at 12% 10%, rgba(91,138,199,0.16), transparent 60%),
      linear-gradient(160deg, var(--navy-darkest) 0%, var(--navy-darker) 45%, var(--navy-deep) 100%);
    padding:60px 0 100px;
  }
  .svc-hero-grid{
    display:grid;grid-template-columns:1.05fr 0.95fr;gap:40px;align-items:center;
  }
  .svc-hero h1{
    font-size:clamp(28px,3.4vw,44px);font-weight:800;color:var(--white);line-height:1.35;margin-bottom:18px;
  }
  .svc-hero h1 em{font-style:normal;color:var(--signal);}
  .svc-hero > .svc-hero-grid > div:first-child p.lead{
    font-size:15.5px;color:var(--mist);line-height:1.9;max-width:520px;margin-bottom:30px;
  }
  .svc-highlights{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:34px;}
  .svc-highlights .hl{
    display:flex;align-items:center;gap:8px;
    background:rgba(191,204,210,0.06);border:1px solid rgba(191,204,210,0.16);
    padding:9px 15px;border-radius:9px;font-size:13px;color:var(--off-white);font-weight:600;
  }
  .svc-highlights .hl svg{width:15px;height:15px;color:var(--signal);}

  /* animated data-center scene */
  .svc-scene-wrap{position:relative;height:420px;display:flex;align-items:center;justify-content:center;}
  .svc-scene-wrap svg{width:100%;height:100%;overflow:visible;}
  .rack-body{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.4;}
  .rack-slot{fill:rgba(191,204,210,0.06);stroke:rgba(191,204,210,0.18);stroke-width:1;}
  .led{fill:#5CD17E;}
  .led.blink{animation:ledBlink 2.4s ease-in-out infinite;}
  .led.blink.d1{animation-delay:.3s;}
  .led.blink.d2{animation-delay:.9s;}
  .led.blink.d3{animation-delay:1.5s;}
  .led.signal{fill:var(--signal);}
  @keyframes ledBlink{0%,100%{opacity:1;}50%{opacity:.25;}}

  .fan-group{transform-origin:center;animation:fanSpin 4s linear infinite;}
  @keyframes fanSpin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}

  .airflow{
    fill:none;stroke:var(--signal);stroke-width:1.6;stroke-linecap:round;
    stroke-dasharray:5 6;opacity:.55;
    animation:dashFlow 1.8s linear infinite;
  }
  @keyframes dashFlow{to{stroke-dashoffset:-22;}}

  .gauge-needle{
    transform-origin:60px 60px;
    animation:needleSweep 4.5s ease-in-out infinite;
  }
  @keyframes needleSweep{
    0%,100%{transform:rotate(-28deg);}
    50%{transform:rotate(18deg);}
  }

  .floating-badge{
    position:absolute;display:flex;align-items:center;gap:10px;
    background:rgba(255,255,255,0.05);border:1px solid rgba(191,204,210,0.18);
    padding:10px 14px;border-radius:11px;backdrop-filter:blur(6px);
    box-shadow:0 12px 30px rgba(0,0,0,0.25);
  }
  .floating-badge .fb-num{font-size:15px;font-weight:800;color:var(--white);}
  .floating-badge .fb-label{font-size:10.5px;color:var(--mist-dim);font-weight:500;}
  .floating-badge.pos-1{top:4%;left:0;}
  .floating-badge.pos-2{bottom:6%;right:0;}

  /* ============================================================
     OVERVIEW
  ============================================================ */
  .overview-section{background:var(--paper);padding:100px 0;}
  .overview-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:60px;align-items:start;}
  .overview-grid p{font-size:15.5px;line-height:2;color:var(--slate);margin-bottom:16px;}
  .mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  .mini-stat{
    background:var(--white);border:1px solid rgba(10,35,66,0.08);border-radius:14px;
    padding:22px 20px;box-shadow:0 10px 26px rgba(10,35,66,0.05);
  }
  .mini-stat .ms-num{font-size:24px;font-weight:800;color:var(--navy-deep);}
  .mini-stat .ms-num em{font-style:normal;color:var(--signal);}
  .mini-stat .ms-label{font-size:12.5px;color:var(--mist-dim);margin-top:6px;font-weight:600;}

  /* ============================================================
     FEATURES GRID
  ============================================================ */
  .features-section{background:var(--white);padding:100px 0;}
  .features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
  .feature-card{
    background:var(--paper);border:1px solid rgba(10,35,66,0.07);border-radius:15px;
    padding:26px 22px;transition:transform .25s, box-shadow .25s, border-color .25s;
  }
  .feature-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 36px rgba(10,35,66,0.10);
    border-color:rgba(91,138,199,0.35);
  }
  .feature-card .fc-icon{
    width:46px;height:46px;border-radius:12px;background:rgba(91,138,199,0.10);
    display:flex;align-items:center;justify-content:center;margin-bottom:18px;
    transition:transform .4s ease;
  }
  .feature-card:hover .fc-icon{transform:rotate(-8deg) scale(1.06);}
  .feature-card .fc-icon svg{width:22px;height:22px;color:var(--signal);}
  .feature-card h3{font-size:15px;font-weight:700;color:var(--navy-deep);margin-bottom:8px;line-height:1.5;}
  .feature-card p{font-size:12.5px;line-height:1.8;color:var(--slate);}

  /* ============================================================
     PROCESS TIMELINE
  ============================================================ */
  .process-section-v2{background:var(--paper-2);padding:100px 0;}
  .timeline{position:relative;}
  .timeline-track{
    position:absolute;top:24px;right:0;left:0;height:2px;
    background:repeating-linear-gradient(90deg, var(--mist) 0 8px, transparent 8px 14px);
  }
  .timeline-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative;}
  .tl-item{text-align:center;}
  .tl-num{
    width:48px;height:48px;border-radius:50%;background:var(--navy-deep);color:var(--white);
    display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;
    margin:0 auto 18px;position:relative;z-index:2;border:4px solid var(--paper-2);
  }
  .tl-item h3{font-size:13.5px;font-weight:700;color:var(--navy-deep);margin-bottom:8px;line-height:1.5;}
  .tl-item p{font-size:12px;line-height:1.75;color:var(--slate);}

  /* ============================================================
     STANDARDS STRIP
  ============================================================ */
  .standards-section{background:var(--white);padding:70px 0;}
  .standards-row{
    display:flex;flex-wrap:wrap;justify-content:center;gap:14px;
  }
  .standard-chip{
    display:flex;align-items:center;gap:9px;
    background:var(--paper);border:1px solid rgba(10,35,66,0.08);
    padding:12px 20px;border-radius:100px;font-size:13px;font-weight:700;color:var(--navy-deep);
  }
  .standard-chip svg{width:16px;height:16px;color:var(--signal);}

  /* ============================================================
     LIVE MONITORING MOCKUP
  ============================================================ */
  .monitor-section{
    background:linear-gradient(155deg, var(--navy-deep), var(--navy-darker));
    padding:100px 0;position:relative;overflow:hidden;
  }
  .monitor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative;z-index:2;}
  .monitor-card{
    background:rgba(255,255,255,0.05);border:1px solid rgba(191,204,210,0.16);
    border-radius:16px;padding:24px 20px;backdrop-filter:blur(6px);
  }
  .monitor-card .mc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
  .monitor-card .mc-icon{width:34px;height:34px;border-radius:9px;background:rgba(91,138,199,0.18);display:flex;align-items:center;justify-content:center;}
  .monitor-card .mc-icon svg{width:17px;height:17px;color:var(--signal);}
  .monitor-card .mc-num{font-size:26px;font-weight:800;color:var(--white);}
  .monitor-card .mc-label{font-size:12px;color:var(--mist-dim);margin-top:6px;}
  .monitor-card .mc-bar{height:5px;border-radius:3px;background:rgba(191,204,210,0.14);margin-top:14px;overflow:hidden;}
  .monitor-card .mc-bar-fill{height:100%;border-radius:3px;background:var(--signal);}

  /* ============================================================
     FAQ ACCORDION
  ============================================================ */
  .faq-section{background:var(--paper);padding:100px 0;}
  .faq-list{max-width:820px;margin:0 auto;}
  .faq-item{
    background:var(--white);border:1px solid rgba(10,35,66,0.08);border-radius:14px;
    margin-bottom:12px;overflow:hidden;
  }
  .faq-q{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    padding:20px 24px;cursor:pointer;user-select:none;
  }
  .faq-q h3{font-size:14.5px;font-weight:700;color:var(--navy-deep);}
  .faq-q .faq-toggle{
    flex-shrink:0;width:28px;height:28px;border-radius:8px;background:rgba(91,138,199,0.10);
    display:flex;align-items:center;justify-content:center;transition:transform .3s ease, background .3s ease;
  }
  .faq-q .faq-toggle svg{width:14px;height:14px;color:var(--signal);transition:transform .3s ease;}
  .faq-item.open .faq-toggle{background:var(--signal);}
  .faq-item.open .faq-toggle svg{color:var(--white);transform:rotate(45deg);}
  .faq-a{
    display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease;
  }
  .faq-item.open .faq-a{grid-template-rows:1fr;}
  .faq-a-inner{overflow:hidden;}
  .faq-a-inner p{padding:0 24px 22px;font-size:13.5px;line-height:1.9;color:var(--slate);}

  /* ============================================================
     RESPONSIVE
  ============================================================ */
  @media (max-width:980px){
    .svc-hero-grid{grid-template-columns:1fr;}
    .svc-scene-wrap{height:300px;order:-1;}
    .overview-grid{grid-template-columns:1fr;}
    .features-grid{grid-template-columns:1fr 1fr;}
    .timeline-grid{grid-template-columns:repeat(3,1fr);row-gap:36px;}
    .timeline-track{display:none;}
    .monitor-grid{grid-template-columns:1fr 1fr;}
  }
  @media (max-width:640px){
    .features-grid{grid-template-columns:1fr;}
    .timeline-grid{grid-template-columns:1fr 1fr;}
    .monitor-grid{grid-template-columns:1fr;}
    .mini-stats{grid-template-columns:1fr;}
    .floating-badge{display:none;}
  }

  @media (prefers-reduced-motion: reduce){
    .fan-group, .airflow, .gauge-needle, .led.blink{animation:none;}
  }
  
  /* ============================================================
     ACTIVE-NETWORK HERO SCENE
  ============================================================ */
  .switch-body{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.4;}
  .switch-port{fill:rgba(191,204,210,0.10);stroke:rgba(191,204,210,0.25);stroke-width:1;}
  .device-body{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.4;}
  .device-icon{fill:none;stroke:var(--signal);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
  .net-link{fill:none;stroke:rgba(191,204,210,0.28);stroke-width:1.6;}
  .net-link.active{stroke:rgba(91,138,199,0.45);}
  .packet{fill:var(--signal);}
  .packet.alt{fill:#5CD17E;}

  .bw-chart{display:flex;align-items:flex-end;gap:5px;height:38px;}
  .bw-bar{
    width:6px;border-radius:3px 3px 0 0;
    background:var(--signal);
    animation:bwGrow 2.6s ease-in-out infinite;
    transform-origin:bottom;
  }
  @keyframes bwGrow{
    0%,100%{transform:scaleY(.35);}
    50%{transform:scaleY(1);}
  }

  @media (prefers-reduced-motion: reduce){
    .bw-bar{animation:none;}
    .packet{display:none;}
  }
  /* ============================================================
     TOWER HERO SCENE
  ============================================================ */
  .tower-truss{fill:none;stroke:var(--mist);stroke-width:1.6;stroke-linecap:round;}
  .tower-leg{fill:none;stroke:var(--mist);stroke-width:2;stroke-linecap:round;}
  .tower-base{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.4;}
  .antenna-panel{fill:var(--navy-darker);stroke:var(--signal);stroke-width:1.4;}
  .guy-wire{stroke:rgba(191,204,210,0.35);stroke-width:1;stroke-dasharray:3 4;}

  .beacon{fill:#ff5c5c;}
  .beacon.blink{animation:beaconBlink 1.8s ease-in-out infinite;}
  @keyframes beaconBlink{0%,100%{opacity:1;filter:drop-shadow(0 0 4px #ff5c5c);}50%{opacity:.25;filter:none;}}

  .signal-ring{
    fill:none;stroke:var(--signal);stroke-width:1.6;
    transform-origin:center;opacity:0;
    animation:ringPing 3s ease-out infinite;
  }
  .signal-ring.r2{animation-delay:1s;}
  .signal-ring.r3{animation-delay:2s;}
  @keyframes ringPing{
    0%{opacity:.7;transform:scale(0.3);}
    80%{opacity:0;transform:scale(1.9);}
    100%{opacity:0;transform:scale(1.9);}
  }

  .remote-tower{fill:none;stroke:var(--mist);stroke-width:1.6;stroke-linecap:round;}

  @media (prefers-reduced-motion: reduce){
    .beacon.blink, .signal-ring{animation:none;}
  }
  /* ============================================================
     CCTV HERO SCENE
  ============================================================ */
  .cam-body{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.4;}
  .cam-lens{fill:var(--navy-darkest);stroke:var(--signal);stroke-width:1.6;}
  .cam-lens-glint{fill:rgba(255,255,255,0.5);}
  .cam-mount{fill:none;stroke:var(--mist);stroke-width:1.6;stroke-linecap:round;}

  .rec-dot{fill:#ff5c5c;}
  .rec-dot.blink{animation:beaconBlink 1.4s ease-in-out infinite;}

  .monitor-grid-cell{fill:rgba(191,204,210,0.08);stroke:rgba(191,204,210,0.22);stroke-width:1;}
  .monitor-grid-cell.active{fill:rgba(91,138,199,0.14);stroke:var(--signal);}
  .scan-line{
    fill:rgba(91,138,199,0.10);
    animation:scanMove 3.4s linear infinite;
  }
  @keyframes scanMove{
    0%{transform:translateY(0);}
    100%{transform:translateY(76px);}
  }

  @media (prefers-reduced-motion: reduce){
    .rec-dot.blink, .scan-line{animation:none;}
  }
  /* ============================================================
     RACK HERO SCENE — distinct concept: messy-to-organized cable morph
  ============================================================ */
  .rack-frame{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.6;}
  .rack-u{fill:rgba(191,204,210,0.06);stroke:rgba(191,204,210,0.2);stroke-width:1;}
  .rack-u.hl{
    animation:uHighlight 6s ease-in-out infinite;
  }
  @keyframes uHighlight{
    0%,84%,100%{fill:rgba(191,204,210,0.06);stroke:rgba(191,204,210,0.2);}
    88%,96%{fill:rgba(91,138,199,0.18);stroke:var(--signal);}
  }
  .patch-port{fill:var(--navy-darkest);stroke:rgba(191,204,210,0.3);stroke-width:1;}

  .cable-strand{
    fill:none;stroke-width:3;stroke-linecap:round;
  }
  .cable-strand.c1{stroke:var(--signal);}
  .cable-strand.c2{stroke:#5CD17E;}
  .cable-strand.c3{stroke:var(--mist);}
  .cable-strand.c4{stroke:#E0A458;}

  .tag-chip{
    opacity:0;
    animation:tagFade 6s ease-in-out infinite;
  }
  .tag-chip.t2{animation-delay:1.5s;}
  .tag-chip.t3{animation-delay:3s;}
  @keyframes tagFade{
    0%,10%{opacity:0;transform:translateY(4px);}
    18%,30%{opacity:1;transform:translateY(0);}
    40%,100%{opacity:0;transform:translateY(4px);}
  }

  @media (prefers-reduced-motion: reduce){
    .rack-u.hl, .tag-chip{animation:none;}
    .cable-strand animate{display:none;}
  }
   /* ---------- story split ---------- */
  .story{padding:90px 0;background:var(--white);}
  .story-grid{display:grid;grid-template-columns:0.95fr 1.05fr;gap:60px;align-items:center;}
  .story-visual{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3.4;background:linear-gradient(155deg, var(--navy-deep), var(--navy-darkest));display:flex;align-items:center;justify-content:center;}
  .story-visual .grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(191,204,210,0.06) 1px, transparent 1px),linear-gradient(90deg, rgba(191,204,210,0.06) 1px, transparent 1px);background-size:34px 34px;}
  .story-badge{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;}
  .story-badge .ring{width:130px;height:130px;border-radius:50%;background:rgba(91,138,199,.14);display:flex;align-items:center;justify-content:center;animation:corePulse 3.4s ease-in-out infinite;}
  @keyframes corePulse{0%,100%{box-shadow:0 0 0 8px rgba(91,138,199,0.06);}50%{box-shadow:0 0 0 16px rgba(91,138,199,0.02);}}
  .story-badge .ring svg{width:52px;height:52px;color:var(--signal);}
  .story-badge span{color:var(--mist);font-size:12.5px;}
  .orbit-item{position:absolute;width:44px;height:44px;border-radius:11px;background:var(--white);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,0,0,.25);animation:floatY 4s ease-in-out infinite;}
  .orbit-item svg{width:19px;height:19px;color:var(--navy-deep);}
  .orbit-item.o1{top:10%;right:12%;animation-delay:.3s;}
  .orbit-item.o2{bottom:12%;left:10%;animation-delay:1.4s;}
  .orbit-item.o3{top:14%;left:8%;animation-delay:2.1s;}
  @keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}

  .story-text .eyebrowabout{display:inline-block;font-size:12.5px;font-weight:700;color:var(--signal);margin-bottom:12px;}
  .story-text h2{font-size:clamp(22px,2.6vw,30px);font-weight:800;color:var(--navy-deep);margin-bottom:22px;line-height:1.65;}
  .story-text p{font-size:14.5px;line-height:2.05;color:var(--slate);margin-bottom:18px;}
  @media (max-width:900px){.story-grid{grid-template-columns:1fr;}}

  /* ---------- stats ---------- */
  .stats-band{padding:60px 0;background:var(--paper);}
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
  .stat-box .n{font-size:32px;font-weight:800;color:var(--navy-deep);display:block;margin-bottom:6px;}
  .stat-box .l{font-size:13px;color:var(--slate);}
  @media (max-width:700px){.stats-grid{grid-template-columns:repeat(2,1fr);row-gap:32px;}}

  /* ---------- values ---------- */
  .values{padding:90px 0;background:var(--white);}
  .section-headabout{text-align:center;max-width:640px;margin:0 auto 52px;}
  .eyebrowabout{display:inline-block;font-size:12.5px;font-weight:700;color:var(--signal);margin-bottom:12px;}
  .section-headabout h2{font-size:clamp(22px,2.6vw,32px);font-weight:800;color:var(--navy-deep);margin-bottom:14px;line-height:1.6;}
  .section-headabout p{font-size:14.5px;line-height:1.9;color:var(--slate);}
  .values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
  .value-card{background:var(--paper);border-radius:16px;padding:30px 24px;border:1px solid rgba(10,35,66,0.06);transition:transform .3s, box-shadow .3s;}
  .value-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(10,35,66,.1);}
  .value-icon{width:50px;height:50px;border-radius:13px;background:linear-gradient(135deg,var(--navy-deep),var(--navy-darker));display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
  .value-icon svg{width:22px;height:22px;color:var(--signal);}
  .value-card h3{color:var(--navy-deep);font-size:15.5px;font-weight:700;margin-bottom:9px;}
  .value-card p{font-size:13px;line-height:1.85;color:var(--slate);}
  @media (max-width:980px){.values-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.values-grid{grid-template-columns:1fr;}}

  /* ---------- timelineabout ---------- */
  .timelineabout-section{padding:90px 0;background:var(--paper);}
  .timelineabout{max-width:760px;margin:0 auto;position:relative;padding-right:34px;}
  .timelineabout::before{content:'';position:absolute;right:8px;top:6px;bottom:6px;width:2px;background:rgba(91,138,199,0.25);}
  .tl-item{position:relative;padding-bottom:44px;}
  .tl-item:last-child{padding-bottom:0;}
  .tl-dot{position:absolute;right:-34px;top:2px;width:18px;height:18px;border-radius:50%;background:var(--signal);border:4px solid var(--paper);box-shadow:0 0 0 2px var(--signal);}
  .tl-item h4{font-size:15px;font-weight:700;color:var(--navy-deep);margin-bottom:6px;}
  .tl-item p{font-size:13.5px;color:var(--slate);line-height:1.85;}
  .tl-year{display:inline-block;font-size:12px;font-weight:700;color:var(--signal);margin-bottom:6px;}

  /* ---------- team ---------- */
  .team{padding:90px 0;background:var(--white);}
  .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
  .team-card{text-align:center;}
  .team-avatar{width:96px;height:96px;border-radius:50%;margin:0 auto 16px;background:linear-gradient(135deg,var(--navy-deep),var(--navy-darker));display:flex;align-items:center;justify-content:center;transition:transform .3s;}
  .team-card:hover .team-avatar{transform:scale(1.06);}
  .team-avatar svg{width:38px;height:38px;color:var(--signal);}
  .team-card h4{font-size:14.5px;font-weight:700;color:var(--navy-deep);margin-bottom:4px;}
  .team-card span{font-size:12px;color:var(--mist-dim);}
  @media (max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);row-gap:36px;}}

/* ============================================================
     SERVICES PAGE — BANNER
  ============================================================ */
  .page-header{
    position:relative;
    overflow:hidden;
    background:
      radial-gradient(ellipse 900px 500px at 85% 0%, rgba(91,138,199,0.16), transparent 60%),
      linear-gradient(160deg, var(--navy-darkest) 0%, var(--navy-darker) 45%, var(--navy-deep) 100%);
    padding:64px 0 80px;
  }

  .page-header-grid{
    display:grid;grid-template-columns:1.3fr 0.7fr;gap:40px;align-items:center;
  }
  .page-header h1{
    font-size:clamp(28px,3.2vw,42px);font-weight:800;color:var(--white);
    margin-bottom:16px;
  }
  .page-header p{font-size:15.5px;color:var(--mist);max-width:560px;line-height:1.9;}

  .logo-badge-wrap{display:flex;align-items:center;justify-content:center;position:relative;}
  .logo-ring{
    position:relative;
    width:172px;height:172px;
    border-radius:50%;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(191,204,210,0.18);
    display:flex;align-items:center;justify-content:center;
  }
  .logo-ring::before{
    content:'';position:absolute;inset:-16px;border-radius:50%;
    border:1px dashed rgba(91,138,199,0.35);
    animation:spin 40s linear infinite;
  }
  @keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
  .logo-ring img{width:96px;height:auto;position:relative;z-index:2;filter:drop-shadow(0 10px 24px rgba(0,0,0,0.4));}
  .logo-ring .ring-node{
    position:absolute;width:10px;height:10px;border-radius:50%;background:var(--signal);
  }
  .logo-ring .ring-node::after{
    content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--signal);
    opacity:0;animation:nodePulse 3s ease-out infinite;
  }
  .logo-ring .rn-1{top:-5px;left:50%;transform:translateX(-50%);}
  .logo-ring .rn-2{bottom:10%;right:-5px;animation-delay:1s;}
  .logo-ring .rn-2::after{animation-delay:1s;}
  .logo-ring .rn-3{bottom:10%;left:-5px;animation-delay:2s;}
  .logo-ring .rn-3::after{animation-delay:2s;}
   /* ============================================================
     CONTACT HERO SCENE — support hub with message ping
  ============================================================ */
  .hub-body{fill:var(--navy-darker);stroke:var(--mist);stroke-width:1.4;}
  .hub-icon{fill:none;stroke:var(--signal);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

 /* ============================================================
     CONTACT INFO + FORM
  ============================================================ */
  .contact-section{background:var(--paper);padding:100px 0 110px;}
  .contact-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:28px;align-items:start;}

  .info-stack{display:flex;flex-direction:column;gap:16px;}
  .info-card{
    background:var(--white);border:1px solid rgba(10,35,66,0.08);border-radius:16px;
    padding:24px;display:flex;gap:16px;align-items:flex-start;
    box-shadow:0 14px 34px rgba(10,35,66,0.06);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .info-card:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(10,35,66,0.10);}
  .info-card .ic-icon{
    flex-shrink:0;width:46px;height:46px;border-radius:12px;
    background:rgba(91,138,199,0.10);display:flex;align-items:center;justify-content:center;
  }
  .info-card .ic-icon svg{width:22px;height:22px;color:var(--signal);}
  .info-card h3{font-size:14.5px;font-weight:700;color:var(--navy-deep);margin-bottom:6px;}
  .info-card p, .info-card a{font-size:13.5px;color:var(--slate);line-height:1.85;text-decoration:none;display:block;}
  .info-card a:hover{color:var(--signal);}

  .info-card.hours-card ul{list-style:none;display:flex;flex-direction:column;gap:4px;margin-top:2px;}
  .info-card.hours-card li{display:flex;justify-content:space-between;font-size:13px;color:var(--slate);}
  .info-card.hours-card li b{color:var(--navy-deep);font-weight:600;}

  .social-inline{display:flex;gap:10px;margin-top:6px;}
  .social-inline a{
    width:36px;height:36px;border-radius:10px;border:1px solid rgba(10,35,66,0.1);
    display:flex;align-items:center;justify-content:center;color:var(--slate);text-decoration:none;
    transition:border-color .2s,color .2s,background .2s;
  }
  .social-inline a:hover{border-color:var(--signal);color:var(--signal);background:rgba(91,138,199,0.06);}
  .social-inline svg{width:16px;height:16px;}

  .form-card{
    background:var(--white);border:1px solid rgba(10,35,66,0.08);border-radius:20px;
    padding:40px;box-shadow:0 20px 50px rgba(10,35,66,0.08);
  }
  .form-card h2{font-size:21px;font-weight:800;color:var(--navy-deep);margin-bottom:8px;}
  .form-card > p{font-size:14px;color:var(--mist-dim);margin-bottom:28px;}
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px;}
  .form-field{display:flex;flex-direction:column;gap:8px;}
  .form-field.full{grid-column:1/-1;}
  .form-field label{font-size:13px;font-weight:600;color:var(--navy-deep);}
  .form-field input,
  .form-field select,
  .form-field textarea{
    font-family:'Vazirmatn',sans-serif;
    border:1.5px solid rgba(10,35,66,0.12);
    border-radius:10px;padding:12px 14px;font-size:14px;color:var(--navy-deep);
    background:var(--paper);transition:border-color .2s, box-shadow .2s;
  }
  .form-field textarea{resize:vertical;min-height:120px;}
  .form-field input:focus,
  .form-field select:focus,
  .form-field textarea:focus{
    outline:none;border-color:var(--signal);
    box-shadow:0 0 0 3px rgba(91,138,199,0.15);background:var(--white);
  }
  .form-submit{
    display:inline-flex;align-items:center;gap:10px;
    background:linear-gradient(135deg, var(--signal), #4576AE);
    color:var(--white);font-weight:700;font-size:15px;padding:15px 34px;border-radius:10px;
    border:none;cursor:pointer;box-shadow:0 14px 30px rgba(91,138,199,0.28);
    transition:transform .2s, box-shadow .2s;font-family:'Vazirmatn',sans-serif;
  }
  .form-submit:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(91,138,199,0.4);}
  .form-note{font-size:12px;color:var(--mist-dim);margin-top:14px;}

  .map-section{padding:0 0 110px;background:var(--paper);}
  .map-wrap{
    border-radius:20px;overflow:hidden;border:1px solid rgba(10,35,66,0.08);
    box-shadow:0 20px 50px rgba(10,35,66,0.08);position:relative;height:380px;
  }
  .map-wrap iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.15);}
  .map-badge{
    position:absolute;top:20px;right:20px;background:var(--white);border-radius:12px;padding:14px 18px;
    box-shadow:0 14px 30px rgba(10,35,66,0.14);display:flex;align-items:center;gap:12px;max-width:260px;
  }
  .map-badge .mb-icon{
    width:36px;height:36px;border-radius:9px;background:rgba(91,138,199,0.12);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }
  .map-badge .mb-icon svg{width:18px;height:18px;color:var(--signal);}
  .map-badge b{font-size:13px;color:var(--navy-deep);display:block;}
  .map-badge span{font-size:11.5px;color:var(--mist-dim);}

  @media (max-width:980px){
    .contact-grid{grid-template-columns:1fr;}
    .form-card{padding:28px 22px;}
  }
  @media (max-width:640px){
    .form-row{grid-template-columns:1fr;}
    .map-badge{position:static;margin-bottom:14px;max-width:100%;}
  }/* End custom CSS */