/* MaplePostDaily.com — redesigned (editorial + luxe) */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300..900&family=Rubik:wght@300;400;500;600;700;800&display=swap');

:root{
  --paper:#fbf6ea;
  --ink:#141316;
  --muted:#5c5963;
  --hair:#1a18201a;
  --card:#ffffffcc;
  --card-strong:#ffffff;
  --accent:#b3122b;
  --accent-2:#d6a23a;
  --accent-3:#2b6b5e;
  --shadow: 0 20px 55px rgba(16,14,18,.18);
  --shadow-soft: 0 10px 28px rgba(16,14,18,.10);
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --radius-sm: 12px;
  --max: 1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  font-family:Rubik,system-ui,-apple-system,Segoe UI,sans-serif;
  line-height:1.75;
  background:
    radial-gradient(1200px 700px at 12% 8%, rgba(179,18,43,.14), transparent 60%),
    radial-gradient(900px 560px at 86% 18%, rgba(214,162,58,.16), transparent 58%),
    radial-gradient(980px 620px at 60% 92%, rgba(43,107,94,.14), transparent 62%),
    linear-gradient(180deg, #fff 0%, var(--paper) 42%, #f7f0df 100%);
}

/* subtle grain */
body::before{
  content:"";
  position:fixed;
  inset:-30px;
  pointer-events:none;
  z-index:-1;
  opacity:.55;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

a{color:inherit}
img{max-width:100%;display:block}
strong{color:var(--accent)}

/* ===== Header / Nav ===== */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:linear-gradient(180deg, rgba(251,246,234,.88), rgba(251,246,234,.72));
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--hair);
}
.site-header .inner{
  max-width:var(--max);
  margin:0 auto;
  padding: .85rem 1.25rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.site-header .brand,
.site-header .logo-link{display:flex; align-items:center; gap:.75rem; text-decoration:none}
.site-header .logo{
  height:52px;
  width:auto;
  border-radius:14px;
  box-shadow: var(--shadow-soft);
}

.site-header nav{
  display:flex;
  align-items:center;
  gap:.35rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.site-header nav a{
  text-decoration:none;
  font-weight:700;
  letter-spacing:.02em;
  font-size:.9rem;
  padding:.55rem .9rem;
  border-radius:999px;
  border:1px solid transparent;
  color:var(--muted);
  transition:transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.site-header nav a:hover{
  color:var(--ink);
  background:rgba(255,255,255,.7);
  border-color:rgba(179,18,43,.18);
  transform: translateY(-1px);
}
.site-header nav a.nav-btn{
  color:#fff;
  background:linear-gradient(135deg, var(--accent), #7f0c1f);
  border-color:rgba(0,0,0,.08);
  box-shadow: 0 12px 30px rgba(179,18,43,.28);
}

/* ===== Layout shells ===== */
.wrap, .wrap-wide{
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.4rem 1.25rem 3.25rem;
}

/* ===== Landing (index-new, no-deposit) ===== */
.landing-shell{
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.4rem 1.25rem 3.25rem;
}

.landing-hero{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 1.2rem;
  padding: 1.35rem;
  border-radius: var(--radius-xl);
  background:
    radial-gradient(900px 480px at 20% 10%, rgba(214,162,58,.18), transparent 60%),
    radial-gradient(920px 520px at 85% 35%, rgba(179,18,43,.14), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.62));
  border:1px solid var(--hair);
  box-shadow: var(--shadow);
}

.hero-copy{padding:.35rem .35rem .6rem}
.eyebrow{
  display:inline-flex;
  gap:.5rem;
  align-items:center;
  padding:.35rem .65rem;
  border-radius:999px;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  background:rgba(179,18,43,.08);
  border:1px solid rgba(179,18,43,.16);
  color:var(--accent);
}

.hero-title{
  margin:.75rem 0 .5rem;
  font-family: Fraunces, serif;
  font-weight: 700;
  line-height:1.08;
  font-size: clamp(2rem, 2.6vw, 3rem);
}
.hero-title span{color:var(--accent)}
.hero-dek{margin:.25rem 0 1rem; color:var(--muted); max-width: 56ch}

.hero-actions{display:flex; flex-wrap:wrap; gap:.7rem; margin: 1rem 0 1.1rem}
.hero-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-weight:800;
  padding:.75rem 1.05rem;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.7);
  box-shadow: var(--shadow-soft);
}
.hero-link.primary{
  color:#fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--accent-3), #1c3e37);
  box-shadow: 0 14px 34px rgba(43,107,94,.25);
}
.hero-link.secondary{color:var(--ink)}

.hero-meta{display:flex; flex-wrap:wrap; gap:.55rem}
.hero-pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.45rem .7rem;
  border-radius:999px;
  background:rgba(255,255,255,.68);
  border:1px solid var(--hair);
  color:var(--muted);
  font-weight:700;
  font-size:.82rem;
}
.hero-pill-dot{width:10px;height:10px;border-radius:50%; background:var(--accent-2); box-shadow:0 0 0 4px rgba(214,162,58,.18)}

