/* Theme integration fixes. Kept separate so they can also be applied to 1.2.0. */
.prosyo-theme .page-wrapper > .blank-section { display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; }
.prosyo-theme .header-section { position: relative; top: auto; }
.prosyo-theme .brand-logo { height: auto !important; object-fit: contain; }
.prosyo-theme .prosyo-mega-panel { top: 10px; padding-top: 44px; }
.prosyo-theme .blog-details-image-block + .blog-details-desp-block { margin-top: clamp(36px, 5vw, 72px); }
.prosyo-theme .blog-details-desp-block { gap: clamp(24px, 4vw, 56px); }
.prosyo-theme .blog-details-desp-wrap { flex: 1 1 0; min-width: 0; max-width: 800px; }
.prosyo-theme .blog-details-card-wrap { flex: 0 0 300px; min-width: 0; max-width: 300px; }
.prosyo-theme .prosyo-entry-content { width: min(100%, 860px); }
.prosyo-theme .prosyo-entry-tools .prosyo-entry-content { width: 100%; }
.prosyo-theme .prosyo-entry-media { aspect-ratio: auto; }
.prosyo-theme .prosyo-entry-media .section-image { height: auto; object-fit: contain; }
.prosyo-theme .prosyo-entry-media .section-overlay { display: none; }
/* A missing image is valid content, and must never collapse the title panel. */
.prosyo-theme .latest-card:not(.side) { opacity: 1 !important; visibility: visible !important; transform: none !important; }
.prosyo-theme .latest-card:not(.side) .latest-image-block:has(img) { aspect-ratio: 16 / 11; }
.prosyo-theme .latest-card:not(.side) .latest-image-block img { width: 100%; height: 100%; object-fit: cover; }
.prosyo-theme .latest-card:not(.side) .latest-details-block { background: linear-gradient(180deg,#09051de8,#13082df5); backdrop-filter: blur(14px); }
.prosyo-theme .latest-card:not(.side):not(:has(.latest-image-block img)) { border: 1px solid #ffffff24; background: radial-gradient(ellipse at 0 0,#67259a22,transparent 70%),#ffffff03; }
.prosyo-theme .latest-card:not(.side):not(:has(.latest-image-block img)) .latest-details-block {
  position: static; display: flex; flex-direction: column; justify-content: center;
  min-height: 300px; padding: clamp(24px, 4vw, 48px); gap: 24px; background: transparent; backdrop-filter: none;
}
.prosyo-theme :is(.latest-image-block,.recent-image-block):not(:has(img)),
.prosyo-theme .blog-image-card:not(:has(img)) { display: none; }
.prosyo-theme .recent-card { align-items: flex-start; }
.prosyo-theme .recent-image-block { width: 76px; max-width: 76px; flex: 0 0 76px; aspect-ratio: 1; }
.prosyo-theme .recent-image-block img { width: 100%; height: 100%; object-fit: cover; }
.prosyo-theme .recent-details-block { flex: 1 1 0; min-width: 0; }
.prosyo-theme .recent-name { font-size: 16px; line-height: 1.5; }
.prosyo-theme .blog-details-card .blog-info-wrap { gap: 8px; flex-wrap: wrap; }
.prosyo-theme .blog-details-card .blog-info-text { font-size: 12px; line-height: 1.6; }
.prosyo-theme .blog-details-card .blog-category { white-space: normal; }
.prosyo-theme .wp-block-post-content > :is(p,h1,h2,h3,h4,h5,h6,ul,ol,blockquote,figure,pre,.wp-block-group,.wp-block-columns,.wp-block-buttons) {
  max-width: min(860px, calc(100% - 40px)); margin-inline: auto;
}
.prosyo-theme .wp-block-post-content > .alignwide { max-width: min(1170px, calc(100% - 40px)); }
.prosyo-theme .wp-block-post-content > .alignfull { max-width: 100%; }
.prosyo-theme .prosyo-ft-seo-content { max-width: 860px; margin: clamp(48px,6vw,88px) auto 0; }
.prosyo-theme .prosyo-ft-seo-content section { margin-bottom: clamp(36px,5vw,64px); }
.prosyo-theme .prosyo-ft-seo-content .prosyo-seo-cta { background: #120920; border-color: #ffffff24; }
/* Plugin owns behavior; these scoped rules own its presentation on this theme.
 * Specificity beats the plugin's Canvas/light surface and sasi button styles. */
.prosyo-theme .prosyo-ft, .prosyo-theme .prosyo-ft-directory {
  --prosyo-accent: #b638ff; --prosyo-accent-2: #7350ff;
  --prosyo-border: #ffffff26; --prosyo-muted: #aaa4bd;
  color: #b7b4c8; font-family: Inter,sans-serif; letter-spacing: -.012em; color-scheme: dark;
}
.prosyo-theme .prosyo-ft .prosyo-ft-form {
  display: grid; width: min(100%,860px); margin: 0 auto; gap: 24px;
  padding: clamp(22px,4vw,40px); border: 1px solid #ffffff24; border-radius: 22px;
  background: #0e091e; box-shadow: 0 18px 60px #00000024;
}
.prosyo-theme .prosyo-ft .prosyo-ft-fields {
  display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; min-width: 0;
}
.prosyo-theme .prosyo-ft .prosyo-ft-field { gap: 9px; min-width: 0; margin: 0; font: inherit; }
.prosyo-theme .prosyo-ft .prosyo-ft-field:has(textarea),
.prosyo-theme .prosyo-ft .prosyo-ft-field:has(input[type="url"]),
.prosyo-theme .prosyo-ft .prosyo-ft-field:last-child:nth-child(odd) { grid-column: 1 / -1; }
.prosyo-theme .prosyo-ft .prosyo-ft-field > span { color: #e9e4f2; font-size: 14px; font-weight: 500; line-height: 1.5; opacity: 1; }
.prosyo-theme .prosyo-ft .prosyo-ft-field b { color: #d6a5ff; margin-left: 4px; }
.prosyo-theme .prosyo-ft .prosyo-ft-field :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),textarea,select) {
  appearance: auto; box-sizing: border-box; width: 100%; min-width: 0; min-height: 52px;
  padding: 14px 16px; border: 1px solid #ffffff2b !important; border-radius: 10px !important;
  background: #060312 !important; color: #f3f3f3 !important;
  font: 400 16px/1.5 Inter,sans-serif !important; letter-spacing: normal;
  box-shadow: none; transition: border-color .2s,box-shadow .2s;
}
.prosyo-theme .prosyo-ft .prosyo-ft-field textarea { min-height: 144px; resize: vertical; }
.prosyo-theme .prosyo-ft .prosyo-ft-field :is(input,textarea)::placeholder { color: #8e879f; opacity: 1; }
.prosyo-theme .prosyo-ft .prosyo-ft-field :is(input,textarea,select):focus {
  outline: none; border-color: #b678eb !important; box-shadow: 0 0 0 3px #a156de26;
}
.prosyo-theme .prosyo-ft .prosyo-ft-field :is(input,textarea,select)[aria-invalid="true"] { border-color: #ff9baa !important; }
.prosyo-theme .prosyo-ft .prosyo-ft-primary {
  width: fit-content; min-width: 170px; min-height: 50px; padding: 14px 26px;
  border: 1px solid #a769e5 !important; border-radius: 9px !important;
  background: linear-gradient(180deg,#5c2494,#260f4b) !important; color: #f4e9ff !important;
  font: 600 16px/1.4 Inter,sans-serif !important; text-decoration: none;
  box-shadow: inset 0 0 16px #aa60f340,0 6px 22px #23073850 !important;
  transition: border-color .2s,box-shadow .2s,translate .2s;
}
.prosyo-theme .prosyo-ft .prosyo-ft-primary:hover:not(:disabled) { border-color: #d49dff !important; translate: 0 -2px; }
.prosyo-theme .prosyo-ft :is(.prosyo-ft-primary,.prosyo-ft-copy):focus-visible { outline: 2px solid #d6a5ff; outline-offset: 4px; }
.prosyo-theme .prosyo-ft .prosyo-ft-primary:disabled { cursor: wait; opacity: .6; translate: none; }
.prosyo-theme .prosyo-ft .prosyo-ft-status { min-height: 0; font-size: 14px; line-height: 1.6; }
.prosyo-theme .prosyo-ft .prosyo-ft-status:empty { display: none; }
.prosyo-theme .prosyo-ft .prosyo-ft-status.is-error { color: #ffabb9; }
.prosyo-theme .prosyo-ft :is(.prosyo-ft-gate,.prosyo-ft-result) { border-color: #ffffff26; background: #120b24 !important; color: #ddd5eb; }
.prosyo-theme .prosyo-ft .prosyo-ft-result { width: min(100%,860px); margin: 24px auto 0; padding: 26px; }
.prosyo-theme .prosyo-ft .prosyo-ft-result-content { padding: 0; overflow-wrap: anywhere; font-size: 16px; line-height: 1.8; }
.prosyo-theme .prosyo-ft .prosyo-ft-copy {
  position: static; display: block; margin: 0 0 16px auto; min-height: 40px;
  padding: 8px 16px; background: #24133c !important; border: 1px solid #ffffff38; color: #f0e3ff; font-size: 14px;
}
.prosyo-theme .prosyo-ft [hidden] { display: none !important; }
.prosyo-theme .prosyo-ft-directory-card { background: #0e091e; box-shadow: none; }
.prosyo-theme .prosyo-ft .prosyo-seo-button { background: linear-gradient(180deg,#5c2494,#260f4b); border: 1px solid #a769e5; font-size: 16px; }
.prosyo-theme .prosyo-ft .prosyo-seo-link { color: #d6a5ff !important; }
@media (max-width: 991px) {
  .prosyo-theme .prosyo-mega-panel { padding-top: 0; }
  .prosyo-theme .blog-details-desp-wrap, .prosyo-theme .blog-details-card-wrap { width: 100%; max-width: 100%; flex-basis: auto; }
  .prosyo-theme .blog-details-card-wrap { margin-top: 24px; }
  .prosyo-theme .blog-details-image-block + .blog-details-desp-block { margin-top: 36px; }
}
@media (max-width: 640px) {
  .prosyo-theme .prosyo-ft .prosyo-ft-fields, .prosyo-theme .prosyo-ft .prosyo-ft-gate-grid { grid-template-columns: minmax(0,1fr); }
  .prosyo-theme .prosyo-ft .prosyo-ft-primary { width: 100%; min-width: 0; }
  .prosyo-theme .prosyo-ft .prosyo-ft-form { padding: 22px 18px; border-radius: 16px; gap: 22px; }
  .prosyo-theme .prosyo-ft .prosyo-ft-result { padding: 20px; }
  .prosyo-theme .latest-card:not(.side):not(:has(.latest-image-block img)) .latest-details-block { min-height: 240px; }
}

/*
 * Footer social links.
 *
 * The export left these as bare 24px glyphs in the paragraph colour, which
 * reads as an afterthought next to the rest of the footer. They become proper
 * targets here - a bordered chip on the card surface, matching the theme's own
 * card/stroke tokens - and pick up the brand colour on hover. Sizing is the
 * only thing the original rule set, so nothing else is being overridden.
 */
.prosyo-theme .footer-social {
	gap: 12px;
	flex-wrap: wrap;
}

.prosyo-theme .footer-social-link {
	width: 40px;
	height: 40px;
	border: 1px solid var(--stoke, #ffffff1a);
	border-radius: 10px;
	background-color: var(--card, #ffffff08);
	color: var(--text, #f3f3f3);
	transition: color .3s ease, border-color .3s ease, background-color .3s ease, transform .3s ease;
}

.prosyo-theme .footer-social-link svg {
	width: 18px;
	height: 18px;
	display: block;
}

.prosyo-theme .footer-social-link:hover,
.prosyo-theme .footer-social-link:focus-visible {
	color: #fff;
	border-color: var(--button, #863aff);
	background-color: color-mix(in srgb, var(--button, #863aff) 22%, transparent);
	transform: translateY(-2px);
}

/* color-mix is widely supported; this keeps older engines on a solid tint. */
@supports not (background-color: color-mix(in srgb, #000 20%, transparent)) {
	.prosyo-theme .footer-social-link:hover,
	.prosyo-theme .footer-social-link:focus-visible {
		background-color: rgba(134, 58, 255, .22);
	}
}

/*
 * Footer menu columns.
 *
 * The export's grid is three fixed columns inside a capped width. Assigning a
 * fourth or fifth footer menu widens the grid to match instead of wrapping the
 * extra column onto its own row. Every rule is gated on a fourth column
 * actually existing, so a three-column footer renders exactly as before.
 * Browsers without :has() simply keep the original grid and wrap, which is
 * untidy but never broken.
 */
.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(4)) {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 760px;
}

.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(5)) {
	grid-template-columns: repeat(5, minmax(0, 1fr));
	max-width: 900px;
}

@media (min-width: 1440px) {
	.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(4)) {
		max-width: 880px;
	}

	.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(5)) {
		max-width: 1040px;
	}
}

@media (max-width: 991px) {
	/* Two tidy rows read better than five hairline columns on a tablet. */
	.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(4)),
	.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(5)) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		max-width: 480px;
	}
}

@media (max-width: 767px) {
	.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(4)),
	.prosyo-theme .footer-menu-block:has(.footer-nav-wrap:nth-child(5)) {
		max-width: 100%;
	}
}

/*
 * The article sidebar's call to action carries two buttons. They stack full
 * width in a column that narrow, so the secondary one reads as the quieter
 * option rather than being squeezed beside the primary.
 */
.prosyo-theme .blog-details-cta-button {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: stretch;
}

.prosyo-theme .blog-details-cta-button > .button {
	width: 100%;
	justify-content: center;
}
