/* SOTK Universitas Udayana - scoped styles, version 1.0 */
.unud-sotk { --sotk-navy:#172753; --sotk-blue:#2f5cba; --sotk-ink:#17243f; --sotk-muted:#5e6980; --sotk-line:#dee4f0; --sotk-paper:#fff; --sotk-soft:#f3f6fc; --sotk-focus:#1565d8; color:var(--sotk-ink); font:400 16px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif; background:#fff; padding:clamp(18px,3vw,42px) 0; }
.unud-sotk,.unud-sotk * { box-sizing:border-box; }
.unud-sotk h2,.unud-sotk h3,.unud-sotk h4,.unud-sotk p { margin:0; padding:0; }
.unud-sotk h2,.unud-sotk h3,.unud-sotk h4 { color:var(--sotk-navy); line-height:1.28; letter-spacing:-.03em; }
.unud-sotk a { color:inherit; text-decoration:none; }
.unud-sotk button { font:inherit; }
.unud-sotk a:focus-visible,.unud-sotk button:focus-visible,.unud-sotk summary:focus-visible { outline:3px solid var(--sotk-focus); outline-offset:3px; }
.unud-sotk img { max-width:100%; }
.unud-sotk [hidden] { display:none!important; }
.unud-sotk .sotk-shell { width:min(1180px, calc(100% - 32px)); margin:0 auto; }
.unud-sotk .sotk-hero { padding:clamp(24px,5vw,52px); border-radius:24px; color:white; background:linear-gradient(118deg, #172753 5%,#25457e 62%,#365f9e 100%); position:relative; overflow:hidden; box-shadow:0 18px 48px rgba(30,51,92,.13); }
.unud-sotk .sotk-hero:after { content:""; position:absolute; width:380px; height:380px; border:1px solid rgba(255,255,255,.15); border-radius:100%; right:-90px; top:-170px; box-shadow:0 0 0 64px rgba(255,255,255,.025),0 0 0 126px rgba(255,255,255,.02); pointer-events:none; }
.unud-sotk .sotk-eyebrow { display:inline-block; font-size:.74rem; font-weight:800; text-transform:uppercase; letter-spacing:.12em; margin-bottom:12px; color:#b9d2ff; }
.unud-sotk .sotk-hero h2 { color:white; font-size:clamp(1.65rem,3.6vw,2.85rem); max-width:720px; margin-bottom:13px; }
.unud-sotk .sotk-hero p { max-width:760px; font-size:1rem; color:#e0e9f8; }
.unud-sotk .sotk-hero-tools { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:24px; position:relative; z-index:1; }
.unud-sotk .sotk-action { display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:10px 17px; min-height:42px; font-weight:750; font-size:.9rem; border:1px solid transparent; border-radius:10px; cursor:pointer; line-height:1.35; transition:transform .15s ease,background .15s ease; }
.unud-sotk .sotk-action:hover { transform:translateY(-1px); }
.unud-sotk .sotk-action--light { background:white; color:#1b315d; }
.unud-sotk .sotk-action--outline { border-color:rgba(255,255,255,.55); color:white; background:transparent; }
.unud-sotk .sotk-action--dark { color:white; background:#254a9c; }
.unud-sotk .sotk-action--soft { color:#21457e; border-color:#ccd7ed; background:white; }
.unud-sotk .sotk-sect { margin-top:35px; scroll-margin-top:95px; }
.unud-sotk .sotk-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.unud-sotk .sotk-head h3 { font-size:clamp(1.32rem,2.2vw,1.8rem); }
.unud-sotk .sotk-head p { font-size:.93rem; color:var(--sotk-muted); max-width:640px; margin-top:5px; }
.unud-sotk .sotk-count { display:inline-flex; padding:5px 10px; border-radius:40px; background:#e4ebfa; color:#264780; font-size:.73rem; font-weight:750; white-space:nowrap; }
.unud-sotk .sotk-card { background:white; border:1px solid var(--sotk-line); box-shadow:0 10px 30px rgba(30,53,88,.045); border-radius:18px; padding:clamp(15px,2vw,24px); }
.unud-sotk .sotk-feature-line { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:14px; margin-bottom:12px; }
.unud-sotk .sotk-feature-line h4 { font-size:1.06rem; }
.unud-sotk .sotk-image-button { width:100%; display:block; padding:0; border:1px solid #e2e8f2; background:#eef1f7; border-radius:13px; position:relative; overflow:hidden; cursor:zoom-in; text-align:center; }
.unud-sotk .sotk-image-button img { display:block; width:100%; height:auto; }
.unud-sotk .sotk-image-button .sotk-image-cta { position:absolute; right:12px; bottom:12px; padding:8px 11px; color:#fff; background:rgba(21,39,75,.92); border-radius:8px; font-size:.8rem; font-weight:750; box-shadow:0 4px 12px rgba(0,0,0,.12); }
.unud-sotk .sotk-image-foot { margin-top:11px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:7px; color:var(--sotk-muted); font-size:.78rem; }
.unud-sotk .sotk-wr-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:15px; }
.unud-sotk .sotk-wr-link { display:block; border:1px solid #dfe6f2; border-top:4px solid var(--sotk-accent,#486cbb); border-radius:13px; padding:17px; background:white; min-height:142px; transition:border-color .2s,background .2s,transform .2s,box-shadow .2s; }
.unud-sotk .sotk-wr-link:hover,.unud-sotk .sotk-wr-link[aria-current="true"] { background:#f6f9ff; border-color:#96add7; border-top-color:var(--sotk-accent,#486cbb); box-shadow:0 6px 20px rgba(24,52,99,.08); transform:translateY(-2px); }
.unud-sotk .sotk-wr-label { font-size:.75rem; letter-spacing:.07em; font-weight:850; color:var(--sotk-accent,#486cbb); }
.unud-sotk .sotk-wr-name { display:block; margin-top:7px; font-weight:800; font-size:.93rem; color:#192b53; line-height:1.42; }
.unud-sotk .sotk-wr-view { display:block; margin-top:12px; color:#546785; font-size:.78rem; }
.unud-sotk .sotk-wr-panel { scroll-margin-top:100px; }
.unud-sotk .sotk-wr-panel + .sotk-wr-panel { margin-top:18px; }
.unud-sotk .sotk-wr-panel-top { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:12px; }
.unud-sotk .sotk-wr-panel h4 { font-size:1.19rem; }
.unud-sotk .sotk-unit-list { margin:12px 0 0!important; display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0!important; }
.unud-sotk .sotk-unit-list li { border:1px solid #e1e8f5; background:#f5f8fd; color:#314365; border-radius:7px; padding:6px 9px; font-size:.78rem; line-height:1.5; }
.unud-sotk .sotk-subtle { font-size:.83rem; color:var(--sotk-muted); }
.unud-sotk .sotk-accordions { display:grid; gap:12px; }
.unud-sotk .sotk-accordion { background:white; border:1px solid var(--sotk-line); border-radius:13px; overflow:hidden; box-shadow:0 5px 16px rgba(22,46,84,.03); }
.unud-sotk .sotk-accordion[open] { border-color:#bdcce8; }
.unud-sotk .sotk-accordion summary { list-style:none; padding:19px 18px; display:flex; justify-content:space-between; align-items:center; gap:12px; cursor:pointer; }
.unud-sotk .sotk-accordion summary::-webkit-details-marker { display:none; }
.unud-sotk .sotk-summary-info { display:flex; flex-direction:column; gap:3px; }
.unud-sotk .sotk-summary-info strong { font-size:.99rem; color:#182b52; line-height:1.35; }
.unud-sotk .sotk-summary-info small { color:var(--sotk-muted); font-size:.77rem; }
.unud-sotk .sotk-chevron { flex:none; display:grid; place-items:center; border:1px solid #dbe3f1; border-radius:50%; width:31px; height:31px; color:#3c5b92; background:#f5f8fd; font-size:1.2rem; line-height:1; transition:transform .2s; }
.unud-sotk .sotk-accordion[open] .sotk-chevron { transform:rotate(45deg); }
.unud-sotk .sotk-accordion-content { padding:0 18px 18px; border-top:1px solid #edf1f8; }
.unud-sotk .sotk-accordion-content > p { color:var(--sotk-muted); font-size:.85rem; padding:12px 0 10px; }
.unud-sotk .sotk-doc { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:15px; padding:23px; border:1px solid #cad6ed; border-radius:16px; background:linear-gradient(120deg,#ecf2ff,#fff); }
.unud-sotk .sotk-doc strong { font-size:1rem; color:var(--sotk-navy); }
.unud-sotk .sotk-doc p { margin-top:5px; font-size:.82rem; color:#4e5f80; max-width:700px; }
.unud-sotk .sotk-note { margin-top:18px; font-size:.77rem; color:#6b7487; }
.unud-sotk .sotk-anchor { scroll-margin-top:100px; }
/* Modal may be portaled elsewhere by browser top layer; keep selectors independent of parent. */
dialog.sotk-viewer { width:min(98vw,1560px); height:min(95vh,1100px); max-width:none; max-height:none; padding:0; color:#fff; border:0; border-radius:16px; background:#111c34; box-shadow:0 15px 80px rgba(0,0,0,.35); overflow:hidden; }
dialog.sotk-viewer::backdrop { background:rgba(2,9,25,.85); }
.sotk-viewer-inner { width:100%; height:100%; display:flex; flex-direction:column; }
.sotk-viewer-toolbar { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:9px; padding:12px 15px; background:#162549; color:#fff; }
.sotk-viewer-title { font-size:.86rem; font-weight:750; max-width:min(550px,100%); }
.sotk-viewer-controls { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.sotk-viewer-controls button { min-width:38px; height:36px; padding:5px 9px; border:1px solid #64718b; border-radius:7px; color:#fff; background:#2c3e61; font:600 .87rem system-ui,sans-serif; cursor:pointer; }
.sotk-viewer-controls button:hover { background:#395784; }
.sotk-viewer-percent { font:.78rem system-ui,sans-serif; min-width:42px; text-align:center; }
.sotk-viewer-stage { flex:1; min-height:0; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; background:#e3e7f0; cursor:grab; touch-action:none; }
.sotk-viewer-stage.is-dragging { cursor:grabbing; }
.sotk-viewer-stage img { display:block; width:100%; height:100%; object-fit:contain; max-width:none; max-height:none; transform-origin:center center; user-select:none; -webkit-user-drag:none; pointer-events:none; will-change:transform; }
.sotk-viewer-help { padding:9px 14px; font-size:.73rem; color:#c8d3e8; background:#162549; text-align:center; }
@media(max-width:960px){ .unud-sotk .sotk-wr-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .unud-sotk .sotk-wr-link{min-height:115px} }
@media(max-width:600px){ .unud-sotk{padding:16px 0} .unud-sotk .sotk-shell{width:calc(100% - 24px)} .unud-sotk .sotk-hero{padding:25px 20px;border-radius:16px} .unud-sotk .sotk-wr-grid{gap:9px} .unud-sotk .sotk-wr-link{padding:12px;min-height:132px} .unud-sotk .sotk-wr-name{font-size:.83rem} .unud-sotk .sotk-sect{margin-top:27px} .unud-sotk .sotk-head{align-items:flex-start;flex-direction:column} .unud-sotk .sotk-image-button .sotk-image-cta{font-size:.7rem;padding:6px 8px;right:7px;bottom:7px} .unud-sotk .sotk-doc{padding:17px} dialog.sotk-viewer{width:100vw;height:100dvh;border-radius:0} .sotk-viewer-toolbar{padding:9px;align-items:flex-start} .sotk-viewer-title{font-size:.76rem;max-width:100%} .sotk-viewer-controls{width:100%;justify-content:flex-end} .sotk-viewer-help{font-size:.66rem} }
@media(prefers-reduced-motion:reduce){ .unud-sotk * {transition:none!important;scroll-behavior:auto!important} }
@media print { .unud-sotk {background:white!important} .unud-sotk .sotk-hero {box-shadow:none} .unud-sotk .sotk-wr-grid, .unud-sotk .sotk-action {display:none!important} .unud-sotk .sotk-wr-panel[hidden]{display:block!important} .unud-sotk details {break-inside:avoid} }