:root{
  --pc-top:#6DB4B9;
  --pc-mid:#5AA699;
  --pc-green:#4D9B73;
  --pc-deep:#2F8F65;
  --pc-cream:#F4E8A0;
  --pc-off:#F1F5F2;
  --pc-ink:#121814;
  --pc-muted:#617069;
  --pc-line:#DCE7E1;
  --pc-white:#FFFFFF;
  --pc-gradient:linear-gradient(145deg,#6DB4B9 0%,#5AA699 48%,#4D9B73 100%);
  --pc-gradient-deep:linear-gradient(145deg,#4D9B73 0%,#2F8F65 100%);
}
.text-primary{color:#2F8F65!important}.bg-primary{background-color:#2F8F65!important}.bg-primary-subtle{background-color:#E7F4EE!important}.border-primary-subtle{border-color:#C7DED2!important}.btn-primary{--bs-btn-bg:#2F8F65;--bs-btn-border-color:#2F8F65;--bs-btn-hover-bg:#277D59;--bs-btn-hover-border-color:#277D59}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:110px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:'Plus Jakarta Sans',sans-serif;background:#fff;color:var(--pc-ink);margin:0}
a{text-decoration:none}
.portal-nav{background:rgba(255,255,255,.96);backdrop-filter:blur(15px);border-bottom:1px solid rgba(220,231,225,.92);box-shadow:0 8px 26px rgba(18,24,20,.04)}
.portal-brand{display:flex;align-items:center;gap:.72rem;color:var(--pc-ink);font-weight:800;letter-spacing:-.35px}
.portal-brand-mark{width:42px;height:42px;border-radius:14px;background:var(--pc-gradient-deep);display:grid;place-items:center;color:#fff;box-shadow:0 10px 24px rgba(47,143,101,.22)}
.portal-brand-logo{display:block;width:auto;height:54px;max-width:min(330px,66vw);object-fit:contain}
.portal-brand small{display:block;color:#7b8781;font-size:.66rem;font-weight:650;letter-spacing:0;margin-top:1px}
.foot-logo{width:48px;height:48px;object-fit:cover;border-radius:14px;flex:0 0 auto;box-shadow:0 8px 22px rgba(0,0,0,.18)}
.portal-nav .nav-link{color:#5c6962;font-weight:650;font-size:.9rem;padding:.58rem .78rem!important;border-radius:.72rem}
.portal-nav .nav-link:hover,.portal-nav .nav-link.active{color:var(--pc-deep);background:#EAF4EF}
.btn-portal{border:0;border-radius:.78rem;background:var(--pc-deep);color:#fff;font-weight:750;padding:.66rem 1.05rem;box-shadow:0 8px 20px rgba(47,143,101,.18)}
.btn-portal:hover{background:#277d59;color:#fff;transform:translateY(-1px)}
.btn-portal-cream{border:0;border-radius:.85rem;background:var(--pc-cream);color:var(--pc-ink);font-weight:800;padding:.78rem 1.18rem;box-shadow:0 10px 24px rgba(63,80,65,.16)}
.btn-portal-cream:hover{background:#f8edb3;color:var(--pc-ink);transform:translateY(-1px)}
.btn-portal-outline{border:1px solid #bfd4c9;border-radius:.78rem;background:#fff;color:var(--pc-deep);font-weight:750;padding:.62rem 1rem}
.btn-portal-outline:hover{background:#ECF5F0;color:#246f50;border-color:#a9c8b8}

/* Public hero: one focal message, not a dashboard */
.portal-hero{position:relative;overflow:hidden;background:var(--pc-gradient);color:#fff;padding:5.8rem 0 5.2rem}
.portal-hero:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-190px;top:-250px;background:rgba(244,232,160,.15)}
.portal-hero:after{content:"";position:absolute;width:360px;height:360px;border-radius:50%;left:-210px;bottom:-220px;background:rgba(255,255,255,.12)}
.hero-pattern{position:absolute;inset:0;opacity:.13;background-image:radial-gradient(rgba(255,255,255,.7) 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(to right,black,transparent 78%)}
.hero-kicker{display:inline-flex;gap:.5rem;align-items:center;padding:.42rem .72rem;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-size:.74rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.hero-title{font-size:clamp(2.65rem,5.8vw,5.05rem);line-height:1.02;letter-spacing:-.055em;font-weight:800;max-width:900px;margin-top:1rem}
.hero-title-detail{display:block;margin-top:.45rem;font-size:.52em;line-height:1.22;letter-spacing:-.035em;font-weight:700}
.hero-title .accent{color:var(--pc-cream)}
.hero-copy{max-width:700px;color:rgba(255,255,255,.86);font-size:1.04rem;line-height:1.78}
.hero-tagline{color:#fff;font-size:1rem;line-height:1.6;font-weight:800;letter-spacing:-.01em}
.hero-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.65rem}
.hero-actions .btn-ghost{border:1px solid rgba(255,255,255,.42);border-radius:.85rem;color:#fff;font-weight:750;padding:.76rem 1.16rem;background:rgba(255,255,255,.08)}
.hero-actions .btn-ghost:hover{background:rgba(255,255,255,.16);color:#fff}
.hero-visual{position:relative;min-height:330px;display:flex;align-items:center;justify-content:center}
.hero-orbit{width:315px;height:315px;border-radius:50%;border:1px solid rgba(255,255,255,.24);display:grid;place-items:center;position:relative}
.hero-orbit:before{content:"";position:absolute;inset:34px;border-radius:50%;border:1px dashed rgba(255,255,255,.28)}
.hero-focus-card{width:205px;background:rgba(255,255,255,.95);color:var(--pc-ink);border-radius:1.35rem;padding:1.3rem;box-shadow:0 24px 70px rgba(28,73,60,.25);position:relative;z-index:2}
.hero-focus-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#E4F2EC;color:var(--pc-deep);font-size:1.25rem;margin-bottom:.9rem}
.hero-focus-card h3{font-size:1rem;font-weight:800;margin:0 0 .4rem}
.hero-focus-card p{font-size:.75rem;line-height:1.55;color:#67756e;margin:0}
.orbit-chip{position:absolute;background:#fff;color:var(--pc-ink);border-radius:999px;padding:.5rem .72rem;font-size:.72rem;font-weight:750;box-shadow:0 8px 24px rgba(28,73,60,.18)}
.orbit-chip.one{top:24px;right:-4px}.orbit-chip.two{bottom:55px;right:-25px}.orbit-chip.three{bottom:25px;left:-15px}.orbit-chip.four{top:62px;left:-24px}

.portal-stats-wrap{margin-top:-36px;position:relative;z-index:3}
.portal-stats{background:#fff;border:1px solid var(--pc-line);border-radius:1.15rem;box-shadow:0 17px 42px rgba(37,82,65,.09);padding:.35rem}
.portal-stat{padding:1.15rem 1.25rem;height:100%;position:relative}
.portal-stat:not(.last):after{content:"";position:absolute;right:0;top:22%;height:56%;width:1px;background:var(--pc-line)}
.portal-stat strong{display:block;color:var(--pc-deep);font-size:1.7rem;letter-spacing:-.045em}
.portal-stat span{display:block;color:var(--pc-muted);font-size:.76rem;margin-top:.25rem}

.section-space{padding:5.2rem 0}
.section-soft{background:var(--pc-off)}
.section-kicker{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;font-weight:850;color:var(--pc-deep);margin-bottom:.6rem}
.section-title{font-size:clamp(1.75rem,3vw,2.65rem);font-weight:800;letter-spacing:-.042em;color:var(--pc-ink)}
.section-copy{color:var(--pc-muted);line-height:1.75;max-width:690px}

.category-card{height:100%;background:#fff;border:1px solid var(--pc-line);border-radius:1.05rem;padding:1.25rem;transition:.2s ease}
.category-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(47,94,75,.085);border-color:#c8ddd2}
.category-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#E8F4EE;color:var(--pc-deep);font-size:1.2rem}
.category-card h3{font-size:.98rem;font-weight:800;color:var(--pc-ink);margin-top:.95rem}
.category-card p{font-size:.8rem;color:var(--pc-muted);line-height:1.6;margin-bottom:.8rem}
.category-count{font-size:.7rem;color:#68756e;background:#F4F7F5;border:1px solid var(--pc-line);padding:.3rem .48rem;border-radius:999px}
.category-card .go{font-size:.76rem;color:var(--pc-deep);font-weight:800}

.activity-public-card{height:100%;background:#fff;border:1px solid var(--pc-line);border-radius:1.08rem;overflow:hidden;transition:.2s ease;box-shadow:0 7px 22px rgba(37,82,65,.035)}
.activity-public-card:hover{transform:translateY(-4px);box-shadow:0 17px 36px rgba(37,82,65,.09)}
.activity-cover{height:78px;padding:.75rem 1rem;background:linear-gradient(135deg,#E7F3EF,#F6F0C9);display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}
.activity-cover:before{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-38px;top:-58px;background:rgba(77,155,115,.12)}
.activity-cover-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#fff;color:var(--pc-deep);font-size:1rem;box-shadow:0 7px 16px rgba(47,143,101,.1);z-index:2}
.activity-public-body{padding:1.05rem}
.activity-meta{display:flex;flex-wrap:wrap;gap:.35rem;color:#718078;font-size:.68rem}
.activity-meta span{background:#F6F8F7;border:1px solid var(--pc-line);padding:.24rem .42rem;border-radius:.48rem}
.activity-public-body h3{font-size:.96rem;line-height:1.45;font-weight:800;margin:.72rem 0 .48rem;color:var(--pc-ink)}
.activity-public-body p{font-size:.78rem;line-height:1.58;color:var(--pc-muted);margin-bottom:.7rem}
.activity-link{font-size:.75rem;font-weight:800;color:var(--pc-deep)}
.activity-rating{display:flex;align-items:center;gap:.35rem;margin:-.15rem 0 .55rem;font-size:.7rem;color:#748078}.activity-rating .stars{display:flex;gap:.08rem;color:#E6A817}.activity-rating strong{color:var(--pc-ink)}
.activity-popularity{position:relative;z-index:2;padding:.2rem .48rem;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid rgba(47,143,101,.18);color:#557067;font-size:.61rem;font-weight:800}.popularity-paling-popular{background:#2f8f65;color:#fff;border-color:#2f8f65}.popularity-popular{background:#fff5c9;color:#795f00;border-color:#eadb8f}.popularity-pilihan-komuniti{background:#e7f3ef;color:#246e50}

.process-strip{background:#fff;border:1px solid var(--pc-line);border-radius:1.2rem;padding:1.05rem;box-shadow:0 8px 26px rgba(37,82,65,.04)}
.process-step{display:flex;align-items:center;gap:.75rem;padding:.75rem}
.process-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#E8F4EE;color:var(--pc-deep);flex:0 0 auto}
.process-step strong{font-size:.82rem}.process-step span{font-size:.7rem;color:var(--pc-muted);display:block;margin-top:.15rem}
.process-arrow{color:#9fb0a6;display:grid;place-items:center}

.feedback-panel{background:linear-gradient(145deg,#316f55,#2F8F65);border-radius:1.4rem;padding:2rem;color:#fff;position:relative;overflow:hidden}
.feedback-panel:after{content:"“";position:absolute;right:22px;top:-48px;font-size:12rem;color:rgba(244,232,160,.10);font-family:Georgia,serif}
.feedback-card{height:100%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:1rem;padding:1rem;position:relative;z-index:2}
.feedback-card p{color:rgba(255,255,255,.86);font-size:.8rem;line-height:1.65}
.feedback-user{font-size:.76rem;font-weight:750}.feedback-activity{font-size:.68rem;color:rgba(255,255,255,.62)}
.portal-cta{background:linear-gradient(145deg,#5AA699,#2F8F65);border-radius:1.4rem;color:#fff;padding:2.2rem;position:relative;overflow:hidden}
.portal-cta:before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-80px;top:-120px;background:rgba(244,232,160,.14)}
.portal-footer{background:#17352A;color:#BFCBC5;padding:3.2rem 0 2rem}
.portal-footer h6{color:#fff;font-weight:800}.portal-footer a{color:#D5DFDA;font-size:.8rem;display:block;margin:.35rem 0}.portal-footer a:hover{color:var(--pc-cream)}
.portal-footer .foot-mark{width:44px;height:44px;border-radius:14px;background:rgba(244,232,160,.14);display:grid;place-items:center;color:var(--pc-cream)}

.auth-shell{min-height:calc(100vh - 76px);background:radial-gradient(circle at 10% 10%,#E4F1EC 0,transparent 36%),radial-gradient(circle at 90% 5%,#F8F1C7 0,transparent 31%),var(--pc-off);padding:4rem 0}
.card-custom{border:1px solid var(--pc-line);border-radius:1.05rem;background:#fff;box-shadow:0 14px 36px rgba(37,82,65,.075)}
.btn-purple,.btn-hap{background:var(--pc-deep);color:#fff;border:0;font-weight:750;border-radius:.78rem;padding:.66rem 1.04rem}
.btn-purple:hover,.btn-hap:hover{background:#277d59;color:#fff}
.btn-outline-purple{border:1px solid #bfd4c9;color:var(--pc-deep);background:#fff;font-weight:700;border-radius:.78rem}.btn-outline-purple:hover{background:#ECF5F0;color:#215f45}
.btn-amber{background:var(--pc-cream);color:var(--pc-ink);border:0;border-radius:.78rem;font-weight:800}

/* Shared portal pages: the same hero, spacing and cards as the home page. */
.portal-inner{--bs-link-color:var(--pc-deep);--bs-link-hover-color:#246f50;--bs-border-color:var(--pc-line)}
.portal-inner .portal-banner{padding:2.7rem 0 3rem}
.portal-banner>.container{z-index:2}
.portal-banner .hero-title{font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1.18;letter-spacing:-.04em;margin:.85rem 0 .7rem;overflow-wrap:anywhere}
.portal-banner .hero-copy{font-size:.92rem;max-width:760px}
.portal-banner-icon{width:100px;height:100px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(255,255,255,.12);color:var(--pc-cream);font-size:2.6rem;box-shadow:0 0 0 18px rgba(255,255,255,.05)}
.portal-inner main>.container{padding-top:2.5rem!important;padding-bottom:4rem!important}
.portal-inner .breadcrumb{font-size:.75rem;row-gap:.4rem;margin-bottom:1.8rem}
.portal-inner .breadcrumb a{color:var(--pc-deep)}
.portal-inner .breadcrumb-item.active,.portal-inner .text-muted{color:var(--pc-muted)!important}
.portal-inner .card-custom{border-radius:1.08rem;box-shadow:0 7px 22px rgba(37,82,65,.035)}
.portal-inner .bg-light{background-color:var(--pc-off)!important}
.portal-inner .form-control,.portal-inner .form-select{border-color:var(--pc-line);border-radius:.7rem;color:var(--pc-ink)}
.portal-inner .form-control:focus,.portal-inner .form-select:focus{border-color:var(--pc-green);box-shadow:0 0 0 .2rem rgba(47,143,101,.13)}
.portal-inner .form-check-input:checked{background-color:var(--pc-deep);border-color:var(--pc-deep)}
.portal-inner .form-check-input:focus{border-color:var(--pc-green);box-shadow:0 0 0 .2rem rgba(47,143,101,.13)}
.portal-inner .btn-amber:hover{background:#f8edb3;color:var(--pc-ink)}
.portal-inner .page-link{color:var(--pc-deep);border-color:var(--pc-line)}
.portal-inner .active>.page-link{color:white;background:var(--pc-deep);border-color:var(--pc-deep)}
.portal-inner .page-link:focus{box-shadow:0 0 0 .2rem rgba(47,143,101,.13)}
.portal-inner .auth-shell{min-height:0;background:var(--pc-off);padding:3rem 0 4rem}
.portal-inner .modal-content,.portal-inner .offcanvas{background:#fff;color:var(--pc-ink)}
.portal-inner .badge-expert,.portal-inner .badge-admin,.portal-inner .badge-lecturer{display:inline-block;padding:.25rem .5rem;border:1px solid var(--pc-line);border-radius:.5rem;background:#E8F4EE;color:var(--pc-deep);font-size:.7rem}
.portal-inner [id]{scroll-margin-top:110px}
.portal-situation{border:1px solid #C7DED2;border-radius:1rem;background:linear-gradient(135deg,#E7F3EF,#F6F0C9)}
.activity-duration{background:#fff;color:var(--pc-deep);border:1px solid var(--pc-line)}
@media(max-width:991.98px){
  .portal-inner .portal-banner{padding:2.3rem 0}
  .portal-inner main>.container{padding-top:1.7rem!important;padding-bottom:3rem!important}
  .portal-inner main .sticky-top{position:static}
}
@media(max-width:575.98px){
  .portal-banner .hero-kicker{font-size:.6rem;letter-spacing:.04em}
  .portal-inner .portal-banner{padding:2rem 0}
  .portal-brand small{font-size:.57rem}
}

@media(max-width:991.98px){
  .portal-hero{padding:4.2rem 0 4rem}.hero-visual{min-height:280px}.hero-orbit{width:270px;height:270px}.hero-title{font-size:clamp(2.45rem,10vw,4rem)}
  .portal-stat:not(.last):after{display:none}.portal-stat{border-bottom:1px solid var(--pc-line)}
}
@media(max-width:575.98px){
  .section-space{padding:4rem 0}.portal-hero{padding-top:3.7rem}.hero-copy{font-size:.95rem}.hero-visual{display:none}.portal-stats-wrap{margin-top:-22px}
}