/* ══════════════════════════════════════
   GUEST USER PAGE STYLES
   Path: /assets/css/guest-styles.css
   Note: Form field styles (inputs, labels, tabs, buttons,
   password toggle, remember me, lost password, terms, errors)
   are handled by the plugin: lmsc-auth.css
══════════════════════════════════════ */

/* ── Hero with login card ── */
.gu-hero {
    position: relative;
    background-image: url('https://6908d06c-1878-4ee2-809a-2b4427f7e3f4.express.conves.io/wp-content/uploads/2026/06/Background-Image-1.webp');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 64px 20px 72px;
    overflow: hidden;
}

.gu-hero-inner {
    max-width: 1250px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
}

.gu-hero-copy h1 {
    font-family: "Poppins", sans-serif;
    font-size: 44px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.18;
    margin: 0 0 22px;
    letter-spacing: -0.5px;
}

.gu-hero-copy p {
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: rgba(255,255,255,0.78);
    line-height: 1.7;
    margin: 0 0 18px;
}

.gu-hero-copy p strong { color: #ffffff; font-weight: 600; }

/* ── Auth card ── */
.gu-auth-card {
    border: 1px solid #ffffff;
    border-radius: 18px;
    padding: 32px 36px 36px;
    box-shadow: 0 12px 36px rgba(0,0,0,0.25);
    position: relative;
    z-index: 1;
}

/* Ensure plugin eye button stays clickable */
.lmsc-pass { position: relative; z-index: 1; }
.lmsc-eye-btn { z-index: 2; pointer-events: all !important; overflow: visible !important; }
.lmsc-eye-btn svg { overflow: visible !important; pointer-events: none; }
.lmsc-pass .lmsc-input { padding-right: 46px !important; }

/* Social login row */
.gu-social { margin-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.gu-social .nsl-container { background: transparent !important; border: 0 !important; padding: 0 !important; }
.gu-social .nsl-button {
    width: 100% !important;
    height: 44px !important;
    border-radius: 8px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* ── Guarantee ── */
.gu-guarantee { background: #f0f4f7; padding: 64px 20px 8px; }
.gu-guarantee-inner { max-width: 1250px; margin: 0 auto; }

.gu-guarantee-title {
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-size: 36px;
    font-weight: 700;
    color: #002434;
    margin: 0 0 25px;
    line-height: 1.2;
}

/* ── Info rows ── */
.gu-row { background: #f0f4f7; padding: 32px 20px; }

.gu-row-inner {
    max-width: 1250px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}

.gu-row.is-flipped .gu-row-inner { direction: rtl; }
.gu-row.is-flipped .gu-row-inner > * { direction: ltr; }

.gu-row-media img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 16px;
    object-fit: cover;
}

.gu-row-copy h3 {
    font-family: "Poppins", sans-serif;
    font-size: 26px;
    font-weight: 600;
    color: #002434;
    margin: 0 0 16px;
    line-height: 1.3;
}

.gu-row-copy p {
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #5b6675;
    line-height: 1.75;
    margin: 0 0 22px;
}

.gu-row-copy .gu-row-cta-line {
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #002434;
    margin: 0 0 14px;
}

.gu-row-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 30px;
    background: #12608e;
    color: #ffffff;
    text-decoration: none;
    border-radius: 999px;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 600;
    transition: background 0.2s ease;
}

.gu-row-btn:hover { background: #0f5d82; color: #ffffff; }

/* ── Feature cards ── */
.gu-features { background: #f0f4f7; padding: 48px 20px 56px; }

.gu-features-inner {
    max-width: 1250px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.gu-feature {
    background: #002434;
    border-radius: 14px;
    padding: 32px 28px;
    text-align: center;
    color: #ffffff;
}

.gu-feature-icon {
    width: 56px;
    height: 56px;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gu-feature-icon img,
.gu-feature-icon svg { width: 100%; height: 100%; object-fit: contain; }

.gu-feature h4 {
    font-family: "Poppins", sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 14px;
    line-height: 1.3;
}

.gu-feature p {
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: rgba(255,255,255,0.78);
    line-height: 1.65;
    margin: 0;
}

/* ── FAQ ── */
.gu-faq { background: #f0f4f7; padding: 56px 20px 72px; }
.gu-faq-inner { max-width: 880px; margin: 0 auto; }

.gu-faq-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 14px;
    padding: 8px 22px;
    background: #1376ad;
    color: #ffffff;
    border-radius: 999px;
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 600;
}

.gu-faq-head { text-align: center; margin-bottom: 32px; }

.gu-faq-title {
    font-family: "Poppins", sans-serif;
    font-size: 36px;
    font-weight: 700;
    color: #002434;
    margin: 0;
    line-height: 1.2;
}

.gu-faq-card {
    background: #ffffff;
    border-radius: 14px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,32,62,0.04);
}

.gu-faq-card-head {
    background: #002434;
    color: #ffffff;
    text-align: center;
    padding: 14px 20px;
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.gu-faq-list {
    padding: 18px 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.gu-faq-item {
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid #e3ecf3;
    overflow: hidden;
}

.gu-faq-q {
    width: 100%;
    background: #002434;
    color: #ffffff;
    border: 0;
    padding: 16px 24px;
    text-align: left;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-radius: 18px;
    transition: background 0.2s ease, border-radius 0.2s ease;
}

.gu-faq-item.is-open .gu-faq-q { border-radius: 0; }
.gu-faq-q:hover { background: #0f3155; }

.gu-faq-q-icon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    transition: transform 0.25s ease;
}

.gu-faq-item.is-open .gu-faq-q-icon { transform: rotate(45deg); }

.gu-faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.gu-faq-item.is-open .gu-faq-a { max-height: 500px; }

.gu-faq-a-inner {
    padding: 16px 26px 18px;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #5b6675;
    line-height: 1.7;
}

/* ── Closing quote ── */
.gu-closer {
    background-image:
        linear-gradient(rgba(0,36,52,0.3), rgba(0,36,52,0.3)),
        url('https://6908d06c-1878-4ee2-809a-2b4427f7e3f4.express.conves.io/wp-content/uploads/2026/06/3gkbsdhor4qeex0j3ofu88f846b4qzuu.webp');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 64px 20px 72px;
    text-align: center;
}

.gu-closer-inner { max-width: 980px; margin: 0 auto; }

.gu-closer-mark {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 28px;
    color: #4a6878;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 56px;
    font-weight: 700;
    line-height: 1;
    padding-top: 14px;
}

.gu-closer h2 {
    font-family: "Poppins", sans-serif;
    font-size: 34px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.35;
    margin: 0;
}

/* ── Responsive ── */
@media (max-width: 960px) {
    .gu-hero         { padding: 48px 16px 56px; }
    .gu-hero-inner   { grid-template-columns: 1fr; gap: 36px; }
    .gu-hero-copy    { order: 2; }
    .gu-auth-card    { order: 1; padding: 26px 22px 28px; }
    .gu-hero-copy h1 { font-size: 32px; }
}

@media (max-width: 880px) {
    .gu-row-inner                        { grid-template-columns: 1fr; gap: 24px; }
    .gu-row.is-flipped .gu-row-inner     { direction: ltr; }
    .gu-row.is-flipped .gu-row-media     { order: -1; }
    .gu-row-copy h3                      { font-size: 22px; }
    .gu-features-inner                   { grid-template-columns: 1fr; gap: 16px; }
}

@media (max-width: 768px) {
    .gu-closer { background-attachment: scroll; }
}

@media (max-width: 640px) {
    .gu-guarantee       { padding: 44px 16px 4px; }
    .gu-guarantee-title { font-size: 26px; margin-bottom: 32px; }
    .gu-closer          { padding: 48px 16px 56px; }
    .gu-closer h2       { font-size: 22px; }
    .gu-closer-mark     { width: 56px; height: 56px; font-size: 44px; }
}

@media (max-width: 580px) {
    .gu-faq     { padding: 40px 16px 52px; }
    .gu-faq-title { font-size: 26px; }
    .gu-faq-q   { padding: 14px 18px; font-size: 13px; }
}