@font-face { font-family: Poppins; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/Poppins-Regular.woff2") format("woff2"); }
@font-face { font-family: Poppins; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/Poppins-Medium.woff2") format("woff2"); }
@font-face { font-family: Poppins; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/Poppins-SemiBold.woff2") format("woff2"); }
@font-face { font-family: Poppins; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/Poppins-Bold.woff2") format("woff2"); }
:root { color-scheme: light; }
* { box-sizing: border-box; }
body.access-body { margin: 0; background: #f1efe8; color: #1b1c18; font-family: Poppins, "Segoe UI", system-ui, sans-serif; }
.access-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 24px; }
.access-card { display: flex; width: min(760px, 100%); min-height: min(680px, calc(100vh - 48px)); overflow: hidden; border: 1px solid #dcd8cd; border-radius: 24px; background: #fbf9f3; box-shadow: 0 24px 60px rgba(8,39,23,.10); }
.access-panel { position: relative; display: flex; flex: 0 0 44%; flex-direction: column; justify-content: space-between; min-height: 100%; padding: 44px 46px; overflow: hidden; color: #f5f2ec; background: linear-gradient(to top,rgba(8,39,23,.95),rgba(18,53,33,.78) 58%,rgba(18,53,33,.50)),url("../images/access-panel.jpg") center / cover; }
.access-panel::after { position: absolute; right: -16%; bottom: -14%; width: 420px; height: 420px; content: ""; opacity: .10; background: url("../images/ovinocorte-logo.svg") center / contain no-repeat; pointer-events: none; }
.access-back, .access-brand__identity, .access-header-link, .field__label-row a, .access-form__footer a { text-decoration: none; }
.access-back { position: relative; z-index: 1; display: inline-flex; gap: 8px; align-items: center; align-self: flex-start; color: rgba(245,242,236,.82); font-size: 14px; font-weight: 500; }
.access-back:hover { color: #fff; }
.access-back span { font-size: 16px; line-height: 1; }
.access-panel__content { position: relative; z-index: 1; display: flex; max-width: 26em; flex-direction: column; gap: 24px; }
.access-logo { display: block; width: 88px; height: 88px; }
.access-panel__title { max-width: 13em; margin: 0; color: #fff; font-size: 30px; font-weight: 600; letter-spacing: -.02em; line-height: 1.22; }
.access-panel__description { max-width: 26em; margin: 0; color: rgba(245,242,236,.80); font-size: 15px; line-height: 1.65; }
.access-panel__caption { position: relative; z-index: 1; color: #c4933a; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.access-form-area { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; background: #fbf9f3; }
.access-brand { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 16px; padding: 20px 48px; border-bottom: 1px solid #e4e2dd; }
.access-back-button { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 40px; border: 0; color: #123521; background: transparent; font-size: 38px; font-weight: 300; line-height: 1; text-decoration: none; }
.access-back-button:hover { color: #6e7f30; }
.access-brand__identity { display: flex; align-items: center; gap: 10px; color: #123521; text-decoration: none !important; }
.access-brand__identity img { display: block; width: 34px; height: 34px; }
.access-brand__identity span { display: flex; flex-direction: column; gap: 1px; }
.access-brand__identity strong { font-size: 17px; font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.access-brand__identity small { color: #6e7f30; font-size: 9px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }
.access-header-link { color: #123521; font-size: 14px; font-weight: 600; }
.access-header-link:hover, .field__label-row a:hover, .access-form__footer a:hover { color: #6e7f30; }
.access-form-wrap { display: flex; flex: 1; flex-direction: column; justify-content: center; max-width: 600px; margin: 0 auto; padding: 48px; }
.access-form { display: flex; flex-direction: column; gap: 26px; }
.access-form__intro { display: flex; flex-direction: column; gap: 10px; }
.access-eyebrow { color: #6e7f30; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.access-form h1 { margin: 0; color: #123521; font-size: 32px; font-weight: 600; letter-spacing: -.025em; line-height: 1.16; }
.access-form__intro p { margin: 0; color: #424843; font-size: 16px; line-height: 1.65; }
.access-form form { display: flex; flex-direction: column; gap: 20px; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label, .field__label-row label { color: #123521; font-size: 14px; font-weight: 600; }
.field__label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.field__label-row a, .access-form__footer a { color: #6e7f30; font-size: 13px; font-weight: 600; }
.field input { width: 100%; min-height: 56px; padding: 0 18px; border: 1.5px solid #dcd8cd; border-radius: 14px; outline: none; background: #fff; color: #1b1c18; font: inherit; font-size: 16px; }
.field input:focus { border-color: #6e7f30; box-shadow: 0 0 0 4px rgba(110,127,48,.16); }
.field input[aria-invalid="true"] { border: 2px solid #a33a2b; }
.password-field { position: relative; display: flex; align-items: center; }
.password-field input { padding-right: 108px; }
.password-toggle { position: absolute; right: 8px; min-height: 44px; padding: 0 14px; border: 0; border-radius: 10px; background: transparent; color: #6e7f30; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.password-toggle:hover { background: #f1efe8; color: #123521; }
.field small { display: flex; gap: 7px; align-items: center; color: #a33a2b; font-size: 13px; font-weight: 500; }
.checkbox { display: flex; align-items: center; align-self: flex-start; gap: 13px; min-height: 44px; margin: 0 0 0 -4px; padding: 10px 12px 10px 4px; border-radius: 12px; color: #424843; font-size: 14px; cursor: pointer; }
.checkbox:hover { background: #f1efe8; }
.checkbox input { width: 24px; height: 24px; margin: 0; accent-color: #123521; cursor: pointer; }
.access-submit { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 60px; padding: 0 26px; border: 0; border-radius: 16px; background: #123521; box-shadow: 0 10px 26px rgba(8,39,23,.18); color: #f5f2ec; font: inherit; font-size: 16px; font-weight: 600; cursor: pointer; }
.access-submit:hover { background: #1f3d2b; }
.access-submit:active { background: #082717; }
.access-form__footer { display: flex; flex-direction: column; align-items: center; gap: 10px; padding-top: 2px; }
.access-form__footer p { margin: 0; color: #424843; font-size: 14px; }
.access-help { color: #7a7a6e !important; font-weight: 400 !important; text-decoration: underline !important; }
.access-alert { display: flex; gap: 12px; padding: 16px 18px; border: 1px solid #ebc9c2; border-radius: 14px; background: #fbedea; color: #8c2e22; }
.access-alert__icon { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #a33a2b; color: #fff; font-size: 13px; font-weight: 700; }
.access-alert strong { font-size: 14px; line-height: 1.5; }
.access-alert p { margin: 4px 0 0; font-size: 13px; line-height: 1.55; }
.access-note { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border: 1px solid #d9e0c6; border-radius: 14px; background: #edf1e2; }
.access-note > span { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: #6e7f30; color: #fff; font-size: 12px; font-weight: 600; }
.access-note p { margin: 0; color: #3a4a26; font-size: 13px; line-height: 1.55; }
@media (max-width: 900px) { .access-page { padding: 24px; } .access-card { display: block; min-height: 0; } .access-panel { min-height: 230px; padding: 22px; } .access-panel__content { gap: 16px; margin-top: 32px; } .access-logo { display: none; } .access-panel__title { font-size: 23px; } .access-panel__description { font-size: 14px; } .access-panel__caption { display: none; } .access-brand { padding: 18px 22px; } .access-form-wrap { max-width: none; padding: 28px 22px 32px; } }
@media (max-width: 480px) { .access-page { display: block; padding: 0; } .access-card { border: 0; border-radius: 0; box-shadow: none; } .access-panel { min-height: 210px; } .access-form h1 { font-size: 28px; } .field__label-row { align-items: flex-start; flex-direction: column; gap: 5px; } }
@media (max-width: 480px) {
    .access-brand { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 6px; padding: 16px; }
    .access-back-button { width: 32px; height: 40px; font-size: 38px; font-weight: 300; }
    .access-brand__identity { gap: 7px; }
    .access-brand__identity img { width: 30px; height: 30px; }
    .access-brand__identity strong { font-size: 15px; }
    .access-brand__identity small { font-size: 7px; letter-spacing: .09em; }
    .access-form__intro p { font-size: 14px; line-height: 1.5; }
    .field__label-row { align-items: baseline; flex-direction: row; gap: 10px; }
    .field__label-row a { font-size: 12px; white-space: nowrap; }
}