/* ==========================================================================
   PORTOFOLIO WAHYU: tambahan di atas mesin VISIONUR v2 (style.css).
   Hero, scene, tombol, dan kartu memakai gaya yang sama; file ini hanya untuk bagian khas portofolio.
   ========================================================================== */
.pill-logo{gap:10px;padding:7px 22px 7px 14px;}
.pill-logo img{height:30px;width:auto;}
.pill-logo span{font-weight:700;letter-spacing:-.02em;font-size:15px;color:#fff;}
.pill-sm{min-height:44px;padding:6px 20px 6px 16px;gap:10px;font-size:15px;}
.pill-sm i{font-size:20px;}
.hero-copy .lead{max-width:36ch;}

/* dulu -> sekarang */
.vn-title{grid-column:1 / -1;max-width:20ch;}
.vn-word{font-size:clamp(40px,13vw,120px);}
.cine .vn-word{font-size:clamp(48px,6.6vw,112px);}
.vn-q{display:grid;gap:6px;margin-top:12px;max-width:42ch;}
.vn-q li{position:relative;padding-left:18px;color:var(--ink);font-size:clamp(14px,1.15vw,18px);line-height:1.35;}
.vn-q li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--o1);}
.vn-steps{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px;}
.vn-steps li{flex:1 1 150px;display:grid;gap:1px;padding:14px 22px;border-radius:999px;background:var(--card);border:1px solid var(--line);}
.vn-steps strong{font-size:17px;letter-spacing:-.02em;}
.vn-steps small{color:var(--dim);font-size:13.5px;}
.vn-steps li:last-child{background:linear-gradient(135deg,#ff8c42,#f0491f);border-color:transparent;color:var(--on-o);}
.vn-steps li:last-child small{color:rgba(11,7,4,.8);}

/* cara saya bekerja (tujuh kata) */
.fw-head{display:grid;gap:12px;margin-bottom:28px;}
.fw-sub{color:var(--dim);max-width:52ch;}
.fw-list p strong{display:none;color:var(--ink);}
.cine .fw-list p strong{display:inline;}
.cine .fw-head{position:absolute;left:var(--pad);top:calc(var(--nav) + 36px);margin:0;max-width:min(470px,40vw);}
.cine .fw-head .fw-title{position:static;max-width:none;}
.cine .fw-sub{font-size:clamp(13.5px,1vw,16px);line-height:1.45;}
.cine .fw-word{font-size:clamp(60px,13vw,220px);}

/* bukti */
.p-chip{top:clamp(26px,3.4vw,52px);bottom:auto;max-width:min(320px,60%);}
.p-cap{margin-top:14px;max-width:64ch;font-size:15px;font-weight:500;color:var(--on-o);}
.p-card:nth-child(even) .p-cap{color:var(--dim);}
.proof-foot{display:grid;gap:12px;margin-top:clamp(28px,5vw,64px);}
.proof-foot p{max-width:68ch;color:var(--dim);}
.proof-foot .proof-src{color:var(--faint);font-size:14px;}

/* kemampuan */
.caps-s{padding:clamp(72px,12vw,160px) 0;}
.caps{display:grid;grid-template-columns:1fr;gap:14px;margin-top:clamp(28px,4vw,56px);}
.cap{display:grid;align-content:start;gap:10px;padding:26px;border-radius:32px;background:var(--card);border:1px solid var(--line);}
.cap-n{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(140deg,#ff8c42,#f0491f);color:var(--on-o);font-weight:800;font-size:15px;}
.cap h3{font-size:clamp(20px,1.7vw,24px);letter-spacing:-.03em;line-height:1.15;}
.cap p{color:var(--ink);font-size:15.5px;}
.cap ul{display:grid;gap:6px;margin-top:4px;}
.cap li{position:relative;padding-left:16px;color:var(--dim);font-size:14.5px;}
.cap li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--o1);}
@media (min-width:760px){.caps{grid-template-columns:repeat(2,1fr);}}
@media (min-width:1180px){.caps{grid-template-columns:repeat(3,1fr);}}

/* studi kasus */
.cases{padding:clamp(72px,12vw,160px) 0;}
.cases-head{display:grid;gap:12px;margin-bottom:clamp(28px,4vw,56px);max-width:70ch;}
.cases-head p{color:var(--dim);}
.case{margin-bottom:20px;padding:clamp(22px,3.4vw,48px);border-radius:40px;background:var(--card);border:1px solid var(--line);box-shadow:inset 0 1px 1px rgba(255,255,255,.08);}
.case-head{display:flex;gap:18px;align-items:baseline;margin-bottom:clamp(22px,3vw,40px);}
.case-n{font-weight:800;letter-spacing:-.06em;line-height:.9;font-size:clamp(48px,6vw,96px);color:transparent;-webkit-text-stroke:1.5px var(--o1);font-variant-numeric:tabular-nums;}
.case-head h3{font-size:clamp(24px,3vw,44px);letter-spacing:-.04em;line-height:1.05;}
.case-tags{margin-top:6px;color:var(--dim);font-size:15px;}
.case-body{display:grid;grid-template-columns:1fr;gap:clamp(24px,4vw,56px);align-items:start;}
@media (min-width:900px){.case-body{grid-template-columns:minmax(280px,.8fr) 1.2fr;}.case-roas .case-body{grid-template-columns:1fr 1fr;}}
.illo{margin:0;padding:18px;border-radius:28px;background:#0a0a0b;border:1px solid var(--line-2);}
.illo svg{display:block;width:100%;height:auto;}
.illo text{font:500 13px Figtree,sans-serif;fill:var(--dim);}
.illo .t-strong{font:600 13px Figtree,sans-serif;fill:var(--ink);}
.illo .t-dark{font:700 13px Figtree,sans-serif;fill:#140700;}
.illo .t-tag{font:500 11.5px Figtree,sans-serif;fill:var(--faint);}
.par{display:grid;gap:4px;}
.par > div{padding:12px 0 14px 20px;border-left:2px solid var(--line);}
.par dt{font-weight:700;font-size:14.5px;color:var(--o1);}
.par dd{margin:4px 0 0;color:var(--dim);}
.par .res{border-left-color:var(--o1);}
.par .res dd{color:var(--ink);}
.calc-title{font-weight:700;font-size:20px;letter-spacing:-.02em;}
.calc-note{margin:4px 0 16px;color:var(--faint);font-size:14px;}


/* AI */
.ai{padding:clamp(72px,12vw,160px) 0;}
.ai-lead{margin:16px 0 clamp(28px,4vw,48px);max-width:60ch;color:var(--dim);font-size:clamp(17px,1.4vw,20px);}
.eq{display:flex;flex-wrap:wrap;align-items:stretch;gap:12px;}
.eq-t{flex:1 1 200px;display:grid;align-content:start;gap:6px;padding:20px 22px;border-radius:28px;background:var(--card);border:1px solid var(--line);}
.eq-t strong{font-size:clamp(18px,1.6vw,22px);letter-spacing:-.03em;line-height:1.15;}
.eq-t small{color:var(--dim);font-size:14.5px;}
.eq-op{flex:0 0 28px;display:grid;place-items:center;font-size:34px;font-weight:300;color:var(--o1);}
.eq-res{background:linear-gradient(150deg,#ff9a52,#f0491f 85%);border:0;color:var(--on-o);}
.eq-res small{color:rgba(11,7,4,.82);}
.ai-note{margin-top:clamp(24px,4vw,44px);max-width:46ch;font-weight:600;font-size:clamp(18px,1.8vw,26px);letter-spacing:-.025em;}

/* Visionur */
.vz{padding:clamp(72px,12vw,160px) 0;}
.vz-top{display:grid;grid-template-columns:1fr;gap:clamp(32px,5vw,80px);align-items:center;}
@media (min-width:900px){.vz-top{grid-template-columns:1.3fr 1fr;}}
.vz-copy p{color:var(--dim);max-width:60ch;}
.vz-copy p + p{margin-top:14px;}
.vz-copy .vz-kicker{color:var(--o1);font-weight:700;}
.vz-title{margin:16px 0 22px;}
.vz-title img{width:min(100%,460px);height:auto;}
.vz-flow{display:grid;gap:10px;}
.vz-flow li{padding:14px 22px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-weight:600;color:var(--dim);}
.vz-flow li.end{background:linear-gradient(135deg,#ff8c42,#f0491f);border:0;color:var(--on-o);font-size:20px;font-weight:800;}
.vz-dna{display:grid;grid-template-columns:1fr;gap:12px;margin-top:clamp(40px,6vw,80px);}
@media (min-width:760px){.vz-dna{grid-template-columns:repeat(4,1fr);}}
.vz-dna li{display:grid;gap:6px;align-content:start;padding:22px;border-radius:28px;background:var(--card);border:1px solid var(--line);}
.vz-dna span{color:var(--o1);font-weight:700;font-size:14px;}
.vz-dna strong{font-size:19px;letter-spacing:-.02em;}
.vz-dna small{color:var(--dim);font-size:15px;}
.vz-foot{display:grid;gap:22px;margin-top:clamp(40px,6vw,72px);}

/* kebiasaan kerja & alat, area, pendidikan */
.sk{padding:clamp(56px,9vw,120px) 0;}
.sk-block{margin-top:clamp(36px,5vw,64px);}
.sk-block h3{font-size:clamp(22px,2.2vw,30px);letter-spacing:-.03em;}
.sk-block > p{margin-top:8px;max-width:60ch;color:var(--dim);}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;}
.chips li{min-height:44px;display:inline-flex;align-items:center;gap:10px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-weight:600;font-size:15.5px;}
.chips li.hot{border-color:var(--o1);}
.chips li small{color:var(--o1);font-size:13px;font-weight:600;}
.sk-block .sk-note{margin-top:22px;}
.pf-copy .chips{margin-top:4px;}
.pf-degree{font-weight:800;font-size:clamp(26px,3vw,40px);letter-spacing:-.04em;color:var(--o1) !important;}

/* kontak */
.cl-open{display:grid;grid-template-columns:1fr;gap:12px;width:min(960px,100%);text-align:left;}
@media (min-width:760px){.cl-open{grid-template-columns:repeat(3,1fr);}}
.cl-open li{padding:18px 20px;border-radius:24px;background:var(--card);border:1px solid var(--line);}
.cl-open strong{display:block;font-size:17px;letter-spacing:-.02em;}
.cl-open span{display:block;margin-top:4px;color:var(--dim);font-size:14.5px;}

@media (max-width:640px){.p-chip{top:20px;left:20px;padding:10px 14px;border-radius:18px;}.p-chip b{font-size:18px;}.p-chip span{font-size:12px;}}
.proof-foot .proof-lead{max-width:34ch;color:var(--ink);font-weight:700;font-size:clamp(24px,2.6vw,38px);letter-spacing:-.035em;line-height:1.15;}

/* perjalanan: teks scene dibesarkan sedikit agar lebih terbaca */
.cine .jr-stage-l{font-size:clamp(16px,1.2vw,19px);}
.cine .jr-title{font-size:clamp(36px,5.6vw,94px);}
.cine .jr-desc{max-width:68ch;font-size:clamp(16px,1.35vw,22px);line-height:1.5;}
.cine .jr-metrics{font-size:clamp(15px,1.15vw,18px);}

/* jarak antar bagian dirapatkan (sebelumnya sampai 160px di atas dan di bawah tiap bagian) */
.proof,.cases,.caps-s,.ai,.vz,.profile{padding-block:clamp(48px,7vw,96px);}
.sk{padding-block:clamp(40px,6vw,80px);}
.cine .proof{padding-bottom:0;}
.closing{padding-top:clamp(56px,8vw,112px);}
.foot{padding-top:clamp(40px,6vw,80px);margin-top:clamp(24px,4vw,48px);}
.proof-head{margin-bottom:clamp(20px,3vw,36px);}
.proof-foot{margin-top:clamp(20px,3vw,40px);}
.cases-head{margin-bottom:clamp(20px,3vw,36px);}
.caps{margin-top:clamp(20px,3vw,36px);}
.sk-block{margin-top:clamp(24px,3.5vw,44px);}
.vz-dna{margin-top:clamp(32px,4.5vw,56px);}
.vz-foot{margin-top:clamp(28px,4vw,48px);}
.ai-lead{margin-bottom:clamp(20px,3vw,36px);}
.ai-note{margin-top:clamp(20px,3vw,32px);}
