/**
 * The Ultimate High School Pack — flagship bundle landing page.
 * Combines all 3 level packs (Learning Journey / Common Core,
 * Rising Momentum / 1st Bac, Smart English Worksheets / 2nd Bac) into
 * one offer. Deliberately its own premium charcoal-and-gold identity,
 * distinct from all three sub-packs — their real colors appear only as
 * small accent chips/cards, never as the dominant palette here, so this
 * page reads as the flagship tier above them, not a copy of any one.
 * Loaded only on page-ultimate-high-school-pack.php.
 *
 * @package MyTeacher_Child
 */

.mtu-page{
	--mtu-charcoal:#14111c;
	--mtu-charcoal-2:#1d1828;
	--mtu-charcoal-3:#241c30;
	--mtu-gold:#E0A93F;
	--mtu-gold-deep:#C8902A;
	--mtu-gold-tint:#FBF1DA;
	--mtu-ink:#241f2e;
	--mtu-ink-soft:#665f75;
	--mtu-line:#e7e2ee;
	--mtu-cream:#f9f7fb;
	/* Real level colors — used ONLY as small accents/cards, never the page's own gradient */
	--lv-cc-1:#ea8c55; --lv-cc-2:#81171b;
	--lv-bac1-1:#006466; --lv-bac1-2:#4d194d;
	--lv-2bac-1:#0E9A6E; --lv-2bac-2:#213A47; --lv-2bac-gold:#E0A93F;
	overflow-x:hidden;
}
.mtu-wrap{ max-width:1180px; margin:0 auto; padding:0 20px; }
.mtu-page section{ padding:66px 0; }
.mtu-page h1,.mtu-page h2,.mtu-page h3,.mtu-page h4{ font-family:var(--mt-display); font-weight:800; letter-spacing:-.02em; }
.mtu-page p{ line-height:1.6; color:var(--mtu-ink); }
.mtu-bg-cream{ background:var(--mtu-cream); }
.mtu-bg-charcoal{ background:var(--mtu-charcoal); color:#fff; }

/* Protected preview images — CSS background-image, never a real <img> */
.mtu-shot{
	background-repeat:no-repeat; background-position:center top; background-size:cover;
	-webkit-user-select:none; user-select:none; pointer-events:none;
}

/* ---------- Hero ---------- */
.mtu-hero{
	position:relative; overflow:hidden; color:#fff;
	background:
		radial-gradient(circle at 88% 15%, rgba(224,169,63,.22), transparent 42%),
		radial-gradient(circle at 10% 90%, rgba(224,169,63,.10), transparent 40%),
		linear-gradient(150deg, #14111c 0%, #1d1828 45%, #241c30 75%, #191320 100%);
	padding:52px 0 0;
}
.mtu-hero::before{
	content:""; position:absolute; inset:0;
	background-image:radial-gradient(circle, rgba(255,255,255,.06) 1.5px, transparent 1.5px);
	background-size:28px 28px; opacity:.5; pointer-events:none;
}
.mtu-hero-grid{ position:relative; display:grid; grid-template-columns:1.05fr 1.15fr; gap:12px; align-items:center; }
.mtu-hero-copy{ padding-bottom:44px; }
.mtu-crown-chip{
	display:inline-flex; align-items:center; gap:8px; background:rgba(224,169,63,.14);
	border:1px solid rgba(224,169,63,.5); padding:8px 16px; border-radius:999px; color:var(--mtu-gold);
	font-family:var(--mt-display); font-weight:700; font-size:.76rem; letter-spacing:.05em;
	text-transform:uppercase; margin-bottom:20px;
}
.mtu-hero h1{ color:#fff; font-size:clamp(2rem,4.2vw,3.3rem); line-height:1.08; margin:0 0 16px; }
.mtu-hero h1 em{
	font-style:normal; background:linear-gradient(90deg,var(--mtu-gold),#FFE9B8 60%);
	-webkit-background-clip:text; background-clip:text; color:transparent;
}
.mtu-hero-lead{ font-size:1.05rem; color:rgba(255,255,255,.82); max-width:480px; margin-bottom:26px; }
.mtu-hero-stats{ display:grid; grid-template-columns:repeat(4,auto); gap:22px; margin-bottom:30px; }
.mtu-hero-stat b{ display:block; font-family:var(--mt-display); font-size:1.55rem; font-weight:800; color:var(--mtu-gold); }
.mtu-hero-stat span{ font-size:.7rem; color:rgba(255,255,255,.68); font-weight:700; text-transform:uppercase; letter-spacing:.03em; }
.mtu-hero-cta{ display:flex; gap:14px; flex-wrap:wrap; }

.mtu-btn{
	font-family:var(--mt-display); font-weight:700; font-size:.94rem; padding:15px 28px; border-radius:999px;
	display:inline-flex; align-items:center; gap:8px; cursor:pointer; border:none;
	transition:transform .15s ease, box-shadow .15s ease;
}
.mtu-btn:hover{ transform:translateY(-2px); }
.mtu-btn-gold{ background:linear-gradient(135deg,var(--mtu-gold),var(--mtu-gold-deep)); color:#221a08; box-shadow:0 14px 30px rgba(224,169,63,.35); }
.mtu-btn-gold:hover{ filter:brightness(1.08); color:#221a08; }
.mtu-btn-ghost{ background:rgba(255,255,255,.08); color:#fff; border:1.5px solid rgba(255,255,255,.4); }
.mtu-btn-ghost:hover{ background:rgba(255,255,255,.16); color:#fff; }

/* Hero character art — the transparent 3D teacher illustration */
.mtu-hero-art{ position:relative; display:flex; align-items:flex-end; justify-content:center; height:100%; min-height:340px; }
.mtu-hero-teacher{
	width:100%; max-width:640px; aspect-ratio:1400/1050; background-repeat:no-repeat;
	background-position:bottom center; background-size:contain; position:relative; z-index:2;
	filter:drop-shadow(0 30px 40px rgba(0,0,0,.45));
}
.mtu-hero-glow{
	position:absolute; bottom:6%; left:50%; transform:translateX(-50%); width:70%; height:60px;
	background:radial-gradient(ellipse, rgba(224,169,63,.35), transparent 70%); z-index:1; filter:blur(6px);
}
@media (max-width:960px){
	.mtu-hero-grid{ grid-template-columns:1fr; }
	.mtu-hero-copy{ text-align:center; padding-bottom:0; }
	.mtu-hero-lead{ margin-left:auto; margin-right:auto; }
	.mtu-hero-stats{ grid-template-columns:repeat(2,auto); justify-content:center; }
	.mtu-hero-cta{ justify-content:center; }
	.mtu-hero-art{ min-height:260px; margin-top:20px; }
	.mtu-hero-teacher{ max-width:420px; }
}

/* ---------- Three-level color strip ---------- */
.mtu-level-strip{ display:flex; height:8px; width:100%; }
.mtu-level-strip i{ flex:1; display:block; }
.mtu-level-strip .lv-cc{ background:linear-gradient(90deg,var(--lv-cc-1),var(--lv-cc-2)); }
.mtu-level-strip .lv-bac1{ background:linear-gradient(90deg,var(--lv-bac1-1),var(--lv-bac1-2)); }
.mtu-level-strip .lv-2bac{ background:linear-gradient(90deg,var(--lv-2bac-2),var(--lv-2bac-1)); }

/* ---------- Section heads ---------- */
.mtu-sec-head{ text-align:center; max-width:660px; margin:0 auto 40px; }
.mtu-sec-eyebrow{
	display:inline-block; font-family:var(--mt-display); font-weight:700; font-size:.75rem;
	text-transform:uppercase; letter-spacing:.05em; color:var(--mtu-gold-deep); margin-bottom:10px;
}
.mtu-bg-charcoal .mtu-sec-eyebrow{ color:var(--mtu-gold); }
.mtu-sec-head h2{ font-size:clamp(1.5rem,2.8vw,2.1rem); margin:0 0 12px; color:var(--mtu-ink); }
.mtu-bg-charcoal .mtu-sec-head h2{ color:#fff; }
.mtu-sec-head p{ color:var(--mtu-ink-soft); font-size:.98rem; }
.mtu-bg-charcoal .mtu-sec-head p{ color:rgba(255,255,255,.72); }

/* ---------- Three level cards ---------- */
.mtu-levels{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:900px){ .mtu-levels{ grid-template-columns:1fr; } }
.mtu-level-card{
	background:#fff; border-radius:20px; overflow:hidden; box-shadow:var(--mt-shadow-lg);
	border:1px solid var(--mtu-line); display:flex; flex-direction:column;
}
.mtu-level-card-head{ padding:20px 22px 16px; color:#fff; position:relative; }
.mtu-level-card.cc .mtu-level-card-head{ background:linear-gradient(120deg,var(--lv-cc-1),var(--lv-cc-2)); }
.mtu-level-card.bac1 .mtu-level-card-head{ background:linear-gradient(120deg,var(--lv-bac1-1),var(--lv-bac1-2)); }
.mtu-level-card.bac2 .mtu-level-card-head{ background:linear-gradient(120deg,var(--lv-2bac-2),var(--lv-2bac-1)); }
.mtu-level-card-eyebrow{ font-family:var(--mt-display); font-weight:700; font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; opacity:.85; margin-bottom:4px; }
.mtu-level-card-head h3{ color:#fff; font-size:1.28rem; margin:0; }
.mtu-level-card-covers{ display:flex; gap:10px; padding:18px 22px 0; }
.mtu-level-card-covers .mtu-shot{ flex:1; aspect-ratio:650/918; border-radius:8px; box-shadow:0 8px 18px rgba(0,0,0,.18); }
.mtu-level-card-body{ padding:16px 22px 22px; flex:1; display:flex; flex-direction:column; }
.mtu-level-card-stats{ display:flex; gap:16px; margin:4px 0 12px; }
.mtu-level-card-stats div{ text-align:left; }
.mtu-level-card-stats b{ display:block; font-family:var(--mt-display); font-weight:800; font-size:1.25rem; color:var(--mtu-ink); }
.mtu-level-card-stats span{ font-size:.68rem; color:var(--mtu-ink-soft); text-transform:uppercase; font-weight:700; letter-spacing:.02em; }
.mtu-level-card-body p{ font-size:.86rem; margin:0 0 14px; flex:1; }
.mtu-level-card-link{
	font-family:var(--mt-display); font-weight:700; font-size:.82rem; display:inline-flex; align-items:center; gap:5px;
}
.mtu-level-card.cc .mtu-level-card-link{ color:var(--lv-cc-2); }
.mtu-level-card.bac1 .mtu-level-card-link{ color:var(--lv-bac1-1); }
.mtu-level-card.bac2 .mtu-level-card-link{ color:var(--lv-2bac-2); }

/* ---------- Savings comparison ---------- */
.mtu-savings{ display:grid; grid-template-columns:1fr; gap:16px; max-width:720px; margin:0 auto; }
.mtu-savings-row{
	display:flex; align-items:center; justify-content:space-between; background:rgba(255,255,255,.05);
	border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:16px 22px; gap:14px; flex-wrap:wrap;
}
.mtu-savings-row .mtu-sv-label{ font-family:var(--mt-display); font-weight:700; color:#fff; font-size:.95rem; }
.mtu-savings-row .mtu-sv-nums{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.mtu-sv-separate{ color:rgba(255,255,255,.5); text-decoration:line-through; font-size:.9rem; }
.mtu-sv-bundle{ font-family:var(--mt-display); font-weight:800; font-size:1.3rem; color:var(--mtu-gold); }
.mtu-sv-save{
	background:rgba(224,169,63,.16); border:1px solid rgba(224,169,63,.4); color:var(--mtu-gold);
	font-family:var(--mt-display); font-weight:700; font-size:.76rem; padding:5px 12px; border-radius:999px;
}

/* ---------- Preview mosaic ---------- */
.mtu-mosaic{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
@media (max-width:980px){ .mtu-mosaic{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px){ .mtu-mosaic{ grid-template-columns:repeat(2,1fr); } }
.mtu-mosaic-item{ border-radius:12px; overflow:hidden; box-shadow:var(--mt-shadow); border:1px solid var(--mtu-line); position:relative; }
.mtu-mosaic-item .mtu-shot{ aspect-ratio:650/918; }
.mtu-mosaic-item .mtu-mos-tag{
	position:absolute; bottom:8px; left:8px; background:rgba(20,17,28,.82); color:#fff; font-family:var(--mt-display);
	font-weight:700; font-size:.64rem; padding:4px 9px; border-radius:999px; text-transform:uppercase; letter-spacing:.03em;
}

/* ---------- Trust / badge section ---------- */
.mtu-trust-grid{ display:grid; grid-template-columns:1fr auto 1fr; gap:36px; align-items:center; }
@media (max-width:820px){ .mtu-trust-grid{ grid-template-columns:1fr; } }
.mtu-trust-badge{ display:flex; justify-content:center; }
.mtu-trust-badge .mtu-shot{ width:150px; aspect-ratio:500/750; filter:drop-shadow(0 18px 30px rgba(0,0,0,.15)); }
.mtu-trust-list{ display:grid; gap:14px; }
.mtu-trust-item{ display:flex; gap:12px; align-items:flex-start; }
.mtu-trust-item .mtu-tick{
	width:28px; height:28px; border-radius:50%; background:var(--mtu-gold-tint); color:var(--mtu-gold-deep);
	display:flex; align-items:center; justify-content:center; font-weight:800; flex:none; font-size:.85rem;
}
.mtu-trust-item h4{ font-size:.95rem; margin:0 0 3px; color:var(--mtu-ink); }
.mtu-trust-item p{ font-size:.84rem; margin:0; color:var(--mtu-ink-soft); }

/* ---------- Order / final CTA ---------- */
.mtu-order{
	position:relative; overflow:hidden; color:#fff; text-align:center;
	background:
		radial-gradient(circle at 85% 10%, rgba(224,169,63,.25), transparent 45%),
		linear-gradient(150deg, #14111c 0%, #1d1828 45%, #241c30 75%, #191320 100%);
	border-radius:28px; padding:56px 26px; margin:0 20px;
	border:1px solid rgba(224,169,63,.25);
}
.mtu-order h2{ color:#fff; font-size:clamp(1.5rem,3vw,2.1rem); margin:0 0 12px; }
.mtu-order > p{ color:rgba(255,255,255,.82); max-width:560px; margin:0 auto 26px; font-size:.98rem; }
.mtu-order-form-wrap{ max-width:480px; margin:0 auto; text-align:left; }

.mtu-order .mt-order-form{ background:#fff; border-radius:18px; padding:26px; box-shadow:0 30px 60px rgba(0,0,0,.4); }
.mtu-order .mt-order-form label{ font-family:var(--mt-display); font-weight:700; font-size:.82rem; color:var(--mtu-ink); display:block; margin:12px 0 5px; }
.mtu-order .mt-order-form input[type="text"],
.mtu-order .mt-order-form input[type="email"],
.mtu-order .mt-order-form input[type="tel"],
.mtu-order .mt-order-form textarea{
	width:100%; padding:10px 12px; border:1.5px solid var(--mtu-line); border-radius:10px; font-family:var(--mt-sans);
	font-size:.92rem; color:var(--mtu-ink);
}
.mtu-order .mt-field-note{ font-size:.76rem; color:var(--mtu-ink-soft); margin:4px 0 0; }
.mtu-order .mt-order-format{ border:none; padding:0; margin:16px 0 0; }
.mtu-order .mt-order-format legend{ font-family:var(--mt-display); font-weight:700; font-size:.82rem; color:var(--mtu-ink); padding:0 0 6px; }
.mtu-order .mt-radio{
	display:flex; align-items:center; gap:8px; padding:10px 12px; border:1.5px solid var(--mtu-line); border-radius:10px;
	margin-bottom:8px; font-size:.86rem; color:var(--mtu-ink); cursor:pointer;
}
.mtu-order .mt-radio .mt-price{ margin-left:auto; font-family:var(--mt-display); font-weight:800; color:var(--mtu-gold-deep); }
.mtu-order .mt-order-address{ margin-top:10px; }
.mtu-order .mt-hp{ position:absolute; left:-9999px; }
.mtu-order button[type="submit"]{
	width:100%; margin-top:18px; background:linear-gradient(135deg,var(--mtu-gold),var(--mtu-gold-deep)); color:#221a08;
	border:none; border-radius:999px; padding:15px; font-family:var(--mt-display); font-weight:800; font-size:.96rem; cursor:pointer;
}
.mtu-order button[type="submit"]:hover{ filter:brightness(1.08); }
.mtu-order .mt-form-error{ background:#FBE4E0; color:#8A2E1D; padding:10px 14px; border-radius:10px; font-size:.85rem; margin-bottom:12px; }

.mtu-order .mt-payment-box{ background:#fff; border-radius:18px; padding:26px; box-shadow:0 30px 60px rgba(0,0,0,.4); text-align:left; }
.mtu-order .mt-payment-check{
	width:44px; height:44px; border-radius:50%; background:var(--mtu-gold); color:#221a08; display:flex;
	align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:12px;
}
.mtu-order .mt-payment-box h3{ color:var(--mtu-ink); margin:0 0 12px; }
.mtu-order .mt-rib-card{ background:var(--mtu-cream); border-radius:12px; padding:14px 16px; margin-bottom:12px; }
.mtu-order .mt-rib-card p{ margin:4px 0; font-size:.88rem; color:var(--mtu-ink); }
.mtu-order .mt-payment-instr{ font-size:.88rem; color:var(--mtu-ink-soft); margin-bottom:16px; }
.mtu-order .mt-btn.mt-btn-gold{
	display:inline-flex; background:linear-gradient(135deg,var(--mtu-gold),var(--mtu-gold-deep)); color:#221a08;
	font-family:var(--mt-display); font-weight:800; padding:12px 22px; border-radius:999px;
}

.mtu-back-link{ text-align:center; color:var(--mtu-ink-soft); font-size:.85rem; margin-top:18px; }
.mtu-back-link a{ color:var(--mtu-gold-deep); font-weight:700; }
.mtu-footer-note{ text-align:center; padding:24px 20px 0; color:var(--mtu-ink-soft); font-size:.78rem; }