/*
Theme Name: Stackyxa
Theme URI: https://stackyxa.com/
Author: Sachinraj C P
Description: A fast, modern and flexible WordPress theme for technology companies, agencies, software businesses and professional service brands. Includes a built-in one-click starter demo importer, Gutenberg patterns and Elementor-friendly layouts.
Version: 1.0
Requires at least: 6.4
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: stackyxa
Tags: blog, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, wide-blocks, full-width-template
*/

:root{--sx-bg:#f7f9fc;--sx-text:#111c31;--sx-muted:#64748b;--sx-accent:#2563eb;--sx-accent-dark:#1d4ed8;--sx-dark:#0f172a;--sx-card:#fff;--sx-border:#e2e8f0;--sx-soft:#eef4ff;--sx-radius:20px;--sx-shadow:0 18px 45px rgba(15,23,42,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--sx-bg);color:var(--sx-text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:var(--sx-accent);text-decoration:none}a:hover{text-decoration:none;color:var(--sx-accent-dark)}img{max-width:100%;height:auto;display:block}h1,h2,h3,h4,h5,h6{line-height:1.12;letter-spacing:-.025em;color:var(--sx-text)}p{margin-top:0}.site-container{width:min(1180px,calc(100% - 40px));margin-inline:auto}.site-main{min-height:60vh}.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.screen-reader-text:focus{background:#fff;color:#000;clip:auto!important;width:auto;height:auto;padding:10px;z-index:100000}

/* Header */
.site-header{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--sx-border);position:sticky;top:0;z-index:40}.header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.site-branding{display:flex;align-items:center;gap:12px}.site-branding>div{display:flex;flex-direction:column}.site-title{font-size:1.18rem;font-weight:850;color:var(--sx-text);margin:0}.site-title a{color:var(--sx-text)}.site-description{margin:0;color:var(--sx-muted);font-size:.8rem}.custom-logo{max-height:46px;width:auto}.menu-toggle{display:none;border:1px solid var(--sx-border);background:#fff;padding:9px 12px;border-radius:10px;cursor:pointer}.main-navigation ul{display:flex;align-items:center;gap:25px;list-style:none;margin:0;padding:0}.main-navigation a{color:var(--sx-text);font-weight:650;font-size:.95rem}.main-navigation .current-menu-item>a,.main-navigation .current_page_item>a{color:var(--sx-accent)}

/* Common buttons */
.button,.wp-block-button__link,.sx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--sx-accent);color:#fff!important;padding:13px 20px;border-radius:12px;font-weight:750;text-decoration:none!important;border:1px solid var(--sx-accent);transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.button:hover,.wp-block-button__link:hover,.sx-btn:hover{background:var(--sx-accent-dark);border-color:var(--sx-accent-dark);transform:translateY(-1px);box-shadow:0 10px 24px rgba(37,99,235,.22)}.button.secondary,.sx-btn-secondary{background:#fff;color:var(--sx-text)!important;border-color:var(--sx-border)}.button.secondary:hover,.sx-btn-secondary:hover{background:#f8fafc;color:var(--sx-text)!important;box-shadow:0 10px 24px rgba(15,23,42,.08)}

