/* InstaShiny — shared styles for content pages */
:root{
  --bg:#F7F5F1; --surface:#FFFFFF; --chip:#F1EFE9;
  --ink:#1E2126; --ink-2:#585E68; --ink-3:#8A909A;
  --line:#E7E3DA; --line-strong:#D4CDBD;
  --accent:#E5431F; --accent-strong:#C9381A; --on-accent:#FFFFFF;
  --ok:#0E8A5E;
  --shadow:0 1px 2px rgba(40,32,24,.05), 0 12px 30px -10px rgba(40,32,24,.12);
  --glow:0 8px 22px -8px rgba(229,67,31,.5);
  --serif:"Bricolage Grotesque","Plus Jakarta Sans",system-ui,sans-serif;
  --sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#121419; --surface:#1B1E24; --chip:#242830;
    --ink:#F1EFEA; --ink-2:#A4A9B1; --ink-3:#767B84;
    --line:#2A2E37; --line-strong:#3B414C;
    --accent:#F5582F; --accent-strong:#FF7551; --on-accent:#1B0A04;
    --ok:#42CE97;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 16px 36px -12px rgba(0,0,0,.55);
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* header */
.site-head{
  position:sticky; top:0; z-index:20;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.site-head .row{
  max-width:1000px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; gap:16px;
}
.brand{font-family:var(--serif); font-weight:700; font-size:1.2rem; letter-spacing:-.02em; color:var(--ink)}
.brand em{font-style:normal; color:var(--accent)}
.site-nav{margin-left:auto; display:flex; align-items:center; gap:20px; flex-wrap:wrap}
.site-nav a{color:var(--ink-2); font-size:.9rem; font-weight:600}
.site-nav a:hover{color:var(--ink); text-decoration:none}
.btn{
  display:inline-flex; align-items:center; gap:7px;
  background:var(--accent); color:var(--on-accent);
  font-weight:700; font-size:.86rem;
  padding:9px 16px; border-radius:11px; box-shadow:var(--glow);
}
.btn:hover{text-decoration:none; filter:brightness(1.06)}
@media (max-width:640px){
  .site-nav{display:none}
}

/* layout */
main{max-width:760px; margin:0 auto; padding:8px 20px 60px}
.crumbs{font-size:.8rem; color:var(--ink-3); margin:22px 0 10px}
.crumbs a{color:var(--ink-3)}
h1{font-family:var(--serif); font-weight:700; font-size:clamp(1.9rem,5vw,2.5rem); line-height:1.12; letter-spacing:-.03em; margin:.2em 0 .35em; text-wrap:balance}
h2{font-family:var(--serif); font-weight:700; font-size:1.4rem; letter-spacing:-.02em; margin:1.8em 0 .5em}
h3{font-size:1.05rem; font-weight:700; margin:1.4em 0 .3em}
.lede{font-size:1.1rem; color:var(--ink-2); margin:0 0 1.4em}
p,li{color:var(--ink-2)}
ul,ol{padding-left:22px}
li{margin:.3em 0}
strong{color:var(--ink); font-weight:700}

.card{
  background:var(--surface); border:1px solid var(--line);
  border-radius:16px; padding:18px 20px; margin:1.4em 0;
  box-shadow:var(--shadow);
}
.card h3:first-child,.card h2:first-child{margin-top:0}

table{width:100%; border-collapse:collapse; margin:1.2em 0; font-size:.95rem}
th,td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line)}
th{font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-3)}
td:last-child{text-align:right; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap}

.pills{display:flex; flex-wrap:wrap; gap:8px; margin:1em 0}
.pill{
  display:inline-block; background:var(--chip); color:var(--ink-2);
  font-size:.82rem; font-weight:600; padding:6px 12px; border-radius:999px;
}
.pill:hover{text-decoration:none; color:var(--ink)}

.cta-box{
  background:color-mix(in srgb, var(--accent) 8%, var(--surface));
  border:1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  border-radius:16px; padding:20px; margin:1.8em 0; text-align:center;
}
.cta-box p{margin:0 0 12px; color:var(--ink)}

/* footer */
.site-foot{border-top:1px solid var(--line); background:var(--surface); margin-top:40px}
.site-foot .cols{
  max-width:1000px; margin:0 auto; padding:36px 20px 24px;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:24px;
}
.site-foot h4{font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; color:var(--ink-3); margin:0 0 10px}
.site-foot ul{list-style:none; padding:0; margin:0}
.site-foot li{margin:.4em 0}
.site-foot a{color:var(--ink-2); font-size:.9rem; font-weight:500}
.site-foot a:hover{color:var(--ink); text-decoration:none}
.site-foot .legal{
  max-width:1000px; margin:0 auto; padding:16px 20px 30px;
  border-top:1px solid var(--line); color:var(--ink-3); font-size:.82rem;
}