/* index.css - Homepage-specific styles only */
.hero {
    /* min-height:100vh;  */
	display:flex; align-items:center; justify-content:center;
    padding:160px 5% 100px; position:relative; background:#b1413d; color:#fff; overflow:hidden;
}
.hero::before {
    content:''; position:absolute; inset:0;
    background:url('../images/img1.jpeg') center/cover no-repeat;
    opacity:0.35;
}
.hero-content { max-width:1400px; margin:auto; display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; z-index:2; }
.hero-text h1 { font-family:'Playfair Display',serif; font-size:5.5rem; line-height:1.1; margin-bottom:1rem; text-shadow:0 5px 20px rgba(0,0,0,.3); }
.hero-text h1 span { color:var(--gold); }
.hero-text .subtitle { font-size:1.4rem; margin:1.5rem 0 2.5rem; opacity:.95; font-weight:500; }
.cta-group { display:flex; gap:1.8rem; flex-wrap:wrap; }

.hero-visual { text-align:center; }
.car-container { position:relative; display:inline-block; }
.floating-car img {
    max-width:460px; width:100%; border-radius:25px; border:8px solid #fff;
    box-shadow:0 25px 60px rgba(0,0,0,.3); animation:float 4s infinite ease-in-out;
}

/* Pricing Carousel (homepage version) */
.pricing-area { padding:120px 0; background:var(--light-bg); position:relative; overflow:hidden; }
.pricing-area .shape-top-right { position:absolute; top:50px; right:0; width:15%; opacity:0.6; z-index:0; }
.pricing-area .shape-top-right img { width:100%; }
.visa-category-items { margin-top:80px; position:relative; z-index:1; }

