/* =========================
   PKJ JODOH — FINAL CLEAN
   Scope: .pkj-jodoh-page
   ========================= */

/* Vars */
.pkj-jodoh-page{
  --pkj-gold:#F2C94C;
  --pkj-gold-d:#E0B74A;
  --pkj-narrow:740px;
  --pkj-gutter:0px;
  --pkj-input-h:56px;
  --pkj-gap:14px;
  /* tidak ada padding-bottom di sini */
}

/* Hanya halaman landing yang diberi ruang bawah */
.pkj-jodoh-page.pkj-jodoh-landing{ padding-bottom:72px; }

/* Halaman hasil: tanpa ruang ekstra (atau kecilkan jika mau) */
.pkj-jodoh-page.pkj-result{ padding-bottom:0; }      /* boleh 0–16px sesuai selera */


/* ---------- HERO ---------- */
.pkj-jodoh-page .pkj-hero{ background:none; padding:.25rem 0 0; }
.pkj-jodoh-page .pkj-hero::before{ display:none; }
.pkj-jodoh-page .pkj-hero-sub{ color:#fff; opacity:.95; text-align:left; }
@media (min-width:1024px){ .pkj-jodoh-page .pkj-hero-sub{ text-align:center; } }

/* H1 — gold foil + drop shadow */
.pkj-jodoh-page .pkj-hero-h1,
.pkj-jodoh-page h1.pkj-title{
  font-weight:900;
  font-size:clamp(26px,4.5vw,44px);
  letter-spacing:.06em;
  text-transform:uppercase;
  margin:0 0 .6rem;
  background:linear-gradient(180deg,#fff7bf 0%,#ffe066 28%,#f7cf42 58%,#f1c40f 78%,#cfa50c 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.40)) drop-shadow(0 6px 18px rgba(245,194,59,.18));
}
@media (min-width:1024px){ .pkj-jodoh-page .pkj-hero-h1{ text-align:center; } }

/* ---------- GRID WIDTH (DESKTOP) — Landing digeser kiri ---------- */
@media (min-width:1024px){
  .pkj-jodoh-page.pkj-jodoh-landing :is(
    .pkj-hero,
    .pkj-note,
    .pkj-article-hero,
    .prose-pkj,
    .pkj-faq,
    .pkj-disclaimer,
    .pkj-author-card,
    .pkj-share-buttons,
    .pkj-meta-pill               /* ← ditambahkan & koma dibetulkan */
  ){
    max-width: var(--pkj-narrow);
    margin-left: 48px;
    margin-right: auto;
    padding-left: var(--pkj-gutter);
    padding-right: var(--pkj-gutter);
    box-sizing: border-box;
  }
}

/* ---------- FORM (MATCH NARRATIVE: ukuran & jarak) ---------- */
.pkj-jodoh-page .pkj-weton-form{
  max-width: var(--pkj-narrow);
  margin: 12px auto 14px;
  display: grid;
  grid-template-columns: 1fr;        /* mobile: satu kolom */
  gap: 12px;
  align-items: stretch;
  justify-content: start;
}

/* DESKTOP — 2 kolom input, tombol full-width di bawah (center) */
@media (min-width: 992px){
  .pkj-jodoh-page .pkj-weton-form{
    margin-left:48px; margin-right:auto;
    /* 2 kolom input; tombol di baris bawah */
    grid-template-columns:
      minmax(260px,1fr)
      minmax(260px,1fr);
    grid-template-rows: auto var(--pkj-input-h) auto; /* label | input | tombol */
    column-gap:14px;
    row-gap:4px;             /* jarak input ↔ tombol rapat */
    align-items:center;
  }

  /* Baris-1: label */
  .pkj-jodoh-page .pkj-weton-form__label:nth-of-type(1){
    grid-column:1; grid-row:1; justify-self:end; align-self:end; padding-bottom:2px;
  }
  .pkj-jodoh-page .pkj-weton-form__label:nth-of-type(2){
    grid-column:2; grid-row:1; justify-self:end; align-self:end; padding-bottom:2px;
  }

  /* Baris-2: input */
  .pkj-jodoh-page .pkj-weton-form .pkj-date-wrap:nth-of-type(1){
    grid-column:1; grid-row:2; height:var(--pkj-input-h);
  }
  .pkj-jodoh-page .pkj-weton-form .pkj-date-wrap:nth-of-type(2){
    grid-column:2; grid-row:2; height:var(--pkj-input-h);
  }

  /* Baris-3: tombol — center & lebar = 1 kolom input */
  .pkj-jodoh-page .pkj-weton-form .pkj-btn-gold,
  .pkj-jodoh-page .pkj-weton-form .pkj-weton-form__btn{
    grid-column:1 / span 2;
    grid-row:3;
    justify-self:center;
    align-self:center;
    height:var(--pkj-input-h);
    padding:0 18px; box-sizing:border-box;
    width: calc((100% - 14px) / 2);   /* = lebar 1 kolom input (form width - gap) / 2 */
    min-width:260px;                  /* samakan dengan min lebar kolom input */
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }

  /* anti overflow + hilangkan margin bawaan anak form */
  .pkj-jodoh-page .pkj-weton-form > *{ min-width:0; margin:0; }
}


/* Gaya label & input tetap */
.pkj-jodoh-page .pkj-weton-form__label{ color:#FFD45A; font-weight:700; }
.pkj-jodoh-page .pkj-date-wrap{ position:relative; height:var(--pkj-input-h); }
.pkj-jodoh-page .pkj-weton-form__date{
  appearance:none; -webkit-appearance:none;
  width:100%; height:var(--pkj-input-h);
  min-inline-size:0; border-radius:16px; padding:0 14px; box-sizing:border-box;
  color:#F8FAFC; caret-color:#fff;
  background:
    radial-gradient(circle at 1.5px 1.5px, rgba(255,255,255,.085) 1.2px, transparent 1.3px) 0 0/12px 12px repeat,
    #0E1117;
  border:1px solid #E8C35A;
  box-shadow:0 10px 22px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}
.pkj-jodoh-page .pkj-weton-form__date:focus{ outline:2px solid rgba(242,201,76,.35); outline-offset:1px; }
.pkj-jodoh-page .pkj-weton-form__date::-webkit-calendar-picker-indicator{ filter:invert(1); opacity:.9; }

/* Placeholder overlay (tanpa ubah fungsi) */
.pkj-jodoh-page .pkj-date-wrap::after{
  content:"DD-MM-YYYY";
  position:absolute; left:16px; top:50%; transform:translateY(-50%);
  color:rgba(255,255,255,.92); font-weight:600; letter-spacing:.25px; pointer-events:none;
}
.pkj-jodoh-page .pkj-date-wrap.has-value::after{ content:""; }
.pkj-jodoh-page .pkj-date-wrap:not(.has-value) .pkj-weton-form__date::-webkit-datetime-edit{ color:transparent; }
.pkj-jodoh-page .pkj-date-wrap:focus-within::after{ opacity:.38; }  /* kompat :focus-within */


/* Tombol emas pada form: tinggi sama dengan input */
.pkj-jodoh-page .pkj-weton-form .pkj-btn-gold{
  height: var(--pkj-input-h);
  padding: 0 18px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Tombol emas umum */
.pkj-jodoh-page .pkj-btn-gold{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.9rem 1.1rem; border-radius:20px; font-weight:700; color:#111;
  border:1px solid #E6C04F;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23d3b147' stroke-width='1.2' stroke-linecap='round' opacity='.6'%3E%3Cpath d='M12 2 L22 12 L12 22 L2 12 Z'/%3E%3Cpath d='M12 6 L18 12 L12 18 L6 12 Z'/%3E%3C/g%3E%3C/svg%3E") center/18px 18px repeat,
    linear-gradient(180deg,#fff7bf 0%,#ffe066 28%,#f7cf42 58%,#f1c40f 78%,#cfa50c 100%);
  box-shadow:0 12px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.65);
  transition:filter .15s ease, transform .05s ease;
}
.pkj-jodoh-page .pkj-btn-gold:hover{ filter:brightness(1.06); }
.pkj-jodoh-page .pkj-btn-gold:active{ transform:translateY(1px); }

/* ---------- NOTE / BLOCKQUOTE ---------- */
.pkj-jodoh-page .pkj-note,
.pkj-jodoh-page .pkj-introquote{
  position:relative; margin:.9rem 0 1.25rem; padding:1rem 1.1rem;
  border-radius:12px; color:#DDE3EE;
  border:1px solid rgba(245,194,59,.35);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cg fill='none' stroke='%23b07f05' stroke-opacity='.10' stroke-width='.8'%3E%3Cpath d='M0 9h18M9 0v18'/%3E%3Cpath d='M0 0l18 18M18 0L0 18'/%3E%3C/g%3E%3C/svg%3E") repeat,
    linear-gradient(180deg, rgba(245,194,59,.10), rgba(245,194,59,.03));
  background-size:18px 18px, auto;
  box-shadow:0 10px 24px rgba(0,0,0,.20);
}
.pkj-jodoh-page .pkj-note::before,
.pkj-jodoh-page .pkj-introquote::before{
  content:""; position:absolute; inset:0 auto 0 0; width:4px; border-radius:8px 0 0 8px;
  background:linear-gradient(180deg,#ffe066,#f1c40f 60%,#d4ac0d);
  box-shadow:0 0 0 1px rgba(245,194,59,.45);
}
.pkj-jodoh-page .pkj-note p,
.pkj-jodoh-page .pkj-introquote p{ margin:0; line-height:1.6; color:#DDE3EE; }
@media (min-width:1024px){
  .pkj-jodoh-page .pkj-note,
  .pkj-jodoh-page .pkj-introquote{ text-align:left; }
}

/* ---------- HERO IMAGE ---------- */
.pkj-jodoh-page .pkj-article-hero{
  width:min(860px,100%); margin:14px auto 24px;
  border:2px solid #E8C35A; border-radius:18px; overflow:hidden;
  box-shadow:0 18px 36px rgba(0,0,0,.45);
}
.pkj-jodoh-page .pkj-article-hero img{ display:block; width:100%; height:auto; }

/* ---------- PROSE & FAQ ---------- */
.pkj-jodoh-page .prose-pkj{ color:#E8EDF6; line-height:1.75; }
.pkj-jodoh-page .prose-pkj h2{
  color:#FFD66A; margin:1.1rem 0 .55rem; line-height:1.25;
  border-bottom:1px dashed rgba(255,255,255,.12); padding-bottom:.25rem;
}
.pkj-jodoh-page .prose-pkj a{ color:#FFD45A; text-decoration:underline; text-underline-offset:2px; }

.pkj-jodoh-page .pkj-faq{
  background:#0F141B; border:1px solid rgba(255,255,255,.08);
  border-radius:12px; margin:.55rem 0; padding:.6rem .8rem; color:#EDEFF6;
}
.pkj-jodoh-page .pkj-faq>summary{
  cursor:pointer; list-style:none; font-weight:800; color:#FFD45A;
}
.pkj-jodoh-page .pkj-faq>summary::marker,
.pkj-jodoh-page .pkj-faq>summary::-webkit-details-marker{ display:none; }
.pkj-jodoh-page .pkj-faq>summary:after{ content:"▾"; float:right; color:#FFD45A; transition:transform .15s; }
.pkj-jodoh-page .pkj-faq[open]>summary:after{ transform:rotate(180deg); }
@media (min-width:1024px){
  .pkj-jodoh-page .pkj-faq{ padding:.9rem 1rem; }
  .pkj-jodoh-page .pkj-faq > :not(summary){ padding-inline:1.15rem; }
  .pkj-jodoh-page .pkj-faq p, .pkj-jodoh-page .pkj-faq li{ line-height:1.7; }
}

/* ---------- DISCLAIMER ---------- */
.pkj-jodoh-page .pkj-disclaimer{
  position:relative; isolation:isolate;
  max-width:var(--pkj-narrow); margin:18px auto;
  padding:16px 20px 16px 100px;
  border-radius:20px;
  background:linear-gradient(180deg,#151b23 0%, #11161d 100%);
  color:#EDEFF6; line-height:1.65;
  border:1px solid #e0bf62;
  box-shadow:0 0 0 1px rgba(255,213,120,.25),
             0 16px 34px rgba(0,0,0,.45),
             inset 0 1px 0 rgba(255,255,255,.08);
}
.pkj-jodoh-page .pkj-disclaimer b{ color:#F2C94C; }
.pkj-jodoh-page .pkj-disclaimer em{ color:#fff; opacity:.92; font-style:italic; }
.pkj-jodoh-page .pkj-disclaimer::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  border-radius:inherit; opacity:.35;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cg fill='none' stroke='%23d6b25a' stroke-opacity='.22' stroke-width='.9'%3E%3Cpath d='M0 9h18M9 0v18'/%3E%3Cpath d='M0 0l18 18M18 0L0 18'/%3E%3C/g%3E%3C/svg%3E") repeat,
    linear-gradient(180deg, rgba(245,194,59,.16), rgba(245,194,59,.05));
  background-size:18px 18px, auto;
}
.pkj-jodoh-page .pkj-disclaimer > *{ position:relative; z-index:1; }
.pkj-jodoh-page .pkj-disclaimer .ico{
  position:absolute; left:26px; top:50%; transform:translateY(-50%);
  width:56px; height:56px; border-radius:50%;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.95) 0 7px, transparent 8px),
    linear-gradient(180deg,#ffeaa0 0%, #d7a62d 100%);
  border:2px solid #d6a11a;
  box-shadow:0 0 0 1px rgba(255,213,120,.40),
             0 10px 20px rgba(0,0,0,.35),
             inset 0 2px 6px rgba(255,255,255,.45);
}
.pkj-jodoh-page .pkj-disclaimer .ico::before{
  content:""; position:absolute; inset:8px; border-radius:16px;
  background:linear-gradient(180deg,#eaf3ff 0%, #bcd6f6 55%, #7ba1d7 100%);
}
.pkj-jodoh-page .pkj-disclaimer .ico::after{
  content:"i"; position:absolute; inset:0; display:grid; place-items:center;
  font-size:28px; font-weight:900; color:#fff;
}
@media (min-width:1024px){
  .pkj-jodoh-page .pkj-disclaimer{
    display:grid; grid-template-columns:64px 1fr;
    align-items:center; column-gap:16px; padding:18px 22px;
  }
  .pkj-jodoh-page .pkj-disclaimer .ico{
    position:relative; left:auto; top:auto; transform:none;
    width:56px; height:56px; border-radius:50%;
  }
}

/* =======================================================
   PKJ JODOH — HALAMAN HASIL
   ======================================================= */
.pkj-jodoh-page.pkj-result{ --pkj-narrow:720px; }

@media (min-width:1024px){
  .pkj-jodoh-page.pkj-result :is(
    .pkj-hero-sub,
	h1.pkj-title,
    .pkj-hero-h1,
    .pkj-note,
    .pkj-meta-pill,
    .pkj-jodoh-fig,
    .pkj-box--wej,
    .pkj-box--weton,
    .pkj-share-buttons,
    .pkj-author-card,
    .pkj-disclaimer
  ){
    max-width: var(--pkj-narrow);
    margin-left: 48px;
    margin-right: auto;
  }
}

.pkj-jodoh-page.pkj-result h1.pkj-title,
.pkj-jodoh-page.pkj-result .pkj-hero-h1{
  color:#F2C94C; text-align:left; font-weight:800;
  line-height:1.15; font-size:clamp(28px,3vw,40px);
  margin-block:.25rem .55rem; /* biarkan margin-left:48px & max-width dari blok result tetap berlaku */
}


/* Poster hasil */
.pkj-jodoh-page.pkj-result .pkj-jodoh-fig{ margin-block:8px 18px; }
.pkj-jodoh-page.pkj-result .pkj-jodoh-fig img{
  display:block; width:100%; height:auto;
  border:2px solid #E8C35A; border-radius:18px;
  box-shadow:0 18px 36px rgba(0,0,0,.45);
}

/* Kartu Wejangan & Weton */
.pkj-jodoh-page.pkj-result .pkj-box--wej,
.pkj-jodoh-page.pkj-result .pkj-box--weton{
  position:relative; border-radius:12px; padding:.85rem 1rem; color:#EAF1FF;
  background:
    linear-gradient(#121821,#121821) padding-box,
    linear-gradient(135deg, rgba(255,213,120,.55), rgba(255,213,120,.15)) border-box;
  border:1px solid transparent;
  box-shadow:0 10px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
}
.pkj-jodoh-page.pkj-result .pkj-box--wej::before,
.pkj-jodoh-page.pkj-result .pkj-box--weton::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:.12;
  background-image:
    radial-gradient(circle at 12px 12px, #ffd780 1px, transparent 1px),
    radial-gradient(circle at 0 0,       #ffd780 1px, transparent 1px);
  background-size:24px 24px,24px 24px; background-position:0 0,12px 12px;
}
.pkj-jodoh-page.pkj-result .pkj-box--wej .pkj-label,
.pkj-jodoh-page.pkj-result .pkj-box--weton .pkj-label{ color:#FFD780; font-weight:800; }

@media (min-width:800px){
  .pkj-jodoh-page.pkj-result .pkj-meta-weton{ display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
}

/* Caption gambar */
.pkj-jodoh-page.pkj-result .pkj-jodoh-fig figcaption{
  color:#F2C94C; font-weight:800; text-align:center; letter-spacing:.3px; margin:.45rem auto 0;
}

/* ---------- SHARE BUTTONS ---------- */
.pkj-share-buttons{
  display:grid; grid-template-columns:1fr;
  gap: var(--pkj-gap);
  max-width:860px; margin:.6rem auto 0; align-items:stretch; isolation:isolate;
}
@media (min-width:1024px){
  .pkj-share-buttons{
    grid-template-columns: repeat(4, minmax(0,1fr));
    max-width: var(--pkj-narrow);
    margin-left: 48px; margin-right: auto;
  }
}
.pkj-share__btn{
  display:flex; align-items:center; justify-content:center; gap:.55rem;
  width:100%; min-height:44px; padding:.6rem .9rem; border-radius:18px;
  text-transform:uppercase; font-size:.82rem; font-weight:700; letter-spacing:.03em;
  background:var(--pkj-gold,#C9A227); color:#111; text-decoration:none;
  box-shadow:0 1px 2px rgba(0,0,0,.2);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
  box-sizing:border-box; position:relative;
}
.pkj-share__btn:hover{ transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,.25); filter:brightness(1.03); }
.pkj-share__btn:active{ transform:translateY(0); box-shadow:0 2px 6px rgba(0,0,0,.2); }
.pkj-share__btn svg{ width:16px; height:16px; flex:0 0 16px; fill:currentColor; }

/* ---------- META PILL (kategori + neptu) ---------- */
.pkj-meta-pill{
  display:inline-flex; align-items:center; gap:.5rem;
  width:fit-content; max-width:100%;
  padding:.5rem .9rem; border-radius:9999px;
  margin:.45rem 0 .2rem;   /* kiri-kanan 0, ikut parent offset/max-width */
  font-weight:800;
  background:linear-gradient(180deg,#fff3a3 0%, #ffd95a 46%, #ffc93a 100%);
  color:#1a1a1a; border:1px solid rgba(214,165,26,.65);
  box-shadow:0 8px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.6);
}
.pkj-meta-pill .pill-kat{ text-transform:uppercase; letter-spacing:.4px; }
.pkj-meta-pill .pill-dot{ opacity:.7; transform:translateY(-.5px); }
.pkj-meta-pill .pill-neptu{ font-weight:700; letter-spacing:.2px; }
@media (max-width:420px){ .pkj-meta-pill{ font-size:.85rem; padding:.45rem .75rem; } }
@media (min-width:421px){ .pkj-meta-pill{ font-size:.9rem; } }

/* ---------- AUTHOR CARD ---------- */
.pkj-author-card{
  position:relative; display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:10px; max-width:var(--pkj-narrow,740px);
  margin:16px auto 18px; padding:16px 18px; border-radius:16px;
  border:1px solid rgba(245,194,59,.35);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cg fill='none' stroke='%23b07f05' stroke-opacity='.10' stroke-width='.8'%3E%3Cpath d='M0 9h18M9 0v18'/%3E%3Cpath d='M0 0l18 18M18 0L0 18'/%3E%3C/g%3E%3C/svg%3E") repeat,
    linear-gradient(180deg, #141820, #10151c);
  box-shadow:0 14px 28px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.05);
  color:#EDEFF6;
}
.pkj-author-card--batik::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  box-shadow:0 0 0 1px rgba(255,213,120,.25) inset;
}
.pkj-author-card__media{ width:96px; height:96px; }
.pkj-author-card__avatar{
  width:100%; height:100%; display:block; border-radius:50%;
  object-fit:cover; object-position:50% 22%;
  border:3px solid #E8C35A; box-shadow:0 6px 14px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.55);
  background:#0f141b;
}
.pkj-author-card__name{ margin:0; font-weight:900; letter-spacing:.2px; font-size:1.25rem; color:#F2C94C; }
.pkj-author-card__role{ margin:.05rem 0 .25rem; color:#FFD780; font-weight:700; font-size:.95rem; }
.pkj-author-card__bio{ margin:.2rem 0 .4rem; line-height:1.65; color:#EAF1FF; }
.pkj-author-card__links{ display:flex; flex-wrap:wrap; justify-content:center; gap:.35rem .6rem; }
.pkj-author-link{ color:#FFD45A; text-decoration:underline; text-underline-offset:2px; }
.pkj-author-card__links .sep{ opacity:.6; color:#FFD45A; }
.pkj-author-card__meta{ margin-top:.2rem; font-size:.9rem; opacity:.9; }
.pkj-author-card__soc{
  width:100%; max-width:420px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.6rem; margin-top:.6rem;
}
.pkj-soc-btn{
  display:flex; align-items:center; justify-content:center;
  height:42px; padding:0 .8rem; border-radius:9999px;
  background:linear-gradient(180deg,#fff3a3 0%, #ffd95a 46%, #ffc93a 100%);
  color:#111; font-weight:800; font-size:.85rem; text-decoration:none;
  border:1px solid rgba(214,165,26,.65);
  box-shadow:0 8px 16px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.6);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.pkj-soc-btn:hover{ transform:translateY(-1px); filter:brightness(1.03); box-shadow:0 12px 20px rgba(0,0,0,.26); }
.pkj-soc-btn svg{ width:16px; height:16px; fill:currentColor; }

@media (max-width:360px){
  .pkj-author-card__media{ width:88px; height:88px; }
  .pkj-soc-btn{ height:40px; font-size:.8rem; }
}

/* Desktop layout: dua kolom */
@media (min-width:960px){
  .pkj-author-card{
    display:grid; grid-template-columns:140px 1fr; column-gap:18px;
    align-items:center; text-align:left; padding:18px 22px;
  }
  .pkj-author-card__media{ width:120px; height:120px; grid-column:1; }
  .pkj-author-card > *:not(.pkj-author-card__media){ grid-column:2; }
  .pkj-author-card__name{ font-size:1.35rem; }
  .pkj-author-card__role{ font-size:1rem; }
  .pkj-author-card__links{ justify-content:flex-start; }
  .pkj-author-card__soc{
    max-width:none; grid-template-columns:repeat(3,minmax(0,1fr)); justify-items:start; margin-top:.5rem;
  }
}

/* ---------- HERO sub ---------- */
.pkj-jodoh-page .pkj-hero-sub{ text-align:center; margin:.5rem 0; }
.pkj-jodoh-page .pkj-hero-sub .t-muted{ color:#fff; opacity:.95; }
.pkj-jodoh-page .pkj-hero-sub .t-gold{ color: var(--pkj-gold,#F2C94C); font-weight:700; }

/* ---------- FAQ header tweak (desktop) ---------- */
@media (min-width:992px){
  .pkj-jodoh-page.pkj-jodoh-landing .prose-pkj details.pkj-faq{ margin-left:12px; }
  .pkj-jodoh-page.pkj-jodoh-landing .prose-pkj details.pkj-faq > summary{ padding-left:18px !important; }
}

/* ---------- Mobile hero tweaks (FINAL) ---------- */
@media (max-width:575.98px){
  .pkj-jodoh-page .pkj-hero{ padding-top:1rem; }

  /* Default (landing): center + ukuran semula */
  .pkj-jodoh-page .pkj-hero-h1{
    text-align:center;
    line-height:1.05;
    margin:0 0 .35rem;
    font-size:clamp(22px,7vw,30px);
  }

  /* Khusus PAGE HASIL: paksa center (kalahkan rule desktop-left) + sedikit lebih kecil */
  .pkj-jodoh-page.pkj-result :is(.pkj-hero-h1, h1.pkj-title){
    text-align:center;                     /* <- ini kunci */
    font-size:clamp(20px,6.4vw,28px);      /* lebih kecil sedikit */
  }

  .pkj-jodoh-page .pkj-hero-year{
    display:block;
    font-size:clamp(20px,8vw,28px);
    margin-top:.1rem;
    background:inherit; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    font-weight:900; letter-spacing:.02em;
  }

  /* Kecilkan baris "Hari ini … — Zona waktu …" (landing & hasil) */
  .pkj-jodoh-page .pkj-hero-sub{
    font-size:clamp(12.5px,3.6vw,14.5px);
    line-height:1.3;
    text-align:center;
    margin:.25rem auto 0;
  }
}



/* ===== MOBILE SAFE AREA — semua konten masuk (≤575.98px) ===== */
@media (max-width:575.98px){
  .pkj-jodoh-page{ --pkj-safe:14px; overflow-x:hidden; }

  .pkj-jodoh-page :is(
    .pkj-hero,
    .pkj-weton-form,
    .pkj-note,
    .pkj-article-hero,
    .pkj-jodoh-fig,
    .pkj-box--wej,
    .pkj-box--weton,
    .pkj-share-buttons,
    .pkj-author-card,
    .pkj-disclaimer,
    .prose-pkj,
    details.pkj-faq,
    .pkj-meta-pill                 /* ← ikut safe area agar tidak nempel batik */
  ){
    max-width: calc(100% - (var(--pkj-safe) * 2));
    margin-left: var(--pkj-safe);
    margin-right: var(--pkj-safe);
    box-sizing: border-box;
  }

  .pkj-jodoh-page img,
  .pkj-jodoh-page svg,
  .pkj-jodoh-page video,
  .pkj-jodoh-page canvas{ display:block; max-width:100%; height:auto; }

  .pkj-jodoh-page table,
  .pkj-jodoh-page pre,
  .pkj-jodoh-page code{ max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }

  .pkj-jodoh-page .prose-pkj h2,
  .pkj-jodoh-page .prose-pkj h3{ padding-inline:2px; }
  .pkj-jodoh-page .prose-pkj ul,
  .pkj-jodoh-page .prose-pkj ol{ padding-left:1.1rem; }
}
/* ===== MOBILE ≤575.98px — Artikel: tambah jarak dari batik ===== */
@media (max-width:575.98px){
  /* safe area KHUSUS artikel */
  .pkj-container .prose-pkj{
    --pkj-article-safe: 18px;                         /* ubah ke 20px jika masih mepet */
    max-width: calc(100% - (var(--pkj-article-safe) * 2));
    margin-left: var(--pkj-article-safe) !important;
    margin-right: var(--pkj-article-safe) !important;
    padding-inline: 4px;                              /* ruang dalam tipis */
    box-sizing: border-box;
  }

  /* hanya elemen teks artikel */
  .pkj-container .prose-pkj h2{                       /* Ringkasan Manfaat, Cara Menggunakan, dst. */
    font-size: clamp(19px, 5.6vw, 22px);
    line-height: 1.25;
    margin: 10px 0 8px;
    padding-inline: 2px;                              /* supaya judul tak nempel tepi */
  }
  .pkj-container .prose-pkj p,
  .pkj-container .prose-pkj li{
    font-size: 15.5px;
    line-height: 1.8;
    padding-inline: 2px;                              /* teks agak menjauh dari batik */
  }
  .pkj-container .prose-pkj ul,
  .pkj-container .prose-pkj ol{
    padding-left: 1.35rem;                            /* angka/bullet tidak kepentok batik */
    margin: 6px 0 12px;
  }

  /* bar tautan "Cek Weton · Kalender Jawa · Cek Pekerjaan" */
  .pkj-container .prose-pkj a{ font-size: 15px; }
}
/* Desktop: hanya isi (teks) blockquote yang center */
@media (min-width:1024px){
  .pkj-jodoh-page .pkj-note,
  .pkj-jodoh-page .pkj-introquote{
    text-align:center;
    padding-left:1.25rem;   /* sedikit lega dari kiri */
    padding-right:1.25rem;
  }
}
.pkj-ad{margin:24px auto;text-align:center}
.pkj-ad--result-top{margin:8px 0 16px}
.pkj-ad--result-mid{margin:20px 0}
.pkj-ad--result-bottom{margin:24px 0 8px}
@media (max-width:600px){.pkj-ad{margin:16px auto}}

/* Affiliate box skin + batas biar tidak tampak "garis putih besar" */
.pkj-jodoh-page .pkj-affbox{
  background:#121316;
  border:1px solid rgba(255,213,74,.25);  /* tipiskan border */
  border-radius:14px;
  padding:14px 16px;
  box-sizing:border-box;
}
.pkj-jodoh-page .pkj-affbox .brand{color:#e5e7eb;font-weight:700;display:block;margin-bottom:6px;}
.pkj-jodoh-page .pkj-affbox .btn{
  display:inline-block;padding:9px 12px;border-radius:10px;
  border:1px solid #111;background:#ffd54a;color:#111;font-weight:700;text-decoration:none;
}

/* Hero/figure tetap aman */
.pkj-jodoh-page .pkj-article-hero{ width:min(860px,100%); margin:14px auto 24px; }
.pkj-jodoh-page .pkj-article-hero img,
.pkj-jodoh-page .pkj-jodoh-fig img{
  display:block;width:100%;height:auto;border-radius:18px;
}
/* =========================================================
   KAWERUHJAWA — JODOH: SAFE ZONE + SKIN UNIFIED
   Berlaku untuk halaman dengan body class: .pkj-jodoh-page
   ========================================================= */

/* ---------- VARS ---------- */
.pkj-jodoh-page{
  --pkj-narrow: 740px;   /* lebar konten desktop */
  --pkj-safe: 14px;      /* padding tepi mobile (menghindari batik) */
  --pkj-gutter: 0px;     /* ekstra padding dalam jika perlu */
  --pkj-gold: #F2C94C;   /* warna emas umum */
}

/* ---------- DESKTOP SAFE-ZONE (LANDING) ---------- */
@media (min-width:1024px){
  .pkj-jodoh-page.pkj-jodoh-landing :is(
    .pkj-hero,
    .pkj-note,
    .pkj-article-hero,
    .prose-pkj,
    .pkj-faq,
    .pkj-disclaimer,
    .pkj-author-card,
    .pkj-share-buttons,
    .pkj-meta-pill,
    .pkj-ad,        /* ads */
    .pkj-affbox,    /* affiliate CTA */
    .kj-curated     /* pustaka & rujukan */
  ){
    max-width: var(--pkj-narrow);
    margin-left: 48px;      /* jangan melewati pattern batik */
    margin-right: auto;
    padding-left: var(--pkj-gutter);
    padding-right: var(--pkj-gutter);
    box-sizing: border-box;
  }
}

/* ---------- DESKTOP SAFE-ZONE (HASIL) ---------- */
@media (min-width:1024px){
  .pkj-jodoh-page.pkj-result :is(
    .pkj-hero-sub,
    h1.pkj-title,
    .pkj-hero-h1,
    .pkj-note,
    .pkj-meta-pill,
    .pkj-jodoh-fig,
    .pkj-box--wej,
    .pkj-box--weton,
    .pkj-share-buttons,
    .pkj-author-card,
    .pkj-disclaimer,
    .pkj-ad,
    .pkj-affbox,
    .kj-curated
  ){
    max-width: var(--pkj-narrow);
    margin-left: 48px;
    margin-right: auto;
  }
}

/* ---------- MOBILE SAFE-ZONE ---------- */
@media (max-width:575.98px){
  .pkj-jodoh-page :is(
    .pkj-hero,
    .pkj-weton-form,
    .pkj-note,
    .pkj-article-hero,
    .pkj-jodoh-fig,
    .pkj-box--wej,
    .pkj-box--weton,
    .pkj-share-buttons,
    .pkj-author-card,
    .pkj-disclaimer,
    .prose-pkj,
    details.pkj-faq,
    .pkj-meta-pill,
    .pkj-ad,
    .pkj-affbox,
    .kj-curated
  ){
    max-width: calc(100% - (var(--pkj-safe) * 2));
    margin-left: var(--pkj-safe);
    margin-right: var(--pkj-safe);
    box-sizing: border-box;
  }
}

/* ---------- ADS: JANGAN LEBAR/MELEDAK ---------- */
.pkj-jodoh-page .pkj-ad{ margin:18px auto; text-align:center; }
.pkj-jodoh-page .pkj-ad ins.adsbygoogle{
  display:block !important;
  max-width:100% !important;
  height:auto !important;
  margin:0 auto !important;
}

/* ---------- AFFILIATE BOX (DARK + PATTERN, NO WHITE) ---------- */
.pkj-jodoh-page .pkj-affbox{
  position:relative;
  background: linear-gradient(180deg,#151b23 0%, #11161d 100%) !important;
  border:1px solid rgba(245,194,59,.28) !important;
  border-radius:14px;
  padding:14px 16px;
  color:#EDEFF6;
  box-shadow:0 10px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}
.pkj-jodoh-page .pkj-affbox::before{
  /* pattern halus biar satu rasa */
  content:"";
  position:absolute; inset:0; pointer-events:none; opacity:.14;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cg fill='none' stroke='%23d6b25a' stroke-opacity='.35' stroke-width='.8'%3E%3Cpath d='M0 9h18M9 0v18'/%3E%3Cpath d='M0 0l18 18M18 0L0 18'/%3E%3C/g%3E%3C/svg%3E") repeat;
  background-size:18px 18px;
}
.pkj-jodoh-page .pkj-affbox .brand{
  display:block; font-weight:800; color:#FFD780; margin-bottom:6px;
}
.pkj-jodoh-page .pkj-affbox .btn{
  display:inline-block; padding:9px 12px; border-radius:10px;
  background:linear-gradient(180deg,#fff3a3 0%, #ffd95a 46%, #ffc93a 100%);
  color:#111; font-weight:800; text-decoration:none;
  border:1px solid rgba(214,165,26,.65);
  box-shadow:0 8px 16px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.6);
  transition:transform .15s ease, filter .15s ease;
}
.pkj-jodoh-page .pkj-affbox .btn:hover{ transform:translateY(-1px); filter:brightness(1.03); }

/* ---------- KURASI (PUSTAKA & RUJUKAN) — DARK CARDS ---------- */
.kj-curated{
  background: linear-gradient(180deg,#141820, #10151c);
  border:1px solid rgba(245,194,59,.28);
  border-radius:16px;
  padding:16px;
  color:#EDEFF6;
  box-shadow:0 12px 26px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.05);
  position:relative; overflow:hidden;
}
.kj-curated::before{
  content:""; position:absolute; inset:0; opacity:.10; pointer-events:none;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cg fill='none' stroke='%23b07f05' stroke-opacity='.35' stroke-width='.8'%3E%3Cpath d='M0 9h18M9 0v18'/%3E%3Cpath d='M0 0l18 18M18 0L0 18'/%3E%3C/g%3E%3C/svg%3E") repeat;
  background-size:18px 18px;
}
.kj-curated > h2{ margin:.2rem 0 .5rem; color:#FFD66A; }
.kj-curated > p{ margin:.1rem 0 .7rem; color:#cfd7e6; }

.kj-curated__grid{
  display:grid; gap:14px;
  grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
}

.kj-card{
  position:relative;
  background: linear-gradient(180deg,#121821,#10151c);
  border:1px solid rgba(245,194,59,.22);
  border-radius:12px;
  padding:12px;
  color:#EDEFF6;
  box-shadow:0 8px 18px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04);
}
.kj-card h3{ margin:.1rem 0 .3rem; color:#F2C94C; font-size:1.05rem; }
.kj-card p{ margin:.1rem 0 .6rem; color:#d9e1f0; }
.kj-card .btn{
  display:inline-block; padding:8px 12px; border-radius:10px;
  background:linear-gradient(180deg,#fff3a3 0%, #ffd95a 46%, #ffc93a 100%);
  color:#111; font-weight:800; text-decoration:none;
  border:1px solid rgba(214,165,26,.65);
  box-shadow:0 8px 16px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.6);
}
.kj-curated__dis{ font-size:12px; color:#9aa3b3; margin-top:6px; }

/* ---------- FIGURES (HERO/POSTER) MASIH AMAN ---------- */
.pkj-jodoh-page .pkj-article-hero{
  width:min(860px,100%);
  margin:14px auto 24px;
  border:2px solid #E8C35A; border-radius:18px; overflow:hidden;
  box-shadow:0 18px 36px rgba(0,0,0,.45);
}
.pkj-jodoh-page .pkj-article-hero img,
.pkj-jodoh-page .pkj-jodoh-fig img{ display:block; width:100%; height:auto; border-radius:18px; }
/* ============================
   HOTFIX — Affiliate/Rotator/Ads
   - hilangkan frame putih
   - skin gelap seragam
   - tambah jarak dari batik
   ============================ */

/* Matikan outline/box-shadow putih */
.pkj-jodoh-page .kj-aff,
.pkj-jodoh-page .kj-aff-list,
.pkj-jodoh-page [class*="aff"] .frame{
  border:0!important; outline:0!important;
  box-shadow:none!important; background:transparent!important;
}

/* Kulit kartu affiliate */
.pkj-jodoh-page .pkj-affbox,
.pkj-jodoh-page .kj-aff__item,
.pkj-jodoh-page .kj-aff-item,
.pkj-jodoh-page .kj_aff_item{
  border:1px solid rgba(245,194,59,.28)!important;
  border-radius:12px!important; outline:0!important;
  box-shadow:0 8px 16px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06)!important;
  background:linear-gradient(180deg,#151b23 0%, #11161d 100%)!important;
  color:#EDEFF6!important; overflow:hidden;
}

/* Nonaktifkan pseudo frame */
.pkj-jodoh-page .kj-aff__item::before,
.pkj-jodoh-page .kj-aff__item::after,
.pkj-jodoh-page .kj-aff-item::before,
.pkj-jodoh-page .kj-aff-item::after,
.pkj-jodoh-page .kj_aff_item::before,
.pkj-jodoh-page .kj_aff_item::after{ content:none!important; }

/* Tombol */
.pkj-jodoh-page .pkj-affbox .btn,
.pkj-jodoh-page .kj-aff__item .btn,
.pkj-jodoh-page .kj-aff-item .btn,
.pkj-jodoh-page .kj_aff_item .btn{
  display:inline-block; padding:9px 12px; border-radius:10px;
  background:linear-gradient(180deg,#fff3a3 0%, #ffd95a 46%, #ffc93a 100%)!important;
  color:#111!important; font-weight:800; text-decoration:none;
  border:1px solid rgba(214,165,26,.65);
}

/* Ads iframe safety */
.pkj-jodoh-page .pkj-ad{ margin:18px auto; text-align:center; }
.pkj-jodoh-page .pkj-ad ins.adsbygoogle{
  display:block!important; max-width:100%!important; height:auto!important; margin:0 auto!important;
}

/* DESKTOP — sejajarkan & beri jarak dari batik (lebih lega dari 48px) */
@media (min-width:1024px){
  .pkj-jodoh-page :is(.pkj-affbox,.kj-curated,.pkj-ad){
    max-width:var(--pkj-narrow);
    margin-left:64px;          /* ← tambah jarak kiri supaya tak nempel batik */
    margin-right:auto;
    box-sizing:border-box;
  }
}

/* MOBILE — ikut safe area */
@media (max-width:575.98px){
  .pkj-jodoh-page :is(.pkj-affbox,.kj-curated,.pkj-ad){
    max-width:calc(100% - (var(--pkj-safe) * 2));
    margin-left:var(--pkj-safe);
    margin-right:var(--pkj-safe);
    box-sizing:border-box;
  }
}