/* Legacy fallback home */
.hero{padding:96px 0;background:linear-gradient(135deg,#eff6ff,#fff 52%,#eef2ff)}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center}.eyebrow{font-weight:800;color:var(--sx-accent);text-transform:uppercase;letter-spacing:.08em;font-size:.82rem}.hero h1{font-size:clamp(2.5rem,6vw,5rem);line-height:1.02;margin:.25em 0}.hero p{font-size:1.15rem;color:var(--sx-muted);max-width:680px}.hero-art{background:#0f172a;border-radius:28px;box-shadow:var(--sx-shadow);overflow:hidden}.section{padding:80px 0}.section.alt{background:#fff}.section-title{max-width:720px;margin-bottom:34px}.section-title h2{font-size:clamp(2rem,4vw,3.1rem);margin:.2em 0}.section-title p{color:var(--sx-muted)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{background:var(--sx-card);border:1px solid var(--sx-border);border-radius:var(--sx-radius);padding:28px;box-shadow:0 7px 20px rgba(18,38,63,.04)}.card h3{margin-top:0}.card p{color:var(--sx-muted)}.icon{width:44px;height:44px;border-radius:12px;background:#dbeafe;display:grid;place-items:center;color:#1d4ed8;font-weight:900;margin-bottom:18px}

/* Demo site page system */
.entry-content>.sx-page{max-width:none!important;margin:0!important}.sx-page{overflow:hidden}.sx-page h1{font-size:clamp(2.8rem,6vw,5.2rem);margin:.18em 0 .28em}.sx-page h2{font-size:clamp(2rem,4vw,3.35rem);margin:.2em 0 .35em}.sx-page h3{font-size:1.25rem;margin:.3em 0 .55em}.sx-page p{color:var(--sx-muted)}.sx-kicker{display:inline-block;color:var(--sx-accent);font-weight:850;text-transform:uppercase;letter-spacing:.1em;font-size:.78rem;margin-bottom:10px}.sx-lead{font-size:1.15rem;line-height:1.75;max-width:690px}.sx-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 24px}.sx-trust{display:flex;gap:18px;flex-wrap:wrap;color:#dbeafe;font-size:.9rem}.sx-trust span:before{content:"✓";margin-right:7px;color:#60a5fa;font-weight:900}
.sx-hero{background:linear-gradient(130deg,#0b1223,#0f2554 56%,#17336b);color:#fff;padding:86px 0 78px}.sx-hero h1{color:#fff;max-width:720px}.sx-hero p{color:#cbd5e1}.sx-hero .sx-kicker{color:#93c5fd}.sx-hero .sx-btn-secondary{background:#fff;color:#0f172a!important}.sx-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}.sx-media{border-radius:26px;overflow:hidden;box-shadow:var(--sx-shadow);background:#eaf1ff}.sx-media img{width:100%;aspect-ratio:16/10;object-fit:cover}.sx-media-dark{background:#0f172a;box-shadow:0 28px 70px rgba(0,0,0,.28)}
.sx-stats{background:#fff;border-bottom:1px solid var(--sx-border)}.sx-stat-grid{display:grid;grid-template-columns:repeat(4,1fr)}.sx-stat-grid>div{padding:26px 24px;border-right:1px solid var(--sx-border);display:flex;flex-direction:column}.sx-stat-grid>div:first-child{padding-left:0}.sx-stat-grid>div:last-child{border-right:0}.sx-stat-grid strong{font-size:1.55rem;color:var(--sx-accent)}.sx-stat-grid span{color:var(--sx-muted);font-size:.92rem}
.sx-section{padding:88px 0}.sx-section-soft{background:#fff}.sx-heading{max-width:760px;margin-bottom:38px}.sx-heading>p{font-size:1.05rem}.sx-heading-row{max-width:none;display:flex;justify-content:space-between;gap:30px;align-items:end}.sx-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.sx-card{background:#fff;border:1px solid var(--sx-border);border-radius:20px;padding:28px;box-shadow:0 10px 28px rgba(15,23,42,.04)}.sx-card p:last-child{margin-bottom:0}.sx-card-number{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:32px;padding:0 10px;background:#eff6ff;color:var(--sx-accent);border-radius:99px;font-weight:800;font-size:.78rem;margin-bottom:15px}.sx-card ul{padding-left:18px;color:var(--sx-muted);margin-bottom:0}.sx-card li{margin:7px 0}.sx-card-large{padding:38px}.sx-split{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}.sx-split-reverse>div:first-child{order:2}.sx-split-reverse>div:last-child{order:1}.sx-checks{list-style:none;padding:0!important;margin:24px 0 30px!important}.sx-checks li{position:relative;padding-left:30px;margin:11px 0;color:var(--sx-text)}.sx-checks li:before{content:"✓";position:absolute;left:0;top:0;color:var(--sx-accent);font-weight:900}.sx-project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.sx-project{background:#fff;border:1px solid var(--sx-border);border-radius:22px;overflow:hidden}.sx-project-image img{aspect-ratio:16/10;width:100%;object-fit:cover}.sx-project-body{padding:26px}.sx-project-body>span{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--sx-accent);font-weight:800}.sx-project-body h2,.sx-project-body h3{margin-top:10px}.sx-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.sx-tags em{font-style:normal;font-size:.78rem;background:#f1f5f9;border-radius:99px;padding:6px 10px;color:#475569}.sx-cta{padding:70px 0;background:linear-gradient(135deg,#1d4ed8,#4338ca);color:#fff}.sx-cta h2{color:#fff;margin-top:0}.sx-cta p{color:#dbeafe;margin-bottom:0}.sx-cta .sx-kicker{color:#bfdbfe}.sx-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:32px}.sx-cta .sx-btn-secondary{white-space:nowrap;background:#fff;color:#111827!important;border-color:#fff}
.sx-page-hero{padding:74px 0;background:linear-gradient(180deg,#eff6ff,#f8fafc)}.sx-page-hero-compact{padding:68px 0}.sx-page-hero .sx-media{box-shadow:0 22px 60px rgba(15,23,42,.12)}.sx-process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.sx-process>div{background:#fff;border:1px solid var(--sx-border);border-radius:18px;padding:24px}.sx-process b{display:inline-block;color:var(--sx-accent);font-size:.85rem;margin-bottom:20px}.sx-card-grid-services .sx-card{min-height:300px}.sx-team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.sx-team-card{background:#fff;border:1px solid var(--sx-border);border-radius:20px;padding:24px}.sx-team-avatar{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#2563eb,#7c3aed);color:#fff;font-weight:850;font-size:1.1rem;margin-bottom:20px}.sx-team-card span{color:var(--sx-accent);font-size:.88rem;font-weight:700}.sx-contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:42px;align-items:start}.sx-contact-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.sx-contact-cards .sx-card:last-child{grid-column:1/-1}.sx-contact-cards small{display:block;text-transform:uppercase;letter-spacing:.08em;color:var(--sx-muted);font-weight:800}.sx-contact-panel{position:sticky;top:105px}.sx-note{padding:15px;background:#f8fafc;border-radius:12px;font-size:.92rem}.sx-prose{max-width:800px}.sx-prose h2{font-size:1.7rem;margin-top:42px}

/* Content / blog */
.content-area{padding:64px 0}.entry-header{margin-bottom:30px}.entry-title{font-size:clamp(2.1rem,4vw,3.6rem);line-height:1.1;margin-top:0}.entry-meta{color:var(--sx-muted);font-size:.92rem}.entry-content>*{max-width:760px;margin-left:auto;margin-right:auto}.entry-content>.alignwide{max-width:1180px}.entry-content>.alignfull{max-width:none}.entry-content>figure.wp-block-image img{border-radius:18px}.posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.post-card{background:#fff;border:1px solid var(--sx-border);border-radius:18px;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}.post-card:hover{transform:translateY(-3px);box-shadow:var(--sx-shadow)}.post-card-body{padding:22px}.post-card h2{font-size:1.25rem;margin:.35em 0}.post-card h2 a{color:var(--sx-text)}.post-card .post-thumbnail img{aspect-ratio:16/10;object-fit:cover;width:100%}.single .post-thumbnail,.single .wp-post-image{border-radius:20px;margin-bottom:34px}.single .entry-header{max-width:850px}.single .entry-content{font-size:1.04rem}.single .entry-content h2{margin-top:2em}.nav-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.nav-links a,.nav-links span{padding:8px 12px;background:#fff;border:1px solid var(--sx-border);border-radius:9px}.comments-area{max-width:760px;margin:45px auto}.comment-list{padding-left:20px}.widget{margin-bottom:24px}.error-404{text-align:center;padding:110px 0}.error-404 h1{font-size:5rem;margin-bottom:0}.elementor-page .entry-content>*{max-width:none}.page-template-template-full-width .site-container.content-wrap{width:100%;max-width:none}.page-template-template-full-width .entry-content>*{max-width:none}

/* Footer */
.site-footer{background:#0b1220;color:#dbe4f0;padding:58px 0 24px;margin-top:0}.site-footer h2,.site-footer h3{color:#fff}.site-footer a{color:#fff}.site-footer p{color:#94a3b8}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px}.footer-grid ul{list-style:none;padding:0;margin:0}.footer-grid li{margin:8px 0}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding-top:20px;color:#94a3b8}

@media(max-width:980px){.sx-hero-grid,.sx-split,.sx-contact-grid{grid-template-columns:1fr}.sx-split-reverse>div:first-child,.sx-split-reverse>div:last-child{order:initial}.sx-card-grid{grid-template-columns:repeat(2,1fr)}.sx-team-grid{grid-template-columns:repeat(2,1fr)}.sx-process{grid-template-columns:repeat(2,1fr)}.sx-contact-panel{position:static}.sx-hero{padding:65px 0}.sx-heading-row{align-items:flex-start;flex-direction:column}}
@media(max-width:900px){.hero-grid,.grid-3,.posts-grid,.footer-grid{grid-template-columns:1fr}.hero{padding:64px 0}.menu-toggle{display:block}.main-navigation{position:absolute;left:0;right:0;top:78px;background:#fff;border-bottom:1px solid var(--sx-border);display:none;padding:16px 20px;box-shadow:0 18px 28px rgba(15,23,42,.08)}.main-navigation.is-open{display:block}.main-navigation ul{display:block}.main-navigation li{margin:10px 0}.header-inner{position:relative}.site-description{display:none}}
@media(max-width:700px){.site-container{width:min(100% - 28px,1180px)}.sx-page h1{font-size:clamp(2.35rem,12vw,3.6rem)}.sx-section{padding:66px 0}.sx-page-hero{padding:58px 0}.sx-card-grid,.sx-project-grid,.sx-team-grid,.sx-process,.sx-contact-cards{grid-template-columns:1fr}.sx-contact-cards .sx-card:last-child{grid-column:auto}.sx-stat-grid{grid-template-columns:repeat(2,1fr)}.sx-stat-grid>div{border-right:0;border-bottom:1px solid var(--sx-border);padding:20px 12px}.sx-stat-grid>div:first-child{padding-left:12px}.sx-cta-inner{align-items:flex-start;flex-direction:column}.sx-actions{flex-direction:column;align-items:stretch}.sx-actions .sx-btn{width:100%}.sx-trust{flex-direction:column;gap:6px}.sx-card-large{padding:28px}.content-area{padding:44px 0}}


/* ============================================================
   Stackyxa 1.0.1 responsive navigation + homepage hero breakout
   ============================================================ */

/* Keep the desktop header stable even with a long site title. */
.site-branding{min-width:0}
.site-branding>div{min-width:0}
.site-title a{overflow-wrap:anywhere}

/* Accessible hamburger icon. Hidden on desktop by the base theme rule. */
.menu-toggle{
	width:46px;
	height:46px;
	padding:0;
	align-items:center;
	justify-content:center;
	flex:0 0 46px;
	color:var(--sx-text);
	transition:background .18s ease,border-color .18s ease;
}
.menu-toggle:hover,.menu-toggle:focus-visible{background:#f8fafc;border-color:#cbd5e1}
.menu-toggle:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:2px}
.menu-toggle-icon{width:22px;height:18px;display:flex;flex-direction:column;justify-content:space-between}
.menu-toggle-icon span{display:block;width:100%;height:2px;border-radius:99px;background:currentColor;transform-origin:center;transition:transform .2s ease,opacity .2s ease}
.menu-toggle[aria-expanded="true"] .menu-toggle-icon span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-toggle-icon span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .menu-toggle-icon span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* Basic submenu support on larger screens. */
@media(min-width:901px){
	.main-navigation li{position:relative}
	.main-navigation .sub-menu{position:absolute;z-index:60;left:-16px;top:calc(100% + 12px);display:none;min-width:210px;padding:10px;background:#fff;border:1px solid var(--sx-border);border-radius:14px;box-shadow:0 18px 38px rgba(15,23,42,.12)}
	.main-navigation .sub-menu li{margin:0}
	.main-navigation .sub-menu a{display:block;padding:9px 10px;border-radius:8px;white-space:nowrap}
	.main-navigation .sub-menu a:hover,.main-navigation .sub-menu a:focus{background:#f8fafc}
	.main-navigation li:hover>.sub-menu,.main-navigation li:focus-within>.sub-menu{display:block}
}

/* Homepage only: extend the existing hero background to the viewport edges.
   The hero's inner content keeps the normal site-container alignment. */
.home .content-area .entry-content>.sx-page>.sx-hero{
	width:100vw;
	max-width:none!important;
	margin-left:calc(50% - 50vw)!important;
	margin-right:calc(50% - 50vw)!important;
}

/* The fallback homepage hero gets the same full-width behavior. */
.home .site-main>.hero{
	width:100%;
}

/* WordPress admin bar + sticky header compatibility. */
.admin-bar .site-header{top:32px}

@media(max-width:900px){
	.site-header{overflow:visible}
	.header-inner{position:static;min-height:70px;gap:14px}
	.site-branding{flex:1 1 auto;max-width:calc(100% - 60px)}
	.site-branding .site-title{font-size:1rem;line-height:1.2}
	.site-branding .custom-logo{max-height:40px;max-width:190px}
	.menu-toggle{display:inline-flex;position:relative;z-index:70}

	.main-navigation{
		position:absolute;
		z-index:65;
		left:0;
		right:0;
		top:100%;
		display:none;
		width:100%;
		max-height:calc(100vh - 70px);
		overflow-y:auto;
		-webkit-overflow-scrolling:touch;
		padding:12px 18px 20px;
		background:#fff;
		border-top:1px solid var(--sx-border);
		border-bottom:1px solid var(--sx-border);
		box-shadow:0 18px 30px rgba(15,23,42,.12);
	}
	.main-navigation.is-open{display:block}
	.main-navigation ul,.main-navigation .sub-menu{display:block;position:static;min-width:0;margin:0;padding:0;background:transparent;border:0;box-shadow:none}
	.main-navigation li{margin:0;border-bottom:1px solid #eef2f7}
	.main-navigation li:last-child{border-bottom:0}
	.main-navigation a{display:block;padding:13px 4px;font-size:1rem;line-height:1.35}
	.main-navigation .sub-menu{padding:0 0 7px 16px}
	.main-navigation .sub-menu li{border-bottom:0}
	.main-navigation .sub-menu a{padding:9px 4px;color:var(--sx-muted);font-size:.94rem}

	/* Prevent horizontal overflow from full-width sections. */
	html,body{max-width:100%;overflow-x:hidden}
	.sx-hero-grid{gap:32px}
	.sx-media{width:100%}
}

@media(max-width:782px){
	.admin-bar .site-header{top:46px}
}

@media(max-width:700px){
	.site-container{width:min(100% - 28px,1180px)}
	.sx-hero{padding:56px 0 52px}
	.sx-hero-grid{gap:28px}
	.sx-hero .sx-actions{margin-top:24px}
	.sx-hero .sx-media{border-radius:20px}
}

@media(max-width:420px){
	.site-container{width:calc(100% - 24px)}
	.header-inner{min-height:66px}
	.site-branding .site-title{font-size:.9rem}
	.site-branding .custom-logo{max-width:155px;max-height:36px}
	.menu-toggle{width:44px;height:44px;flex-basis:44px}
	.main-navigation{max-height:calc(100vh - 66px);padding-inline:14px}
	.sx-page h1{font-size:clamp(2.15rem,11.5vw,3rem)}
}
