/* ============================================================
   Mind Theory — Explore page stylesheet (explore.css)
   Loads after home.css and reuses its design tokens (colors,
   shadows, radii, easing, nav/button/footer/section classes).
   Only page-specific rules live here — self-contained, does not
   modify home.css, styles.css or script.js.
   ============================================================ */

/* ---------------- HERO ---------------- */
.mtx-hero{
  background:radial-gradient(120% 100% at 82% 0%, #EAF2FE 0%, #F6F9FF 45%, #FFFFFF 78%);
  overflow:hidden;
  position:relative;
}
.mtx-hero-inner{
  padding-top:clamp(52px, 8vw, 84px);
  padding-bottom:clamp(56px, 9vw, 100px);
  display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(32px, 5vw, 56px); align-items:center;
}
.mtx-hero-copy .mt-eyebrow{ justify-content:flex-start; }
.mtx-hero-title{
  font-size:clamp(2.5rem, 1.8rem + 2.8vw, 3.8rem);
  line-height:1.08; font-weight:800; margin:4px 0 20px; color:var(--navy-2);
}
.mtx-accent{ color:var(--blue); }
.mtx-hero-desc{
  font-size:1.14rem; color:var(--text-body); max-width:460px; line-height:1.68; margin:0;
}

.mtx-hero-cast{
  position:relative;
  display:flex; align-items:flex-end; justify-content:center;
  gap:clamp(10px, 3vw, 32px);
  padding:20px 0 8px;
}
.mtx-cast-member{
  position:relative; margin:0; display:flex; flex-direction:column; align-items:center;
  flex:1 1 0; max-width:168px;
}
.mtx-cast-member::before{
  content:''; position:absolute; left:50%; bottom:8%; transform:translateX(-50%);
  width:78%; aspect-ratio:1; border-radius:50%; filter:blur(30px); z-index:0; opacity:.6;
}
.mtx-cast-milo::before{ background:#BFD6FB; }
.mtx-cast-mira::before{ background:#FBD3E1; }
.mtx-cast-theo::before{ background:#FCE7C2; }
.mtx-cast-member img{
  position:relative; z-index:1; width:auto; height:clamp(220px, 27vw, 340px); max-width:100%;
  animation:mtxBob 6s ease-in-out infinite;
}
.mtx-cast-milo img{ animation-delay:0s; }
.mtx-cast-mira img{ animation-delay:.4s; }
.mtx-cast-theo img{ animation-delay:.8s; }
.mtx-cast-mira{ transform:scale(1.08); transform-origin:bottom center; z-index:1; }
@keyframes mtxBob{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-8px); }
}
.mtx-cast-member figcaption{
  position:relative; z-index:2; margin-top:-6px;
  font-family:var(--font-head); font-weight:700; font-size:.92rem;
  background:#fff; border-radius:999px; padding:6px 18px;
  box-shadow:var(--shadow-sm); border:1px solid rgba(255,255,255,.7);
}
.mtx-cast-milo figcaption{ color:var(--blue-deep); }
.mtx-cast-mira figcaption{ color:var(--pink-deep); }
.mtx-cast-theo figcaption{ color:var(--orange-deep); }

@media (max-width:960px){
  .mtx-hero-inner{ grid-template-columns:1fr; }
  .mtx-hero-cast{ order:-1; }
  .mtx-hero-copy{ text-align:center; }
  .mtx-hero-copy .mt-eyebrow{ justify-content:center; }
  .mtx-hero-desc{ margin-left:auto; margin-right:auto; }
}
@media (max-width:560px){
  .mtx-hero-cast{ gap:8px; padding-top:4px; }
  .mtx-cast-member img{ height:clamp(150px, 44vw, 220px); }
  .mtx-cast-member figcaption{ font-size:.8rem; padding:5px 13px; }
}
@media (prefers-reduced-motion: reduce){
  .mtx-cast-member img{ animation:none; }
}

/* ---------------- CATEGORY CARDS ---------------- */
.mtx-cards{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:26px;
}
.mtx-card{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; align-items:flex-start;
  border-radius:var(--radius-xl); padding:32px 30px 30px;
  border:1px solid rgba(20,30,70,.05);
  box-shadow:var(--shadow-xs);
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.mtx-card::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(120% 90% at 0% 0%, rgba(255,255,255,.55), transparent 55%);
  pointer-events:none;
}
.mtx-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.mtx-card--green{ background:#E9F6F1; }
.mtx-card--pink{ background:var(--card-pink-bg); }
.mtx-card--purple{ background:#F1EEFC; }
.mtx-card--blue{ background:var(--card-blue-bg); }
.mtx-card--orange{ background:var(--card-orange-bg); }
.mtx-card--rose{ background:#FDEDF3; }

.mtx-card-icon{
  width:48px; height:48px; border-radius:var(--radius-md); background:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-xs); margin-bottom:20px; position:relative; z-index:1;
  transition:transform .35s var(--ease-out);
}
.mtx-card:hover .mtx-card-icon{ transform:scale(1.08) rotate(-4deg); }
.mtx-card-icon svg{ width:24px; height:24px; }
.mtx-card--green .mtx-card-icon{ box-shadow:var(--shadow-xs), inset 0 0 0 1px rgba(47,174,139,.16); }
.mtx-card--pink .mtx-card-icon{ box-shadow:var(--shadow-xs), inset 0 0 0 1px rgba(253,35,106,.16); }
.mtx-card--purple .mtx-card-icon{ box-shadow:var(--shadow-xs), inset 0 0 0 1px rgba(122,100,229,.16); }
.mtx-card--blue .mtx-card-icon{ box-shadow:var(--shadow-xs), inset 0 0 0 1px rgba(47,95,216,.16); }
.mtx-card--orange .mtx-card-icon{ box-shadow:var(--shadow-xs), inset 0 0 0 1px rgba(224,138,46,.18); }
.mtx-card--rose .mtx-card-icon{ box-shadow:var(--shadow-xs), inset 0 0 0 1px rgba(224,68,124,.18); }

.mtx-card h3{
  font-size:1.24rem; margin-bottom:9px; letter-spacing:-.01em; position:relative; z-index:1;
  max-width:76%;
}
.mtx-card p{
  font-size:.96rem; color:var(--text-body); line-height:1.58; margin:0 0 20px;
  position:relative; z-index:1; max-width:76%;
}
.mtx-card-cta{
  display:inline-flex; align-items:center; gap:7px; font-weight:800; font-size:.92rem;
  color:var(--text-head); margin-top:auto; position:relative; z-index:1;
}
.mtx-card-cta::after{
  content:''; position:absolute; left:0; right:100%; bottom:-3px; height:2px;
  background:currentColor; border-radius:2px; opacity:.55; transition:right .3s var(--ease-out);
}
.mtx-card:hover .mtx-card-cta::after{ right:24px; }
.mtx-card-cta svg{ transition:transform .3s var(--ease-out); }
.mtx-card:hover .mtx-card-cta svg{ transform:translateX(4px); }
.mtx-card--green .mtx-card-cta{ color:#1F8266; }
.mtx-card--pink .mtx-card-cta{ color:var(--pink-deep); }
.mtx-card--purple .mtx-card-cta{ color:var(--purple); }
.mtx-card--blue .mtx-card-cta{ color:var(--blue-deep); }
.mtx-card--orange .mtx-card-cta{ color:var(--orange-deep); }
.mtx-card--rose .mtx-card-cta{ color:#C23768; }

.mtx-card-mascot{
  position:absolute; right:22px; bottom:20px; width:76px; height:76px;
  object-fit:contain; object-position:bottom center;
  opacity:.96; z-index:0; pointer-events:none;
  transition:transform .4s var(--ease-out);
  filter:drop-shadow(0 8px 12px rgba(20,30,70,.16));
}
.mtx-card:hover .mtx-card-mascot{ transform:translateY(-5px) scale(1.05); }

@media (max-width:960px){ .mtx-cards{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:640px){
  .mtx-cards{ grid-template-columns:1fr; }
  .mtx-card{ padding:28px 26px 26px; }
  .mtx-card-mascot{ width:66px; height:66px; right:18px; bottom:16px; }
  .mtx-card h3, .mtx-card p{ max-width:70%; }
}

/* ---------------- NEWSLETTER ---------------- */
.mtx-newsletter{
  background:linear-gradient(155deg,var(--navy-2),#0B2670);
  border-radius:var(--radius-xl); padding:clamp(32px,4vw,48px);
  display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;
  box-shadow:var(--shadow-lg); position:relative; overflow:hidden;
}
.mtx-newsletter::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(60% 90% at 100% 0%, rgba(122,100,229,.35), transparent 60%);
  pointer-events:none;
}
.mtx-newsletter-copy{ display:flex; align-items:flex-start; gap:18px; flex:1 1 320px; min-width:260px; position:relative; z-index:1; }
.mtx-newsletter-icon{ font-size:2.1rem; line-height:1; flex:none; }
.mtx-newsletter-copy h3{ color:#fff; font-size:1.4rem; margin-bottom:8px; letter-spacing:-.01em; line-height:1.3; }
.mtx-newsletter-copy p{ color:#C7D2EE; font-size:.98rem; line-height:1.6; margin:0; max-width:380px; }

.mtx-newsletter-form{ flex:1 1 360px; min-width:280px; max-width:420px; position:relative; z-index:1; }
.mtx-newsletter-row{ display:flex; gap:12px; flex-wrap:wrap; }
.mtx-newsletter-row input[type=email]{
  flex:1 1 180px; min-width:0; padding:14px 20px; border-radius:999px; border:1.5px solid transparent;
  font-size:.96rem; font-family:var(--font-body); color:var(--text-head); font-weight:600;
  background:#fff; transition:box-shadow .2s ease;
}
.mtx-newsletter-row input[type=email]:focus{ outline:none; box-shadow:0 0 0 4px rgba(255,255,255,.25); }
.mtx-newsletter-row .mt-btn{ padding:14px 26px; font-size:.96rem; flex:none; }
.mtx-newsletter-note{
  display:flex; align-items:center; gap:7px; margin-top:14px;
  font-size:.84rem; color:#9FB0D8; font-weight:600;
}
.mtx-newsletter-status{ font-size:.84rem; color:#DCE3F2; font-weight:600; margin-top:8px; min-height:1.2em; }

@media (max-width:700px){
  .mtx-newsletter{ padding:30px 26px; }
  .mtx-newsletter-copy{ flex-direction:column; gap:12px; }
  .mtx-newsletter-form{ min-width:0; max-width:none; }
  .mtx-newsletter-row .mt-btn{ width:100%; justify-content:center; }
}
