:root { --album-ink:#553b4a; --album-pink:#c9708f; --album-blush:#f9e5e9; --album-lilac:#eee8fa; --album-cream:#fffaf4; }
.album-page { background:var(--album-cream); color:var(--album-ink); }
.album-page .topbar { background:rgba(255,250,244,.88); border-color:#efdde1; }
.album-page .topnav a.active { color:var(--album-ink); }
.album-hero { overflow:hidden; padding:clamp(58px,9vw,115px) 0; background:radial-gradient(circle at 90% 20%,#efdff8 0 9%,transparent 28%),radial-gradient(circle at 10% 80%,#f7dce4 0 12%,transparent 37%),linear-gradient(120deg,#fff8f1,#fdf1f3); }
.album-hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(35px,8vw,95px); align-items:center; }
.album-kicker,.album-heading>span,.album-price-card>span { display:block; color:#a85b78; font-size:12px; font-weight:800; letter-spacing:.14em; margin-bottom:12px; }
.album-hero h1,.album-section h2,.album-final h2 { margin:0; font-family:Georgia,serif; font-weight:600; line-height:.98; letter-spacing:-.045em; }
.album-hero h1 { font-size:clamp(52px,7vw,82px); }
.album-hero p { max-width:610px; font-size:18px; color:#725b66; }
.album-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.album-btn { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:0 22px; border:1px solid transparent; border-radius:999px; font:700 14px inherit; cursor:pointer; transition:transform .2s,box-shadow .2s; }
.album-btn:hover { transform:translateY(-2px); box-shadow:0 11px 25px rgba(129,64,88,.18); }
.album-btn:focus-visible, .album-page summary:focus-visible { outline:3px solid #9c5673; outline-offset:3px; }
.album-btn-primary { color:#fff; background:#a95876; }
.album-btn-secondary { color:#8b4e68; border-color:#dcb2c0; background:#fffafa; }
.album-price-note { font-size:13px!important; margin-top:18px; }.album-price-note strong { color:#9c4265; }
.album-device { width:min(330px,100%); margin:auto; padding:12px; border:8px solid #6e5964; border-radius:40px; box-shadow:20px 25px 0 #e7cfd7,0 28px 55px rgba(105,58,77,.2); background:#342a30; transform:rotate(4deg); }
.album-device-screen { min-height:510px; padding:30px 23px; border-radius:25px; text-align:center; color:#76505e; background:linear-gradient(145deg,#f9e0e8,#f7ebdd); }.album-device-date { font-size:12px; letter-spacing:.14em; }.album-device-photo { height:260px; margin:24px 0; background-size:cover; border:10px solid #fff; box-shadow:0 9px 18px #b48a9680; transform:rotate(-3deg); }.album-photo-a,.demo-art-one { background:linear-gradient(140deg,#e7a8bb 0 37%,#fbd9af 37% 63%,#b6d1b2 63%); }.album-device-screen p { margin:0; font:25px Georgia,serif; }.album-device-screen>span:last-child { display:block; margin-top:13px; font-size:12px; }
.album-section { padding:clamp(64px,9vw,112px) 0; }.album-soft { background:linear-gradient(120deg,#f9e8ed,#f3eefb); }.album-heading { margin-bottom:36px; text-align:center; }.album-heading h2,.album-section h2 { font-size:clamp(36px,5vw,60px); }.album-heading h2 { color:var(--album-ink); }.album-audience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.album-audience-grid article { min-height:180px; padding:25px; border:1px solid #f0dce1; border-radius:22px; background:#fffdfb; box-shadow:0 12px 30px #7847570d; color:#b66c87; font-size:24px; }.album-audience-grid h3 { margin:15px 0 5px; color:var(--album-ink); font-size:18px; }.album-audience-grid p { margin:0; color:#806872; font-size:14px; }.album-feature-layout,.demo-grid { display:grid; grid-template-columns:1fr 1fr; gap:45px; align-items:center; }.album-lead { color:#806872; }.album-feature-list { display:grid; gap:12px; margin:0; padding:0; list-style:none; }.album-feature-list li { padding:15px 18px 15px 44px; border-radius:15px; background:#fff; color:#664d59; box-shadow:0 8px 20px #7847570d; position:relative; }.album-feature-list li::before { content:'♡'; position:absolute; left:18px; color:#be6884; }.album-demo-callout,.album-security-card,.album-ownership { display:flex; justify-content:space-between; gap:30px; align-items:center; padding:clamp(28px,5vw,55px); border:1px solid #eed9e1; border-radius:30px; background:#fff; }.album-demo-callout h2,.album-security-card h2,.album-ownership h2 { max-width:700px; font-size:clamp(32px,4vw,52px); }.album-demo-callout p,.album-security-card p,.album-ownership p { max-width:650px; color:#725b66; }.album-security { padding-top:0; }.album-security-card { background:linear-gradient(130deg,#fff,#f7effa); }.album-lock { font-size:65px; color:#aa5d78; }.album-price-card { max-width:620px; margin:auto; padding:clamp(32px,6vw,62px); border-radius:32px; text-align:center; background:#6d4357; color:#fff; box-shadow:0 25px 55px #693a4d42; }.album-price-card>span { color:#f5cfd9; }.album-price-card strong { display:block; font:clamp(42px,7vw,70px) Georgia,serif; }.album-price-card p { color:#faeaf0; }.album-price-card hr { border:0; border-top:1px solid #cfa4b3; margin:26px 0; }.album-price-card .album-btn { margin-top:10px; background:#fff5f7; color:#894b65; }.album-process { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:0; list-style:none; counter-reset:steps; }.album-process li { min-height:120px; padding:22px; border-radius:18px; background:#fff; color:#674b58; box-shadow:0 8px 22px #7847570d; }.album-process b { display:block; margin-bottom:8px; color:#b96883; font-size:13px; }.album-ownership p { margin:0; font-size:17px; }.album-faq { max-width:840px; margin:auto; }.album-faq details { border-bottom:1px solid #ead5dc; }.album-faq summary { padding:18px 4px; cursor:pointer; color:#533844; font-weight:700; }.album-faq p { margin:0 4px 18px; color:#775f69; }.album-final { padding:85px 0; text-align:center; color:#fff; background:linear-gradient(135deg,#9a5673,#70566e); }.album-final span { font-size:28px; }.album-final h2 { max-width:680px; margin:15px auto 27px; font-size:clamp(38px,5vw,63px); }.album-final .album-btn { background:#fff; color:#864c66; }
.demo-lock { min-height:calc(100vh - 74px); display:grid; place-items:center; padding:35px 16px; background:radial-gradient(circle at 18% 22%,#f1cee0 0 4%,transparent 20%),radial-gradient(circle at 82% 75%,#e5d6f2 0 5%,transparent 24%),#fcf4f2; }.demo-lock-card { max-width:620px; padding:clamp(36px,8vw,74px); border:1px solid #f0d8e0; border-radius:32px; text-align:center; background:#fffdfa; box-shadow:0 25px 60px #945b7040; }.demo-lock-card>span { color:#bd6e89; font-size:33px; }.demo-lock-card p { margin:12px 0 0; color:#a35a75; letter-spacing:.11em; text-transform:uppercase; font-size:12px; }.demo-lock-card h1 { margin:7px 0 22px; font:clamp(45px,8vw,76px) Georgia,serif; color:#5a3e4b; }.demo-lock-card blockquote { margin:0 0 26px; color:#785d69; font:italic 19px Georgia,serif; }.demo-lock-card small { display:block; margin-top:21px; color:#896e79; line-height:1.5; }.demo-cover { padding:clamp(85px,15vw,180px) 0; background:linear-gradient(135deg,#9e607c,#e49fb6 50%,#eac7e6); color:#fff; }.demo-cover span { font-size:12px; font-weight:800; letter-spacing:.16em; }.demo-cover h1 { margin:16px 0; font:clamp(65px,11vw,125px)/.85 Georgia,serif; letter-spacing:-.06em; }.demo-cover p { font-size:18px; }.demo-timeline { max-width:760px; margin:auto; border-left:2px solid #e6b2c3; }.demo-timeline article { position:relative; padding:0 0 30px 35px; }.demo-timeline article::before { content:''; position:absolute; width:13px; height:13px; left:-7px; top:7px; border:3px solid #fff; border-radius:50%; background:#b56682; }.demo-timeline b { color:#b35d7a; }.demo-timeline h3 { margin:4px 0; color:#573c49; }.demo-timeline p { margin:0; color:#76606a; }.demo-polaroids { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }.demo-polaroids figure { margin:0; padding:12px 12px 22px; background:#fff; box-shadow:0 15px 26px #7044522b; }.demo-polaroids figure:nth-child(1) { transform:rotate(-4deg); }.demo-polaroids figure:nth-child(3) { transform:rotate(4deg); }.demo-art { height:220px; }.demo-art-two { background:linear-gradient(140deg,#a5c5dc 0 42%,#fff1c8 42% 60%,#d997ad 60%); }.demo-art-three { background:linear-gradient(135deg,#dba4b8 0 35%,#a6c2a1 35% 61%,#f1d19e 61%); }.demo-polaroids figcaption { padding:15px 5px 0; color:#735866; font:18px Georgia,serif; }.demo-dates { padding:0; list-style:none; }.demo-dates li { display:flex; justify-content:space-between; gap:12px; padding:14px 0; border-bottom:1px solid #ecd8df; }.demo-dates b { color:#ad5d78; }.demo-letter { padding:38px; border-radius:12px; background:#fffdf7; box-shadow:8px 10px 0 #e7d4b6; transform:rotate(2deg); }.demo-letter span { color:#af6580; font:700 12px inherit; letter-spacing:.12em; text-transform:uppercase; }.demo-letter p { color:#67515b; font:23px/1.5 Georgia,serif; }.demo-letter b { color:#ad6380; }
@media (max-width:720px) { .album-hero-grid,.album-feature-layout,.demo-grid { grid-template-columns:1fr; }.album-hero { padding-top:55px; }.album-device { max-width:260px; }.album-device-screen { min-height:410px; }.album-device-photo { height:195px; }.album-audience-grid,.demo-polaroids { grid-template-columns:1fr 1fr; }.album-audience-grid article { min-height:150px; padding:18px; }.album-process { grid-template-columns:1fr 1fr; }.album-demo-callout,.album-security-card,.album-ownership { display:block; }.album-demo-callout .album-btn { margin-top:15px; width:100%; }.album-lock { display:block; margin-bottom:15px; }.demo-polaroids figure:nth-child(n) { transform:none; }.demo-art { height:145px; }.demo-polaroids figcaption { font-size:15px; }.demo-cover h1 { font-size:65px; }.album-hero h1 { font-size:54px; } }
@media (prefers-reduced-motion: reduce) { .album-btn { transition:none; } }