/* ===========================================================================
   AranesTech · Estilo para sa Privacy at Terms
   ---------------------------------------------------------------------------
   Hiwalay na file dahil dalawang pahina ang gumagamit nito — kapag inline sa
   bawat isa, dalawang kopya ang kailangang panatilihing magkatugma.
   Parehong token ng landing page para hindi mukhang ibang website ang
   pinuntahan ng bisita.
   =========================================================================== */
:root{
  --page:#ffffff; --page-alt:#f8fafc; --ink:#0f172a; --ink-soft:#475569;
  --ink-faint:#64748b; --edge:#e2e8f0; --surface:#ffffff;
  --b600:#2563eb; --b700:#1d4ed8; --b400:#60a5fa;
}
:root[data-theme="dark"]{
  --page:#0b1220; --page-alt:#0f172a; --ink:#e8eef7; --ink-soft:#a8b6cc;
  --ink-faint:#8496b0; --edge:#1e293b; --surface:#111a2b;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:var(--page);color:var(--ink);line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--b600);text-decoration:none}
a:hover{text-decoration:underline}
:root[data-theme="dark"] a{color:var(--b400)}
svg{display:block}
.ic{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
:focus-visible{outline:2px solid var(--b600);outline-offset:3px;border-radius:6px}

.top{border-bottom:1px solid var(--edge);background:var(--page-alt)}
.top-in{max-width:820px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px;
  color:var(--ink);letter-spacing:-.02em}
.brand:hover{text-decoration:none}
.brand-mark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,#3b82f6,#1d4ed8);box-shadow:0 4px 12px -2px rgba(37,99,235,.5)}
.brand-mark .ic{width:19px;height:19px;stroke-width:2.2}
.top .back{margin-left:auto;font-size:14px;color:var(--ink-soft);display:inline-flex;align-items:center;gap:7px}
.top .back .ic{width:15px;height:15px}

main{max-width:820px;margin:0 auto;padding:54px 24px 80px}
h1{font-size:clamp(28px,4.6vw,40px);font-weight:800;letter-spacing:-.03em;line-height:1.14}
.upd{margin-top:12px;font-size:14px;color:var(--ink-faint)}
.intro{margin-top:26px;font-size:17px;color:var(--ink-soft)}
h2{font-size:21px;font-weight:800;letter-spacing:-.02em;margin-top:44px;
  padding-top:22px;border-top:1px solid var(--edge)}
h3{font-size:16.5px;font-weight:700;margin-top:26px}
p{margin-top:14px;color:var(--ink-soft)}
ul{margin-top:14px;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:11px}
li{display:flex;gap:11px;color:var(--ink-soft)}
li::before{content:"";flex-shrink:0;width:6px;height:6px;border-radius:50%;
  background:var(--b600);margin-top:11px}
:root[data-theme="dark"] li::before{background:var(--b400)}
strong{color:var(--ink);font-weight:650}
.note{margin-top:20px;padding:16px 18px;border-radius:13px;
  background:var(--page-alt);border:1px solid var(--edge)}
.note p{margin-top:0;font-size:15px}

footer{border-top:1px solid var(--edge);background:var(--page-alt);padding:28px 24px}
.foot-in{max-width:820px;margin:0 auto;display:flex;justify-content:space-between;
  gap:16px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-faint)}
.foot-in a{color:var(--ink-faint)}