.pantau-page{
    min-height:70vh;
    padding:48px 20px 72px;
    background:#f6f8fb;
}

.pantau-container{
    width:min(1180px,100%);
    margin:0 auto;
}

.pantau-form-container,
.pantau-detail-container{
    width:min(1050px,100%);
    margin:0 auto;
}

.pantau-small-container{
    width:min(620px,100%);
    margin:0 auto;
}

.pantau-hero{
    padding:58px;
    border-radius:30px;
    background:#ffffff;
    box-shadow:0 18px 50px rgba(15,23,42,.06);
}

.pantau-eyebrow{
    display:inline-flex;
    align-items:center;
    margin-bottom:14px;
    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#1856a7;
}

.pantau-hero h1,
.pantau-form-heading h1,
.pantau-success-card h1,
.pantau-check-card h1{
    margin:0;
    color:#172033;
    font-size:clamp(32px,5vw,52px);
    line-height:1.08;
    letter-spacing:-.035em;
}

.pantau-hero p,
.pantau-form-heading p,
.pantau-success-card > p,
.pantau-check-card > p{
    max-width:720px;
    margin:18px 0 0;
    color:#64748b;
    font-size:17px;
    line-height:1.75;
}

.pantau-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:28px;
}

.pantau-actions-center{
    justify-content:center;
}

.pantau-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:48px;
    padding:0 20px;
    border:0;
    border-radius:13px;
    font-size:14px;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
    transition:.2s ease;
}

.pantau-btn:hover{
    transform:translateY(-1px);
}

.pantau-btn-primary{
    background:#1558a6;
    color:#fff;
}

.pantau-btn-light{
    background:#edf3fa;
    color:#174d88;
}

.pantau-btn-block{
    width:100%;
}

.pantau-info-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
    margin-top:26px;
}

.pantau-info-card{
    padding:26px;
    border-radius:20px;
    background:#fff;
    box-shadow:0 10px 30px rgba(15,23,42,.045);
}

.pantau-info-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    margin-bottom:18px;
    border-radius:14px;
    background:#eef5ff;
    color:#1558a6;
    font-size:19px;
}

.pantau-info-card h3{
    margin:0 0 9px;
    color:#172033;
    font-size:18px;
}

.pantau-info-card p{
    margin:0;
    color:#64748b;
    line-height:1.65;
}

.pantau-flow{
    margin-top:56px;
}

.pantau-section-heading span{
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#1558a6;
}

.pantau-section-heading h2{
    margin:7px 0 22px;
    color:#172033;
    font-size:30px;
}

.pantau-flow-list{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
}

.pantau-flow-item{
    display:flex;
    gap:15px;
    padding:21px;
    border-radius:18px;
    background:#fff;
}

.pantau-flow-item > strong{
    flex:0 0 34px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:50%;
    background:#1558a6;
    color:#fff;
}

.pantau-flow-item h3{
    margin:2px 0 7px;
    color:#172033;
    font-size:16px;
}

.pantau-flow-item p{
    margin:0;
    color:#64748b;
    font-size:14px;
    line-height:1.6;
}

.pantau-back{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:24px;
    color:#475569;
    font-size:14px;
    font-weight:700;
    text-decoration:none;
}

.pantau-form-heading{
    margin-bottom:26px;
}

.pantau-form{
    display:grid;
    gap:20px;
}

.pantau-form-section{
    padding:28px;
    border-radius:22px;
    background:#fff;
    box-shadow:0 8px 28px rgba(15,23,42,.045);
}

.pantau-form-section-title{
    display:flex;
    align-items:flex-start;
    gap:15px;
    margin-bottom:24px;
}

.pantau-form-section-title > span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:38px;
    height:38px;
    border-radius:12px;
    background:#edf4fc;
    color:#1558a6;
    font-size:13px;
    font-weight:800;
}

.pantau-form-section-title h2{
    margin:0;
    color:#172033;
    font-size:20px;
}

.pantau-form-section-title p{
    margin:5px 0 0;
    color:#64748b;
    line-height:1.6;
}

.pantau-form-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
}

