/* =====================================================================
 * site/css/wptream_dura_blocks.css
 *
 * Styles for the redesign custom Elementor widgets ("WpStream ..." blocks
 * in plugins/wpstream-elementor/widgets/). The widgets print design-system
 * markup (wptream_dura_* classes, see WPTREAM_DURA_DESIGN_SYSTEM.md) and
 * reuse the component classes from wptream_dura_components.css wherever the
 * design has a component (buttons, eyebrow, section header, spec grid,
 * feature row, media panel, disclosure, inputs). This file only adds what
 * the use-case landing page (design BaseLandingPage.jsx) draws by hand.
 *
 * Every value is the one the design uses; only the names changed
 * (`--ws-foo` -> `--wptream_dura_foo`). Colours come from the context
 * variables so `.wptream_dura_dark` on a block flips it.
 *
 * Loaded after wptream_dura_elementor.css, front site only
 * (site/wptream_dura_styles.php). Sections:
 *   B0  shared: device fit wrapper, design device overrides, animations
 *   B1  Landing Hero         .wptream_dura_landing_hero
 *   B2  Facts Grid           (spec grid component, no extra rules)
 *   B3  Guide Form           .wptream_dura_guide
 *   B4  Steps                .wptream_dura_steps
 *   B5  Scroll Video         .wptream_dura_scrollvideo
 *   B6  Showcase             .wptream_dura_showcase
 *   B7  Split Cards          .wptream_dura_split_cards
 *   B8  Feature Rows         .wptream_dura_rows
 *   B9  Quote                .wptream_dura_quote
 *   B10 Card Slider          .wptream_dura_slider
 *   B11 Feature Cards        .wptream_dura_feature_cards
 *   B12 Monetization         .wptream_dura_monetization
 *   B13 FAQ                  (disclosure component + header)
 *   B14 CTA                  .wptream_dura_cta
 *   B15 Blog List            .wptream_dura_blog        (BlogPage.jsx)
 *   B16 Blog Post            .wptream_dura_post        (PostPage.jsx, theme template-parts/single.php)
 *   B17 Auth Page            .wptream_dura_auth        (AuthPage.jsx)
 *   B18 Reviews              .wptream_dura_reviews     (homepage + church reviews)
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * B0. Shared
 * ------------------------------------------------------------------- */

/* Wrapper that scales a fixed-size devices.css frame to its own width
 * (assets/js/wptream_dura_blocks.js, D.fitDevices sets transform + height). */
.wptream_dura_device_fit { position: relative; width: 100%; overflow: visible; }
.wptream_dura_device_fit > .device { margin: 0; transform-origin: top left; }

/* Design override (index.html .ws-mb-accent-device): WpStream-purple MacBook. */
.device-macbook.wptream_dura_device_accent .device-frame { box-shadow: inset 0 0 0 2px #4E2EE5; }
.device-macbook.wptream_dura_device_accent .device-power { background: #4E2EE5; border-color: #3D20C2; }
.device-macbook.wptream_dura_device_accent .device-power::after { background: radial-gradient(circle at center, #6244EA 0, #6244EA 85%, #3D20C2 100%); border-color: #3D20C2; }
.device-macbook.wptream_dura_device_accent .device-power::before { background: #3D20C2; box-shadow: inset 0 -2px 6px 0 #2A1585; }
.device-macbook.wptream_dura_device_accent .device-home { display: none; }
.device-macbook.wptream_dura_device_accent .device-frame::before { content: ""; }
.wptream_dura_scrollvideo .device-macbook .device-frame::before { content: ""; }
/* Design override (index.html .ws-no-label): no "MacBook Pro" label on the 2018 frame. */
.device-macbook-pro-2018.wptream_dura_device_no_label .device-frame::before { content: ""; }

/* The Elementor kit paints every <button> on hover/focus (pink fill) and
 * every text input with its own border. The design's controls set their own
 * surfaces, so neutralise the kit on the block controls. !important because
 * the kit selectors (.elementor-kit-N button:hover, input:not([type=...]))
 * outrank single-class rules. */
.wptream_dura_site button.wptream_dura_disclosure_trigger,
.wptream_dura_site button.wptream_dura_disclosure_trigger:hover,
.wptream_dura_site button.wptream_dura_disclosure_trigger:focus,
.wptream_dura_site button.wptream_dura_disclosure_trigger:active {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: var(--wptream_dura_space_6) 0 !important;
  box-shadow: none !important;
  /* The kit's nowrap made long questions widen the phone page. */
  white-space: normal !important;
  width: 100%;
  min-width: 0;
}
/* Type comes from .wptream_dura_title; the colour follows the trigger so the
 * hover/open accent still reaches the question text. */
.wptream_dura_site .wptream_dura_disclosure_title { white-space: normal; min-width: 0; color: inherit; }
.wptream_dura_site .wptream_dura_input .wptream_dura_input_control,
.wptream_dura_site .wptream_dura_input .wptream_dura_input_control:focus {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  height: 100% !important;
  outline: none;
}

/* Entrance used by the landing hero device (index.html wsDeviceIn). */
@keyframes wptream_dura_device_in {
  0%   { opacity: 0; transform: perspective(1800px) rotateY(-34deg) rotateX(10deg) translateY(60px) scale(0.9); }
  60%  { opacity: 1; }
  100% { opacity: 1; transform: perspective(1800px) rotateY(0deg) rotateX(0deg) translateY(0) scale(1); }
}
/* Copy entrance used by the landing hero (BaseLandingPage rise()). */
@keyframes wptream_dura_rise_blur {
  from { opacity: 0; filter: blur(10px); transform: translateY(56px) scale(0.98); }
  to   { opacity: 1; filter: blur(0);    transform: none; }
}

/* WIDGET SECTIONS B1..B14 ARE APPENDED BELOW THIS LINE ----------------- */

/* ---------------------------------------------------------------------
 * B1. Landing Hero (.wptream_dura_landing_hero)
 * Design: BaseLandingPage.jsx sections 1 + 2 (centered hero + lead band).
 *   .wptream_dura_landing_hero [.wptream_dura_dark] [._animate]
 *     ├─ ._inner                 column, centered, gap 24, max container
 *     │    ├─ ._title (h1)       display font, clamp(48,6.5vw,84), 800, track display, lh display
 *     │    ├─ ._headline (p)     display font, clamp(24,2.6vw,32), 600, track headline, lh snug, 30ch
 *     │    ├─ ._subtitle (p)     body-lg, lh body, fg-2, 52ch
 *     │    ├─ ._actions          row, gap 24, centered, wrap, margin-top 8
 *     │    │    ├─ a._primary    .wptream_dura_btn _primary _lg
 *     │    │    └─ a._secondary  .wptream_dura_btn _link _arrow  |  _outline _lg
 *     │    └─ ._device           full width, centered, margin-top 64
 *     │         └─ .wptream_dura_device_fit > .device   |  figure.wptream_dura_media
 *     └─ ._lead                  column, centered, gap 16, measure body, margin-top 64
 *          ├─ ._lead_text (p)    body-lg, lh body, fg-2
 *          └─ ._lead_note (p)    caption, lh snug, fg-muted
 * ------------------------------------------------------------------- */
.wptream_dura_landing_hero { color: var(--wptream_dura_fg); }
.wptream_dura_landing_hero_inner {
  max-width: var(--wptream_dura_container);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--wptream_dura_space_5);
}
.wptream_dura_landing_hero_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: clamp(48px, 6.5vw, 84px);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_display);
  text-wrap: balance;
  color: var(--wptream_dura_fg);
}
.wptream_dura_landing_hero_headline {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: clamp(24px, 2.6vw, 32px);
  font-weight: var(--wptream_dura_weight_semibold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  text-wrap: balance;
  max-width: 30ch;
  color: var(--wptream_dura_fg);
}
.wptream_dura_landing_hero_subtitle {
  margin: 0;
  font-size: var(--wptream_dura_size_body_lg);
  line-height: var(--wptream_dura_lh_body);
  font-weight: var(--wptream_dura_weight_regular);
  text-wrap: balance;
  max-width: 52ch;
  color: var(--wptream_dura_fg_2);
}
.wptream_dura_landing_hero_actions {
  display: flex;
  gap: var(--wptream_dura_space_5);
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: var(--wptream_dura_space_2);
}
.wptream_dura_landing_hero_device {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: var(--wptream_dura_space_8);
  overflow: visible;
}
.wptream_dura_landing_hero_device .wptream_dura_device_fit { width: 100%; }
.wptream_dura_landing_hero_device .wptream_dura_media { width: 100%; margin: 0; }
/* Empty screen: the placeholder label sits centred in the dark screen box. */
.wptream_dura_landing_hero_screen_empty {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--wptream_dura_ink_200);
}
.wptream_dura_landing_hero_screen_empty .wptream_dura_media_placeholder { color: var(--wptream_dura_ink_500); }
.wptream_dura_landing_hero_lead {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_4);
  align-items: center;
  text-align: center;
  max-width: var(--wptream_dura_measure_body);
  margin: var(--wptream_dura_space_8) auto 0;
}
.wptream_dura_landing_hero_lead_text {
  margin: 0;
  font-size: var(--wptream_dura_size_body_lg);
  line-height: var(--wptream_dura_lh_body);
  text-wrap: pretty;
  color: var(--wptream_dura_fg_2);
}
.wptream_dura_landing_hero_lead_note {
  margin: 0;
  font-size: var(--wptream_dura_size_caption);
  line-height: var(--wptream_dura_lh_snug);
  color: var(--wptream_dura_fg_muted);
}
/* Entrance (design rise(i): 1000ms ease-out, 160ms stagger; device wsDeviceIn 1400ms after 420ms). */
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_title,
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_headline,
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_subtitle,
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_actions {
  animation: wptream_dura_rise_blur 1000ms var(--wptream_dura_ease_out) both;
}
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_headline { animation-delay: 160ms; }
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_subtitle { animation-delay: 320ms; }
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_actions  { animation-delay: 480ms; }
.wptream_dura_landing_hero_animate .wptream_dura_landing_hero_device > * {
  animation: wptream_dura_device_in 1400ms var(--wptream_dura_ease_out) 420ms both;
  transform-style: preserve-3d;
}
@media (prefers-reduced-motion: reduce) {
  .wptream_dura_landing_hero_animate .wptream_dura_landing_hero_title,
  .wptream_dura_landing_hero_animate .wptream_dura_landing_hero_headline,
  .wptream_dura_landing_hero_animate .wptream_dura_landing_hero_subtitle,
  .wptream_dura_landing_hero_animate .wptream_dura_landing_hero_actions,
  .wptream_dura_landing_hero_animate .wptream_dura_landing_hero_device > * { animation: none; }
}
/* Theme addition (kit is desktop only): buttons go full width on phones. */
@media (max-width: 600px) {
  .wptream_dura_landing_hero_actions { flex-direction: column; width: 100%; }
  .wptream_dura_landing_hero_actions .wptream_dura_btn:not(.wptream_dura_btn_link) { width: 100%; }
}

/* ---------------------------------------------------------------------
 * B2. Facts Grid (widget wpstream_facts_grid)
 * Prints the SpecGrid component markup verbatim:
 *   dl.wptream_dura_spec_grid._cols_2|3|4 [._undivided] [.wptream_dura_dark]
 *     └─ div.wptream_dura_spec_grid_item
 *          ├─ dt.wptream_dura_spec_grid_label
 *          ├─ dd.wptream_dura_spec_grid_value
 *          └─ span.wptream_dura_spec_grid_note
 * All rules live in wptream_dura_components.css section D6; nothing to add.
 * ------------------------------------------------------------------- */

/* ---------------------------------------------------------------------
 * B3. Guide Form (.wptream_dura_guide)
 * Design: BaseLandingPage.jsx BaseGuideForm. Raised rounded card, grid
 * 2fr / 3fr, gap 96, align centre; a tilted PDF cover mock on the left and
 * eyebrow + h2 + copy + form on the right.
 *   .wptream_dura_guide [.wptream_dura_dark] [._no_cover]
 *     ._card                       bg_raised, 1px border, radius 28, pad 96 64
 *       ._cover_col (aria-hidden)  flex
 *         ._cover                  340 x 8.5/11, white, rotate(-4deg), shadow
 *           ._cover_bar            12px accent strip
 *           ._cover_inner          pad 24 22, column, gap 14
 *             img._cover_logo      90 wide
 *             ._cover_title        display 28 / 800 / lh 1.2
 *             ._cover_meta         14 muted
 *             ._cover_photo        photo strip (img cover) or neutral block
 *             ._cover_footer       14 muted
 *       ._copy                     column, gap 32
 *         ._head                   column, gap 16: eyebrow, ._title, ._body
 *         form._form               column, gap 16: inputs, checkbox, ._error, button
 *         ._success[hidden]        ._success_title, ._success_text
 * ------------------------------------------------------------------- */
.wptream_dura_guide { color: var(--wptream_dura_fg); }
.wptream_dura_guide_card {
  background: var(--wptream_dura_bg_raised);
  border: 1px solid var(--wptream_dura_border);
  border-radius: 28px;
  padding: var(--wptream_dura_space_9) var(--wptream_dura_space_8);
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  gap: var(--wptream_dura_space_9);
  align-items: center;
}
.wptream_dura_guide_no_cover .wptream_dura_guide_card { grid-template-columns: minmax(0, 1fr); }
.wptream_dura_guide_cover_col { display: flex; justify-content: flex-start; }
.wptream_dura_guide_cover {
  width: 340px;
  max-width: 100%;
  aspect-ratio: 8.5 / 11;
  background: #fff;
  border: 1px solid var(--wptream_dura_border);
  border-radius: 8px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transform: rotate(-4deg);
  margin-left: calc(var(--wptream_dura_space_8) * -1 - 32px);
  flex-shrink: 0;
}
.wptream_dura_guide_cover_bar { height: 12px; background: var(--wptream_dura_accent); flex: 0 0 auto; }
.wptream_dura_guide_cover_inner {
  padding: 24px 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
  min-height: 0;
}
.wptream_dura_guide_cover_logo { width: 90px; height: auto; display: block; }
.wptream_dura_guide_cover_title {
  font-family: var(--wptream_dura_font_display);
  font-size: 28px;
  font-weight: var(--wptream_dura_weight_black);
  line-height: 1.2;
  color: var(--wptream_dura_text_on_light);
  text-wrap: balance;
}
.wptream_dura_guide_cover_meta,
.wptream_dura_guide_cover_footer { font-size: 14px; color: var(--wptream_dura_text_on_light_muted); }
.wptream_dura_guide_cover_photo {
  margin-top: auto;
  flex: 1 1 110px;
  min-height: 80px;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  background: var(--wptream_dura_ink_800);
}
.wptream_dura_guide_cover_img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.wptream_dura_guide_copy { display: flex; flex-direction: column; gap: var(--wptream_dura_space_6); min-width: 0; }
.wptream_dura_guide_head { display: flex; flex-direction: column; gap: var(--wptream_dura_space_4); }
.wptream_dura_guide_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_headline);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_tight);
  text-wrap: balance;
  color: var(--wptream_dura_fg);
}
/* Type and colour come from .wptream_dura_body_text in the markup. */
.wptream_dura_guide_body { margin: 0; text-wrap: pretty; }
.wptream_dura_guide_form { display: flex; flex-direction: column; gap: var(--wptream_dura_space_4); margin: 0; }
/* The JS hides the form with the hidden attribute after a successful send;
 * the display:flex above would otherwise outrank the browser's [hidden]. */
