/**
 * @file
 * ctteb theme — layout + components ("Events chalkboard").
 * Regions: header, breadcrumb, content, footer. Component files concatenated.
 */

/* ---------- layout/board-frame ---------- */
.layout-container.board-frame {
  max-width: 1180px;
  margin: 22px auto 30px;
  background-color: var(--ctteb-slate);
  background-image:
    radial-gradient(ellipse at 18% 12%, rgba(255,255,255,.07), transparent 42%),
    radial-gradient(ellipse at 82% 64%, rgba(255,255,255,.05), transparent 46%),
    radial-gradient(ellipse at 40% 92%, rgba(255,255,255,.045), transparent 38%),
    linear-gradient(180deg, var(--ctteb-slate-2), var(--ctteb-slate));
  border: 16px solid var(--ctteb-wood);
  border-image: linear-gradient(135deg, #8a5a33, #5a3519 40%, #7c4f2b 70%, #4d2d15) 1;
  box-shadow: 0 18px 50px rgba(0,0,0,.55), inset 0 0 80px rgba(0,0,0,.35);
  position: relative;
}
.page-main { padding: 0 clamp(16px, 4vw, 48px) 2.5rem; }

/* ---------- components/header ---------- */
.board-header {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "brand date" "nav nav";
  gap: .6rem 1.5rem;
  padding: 1.6rem clamp(16px, 4vw, 48px) 0;
}
.block-system-branding-block { grid-area: brand; display: grid; grid-template-columns: auto 1fr; column-gap: .9rem; align-items: center; }
.site-logo { grid-row: span 2; }
.site-logo img { width: 58px; height: 58px; border-radius: 6px; box-shadow: 0 0 0 2px rgba(236,235,226,.25); }
.site-name a {
  font-family: var(--ctteb-font-chalk); font-weight: 700; font-size: clamp(2.2rem, 5vw, 3.1rem);
  color: var(--ctteb-chalk); text-decoration: none; letter-spacing: .06em; line-height: 1;
}
.site-slogan { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .16em; font-size: .86rem; color: var(--ctteb-chalk-dim); }
.block-chalk-date { grid-area: date; align-self: center; text-align: right; font-family: var(--ctteb-font-label); }
.chalk-date__day { display: block; font-family: var(--ctteb-font-chalk); font-size: 1.35rem; color: var(--ctteb-yellow); }
.chalk-date__where { display: block; font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ctteb-chalk-dim); }
.menu--main { grid-area: nav; border-top: 2px dashed rgba(236,235,226,.28); border-bottom: 2px dashed rgba(236,235,226,.28); }
.menu--main .menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.menu--main .menu-item a {
  display: block; padding: .62rem 1rem; font-family: var(--ctteb-font-label); font-weight: 600;
  text-transform: uppercase; letter-spacing: .12em; font-size: 1rem; color: var(--ctteb-chalk); text-decoration: none;
}
.menu--main .menu-item a:hover { color: var(--ctteb-yellow); }
.menu--main .menu-item a.is-active { color: var(--ctteb-slate); background: var(--ctteb-chalk); border-radius: 2px 14px 3px 10px; }
.menu-toggle { display: none; }

/* ---------- components/breadcrumb ---------- */
.region-breadcrumb { padding: .9rem clamp(16px, 4vw, 48px) 0; }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; font-family: var(--ctteb-font-label); font-size: .95rem; letter-spacing: .05em; color: var(--ctteb-chalk-dim); }
.breadcrumb li + li::before { content: "\2192"; margin-right: .3rem; color: var(--ctteb-pink); }
.breadcrumb a { color: var(--ctteb-chalk-dim); }

