/* ================================================================
   AURELIA — fixes.css
   Load AFTER theme-overhaul.css
   Fixes:
   1. Default theme = light
   2. Light theme p tags → black/dark
   3. Navbar Contact button → white text always
   4. Font sizes bigger across board
   5. Responsive errors fixed (mobile/tablet)
   ================================================================ */

/* ── 1. LIGHT THEME AS DEFAULT (overrides dark default) ── */
/* Ye script ke saath kaam karta hai — theme-toggle-snippet.js mein
   default 'dark' ki jagah 'light' set karo (neeche JS snippet diya hai) */

/* ── 2. LIGHT THEME — p tags black/dark ── */
body.theme-light p,
body.theme-light .hero-desc,
body.theme-light .service-desc,
body.theme-light .project-desc,
body.theme-light .owner-bio,
body.theme-light .about p,
body.theme-light .about-body,
body.theme-light .review-text,
body.theme-light .contact-info > p,
body.theme-light .team-hero-desc,
body.theme-light .team-cta-content p,
body.theme-light .coming-soon-header p,
body.theme-light .member-bio,
body.theme-light .member-description,
body.theme-light .modal-member-description,
body.theme-light .section-subtitle,
body.theme-light .mobile-nav-footer,
body.theme-light .cta-left p {
  color: #1a1a1a !important;
}

/* Secondary text in light theme — slightly softer black */
body.theme-light .stat-label,
body.theme-light .hero-scroll,
body.theme-light .orb-label,
body.theme-light .review-location,
body.theme-light .owner-title,
body.theme-light .about-value-desc,
body.theme-light .about-founded,
body.theme-light .footer-copy,
body.theme-light .contact-detail-text label {
  color: #333333 !important;
}

/* ── 3. CONTACT BUTTON — white text always ── */
.btn-contact,
.btn-contact span,
.nav-links .btn-contact,
.mobile-nav-cta .btn-contact {
  color: #ffffff !important;
}

.btn-contact:hover,
.btn-contact:hover span {
  color: #ffffff !important;
  opacity: 0.9;
}

body.theme-light .btn-contact,
body.theme-light .btn-contact span {
  color: #ffffff !important;
}

/* ── 4. FONT SIZES — larger across board ── */

/* Hero */
.hero-h1 {
  font-size: clamp(62px, 8vw, 115px) !important;
}

.hero-desc {
  font-size: 17px !important;
  line-height: 1.95 !important;
}

.hero-tag {
  font-size: 13px !important;
  letter-spacing: 0.32em !important;
}

/* Section headings */
.section-h2 {
  font-size: clamp(40px, 5vw, 68px) !important;
}

.section-tag {
  font-size: 13px !important;
}

/* Services */
.service-title {
  font-size: 22px !important;
}

.service-desc {
  font-size: 15px !important;
  line-height: 1.9 !important;
}

/* Projects (index) */
.project-name,
.project-title {
  font-size: 20px !important;
}

.project-desc {
  font-size: 14px !important;
  line-height: 1.85 !important;
}

/* Owners */
.owner-name {
  font-size: 22px !important;
}

.owner-bio {
  font-size: 15px !important;
  line-height: 1.85 !important;
}

.owner-role {
  font-size: 14px !important;
}

/* About */
.about p,
.about-body {
  font-size: 16px !important;
  line-height: 1.95 !important;
}

.about-value-title {
  font-size: 16px !important;
}

.about-value-desc {
  font-size: 14px !important;
}

/* Reviews */
.review-text {
  font-size: 15px !important;
  line-height: 1.85 !important;
}

.review-name {
  font-size: 15px !important;
}

.review-location {
  font-size: 13px !important;
}

/* Contact */
.contact-info h3 {
  font-size: clamp(26px, 3.5vw, 42px) !important;
}

.contact-info > p {
  font-size: 16px !important;
  line-height: 1.85 !important;
}

.contact-detail-text span,
.contact-detail-text a {
  font-size: 16px !important;
}

/* Nav links */
.nav-links a {
  font-size: 14px !important;
}

/* Mobile nav links */
.mobile-nav-links a {
  font-size: 17px !important;
}

/* Stats */
.stat-num,
.stat-suffix {
  font-size: 52px !important;
}

.stat-label {
  font-size: 13px !important;
}

/* Team page */
.member-name {
  font-size: 17px !important;
}

.member-bio {
  font-size: 13px !important;
}

.member-description {
  font-size: 14px !important;
}

.team-hero-desc {
  font-size: 17px !important;
  line-height: 1.85 !important;
}

/* Footer */
.footer-copy {
  font-size: 13px !important;
}

.footer-links a {
  font-size: 13px !important;
}

/* ── 5. RESPONSIVE FIXES ── */

/* ── 5a. Global overflow fix ── */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
}

/* ── 5b. Navbar responsive ── */
@media (max-width: 1024px) {
  nav {
    padding: 0 24px !important;
    height: 64px !important;
  }

  .nav-links {
    display: none !important;
  }

  .hamburger {
    display: flex !important;
  }

  .theme-toggle {
    order: 2;
    margin-left: auto;
    margin-right: 12px;
  }

  .hamburger {
    order: 3;
  }
}

