/* Scoped interactive learning preview; uses the established homepage type and surfaces. */
.learning-sample{padding:120px 0}
.learning-sample .section-heading h2>span{color:rgba(255,255,255,.65)}
.learning-sample .section-heading .eyebrow{position:relative;display:inline-flex;align-items:center;gap:12px;height:30px;padding:4px 16px;border-radius:393px;background:#ffffff1a;color:#ffffffcc;font-family:Inter,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:-.28px;line-height:21px}
.learning-sample .section-heading .eyebrow:before{width:7px;height:7px;margin:0;vertical-align:initial;background:#fff3f0;animation:intro-dot-pulse 1s linear infinite alternate}
.sample-tabs{display:flex;width:fit-content;max-width:100%;gap:4px;padding:5px;margin:0 auto 28px;background:#ffffff0a;border:1px solid var(--line);border-radius:12px}
.sample-tabs button{background:transparent;padding:11px 21px;border-radius:8px;color:#ffffffa6;transition:background .25s,color .25s;white-space:nowrap}
.sample-tabs button[aria-selected=true]{color:#fff;background:#ffffff17;box-shadow:inset 0 1px #ffffff12}
.sample-tabs button:hover{color:#fff}
.sample-stage{position:relative;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,#1c2020cc,#111313e8 65%);overflow:hidden;isolation:isolate}
.sample-topline,.sample-bottomline{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 32px;color:#ffffff80;font-size:12px}
.sample-topline{border-bottom:1px solid #ffffff0d}
.sample-topline>span:first-child,.sample-micro{font-size:10px;letter-spacing:.12em;font-weight:500;color:#ffffff8c}
.sample-panel{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;padding:48px 56px;min-height:480px;align-items:center;animation:sample-appear .35s ease both}
.sample-panel h3{font-size:30px;line-height:1.2;letter-spacing:-.04em;color:#f5f4f1;margin:20px 0}
.sample-panel p{font-size:14px;line-height:1.75}
.sample-book{width:260px;max-width:100%;aspect-ratio: .7;background:#101d29;border:1px solid #ffffff1c;box-shadow:12px 18px 40px #0005;position:relative;margin:auto;padding:27px;overflow:hidden;border-radius:2px 5px 5px 2px}
.sample-book-brand{display:flex;gap:8px;align-items:center;font-size:20px;letter-spacing:-.05em;margin-bottom:40px}.sample-book-brand img{height:27px;width:22px;object-fit:contain}
.sample-book .sample-micro{font-size:7px;letter-spacing:.12em;color:#b5bdc4}.sample-book h3{font-size:34px;position:relative;z-index:1;margin-top:16px;letter-spacing:-.045em;font-weight:500}.sample-book-foot{position:absolute;bottom:23px;font-size:7px;letter-spacing:.15em;color:#b5bdc4}
.sample-book-path{position:absolute;width:210px;height:275px;right:-95px;bottom:28px;border:1px solid #c99c77;border-radius:50%;transform:rotate(34deg);opacity:.7}
.sample-reading{max-width:430px}.sample-reading h3{margin-top:15px}.sample-takeaway{border-left:1px solid #bba48b;margin:24px 0;padding:0 0 0 19px}.sample-takeaway>span{font-size:9px;letter-spacing:.12em;color:#d5c0ac}.sample-takeaway p{margin-top:8px;color:#e0e0dd}.sample-reading .sample-prompt{font-size:13px;color:#ffffff80}.sample-page-number{display:block;margin-top:26px;font-size:9px;letter-spacing:.12em;color:#ffffff59}
.sample-bottomline{border-top:1px solid #ffffff0d;font-size:11px}.sample-bottomline a{color:#e2d3c8;font-size:12px;white-space:nowrap}.sample-bottomline a span{margin-left:8px}
.sample-question-intro{align-self:center}.sample-small-note{display:block;font-size:11px;color:#ffffff66;margin-top:28px}
.sample-quiz fieldset{border:0;padding:0;margin:0}.sample-quiz legend{font-size:16px;line-height:1.55;margin-bottom:20px;color:#eeefec;font-weight:500}.sample-quiz label{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #ffffff12;border-radius:9px;margin-bottom:8px;font-size:12px;color:#ffffffb3;cursor:pointer;transition:background .2s,border-color .2s}.sample-quiz label:hover{background:#ffffff06}.sample-quiz label:has(input:checked){background:#ffffff0c;border-color:#ffffff40;color:#fff}.sample-quiz label:has(input:focus-visible){outline:2px solid #d9bba3;outline-offset:3px}.sample-quiz input{position:absolute;width:1px;height:1px;opacity:0}.sample-letter{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:5px;background:#ffffff08;color:#ffffff8c;font-size:11px}.sample-quiz label.is-correct{border-color:#8eb79d88;background:#8eb79d10}.sample-quiz label.is-incorrect{border-color:#cba28e88;background:#cba28e10}
.sample-quiz-actions{display:flex;align-items:center;gap:20px;margin-top:20px}.sample-reset{background:none;color:#ffffffa6;font-size:12px;padding:10px 0}.sample-feedback{margin-top:22px;padding:16px 18px;background:#ffffff05;border:1px solid #ffffff14;border-radius:10px}.sample-feedback strong{font-size:13px;font-weight:500;color:#e3d6c8}.sample-feedback p{font-size:12px;margin-top:8px}
.sample-flashcard{display:block;background:transparent;border:0;padding:0;width:100%;height:330px;perspective:1200px;text-align:left;border-radius:16px}.sample-flash-inner{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.22,1,.36,1)}.sample-flashcard[aria-expanded=true] .sample-flash-inner{transform:rotateY(180deg)}.sample-flash-face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;padding:32px;border:1px solid #ffffff20;border-radius:16px;backface-visibility:hidden;background:linear-gradient(145deg,#303638,#1b2023);box-shadow:0 16px 40px #0003}.sample-flash-back{transform:rotateY(180deg);background:linear-gradient(145deg,#343a36,#1c2521)}.sample-flash-face strong{font-size:24px;line-height:1.35;letter-spacing:-.035em;font-weight:500;margin:auto 0;color:#efeeea}.sample-flash-hint{display:flex;justify-content:space-between;align-items:center;width:100%;font-size:12px;color:#ffffff8c}.sample-flash-hint>span{font-size:20px}.sample-flash-detail{color:#ffffffa6;font-size:13px;line-height:1.6;margin-bottom:24px}
@keyframes sample-appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:809px){.learning-sample{padding:80px 0}.sample-panel{padding:32px 24px;gap:32px;grid-template-columns:1fr;min-height:0}.sample-notes{grid-template-columns:.85fr 1.15fr;gap:24px}.sample-topline,.sample-bottomline{padding:18px 24px}.sample-book{padding:20px}.sample-book h3{font-size:27px}.sample-book-brand{margin-bottom:26px}.sample-panel h3{font-size:26px}.sample-reading p{font-size:13px}.sample-tabs button{padding:10px 15px;font-size:13px}.sample-flashcard{max-width:460px;margin:auto}.sample-question-intro{max-width:460px}.sample-quiz{width:100%}}
@media(max-width:560px){.sample-notes{grid-template-columns:1fr}.sample-book{width:220px}.sample-book h3{font-size:29px}.sample-topline{font-size:10px;gap:10px;padding:18px}.sample-topline>span:first-child{font-size:8px}.sample-bottomline{align-items:flex-start;flex-direction:column;gap:12px}.sample-tabs{width:100%;gap:0}.sample-tabs button{flex:1;padding:11px 7px;font-size:11px}.sample-panel{padding:28px 22px}.sample-flash-face{padding:26px}.sample-flash-face strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.sample-panel,.learning-sample .eyebrow:before{animation:none}.sample-flash-inner{transition:none}}

/* Original supplied Day 1 cover, displayed uncropped. */
.learning-sample .sample-book-original{padding:0;aspect-ratio:auto;background:none;border:0;border-radius:0;overflow:visible}
.learning-sample .sample-book-original>img{display:block;width:100%;height:auto;border-radius:0}

/* Fora Chip: inset 1px white/10% outline, without affecting dimensions. */
.learning-sample .section-heading .eyebrow::after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.1);border-radius:inherit;pointer-events:none}
.learning-sample .section-heading .eyebrow::before{flex:none;border-radius:215px}

/* Same rail, selected surface and proximity lighting as Learning Toolkit. */
.learning-sample .sample-tabs{position:relative;isolation:isolate;width:100%;gap:8px;padding:0;border:0;border-radius:72px;background:transparent;margin:0 0 32px}
.learning-sample .sample-tabs button{position:relative;display:flex;justify-content:center;align-items:center;flex:1;min-width:0;height:40px;min-height:40px;padding:8px 24px;border-radius:609px;background:transparent;border:0;box-shadow:none;color:rgba(255,255,255,.8);font-size:16px;line-height:24px;letter-spacing:-.01em;transition:background-color 1s var(--source-spring),color 1s var(--source-spring)}
.learning-sample .sample-tabs button[aria-selected=true]{background:rgba(23,23,23,.85);color:#fff3f0}
.learning-sample .sample-tabs button:hover{color:#fff3f0}
.learning-sample .sample-tabs button[aria-selected=true] .tab-surface{opacity:1}
.learning-sample .sample-tabs .tab-rail{z-index:-1}
.source-page-motion .sample-tabs [data-glow]::after{inset:0;border:0;mask:none;background:radial-gradient(var(--glow-radius,735px) at var(--glow-x,0px) var(--glow-y,0px),var(--tab-glow),transparent);z-index:1}
.learning-sample .sample-stage{border:0;border-radius:24px;background:transparent;overflow:visible;box-shadow:none}
.sample-stage-body{position:relative;border:1px solid rgba(255,255,255,.1);border-radius:24px;overflow:hidden;background:rgba(23,23,23,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
@media(max-width:809px){.learning-sample .sample-tabs button{padding:8px 10px;font-size:14px}}
@media(max-width:560px){.learning-sample .sample-tabs{gap:5px}.learning-sample .sample-tabs button{padding-inline:4px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.learning-sample .sample-tabs button{transition:none}}