.wptream_dura_guide_form[hidden],
.wptream_dura_guide_success[hidden] { display: none; }
/* Design inputs: 48px tall, 24px side padding, body size, on the page surface. */
.wptream_dura_guide_form .wptream_dura_input {
  height: 48px;
  padding: 0 var(--wptream_dura_space_5);
  background: var(--wptream_dura_bg);
  border-radius: var(--wptream_dura_radius_md);
}
.wptream_dura_guide_form .wptream_dura_input_control { font-size: var(--wptream_dura_size_body); }
.wptream_dura_guide_consent_text {
  font-size: var(--wptream_dura_size_body_sm);
  line-height: var(--wptream_dura_lh_body);
  color: var(--wptream_dura_fg_2);
}
.wptream_dura_guide_error { margin: 0; font-size: var(--wptream_dura_size_body_sm); color: #C21F3A; }
.wptream_dura_guide_error[hidden] { display: none; }
.wptream_dura_guide_success { display: flex; flex-direction: column; gap: var(--wptream_dura_space_3); }
.wptream_dura_guide_success[hidden] { display: none; }
.wptream_dura_guide_success_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_title);
  font-weight: var(--wptream_dura_weight_bold);
  color: var(--wptream_dura_fg);
}
.wptream_dura_guide_success_text {
  margin: 0;
  font-size: var(--wptream_dura_size_body);
  line-height: var(--wptream_dura_lh_body);
  color: var(--wptream_dura_fg_2);
}
/* Theme addition (kit is desktop only): stack, then drop the cover on phones. */
@media (max-width: 900px) {
  .wptream_dura_guide_card {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--wptream_dura_space_7);
    padding: var(--wptream_dura_space_7) var(--wptream_dura_space_5);
  }
  .wptream_dura_guide_cover { margin-left: 0; width: 260px; }
}
@media (max-width: 600px) {
  .wptream_dura_guide_cover_col { display: none; }
}

/* ---------------------------------------------------------------------
 * B4. Steps (widget wpstream_steps, design BaseLandingPage "How it runs")
 *   div.wptream_dura_steps [.wptream_dura_dark]
 *     ├─ header.wptream_dura_section_header        (component D5)
 *     └─ div.wptream_dura_steps_grid._cols_2|3|4   margin-top 64, gap 32
 *          └─ div.wptream_dura_steps_item           top hairline, pad-top 24
 *               ├─ span.wptream_dura_steps_label    "01 · Capture", legal/uppercase/accent
 *               ├─ h3.wptream_dura_steps_title      + .wptream_dura_title (type)
 *               └─ p.wptream_dura_steps_body        body 17 / fg_2
 * ------------------------------------------------------------------- */
.wptream_dura_steps { color: var(--wptream_dura_fg); }
.wptream_dura_steps_grid {
  margin-top: var(--wptream_dura_space_8);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--wptream_dura_space_6);
}
.wptream_dura_steps_cols_2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wptream_dura_steps_cols_4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wptream_dura_steps_item {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_3);
  padding-top: var(--wptream_dura_space_5);
  border-top: 1px solid var(--wptream_dura_border);
}
.wptream_dura_steps_label {
  font-size: var(--wptream_dura_size_legal);
  text-transform: uppercase;
  letter-spacing: var(--wptream_dura_track_eyebrow);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_accent);
}
/* Type and colour come from .wptream_dura_body_text in the markup. */
.wptream_dura_steps_body { margin: 0; }
/* Theme addition (kit is desktop only): one column on small screens. */
@media (max-width: 900px) {
  .wptream_dura_steps_grid,
  .wptream_dura_steps_cols_2,
  .wptream_dura_steps_cols_4 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------------
 * B5. Scroll Video (.wptream_dura_scrollvideo)
 * Design: BaseLandingPage.jsx BaseVideo / BaseVideoImac / BaseVideoPixel.
 * All motion values (clip-path, bezel, scale, top, opacities) are set by
 * assets/js/wptream_dura_blocks.js per scroll frame; this file is the static
 * part. The stage is black, so the text uses the on-dark colours.
 *   section.wptream_dura_scrollvideo ._device_frame|_macbook|_pixel|_generic
 *     └─ ._stage                     sticky top 0, viewport high, clipped
 *          ├─ ._media                (frame) inset 0, video cover, clip-path
 *          ├─ ._bezel                (frame) coloured ring + 3 speaker slits
 *          ├─ ._devicebox            (devices) centred fixed-size box, scaled
 *          │    └─ ._rotate          (pixel) 404x862 device turned 90deg
 *          ├─ ._overlay              inset 0, centred column: ._eyebrow, h2._title
 *          ├─ p._body                absolute, centred, max 680, fades in
 *          └─ ._toggle > button      44px round, bottom right
 * ------------------------------------------------------------------- */
.wptream_dura_scrollvideo {
  position: relative;
  background: var(--wptream_dura_ink_000);
  color: var(--wptream_dura_text_on_dark);
  /* Height is set by the script (track x viewport); this keeps the editor sane before it runs. */
  min-height: 100vh;
}
.wptream_dura_scrollvideo_stage {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}
/* Frame variant */
.wptream_dura_scrollvideo_media { position: absolute; inset: 0; }
.wptream_dura_scrollvideo_media .wptream_dura_scrollvideo_video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: var(--wptream_dura_ink_000);
}
.wptream_dura_scrollvideo_placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--wptream_dura_ink_500);
}
.wptream_dura_scrollvideo_bezel {
  position: absolute;
  inset: 0;
  border-radius: 0;
  pointer-events: none;
  opacity: 0;
}
.wptream_dura_scrollvideo_speaker {
  position: absolute;
  height: 3px;
  border-radius: 2px;
  background: #2A2A31;
  opacity: 0;
}
.wptream_dura_scrollvideo_speaker_top      { top: 0;    left: 26%; width: 46px; }
.wptream_dura_scrollvideo_speaker_bottom_1 { bottom: 0; left: 34%; width: 70px; }
.wptream_dura_scrollvideo_speaker_bottom_2 { bottom: 0; left: 52%; width: 46px; }
/* Device variants: a fixed-size box centred on the stage, scaled by the script. */
.wptream_dura_scrollvideo_devicebox {
  position: absolute;
  left: 50%;
  top: 50%;
  transform-origin: center center;
}
.wptream_dura_scrollvideo_devicebox .device { margin: 0; }
.wptream_dura_scrollvideo_devicebox .device-screen { object-fit: cover; }
.wptream_dura_scrollvideo_devicebox video.device-screen { display: block; }
/* Widescreen landscape tablet: 16:10 display with an even 27px bezel. */
.wptream_dura_scrollvideo_landscape .device-ipad-pro,
.wptream_dura_scrollvideo_landscape .device-ipad-pro .device-frame { width: 864px; height: 560px; }
.wptream_dura_scrollvideo_landscape .device-ipad-pro .device-screen { width: 810px; height: 506px; }
.wptream_dura_scrollvideo_landscape .device-ipad-pro .device-sensors,
.wptream_dura_scrollvideo_landscape .device-ipad-pro .device-btns {
  position: absolute; left: 0; top: 0; width: 560px; height: 864px;
  transform-origin: 0 0; transform: translateX(864px) rotate(90deg);
}
/* Landscape phone hardware keeps its native proportions; footage stays upright. */
.wps-home-phone .wps-home-phone-frame { display: block; width: 100%; height: 100%; }
.wps-home-phone > video {
  position: absolute; z-index: 1; top: 9.15%; left: 6.1%;
  width: 87.95%; height: 81.05%; max-width: none;
  border-radius: 5.2% / 11.5%; background: #000; object-fit: cover;
}
.wps-home-phone-camera {
  position: absolute; z-index: 2; top: 40.15%; left: 89.95%;
  width: 3.25%; height: 17.5%; border: 1px solid #202124;
  border-radius: 999px; background: #030305;
  box-shadow: inset 0 0 8px rgba(0,0,0,.95), 0 0 3px rgba(0,0,0,.8);
  pointer-events: none;
}
.wps-home-phone-camera::before {
  content: ''; position: absolute; top: 74%; left: 50%; width: 32%;
  aspect-ratio: 1; border-radius: 50%; transform: translateX(-50%);
  background: radial-gradient(circle at 35% 35%, #3279ff 0 15%, #071333 38%, #020207 72%);
}
.wps-landscape-phone .wptream_dura_scrollvideo_devicebox > .device {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%) rotate(90deg);
}
.wps-landscape-phone .wps-landscape-phone-screen { overflow: hidden; }
.wps-landscape-phone .wps-landscape-phone-screen > video {
  position: absolute; left: 50%; top: 50%;
  width: var(--phone-video-width); height: var(--phone-video-height);
  max-width: none; max-height: none;
  transform: translate(-50%, -50%) rotate(-90deg);
  object-fit: cover;
}
/* Pixel: 404x862 device rotated to landscape; the video counter-rotates. */
.wptream_dura_scrollvideo_device_pixel .wptream_dura_scrollvideo_devicebox { width: 862px; height: 404px; margin-left: -431px; margin-top: -202px; transform-origin: 431px 202px; }
.wptream_dura_scrollvideo_rotate {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 404px;
  height: 862px;
  transform: translate(-50%, -50%) rotate(90deg);
}
.wptream_dura_scrollvideo_pixel_screen { position: relative; overflow: hidden; }
.wptream_dura_scrollvideo_pixel_screen .wptream_dura_scrollvideo_video {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 816px;
  height: 376px;
  max-width: none;
  max-height: none;
  transform: translate(-50%, -50%) rotate(-90deg);
  object-fit: cover;
}
/* Copy */
.wptream_dura_scrollvideo_overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--wptream_dura_space_4);
  pointer-events: none;
  text-align: center;
  padding: 0 var(--wptream_dura_gutter);
  z-index: 2;
}
.wptream_dura_scrollvideo_eyebrow {
  font-size: var(--wptream_dura_size_body_lg);
  font-weight: var(--wptream_dura_weight_medium);
  color: var(--wptream_dura_text_on_dark);
}
.wptream_dura_scrollvideo_title {
  margin: 0;
  max-width: 20ch;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_2);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_display);
  text-wrap: pretty;
  color: var(--wptream_dura_text_on_dark);
}
/* Video overlays need white text, including spans that use the usual purple accent. */
body.wptream_dura_site .wptream_dura_scrollvideo .wptream_dura_scrollvideo_title,
body.wptream_dura_site .wptream_dura_scrollvideo .wptream_dura_scrollvideo_title span {
  color: #fff;
}
/* Override the shared 12px purple landing-page eyebrow on video backgrounds. */
.wptream_dura_scrollvideo .wptream_dura_scrollvideo_eyebrow {
  color: #fff !important;
  font-size: clamp(16px, 1.6vw, 20px) !important;
}
/* Two-class selector: the scoped base `.wptream_dura_site p { margin: 0 }`
 * would otherwise cancel the centring margin. */
