/* ==========================================================================
   Ebook Landing Page – ebook-page.css
   ========================================================================== */

/* ── Page wrapper ─────────────────────────────────────────────────────────── */
.eb-wrapper {
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 100dvh;
    width: 100%;
}

/* ── Hero ─────────────────────────────────────────────────────────────────── */
.eb-hero {
    background: #ffffff;
    padding: clamp(80px, 9vw, 120px) 0 clamp(56px, 7vw, 96px);
}

.eb-hero__col-visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 575px) {
    .eb-form-card {
        padding: 1.5rem 1.25rem;
        border-radius: 1.5rem;
    }
}

.eb-hero__heading {
    font-family: "Poppins", sans-serif;
    font-size: clamp(2rem, 3.5vw, 3.625rem);
    font-weight: 700;
    line-height: 122%;
    color: #7139d1;
    margin-bottom: 20px;
}

.eb-hero__subtext {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1rem, 1.4vw, 1.25rem);
    font-weight: 400;
    color: #484848;
    line-height: normal;
    margin-bottom: 32px;
}

.eb-hero__book {
    width: 100%;
    max-width: 44rem;
    max-height: 44rem;
    height: auto;
    filter: drop-shadow(0 24px 48px rgba(113, 57, 209, 0.2));
    animation: eb-float 4s ease-in-out infinite;
}

@media (max-width: 991px) {
    .eb-hero__book { max-width: 20rem; max-height: 20rem; }
}

@keyframes eb-float {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-14px); }
}

/* ── Form card ────────────────────────────────────────────────────────────── */
/*
 * Gradient border replicates the SVG exactly:
 * linearGradient: #7139D1 0% → white(0.01) 40% → white(0.01) 57% → #7139D1(0.6) 100%
 * The fill rect has mix-blend-mode:luminosity + opacity:0.5 on the group.
 * Achieved via ::before mask technique so border-radius is preserved.
 */
.eb-form-card {
    position: relative;
    background: rgba(253, 253, 253, 0.5);
    border-radius: 2.875rem;          /* rx="46" from SVG */
    -webkit-backdrop-filter: blur(50px);
    backdrop-filter: blur(50px);
    padding: 2.25rem 2.875rem 2rem;
    z-index: 0;
}

.eb-form-card > * {
    position: relative;
    z-index: 1;
}

/* Gradient border using pseudo-element + mask trick */
.eb-form-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 5px;                     /* stroke-width="5" from SVG */
    background: linear-gradient(
        165deg,
        #7139d1            0%,        /* stop-color="#7139D1" offset="0" */
        rgba(255,255,255,0.01) 40.6%, /* stop-color="white" stop-opacity="0.01" offset="0.405687" */
        rgba(255,255,255,0.01) 57.4%, /* stop-color="white" stop-opacity="0.01" offset="0.574372" */
        rgba(113,57,209,0.6)  100%    /* stop-color="#7139D1" stop-opacity="0.6" offset="1" */
    );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 0;
}

.eb-form-card__label {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.5rem, 2.5vw, 2.625rem);
    font-weight: 600;
    color: #222D39;
    line-height: 1.2;
    margin-bottom: 1.5rem;
}

/* field label text above each input */
.eb-form__field-label {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: #222D39;
    line-height: normal;
    margin-bottom: 6px;
}

.eb-form__group input,
.eb-form__group select {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid #ddd8f8;
    border-radius: 10px;
    font-family: "Poppins", sans-serif;
    font-size: 0.875rem;
    color: #1a1a2e;
    background: #ffffff;
    outline: none;
    transition: border-color 0.2s;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}

.eb-form__group input::placeholder {
    color: #aaa8cc;
}

.eb-form__group input:focus,
.eb-form__group select:focus {
    border-color: #7139d1;
}

.eb-form__group select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23A2A2A2' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 36px;
    cursor: pointer;
    color: #A2A2A2 !important;
}

/* ── Full-page overlay ───────────────────────────────────────────── */
.eb-page-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    align-items: center;
    justify-content: center;
}

.eb-page-overlay.is-active {
    display: flex;
}

