/* =====================================================================
   MDLF stylesheet
   Palette : midnight navy + warm gold + parchment + clay
   Type    : Fraunces (display serif) / Karla (body) / mono labels
   Signature: "multiplication" branching motif (disciples making disciples)
   ===================================================================== */

:root{
  --ink:        #0E1B33;   /* deep navy ground            */
  --ink-2:      #08101F;   /* darker navy for depth       */
  --ink-soft:   #27365A;   /* muted navy for borders/text */
  --gold:       #D7A33A;   /* warm gold — the "light"     */
  --gold-deep:  #B7842A;
  --gold-soft:  #F0D89A;
  --parchment:  #F7F2E8;   /* page surface                */
  --paper:      #FBF8F1;   /* cards                       */
  --clay:       #A7553A;   /* earthy secondary accent     */
  --ink-70:     rgba(14,27,51,.70);
  --ink-55:     rgba(14,27,51,.55);
  --line:       #E3DACA;   /* hairline on parchment       */
  --line-dark:  rgba(240,216,154,.18);
  --good:       #2F7D5B;
  --warn:       #B25B2B;
  --bad:        #B23A3A;

  --serif: "Fraunces", Georgia, "Times New Roman", serif;
  --sans:  "Karla", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

  --wrap: 1140px;
  --radius: 14px;
  --shadow: 0 18px 50px -28px rgba(8,16,31,.55);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--parchment); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:560; line-height:1.1; letter-spacing:-.01em; margin:0; }
.serif{ font-family:var(--serif); }

.wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:24px; }
.eyebrow{
  font-size:.74rem; letter-spacing:.22em; text-transform:uppercase;
  font-weight:700; color:var(--gold-deep);
}
.eyebrow.on-dark{ color:var(--gold-soft); }
.muted{ color:var(--ink-55); }
.center{ text-align:center; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--sans); font-weight:700; font-size:.95rem;
  padding:.8rem 1.4rem; border-radius:999px; border:1.5px solid transparent;
  cursor:pointer; text-decoration:none; transition:.18s ease; white-space:nowrap;
}
.btn-primary{ 
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%); 
  color:var(--ink-2); 
  box-shadow:0 6px 20px rgba(215,163,58,.35);
  padding:.85rem 1.5rem;
}
.btn-primary:hover{ 
  background:linear-gradient(135deg, var(--gold-deep) 0%, var(--gold) 100%); 
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(215,163,58,.45);
}
.btn-ghost{ background:transparent; border-color:currentColor; color:var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:var(--paper); }
.btn-ghost.on-dark{ color:var(--paper); }
.btn-ghost.on-dark:hover{ background:var(--paper); color:var(--ink); }
.btn-block{ width:100%; justify-content:center; }
.btn-sm{ padding:.65rem 1.4rem !important; font-size:.88rem; }
.btn-danger{ background:transparent; border-color:var(--bad); color:var(--bad); }
.btn-danger:hover{ background:var(--bad); color:#fff; }

/* ---------- Top navigation ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(247,242,232,.86); backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{ display:flex; align-items:center; gap:1.5rem; padding-block:.85rem; }
.brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--ink); }
.brand-mark{ width:38px; height:38px; flex:0 0 auto; }
.brand-text b{ font-family:var(--serif); font-size:1.06rem; display:block; line-height:1; }
.brand-text span{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-55); }
.nav-links{ display:flex; gap:1.4rem; margin-left:auto; align-items:center; }
.nav-links a{ text-decoration:none; font-weight:600; font-size:.96rem; color:var(--ink-70); padding:.2rem 0; position:relative; }
.nav-links a:hover{ color:var(--ink); }
.nav-links a.active{ color:var(--ink); }
.nav-links a.active::after{
  content:""; position:absolute; left:0; right:0; bottom:-3px; height:2px; background:var(--gold);
}
.nav-toggle{ display:none; background:none; border:0; cursor:pointer; margin-left:auto; }
.nav-toggle span{ display:block; width:24px; height:2px; background:var(--ink); margin:5px 0; }

/* ---------- Hero ---------- */
.hero{
  background:radial-gradient(120% 120% at 80% -10%, #16284A 0%, var(--ink) 45%, var(--ink-2) 100%);
  color:var(--paper); position:relative; overflow:hidden;
}
.hero::after{ /* faint parchment edge */
  content:""; position:absolute; inset:auto 0 0 0; height:90px;
  background:linear-gradient(to bottom, transparent, rgba(247,242,232,.06));
}
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:3rem; align-items:center; padding-block:5.5rem 5rem; }
.hero h1{ font-size:clamp(2.5rem,5.4vw,4.1rem); margin:.9rem 0 1.1rem; }
.hero h1 em{ font-style:italic; color:var(--gold-soft); }
.hero p.lead{ font-size:1.15rem; color:rgba(247,248,251,.82); max-width:46ch; }
.hero-cta{ display:flex; gap:.8rem; margin-top:1.8rem; flex-wrap:wrap; }
.hero-verse{
  margin-top:2.4rem; padding-top:1.4rem; border-top:1px solid var(--line-dark);
  font-family:var(--serif); font-style:italic; font-size:1.05rem; color:rgba(247,248,251,.8); max-width:48ch;
}
.hero-verse cite{ display:block; font-style:normal; font-family:var(--sans); font-size:.74rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--gold-soft); margin-top:.5rem; }

