﻿/* ============================================
   MOBILE STYLES (max-width: 768px)
   UHRS IT Services — Gold & Black Brand
   ============================================ */

.container { padding: 0 16px; }

/* Typography */
h1 { font-size: 2rem; }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.1rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.9rem; }

/* Grid Utilities */
.col_3, .col_6 { width: 100%; }
.hidden-mobile { display: none !important; }
.hidden-tablet { display: block; }

/* Sections */
.section    { padding: 50px 0; }
.section-sm { padding: 30px 0; }
.section-lg { padding: 60px 0; }

/* ============================================
   HEADER MOBILE
   ============================================ */
.top_menu_bar { height: 0; overflow: hidden; }
.top_menu_bar.visible { height: auto; }
.header_main { padding: 10px 0; }
.logo img { width: 130px; }
.main-nav { display: none !important; }
.mega-menu, .industry-mega { display: none !important; }
.dropdown-menu { display: none !important; }
.menu-toggle { display: flex !important; }

/* ============================================
   HERO MOBILE
   ============================================ */
.hero-section { min-height: 75vh; }
.hero-content { padding: 90px 16px 50px; max-width: 100%; }
.hero-badge { font-size: 11px; padding: 6px 14px; }
.hero-title { font-size: clamp(1.8rem, 8vw, 2.5rem); }
.hero-subtitle { font-size: 0.9rem; }
.hero-cta-group { flex-direction: column; gap: 12px; }
.hero-btn { width: 100%; text-align: center; justify-content: center; }
.hero-stats { gap: 20px; flex-wrap: wrap; margin-top: 40px; }
.hero-stat-number { font-size: 1.8rem; }
.hero-stat-label { font-size: 0.72rem; }

/* ============================================
   RATINGS MOBILE
   ============================================ */
.ratings-section { padding: 30px 0; }
.ratings-wrapper { gap: 12px; justify-content: center; }
.rating-card { min-width: unset; flex: 1 1 calc(50% - 12px); padding: 18px 12px; }
.rating-score { font-size: 1.3rem; }

/* ============================================
   COMPANY OVERVIEW MOBILE
   ============================================ */
.company-overview-section { padding: 60px 0; }
.overview-grid { grid-template-columns: 1fr; gap: 36px; }
.overview-highlights { gap: 14px; }
.overview-highlight-card { padding: 16px 18px; }

/* ============================================
   WHY CHOOSE MOBILE
   ============================================ */
.why-choose-section { padding: 60px 0; }
.why-choose-wrapper { grid-template-columns: 1fr; gap: 40px; }
.why-choose-image { order: -1; }
.team-image { max-height: 280px; width: 100%; object-fit: cover; }
.why-choose-item { padding: 16px; }
.item-number { width: 38px; height: 38px; min-width: 38px; font-size: 0.9rem; }

/* ============================================
   STATS/RESULTS MOBILE
   ============================================ */
.results-header { padding: 50px 16px 30px; }
.results-tabs { gap: 8px; }
.results-tab { padding: 10px 18px; font-size: 13px; }
.results-tabs-wrapper { padding: 0 16px 50px; }
.lets-connect-sidebar-btn { display: none; }

/* ============================================
   SERVICES MOBILE
   ============================================ */
.services-section { padding: 60px 0; }
.services-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
.service-card { padding: 20px 10px; border-radius: 12px; }
.service-icon { font-size: 1.8rem; }
.service-title { font-size: 0.82rem; }

/* ============================================
   PLATFORMS MOBILE
   ============================================ */
.platforms-section { padding: 48px 0; }
.platforms-icons { gap: 10px; }
.platform-icon { min-width: 80px; padding: 10px 14px; font-size: 0.82rem; }
.services-showcase-section { padding: 0; }
.showcase-layout { grid-template-columns: 1fr; }
.showcase-image-panel { display: none; }
.showcase-tabs { grid-template-columns: repeat(3, 1fr); }
.showcase-tab { padding: 16px 8px; }
.showcase-tab-icon { font-size: 1.2rem; }
.showcase-tab-label { font-size: 0.62rem; }
.showcase-content { padding: 28px 20px; }
.showcase-panel-title { font-size: 1.15rem; }
.showcase-panel-list { grid-template-columns: 1fr; }
.industries-grid { gap: 12px; margin-top: 36px; margin-bottom: 36px; }
.industry-card { flex: 0 0 calc(50% - 6px); padding: 20px 12px; }
.industry-icon { min-height: 48px; }
.industry-icon svg { width: 48px; height: 48px; }

/* ============================================
   TESTIMONIALS MOBILE
   ============================================ */
