/* pages.css — shared look for the standalone pages: policy.html, aboutus.html, contact.html */
  :root{
    --cream:#FCEFE4; --paper:#F8F2E8; --brown:#3E2313; --brown-2:#4A3931;
    --yellow:#FAD84C; --orange:#CC4E00; --teal:#348C9B; --coral:#ED5151;
    --rule:rgba(52,140,155,.14); --margin:rgba(237,81,81,.35);
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:'Poppins',sans-serif;color:var(--brown);overflow-x:hidden;background:var(--paper);
    background-image:repeating-linear-gradient(transparent, transparent 34px, var(--rule) 34px, var(--rule) 36px);
    min-height:100vh;display:flex;flex-direction:column}
  body::before{content:"";position:fixed;top:0;bottom:0;left:clamp(24px,6vw,84px);width:2px;background:var(--margin);z-index:0;pointer-events:none}
  a{color:inherit}
  img{display:block}

  /* buttons used inside the pages */
  .btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:13px;background:var(--orange);color:#fff;text-decoration:none;
    padding:9px 20px;border-radius:4px;transform:rotate(-1deg);border:2px solid var(--brown);
    box-shadow:3px 3px 0 var(--brown);transition:transform .15s, box-shadow .15s}
  .btn:hover{transform:rotate(-1deg) translate(-2px,-2px);box-shadow:5px 5px 0 var(--brown)}
  .btn.note{background:var(--cream);color:var(--brown)}

  /* page */
  main{flex:1;position:relative;z-index:1;max-width:860px;width:100%;margin:0 auto;padding:44px clamp(20px,5vw,32px) 72px}
  .intro .hand{font-family:'Schoolbell',cursive;font-size:20px;color:var(--teal)}
  .intro h1{font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(34px,5vw,48px);line-height:1.1;margin:4px 0 10px}
  .intro p{font-size:15px;line-height:1.7;color:var(--brown-2);max-width:560px}
  .toc{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 8px}
  .toc a{font-size:13px;font-weight:700;text-decoration:none;color:var(--brown);background:var(--cream);
    border:2px solid var(--brown);border-radius:100px;padding:7px 16px;box-shadow:2px 2px 0 var(--brown);transition:transform .12s,box-shadow .12s}
  .toc a:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--brown);color:var(--orange)}

  section.policy{background:#fff;border:2.5px solid var(--brown);border-radius:16px;box-shadow:6px 7px 0 rgba(62,35,19,.9);
    padding:clamp(22px,4vw,38px);margin-top:40px;scroll-margin-top:84px}
  section.policy h2{font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(24px,3.4vw,30px);line-height:1.15;margin-bottom:4px}
  section.policy .upd{font-size:12.5px;font-style:italic;color:var(--brown-2);margin-bottom:18px}
  section.policy h3{font-family:'Baloo 2',cursive;font-weight:700;font-size:19px;color:var(--brown);margin:26px 0 6px}
  section.policy p,section.policy li{font-size:14.5px;line-height:1.75;color:var(--brown-2)}
  section.policy p{margin-bottom:12px}
  section.policy ul{padding-left:22px;margin-bottom:14px}
  section.policy li{margin-bottom:8px}
  section.policy strong{color:var(--brown)}
  section.policy a{color:var(--orange);font-weight:600;text-underline-offset:2px}
  section.policy a:hover{color:var(--brown)}
  section.policy a.btn{color:#fff;text-decoration:none;font-weight:700}
  section.policy a.btn.note{color:var(--brown)}
  section.policy a.btn:hover{color:#fff}
  section.policy a.btn.note:hover{color:var(--brown)}
  .tbl{overflow-x:auto;margin:6px 0 16px;border:2px solid var(--brown);border-radius:10px}
  .tbl table{width:100%;border-collapse:collapse;min-width:460px}
  .tbl th,.tbl td{text-align:left;font-size:14px;line-height:1.55;padding:11px 14px;vertical-align:top;color:var(--brown-2)}
  .tbl th{background:var(--yellow);color:var(--brown);font-weight:700}
  .tbl tr+tr td{border-top:1px solid rgba(62,35,19,.18)}


  /* info cards (contact page) */
  .infogrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:8px 0 6px}
  .infocard{background:var(--cream);border:2px solid var(--brown);border-radius:12px;padding:16px 18px}
  .infocard .k{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--brown-2);font-weight:700;margin-top:10px}
  .infocard .k:first-child{margin-top:0}
  .infocard .v{font-size:14.5px;line-height:1.55;color:var(--brown);font-weight:600;word-break:break-word}
  .infocard .v a{color:var(--orange);text-decoration:none}
  .infocard .v a:hover{text-decoration:underline}
  .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
  .btn.big{padding:12px 24px;font-size:14px}
  .quote{background:var(--cream);border:2px solid var(--brown);border-radius:12px;padding:18px 22px;margin:14px 0}
  .quote blockquote{font-size:15px;line-height:1.75;color:var(--brown-2)}
  .quote .sign{margin-top:12px;font-weight:700;font-size:14px;color:var(--brown)}
  .quote .sign small{display:block;font-weight:500;font-size:12px;color:var(--brown-2)}
