/* === g-hero-full — greenfield canonical, slot-contract form === */
/* Phase 0.1.f2 — rewritten per preset-architecture-v1.md §3.3 + §3.5.   */
/* Section CSS consumes only var(--g-hero-full-*) and var(--brand-*).    */
/* No --shell-*, no --paint-*, no currentColor fallbacks. Tone cascade   */
/* lives in Simple Theme emission (§4.2), not here.                      */

/* ── Base layout ── */
.ssla-g-hero-full {
  width: 100%;
  position: relative;
  overflow: hidden;
  background: var(--g-hero-full-bg);
  color:      var(--g-hero-full-fg);
}
.ssla-g-hero-full-inner {
  text-align: var(--ssla-text-align, left); /* v3.18.32 f3.text-align */
  max-width: var(--g-hero-full-content-max-width);
  margin: 0 auto;
  padding: var(--g-hero-full-section-padding) 48px;
  position: relative;
  z-index: 1;
}

/* ── Fullbleed ── */
.alignfull .ssla-g-hero-full-inner {
  max-width: 100%;
  padding-left: 48px;
  padding-right: 48px;
}
.ssla-g-hero-full.alignfull .ssla-g-hero-full-inner {
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ── Typography ── */
.ssla-g-hero-full-eyebrow {
  color:           var(--g-hero-full-eyebrow);
  font-size:       var(--g-hero-full-eyebrow-size);
  letter-spacing:  var(--g-hero-full-eyebrow-letter);
  font-weight:     800;
  text-transform:  uppercase;
  margin:          0 0 24px;
}
.ssla-g-hero-full-heading {
  font-family:    var(--g-hero-full-heading-family);
  font-size:      var(--g-hero-full-heading-size);
  font-weight:    var(--g-hero-full-heading-weight);
  letter-spacing: var(--g-hero-full-heading-letter);
  line-height:    1.05;
  margin:         0 0 24px;
}
.ssla-g-hero-full-body {
  font-family: var(--g-hero-full-body-family);
  font-size:   var(--g-hero-full-body-size);
  line-height: var(--g-hero-full-body-line-height);
  max-width:   720px;
  margin:      0 0 40px;
}
.ssla-g-hero-full-body p { margin: 0 0 12px; }
.ssla-g-hero-full-body p:last-child { margin-bottom: 0; }

/* ── CTA ── */
.ssla-g-hero-full-actions { margin: 40px 0 0; }
.ssla-g-hero-full-cta {
  display: inline-block;
  background:      var(--ssla-button-fill, var(--g-hero-full-cta-bg));
  color:           var(--ssla-button-text, var(--g-hero-full-cta-fg));
  padding:         var(--g-hero-full-button-padding);
  border-radius:   var(--g-hero-full-button-radius);
  font-weight:     800;
  font-size:       13px;
  letter-spacing:  2px;
  text-transform:  uppercase;
  text-decoration: none;
  transition:      transform .25s ease;
}
.ssla-g-hero-full-cta:empty { display: none; }

/* ── Media slot — background mode (default) ── */
.ssla-g-hero-full-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.ssla-g-hero-full-media:empty { display: none; }
.ssla-g-hero-full-media img,
.ssla-g-hero-full-media video,
.ssla-g-hero-full-media iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Structural variant: media_position (per §3.4) ── */
.ssla-g-hero-full--media-position-inline .ssla-g-hero-full-media {
  position: static;
  margin: 40px 0 0;
  height: auto;
  inset: auto;
}

/* ── Structural variant: density (per §3.4) ── */
.ssla-g-hero-full--density-minimal .ssla-g-hero-full-eyebrow,
.ssla-g-hero-full--density-minimal .ssla-g-hero-full-body,
.ssla-g-hero-full--density-minimal .ssla-g-hero-full-actions,
.ssla-g-hero-full--density-minimal .ssla-g-hero-full-media { display: none; }
.ssla-g-hero-full--density-standard .ssla-g-hero-full-eyebrow,
.ssla-g-hero-full--density-standard .ssla-g-hero-full-actions,
.ssla-g-hero-full--density-standard .ssla-g-hero-full-media { display: none; }

/* ── Mobile ── */
@media (max-width: 768px) {
  .ssla-g-hero-full-inner {
    padding: 60px 24px;
  }
}

/* ═══ Skeleton state per §3.5 ═══ */
/* Per-section slot defaults pointing to brand-level skeleton tokens.    */
/* Simple Theme emission overrides via cascade order (§4.2). When no     */
/* preset is active, these resolve via brand-level defaults in           */
/* 0-shared.css and the section renders muted-but-functional.            */
.ssla-section.ssla-g-hero-full {
  --g-hero-full-bg:               transparent;
  --g-hero-full-fg:               var(--brand-fg);
  --g-hero-full-eyebrow:          var(--brand-accent);
  --g-hero-full-cta-bg:           var(--brand-accent);
  --g-hero-full-cta-fg:           var(--brand-bg);
  --g-hero-full-heading-family:   var(--brand-heading-family);
  --g-hero-full-heading-size:     var(--brand-h1-size-clamp);
  --g-hero-full-heading-weight:   var(--brand-heading-weight);
  --g-hero-full-heading-letter:   var(--brand-letter-spacing-h1);
  --g-hero-full-body-family:      var(--brand-body-family);
  --g-hero-full-body-size:        var(--brand-body-size);
  --g-hero-full-body-line-height: var(--brand-body-line-height);
  --g-hero-full-eyebrow-size:     var(--brand-eyebrow-size);
  --g-hero-full-eyebrow-letter:   var(--brand-letter-spacing-eyebrow);
  --g-hero-full-section-padding:  var(--brand-section-padding);
  --g-hero-full-content-max-width:var(--brand-content-max-width);
  --g-hero-full-button-padding:   var(--brand-button-padding);
  --g-hero-full-button-radius:    var(--brand-button-radius);
}
