/* ================================================================
   TERRABLOOM — PAGES.CSS
   Styles for inner pages: about, services, blog, contact, legal
   ================================================================ */

/* ── GENERAL INNER PAGE POLISH ── */
[id] { scroll-margin-top: 90px; }

/* ── FAQ OPEN STATE BODY COLOR ── */
.faq-item.open .faq-btn { color: var(--chart-xdark); }

/* ── SERVICE NAV ACTIVE (JS-driven) ── */
.svc-nav__link.active {
  color: var(--chart-xdark);
  border-color: var(--chartreuse);
}

/* ── ARTICLE BODY LIST FIX ── */
.art-body ul {
  list-style: none;
  margin-left: 0;
}

/* ── CONTACT PAGE FORM GRID MOBILE FIX ── */
@media (max-width: 560px) {
  .contact-form-grid-2 {
    grid-template-columns: 1fr;
  }
  #contact-form .g-2 {
    grid-template-columns: 1fr;
  }
  .modal__bd .g-2 {
    grid-template-columns: 1fr;
  }
}

/* ── BLOG FEATURED POST MOBILE ── */
@media (max-width: 600px) {
  .featured-post {
    grid-template-columns: 1fr;
  }
}

/* ── LEGAL LAYOUT MOBILE ── */
@media (max-width: 900px) {
  .legal-layout {
    grid-template-columns: 1fr;
  }
  .legal-toc {
    position: static;
  }
}

/* ── SERVICE DETAIL MOBILE ── */
@media (max-width: 768px) {
  .svc-detail {
    grid-template-columns: 1fr;
  }
  .svc-detail--flip .svc-visual {
    order: 0;
  }
  .svc-visual {
    display: none;
  }
}

/* ── BACK TO TOP POSITION (above cookie banner) ── */
.btt { z-index: 350; }

/* ── MODAL MOBILE FULL-SCREEN ── */
@media (max-width: 500px) {
  .modal-overlay {
    padding: 0;
    align-items: flex-end;
  }
  .modal {
    border-radius: var(--r-lg) var(--r-lg) 0 0;
    max-height: 96vh;
  }
}

/* ── COOKIE BANNER MOBILE ── */
@media (max-width: 480px) {
  .cookie-banner {
    left: var(--s-3);
    right: var(--s-3);
    bottom: var(--s-3);
    border-radius: var(--r-md);
  }
  .cookie-banner__btns {
    flex-direction: column;
  }
}

/* ── FOOTER GRID RESPONSIVE ── */
@media (max-width: 1024px) {
  .footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--s-8);
  }
}
@media (max-width: 600px) {
  .footer__grid {
    grid-template-columns: 1fr;
  }
  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--s-3);
  }
}

/* ── TEAM GRID RESPONSIVE ── */
@media (max-width: 900px) {
  .team-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 580px) {
  .team-grid {
    grid-template-columns: 1fr;
  }
}

/* ── TIMELINE ITEM MOBILE ── */
@media (max-width: 480px) {
  .tl-item {
    grid-template-columns: 60px 1fr;
    gap: var(--s-4);
  }
  .tl-year {
    font-size: var(--t-lg);
    padding-top: var(--s-1);
  }
}

/* ── PRICING CARDS TABLET ── */
@media (max-width: 900px) {
  .g-3.pricing-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 600px) {
  .g-3.pricing-grid {
    grid-template-columns: 1fr;
  }
}

/* ── HERO STATS BAR MOBILE ── */
@media (max-width: 600px) {
  .stats-bar .g-4 {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--s-5);
  }
  .stat-num {
    font-size: var(--t-2xl);
  }
}

/* ── BLOG DETAIL PROGRESS BAR ── */
.art-progress {
  transition: width 0.08s linear;
}

/* ── PRINT STYLES ── */
@media print {
  .nav,
  .footer,
  .cookie-banner,
  .modal-overlay,
  .btt,
  .page-hero__geo,
  .page-hero__geo2 {
    display: none !important;
  }
  .page-content {
    padding-top: 0;
  }
  body {
    color: #000;
    background: #fff;
  }
  a {
    color: #000;
    text-decoration: underline;
  }
  .legal-doc h2 {
    break-before: auto;
  }
  .legal-layout {
    grid-template-columns: 1fr;
  }
}

/* ── REDUCED MOTION ── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal {
    opacity: 1;
    transform: none;
  }
  .hero__img-float {
    animation: none;
  }
  .hero__scroll-line {
    animation: none;
  }
}

/* ── HIGH CONTRAST SUPPORT ── */
@media (forced-colors: active) {
  .btn-primary {
    border: 2px solid ButtonText;
  }
  .tag {
    border: 1px solid ButtonText;
  }
  .nav__link.active::after {
    background: Highlight;
  }
}

/* ── SELECTION COLOUR ── */
::selection {
  background: var(--chartreuse);
  color: var(--ink);
}
::-moz-selection {
  background: var(--chartreuse);
  color: var(--ink);
}

/* ── SCROLLBAR (Webkit) ── */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--cream-deep); }
::-webkit-scrollbar-thumb {
  background: var(--ink-20);
  border-radius: var(--r-full);
}
::-webkit-scrollbar-thumb:hover { background: var(--ink-40); }

/* ── SMOOTH NAV ACTIVE TRANSITION ── */
.nav__link {
  transition:
    background var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out);
}

/* ── PROCESS STEP CONNECTOR LINE ── */
@media (min-width: 769px) {
  .process-step + .process-step {
    position: relative;
  }
  .process-step + .process-step::before {
    content: '';
    position: absolute;
    top: 0;
    left: 32px;
    width: 1px;
    height: var(--s-8);
    background: var(--chartreuse);
    opacity: 0.3;
    transform: translateY(-100%);
  }
}

/* ── VALUES GRID RESPONSIVE ── */
@media (max-width: 768px) {
  .values-grid {
    grid-template-columns: 1fr;
  }
}

/* ── TCARD DISCLAIMER VISIBILITY ── */
.tcard__note {
  display: block;
}