/* ============================================================
   assets/tentang.css — Gaya khusus halaman Tentang (tentang/index.php)
   Header/nav/footer sudah ditangani assets/style.css bersama
   ============================================================ */

  :root{
    --blue-900:#0b3a66;
    --blue-700:#0b6fd6;
    --blue-600:#1b83ee;
    --blue-100:#eaf4fd;
    --blue-050:#f5faff;
    --green-700:#1f8f4e;
    --green-600:#26a35a;
    --green-100:#e7f8ee;
    --ink:#14324f;
    --ink-soft:#4b6076;
    --line:#e3ecf4;
    --white:#ffffff;
    --gold:#f5a623;
    --shadow:0 10px 30px rgba(11,58,102,.08);
    --shadow-sm:0 4px 14px rgba(11,58,102,.06);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;font-family:"Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;color:var(--ink);background:#fff;line-height:1.5;}
  a{text-decoration:none;color:inherit;}
  img{max-width:100%;display:block;}
  ul{list-style:none;margin:0;padding:0;}
  .ph{
    background:linear-gradient(135deg,#dceafb,#c7dff5);
    border:1px dashed #9cc2e8;
    display:flex;align-items:center;justify-content:center;
    color:#4a7aa8;font-size:12px;font-weight:600;text-align:center;
    width:100%;height:100%;border-radius:inherit;padding:8px;
  }


  /* ===== Page head ===== */
  .page-head{background:linear-gradient(180deg,#ffffff 0%, #f6fbff 100%);padding:44px 0 30px;text-align:center;}
  .breadcrumb{font-size:13px;color:var(--ink-soft);margin-bottom:14px;}
  .breadcrumb a{color:var(--blue-700);font-weight:600;}
  .page-head h1{font-size:clamp(26px,4vw,38px);font-weight:800;color:var(--blue-900);letter-spacing:-.02em;margin:0 0 12px;}
  .page-head p{color:var(--ink-soft);font-size:15.5px;max-width:580px;margin:0 auto;}

  .section{padding:44px 0;}

  /* ===== Cerita kami ===== */
  .about-grid{display:grid;grid-template-columns:1fr;gap:34px;align-items:center;}
  @media(min-width:900px){.about-grid{grid-template-columns:1fr 1fr;}}
  .about-grid .ph-about{aspect-ratio:4/3;border-radius:18px;}
  .about-text h2{font-size:24px;font-weight:800;color:var(--blue-900);margin:0 0 14px;}
  .about-text p{color:var(--ink-soft);font-size:15px;margin:0 0 14px;}
  .stat-row{display:flex;gap:28px;margin-top:22px;flex-wrap:wrap;}
  .stat-row div b{display:block;font-size:22px;color:var(--blue-700);font-weight:800;}
  .stat-row div span{font-size:12.5px;color:var(--ink-soft);font-weight:600;}

  /* ===== Nilai kami ===== */
  .why-section{background:var(--blue-050);}
  .why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
  @media(min-width:760px){.why-grid{grid-template-columns:repeat(4,1fr);}}
  .why-item{background:#fff;border-radius:16px;padding:22px 18px;box-shadow:var(--shadow-sm);text-align:center;}
  .why-item .ic{width:48px;height:48px;border-radius:12px;background:var(--blue-100);display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:20px;}
  .why-item h4{font-size:14.5px;margin:0 0 6px;color:var(--ink);}
  .why-item p{font-size:12.5px;color:var(--ink-soft);margin:0;}

  /* ===== CTA WA besar ===== */
  .cta-hero{
    background:linear-gradient(120deg,#e9f8ef,#eef7ff);
    border-radius:22px;padding:38px 30px;text-align:center;
  }
  .cta-hero h2{font-size:22px;color:var(--blue-900);margin:0 0 8px;font-weight:800;}
  .cta-hero p{color:var(--ink-soft);font-size:14.5px;margin:0 0 22px;}

  /* ===== Lokasi & kontak ===== */
  .contact-grid{display:grid;grid-template-columns:1fr;gap:28px;}
  @media(min-width:900px){.contact-grid{grid-template-columns:1fr 1fr;}}
  .map-wrap{border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);aspect-ratio:4/3;}
  .map-wrap iframe{width:100%;height:100%;border:0;display:block;}
  .map-placeholder{
    width:100%;height:100%;background:linear-gradient(135deg,#dceafb,#c7dff5);
    border:1px dashed #9cc2e8;display:flex;flex-direction:column;gap:6px;
    align-items:center;justify-content:center;color:#4a7aa8;font-size:13px;font-weight:600;text-align:center;padding:20px;
  }

  .contact-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow-sm);}
  .contact-card h3{font-size:19px;color:var(--blue-900);margin:0 0 18px;font-weight:800;}
  .contact-item{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);}
  .contact-item:last-of-type{border-bottom:none;}
  .contact-item .ic{
    width:38px;height:38px;border-radius:10px;background:var(--blue-100);color:var(--blue-700);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:16px;
  }
  .contact-item b{display:block;font-size:13.5px;color:var(--ink);}
  .contact-item span{font-size:13px;color:var(--ink-soft);}

  .social-row{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap;}
  .social-btn{
    display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:9px;
    background:var(--blue-050);border:1px solid var(--line);font-size:13px;font-weight:700;color:var(--ink);
    transition:.15s;
  }
  .social-btn:hover{border-color:var(--blue-600);color:var(--blue-700);}

  /* ===== Trust strip / footer ===== */
  .trust-strip{border-top:1px solid var(--line);padding:26px 0;}
  .trust-list{display:flex;flex-wrap:wrap;justify-content:center;gap:28px;}
  .trust-list li{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-soft);font-weight:600;}
  footer.site-footer{background:var(--blue-900);color:#cfe0f2;padding:36px 0;text-align:center;font-size:13px;}
  footer.site-footer .logo{color:#fff;}
  footer.site-footer .logo span{color:#9db9d4;}