.eb-page-spinner {
    width: 3rem;
    height: 3rem;
    border: 4px solid rgba(255, 255, 255, 0.25);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: eb-spin 0.7s linear infinite;
}

/* ── Form validation ─────────────────────────────────────────────── */
.eb-form__error {
    display: none;
    font-family: "Poppins", sans-serif;
    font-size: 0.7rem;
    color: #e53e3e;
    margin-top: 0.25rem;
}

.eb-form__group.has-error .eb-form__error {
    display: block;
}

.eb-form__group.has-error input,
.eb-form__group.has-error select,
.eb-form__group.has-error .iti input[type="tel"] {
    border-color: #e53e3e !important;
}

/* ── intl-tel-input overrides ────────────────────────────────────── */
.eb-form__group .iti {
    width: 100%;
}

.eb-form__group .iti input[type="tel"] {
    padding-left: 52px;
}

.eb-form__group .iti--separate-dial-code input[type="tel"] {
    padding-left: 80px;
}

.eb-form__group .iti__flag-container {
    z-index: 2;
}

.eb-btn-download {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 14px 32px;
    background: #7139d1;
    color: #fff;
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    border: none;
    border-radius: 9999px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: background 0.25s, transform 0.2s;
    margin-top: 4px;
}

.eb-btn-download:hover {
    background: #5a2bba;
    transform: translateY(-2px);
    color: #fff;
}

/* loading state */
@keyframes eb-spin {
    to { transform: rotate(360deg); }
}

.eb-btn-download .eb-spinner {
    display: none;
    width: 1.1rem;
    height: 1.1rem;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: eb-spin 0.65s linear infinite;
    flex-shrink: 0;
}

.eb-btn-download.is-loading {
    cursor: not-allowed;
    opacity: 0.85;
    pointer-events: none;
}

.eb-btn-download.is-loading .eb-btn-text {
    display: none;
}

.eb-btn-download.is-loading .eb-spinner {
    display: inline-block;
}

/* ── Banner strip ─────────────────────────────────────────────────────────── */
.eb-banner {
    background: #fff;
    padding: 3.375rem 0;
}

.eb-banner__card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    background: #7139d1;
    border-radius: 1.875rem;
    padding: 3.375rem 10.9375rem;
    text-align: center;
}

@media (max-width: 991px) {
    .eb-banner__card {
        padding: 2.5rem 3rem;
    }
}

@media (max-width: 575px) {
    .eb-banner__card {
        padding: 2rem 1.5rem;
        border-radius: 1.25rem;
    }
}

.eb-banner__text {
    font-size: clamp(1.1rem, 2.5vw, 2rem);
    font-weight: 700;
    font-style: normal;
    line-height: normal;
    color: #fff;
    text-align: center;
    margin: 0;
    max-width: min(57.29rem, 100%);
}

/* ── Book intro ───────────────────────────────────────────────────────────── */
.eb-intro {
    padding: clamp(48px, 8vw, 96px) 0;
    background: #fff;
}

.eb-intro__eyebrow {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1rem, 1.8vw, 2rem);
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    color: #000;
    /* text-align: center; */
    margin-bottom: 28px;
}

.eb-intro__title {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.75rem, 3.2vw, 3.625rem);
    font-weight: 700;
    font-style: normal;
    line-height: 122%;
    color: #7139d1;
    margin: 0;
}

.eb-intro__title p {
    margin-bottom: 0;
}

.eb-intro__author {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.75rem, 3.2vw, 3.625rem);
    font-weight: 500;
    font-style: normal;
    line-height: 122%;
    color: #7139d1;
}

.eb-intro__body p {
    font-family: "Poppins", sans-serif;
    font-size: clamp(0.95rem, 1.4vw, 1.625rem);
    font-weight: 400;
    font-style: normal;
    line-height: 154%;
    color: #8A8A8A;
    margin-bottom: 16px;
}

.eb-intro__body p:last-child {
    margin-bottom: 0;
}

.eb-intro__body strong {
    color: #7139d1;
}

