/* PD. CARI AYAM INDO — Reset, tipografi, utilitas umum (container, section, skip-link, scroll-reveal, tombol melayang). */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:var(--font-body);font-size:1rem;line-height:1.68;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip;max-width:100%}
::selection{background:var(--red);color:#fff}
img,svg{display:block;max-width:100%}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dark)}
ul,ol{list-style:none}
.container{width:min(1160px,100% - 40px);margin-inline:auto}
section{padding:clamp(64px,8vw,110px) 0;position:relative}
.tint{background:var(--paper);border-block:1px solid #F3F3F3}
.skip{position:absolute;left:16px;top:-64px;z-index:200;background:var(--red);color:#fff;font-weight:700;padding:10px 18px;border-radius:0 0 10px 10px;transition:top .2s}
.skip:focus{top:0}
:focus-visible{outline:3px solid rgba(211,47,47,.45);outline-offset:2px;border-radius:8px}

/* ============ Tipografi ============ */
h1,h2,h3{font-family:var(--font-display);letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,6vw,4.3rem);line-height:1.03;font-weight:800}
h2{font-size:clamp(1.75rem,3.4vw,2.5rem);line-height:1.14;font-weight:800}
h3{font-weight:700}
.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--red);font-weight:800;text-transform:uppercase;letter-spacing:.16em;font-size:.74rem;margin-bottom:16px}
.eyebrow::before{content:"";width:22px;height:2.5px;border-radius:2px;background:var(--grad-red)}
.sec-head{max-width:680px;margin-bottom:clamp(36px,4.5vw,56px)}
.sec-head p{margin-top:14px;color:var(--muted);font-size:1.03rem}
.sec-head h2::after{content:"";display:block;width:56px;height:4px;border-radius:4px;background:var(--grad-red);margin-top:18px}
.red{color:var(--red)}
.grad-text{background:var(--grad-red);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ============ Scroll-reveal (dikelola reveal.js; tanpa JS konten tetap tampil) ============ */
.rv{opacity:0}
.rv-in{animation:rvIn .7s var(--ease) both}
@keyframes rvIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* ============ Tombol melayang (WhatsApp + kembali ke atas) ============ */
.fabs{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:12px;z-index:90}
.fab{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;border:0;cursor:pointer;padding:0;transition:transform .2s var(--ease),box-shadow .2s,opacity .3s}
.fab:active{transform:scale(.94)}
.fab-wa{background:var(--grad-red);color:#fff;box-shadow:var(--shadow-red)}
.fab-wa:hover{transform:translateY(-3px);box-shadow:0 14px 30px -10px rgba(211,47,47,.65)}
.fab-top{background:#fff;color:var(--red);border:1px solid var(--line);box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transform:translateY(10px)}
.fab-top.show{opacity:1;pointer-events:auto;transform:none}
.fab-top:hover{color:var(--red-dark);border-color:var(--red-line)}

/* ============ Reduced motion ============ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important;animation:none !important}
  .rv{opacity:1}
}
