/* Briefleaf design v2: "notebook" for school and college students. Loaded after site.css. */
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/assets/fonts/nunito-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/assets/fonts/nunito-cyrillic-wght-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Caveat";font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/caveat-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Caveat";font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fonts/caveat-cyrillic-wght-normal.woff2) format("woff2");unicode-range:U+0400-045F}

body.v2{
  --bg:#fffdf6;--bg2:#f5f2ff;--surface:#fff;--surface2:#f4f0e4;
  --line:rgba(31,29,71,.12);--line2:rgba(31,29,71,.24);
  --text:#1f1d47;--muted:#4f4d75;--dim:#6c6a92;
  --ink:#1f1d47;--hl-y:#ffe45c;--hl-p:#ffb3d4;--hl-m:#a3f0d0;--hl-b:#b1defe;--pink:#d6336c;
  --round:"Nunito",var(--sans);--hand:"Caveat","Segoe Print","Comic Sans MS",cursive;
  color-scheme:light;background:var(--bg);color:var(--text)
}
.v2 h1,.v2 h2,.v2 h3{font-family:var(--round);font-weight:900;letter-spacing:-.015em}
.v2 h1{font-size:clamp(2.3rem,5.6vw,3.9rem);line-height:1.08}
.v2 h3{font-weight:800}
.v2 a{color:var(--ink);text-decoration-color:var(--pink);text-decoration-thickness:2px}
.v2 .glow{display:none}