/* ── Features ─────────────────────────────────────────────────────────────── */
.eb-features {
    padding: clamp(48px, 8vw, 96px) 0;
}

.eb-features__heading {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.75rem, 3.2vw, 3.625rem);
    font-weight: 500;
    font-style: normal;
    line-height: 122%;
    color: #1a1a2e;
    margin: 0;
}

.eb-features__heading strong {
    font-weight: 700;
    display: block;
}

.eb-feature-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1.25rem;
    border-radius: 1.5245rem;
    background: linear-gradient(152deg, rgba(113, 57, 209, 0.15) -1.48%, rgba(187, 147, 255, 0) 100%);
    height: 100%;
    transition: transform 0.25s;
}

.eb-feature-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2.894px;
    background: linear-gradient(152deg, rgba(68, 30, 133, 0.14), rgba(50, 0, 136, 1));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.eb-feature-card:hover {
    transform: translateY(-4px);
}

.eb-feature-card__icon {
    width: clamp(3rem, 4.5vw, 4.89719rem);
    height: clamp(3rem, 4.5vw, 4.89719rem);
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.eb-feature-card__icon img {
    width: clamp(2.5rem, 4vw, 4.6rem);
    height: clamp(2.5rem, 4vw, 4.6rem);
    object-fit: contain;
}

.eb-feature-card__title {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1rem, 1.3vw, 1.5rem);
    font-weight: 600;
    font-style: normal;
    line-height: normal;
    color: #222D39;
    margin: 0;
    width: 100%;
}

.eb-feature-card__desc {
    font-family: "Poppins", sans-serif;
    font-size: clamp(0.8rem, 0.9vw, 1rem);
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    color: #373737;
    margin: 0;
}

/* ── About / content + screenshot ────────────────────────────────────────── */
.eb-about {
    padding: clamp(48px, 8vw, 96px) 0;
    background: #fff;
}

.eb-about__card {
    display: flex;
    align-items: center;
    gap: 3.875rem;
    padding: clamp(2rem, 4vw, 5rem) 0 clamp(2rem, 4vw, 5rem) clamp(2rem, 5vw, 7.3125rem);
    border-radius: 2.625rem;
    border: 1px solid #D2D2D2;
    background: #FCFAFE;
    overflow: hidden;
}

.eb-about__body p {
    font-family: "Poppins", sans-serif;
    font-size: clamp(0.95rem, 1.1vw, 1.25rem);
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    color: #8A8A8A;
    align-self: stretch;
    margin-bottom: 1rem;
}

.eb-about__body p:last-child {
    margin-bottom: 0;
}

.eb-about__link {
    color: #5759F8;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.eb-about__link:hover {
    color: #3a3bd4;
}

.eb-about__screenshot {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── CTA section ──────────────────────────────────────────────────────────── */
.eb-cta {
    padding: clamp(48px, 8vw, 96px) 0;
    background: #fff;
}

.eb-cta__card {
    position: relative;
    background: linear-gradient(180deg, rgba(113, 57, 209, 0.11) 0%, rgba(187, 147, 255, 0.11) 100%);
    border-radius: 17.52513rem;
    box-shadow: 0 -6.163px 24.651px 0 rgba(255, 255, 255, 0.16) inset;
    padding: clamp(2.5rem, 5vw, 5.5rem) clamp(2rem, 8vw, 17.5rem);
    overflow: hidden;
}

.eb-cta__star {
    position: absolute;
    width: 3.84406rem;
    height: 3.84525rem;
    pointer-events: none;
    display: flex;
    backdrop-filter: blur(5.543px);
    -webkit-backdrop-filter: blur(5.543px);
}

.eb-cta__star svg {
    width: 100%;
    height: 100%;
}

.eb-cta__star--tl { top: 50%; left: 6%; transform: translateY(-50%); }
.eb-cta__star--tr { top: 50%; right: 6%; transform: translateY(-50%); }

.eb-cta__heading {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.5rem, 3.2vw, 3.625rem);
    font-weight: 500;
    font-style: normal;
    line-height: 122%;
    color: #000;
    text-align: center;
    margin: 0 0 36px;
}

