/**
 * SeoNami overnight responsive + mobile UX pass (v1.9.20+)
 * Phone ~390 · Tablet ~768 · Laptop ~1024 · Desktop ~1440
 */

/* --------------------------------------------------------------------------
   Header: stay pinned; avoid sticky break from overflow-x:hidden
   -------------------------------------------------------------------------- */

html {
	overflow-x: clip;
}

body.seonami-tt1-child,
body.seonami-tt1-child #page.site {
	overflow-x: clip;
}

.seonami-site-header.is-sticky {
	position: sticky;
	top: 0;
	z-index: 10050;
	width: 100%;
	max-width: none;
	background: rgba(255, 255, 255, 0.98);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	transform: translateZ(0);
}

body.admin-bar .seonami-site-header.is-sticky {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .seonami-site-header.is-sticky {
		top: 46px;
	}
}

/* While the mobile drawer is open, lock header to the viewport. */
body.primary-navigation-open .seonami-site-header.is-sticky {
	position: fixed;
	inset-inline: 0;
	top: 0;
	width: 100%;
}

body.admin-bar.primary-navigation-open .seonami-site-header.is-sticky {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar.primary-navigation-open .seonami-site-header.is-sticky {
		top: 46px;
	}
}

body.primary-navigation-open .menu-button-container {
	position: sticky;
	top: 0;
	z-index: 5;
	background: rgba(255, 255, 255, 0.98);
	padding-block: 6px;
}

/* --------------------------------------------------------------------------
   Submenus: easy close on phone/tablet (≤1024)
   -------------------------------------------------------------------------- */

/* Desktop: keep hover UX, hide + toggle. */
@media (min-width: 1025px) {
	.seonami-site-header .primary-navigation .sub-menu-toggle {
		display: none !important;
	}
}

