/*
Theme Name: AsystYOU Redesign
Theme URI: https://redesign.asystyoutech.com/
Description: AsystYOU Technology redesign — block theme child of Twenty Twenty-Five. Brand greens and yellows matching the live site palette.
Author: AsystYOU Technology
Version: 1.1.0
Template: twentytwentyfive
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: asysty-redesign
*/

:root {
  --asy-green:        #3EB049;
  --asy-green-deep:   #2D8A36;
  --asy-green-darker: #1f5d24;
  --asy-green-text:   #41AF49;
  --asy-yellow:       #F2C413;
  --asy-yellow-deep:  #D4A810;
  --asy-peach:        #FFBC7D;
  --asy-ink:          #3A3B3C;
  --asy-mute:         #6b7176;
  --asy-bg:           #ffffff;
  --asy-tint:         #f3faf4;
  --asy-line:         #e5ecf3;
}

body {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--asy-ink);
  background: var(--asy-bg);
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
  font-family: "Inter", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--asy-green-text);
  line-height: 1.15;
}

.asy-section { padding-block: clamp(3rem, 6vw, 6rem); }
.asy-section--tight { padding-block: clamp(2rem, 4vw, 3.5rem); }
.asy-section--navy {
  background: linear-gradient(135deg, var(--asy-green-darker) 0%, var(--asy-green-deep) 100%);
  color: #fff;
}
.asy-section--navy :where(h1,h2,h3,h4,p) { color: #fff; }
.asy-section--tint  { background: var(--asy-tint); }

.asy-hero {
  background: linear-gradient(135deg, var(--asy-green-darker) 0%, var(--asy-green-deep) 60%, var(--asy-green) 100%);
  color: #fff;
  padding-block: clamp(5rem, 10vw, 9rem);
  position: relative;
  overflow: hidden;
}
.asy-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 360px; height: 360px;
  background: radial-gradient(closest-side, rgba(242,196,19,.35), transparent 70%);
  pointer-events: none;
}
.asy-hero h1, .asy-hero h2, .asy-hero p { color: #fff; }
.asy-hero .wp-block-heading {
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  margin-bottom: 1rem;
}
.asy-hero p {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  max-width: 60ch;
  opacity: 0.95;
}

.asy-eyebrow {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--asy-yellow-deep);
  margin-bottom: 0.75rem;
}
.asy-section--navy .asy-eyebrow,
.asy-hero .asy-eyebrow { color: var(--asy-yellow); }

.asy-card,
.wp-block-group.asy-card {
  background: #fff;
  border: 1px solid var(--asy-line);
  border-radius: 14px;
  padding: 1.75rem;
  box-shadow: 0 1px 2px rgba(31,93,36,.04), 0 10px 24px rgba(31,93,36,.05);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  height: 100%;
}
.asy-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(31,93,36,.06), 0 16px 30px rgba(31,93,36,.10);
  border-color: #cfe6d2;
}
.asy-card h3, .asy-card h4 { margin-top: 0; color: var(--asy-green-text); }
.asy-card .asy-card__icon {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 48px; height: 48px;
  border-radius: 12px;
  background: rgba(62,176,73,.12);
  color: var(--asy-green-deep);
  font-weight: 800;
  margin-bottom: 1rem;
}

.wp-block-button__link,
.wp-block-button.is-style-fill .wp-block-button__link {
  background: var(--asy-green);
  color: #fff;
  border-radius: 6px;
  padding: 0.85rem 1.6rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  border: 2px solid var(--asy-green);
  transition: background .15s ease, border-color .15s ease, transform .15s ease, color .15s ease;
}
.wp-block-button__link:hover {
  background: var(--asy-green-deep);
  border-color: var(--asy-green-deep);
  color: var(--asy-yellow);
  transform: translateY(-1px);
}
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--asy-green);
  border: 2px solid var(--asy-green);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--asy-green);
  color: #fff;
}
.asy-section--navy .wp-block-button.is-style-outline .wp-block-button__link {
  color: #fff; border-color: #fff;
}
.asy-section--navy .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: #fff; color: var(--asy-green-deep);
}

a { color: var(--asy-green-text); text-decoration: none; }
a:hover { color: var(--asy-green-deep); text-decoration: underline; }
.asy-section--navy a { color: var(--asy-yellow); }
.asy-section--navy a:hover { color: #fff; }

.asy-check-list { list-style: none; padding-left: 0; }
.asy-check-list li {
  position: relative;
  padding-left: 1.75rem;
  margin-bottom: 0.6rem;
}
.asy-check-list li::before {
  content: "";
  position: absolute;
  left: 0; top: 0.45em;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: var(--asy-yellow);
  box-shadow: inset 0 0 0 4px #fff, 0 0 0 2px var(--asy-green);
}

.asy-logos img {
  filter: grayscale(100%);
  opacity: 0.7;
  transition: filter .2s ease, opacity .2s ease;
  max-height: 56px;
  width: auto;
}
.asy-logos img:hover { filter: none; opacity: 1; }

.asy-cta-strip {
  background: linear-gradient(90deg, var(--asy-green) 0%, var(--asy-yellow) 100%);
  color: #fff;
  padding-block: clamp(2.5rem, 5vw, 4rem);
  border-radius: 18px;
}
.asy-cta-strip h2, .asy-cta-strip p { color: #fff; }
.asy-cta-strip .wp-block-button__link {
  background: #fff;
  color: var(--asy-green-deep);
  border-color: #fff;
}
.asy-cta-strip .wp-block-button__link:hover {
  background: var(--asy-green-darker);
  color: var(--asy-yellow);
  border-color: var(--asy-green-darker);
}

.wp-block-post-title { font-size: clamp(2rem, 4vw, 3rem); }

/* Header */
.asy-header {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: saturate(180%) blur(8px);
  background: rgba(255,255,255,0.92) !important;
}
.asy-header .wp-block-site-logo img {
  height: auto;
  max-height: 64px;
  width: auto;
  image-rendering: -webkit-optimize-contrast;
}
.asy-header .wp-block-navigation a {
  color: var(--asy-ink);
  font-weight: 600;
}
.asy-header .wp-block-navigation a:hover { color: var(--asy-green-deep); }

/* Submenu dropdowns: the navigation block stamps overlay color classes
   (has-white-color, has-navy-background-color) on the submenu <ul>, but
   the theme palette has no "navy" — so the bg falls through to white and
   the white text disappears. Force ink-on-white, brand green on hover, to
   match the top-level items. !important is required because WP's preset
   color classes are themselves !important. */
.asy-header .wp-block-navigation__submenu-container,
.asy-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  color: var(--asy-ink) !important;
}
.asy-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.asy-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus {
  color: var(--asy-green-deep) !important;
}

@media (max-width: 781px) {
  .asy-header .wp-block-site-logo img { max-height: 48px; }
}

@media (max-width: 600px) {
  .asy-card { padding: 1.25rem; }
  .asy-hero { padding-block: 4rem; }
}