/* Gated product landing pages (/store-planner, /gf-custom).
   Shared stylesheet. Site chrome inherited from Header/Footer includes. */

.gl-main { padding: 0; }

.gl-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* Hero */
.gl-hero {
    background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%);
    padding: 64px 0 48px;
    border-bottom: 1px solid #E5E7EB;
}
.gl-eyebrow {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #2F6DAE;
    padding: 4px 10px;
    border: 1px solid #2F6DAE;
    border-radius: 4px;
    margin-bottom: 16px;
}
.gl-headline {
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: clamp(1.75rem, 3.5vw, 2.75rem);
    line-height: 1.2;
    color: #1F3A5F;
    margin: 0 0 16px;
    max-width: 820px;
}
.gl-subhead {
    font-size: 1.0625rem;
    line-height: 1.55;
    color: #4B5563;
    margin: 0;
    max-width: 760px;
}

/* Body: features + login side by side */
.gl-body {
    padding: 48px 0 80px;
}
.gl-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 48px;
    align-items: start;
}
@media (max-width: 820px) {
    .gl-grid { grid-template-columns: 1fr; gap: 32px; }
}

.gl-features h2 {
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 1.5rem;
    color: #1F3A5F;
    margin: 0 0 20px;
}
.gl-feature-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.gl-feature-list li {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-left: 20px;
    border-left: 3px solid #2F6DAE;
}
.gl-feature-list li strong {
    font-weight: 600;
    color: #1F3A5F;
    font-size: 1.0625rem;
    line-height: 1.3;
}
.gl-feature-list li span {
    color: #4B5563;
    font-size: 0.9375rem;
    line-height: 1.5;
}

/* FAQ block (above the login column) */
.gl-faq {
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid #E5E7EB;
}
.gl-faq h2 {
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 1.5rem;
    color: #1F3A5F;
    margin: 0 0 16px;
}
.gl-faq .faq-item {
    margin-bottom: 18px;
}
.gl-faq .faq-item h3 {
    font-size: 1rem;
    font-weight: 600;
    color: #1F3A5F;
    margin: 0 0 6px;
}
.gl-faq .faq-item p {
    color: #4B5563;
    font-size: 0.9375rem;
    line-height: 1.55;
    margin: 0;
}

/* Login card */
.gl-login {
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 28px;
    box-shadow: 0 1px 3px rgba(31, 58, 95, 0.04);
    position: sticky;
    top: 24px;
}
.inline-login__intro {
    font-size: 0.9375rem;
    color: #4B5563;
    margin: 0 0 20px;
    line-height: 1.5;
}
.inline-login__field {
    display: flex;
    flex-direction: column;
    margin-bottom: 14px;
}
.inline-login__field label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1F3A5F;
    margin-bottom: 4px;
}
.inline-login__field input {
    padding: 10px 12px;
    border: 1px solid #D1D5DB;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-family: inherit;
    color: #1F3A5F;
}
.inline-login__field input:focus {
    outline: none;
    border-color: #2F6DAE;
    box-shadow: 0 0 0 3px rgba(47, 109, 174, 0.15);
}
.inline-login__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8125rem;
    margin: 10px 0 18px;
}
.inline-login__remember { color: #6B7280; cursor: pointer; }
.inline-login__remember input { margin-right: 4px; vertical-align: middle; }
.inline-login__forgot { color: #2F6DAE; text-decoration: none; }
.inline-login__forgot:hover { text-decoration: underline; }
.inline-login__submit {
    width: 100%;
    padding: 12px;
    background: #1F3A5F;
    color: #FFFFFF;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}
.inline-login__submit:hover { background: #2F6DAE; }
.inline-login__signup {
    font-size: 0.8125rem;
    color: #6B7280;
    margin: 16px 0 0;
    text-align: center;
}
.inline-login__signup a { color: #2F6DAE; text-decoration: none; }
.inline-login__signup a:hover { text-decoration: underline; }