/* ---------- components/page-title ---------- */
.block-page-title-block { margin: 1.6rem 0 1.4rem; }
.chalk-kicker { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .16em; color: var(--ctteb-pink); margin: 0 0 .3rem; font-weight: 600; }
.chalk-title { font-family: var(--ctteb-font-chalk); font-weight: 700; font-size: clamp(2rem, 4.6vw, 3.2rem); margin: 0; color: var(--ctteb-chalk); }
.chalk-title .field::after {
  content: ""; display: block; height: 5px; margin-top: .35rem; max-width: 14rem;
  background: linear-gradient(90deg, var(--ctteb-yellow) 0 70%, transparent);
  border-radius: 4px; opacity: .85; transform-origin: left; animation: ctteb-chalk-draw .9s ease-out both;
}
@keyframes ctteb-chalk-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- components/node (pinned paper sheet) ---------- */
.node { position: relative; }
.node__layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 2rem; align-items: start; }
.node__content.paper-sheet {
  background: var(--ctteb-paper); color: var(--ctteb-ink); padding: clamp(1.2rem, 3vw, 2.4rem);
  border-radius: 2px; box-shadow: 0 10px 24px rgba(0,0,0,.4); position: relative;
}
.paper-sheet::before, .paper-sheet::after {
  content: ""; position: absolute; top: -12px; width: 90px; height: 26px; background: rgba(243,200,90,.75);
  box-shadow: 0 2px 4px rgba(0,0,0,.2);
}
.paper-sheet::before { left: 24px; transform: rotate(-4deg); }
.paper-sheet::after { right: 24px; transform: rotate(3deg); }
.paper-sheet a { color: #8d3b22; }
.paper-sheet a:hover { color: #000; }
.paper-sheet h2 { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .08em; font-size: 1.35rem; margin: 1.8rem 0 .5rem; color: #2a4a3c; }
.paper-sheet h2:first-child { margin-top: 0; }
.paper-sheet dt { font-weight: 600; margin-top: .9rem; color: #2a4a3c; }
.paper-sheet dd { margin: .15rem 0 0 1.2rem; }
.paper-sheet li { margin: .25rem 0; }
.node__meta { font-family: var(--ctteb-font-label); letter-spacing: .08em; text-transform: uppercase; color: var(--ctteb-chalk-dim); margin: -0.6rem 0 1.2rem; }
.field--name-field-image { margin: 0 0 1.4rem; }
.field--name-field-image figure, figure.media { margin: 0; }
.field--name-field-image img, figure.media img { width: 100%; border: 6px solid #fff; box-shadow: 0 6px 14px rgba(0,0,0,.25); }
figcaption { font-family: var(--ctteb-font-label); font-size: .85rem; letter-spacing: .03em; color: #4c5a53; margin-top: .4rem; }
.node__aside > * + * { margin-top: 1.4rem; }

/* venue facts: chalk-outlined card on the board */
.venue-facts { border: 2px solid rgba(236,235,226,.55); border-radius: 12px 4px 14px 6px; padding: 1.1rem 1.2rem; }
.venue-facts h2 { font-family: var(--ctteb-font-chalk); font-size: 1.5rem; margin: 0 0 .6rem; color: var(--ctteb-yellow); }
.venue-facts .field { margin-bottom: .75rem; }
.venue-facts .field__label { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; color: var(--ctteb-pink); }
.venue-facts .field__item { font-size: .98rem; }
.aside-gallery img { border: 5px solid #fff; transform: rotate(1.4deg); box-shadow: 0 6px 14px rgba(0,0,0,.35); }
.aside-gallery figcaption { color: var(--ctteb-chalk-dim); }
.aside-list h2, .block__title { font-family: var(--ctteb-font-chalk); font-size: 1.5rem; color: var(--ctteb-chalk); margin: 0 0 .5rem; }
.aside-list ul { list-style: none; margin: 0; padding: 0; }
.aside-list li { border-bottom: 1px dashed rgba(236,235,226,.25); padding: .38rem 0; }
.aside-list a { color: var(--ctteb-chalk); text-decoration: none; }
.aside-list a:hover { color: var(--ctteb-yellow); }

/* ---------- components/chalk-list (board rows) ---------- */
.chalk-section { margin: 2.6rem 0; }
.chalk-section__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; border-bottom: 2px solid rgba(236,235,226,.4); padding-bottom: .4rem; margin-bottom: .8rem; }
.chalk-section__head h2 { font-family: var(--ctteb-font-chalk); font-size: clamp(1.7rem, 3.4vw, 2.3rem); margin: 0; color: var(--ctteb-chalk); }
.chalk-section__head p { margin: 0; font-family: var(--ctteb-font-label); letter-spacing: .1em; text-transform: uppercase; color: var(--ctteb-chalk-dim); font-size: .9rem; }
.chalk-list { list-style: none; margin: 0; padding: 0; }
.board-row { border-bottom: 1px dashed rgba(236,235,226,.22); }
.board-row > a {
  display: grid; grid-template-columns: minmax(0, auto) 1fr auto; align-items: baseline; gap: .7rem;
  padding: .7rem .2rem .15rem; text-decoration: none; color: var(--ctteb-chalk); transition: transform .25s ease, color .25s ease;
}
.board-row > a:hover { transform: translateX(6px); color: var(--ctteb-yellow); }
.board-row__name { font-family: var(--ctteb-font-chalk); font-size: clamp(1.25rem, 2.6vw, 1.6rem); }
.chalk-leader { border-bottom: 3px dotted rgba(236,235,226,.4); transform: translateY(-.35rem); min-width: 1.5rem; }
.board-row__dist { font-family: var(--ctteb-font-label); font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--ctteb-yellow); white-space: nowrap; }
.board-row__style { display: block; padding: 0 .2rem .7rem; color: var(--ctteb-chalk-dim); font-size: .95rem; }
.board-row__tag { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .12em; font-size: .75rem; color: var(--ctteb-slate); background: var(--ctteb-pink); padding: .05rem .45rem; border-radius: 2px; margin-right: .45rem; }

/* numbered planning chalk */
.chalk-steps { counter-reset: step; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .4rem 2rem; }
.chalk-steps li { counter-increment: step; display: grid; grid-template-columns: 2.6rem 1fr; gap: .6rem; padding: .6rem 0; border-bottom: 1px dashed rgba(236,235,226,.2); }
.chalk-steps li::before {
  content: counter(step); font-family: var(--ctteb-font-chalk); font-size: 1.4rem; color: var(--ctteb-yellow);
  width: 2.4rem; height: 2.4rem; border: 2px solid var(--ctteb-yellow); border-radius: 48% 52% 45% 55%; display: grid; place-items: center;
}
.chalk-steps a { color: var(--ctteb-chalk); font-weight: 600; text-decoration: none; }
.chalk-steps a:hover { color: var(--ctteb-yellow); }
.chalk-steps span { display: block; color: var(--ctteb-chalk-dim); font-size: .92rem; }

/* bulletin rows (feed F12) */
.bulletin-chalk-row { display: grid; grid-template-columns: 7.5rem 1fr; gap: .2rem 1rem; padding: .8rem 0; border-bottom: 1px dashed rgba(236,235,226,.22); }
.bulletin-chalk-row .views-field-title, .bulletin-chalk-row .views-field-field-kicker { grid-column: 2; }
.chalk-stamp { grid-row: span 2; font-family: var(--ctteb-font-label); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ctteb-pink); border: 2px solid var(--ctteb-pink); border-radius: 4px; padding: .15rem .4rem; height: max-content; text-align: center; font-size: .85rem; transform: rotate(-2deg); }
.views-field-title a { font-family: var(--ctteb-font-chalk); font-size: 1.35rem; color: var(--ctteb-chalk); text-decoration: none; }
.views-field-title a:hover { color: var(--ctteb-yellow); }
.views-field-field-kicker { color: var(--ctteb-chalk-dim); font-size: .95rem; }
.view-footer { margin-top: 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.view-footer__note { font-family: var(--ctteb-font-label); letter-spacing: .1em; text-transform: uppercase; color: var(--ctteb-chalk-dim); font-size: .85rem; }
.digest-week { margin-bottom: 2rem; }
.digest-week__label { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .14em; font-size: 1.05rem; color: var(--ctteb-yellow); margin: 0 0 .3rem; border-bottom: 2px solid rgba(243,200,90,.4); padding-bottom: .3rem; }
.digest-issue { font-family: var(--ctteb-font-label); letter-spacing: .1em; text-transform: uppercase; color: var(--ctteb-chalk-dim); }

/* buttons: hand-drawn chalk outline */
.chalk-button, .button, .form-submit {
  display: inline-block; font-family: var(--ctteb-font-label); font-weight: 700; text-transform: uppercase; letter-spacing: .14em;
  color: var(--ctteb-chalk); background: transparent; border: 2px solid var(--ctteb-chalk); border-radius: 255px 15px 225px 15px / 15px 225px 15px 255px;
  padding: .5rem 1.15rem; text-decoration: none; cursor: pointer; font-size: .95rem;
}
.chalk-button:hover, .button:hover, .form-submit:hover { color: var(--ctteb-slate); background: var(--ctteb-yellow); border-color: var(--ctteb-yellow); }

/* ---------- front page ---------- */
.board-intro { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2rem; align-items: center; margin: 1.8rem 0 1rem; }
.board-intro h1 { font-family: var(--ctteb-font-chalk); font-size: clamp(2.3rem, 5.4vw, 3.8rem); margin: 0 0 .6rem; }
.board-intro h1 em { font-style: normal; color: var(--ctteb-yellow); }
.board-intro p { font-size: 1.12rem; color: var(--ctteb-chalk-dim); margin: 0 0 1.2rem; max-width: 38rem; }
.board-intro figure { margin: 0; transform: rotate(2deg); }
.board-intro img { border: 8px solid #fff; box-shadow: 0 12px 26px rgba(0,0,0,.5); }
.board-intro figcaption { color: var(--ctteb-chalk-dim); }
.board-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2.4rem; }
.pinned-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; margin: 1.4rem 0; }
.pinned-strip a { display: block; background: #fff; padding: .55rem .55rem .2rem; color: var(--ctteb-ink); text-decoration: none; box-shadow: 0 8px 18px rgba(0,0,0,.45); transition: transform .3s ease; }
.pinned-strip a:nth-child(odd) { transform: rotate(-2.2deg); }
.pinned-strip a:nth-child(even) { transform: rotate(1.8deg); }
.pinned-strip a:hover { transform: rotate(0) scale(1.03); }
.pinned-strip img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.pinned-strip span { display: block; font-family: var(--ctteb-font-chalk); font-size: 1.1rem; text-align: center; padding: .35rem 0; color: var(--ctteb-ink); }
.board-note { border-left: 4px solid var(--ctteb-pink); padding: .2rem 0 .2rem 1rem; color: var(--ctteb-chalk-dim); max-width: 52rem; }

/* hubs */
.hub-intro { max-width: 52rem; color: var(--ctteb-chalk-dim); font-size: 1.08rem; }
.hub-routes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.6rem; }
.hub-route { border: 2px solid rgba(236,235,226,.4); border-radius: 18px 6px 16px 8px; overflow: hidden; }
.hub-route img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; filter: saturate(.85); }
.hub-route div { padding: .9rem 1rem 1.1rem; }
.hub-route h2 { font-family: var(--ctteb-font-chalk); margin: 0 0 .3rem; font-size: 1.45rem; }
.hub-route h2 a { color: var(--ctteb-chalk); text-decoration: none; }
.hub-route p { margin: 0; color: var(--ctteb-chalk-dim); font-size: .95rem; }
.hub-map { columns: 2 300px; column-gap: 2.5rem; }
.hub-map section { break-inside: avoid; margin-bottom: 1.6rem; }
.hub-map h2 { font-family: var(--ctteb-font-chalk); font-size: 1.6rem; margin: 0 0 .2rem; }
.hub-map h2 a { color: var(--ctteb-chalk); }
.hub-map img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; margin: .4rem 0; border: 4px solid rgba(255,255,255,.9); }
.hub-map p { margin: 0; color: var(--ctteb-chalk-dim); }

/* ---------- utility pages ---------- */
.utility-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.utility-table th, .utility-table td { text-align: left; padding: .5rem .4rem; border-bottom: 1px solid rgba(30,42,37,.2); vertical-align: top; }
.utility-table th { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .08em; }
.utility-table img { width: 84px; height: 56px; object-fit: cover; border: 0; box-shadow: none; }
.search-results { list-style: none; padding: 0; margin: 1rem 0 0; }
.search-results li { padding: .8rem 0; border-bottom: 1px dashed rgba(30,42,37,.3); }
.search-result__title { font-weight: 600; font-size: 1.12rem; }
.search-result__snippet { margin: .2rem 0 0; color: #3f4b45; font-size: .95rem; }
.search-result__type { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .1em; font-size: .78rem; color: #8d3b22; margin-left: .4rem; }
.search-empty { font-weight: 600; color: #8d3b22; }
.paper-sheet .form-item { margin-bottom: 1rem; }
.paper-sheet label { display: block; font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .1em; font-weight: 600; }
.paper-sheet input[type="text"], .paper-sheet input[type="email"], .paper-sheet input[type="search"], .paper-sheet textarea, .paper-sheet select {
  width: 100%; font: inherit; padding: .55rem .7rem; border: 2px solid #2a4a3c; background: #fffdf6; color: var(--ctteb-ink); border-radius: 2px;
}
.paper-sheet .form-submit { color: var(--ctteb-ink); border-color: var(--ctteb-ink); }
.contact-note { margin-top: 1rem; padding: .7rem 1rem; border: 2px dashed #2a4a3c; }
.sitemap-cols { columns: 2 280px; column-gap: 2.5rem; }
.sitemap-cols section { break-inside: avoid; margin-bottom: 1.4rem; }
.sitemap-cols h2 { margin-top: 0; }

/* ---------- components/footer (chalk ledge) ---------- */
.chalk-ledge { margin-top: 1rem; }
.chalk-ledge__tray { height: 22px; background: linear-gradient(180deg, #8a5a33, #5a3519); box-shadow: 0 4px 8px rgba(0,0,0,.45); display: flex; align-items: flex-start; gap: 18px; padding: 0 40px; position: relative; }
.chalk-piece { width: 46px; height: 9px; border-radius: 4px; margin-top: -4px; box-shadow: 0 2px 2px rgba(0,0,0,.3); }
.chalk-piece--white { background: #f4f2ea; }
.chalk-piece--yellow { background: var(--ctteb-yellow); width: 30px; }
.chalk-piece--pink { background: var(--ctteb-pink); width: 38px; }
.chalk-eraser { margin-left: auto; width: 86px; height: 20px; margin-top: -12px; background: linear-gradient(180deg, #b78c5c 0 55%, #3c3c3c 55%); border-radius: 3px; box-shadow: 0 3px 4px rgba(0,0,0,.4); }
.chalk-ledge__body { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1.8rem; padding: 1.8rem clamp(16px, 4vw, 48px) 1rem; background: rgba(0,0,0,.18); }
.chalk-ledge__brand { font-family: var(--ctteb-font-chalk); font-size: 2rem; margin: 0; color: var(--ctteb-yellow); }
.chalk-ledge__body p { color: var(--ctteb-chalk-dim); font-size: .92rem; }
.menu--footer { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 1rem; }
.menu--footer li { padding: .2rem 0; }
.menu--footer a { font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .1em; color: var(--ctteb-chalk); text-decoration: none; }
.menu--footer a:hover { color: var(--ctteb-yellow); }
.search-block-form .form-item__label { display: block; font-family: var(--ctteb-font-chalk); font-size: 1.3rem; margin-bottom: .4rem; }
.search-block-form .form-item { display: flex; gap: .5rem; }
.search-block-form .form-search { flex: 1; min-width: 0; font: inherit; padding: .45rem .6rem; background: transparent; color: var(--ctteb-chalk); border: 2px solid rgba(236,235,226,.5); border-radius: 3px; }
.chalk-ledge__colophon { margin: 0; padding: .8rem clamp(16px, 4vw, 48px) 1.2rem; font-family: var(--ctteb-font-label); letter-spacing: .06em; font-size: .85rem; color: var(--ctteb-chalk-dim); background: rgba(0,0,0,.18); border-top: 1px dashed rgba(236,235,226,.2); }
.chalk-ledge__colophon a { color: var(--ctteb-chalk-dim); }

/* ---------- responsive ---------- */
@media (max-width: 900px) {
  .node__layout { grid-template-columns: 1fr; }
  .board-intro { grid-template-columns: 1fr; }
  .pinned-strip { grid-template-columns: repeat(2, 1fr); }
  .chalk-ledge__body { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .layout-container.board-frame { margin: 0; border-width: 8px; }
  .board-header { grid-template-columns: 1fr; grid-template-areas: "brand" "date" "nav"; }
  .block-chalk-date { text-align: left; }
  .menu-toggle { display: block; width: 100%; text-align: left; background: transparent; color: var(--ctteb-chalk); border: 0; font-family: var(--ctteb-font-label); text-transform: uppercase; letter-spacing: .14em; font-weight: 700; padding: .6rem 0; cursor: pointer; }
  .menu--main .menu { display: none; flex-direction: column; }
  .menu--main.is-open .menu { display: flex; }
  .board-row > a { grid-template-columns: 1fr; gap: 0; }
  .chalk-leader { display: none; }
  .bulletin-chalk-row { grid-template-columns: 1fr; }
  .bulletin-chalk-row .views-field-title, .bulletin-chalk-row .views-field-field-kicker { grid-column: 1; }
  .chalk-stamp { justify-self: start; }
  .menu--footer { columns: 1; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}