@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&family=Jost:wght@300;400;500;600&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--sd:#3D5240;--s:#6B7F5E;--sm:#8FA080;--sl:#C8D4C0;--sp:#EEF2EC;--milk:#F2EDE5;--ln:#D4C9B8;--cr:#FAF7F2;--gold:#C9A84C;--gold-l:#FDF6E3;--tx:#2C3828;--txm:#5C6B52;--txl:#8FA080}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes lineGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;background:var(--milk);color:var(--tx)}

/* COVER */
.cover{min-height:100vh;background:var(--sd);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.cover-deco1{position:absolute;right:-60px;top:-60px;width:340px;height:340px;border-radius:50%;border:1px solid rgba(255,255,255,.07)}
.cover-deco2{position:absolute;right:20px;top:20px;width:200px;height:200px;border-radius:50%;border:1px solid rgba(255,255,255,.05)}
.cover-deco3{position:absolute;left:-80px;bottom:80px;width:260px;height:260px;border-radius:50%;background:rgba(107,127,94,.18)}
.cover-deco4{position:absolute;right:30px;bottom:-40px;width:180px;height:180px;border-radius:50%;background:rgba(201,168,76,.07)}
.cover-top{padding:32px 32px 0;animation:fadeIn .8s ease both}
.cover-tag{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:6px 14px;border-radius:20px}
.cover-body{padding:0 32px;position:relative;z-index:1;animation:fadeUp .9s .15s ease both}
.cover-label{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--sl);margin-bottom:20px;opacity:.7}
.cover-title{font-family:'Cormorant Garamond',serif;font-size:clamp(48px,11vw,72px);font-weight:500;line-height:.95;color:#fff;margin-bottom:20px}
.cover-title em{font-style:italic;color:var(--sl)}
.cover-sub{font-size:14px;font-weight:300;color:rgba(255,255,255,.55);line-height:1.7;max-width:280px}
.cover-author{margin-top:28px;display:flex;align-items:center;gap:12px}
.author-av{width:40px;height:40px;border-radius:50%;background:var(--s);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:18px;font-style:italic;color:#fff;border:1.5px solid rgba(255,255,255,.2)}
.cover-bottom{padding:28px 32px 36px;position:relative;z-index:1;animation:fadeUp .9s .3s ease both}
.cover-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.chip{font-size:11px;color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.12);padding:5px 12px;border-radius:20px}
.chip.hl{background:var(--gold);color:var(--sd);border-color:var(--gold);font-weight:500}
.scroll-hint{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:300;color:rgba(255,255,255,.3);letter-spacing:.06em}
.scroll-line{width:40px;height:1px;background:rgba(255,255,255,.15);transform-origin:left;animation:lineGrow 1.2s 1s ease both}

/* INTRO */
.intro-strip{background:var(--sp);padding:28px 32px;border-bottom:1px solid var(--ln)}
.intro-strip p{font-size:13px;font-weight:300;color:var(--txm);line-height:1.8;max-width:560px;margin:0 auto;text-align:center}
.intro-strip strong{color:var(--sd);font-weight:500}

/* CARDS */
.product-card{border-bottom:1px solid var(--ln);position:relative;overflow:hidden}
.product-card:last-child{border-bottom:none}
.product-card:nth-child(odd){background:var(--cr)}
.product-card:nth-child(even){background:var(--milk)}
.card-inner{padding:40px 32px 44px;max-width:680px}
.card-number{font-family:'Cormorant Garamond',serif;font-size:96px;font-weight:500;color:var(--sl);line-height:1;position:absolute;right:24px;top:16px;opacity:.22;user-select:none;pointer-events:none}
.card-tag{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--s);margin-bottom:14px}
.card-tag::before{content:'';width:18px;height:1.5px;background:var(--sm);border-radius:1px}
.card-title{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:500;line-height:1.1;color:var(--tx);margin-bottom:8px}
.card-title em{font-style:italic;color:var(--s)}
.card-subtitle{font-size:13px;font-weight:300;color:var(--txl);margin-bottom:22px}
.card-divider{width:40px;height:1.5px;background:var(--sl);border-radius:1px;margin-bottom:22px}

/* RECAP */
.recap{background:var(--sp);padding:32px 32px 36px;border-top:1px solid var(--ln)}
.recap-title{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--txl);margin-bottom:16px;text-align:center}
.recap-pills{display:flex;flex-direction:column;gap:10px}
.recap-pill{display:flex;align-items:center;gap:14px;background:var(--cr);border:1px solid var(--ln);border-radius:12px;padding:12px 16px}
.recap-n{width:26px;height:26px;border-radius:50%;background:var(--sd);color:#fff;font-size:11px;font-weight:500;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.recap-text{font-size:13px;font-weight:400;color:var(--tx)}
.recap-text span{font-weight:300;color:var(--txm);font-size:12px}

/* CTA */
.cta-section{background:var(--sd);padding:56px 32px 64px;text-align:center;position:relative;overflow:hidden}
.cta-deco1{position:absolute;right:-50px;top:-50px;width:250px;height:250px;border-radius:50%;border:1px solid rgba(255,255,255,.06)}
.cta-deco2{position:absolute;left:-60px;bottom:-30px;width:200px;height:200px;border-radius:50%;background:rgba(107,127,94,.15)}
.cta-inner{position:relative;z-index:1}

@media(min-width:600px){
  .card-inner{padding:52px 48px 56px}
  .cover-body,.cover-top,.cover-bottom{padding-left:48px;padding-right:48px}
  .cta-section{padding:72px 48px 80px}
}