.testimonials-section { padding: 60px 0; }
.testimonial-featured { grid-template-columns: 1fr; gap: 30px; padding: 30px 24px; }
.testimonial-company-badge { position: static; margin-top: 20px; display: inline-block; }
.testimonial-highlight { font-size: 1.05rem; }

/* ============================================
   BLOGS & FAQS MOBILE
   ============================================ */
.blogs-faqs-section { padding: 60px 0; }
.blogs-faqs-wrapper { grid-template-columns: 1fr; gap: 50px; }
.blog-card { padding: 20px; }
.faq-text { font-size: 0.88rem; }

/* ============================================
   FOOTER MOBILE
   ============================================ */
.footer-logo-area { flex-direction: column; align-items: flex-start; padding: 30px 0 20px; }
.footer-contact-info { align-items: flex-start; }
.footer-row { grid-template-columns: 1fr 1fr; gap: 30px; }
.footer-col-last { grid-column: 1 / -1; }
.footer-serve-grid { grid-template-columns: repeat(3, 1fr); }

/* ============================================
   LOGO SLIDER MOBILE
   ============================================ */
.logo-slider-section { padding: 30px 0; }
.logo-item { width: 130px; height: 65px; }
.slider-prev { left: -14px; }
.slider-next { right: -14px; }

/* ============================================
   SECTION TITLE MOBILE
   ============================================ */
.section-header { flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 30px; }
.section-header.centered { align-items: center; }


/* === INNER PAGE — SERVICE — MOBILE (≤768px) === */
.inner-hero { padding: 70px 0 36px; }

/* Industry page */
.ip-challenges-grid { grid-template-columns: 1fr; }
.ip-solutions-grid { grid-template-columns: repeat(2, 1fr); }

/* Contact page */
.ct-form-panel { padding: 28px 20px; }
.ct-contact-section { padding: 48px 0; }
.inner-page-title { font-size: clamp(1.5rem, 6vw, 2rem); margin-bottom: 12px; }
.inner-page-desc { font-size: 0.93rem; margin-bottom: 20px; }
.inner-hero-actions { gap: 10px; }
.inner-hero-actions .btn { width: 100%; text-align: center; justify-content: center; }
.ip-intro-section { padding: 48px 0; }
.ip-intro-grid { grid-template-columns: 1fr; gap: 28px; }
.ip-intro-visual { display: none; }
.ip-intro-actions { flex-direction: column; gap: 10px; }
.ip-intro-actions .btn { width: 100%; text-align: center; justify-content: center; }
.ip-features-section { padding: 48px 0; }
.ip-features-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
.ip-feature-card { padding: 22px 16px; }
.ip-feature-emoji { font-size: 1.8rem; }
.ip-process-section { padding: 48px 0; }
.ip-process-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
.ip-process-grid::before { display: none; }
.ip-process-step { padding: 0 8px 8px; }
.ip-step-number { width: 52px; height: 52px; font-size: 1rem; }
.ip-stats-section { padding: 40px 0; }
.ip-stats-grid { grid-template-columns: repeat(2, 1fr); }
.ip-stat-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.08); padding: 18px 12px; }
.ip-stat-item:last-child { border-bottom: none; }
.ip-faq-section { padding: 48px 0; }
.ip-faq-layout { grid-template-columns: 1fr; gap: 24px; }
.ip-faq-header { position: static; }
.ip-faq-header p { font-size: 0.88rem; }
.ip-cta-section { padding: 48px 0; }
.ip-cta-inner { flex-direction: column; align-items: flex-start; gap: 20px; }
.ip-cta-text h2 { font-size: clamp(1.2rem, 5vw, 1.6rem); }
.ip-cta-actions { flex-direction: column; width: 100%; }
.ip-cta-actions .btn { width: 100%; text-align: center; justify-content: center; }

/* === INNER PAGE — ABOUT / WORK / CONTACT — MOBILE (≤768px) === */
.ab-testimonials-grid { grid-template-columns: 1fr; }
.ab-team-grid { grid-template-columns: repeat(2, 1fr); }
.ab-job-card { padding: 18px; }
.ab-apply-btn { align-self: stretch; text-align: center; }
.wk-cases-grid { grid-template-columns: 1fr; }
.wk-portfolio-grid { grid-template-columns: 1fr; }
.wk-blog-grid { grid-template-columns: 1fr; }
.ct-contact-grid { gap: 30px; }
.ct-form-row { grid-template-columns: 1fr; }
.ct-contact-section { padding: 60px 20px; }
.ab-policy-body { padding: 20px; font-size: 0.9rem; }
