/*
  base.css (TRIAL)
  Date: 2025-11-06
  Purpose: Safe, no-op-by-default utilities and accessibility helpers.
  Rollback: Remove the HTML snippet between <!-- BEGIN base.css trial --> and <!-- END base.css trial -->.
  Notes:
    - This file intentionally avoids overriding existing site styles unless classes are explicitly used.
    - It is safe to keep in production; if not desired, remove the link tag block (marked) from pages.
*/

/* Accessibility: ensure visible focus for interactive elements */
:where(a, button, [role="button"], .button, .button-frame, .sc-cta):focus-visible {
    outline: 2px solid #7dd3fc; /* light cyan */
    outline-offset: 2px;
}

/* Utility: visually hidden but accessible to screen readers */
.sr-only,
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Utility: make a sr-only element visible when focused */
.sr-only-focusable:active,
.sr-only-focusable:focus,
.sr-only-focusable:focus-within {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
}

/* Utility: reduce or disable animations where necessary */
.no-animate, .no-animation {
    animation: none !important;
    transition: none !important;
}

/* System-wide respect for prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Typography helpers (opt-in) */
.text-balance {
    text-wrap: balance;
}

.text-pretty {
    text-wrap: pretty;
}

.max-w-prose {
    max-width: 65ch;
}

/* Utility spacing helpers (opt-in, minimal) */
.mt-0 {
    margin-top: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

/* Added: small stepped spacing utilities for replacing repeated inline styles */
.mt-1 {
    margin-top: 0.5rem !important;
}

.mt-2 {
    margin-top: 1rem !important;
}

.mt-3 {
    margin-top: 1.5rem !important;
}

.pt-1 {
    padding-top: 0.5rem !important;
}

.pt-2 {
    padding-top: 1rem !important;
}

.pt-3 {
    padding-top: 1.5rem !important;
}

/* Simple layout helpers (opt-in) */
.center-block {
    margin-left: auto !important;
    margin-right: auto !important;
}

.grid-center {
    display: grid !important;
    place-items: center !important;
}

.flex-center {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Media helpers */
.img-contain {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.img-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Link decorations (opt-in) */
.no-underline {
    text-decoration: none !important;
}

/* Smooth out focus outlines on dark backgrounds */
:root {
    --trial-base-enabled: 1;
}

/* ----------------------------------------------------
   Standardized content styles (opt-in classes)
   Use these instead of repeating inline styles.
----------------------------------------------------- */
:root {
    /* Typography tokens */
    --heading-color: #fff;
    --text-color: #e5f0fb;
    --text-muted: #cfe6ff;
    --p-size-min: 1.05rem;
    --p-size-flu: 0.95rem; /* base for fluid calc */
    --p-size-max: 1.25rem;
    --p-leading: 1.6;
    --p-mb: 14px;
    --h1-size-min: 1.8rem;
    --h1-size-max: 2.6rem;
    --h2-size-min: 1.8rem;
    --h2-size-max: 2.6rem;
    --heading-mb: 10px;
    --list-indent: 18px;
    --li-gap: 6px;
}

/* Description paragraph */
.p-desc {
    color: var(--text-color);
    opacity: .95;
    line-height: var(--p-leading);
    margin: 0 0 var(--p-mb);
    max-width: 70ch;
    font-size: clamp(var(--p-size-min), var(--p-size-flu) + 0.6vw, var(--p-size-max));
    text-align: left;
}

/* Contextual defaults: paragraphs and lists inside .description */
.description p {
    color: var(--text-color);
    opacity: .95;
    line-height: var(--p-leading);
    margin: 0 0 var(--p-mb);
    max-width: 70ch;
    font-size: clamp(var(--p-size-min), var(--p-size-flu) + 0.6vw, var(--p-size-max));
    text-align: left;
}
.description ul {
    list-style: disc;
    padding-left: var(--list-indent);
    margin: 0 0 var(--p-mb);
}
.description li {
    margin: var(--li-gap) 0;
    line-height: 1.5;
    text-align: left;
}

/* Eyebrow (small label above headings) */
.eyebrow {
    color: var(--text-muted);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin: 0 0 6px;
}

/* Standard headings with consistent spacing */
.h1-title {
    color: var(--heading-color);
    font-weight: 900;
    margin: 0 0 var(--heading-mb);
    font-size: clamp(var(--h1-size-min), 1.2rem + 1.8vw, var(--h1-size-max));
    line-height: 1.15;
    text-align: left;
}

.h2-title {
    color: var(--heading-color);
    font-weight: 900;
    margin: 0 0 var(--heading-mb);
    font-size: clamp(var(--h2-size-min), 1.2rem + 1.8vw, var(--h2-size-max));
    line-height: 1.15;
    text-align: left;
}

/* Captions */
.caption {
    color: var(--text-muted);
    font-size: .95rem;
    line-height: 1.5;
    text-align: left;
}

.caption-strong {
    color: var(--heading-color);
    font-weight: 700;
}

/* Standard unordered/ordered list */
.list-std {
    list-style: disc;
    padding-left: var(--list-indent);
    margin: 0 0 var(--p-mb);
}

.list-std li {
    margin: var(--li-gap) 0;
    line-height: 1.5;
    text-align: left;
}

/* Icon feature list: <ul class="list-features"> <li><img/><span>Text</span></li> */
.list-features {
    list-style: none;
    padding: 0;
    margin: 16px 0 14px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    color: #fff;
}

.list-features li {
    display: flex;
    align-items: center;
    gap: 14px;
    line-height: 1.3;
    text-align: left;
}

.list-features li span {
    display: inline-block;
    text-align: left;
}

.list-features img {
    width: clamp(22px, 2.4vw, 30px);
    height: clamp(22px, 2.4vw, 30px);
    object-fit: contain;
    flex: 0 0 auto;
}

.list-features-strong li {
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .01em;
}

/* Reset + grid helper for custom list layouts */
.list-reset {
    list-style: none;
    padding: 0;
    margin: 0;
}

.list-grid-1 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

/* Text alignment utility */
.text-left {
    text-align: left !important;
}

/* Gentle defaults: keep text aligned left without affecting containers */
h1, h2, h3, h4, h5, h6, p, li, figcaption {
    text-align: left;
}

/* Partner description paragraphs (used across ecosystem pages) */
.partner-description {
    color: var(--text-color);
    font-weight: 600;
    line-height: 1.8;
    margin: 0;
    padding: clamp(16px, 1.6vw, 24px) 0;
    text-align: left;
}

/* Reusable CTA gradient button (matches existing inline style) */
.btn-gradient, .sc-cta {
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 210px !important;
    padding: 18px 34px !important;
    border-radius: 46px !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    color: #fff !important;
    background: linear-gradient(90deg, #0090ff 0%, #53d3ff 45%, #c9f742 100%) !important;
    box-shadow: 0 8px 22px -8px rgba(0,0,0,.6) !important;
    transition: box-shadow .35s, transform .35s !important;
}
.sc-cta:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -10px rgba(0,0,0,.65) !important; }

/* Global override: uniform underline thickness for all bottom-line headings */
h1.bottom-line::after { height: 7px !important; margin-top: 3rem!important; }

/* End of base.css (TRIAL) */



/* Footer link size reduction for index page */
footer .footer-link .bottom-nav-link {
    font-size: 70% !important; /* 50% of the parent font size */
    line-height: 1.2 !important;
}