@font-face{font-family:'Young Serif';src:url(assets/fonts/young-serif-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Figtree';src:url(assets/fonts/figtree-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Figtree';src:url(assets/fonts/figtree-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Figtree';src:url(assets/fonts/figtree-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Figtree';src:url(assets/fonts/figtree-latin-400-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
body{margin:0}
.wiic{
  --plum:#3C0A3C; --purple:#4A1A5E; --indigo:#4B4F9E; --rasp-felt:#8E1B4A;
  --gold:#EDB92E; --gold-soft:#F4CF63; --raspberry:#B3245C; --rasp-deep:#8A1543; --royal:#2B4CD1;
  --paper:#F7EEDB; --paper-2:#EFE2C4; --card:#FFFAEF; --ink:#2B0F33; --ink-soft:#4E3556;
  --display:"Young Serif", "Iowan Old Style", Georgia, serif;
  --body:"Figtree", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --grain:url(assets/img/grain-felt.png);
  --focus:var(--royal);
  font-family:var(--body); color:var(--ink); background:var(--paper);
  font-size:1.0625rem; line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.wiic *{box-sizing:border-box}
.wiic img{display:block; max-width:100%; height:auto}
.wiic p{margin:0; text-wrap:pretty}
.wiic ul{margin:0; padding:0; list-style:none}
.wiic h1,.wiic h2,.wiic h3{margin:0; font-family:var(--display); font-weight:400; text-wrap:balance}
.wiic a{color:inherit}
.wiic :focus-visible{outline:3px solid var(--focus); outline-offset:4px; border-radius:3px}
.wiic .on-dark{--focus:var(--gold-soft)}
.wiic section[id]{scroll-margin-top:1.5rem}
@media (prefers-reduced-motion: no-preference){ html{scroll-behavior:smooth} }

.wiic .skip{position:absolute; left:1rem; top:-4rem; z-index:10; background:var(--gold); color:var(--ink); padding:.7rem 1rem; font-weight:600; text-decoration:none; border-radius:2px}
.wiic .skip:focus{top:1rem}

/* surfaces: felt and paper, as on the mood board */
.wiic .felt{background-color:var(--plum); background-image:url(assets/img/grain-felt.png); background-size:256px}
.wiic .felt-indigo{background-color:var(--indigo); background-image:url(assets/img/grain-felt.png); background-size:256px}
.wiic .felt-rasp{background-color:var(--rasp-felt); background-image:url(assets/img/grain-felt.png); background-size:256px}
.wiic .paper{background-color:var(--paper); background-image:url(assets/img/grain-paper.png); background-size:256px}
.wiic .wrap{width:100%; max-width:76rem; margin:0 auto; padding-inline:clamp(1rem,4vw,3rem)}
.wiic .rel{position:relative}

/* textile swatches and paper cut-outs (decorative, original) */
.wiic .swatch{position:absolute; pointer-events:none; box-shadow:0 10px 20px -12px rgba(0,0,0,.6); clip-path:polygon(0 2%,6% 0,14% 3%,22% 0,31% 2%,40% 0,50% 3%,60% 0,70% 2%,80% 0,90% 3%,100% 1%,100% 98%,92% 100%,83% 97%,74% 100%,64% 98%,54% 100%,44% 97%,34% 100%,24% 98%,14% 100%,6% 97%,0 100%)}
.wiic .ticking{background:repeating-linear-gradient(90deg, #4A1A5E 0 9px, #F1E5CC 9px 21px, #4A1A5E 21px 24px, #F1E5CC 24px 36px)}
.wiic .gingham{background-color:#F7EEDB; background-image:repeating-linear-gradient(0deg, rgba(179,36,92,.55) 0 9px, transparent 9px 18px), repeating-linear-gradient(90deg, rgba(179,36,92,.55) 0 9px, transparent 9px 18px)}
.wiic .indigo-check{background-color:#363A7E; background-image:repeating-linear-gradient(0deg, rgba(247,238,219,.18) 0 6px, transparent 6px 14px), repeating-linear-gradient(90deg, rgba(247,238,219,.18) 0 6px, transparent 6px 14px)}
.wiic .gold-felt{background-color:var(--gold); background-image:url(assets/img/grain-felt.png); background-size:200px}
.wiic .cutout{position:absolute; pointer-events:none; color:var(--gold); filter:drop-shadow(0 3px 2px rgba(20,0,20,.45))}
.wiic .cutout svg{display:block; width:100%; height:100%}

/* header: paper-plane mark + live wordmark, taped-note navigation (kept from v4) */
.wiic .head{color:var(--paper)}
.wiic .head-inner{display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:1.25rem 2rem; padding-top:1.4rem; padding-bottom:1rem}
.wiic .brand{display:flex; align-items:flex-end; gap:.55rem; text-decoration:none; padding:.25rem 0}
.wiic .brand-text{display:grid; line-height:1}
.wiic .brand-text .quiet{font-family:var(--body); font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; font-weight:600; color:var(--gold-soft)}
.wiic .brand-text .loud{font-family:var(--display); font-size:1.5rem; line-height:1.1; margin:.18rem 0 .2rem}
.wiic .brand img{width:2.7rem; height:auto; margin-bottom:.05rem}
.wiic .notes{list-style:none; margin:0; padding:.5rem 0 0; display:flex; flex-wrap:wrap; gap:1rem .9rem}
.wiic .note{position:relative; display:block; min-height:44px; padding:.85rem 1rem .7rem; font-weight:600; font-size:.94rem; line-height:1.2; text-decoration:none; color:var(--ink); background:var(--paper-2); box-shadow:0 1px 0 rgba(0,0,0,.08), 0 6px 14px -6px rgba(10,0,20,.55); transform:rotate(var(--tilt,0deg)); transition:transform .25s ease}
.wiic .note:hover{transform:rotate(0deg) translateY(-2px)}
.wiic .note:focus-visible{transform:rotate(0deg); outline-offset:5px}
.wiic .note.gold{background:var(--gold-soft)}
.wiic .note.rasp{background:var(--raspberry); color:var(--paper)}
.wiic .tape{position:absolute; left:50%; top:-.6rem; width:3.4rem; height:1.15rem; transform:translateX(-50%) rotate(var(--tape,-3deg)); background:rgba(246,236,206,.62); box-shadow:0 0 0 1px rgba(255,255,255,.12) inset; clip-path:polygon(3% 8%,10% 0,20% 10%,32% 2%,45% 9%,58% 0,70% 8%,82% 1%,94% 9%,100% 4%,97% 92%,88% 100%,76% 92%,64% 100%,50% 93%,38% 100%,25% 92%,12% 100%,0 94%); pointer-events:none; z-index:2}
.wiic .paper .tape{background:rgba(201,178,128,.5)}

/* shared type */
.wiic .label{display:inline-block; font-family:var(--body); font-size:.78rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600; color:var(--raspberry); margin-bottom:.9rem}
.wiic .on-dark .label{color:var(--gold-soft)}
.wiic h2{font-size:clamp(2.3rem,5vw,3.6rem); line-height:1.05; color:var(--purple)}
.wiic .on-dark h2{color:var(--paper)}
.wiic h3{font-size:1.45rem; line-height:1.2; color:var(--purple)}
.wiic .on-dark h3{color:var(--gold-soft)}
.wiic .prose{display:grid; gap:1.1rem; max-width:34rem; font-size:1.12rem; color:var(--ink-soft)}
.wiic .on-dark .prose{color:#EFE6F0}
.wiic .sect{padding-top:clamp(4rem,9vw,7.5rem); padding-bottom:clamp(4rem,9vw,7.5rem)}
.wiic .textlink{font-weight:600; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:5px; text-decoration-color:var(--gold); padding:.6rem 0; display:inline-block}
.wiic .textlink:hover{text-decoration-color:currentColor}

/* status stamp for anything not yet real */
.wiic .stamp{display:inline-block; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--rasp-deep); border:1.5px solid currentColor; border-radius:3px; padding:.18rem .45rem .14rem; transform:rotate(-2deg); white-space:nowrap; line-height:1.3}
.wiic .on-dark .stamp.light{color:var(--gold-soft)}
.wiic .tag{position:relative; display:inline-block; padding:.55rem .9rem .5rem; background:var(--paper-2); color:var(--ink); font-size:.9rem; font-weight:500; transform:rotate(-1.5deg); box-shadow:0 6px 14px -8px rgba(0,0,0,.6)}
.wiic .tag .tape{width:2.6rem; height:.95rem; top:-.5rem}

/* hero: editorial introduction with a small collage */
.wiic .hero{color:var(--paper)}
.wiic .hero-grid{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(2rem,5vw,4.5rem); align-items:center; padding-top:clamp(2.5rem,7vw,5.5rem); padding-bottom:clamp(3.5rem,7vw,6rem)}
.wiic .kicker{font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-soft); font-weight:600; margin-bottom:1.2rem}
.wiic .hero h1{font-size:clamp(3rem,7.6vw,6.2rem); line-height:.98; letter-spacing:-.01em; color:var(--paper)}
.wiic .hero h1 em{font-style:normal; color:var(--gold)}
.wiic .lede{margin-top:1.6rem; font-size:clamp(1.15rem,1.8vw,1.38rem); line-height:1.5; max-width:33rem; color:#F3E7F0}
.wiic .hero-rule{margin-top:2.4rem; padding-top:1.4rem; border-top:1px solid rgba(244,207,99,.35); display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.6rem; max-width:40rem}
.wiic .hero-rule p{font-size:1rem; color:#E7D9E8; flex:1 1 18rem}
.wiic .collage{position:relative; justify-self:end; width:min(100%,25rem); padding:1.5rem 0 1rem}
.wiic .collage .swatch.ticking{width:64%; height:58%; left:-15%; top:-3%; transform:rotate(-8deg)}
.wiic .collage .swatch.gingham{width:44%; height:40%; right:-6%; bottom:2%; transform:rotate(6deg)}
.wiic .ask-slip{position:absolute; z-index:3; left:-2.2rem; top:-.4rem; background:var(--gold-soft); color:var(--ink); font-family:var(--display); font-size:1.12rem; line-height:1.2; padding:.75rem 1rem .65rem; transform:rotate(-6deg); box-shadow:0 12px 22px -12px rgba(0,0,0,.7)}
.wiic .ask-slip .tape{width:2.6rem; height:.95rem; top:-.5rem}
.wiic .hero-print{position:relative; background:var(--card); padding:.6rem .6rem 0; transform:rotate(2.2deg); box-shadow:0 22px 40px -20px rgba(0,0,0,.75); margin:0; z-index:1}
.wiic .hero-print .tape{top:-.6rem}
.wiic .hero-print figcaption{font-family:var(--display); color:var(--purple); font-size:1.08rem; line-height:1.3; padding:.8rem .4rem 1rem}

/* mission */
.wiic .mission-head{max-width:60rem}
.wiic .mission-head h2{font-size:clamp(2.1rem,4.4vw,3.5rem); line-height:1.12}
.wiic .mission-head h2 span{color:var(--raspberry)}
.wiic .mission-cols{margin-top:clamp(2.5rem,5vw,4rem); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2rem,5vw,4.5rem); padding-top:2rem; border-top:1px solid rgba(74,26,94,.18)}
.wiic .mission-cols h3{margin-bottom:.9rem}
.wiic .dropcap::first-letter{font-family:var(--display); float:left; font-size:3.4em; line-height:.82; padding:.08em .1em 0 0; color:var(--raspberry)}
.wiic .mission-foot{margin-top:clamp(2.5rem,5vw,4rem); display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(2rem,5vw,4.5rem); align-items:start}
.wiic .reach{max-width:36rem; font-size:1.18rem; line-height:1.55; color:var(--ink); font-family:var(--display)}
.wiic .inspiration{position:relative; background:var(--card); padding:1.6rem 1.5rem 1.3rem; transform:rotate(-1.2deg); box-shadow:0 16px 30px -18px rgba(43,15,51,.55); display:grid; gap:.7rem; border-left:0}
.wiic .inspiration h3{font-size:1.2rem; color:var(--raspberry)}
.wiic .inspiration p{font-size:1rem; color:var(--ink-soft)}
.wiic .inspiration .fine{font-size:.85rem; color:#5E4766}

/* for parents: ruled index card on a gold felt patch */
.wiic .split{display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(2.5rem,6vw,5.5rem); align-items:start}
.wiic .card-wrap{position:relative; padding:1rem 0 0}
.wiic .card-wrap .gold-felt{position:absolute; inset:2.5rem -1.2rem -1.4rem 2rem; transform:rotate(2.5deg); box-shadow:0 18px 30px -18px rgba(0,0,0,.6)}
.wiic .index-card{position:relative; background-color:var(--card); color:var(--ink); padding:2.2rem clamp(1.2rem,3vw,2.2rem) 1.6rem; box-shadow:0 24px 44px -24px rgba(10,10,40,.8); transform:rotate(-1deg); background-image:linear-gradient(transparent 3.9rem, var(--raspberry) 3.9rem, var(--raspberry) calc(3.9rem + 1.5px), transparent calc(3.9rem + 1.5px)), repeating-linear-gradient(transparent 0, transparent calc(1.9rem - 1px), rgba(43,76,209,.22) calc(1.9rem - 1px), rgba(43,76,209,.22) 1.9rem)}
.wiic .index-card .tape{top:-.6rem}
.wiic .index-card .card-title{font-family:var(--display); font-size:1.15rem; color:var(--purple); line-height:1.2; margin-bottom:1.6rem}
.wiic .index-card li{display:grid; gap:.3rem; padding:1rem 0; border-top:1px dashed rgba(74,26,94,.25)}
.wiic .index-card li:first-child{border-top:0; padding-top:.2rem}
.wiic .entry-top{display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .8rem}
.wiic .entry-top h3{font-size:1.25rem; color:var(--purple)}
.wiic .index-card p{font-size:1rem; color:var(--ink-soft)}

/* for educators: staggered taped slips on a pinned swatch */
.wiic .split.flip{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.wiic .slips{position:relative; display:grid; gap:1.6rem; padding-top:.6rem}
.wiic .slips .swatch.indigo-check{width:70%; height:72%; left:12%; top:14%; transform:rotate(-3deg); opacity:.95}
.wiic .slip{position:relative; background:var(--card); padding:1.4rem 1.4rem 1.2rem; max-width:27rem; box-shadow:0 14px 28px -16px rgba(43,15,51,.55); transform:rotate(var(--tilt,0deg))}
.wiic .slip.gold{background:var(--gold-soft)}
.wiic .slip.shift{margin-left:clamp(0rem,6vw,5rem)}
.wiic .slip p{font-size:1rem; color:var(--ink-soft); margin-top:.45rem}
.wiic .slip.gold p{color:var(--ink)}

/* keep imagination growing */
.wiic .grow-grid{display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2.5rem,6vw,5rem); align-items:start}
.wiic .print-wrap{position:relative}
.wiic .print-wrap .swatch.gingham{width:42%; height:30%; left:-5%; bottom:-6%; transform:rotate(-5deg)}
.wiic .print{position:relative; background:var(--card); padding:.7rem .7rem 2.4rem; box-shadow:0 22px 40px -22px rgba(0,0,0,.7); transform:rotate(-1.6deg); margin:0}
.wiic .print .tape.l{left:1.2rem; top:-.55rem; transform:rotate(-38deg); width:4.2rem}
.wiic .print .tape.r{left:auto; right:-1.4rem; top:-.55rem; transform:rotate(38deg); width:4.2rem}
.wiic .print figcaption{position:absolute; left:1rem; right:1rem; bottom:.7rem; font-size:.85rem; color:var(--ink-soft); font-style:italic}
.wiic .tips{margin-top:2.2rem; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(15rem,100%),1fr)); gap:2rem 2.5rem}
.wiic .tip h3{display:flex; align-items:center; gap:.55rem; font-size:1.3rem; margin-bottom:.5rem}
.wiic .tip h3 svg{flex:none; width:.95rem; height:.95rem; color:var(--gold)}
.wiic .tip p{font-size:1.02rem; color:#EFE6F0}
.wiic .grow-notes{margin-top:2.4rem; display:grid; gap:.9rem}
.wiic .grow-note{display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem; font-size:.98rem; color:#E7D9E8}

/* imagination studio */
.wiic .studio-grid{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(2.5rem,6vw,5rem); align-items:start}
.wiic .studio-head{display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.25rem; margin-bottom:1.6rem}
.wiic .studio-head .tag{background:var(--gold-soft); transform:rotate(2deg)}
.wiic .studio-lede{font-family:var(--display); font-size:clamp(1.35rem,2.2vw,1.7rem); line-height:1.3; color:var(--purple); max-width:32rem; margin-bottom:1.4rem}
.wiic .ai-note{position:relative; background-color:var(--card); padding:1.8rem 1.6rem 1.5rem; transform:rotate(1.2deg); box-shadow:0 18px 34px -18px rgba(43,15,51,.55); display:grid; gap:.9rem}
.wiic .ai-note .tape{top:-.6rem}
.wiic .ai-note p{font-size:1.02rem; color:var(--ink-soft)}
.wiic .also-planned{position:relative; margin-top:clamp(3rem,6vw,4.5rem); background:var(--gold-soft); padding:2rem clamp(1.2rem,3vw,2.2rem) 1.8rem; transform:rotate(-.5deg); box-shadow:0 18px 34px -18px rgba(43,15,51,.55)}
.wiic .also-planned .tape{top:-.6rem}
.wiic .also-planned .label{color:var(--rasp-deep); margin-bottom:.5rem}
.wiic .also-planned h3{font-size:clamp(1.4rem,2.4vw,1.8rem)}
.wiic .also-cols{margin-top:1rem; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:1rem clamp(1.5rem,4vw,3rem)}
.wiic .also-cols p{font-size:1.04rem; color:var(--ink)}
.wiic .ai-term{font-weight:600; color:var(--ink); text-decoration:underline; text-decoration-color:var(--royal); text-decoration-thickness:2px; text-underline-offset:4px}

/* get involved */
.wiic .involved-grid{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(2.5rem,6vw,5rem); align-items:center}
.wiic .ways{margin-top:2rem; display:grid; max-width:40rem}
.wiic .ways li{display:grid; gap:.35rem; padding:1.15rem 0; border-top:1px solid rgba(244,207,99,.3)}
.wiic .ways li:last-child{border-bottom:1px solid rgba(244,207,99,.3)}
.wiic .ways h3{font-size:1.3rem; color:var(--paper)}
.wiic .ways p{font-size:1.02rem; color:#F6E6EC}
.wiic .ways .entry-top .stamp{color:var(--gold-soft)}
.wiic .status{margin-top:1.8rem; max-width:40rem; font-size:.98rem; color:#F6E6EC}
.wiic .ig{position:relative; justify-self:center; display:block; width:min(100%,21rem); padding:1.6rem 1.5rem 1.4rem; background:var(--gold-soft); color:var(--ink); text-decoration:none; transform:rotate(-2deg); box-shadow:0 18px 34px -18px rgba(0,0,0,.7); transition:transform .25s ease}
.wiic .ig:hover{transform:rotate(0deg)}
.wiic .ig:focus-visible{transform:rotate(0deg); outline-color:var(--paper)}
.wiic .ig .small{display:block; font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--rasp-deep)}
.wiic .ig .big{display:block; font-family:var(--display); font-size:1.5rem; line-height:1.2; margin:.4rem 0 .6rem}
.wiic .ig .handle{font-weight:600; text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:2px; word-break:break-word}

/* footer */
.wiic .foot{color:#E9DCEA; border-top:1px solid rgba(244,207,99,.25)}
.wiic .foot-inner{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 2rem; padding-top:1.4rem; padding-bottom:2rem; font-size:.92rem}
.wiic .foot-brand{display:flex; align-items:flex-end; gap:.5rem}
.wiic .foot-brand img{width:1.8rem; height:auto}

@media (max-width: 960px){
  .wiic .also-cols{grid-template-columns:minmax(0,1fr)}
  .wiic .hero > .cutout.hide-sm{display:none}
  .wiic .hero-grid,.wiic .split,.wiic .split.flip,.wiic .grow-grid,.wiic .studio-grid,.wiic .involved-grid,.wiic .mission-cols,.wiic .mission-foot{grid-template-columns:minmax(0,1fr)}
  .wiic .collage{justify-self:center; width:min(84%,22rem)}
  .wiic .split.flip .slips{order:2}
  .wiic .print-wrap{max-width:30rem}
  .wiic .card-wrap .gold-felt{inset:2.5rem -.6rem -1.2rem 1.6rem}
}
@media (max-width: 560px){
  .wiic{font-size:1rem}
  .wiic .head-inner{padding-top:1.1rem}
  .wiic .notes{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; gap:1.1rem .9rem}
  .wiic .note{text-align:center; height:100%}
  .wiic .prose,.wiic .reach{font-size:1.04rem}
  .wiic .slip.shift{margin-left:0}
  .wiic .print .tape.r{right:-.6rem}
  .wiic .cutout.hide-sm{display:none}
}
@media (prefers-reduced-motion: reduce){
  .wiic .note,.wiic .ig{transition:none}
  .wiic .note:hover{transform:rotate(var(--tilt,0deg))}
  .wiic .ig:hover{transform:rotate(-2deg)}
}