.hero-image-wrap{
  border-radius: calc(var(--radius-xl) - 6px);
  overflow:hidden;
  border:1px solid var(--hair);
  background: #0f0f12;
  box-shadow: 0 20px 55px rgba(0,0,0,.18);
  align-self:stretch;
}
.hero-image-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.02);
  filter: contrast(1.03) saturate(1.05);
}

.hero-stats{
  margin-top: 1rem;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:.85rem;
}
.stat-card{
  padding: .9rem .95rem;
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.70);
  border:1px solid var(--hair);
  box-shadow: var(--shadow-soft);
}
.stat-value{
  font-family: Fraunces, serif;
  font-weight: 700;
  font-size: 1.6rem;
  line-height:1;
}
.stat-label{display:block; color:var(--muted); font-weight:700; margin-top:.35rem; font-size:.88rem}

.quick-links-strip{
  margin-top: 1.1rem;
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  padding: .9rem;
  border-radius: var(--radius-xl);
  border: 1px solid var(--hair);
  background: rgba(255,255,255,.55);
}
.quick-links-strip a{
  text-decoration:none;
  font-weight:800;
  padding:.55rem .85rem;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.72);
  color: var(--ink);
}

.editorial-grid{
  margin-top: 1.2rem;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 1rem;
}
.story-card, .note-panel, .quote-panel, .summary-aside, .topic-panel, .signal-card{
  border:1px solid var(--hair);
  background: rgba(255,255,255,.70);
  box-shadow: var(--shadow-soft);
  border-radius: var(--radius-xl);
}
.story-card{padding:1.2rem 1.25rem}
.note-panel{padding:1.2rem 1.25rem}

.section-kicker, .note-kicker, .panel-kicker, .table-kicker, .summary-kicker{
  margin:0 0 .55rem;
  color: var(--muted);
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:900;
  font-size:.78rem;
}
.section-title{
  margin:.1rem 0 .55rem;
  font-family: Fraunces, serif;
  font-size: 1.55rem;
  line-height:1.12;
}

.note-list{margin:.75rem 0 0; padding-left: 1.1rem; color: var(--muted)}
.note-list li{margin:.4rem 0}

.signal-grid{
  margin-top: 1rem;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
}
.signal-card{padding:1rem 1.05rem}
.signal-index{
  display:inline-flex;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:.72rem;
  color: var(--accent);
}
.signal-card h3{margin:.4rem 0 .35rem; font-family: Fraunces, serif; font-size:1.05rem}
.signal-card p{margin:0; color: var(--muted)}

.content-slab{
  margin-top: 1.2rem;
  padding: 1.2rem 1.25rem;
  border-radius: var(--radius-xl);
  border:1px solid var(--hair);
  background: rgba(255,255,255,.62);
  box-shadow: var(--shadow-soft);
}
.feature-matrix{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  margin-top:.75rem;
}
.topic-panel{padding:1rem 1.05rem}
.topic-panel h3{margin:.15rem 0 .45rem; font-family: Fraunces, serif}
.topic-panel p{margin:.15rem 0 .65rem; color: var(--muted)}

.table-stage{margin-top: 1.2rem}
.table-stage h2{font-family: Fraunces, serif; margin:.15rem 0 .5rem}
.table-wrap{
  overflow:auto;
  border-radius: var(--radius-xl);
  border:1px solid var(--hair);
  background: rgba(255,255,255,.75);
  box-shadow: var(--shadow);
}

table{width:100%; border-collapse: collapse; min-width: 720px}
th,td{padding:.85rem .9rem; text-align:left; border-bottom:1px solid rgba(0,0,0,.06)}
th{font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; color: var(--muted); font-weight:900; background: rgba(179,18,43,.06)}
tr:hover td{background: rgba(214,162,58,.08)}

.quote-panel{padding:1.2rem 1.25rem}
.quote-panel blockquote{
  margin:0;
  font-family: Fraunces, serif;
  font-weight: 650;
  font-size: 1.35rem;
  line-height:1.15;
}
.quote-panel p{color:var(--muted); margin:.65rem 0 0}

.summary-board{
  margin-top: 1.2rem;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 1rem;
}
.summary-copy{padding:1.2rem 1.25rem}
.summary-aside{padding:1.2rem 1.25rem}
.summary-checklist{margin:.5rem 0 0; padding-left: 1.1rem; color: var(--muted)}
.summary-checklist li{margin:.45rem 0}

