/*==================================================
HERO RESPONSIVE
==================================================*/

/* Large Laptop */
@media (max-width: 1199.98px){

    .hip-hero{
        padding:80px 0;
    }

    .hip-hero__grid{
        gap:50px;
    }

    .hero-right{
        min-height:520px;
    }

    .admit-card{
        max-width:390px;
    }

    .floating-card-1{
        left:0;
    }

    .floating-card-2{
        right:0;
    }

}


/* Tablet */
@media (max-width: 991.98px){

    .hip-hero{
        padding:70px 0 60px;
        text-align:center;
    }

    .hip-hero__grid{

        grid-template-columns:1fr;

        gap:60px;

    }

    .hero-left{

        display:flex;

        flex-direction:column;

        align-items:center;

    }

    .hip-hero h1{

        max-width:700px;

    }

    .hip-hero .lead{

        max-width:650px;

        margin-inline:auto;

    }

    .hip-hero__actions{

        justify-content:center;

    }

    .hero-tags{

        justify-content:center;

    }

    .hip-hero__stats{

        grid-template-columns:repeat(2,1fr);

        width:100%;

        max-width:520px;

        margin:auto;

    }

    .hero-right{

        min-height:auto;

    }

    .floating-card-1{

        top:15px;

        left:20px;

    }

    .floating-card-2{

        right:20px;

        bottom:15px;

    }

}


/* Mobile */
@media (max-width: 767.98px){

    .hip-hero{

        padding:60px 0 50px;

    }

    .hip-hero h1{

        font-size:2.3rem;

        line-height:1.15;

    }

    .hip-hero .lead{

        font-size:1rem;

    }

    .hip-hero__actions{

        width:100%;

        flex-direction:column;

        gap:14px;

    }

    .hip-hero__actions .btn-hip{

        width:100%;

    }

    .hero-tags{

        gap:10px;

    }

    .hero-tags span{

        padding:8px 14px;

        font-size:.82rem;

    }

    .hip-hero__stats{

        grid-template-columns:1fr 1fr;

        gap:18px;

    }

    .hip-hero__stats>div{

        padding-left:14px;

        text-align:left;

    }

    .hero-right{

        padding-top:25px;

    }

    .admit-card{

        max-width:100%;

        transform:none;

    }

    .admit-card:hover{

        transform:translateY(-4px);

    }

    .floating-card-1{

        top:-10px;

        left:10px;

        transform:rotate(-6deg);

    }

    .floating-card-2{

        right:10px;

        bottom:-10px;

        transform:rotate(6deg);

    }

}


/* Small Mobile */
@media (max-width: 575.98px){

    .hip-hero{

        text-align:left;

    }

    .hero-left{

        align-items:flex-start;

    }

    .hip-hero__eyebrow{

        font-size:.7rem;

        letter-spacing:.12em;

    }

    .hip-hero h1{

        font-size:2rem;

    }

    .hip-hero .lead{

        font-size:.95rem;

    }

    .hero-tags{

        justify-content:flex-start;

    }

    .hip-hero__stats{

        grid-template-columns:1fr;

        gap:16px;

    }

    .hip-hero__stats>div{

        width:100%;

    }

    .floating-card-1{

        position:relative;

        top:auto;

        left:auto;

        transform:none;

        margin-bottom:12px;

    }

    .floating-card-2{

        display:none;

    }

    .hero-right{

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:15px;

    }

}

/*==================================================
CONTACT RESPONSIVE
==================================================*/

/* Laptop */
@media (max-width:1199.98px){

    .contact-panel{

        padding:30px;

    }

}

/* Tablet */
@media (max-width:991.98px){

    .contact-hero{

        padding:70px 0;

    }

    .contact-section{

        padding:70px 0;

    }

    .contact-panel{

        padding:28px;

    }

    .contact-panel__header{

        margin-bottom:24px;

        padding-bottom:18px;

    }

    .map-embed{

        aspect-ratio:16/9;

    }

}

/* Mobile */
@media (max-width:767.98px){

    .contact-hero{

        padding:60px 0;

    }

    .contact-hero h1{

        font-size:2.2rem;

    }

    .contact-hero .lead{

        font-size:.98rem;

    }

    .contact-section{

        padding:60px 0;

    }

    .contact-panel{

        padding:24px;

    }

    .contact-panel__header h3{

        font-size:1.3rem;

    }

    .contact-info-icon{

        width:46px;

        height:46px;

        border-radius:14px;

    }

    .map-embed{

        margin-top:24px;

        aspect-ratio:1/1;

    }

}

/* Small Mobile */
@media (max-width:575.98px){

    .contact-panel{

        padding:20px;

    }

    .field{

        margin-bottom:18px;

    }

    .textarea-hip{

        min-height:150px;

    }

    .map-embed__open{

        top:12px;

        left:12px;

        padding:8px 12px;

        font-size:.78rem;

    }

}

/* ---------------------------------------------------------
   VIDEO COURSES — hero stat gap tightens, modal close button
   sits closer to the frame on small screens
   --------------------------------------------------------- */
   @media (max-width: 767px){
    .video-hero__stats{gap:24px;}
    .video-modal__close{top:-42px;}
  }
   
  /* ---------------------------------------------------------
     NOTES — hero stat gap tightens, modal close button sits
     closer to the box on small screens
     --------------------------------------------------------- */
  @media (max-width: 767px){
    .notes-hero__stats{gap:24px;}
    .note-modal__close{top:-42px;}
  }
   
  /* ---------------------------------------------------------  
   QUIZ — finder grid stacks, hero stat gap tightens
   --------------------------------------------------------- */
@media (max-width: 850px){
  .quiz-finder__grid{grid-template-columns:1fr 1fr;}
}
@media (max-width: 767px){
  .quiz-finder{margin-top:-40px; padding:24px;}
  .quiz-finder__grid{grid-template-columns:1fr;}
  .quiz-hero__stats{gap:24px;}
}