/*
 * NARA DAILY — identity over the Cartzilla editorial style (tokens: brand-tokens.css,
 * generated from app/Config/BrandAgents/profile.json).
 * Estudio sereno y contemporáneo: light backgrounds, deep green primary, sage as a
 * surface, one humanist system sans (Arial/Helvetica) everywhere, medium weights,
 * generous spacing and short phrases.
 * Contrast (WCAG): ink/background 13.2, white/primary 9.8, ink/accent 8.1;
 * accent/background 1.6 → the sage accent is only a surface, never a text colour.
 */
body.cz-editorial {
    background: var(--brand-background);
    color: var(--brand-ink);
    font-family: var(--brand-font-body);
    font-size: 1.0625rem;
    line-height: 1.65;
    --ed-serif: var(--brand-font-headings); /* no serif in this brand */
    --ed-card-1: linear-gradient(135deg, #2D5746, #193329);
    --ed-card-2: linear-gradient(135deg, #3A5246, #1E2D26);
    --ed-card-3: linear-gradient(135deg, #4A5D52, #24352C);
    --ed-card-4: linear-gradient(135deg, #595247, #2B2924);
}
.cz-editorial h1, .cz-editorial h2, .cz-editorial h3, .cz-editorial .h1, .cz-editorial .h2, .cz-editorial .h3 {
    font-family: var(--brand-font-headings);
    font-weight: 500;
    letter-spacing: -.018em;
    line-height: 1.15;
    color: var(--brand-ink);
    max-width: 22ch;
}
.cz-editorial h1 em, .cz-editorial h2 em { font-style: normal; color: var(--brand-primary); }
.cz-editorial .ed-brand { font-family: var(--brand-font-headings); font-weight: 600; letter-spacing: .09em; font-size: 1.25rem; }
.cz-editorial .ed-brand em { color: var(--brand-primary); }
.cz-editorial .ed-brand img, .cz-checkout-header .ed-brand img { height: 38px; width: auto; max-height: 40px; display: block; }
.cz-editorial .footer { background-color: var(--brand-ink) !important; }

/* navigation & dropdowns */
.cz-editorial .ed-header {
    background: rgba(244, 245, 239, .95);
    border-bottom: 1px solid rgba(32, 44, 39, .08);
    box-shadow: none;
}
.cz-editorial .ed-announcement {
    background: var(--brand-primary);
    color: #fff;
    font-size: .74rem;
    letter-spacing: .06em;
}
.cz-editorial .ed-nav {
    gap: 1.6rem !important;
}
.cz-editorial .ed-nav > a,
.cz-editorial .ed-nav .dropdown > a {
    color: var(--brand-ink);
    font-size: .88rem;
    font-weight: 500;
    letter-spacing: .01em;
    padding: .35rem 0;
    position: relative;
    white-space: nowrap;
    transition: color .2s ease;
}
.cz-editorial .ed-nav > a:hover,
.cz-editorial .ed-nav .dropdown > a:hover {
    color: var(--brand-primary);
}
.cz-editorial .ed-nav .dropdown-menu {
    background: var(--brand-surface);
    border: 1px solid rgba(32, 44, 39, .09);
    border-radius: 14px;
    box-shadow: 0 16px 36px rgba(32, 44, 39, .10);
    min-width: 14.5rem;
    padding: .6rem;
    margin-top: .35rem;
}
.cz-editorial .ed-nav .dropdown-item {
    border-radius: 8px;
    color: var(--brand-ink);
    font-size: .88rem;
    font-weight: 500;
    padding: .5rem .85rem;
    transition: background-color .15s ease, color .15s ease;
}
.cz-editorial .ed-nav .dropdown-item:hover,
.cz-editorial .ed-nav .dropdown-item:focus {
    background: rgba(184, 198, 176, .35);
    color: var(--brand-primary);
}
.cz-editorial .ed-nav a[href*="brand/assistant"] {
    background: rgba(184, 198, 176, .45);
    border-radius: 999px;
    color: var(--brand-ink);
    font-weight: 600;
    padding: .38rem .95rem;
}
.cz-editorial .ed-nav a[href*="brand/assistant"]:hover {
    background: var(--brand-primary);
    color: #fff;
}
.cz-editorial .ed-cart .badge {
    background: var(--brand-primary);
    color: #fff;
}

/* buttons & links */
.cz-editorial .btn { border-radius: 999px; font-weight: 600; padding-left: 1.4rem; padding-right: 1.4rem; }
.cz-editorial .btn-primary { background: var(--brand-primary); border-color: var(--brand-primary); color: #fff; }
.cz-editorial .btn-primary:hover, .cz-editorial .btn-primary:focus { background: var(--brand-ink); border-color: var(--brand-ink); color: #fff; }
.cz-editorial .btn-outline-primary { color: var(--brand-primary); border-color: var(--brand-primary); }
.cz-editorial .btn-outline-primary:hover { background: var(--brand-primary); color: #fff; }
.cz-editorial a { color: var(--brand-primary); }
.cz-editorial .ed-link { color: var(--brand-primary); }
.cz-editorial .ed-link:hover { color: var(--brand-ink); }
.cz-editorial .ed-eyebrow { color: var(--brand-primary); font-weight: 600; letter-spacing: .08em; font-size: .82rem; }

/* hero: calm daylight studio banner */
.cz-editorial .ed-hero {
    background: linear-gradient(180deg, var(--brand-background) 0%, var(--brand-surface) 100%);
    min-height: 62vh;
    border-bottom: 1px solid rgba(32, 44, 39, .06);
}
.cz-editorial .ed-hero-slide {
    opacity: 1;
    background-position: right center;
}
.cz-editorial .ed-hero-orb-one { background: var(--brand-accent); opacity: .55; }
.cz-editorial .ed-hero-orb-two { background: var(--brand-muted); opacity: .5; }
.cz-editorial .ed-hero-arch { display: none; }
.cz-editorial .ed-benefits {
    background: var(--brand-accent);
    color: var(--brand-ink);
    font-size: .86rem;
    border-bottom: 1px solid rgba(32, 44, 39, .06);
}
.cz-editorial .ed-benefits i { color: var(--brand-primary); }

/* editorial block & bento category cards */
.cz-editorial .ed-editorial {
    background: var(--brand-surface);
    border: 1px solid rgba(32, 44, 39, .08);
    border-radius: 20px;
}
.cz-editorial .ed-editorial-art {
    background: var(--brand-primary);
    color: var(--brand-background);
    font-family: var(--brand-font-headings);
    font-weight: 600;
    letter-spacing: -.04em;
}
.cz-editorial .ed-editorial-art span:nth-child(2) {
    color: var(--brand-accent);
    font-style: normal;
}

.cz-editorial .ed-category-card {
    border-radius: 16px;
    background-color: var(--brand-primary);
    color: #fff;
    padding: 1.75rem;
    box-shadow: 0 10px 28px rgba(32, 44, 39, .07);
}
.cz-editorial .ed-category-card:hover {
    color: #fff;
    transform: translateY(-4px);
}
.cz-editorial .ed-category-card h3 {
    color: #fff;
    font-weight: 500;
    font-size: 1.85rem;
    max-width: 16ch;
}
.cz-editorial .ed-category-card small {
    color: rgba(244, 245, 239, .85);
}

/* product cards */
.cz-editorial .product-card img, .cz-editorial .konex-card img {
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: 14px;
    background: var(--brand-surface);
}
.cz-editorial .ed-featured {
    background: var(--brand-surface);
    border-top: 1px solid rgba(32, 44, 39, .06);
    border-bottom: 1px solid rgba(32, 44, 39, .06);
}
.cz-editorial .ed-featured .konex-price-final {
    color: var(--brand-primary);
}

/* NARA DAILY custom home sections */
.brand-home .brand-section { padding-top: 3.75rem !important; padding-bottom: 3.75rem !important; }
.brand-home .brand-section h2 { font-size: clamp(1.65rem, 2.7vw, 2.35rem); }
.nara-lead-sm { max-width: 58ch; font-size: 1rem; }

/* 1. Practice Moments 5-card grid */
.nara-moment-card {
    background: var(--brand-surface);
    border: 1px solid rgba(32, 44, 39, .08);
    border-radius: 16px;
    overflow: hidden;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    color: var(--brand-ink);
}
.nara-moment-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 34px rgba(32, 44, 39, .08);
    border-color: var(--brand-primary);
    color: var(--brand-ink);
}
.nara-moment-visual {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--brand-primary);
}
.nara-moment-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}
.nara-moment-card:hover .nara-moment-visual img {
    transform: scale(1.04);
}
.nara-moment-num {
    position: absolute;
    top: .75rem;
    left: .85rem;
    background: rgba(244, 245, 239, .9);
    color: var(--brand-ink);
    font-size: .72rem;
    font-weight: 600;
    padding: .2rem .55rem;
    border-radius: 999px;
}
.nara-moment-body {
    padding: 1.25rem 1.3rem 1.35rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.nara-moment-body h3 {
    color: var(--brand-ink);
    font-weight: 600;
    font-size: 1.1rem;
}
.nara-moment-body p {
    flex-grow: 1;
    line-height: 1.5;
}
.nara-moment-cta {
    color: var(--brand-primary);
    font-size: .84rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
}

/* 2. Available for Destination band */
.nara-available-band {
    background: var(--brand-surface);
    border-top: 1px solid rgba(32, 44, 39, .06);
    border-bottom: 1px solid rgba(32, 44, 39, .06);
}

/* 3. Split Editorial Banner */
.nara-split-banner {
    background: var(--brand-surface);
    border: 1px solid rgba(32, 44, 39, .08);
    border-radius: 20px;
    box-shadow: 0 12px 32px rgba(32, 44, 39, .05);
}
.nara-split-media img {
    width: 100%;
    height: 100%;
    min-height: 320px;
    object-fit: cover;
    display: block;
}
.nara-pill-link {
    background: var(--brand-background);
    border: 1px solid rgba(32, 44, 39, .12);
    border-radius: 999px;
    color: var(--brand-ink);
    font-size: .85rem;
    font-weight: 600;
    padding: .45rem 1rem;
    text-decoration: none;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.nara-pill-link:hover {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
    color: #fff;
}

/* 4. AI Practice Assistant Spotlight */
.brand-home .brand-assistant {
    background: var(--brand-accent);
    color: var(--brand-ink);
}
.brand-home .brand-assistant .ed-eyebrow { color: var(--brand-ink); }
.nara-assistant-pill {
    background: rgba(255, 255, 255, .65);
    border-radius: 999px;
    padding: .35rem .9rem;
    color: var(--brand-ink);
}
.nara-assistant-card {
    background: var(--brand-surface);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(32, 44, 39, .08);
}
.nara-assistant-option {
    background: var(--brand-background);
    border: 1px solid rgba(32, 44, 39, .08);
    border-radius: 12px;
    color: var(--brand-ink);
    font-weight: 500;
    padding: .75rem 1.1rem;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.nara-assistant-option:hover {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
    color: #fff;
    transform: translateX(3px);
}

/* 5. Guides & Transparency */
.nara-guide-card {
    background: var(--brand-surface);
    border: 1px solid rgba(32, 44, 39, .08);
    border-radius: 16px;
    padding: 1.75rem;
}
.nara-guide-icon {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 12px;
    background: rgba(184, 198, 176, .45);
    color: var(--brand-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}
.nara-delivery-box {
    background: var(--brand-surface);
    border: 1px solid rgba(32, 44, 39, .08);
    border-radius: 18px;
}
.nara-facts-box {
    background: var(--brand-primary);
    color: #fff;
    border-radius: 18px;
}
.nara-facts-box .ed-eyebrow,
.nara-facts-box h3 {
    color: #fff;
}
.nara-facts-box p {
    color: rgba(244, 245, 239, .88);
}
.nara-fact-chip {
    background: rgba(244, 245, 239, .14);
    border: 1px solid rgba(244, 245, 239, .24);
    border-radius: 999px;
    color: #fff;
    font-size: .78rem;
    font-weight: 600;
    padding: .3rem .8rem;
}

/* Journal post cards on home & blog */
.cz-editorial .ed-post-image {
    border-radius: 14px;
    background: linear-gradient(135deg, #2D5746, #193329);
    aspect-ratio: 16 / 10;
    overflow: hidden;
}
.cz-editorial .ed-post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.cz-editorial .ed-post:hover .ed-post-image img {
    transform: scale(1.04);
}
.cz-editorial .col-md-4:nth-child(3n+2) .ed-post-image {
    background: linear-gradient(135deg, #4A5D52, #24352C);
}
.cz-editorial .col-md-4:nth-child(3n) .ed-post-image {
    background: linear-gradient(135deg, #595247, #2B2924);
}
.cz-editorial .ed-post > span {
    color: var(--brand-primary);
}
.cz-editorial .ed-post:hover {
    color: var(--brand-primary);
}

/* Newsletter & High-Trust Footer */
.cz-editorial .ed-newsletter {
    background: var(--brand-primary);
}
.cz-editorial .ed-newsletter .ed-eyebrow {
    color: var(--brand-accent);
}
.cz-editorial .ed-newsletter .form-control {
    border-radius: 999px;
    padding-left: 1.25rem;
}
.cz-editorial .ed-newsletter .btn-primary {
    background: var(--brand-ink);
    border-color: var(--brand-ink);
    color: #fff;
}
.cz-editorial .ed-newsletter .btn-primary:hover {
    background: #000;
    border-color: #000;
}

.nara-footer {
    background: #1B2722 !important;
    color: #EAECE6;
}
.nara-footer-trust {
    background: #20312A;
    border-color: rgba(244, 245, 239, .10) !important;
}
.nara-trust-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 12px;
    background: rgba(184, 198, 176, .16);
    color: var(--brand-accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
}
.nara-footer-muted {
    color: rgba(244, 245, 239, .74) !important;
}
.nara-footer-contact {
    background: rgba(244, 245, 239, .05);
    border: 1px solid rgba(244, 245, 239, .10);
}
.nara-footer-link {
    color: rgba(244, 245, 239, .78) !important;
    transition: color .15s ease;
}
.nara-footer-link:hover {
    color: #fff !important;
}
.nara-footer-shipping-band {
    background: rgba(244, 245, 239, .05);
    border: 1px solid rgba(244, 245, 239, .10);
}
.nara-ship-pill {
    background: rgba(244, 245, 239, .09);
    border: 1px solid rgba(244, 245, 239, .15);
    border-radius: 999px;
    color: #fff;
    font-size: .76rem;
    padding: .3rem .75rem;
}
.nara-ship-pill-muted {
    background: rgba(217, 207, 195, .10);
    color: rgba(244, 245, 239, .82);
}
.nara-pay-badge {
    background: rgba(255, 255, 255, .10);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 6px;
    color: #fff;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .03em;
    padding: .22rem .55rem;
}

.brand-availability { background: var(--brand-surface); border-color: var(--brand-accent) !important; border-radius: 12px; }
.brand-facts { padding-left: 1.1rem; }
.brand-facts li { margin-bottom: .35rem; }

.cz-editorial :focus-visible { outline: 3px solid var(--brand-primary); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
    .cz-editorial *, .cz-editorial *::before, .cz-editorial *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
