/*
Theme Name: Inspire Success
Theme URI: https://www.inspire-success.net
Description: Child theme of Hello Elementor for Inspire Success Coaching & Consulting — the practice of business coach & consultant America Almeida. Built to be styled with Elementor.
Author: Inspire Success
Template: hello-elementor
Version: 1.0.9
Text Domain: inspire-success
*/

/* ------------------------------------------------------------------
   Brand tokens (sourced from the logo)
   - Red    #ED0D0F  primary / calls to action
   - Gray   #676666  secondary text & accents
   ------------------------------------------------------------------ */
:root {
  --is-red: #ED0D0F;
  --is-red-dark: #C50B0D;   /* hover / active */
  --is-gray: #676666;
  --is-ink: #2A2A2A;        /* body text */
  --is-muted: #6B7280;      /* secondary text */
  --is-bg: #FFFFFF;
  --is-bg-alt: #F7F7F8;     /* alternating sections */
  --is-font-heading: "Poppins", "Helvetica Neue", Arial, sans-serif;
  --is-font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
}

/* Base rhythm — Elementor controls most layout, this is a sane fallback. */
body {
  color: var(--is-ink);
  background-color: var(--is-bg);
  font-family: var(--is-font-body);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--is-font-heading);
  color: var(--is-ink);
}

/* Links: ink by default so red stays reserved for CTAs/accents; red on hover.
   Body/content links get an underline for affordance (nav links don't need it). */
a {
  color: var(--is-ink);
}
a:hover,
a:focus {
  color: var(--is-red);
}
.entry-content a,
.elementor-widget-text-editor a,
.elementor-widget-theme-post-content a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Header: constrain the logo so the hero stays above the fold, and lay the
   header out as a tidy row with the menu tucked in next to the logo. */
.site-header img.custom-logo,
.site-header .site-logo img {
  max-height: 56px;
  width: auto;
}
.site-header {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
/* Hide the redundant header tagline (it also shows in the hero + footer) so the
   branding block shrinks to just the logo. */
.site-header .site-description {
  display: none;
}
/* Pull the menu left, right after the logo, instead of pushing it to the far
   right edge (the branding block no longer needs to be wide). */
.site-header .header-inner {
  justify-content: flex-start;
  gap: 2rem;
}
.site-header .site-branding {
  width: auto;
  flex: 0 0 auto;
}
.site-header .site-navigation ul.menu,
.site-header nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: center;
}
.site-header .menu a {
  font-family: var(--is-font-heading);
  font-weight: 500;
  color: var(--is-ink);
}
.site-header .menu a:hover {
  color: var(--is-red);
}
/* Highlight the "Book Us" item as a button. */
.site-header .menu li.nav-cta a {
  background: var(--is-red);
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 8px;
}
.site-header .menu li.nav-cta a:hover {
  background: var(--is-red-dark);
  color: #fff;
}

/* Language switcher (EN | ES) appended to the header menu. */
.site-header .menu .lang-item a {
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.03em;
}
.site-header .menu .current-lang a {
  color: var(--is-red);
  font-weight: 700;
}

/* Hide the redundant "Home" page-title bar on the front page (the hero is the intro). */
.home .page-header,
.home .entry-title {
  display: none;
}

/* Default button styling for non-Elementor buttons. */
.button,
button,
input[type="submit"] {
  background-color: var(--is-red);
  border-color: var(--is-red);
  color: #fff;
}
.button:hover,
button:hover,
input[type="submit"]:hover {
  background-color: var(--is-red-dark);
  border-color: var(--is-red-dark);
}

/* ------------------------------------------------------------------
   Footer (.isc-footer) — dark charcoal: opposes the light page and
   makes the brand red pop. Light text, red on hover. See footer.php.
   ------------------------------------------------------------------ */
:root {
  --is-footer-bg: #1F2024;    /* deep neutral charcoal */
  --is-footer-ink: #E9EAEC;   /* light text */
  --is-footer-muted: #A9ADB4; /* secondary text */
}
.isc-footer {
  background: var(--is-footer-bg);
  color: var(--is-footer-ink);
  margin-top: 2rem;
}
.isc-footer__inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 3.5rem 20px 2.25rem;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1.3fr;
  gap: 2.5rem;
  align-items: start;
}
/* The logo lockup is on white; sit it on a small white chip so it reads on dark. */
.isc-footer__brand .custom-logo,
.isc-footer__brand img {
  max-height: 56px;
  width: auto;
  background: #fff;
  padding: 10px 14px;
  border-radius: 10px;
}
.isc-footer__blurb {
  margin: 1.1rem 0 0;
  max-width: 34ch;
  color: var(--is-footer-muted);
  font-size: 0.95rem;
  line-height: 1.6;
}
.isc-footer__heading {
  margin: 0 0 0.9rem;
  font-family: var(--is-font-heading);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--is-red);
}
.isc-footer__nav ul,
.isc-footer__contact ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.isc-footer a {
  color: var(--is-footer-ink);
  text-decoration: none;
}
.isc-footer a:hover,
.isc-footer a:focus {
  color: var(--is-red);
}
.isc-footer__contact li,
.isc-footer__place {
  color: var(--is-footer-muted);
}
.isc-footer__bar {
  border-top: 1px solid rgba(255, 255, 255, 0.10);
  padding: 1.1rem 20px;
  text-align: center;
  color: var(--is-footer-muted);
  font-size: 0.85rem;
}
.isc-footer__bar p {
  margin: 0;
}
@media (max-width: 782px) {
  .isc-footer__inner {
    grid-template-columns: 1fr;
    gap: 1.75rem;
    padding-top: 2.5rem;
  }
}

/* ------------------------------------------------------------------
   About page — America's headshot
   She's the lead coach / brand ambassador, not the landing-page focus,
   so keep the portrait modest: half width (~512px of the 1024 "large"
   image) on desktop. Mobile/tablet columns are already narrower than the
   cap, so it just stays fluid there.
   ------------------------------------------------------------------ */
.wp-block-image.is-about-headshot {
  max-width: 512px;
  margin-left: auto;
  margin-right: auto;
}
.wp-block-image.is-about-headshot img {
  width: 100%;
  height: auto;
}
/* About page: center the page title (h1.entry-title, rendered by the theme). */
.is-about-page .entry-title {
  text-align: center;
}