/* Phone + tablet: show accessible expand/collapse control. */
@media (max-width: 1024px) {
	.seonami-site-header .primary-navigation .sub-menu-toggle {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		min-width: 44px;
		min-height: 44px;
		width: 44px;
		height: 44px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 10px;
		background: rgba(103, 61, 230, 0.08);
		color: var(--seonami-color-primary-dark, #5025D1);
		cursor: pointer;
	}

	.seonami-site-header .primary-navigation .menu-item-has-children {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 4px;
	}

	.seonami-site-header .primary-navigation .menu-item-has-children > a {
		flex: 1 1 auto;
		min-height: 44px;
		padding-inline-end: 12px;
	}

	.seonami-site-header .primary-navigation .menu-item-has-children > a::after {
		display: none;
	}

	.seonami-site-header .primary-navigation .sub-menu {
		flex: 1 1 100%;
		width: 100%;
		max-height: min(52vh, 360px);
		overflow: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		padding-top: 8px;
		position: relative;
	}

	.seonami-site-header .primary-navigation .sub-menu-toggle[aria-expanded='false'] ~ .sub-menu,
	.seonami-site-header .primary-navigation .menu-item-has-children:not(.seonami-submenu-open) > .sub-menu {
		display: none !important;
	}

	.seonami-site-header .primary-navigation .sub-menu-toggle[aria-expanded='true'] ~ .sub-menu,
	.seonami-site-header .primary-navigation .menu-item-has-children.seonami-submenu-open > .sub-menu {
		display: block !important;
	}

	.seonami-submenu-dismiss {
		position: sticky;
		top: 0;
		z-index: 3;
		display: flex;
		justify-content: flex-start;
		gap: 8px;
		margin: 0 0 8px;
		padding: 6px 4px 8px;
		background: linear-gradient(180deg, #fff 70%, rgba(255, 255, 255, 0));
	}

	.seonami-submenu-dismiss__btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 44px;
		min-width: 88px;
		padding: 0.55rem 1rem;
		border: 1px solid rgba(103, 61, 230, 0.28);
		border-radius: 999px;
		background: #fff;
		color: var(--seonami-color-primary-dark, #5025D1);
		font: inherit;
		font-size: 0.86rem;
		font-weight: 800;
		cursor: pointer;
		box-shadow: 0 6px 16px rgba(47, 28, 106, 0.08);
	}

	.seonami-submenu-dismiss__btn:hover,
	.seonami-submenu-dismiss__btn:focus-visible {
		background: rgba(103, 61, 230, 0.08);
		outline: none;
	}

	/* Hide decorative panel titles on cramped mobile panels. */
	.seonami-site-header .primary-navigation .primary-menu-container > ul > .menu-item-has-children > .sub-menu::after,
	.seonami-site-header .primary-navigation .primary-menu-container > ul > .menu-item-has-children > .sub-menu::before {
		display: none !important;
	}
}

@media (min-width: 1025px) {
	.seonami-submenu-dismiss {
		display: none !important;
	}
}

/* --------------------------------------------------------------------------
   Floating TOC = desktop only (≥1100). Static / in-flow on phone + tablet.
   -------------------------------------------------------------------------- */

.sn-toc-sticky,
.sn-article .sn-toc-sticky,
.sn-layout__aside .sn-toc-sticky {
	position: static;
	top: auto;
	max-height: none;
	overflow: visible;
	box-shadow: none;
}

@media (max-width: 1099px) {
	.sn-layout__aside .sn-toc-sticky,
	.sn-article .sn-toc-sticky,
	nav.sn-toc-sticky {
		position: static !important;
		top: auto !important;
		max-height: none !important;
		overflow: visible !important;
		margin: 1rem 0 1.5rem;
		padding: 1rem 1.1rem;
		border: 1px solid var(--seonami-color-border, #E8E4F5);
		border-radius: 14px;
		background: #fff;
		box-shadow: none !important;
	}

	/* Prefer inline TOC near the top; de-emphasize trailing aside on landings. */
	.sn-layout {
		display: flex;
		flex-direction: column;
	}

	.sn-layout__aside {
		order: -1;
		width: 100%;
		margin: 0 0 1rem;
	}

	.sn-layout__aside .sn-toc-sticky {
		max-height: none;
	}
}

@media (min-width: 1100px) {
	.sn-layout__aside .sn-toc-sticky,
	.sn-article .sn-toc-sticky,
	nav.sn-toc-sticky {
		position: sticky;
		top: 6.5rem;
		max-height: calc(100vh - 8rem);
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	body.admin-bar .sn-layout__aside .sn-toc-sticky,
	body.admin-bar .sn-article .sn-toc-sticky {
		top: 8rem;
		max-height: calc(100vh - 9.5rem);
	}
}

/* --------------------------------------------------------------------------
   Compact heroes / headers on phone + tablet
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {
	.seonami-header-inner {
		min-height: 64px;
		gap: 12px;
		padding-block: 8px;
		padding-inline: 16px;
	}

	.seonami-branding .custom-logo {
		max-width: 132px;
		max-height: 42px;
	}

	.seonami-branding .site-title {
		font-size: 1.05rem;
	}

	.seonami-utility-bar__inner {
		padding-block: 6px;
		font-size: 0.78rem;
	}

	.sn-wp-hero,
	.sn-wp-hero--luxury,
	.sn-wp-hero--aurora {
		padding-block: 1.35rem 1.1rem !important;
		min-height: 0 !important;
	}

	.sn-wp-hero h1,
	.sn-wp-hero__copy h1 {
		font-size: clamp(1.35rem, 6.2vw, 1.75rem) !important;
		line-height: 1.35 !important;
		margin-bottom: 0.55rem !important;
	}

	.sn-wp-hero__lead {
		font-size: 0.92rem !important;
		line-height: 1.7 !important;
		margin-bottom: 0.85rem !important;
	}

	.sn-wp-hero__chips {
		gap: 0.35rem !important;
		margin-bottom: 0.85rem !important;
	}

	.sn-wp-hero__chips span {
		font-size: 0.72rem !important;
		padding: 0.28rem 0.55rem !important;
	}

	.sn-wp-hero__actions {
		gap: 0.5rem !important;
	}

	.sn-wp-hero__actions .sn-wp-btn {
		min-height: 44px;
		padding: 0.65rem 1rem !important;
		font-size: 0.88rem !important;
	}

	.sn-wp-hero__visual,
	.sn-wp-hero__frame {
		max-width: 100%;
	}

	.sn-wp-hero__frame img {
		max-height: 180px;
		object-fit: cover;
		width: 100%;
	}

	.sn-wp-panel--float,
	.sn-wp-panel--luxury.sn-wp-panel--float {
		display: none !important;
	}

	.sn-wp-guarantee {
		font-size: 0.78rem !important;
		margin-top: 0.65rem !important;
	}

	.sn-hero {
		padding: 1.5rem 0 1.25rem !important;
	}

	.sn-hero h1 {
		font-size: clamp(1.35rem, 6vw, 1.85rem) !important;
		margin-bottom: 0.55rem !important;
	}

	.sn-hero__lead {
		font-size: 0.95rem !important;
		margin-bottom: 0.85rem !important;
	}

	.sn-hero__badge {
		margin-bottom: 0.55rem !important;
		font-size: 0.72rem !important;
	}

	.sn-hero__points {
		margin-bottom: 1rem !important;
	}

	.sn-hero__points li {
		margin-bottom: 0.4rem !important;
		font-size: 0.88rem !important;
	}

	.sn-hero__grid {
		gap: 1.15rem !important;
	}

	.sn-hero__visual {
		aspect-ratio: 16 / 9;
		max-height: 200px;
	}

	.sn-service-hero {
		padding: 1.5rem 0 1.25rem !important;
	}

	.sn-service-hero h1 {
		font-size: clamp(1.35rem, 5.5vw, 1.8rem) !important;
		margin-bottom: 0.55rem !important;
	}

	.sn-service-hero__lead {
		font-size: 0.92rem !important;
		line-height: 1.75 !important;
		margin-bottom: 0.85rem !important;
	}

	.sn-service-hero__points {
		margin-bottom: 1rem !important;
		gap: 0.4rem !important;
	}

	.sn-service-hero__visual {
		aspect-ratio: 16 / 10;
		max-height: 200px;
	}

	.sn-service-hero__badge {
		margin-bottom: 0.5rem !important;
		font-size: 0.72rem !important;
	}

	.sn-article-hero,
	.sn-article .sn-article-hero {
		min-height: 0 !important;
		padding-block: 1.25rem !important;
	}

	.sn-article-hero__title,
	.sn-article-hero h1 {
		font-size: clamp(1.3rem, 5.8vw, 1.7rem) !important;
		line-height: 1.35 !important;
	}

	.sn-section {
		padding: 2.25rem 0 !important;
	}

	.sn-stats {
		margin-top: 1.25rem !important;
		padding-top: 1.1rem !important;
		gap: 0.65rem !important;
	}
}

@media (max-width: 390px) {
	.sn-wp-hero h1,
	.sn-hero h1,
	.sn-service-hero h1 {
		font-size: 1.28rem !important;
	}

	.seonami-account-link {
		min-height: 40px;
		padding-inline: 10px;
		font-size: 0.75rem;
	}
}

/* --------------------------------------------------------------------------
   Sitewide overflow / grid / CTA safety
   -------------------------------------------------------------------------- */

img,
video,
iframe,
svg {
	max-width: 100%;
	height: auto;
}

.entry-content,
.sn-home,
.sn-seo-page,
.sn-hosting-page,
.sn-article,
.sn-service-mother {
	overflow-wrap: anywhere;
	word-break: break-word;
}

.entry-content .wp-block-columns,
.entry-content .wp-block-gallery,
.sn-commerce__grid,
.seonami-pricing-grid {
	max-width: 100%;
}

@media (max-width: 767px) {
	.entry-content .wp-block-columns {
		display: flex;
		flex-direction: column;
		gap: 1rem;
	}

	.entry-content .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}

	.wp-block-buttons {
		gap: 0.55rem;
	}

	.wp-block-button,
	.wp-block-button__link {
		max-width: 100%;
	}

	.wp-block-button__link {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 44px;
		white-space: normal;
		text-align: center;
	}

	.wp-block-table,
	.entry-content table {
		display: block;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.seonami-footer-grid,
	.seonami-footer-columns {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.sn-hero__grid,
	.sn-service-hero__inner,
	.sn-wp-hero__grid {
		grid-template-columns: 1fr !important;
		gap: 1.5rem;
	}

	.sn-section {
		padding: 3rem 0;
	}
}

/* Pricing cards: sticky collapse control while features are open */
.seonami-pricing-card.is-open .seonami-pricing-card__toggle {
	position: sticky;
	bottom: 0.5rem;
	z-index: 2;
	background: #fff;
	box-shadow: 0 -8px 20px rgba(47, 28, 106, 0.08);
}

.seonami-pricing-card.is-featured.is-open .seonami-pricing-card__toggle {
	background: #F4F5FF;
}

.seonami-pricing-card__features-toolbar {
	position: sticky;
	top: 0;
	z-index: 2;
	display: none;
	padding: 0.35rem 0 0.55rem;
	background: linear-gradient(180deg, #fff 65%, rgba(255, 255, 255, 0));
}

.seonami-pricing-card.is-open .seonami-pricing-card__features-toolbar {
	display: block;
}

.seonami-pricing-card.is-featured .seonami-pricing-card__features-toolbar {
	background: linear-gradient(180deg, #F4F5FF 65%, rgba(247, 251, 250, 0));
}

.seonami-pricing-card__features-toolbar .seonami-pricing-card__toggle--top {
	margin-top: 0;
}

/* Mega-nav (home legacy header) — same easy-dismiss pattern */
@media (max-width: 900px) {
	.sn-mega-nav__panel {
		max-height: min(55vh, 380px);
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	.sn-mega-nav__item.is-open .sn-mega-nav__trigger {
		position: sticky;
		top: 0;
		z-index: 2;
		background: #fff;
		box-shadow: 0 6px 14px rgba(47, 28, 106, 0.06);
	}
}

/* Motion: lighter on small screens / reduced motion already in style.css */
@media (max-width: 900px) {
	.sn-wp-hero__orb,
	.sn-wp-hero__grain,
	.sn-wp-hero__frame-shine {
		animation: none !important;
	}

	[data-sn-reveal] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* Coverflow / heavy visuals: don't force desktop weight on phone */
@media (max-width: 767px) {
	.sn-coverflow,
	.sn-design-coverflow {
		min-height: 0;
	}
}