.faq-block{
  margin-top: 1.2rem;
  padding: 1.2rem 1.25rem;
  border-radius: var(--radius-xl);
  border:1px solid var(--hair);
  background: rgba(255,255,255,.68);
  box-shadow: var(--shadow-soft);
}
.faq-block-title{font-family: Fraunces, serif; margin:.2rem 0 .5rem}
.faq p{margin:.65rem 0; color: var(--muted)}
.faq strong{color: var(--ink)}

/* ===== Inner pages (index.html, top-online-casino, legal) ===== */
.page-text{
  padding: 1.35rem 1.4rem;
  border-radius: var(--radius-xl);
  border: 1px solid var(--hair);
  background: rgba(255,255,255,.72);
  box-shadow: var(--shadow);
}
.page-text h1{
  margin:.2rem 0 .75rem;
  font-family: Fraunces, serif;
  letter-spacing:-.01em;
  line-height:1.1;
  font-size: clamp(1.9rem, 2.4vw, 2.6rem);
}
.page-text h2{
  margin: 1.35rem 0 .45rem;
  font-family: Fraunces, serif;
  line-height:1.15;
}
.page-text p{color: var(--muted)}
.page-text ul{color: var(--muted)}
.page-text li{margin:.35rem 0}
.page-text a{color: var(--accent-3); font-weight:800; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px}

/* ===== Contact/About helper blocks ===== */
.contact-main, .about-main{max-width: var(--max); margin: 0 auto}
.contact-hero, .about-hero{
  padding: 1.15rem 1.25rem;
  border-radius: var(--radius-xl);
  border:1px solid var(--hair);
  background: rgba(255,255,255,.62);
  box-shadow: var(--shadow-soft);
}
.contact-hero h1, .about-hero h1{font-family: Fraunces, serif; margin:.2rem 0 .45rem}
.contact-lead, .about-lead{color: var(--muted); margin:0}

.contact-cards{
  margin-top: 1rem;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .85rem;
}
.contact-card{
  padding: 1.05rem 1.1rem;
  border-radius: var(--radius-xl);
  border:1px solid var(--hair);
  background: rgba(255,255,255,.70);
  box-shadow: var(--shadow-soft);
}
.contact-card h3{margin:.35rem 0 .35rem; font-family: Fraunces, serif}
.contact-email{display:inline-block; margin:.25rem 0 .5rem; font-weight:900; color: var(--accent-3); text-decoration:none}
.contact-card p{margin:0; color: var(--muted)}

.contact-scope{
  margin-top: 1rem;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.contact-scope-col{
  padding: 1.05rem 1.1rem;
  border-radius: var(--radius-xl);
  border:1px solid var(--hair);
  background: rgba(255,255,255,.62);
  box-shadow: var(--shadow-soft);
}
.contact-scope-col h4{margin:.15rem 0 .5rem; font-family: Fraunces, serif}
.contact-scope-col ul{margin:.35rem 0 0; padding-left: 1.1rem; color: var(--muted)}
.contact-scope-note{color: var(--muted); margin:.6rem 0 0}

.contact-help, .about-help, .about-disclaimer{
  margin-top: 1rem;
  padding: 1.05rem 1.1rem;
  border-radius: var(--radius-xl);
  border:1px dashed rgba(179,18,43,.25);
  background: rgba(179,18,43,.06);
}
.contact-help p, .about-help p, .about-disclaimer p{margin:0; color: var(--ink)}

/* ===== Footer ===== */
.site-footer{
  margin-top: 2.2rem;
  border-top: 1px solid var(--hair);
  background: rgba(255,255,255,.45);
}
.site-footer .inner{
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.6rem 1.25rem 2.2rem;
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 1rem;
  align-items:start;
}
.footer-brand .logo{height:54px}
.site-footer h4{margin:.15rem 0 .55rem; font-family: Fraunces, serif}
.site-footer ul{list-style:none; padding:0; margin:0}
.site-footer li{margin:.35rem 0}
.site-footer a{text-decoration:none; color: var(--muted); font-weight:800}
.site-footer a:hover{color: var(--ink); text-decoration: underline}
.copy{margin:1.25rem 0 0; color: var(--muted); font-weight:800}

/* ===== Responsive ===== */
@media (max-width: 980px){
  .landing-hero{grid-template-columns: 1fr;}
  .hero-image-wrap{min-height: 240px}
  .hero-stats{grid-template-columns: repeat(2, minmax(0,1fr))}
  .signal-grid{grid-template-columns: repeat(2, minmax(0,1fr))}
  .feature-matrix{grid-template-columns: 1fr}
  .editorial-grid{grid-template-columns: 1fr}
  .summary-board{grid-template-columns: 1fr}
  .contact-cards{grid-template-columns: 1fr}
  .contact-scope{grid-template-columns: 1fr}
}
@media (max-width: 560px){
  .site-header .inner{padding:.75rem .9rem}
  .site-header .logo{height:46px}
  .page-text{padding: 1.05rem 1.05rem}
  table{min-width: 620px}
}