:root {
    --visit-ink: var(--service-ink, #102536);
    --visit-muted: var(--service-muted, #5d6b75);
    --visit-blue: var(--service-blue, #087aa6);
    --visit-blue-dark: var(--service-blue-dark, #075875);
    --visit-line: var(--service-line, #dce2e6);
    --visit-soft: var(--service-soft, #f3f5f6);
}

.service-page.visit-page { background: #fff; color: var(--visit-ink); }
.service-page.visit-page .visit-shell { max-width: none; margin: 0; padding: 0; }
.service-page.visit-page .visit-intro {
    max-width: 1180px;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
    align-items: end;
    gap: 1.4rem 4rem;
    margin: 0 auto;
    padding: 3rem 1.5rem 2.4rem;
    text-align: left;
}
.service-page.visit-page .visit-intro__badge {
    grid-column: 1 / -1;
    justify-self: start;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--visit-blue-dark);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.service-page.visit-page .visit-intro__badge .material-symbols-outlined { display: none; }
.service-page.visit-page .visit-intro h1 {
    max-width: 680px;
    margin: 0;
    color: var(--visit-ink);
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-size: clamp(2.25rem, 5vw, 3.5rem);
    font-weight: 800;
    letter-spacing: -.06em;
    line-height: 1.02;
}
.service-page.visit-page .visit-intro p {
    max-width: 520px;
    margin: 0;
    color: var(--visit-muted);
    font-size: 1rem;
    line-height: 1.75;
}
.service-page.visit-page .visit-card {
    max-width: 860px;
    margin: 0 auto 6rem;
    border: 1px solid var(--visit-line);
    border-radius: 2px;
    background: #fff;
    box-shadow: none;
}
.service-page.visit-page .visit-card__head {
    padding: 2rem 2.3rem 1.4rem;
    border-bottom: 1px solid var(--visit-line);
    background: #fff;
}
.service-page.visit-page .visit-card__head h2 {
    color: var(--visit-ink);
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-size: 1.6rem;
    letter-spacing: -.025em;
}
.service-page.visit-page .visit-card__head p { color: var(--visit-muted); }
.service-page.visit-page .visit-card__head h2 { margin: .35rem 0 .5rem; }
.service-page.visit-page .visit-card__head p { margin: 0; line-height: 1.65; }
.service-page.visit-page .visit-step,
.service-page.visit-page .visit-success__eyebrow { color: var(--visit-blue-dark); font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.service-page.visit-page .visit-form { display: grid; gap: 1.35rem; padding: 2rem 2.3rem 2.3rem; }
.service-page.visit-page .visit-form__grid { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 1rem; }
.service-page.visit-page .visit-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.service-page.visit-page .visit-field--wide { grid-column: 1 / -1; }
.service-page.visit-page .visit-field label,
.service-page.visit-page .visit-field legend { display: block; margin-bottom: .45rem; color: var(--visit-ink); font-size: .78rem; font-weight: 750; }
.service-page.visit-page .visit-field small { color: var(--visit-muted); font-size: .68rem; font-weight: 500; }
.service-page.visit-page .visit-field input,
.service-page.visit-page .visit-field select,
.service-page.visit-page .visit-field textarea {
    width: 100%;
    min-height: 48px;
    padding: .75rem .85rem;
    border-color: #c8d0d5;
    border-style: solid;
    border-width: 1px;
    border-radius: 2px;
    background: #fff;
    color: var(--visit-ink);
    font: inherit;
}
.service-page.visit-page .visit-field textarea { min-height: 90px; resize: vertical; }
.service-page.visit-page .visit-field input:focus,
.service-page.visit-page .visit-field select:focus,
.service-page.visit-page .visit-field textarea:focus {
    outline: 2px solid rgba(8, 122, 166, .16);
    outline-offset: 0;
    border-color: var(--visit-blue);
}
.service-page.visit-page .visit-options { display: flex; flex-wrap: wrap; gap: .55rem; }
.service-page.visit-page .visit-option { position: relative; cursor: pointer; }
.service-page.visit-page .visit-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.service-page.visit-page .visit-option span {
    display: inline-flex;
    align-items: center;
    min-height: 46px;
    padding: .65rem .85rem;
    border-style: solid;
    border-width: 1px;
    border-color: #c8d0d5;
    border-radius: 2px;
    color: #405461;
}
.service-page.visit-page .visit-option input:checked + span {
    border-color: var(--visit-ink);
    background: var(--visit-ink);
    color: #fff;
    box-shadow: none;
}
.service-page.visit-page .visit-consent {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    padding: 1rem;
    border: 1px solid var(--visit-line);
    border-radius: 2px;
    background: var(--visit-soft);
    color: var(--visit-muted);
    font-size: .78rem;
    line-height: 1.55;
}
.service-page.visit-page .visit-consent input { width: 18px; height: 18px; flex: 0 0 auto; margin-top: .1rem; accent-color: var(--visit-blue-dark); }
.service-page.visit-page .visit-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 50px;
    padding: .8rem 1.15rem;
    border: 0;
    border-radius: 2px;
    background: var(--visit-ink);
    color: #fff;
    font: inherit;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.service-page.visit-page .visit-submit:hover { background: var(--visit-blue-dark); }
.service-page.visit-page .visit-submit:disabled { cursor: wait; opacity: .72; }
.service-page.visit-page .visit-submit--link { margin-top: .5rem; }
.service-page.visit-page .visit-location { display: flex; align-items: flex-start; justify-content: center; gap: .4rem; margin: 0; color: var(--visit-muted); font-size: .74rem; text-align: center; }
.service-page.visit-page .visit-location .material-symbols-outlined { font-size: 1rem; }
.service-page.visit-page .visit-alert { display: flex; align-items: flex-start; gap: .6rem; margin: 1.25rem 2.3rem 0; padding: .9rem 1rem; border: 1px solid #efc4bf; border-radius: 2px; background: #fff5f3; color: #9f3126; }
.service-page.visit-page .visit-alert p { margin: 0; line-height: 1.5; }
.service-page.visit-page .visit-success { display: grid; justify-items: center; gap: .8rem; padding: 3.5rem 2.3rem; text-align: center; }
.service-page.visit-page .visit-success__icon { border-radius: 2px; background: var(--visit-soft); color: var(--visit-blue-dark); }
.service-page.visit-page .visit-success__icon { width: 58px; height: 58px; display: grid; place-items: center; }
.service-page.visit-page .visit-success__icon .material-symbols-outlined { font-size: 2rem; }
.service-page.visit-page .visit-success h2 { margin: 0; color: var(--visit-ink); font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; }
.service-page.visit-page .visit-success p { max-width: 580px; margin: 0; color: var(--visit-muted); line-height: 1.65; }
.service-page.visit-page .visit-code { display: grid; gap: .25rem; min-width: 250px; margin: .5rem 0; padding: 1rem 1.4rem; border-radius: 2px; background: var(--visit-soft); color: var(--visit-ink); }
.service-page.visit-page .visit-code span { color: var(--visit-muted); font-size: .65rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.service-page.visit-page .visit-code strong { font-size: 1.15rem; letter-spacing: .05em; }
.service-page.visit-page .visit-hint { border: 1px solid var(--visit-line); border-radius: 2px; background: var(--visit-soft); color: var(--visit-blue-dark); }
.service-page.visit-page .visit-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 960px) {
    .service-page.visit-page .visit-intro { grid-template-columns: 1fr; gap: 2rem; }
    .service-page.visit-page .visit-intro__badge { margin-bottom: -.6rem; }
}

@media (max-width: 680px) {
    .service-page.visit-page .visit-intro { gap: .7rem; padding: 2.2rem 1rem 1.5rem; }
    .service-page.visit-page .visit-intro h1 { font-size: 2.15rem; }
    .service-page.visit-page .visit-intro p { font-size: .92rem; }
    .service-page.visit-page .visit-card { margin-inline: 1rem; }
    .service-page.visit-page .visit-card__head,
    .service-page.visit-page .visit-form { padding: 1.35rem; }
    .service-page.visit-page .visit-form__grid { grid-template-columns: 1fr; }
    .service-page.visit-page .visit-field--wide { grid-column: auto; }
    .service-page.visit-page .visit-options { display: grid; grid-template-columns: 1fr 1fr; }
    .service-page.visit-page .visit-option span { height: 100%; }
    .service-page.visit-page .visit-field input,
    .service-page.visit-page .visit-field select,
    .service-page.visit-page .visit-field textarea { font-size: 16px; }
    .service-page.visit-page .visit-alert { margin: 1rem 1.35rem 0; }
    .service-page.visit-page .visit-success { padding: 2.5rem 1.35rem; }
}

@media (max-width: 420px) {
    .service-page.visit-page .visit-options { grid-template-columns: 1fr; }
}

/* Buku Tamu: bahasa visual layanan publik yang seragam dan ringkas. */
.service-page.visit-page{
    background:#f5f7f8;
}
.service-page.visit-page .visit-hero{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    border-bottom:1px solid rgba(255,255,255,.12);
    background:radial-gradient(circle at 88% 18%,rgba(43,145,187,.24),transparent 25rem),#0a2538;
}
.service-page.visit-page .visit-hero::after{
    position:absolute;
    z-index:0;
    right:-4rem;
    bottom:-7rem;
    width:19rem;
    height:19rem;
    border:1px solid rgba(255,255,255,.1);
    border-radius:50%;
    box-shadow:0 0 0 2.5rem rgba(255,255,255,.025),0 0 0 5rem rgba(255,255,255,.018);
    content:"";
    pointer-events:none;
}
.service-page.visit-page .visit-intro{
    position:relative;
    z-index:1;
    width:min(900px,calc(100% - 32px));
    display:grid;
    gap:.48rem;
    margin-inline:auto;
    padding:2.15rem 0 2.25rem;
}
.service-page.visit-page .visit-intro__eyebrow{
    color:#8ed2f5;
    font-size:.65rem;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.service-page.visit-page .visit-intro h1{
    font-size:clamp(2rem,4vw,3rem);
    line-height:1.03;
}
.service-page.visit-page .visit-intro p{
    max-width:620px;
    color:#c3d2dc;
    font-size:.88rem;
    line-height:1.6;
}
.service-page.visit-page .visit-card{
    width:min(860px,calc(100% - 32px));
    margin:1.25rem auto 4rem;
    border-color:#dce4e8;
    border-radius:13px;
    box-shadow:0 10px 28px rgba(15,35,55,.045);
}
.service-page.visit-page .visit-card__head{
    padding:1.15rem 1.35rem .9rem;
}
.service-page.visit-page .visit-card__head h2{
    font-size:1.05rem;
}
.service-page.visit-page .visit-form{
    gap:1.05rem;
    padding:1.2rem 1.35rem 1.35rem;
}
.service-page.visit-page .visit-form__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.85rem;
}
.service-page.visit-page .visit-field label,
.service-page.visit-page .visit-field legend{
    margin-bottom:.36rem;
    font-size:.72rem;
}
.service-page.visit-page .visit-field input,
.service-page.visit-page .visit-field select,
.service-page.visit-page .visit-field textarea{
    min-height:44px;
    padding:.67rem .75rem;
    border-radius:7px;
    font-size:.8rem;
}
.service-page.visit-page .visit-field textarea{min-height:88px}
.service-page.visit-page .unified-upload__surface{
    min-height:130px;
    border-radius:8px;
}
.service-page.visit-page .visit-consent{
    padding:.78rem .85rem;
    border-radius:7px;
    font-size:.72rem;
}
.service-page.visit-page .visit-submit{
    min-width:150px;
    min-height:42px;
    justify-self:end;
    padding:.68rem 1rem;
    border-radius:7px;
    font-size:.76rem;
}
.service-page.visit-page .visit-location{font-size:.68rem}

@media(max-width:680px){
    .service-page.visit-page .visit-hero::after{right:-8rem;bottom:-10rem}
    .service-page.visit-page .visit-intro{width:min(100% - 24px,900px);padding:1.6rem 0 1.7rem}
    .service-page.visit-page .visit-intro h1{font-size:2rem}
    .service-page.visit-page .visit-intro p{font-size:.78rem}
    .service-page.visit-page .visit-card{width:calc(100% - 20px);margin:.75rem auto 2.75rem;border-radius:10px}
    .service-page.visit-page .visit-card__head{padding:1rem 1rem .75rem}
    .service-page.visit-page .visit-form{gap:.9rem;padding:1rem}
    .service-page.visit-page .visit-form__grid{grid-template-columns:1fr;gap:.75rem}
    .service-page.visit-page .visit-submit{width:100%;justify-self:stretch}
}

/* Selaras dengan formulir laporan publik */
.service-page.visit-page { background: #f4f7fa; }
.service-page.visit-page .visit-hero { background: linear-gradient(135deg, #07182b, #0b4268); color: #fff; }
.service-page.visit-page .visit-intro {
    max-width: 900px;
    grid-template-columns: 1fr;
    gap: .7rem;
    padding: 3.2rem 1rem;
}
.service-page.visit-page .visit-intro h1 { color: #fff; font-size: clamp(2.2rem, 5vw, 3.4rem); }
.service-page.visit-page .visit-intro p { color: #c7d6e4; }
.service-page.visit-page .visit-card {
    max-width: 900px;
    margin-top: 2rem;
    border-color: #dbe3eb;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(15, 35, 55, .05);
}
.service-page.visit-page .visit-card__head { padding: 1.7rem 1.8rem 1.2rem; }
.service-page.visit-page .visit-card__head h2 { margin: 0; font-size: 1.35rem; }
.service-page.visit-page .visit-form { gap: 1.4rem; padding: 1.7rem 1.8rem 1.9rem; }
.service-page.visit-page .visit-form__grid { grid-template-columns: minmax(0, 1fr) 180px; gap: 1rem; }
.service-page.visit-page .visit-field input,
.service-page.visit-page .visit-field select,
.service-page.visit-page .visit-field textarea { min-height: 48px; border-radius: 10px; }
.service-page.visit-page .visit-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.service-page.visit-page .visit-option span {
    display: flex;
    min-height: 64px;
    align-items: center;
    gap: .65rem;
    padding: .8rem;
    border-radius: 10px;
    font-size: .76rem;
}
.service-page.visit-page .visit-option i { color: var(--visit-blue); font-size: 1.2rem; font-style: normal; }
.service-page.visit-page .visit-option b { font-weight: 750; }
.service-page.visit-page .visit-option input:checked + span i { color: #fff; }
.service-page.visit-page .visit-upload {
    display: grid;
    min-height: 132px;
    place-items: center;
    align-content: center;
    gap: .45rem;
    overflow: hidden;
    padding: 1rem;
    border: 1px dashed #aebdca;
    border-radius: 10px;
    background: #f7f9fb;
    color: var(--visit-blue-dark);
    cursor: pointer;
}
.service-page.visit-page .visit-upload:hover { border-color: var(--visit-blue); background: #f0f9ff; }
.service-page.visit-page .visit-upload img { width: 112px; height: 112px; border-radius: 10px; object-fit: cover; }
.service-page.visit-page .visit-upload .material-symbols-outlined { font-size: 2rem; }
.service-page.visit-page .visit-upload > span:last-child { overflow-wrap: anywhere; color: var(--visit-muted); font-size: .74rem; text-align: center; }
.service-page.visit-page .visit-upload__input { position: absolute; width: 1px!important; height: 1px; min-height: 0!important; overflow: hidden; opacity: 0; }
.service-page.visit-page .visit-consent { border-radius: 10px; }
.service-page.visit-page .visit-submit { border-radius: 10px; background: #0067a7; }

@media (max-width: 700px) {
    .service-page.visit-page .visit-intro { padding: 2.4rem 1rem; }
    .service-page.visit-page .visit-card { margin: 1.25rem .65rem 3rem; border-radius: 10px; }
    .service-page.visit-page .visit-form__grid { grid-template-columns: 1fr; }
    .service-page.visit-page .visit-field--wide { grid-column: auto; }
    .service-page.visit-page .visit-options { grid-template-columns: 1fr 1fr; }
    .service-page.visit-page .visit-submit { width: 100%; }
}

@media (max-width: 420px) {
    .service-page.visit-page .visit-options { grid-template-columns: 1fr; }
}

.visit-history{display:grid;gap:18px}.visit-history__header{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:20px;border:1px solid #dbe4ea;border-radius:14px;background:#fff}.visit-history__header h2{margin:3px 0 4px;font-size:1.4rem}.visit-history__header p{margin:0;color:#64748b}.visit-history__filters{display:grid;grid-template-columns:repeat(3,minmax(145px,.65fr)) minmax(220px,1.4fr) auto;align-items:end;gap:10px;padding:14px;border:1px solid #dbe4ea;border-radius:12px;background:#f8fafc}.visit-history__filters label{display:grid;gap:5px}.visit-history__filters label span{font-size:11px;font-weight:800;color:#475569}.visit-history__filters input,.visit-history__filters select,.visit-history__import input[type=file]{min-height:40px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;padding:8px 10px}.visit-history__tools{display:flex;justify-content:space-between;align-items:center;gap:12px}.visit-history__tools p{margin:0;color:#475569}.visit-history__tools>div{display:flex;flex-wrap:wrap;gap:8px}.visit-history__import{padding:12px 14px;border:1px dashed #94a3b8;border-radius:10px;background:#fff}.visit-history__import summary{cursor:pointer;font-weight:800}.visit-history__import form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}.visit-history__import p{margin:8px 0 0;color:#64748b;font-size:12px}.visit-history__table-wrap{overflow:auto;border:1px solid #dbe4ea;border-radius:12px;background:#fff}.visit-history__table{width:100%;border-collapse:collapse;min-width:980px}.visit-history__table th,.visit-history__table td{padding:12px 14px;border-bottom:1px solid #e2e8f0;text-align:left;vertical-align:top}.visit-history__table th{background:#f8fafc;color:#475569;font-size:11px;text-transform:uppercase;letter-spacing:.04em}.visit-history__table td{color:#334155;font-size:13px}.visit-history__table small{display:block;margin-top:3px;color:#64748b}.visit-history__table code{font-size:11px}.visit-history__pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.visit-history__pagination a{display:grid;place-items:center;min-width:36px;height:36px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;font-weight:800}.visit-history__pagination a.is-active{border-color:#0875b5;background:#0875b5;color:#fff}@media(max-width:900px){.visit-history__header,.visit-history__tools{align-items:stretch;flex-direction:column}.visit-history__filters{grid-template-columns:1fr 1fr}.visit-history__search{grid-column:1/-1}}@media(max-width:560px){.visit-history__filters{grid-template-columns:1fr}.visit-history__search{grid-column:auto}.visit-history__filters button{width:100%}}

/* Final precedence: proporsi Buku Tamu mengikuti subheader dan formulir publik terbaru. */
.service-page.visit-page .visit-hero{background:radial-gradient(circle at 88% 18%,rgba(43,145,187,.24),transparent 25rem),#0a2538}
.service-page.visit-page .visit-intro{width:min(900px,calc(100% - 32px));max-width:none;gap:.48rem;padding:2.15rem 0 2.25rem}
.service-page.visit-page .visit-intro h1{font-size:clamp(2rem,4vw,3rem);line-height:1.03}
.service-page.visit-page .visit-intro p{max-width:620px;color:#c3d2dc;font-size:.88rem;line-height:1.6}
.service-page.visit-page .visit-card{width:min(860px,calc(100% - 32px));max-width:none;margin:1.25rem auto 4rem;border-radius:13px;box-shadow:0 10px 28px rgba(15,35,55,.045)}
.service-page.visit-page .visit-card__head{padding:1.15rem 1.35rem .9rem}.service-page.visit-page .visit-card__head h2{font-size:1.05rem}
.service-page.visit-page .visit-form{gap:1.05rem;padding:1.2rem 1.35rem 1.35rem}.service-page.visit-page .visit-form__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}
.service-page.visit-page .visit-field input,.service-page.visit-page .visit-field select,.service-page.visit-page .visit-field textarea{min-height:44px;padding:.67rem .75rem;border-radius:7px;font-size:.8rem}.service-page.visit-page .visit-field textarea{min-height:88px}
.service-page.visit-page .visit-consent{padding:.78rem .85rem;border-radius:7px}.service-page.visit-page .visit-submit{width:100%;min-width:0;min-height:42px;justify-self:stretch;border-radius:7px}
@media(max-width:680px){.service-page.visit-page .visit-intro{width:min(100% - 24px,900px);padding:1.6rem 0 1.7rem}.service-page.visit-page .visit-intro h1{font-size:2rem}.service-page.visit-page .visit-intro p{font-size:.78rem}.service-page.visit-page .visit-card{width:calc(100% - 20px);margin:.75rem auto 2.75rem}.service-page.visit-page .visit-card__head{padding:1rem 1rem .75rem}.service-page.visit-page .visit-form{padding:1rem}.service-page.visit-page .visit-form__grid{grid-template-columns:1fr}.service-page.visit-page .visit-submit{width:100%;justify-self:stretch}}