/*
Theme Name: Claude C. Ries Chapter
Theme URI: https://rieschapter.com/
Author: Joshua McGee
Description: A bold, editable block theme for the Claude C. Ries Chapter of the AFDCS.
Version: 0.1.0
Requires at least: 6.8
Tested up to: 7.0
Requires PHP: 8.1
Text Domain: ries-chapter
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: block-patterns, full-site-editing, wide-blocks, accessibility-ready
*/

:root {
  --ries-orange: #f36f21;
  --ries-orange-dark: #d95212;
  --ries-chocolate: #3b1f17;
  --ries-yellow: #ffc928;
  --ries-cream: #fff7e8;
  --ries-paper: #fffdf8;
  --ries-ink: #2b211d;
  --ries-muted: #725f55;
  --ries-line: #e9cda9;
  --ries-shadow: 0 18px 50px rgba(59, 31, 23, .12);
}

html { scroll-behavior: smooth; }

body {
  background:
    radial-gradient(circle at 7% 16%, rgba(255, 201, 40, .28) 0 8px, transparent 9px),
    radial-gradient(circle at 95% 44%, rgba(59, 31, 23, .10) 0 11px, transparent 12px),
    var(--ries-cream);
}

a { text-underline-offset: .18em; text-decoration-thickness: .08em; }
a:hover { text-decoration-thickness: .14em; }

.ries-shell { min-height: 100vh; }

.ries-header {
  position: relative;
  z-index: 5;
  border-top: 10px solid var(--ries-orange);
  border-bottom: 1px solid rgba(59, 31, 23, .16);
  background: rgba(255, 253, 248, .96);
  box-shadow: 0 5px 22px rgba(59, 31, 23, .08);
}

.ries-header-inner { min-height: 116px; }

.ries-brand { gap: .9rem; }

.ries-brand-mark {
  display: grid;
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 4px solid var(--ries-chocolate);
  border-radius: 50%;
  background: var(--ries-orange);
  box-shadow: 9px 6px 0 var(--ries-yellow);
  color: var(--ries-paper);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .08em;
  line-height: 1;
}

.ries-header .wp-block-site-title {
  margin: 0;
  font-size: clamp(1.3rem, 3vw, 2rem);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.05;
}

.ries-header .wp-block-site-title a { text-decoration: none; }
.ries-header .wp-block-site-tagline { margin: .25rem 0 0; color: var(--ries-muted); font-weight: 650; }

.ries-header .wp-block-navigation-item__content {
  border-radius: 999px;
  padding: .62rem .9rem;
  font-size: .9rem;
  font-weight: 760;
  text-decoration: none;
}

.ries-header .current-menu-item > .wp-block-navigation-item__content,
.ries-header .wp-block-navigation-item__content:hover {
  background: var(--ries-yellow);
  color: var(--ries-chocolate);
}

.ries-main { padding-block: clamp(2.5rem, 7vw, 6.5rem); }

.ries-page-heading {
  position: relative;
  margin-bottom: clamp(2.2rem, 5vw, 4rem);
  text-align: center;
}

.ries-page-heading::before {
  display: block;
  width: 76px;
  height: 12px;
  margin: 0 auto 1.35rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--ries-orange) 0 38%, var(--ries-yellow) 38% 68%, var(--ries-chocolate) 68%);
  content: "";
}

.ries-page-heading .wp-block-post-title {
  margin: 0;
  color: var(--ries-chocolate);
  font-size: clamp(2.35rem, 7vw, 5.6rem);
  font-weight: 900;
  letter-spacing: -.055em;
  line-height: .96;
}

.ries-content {
  color: var(--ries-ink);
  font-size: clamp(1.04rem, 1.5vw, 1.18rem);
  line-height: 1.72;
}

.ries-content > :where(h1, h2, h3, h4, h5, h6) {
  color: var(--ries-chocolate);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.06;
}

.home .ries-main { padding-top: clamp(2rem, 5vw, 4rem); }

.home .ries-content > .wp-block-spacer:first-child { display: none; }

.home .ries-content > .wp-block-group:first-of-type {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  max-width: 1180px !important;
  margin-bottom: clamp(2rem, 5vw, 4rem);
  border: 5px solid var(--ries-chocolate);
  border-radius: 38px;
  padding: clamp(2rem, 7vw, 5.5rem) !important;
  background: var(--ries-orange);
  box-shadow: 14px 14px 0 var(--ries-yellow), var(--ries-shadow);
}

