/* NPD site chrome: header + footer in brand colours (black #0d0d0f + logo gold #d4b98a).
   Loaded site-wide from catalog/controller/journal3/npd_seo.php. The header is transparent over dark
   heroes (.npd-hero) and turns solid once the page scrolls (html.npd-scrolled, set by a small script there). */
:root{--npd-black:#0d0d0f;--npd-gold:#d4b98a;--npd-gold-d:#b59b6e;--npd-line:rgba(212,185,138,.22)}

/* ---------- header (desktop) ---------- */
html.desktop-header-active header .top-bar{background:var(--npd-black)!important;border-bottom:1px solid rgba(255,255,255,.07)}
html.desktop-header-active header .top-bar,html.desktop-header-active header .top-bar a,html.desktop-header-active header .top-bar .links-text,html.desktop-header-active header .top-bar i{color:rgba(255,255,255,.72)!important;font-size:12.5px;letter-spacing:.04em}
html.desktop-header-active header .top-bar a:hover,html.desktop-header-active header .top-bar a:hover .links-text,html.desktop-header-active header .top-bar a:hover i{color:var(--npd-gold)!important}
html.desktop-header-active header .mid-bar{background:var(--npd-black)!important;transition:background-color .3s ease,box-shadow .3s ease,border-color .3s ease;border-bottom:1px solid transparent}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item > a,html.desktop-header-active header .desktop-main-menu-wrapper .j-menu > li > a{position:relative}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu > .j-menu > li > a{color:#fff!important;font-weight:600;letter-spacing:.06em;background:transparent!important}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu > .j-menu > li > a::after{content:"";position:absolute;left:14px;right:14px;bottom:14px;height:2px;border-radius:2px;background:var(--npd-gold);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu > .j-menu > li:hover > a,html.desktop-header-active header .desktop-main-menu-wrapper .main-menu > .j-menu > li.active > a{color:var(--npd-gold)!important}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu > .j-menu > li:hover > a::after,html.desktop-header-active header .desktop-main-menu-wrapper .main-menu > .j-menu > li.active > a::after{transform:scaleX(1)}
html.desktop-header-active header .dropdown-menu a:hover,html.desktop-header-active header .dropdown-menu a:hover .links-text{color:var(--npd-gold-d)!important}

/* gold call-to-action added to the menu bar by the chrome script */
.npd-hq{display:none}
html.desktop-header-active .npd-hq{display:inline-flex;align-items:center;gap:8px;align-self:center;margin-left:14px;padding:10px 20px;border-radius:999px;background:linear-gradient(135deg,#e2c898,var(--npd-gold-d));color:var(--npd-black)!important;font-weight:800;font-size:14px;letter-spacing:.02em;white-space:nowrap;text-decoration:none!important;box-shadow:0 8px 22px rgba(181,155,110,.28);transition:transform .2s ease,box-shadow .2s ease}
html.desktop-header-active .npd-hq:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(181,155,110,.4)}

/* transparent over dark heroes, solid after scrolling */
html.desktop-header-active:has(.npd-hero) header{margin-bottom:-105px!important}
html.desktop-header-active:has(.npd-hero) header .top-bar{background:transparent!important;border-bottom-color:rgba(255,255,255,.08)}
html.desktop-header-active:has(.npd-hero) header .mid-bar{background:transparent!important}
html.desktop-header-active.npd-scrolled:has(.npd-hero) header .mid-bar{background:rgba(13,13,15,.9)!important;-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom-color:var(--npd-line);box-shadow:0 10px 30px rgba(0,0,0,.25)}
html.desktop-header-active.route-common-home .npd-hero-inner{padding-top:169px!important}
html.desktop-header-active:has(.npd-hero--page) .npd-hero--page .npd-hero-inner{padding-top:149px!important}

/* ---------- header (phones and tablets) ---------- */
html.mobile-header-active .mobile-header .mobile-bar,html.mobile-header-active .mobile-header .mobile-top-bar{background:var(--npd-black)!important}
html.mobile-header-active .mobile-header .mobile-bar a,html.mobile-header-active .mobile-header .mobile-bar i,html.mobile-header-active .mobile-header .mobile-bar .menu-trigger,html.mobile-header-active .mobile-header .mobile-top-bar a{color:#fff!important}

/* ---------- footer ---------- */
footer{background:var(--npd-black)!important;color:rgba(255,255,255,.66)}
footer .grid-row,footer .grid-row-1{background:transparent!important}
footer .grid-row-2{display:none!important}
footer .grid-row-1{padding:46px 0 34px!important;border-top:1px solid rgba(255,255,255,.06)}
footer .module-title,footer .title,footer h3{color:var(--npd-gold)!important;font-size:13px!important;letter-spacing:.14em!important;text-transform:uppercase!important;font-weight:700!important;margin-bottom:14px!important}
footer .module-title::after,footer .title::after{display:none!important}
footer,footer p,footer .block-content,footer .newsletter-text,footer .links-text,footer li{color:rgba(255,255,255,.66)!important}
footer a,footer a .links-text{color:rgba(255,255,255,.78)!important;text-decoration:none!important;transition:color .2s ease}
footer a:hover,footer a:hover .links-text{color:var(--npd-gold)!important}
footer .links-menu .menu-item{padding:4px 0!important;border:0!important}
footer .newsletter-form input,footer .module-newsletter input[type=email],footer .module-newsletter input[type=text]{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.14)!important;color:#fff!important;border-radius:10px!important;height:46px}
footer .module-newsletter input::placeholder{color:rgba(255,255,255,.45)!important}
footer .module-newsletter .btn,footer .module-newsletter button{background:linear-gradient(135deg,#e2c898,var(--npd-gold-d))!important;color:var(--npd-black)!important;border:0!important;border-radius:10px!important;font-weight:800!important}
footer .module-newsletter .checkbox,footer .module-newsletter label{color:rgba(255,255,255,.55)!important}

.npd-fwrap{max-width:1200px;margin:0 auto;padding:0 24px}
.npd-fcta{background:radial-gradient(900px 300px at 85% 0,rgba(212,185,138,.14),transparent 70%),var(--npd-black);padding:52px 0 44px}
.npd-fcta .npd-fwrap{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:36px;align-items:center}
.npd-fcta-brand img{display:block;width:210px;height:auto;margin-bottom:14px}
.npd-fcta-brand p{margin:0;font-size:14px;line-height:1.6;color:rgba(255,255,255,.62)}
.npd-fcta-copy h2{margin:0 0 8px!important;color:#fff!important;font-size:28px!important;line-height:1.2!important;font-weight:800}
.npd-fcta-copy h2 span{color:var(--npd-gold)}
.npd-fcta-copy p{margin:0 0 18px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.7)}
.npd-fcta-btns{display:flex;flex-wrap:wrap;gap:10px}
.npd-fbtn-gold,.npd-fbtn-line{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:12px;font-weight:800;font-size:15px;text-decoration:none!important;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.npd-fbtn-gold{background:linear-gradient(135deg,#e2c898,var(--npd-gold-d));color:var(--npd-black)!important;box-shadow:0 10px 26px rgba(181,155,110,.3)}
.npd-fbtn-line{border:1px solid rgba(255,255,255,.28);color:#fff!important}
.npd-fbtn-gold:hover{transform:translateY(-2px)}
.npd-fbtn-line:hover{border-color:var(--npd-gold);color:var(--npd-gold)!important}
.npd-fcontact{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.npd-fcontact li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:rgba(255,255,255,.75);line-height:1.45}
.npd-fcontact svg{flex:none;width:34px;height:34px;padding:8px;border-radius:10px;background:rgba(212,185,138,.12);fill:none;stroke:var(--npd-gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.npd-fcontact small{display:block;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.npd-fcontact a{color:#fff!important;text-decoration:none!important}
.npd-fcontact a:hover{color:var(--npd-gold)!important}
.npd-fbar{background:#08080a;border-top:1px solid var(--npd-line);padding:18px 0;font-size:13px;color:rgba(255,255,255,.5)}
.npd-fbar .npd-fwrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px}
.npd-fsoc{display:flex;gap:8px}
.npd-fsoc a{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(255,255,255,.14);transition:border-color .2s ease,background-color .2s ease}
.npd-fsoc a:hover{border-color:var(--npd-gold);background:rgba(212,185,138,.12)}
.npd-fsoc svg{width:15px;height:15px;fill:rgba(255,255,255,.8)}
.npd-fsoc a:hover svg{fill:var(--npd-gold)}
@media (max-width:980px){.npd-fcta .npd-fwrap{grid-template-columns:1fr 1fr}.npd-fcta-copy{grid-column:1/-1;order:-1}}
@media (max-width:620px){.npd-fcta{padding:38px 0 30px}.npd-fcta .npd-fwrap{grid-template-columns:1fr;gap:26px}.npd-fcta-copy h2{font-size:24px!important}.npd-fbar .npd-fwrap{flex-direction:column;text-align:center}.npd-fwrap{padding:0 16px}}

/* top bar link lists are painted white by the theme */
html.desktop-header-active header .top-bar .j-menu,html.desktop-header-active header .top-bar .j-menu > li,html.desktop-header-active header .top-bar .j-menu > li > a{background:transparent!important;border-color:rgba(255,255,255,.08)!important}
html.desktop-header-active header .top-bar .dropdown-menu .j-menu,html.desktop-header-active header .top-bar .dropdown-menu .j-menu > li > a{background:#fff!important}
html.desktop-header-active header .top-bar .dropdown-menu a,html.desktop-header-active header .top-bar .dropdown-menu a .links-text{color:#141416!important}
html.desktop-header-active header .top-bar .dropdown-menu a:hover,html.desktop-header-active header .top-bar .dropdown-menu a:hover .links-text{color:var(--npd-gold-d)!important}
/* the logo file has a black background; blend it into dark headers/footers */
/* logo: image/catalog/logo-transparent.png (black made transparent), set as config_logo */
/* the theme paints a light band behind the whole header (header::before) */
html.desktop-header-active header::before{background:var(--npd-black)!important}
html.desktop-header-active:has(.npd-hero) header::before{background:transparent!important}

/* ---------- menu dropdowns: dark panel, icon + name + one-line description ---------- */
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu{padding:0!important;background:#111114!important;border:1px solid rgba(212,185,138,.22)!important;border-radius:18px!important;box-shadow:0 30px 60px rgba(0,0,0,.45)!important;overflow:hidden;margin-top:6px}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu::before,html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu::after{display:none!important}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-1 > .dropdown-menu{width:680px!important}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-22 > .dropdown-menu{width:340px!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu{display:grid!important;grid-template-columns:1fr 1fr;gap:2px;padding:12px!important;background:transparent!important}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-22 > .dropdown-menu > .j-menu{grid-template-columns:1fr}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li{border:0!important;background:transparent!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a{display:grid!important;grid-template-columns:40px 1fr;column-gap:12px;align-items:center;padding:10px 12px!important;border-radius:12px;background:transparent!important;white-space:normal!important;min-height:0!important;transition:background-color .2s ease}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a::before{content:"";grid-row:1 / span 2;width:40px;height:40px;border-radius:11px;background-color:rgba(212,185,138,.1);background-repeat:no-repeat;background-position:center;background-size:20px 20px;transition:background-color .2s ease}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a .links-text{grid-column:2;color:#fff!important;font-weight:700;font-size:14.5px!important;line-height:1.3;text-transform:none!important;letter-spacing:0!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a::after{grid-column:2;color:rgba(255,255,255,.52);font-size:12.5px;line-height:1.35;margin-top:2px}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a:hover{background:rgba(212,185,138,.08)!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a:hover .links-text{color:#d4b98a!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li > a:hover::before{background-color:rgba(212,185,138,.22)}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu .npd-dd-foot{grid-column:1 / -1;display:flex!important;justify-content:space-between;align-items:center;gap:12px;margin:8px -12px -12px;padding:14px 22px!important;background:rgba(212,185,138,.08)!important;border-top:1px solid rgba(212,185,138,.18)!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu .npd-dd-foot span{color:rgba(255,255,255,.7);font-size:13.5px}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu .npd-dd-foot a{display:inline!important;padding:0!important;color:#d4b98a!important;font-weight:800;font-size:13.5px;background:none!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu .npd-dd-foot a::before,html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu .npd-dd-foot a::after{display:none!important}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-2 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='17' cy='20' r='1.5'/%3E%3Cpath d='M3 4h2l2.4 11h10.2l2-8H6.2'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-2 > a::after{content:"Online stores with UPI, cards & GST invoices"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-3 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-3 > a::after{content:"Android & iOS apps for your business"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-4 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8l-4 4 4 4M16 8l4 4-4 4M13 6l-2 12'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-4 > a::after{content:"Web apps built around your workflow"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-5 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M7 6.5h.01M10 6.5h.01'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-5 > a::after{content:"Fast, SEO-ready company websites"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-6 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-3-2-3 2-3-2-3 2z'/%3E%3Cpath d='M9 8h6M9 12h6'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-6 > a::after{content:"GST billing, stock & accounts"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-7 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9l-5 4z'/%3E%3Cpath d='M8 10h8'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-7 > a::after{content:"Bulk messages, templates & alerts"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-8 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9l1-5h14l1 5M4 9v11h16V9M4 9h16M9 20v-6h6v6'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-8 > a::after{content:"Sellers, commissions & payouts"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-9 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16z'/%3E%3Cpath d='M13 7l4 4'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-9 > a::after{content:"Blogs & news portals that rank"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-10 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l4 4v14H6z'/%3E%3Cpath d='M9 12h7M9 16h7'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-10 > a::after{content:"Tamil & English typing and layouts"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-11 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5a2 2 0 0 1 2-2h13v16H6a2 2 0 0 0-2 2z'/%3E%3Cpath d='M4 19V5'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-11 > a::after{content:"Story platforms for Tamil writers"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-12 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v4M12 17v4M3 12h4M17 12h4M6 6l2.5 2.5M15.5 15.5L18 18M6 18l2.5-2.5M15.5 8.5L18 6'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-12 > a::after{content:"Enquiry stores for Sivakasi shops"}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-23 > a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4b98a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
html.desktop-header-active header .desktop-main-menu-wrapper .main-menu-item-23 > a::after{content:"When does a domain expire?"}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li.npd-dd-foot > a{display:inline-block!important;padding:0!important;white-space:nowrap!important;background:none!important}
html.desktop-header-active header .desktop-main-menu-wrapper .dropdown-menu > .j-menu > li.npd-dd-foot > span{flex:1}
/* address + map only on the contact page: hide the footer "Our Location" block */
footer .module-blocks-313{display:none!important}
.npd-fbar a{color:rgba(255,255,255,.7)!important;text-decoration:none!important}
.npd-fbar a:hover{color:var(--npd-gold)!important}
/* align the footer link columns with the band above */
footer .grid-row-1 > .grid-cols{max-width:1200px;margin:0 auto!important;padding:0 12px}