*, 
*::after, 
*::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

:root {
	--color-red: #E34349;
	--color-dark: #221B1A;
	--color-orange: #D99013;
	
	--color-green: #084838;
	--color-light-green: #F5FAE7;
	--color-dark-green: #06362A;
	
	--color-brown: #A45944;

    --title-size: min(5vw, 5em);
	
	--font-size-h2: clamp(28px, 4vw, 48px);
}

.insectum-book-shell { max-width: 1600px; margin: 40px auto; }
.insectum-book-stage { margin:0 auto; overflow: hidden; }

.insectum-page{background:#fff;overflow:hidden;position:relative}
.insectum-spread-half{position:relative;background-color:#fff}
.insectum-artwork{position:absolute!important;top:0!important;height:100%!important;width:200%!important;max-width:none!important;min-width:200%!important;object-fit:cover!important;display:block!important;margin:0!important;padding:0!important;border:0!important;z-index:0!important;pointer-events:none}
.insectum-left .insectum-artwork{left:0!important}
.insectum-right .insectum-artwork{left:-100%!important}

.insectum-text-panel { 
    left: 7%;
    top: 7%;
    right: 7%;
    bottom: 7%;

    padding: 4.5% 5%;
    color: #17211D;
    background: #FCF5E8;

    position: absolute;
    z-index: 2;

    border-radius: 10px; 
    box-sizing: border-box;

    display: flex;
    flex-direction: column;

    overflow: hidden;
}
.insectum-text-panel .insectum-text-panel__inner { flex: 1; min-height: 0; padding-right: 10px; padding-bottom: 20px; overflow-y: auto; overflow-x: hidden; }

/* HEADER */
.insectum-page-header h2 { margin-bottom: 0 !important; font-family: 'Kaftan Serif', Georgia, 'Times New Roman', serif; font-size: var(--font-size-h2) !important; color: var(--ink); line-height: 1.2; } 
.insectum-page-header .insectum-subtitle { margin-bottom: 20px; font-size: clamp(18px, 1.2vw, 24px) !important; font-weight: 700; color: var(--color-orange); line-height: 1.5; }

/* BODY */
.insectum-body { font-size: clamp(14px,1.1vw, 18px); line-height: 1.5; }
.insectum-body p:first-child{margin-top:0}

.insectum-fact, 
.insectum-challenge { margin-top: 20px; padding: 20px; font-size: 16px; background: var(--color-light-green); border: 1px solid color-mix(in srgb, var(--color-light-green) 80%, #000000 20%); border-radius: 10px; }
.insectum-challenge { background: color-mix(in srgb, var(--color-orange) 15%, #FFFFFF 85%); border-color: var(--color-orange); }

.insectum-fact strong,
.insectum-challenge strong { margin-bottom: 5px; font-size: 20px; display: block; }

.insectum-fact p,.insectum-challenge p { margin: 0 !important; line-height: 1.5; }

.insectum-book-controls{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:18px}
.insectum-book-controls button{appearance:none; border:1px solid rgba(6,63,51,.22); background:#fff;color:var(--ink);padding:11px 18px;border-radius:10px;cursor:pointer;font-weight:600;box-shadow:0 4px 14px rgba(0,0,0,.06)}
.insectum-book-controls button:hover{ color: #FFFFFF; background: var(--color-dark-green); }
.insectum-counter{min-width:80px;text-align:center;font-variant-numeric:tabular-nums}

/* PAGEFLIP JS FALLBACK */
.insectum-book-fallback .insectum-book-stage { max-width: 1400px; display: grid; grid-template-columns: 1fr 1fr; aspect-ratio: 2/1; }
.insectum-book-fallback .insectum-page { aspect-ratio: 1/1; }
.insectum-book-fallback .insectum-book-controls { display: none; }

@media(max-width: 760px) { 
  .insectum-book-shell{margin:16px auto}
  .insectum-text-panel{left:5%;right:5%;top:5%;bottom:5%;padding:5%}
  .insectum-page-header h2{font-size:34px}
  .insectum-subtitle{font-size:22px}
  .insectum-body{font-size:15px}
  .insectum-fact,.insectum-challenge{padding:12px 14px;border-radius:14px}
  .insectum-book-controls{gap:10px}
  .insectum-book-controls button{padding:9px 12px}
  .insectum-book-fallback .insectum-book-stage{display:block;aspect-ratio:auto}
  .insectum-book-fallback .insectum-page{aspect-ratio:18/23;margin-bottom:12px}
}