/*
 * Modular presentation settings — shared modifier classes.
 * Emitted by adsurdly_block_settings_class() onto block wrappers.
 *
 * Naming:
 *   .is-theme-{light|dark|navy|transparent}   — outer wrapper
 *   .align-{left|center|right}                — outer wrapper, text-align on content
 *   .spacing-{compact|normal|loose}           — outer wrapper, sets section padding
 *   .width-{normal|wide|full}                 — outer wrapper, sets container max-width
 *   .cols-{2|3|4|auto}                        — outer wrapper, applies to inner grid via descendant
 *   .media-{left|right|top|background}        — outer wrapper, for split layouts
 *   .cards-{flat|bordered|glass|shadow}       — outer wrapper, applies to child cards
 *
 * Each block opts in by:
 *   1. Declaring the relevant attribute in block.json
 *   2. Emitting the helper class on its outermost element
 *   3. (Optional) Adding per-block overrides in its own style.css
 */

/* ── Theme (background + foreground) ─────────────────── */
.adsurdly-section.is-theme-light {
  background: var(--white, #ffffff);
  color: var(--blue-dark, #0a1442);
}
.adsurdly-section.is-theme-light h1, .adsurdly-section.is-theme-light h2, .adsurdly-section.is-theme-light h3 { color: var(--blue-dark, #0a1442); }
.adsurdly-section.is-theme-light p { color: var(--t-body-light, #555); }

.adsurdly-section.is-theme-dark {
  background: #0a0a0a;
  color: #f7f8fc;
}
.adsurdly-section.is-theme-dark h1, .adsurdly-section.is-theme-dark h2, .adsurdly-section.is-theme-dark h3 { color: #ffffff; }
.adsurdly-section.is-theme-dark p { color: var(--t-body-dark, rgba(255,255,255,0.7)); }

.adsurdly-section.is-theme-navy {
  background: var(--blue-dark, #0a1442);
  color: #ffffff;
}
.adsurdly-section.is-theme-navy h1, .adsurdly-section.is-theme-navy h2, .adsurdly-section.is-theme-navy h3 { color: #ffffff; }
.adsurdly-section.is-theme-navy p { color: rgba(255,255,255,0.75); }

.adsurdly-section.is-theme-transparent { background: transparent; }

/* ── Content alignment ───────────────────────────────── */
.adsurdly-section.align-left  { text-align: left; }
.adsurdly-section.align-center { text-align: center; }
.adsurdly-section.align-right { text-align: right; }

/* ── Spacing (section padding) ───────────────────────── */
.adsurdly-section.spacing-compact { padding-top: clamp(24px, 3vw, 40px); padding-bottom: clamp(24px, 3vw, 40px); }
.adsurdly-section.spacing-normal  { padding-top: clamp(48px, 6vw, 80px); padding-bottom: clamp(48px, 6vw, 80px); }
.adsurdly-section.spacing-loose   { padding-top: clamp(72px, 9vw, 144px); padding-bottom: clamp(72px, 9vw, 144px); }

/* ── Section width (inner container max-width) ───────── */
.adsurdly-section.width-normal > .container,
.adsurdly-section.width-normal > [class$="-inner"] { max-width: 1180px; }
.adsurdly-section.width-wide > .container,
.adsurdly-section.width-wide > [class$="-inner"]   { max-width: 1400px; }
.adsurdly-section.width-full > .container,
.adsurdly-section.width-full > [class$="-inner"]   { max-width: none; width: 100%; padding-left: clamp(16px, 3vw, 40px); padding-right: clamp(16px, 3vw, 40px); }

/* ── Columns (applied via descendant on the inner grid container) ── */
.adsurdly-section.cols-2 .wp-block-columns,
.adsurdly-section.cols-2 .inner-feature-cards,
.adsurdly-section.cols-2 .inner-expect-cards,
.adsurdly-section.cols-2 .results-cards-grid,
.adsurdly-section.cols-2 .work-grid,
.adsurdly-section.cols-2 .service-grid { grid-template-columns: repeat(2, 1fr); }

.adsurdly-section.cols-3 .wp-block-columns,
.adsurdly-section.cols-3 .inner-feature-cards,
.adsurdly-section.cols-3 .inner-expect-cards,
.adsurdly-section.cols-3 .results-cards-grid,
.adsurdly-section.cols-3 .work-grid,
.adsurdly-section.cols-3 .service-grid { grid-template-columns: repeat(3, 1fr); }

.adsurdly-section.cols-4 .wp-block-columns,
.adsurdly-section.cols-4 .inner-feature-cards,
.adsurdly-section.cols-4 .inner-expect-cards,
.adsurdly-section.cols-4 .results-cards-grid,
.adsurdly-section.cols-4 .work-grid,
.adsurdly-section.cols-4 .service-grid { grid-template-columns: repeat(4, 1fr); }

.adsurdly-section.cols-auto .wp-block-columns,
.adsurdly-section.cols-auto .inner-feature-cards,
.adsurdly-section.cols-auto .inner-expect-cards,
.adsurdly-section.cols-auto .results-cards-grid,
.adsurdly-section.cols-auto .work-grid,
.adsurdly-section.cols-auto .service-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }

@media (max-width: 900px) {
  .adsurdly-section.cols-2 .wp-block-columns, .adsurdly-section.cols-3 .wp-block-columns, .adsurdly-section.cols-4 .wp-block-columns {
    grid-template-columns: 1fr;
  }
}

/* ── Media position (two-up split layouts) ───────────── */
.adsurdly-section.media-left .inner-content-inner  { direction: ltr; }
.adsurdly-section.media-right .inner-content-inner { direction: rtl; }
.adsurdly-section.media-right .inner-content-inner > * { direction: ltr; }
.adsurdly-section.media-top .inner-content-inner   { grid-template-columns: 1fr; }
.adsurdly-section.media-top .inner-content-inner .inner-content-illustration { order: -1; }
.adsurdly-section.media-background .inner-content-inner { grid-template-columns: 1fr; position: relative; }
.adsurdly-section.media-background .inner-content-inner .inner-content-illustration {
  position: absolute; inset: 0; z-index: 0; opacity: 0.18;
}
.adsurdly-section.media-background .inner-content-inner .inner-content-text { position: relative; z-index: 1; }

/* ── Card style (applied to child cards) ─────────────── */
.adsurdly-section.cards-flat .wp-block-group,
.adsurdly-section.cards-flat .wp-block-column { background: transparent; border: none; box-shadow: none; }

.adsurdly-section.cards-bordered .wp-block-group,
.adsurdly-section.cards-bordered .wp-block-column { background: transparent; border: 1px solid rgba(255,255,255,0.12); box-shadow: none; }

.adsurdly-section.cards-glass .wp-block-group,
.adsurdly-section.cards-glass .wp-block-column {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.adsurdly-section.cards-shadow .wp-block-group,
.adsurdly-section.cards-shadow .wp-block-column { box-shadow: 0 12px 36px rgba(0,0,0,0.25); }

/* ── Block-style variants on core blocks ─────────────── */

/* core/button — Adsurdly preset buttons */
.wp-block-button.is-style-primary > .wp-block-button__link {
  background: var(--wp--preset--color--blue-bright, #4db8ff);
  color: var(--wp--preset--color--white, #ffffff);
  border-radius: 50px;
  padding: 14px 32px;
  font-weight: 700;
}
.wp-block-button.is-style-secondary > .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--blue-bright, #4db8ff);
  border: 2px solid currentColor;
  border-radius: 50px;
  padding: 12px 30px;
  font-weight: 700;
}
.wp-block-button.is-style-hero > .wp-block-button__link {
  background: var(--wp--preset--color--blue-bright, #4db8ff);
  color: var(--wp--preset--color--white, #ffffff);
  border-radius: 50px;
  padding: 14px 32px 14px 56px;
  font-weight: 700;
  position: relative;
}
.wp-block-button.is-style-hero > .wp-block-button__link::before {
  content: '';
  position: absolute;
  left: 24px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 1.27h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 8.86a16 16 0 0 0 6.29 6.29l1.16-.96a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/></svg>") no-repeat center / contain;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 1.27h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 8.86a16 16 0 0 0 6.29 6.29l1.16-.96a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/></svg>") no-repeat center / contain;
}
.wp-block-button.is-style-inline-arrow > .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--blue-bright, #4db8ff);
  padding: 4px 0;
  font-weight: 700;
}
.wp-block-button.is-style-inline-arrow > .wp-block-button__link::after {
  content: ' →';
  display: inline-block;
  margin-left: 6px;
  transition: transform 0.2s;
}
.wp-block-button.is-style-inline-arrow > .wp-block-button__link:hover::after {
  transform: translateX(4px);
}

/* core/heading — typography presets */
.wp-block-heading.is-style-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--blue-bright, #4db8ff);
}
.wp-block-heading.is-style-display {
  font-size: clamp(36px, 5.5vw, 72px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.01em;
}
.wp-block-heading.is-style-subtitle {
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 500;
  color: rgba(0,0,0,0.6);
  letter-spacing: 0;
}

/* core/paragraph + core/heading — typography presets (generic selectors so both blocks pick them up) */
.is-style-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--blue-bright, #4db8ff);
}
.is-style-lede {
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.6;
  font-weight: 400;
}
.is-style-small {
  font-size: clamp(13px, 1.1vw, 14px);
  color: rgba(0,0,0,0.55);
}
.is-style-display {
  font-size: clamp(36px, 5.5vw, 72px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.01em;
}
.is-style-subtitle {
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 500;
  color: rgba(0,0,0,0.6);
}

/* In dark/navy/hero sections, eyebrow stays accent-blue, lede + small invert to light */
.adsurdly-section.is-style-navy .is-style-lede,
.adsurdly-section.is-style-dark .is-style-lede,
.adsurdly-section.is-style-hero .is-style-lede { color: rgba(255,255,255,0.85); }
.adsurdly-section.is-style-navy .is-style-small,
.adsurdly-section.is-style-dark .is-style-small,
.adsurdly-section.is-style-hero .is-style-small { color: rgba(255,255,255,0.6); }

/* core/group — themed card containers */
.wp-block-group.is-style-card-flat,
.wp-block-group.is-style-card-bordered,
.wp-block-group.is-style-card-glass,
.wp-block-group.is-style-card-shadow {
  padding: clamp(24px, 3vw, 40px);
  border-radius: 16px;
}
.wp-block-group.is-style-card-flat     { background: rgba(0,0,0,0.04); }
.wp-block-group.is-style-card-bordered { background: transparent; border: 1px solid rgba(0,0,0,0.12); }
.wp-block-group.is-style-card-glass    { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.10); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.wp-block-group.is-style-card-shadow   { background: #ffffff; box-shadow: 0 12px 36px rgba(0,0,0,0.12); }

/* Inside a dark/navy/hero section, switch card defaults */
.adsurdly-section.is-style-navy .wp-block-group.is-style-card-flat,
.adsurdly-section.is-style-dark .wp-block-group.is-style-card-flat,
.adsurdly-section.is-style-hero .wp-block-group.is-style-card-flat { background: rgba(255,255,255,0.06); color: #ffffff; }

.adsurdly-section.is-style-navy .wp-block-group.is-style-card-bordered,
.adsurdly-section.is-style-dark .wp-block-group.is-style-card-bordered,
.adsurdly-section.is-style-hero .wp-block-group.is-style-card-bordered { border-color: rgba(255,255,255,0.12); color: #ffffff; }
