{"id":3186,"date":"2025-08-15T04:50:26","date_gmt":"2025-08-15T04:50:26","guid":{"rendered":"https:\/\/staging.pai.uin-malang.ac.id\/?page_id=3186"},"modified":"2026-05-25T05:05:35","modified_gmt":"2026-05-25T05:05:35","slug":"struktur-organisasi-2","status":"publish","type":"page","link":"https:\/\/pai.uin-malang.ac.id\/?page_id=3186","title":{"rendered":"Struktur Organisasi"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3186\" class=\"elementor elementor-3186\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cf62f44 e-flex e-con-boxed e-con e-parent\" data-id=\"cf62f44\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1b42d4e elementor-widget elementor-widget-html\" data-id=\"1b42d4e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\nbody{\r\n  font-family:'Poppins',sans-serif;\r\n  background:#fff;\r\n  overflow-x:hidden;\r\n}\r\n\r\n.structure-section{\r\n  min-height:100vh;\r\n\r\n  display:flex;\r\n  justify-content:center;\r\n  align-items:center;\r\n\r\n  padding:100px 20px;\r\n\r\n  position:relative;\r\n}\r\n\r\n\/* BACKGROUND GLOW *\/\r\n\r\n.glow{\r\n  position:fixed;\r\n  width:350px;\r\n  height:350px;\r\n  border-radius:50%;\r\n  filter:blur(120px);\r\n  opacity:.18;\r\n  z-index:0;\r\n}\r\n\r\n.glow.one{\r\n  background:#0ea5e9;\r\n  top:-100px;\r\n  left:-100px;\r\n}\r\n\r\n.glow.two{\r\n  background:#f59e0b;\r\n  bottom:-100px;\r\n  right:-100px;\r\n}\r\n\r\n\/* WRAPPER *\/\r\n\r\n.structure-wrapper{\r\n  position:relative;\r\n  z-index:2;\r\n  width:100%;\r\n  max-width:1200px;\r\n  margin:auto;\r\n}\r\n\r\n\/* TITLE *\/\r\n\r\n.title{\r\n  text-align:center;\r\n  margin-bottom:70px;\r\n}\r\n\r\n.title span{\r\n  color:#07111f;\r\n  font-size:.9rem;\r\n  font-weight:600;\r\n  letter-spacing:3px;\r\n  text-transform:uppercase;\r\n}\r\n\r\n.title h1{\r\n  color:#07111f;\r\n  font-size:48px;\r\n  margin-top:15px;\r\n  line-height:1.2;\r\n}\r\n\r\n\/* AREA *\/\r\n\r\n.cards-area{\r\n  position:relative;\r\n  display:flex;\r\n  justify-content:center;\r\n  align-items:center;\r\n  gap:90px;\r\n  flex-wrap:wrap;\r\n}\r\n\r\n\/* CONNECTOR *\/\r\n\r\n.connector-line{\r\n  position:absolute;\r\n  width:260px;\r\n  height:3px;\r\n  background:linear-gradient(\r\n    to right,\r\n    transparent,\r\n    #07111f,\r\n    transparent\r\n  );\r\n  top:50%;\r\n  left:50%;\r\n  transform:translate(-50%, -50%);\r\n  z-index:1;\r\n}\r\n\r\n.connector-line::before,\r\n.connector-line::after{\r\n  content:'';\r\n  position:absolute;\r\n  width:14px;\r\n  height:14px;\r\n  background:#38bdf8;\r\n  border-radius:50%;\r\n  top:50%;\r\n  transform:translateY(-50%);\r\n  box-shadow:0 0 20px #38bdf8;\r\n}\r\n\r\n.connector-line::before{\r\n  left:-7px;\r\n}\r\n\r\n.connector-line::after{\r\n  right:-7px;\r\n}\r\n\r\n\/* CARD *\/\r\n\r\n.profile-card{\r\n  position:relative;\r\n  width:420px;\r\n  background:#07111f;\r\n  border:1px solid rgba(255,255,255,.08);\r\n  border-radius:28px;\r\n  padding:30px;\r\n  display:flex;\r\n  align-items:center;\r\n  gap:22px;\r\n  backdrop-filter:blur(16px);\r\n  overflow:hidden;\r\n  z-index:2;\r\n  transition:.35s ease;\r\n  box-shadow:0 20px 40px rgba(0,0,0,.35);\r\n}\r\n\r\n.profile-card:hover{\r\n  transform:translateY(-10px);\r\n  border-color:rgba(56,189,248,.5);\r\n  box-shadow:#07111f);\r\n}\r\n\r\n.profile-card::before{\r\n  content:'';\r\n\r\n  position:absolute;\r\n  inset:0;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle at var(--x) var(--y),\r\n      rgba(56,189,248,.18),\r\n      transparent 35%\r\n    );\r\n\r\n  opacity:0;\r\n\r\n  transition:opacity .25s ease;\r\n\r\n  pointer-events:none;\r\n}\r\n\r\n.profile-card:hover::before{\r\n  opacity:1;\r\n}\r\n\r\n\/* STATUS *\/\r\n\r\n.status{\r\n  position:absolute;\r\n  top:20px;\r\n  right:20px;\r\n  width:12px;\r\n  height:12px;\r\n  border-radius:50%;\r\n  background:#22c55e;\r\n  box-shadow:0 0 15px #22c55e;\r\n}\r\n\r\n\/* IMAGE *\/\r\n\r\n.profile-image{\r\n  position:relative;\r\n\r\n  width:110px;\r\n  height:130px;\r\n  min-width:110px;\r\n\r\n  border-radius:24px;\r\n\r\n  overflow:hidden;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      rgba(56,189,248,.35),\r\n      rgba(245,158,11,.25)\r\n    );\r\n\r\n  padding:3px;\r\n\r\n  box-shadow:\r\n    0 15px 35px rgba(0,0,0,.35),\r\n    inset 0 1px 1px rgba(255,255,255,.15);\r\n\r\n  transition:.4s ease;\r\n}\r\n\r\n\/* INNER IMAGE *\/\r\n\r\n.profile-image img{\r\n  width:100%;\r\n  height:100%;\r\n  object-fit:cover;\r\n\r\n  border-radius:21px;\r\n\r\n  transition:.45s ease;\r\n}\r\n\r\n\/* GLOSS EFFECT *\/\r\n\r\n.profile-image::before{\r\n  content:'';\r\n\r\n  position:absolute;\r\n  inset:0;\r\n\r\n  background:linear-gradient(\r\n    135deg,\r\n    rgba(255,255,255,.28),\r\n    transparent 35%\r\n  );\r\n\r\n  z-index:2;\r\n  pointer-events:none;\r\n}\r\n\r\n\/* HOVER *\/\r\n\r\n.profile-card:hover .profile-image{\r\n  transform:translateY(-6px) rotate(-2deg);\r\n}\r\n\r\n.profile-card:hover .profile-image img{\r\n  transform:scale(1.06);\r\n}\r\n\/* CONTENT *\/\r\n\r\n.profile-content{\r\n  flex:1;\r\n}\r\n\r\n.role{\r\n  color:#fff;\r\n  font-size:.8rem;\r\n  font-weight:600;\r\n  letter-spacing:1.5px;\r\n  text-transform:uppercase;\r\n  margin-bottom:10px;\r\n}\r\n\r\n.name{\r\n  color:#fff;\r\n  font-size:1.45rem;\r\n  font-weight:700;\r\n  line-height:1.3;\r\n  margin-bottom:10px;\r\n}\r\n\r\n.desc{\r\n  color:#fff;\r\n  font-size:.95rem;\r\n  line-height:1.7;\r\n}\r\n\r\n\/* MOBILE *\/\r\n\r\n@media(max-width:950px){\r\n\r\n  .cards-area{\r\n    flex-direction:column;\r\n    gap:50px;\r\n  }\r\n\r\n  .connector-line{\r\n    width:3px;\r\n    height:120px;\r\n  }\r\n\r\n  .connector-line::before{\r\n    left:50%;\r\n    top:-7px;\r\n    transform:translateX(-50%);\r\n  }\r\n\r\n  .connector-line::after{\r\n    left:50%;\r\n    top:auto;\r\n    bottom:-7px;\r\n    transform:translateX(-50%);\r\n  }\r\n\r\n}\r\n\r\n@media(max-width:600px){\r\n\r\n  body{\r\n    padding:60px 15px;\r\n  }\r\n\r\n  .title h1{\r\n    font-size:32px;\r\n  }\r\n\r\n  .profile-card{\r\n    width:100%;\r\n    padding:22px;\r\n    gap:16px;\r\n  }\r\n\r\n  .profile-image{\r\n    width:75px;\r\n    height:75px;\r\n    min-width:75px;\r\n  }\r\n\r\n  .name{\r\n    font-size:1.1rem;\r\n  }\r\n\r\n  .desc{\r\n    font-size:.88rem;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n<!-- GLOW -->\r\n<div class=\"glow one\"><\/div>\r\n<div class=\"glow two\"><\/div>\r\n\r\n<section class=\"structure-section\">\r\n<div class=\"structure-wrapper\">\r\n\r\n  <!-- TITLE -->\r\n  <div class=\"title\">\r\n    <span>Program Structure<\/span>\r\n    <h1>Struktur Program Studi<\/h1>\r\n  <\/div>\r\n\r\n  <!-- CARDS -->\r\n  <div class=\"cards-area\">\r\n\r\n    <!-- CONNECTOR -->\r\n    <div class=\"connector-line\"><\/div>\r\n\r\n    <!-- CARD 1 -->\r\n    <div class=\"profile-card\">\r\n\r\n      <div class=\"status\"><\/div>\r\n\r\n      <div class=\"profile-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/img.lightshot.app\/c4n4y7IFT7SpDQv_HpfQag.png\" alt=\"\">\r\n      <\/div>\r\n\r\n      <div class=\"profile-content\">\r\n\r\n        <div class=\"role\">\r\n          Ketua Program Studi\r\n        <\/div>\r\n\r\n        <div class=\"name\">\r\n          Dr. Laily Nur Arifa, M.Pd\r\n        <\/div>\r\n\r\n        <div class=\"desc\">\r\n          Memimpin pengembangan akademik dan manajemen Program Studi Pendidikan Agama Islam.\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n    <!-- CARD 2 -->\r\n    <div class=\"profile-card\">\r\n\r\n      <div class=\"status\"><\/div>\r\n\r\n      <div class=\"profile-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/img.lightshot.app\/O-RxAG3YTK2Xes13PgH8cA.png\" alt=\"\">\r\n      <\/div>\r\n\r\n      <div class=\"profile-content\">\r\n\r\n        <div class=\"role\">\r\n          Sekretaris Program Studi\r\n        <\/div>\r\n\r\n        <div class=\"name\">\r\n          Shidqi Ahyani M,Ag\r\n        <\/div>\r\n\r\n        <div class=\"desc\">\r\n          Mengelola administrasi akademik, dokumentasi, dan layanan informasi program studi.\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/div>\r\n<\/section>\r\n\r\n<script>\r\n\r\nconst cards = document.querySelectorAll('.profile-card');\r\n\r\ncards.forEach(card => {\r\n\r\n  card.addEventListener('mousemove', e => {\r\n\r\n    const rect = card.getBoundingClientRect();\r\n\r\n    const x = e.clientX - rect.left;\r\n    const y = e.clientY - rect.top;\r\n\r\n    card.style.setProperty('--x', `${x}px`);\r\n    card.style.setProperty('--y', `${y}px`);\r\n\r\n  });\r\n\r\n});\r\n\r\n      card.addEventListener('mouseleave', () => {\r\n    \r\n      card.style.background = '';\r\n    \r\n    });\r\n\r\n});\r\n\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Program Structure Struktur Program Studi Ketua Program Studi Dr. Laily Nur Arifa, M.Pd Memimpin pengembangan akademik dan manajemen Program Studi Pendidikan Agama Islam. Sekretaris Program Studi Shidqi Ahyani M,Ag Mengelola administrasi akademik, dokumentasi, dan layanan informasi program studi.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-3186","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=\/wp\/v2\/pages\/3186","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3186"}],"version-history":[{"count":103,"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=\/wp\/v2\/pages\/3186\/revisions"}],"predecessor-version":[{"id":5541,"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=\/wp\/v2\/pages\/3186\/revisions\/5541"}],"wp:attachment":[{"href":"https:\/\/pai.uin-malang.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3186"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}