.home .ries-content > .wp-block-group:first-of-type::after {
  position: absolute;
  right: -38px;
  bottom: -50px;
  width: 180px;
  height: 180px;
  border: 34px solid rgba(255, 247, 232, .28);
  border-radius: 50%;
  content: "";
}

.home .ries-content > .wp-block-group:first-of-type h1,
.home .ries-content > .wp-block-group:first-of-type h2 {
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--ries-paper);
  font-size: clamp(3rem, 9vw, 7.8rem) !important;
  font-weight: 950;
  letter-spacing: -.07em;
  line-height: .88 !important;
  text-align: left !important;
  text-wrap: balance;
}

.ries-content .wp-block-image {
  overflow: hidden;
  border: 3px solid var(--ries-chocolate);
  border-radius: 24px;
  background: var(--ries-paper);
  box-shadow: var(--ries-shadow);
}

.ries-content .wp-block-image img { display: block; width: 100%; }

.ries-content figcaption { padding: .15rem 1rem .75rem; color: var(--ries-muted); font-size: .85rem; }

.ries-content blockquote {
  border-left: 8px solid var(--ries-orange);
  border-radius: 0 18px 18px 0;
  padding: 1.25rem 1.5rem;
  background: rgba(255, 201, 40, .18);
}

.ries-content :where(.wp-block-button__link, button, input[type="submit"]) {
  border: 2px solid var(--ries-chocolate);
  border-radius: 999px;
  box-shadow: 4px 4px 0 var(--ries-chocolate);
  font-weight: 800;
}

.ries-content :where(.wp-block-button__link, button, input[type="submit"]):hover {
  transform: translate(2px, 2px);
  box-shadow: 2px 2px 0 var(--ries-chocolate);
}

.document-gallery { margin-top: 2.5rem; }
.document-gallery .document-icon-row { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.15rem; margin-bottom: 1.15rem; }
.document-gallery .document-icon {
  box-sizing: border-box;
  width: auto !important;
  margin: 0 !important;
  border: 1px solid var(--ries-line);
  border-radius: 18px;
  padding: .8rem !important;
  background: var(--ries-paper);
  box-shadow: 0 8px 24px rgba(59, 31, 23, .08);
  transition: transform .18s ease, box-shadow .18s ease;
}
.document-gallery .document-icon:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(59, 31, 23, .14); }
.document-gallery .document-icon a { color: var(--ries-chocolate); font-size: .84rem; font-weight: 760; line-height: 1.25; text-decoration: none; }
.document-gallery .document-icon img { width: 100%; height: auto; border-radius: 10px; }
.document-gallery .document-icon .title { display: block; padding: .7rem .2rem .2rem; }

.ries-post-card {
  border-top: 1px solid var(--ries-line);
  padding-block: 2rem;
}

.ries-footer {
  margin-top: clamp(3rem, 8vw, 7rem);
  border-top: 10px solid var(--ries-yellow);
  background: var(--ries-chocolate);
  color: var(--ries-cream);
}

.ries-footer a { color: var(--ries-yellow); }
.ries-footer .wp-block-site-title { font-weight: 850; }
.ries-footer .wp-block-site-title a { color: var(--ries-paper); text-decoration: none; }

@media (max-width: 860px) {
  .ries-header-inner { align-items: flex-start !important; flex-direction: column; gap: 1.25rem !important; padding-block: 1.5rem !important; }
  .ries-header .wp-block-navigation { width: 100%; justify-content: flex-end; }
  .document-gallery .document-icon-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  .ries-brand-mark { flex-basis: 44px; width: 44px; height: 44px; border-width: 3px; box-shadow: 6px 5px 0 var(--ries-yellow); font-size: .68rem; }
  .ries-page-heading .wp-block-post-title { font-size: clamp(2.2rem, 14vw, 3.7rem); }
  .home .ries-content > .wp-block-group:first-of-type { border-width: 3px; border-radius: 24px; box-shadow: 8px 8px 0 var(--ries-yellow); }
  .document-gallery .document-icon-row { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}