/* Learn Bisaya Fast: the privacy and terms pages. Colours follow the app's
   Island Sea palette (lib/theme.dart): deep-sea ink and links. */
:root{
  --sea:#0E5560; --sea-tint:#E6F1F0;
  --ink:#0F2A2F; --ink-2:#34525A; --ink-3:#4E6B70;
  --bg:#FFFFFF; --bg-soft:#F1F6F5; --border:#DDE9E8;
  --wrap:720px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --sea:#6CC5C7; --sea-tint:#123A3A;
    --ink:#E6F1F0; --ink-2:#C3D6D6; --ink-3:#9AB3B5;
    --bg:#0A1A1D; --bg-soft:#0F2A2F; --border:#23403F;
  }
}
:root[data-theme="dark"]{
  --sea:#6CC5C7; --sea-tint:#123A3A;
  --ink:#E6F1F0; --ink-2:#C3D6D6; --ink-3:#9AB3B5;
  --bg:#0A1A1D; --bg-soft:#0F2A2F; --border:#23403F;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:var(--sea); text-decoration:underline; text-underline-offset:2px}
:focus-visible{outline:3px solid var(--sea); outline-offset:3px; border-radius:6px}
@media (prefers-reduced-motion:reduce){ *{transition:none !important} }

.wrap{max-width:var(--wrap); margin:0 auto; padding:0 16px}

.site-header{border-bottom:1px solid var(--border); background:var(--bg)}
.site-header .wrap{display:flex; align-items:center; height:60px}
.brand{display:inline-flex; align-items:center; gap:10px; font-weight:800; letter-spacing:-.02em; color:var(--ink); text-decoration:none}
.mark{
  display:grid; place-items:center; width:32px; height:32px; border-radius:9px;
  background:var(--sea); color:var(--bg); font-weight:800; font-size:1.05rem;
}

.page-hero{background:var(--bg-soft); border-bottom:1px solid var(--border); padding:clamp(36px,7vw,64px) 0 clamp(24px,5vw,40px)}
h1,h2{line-height:1.2; letter-spacing:-.022em; font-weight:800}
h1{font-size:clamp(1.9rem,6vw,2.6rem); margin:0 0 12px}
.lead{margin:0; font-size:1.08rem; color:var(--ink-2)}

.page{padding:clamp(28px,6vw,56px) 0 clamp(48px,9vw,88px)}
.page h2{font-size:1.35rem; margin:2em 0 .55em}
.page h2:first-child{margin-top:0}
.page p,.page li{color:var(--ink-2)}
.page p{margin:0 0 1.1em}
.page ul{margin:0 0 1.2em; padding-left:1.3em}
.page li{margin:0 0 .5em}
.page strong{color:var(--ink)}

.site-footer{border-top:1px solid var(--border); padding:28px 0 36px; font-size:.94rem}
.site-footer nav{display:flex; flex-wrap:wrap; gap:8px 22px}
.site-footer nav a{color:var(--ink-2); overflow-wrap:anywhere}
.copyright{margin:16px 0 0; color:var(--ink-3); font-size:.88rem}