.pantau-field{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.pantau-field-full{
    grid-column:1 / -1;
}

.pantau-field label{
    color:#334155;
    font-size:14px;
    font-weight:750;
}

.pantau-field label span{
    color:#94a3b8;
    font-size:12px;
    font-weight:600;
}

.pantau-field input,
.pantau-field select,
.pantau-field textarea{
    width:100%;
    border:1px solid #d8e0ea;
    border-radius:12px;
    padding:13px 14px;
    background:#fff;
    color:#172033;
    font:inherit;
    outline:none;
    transition:border-color .2s ease, box-shadow .2s ease;
}

.pantau-field textarea{
    resize:vertical;
    line-height:1.65;
}

.pantau-field input:focus,
.pantau-field select:focus,
.pantau-field textarea:focus{
    border-color:#5b8ec8;
    box-shadow:0 0 0 4px rgba(21,88,166,.08);
}

.pantau-help{
    color:#7c8a9e;
    line-height:1.5;
}

.pantau-error{
    color:#b42318;
}

.pantau-submit-area{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:22px 26px;
    border-radius:20px;
    background:#edf4fc;
}

.pantau-submit-note{
    display:flex;
    align-items:flex-start;
    gap:11px;
    color:#44566c;
}

.pantau-submit-note i{
    margin-top:3px;
    color:#1558a6;
}

.pantau-submit-note p{
    max-width:630px;
    margin:0;
    font-size:14px;
    line-height:1.6;
}

.pantau-alert{
    margin-bottom:18px;
    padding:14px 16px;
    border-radius:12px;
    font-size:14px;
}

.pantau-alert-error{
    background:#fff0f0;
    color:#9f2424;
}

.pantau-success-card,
.pantau-check-card{
    padding:38px;
    border-radius:26px;
    background:#fff;
    text-align:center;
    box-shadow:0 15px 42px rgba(15,23,42,.06);
}

.pantau-success-icon,
.pantau-check-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:62px;
    height:62px;
    margin:0 auto 20px;
    border-radius:19px;
    background:#eaf4ff;
    color:#1558a6;
    font-size:24px;
}

.pantau-access-box{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:27px;
}

.pantau-access-item{
    padding:18px;
    border-radius:16px;
    background:#f3f6fa;
}

.pantau-access-item span{
    display:block;
    margin-bottom:7px;
    color:#64748b;
    font-size:12px;
    font-weight:700;
}

.pantau-access-item strong{
    color:#172033;
    font-size:20px;
}

.pantau-warning{
    display:flex;
    align-items:flex-start;
    gap:11px;
    margin-top:17px;
    padding:15px;
    border-radius:14px;
    background:#fff8e8;
    color:#775b17;
    text-align:left;
}

.pantau-warning p{
    margin:0;
    font-size:14px;
    line-height:1.6;
}

.pantau-check-form{
    display:grid;
    gap:17px;
    margin-top:27px;
    text-align:left;
}

.pantau-detail-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.pantau-ticket{
    text-align:right;
}

.pantau-ticket span{
    display:block;
    color:#64748b;
    font-size:12px;
}

.pantau-ticket strong{
    color:#172033;
}

.pantau-status-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin:8px 0 22px;
    padding:28px;
    border-radius:22px;
    background:#173d68;
    color:#fff;
}

.pantau-status-card span{
    font-size:13px;
    opacity:.75;
}

.pantau-status-card h1{
    margin:5px 0;
    font-size:30px;
}

.pantau-status-card p{
    margin:0;
    opacity:.82;
}

.pantau-status-badge{
    padding:9px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.14);
    font-size:12px;
    font-weight:800;
}

.pantau-detail-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:20px;
}

.pantau-detail-main{
    display:grid;
    gap:20px;
}

.pantau-detail-card{
    padding:25px;
    border-radius:20px;
    background:#fff;
    box-shadow:0 8px 26px rgba(15,23,42,.045);
}

.pantau-detail-card h2{
    margin:0 0 20px;
    color:#172033;
    font-size:19px;
}

.pantau-data-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
}

.pantau-data-grid span{
    display:block;
    margin-bottom:5px;
    color:#8491a3;
    font-size:12px;
}

.pantau-data-grid strong{
    color:#334155;
    font-size:14px;
}

.pantau-prose{
    color:#475569;
    line-height:1.8;
}

.pantau-timeline{
    display:grid;
    gap:0;
}

.pantau-timeline-item{
    position:relative;
    display:grid;
    grid-template-columns:18px 1fr;
    gap:12px;
    padding-bottom:24px;
}

.pantau-timeline-item:not(:last-child)::before{
    content:"";
    position:absolute;
    left:5px;
    top:13px;
    bottom:0;
    width:2px;
    background:#dce5ef;
}

.pantau-timeline-dot{
    position:relative;
    z-index:2;
    width:12px;
    height:12px;
    margin-top:4px;
    border-radius:50%;
    background:#1558a6;
}

.pantau-timeline-item strong{
    color:#334155;
}

.pantau-timeline-item p{
    margin:6px 0;
    color:#64748b;
    font-size:14px;
    line-height:1.6;
}

.pantau-timeline-item small{
    color:#94a3b8;
}

.pantau-messages{
    display:grid;
    gap:13px;
}

.pantau-message{
    max-width:85%;
    padding:14px 16px;
    border-radius:15px;
}

.pantau-message span{
    display:block;
    margin-bottom:5px;
    font-size:11px;
    font-weight:800;
}

.pantau-message p{
    margin:0;
    line-height:1.6;
}

.pantau-message small{
    display:block;
    margin-top:7px;
    opacity:.65;
}

.pantau-message-admin{
    background:#edf4fc;
    color:#274b73;
}

.pantau-message-user{
    justify-self:end;
    background:#f1f3f6;
    color:#445166;
}

.pantau-empty{
    margin:0;
    color:#94a3b8;
}