@media (max-width: 768px) {
  nav {
    padding: 0 16px !important;
    height: 60px !important;
  }
}

/* ── 5c. Hero — responsive ── */
@media (max-width: 1280px) {
  .hero {
    padding: 60px 48px !important;
    gap: 48px;
  }

  .hero-right {
    width: 420px !important;
    height: 420px !important;
  }

  .globe-wrap {
    width: 260px !important;
    height: 260px !important;
  }

  .orbit-ring-1 { width: 280px !important; height: 280px !important; }
  .orbit-ring-2 { width: 340px !important; height: 340px !important; }
  .orbit-ring-3 { width: 390px !important; height: 390px !important; }
  .orbit-ring-4 { width: 430px !important; height: 430px !important; }
}

@media (max-width: 1024px) {
  .hero {
    flex-direction: column !important;
    text-align: center !important;
    padding: 80px 40px 60px !important;
    height: auto !important;
    min-height: calc(100vh - 64px) !important;
    gap: 48px !important;
  }

  .hero-left {
    max-width: 100% !important;
  }

  .hero-desc {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 560px !important;
  }

  .hero-ctas {
    justify-content: center !important;
  }

  .hero-scroll {
    justify-content: center !important;
  }

  .hero-right {
    width: 380px !important;
    height: 380px !important;
  }

  .globe-wrap {
    width: 240px !important;
    height: 240px !important;
  }

  .orbit-ring-1 { width: 250px !important; height: 250px !important; }
  .orbit-ring-2 { width: 300px !important; height: 300px !important; }
  .orbit-ring-3 { width: 350px !important; height: 350px !important; }
  .orbit-ring-4 { width: 390px !important; height: 390px !important; }
}

@media (max-width: 768px) {
  .hero {
    padding: 60px 20px 50px !important;
    gap: 40px !important;
    min-height: calc(100vh - 60px) !important;
  }

  .hero-h1 {
    font-size: clamp(44px, 12vw, 72px) !important;
  }

  .hero-desc {
    font-size: 15px !important;
    max-width: 100% !important;
  }

  .hero-right {
    width: 300px !important;
    height: 300px !important;
  }

  .globe-wrap {
    width: 190px !important;
    height: 190px !important;
  }

  .orbit-ring-1 { width: 200px !important; height: 200px !important; }
  .orbit-ring-2 { width: 245px !important; height: 245px !important; }
  .orbit-ring-3 { width: 280px !important; height: 280px !important; }
  .orbit-ring-4 { width: 310px !important; height: 310px !important; }

  .hero-ctas {
    flex-direction: column !important;
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto !important;
  }

  .btn-primary {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    display: flex !important;
  }
}

@media (max-width: 480px) {
  .hero {
    padding: 50px 16px 40px !important;
  }

  .hero-h1 {
    font-size: clamp(38px, 11vw, 60px) !important;
  }

  .hero-right {
    width: 260px !important;
    height: 260px !important;
  }

  .globe-wrap {
    width: 165px !important;
    height: 165px !important;
  }

  .orbit-ring-1 { width: 170px !important; height: 170px !important; }
  .orbit-ring-2 { width: 210px !important; height: 210px !important; }
  .orbit-ring-3 { width: 245px !important; height: 245px !important; }
  .orbit-ring-4 { width: 272px !important; height: 272px !important; }

  .hero-scroll {
    display: none !important;
  }
}

/* ── 5d. Stats responsive ── */
@media (max-width: 768px) {
  .stats {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: 48px 20px !important;
    gap: 32px !important;
  }

  .stat-num, .stat-suffix {
    font-size: 38px !important;
  }

  .stat-item:nth-child(1),
  .stat-item:nth-child(2) {
    border-bottom: 1px solid var(--border);
    padding-bottom: 32px;
  }
}

@media (max-width: 480px) {
  .stats {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: 40px 16px !important;
    gap: 24px !important;
  }

  .stat-num, .stat-suffix {
    font-size: 32px !important;
  }

  .stat-label {
    font-size: 11px !important;
  }
}

/* ── 5e. Services responsive ── */
@media (max-width: 1024px) {
  .services {
    padding: 80px 32px !important;
  }

  .services-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .services {
    padding: 64px 20px !important;
  }

  .services-grid {
    grid-template-columns: 1fr !important;
  }

  .service-card {
    padding: 36px 28px !important;
  }
}

/* ── 5f. Projects responsive ── */
@media (max-width: 1024px) {
  .projects {
    padding: 80px 32px !important;
  }

  .projects-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .projects-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 20px !important;
    margin-bottom: 40px !important;
  }
}

@media (max-width: 768px) {
  .projects {
    padding: 64px 20px !important;
  }

  .project-cover img {
    height: 220px !important;
  }
}

