/* Snigdha Traders public website — common refinements, v1.4.3 */


@font-face{font-family:'DM Sans';src:url('../assets/fonts/Poppins-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'DM Sans';src:url('../assets/fonts/Poppins-Medium.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:'DM Sans';src:url('../assets/fonts/Poppins-SemiBold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:'DM Sans';src:url('../assets/fonts/Poppins-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:'Syne';src:url('../assets/fonts/Poppins-SemiBold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:'Syne';src:url('../assets/fonts/Poppins-Bold.ttf') format('truetype');font-style:normal;font-weight:700 900;font-display:swap}


/* Shared refinements and components used across public pages */
/* Global accessibility and stable media behaviour */
.skip-link{position:fixed;left:16px;top:12px;z-index:9999;transform:translateY(-160%);padding:10px 16px;border-radius:10px;background:#fff;color:var(--night);font-weight:700;box-shadow:var(--s-lg);transition:transform .2s ease}
.skip-link:focus{transform:translateY(0)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.accent{color:var(--blue-d)}
.hero-note{margin-top:14px;font-size:.85rem;color:rgba(232,238,245,.7)}
.footer-brand-name{color:#fff!important}
.footer-brand-tagline{color:var(--blue-glow)!important}

/* Real icon and word logo */
.brand-icon-logo{
    display:block;
    width:56px;
    height:48px;
    flex:0 0 56px;
    object-fit:contain;
    filter:drop-shadow(0 7px 14px rgba(27,142,201,.22));
}

.brand-word-logo{
    display:block;
    width:172px;
    height:50px;
    object-fit:contain;
    object-position:left center;
    transition:filter .3s ease,opacity .3s ease;
}

/* White word logo over the dark Hero */
.nav:not(.on) .brand-word-logo{
    filter:brightness(0) invert(1);
}

/* Original logo colours on the white navigation bar */
.nav.on .brand-word-logo{
    filter:none;
}

/* Footer logo */
.premium-footer .brand-icon-logo{
    width:62px;
    height:54px;
    flex-basis:62px;
}

.premium-footer .brand-word-logo{
    width:190px;
    height:58px;
    filter:brightness(0) invert(1);
}

@media(max-width:600px){
    .nav .brand-icon-logo{
        width:45px;
        height:40px;
        flex-basis:45px;
    }

    .nav .brand-word-logo{
        width:130px;
        height:40px;
    }
}

@media(max-width:390px){
    .nav .brand-word-logo{
        width:112px;
    }
}

body.menu-open{overflow:hidden}
#top-btn.is-visible{display:grid}
.premium-footer,.local-reach{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
.wa{position:fixed!important;left:18px!important;right:auto!important;bottom:18px!important;width:max-content!important;max-width:calc(100vw - 36px)!important;z-index:80!important}
.wa a{display:flex!important;width:auto!important;align-items:center!important;justify-content:center!important}
.sc-dots button{width:8px;height:8px;border:0;padding:0;border-radius:99px;background:rgba(255,255,255,.4);transition:.4s var(--ease);cursor:pointer}
.sc-dots button.on{background:#fff;width:24px}
.sc-dots button:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* A single video is populated by JavaScript according to current orientation. */
.hero-media #heroVideo{width:100%;height:100%;object-fit:cover;object-position:center;opacity:.58;display:block;background:var(--night)}
@media(orientation:portrait){.hero-media #heroVideo{object-position:center center}}
@media(orientation:landscape){.hero-media #heroVideo{object-position:center center}}

/* Inner-page heroes intentionally use a branded gradient instead of unapproved stock imagery. */
.phero-media{background:
        radial-gradient(circle at 82% 18%,rgba(62,180,232,.28),transparent 28%),
        linear-gradient(125deg,#071322 0%,#0b2138 48%,#0d6d9d 145%)}
.phero-media::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to right,transparent,black)}

/* Exact static portfolio */
.port-gallery{padding-top:40px}
.port-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:24px}
.port-item[hidden]{display:none!important}
.port-item.is-entering{animation:portfolioIn .45s var(--ease) both}
.port-item{cursor:pointer}
.port-item:focus-within{outline:3px solid rgba(27,142,201,.35);outline-offset:4px}
.port-img button{display:block;width:100%;height:100%;padding:0;background:none;border:0;cursor:zoom-in}
.portfolio-count{margin:-8px 0 22px;text-align:center;color:var(--muted);font-size:.86rem;font-weight:600}
@keyframes portfolioIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
#lb figure{margin:0;display:grid;justify-items:center;gap:12px;cursor:default}
#lb-caption{color:#fff;font-weight:600;text-align:center;max-width:min(88vw,760px)}

/* Smooth FAQ: JS sets exact content height; no fixed 300px cut-off. */
.faq-a,.faq-answer{height:0;max-height:none!important;overflow:hidden;opacity:0;transition:height .48s var(--ease),opacity .3s ease}
.faq-item.open .faq-a,.faq-item.open .faq-answer{max-height:none!important;opacity:1}
.faq-q,.faq-question{width:100%;text-align:left}

/* Accessible custom select, replacing the operating system dropdown. */
.native-select-hidden{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;left:0!important;bottom:0!important}
.cselect{position:relative;width:100%;z-index:4}
.cselect.is-open{z-index:80}
.cselect-trigger{width:100%;min-height:54px;padding:15px 46px 15px 44px;border-radius:16px;border:1.5px solid transparent;background:var(--paper-2);color:var(--ink);font:500 .95rem 'DM Sans',system-ui,sans-serif;text-align:left;transition:border-color .25s var(--ease),box-shadow .25s var(--ease),background .25s ease,transform .25s var(--ease);position:relative}
.cselect-trigger::after{content:'';position:absolute;right:17px;top:50%;width:9px;height:9px;border-right:2px solid var(--blue-d);border-bottom:2px solid var(--blue-d);transform:translateY(-70%) rotate(45deg);transition:transform .28s var(--ease)}
.cselect.is-open .cselect-trigger{background:#fff;border-color:var(--blue-glow);box-shadow:0 0 0 5px rgba(62,180,232,.15);transform:translateY(-2px)}
.cselect.is-open .cselect-trigger::after{transform:translateY(-28%) rotate(225deg)}
.cselect-trigger.is-placeholder{color:var(--muted)}
.cselect-trigger:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.cselect-menu{position:absolute;left:0;right:0;top:calc(100% + 8px);padding:7px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px rgba(15,28,46,.18);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);transform-origin:top;transition:opacity .22s ease,transform .3s var(--ease),visibility .22s;max-height:min(320px,45vh);overflow:auto;overscroll-behavior:contain}
.cselect.is-open .cselect-menu{opacity:1;visibility:visible;transform:none}
.cselect-option{display:flex;align-items:center;width:100%;padding:12px 14px;border-radius:11px;color:var(--ink-soft);font:600 .9rem 'DM Sans',system-ui,sans-serif;text-align:left;transition:background .18s ease,color .18s ease,transform .18s ease}
.cselect-option:hover,.cselect-option.is-active{background:var(--blue-l);color:var(--blue-d);transform:translateX(2px)}
.cselect-option[aria-selected='true']{background:var(--blue);color:#fff}
.cselect.is-invalid .cselect-trigger{border-color:#d64545;box-shadow:0 0 0 4px rgba(214,69,69,.1)}

/* Human check / captcha */
.human-check{grid-column:1/-1;padding:17px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#fff,var(--paper));margin-top:2px}
.human-check-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.human-check-head strong{display:block;font-family:'Syne',sans-serif;font-size:.9rem}
.human-check-head span{display:block;color:var(--muted);font-size:.76rem;line-height:1.45;margin-top:3px}
.captcha-row{display:grid;grid-template-columns:minmax(150px,210px) 44px minmax(110px,1fr);gap:10px;align-items:center}
.captcha-canvas{width:100%;height:62px;border-radius:12px;border:1px solid #cdddea;background:#f8fcff}
.captcha-refresh{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--blue-l);color:var(--blue-d);transition:transform .25s var(--ease),background .2s ease}
.captcha-refresh:hover{background:var(--blue);color:#fff;transform:rotate(20deg)}
.captcha-input{padding:14px!important;border:1.5px solid var(--line)!important;background:#fff!important;text-align:center;font-size:1rem!important;font-weight:700!important}
.captcha-error{color:#b42318;font-size:.78rem;font-weight:600;margin-top:8px;min-height:1.25em}
.form-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-message{margin-top:14px;min-height:1.5em;font-size:.88rem;font-weight:600}
.form-message.ok{color:#16794a}.form-message.err{color:#b42318}
.submit-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:submitSpin .7s linear infinite}
.form-card{position:relative}
.thank-you-pop{position:absolute;inset:0;z-index:90;border-radius:inherit;background:rgba(255,255,255,.97);display:grid;place-items:center;text-align:center;padding:26px;animation:thankIn .45s var(--ease) both}
.thank-you-icon{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:#e8f8ef;color:#168657;font-size:2rem;animation:thankPulse 1s ease both}
.thank-you-pop h3{margin-bottom:8px}.thank-you-pop p{max-width:30ch;margin:auto}
@keyframes thankIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
@keyframes thankPulse{0%{transform:scale(.75)}55%{transform:scale(1.1)}100%{transform:scale(1)}}
@keyframes submitSpin{to{transform:rotate(360deg)}}

/* Approved dummy feedback state: no invented reviews or customer photos. */
.feedback-placeholder{margin-top:30px;border:1px dashed rgba(27,142,201,.4);border-radius:24px;padding:clamp(28px,5vw,54px);text-align:center;background:linear-gradient(145deg,#fff,var(--blue-l))}
.feedback-placeholder .ic{margin:0 auto 18px}
.feedback-placeholder h3{margin-bottom:8px}
.feedback-placeholder p{max-width:44rem;margin:0 auto}
.spec-body h3{font-family:'Syne',sans-serif;font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 4px}

/* Image-free link to the separately approved portfolio. */
.project-link-card{border-radius:28px;padding:clamp(28px,5vw,58px);background:linear-gradient(125deg,var(--night),#123653);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:28px;box-shadow:var(--s-lg)}
.project-link-card h2{color:#fff;max-width:22ch}.project-link-card p{color:rgba(255,255,255,.76);max-width:52rem;margin-top:12px}
.project-link-card .tag{color:var(--blue-glow);border-color:rgba(62,180,232,.3);background:rgba(62,180,232,.1)}

/* Natural local-service copy instead of repeated keyword blocks. */
.local-reach{padding:42px 0;background:var(--night-2);border-bottom:1px solid rgba(255,255,255,.07)}
.local-reach .w{text-align:center;max-width:980px}
.local-reach h2{font-size:clamp(1.25rem,2.4vw,1.75rem)!important;color:#fff!important;margin-bottom:10px}
.local-reach p{color:rgba(255,255,255,.7)!important;font-size:.9rem!important;line-height:1.8}
.network-cta{margin-top:56px}.network-cta p{margin-bottom:24px;font-weight:600;color:var(--ink-soft);font-size:1.05rem}
.location-context{margin-top:60px;padding-top:40px;border-top:1px solid rgba(27,142,201,.15);text-align:center}
.location-context h3{margin-bottom:12px}.location-context p{max-width:900px;margin:auto;line-height:1.8}
.tag.tag-on-dark{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:#fff}

/* Missing approved assets fail gracefully without silently substituting another photo. */
.av-main{background:linear-gradient(145deg,var(--blue-l),var(--paper-2));position:relative}
.av-main.media-missing::after{content:'Showroom photo';position:absolute;inset:0;display:grid;place-items:center;color:var(--blue-d);font-family:'Syne',sans-serif;font-weight:700}
.av-main.media-missing img{opacity:0}

@media(max-width:767px){
    .captcha-row{grid-template-columns:1fr 44px}.captcha-input{grid-column:1/-1}
    .project-link-card{align-items:flex-start;flex-direction:column}
    .project-link-card .btn{width:100%;justify-content:center}
}

@media(prefers-reduced-motion:reduce){
    .port-item.is-entering,.thank-you-pop,.thank-you-icon{animation:none}
    .faq-a,.faq-answer,.cselect-menu,.cselect-trigger,.cselect-trigger::after{transition:none}
}