/* multiplication motif card */
.hero-art{ position:relative; }
.hero-art svg{ width:100%; height:auto; filter:drop-shadow(0 24px 60px rgba(0,0,0,.45)); }
.hero-art .cap{
  position:absolute; bottom:-.4rem; right:.4rem; font-size:.7rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--gold-soft);
}

/* ---------- Generic sections ---------- */
.section{ padding-block:5rem; }
.section.tight{ padding-block:3.5rem; }
.section-head{ max-width:60ch; margin-bottom:2.6rem; }
.section-head.center{ margin-inline:auto; }
.section h2{ font-size:clamp(1.9rem,3.6vw,2.7rem); margin:.6rem 0 .8rem; }
.section.dark{ background:var(--ink); color:var(--paper); }
.section.dark .muted{ color:rgba(247,248,251,.6); }
.divider-seed{ display:flex; align-items:center; gap:1rem; color:var(--gold); }
.divider-seed::before,.divider-seed::after{ content:""; height:1px; background:var(--line); flex:1; }

/* mission band */
.mission{ background:var(--paper); border-block:1px solid var(--line); }
.mission .wrap{ display:grid; grid-template-columns:1fr 1.3fr; gap:3rem; padding-block:4rem; align-items:center; }
.mission p{ font-size:1.18rem; line-height:1.7; }

/* objectives */
.obj-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; }
.obj{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.5rem 1.5rem 1.4rem; position:relative; transition:.2s;
}
.obj:hover{ border-color:var(--gold); transform:translateY(-3px); box-shadow:var(--shadow); }
.obj .num{ font-family:var(--serif); font-size:1.6rem; color:var(--gold-deep); line-height:1; }
.obj h3{ font-size:1.15rem; margin:.5rem 0 .4rem; }
.obj p{ margin:0; font-size:.96rem; color:var(--ink-70); }

/* stats */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.stat{ text-align:center; padding:1.4rem 1rem; border-radius:var(--radius);
  border:1px solid var(--line-dark); }
.stat .figure{ font-family:var(--serif); font-size:clamp(2.4rem,5vw,3.4rem); color:var(--gold-soft); line-height:1; }
.stat .label{ font-size:.92rem; color:rgba(247,248,251,.72); margin-top:.6rem; }