/* ── 5g. Owners responsive ── */
@media (max-width: 1024px) {
  .owners {
    padding: 80px 32px !important;
  }

  .owners-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
}

@media (max-width: 768px) {
  .owners {
    padding: 64px 20px !important;
  }

  .owner-card {
    padding: 36px 24px !important;
  }
}

/* ── 5h. About responsive ── */
@media (max-width: 1024px) {
  .about {
    padding: 80px 32px !important;
  }

  .about-inner {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }

  .about-visual {
    display: none !important;
  }

  .about-values {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .about {
    padding: 64px 20px !important;
  }

  .about-values {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

/* ── 5i. Reviews responsive ── */
@media (max-width: 1024px) {
  .reviews {
    padding: 80px 32px !important;
  }
}

@media (max-width: 768px) {
  .reviews {
    padding: 64px 20px !important;
  }

  .rv-track .review-card {
    flex: 0 0 280px !important;
    width: 280px !important;
  }
}

@media (max-width: 480px) {
  .rv-track .review-card {
    flex: 0 0 260px !important;
    width: 260px !important;
  }
}

/* ── 5j. Contact responsive ── */
@media (max-width: 1024px) {
  .contact {
    padding: 80px 32px !important;
  }

  .contact-inner {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }
}

@media (max-width: 768px) {
  .contact {
    padding: 64px 20px !important;
  }

  .form-row {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .contact-info h3 {
    font-size: clamp(22px, 7vw, 32px) !important;
  }
}

/* ── 5k. Footer responsive ── */
@media (max-width: 768px) {
  footer {
    flex-direction: column !important;
    gap: 20px !important;
    text-align: center !important;
    padding: 36px 20px !important;
  }

  .footer-links {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 16px !important;
  }
}

/* ── 5l. Section headings responsive ── */
@media (max-width: 768px) {
  .section-h2 {
    font-size: clamp(30px, 9vw, 48px) !important;
  }
}

@media (max-width: 480px) {
  .section-h2 {
    font-size: clamp(28px, 8.5vw, 40px) !important;
  }
}

/* ── 5m. Team page responsive ── */
@media (max-width: 1024px) {
  .team-hero {
    padding: 100px 32px 60px !important;
  }

  .team-section {
    padding: 48px 32px !important;
  }

  .founders-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .members-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .team-hero {
    padding: 80px 20px 48px !important;
  }

  .team-section {
    padding: 40px 20px !important;
  }

  .founders-grid,
  .members-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .team-cta {
    padding: 48px 20px !important;
  }

  .modal-header {
    height: 320px !important;
  }

  .modal-body {
    padding: 20px !important;
  }
}

/* ── 5n. Projects page responsive ── */
@media (max-width: 1024px) {
  .page-hero {
    padding: 100px 32px 60px !important;
  }

  .filter-bar {
    padding: 16px 32px !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
  }
}

@media (max-width: 768px) {
  .page-hero {
    padding: 80px 20px 48px !important;
  }

  .filter-bar {
    padding: 14px 20px !important;
  }

  .filter-btn {
    font-size: 11px !important;
    padding: 7px 14px !important;
  }

  .projects-section {
    padding: 48px 20px !important;
  }

  .cta-strip {
    padding: 32px 20px !important;
    flex-direction: column !important;
    gap: 24px !important;
    text-align: center !important;
  }
}

/* ── 5o. Mobile nav drawer fix ── */
@media (max-width: 768px) {
  .mobile-nav-drawer {
    padding: 80px 28px 40px !important;
    width: min(300px, 88vw) !important;
  }

  .mobile-nav-links a {
    font-size: 16px !important;
    padding: 16px 0 !important;
  }

  .mobile-nav-cta {
    margin-top: 28px !important;
  }
}

/* ── 5p. Top bar responsive ── */
@media (max-width: 768px) {
  .top-bar {
    padding: 0 16px !important;
    font-size: 10px !important;
    height: 34px !important;
    gap: 8px !important;
  }

  .top-bar-right {
    gap: 12px !important;
  }
}

@media (max-width: 480px) {
  .top-bar-left {
    display: none !important;
  }

  .top-bar {
    justify-content: center !important;
  }
}

/* ── 5q. Section padding fix for sections with section-tag ── */
@media (max-width: 768px) {
  .section-tag {
    font-size: 11px !important;
    letter-spacing: 0.25em !important;
  }

  .section-h2 {
    margin-bottom: 32px !important;
  }
}

/* ── 5r. Image overflow fix ── */
img {
  max-width: 100%;
  height: auto;
}

/* ── 5s. Form responsiveness ── */
@media (max-width: 480px) {
  .form-group input,
  .form-group select,
  .form-group textarea {
    font-size: 15px !important; /* prevent iOS zoom */
  }
}

/* ── Light theme btn-outline fix ── */
body.theme-light .btn-outline {
  color: #111111 !important;
  border-color: rgba(0,0,0,0.35) !important;
}

body.theme-light .btn-outline:hover {
  color: var(--red) !important;
  border-color: var(--red) !important;
}