/* =============================================================
   Remote Guyana — Mobile Responsive Styles (consolidated)
   All pages share this one file. No !important needed since
   this loads after the inline <style> blocks.
   ============================================================= */

/* ── 768px breakpoint (tablet / mobile) ── */
@media (max-width: 768px) {

  /* --- UNIVERSAL: hero / page-hero --- */
  .hero,
  .page-hero { padding-top: 100px !important; padding-bottom: 60px !important; }

  .hero h1,
  .page-hero h1 { font-size: 36px !important; line-height: 1.15 !important; }

  .hero .hero-text,
  .hero p,
  .hero .subtitle,
  .page-hero .subtitle { font-size: 16px !important; }

  /* --- UNIVERSAL: sections --- */
  section { padding-top: 48px !important; padding-bottom: 48px !important; }

  /* --- UNIVERSAL: form inputs (prevent iOS zoom) --- */
  input, select, textarea { font-size: 16px !important; }

  /* --- UNIVERSAL: tap targets --- */
  .nav-burger { padding: 12px !important; min-width: 44px !important; min-height: 44px !important; }

  /* --- UNIVERSAL: footer --- */
  footer > div:first-child[style*="grid-template-columns"] { grid-template-columns: 1fr 1fr !important; gap: 24px !important; }

  /* --- UNIVERSAL: CTA buttons (varied class names across pages) --- */
  .cta-buttons,
  .cta-band-actions,
  .hero-actions,
  .results-cta,
  .talent-cta-box,
  .cta-block,
  .hero-inner { display: flex !important; flex-direction: column !important; gap: 12px !important; align-items: stretch !important; }

  .cta-buttons a,
  .cta-band-actions a,
  .hero-actions a,
  .results-cta a,
  .talent-cta-box a,
  .cta-block a,
  .hero-inner .btn-primary,
  .hero-inner .btn-outline { width: 100% !important; text-align: center !important; display: block !important; margin: 0 !important; box-sizing: border-box !important; }

  /* --- UNIVERSAL: nav / burger --- */
  /* (already handled by per-page @media(max-width:1100px) blocks) */

  /* ── INDEX.HTML ── */
  .steps { grid-template-columns: 1fr !important; }
  .layers-diagram { grid-template-columns: 1fr !important; }
  .qc-pillars { grid-template-columns: 1fr 1fr !important; }
  .roles-grid { grid-template-columns: 1fr !important; }

  .hero-stats { flex-wrap: wrap !important; gap: 16px !important; }
  .hero-stats > div { flex: 1 1 45% !important; }
  .stat-number { font-size: 28px !important; }
  .step-num { font-size: 36px !important; }
  .layers-diagram .layer-arrow { display: none !important; }
  .qc-bottom-bar { flex-direction: column !important; text-align: center; gap: 12px !important; }
  .qc-badge { white-space: normal !important; }
  .roles-grid .role-card { padding: 24px 16px !important; }
  .industries-grid { grid-template-columns: 1fr 1fr !important; }
  .eor-diagram .eor-arrow { display: none !important; }
  .btn-ghost { display: block !important; width: 100% !important; text-align: center !important; padding: 14px 0 !important; border: 1px solid rgba(255,255,255,0.25) !important; border-radius: 4px !important; }

  /* ── ABOUT.HTML ── */
  .team-card { grid-template-columns: 1fr !important; border-radius: 8px !important; overflow: hidden !important; }
  .tc-photo-side { min-height: 200px !important; }
  .tc-content { padding: 20px !important; }
  .value-card { padding: 20px !important; }
  .origin { padding: 48px 20px !important; }
  .team-section { padding: 48px 20px !important; }
  .cta-band { padding: 48px 20px !important; }

  /* ── AI.HTML ── */
  .wf-row { grid-template-columns: 1fr !important; }
  .wf-cell.header-cell { display: none !important; }
  .vc-row { grid-template-columns: 1fr !important; }
  .vc-cell.arrow { display: none !important; }
  .cannot-grid { grid-template-columns: 1fr !important; }
  .talent-ai-inner { grid-template-columns: 1fr !important; }
  .key-insight { flex-direction: column !important; padding: 24px 20px !important; }
  .ki-icon { margin-top: 0 !important; margin-right: 0 !important; margin-bottom: 8px !important; }
  .approach-card { padding: 20px !important; }
  .framework-item { padding: 16px !important; }
  .honest, .shift, .scale, .cannot, .augment, .valuechain, .talent-ai, .position { padding: 48px 20px !important; }
  .insight-card { padding: 28px 20px !important; }
  .cannot-card { padding: 28px 20px !important; }
  .wf-cell { padding: 16px 18px !important; }
  .vc-cell { padding: 18px 20px !important; }
  .pos-card { padding: 24px 20px !important; }
  .worry-box { padding: 24px 20px !important; }
  .answer-box { padding: 24px 20px !important; }
  .augment-note { padding: 20px !important; }

  /* ── CALCULATOR.HTML ── */
  .calc-card { padding: 24px 20px !important; }
  .results-grid { grid-template-columns: 1fr !important; }
  .seat-display { font-size: 22px !important; }
  .calc-section { padding: 20px !important; }
  .main { padding: 40px 20px !important; }
  .assumptions { padding: 20px !important; margin-top: 32px !important; }

  /* ── CONTACT.HTML ── */
  .alternatives { grid-template-columns: 1fr !important; margin-top: 32px !important; }
  .alt-card { padding: 20px !important; }
  .step { padding: 12px 0 !important; }
  .contact-form-wrap { padding: 24px 20px !important; }

  /* ── GTM.HTML ── */
  .svc { grid-template-columns: 1fr !important; padding: 20px !important; }
  .svc-left { min-height: auto !important; padding: 24px 20px !important; }
  .svc-right { padding: 24px 20px !important; }
  .signal-item { grid-template-columns: 1fr !important; padding: 16px 20px !important; }
  .pos-grid, .how-grid, .results-grid { grid-template-columns: 1fr !important; }
  .partner-inner { flex-direction: column !important; text-align: center; }
  .hero-badges { gap: 8px !important; }
  .badge { padding: 6px 10px !important; font-size: 11px !important; }
  .section { padding: 48px 20px !important; }
  .pos-card { padding: 24px 20px !important; }
  .how-step { padding: 24px 20px !important; }
  .res-stat { padding: 24px 20px !important; }
  .partner-band { padding: 24px 20px !important; }

  /* ── GUYANA-SERVICES.HTML ── */
  .serve-grid, .services-grid, .process-grid, .why-grid, .retainers-grid { grid-template-columns: 1fr !important; }
  .stats-grid { grid-template-columns: 1fr !important; gap: 16px !important; padding-top: 32px !important; margin-top: 32px !important; }
  .stat { padding: 0 !important; border: none !important; }
  .hero-bg-text { display: none !important; }
  .btn-outline { margin-left: 0 !important; margin-top: 12px; }
  .process-step::after { display: none !important; }
  .btn { display: block; width: 100%; text-align: center; }
  .stat-item { padding: 20px !important; }
  .process-step { padding: 20px !important; }
  .capabilities-grid { grid-template-columns: 1fr !important; }
  .serve-card { padding: 28px 20px !important; }
  .service-card { padding: 24px 20px !important; }
  .retainer-card { padding: 24px 20px !important; }
  .why-card { padding: 24px 20px !important; }

  /* ── PRICING.HTML ── */
  .model-pillars, .included-grid { grid-template-columns: 1fr !important; }
  .rate-card, .model-card, .faq-card, .included-card { padding: 28px 20px !important; }
  .pillar { padding: 24px 16px !important; }
  .included-item { padding: 20px !important; }
  .rate-table th, .rate-table td { padding: 10px 12px !important; font-size: 13px !important; white-space: normal !important; }
  .rate-range { white-space: normal !important; }

  /* ── PROCESS.HTML ── */
  .stage-header { grid-template-columns: 1fr !important; gap: 24px !important; }
  .role-action { grid-template-columns: 1fr !important; }
  .ra-role { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; }
  .qc-explainer { grid-template-columns: 1fr !important; }
  .cycle-grid { grid-template-columns: 1fr 1fr !important; }
  .matrix-row { grid-template-columns: 1fr !important; }
  .matrix-row.header { display: none !important; }
  .stage-inner > div[style*="grid-template-columns:1fr 1fr"],
  .inner > div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
  .inner > div[style*="grid-template-columns:repeat(3,1fr)"] { grid-template-columns: 1fr !important; }
  .stage-connector { height: 36px !important; }
  .connector-label { font-size: 9px !important; padding: 0 8px !important; }
  .role-action-row { padding: 10px 0 !important; }
  .stage-inner { padding: 20px !important; }
  .inner { padding: 20px !important; }
  .cycle-item { padding: 16px !important; }

  /* ── RIGHT-FOR-YOU.HTML ── */
  .disqualifiers { grid-template-columns: 1fr !important; }
  .option { padding: 12px 14px !important; }
  .question-text { font-size: 18px !important; }
  .assessment-card { padding: 20px !important; }
  .result-wrap { padding: 20px !important; }
  .result-wrap.visible { display: block !important; }
  .result-cta-block { width: 100% !important; display: flex !important; flex-direction: column !important; gap: 16px !important; align-items: stretch !important; box-sizing: border-box !important; padding: 24px 20px !important; }
  .result-cta-block .cta-btn { width: 100% !important; text-align: center !important; display: block !important; margin: 0 !important; box-sizing: border-box !important; white-space: normal !important; flex-shrink: 1 !important; }
  .restart-btn { width: 100% !important; text-align: center !important; display: block !important; margin-top: 12px !important; box-sizing: border-box !important; }

}

/* ── 480px breakpoint (small mobile) ── */
@media (max-width: 480px) {

  /* --- UNIVERSAL: footer single column --- */
  footer > div:first-child[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* ── INDEX.HTML ── */
  .qc-pillars { grid-template-columns: 1fr !important; }
  .hero-stats > div { flex: 1 1 100% !important; }
  .industries-grid { grid-template-columns: 1fr !important; }

  /* ── ABOUT.HTML ── */
  .origin-stats { grid-template-columns: 1fr !important; }
  .tc-bottom { grid-template-columns: 1fr !important; }

  /* ── PROCESS.HTML ── */
  .cycle-grid { grid-template-columns: 1fr !important; }
  .roles-row { flex-direction: column !important; align-items: stretch !important; }

}
