.elementor-kit-445{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-445 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ======================================================
   GLOBAL DESIGN SYSTEM (Typography, Buttons, Containers)
   ====================================================== */

/* 1. TYPOGRAPHY & BASE */
body, p, li {
    font-family: 'Inter', sans-serif;
    font-size: 16px !important;
    line-height: 1.65 !important;
    color: #1e1e1e;
}

h1, h2, h3, h4 {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: #0b3f46;
    margin-bottom: 12px;
}

h1 { font-size: 42px !important; line-height: 1.2 !important; }
h2 { font-size: 30px !important; line-height: 1.25 !important; }
h3 { font-size: 24px !important; }
h4 { font-size: 20px !important; }

/* Responsive Typography */
@media (max-width: 1024px) {
    h1 { font-size: 36px !important; }
    h2 { font-size: 28px !important; }
}

@media (max-width: 768px) {
    body, p, li { font-size: 15px !important; }
    h1 { font-size: 30px !important; }
    h2 { font-size: 24px !important; }
}

@media (max-width: 480px) {
    h1 { font-size: 26px !important; }
}

/* 2. LAYOUT & SPACING */
section, .elementor-section {
    padding: 50px 0 !important;
}

.elementor-section .elementor-container {
    max-width: 1200px;
    margin: 0 auto;
}

/* 3. BUTTONS (Teal & Secondary) */
.elementor-button {
    background-color: #0098A4;
    color: #ffffff;
    padding: 14px 32px;
    border-radius: 50px;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s ease;
}

.elementor-button:hover {
    background-color: #007f8a;
    transform: translateY(-2px);
}

/* Secondary/Outline Button Class: .button-secondary */
.button-secondary .elementor-button {
    background: transparent !important;
    border: 2px solid #0098A4;
    color: #0098A4 !important;
}

.button-secondary .elementor-button:hover {
    background: #0098A4 !important;
    color: #ffffff !important;
}

/* 4. IMAGES (Global Defaults) */
img {
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    transition: transform 0.3s ease;
}

img:hover {
    transform: translateY(-4px);
}

/* 5. ICON LISTS (Checkmarks) */
.elementor-widget-icon-list .elementor-icon-list-icon i {
    color: #0098A4 !important;
    font-size: 18px;
}

.elementor-icon-list-text {
    font-size: 16px;
    line-height: 1.6;
}

.elementor-widget-icon-list .elementor-icon-list-item {
    margin-bottom: 6px;
}

/* 6. CARD SYSTEM (For Testimonials) Class: .jw-card */
.jw-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 28px;
    box-shadow: 0 12px 30px rgba(0,0,0,0.06);
    transition: all 0.3s ease;
    border: 1px solid #f0f0f0;
}

.jw-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 35px rgba(0,0,0,0.1);
}

.jw-card p {
    font-size: 16px;
    line-height: 1.6;
}

/* ======================================================
   SECTION SPECIFIC STYLING (Apply these classes to Containers)
   ====================================================== */