.wptream_dura_scrollvideo .wptream_dura_scrollvideo_body {
  position: absolute;
  left: 0;
  right: 0;
  top: 78%;
  z-index: 2;
  margin: 0 auto;
  max-width: 680px;
  padding: 0 var(--wptream_dura_gutter);
  /* Type and white colour come from .wptream_dura_body_text(_light) in the markup. */
  text-align: center;
  text-wrap: pretty;
  opacity: 0;
  pointer-events: none;
}
.wptream_dura_site .wptream_dura_scrollvideo .wptream_dura_scrollvideo_body,
.wptream_dura_site .wptream_dura_scrollvideo .wptream_dura_scrollvideo_body p {
  font-size: 24px;
  color: #fff;
}
/* Play / pause (design BaseVideoToggle) */
.wptream_dura_scrollvideo_toggle {
  position: absolute;
  right: var(--wptream_dura_space_7);
  bottom: var(--wptream_dura_space_7);
  z-index: 3;
}
.wptream_dura_scrollvideo_toggle_btn {
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: var(--wptream_dura_radius_round);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: var(--wptream_dura_text_on_dark);
  transition: var(--wptream_dura_tx), transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_scrollvideo_toggle_btn:hover { background: rgba(255, 255, 255, 0.24); transform: var(--wptream_dura_lift_sm); }
.wptream_dura_scrollvideo_toggle_btn:focus-visible { box-shadow: var(--wptream_dura_focus_ring); outline: none; }
.wptream_dura_scrollvideo_toggle_btn .wptream_dura_scrollvideo_icon_play { display: none; }
.wptream_dura_scrollvideo_toggle_btn.wptream_dura_scrollvideo_paused .wptream_dura_scrollvideo_icon_play { display: block; }
.wptream_dura_scrollvideo_toggle_btn.wptream_dura_scrollvideo_paused .wptream_dura_scrollvideo_icon_pause { display: none; }

/* ---------------------------------------------------------------------
 * B6. Showcase  (.wptream_dura_showcase)
 * Design BaseLandingPage.jsx BaseShowcase (image left, 62fr 38fr) and
 * BaseShowcaseFlip (image right, 38fr 62fr). The device bleeds off the
 * outer edge of the band, so the root clips overflow. Widget:
 * plugins/wpstream-elementor/widgets/showcase_widget.php
 *
 *   .wptream_dura_showcase ._img_left|_img_right [.wptream_dura_dark] [._has_img]
 *     ├─ ._media                        column, self-stretch, centred
 *     │    ├─ ._device_wrap             bleed + drop shadow
 *     │    │    ├─ ._mac (design CSS MacBook)
 *     │    │    │    ├─ ._lid > ._notch + ._screen._screen_mac
 *     │    │    │    └─ ._base > ._hinge
 *     │    │    └─ .wptream_dura_device_fit > .device (devices.css) > .device-screen._screen
 *     │    │         screen children: img._img | .wptream_dura_media_placeholder,
 *     │    │           span._live > ._live_dot, ._scrim, ._bar > ._play + ._track > ._progress
 *     │    └─ span._caption             legal / muted
 *     └─ ._copy                         column, gap 32, max 400
 *          ├─ span._pill                eyebrow pill
 *          ├─ ._title (h3)              display-3 / black / track display / lh tight
 *          ├─ p._body                   body-lg / fg-2
 *          └─ ._points > span._point    title size / bold / accent
 * ------------------------------------------------------------------- */
.wptream_dura_showcase {
  display: grid;
  grid-template-columns: 62fr 38fr;
  align-items: center;
  min-height: 520px;
  width: 100%;
  overflow: hidden;
  color: var(--wptream_dura_fg);
}
.wptream_dura_showcase_img_right { grid-template-columns: 38fr 62fr; }
.wptream_dura_showcase > * { min-width: 0; }

/* Media column */
.wptream_dura_showcase_media {
  position: relative;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  order: 1;
}
.wptream_dura_showcase_img_right .wptream_dura_showcase_media { order: 2; }
.wptream_dura_showcase_device_wrap {
  width: 94%;
  margin-left: -11%;
  filter: drop-shadow(0 34px 55px rgba(0, 0, 0, 0.28));
}
.wptream_dura_showcase_img_right .wptream_dura_showcase_device_wrap {
  width: 106%;
  margin-left: 0;
  margin-right: -6%;
  display: flex;
  justify-content: flex-end;
}
.wptream_dura_showcase_img_right .wptream_dura_showcase_device_wrap > * { width: 100%; }
.wptream_dura_showcase_caption {
  margin-top: var(--wptream_dura_space_5);
  padding-left: calc(14% + var(--wptream_dura_gutter));
  font-size: var(--wptream_dura_size_legal);
  color: var(--wptream_dura_fg_muted);
}
.wptream_dura_showcase_img_right .wptream_dura_showcase_caption {
  padding-left: 0;
  padding-right: calc(14% + var(--wptream_dura_gutter));
  text-align: right;
}

/* Design CSS MacBook: lid (dark panel, inset edge, chin), notch, 16:10 screen, base with hinge. */
.wptream_dura_showcase_mac { width: 100%; }
.wptream_dura_showcase_lid {
  position: relative;
  margin: 0 auto;
  width: 84%;
  background: #0d0d0d;
  border-radius: 20px;
  box-shadow: inset 0 0 0 2px #777b7e;
  padding: 1.45% 1.45% 3.7%;
}
.wptream_dura_showcase_notch {
  position: absolute;
  top: 1.45%;
  left: 50%;
  margin-left: -5.2%;
  width: 10.4%;
  aspect-ratio: 64 / 12;
  background: #0d0d0d;
  border-radius: 0 0 4px 4px;
  z-index: 2;
}
.wptream_dura_showcase_screen_mac {
  aspect-ratio: 16 / 10;
  border: 2px solid #131313;
  border-radius: 10px 10px 0 0;
}
.wptream_dura_showcase_base {
  position: relative;
  width: 100%;
  aspect-ratio: 740 / 24;
  margin-top: -0.4%;
  background: radial-gradient(circle at center, #83878a 85%, #777b7e 100%);
  border: solid #4b4e50;
  border-width: 1px 2px 0 2px;
  border-radius: 2px 2px 12px 12px;
  box-shadow: inset 0 -2px 8px 0 #313335;
  z-index: 9;
}
.wptream_dura_showcase_hinge {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -8.1%;
  width: 16.2%;
  height: 42%;
  background: #b9bcbe;
  border-radius: 0 0 10px 10px;
  box-shadow: inset 0 0 4px 2px #6d7174;
}

/* Screen (shared by both device kinds): image cover, LIVE badge, scrim, player bar. */
.wptream_dura_showcase_screen {
  position: relative;
  overflow: hidden;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wptream_dura_showcase_screen .wptream_dura_media_placeholder { color: var(--wptream_dura_text_on_dark_muted); }
.wptream_dura_showcase_img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.wptream_dura_showcase_live {
  position: absolute;
  top: 5%;
  left: 3%;
  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.5em 0.9em;
  border-radius: 999px;
  background: #E5202E;
  color: #fff;
  font-size: clamp(11px, 1.2vw, 16px);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: 0.06em;
  line-height: 1;
}
.wptream_dura_showcase_live_dot { width: 0.5em; height: 0.5em; border-radius: 50%; background: #fff; }
.wptream_dura_showcase_scrim {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 26%;
  background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
  pointer-events: none;
}
.wptream_dura_showcase_bar {
  position: absolute;
  left: 3%; right: 3%; bottom: 9%;
  display: flex;
  align-items: center;
  gap: 0.8em;
}
.wptream_dura_showcase_play {
  width: 0; height: 0;
  border-style: solid;
  border-width: 0.45em 0 0.45em 0.7em;
  border-color: transparent transparent transparent #fff;
}
.wptream_dura_showcase_track { flex: 1; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, 0.4); }
.wptream_dura_showcase_progress { width: 62%; height: 100%; border-radius: 2px; background: #fff; }

/* Copy column */
.wptream_dura_showcase_copy {
  order: 2;
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_6);
  padding: var(--wptream_dura_space_8) var(--wptream_dura_gutter) var(--wptream_dura_space_8) var(--wptream_dura_space_8);
  max-width: 400px;
}
.wptream_dura_showcase_img_right .wptream_dura_showcase_copy {
  order: 1;
  padding: var(--wptream_dura_space_8) var(--wptream_dura_space_8) var(--wptream_dura_space_8) var(--wptream_dura_gutter);
  justify-self: end;
}
.wptream_dura_showcase_pill {
  align-self: flex-start;
  font-size: var(--wptream_dura_size_legal);
  font-weight: var(--wptream_dura_weight_semibold);
  letter-spacing: var(--wptream_dura_track_eyebrow);
  text-transform: uppercase;
  padding: var(--wptream_dura_space_2) var(--wptream_dura_space_4);
  border-radius: var(--wptream_dura_radius_pill);
  background: var(--wptream_dura_bg_raised);
  border: 1px solid var(--wptream_dura_border);
  color: var(--wptream_dura_fg);
}
.wptream_dura_showcase_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_3);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  text-wrap: balance;
  color: var(--wptream_dura_fg);
}
/* Type and colour come from .wptream_dura_body_text in the markup. */
.wptream_dura_showcase_body {
  margin: 0;
  text-wrap: pretty;
}
.wptream_dura_showcase_points { display: flex; flex-direction: column; gap: var(--wptream_dura_space_4); }
.wptream_dura_showcase_point {
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_title);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  color: var(--wptream_dura_accent);
}

