/* ismee support / help centre — shared styles (on-brand) */
:root{--purple:#6A5CFF;--purple-light:#A78BFA;--navy:#0F172A;--teal:#20E0C2;--off:#F8FAFC;--slate:#64748B;--ink:#0F172A;--ink-soft:#334155;--line:#E7E9F2;--pt:#F3F1FF;--tt:#E9FBF6;
  --shadow-sm:0 1px 3px rgba(15,23,42,.06);--shadow:0 12px 30px rgba(15,23,42,.06);--maxw:1080px;--font:'Nunito',-apple-system,system-ui,sans-serif;}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--font);color:var(--ink);background:#fff;line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-weight:900;line-height:1.15;letter-spacing:-.02em;margin:0 0 .5em;}
h1{font-size:clamp(2rem,4vw,2.9rem);} h2{font-size:clamp(1.5rem,2.6vw,2rem);} h3{font-size:1.15rem;}
p{margin:0 0 1rem;} a{color:var(--purple);text-decoration:none;} a:hover{text-decoration:underline;} svg{display:block;}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 24px;} .narrow{max-width:760px;}
.section{padding:clamp(40px,6vw,72px) 0;} .tint{background:var(--pt);}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--purple);background:var(--pt);padding:.35rem .8rem;border-radius:999px;margin-bottom:1rem;}
.lead{font-size:1.1rem;color:var(--slate);}
.icon-badge{width:48px;height:48px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--pt);color:var(--purple);}
.badge-teal{background:var(--tt);color:#0FB39A;}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:1rem;padding:.75rem 1.4rem;border-radius:12px;border:2px solid transparent;cursor:pointer;}
.btn-primary{background:var(--purple);color:#fff!important;box-shadow:0 8px 20px rgba(106,92,255,.25);} .btn-primary:hover{text-decoration:none;}
.btn-outline{border-color:var(--line);color:var(--ink)!important;} .btn-sm{padding:.5rem 1rem;font-size:.9rem;}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);}
.header-inner{display:flex;align-items:center;gap:20px;height:66px;}
.brand{display:flex;align-items:center;gap:10px;} .brand img{height:34px;} .brand .tag{font-size:.72rem;font-weight:800;color:var(--slate);background:var(--pt);padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.06em;}
.nav{display:flex;gap:22px;margin-left:14px;} .nav a{font-weight:700;font-size:.94rem;color:var(--ink-soft);} .nav a:hover{color:var(--purple);text-decoration:none;}
.header-actions{margin-left:auto;}

/* home cards */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow-sm);display:block;color:inherit;}
a.card:hover{text-decoration:none;border-color:var(--purple-light);box-shadow:var(--shadow);}
.card .icon-badge{margin-bottom:14px;} .card h3{margin-bottom:6px;} .card p{font-size:.92rem;color:var(--slate);margin:0;}

/* module list */
.module{display:flex;gap:20px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;margin-bottom:16px;}
.module .icon-badge{flex:0 0 auto;} .module h3{margin-bottom:4px;} .module p{margin:0 0 .4rem;font-size:.96rem;color:var(--ink-soft);} .module .use{font-size:.9rem;color:var(--slate);}

/* how-to: layout with sticky TOC */
.doc{display:grid;grid-template-columns:240px 1fr;gap:44px;align-items:start;}
.toc{position:sticky;top:88px;border:1px solid var(--line);border-radius:16px;padding:18px;background:var(--off);}
.toc h4{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--slate);margin-bottom:12px;}
.toc a{display:block;font-weight:700;font-size:.9rem;color:var(--ink-soft);padding:6px 0;} .toc a:hover{color:var(--purple);text-decoration:none;}
.howto{scroll-margin-top:88px;margin-bottom:44px;padding-bottom:8px;border-bottom:1px solid var(--line);}
.howto:last-child{border-bottom:0;}
.howto h2{display:flex;align-items:center;gap:12px;}
.howto .anchor{font-size:.85rem;font-weight:700;color:var(--purple-light);opacity:0;transition:opacity .15s;} .howto h2:hover .anchor{opacity:1;}
.steps{counter-reset:step;list-style:none;padding:0;margin:0 0 16px;}
.steps li{position:relative;padding-left:44px;margin-bottom:14px;font-weight:600;}
.steps li:before{counter-increment:step;content:counter(step);position:absolute;left:0;top:-2px;width:30px;height:30px;border-radius:9px;background:var(--purple);color:#fff;font-weight:900;font-size:.9rem;display:flex;align-items:center;justify-content:center;}
.tip{background:var(--tt);border-left:3px solid var(--teal);border-radius:8px;padding:12px 15px;font-size:.92rem;font-weight:600;color:#0f5d52;margin:14px 0;}
.tip b{color:#0f5d52;}
.shot{border:2px dashed var(--purple-light);border-radius:14px;background:var(--pt);padding:26px;text-align:center;color:var(--slate);font-weight:700;font-size:.9rem;margin:14px 0;display:flex;flex-direction:column;align-items:center;gap:8px;}
.shot svg{color:var(--purple-light);}
.shot-img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);margin:16px 0;}
.fmt-inline{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 4px;}
.fmt-inline span{font-size:.82rem;font-weight:700;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px;color:var(--ink-soft);}

/* tick list */
.tick{list-style:none;padding:0;margin:12px 0 0;}
.tick li{position:relative;padding-left:30px;margin-bottom:10px;font-weight:600;color:var(--ink-soft);}
.tick li:before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:var(--pt);}
.tick li:after{content:"";position:absolute;left:5px;top:9px;width:7px;height:4px;border-left:2px solid var(--purple);border-bottom:2px solid var(--purple);transform:rotate(-45deg);}
.tick li a{color:var(--purple);font-weight:700;}

/* contact form */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;margin-top:8px;}
.contact-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow);}
.field{margin-bottom:14px;} .field label{display:block;font-weight:700;font-size:.85rem;margin-bottom:6px;}
.field input,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font-family:inherit;font-size:.95rem;} .field textarea{resize:vertical;}
.form-note{font-size:.82rem;color:var(--slate);margin-top:10px;}
.btn-lg{padding:1rem 1.6rem;font-size:1.02rem;} .btn-block{display:flex;width:100%;}

/* footer */
.site-footer{background:#fff;border-top:1px solid var(--line);padding:40px 0;margin-top:20px;}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
.footer-inner img{height:26px;} .footer-inner .links a{margin-left:18px;font-weight:700;font-size:.9rem;color:var(--ink-soft);}
.footer-note{color:var(--slate);font-size:.82rem;margin-top:14px;}

@media(max-width:820px){
  .nav{display:none;} .card-grid{grid-template-columns:1fr;} .doc{grid-template-columns:1fr;} .toc{position:static;margin-bottom:24px;}
  .module{flex-direction:column;gap:12px;} .contact-grid{grid-template-columns:1fr;}
}
