/*
 * NewHayven — Homepage section styles
 *
 * Moved out of inline style="" attributes in front-page.php (v1.2.0) so the
 * homepage can later be rebuilt as Gutenberg block patterns. Every value here
 * is copied verbatim from the old inline styles, so the rendered page is
 * unchanged. Class names follow the section they belong to (nh-home-<section>__<part>).
 */

/* ---------- Section styles (verbatim from former inline styles) ---------- */
.nh-home-hero__eyebrow,
.nh-home-capital__eyebrow {
    color: #8B7355;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.68px;
}
.nh-home-hero__title {
    font-size: 98px;
    font-family: 'Playfair Display', serif;
    line-height: 114.40px;
    color: #802446;
}
.nh-home-hero__lead {
    font-size: 18px;
    line-height: 30.60px;
    color: #333333;
}
.nh-home-hero__actions {
    display: flex;
    gap: 24px;
}
a.nh-home-btn--dark,
.nh-home-btn--dark > .wp-block-button__link {
    padding: 14px 28px;
    background: #1A1A1A;
    color: white;
    font-size: 14px;
    font-weight: 600;
    border: none;
    text-decoration: none;
    cursor: pointer;
}
a.nh-home-btn--outline,
.nh-home-btn--outline > .wp-block-button__link {
    padding: 15px 29px;
    border: 1px solid #1A1A1A;
    color: #1A1A1A;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
.nh-home-hero__stats {
    border-top: 1px solid #E8E2D9;
    padding-top: 48px;
    display: flex;
    gap: 80px;
}
.nh-home-hero__stat-num {
    font-size: 48px;
    font-family: 'Playfair Display', serif;
    font-weight: 500;
    color: #802446;
}
.nh-home-hero__stat-label {
    font-size: 14px;
    color: #333333;
}
.nh-home-founder {
    background: #04353A;
    padding: 80px 32px;
    color: white;
}
.nh-home-center {
    text-align: center;
}
.nh-home-founder__eyebrow {
    color: #439CA5;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.68px;
    margin-bottom: 24px;
}
.nh-home-founder__quote {
    font-size: 32px;
    font-style: italic;
    line-height: 48px;
    margin: 0 auto 24px;
    max-width: 900px;
}
.nh-home-founder__name {
    font-size: 18px;
    color: white;
}
.nh-home-founder__role {
    color: #439CA5;
}
.nh-home-story,
.nh-home-compare {
    padding: 80px 32px;
}
.nh-home-story__row {
    display: flex;
    gap: 60px;
    align-items: center;
}
.nh-home-story__text {
    display: flex;
    flex-direction: column;
    gap: 27px;
}
.nh-home-story__pill {
    padding: 11px 18px 10px 17px;
    border: 1px solid #04353A;
    border-radius: 8px;
    width: fit-content;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.68px;
    color: #04353A;
}
.nh-home-story__title,
.nh-home-capital__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    line-height: 70.40px;
    color: #802446;
}
.nh-home-story__intro {
    font-size: 16px;
    line-height: 30.40px;
    color: #333333;
    max-width: 642px;
}
.nh-home-story__body,
.nh-home-capital__body {
    font-size: 16px;
    line-height: 30.40px;
    color: #333333;
}
img.nh-home-story__img {
    width: 464px;
    height: 544px;
    object-fit: cover;
    object-position: center;
    border-radius: 40px;
    box-shadow: 0px 4px 28px 16px rgba(0, 0, 0, 0.15);
    flex-shrink: 0;
}
.nh-home-capital,
.nh-home-invest,
.nh-home-learn,
.nh-home-faq {
    background: #F5F0E8;
    padding: 80px 32px;
}
.nh-home-capital__row {
    display: flex;
    gap: 60px;
}
.nh-home-capital__callouts {
    display: flex;
    flex-direction: column;
    gap: 27px;
    width: 398px;
    flex-shrink: 0;
}
.nh-home-callout--teal {
    border: 2px solid #005D63;
    border-radius: 16px;
    padding: 24px 16px;
    background: white;
    text-align: center;
}
.nh-home-callout__num--teal {
    font-size: 56px;
    font-family: 'Playfair Display', serif;
    color: #005D63;
    margin-bottom: 8px;
}
.nh-home-callout__text--teal {
    font-size: 16px;
    color: #005D63;
}
.nh-home-callout--maroon {
    border: 2px solid #802446;
    border-radius: 16px;
    padding: 24px 16px;
    background: white;
    text-align: center;
}
.nh-home-callout__num--maroon {
    font-size: 56px;
    font-family: 'Playfair Display', serif;
    color: #802446;
    margin-bottom: 8px;
}
.nh-home-callout__text--maroon {
    font-size: 16px;
    color: #802446;
}
.nh-home-callout--dark {
    border: 2px solid #04353A;
    border-radius: 16px;
    padding: 24px 16px;
    background: white;
    text-align: center;
}
.nh-home-callout__num--dark {
    font-size: 56px;
    font-family: 'Playfair Display', serif;
    color: #04353A;
    margin-bottom: 8px;
}
.nh-home-callout__text--dark {
    font-size: 16px;
    color: #04353A;
}
.nh-home-capital__text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.nh-home-capital__kicker {
    font-size: 16px;
    line-height: 30.40px;
    color: #802446;
    font-weight: 600;
}
.nh-home-compare__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    margin-bottom: 24px;
    color: #055E63;
}
.nh-home-compare__lead {
    font-size: 18px;
    color: #333333;
    margin-bottom: 40px;
}
.nh-home-compare__split {
    display: flex;
    gap: 0;
    border-radius: 23px;
    overflow: hidden;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
}
.nh-home-compare__do {
    flex: 1;
    background: #802446;
    color: white;
    padding: 65px 59px 65px 71px;
    text-align: left;
}
.nh-home-compare__do-title {
    font-size: 24px;
    font-family: 'Playfair Display', serif;
    margin-bottom: 33px;
}
.nh-home-compare__do-list,
.nh-home-fit__no-list {
    list-style: none;
    padding: 0;
}
.nh-home-compare__dont {
    flex: 1;
    background: #ECDEE3;
    padding: 65px 54px 111px 74px;
    text-align: left;
}
.nh-home-compare__dont-title {
    font-size: 24px;
    font-family: 'Playfair Display', serif;
    margin-bottom: 31px;
    color: black;
}
.nh-home-compare__dont-list {
    list-style: none;
    padding: 0;
    color: black;
}
.nh-home-invest__row {
    display: flex;
    align-items: center;
    gap: 48px;
}
.nh-home-invest__main {
    flex: 1 1 56%;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.nh-home-invest__head {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.nh-home-invest__title {
    font-size: 52px;
    font-family: 'Playfair Display', serif;
    line-height: 57px;
    color: #055E63;
}
.nh-home-invest__lead {
    font-size: 18px;
    line-height: 25.50px;
    color: #333333;
}
img.nh-home-invest__img {
    width: 100%;
    height: 297px;
    object-fit: cover;
    object-position: center;
    border-radius: 17px;
    box-shadow: 0px 4px 28px 16px rgba(0, 0, 0, 0.15);
}
.nh-home-invest__points {
    flex: 1 1 44%;
    display: flex;
    flex-direction: column;
    gap: 56px;
}
.nh-home-invest__point {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.nh-home-invest__label {
    color: #802446;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.12px;
}
.nh-home-invest__rule {
    width: 140px;
    height: 2px;
    background: #802446;
}
.nh-home-invest__text {
    font-size: 22px;
    font-family: 'Jost', sans-serif;
    color: #1A1A1A;
    margin: 0;
    line-height: 28px;
}
.nh-home-wwd {
    background: white;
    padding: 80px 32px;
    border-bottom: 1px solid #D8D0C5;
}
.nh-home-wwd__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    line-height: 70.40px;
    margin-bottom: 16px;
    color: #055E63;
}
.nh-home-wwd__lead {
    font-size: 18px;
    color: black;
    margin-bottom: 40px;
}
.nh-home-wwd__tabs {
    border-bottom: 2px solid #E8E2D9;
    display: flex;
    justify-content: center;
    gap: 46px;
    margin-bottom: 40px;
}
.nh-home-wwd__panel {
    background: #FEFEFD;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
    border-radius: 32px;
    padding: 40px;
    text-align: left;
}
.nh-home-wwd__card {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.nh-home-wwd__card-title {
    font-size: 20px;
    color: #1A1A1A;
}
.nh-home-wwd__card-text {
    font-size: 14px;
    line-height: 24.48px;
    color: #333333;
    flex: 1;
}
.nh-home-wwd__card-link {
    color: #055E63;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
.nh-home-confid {
    background: white;
    padding: 48px 32px;
}
.nh-home-confid__box {
    background: #04353A;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.16);
    border-radius: 40px;
    padding: 56px 40px 112px;
    text-align: center;
}
.nh-home-confid__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    line-height: 70.40px;
    color: white;
    margin-bottom: 40px;
}
.nh-home-confid__intro {
    font-size: 18px;
    line-height: 32.30px;
    color: rgba(255,255,255,0.6);
    margin-bottom: 24px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}
.nh-home-confid__body {
    font-size: 18px;
    line-height: 32.30px;
    color: rgba(255,255,255,0.6);
    margin-bottom: 56px;
}
.nh-home-confid__stats {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}
.nh-home-confid__stat {
    background: #055E63;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
    border-radius: 14px;
    padding: 24px 60px;
}
.nh-home-confid__stat-num {
    font-size: 48px;
    font-family: 'Playfair Display', serif;
    color: white;
}
.nh-home-confid__stat-label {
    font-size: 14px;
    color: rgba(255,255,255,0.5);
}
.nh-home-learn__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    line-height: 70.40px;
    margin-bottom: 16px;
    color: #802446;
}
.nh-home-learn__lead {
    font-size: 18px;
    color: black;
    margin-bottom: 64px;
}
.nh-home-learn__icon {
    margin: 0 auto;
}
.nh-home-learn__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 64px;
    text-align: center;
}
.nh-home-learn__card {
    background: #FEFEFD;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}
.nh-home-learn__card-title {
    font-size: 16px;
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    color: #1A1A1A;
}
.nh-home-learn__card-text {
    font-size: 12px;
    color: #1A1A1A;
}
.nh-home-fit {
    background: white;
    padding: 120px 32px;
}
.nh-home-fit__row {
    display: flex;
    justify-content: center;
}
.nh-home-fit__split {
    display: flex;
    max-width: 1004px;
    width: 100%;
    gap: 0;
    border-radius: 23px;
    overflow: hidden;
}
.nh-home-fit__yes {
    flex: 1;
    background: #055E63;
    padding: 56px;
}
.nh-home-fit__yes-title {
    font-size: 32px;
    font-family: 'Playfair Display', serif;
    color: white;
    margin-bottom: 8px;
}
.nh-home-fit__yes-lead {
    font-size: 16px;
    color: #CFCFCF;
    margin-bottom: 24px;
}
.nh-home-fit__yes-list {
    list-style: none;
    padding: 0;
    margin-bottom: 32px;
}
.nh-home-fit__note {
    display: inline-block;
    padding: 20px;
    border-radius: 40px;
    border: 2px solid white;
    color: white;
    font-size: 14px;
    font-weight: 500;
}
.nh-home-fit__no {
    flex: 1;
    background: #7DC4C8;
    padding: 56px;
}
.nh-home-fit__no-title {
    font-size: 32px;
    font-family: 'Playfair Display', serif;
    color: black;
    margin-bottom: 8px;
}
.nh-home-fit__no-lead {
    font-size: 16px;
    color: black;
    margin-bottom: 24px;
}
.nh-home-faq__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    line-height: 70.40px;
    margin-bottom: 12px;
    color: #802446;
}
.nh-home-faq__lead {
    font-size: 18px;
    color: #333333;
    margin-bottom: 64px;
}
.nh-home-faq__list {
    max-width: 1000px;
    margin: 0 auto;
    text-align: left;
}
.nh-home-cta__title {
    font-size: 64px;
    font-family: 'Playfair Display', serif;
    margin-bottom: 24px;
}
.nh-home-cta__lead {
    font-size: 18px;
    margin-bottom: 40px;
    color: rgba(255,255,255,0.85);
}
.nh-home-cta__actions {
    display: flex;
    gap: 32px;
    justify-content: center;
}
a.nh-home-btn--light,
.nh-home-btn--light > .wp-block-button__link {
    padding: 14px 28px;
    background: white;
    color: #1B4D3E;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
a.nh-home-btn--outline-light,
.nh-home-btn--outline-light > .wp-block-button__link {
    padding: 15px 29px;
    border: 1px solid white;
    color: white;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
.nh-home-cta {
    padding: 80px 32px;
    color: white;
}

/* ---------- Italic accents inside headings ----------
   Formerly <span style="font-style: italic; color: ...">. Now a plain <em>,
   coloured by the heading it sits in, so an editor pressing "Italic" gets
   the right brand accent automatically. */
.nh-home-hero__title em,
.nh-home-story__title em,
.nh-home-capital__title em,
.nh-home-learn__title em,
.nh-home-faq__title em {
    font-style: italic;
    color: #055E63;
}
.nh-home-compare__title em,
.nh-home-invest__title em,
.nh-home-wwd__title em {
    font-style: italic;
    color: #802446;
}
.nh-home-confid__title em,
.nh-home-cta__title em {
    font-style: italic;
    color: #DAAD28;
}
/* One-off: "loans." in the Investments heading stays teal */
.nh-home-invest__title em.nh-accent-teal {
    color: #055E63;
}

/* ---------- Bold highlights in the Our Story copy ---------- */
.nh-home-story__intro strong,
.nh-home-story__body strong {
    color: #055E63;
    font-weight: 700;
}

/* ---------- List items (styled from the list, not per item) ----------
   Every item gets the divider except the last, matching the old markup. */
.nh-home-compare__do-list li {
    padding: 18px 0;
    color: #EFEFEF;
}
.nh-home-compare__do-list li:not(:last-child) {
    border-bottom: 1px solid white;
}
.nh-home-compare__dont-list li {
    padding: 18px 0;
}
.nh-home-compare__dont-list li:not(:last-child) {
    border-bottom: 1px solid #802446;
}
.nh-home-fit__yes-list li {
    padding: 14px 0;
    color: #EFEFEF;
    font-size: 16px;
}
.nh-home-fit__yes-list li:not(:last-child) {
    border-bottom: 1px solid #0A7F86;
}
.nh-home-fit__no-list li {
    padding: 14px 0;
    color: black;
    font-size: 16px;
}
.nh-home-fit__no-list li:not(:last-child) {
    border-bottom: 1px solid #65A0A3;
}

/* ---------- Responsive ----------
   Class-based replacements for the theme.css rules that matched on inline
   style text ([style*="display: flex"] etc.). Those old rules stay in
   theme.css for the pages that haven't been converted yet. */
@media (max-width: 900px) {
    .nh-home-story__row,
    .nh-home-capital__row,
    .nh-home-invest__row,
    .nh-home-fit__row {
        flex-direction: column;
    }
    .nh-home-capital__row > .nh-home-capital__callouts,
    .nh-home-invest__row > .nh-home-invest__main,
    .nh-home-invest__row > .nh-home-invest__points {
        width: 100% !important;
        flex: 1 1 100% !important;
    }
}
@media (max-width: 720px) {
    .nh-hero__text-inner > div.nh-home-hero__actions,
    .nh-hero__text-inner > div.nh-home-hero__stats {
        flex-wrap: wrap !important;
        gap: 24px !important;
    }
}

/* ==========================================================================
   Block-editor markup (homepage built from the "NewHayven Homepage" pattern)
   The rules above style both the legacy template and the block version. The
   rules below only cover the places where block markup differs from the old
   hand-written HTML, so the block version renders identically.
   ========================================================================== */

/* Text that used to be a <div> is now a paragraph block: no paragraph gap */
p.nh-home-hero__eyebrow,
p.nh-home-hero__stat-num,
p.nh-home-story__pill,
p.nh-home-capital__eyebrow,
p.nh-home-invest__label,
p.nh-home-confid__stat-num,
p.nh-home-fit__note,
p.nh-home-wwd__card-link {
    margin-bottom: 0;
}
/* theme.css shrinks every hero paragraph on tablet/mobile; these two were
   <div>s before, so keep their original size */
@media (max-width: 980px) {
    .nh-hero__text p.nh-home-hero__eyebrow {
        font-size: 12px !important;
        line-height: 1.6 !important;
    }
    .nh-hero__text p.nh-home-hero__stat-num {
        font-size: 48px !important;
        line-height: 1.6 !important;
    }
}

/* Buttons: the class sits on the button wrapper, the link is styled here.
   The wrapper steps out of the layout (display: contents) so the link is the
   flex item, exactly like the old <a>; then WordPress's default button look
   (pill shape, grey fill, full height, centred content) is neutralised. */
.wp-block-button[class*="nh-home-btn--"] {
    display: contents;
}
.wp-block-button[class*="nh-home-btn--"] > .wp-block-button__link {
    display: block;
    height: auto;
    width: auto;
    align-content: normal;
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
    line-height: inherit;
    text-align: inherit;
    word-break: normal;
}
.nh-home-btn--outline > .wp-block-button__link,
.nh-home-btn--outline-light > .wp-block-button__link {
    background: transparent;
}
.nh-home-btn--light > .wp-block-button__link {
    border: none;
}

/* Images: the class sits on the <figure>, the image fills it */
.nh-hero__media .wp-block-image,
figure.nh-home-story__img,
figure.nh-home-invest__img {
    margin: 0;
}
figure.nh-home-story__img {
    flex-shrink: 0;
    width: 464px;
    max-width: 100%;
}
figure.nh-home-story__img > img {
    width: 100%;
    height: 544px;
    object-fit: cover;
    object-position: center;
    border-radius: 40px;
    box-shadow: 0px 4px 28px 16px rgba(0, 0, 0, 0.15);
}
figure.nh-home-invest__img > img {
    width: 100%;
    height: 297px;
    object-fit: cover;
    object-position: center;
    border-radius: 17px;
    box-shadow: 0px 4px 28px 16px rgba(0, 0, 0, 0.15);
}

/* Founder quote: a Quote block wraps its text in a paragraph */
.nh-home-founder__quote.wp-block-quote {
    border-left: 0;
    padding-left: 0;
    margin: 0 auto 24px;
}
.nh-home-founder__quote > p {
    margin: 0;
}

/* Short rule under the Investments labels is a Separator block */
hr.nh-home-invest__rule {
    border: 0;
    margin: 0;
    opacity: 1;
    color: inherit;
}

/* "Learn More" is a link inside a paragraph */
.nh-home-wwd__card-link a {
    color: #055E63;
    text-decoration: none;
}

/* Learn with NewHayven (hidden section, available as its own pattern):
   the 4-column grid overflowed on small screens */
@media (max-width: 900px) {
    .nh-home-learn__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }
}
@media (max-width: 560px) {
    .nh-home-learn__grid {
        grid-template-columns: 1fr;
    }
}