/* Theme addition (kit is desktop only): stack, copy first, device below without bleed. */
@media (max-width: 900px) {
  .wptream_dura_showcase,
  .wptream_dura_showcase_img_right { grid-template-columns: 1fr; min-height: 0; }
  .wptream_dura_showcase_copy,
  .wptream_dura_showcase_img_right .wptream_dura_showcase_copy {
    order: 1;
    max-width: none;
    justify-self: stretch;
    padding: 0 var(--wptream_dura_gutter) var(--wptream_dura_space_7);
  }
  .wptream_dura_showcase_media,
  .wptream_dura_showcase_img_right .wptream_dura_showcase_media { order: 2; }
  .wptream_dura_showcase_device_wrap,
  .wptream_dura_showcase_img_right .wptream_dura_showcase_device_wrap {
    width: 100%;
    margin: 0;
    padding: 0 var(--wptream_dura_gutter);
  }
  .wptream_dura_showcase_caption,
  .wptream_dura_showcase_img_right .wptream_dura_showcase_caption {
    padding: 0 var(--wptream_dura_gutter);
    text-align: left;
  }
}

/* ---------------------------------------------------------------------
 * B7. Split Cards  (.wptream_dura_split_cards)
 * Design BaseLandingPage.jsx BaseSplitCard in a 2-column grid: tall
 * raised cards, copy at the top, a dark-bezel device mock anchored to the
 * bottom edge and offset left / right alternately. Widget:
 * plugins/wpstream-elementor/widgets/split_cards_widget.php
 *
 *   .wptream_dura_split_cards ._cols_2|_cols_3 [.wptream_dura_dark]
 *     └─ ._card                         column, clipped, 620 tall, raised, radius 28
 *          ├─ ._text > p                min 156 tall; span._title bold fg, span._body fg-2
 *          └─ ._device ._side_left|_side_right   86% wide, bezel #1d1d1f
 *               ├─ span._cam            4px camera dot
 *               └─ ._screen             560 tall, black, clipped
 *                    └─ img._img | .wptream_dura_media_placeholder
 * ------------------------------------------------------------------- */
.wptream_dura_split_cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--wptream_dura_space_6);
  align-items: stretch;
  color: var(--wptream_dura_fg);
}
.wptream_dura_split_cards_cols_3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wptream_dura_split_cards_card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 620px;
  background: var(--wptream_dura_bg_raised);
  border: 1px solid var(--wptream_dura_border);
  border-radius: 28px;
  box-shadow: var(--wptream_dura_shadow_none);
  transition: box-shadow var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_split_cards_card:hover { box-shadow: var(--wptream_dura_shadow_md); }
.wptream_dura_split_cards_text {
  min-height: 156px;
  flex-shrink: 0;
  box-sizing: border-box;
  padding: var(--wptream_dura_space_6) var(--wptream_dura_space_6) var(--wptream_dura_space_5);
}
.wptream_dura_split_cards_text p {
  margin: 0;
  font-size: var(--wptream_dura_size_body);
  line-height: var(--wptream_dura_lh_body);
  text-wrap: pretty;
}
.wptream_dura_split_cards_title { font-weight: var(--wptream_dura_weight_bold); color: var(--wptream_dura_fg); }

/* Device mock: nearly flush to the card edges, running past the bottom. */
.wptream_dura_split_cards_device {
  position: relative;
  width: 86%;
  flex-shrink: 0;
  margin-top: auto;
  box-sizing: border-box;
  background: #1d1d1f;
  padding: 1.1% 1.1% 0;
  border-radius: 22px 22px 0 0;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.wptream_dura_split_cards_side_left  { margin-left: 0;    margin-right: auto; }
.wptream_dura_split_cards_side_right { margin-left: auto; margin-right: 0; }
.wptream_dura_split_cards_cam {
  position: absolute;
  top: 0.45%;
  left: 50%;
  margin-left: -2px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #3a3a3d;
}
.wptream_dura_split_cards_screen {
  position: relative;
  height: 560px;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
  background: #000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: var(--wptream_dura_space_8);
}
.wptream_dura_split_cards_screen .wptream_dura_media_placeholder { color: var(--wptream_dura_text_on_dark_muted); }
.wptream_dura_split_cards_img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: none;
  transition: transform var(--wptream_dura_dur_slow) var(--wptream_dura_ease_out);
}
.wptream_dura_split_cards_card:hover .wptream_dura_split_cards_img { transform: scale(1.03); }
/* Theme addition (kit is desktop only): one column on small screens. */
@media (max-width: 900px) {
  .wptream_dura_split_cards,
  .wptream_dura_split_cards_cols_3 { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------
 * B8. Feature Rows  (.wptream_dura_rows)
 * Design BaseLandingPage.jsx BaseRow stack: the FeatureRow + MediaPanel
 * components (wptream_dura_components.css D5 / D2) with the landing
 * page's own rhythm (96px between rows, 16px media radius) and hover
 * (media lifts with the md shadow, eyebrow nudges right). Widget:
 * plugins/wpstream-elementor/widgets/feature_rows_widget.php
 *
 *   .wptream_dura_rows [.wptream_dura_dark]          column, gap 96 (control)
 *     └─ .wptream_dura_feature_row [._reverse]       component
 *          ├─ .wptream_dura_feature_row_copy         eyebrow / title / body / action
 *          └─ figure.wptream_dura_media > .wptream_dura_media_frame._ratio_4_3
 * ------------------------------------------------------------------- */
.wptream_dura_rows {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_9);
  color: var(--wptream_dura_fg);
}
/* The stack gap replaces the component's 128px sibling margin. */
.wptream_dura_rows .wptream_dura_feature_row + .wptream_dura_feature_row { margin-top: 0; }
.wptream_dura_rows .wptream_dura_media_frame {
  border-radius: 16px;
  box-shadow: var(--wptream_dura_shadow_none);
  transform: none;
  transition: transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out), box-shadow var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_rows .wptream_dura_eyebrow {
  display: inline-block;
  transform: none;
  transition: var(--wptream_dura_tx_transform);
}
/* Row hover: media lifts, eyebrow nudges. */
.wptream_dura_rows .wptream_dura_feature_row:hover .wptream_dura_media_frame {
  box-shadow: var(--wptream_dura_shadow_md);
  transform: var(--wptream_dura_lift);
}
.wptream_dura_rows .wptream_dura_feature_row:hover .wptream_dura_eyebrow { transform: var(--wptream_dura_nudge); }

/* Theme addition (kit is desktop only): stack, copy first, 48px between rows. */
@media (max-width: 900px) {
  .wptream_dura_rows { gap: var(--wptream_dura_space_7); }
  .wptream_dura_rows .wptream_dura_feature_row { grid-template-columns: 1fr; gap: var(--wptream_dura_space_5); }
  .wptream_dura_rows .wptream_dura_feature_row_copy,
  .wptream_dura_rows .wptream_dura_feature_row_reverse .wptream_dura_feature_row_copy { order: 1; max-width: none; }
  .wptream_dura_rows .wptream_dura_feature_row > .wptream_dura_media,
  .wptream_dura_rows .wptream_dura_feature_row_reverse > .wptream_dura_media { order: 2; }
}

/* ---------------------------------------------------------------------
 * B9. Quote  (.wptream_dura_quote)
 * Design BaseLandingPage.jsx c.quote figure: headline-size blockquote in
 * the display face, muted linked source under it. Widget:
 * plugins/wpstream-elementor/widgets/quote_widget.php
 *
 *   figure.wptream_dura_quote [.wptream_dura_dark]   column, gap 24, max 900 (control)
 *     ├─ blockquote._text                             headline / medium / track headline / lh snug / fg
 *     └─ figcaption._source > a._link | span          body-sm / fg-muted, no underline
 * ------------------------------------------------------------------- */
.wptream_dura_quote {
  margin: 0;
  max-width: 900px;
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_5);
  color: var(--wptream_dura_fg);
}
.wptream_dura_quote_text {
  margin: 0;
  padding: 0;
  border: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_headline);
  font-weight: var(--wptream_dura_weight_medium);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  text-wrap: pretty;
  color: var(--wptream_dura_fg);
}
.wptream_dura_quote_source {
  font-size: var(--wptream_dura_size_body_sm);
  color: var(--wptream_dura_fg_muted);
}
.wptream_dura_quote_source a,
.wptream_dura_quote_link {
  color: var(--wptream_dura_fg_muted);
  text-decoration: none;
  transition: var(--wptream_dura_tx);
}
.wptream_dura_quote_source a:hover,
.wptream_dura_quote_link:hover { color: var(--wptream_dura_fg); text-decoration: none; }

/* ---------------------------------------------------------------------
 * B10. Card Slider (widget wpstream_card_slider, design BaseWhySlider
 *      "Why Wpstream is the best place to broadcast sport.")
 *   div.wptream_dura_slider [.wptream_dura_dark]  style="--wptream_dura_slider_card_w: 400px"
 *     ├─ div.wptream_dura_slider_head                 1180 centred, gutter padding
 *     │    └─ h2.wptream_dura_slider_heading          clamp(32, 4vw, 56) / black / 20ch
 *     ├─ div.wptream_dura_slider_rail                 full-bleed scroll-snap rail, gap 20
 *     │    └─ div.wptream_dura_slider_card             min(card_w, 82vw) + .wptream_dura_card_box
 *     │         ├─ span.wptream_dura_slider_icon      accent, 34px
 *     │         ├─ h3.wptream_dura_slider_title       + .wptream_dura_title (type)
 *     │         └─ p.wptream_dura_slider_body         body 17 / fg_2
 *     └─ div.wptream_dura_slider_paddles              1180 centred, right aligned
 *          └─ button.wptream_dura_slider_paddle ×2    44px round, ‹ ›
 * The rail padding lines the first card up with the 1180 container:
 * max(gutter, (100vw - container) / 2 + gutter). Widget must sit in a
 * full-width container (see the widget file header).
 * ------------------------------------------------------------------- */
