/*
Theme Name: ININetwork
Theme URI: https://ininetwork.id
Author: PT Ininetwork Media Indonesia
Author URI: https://ininetwork.id
Description: Theme ringan, modern, dan SEO-friendly untuk PT Ininetwork Media Indonesia. Tanpa page builder, dikelola lewat Gutenberg dan halaman ININetwork Settings.
Version: 1.0.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ininetwork
Tags: custom-logo, custom-menu, featured-images, translation-ready, block-styles, wide-blocks
*/

/* =========================================================
   Design tokens ININetwork
   CSS komponen lengkap ada di assets/css/main.css
   ========================================================= */
:root {
  /* Warna */
  --navy-900: #0A1B3D;
  --navy-700: #12306B;
  --blue-500: #2563EB;
  --cyan-400: #22D3EE;
  --orange-500: #F08300;   /* warna logo, hanya untuk CTA utama */
  --orange-600: #D97200;
  --green-600: #009A44;    /* warna logo, aksen sekunder */
  --green-700: #00793A;    /* versi teks, kontras AA di atas putih */
  --ink: #231815;
  --gray-50: #F6F8FC;
  --gray-200: #E5E9F2;
  --gray-600: #4B5563;
  --white: #FFFFFF;
  --on-orange: #0A1B3D;    /* teks di atas tombol oranye (kontras AA) */

  /* Tipografi */
  --font-head: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-h1: clamp(2.25rem, 1.6rem + 3vw, 3.75rem);
  --fs-h2: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  --fs-h3: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --fs-body: 1rem;

  /* Spasi (skala 4px) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 16px;
  --sp-4: 24px;
  --sp-5: 32px;
  --sp-6: 48px;
  --sp-7: 64px;
  --sp-8: 96px;
  --section-y: clamp(64px, 8vw, 104px);

  /* Bentuk */
  --container: 1200px;
  --gutter: clamp(16px, 4vw, 32px);
  --radius: 16px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(10, 27, 61, .06), 0 2px 8px rgba(10, 27, 61, .04);
  --shadow-md: 0 4px 12px rgba(10, 27, 61, .08), 0 12px 32px rgba(10, 27, 61, .08);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* Reset ringan */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.7;
  color: var(--gray-600);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; height: auto; }
a { color: var(--blue-500); }

/* Aksesibilitas */
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
  height: 1px; margin: -1px; overflow: hidden; padding: 0;
  position: absolute; width: 1px; word-wrap: normal !important;
}
.screen-reader-text:focus,
.skip-link:focus {
  clip: auto; clip-path: none; height: auto; width: auto; margin: 0;
  background: var(--navy-900); color: var(--white);
  padding: 12px 20px; z-index: 100000; top: 8px; left: 8px;
  border-radius: 8px; text-decoration: none;
}
:focus-visible { outline: 3px solid var(--blue-500); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* Gerakan halaman dikurangi, kecuali banner (hero) yang diatur lewat
     ININetwork > Animasi banner dan punya tombol jeda. */
  body *:not(.ini-hero, .ini-hero *, .ini-marquee, .ini-marquee *),
  body *:not(.ini-hero, .ini-hero *, .ini-marquee, .ini-marquee *)::before,
  body *:not(.ini-hero, .ini-hero *, .ini-marquee, .ini-marquee *)::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}