/* Album — scrapbook: kertas bertitik, polaroid, selotip, tulisan tangan */
.fam-album { --card: #fffdf8; --sec-y: clamp(48px, 6vw, 96px); background-color: var(--bg); background-image: radial-gradient(color-mix(in oklab, var(--ink) 9%, transparent) 1px, transparent 1.2px); background-size: 22px 22px; }
.fam-album .display, .fam-album .h1, .fam-album .h2 { line-height: 1; }
.fam-album .display { font-size: clamp(2.8rem, 1.6rem + 5vw, 5.6rem); }
.fam-album .h2 { font-size: clamp(2.1rem, 1.4rem + 2.8vw, 3.6rem); }
.fam-album .display em, .fam-album .h2 em, .fam-album .h1 em { font-style: normal; color: var(--primary-text); background: linear-gradient(transparent 62%, color-mix(in oklab, var(--accent) 45%, transparent) 62%, color-mix(in oklab, var(--accent) 45%, transparent) 92%, transparent 92%); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.fam-album .eyebrow { padding: .3rem .8rem; background: var(--ink); color: var(--bg); letter-spacing: .1em; transform: rotate(-2deg); }
.fam-album .btn { border-radius: 8px 14px 10px 16px / 14px 8px 16px 10px; font-weight: 700; box-shadow: 2px 3px 0 var(--ink); border: 1.5px solid var(--ink); }
.fam-album .btn:hover { transform: translate(-1px, -1px) rotate(-.5deg); }
.fam-album .btn--ghost { --btn-bg: var(--card); }
.fam-album .icon-btn { border: 1.5px solid var(--ink); border-radius: 12px; background: var(--card); }

/* Header: label kertas berselotip */
.fam-album .hdr { padding-top: 10px; background: transparent; border: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
.fam-album .hdr__in { position: relative; min-height: 60px; padding-inline: 14px 10px; background: var(--card); box-shadow: 0 8px 22px -14px rgb(0 0 0 / .45), 0 1px 2px rgb(0 0 0 / .08); }
.fam-album .hdr__in::before, .fam-album .hdr__in::after { content: ""; position: absolute; top: -9px; width: 64px; height: 20px; background: color-mix(in oklab, var(--accent) 50%, #fff); opacity: .85; }
.fam-album .hdr__in::before { left: 18px; transform: rotate(-6deg); }
.fam-album .hdr__in::after { right: 18px; transform: rotate(5deg); }
.fam-album .hdr .mnav { margin: 10px var(--gutter) 0; background: var(--card); box-shadow: 0 14px 30px -18px rgb(0 0 0 / .45); }
.fam-album .brand__mark { border-radius: 50%; transform: rotate(-6deg); }
.fam-album .brand__name { font-family: "Caveat", var(--font-head), cursive; font-weight: 700; font-size: 1.6rem; letter-spacing: 0; }
.fam-album .nav__a { font-weight: 600; }
.fam-album .nav__a.is-active::after { height: 3px; border-radius: 3px; background: var(--accent); transform: rotate(-1deg); }

/* Kartu-kartu kertas */
.fam-album .feat, .fam-album .tcard, .fam-album .step, .fam-album .cinfo { border: 0; border-radius: 3px; background: var(--card); color: #2b2622; --muted: #6f675d; box-shadow: 0 10px 24px -14px rgb(0 0 0 / .4); }
.fam-album .feat:nth-child(odd), .fam-album .tcard:nth-child(odd) { transform: rotate(-.7deg); }
.fam-album .feat:nth-child(even), .fam-album .tcard:nth-child(even) { transform: rotate(.6deg); }
.fam-album .feat__t, .fam-album .step__t { font-family: "Caveat", var(--font-head), cursive; font-size: 1.6rem; font-weight: 700; letter-spacing: 0; line-height: 1.05; }
.fam-album .feat__ic { border-radius: 50%; background: color-mix(in oklab, var(--accent) 35%, #fff); color: #2b2622; }
.fam-album .step__n { font-family: "Caveat", var(--font-head), cursive; font-size: 1.6rem; transform: rotate(-6deg); }
.fam-album .tcard__q { font-family: "Caveat", var(--font-head), cursive; font-size: 1.45rem; line-height: 1.25; }
.fam-album .tcard { background: color-mix(in oklab, var(--accent) 22%, #fffdf8); }
.fam-album .stars { color: #e0942a; }
.fam-album .about__img, .fam-album .feats-split__img { padding: 10px 10px 34px; border-radius: 2px; background: #fffdf8; box-shadow: 0 12px 30px -14px rgb(0 0 0 / .45); transform: rotate(1.5deg); }
.fam-album .cat { border: 8px solid #fffdf8; border-bottom-width: 28px; border-radius: 2px; box-shadow: 0 10px 22px -12px rgb(0 0 0 / .4); }
.fam-album .cat:nth-child(odd) { transform: rotate(-1.5deg); }
.fam-album .cat:nth-child(even) { transform: rotate(1.2deg); }
.fam-album .cat__name { font-family: "Caveat", var(--font-head), cursive; font-size: 1.5rem; }
.fam-album .gitem { border: 7px solid #fffdf8; border-radius: 2px; box-shadow: 0 8px 20px -12px rgb(0 0 0 / .4); }
.fam-album .gmason .gitem:nth-child(odd) { transform: rotate(-1deg); }
.fam-album .gmason .gitem:nth-child(even) { transform: rotate(1deg); }
.fam-album .faq__i { border-bottom: 1.5px dashed var(--line-strong); }
.fam-album .faq__q { font-weight: 700; }
.fam-album .cta { border-radius: 4px; background: var(--primary); color: var(--on-primary); box-shadow: 0 16px 34px -18px rgb(0 0 0 / .5); transform: rotate(-.6deg); }
.fam-album .cta::after, .fam-album .cta .cta__bg { display: none; }
.fam-album .cta .lead { color: color-mix(in oklab, var(--on-primary) 82%, var(--primary)); }
.fam-album .cta .h2 { font-size: clamp(2.2rem, 1.4rem + 3vw, 4rem); }
.fam-album .badge { border-radius: 4px; transform: rotate(-3deg); }
.fam-album .chip { border: 1.5px solid var(--ink); background: var(--card); }
.fam-album .chip.is-active { background: var(--ink); color: var(--bg); }
.fam-album .input, .fam-album .select, .fam-album .textarea { background: var(--card); border-color: var(--ink); }
.fam-album .ftr--card .ftr__panel { background: var(--card); border-radius: 4px; box-shadow: 0 12px 30px -18px rgb(0 0 0 / .45); }
.fam-album .ftr--card .ftr__cta { border-radius: 4px; transform: rotate(-.5deg); }
.fam-album .ftr .brand__name { font-size: 1.8rem; }
@media (prefers-reduced-motion: reduce) { .fam-album .feat, .fam-album .tcard, .fam-album .cat, .fam-album .gitem, .fam-album .cta { transform: none !important; } }