/* --- HERO SECTION (.hero-section) --- */
.hero-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.hero-text { max-width: 540px; }
.hero-text h1 { margin-bottom: 14px !important; }
.hero-text p { max-width: 480px; margin-bottom: 26px !important; color: #3a3a3a; }

.hero-cta { display: flex; flex-wrap: wrap; gap: 14px; }

.hero-book-image img {
    width: 100%;
    max-width: 300px;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}

/* --- ABOUT AUTHOR (.about-section) --- */
.about-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.about-image img {
    max-width: 360px;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 12px;
}

.about-text { max-width: 630px; }
.about-text h2 { margin-bottom: 16px !important; }
.about-text p { margin-bottom: 18px !important; color: #3a3a3a; }
.about-text .elementor-social-icons-wrapper { margin-top: 18px; gap: 12px; }
.about-text .elementor-button { margin-top: 12px; }


/* --- THE BOOK SECTION (.book-section) --- */
.book-section {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.book-image img {
    max-width: 320px;
    width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
}

.book-text { max-width: 650px; }
.book-text h2 { margin-bottom: 16px !important; }
.book-text > p { margin-bottom: 20px !important; color: #3a3a3a; max-width: 600px; }
.book-text .elementor-button { margin-top: 18px; }


/* --- WHY THIS BOOK MATTERS (.why-section) --- */
.why-section {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* Ensure flex alignment for Why, Speaking, Resources */
.why-section .elementor-container,
.workshops-section .elementor-container,
.resources-section .elementor-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.why-text { max-width: 600px; }
.why-text p { margin-bottom: 18px; color: #3a3a3a; }
.why-image img { max-width: 360px; width: 100%; height: auto; object-fit: cover; border-radius: 14px; margin-top: 10px; }


/* --- PRAISE / TESTIMONIALS (.praise-section) --- */
.praise-section {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    padding-top: 30px !important;
    padding-bottom: 40px !important;
}

.praise-intro { max-width: 340px; }
.praise-intro h2 { margin-bottom: 10px !important; }
.praise-intro p { margin-bottom: 18px !important; color: #3a3a3a; }
.praise-intro .elementor-button { margin-top: 6px; }

.praise-list { flex: 1; display: flex; flex-direction: column; gap: 16px; }
.praise-list .jw-card { padding: 22px; }
.praise-list .jw-card p { font-size: 15px; line-height: 1.6; }


/* --- WORKSHOPS / SPEAKING (Direct Method) --- */

/* 1. The Main Wrapper (Keep this) */
.workshops-section {
    /* This ensures the background and spacing works */
    display: flex; 
    flex-wrap: wrap; /* Allows stacking on mobile */
    gap: 40px;
    align-items: center;
}

/* 2. The Text Column (Left) */
.ws-text-col {
    flex: 1; /* Takes up available space */
    min-width: 300px; /* Prevents squishing */
}

.ws-text-col p {
    margin-bottom: 18px !important;
    line-height: 1.65;
}

/* 3. The Image Column (Right) */
.ws-image-col {
    flex: 0 0 auto; /* Don't stretch the box */
}

/* Target the image INSIDE the right column */
.ws-image-col img {
    max-width: 360px; /* Matches your design size */
    width: 100%;
    height: auto;
    border-radius: 14px; /* Rounded corners */
    box-shadow: 0 12px 30px rgba(0,0,0,0.10); /* The Shadow */
}

/* MOBILE FIX for Direct Method */
@media (max-width: 768px) {
    .ws-image-col {
        width: 100%;
        display: flex;
        justify-content: center;
    }
    .ws-image-col img {
        max-width: 100%;
    }
}


/* --- FOOTER (.site-footer) --- */
.site-footer {
    background-color: #0F172A; /* Dark Navy/Black */
    padding: 40px 0;
    color: #ffffff;
}
.site-footer p, .site-footer a { color: #cbd5e1 !important; font-size: 14px !important; }
.site-footer i { color: #ffffff !important; }


/* ======================================================
   MOBILE RESPONSIVENESS (Global Fixes)
   ====================================================== */

/* TABLET (Max Width 1024px) */
@media (max-width: 1024px) {
    .hero-section, .about-section, .book-section, .praise-section { gap: 32px; }
    
    .why-section .elementor-container, 
    .workshops-section .elementor-container, 
    .resources-section .elementor-container {
        gap: 32px;
    }

    .hero-book-image img, .about-image img, .book-image img, 
    .why-image img, .workshops-section img, .resources-image img {
        max-width: 300px;
    }
}

/* MOBILE (Max Width 768px) */
@media (max-width: 768px) {
    /* Stack all main sections */
    .hero-section, .about-section, .book-section, .praise-section,
    .why-section .elementor-container, 
    .workshops-section .elementor-container, 
    .resources-section .elementor-container {
        flex-direction: column;
        text-align: center;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
        gap: 24px;
    }

    /* Reset width constraints for text on mobile */
    .hero-text, .about-text, .book-text, .why-text, 
    .praise-intro, .praise-list, .resources-text {
        max-width: 100%;
    }

    /* Center Buttons on Mobile */
    .elementor-button { margin-left: auto; margin-right: auto; }
    .hero-cta { justify-content: center; }

    /* Fix Image Sizes on Mobile */
    .hero-book-image img, .about-image img, .book-image img, 
    .why-image img, .workshops-section img, .resources-image img {
        max-width: 240px; 
        margin-bottom: 10px;
    }

    /* Specific fix for workshop ordering/centering */
    .workshops-section > .elementor-container:nth-child(2) {
        justify-content: center;
    }
}
/* --- CONTACT FORM (Clean Underline Style) --- */

/* Target the specific form we named */
.clean-underline-form .elementor-field {
    background-color: transparent !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid #ccc !important; /* Grey line */
    border-radius: 0 !important;
    padding-left: 0 !important;
    box-shadow: none !important;
}

/* When you click the field, make the line Teal */
.clean-underline-form .elementor-field:focus {
    border-bottom: 2px solid #0098A4 !important;
}

/* Style the Submit Button */
.clean-underline-form .elementor-button {
    width: 100%;
    background-color: #0098A4;
    border-radius: 0; /* Square edges or keep rounded if you prefer */
    font-weight: 600;
    text-transform: uppercase;
    margin-top: 10px;
}

/* =========================
   HERO: Premium Composite (No-HTML version)
   ========================= */

.hero-section { display:flex; align-items:center; justify-content:space-between; gap:40px; padding-top:20px !important; padding-bottom:20px !important; }
.hero-text { max-width:520px; }
.hero-lead { font-size:18px; line-height:1.6; color:#2e3a3a; margin-bottom:18px; }
.hero-subline { color:#13555f; font-weight:500; font-size:15px; }

/* Composite wrapper — apply this class to the column/container holding the images */
.hero-image-composite {
    position: relative;
    width: 360px;
    height: 420px;
    display:block;
    margin-left:10px;
}

/* Decorative background (use as column background or an Image widget inside composite column) */
.hero-image-composite .ai-abstract {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 18px;
    filter: saturate(110%) blur(2px);
    transform: scale(1.05);
    z-index: 1;
    box-shadow: 0 20px 60px rgba(3,40,45,0.25);
    opacity: 0.98;
}

/* Foreground author portrait — add class to the portrait Image widget */
.hero-image-composite .author-portrait {
    position: absolute;
    right: 12px;
    bottom: 0;
    width: 60%;
    max-width: 240px;
    height: auto;
    border-radius: 12px;
    z-index: 3;
    object-fit: cover;
    box-shadow: 0 18px 40px rgba(0,0,0,0.18);
    transition: transform 0.35s ease;
}

/* Small floating book cover — add class to that Image widget */
.hero-image-composite .book-card {
    position: absolute;
    left: -12px;
    top: -12px;
    width: 110px;
    height: auto;
    border-radius: 10px;
    z-index: 4;
    box-shadow: 0 12px 36px rgba(0,0,0,0.2);
    transform: rotate(-3deg);
    border: 3px solid rgba(255,255,255,0.5);
}

/* Hover micro interactions */
.hero-image-composite:hover .author-portrait { transform: translateY(-6px); }
.hero-image-composite:hover .book-card { transform: translateY(-6px) rotate(-2deg); }

/* Mobile responsive tweaks */
@media (max-width: 768px) {
  .hero-section { flex-direction:column-reverse; text-align:center; gap:20px; padding-top:30px !important; padding-bottom:30px !important; }
  .hero-image-composite { width:280px; height:330px; margin:0 auto; }
  .hero-image-composite .author-portrait { right:0; left:50%; transform:translateX(-10%) translateY(0); width:56%; }
  .hero-image-composite .book-card { display:none; }
  .hero-lead { margin-left:auto; margin-right:auto; max-width:95%; }
}

/* OPTION 1 — SIMPLE HERO (Book on Right) */
.hero-image img {
    max-width: 320px;
    width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}

.hero-section {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* On mobile: center everything */
@media (max-width: 768px) {
  .hero-section {
      flex-direction: column;
      text-align: center;
      gap: 20px;
  }
  .hero-image img {
      max-width: 240px;
      margin: 0 auto;
  }
}

/* Refinement: About section immediate polish */
.about-section { padding-top:28px !important; padding-bottom:28px !important; gap:28px !important; align-items:center; }

/* Byline (separate widget) */
.about-byline {
  font-family: 'Poppins', sans-serif;
  font-weight:700;
  color:#0b3f46;
  font-size:16px;
  margin-bottom:10px;
  line-height:1.25;
}

/* Body text styling */
.about-body {
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.65;
  color:#2f3336;
  max-width: 640px;     /* keeps line length readable */
}

/* Image polish */
.about-image img {
  max-width:360px;
  width:100%;
  height:auto;
  border-radius:12px;
  box-shadow: 0 26px 70px rgba(3,40,45,0.12);
  border: 1px solid rgba(0,0,0,0.03);
  display:block;
  margin-left:auto;
  margin-right:auto;
}

/* Layout: left image, right text on desktop; stacked on mobile */
@media (min-width: 769px) {
  .about-section { display:flex; flex-direction:row; text-align:left; }
  .about-image { flex: 0 0 360px; }
  .about-text { flex:1; padding-left:22px; }
}
@media (max-width: 768px) {
  .about-section { display:flex; flex-direction:column; text-align:center; }
  .about-text { padding-left:0; }
  .about-body, .about-byline { text-align:center; }
  .about-image img { max-width:260px; }
}

/* CTA row */
.about-cta { display:flex; gap:14px; align-items:center; margin-top:14px; justify-content:flex-start; }
@media (max-width:768px){ .about-cta { justify-content:center; } }
.about-byline {
    font-size: 17px;
    font-weight: 500;
    color: #13555f;
    margin-bottom: 16px !important;
    line-height: 1.5;
}
html {
  scroll-behavior: smooth;
}/* End custom CSS */