.wptream_dura_slider { color: var(--wptream_dura_fg); width: 100%; }
.wptream_dura_slider_head,
.wptream_dura_slider_paddles {
  max-width: var(--wptream_dura_container);
  margin: 0 auto;
  padding: 0 var(--wptream_dura_gutter);
}
.wptream_dura_slider_heading {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: clamp(32px, 4vw, 56px);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_display);
  color: var(--wptream_dura_fg);
  text-wrap: balance;
  max-width: 20ch;
}
.wptream_dura_slider_rail {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: var(--wptream_dura_space_7) max(var(--wptream_dura_gutter), calc((100vw - var(--wptream_dura_container)) / 2 + var(--wptream_dura_gutter))) var(--wptream_dura_space_4);
  scroll-padding-left: max(var(--wptream_dura_gutter), calc((100vw - var(--wptream_dura_container)) / 2 + var(--wptream_dura_gutter)));
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.wptream_dura_slider_rail::-webkit-scrollbar { display: none; }
.wptream_dura_slider_card {
  flex: 0 0 auto;
  width: min(var(--wptream_dura_slider_card_w, 400px), 82vw);
  min-height: 300px;
  scroll-snap-align: start;
  background: var(--wptream_dura_bg_raised);
  /* padding + corner come from .wptream_dura_card_box in the markup */
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_5);
  /* resting shadow comes from .wptream_dura_card_shadow in the markup */
  transition:
    transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out),
    box-shadow var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_slider_card:hover {
  box-shadow: var(--wptream_dura_shadow_md);
  transform: var(--wptream_dura_lift);
}
.wptream_dura_slider_icon {
  display: inline-flex;
  color: var(--wptream_dura_accent);
  transform-origin: left center;
  transition: transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_slider_icon .wptream_dura_icon { width: 34px; height: 34px; }
.wptream_dura_slider_icon svg:not(.wptream_dura_icon), .wptream_dura_slider_icon i { font-size: 34px; width: 34px; height: 34px; }
.wptream_dura_slider_card:hover .wptream_dura_slider_icon { transform: scale(1.12); }
/* Typography comes from .wptream_dura_title on the same element. */
.wptream_dura_slider_title { text-wrap: balance; }
/* Type and colour come from .wptream_dura_body_text in the markup. */
.wptream_dura_slider_body { margin: 0; text-wrap: pretty; }
.wptream_dura_slider_paddles {
  display: flex;
  justify-content: flex-end;
  gap: var(--wptream_dura_space_3);
}
.wptream_dura_slider_paddle {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  background: var(--wptream_dura_bg_raised);
  color: var(--wptream_dura_fg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  line-height: 1;
  padding: 0;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
  transition: var(--wptream_dura_tx), transform var(--wptream_dura_dur_fast) var(--wptream_dura_ease_out);
}
/* Cancel hello-elementor reset.css pink button:hover/:focus (#c36), which
   shows on a disabled paddle and on a clicked (still focused) paddle. */
.wptream_dura_slider .wptream_dura_slider_paddle:is(:hover, :focus) {
  background: var(--wptream_dura_bg_raised);
  color: var(--wptream_dura_fg);
}
.wptream_dura_slider .wptream_dura_slider_paddle:hover:not(:disabled) {
  background: var(--wptream_dura_accent_tint);
  color: var(--wptream_dura_accent);
  transform: scale(1.08);
}
.wptream_dura_slider_paddle:active:not(:disabled) { transform: scale(0.92); }
.wptream_dura_slider_paddle:disabled { opacity: 0.35; cursor: default; }

/* ---------------------------------------------------------------------
 * B11. Feature Cards (widget wpstream_feature_cards, design BaseFeatureCard
 *      "What you get on every paid plan")
 *   div.wptream_dura_feature_cards [.wptream_dura_dark]
 *     ├─ header.wptream_dura_section_header                 (component D5)
 *     └─ div.wptream_dura_feature_cards_grid._cols_2|3|4    margin-top 64, gap 16
 *          └─ div.wptream_dura_feature_cards_card            raised, radius 20, pad 32, hover lift
 *               ├─ div.wptream_dura_feature_cards_tile       56x56 accent tint, icon 26px
 *               ├─ div.wptream_dura_feature_cards_text       gap 12
 *               │    ├─ h3.wptream_dura_feature_cards_title  title 24 / bold / snug
 *               │    └─ p.wptream_dura_feature_cards_body    body 17 / fg_2
 *               └─ div.wptream_dura_feature_cards_action     margin-top auto
 *                    └─ a.wptream_dura_btn_link.wptream_dura_btn_arrow
 * ------------------------------------------------------------------- */
.wptream_dura_feature_cards { color: var(--wptream_dura_fg); }
.wptream_dura_feature_cards_grid {
  margin-top: var(--wptream_dura_space_8);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--wptream_dura_space_4);
  align-items: stretch;
}
.wptream_dura_feature_cards_cols_2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wptream_dura_feature_cards_cols_4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wptream_dura_feature_cards_card {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_5);
  height: 100%;
  min-width: 0;
  padding: var(--wptream_dura_space_6);
  border-radius: var(--wptream_dura_radius_lg);
  background: var(--wptream_dura_bg_raised);
  border: 1px solid var(--wptream_dura_border_soft);
  transition:
    transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out),
    box-shadow var(--wptream_dura_dur_med) var(--wptream_dura_ease_out),
    border-color var(--wptream_dura_dur_fast) var(--wptream_dura_ease);
}
.wptream_dura_feature_cards_card:hover {
  border-color: var(--wptream_dura_border);
  transform: var(--wptream_dura_lift);
  box-shadow: var(--wptream_dura_shadow_md);
}
.wptream_dura_feature_cards_tile {
  width: 56px;
  height: 56px;
  border-radius: var(--wptream_dura_radius_md);
  background: var(--wptream_dura_accent_tint);
  color: var(--wptream_dura_accent);
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--wptream_dura_tx);
}
.wptream_dura_feature_cards_tile .wptream_dura_icon { width: 26px; height: 26px; }
.wptream_dura_feature_cards_tile svg:not(.wptream_dura_icon), .wptream_dura_feature_cards_tile i { font-size: 26px; width: 26px; height: 26px; }
.wptream_dura_feature_cards_card:hover .wptream_dura_feature_cards_tile {
  background: var(--wptream_dura_accent);
  color: var(--wptream_dura_ink_1000);
}
.wptream_dura_feature_cards_text {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_3);
}
.wptream_dura_feature_cards_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_title);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  text-wrap: pretty;
  color: var(--wptream_dura_fg);
  transition: var(--wptream_dura_tx);
}
.wptream_dura_feature_cards_card:hover .wptream_dura_feature_cards_title { color: var(--wptream_dura_accent); }
/* Type and colour come from .wptream_dura_body_text in the markup. */
.wptream_dura_feature_cards_body { margin: 0; text-wrap: pretty; }
.wptream_dura_feature_cards_action { margin-top: auto; }
.wptream_dura_feature_cards_action .wptream_dura_btn {
  white-space: normal;
  align-items: center;
  text-align: left;
  max-width: 100%;
  line-height: var(--wptream_dura_lh_snug);
}
/* Theme addition (kit is desktop only): one column on small screens. */
@media (max-width: 900px) {
  .wptream_dura_feature_cards_grid,
  .wptream_dura_feature_cards_cols_2,
  .wptream_dura_feature_cards_cols_4 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------------
 * B12. Monetization (widget wpstream_monetization, design dark band
 *      "Three ways to charge for it")
 *   div.wptream_dura_monetization [.wptream_dura_dark]
 *     ├─ header.wptream_dura_section_header                (component D5)
 *     └─ div.wptream_dura_monetization_grid._cols_2|3|4    margin-top 64, gap 32
 *          └─ div.wptream_dura_monetization_item            top hairline, pad-top 24, gap 16
 *               ├─ h3.wptream_dura_monetization_title       + .wptream_dura_title (type)
 *               └─ p.wptream_dura_monetization_line ×n      body 17 / fg_2
 * ------------------------------------------------------------------- */
.wptream_dura_monetization { color: var(--wptream_dura_fg); }
.wptream_dura_monetization_grid {
  margin-top: var(--wptream_dura_space_8);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--wptream_dura_space_6);
}
.wptream_dura_monetization_cols_2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wptream_dura_monetization_cols_4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wptream_dura_monetization_item {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_4);
  padding-top: var(--wptream_dura_space_5);
  border-top: 1px solid var(--wptream_dura_border);
}
/* Type and colour come from .wptream_dura_body_text in the markup. */
.wptream_dura_monetization_line { margin: 0; }
/* Theme addition (kit is desktop only): one column on small screens. */
@media (max-width: 900px) {
  .wptream_dura_monetization_grid,
  .wptream_dura_monetization_cols_2,
  .wptream_dura_monetization_cols_4 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------------
 * B13. FAQ (.wptream_dura_faq)
 * Design: BaseLandingPage.jsx FAQ section = SectionHeader + Disclosure with
 * marginTop space-7. Both are components (wptream_dura_components.css
 * D4 / D8); only the gap under the header is added here.
 *   .wptream_dura_faq [.wptream_dura_dark]
 *     header.wptream_dura_section_header
 *     .wptream_dura_disclosure._faq_list[data-single]   items (component markup)
 * ------------------------------------------------------------------- */
.wptream_dura_faq { color: var(--wptream_dura_fg); }
.wptream_dura_faq .wptream_dura_section_header + .wptream_dura_faq_list { margin-top: var(--wptream_dura_space_7); }

/* ---------------------------------------------------------------------
 * B14. CTA (.wptream_dura_cta)
 * Design: BaseLandingPage.jsx closing <section>: dark surface (set on the
 * container), centred column capped at the text container (720), gap 24,
 * h2 display-4 bold, body-lg line, one button.
 *   .wptream_dura_cta [.wptream_dura_dark] ._align_center|_align_left
 *     ._inner      max 720, centred, column, gap 24
 *       ._title    display-4 / bold / track display / lh tight / fg
 *       ._subtitle body-lg / fg_2
 *       a.wptream_dura_btn
 * ------------------------------------------------------------------- */
.wptream_dura_cta { color: var(--wptream_dura_fg); }
.wptream_dura_cta_inner {
  max-width: var(--wptream_dura_container_text);
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_5);
  align-items: center;
}
.wptream_dura_cta_align_left .wptream_dura_cta_inner { margin: 0; text-align: left; align-items: flex-start; }
.wptream_dura_cta_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_4);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  color: var(--wptream_dura_fg);
}
.wptream_dura_cta_subtitle {
  margin: 0;
  font-size: var(--wptream_dura_size_body_lg);
  line-height: var(--wptream_dura_lh_body);
  color: var(--wptream_dura_fg_2);
}

