:root {
  --navy:#071827;
  --navy-2:#0d2638;
  --maroon:#8c1830;
  --maroon-dark:#681126;
  --gold:#b87943;
  --gold-soft:#f5e8dc;
  --cream:#fbf8f4;
  --paper:#ffffff;
  --text:#17202a;
  --muted:#68717c;
  --line:#e8e1db;
  --green:#21865b;
  --shadow:0 24px 70px rgba(7,24,39,.12);
}
*{box-sizing:border-box;scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body.dark{background:#06131f;color:#f8fafc;--cream:#06131f;--paper:#0b1e2d;--text:#f8fafc;--muted:#a8b3bd;--line:rgba(255,255,255,.09);--shadow:0 25px 80px rgba(0,0,0,.35)}
a{text-decoration:none}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.header{position:fixed;inset:0 0 auto;z-index:50;background:rgba(251,248,244,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.dark .header{background:rgba(6,19,31,.86)}
.logo{display:flex;align-items:center;gap:13px}
.logo img{width:180px;height:auto;display:block}
.nav-link{font-size:14px;font-weight:700;color:var(--muted);transition:.2s}
.nav-link:hover,.nav-link.active{color:var(--maroon)}
.btn-primary{display:inline-flex;align-items:center;gap:9px;padding:13px 20px;border-radius:13px;background:var(--maroon);color:white;font-weight:800;box-shadow:0 12px 30px rgba(140,24,48,.22);transition:.25s}
.btn-primary:hover{background:var(--maroon-dark);transform:translateY(-2px)}
.btn-secondary{display:inline-flex;align-items:center;gap:9px;padding:13px 20px;border-radius:13px;background:var(--paper);color:var(--text);font-weight:800;border:1px solid var(--line);transition:.25s}
.btn-secondary:hover{border-color:var(--gold);transform:translateY(-2px)}
.hero{position:relative;overflow:hidden;padding:150px 0 90px;background:
 radial-gradient(circle at 85% 20%,rgba(140,24,48,.11),transparent 30%),
 radial-gradient(circle at 10% 85%,rgba(184,121,67,.13),transparent 32%)}
.grid-bg{position:absolute;inset:0;opacity:.42;background-image:linear-gradient(rgba(7,24,39,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(7,24,39,.045) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,black,transparent)}
.dark .grid-bg{opacity:.16;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px)}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;background:var(--gold-soft);border:1px solid #ead3c1;color:var(--maroon);font-size:12px;font-weight:900}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(33,134,91,.1)}
.hero h1{font-size:clamp(46px,6.3vw,76px);line-height:1.02;letter-spacing:-3px;margin:24px 0 0;font-weight:950;max-width:760px}
.gradient{background:linear-gradient(90deg,var(--maroon),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-copy{font-size:18px;line-height:1.8;color:var(--muted);max-width:650px;margin-top:24px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.hero-card{position:relative;background:rgba(255,255,255,.72);border:1px solid rgba(184,121,67,.22);border-radius:30px;padding:18px;box-shadow:var(--shadow);backdrop-filter:blur(15px)}
.dark .hero-card{background:rgba(11,30,45,.8)}
.window{background:var(--paper);border:1px solid var(--line);border-radius:23px;overflow:hidden}
.window-top{display:flex;align-items:center;justify-content:space-between;padding:17px 19px;border-bottom:1px solid var(--line)}
.traffic{display:flex;gap:6px}
.traffic span{width:8px;height:8px;border-radius:50%;background:#d7d0c9}
.window-body{padding:20px}
.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.metric{padding:18px;border-radius:17px;background:var(--cream);border:1px solid var(--line)}
.metric strong{display:block;font-size:28px}
.service-section,.about-section,.tech-section,.process-section,.contact-section{padding:100px 0}
.soft{background:#f4eee8}
.dark .soft{background:#081a28}
.eyebrow{font-size:11px;letter-spacing:3px;text-transform:uppercase;font-weight:950;color:var(--maroon)}
.section-title{font-size:clamp(34px,4vw,52px);line-height:1.08;letter-spacing:-1.7px;font-weight:950;margin:10px 0 0}
.section-copy{color:var(--muted);line-height:1.8;max-width:650px;margin-top:16px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:45px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:25px;padding:27px;transition:.28s;box-shadow:0 8px 30px rgba(7,24,39,.035)}
.card:hover{transform:translateY(-7px);border-color:rgba(140,24,48,.3);box-shadow:var(--shadow)}
.icon{width:52px;height:52px;border-radius:16px;background:var(--gold-soft);color:var(--maroon);display:grid;place-items:center;font-weight:950;font-size:20px}
.card h3{font-size:20px;margin:20px 0 8px;font-weight:900}
.card p{color:var(--muted);line-height:1.75;font-size:14px}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.stat{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:28px}
.stat strong{font-size:42px;line-height:1;font-weight:950;color:var(--maroon)}
.techs{display:flex;flex-wrap:wrap;gap:12px;margin-top:35px}
.tech{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px 17px;font-weight:800;color:var(--muted);transition:.2s}
.tech:hover{color:var(--maroon);border-color:var(--gold);transform:translateY(-2px)}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:45px}
.step{background:var(--paper);border:1px solid var(--line);border-radius:23px;padding:25px}
.step-num{font-size:42px;font-weight:950;color:var(--gold);opacity:.55}
.step h3{font-size:19px;font-weight:900;margin:12px 0 7px}
.step p{font-size:14px;line-height:1.7;color:var(--muted)}
.cta{position:relative;overflow:hidden;background:var(--navy);color:white;border-radius:32px;padding:70px 35px;text-align:center}
.cta:before,.cta:after{content:"";position:absolute;border-radius:50%;filter:blur(10px)}
.cta:before{width:360px;height:360px;background:rgba(140,24,48,.3);right:-100px;top:-170px}
.cta:after{width:300px;height:300px;background:rgba(184,121,67,.18);left:-120px;bottom:-170px}
.cta-content{position:relative;z-index:1}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.form{background:var(--paper);border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:var(--shadow)}
.input{width:100%;border:1px solid var(--line);background:var(--cream);color:var(--text);border-radius:13px;padding:13px 15px;outline:none;margin-top:7px}
.input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(184,121,67,.12)}
.field{margin-bottom:17px}
label{font-size:13px;font-weight:850}
.footer{background:var(--navy);color:white;padding:45px 0}
.footer p{color:#93a1ac}
.theme-toggle{width:46px;height:27px;border-radius:999px;border:1px solid var(--line);background:var(--paper);position:relative;cursor:pointer}
.theme-toggle:after{content:"";position:absolute;width:21px;height:21px;top:2px;left:3px;border-radius:50%;background:var(--maroon);transition:.25s}
.dark .theme-toggle:after{transform:translateX(18px);background:var(--gold)}
.mobile-btn{display:none}
.mobile-menu{display:none}
@media(max-width:980px){
 .cards{grid-template-columns:repeat(2,1fr)}
 .process{grid-template-columns:repeat(2,1fr)}
 .contact-grid{grid-template-columns:1fr}
 .hero{padding-top:130px}
}
@media(max-width:760px){
 .container{width:min(100% - 28px,1180px)}
 .logo img{width:155px}
 .nav{display:none!important}
 .mobile-btn{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--text);cursor:pointer}
 .mobile-menu{padding:10px 0 15px}
 .mobile-menu.open{display:block}
 .mobile-menu a{display:block;padding:12px 13px;border-radius:10px;color:var(--muted);font-weight:750}
 .hero{padding:120px 0 65px}
 .hero h1{letter-spacing:-2px}
 .hero-copy{font-size:16px}
 .cards,.process{grid-template-columns:1fr}
 .stats{grid-template-columns:1fr 1fr}
 .service-section,.about-section,.tech-section,.process-section,.contact-section{padding:75px 0}
}
@media(max-width:480px){
 .stats{grid-template-columns:1fr}
 .hero-actions a{width:100%;justify-content:center}
}
/* =====================================
   SN DIGITAL HUB PREMIUM CURSOR
===================================== */

@media (min-width: 768px) {

    body,
    a,
    button,
    input,
    textarea,
    select {
        cursor: none !important;
    }

    #sn-cursor {
        position: fixed;
        inset: 0;
        z-index: 999999;
        pointer-events: none;
    }

    /* Soft glow */
    .sn-cursor-glow {
        position: fixed;

        width: 140px;
        height: 140px;

        margin-left: -70px;
        margin-top: -70px;

        border-radius: 50%;

        background: radial-gradient(
            circle,
            rgba(186,55,42,.12) 0%,
            rgba(186,55,42,.05) 35%,
            transparent 70%
        );

        filter: blur(4px);

        transition:
            width .3s ease,
            height .3s ease,
            margin .3s ease;
    }

    /* Main ring */
    .sn-cursor-ring {
        position: fixed;

        width: 38px;
        height: 38px;

        margin-left: -19px;
        margin-top: -19px;

        border: 1px solid rgba(186,55,42,.65);

        border-radius: 50%;

        background: rgba(186,55,42,.025);

        transition:
            width .3s cubic-bezier(.2,.8,.2,1),
            height .3s cubic-bezier(.2,.8,.2,1),
            margin .3s cubic-bezier(.2,.8,.2,1),
            background .3s ease,
            border-color .3s ease;
    }

    /* Center dot */
    .sn-cursor-dot {
        position: fixed;

        width: 6px;
        height: 6px;

        margin-left: -3px;
        margin-top: -3px;

        border-radius: 50%;

        background: #ba372a;

        box-shadow:
            0 0 12px rgba(186,55,42,.6);

        transition:
            transform .2s ease,
            background .2s ease;
    }


    /* =================================
       HOVER
    ================================= */

    #sn-cursor.hover .sn-cursor-ring {

        width: 58px;
        height: 58px;

        margin-left: -29px;
        margin-top: -29px;

        background: rgba(186,55,42,.08);

        border-color: #ba372a;
    }

    #sn-cursor.hover .sn-cursor-dot {
        transform: scale(.7);
    }


    /* =================================
       IMAGE HOVER
    ================================= */

    #sn-cursor.image-hover .sn-cursor-ring {

        width: 75px;
        height: 75px;

        margin-left: -37.5px;
        margin-top: -37.5px;

        background: #ba372a;

        border-color: #ba372a;
    }

    #sn-cursor.image-hover .sn-cursor-dot {
        background: #fff;
        transform: scale(.8);
    }


    /* =================================
       CLICK
    ================================= */

    #sn-cursor.click .sn-cursor-ring {

        width: 28px;
        height: 28px;

        margin-left: -14px;
        margin-top: -14px;

        border-color: #d7a16f;
    }


    /* =================================
       DARK MODE
    ================================= */

    body.dark .sn-cursor-ring {
        border-color: rgba(215,161,111,.65);
    }

    body.dark .sn-cursor-dot {
        background: #d7a16f;

        box-shadow:
            0 0 14px rgba(215,161,111,.65);
    }

    body.dark #sn-cursor.hover .sn-cursor-ring {
        border-color: #d7a16f;
        background: rgba(215,161,111,.08);
    }

    body.dark .sn-cursor-glow {
        background: radial-gradient(
            circle,
            rgba(215,161,111,.12),
            rgba(186,55,42,.05),
            transparent 70%
        );
    }
}


/* Mobile */
@media (max-width: 767px) {
    #sn-cursor {
        display: none;
    }
}

/* Letter hover - layout safe */

.sn-letter {
    display: inline;
    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.sn-letter:hover {
    color: #ba372a;
    display: inline-block;
    transform: scale(1.35) translateY(-2px);
}

body.dark .sn-letter:hover {
    color: #d7a16f;
}