/* FAQ: handwritten notebook style (2026-10-01) */
#website .faq-section.fh{--fh-hand:'Caveat','Segoe Print',cursive;background-color:#fcfaf4!important;background-image:linear-gradient(transparent 31px,rgba(150,175,190,.16) 32px)!important;background-size:100% 32px!important}
#website .fh .fh-note{display:inline-block;font:600 26px/1 var(--fh-hand)!important;letter-spacing:0!important;text-transform:none!important;color:#2f7a4f!important;transform:rotate(-2deg)}
#website .fh h2.fh-h2{margin:8px 0 18px!important;font:600 clamp(42px,3.8vw,58px)/1.02 var(--fh-hand)!important;letter-spacing:0!important;color:#1f2a22!important;transform:rotate(-1deg);transform-origin:left;max-width:12ch}
#website .fh .fh-u{position:relative;z-index:0;display:inline-block;color:#173f2d}
#website .fh .fh-u::after{content:'';position:absolute;left:-3%;right:-3%;bottom:.02em;height:.28em;z-index:-1;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9C45 4 95 3 140 5s45 3 57 1' fill='none' stroke='%23d5a14b' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E")}
#website .fh .fh-lumi{display:flex;align-items:center;gap:12px;margin:10px 0 14px}
#website .fh .fh-lumi img,#website .fh .fh-lumi canvas{width:64px!important;height:64px!important;filter:drop-shadow(0 0 8px rgba(247,184,60,.6));animation:fhFloat 4s ease-in-out infinite}
#website .fh .fh-lumi span{position:relative;padding:8px 14px;border:1.8px solid #1f2a22;border-radius:18px 16px 20px 6px/16px 20px 14px 18px;background:#fff;font:600 21px/1.05 var(--fh-hand);color:#1f2a22;transform:rotate(-2deg)}
#website .fh .faq-more{font:500 20px/1.3 var(--fh-hand)!important;color:#3a4438!important}
#website .fh .faq-more a{color:#2f7a4f;text-decoration:none;background:linear-gradient(transparent 60%,#f6e3ae 60%)}
@keyframes fhFloat{50%{transform:translateY(-5px)}}

/* questions as index cards */
#website .fh .faq-list{gap:12px!important;counter-reset:fq}
#website .fh .faq-item{counter-increment:fq;position:relative;border:0!important;border-radius:3px!important;background:#fffdf7!important;box-shadow:0 1px 0 #e7e1d2,0 8px 18px -8px rgba(60,50,20,.18)!important;
  background-image:linear-gradient(90deg,transparent 52px,rgba(201,87,58,.25) 53px,transparent 54px)!important;transition:transform .25s,box-shadow .25s}
#website .fh .faq-item:nth-child(odd){transform:rotate(-.35deg)}
#website .fh .faq-item:nth-child(even){transform:rotate(.35deg)}
#website .fh .faq-item:hover{transform:rotate(0) translateY(-1px)}
#website .fh .faq-item[open]{transform:rotate(0);background-color:#fff9e3!important;box-shadow:0 1px 0 #e7e1d2,0 16px 30px -12px rgba(60,50,20,.25)!important}
#website .fh .faq-item summary{position:relative;list-style:none;padding:14px 56px 14px 68px!important;font:600 23px/1.15 var(--fh-hand)!important;color:#1f2a22!important;cursor:pointer}
#website .fh .faq-item summary::-webkit-details-marker{display:none}
#website .fh .faq-item summary::before{content:counter(fq);position:absolute;left:14px;top:50%;width:28px;height:28px;margin-top:-14px;display:grid;place-items:center;font:600 20px/1 var(--fh-hand);color:#c9573a;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cpath d='M34 5C16 3 5 15 5 30s11 26 26 25 24-11 24-26S44 6 27 7' fill='none' stroke='%23c9573a' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E")}
#website .fh .faq-item summary::after{content:''!important;position:absolute;right:18px;top:50%;width:22px;height:22px;margin-top:-11px;border:0!important;transform:none;transition:transform .3s;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3c.3 6 .1 12-.3 18M3 12.5c6-.4 12-.3 18 .2' fill='none' stroke='%232f7a4f' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E")!important}
#website .fh .faq-item[open] summary::after{transform:rotate(45deg)}
#website .fh .faq-item p{margin:0!important;padding:0 28px 16px 68px!important;font-size:15px!important;line-height:1.6!important;color:#3f4a42!important}
#website .fh .faq-item p a{color:#2f7a4f}
#website .fh .faq-item summary:focus-visible{outline:3px solid #d5a14b;outline-offset:2px}
@media(min-width:1024px) and (max-height:820px){
  #website .fh .faq-item summary{padding-top:10px!important;padding-bottom:10px!important;font-size:21px!important}
  #website .fh .faq-list{gap:8px!important}
  #website .fh .fh-lumi{display:none}
}
@media(max-width:760px){
  #website .fh h2.fh-h2{max-width:none}
  #website .fh .faq-item summary{padding:12px 46px 12px 56px!important;font-size:21px!important}
  #website .fh .faq-item summary::before{left:10px}
  #website .fh .faq-item p{padding:0 18px 14px 56px!important}
  #website .fh .faq-item{background-image:linear-gradient(90deg,transparent 44px,rgba(201,87,58,.25) 45px,transparent 46px)!important}
}
@media(prefers-reduced-motion:reduce){#website .fh .faq-item,#website .fh .faq-item summary::after{transition:none}#website .fh .fh-lumi img{animation:none}}
#website .fh-lumi canvas.lumi-live{width:64px!important;height:64px!important}

/* Intro hint in handwriting */
.intro-hint.ih-hand{margin-top:14px;font:600 clamp(28px,2.4vw,34px)/1.1 'Caveat','Segoe Print',cursive!important;letter-spacing:0!important;color:#f3d9a4!important;transform:rotate(-2deg)}
.ih-hand .ih-u{position:relative;display:inline-block;color:#ffe7a6}
.ih-hand .ih-u::after{content:'';position:absolute;left:-4%;right:-4%;bottom:-.1em;height:.3em;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9C45 4 95 3 140 5s45 3 57 1' fill='none' stroke='%23e0a53e' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E")}
.intro-hint.ih-hand small{margin-top:8px;font:500 clamp(19px,1.6vw,22px)/1.2 'Caveat','Segoe Print',cursive!important;color:#b9ac8c!important;transform:rotate(1deg)}
html:has(#intro:not([hidden])){background:#000}

/* Closing line above footer, handwritten */
#website .about p.ab-hand{text-align:center}
#website .about p.ab-hand strong{display:block;font:600 clamp(34px,3.4vw,50px)/1.1 'Caveat','Segoe Print',cursive!important;letter-spacing:0!important;color:#1f2a22!important;transform:rotate(-1.5deg)}
#website .ab-hand .ab-u{position:relative;display:inline-block;color:#173f2d}
#website .ab-hand .ab-u::after{content:'';position:absolute;left:-4%;right:-4%;bottom:-.06em;height:.26em;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9C45 4 95 3 140 5s45 3 57 1' fill='none' stroke='%23d5a14b' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E")}
#website .about p.ab-hand span{display:block;margin-top:8px;font:500 clamp(22px,1.8vw,26px)/1.2 'Caveat','Segoe Print',cursive!important;color:#2f7a4f!important;transform:rotate(1deg)}
#website .ab-hand span i{font-style:normal;color:#d5a14b}
#website .about p.ab-hand strong .ab-u{display:inline-block!important;margin:0!important;font:inherit!important;color:#173f2d!important;transform:none!important}
#website .about p.ab-hand strong{display:block!important}