/* ---------------------------------------------------------------------
 * B15. Blog List (.wptream_dura_blog)
 * Design: BlogPage.jsx. Widget: plugins/wpstream-elementor/widgets/blog_list_widget.php
 *   .wptream_dura_blog
 *     ├─ ._title (h1)             display-2, black, track display, lh tight
 *     ├─ ._featured_wrap > a._featured   grid 1.15fr/1fr, gap 48, centred
 *     │    ├─ ._featured_media    radius lg, clip; media 3:2, zoom on hover
 *     │    └─ ._featured_copy     column, gap 16: overline, h3 display-4, excerpt body-lg, meta row
 *     ├─ ._layout                 grid 1fr / 260px, gap 64, margin-top 64
 *     │    ├─ ._grid              2 columns, gap 64 / 32
 *     │    │    └─ a._card        column, lifts 2px on hover; media 16:10 (shadow md on hover),
 *     │    │                      overline, title subtitle (3 lines), excerpt body-sm (2 lines), stamp
 *     │    └─ aside._aside        sticky, gap 32: search (Input component) + categories list
 *     └─ ._pager_wrap > nav._pager   pill cells 40px: « 1 2 3 … »
 * ------------------------------------------------------------------- */
.wptream_dura_blog { color: var(--wptream_dura_fg); }
/* Native archives use the same 1180px content width and spacing as Blog List. */
.wptream_dura_archive_inner { max-width: 1228px; margin-inline: auto; padding: 96px 24px 80px; }
.wptream_dura_archive_description { margin-top: var(--wptream_dura_space_6); }
@media (max-width: 767px) {
  .wptream_dura_archive_inner { padding: 64px 20px; }
}
.wptream_dura_blog_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_2);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_blog_ratio_3_2   { aspect-ratio: 3 / 2; }
.wptream_dura_blog_ratio_16_10 { aspect-ratio: 16 / 10; }
/* Fill the fixed card frame even when Elementor sets generic images to height:auto. */
.wptream_dura_blog .wptream_dura_media_frame > .wptream_dura_media_img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* The whole card is the hover target (design: hover state on the anchor). */
.wptream_dura_blog .wptream_dura_media_img { transition: transform var(--wptream_dura_dur_slow) var(--wptream_dura_ease_out); }
.wptream_dura_blog_featured:hover .wptream_dura_media_img,
.wptream_dura_blog_card:hover .wptream_dura_media_img { transform: var(--wptream_dura_zoom); }

/* Featured card */
.wptream_dura_blog_featured_wrap { margin-top: var(--wptream_dura_space_8); }
.wptream_dura_blog_featured {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: var(--wptream_dura_space_7);
  align-items: center;
  text-decoration: none;
  color: inherit;
}
.wptream_dura_blog_featured:hover { text-decoration: none; }
.wptream_dura_blog_featured_media { border-radius: var(--wptream_dura_radius_lg); overflow: hidden; }
.wptream_dura_blog_featured_copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--wptream_dura_space_4);
}
.wptream_dura_blog_overline {
  font-size: var(--wptream_dura_size_legal);
  font-weight: var(--wptream_dura_weight_semibold);
  letter-spacing: var(--wptream_dura_track_eyebrow);
  text-transform: uppercase;
  color: var(--wptream_dura_accent);
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.wptream_dura_blog_featured_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_4);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  text-wrap: pretty;
  transition: var(--wptream_dura_tx);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_blog_featured:hover .wptream_dura_blog_featured_title { color: var(--wptream_dura_accent); }
.wptream_dura_blog_featured_excerpt {
  margin: 0;
  font-size: var(--wptream_dura_size_body_lg);
  line-height: var(--wptream_dura_lh_body);
  color: var(--wptream_dura_text_on_light_2);
  max-width: var(--wptream_dura_measure_body);
}
.wptream_dura_blog_featured_meta {
  margin-top: var(--wptream_dura_space_2);
  display: flex;
  align-items: center;
  gap: var(--wptream_dura_space_5);
  flex-wrap: wrap;
}
.wptream_dura_blog_more {
  font-size: var(--wptream_dura_size_body_sm);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_accent);
  transition: var(--wptream_dura_tx_transform);
  transform: none;
}
.wptream_dura_blog_featured:hover .wptream_dura_blog_more { transform: var(--wptream_dura_nudge); }
.wptream_dura_blog_stamp {
  font-size: var(--wptream_dura_size_caption);
  font-weight: var(--wptream_dura_weight_regular);
  letter-spacing: var(--wptream_dura_track_normal);
  white-space: nowrap;
  color: var(--wptream_dura_text_on_light_muted);
}
.wptream_dura_blog_stamp_dot { padding: 0 var(--wptream_dura_space_2); }

/* Grid + sidebar */
.wptream_dura_blog_layout {
  margin-top: var(--wptream_dura_space_8);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: var(--wptream_dura_space_8);
  align-items: start;
}
.wptream_dura_blog_no_aside .wptream_dura_blog_layout { grid-template-columns: minmax(0, 1fr); }
.wptream_dura_blog_grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--wptream_dura_space_8) var(--wptream_dura_space_6);
  align-items: stretch;
}
.wptream_dura_blog_card {
  display: flex;
  flex-direction: column;
  background: transparent;
  text-decoration: none;
  color: inherit;
  height: 100%;
  transform: none;
  transition: transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_blog_card:hover { background: transparent; transform: var(--wptream_dura_lift); text-decoration: none; }
.wptream_dura_blog_card_media {
  width: 100%;
  border-radius: var(--wptream_dura_radius_lg);
  overflow: hidden;
  box-shadow: var(--wptream_dura_shadow_none);
  transition: box-shadow var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_blog_card:hover .wptream_dura_blog_card_media { box-shadow: var(--wptream_dura_shadow_md); }
.wptream_dura_blog_card_overline { margin-top: var(--wptream_dura_space_4); display: flex; }
.wptream_dura_blog .wptream_dura_blog_card_title {
  /* Typography comes from .wptream_dura_title; keep 12px above the
   * title (beats the class's margin reset) and the hover colour fade. */
  margin: var(--wptream_dura_space_3) 0 0;
  text-wrap: pretty;
  transition: var(--wptream_dura_tx);
}
.wptream_dura_blog_card:hover .wptream_dura_blog_card_title { color: var(--wptream_dura_accent); }
.wptream_dura_blog .wptream_dura_blog_card_excerpt {
  margin: var(--wptream_dura_space_3) 0 0;
  font-size: var(--wptream_dura_size_body_sm);
  line-height: var(--wptream_dura_lh_body);
  color: var(--wptream_dura_text_on_light_2);
}
.wptream_dura_blog_clamp { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.wptream_dura_blog_clamp_3 { -webkit-line-clamp: 3; }
.wptream_dura_blog_clamp_2 { -webkit-line-clamp: 2; }
.wptream_dura_blog_card_foot { margin-top: auto; padding-top: var(--wptream_dura_space_4); }
.wptream_dura_blog_empty {
  grid-column: 1 / -1;
  margin: 0;
  font-size: var(--wptream_dura_size_body);
  color: var(--wptream_dura_text_on_light_2);
}
.wptream_dura_blog_aside {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_6);
  position: sticky;
  top: var(--wptream_dura_space_8);
}
.wptream_dura_blog_search { margin: 0; }
.wptream_dura_blog_search .wptream_dura_input_control { -webkit-appearance: none; appearance: none; }
.wptream_dura_blog_search .wptream_dura_input_control::-webkit-search-decoration,
.wptream_dura_blog_search .wptream_dura_input_control::-webkit-search-cancel-button { -webkit-appearance: none; }
.wptream_dura_blog_cats { display: flex; flex-direction: column; gap: var(--wptream_dura_space_4); }
.wptream_dura_blog_aside_title {
  margin: 0;
  font-family: var(--wptream_dura_font_body);
  font-size: var(--wptream_dura_size_caption);
  text-transform: uppercase;
  letter-spacing: var(--wptream_dura_track_eyebrow);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_text_on_light_muted);
}
.wptream_dura_blog_cat_list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_3);
}
.wptream_dura_blog_cat_link {
  font-size: var(--wptream_dura_size_body_sm);
  color: var(--wptream_dura_text_on_light_2);
  text-decoration: none;
  transition: var(--wptream_dura_tx);
}
.wptream_dura_blog_cat_link:hover,
.wptream_dura_blog_cat_active { color: var(--wptream_dura_accent); text-decoration: none; }
.wptream_dura_blog_cat_active { font-weight: var(--wptream_dura_weight_semibold); }