@media(max-width:900px){

    .pantau-info-grid,
    .pantau-flow-list{
        grid-template-columns:repeat(2,1fr);
    }

    .pantau-detail-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:640px){

    .pantau-page{
        padding:28px 14px 50px;
    }

    .pantau-hero{
        padding:30px 22px;
        border-radius:22px;
    }

    .pantau-info-grid,
    .pantau-flow-list,
    .pantau-form-grid,
    .pantau-access-box,
    .pantau-data-grid{
        grid-template-columns:1fr;
    }

    .pantau-field-full{
        grid-column:auto;
    }

    .pantau-form-section{
        padding:21px 18px;
    }

    .pantau-submit-area,
    .pantau-status-card,
    .pantau-detail-top{
        align-items:stretch;
        flex-direction:column;
    }

    .pantau-submit-area .pantau-btn{
        width:100%;
    }

    .pantau-ticket{
        text-align:left;
    }

    .pantau-success-card,
    .pantau-check-card{
        padding:28px 20px;
    }

    .pantau-message{
        max-width:94%;
    }
}

.pantau-message-form{
    margin-top:20px;
    padding-top:20px;
    border-top:1px solid #e7edf4;
}

.pantau-message-form-action{
    display:flex;
    justify-content:flex-end;
    margin-top:12px;
}

.pantau-alert-success{
    background:#edf9f1;
    color:#257042;
}

.pantau-source-list{
    display:grid;
    gap:12px;
}

.pantau-source-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:15px;
    border:1px solid #e3e9f0;
    border-radius:14px;
    background:#f8fafc;
}

.pantau-source-item strong{
    color:#334155;
}

.pantau-source-item p{
    margin:5px 0 0;
    color:#64748b;
    font-size:14px;
    line-height:1.6;
}

@media(max-width:640px){

    .pantau-source-item{
        align-items:stretch;
        flex-direction:column;
    }

    .pantau-source-item .pantau-btn{
        width:100%;
    }

    .pantau-message-form-action .pantau-btn{
        width:100%;
    }
}

.pantau-forgot-access{
    margin-top:22px;
    padding-top:20px;
    border-top:1px solid #e5eaf0;
    text-align:center;
}

.pantau-forgot-access span{
    display:block;
    margin-bottom:5px;
    color:#7a8798;
    font-size:13px;
}

.pantau-forgot-access a{
    color:#1558a6;
    font-size:14px;
    font-weight:800;
    text-decoration:none;
}

.pantau-forgot-access a:hover{
    text-decoration:underline;
}

.pantau-recovery-list{
    display:grid;
    gap:14px;
}

.pantau-recovery-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:22px;
    border-radius:18px;
    background:#fff;
    box-shadow:0 8px 26px rgba(15,23,42,.045);
}

.pantau-recovery-item h3{
    margin:5px 0;
    color:#172033;
    font-size:17px;
}

.pantau-recovery-item p{
    margin:0;
    color:#64748b;
    font-size:14px;
}

.pantau-recovery-date{
    color:#8b98a8;
    font-size:12px;
    font-weight:700;
}

.pantau-recovered-subject{
    margin-top:22px;
    padding:15px 18px;
    border-radius:14px;
    background:#f7f9fc;
    text-align:left;
}

.pantau-recovered-subject span{
    display:block;
    margin-bottom:5px;
    color:#8a96a6;
    font-size:12px;
}

.pantau-recovered-subject strong{
    color:#334155;
    line-height:1.5;
}

@media(max-width:640px){

    .pantau-recovery-item{
        align-items:stretch;
        flex-direction:column;
    }

    .pantau-recovery-item .pantau-btn{
        width:100%;
    }
}

/* =========================================================
   PANTAU GTK - PERNYATAAN PELAPOR
   ========================================================= */

.pantau-declaration{
    width:100%;
}

.pantau-declaration > label{
    display:flex;
    align-items:flex-start;
    gap:14px;

    padding:18px 20px;

    border:1px solid #dbe4ee;
    border-radius:16px;

    background:#f8fafc;

    cursor:pointer;

    transition:
        border-color .18s ease,
        background .18s ease;
}

.pantau-declaration > label:hover{
    border-color:#b9c9dc;
    background:#f4f7fb;
}

.pantau-declaration input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.pantau-declaration-check{
    flex:0 0 22px;

    width:22px;
    height:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-top:1px;

    border:2px solid #aebdcd;
    border-radius:7px;

    background:#fff;
    color:#fff;

    transition:.18s ease;
}

.pantau-declaration-check i{
    font-size:11px;
    opacity:0;
}

.pantau-declaration input:checked
+ .pantau-declaration-check{
    border-color:#174b87;
    background:#174b87;
}

.pantau-declaration input:checked
+ .pantau-declaration-check i{
    opacity:1;
}

.pantau-declaration-content{
    display:block;
    min-width:0;
}

.pantau-declaration-content strong{
    display:block;

    margin-bottom:6px;

    color:#172033;

    font-size:14px;
    font-weight:700;
    line-height:1.55;
}

.pantau-declaration-content small{
    display:block;

    color:#687386;

    font-size:12px;
    line-height:1.55;
}

.pantau-declaration .pantau-error{
    display:block;
    margin-top:8px;
}