:root{--paper:#faf9f7;--white:#fff;--ink:#252c33;--muted:#697079;--orange:#b94b2f;--blue:#315786;--line:#e4e3df;--soft:#f0efec}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 "Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none;touch-action:manipulation}a:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:5px}::selection{background:#ecd2c6}.wrap{width:min(1120px,calc(100% - 72px));margin:auto}.skip{position:absolute;top:-80px;left:20px;z-index:20;background:white;padding:10px}.skip:focus{top:10px}.header{height:100px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:inline-flex;align-items:center;gap:9px;font-size:22px;font-weight:650;letter-spacing:-.8px}.brand b{font-weight:650}.brand-mark{display:grid;place-items:center;width:29px;height:29px;color:var(--orange)}.brand-mark svg{width:28px;height:28px}.nav{display:flex;align-items:center;gap:32px;font-size:13px;color:#59616a}.nav a:not(.button){padding:12px 0;transition:color .22s}.nav a:hover,.footer a:hover{color:var(--orange)}.button{display:inline-flex;justify-content:center;align-items:center;gap:12px;min-height:48px;padding:12px 23px;background:var(--ink);color:white;border:1px solid var(--ink);border-radius:6px;font-size:13px;font-weight:600;transition:background .24s,border-color .24s,box-shadow .24s;cursor:pointer}.button:hover{background:#414a55;border-color:#414a55;box-shadow:0 4px 12px #252c3312}.button:active{background:#151b21}.button svg{width:17px;height:17px}.button.small{min-height:44px;padding:9px 18px;background:transparent;color:var(--ink);border-color:#d3d2ce}.button.small:hover{background:var(--soft)}.button.outline{background:transparent;color:var(--ink);border-color:transparent;padding-inline:10px}.button.outline:hover{background:var(--soft);box-shadow:none}.eyebrow{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:500;color:var(--muted);letter-spacing:.5px;text-transform:none}.dot{display:none}.hero{padding:62px 0 74px;display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}.beta-label{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--muted);letter-spacing:.2px}.beta-label span{height:6px;width:6px;border-radius:50%;background:var(--orange)}h1{font-size:clamp(48px,5vw,68px);letter-spacing:-3.2px;line-height:1.12;margin:25px 0 25px;font-weight:600}h1 em{font-style:normal;color:var(--ink);position:relative}h1 em:after{content:'';position:absolute;left:0;right:3px;bottom:-3px;height:3px;background:#c68065;border-radius:100%}.lead{font-size:16px;line-height:1.9;max-width:410px;color:var(--muted);margin:0 0 29px}.actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}.availability{font-size:11px;color:var(--muted);margin:16px 0 0}.hero-footnote{display:none}.hero-visual{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center}.photo{width:100%;height:470px;object-fit:contain;display:block;mix-blend-mode:multiply}.visual-top{display:none}.photo-caption{width:100%;display:flex;justify-content:space-between;align-items:center;padding:17px 0 0;border-top:1px solid var(--line);gap:12px}.photo-caption .label{font-size:10px;letter-spacing:.4px;color:var(--muted)}.photo-caption strong{font-size:12px;font-weight:500;display:block}.photo-caption .tag{font-size:11px;color:var(--muted)}.ticker{border-block:1px solid var(--line);padding:24px 0;display:flex;align-items:center;justify-content:space-between;gap:20px}.ticker .intro{font-size:11px;color:var(--muted);max-width:160px;line-height:1.6;letter-spacing:.3px}.ticker .name{font-size:15px;font-weight:600;color:#62676b;letter-spacing:1px}.ticker .end{color:var(--muted);font-size:11px}.section{padding:100px 0}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin:18px 0 46px}h2{font-size:clamp(30px,3vw,40px);line-height:1.24;letter-spacing:-1.5px;font-weight:500;margin:0;max-width:600px}.section-heading p{color:var(--muted);max-width:310px;font-size:14px;margin:0}.features{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.feature{padding:26px 0 0;border-top:1px solid var(--line)}.icon{width:26px;height:26px;color:var(--orange);margin-bottom:24px;display:grid;place-items:center}.icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}h3{font-size:16px;font-weight:600;letter-spacing:-.3px;margin:0 0 10px}.feature p{font-size:13px;line-height:1.85;color:var(--muted);margin:0}.showcase{display:grid;grid-template-columns:1fr 1fr;gap:86px;align-items:center;background:#f0efeb;padding:58px;border-radius:5px}.showcase h2{margin:17px 0 22px}.showcase p{font-size:14px;color:var(--muted)}.checklist{list-style:none;padding:0;margin:25px 0 22px}.checklist li{font-size:13px;margin:12px 0;display:flex;gap:11px}.checklist svg{width:17px;height:22px;color:#7d887b;flex-shrink:0}.text-link{color:var(--ink);font-size:13px;font-weight:600;display:inline-flex;align-items:center;min-height:44px;gap:14px;border-bottom:1px solid #bfc0b9;transition:border-color .24s,color .24s}.text-link:hover{color:var(--orange);border-color:var(--orange)}.preview{background:white;padding:25px;border-radius:9px;border:1px solid #e5e3df;box-shadow:0 8px 26px #252c3307}.preview-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.avatar{width:34px;height:34px;display:grid;place-items:center;background:#edece7;color:#636b64;border-radius:50%;font-size:10px;font-weight:600}.owner{display:flex;align-items:center;gap:10px}.owner strong{font-size:12px;font-weight:600;display:block}.owner small{font-size:10px;color:var(--muted)}.preview-demo{font-size:9px;color:var(--muted)}.preview-title{font-size:20px;font-weight:500;margin:27px 0 3px;letter-spacing:-.7px}.preview-desc{font-size:11px!important;margin:0 0 17px!important}.collection-card{border:1px solid var(--line);border-radius:6px;overflow:hidden}.collection-card img{width:100%;height:220px;object-fit:contain;display:block;background:#fcfafb}.collection-info{padding:13px;display:flex;justify-content:space-between;align-items:center;gap:8px}.collection-info strong{font-size:11px;display:block;font-weight:600}.collection-info small{font-size:10px;color:var(--muted)}.private{font-size:9px;color:#626f62;padding:4px 0}.preview-bottom{border-top:1px solid var(--line);margin-top:19px;padding-top:13px;display:flex;justify-content:space-around;font-size:10px;color:var(--muted)}.preview-bottom b{color:var(--ink);font-weight:500}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:39px}.step{border-top:1px solid var(--line);padding-top:23px}.step-number{font-size:10px;font-weight:500;color:var(--muted);letter-spacing:1px;display:block;margin-bottom:17px}.step p{font-size:14px;color:var(--muted);margin:0}.privacy-note{display:flex;align-items:center;gap:17px;padding:23px 0;border-block:1px solid var(--line);margin-top:38px}.privacy-note .icon{margin:0;flex-shrink:0;color:#7d887b}.privacy-note strong{font-size:13px;font-weight:600}.privacy-note p{font-size:12px;color:var(--muted);margin:2px 0}.privacy-note a{text-decoration:underline;text-underline-offset:3px}.faq{padding:0 0 94px;display:grid;grid-template-columns:1fr 1.2fr;gap:80px}.faq h2{margin-top:17px}.faq details{border-bottom:1px solid var(--line);padding:17px 0}.faq summary{cursor:pointer;font-size:14px;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;min-height:32px}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:'+';font-size:21px;font-weight:300;color:var(--muted)}.faq details[open] summary::after{content:'−'}.faq details p{color:var(--muted);font-size:13px;padding-right:24px;line-height:1.85}.faq details a{color:var(--orange);text-decoration:underline}.cta{border-block:1px solid var(--line);padding:48px 0;display:flex;justify-content:space-between;align-items:center;gap:35px}.cta h2{font-size:38px;margin:16px 0 18px}.cta p{font-size:14px;color:var(--muted);margin:0}.cta-action{flex-shrink:0;text-align:center}.cta-action .button{background:var(--orange);border-color:var(--orange)}.cta-action .button:hover{background:#9e3c24;border-color:#9e3c24}.cta-action small{display:block;font-size:11px;color:var(--muted);margin-top:12px}.footer{padding:40px 0 27px}.footer-top{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:32px}.footer .brand{font-size:20px}.footer nav{display:flex;gap:24px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.footer-bottom{border-top:1px solid var(--line);padding-top:21px;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}
@media(max-width:1000px){.hero{gap:30px}h1{font-size:48px;letter-spacing:-2px}.photo{height:420px}.features{grid-template-columns:repeat(2,1fr);gap:32px}.showcase{gap:36px;padding:35px}.nav{gap:22px}.faq{gap:40px}.ticker .name{font-size:13px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.header{height:80px}.brand{font-size:20px}.nav a:not(.button){display:none}.nav .button{font-size:12px;padding:9px 14px}.hero{grid-template-columns:1fr;padding:45px 0 40px;gap:23px}h1{font-size:clamp(42px,9.8vw,58px);letter-spacing:-2px;line-height:1.14;margin-block:23px}.lead{font-size:15px;max-width:440px;line-height:1.85}.actions{gap:8px}.button{padding:12px 17px}.button.outline{padding-inline:8px;font-size:12px}.availability{margin-top:13px}.photo{height:370px}.photo-caption{padding-top:12px}.ticker{flex-wrap:wrap;justify-content:center;gap:16px 22px;padding:24px 0}.ticker .intro{max-width:none;width:100%;text-align:center}.ticker .end{display:none}.section{padding:62px 0}.section-heading{display:block;margin-bottom:32px}.section-heading p{margin-top:17px;max-width:none}h2{font-size:32px}.features{gap:30px 25px}.feature p{font-size:13px}.feature h3{font-size:15px}.icon{margin-bottom:18px}.showcase{grid-template-columns:1fr;padding:31px 22px;gap:28px}.preview{max-width:390px;width:100%;margin:auto;padding:20px}.collection-card img{height:230px}.steps{grid-template-columns:1fr;gap:26px;margin-top:28px}.step-number{margin-bottom:12px}.privacy-note{align-items:flex-start;padding:22px 0}.faq{grid-template-columns:1fr;gap:24px;padding-bottom:60px}.faq details{padding-block:14px}.cta{display:block;padding:35px 0}.cta h2{font-size:32px}.cta-action{text-align:left;margin-top:25px}.cta-action small{margin-left:2px}.footer-top{align-items:flex-start;flex-direction:column}.footer nav{gap:12px 22px}.footer-bottom{flex-direction:column;gap:8px}}
@media(max-width:370px){.wrap{width:calc(100% - 32px)}h1{font-size:41px}.actions{align-items:flex-start;flex-direction:column}.photo{height:330px}.features{grid-template-columns:1fr}.photo-caption .tag{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Collector journal: paper, ink, and a few handwritten annotations. */
@font-face{font-family:Kalam;src:url('/assets/fonts/Kalam-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--paper:#f7f3e9;--ink:#293746;--muted:#596168;--orange:#b64b2f;--blue:#315b8b;--line:#dcd7cb;--soft:#eee8db;--note-font:Kalam,"Segoe Print",cursive}
body{background-image:radial-gradient(#7c715b10 .6px,transparent .6px);background-size:7px 7px}
.header{border-bottom:1px solid var(--line);height:92px}.brand b{color:var(--orange)}
.hero{padding:63px 0 65px;gap:68px;grid-template-columns:1.05fr 1fr;align-items:center}
h1{font-size:clamp(46px,4.8vw,66px);font-weight:600;line-height:1.12;letter-spacing:-2.7px}
h1 em{color:var(--blue)}h1 em:after{height:5px;background:none;border-bottom:2px solid var(--blue);border-radius:0 0 50% 50%;transform:rotate(-2deg);bottom:-4px}
.beta-label{font-size:12px}.lead{font-size:16px;line-height:1.85;max-width:420px}
.button{background:var(--orange);border-color:var(--orange);border-radius:5px;min-height:49px;font-weight:600;box-shadow:0 2px 0 #883823;transition:background .22s,box-shadow .22s,transform .22s}
.button:hover{background:#a44127;border-color:#a44127;box-shadow:0 3px 0 #883823}.button:active{transform:translateY(1px);box-shadow:0 1px 0 #883823}
.button.small{background:transparent;border-color:var(--line);box-shadow:none;color:var(--ink)}.button.small:hover{background:var(--soft);border-color:#b7b0a0}.button.outline{background:transparent;box-shadow:none;border-color:transparent}.button.outline:hover{border-color:transparent;background:var(--soft)}
.cta-note{display:flex;align-items:center;gap:9px;color:var(--blue);margin:5px 0 0 38px;font:17px/1.4 var(--note-font)}.cta-note svg{width:68px;height:45px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.hero-visual{padding-top:26px}.journal-note{font:20px/1.5 var(--note-font);color:var(--blue);align-self:flex-end;margin:0 12px 13px 0;transform:rotate(2deg)}
.photo-print{width:100%;max-width:400px;background:#fffdfa;padding:14px 14px 30px;border:1px solid #e8e0d2;box-shadow:2px 5px 12px #42381b0b;transform:rotate(2deg);position:relative}
.photo-print:before{content:'';position:absolute;z-index:1;width:104px;height:30px;background:#d7c8a59c;top:-12px;left:calc(50% - 52px);transform:rotate(-6deg);border-inline:2px dotted #b5a27d40}
.photo{height:350px;object-fit:contain;background:#fcfafb;mix-blend-mode:normal}.photo-caption{border:0;max-width:400px;padding:22px 0 0;display:block}.photo-caption .label{font:10px/1.7 "Courier New",monospace;letter-spacing:1px}.photo-caption strong{font:18px/1.6 var(--note-font);color:var(--blue)}.photo-caption .tag{display:none}
.ticker{padding-block:24px}.ticker .name{font-size:13px;letter-spacing:.8px}.ticker .intro{font:15px/1.5 var(--note-font);color:var(--blue)}
.eyebrow{color:var(--blue);font:12px/1.5 "Courier New",monospace;letter-spacing:.3px}.section{padding:86px 0}.section-heading{margin-bottom:36px}h2{font-weight:500;letter-spacing:-1.3px;font-size:38px}
.features{grid-template-columns:repeat(2,1fr);gap:0 60px;counter-reset:feature}.feature{display:grid;grid-template-columns:42px 1fr;column-gap:20px;padding:27px 0;position:relative;counter-increment:feature}.feature:before{content:'0' counter(feature);grid-column:1;grid-row:1 / span 2;font:27px/1.3 var(--note-font);color:var(--blue)}.feature .icon{display:none}.feature h3{grid-column:2;margin:0 0 7px}.feature p{grid-column:2;max-width:390px;font-size:14px}
.showcase{background:#ede7d9;padding:50px 55px;border:1px solid #e1d9c9;position:relative;border-radius:3px;gap:75px}.showcase:before{content:'GARASI / CATATAN PRIBADI';position:absolute;top:18px;right:22px;font:9px/1.4 "Courier New",monospace;color:var(--muted);letter-spacing:1px}.preview{border-radius:5px;box-shadow:3px 3px 0 #d2c8b3;border:1px solid #dfd9cd;background:#fffdfa}.preview-title{font:24px/1.5 var(--note-font);color:var(--blue)}.collection-card{border-radius:3px}.collection-card img{height:230px}.preview-demo{font:12px/1.3 var(--note-font);color:var(--blue)}.avatar{background:#e5ebef;color:var(--blue)}
.step-number{font:13px/1.5 var(--note-font);color:var(--blue);letter-spacing:0}.step{position:relative}.privacy-note{border-bottom:0}.faq summary{font-weight:500}.cta{background:#ece5d6;border:1px solid #ded5c3;padding:42px 45px;position:relative}.cta:before{content:'';width:60px;height:24px;position:absolute;top:-12px;left:40px;background:#d6c4a194;transform:rotate(-4deg)}.cta .eyebrow{font:18px/1.5 var(--note-font)}.cta h2{font-size:36px}.cta-action .button{box-shadow:0 2px 0 #883823}.footer{padding-top:38px}
@media(max-width:1000px){.hero{gap:38px}h1{font-size:49px;letter-spacing:-2px}.photo{height:320px}.journal-note{font-size:18px}.features{gap:0 35px}.showcase{padding:43px 32px;gap:35px}.cta{padding:35px}}
@media(max-width:760px){.header{height:79px}.hero{grid-template-columns:1fr;padding:38px 0;gap:15px}.hero-visual{max-width:430px;width:100%;margin:auto;padding:14px 9px 0}h1{font-size:clamp(42px,10vw,58px);letter-spacing:-2px}.lead{font-size:15px}.cta-note{font-size:15px;margin-left:15px}.cta-note svg{width:50px}.journal-note{font-size:18px;margin-bottom:16px}.photo-print{transform:rotate(1deg);padding:11px 11px 24px}.photo{height:330px}.photo-caption{padding-top:18px}.section{padding:58px 0}h2{font-size:31px}.features{grid-template-columns:1fr;gap:0}.feature{padding:24px 0;column-gap:14px;grid-template-columns:34px 1fr}.feature p{font-size:14px}.showcase{padding:40px 22px 30px;gap:30px}.showcase:before{font-size:8px;top:14px;right:15px}.preview{max-width:350px}.cta{padding:32px 24px}.cta h2{font-size:31px}.ticker .name{font-size:12px}.footer{padding-top:30px}}
@media(max-width:370px){.photo{height:280px}.cta-note{font-size:14px}.cta-note svg{width:42px}h1{font-size:41px}}
@media(prefers-reduced-motion:reduce){.photo-print,.journal-note{transform:none}.button:active{transform:none}}

/* Keep the outlined wordmark proportional at every breakpoint. */
.brand img{display:block;object-fit:contain;max-width:100%}
@media(max-width:760px){.header .brand img{width:164px;height:40px}.header{gap:14px}.header .brand{flex-shrink:0}}

/* Preserve the wordmark proportions across breakpoints. */
.brand img{display:block;object-fit:contain;max-width:100%}
@media(max-width:760px){.header .brand img{width:164px;height:40px}.header{gap:14px}.header .brand{flex-shrink:0}}

/* Neutral photography and explicit links support the collector journal palette. */
.faq details a,.privacy-note a{text-decoration:underline;text-underline-offset:3px}

/* Real collection photography, with responsive local WebP assets. */
.photo-print .photo{height:auto;aspect-ratio:3/2;object-fit:contain;background:#fff}
.photo-credit,.preview-photo-credit{display:block;font:10px/1.6 "Segoe UI",Arial,sans-serif;color:var(--muted);margin-top:5px}
.preview .preview-photo-credit{font-size:10px;margin:8px 0 0}
.collection-card img{object-fit:cover;object-position:center 75%}
.collection-gallery{padding:0 0 85px}.gallery-heading{margin-bottom:32px}.gallery-heading h2{margin:15px 0}.gallery-heading p{color:var(--muted);font-size:14px}
.gallery-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.gallery-photos figure{margin:0;padding:10px 10px 16px;background:#fffdfa;border:1px solid #e3ddcf}.gallery-photos img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center 65%}.gallery-photos figcaption{padding:12px 5px 0}.gallery-photos figcaption span{display:block;font:18px/1.5 var(--note-font);color:var(--blue)}.gallery-photos small{display:block;font-size:10px;color:var(--muted)}
@media(max-width:760px){.gallery-photos{grid-template-columns:1fr;gap:24px;max-width:430px;margin:auto}.collection-gallery{padding-bottom:58px}.gallery-photos img{aspect-ratio:3/2}}