/* nginxweb.ir home: same look as /blog/ (dark bar, green accent, Vazirmatn, light cards). Loaded after the page's own <style>; delete the <link> in index.htm to undo. */
@font-face{font-family:'Vazirmatn';src:url('Vazirmatn.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{--g:#26914f;--g-d:#1c6f3c;--g-l:#4cc27d;--ink:#1f2933;--ink2:#2c3944;--text:#3b4650;--muted:#66727e;--line:#e6e9ee;--soft:#f8fafb;--tint:#eef7f1;--shadow:0 1px 2px rgba(16,24,40,.06),0 6px 20px rgba(16,24,40,.07);--shadow-h:0 2px 4px rgba(16,24,40,.08),0 14px 30px rgba(16,24,40,.13)}
*{font-family:'Vazirmatn','Vazir',Tahoma,Arial,sans-serif!important}
.fas,.far,.fal,.fa{font-family:'Font Awesome 6 Free'!important}
.fab{font-family:'Font Awesome 6 Brands'!important}
html{-webkit-text-size-adjust:100%}
body{background:#f1f4f6;color:var(--text);line-height:1.85;padding:14px 10px}
.container{max-width:1300px;border-radius:16px;box-shadow:0 0 0 1px var(--line),0 10px 34px rgba(16,24,40,.07)}
a{color:var(--g-d)}
:focus-visible{outline:2px solid var(--g);outline-offset:2px}
::selection{background:var(--g);color:#fff}

/* header: dark bar like the blog menu, green accents */
.site-header{background:linear-gradient(135deg,var(--ink),var(--ink2));border-radius:16px 16px 0 0}
.header-top{border-bottom:1px solid rgba(255,255,255,.08)}
.logo-icon{color:var(--g-l)}
.logo h1{font-weight:800;letter-spacing:0}
.logo span{opacity:.75}
.header-info .info-item{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.header-info .info-item:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28)}
.header-info .info-item i{color:var(--g-l)}
.header-info .info-item.phone i{color:#7ee2a3}
.header-info .info-item.address i{color:#f6c453}
.header-links a{border-radius:999px;padding:6px 14px}
.header-links a:hover{background:var(--g)}
.main-nav{background:rgba(255,255,255,.04);border-radius:0 0 14px 14px}
.main-nav>ul>li>a{padding:9px 16px;border-radius:10px;font-weight:500;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.main-nav>ul>li>a:hover{background:var(--g);border-color:var(--g-l);box-shadow:0 6px 18px rgba(38,145,79,.35)}
.main-nav>ul>li ul{background:var(--ink);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.4)}
.main-nav>ul>li ul li a:hover{background:var(--g);border-right-color:var(--g-l)}

/* sidebar widgets */
.widget{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);margin-bottom:18px}
.widget h3{background:linear-gradient(135deg,var(--g-d),#2e9e5b);padding:11px 16px;font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.widget h3 i{margin:0;opacity:.9}
.widget-body{padding:14px}
.widget-body img{border-radius:10px;display:inline-block}
.widget-body form input[type=text],.widget-body form input[type=password]{padding:9px 12px;border:1px solid #d5dbe1;border-radius:10px;background:var(--soft);font-size:14px;transition:border-color .2s,box-shadow .2s,background .2s}
.widget-body form input[type=text]:focus,.widget-body form input[type=password]:focus{background:#fff;border-color:var(--g);box-shadow:0 0 0 3px rgba(38,145,79,.16);outline:none}
.widget-body form label{display:flex;align-items:center;gap:6px;margin:2px 0 10px;font-size:13px;color:var(--muted)}
.widget-body form input[type=checkbox]{width:auto;margin:0}
.widget-body form button{padding:10px;background:var(--g);border-radius:10px;font-size:15px;font-weight:600;transition:background .2s,box-shadow .2s}
.widget-body form button:hover{background:var(--g-d);box-shadow:0 6px 16px rgba(38,145,79,.3)}
.register-link{color:var(--g-d);font-weight:600;margin-top:10px}

/* hero stats: dark card with green numbers */
.stats-section{background:linear-gradient(135deg,var(--ink),var(--ink2));border:0;border-radius:16px;box-shadow:var(--shadow)}
.stats-section .stats-title{font-weight:800}
.stats-section .stats-subtitle span{color:#f6c453}
.stats-grid .stat-item .number{background:linear-gradient(135deg,#4cc27d,#b5e86a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stats-divider{background:rgba(255,255,255,.14)}

/* content blocks */
.intro-box{background:var(--tint);border:1px solid #dcebe1;border-right:5px solid var(--g);border-radius:14px;padding:18px 20px;line-height:2}
.intro-box ul li{padding:3px 0}
.section-title{margin:28px 0 14px}
.section-title h2{display:flex;align-items:center;gap:10px;border:0;padding:0 14px 0 0;border-right:5px solid var(--g);font-size:19px;font-weight:800;color:var(--ink)}
.section-title h2 i{color:var(--g);margin:0}
.service-grid{gap:18px}
.service-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--g);border-radius:14px;padding:18px;box-shadow:var(--shadow)}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-h)}
.service-card .plan-name{color:var(--ink);font-size:16px;font-weight:800;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:10px}
.service-card ul li{font-size:13.5px;color:var(--text);padding:4px 0}
.service-card .contact-price{background:var(--tint);color:var(--g-d);border:1px dashed var(--g);border-radius:12px;font-size:16px}
.service-card:hover .contact-price{background:var(--g);color:#fff;border-style:solid}
.contact-info{background:linear-gradient(135deg,var(--ink),var(--ink2));border-radius:16px;box-shadow:var(--shadow)}
.contact-info .items i,.contact-info .brand span{color:var(--g-l)}
img[style*="box-shadow"]{box-shadow:var(--shadow)!important}

/* footer */
.site-footer{background:#161b20;color:#aeb8c1;border-radius:0 0 16px 16px}

@media (max-width:768px){
.container{border-radius:12px}
.section-title h2{font-size:17px}
.widget-body form input[type=text],.widget-body form input[type=password]{font-size:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* blog call-to-action widget */
.widget-blog p{margin:0 0 12px;font-size:13.5px;line-height:2;color:var(--text)}
.widget-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 14px;border-radius:10px;background:var(--g);color:#fff;font-weight:600;text-decoration:none;transition:background .2s,box-shadow .2s}
.widget-btn:hover{background:var(--g-d);color:#fff;text-decoration:none;box-shadow:0 6px 16px rgba(38,145,79,.3)}

/* intro blocks: lead paragraph + check list as a grid of small cards */
.intro-box{position:relative;background:linear-gradient(135deg,#f1f9f4,#fff 70%);border:1px solid #dcebe1;border-right:6px solid var(--g);border-radius:18px;padding:24px 28px;box-shadow:var(--shadow);overflow:hidden}
.intro-box:before{content:"";position:absolute;top:-70px;left:-70px;width:200px;height:200px;border-radius:50%;background:rgba(38,145,79,.07);pointer-events:none}
.intro-box>p{position:relative;margin:0;font-size:15px;line-height:2.15;color:var(--ink);font-weight:500}
.intro-box ul{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin:18px 0 0;padding:0;list-style:none}
.intro-box ul li{display:flex;align-items:flex-start;gap:10px;padding:11px 14px;background:#fff;border:1px solid var(--line);border-radius:12px;font-size:14px;line-height:1.9;color:var(--text);box-shadow:0 1px 2px rgba(16,24,40,.04);transition:border-color .2s,box-shadow .2s,transform .2s}
.intro-box ul li:before{content:"\2713";flex:0 0 24px;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-top:3px;border-radius:50%;background:var(--g);color:#fff;font-size:13px;font-weight:800;line-height:1}
.intro-box ul li:hover{border-color:var(--g);box-shadow:0 8px 20px rgba(38,145,79,.14);transform:translateY(-2px)}
.intro-box div img{display:inline-block;max-width:100%;height:auto;padding:12px;background:#fff;border:1px solid var(--line);border-radius:16px!important;box-shadow:var(--shadow)}
.intro-box>div:first-child{position:relative;margin-bottom:20px!important}
@media (max-width:768px){
.intro-box{padding:18px 16px;border-radius:14px}
.intro-box>p{font-size:14px}
.intro-box ul{grid-template-columns:1fr}
}

/* documentation page (nginxweb.htm): FAQ cards, command blocks, section pills */
.code,.doc-content .code{font-family:ui-monospace,SFMono-Regular,Consolas,'Courier New',monospace!important}
.doc-content{font-size:15px;line-height:2.15;color:var(--text);position:relative}
.doc-content p{margin:0 0 14px}
.doc-content strong{color:var(--ink)}
.doc-content h3{color:var(--ink)}
.doc-content hr{border:0;border-top:1px dashed #cfd8d2;margin:30px 0}
.doc-content .highlight-box{background:#fff;border:1px solid var(--line);border-right:5px solid var(--g);border-radius:14px;padding:18px 22px;margin:16px 0;box-shadow:var(--shadow);transition:box-shadow .2s,transform .2s}
.doc-content .highlight-box:hover{box-shadow:var(--shadow-h);transform:translateY(-2px)}
.doc-content .question{display:flex;align-items:flex-start;gap:10px;margin:0 0 10px;color:var(--ink);font-size:16px;font-weight:800;line-height:1.9}
.doc-content .question:before{content:"?";flex:0 0 28px;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-top:2px;border-radius:50%;background:var(--g);color:#fff;font-size:15px;font-weight:800}
.doc-content .answer{margin:0;padding:0 38px 0 0;border:0}
.doc-content .answer p:last-child{margin-bottom:0}
.doc-content .answer ul{display:block;margin:10px 0 0;padding:0;list-style:none}
.doc-content .answer ul li{display:block;margin:0 0 8px;padding:9px 14px;background:var(--soft);border:1px solid var(--line);border-radius:10px;box-shadow:none;transform:none;font-size:14px}
.doc-content .answer ul li:before{display:none}
.doc-content .answer ul li:hover{transform:none;box-shadow:none;border-color:var(--g)}
.doc-content .section-title-doc{display:inline-flex;align-items:center;gap:8px;margin:18px 0 12px;padding:9px 20px;border-radius:999px;background:linear-gradient(135deg,var(--g-d),#2e9e5b);color:#fff;font-size:16px;font-weight:700;box-shadow:0 6px 16px rgba(38,145,79,.25)}
.doc-content .section-title-doc[style*="e53e3e"]{box-shadow:0 6px 16px rgba(229,62,62,.25)}
.doc-content .code{position:relative;margin:8px 0 18px;padding:13px 18px;background:var(--ink);color:#d7f5e1;border:1px solid var(--ink2);border-radius:12px;font-size:13.5px;font-weight:600;line-height:1.8;overflow-x:auto;direction:ltr;text-align:left;box-shadow:inset 4px 0 0 var(--g-l)}
.doc-content .code:hover{background:#161b20}
@media (max-width:768px){
.doc-content{font-size:14px}
.doc-content .highlight-box{padding:14px 14px}
.doc-content .answer{padding-right:0}
.doc-content .question{font-size:15px}
}

/* about page (about.htm): lead paragraphs, "records / services" cards, contact block */
.about-content{font-size:15px;line-height:2.15;color:var(--text);position:relative}
.about-content>p{margin:0 0 14px}
.about-content strong{color:var(--ink)}
.about-content .highlight{background:#fff;border:1px solid var(--line);border-right:5px solid var(--g);border-radius:14px;padding:18px 22px;margin:18px 0;box-shadow:var(--shadow)}
.about-content .highlight>strong{display:block;margin-bottom:4px;color:var(--ink);font-size:17px;font-weight:800}
.about-content .highlight ul{margin-top:12px}
.about-content>div[style*="f7fafc"]{background:var(--soft)!important;border:1px solid var(--line);border-radius:14px!important;padding:16px 20px!important}
.about-content>div[style*="f7fafc"] p{margin:0 0 6px}
.about-content>div[style*="f7fafc"] p:last-child{margin-bottom:0}
@media (max-width:768px){
.about-content{font-size:14px}
.about-content .highlight{padding:14px}
}
