@charset "iso-8859-1";
/* Penthouse Magazine LOGIN */
:root {  --gold:        #b38b2d;
 --gold-light:  #d9b14b;
 --gold-glow:   rgba(179, 139, 45, 0.14);
 --gold-dim:    rgba(179, 139, 45, 0.28);
 --bg:          #111111;
 --surface:     #1b1b1b;
 --surface-header: #141414;
 --surface-input:  #0e0e0e;
 --border:      #3a3a3a;
 --border-focus: #b38b2d;
 --text:        #f5f5f5;
 --text-muted:  #999;
 --text-sub:    #666;
 --error:       #ff7d7d;
 --radius-card: 6px;
 --radius-input: 4px;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Inter', Arial, sans-serif; font-size: 16px; background: var(--bg); background-image: radial-gradient(ellipse 80% 60% at 50% 40%, #1a1410 0%, #111 70%); color: var(--text); display: flex; flex-direction: column; min-height: 100dvh; }
.login-layout { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.5rem 1rem; }
/* -- Card -------------------------------------------------- */
.wrap { width: min(440px, 100%); background: var(--surface); border: 1px solid var(--gold-dim); border-radius: var(--radius-card); box-shadow: 0 4px 8px rgba(0,0,0,.5),  0 16px 48px rgba(0,0,0,.7),  inset 0 1px 0 rgba(255,255,255,.04); overflow: hidden; animation: cardIn 0.4s cubic-bezier(0.22, 1, 0.36, 1) both; }
 @keyframes cardIn {  from {
opacity: 0;
transform: translateY(10px);
}
to { opacity: 1; transform: translateY(0); }
}
/* -- Header band ------------------------------------------- */
.card-header { background: var(--surface-header); border-bottom: 1px solid var(--gold-dim); padding: 1.75rem 2.25rem 1.5rem; text-align: center; }
/* -- Logo -------------------------------------------------- */
.logo { margin: 0; }
.logo .brand-name { display: block; width: 100%; max-width: 260px; margin: 0 auto; }
.logo svg { display: block; width: 100%; height: auto; }
.brand-name svg { stroke: rgba(255,255,255,0); fill: rgba(255,255,255,0); stroke-width: 1; stroke-dasharray: 0 1950; }
.brand-name.active svg { animation-name: dasharray; animation-duration: 4s; animation-fill-mode: forwards; }
@keyframes dasharray {  80% {
fill: rgba(255,255,255,0);
stroke-dasharray: 300 0;
stroke: white;
}
 100% {
fill: white;
stroke: rgba(255,255,255,0);
stroke-dasharray: 500 0;
}
}
.logo .bannerStrip { display: block; width: 80%; max-width: 535px; height: auto; margin: -0.5em auto 0; }
/* -- Card body --------------------------------------------- */
.card-body { padding: 2rem 2.25rem 2.25rem; }
/* -- Form heading ------------------------------------------ */
.form-heading { font-family: 'Playfair Display', Georgia, serif; font-size: 1.3rem; font-weight: 400; color: var(--text); margin: 0 0 0.375rem; letter-spacing: 0; }
.form-subheading { font-size: 0.825rem; color: var(--text-muted); margin: 0 0 1.75rem; line-height: 1.5; }
/* -- Labels ------------------------------------------------ */
.field { margin-top: 1.125rem; }
label { display: block; margin-bottom: 0.35rem; font-size: 0.775rem; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }
/* -- Inputs ------------------------------------------------ */
input[type="text"], input[type="password"] { width: 100%; padding: 0 0.875rem; height: 46px; border: 1px solid var(--border); border-radius: var(--radius-input); background: var(--surface-input); color: var(--text); font-family: inherit; font-size: 0.9375rem; transition: border-color 180ms, box-shadow 180ms; outline: none; -webkit-appearance: none; }
input[type="text"]:focus, input[type="password"]:focus { border-color: var(--border-focus); box-shadow: 0 0 0 3px var(--gold-glow); }
input[type="text"]:hover:not(:focus), input[type="password"]:hover:not(:focus) { border-color: #555; }
/* password field wrapper */
.pw-wrap { position: relative; }
.pw-wrap input { padding-right: 2.75rem; }
.pw-toggle { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); background: none; border: none; padding: 0.25rem; cursor: pointer; color: var(--text-sub); line-height: 0; width: auto; height: auto; margin: 0; transition: color 150ms; border-radius: 2px; }
.pw-toggle:hover, .pw-toggle:focus-visible {
 color: var(--gold-light);
 outline: none;
}
/* -- Forgot link ------------------------------------------- */
.form-link { margin-top: 0.45rem; text-align: right; }
.form-link a { font-size: 0.775rem; color: var(--gold-light); text-decoration: none; transition: opacity 150ms; }
.form-link a:hover, .form-link a:focus { text-decoration: underline; }
/* -- Remember me ------------------------------------------- */
.remember-wrap { margin-top: 1.125rem; display: flex; align-items: center; gap: 0.55rem; }
.remember-wrap input[type="checkbox"] { width: 16px; height: 16px; margin: 0; accent-color: var(--gold); cursor: pointer; flex-shrink: 0; }
.remember-wrap label { margin: 0; font-size: 0.84rem; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--text-muted); cursor: pointer; }
/* -- Submit button ----------------------------------------- */
button[type="submit"] { margin-top: 1.5rem; width: 100%; height: 46px; padding: 0; border: none; border-radius: var(--radius-input); background: linear-gradient(135deg, #9c7825 0%, var(--gold-light) 55%, var(--gold) 100%); color: #0e0e0e; font-family: inherit; font-size: 0.825rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; transition: filter 180ms, box-shadow 180ms, transform 130ms; box-shadow: 0 2px 10px rgba(179,139,45,.3); }
button[type="submit"]:hover { filter: brightness(1.1); box-shadow: 0 4px 18px rgba(179,139,45,.4); }
button[type="submit"]:active { transform: translateY(1px); filter: brightness(0.95); }
button[type="submit"]:focus-visible {
 outline: 2px solid var(--gold-light);
 outline-offset: 3px;
}
/* -- Divider ----------------------------------------------- */
.card-footer-divider { height: 1px; background: linear-gradient(to right, transparent, var(--gold-dim), transparent); margin: 0; }
/* -- Footer link ------------------------------------------- */
.card-footer { padding: 1rem 2.25rem; text-align: center; font-size: 0.8rem; color: var(--text-muted); background: var(--surface-header); }
.card-footer a { color: var(--gold-light); text-decoration: none; font-weight: 500; }
.card-footer a:hover { text-decoration: underline; }
/* -- Error ------------------------------------------------- */
.error { margin-top: 1rem; display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.7rem 0.875rem; border-radius: var(--radius-input); background: rgba(255, 125, 125, 0.08); border: 1px solid rgba(255, 125, 125, 0.25); color: var(--error); font-size: 0.855rem; line-height: 1.5; }
.error svg { flex-shrink: 0; margin-top: 2px; }

/* -- Reduced motion ---------------------------------------- */
@media (prefers-reduced-motion: reduce) {
.wrap { animation: none; opacity: 1; transform: none; }
.brand-name.active svg { animation: none; fill: #f5f5f5; stroke: transparent; }
*, *::before, *::after { transition-duration: 0ms !important; }
}
/* -- Site footer (dark-theme override) --------------------- */
.footer-modern { background: #0d0d0d; border-top: 1px solid var(--gold-dim); padding: 1px 0; font-family: 'Inter', Arial, sans-serif; }
.footer-modern .container { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
.footer-modern__layer { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; margin-left: -15px; margin-right: -15px; font-size: 14px; }
.footer-modern__layer > * { padding: 0 15px; }
.footer-modern__layer > * + * { margin-top: 20px; }
.footer-modern__layer_top { padding: 32px 0; }
.footer-modern__layer_bottom { padding: 16px 0; }
.footer-modern__layer + .footer-modern__layer { border-top: 1px solid #2a2a2a; }
@media (min-width: 768px) {
.footer-modern__layer { flex-direction: row; flex-wrap: wrap; justify-content: space-between; }
.footer-modern__layer > * + * { margin-top: 0; }
}
/* logo */
footer a.brand img { filter: brightness(0) invert(1); opacity: 0.7; }
footer a.brand:hover img { opacity: 1; }
/* address */
.footer-modern .list-nav { list-style: none; margin: 0; padding: 0; }
.footer-modern .list-nav > li { font-size: 13px; color: var(--text-muted); line-height: 1.6; }
/* social icons */
.footer-modern .list-inline-xxs { list-style: none; margin: 0; padding: 0; display: flex; gap: 12px; }
.footer-modern .list-inline-xxs li { display: inline-block; }
.footer-modern .icon-gray-4 { color: #666; font-size: 18px; text-decoration: none; transition: color 150ms; }
.footer-modern .icon-gray-4:hover { color: var(--gold-light); }
/* copyright */
.footer-modern .rights { margin: 0; font-size: 13px; color: var(--text-muted); }
/* links */
.footer-modern .contact ul { display: flex; flex-direction: row; flex-wrap: wrap; gap: 0.25rem 0; list-style: none; margin: 0; padding: 0; }
.footer-modern .contact ul li { padding-left: 1.25rem; }
.footer-modern .contact ul li:first-child { padding-left: 0; }
.footer-modern .contact ul li a { font-size: 13px; color: #666; text-decoration: none; transition: color 150ms; }
.footer-modern .contact ul li a:hover { color: var(--gold-light); }