/* ═══════════════════════════════════════════════════════════════
   LQ Student Portal
═══════════════════════════════════════════════════════════════ */

/* ── Hide page title on portal page ── */
body:has([class*="lq-portal"]) .entry-header,
body:has([class*="lq-portal"]) .page-header,
body:has([class*="lq-portal"]) .page-title { display: none !important; }
body:has([class*="lq-portal"]) .entry-content { padding: 0 !important; max-width: 100% !important; }
body:has([class*="lq-portal"]) .site-main { padding: 0 !important; }

/* ═══════════════════════════════════════════════════════════════
   LOGGED-IN: Welcome bar
═══════════════════════════════════════════════════════════════ */
.lq-portal-welcome {
    background: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 100%);
    padding: 48px 24px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.lq-portal-welcome::before {
    content: '';
    position: absolute;
    width: 500px; height: 500px; border-radius: 50%;
    background: radial-gradient(circle, rgba(214,35,4,.15) 0%, transparent 70%);
    top: 50%; left: 50%; transform: translate(-50%,-50%);
}
.lq-portal-welcome-inner { position: relative; }
.lq-portal-hi {
    display: block;
    font-size: 13px; font-weight: 700; letter-spacing: 2px;
    text-transform: uppercase; color: #ff7b5c; margin-bottom: 8px;
}
.lq-portal-welcome h2 {
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 900; color: #fff; margin: 0 0 10px;
}
.lq-portal-welcome p {
    font-size: 16px; color: rgba(255,255,255,.6); margin: 0;
}

/* ═══════════════════════════════════════════════════════════════
   GUEST: Hero
═══════════════════════════════════════════════════════════════ */
.lq-portal-guest { }

.lq-portal-hero {
    background: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 55%, #16213e 100%);
    padding: 80px 24px 100px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.lq-portal-hero::before {
    content: '';
    position: absolute;
    width: 600px; height: 600px; border-radius: 50%;
    background: radial-gradient(circle, rgba(214,35,4,.16) 0%, transparent 70%);
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    animation: lq-portal-pulse 5s ease-in-out infinite;
}
@keyframes lq-portal-pulse {
    0%,100% { transform: translate(-50%,-50%) scale(1);    opacity:.6; }
    50%      { transform: translate(-50%,-50%) scale(1.15); opacity:1; }
}
.lq-portal-hero-badge {
    display: inline-flex; align-items: center;
    background: rgba(214,35,4,.15);
    border: 1px solid rgba(214,35,4,.4);
    color: #ff7b5c;
    font-size: 11px; font-weight: 700; letter-spacing: 3px;
    text-transform: uppercase;
    padding: 7px 18px; border-radius: 30px;
    margin-bottom: 24px; position: relative;
}
.lq-portal-hero h1 {
    font-size: clamp(34px, 5.5vw, 60px);
    font-weight: 900; color: #fff;
    margin: 0 0 16px; line-height: 1.1; position: relative;
}
.lq-portal-hero h1 em { font-style: normal; color: #D62304; }
.lq-portal-hero p {
    font-size: 18px; color: rgba(255,255,255,.65);
    max-width: 520px; margin: 0 auto; line-height: 1.7; position: relative;
}

/* ═══════════════════════════════════════════════════════════════
   GUEST: Auth cards
═══════════════════════════════════════════════════════════════ */
.lq-portal-auth-wrap {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 0;
    max-width: 780px;
    margin: -40px auto 0;
    padding: 0 24px;
    position: relative; z-index: 10;
}
@media(max-width:640px){
    .lq-portal-auth-wrap { flex-direction: column; margin-top: -28px; }
}

.lq-portal-auth-card {
    flex: 1;
    background: #fff;
    border-radius: 24px;
    padding: 40px 36px;
    box-shadow: 0 12px 48px rgba(0,0,0,.12);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}
.lq-auth-login  { border-radius: 24px 0 0 24px; border-right: 1px solid #f0f0f0; }
.lq-auth-register { border-radius: 0 24px 24px 0; }
@media(max-width:640px){
    .lq-auth-login  { border-radius: 24px 24px 0 0; border-right: none; border-bottom: 1px solid #f0f0f0; }
    .lq-auth-register { border-radius: 0 0 24px 24px; }
}

.lq-auth-icon {
    width: 60px; height: 60px; border-radius: 16px;
    background: rgba(214,35,4,.07);
    display: flex; align-items: center; justify-content: center;
    color: #D62304; margin-bottom: 20px;
}
.lq-portal-auth-card h3 {
    font-size: 20px; font-weight: 800; color: #111;
    margin: 0 0 8px;
}
.lq-portal-auth-card p {
    font-size: 14px; color: #777; line-height: 1.6;
    margin: 0 0 28px; flex: 1;
}

.lq-auth-btn {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 14px; font-weight: 700;
    padding: 13px 28px; border-radius: 50px;
    text-decoration: none;
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease;
    width: 100%; justify-content: center;
}
.lq-auth-btn:hover { transform: translateY(-2px); }

.lq-auth-btn--primary {
    background: #D62304; color: #fff;
    box-shadow: 0 6px 24px rgba(214,35,4,.35);
}
.lq-auth-btn--primary:hover {
    background: #b91c00; color: #fff;
    box-shadow: 0 10px 32px rgba(214,35,4,.45);
}
.lq-auth-btn--outline {
    background: #fff; color: #111;
    border: 2px solid #111;
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
}
.lq-auth-btn--outline:hover {
    background: #111; color: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
}

.lq-portal-auth-divider {
    display: flex; align-items: center; justify-content: center;
    padding: 0 4px; color: #ccc; font-size: 13px; font-weight: 600;
    writing-mode: vertical-rl;
    background: #fff;
}
@media(max-width:640px){
    .lq-portal-auth-divider { writing-mode: horizontal-tb; padding: 10px 0; }
}

/* ═══════════════════════════════════════════════════════════════
   GUEST: Features grid
═══════════════════════════════════════════════════════════════ */
.lq-portal-features {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    max-width: 1000px;
    margin: 60px auto 72px;
    padding: 0 24px;
}
@media(max-width:860px){ .lq-portal-features{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px){ .lq-portal-features{ grid-template-columns:1fr; } }

.lq-portal-feature {
    text-align: center; padding: 32px 20px;
    background: #fff; border-radius: 20px;
    box-shadow: 0 2px 18px rgba(0,0,0,.06);
    transition: transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease;
    border-bottom: 3px solid transparent;
}
.lq-portal-feature:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,.1);
    border-bottom-color: #D62304;
}
.lq-pf-icon {
    width: 56px; height: 56px; border-radius: 16px;
    background: rgba(214,35,4,.07);
    display: flex; align-items: center; justify-content: center;
    color: #D62304; margin: 0 auto 14px;
}
.lq-portal-feature h4 { font-size: 15px; font-weight: 800; color: #111; margin: 0 0 6px; }
.lq-portal-feature p  { font-size: 13px; color: #888; line-height: 1.6; margin: 0; }