/* header */
.v2 .site-header{background:rgba(255,253,246,.88);border-bottom:2px solid var(--ink)}
.v2 .brand{font-family:var(--round);font-weight:900}
.v2 .nav a{color:var(--muted);font-weight:700}
.v2 .nav a:hover{color:var(--ink)}
.v2 .lang{border:2px solid var(--ink)}
.v2 .lang span{background:var(--ink);color:#fff}

/* buttons: chunky, hand-made feel */
.v2 .btn{font-family:var(--round);font-weight:900;border:2.5px solid var(--ink);border-radius:14px;color:var(--ink);box-shadow:4px 4px 0 var(--ink)}
.v2 .btn-primary{background:var(--hl-y)}
.v2 .btn-ghost{background:#fff}
.v2 .btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.v2 .btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.v2 .btn-sm{box-shadow:3px 3px 0 var(--ink)}

/* marker highlight */
.v2 .mark{background:none;background-image:linear-gradient(100deg,transparent .2em,var(--hl-y) .2em,var(--hl-y) calc(100% - .15em),transparent calc(100% - .15em));background-size:100% 62%;background-position:0 78%;background-repeat:no-repeat;color:inherit;padding:0 .12em;border-radius:0}

/* hero: ruled notebook page */
.v2 .hero{background-color:var(--bg);background-image:linear-gradient(90deg,transparent 64px,rgba(229,72,120,.35) 64px,rgba(229,72,120,.35) 66px,transparent 66px),repeating-linear-gradient(180deg,transparent 0,transparent 37px,rgba(70,130,220,.14) 37px,rgba(70,130,220,.14) 38px);border-bottom:2px solid var(--ink)}
.v2 .eyebrow{background:var(--hl-b);border:2px solid var(--ink);color:var(--ink);font-weight:800;font-family:var(--round);transform:rotate(-2deg);box-shadow:3px 3px 0 var(--ink);padding:7px 14px}
.v2 .eyebrow i{background:var(--pink);box-shadow:none}
.v2 .lead{color:var(--muted)}
.v2 .hand{font-family:var(--hand);font-weight:700;color:var(--pink);line-height:1.1}
.v2 .hand-cta{display:flex;align-items:center;gap:6px;font-size:1.7rem;margin:16px 0 0 8px;transform:rotate(-2deg)}
.v2 .hand-cta svg{transform:scaleY(-1) rotate(-12deg);flex:none}
.v2 .browser{box-shadow:6px 6px 0 var(--ink);border:2.5px solid var(--ink)}
.v2 .browser-bar{background:#efece2;border-bottom:2px solid var(--ink)}
.v2 .doc{box-shadow:5px 5px 0 var(--ink);border:2.5px solid var(--ink)}
.v2 .doc-slide{background:#2a2766}
.v2 .doc-sheet{background:#fff}
.v2 .arrow,.v2 .arrow-down,.v2 .src-arrow{color:var(--pink)}
.v2 .chip-add{background:var(--ink)}
.v2 .chip-add b{color:var(--hl-y)}

@media (min-width:1021px){.v2 .scheme{grid-template-columns:1.15fr 56px 1fr}.v2 .hero .wrap{grid-template-columns:1fr 1.05fr}}

/* use-case stickers */
.uc{padding:30px 0 6px}
.uc-row{display:flex;flex-wrap:wrap;gap:12px 12px;align-items:center}
.uc-label{font-size:1.75rem;margin-right:6px}
.uc-s{font:800 .98rem/1 var(--round);color:var(--ink);border:2px solid var(--ink);border-radius:12px;padding:10px 14px;box-shadow:3px 3px 0 var(--ink);background:var(--hl-y);transform:rotate(-1.5deg)}
.uc-s:nth-of-type(6n+2){background:var(--hl-p);transform:rotate(1.2deg)}
.uc-s:nth-of-type(6n+3){background:var(--hl-m);transform:rotate(-.6deg)}
.uc-s:nth-of-type(6n+4){background:var(--hl-b);transform:rotate(1.6deg)}
.uc-s:nth-of-type(6n+5){background:#fff;transform:rotate(-1deg)}
.uc-s:nth-of-type(6n+6){background:#ffd6a8;transform:rotate(.8deg)}

/* sections */
.v2 .section{padding:88px 0}
.v2 .section-alt{background-color:var(--bg2);background-image:radial-gradient(rgba(31,29,71,.13) 1.2px,transparent 1.2px);background-size:22px 22px;border-color:var(--ink);border-width:2px 0}
.v2 .uc + .section-alt{margin-top:30px}
.v2 .section-head p{color:var(--muted)}
.v2 .kicker{font-family:var(--hand);font-weight:700;font-size:1.9rem;letter-spacing:0;text-transform:none;color:var(--pink);margin-bottom:6px;transform:rotate(-2deg);transform-origin:left;display:inline-block}

/* steps = sticky notes */
.v2 .steps{gap:28px;padding-top:10px}
.v2 .step{border:0;border-radius:3px 3px 18px 3px;background:#fff1a0;color:var(--ink);box-shadow:0 18px 24px -18px rgba(31,29,71,.55);transform:rotate(-1.6deg)}
.v2 .step:nth-child(2){background:#ffd3e7;transform:rotate(1.1deg)}
.v2 .step:nth-child(3){background:#c8f5e2;transform:rotate(-.6deg)}
.v2 .step::before{content:"";position:absolute;top:-13px;left:50%;width:96px;height:26px;margin-left:-48px;background:rgba(255,255,255,.65);border:1px solid rgba(31,29,71,.12);transform:rotate(-3deg)}
.v2 .step-n{background:var(--ink);color:#fff;border-radius:50%;font-family:var(--round);font-weight:900}
.v2 .step p{color:#3a3866}
.v2 .step kbd{background:#fff;border:1.5px solid var(--ink);border-bottom-width:3px;color:var(--ink)}

/* cards with ink outlines */
.v2 .format,.v2 .ai-item,.v2 .panel,.v2 .plan,.v2 .faq details,.v2 .src-card{background:#fff;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.v2 .format{border-radius:18px}
.v2 .format.main{background:#fff8d1}
.v2 .format-ill{background:var(--surface2);border:2px solid var(--ink)}
.v2 .tag{font-family:var(--hand);font-size:1.45rem;text-transform:none;letter-spacing:0;color:var(--pink);font-weight:700;margin-bottom:2px}
.v2 .format p,.v2 .ai-item p,.v2 .priv p{color:var(--muted)}
.v2 .ai-item svg{color:#6d3fe0}
.v2 .ai-item:nth-child(2) svg{color:var(--pink)}
.v2 .ai-item:nth-child(3) svg{color:#0f8a5f}
.v2 .ai-item:nth-child(4) svg{color:#c26a00}
.v2 .ai-note svg{color:#0f8a5f}
.v2 .ai-note{color:var(--muted);font-weight:600}
.v2 .priv .panel svg{color:#0f8a5f}

/* gallery */
.v2 .controls h3{color:var(--dim);font-family:var(--sans);font-weight:800}
.v2 .chip{background:#fff;border:2px solid var(--ink);color:var(--ink);font-weight:700}
.v2 .chip[aria-pressed="true"]{background:var(--hl-y);border-color:var(--ink);box-shadow:3px 3px 0 var(--ink)}
.v2 .swatch{background:#fff;border:2px solid var(--ink);color:var(--ink)}
.v2 .swatch .sw{border:1.5px solid var(--ink)}
.v2 .swatch[aria-pressed="true"]{border-color:var(--ink);box-shadow:3px 3px 0 var(--ink);background:var(--hl-y)}
.v2 .gallery-note{color:var(--dim)}
.v2 .hand-gal{font-size:1.65rem;margin-top:12px;transform:rotate(-3deg)}
.v2 .hand-gal::before{content:"↑ "}
.v2 .stage-frame{border:2.5px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.v2 .stage-caption{color:var(--dim);font-weight:600}

/* source */
.v2 .src-card p{color:var(--ink)}
.v2 .src-link{background:var(--hl-y);color:var(--ink);border:1.5px solid var(--ink)}
.v2 .src-page{border:2px solid var(--ink)}
.v2 .list li{color:var(--muted)}
.v2 .list li strong{color:var(--ink)}

/* pricing */
.v2 .plan{border-radius:22px}
.v2 .plan.pro{background:#fff8d1;box-shadow:7px 7px 0 var(--ink)}
.v2 .ribbon{background:var(--hl-p);color:var(--ink);border:2px solid var(--ink);transform:rotate(3deg)}
.v2 .plan .sub{color:var(--muted)}

/* faq */
.v2 .faq details{box-shadow:3px 3px 0 var(--ink)}
.v2 .faq details p{color:var(--muted)}
.v2 .faq summary::after{border-color:var(--ink)}

/* final */
.v2 .final{background:var(--hl-y);border-top:2px solid var(--ink);background-image:repeating-linear-gradient(180deg,transparent 0,transparent 37px,rgba(31,29,71,.09) 37px,rgba(31,29,71,.09) 38px)}
.v2 .final h2{color:var(--ink)}
.v2 .final p{color:#3a3866}
.v2 .final .btn-primary{background:#fff}

/* footer */
.v2 .site-footer{border-top:2px solid var(--ink);color:var(--muted)}
.v2 .foot-links a{color:var(--muted)}
.v2 :focus-visible{outline-color:var(--pink)}

@media (max-width:760px){
  .v2 .hero{background-image:linear-gradient(90deg,transparent 10px,rgba(229,72,120,.35) 10px,rgba(229,72,120,.35) 12px,transparent 12px),repeating-linear-gradient(180deg,transparent 0,transparent 37px,rgba(70,130,220,.14) 37px,rgba(70,130,220,.14) 38px)}
  .uc-label{width:100%}
  .uc-s{font-size:.9rem;padding:9px 12px}
  .v2 .steps{gap:34px}
}
@media (max-width:520px){
  .v2 .hand-cta{font-size:1.5rem}
}

/* legal, support and 404 pages */
.v2 .legal{background-color:var(--bg);background-image:repeating-linear-gradient(180deg,transparent 0,transparent 37px,rgba(70,130,220,.08) 37px,rgba(70,130,220,.08) 38px)}
.v2 .legal h1{font-size:clamp(1.75rem,7.4vw,3rem);hyphens:auto;overflow-wrap:break-word}
.v2 .legal h2{font-size:1.4rem;margin-top:2em}
.v2 .legal p,.v2 .legal li{color:#3a3866}
.v2 .legal .meta{color:var(--dim)}
.v2 .legal .lead{color:var(--muted)}
.v2 .legal .summary-box{background:#fff8d1;border:2px solid var(--ink);border-left:8px solid var(--hl-y);box-shadow:4px 4px 0 var(--ink)}
.v2 .legal .summary-box p{color:var(--ink)}
.v2 .contact-card{background:#fff;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.v2 .contact-card div span{color:var(--muted)}
.v2 .legal .faq summary{color:var(--ink)}
.v2 .legal li::marker{color:var(--pink)}