/* Pager */
.wptream_dura_blog_pager_wrap { margin-top: var(--wptream_dura_space_9); }
.wptream_dura_blog_pager {
  display: flex;
  gap: var(--wptream_dura_space_2);
  justify-content: center;
  flex-wrap: wrap;
}
.wptream_dura_blog_pager_cell,
.wptream_dura_blog_pager_gap {
  min-width: 40px;
  height: 40px;
  padding: 0 var(--wptream_dura_space_3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--wptream_dura_radius_pill);
  font-size: var(--wptream_dura_size_body_sm);
  font-weight: var(--wptream_dura_weight_semibold);
  text-decoration: none;
  background: transparent;
  color: var(--wptream_dura_text_on_light_2);
  border: 1px solid var(--wptream_dura_border_light);
  transform: none;
  transition: var(--wptream_dura_tx), transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_blog_pager_gap { border-color: transparent; color: var(--wptream_dura_text_on_light_muted); }
a.wptream_dura_blog_pager_cell:hover {
  background: var(--wptream_dura_accent_tint);
  color: var(--wptream_dura_accent);
  border-color: var(--wptream_dura_accent_tint);
  transform: var(--wptream_dura_lift_sm);
  text-decoration: none;
}
.wptream_dura_blog_pager_active {
  background: var(--wptream_dura_surface_dark);
  color: var(--wptream_dura_text_on_dark);
  border-color: transparent;
}
.wptream_dura_blog_pager_disabled { color: var(--wptream_dura_text_on_light_muted); cursor: default; }

@media (max-width: 900px) {
  .wptream_dura_blog_featured { grid-template-columns: minmax(0, 1fr); gap: var(--wptream_dura_space_5); }
  .wptream_dura_blog_layout { grid-template-columns: minmax(0, 1fr); gap: var(--wptream_dura_space_7); }
  .wptream_dura_blog_aside { position: static; }
}
@media (max-width: 600px) {
  .wptream_dura_blog_grid { grid-template-columns: minmax(0, 1fr); gap: var(--wptream_dura_space_7); }
  .wptream_dura_blog_featured_title { font-size: var(--wptream_dura_size_headline); }
}

/* ---------------------------------------------------------------------
 * B16. Blog Post (.wptream_dura_post)
 * Design: PostPage.jsx. Template: theme template-parts/single.php (posts only).
 *   main.wptream_dura_post
 *     ├─ article._article           pad 64 gutter 0
 *     │    ├─ header._column         720px: back link, kicker, h1 display-4, deck, share row
 *     │    ├─ figure._figure         container width, 16:9 media + caption at column width
 *     │    └─ ._column._main         toc (hairlines), body, share row (hairline top)
 *     ├─ section._cta (dark)         section-y-sm band, centred text container
 *     └─ section._more               720px: heading + 3 rows with hairline tops
 * ------------------------------------------------------------------- */
.wptream_dura_post { background: var(--wptream_dura_surface_light); color: var(--wptream_dura_fg); }
/* hello-elementor caps `body:not([class*=elementor-page-]) .site-main` at
 * 1140px with side padding; the article sets its own column and the CTA
 * band must bleed, so out-rank that rule. */
body.wptream_dura_site main.wptream_dura_post.site-main { width: auto; max-width: none; margin: 0; padding: 0; }
.wptream_dura_post_article { padding: var(--wptream_dura_space_8) var(--wptream_dura_gutter) 0; }
.wptream_dura_post_column { max-width: 720px; margin: 0 auto; }
.wptream_dura_post_header { display: flex; flex-direction: column; gap: var(--wptream_dura_space_5); }
.wptream_dura_post_back {
  font-size: var(--wptream_dura_size_caption);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_accent);
  text-decoration: none;
  width: fit-content;
}
.wptream_dura_post_back:hover { text-decoration: none; color: var(--wptream_dura_accent_hover); }
.wptream_dura_post_kicker {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--wptream_dura_space_4);
}
.wptream_dura_post_kicker,
.wptream_dura_post_kicker_label {
  font-size: var(--wptream_dura_size_caption);
  text-transform: uppercase;
  letter-spacing: var(--wptream_dura_track_eyebrow);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_text_on_light_muted);
}
.wptream_dura_post_kicker_cat { color: var(--wptream_dura_accent); }
.wptream_dura_post_kicker_item { white-space: nowrap; }
.wptream_dura_post_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_4);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  text-wrap: pretty;
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_post_deck {
  margin: 0;
  font-size: var(--wptream_dura_size_title);
  font-weight: var(--wptream_dura_weight_regular);
  line-height: var(--wptream_dura_lh_snug);
  letter-spacing: var(--wptream_dura_track_headline);
  text-wrap: pretty;
  color: var(--wptream_dura_text_on_light_2);
}
/* Share row (pills) */
.wptream_dura_post_share { display: flex; align-items: center; flex-wrap: wrap; gap: var(--wptream_dura_space_4); }
.wptream_dura_post_share_list { display: flex; flex-wrap: wrap; gap: var(--wptream_dura_space_2); }
.wptream_dura_site .wptream_dura_post_pill,
.wptream_dura_site button.wptream_dura_post_pill {
  font-family: var(--wptream_dura_font_body);
  font-size: var(--wptream_dura_size_caption);
  font-weight: var(--wptream_dura_weight_semibold);
  line-height: var(--wptream_dura_lh_snug);
  text-decoration: none;
  padding: var(--wptream_dura_space_2) var(--wptream_dura_space_3);
  border-radius: var(--wptream_dura_radius_pill);
  color: var(--wptream_dura_text_on_light_2);
  background: transparent;
  border: 1px solid var(--wptream_dura_border_light);
  transform: none;
  cursor: pointer;
  box-shadow: none;
  transition: var(--wptream_dura_tx), transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_site .wptream_dura_post_pill:hover,
.wptream_dura_site button.wptream_dura_post_pill:hover,
.wptream_dura_site button.wptream_dura_post_pill:focus {
  color: var(--wptream_dura_accent);
  background: var(--wptream_dura_accent_tint);
  border-color: var(--wptream_dura_accent_tint);
  transform: var(--wptream_dura_lift_sm);
  text-decoration: none;
  box-shadow: none;
}
.wptream_dura_site .wptream_dura_post_copied,
.wptream_dura_site .wptream_dura_post_copied:hover { color: var(--wptream_dura_success_text); background: var(--wptream_dura_success_tint); border-color: var(--wptream_dura_success_tint); }
/* Featured image */
.wptream_dura_post_figure {
  margin: var(--wptream_dura_space_8) auto 0;
  max-width: var(--wptream_dura_container);
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_3);
}
.wptream_dura_post_figure .wptream_dura_media_frame { aspect-ratio: 16 / 9; }
.wptream_dura_post_caption {
  width: 100%;
  font-size: var(--wptream_dura_size_caption);
  line-height: var(--wptream_dura_lh_snug);
  color: var(--wptream_dura_text_on_light_muted);
}
/* Table of content */
.wptream_dura_post_main { margin-top: var(--wptream_dura_space_8); }
.wptream_dura_post_toc {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_4);
  padding: var(--wptream_dura_space_5) 0;
  border-top: 1px solid var(--wptream_dura_border_light);
  border-bottom: 1px solid var(--wptream_dura_border_light);
}
.wptream_dura_post_toc_list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_3);
}
.wptream_dura_post_toc_link {
  display: inline-block;
  font-size: var(--wptream_dura_size_body_sm);
  line-height: var(--wptream_dura_lh_snug);
  text-decoration: none;
  color: var(--wptream_dura_text_on_light_2);
  transform: none;
  transition: var(--wptream_dura_tx), transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_post_toc_link:hover { color: var(--wptream_dura_accent); transform: var(--wptream_dura_nudge); text-decoration: none; }
/* Body copy (WordPress content) */
.wptream_dura_post_toc + .wptream_dura_post_body { margin-top: var(--wptream_dura_space_7); }
.wptream_dura_post_body { display: flex; flex-direction: column; }
.wptream_dura_post_body > * { max-width: 100%; }
.wptream_dura_post_body h2 {
  margin: var(--wptream_dura_space_8) 0 var(--wptream_dura_space_4);
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_headline);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  scroll-margin-top: var(--wptream_dura_space_9);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_post_body h3,
.wptream_dura_post_body h4 {
  margin: var(--wptream_dura_space_6) 0 var(--wptream_dura_space_3);
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_title);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  scroll-margin-top: var(--wptream_dura_space_9);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_post_body p,
.wptream_dura_post_body ul,
.wptream_dura_post_body ol {
  margin: 0 0 var(--wptream_dura_space_5);
  font-size: var(--wptream_dura_size_body_lg);
  line-height: var(--wptream_dura_lh_loose);
  letter-spacing: var(--wptream_dura_track_normal);
  text-wrap: pretty;
  color: var(--wptream_dura_text_on_light_2);
}
.wptream_dura_post_body ul,
.wptream_dura_post_body ol { padding-left: var(--wptream_dura_space_6); }
.wptream_dura_post_body li { margin-bottom: var(--wptream_dura_space_2); }
.wptream_dura_post_body blockquote {
  margin: var(--wptream_dura_space_7) 0;
  padding: 0 0 0 var(--wptream_dura_space_6);
  border-left: 3px solid var(--wptream_dura_accent);
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_title);
  font-weight: var(--wptream_dura_weight_medium);
  line-height: var(--wptream_dura_lh_snug);
  letter-spacing: var(--wptream_dura_track_headline);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_post_body blockquote p { margin: 0; font: inherit; letter-spacing: inherit; color: inherit; }
.wptream_dura_post_body a { color: var(--wptream_dura_accent); }
.wptream_dura_post_body img,
.wptream_dura_post_body figure,
.wptream_dura_post_body iframe,
.wptream_dura_post_body video { max-width: 100%; height: auto; }
.wptream_dura_post_body img { border-radius: var(--wptream_dura_radius_lg); }
.wptream_dura_post_body figure { margin: 0 0 var(--wptream_dura_space_5); }
.wptream_dura_post_body figcaption { font-size: var(--wptream_dura_size_caption); color: var(--wptream_dura_text_on_light_muted); margin-top: var(--wptream_dura_space_2); }
.wptream_dura_post_body pre {
  overflow: auto;
  margin: 0 0 var(--wptream_dura_space_5);
  padding: var(--wptream_dura_space_5);
  border-radius: var(--wptream_dura_radius_md);
  background: var(--wptream_dura_surface_light_inset);
  font-family: var(--wptream_dura_font_mono);
  font-size: var(--wptream_dura_size_body_sm);
}
.wptream_dura_post_body table { width: 100%; border-collapse: collapse; margin: 0 0 var(--wptream_dura_space_5); font-size: var(--wptream_dura_size_body); }
.wptream_dura_post_body th,
.wptream_dura_post_body td { padding: var(--wptream_dura_space_3); border-bottom: 1px solid var(--wptream_dura_border_light); text-align: left; }
.wptream_dura_post_share_bottom {
  margin-top: var(--wptream_dura_space_8);
  padding-top: var(--wptream_dura_space_6);
  border-top: 1px solid var(--wptream_dura_border_light);
}
/* Dark CTA band */
.wptream_dura_post_cta {
  margin: var(--wptream_dura_section_y_sm) 0 0;
  padding: var(--wptream_dura_section_y_sm) var(--wptream_dura_gutter);
  background: var(--wptream_dura_surface_dark);
}
.wptream_dura_post_cta_inner {
  max-width: var(--wptream_dura_container_text);
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_5);
  align-items: center;
}
.wptream_dura_post_cta_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_4);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  color: var(--wptream_dura_text_on_dark);
}
.wptream_dura_post_cta_text { margin: 0; font-size: var(--wptream_dura_size_body_lg); color: var(--wptream_dura_text_on_dark_2); }
/* More from the blog */
.wptream_dura_post_more { padding: var(--wptream_dura_section_y_sm) var(--wptream_dura_gutter) var(--wptream_dura_section_y); }
.wptream_dura_post_more_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_headline);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_post_more_list { margin-top: var(--wptream_dura_space_6); display: flex; flex-direction: column; }
.wptream_dura_post_more_row {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_2);
  padding: var(--wptream_dura_space_5) 0;
  text-decoration: none;
  border-top: 1px solid var(--wptream_dura_border_light);
  transform: none;
  transition: transform var(--wptream_dura_dur_med) var(--wptream_dura_ease_out);
}
.wptream_dura_post_more_row:hover { transform: var(--wptream_dura_nudge); text-decoration: none; }
.wptream_dura_post_more_cat {
  font-size: var(--wptream_dura_size_legal);
  text-transform: uppercase;
  letter-spacing: var(--wptream_dura_track_eyebrow);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_accent);
}
.wptream_dura_post_more_row_title {
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_subtitle);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_snug);
  text-wrap: pretty;
  transition: var(--wptream_dura_tx);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_post_more_row:hover .wptream_dura_post_more_row_title { color: var(--wptream_dura_accent); }
.wptream_dura_post_more_date { font-size: var(--wptream_dura_size_caption); color: var(--wptream_dura_text_on_light_muted); }
@media (max-width: 600px) {
  .wptream_dura_post_title { font-size: var(--wptream_dura_size_headline); }
  .wptream_dura_post_figure .wptream_dura_media_frame { border-radius: var(--wptream_dura_radius_md); }
}

/* ---------------------------------------------------------------------
 * B17. Auth Page (.wptream_dura_auth)
 * Design: AuthPage.jsx. Widget: plugins/wpstream-elementor/widgets/auth_widget.php
 *   .wptream_dura_auth [data-mode]     grid 1fr/1fr, min-height 100vh - nav, raised surface
 *     ├─ ._panel.wptream_dura_dark     dark, relative; optional photo + scrim
 *     │    └─ ._panel_copy             pinned 48px from left/right/bottom: h2 display-4 black, body
 *     └─ ._side                        centred, pad 64 gutter
 *          └─ ._card                   width min(400px,100%), column gap 24
 *               ├─ ._head              logo 88px, titles, done state, form (fields 48px, radius md)
 *               └─ p._switch           "New to Wpstream? Create an account"
 * Fields, links and the submit button are <input>/<button> elements, so the
 * Elementor kit rules are neutralised with !important like B0 does.
 * ------------------------------------------------------------------- */