.eb-btn-cta {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.625rem 0.625rem 0.625rem 2.625rem;
    height: 5.625rem;
    background: linear-gradient(94deg, #7239D1 0%, #F741E8 100.42%);
    color: #fff;
    font-family: inherit;
    font-size: clamp(1.25rem, .875rem + 1vw, 1.75rem);
    font-weight: 500;
    border-radius: 3.78719rem;
    text-decoration: none;
    transition: opacity 0.25s, transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 8px 28px rgba(113, 57, 209, 0.45);
}

.eb-btn-cta:hover {
    background: #8a50e0;
    transform: translateY(-3px);
    box-shadow: 0 14px 40px rgba(113, 57, 209, 0.6);
    color: #fff;
}

.eb-btn-cta__arrow {
    width: 4.375rem;
    height: 4.375rem;
    flex-shrink: 0;
}

/* ── Testimonials ─────────────────────────────────────────────────────────── */
.eb-testimonials {
    padding: clamp(48px, 8vw, 96px) 0 clamp(64px, 10vw, 112px);
    background: #fff;
}

.eb-testimonials__heading {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.5rem, 2.8vw, 3.125rem);
    font-weight: 500;
    font-style: normal;
    line-height: 149.73%;
    color: #222039;
    margin: 0 0 12px;
}

.eb-testimonials__heading strong {
    display: block;
    font-weight: 700;
}

.eb-testimonials__sub {
    font-family: "Poppins", sans-serif;
    font-size: clamp(0.875rem, 1.1vw, 1.25rem);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: #8A8A8A;
    margin: 0 0 28px;
}

.eb-testimonials__nav {
    display: flex;
    gap: 12px;
}

.eb-testimonials__btn {
    width: 2.19925rem;
    height: 2.19925rem;
    border-radius: 50%;
    border: 2px solid #7139d1;
    background: transparent;
    color: #7139d1;
    font-size: 1.1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, color 0.2s;
}

.eb-testimonials__btn:not(:disabled) {
    background: #7139d1;
    color: #fff;
    border-color: #7139d1;
}

.eb-testimonials__btn:disabled {
    cursor: not-allowed;
    display: flex !important;
    width: 2.19925rem !important;
    height: 2.19925rem !important;
    padding: 0.3125rem !important;
    align-items: flex-start !important;
    gap: 0.625rem !important;
    border-radius: 1.09963rem !important;
    background: #C3ACF2 !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.eb-testimonials__wrapper {
    overflow: hidden;
    width: 100%;
}

.eb-testimonials__slider {
    display: grid;
    grid-template-columns: repeat(var(--eb-slide-count, 3), 100%);
    transition: transform 0.4s ease;
    will-change: transform;
}

.eb-testimonials__slider .eb-testimonial-card {
    width: 100%;
    min-width: 0;
}

/* ── Testimonial card ─────────────────────────────────────────────────────── */
.eb-testimonial-card {
    background: #faf9ff;
    border: 1.5px solid #ede9ff;
    border-radius: 16px;
    padding: 28px 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

.eb-testimonial-card__quote {
    width: 3.125rem;
    height: 3.125rem;
    flex-shrink: 0;
}

.eb-testimonial-card__text {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1rem, 1.8vw, 2.125rem);
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    color: #222D39;
    align-self: stretch;
    margin: 0;
    flex: 1;
}

.eb-testimonial-card__author {
    display: flex;
    align-items: center;
    gap: 12px;
}

.eb-testimonial-card__avatar {
    width: 5rem;
    height: 5rem;
    aspect-ratio: 1 / 1;
    border-radius: 6.25rem;
    object-fit: cover;
    flex-shrink: 0;
    display: block;
}

.eb-testimonial-card__name {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.25rem, 1.8vw, 2rem);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    color: #222D39;
    margin: 0;
}

.eb-testimonial-card__handle {
    font-family: "Poppins", sans-serif;
    font-size: clamp(0.75rem, 0.9vw, 1rem);
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    color: #8A8A8A;
    margin: 0;
}