.visa-cat-style-one {
    background:#fff; border-radius:15px; overflow:hidden; box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:var(--transition); height:100%; display:flex; flex-direction:column;
}
.visa-cat-style-one:hover { transform:translateY(-15px); box-shadow:0 25px 50px rgba(220,53,69,.2); }
.visa-cat-style-one .thumb { position:relative; height:250px; overflow:hidden; }
.visa-cat-style-one .thumb img { width:100%; height:100%; object-fit:cover; transition:var(--transition); }
.visa-cat-style-one:hover .thumb img { transform:scale(1.1); }
.visa-cat-style-one .shape { position:absolute; bottom:-1px; left:0; width:100%; }
.visa-cat-style-one .icon {
    position:absolute; bottom:20px; left:50%; transform:translateX(-50%);
    background:#fff; height:90px; width:90px; border-radius:50%; display:flex;
    align-items:center; justify-content:center; border:6px solid #fff; box-shadow:0 10px 30px rgba(0,0,0,.2);
}
.visa-cat-style-one .icon img { height:50px; }
.visa-cat-style-one .info { padding:40px 30px 30px; text-align:center; flex-grow:1; }
.visa-cat-style-one .info h4 { font-size:26px; margin-bottom:15px; color:var(--navy); }
.visa-cat-style-one .info p { color:var(--gray); margin-bottom:25px; }
.visa-cat-style-one .price-list { margin:20px 0; font-size:19px; font-weight:700; line-height:2.2; }
.visa-cat-style-one .price-list strong { color:var(--red); font-size:24px; }
.visa-cat-style-one .button { background:#b1413d; padding:18px; text-align:center; margin-top:auto; }
.visa-cat-style-one .button a { color:#fff; font-weight:700; font-size:17px; display:flex; align-items:center; justify-content:center; gap:10px; }
.visa-cat-style-one .button a i { font-size:22px; }

/* Service Areas - homepage layout */
.service-areas {
    padding: 120px 5%;
    background: linear-gradient(135deg, #fff 0%, #f8f8f8 100%);
    position: relative;
}
.service-areas::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: url('https://images.unsplash.com/photo-1571607387386-270c8cfad008?ixlib=rb-4.0.3&auto=format&fit=crop&w=1500&q=80') center/cover no-repeat;
    opacity: 0.05; z-index: 0;
}
.visa-country-style-six-area { position: relative; z-index: 1; }

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    align-items: start;
}
.service-heading {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
}
.services-grid > .service-heading { grid-column: 1 / 2; }

.visa-cat-style-six-item {
    background:url('https://wordpress.validthemes.net/visaco/wp-content/uploads/2025/07/map-mini.png') center/cover no-repeat;
    border-radius:15px; overflow:hidden; box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:var(--transition); height:100%; margin-bottom:30px;
}
.visa-cat-style-six-item:hover { transform:translateY(-15px); box-shadow:0 25px 50px rgba(220,53,69,.2); }
.visa-cat-style-six-item .top {
    display:flex; align-items:center; gap:25px; padding:40px 35px 0;
    background:rgba(255,255,255,.95);
}
.visa-cat-style-six-item .flag {
    width:90px; height:90px; border-radius:50%; overflow:hidden;
    border:6px solid #fff; box-shadow:0 10px 30px rgba(0,0,0,.2); flex-shrink:0;
}
.visa-cat-style-six-item .flag img { width:100%; height:100%; object-fit:cover; }
.visa-cat-style-six-item .country h4 { font-size:24px; margin:0 0 8px; color:var(--navy); }
.visa-cat-style-six-item .country span { font-size:16px; color:var(--gray); }
.visa-cat-style-six-item ul {
    list-style:none; margin:30px 35px 35px; padding:0;
    background:rgba(255,255,255,.95); border-radius:0 0 15px 15px;
}
.visa-cat-style-six-item ul li {
    padding:12px 0; font-size:17px; border-bottom:1px solid rgba(0,0,0,.05);
}
.visa-cat-style-six-item ul li:last-child { border:none; }





/* FAQ SECTION - COLLAPSIBLE */
.faq-accordion {
    max-width: 900px;
    margin: 0 auto;
}
.faq-item {
    background: #fff;
    margin-bottom: 1rem;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}
.faq-question {
    padding: 1.8rem 2rem;
    background: #b1413d;
    color: #fff;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 1.25rem;
    transition: all .3s;
}
.faq-question:hover { background: #b1413d; }
.faq-question i { transition: transform .3s; }
.faq-item.active .faq-question i { transform: rotate(180deg); }
.faq-answer {
    padding: 0 2rem;
    max-height: 0;
    overflow: hidden;
    transition: all .4s ease;
    background: #f9f9f9;
}
.faq-item.active .faq-answer {
    padding: 2rem;
    max-height: 300px;
}

/* HELPFUL LINKS - 3D CARDS */
.links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-top: 4rem;
}
.link-card {
    background: #fff;
    padding: 2.5rem 2rem;
    border-radius: 18px;
    text-align: center;
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
    transition: all .4s ease;
    text-decoration: none;
    color: var(--navy);
}
.link-card:hover {
    transform: translateY(-15px);
    box-shadow: 0 30px 70px rgba(220,53,69,0.2);
}
.link-card i {
    font-size: 3rem;
    color: var(--red);
    margin-bottom: 1.5rem;
}
.link-card h3 {
    font-size: 1.4rem;
    margin-bottom: 1rem;
    color: var(--navy);
}
.link-card p {
    color: var(--gray);
    font-size: 1.05rem;
}




/* STRONG & ATTRACTIVE SECTION BACKGROUND SYSTEM */
.section-padding {
    padding: 140px 0;
    position: relative;
}

/* Strong, effective backgrounds - NO light/pink colors */
.bg-white { 
    background: #ffffff; 
}
.bg-dark-grey { 
    background: #1a1f2e;   /* Deep navy-grey - very professional */
    color: #e0e0e0;
}
.bg-red-tint { 
    background: linear-gradient(135deg, #2c0f1a 0%, #3d0f1f 100%); /* Deep red tint - premium & bold */
    color: #f0f0f0;
}
.bg-steel { 
    background: #2c3e50;  /* Steel blue-grey - modern & strong */
    color: #ecf0f1;
}

/* Make text readable on dark backgrounds */
.bg-dark-grey h1, .bg-dark-grey h2, .bg-dark-grey h3, .bg-dark-grey h4, .bg-dark-grey p,
.bg-red-tint h1, .bg-red-tint h2, .bg-red-tint h3, .bg-red-tint h4, .bg-red-tint p,
.bg-steel h1, .bg-steel h2, .bg-steel h3, .bg-steel h4, .bg-steel p {
    color: #ffffff !important;
}
.bg-dark-grey .site-heading h4, .bg-red-tint .site-heading h4, .bg-steel .site-heading h4 {
    color: var(--gold) !important;
}

/* Strong wave separators */
.section-padding::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 140px;
    background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1440 140" xmlns="http://www.w3.org/2000/svg"><path fill="%23ffffff" d="M0,70 C360,140 1080,0 1440,70 L1440,0 L0,0 Z"/></svg>') center bottom no-repeat;
    background-size: cover;
    pointer-events: none;
}
.bg-dark-grey::before, .bg-red-tint::before, .bg-steel::before {
    background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1440 140" xmlns="http://www.w3.org/2000/svg"><path fill="%23ffffff" d="M0,70 C360,0 1080,140 1440,70 L1440,140 L0,140 Z"/></svg>') center top no-repeat;
    background-size: cover;
}

/* Bold red accent line */
.section-padding:not(:first-of-type)::after {
    content: '';
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    width: 180px;
    height: 10px;
    background: #b1413d;
    border-radius: 50px;
    box-shadow: 0 15px 40px rgba(220,53,69,.8);
    z-index: 10;
}

@media (max-width: 768px) {
    .services-grid {
        grid-template-columns: 1fr; /* stack items vertically */
        gap: 20px;
    }

    .services-grid > .service-heading {
        grid-column: auto; /* let it flow normally */
        text-align: center; /* optional for mobile */
        margin-bottom: 20px;
    }

    .visa-cat-style-six-item {
        margin-bottom: 20px; /* add spacing between cards */
    }
}


@media (max-width: 768px) {
    .about-content {
        grid-template-columns: 1fr; /* stack vertically */
        gap: 2rem; /* smaller spacing */
        text-align: justify; /* center text for mobile */
    }

    .about-thumb img {
        max-width: 100%;
        height: auto;
        margin: 0 auto; /* center image */
    }

    .about-info p {
        text-align: justify;
        font-size: 16px;
        margin-bottom: 1.5rem;
    }

    .about-info ul {
        padding: 0;
        list-style-position: inside; /* keeps bullets aligned */
        text-align: left; /* optional: keep bullets left aligned */
        display: inline-block; /* prevents bullets stretching full width */
    }

    .about-info ul li {
        font-size: 16px;
        margin-bottom: 12px;
        text-align: left;
    }
}


.visa-cat-style-six-item .more-areas {
    text-align: center;
    margin-top: 20px; /* space between list and button */
}

.visa-cat-style-six-item .more-areas .btn-more-areas {
    display: inline-block;
    padding: 12px 28px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
    background: #b1413d;
    text-decoration: none;
    transition: var(--transition);
}

.visa-cat-style-six-item .more-areas .btn-more-areas:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(220,53,69,0.25);
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .visa-cat-style-six-item .more-areas {
        margin: 15px 0 20px;
    }

    .visa-cat-style-six-item .more-areas .btn-more-areas {
        width: 90%;  /* almost full width on mobile */
        font-size: 0.95rem;
    }
}