.wptream_dura_auth {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-height: calc(100vh - var(--wptream_dura_nav_h));
  background: var(--wptream_dura_surface_light_raised);
  color: var(--wptream_dura_fg);
}
.wptream_dura_auth [hidden] { display: none !important; }
.wptream_dura_auth_panel { position: relative; overflow: hidden; background: var(--wptream_dura_surface_dark); }
.wptream_dura_auth_panel_img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.wptream_dura_auth_panel_scrim { position: absolute; inset: 0; background: var(--wptream_dura_scrim_bottom); pointer-events: none; }
.wptream_dura_auth_panel_copy {
  position: absolute;
  left: var(--wptream_dura_space_7);
  right: var(--wptream_dura_space_7);
  bottom: var(--wptream_dura_space_7);
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_3);
}
.wptream_dura_auth_panel_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_display_4);
  font-weight: var(--wptream_dura_weight_black);
  letter-spacing: var(--wptream_dura_track_display);
  line-height: var(--wptream_dura_lh_tight);
  text-wrap: balance;
  color: var(--wptream_dura_text_on_dark);
}
.wptream_dura_auth_panel_text {
  margin: 0;
  font-size: var(--wptream_dura_size_body);
  line-height: var(--wptream_dura_lh_body);
  text-wrap: pretty;
  color: var(--wptream_dura_text_on_dark_2);
  max-width: 44ch;
}
.wptream_dura_auth_side {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--wptream_dura_space_8) var(--wptream_dura_gutter);
}
.wptream_dura_auth_card { display: flex; flex-direction: column; gap: var(--wptream_dura_space_5); width: min(400px, 100%); }
.wptream_dura_auth_head { display: flex; flex-direction: column; gap: var(--wptream_dura_space_5); }
.wptream_dura_auth_logo_link { display: block; width: fit-content; line-height: 0; }
.wptream_dura_auth_logo { width: 88px; height: auto; display: block; }
.wptream_dura_auth_titles { display: flex; flex-direction: column; gap: var(--wptream_dura_space_2); }
.wptream_dura_auth_title {
  margin: 0;
  font-family: var(--wptream_dura_font_display);
  font-size: var(--wptream_dura_size_headline);
  font-weight: var(--wptream_dura_weight_bold);
  letter-spacing: var(--wptream_dura_track_headline);
  line-height: var(--wptream_dura_lh_tight);
  color: var(--wptream_dura_text_on_light);
}
.wptream_dura_auth_sub {
  margin: 0;
  font-size: var(--wptream_dura_size_body_sm);
  line-height: var(--wptream_dura_lh_body);
  text-wrap: pretty;
  color: var(--wptream_dura_text_on_light_2);
}
.wptream_dura_auth_done { display: flex; flex-direction: column; gap: var(--wptream_dura_space_4); align-items: flex-start; }
.wptream_dura_auth_done_text { margin: 0; font-size: var(--wptream_dura_size_body); line-height: var(--wptream_dura_lh_body); color: var(--wptream_dura_text_on_light); }
.wptream_dura_auth_form { margin: 0; display: flex; flex-direction: column; gap: var(--wptream_dura_space_4); }
.wptream_dura_auth_field { display: flex; flex-direction: column; gap: var(--wptream_dura_space_2); cursor: default; }
.wptream_dura_auth_label {
  font-size: var(--wptream_dura_size_caption);
  font-weight: var(--wptream_dura_weight_semibold);
  color: var(--wptream_dura_text_on_light_2);
}
.wptream_dura_auth_label_row { display: flex; justify-content: space-between; align-items: baseline; gap: var(--wptream_dura_space_3); }
.wptream_dura_site .wptream_dura_auth_input,
.wptream_dura_site .wptream_dura_auth_input:focus {
  height: 48px !important;
  padding: 0 var(--wptream_dura_space_5) !important;
  margin: 0;
  width: 100%;
  box-sizing: border-box;
  font-family: var(--wptream_dura_font_body) !important;
  font-size: var(--wptream_dura_size_body) !important;
  color: var(--wptream_dura_text_on_light) !important;
  background: var(--wptream_dura_surface_light) !important;
  border: 1px solid var(--wptream_dura_border_light) !important;
  border-radius: var(--wptream_dura_radius_md) !important;
  box-shadow: none !important;
  outline: none;
  transition: var(--wptream_dura_tx);
}
.wptream_dura_site .wptream_dura_auth_input::placeholder { color: var(--wptream_dura_text_on_light_muted); }
.wptream_dura_site .wptream_dura_auth_input:focus {
  border-color: var(--wptream_dura_accent) !important;
  box-shadow: var(--wptream_dura_focus_ring) !important;
}
.wptream_dura_site .wptream_dura_auth_link,
.wptream_dura_site .wptream_dura_auth_link:hover,
.wptream_dura_site .wptream_dura_auth_link:focus {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0;
  box-shadow: none !important;
  font-family: var(--wptream_dura_font_body) !important;
  font-size: var(--wptream_dura_size_body_sm) !important;
  font-weight: var(--wptream_dura_weight_semibold) !important;
  line-height: inherit;
  color: var(--wptream_dura_accent) !important;
  text-decoration: none !important;
  cursor: pointer;
  white-space: normal;
}
.wptream_dura_site .wptream_dura_auth_link:hover { color: var(--wptream_dura_accent_hover) !important; }
.wptream_dura_auth_check {
  display: flex;
  align-items: flex-start;
  gap: var(--wptream_dura_space_3);
  font-size: var(--wptream_dura_size_body_sm);
  line-height: var(--wptream_dura_lh_body);
  color: var(--wptream_dura_text_on_light_2);
  cursor: pointer;
}
.wptream_dura_auth_check a { color: var(--wptream_dura_accent); }
.wptream_dura_site .wptream_dura_auth_checkbox {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  flex-shrink: 0;
  accent-color: var(--wptream_dura_accent);
}
.wptream_dura_auth_error { margin: 0; font-size: var(--wptream_dura_size_body_sm); color: var(--wptream_dura_danger); }
.wptream_dura_auth_captcha { display: none; }
.wptream_dura_site .wptream_dura_auth button.wptream_dura_btn,
.wptream_dura_site .wptream_dura_auth button.wptream_dura_btn:focus {
  width: 100%;
  min-height: 48px;
  padding: var(--wptream_dura_space_4) var(--wptream_dura_space_6) !important;
  border: 1px solid transparent !important;
  border-radius: var(--wptream_dura_radius_pill) !important;
  background: var(--wptream_dura_accent) !important;
  color: #fff !important;
  font-family: var(--wptream_dura_font_body) !important;
  font-size: var(--wptream_dura_size_body) !important;
  font-weight: var(--wptream_dura_weight_semibold) !important;
  line-height: 1;
  box-shadow: none !important;
}
.wptream_dura_site .wptream_dura_auth button.wptream_dura_btn:hover { background: var(--wptream_dura_accent_hover) !important; color: #fff !important; }
.wptream_dura_site .wptream_dura_auth button.wptream_dura_btn:active { background: var(--wptream_dura_accent_press) !important; }
.wptream_dura_site .wptream_dura_auth button.wptream_dura_btn:focus-visible { box-shadow: var(--wptream_dura_focus_ring) !important; }
.wptream_dura_site .wptream_dura_auth button.wptream_dura_btn:disabled { opacity: 0.6; cursor: wait; transform: none; }
.wptream_dura_auth_switch {
  margin: 0;
  text-align: center;
  font-size: var(--wptream_dura_size_body_sm);
  color: var(--wptream_dura_text_on_light_2);
}
.wptream_dura_auth_logged_in { grid-template-columns: minmax(0, 1fr); min-height: 40vh; }
@media (max-width: 900px) {
  .wptream_dura_auth { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .wptream_dura_auth_panel { min-height: 280px; }
  .wptream_dura_auth_panel_copy { position: static; padding: var(--wptream_dura_space_7) var(--wptream_dura_gutter); }
  .wptream_dura_auth_panel_title { font-size: var(--wptream_dura_size_headline); }
  .wptream_dura_auth_side { padding: var(--wptream_dura_space_7) var(--wptream_dura_gutter); }
}

/* ---------------------------------------------------------------------
 * B18. Reviews (widget wpstream_reviews: homepage + church landing)
 *   div.wptream_dura_reviews                         3 / 2 / 1 column grid
 *     └─ article.wptream_dura_review_card            + .wptream_dura_card_box (frame) + _card_shadow
 *          ├─ h3.wptream_dura_review_name            + .wptream_dura_title (type)
 *          ├─ span.wptream_dura_review_stars          optional ★★★★★
 *          ├─ p.wptream_dura_review_excerpt          + .wptream_dura_body_text
 *          ├─ p.wptream_dura_review_author           optional, caption
 *          └─ a.wptream_dura_review_link             text CTA (chevron added by microinteraction.js)
 * ------------------------------------------------------------------- */
.wptream_dura_reviews {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--wptream_dura_space_5);
  width: 100%;
}
.wptream_dura_review_card {
  display: flex;
  flex-direction: column;
  gap: var(--wptream_dura_space_4);
  min-width: 0;
  background: var(--wptream_dura_bg_raised);
  border: 1px solid var(--wptream_dura_border);
  /* resting shadow comes from .wptream_dura_card_shadow in the markup */
}
.wptream_dura_review_stars { color: #eddd31; font-size: 19px; letter-spacing: 3px; line-height: 1; }
/* The excerpt grows so every link sits on the card's bottom edge. */
.wptream_dura_site .wptream_dura_review_excerpt { flex: 1; margin: 0; }
.wptream_dura_review_author {
  margin: 0;
  color: var(--wptream_dura_text_on_light_muted);
  font: var(--wptream_dura_weight_regular) var(--wptream_dura_size_caption)/1.6 var(--wptream_dura_font_body);
}
.wptream_dura_review_link {
  align-self: flex-start;
  color: var(--wptream_dura_accent);
  font: var(--wptream_dura_weight_semibold) var(--wptream_dura_size_body_sm)/1 var(--wptream_dura_font_body);
  text-decoration: none;
}
.wptream_dura_review_link:hover { color: var(--wptream_dura_accent_hover); }
@media (max-width: 1024px) { .wptream_dura_reviews { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .wptream_dura_reviews { grid-template-columns: minmax(0, 1fr); } }
body.wps-landing .church-prose-columns,
body.wps-landing .church-editorial-item {
	border-top: 0;
}

/* Shared observer arms these widget elements; the widget sheet owns the effect. */
body.wptream_dura_site :is(.wptream_dura_steps_item,.wptream_dura_feature_row_copy,.wptream_dura_feature_row > .wptream_dura_media,.wptream_dura_slider_card).mi-reveal {
  animation:mi-reveal var(--mi-reveal,700ms) var(--mi-ease,ease) both;
  animation-delay:var(--mi-delay,0ms);
}
@media (prefers-reduced-motion:reduce) {
  body.wptream_dura_site :is(.wptream_dura_steps_item,.wptream_dura_feature_row_copy,.wptream_dura_feature_row > .wptream_dura_media,.wptream_dura_slider_card).mi-reveal { animation:none; }
}
