/* Nipras Media and Social Networks V3
   Standalone CSS; no JS/CSS libraries beyond existing site Bootstrap. */
.ngm-hero, .ngm-directory, .ngm-contact-banner { font-family: system-ui, -apple-system, "Segoe UI", sans-serif; }
.ngm-hero { position:relative; isolation:isolate; overflow:hidden; background:linear-gradient(115deg,#edf9f2 0%,#f8fcf8 47%,#e7f5ee 100%); padding:92px 0 108px; }
.ngm-hero::before { content:""; position:absolute; width:620px; height:620px; right:-110px; top:-210px; border-radius:50%; background:radial-gradient(circle at center,rgba(40,172,99,.19),rgba(40,172,99,0) 68%); z-index:-1; }
.ngm-hero-orb { position:absolute; border-radius:50%; pointer-events:none; border:1px solid rgba(25,114,66,.10); animation:ngm-float 9s ease-in-out infinite; }
.ngm-hero-orb--one { width:360px; height:360px; right:11%; top:-90px; }
.ngm-hero-orb--two { width:250px; height:250px; right:4%; bottom:-150px; animation-delay:-3s; }
.ngm-hero-inner { position:relative; z-index:1; }
.ngm-eyebrow { display:inline-flex; align-items:center; gap:9px; border:1px solid #cce8d7; border-radius:40px; padding:9px 16px; background:rgba(255,255,255,.76); font-size:.81rem; font-weight:800; letter-spacing:.045em; color:#157944; box-shadow:0 4px 20px rgba(16,84,50,.04); }
.ngm-eyebrow-dot { width:9px; height:9px; border-radius:50%; background:#18a55a; box-shadow:0 0 0 5px rgba(24,165,90,.11); }
.ngm-hero h1 { max-width:700px; margin:22px 0 15px; font:700 clamp(2.4rem,5vw,4.4rem)/1.10 Georgia,Cambria,"Times New Roman",serif; letter-spacing:-.035em; color:#12422a; }
.ngm-hero p { max-width:650px; margin:0 0 27px; font-size:clamp(1rem,1.7vw,1.15rem); line-height:1.72; color:#50675b; }
.ngm-hero-cta { display:inline-flex; align-items:center; gap:13px; border-radius:999px; padding:13px 23px; background:#147b47; color:white; font-size:.94rem; font-weight:800; text-decoration:none; box-shadow:0 9px 28px rgba(20,123,71,.21); transition:transform .23s ease,box-shadow .23s ease,background .23s ease; }
.ngm-hero-cta:hover { color:white; background:#0e6135; transform:translateY(-3px); box-shadow:0 15px 33px rgba(20,123,71,.29); }
.ngm-hero-cta span { transition:transform .23s ease; }
.ngm-hero-cta:hover span { transform:translate(2px,-2px); }
.ngm-hero-icons { display:flex; gap:14px; position:absolute; right:7%; top:50%; transform:translateY(-38%); }
.ngm-hero-icon { display:grid; place-items:center; width:92px; height:92px; border-radius:24px; background:#fff; box-shadow:0 23px 46px rgba(11,70,35,.14); border:1px solid rgba(255,255,255,.7); animation:ngm-float 7s ease-in-out infinite; }
.ngm-hero-icon svg { width:43px; height:43px; }
.ngm-hero-icon--instagram { color:#ca427c; transform:translateY(-40px) rotate(-10deg); animation-delay:-2s; }
.ngm-hero-icon--facebook { color:#1b69d6; transform:translateY(55px) rotate(5deg); animation-delay:-4s; }
.ngm-hero-icon--youtube { color:#e02b34; transform:translateY(-10px) rotate(8deg); animation-delay:-1s; }
.ngm-directory { padding:73px 0 85px; background:#f8faf9; scroll-margin-top:60px; }
.ngm-intro { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:26px; }
.ngm-kicker { font-size:.72rem; font-weight:900; letter-spacing:.17em; color:#1a874e; }
.ngm-intro h2 { margin:8px 0 8px; color:#183f2d; font:700 clamp(1.7rem,2.8vw,2.6rem)/1.25 Georgia,Cambria,serif; }
.ngm-intro p { margin:0; color:#60766a; line-height:1.55; }
.ngm-count { flex:0 0 auto; color:#56715f; border:1px solid #dfebe2; border-radius:16px; padding:13px 17px; background:#fff; font-weight:650; font-size:.87rem; }
.ngm-count strong { color:#136a3e; font-size:1.25rem; }
.ngm-filters { display:flex; flex-wrap:wrap; gap:9px; margin-bottom:27px; }
.ngm-filter { border:1px solid #d3e1d8; background:white; color:#50685a; border-radius:999px; padding:9px 18px; font-size:.85rem; font-weight:800; transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease; }
.ngm-filter:hover { transform:translateY(-2px); border-color:#1b8f52; color:#17693d; }
.ngm-filter.is-active { background:#167c48; color:white; border-color:#167c48; box-shadow:0 6px 17px rgba(22,124,72,.16); }
.ngm-group { background:#fff; border:1px solid #e0eae3; border-radius:24px; padding:26px 28px 28px; margin-bottom:18px; box-shadow:0 5px 28px rgba(16,63,36,.035); transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease; }
.ngm-group:hover { border-color:#bcdccb; box-shadow:0 15px 40px rgba(16,63,36,.085); transform:translateY(-2px); }
.ngm-group-header, .ngm-group-identity { display:flex; align-items:center; }
.ngm-group-header { margin-bottom:20px; gap:22px; }
.ngm-group-identity { gap:14px; min-width:0; }
.ngm-group-avatar { display:grid; place-items:center; flex:0 0 54px; width:54px; height:54px; border-radius:16px; background:linear-gradient(135deg,#e2f3e7,#f4f9e8); border:1px solid #cee7d6; color:#157142; font-weight:850; font-size:1rem; }
.ngm-group h3 { margin:0 0 3px; font-size:1.2rem; font-weight:850; color:#244333; overflow-wrap:anywhere; }
.ngm-group-label { font-size:.78rem; color:#75917f; font-weight:700; }
.ngm-group-line { flex:1; height:1px; background:linear-gradient(90deg,#e3ece5,transparent); }
.ngm-link-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.ngm-link { --ngm-color:#268352; --ngm-tint:#eaf7ef; position:relative; display:flex; align-items:center; gap:15px; text-decoration:none; border:1px solid #e6ece7; border-radius:16px; background:#fff; color:#263b2e; padding:16px 15px; min-width:0; transition:transform .28s cubic-bezier(.22,.7,.25,1),border-color .25s ease,box-shadow .25s ease,background .25s ease; }
.ngm-link::before { content:""; position:absolute; height:3px; width:45%; left:16px; top:0; border-radius:0 0 10px 10px; background:var(--ngm-color); opacity:.65; transform:scaleX(.5); transform-origin:left; transition:transform .32s ease; }
.ngm-link:hover { color:#18392a; border-color:var(--ngm-color); background:linear-gradient(145deg,#fff,var(--ngm-tint)); transform:translateY(-4px); box-shadow:0 14px 29px rgba(22,63,43,.09); }
.ngm-link:hover::before { transform:scaleX(1); }
.ngm-link--facebook { --ngm-color:#2168d6; --ngm-tint:#eef5ff; }
.ngm-link--instagram { --ngm-color:#c83f8a; --ngm-tint:#fff2f8; }
.ngm-link--youtube { --ngm-color:#e12930; --ngm-tint:#fff0f0; }
.ngm-link--linkedin { --ngm-color:#0a79ad; --ngm-tint:#eaf8ff; }
.ngm-link--telegram { --ngm-color:#229dcb; --ngm-tint:#edfbff; }
.ngm-link--whatsapp { --ngm-color:#198e58; --ngm-tint:#eafbef; }
.ngm-link--x, .ngm-link--threads { --ngm-color:#333; --ngm-tint:#f1f2f3; }
.ngm-link--pinterest { --ngm-color:#bc283c; --ngm-tint:#fff0f2; }
.ngm-link--spotify { --ngm-color:#218d4e; --ngm-tint:#ebfff2; }
.ngm-platform-icon { display:grid; place-items:center; width:49px; height:49px; flex:0 0 49px; border-radius:14px; background:var(--ngm-tint); color:var(--ngm-color); transition:transform .25s ease; }
.ngm-link:hover .ngm-platform-icon { transform:scale(1.08) rotate(-5deg); }
.ngm-platform-icon svg { width:25px; height:25px; }
.ngm-link-text { display:flex; flex-direction:column; min-width:0; gap:3px; }
.ngm-link-text strong { font-size:.95rem; font-weight:850; color:var(--ngm-color); }
.ngm-link-text span { font-size:.82rem; color:#64786b; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ngm-open-arrow { margin-left:auto; color:var(--ngm-color); font-size:1.24rem; flex:0 0 auto; transition:transform .25s ease; }
.ngm-link:hover .ngm-open-arrow { transform:translate(3px,-3px); }
.ngm-link[hidden], .ngm-group[hidden] { display:none !important; }
.ngm-empty { padding:32px; border:1px dashed #bfdac8; background:white; border-radius:18px; text-align:center; color:#5d7164; }
.ngm-contact-banner { background:linear-gradient(115deg,#123d2a,#1b6944); color:#fff; padding:48px 0; }
.ngm-contact-inner { display:flex; justify-content:space-between; align-items:center; gap:24px; }
.ngm-contact-banner h2 { font:700 clamp(1.45rem,2.7vw,2.05rem)/1.2 Georgia,Cambria,serif; margin:0 0 8px; }
.ngm-contact-banner p { margin:0; color:rgba(255,255,255,.82); }
.ngm-contact-button { display:inline-flex; align-items:center; gap:14px; background:#fff; color:#13683d; padding:12px 21px; border-radius:999px; font-weight:800; text-decoration:none; white-space:nowrap; transition:transform .23s ease,box-shadow .23s ease; }
.ngm-contact-button:hover { transform:translateY(-3px); color:#13683d; box-shadow:0 12px 24px rgba(0,0,0,.17); }
.ngm-filter:focus-visible, .ngm-link:focus-visible, .ngm-hero-cta:focus-visible, .ngm-contact-button:focus-visible { outline:3px solid #f1b83c; outline-offset:3px; }
/* Reveal only when Javascript and IntersectionObserver are available. */
.ngm-animations-ready .ngm-reveal:not(.is-visible) { opacity:0; transform:translateY(22px); }
.ngm-animations-ready .ngm-reveal { transition:opacity .65s ease,transform .65s cubic-bezier(.21,.72,.25,1); transition-delay:var(--ngm-delay,0ms); }
.ngm-animations-ready .ngm-reveal.is-visible { opacity:1; transform:translateY(0); }
@keyframes ngm-float { 0%,100% { translate:0 0; } 50% { translate:0 -12px; } }
@media(max-width:1199.98px) { .ngm-hero-icons { right:2%; } .ngm-link-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:991.98px) { .ngm-hero-icons { opacity:.23; right:-40px; } .ngm-hero-icon { width:68px; height:68px; } .ngm-hero-icon svg { width:35px; height:35px; } .ngm-hero h1, .ngm-hero p { position:relative; z-index:2; } }
@media(max-width:767.98px) { .ngm-hero { padding:65px 0 70px; } .ngm-hero-icons { display:none; } .ngm-directory { padding:48px 0 56px; } .ngm-intro { display:block; } .ngm-count { display:inline-block; margin-top:17px; } .ngm-group { padding:22px 17px; border-radius:18px; } .ngm-link-grid { grid-template-columns:1fr; } .ngm-contact-inner { flex-direction:column; align-items:flex-start; } }
@media(max-width:480px) { .ngm-hero h1 { font-size:2.4rem; } .ngm-group-avatar { width:47px; height:47px; flex-basis:47px; border-radius:13px; } .ngm-group h3 { font-size:1.03rem; } .ngm-link { padding:13px 12px; } .ngm-filter { padding:8px 14px; } }
@media(prefers-reduced-motion:reduce) { .ngm-hero-orb, .ngm-hero-icon { animation:none !important; } .ngm-reveal, .ngm-animations-ready .ngm-reveal, .ngm-link, .ngm-hero-cta, .ngm-platform-icon, .ngm-open-arrow { opacity:1 !important; transform:none !important; transition:none !important; } html:focus-within { scroll-behavior:auto; } }