.service-heading .view-all-suburbs {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
    padding: 12px 30px;
    font-size: 1rem;
    border-radius: 50px;
    text-decoration: none;
    transition: var(--transition);
}

.service-heading .view-all-suburbs:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 40px rgba(220,53,69,.4);
}

@media (max-width: 768px) {
    .service-heading .view-all-suburbs {
        width: 90%;
        font-size: 0.95rem;
        margin: 20px auto 0;
        display: flex;
    }
}



.features-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}
.fcard {
    background: #fff;
    padding: 1.8rem 1.5rem;
    border-radius: 14px;
    border-left: 6px solid var(--red);
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--navy);
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: all .3s;
}
.fcard:hover {
    transform: translateY(-8px);
    border-left-color: var(--gold);
    box-shadow: 0 15px 40px rgba(220,53,69,0.18);
}
.fcard i {
    font-size: 1.8rem;
    color: var(--red);
}









/* BIG NUMBERS IN THE MIDDLE CIRCLE */
.big-number {
    font-size: 48px;
    font-weight: 900;
    color: #fff;
    text-shadow: 0 4px 10px rgba(0,0,0,0.4);
    font-family: 'Playfair Display', serif;
}

/* Optional: make 5 and 10 stand out more */
.popular { color: #ff6b6b; text-shadow: 0 0 20px rgba(255,107,107,0.6); }
.best    { color: #fbbf24; text-shadow: 0 0 20px rgba(251,191,36,0.8); }


/* COLOURED BACKGROUND FOR THE MIDDLE CIRCLE + BIG NUMBERS */
.visa-cat-style-one .icon {
    background: #d43434;     
    border: 6px solid #fff;
    box-shadow: 0 15px 35px rgba(220,53,69,0.4);
}

/* 5 Lessons Pack – Most Popular → Bright Red */
.popular .visa-cat-style-one .icon {
    background: linear-gradient(135deg, #ff4757, #ff3742);
    box-shadow: 0 15px 35px rgba(255,71,87,0.5);
}

/* 10 Lessons Pack – Best Value → Gold */
.visa-cat-style-one:has(.best) .icon,
.popular .visa-cat-style-one .icon:has(.best) {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    box-shadow: 0 15px 35px rgba(251,191,36,0.5);
}

/* Make the numbers pop even more */
.big-number {
    font-size: 56px;
    font-weight: 900;
    color: #fff;
    text-shadow: 0 4px 15px rgba(0,0,0,0.5);
    font-family: 'Playfair Display', serif;
}
.popular .big-number { color: #fff; }
.best { color: #000; }   /* black text on gold looks premium */


/* MOST POPULAR & BEST VALUE RIBBONS */
.ribbon {
    position: absolute;
    top: 18px;
    left: -8px;
    background: #ff4757;
    color: #fff;
    padding: 8px 28px;
    font-size: 0.85rem;
    font-weight: 900;
    letter-spacing: 1px;
    z-index: 10;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}
.ribbon::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -10px;
    border-left: 8px solid transparent;
    border-top: 10px solid #cc0033;
}
.ribbon::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    border-right: 12px solid transparent;
    border-top: 38px solid #ff4757;
    z-index: -1;
}

/* Best Value – Gold */
.best-value {
    background: #f59e0b;
}
.best-value::before {
    border-top-color: #d35400;
}
.best-value::after {
    border-top-color: #f59e0b;
}


/* HERO MOBILE – FULLY RESPONSIVE */
@media (max-width: 768px) {

  .hero {
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: flex-start !important;
      padding: 160px 20px 60px !important; /* enough top padding */
      text-align: center !important;
      height: auto !important;
      overflow: visible !important;
  }

  .hero::before {
      background:
          linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.7)),
          url('../images/img1.jpeg') center/cover no-repeat !important;
      opacity: 1 !important;
  }

  .hero-content {
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      gap: 1.5rem !important;
      max-width: 100% !important;
      width: 100%;
  }

  .hero-text {
      width: 100% !important;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 0 10px;
  }

  .hero-text h1 {
      font-size: clamp(2rem, 5vw, 2.8rem) !important;
      line-height: 1.25 !important;
      margin-bottom: 0.8rem !important;
      word-break: break-word;
  }

  .hero-text .subtitle {
      font-size: clamp(0.9rem, 3.5vw, 1.2rem) !important;
      line-height: 1.6 !important;
      margin-bottom: 1.5rem !important;
      opacity: 1;
  }

  .cta-group {
      flex-direction: column !important;
      align-items: center !important;
      width: 100% !important;
      gap: 0.9rem !important;
  }

  .cta-group .btn {
      width: 100% !important;
      max-width: 280px;
      justify-content: center !important;
      padding: 1rem 0 !important;
      font-size: 1rem !important;
  }

  .hero-visual {
      margin-top: 1.5rem !important;
      width: 100% !important;
      display: flex;
      justify-content: center !important;
  }

  .floating-car {
      width: 90% !important;
      max-width: 300px !important;
      height: auto !important;
      border-radius: 25px !important;
      object-fit: contain !important;
      box-shadow: 0 20px 50px rgba(0,0,0,0.3) !important;
  }
}