/* module / story cards */
.card-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.card-grid.two{ grid-template-columns:repeat(2,1fr); }
.card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column; text-decoration:none; color:inherit; transition:.2s;
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--gold-soft); }
.card .thumb{ aspect-ratio:16/10; background:var(--ink); overflow:hidden; }
.card .thumb img{ width:100%; height:100%; object-fit:cover; }
.card-body{ padding:1.3rem 1.3rem 1.4rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
.card .kicker{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; }
.card h3{ font-size:1.22rem; }
.card p{ margin:0; color:var(--ink-70); font-size:.95rem; }
.card .meta{ margin-top:auto; padding-top:.7rem; font-size:.84rem; color:var(--ink-55);
  display:flex; gap:.5rem; align-items:center; }
.module-cover{ background:linear-gradient(135deg,#16284A,#0B1730); color:var(--gold-soft);
  display:grid; place-items:center; }
.module-cover .scr{ font-family:var(--serif); font-style:italic; font-size:1.1rem; opacity:.85; }

/* gallery */
.gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
.gallery figure{ margin:0; border-radius:12px; overflow:hidden; aspect-ratio:1; position:relative; }
.gallery img{ width:100%; height:100%; object-fit:cover; transition:.4s; }
.gallery figure:hover img{ transform:scale(1.05); }
.gallery figcaption{ position:absolute; inset:auto 0 0 0; padding:.7rem .8rem;
  font-size:.78rem; color:#fff; background:linear-gradient(transparent, rgba(8,16,31,.8)); }

/* split feature (June training) */
.feature{ display:grid; grid-template-columns:1.05fr 1fr; gap:3rem; align-items:center; }
.feature .media{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }

/* give */
.give-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.give-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem; }
.give-card.lead{ background:var(--ink); color:var(--paper); border-color:transparent; }
.give-card h3{ font-size:1.3rem; }
.give-card .amount{ font-family:var(--serif); font-size:2rem; color:var(--gold-deep); }
.give-card.lead .amount{ color:var(--gold-soft); }
.need{ display:flex; gap:1rem; padding:1.1rem 0; border-bottom:1px solid var(--line); }
.need .ic{ color:var(--gold-deep); flex:0 0 auto; margin-top:.15rem; }

/* ---------- Footer ---------- */
.footer{ background:var(--ink-2); color:rgba(247,248,251,.7); padding-block:3.5rem 2rem; margin-top:0; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2rem; }
.footer h4{ color:var(--paper); font-family:var(--sans); font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; margin-bottom:1rem; font-weight:700; }
.footer a{ display:block; text-decoration:none; color:rgba(247,248,251,.7); padding:.25rem 0; font-size:.95rem; }
.footer a:hover{ color:var(--gold-soft); }
.footer .brand-text b{ color:var(--paper); }
.footer-base{ border-top:1px solid var(--line-dark); margin-top:2.5rem; padding-top:1.3rem;
  display:flex; justify-content:space-between; gap:1rem; font-size:.85rem; flex-wrap:wrap; }

/* ---------- Flash ---------- */
.flash-stack{ position:fixed; top:1rem; right:1rem; z-index:100; display:flex; flex-direction:column; gap:.6rem; max-width:360px; }
.flash{ padding:.85rem 1.1rem; border-radius:10px; box-shadow:var(--shadow); font-size:.92rem; font-weight:600;
  border-left:4px solid; background:var(--paper); animation:slidein .3s ease; }
.flash.success{ border-color:var(--good); color:#1d573c; }
.flash.error{ border-color:var(--bad); color:#8a2b2b; }
.flash.info{ border-color:var(--gold-deep); color:var(--gold-deep); }
@keyframes slidein{ from{opacity:0; transform:translateX(20px);} to{opacity:1; transform:none;} }

/* ---------- Forms ---------- */
.field{ margin-bottom:1.1rem; }
.field label{ display:block; font-weight:700; font-size:.88rem; margin-bottom:.4rem; }
.field .hint{ font-weight:400; color:var(--ink-55); font-size:.82rem; }
.input,.textarea,.select{
  width:100%; font-family:var(--sans); font-size:1rem; color:var(--ink);
  background:#fff; border:1.5px solid var(--line); border-radius:10px; padding:.75rem .9rem; transition:.15s;
}
.input:focus,.textarea:focus,.select:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(215,163,58,.18); }
.textarea{ min-height:150px; resize:vertical; line-height:1.6; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }

/* ---------- Auth screens ---------- */
.auth-wrap{ min-height:100vh; display:grid; grid-template-columns:1.1fr 1fr; }
.auth-aside{ background:radial-gradient(120% 120% at 20% 0%, #16284A, var(--ink-2));
  color:var(--paper); padding:3rem; display:flex; flex-direction:column; justify-content:space-between; }
.auth-aside .quote{ font-family:var(--serif); font-style:italic; font-size:1.5rem; line-height:1.4; max-width:24ch; }
.auth-main{ display:grid; place-items:center; padding:2.5rem; }
.auth-card{ width:100%; max-width:400px; }
.auth-card h1{ font-size:1.9rem; margin-bottom:.3rem; }
.auth-switch{ font-size:.9rem; color:var(--ink-55); margin-top:1.2rem; text-align:center; }
.auth-switch a{ color:var(--gold-deep); font-weight:700; text-decoration:none; }

/* ---------- Portal shell ---------- */
.shell{ display:grid; grid-template-columns:240px 1fr; min-height:100vh; }
.side{ background:var(--ink); color:rgba(247,248,251,.78); padding:1.5rem 1rem; position:sticky; top:0; height:100vh; }
.side .brand-text b{ color:var(--paper); }
.side nav{ margin-top:2rem; display:flex; flex-direction:column; gap:.2rem; }
.side nav a{ display:flex; align-items:center; gap:.7rem; text-decoration:none; color:rgba(247,248,251,.72);
  padding:.6rem .8rem; border-radius:9px; font-weight:600; font-size:.95rem; transition:.15s; }
.side nav a:hover{ background:rgba(255,255,255,.05); color:var(--paper); }
.side nav a.active{ background:var(--gold); color:var(--ink-2); }
.side .side-foot{ position:absolute; bottom:1.2rem; left:1rem; right:1rem; font-size:.85rem; }
.main{ background:var(--parchment); }
.topbar{ background:var(--paper); border-bottom:1px solid var(--line); padding:1rem 2rem;
  display:flex; align-items:center; gap:1rem; position:sticky; top:0; z-index:20; }
.topbar h1{ font-size:1.3rem; }
.topbar .who{ margin-left:auto; font-size:.9rem; color:var(--ink-55); }
.content{ padding:2rem; max-width:1000px; }

/* progress */
.progress-overview{ background:var(--ink); color:var(--paper); border-radius:var(--radius);
  padding:1.8rem; display:flex; align-items:center; gap:2rem; margin-bottom:1.8rem; }
.ring{ --p:0; width:96px; height:96px; border-radius:50%; flex:0 0 auto;
  background:conic-gradient(var(--gold) calc(var(--p)*1%), rgba(255,255,255,.12) 0);
  display:grid; place-items:center; }
.ring span{ width:74px; height:74px; border-radius:50%; background:var(--ink); display:grid; place-items:center;
  font-family:var(--serif); font-size:1.4rem; color:var(--gold-soft); }
.bar{ height:8px; border-radius:99px; background:var(--line); overflow:hidden; }
.bar i{ display:block; height:100%; background:var(--gold); border-radius:99px; transition:width .6s ease; }

.continue-card{ background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--gold);
  border-radius:var(--radius); padding:1.4rem 1.6rem; display:flex; align-items:center; gap:1.2rem; margin-bottom:2rem; }
.continue-card .grow{ flex:1; }

.mod-list{ display:grid; gap:1rem; }
.mod-row{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.3rem 1.5rem; display:grid; grid-template-columns:auto 1fr auto; gap:1.3rem; align-items:center;
  text-decoration:none; color:inherit; transition:.18s; }
.mod-row:hover{ border-color:var(--gold-soft); transform:translateY(-2px); box-shadow:var(--shadow); }
.mod-index{ font-family:var(--serif); font-size:1.6rem; color:var(--gold-deep); width:2.2rem; text-align:center; }
.mod-row .pct{ font-weight:700; color:var(--ink-55); font-size:.9rem; min-width:3rem; text-align:right; }

/* lesson list */
.lesson-list{ display:flex; flex-direction:column; gap:.5rem; }
.lesson-item{ display:flex; align-items:center; gap:1rem; background:var(--paper); border:1px solid var(--line);
  border-radius:11px; padding:.95rem 1.2rem; text-decoration:none; color:inherit; transition:.15s; }
.lesson-item:hover{ border-color:var(--gold); }
.tick{ width:26px; height:26px; border-radius:50%; flex:0 0 auto; display:grid; place-items:center;
  border:2px solid var(--line); font-size:.8rem; color:transparent; }
.tick.done{ background:var(--good); border-color:var(--good); color:#fff; }
.lesson-item .t{ flex:1; }
.lesson-item .t b{ display:block; font-size:1.02rem; }
.lesson-item .t span{ font-size:.82rem; color:var(--ink-55); }

/* lesson reader */
.reader{ max-width:720px; }
.reader .crumbs{ font-size:.85rem; color:var(--ink-55); margin-bottom:.8rem; }
.reader .crumbs a{ color:var(--gold-deep); text-decoration:none; }
.reader h1{ font-size:2.1rem; margin-bottom:.6rem; }
.reader .prose{ font-size:1.1rem; line-height:1.85; }
.reader .prose p{ margin:0 0 1.2rem; }
.reader .prose p:first-letter{ }
.res-box{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:1.3rem 1.5rem; margin:2rem 0; }
.res-box h3{ font-size:1.05rem; margin-bottom:.8rem; }
.res-item{ display:flex; align-items:center; gap:.7rem; padding:.5rem 0; text-decoration:none; color:inherit; border-bottom:1px dashed var(--line); }
.res-item:last-child{ border-bottom:0; }
.res-tag{ font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700;
  padding:.18rem .5rem; border-radius:5px; background:var(--ink); color:var(--gold-soft); }
.lesson-nav{ display:flex; justify-content:space-between; gap:1rem; margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--line); }

/* ---------- Admin ---------- */
.admin-side{ background:var(--ink-2); }
.kpi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2rem; }
.kpi{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:1.3rem 1.5rem; }
.kpi .n{ font-family:var(--serif); font-size:2.2rem; color:var(--ink); line-height:1; }
.kpi .l{ font-size:.85rem; color:var(--ink-55); margin-top:.3rem; }
.kpi.alert .n{ color:var(--clay); }

.panel{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-bottom:1.6rem; }
.panel-head{ display:flex; align-items:center; gap:1rem; padding:1.1rem 1.4rem; border-bottom:1px solid var(--line); }
.panel-head h2{ font-size:1.15rem; }
.panel-head .btn{ margin-left:auto; }
.panel-body{ padding:1.4rem; }

table.tbl{ width:100%; border-collapse:collapse; font-size:.94rem; }
table.tbl th{ text-align:left; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-55);
  padding:.7rem 1rem; border-bottom:1px solid var(--line); }
table.tbl td{ padding:.85rem 1rem; border-bottom:1px solid var(--line); vertical-align:middle; }
table.tbl tr:last-child td{ border-bottom:0; }
table.tbl tr:hover td{ background:rgba(215,163,58,.05); }
.row-actions{ display:flex; gap:.4rem; justify-content:flex-end; }

.badge{ font-size:.7rem; font-weight:700; letter-spacing:.04em; padding:.2rem .6rem; border-radius:99px; text-transform:uppercase; }
.badge.published{ background:rgba(47,125,91,.14); color:var(--good); }
.badge.draft{ background:rgba(120,120,120,.14); color:#666; }
.badge.unread{ background:rgba(167,85,58,.14); color:var(--clay); }

.inline-form{ display:inline; }
.help-note{ background:rgba(215,163,58,.1); border:1px solid var(--gold-soft); border-radius:11px;
  padding:1rem 1.2rem; font-size:.9rem; margin-bottom:1.5rem; }

/* ---------- Utility / responsive ---------- */
.stack-gap > * + *{ margin-top:1rem; }
.mt-1{ margin-top:.5rem;} .mt-2{ margin-top:1rem;} .mt-3{ margin-top:1.5rem;} .mt-4{ margin-top:2.5rem;}
.flex{ display:flex; gap:1rem; align-items:center; } .wrap-flex{ flex-wrap:wrap; }
.pill{ display:inline-block; font-size:.78rem; padding:.3rem .7rem; border:1px solid var(--line); border-radius:99px; color:var(--ink-70); }

@media (max-width: 960px){
  .hero-grid,.mission .wrap,.feature,.auth-wrap{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .card-grid,.give-grid{ grid-template-columns:repeat(2,1fr); }
  .obj-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .gallery{ grid-template-columns:repeat(2,1fr); }
  .hero-art{ max-width:420px; margin-inline:auto; }
  .auth-aside{ display:none; }
  .kpi-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 760px){
  .nav-links{ display:none; }
  .nav-links.open{ display:flex; position:absolute; top:64px; left:0; right:0; flex-direction:column;
    background:var(--paper); padding:1rem 24px; border-bottom:1px solid var(--line); }
  .nav-toggle{ display:block; }
  .shell{ grid-template-columns:1fr; }
  .side{ position:static; height:auto; display:flex; flex-direction:column; }
  .side nav{ flex-direction:row; flex-wrap:wrap; margin-top:1rem; }
  .side .side-foot{ position:static; margin-top:1rem; }
  .card-grid,.give-grid,.card-grid.two{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  .content{ padding:1.2rem; }
  .progress-overview{ flex-direction:column; text-align:center; }
}
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }