/* tryinstahelp.com — shared stylesheet for generated pages.
   Palette is restricted to white, black, yellow and grey by design. */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/plus-jakarta-sans-400.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/plus-jakarta-sans-500.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/plus-jakarta-sans-600.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/plus-jakarta-sans-700.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:800;font-display:swap;src:url("/assets/fonts/plus-jakarta-sans-800.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/ibm-plex-mono-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/ibm-plex-mono-500.woff2") format("woff2")}
:root{
  --white:#FFFFFF;--ink:#000000;--yellow:#FFD600;
  --g-50:#FAFAF9;--g-100:#F2F2F0;--g-200:#E4E4E1;--g-300:#CFCFCB;--g-500:#8A8A85;--g-700:#4A4A47;
  --line:#E4E4E1;--pad:clamp(18px,4vw,44px);
  --page:min(100%,max(70%,1180px),1680px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:82px}
body{margin:0;background:var(--white);color:var(--ink);
  font-family:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif;
  font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}
.wrap{width:var(--page);margin:0 auto;padding-inline:var(--pad)}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}

.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px;
  width:var(--page);margin:0 auto;padding-inline:var(--pad)}
.logo{font-weight:800;font-size:20px;letter-spacing:-.035em;display:inline-flex;align-items:flex-start}
.logo sup{font-size:9px;font-weight:600;margin-left:2px;margin-top:3px}
.nav-links{display:flex;gap:22px;font-size:14.5px;font-weight:500;color:var(--g-700)}
.nav-links a:hover{color:var(--ink)}
@media(max-width:760px){.nav-links{display:none}}
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:var(--white);
  padding:11px 20px;border-radius:999px;font-weight:600;font-size:15px;letter-spacing:-.01em;
  border:1px solid var(--ink);cursor:pointer;transition:transform .16s ease}
.btn:hover{transform:translateY(-1px)}
.btn-y{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--g-300)}

.crumbs{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--g-500);padding:26px 0 0}
.crumbs a:hover{color:var(--ink)}
.crumbs span{color:var(--g-300);padding:0 6px}

main{padding-bottom:clamp(46px,6vw,84px)}
h1{font-size:clamp(31px,5vw,52px);font-weight:800;letter-spacing:-.04em;line-height:1.03;
  margin:20px 0 0;max-width:20ch}
.intro{font-size:clamp(17px,2vw,20px);color:var(--g-700);margin:20px 0 0;max-width:62ch}
.actions{display:flex;gap:11px;flex-wrap:wrap;margin:28px 0 0}

h2{font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.032em;margin:0 0 18px}
section.block{margin-top:clamp(38px,5vw,60px);padding-top:clamp(30px,4vw,44px);border-top:1px solid var(--line);
  content-visibility:auto;contain-intrinsic-size:auto 520px}
section.block:first-of-type{border-top:0}

ul.checks{list-style:none;margin:0;padding:0;max-width:64ch}
ul.checks li{padding:14px 0 14px 30px;border-bottom:1px solid var(--line);position:relative;color:var(--g-700)}
ul.checks li::before{content:"";position:absolute;left:2px;top:20px;width:11px;height:6px;
  border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg)}

.chips{display:flex;flex-wrap:wrap;gap:7px}
.chips a{font-size:13.5px;font-weight:600;color:var(--g-700);border:1px solid var(--g-200);
  border-radius:999px;padding:8px 14px;transition:.14s}
.chips a:hover{border-color:var(--ink);color:var(--ink)}
.chips a.k{background:var(--ink);border-color:var(--ink);color:var(--white)}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--g-200);
  border:1px solid var(--g-200);border-radius:20px;overflow:hidden}
@media(max-width:820px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.grid{grid-template-columns:1fr}}
.cell{background:var(--white);padding:20px;display:flex;flex-direction:column;gap:6px;transition:background .16s,transform .16s;cursor:pointer}
.cell:hover{background:var(--g-50);transform:translateY(-1px)}
.cell:focus-visible{outline:2px solid var(--ink);outline-offset:-3px}
.cell b{font-size:16px;font-weight:700;letter-spacing:-.022em}
.cell span{font-size:14px;color:var(--g-700);line-height:1.5}
.cell em{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.07em;text-transform:uppercase;color:var(--g-300)}

details{border-top:1px solid var(--line)}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;padding:18px 40px 18px 0;position:relative;
  font-size:17px;font-weight:700;letter-spacing:-.022em}
summary::-webkit-details-marker{display:none}
summary::after{content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;
  border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s}
details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
details p{margin:0 0 18px;font-size:15.5px;color:var(--g-700);max-width:64ch}

.cta{margin-top:clamp(40px,5vw,66px);background:var(--ink);color:var(--white);
  border-radius:22px;padding:clamp(28px,4vw,44px)}
.cta h2{margin:0 0 10px;color:var(--white)}
.cta p{margin:0 0 22px;color:var(--g-300);max-width:52ch}

footer{border-top:1px solid var(--line);padding:34px 0 44px;font-size:14px;color:var(--g-700)}
footer .cols{display:flex;gap:26px;flex-wrap:wrap;margin-bottom:20px}
footer a:hover{color:var(--ink)}
.disc{font-size:12.5px;line-height:1.55;max-width:80ch;margin:0 0 18px;color:var(--g-700)}
.sis{margin:0 0 18px}
.sis a{border-bottom:1px solid var(--g-300)}

.legal{max-width:72ch;margin-top:28px;color:var(--g-700)}
.legal h2{font-size:clamp(20px,2.6vw,26px);margin:40px 0 14px;color:var(--ink)}
.legal h3{font-size:18px;font-weight:700;letter-spacing:-.02em;margin:24px 0 10px;color:var(--ink)}
.legal p{margin:0 0 14px}
.legal ul{margin:0 0 16px;padding-left:1.25em}
.legal li{margin:0 0 6px}
.legal .notice{background:var(--g-50);border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:8px 0 8px}
.legal .notice h2{margin:0 0 12px}
.legal .warn{border-left:3px solid var(--ink);background:var(--g-50);padding:12px 16px;margin:16px 0}
.legal .warn p:last-child,.legal .warn ul:last-child{margin-bottom:0}
.legal .updated{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--g-500);margin:16px 0 0}
.hero-tag{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--g-500);margin:8px 0 0}
