@media(hover:hover) and (pointer:fine){
  .v-card:hover{transform:translateY(-4px);box-shadow:0 24px 44px rgba(15,110,86,0.16);}
  .v-card:hover .v-thumb-img.is-loaded{transform:scale(1.04);}
  .v-card:hover .v-play{transform:translate(-50%,-50%) scale(1.05);}
}

/* TABLET */
@media(max-width: 1024px) and (min-width: 769px) {
  .hero-inner {
    grid-template-columns: minmax(0, 1fr) 200px;
    column-gap: 40px;
  }
  .hero-image-container {
    width: 200px;
    height: 200px;
    max-width: 200px;
    margin-top: clamp(64px, 8vh, 84px) !important;
  }
}

/* MOBILE */
@media(max-width:768px){
  .v-play{width:64px;height:64px;}

  .hero{
    padding:28px 24px;
    margin:12px 12px 10px;
    border-radius:16px;
    box-shadow:0 16px 40px rgba(15,110,86,0.16);
    overflow:visible;
  }

  .hero-inner{
    display:grid !important;
    grid-template-columns:1fr;
    justify-items:center;
    align-items:start;
    column-gap:0 !important;
    overflow:visible;
  }

  .hero-left{
    display:contents;
  }

  .hero-eye{
    order:1;
    grid-column:1;
    width:max-content;
    max-width:calc(100% - 8px);
    font-size:clamp(10px,2.85vw,14px);
    letter-spacing:0.032em;
    white-space:nowrap;
    margin-bottom:16px;
    line-height:1.35;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }

  .hero-h1{
    order:2;
    grid-column:1;
    width:100%;
    font-size:clamp(18px,4.9vw,24px);
    line-height:1.32;
    letter-spacing:-0.015em;
    white-space:normal;
    overflow:visible;
    max-width:none;
    min-height:0 !important;
    text-align:center;
    margin-bottom:8px;
  }

  .hero-image-container {
    order:3;
    grid-column:1;
    position: relative !important;
    flex: 0 0 auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    justify-self: center !important;
    width: 160px !important;
    height: 160px !important;
    max-width: 160px !important;
    margin: 20px auto 28px auto !important;
    display: block !important;
    align-self: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none;
    overflow: hidden;
    z-index: 2;
  }

  .hero-static{
    display:block;
    white-space:nowrap;
  }

  .hero-static::after{
    content:none;
  }

  .hero-tw-line{
    display:block;
    margin-top:4px;
    white-space:nowrap;
    max-width:none;
    overflow:visible;
    width:100%;
  }

  .hero-tw-slot{
    display:inline-block;
    width:auto;
    max-width:none;
    min-width:0 !important;
    min-height:0;
    margin-top:0;
    vertical-align:baseline;
    white-space:nowrap;
    overflow:visible;
  }

  .hero-desc{
    order:4;
    grid-column:1;
    width:100%;
    text-align:center;
    max-width:36em;
    margin-left:auto;
    margin-right:auto;
    text-wrap:balance;
    padding:0 4px;
    margin-bottom:20px;
  }

  .hero-actions {
    order:5;
    grid-column:1;
    width:100%;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .trust-block{
    order:6;
    grid-column:1;
    width:100%;
  }

  .hero-actions .btn-cta-moving-border,
  .hero-actions .btn-secondary{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    padding:14px 20px;
    justify-content:center;
  }

  .hero-profile-img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 auto;
    object-fit: cover;
    object-position: center top;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .hero .avatars{
    display:flex;
    justify-content:center;
  }

  .hero .av img{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
  }

  .photo-circle{width:120px;height:120px;margin-bottom:8px;}

  .trust-row{
    flex-direction:column;
    align-items:center !important;
  }

  .cred-row { justify-content: center !important; }

  .cred-sep{display:none;}

  .about-wrap,.track-grid,.faq-split,.stats-grid,.resource-grid{grid-template-columns:1fr;}

  .about-mini{grid-template-columns:repeat(3,1fr);gap:8px;}

  .about-mc{padding:10px 6px;}

  .about-mn{font-size:15px;}

  .about-ml{font-size:10px;}

  .cert-logos{grid-template-columns:repeat(2,1fr);}

  .sec{padding:44px 20px;}

  .stitle{font-size:24px;}

  .about-p{font-size:13.5px;}

  .cta-p{padding:0 4px;}

  .nav{padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top, 0px));gap:10px;}

  body.mobile-cta-bar-visible{
    padding-bottom:var(--mobile-cta-bar-reserved, 0px);
  }

  .footer:not(.site-footer){
    padding:28px 20px;
    padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px));
  }

  .site-footer{
    padding:24px 16px calc(20px + env(safe-area-inset-bottom, 0px));
    border-radius:0;
  }

  .footer-inner{gap:12px;}

  .footer-social-list{gap:10px;}

  .footer-nav-list > li:not(:last-child)::after{
    margin:0 8px;
  }

  body.mobile-cta-bar-visible .footer:not(.site-footer){
    padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px));
  }

  body.mobile-cta-bar-visible .site-footer{
    padding-bottom:calc(20px + env(safe-area-inset-bottom, 0px));
  }

  .mobile-cta-bar{
    padding-left:max(clamp(12px, 4vw, 16px), env(safe-area-inset-left, 0px));
    padding-right:max(clamp(12px, 4vw, 16px), env(safe-area-inset-right, 0px));
  }

  .mobile-cta-bar-link{
    max-width:100%;
  }

  .nav-logo{white-space:nowrap;}

  .nav-links{display:none;}

  .nav-actions{margin-left:auto;gap:8px;}

  .nav-menu-btn{display:flex;}

  .nav-cta{padding:10px 16px;font-size:12px;}

  .nav-actions > .nav-cta{display:none;}

  .nav-secondary{display:none;}

  .hero-actions{flex-direction:column;align-items:stretch !important;}

  .gc-actions,.cta-actions{flex-direction:column;align-items:center;}

  .gc-actions,.cta-actions{align-items:stretch;}

  .hero-actions .btn-cta-moving-border{width:100%;box-sizing:border-box;}

  .btn-secondary,.gc-btn-secondary{width:100%;}

  .carousel-outer,.video-carousel-outer{padding:0 28px;}

  .carousel-arrow,.vid-arrow{width:36px;height:36px;font-size:18px;}

  .quiz-bar{
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    padding:16px;
    gap:8px;
  }

  .quiz-bar-btn{padding:0;}

  .res-actions{flex-direction:column;align-items:stretch;}

  .contact-btns-wrap { flex-direction: column; align-items: stretch; }

  .contact-btns-wrap .gc-btn { width: 100%; text-align: center; }

  .mobile-cta-group .nav-cta {
    white-space: nowrap;
    text-align: center;
    display: inline-flex;
    width: 100%;
    padding: 14px;
    font-size: 15px;
    border-radius: 999px;
  }

  .acc-body{padding-left:20px;}

  .faq-ans{padding-left:18px;}
}

@media(max-width:480px){
  .hero-h1{
    font-size:clamp(17px,4.65vw,21px);
  }
}
