:root{
  --navy:#2E3648;
  --navy-deep:#232A38;
  --navy-mid:#515D73;
  --nude:#C3A398;
  --nude-light:#D8C3BB;
  --creme:#F7F5F0;
  --white:#FFFFFF;
  --serif:"Playfair Display",Georgia,serif;
  --sans:"Montserrat",-apple-system,Segoe UI,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0;min-width:0}
html{scroll-behavior:smooth;overflow-x:hidden;background:var(--creme)}
body{
  background:var(--creme);
  color:var(--navy);
  font-family:var(--sans);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  width:100%;max-width:100%;
}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
h1,h2,h3,h4{font-family:var(--serif);line-height:1.18;letter-spacing:-.01em;color:var(--navy);font-weight:500}
a{color:inherit}
section{position:relative}

.r{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.r.on{opacity:1;transform:translateY(0)}
.r[data-d="1"]{transition-delay:.08s}.r[data-d="2"]{transition-delay:.16s}.r[data-d="3"]{transition-delay:.24s}

/* header */
.hd{position:fixed;top:0;left:0;right:0;z-index:300;padding:22px 0;transition:background .35s,padding .35s,border-color .35s;border-bottom:1px solid transparent}
.hd.scrolled{background:rgba(46,54,72,.92);backdrop-filter:blur(14px);padding:14px 0;border-color:rgba(195,163,152,.16)}
.hd .wrap{display:flex;align-items:center;justify-content:space-between}
.hd .brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--creme);font-family:var(--serif);font-size:18px;letter-spacing:.2px}
.hd .brand img{height:26px;width:auto}
.hd nav{display:flex;gap:30px}
.hd nav a{text-decoration:none;color:var(--creme);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;opacity:.82;transition:opacity .2s}
.hd nav a:hover{opacity:1}
.hd .cta{background:var(--nude);color:var(--navy);padding:10px 20px;border-radius:2px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;text-decoration:none;white-space:nowrap;transition:transform .25s,background .25s}
.hd .cta:hover{transform:translateY(-2px);background:var(--nude-light)}
@media(max-width:860px){.hd nav{display:none}}

.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:2px;text-decoration:none;font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;transition:transform .25s var(--ease),background .25s,box-shadow .25s}
.btn--primary{background:var(--nude);color:var(--navy)}
.btn--primary:hover{transform:translateY(-3px);background:var(--nude-light);box-shadow:0 14px 30px -12px rgba(195,163,152,.5)}
.btn--ghost{background:transparent;color:var(--creme);border:1px solid rgba(247,245,240,.35)}
.btn--ghost:hover{border-color:var(--nude);color:var(--nude);transform:translateY(-3px)}

/* page header banda */
.pagehead{background:var(--navy);padding:190px 0 80px;color:var(--creme)}
.pagehead .eyebrow{color:var(--nude);font-size:12px;letter-spacing:.28em;text-transform:uppercase;font-weight:600;margin-bottom:20px}
.pagehead h1{font-size:clamp(32px,5vw,58px);max-width:20ch}
.pagehead p{margin-top:20px;font-size:17px;color:rgba(247,245,240,.75);max-width:56ch;font-weight:300}
.breadcrumb{font-size:12.5px;color:rgba(247,245,240,.55);margin-bottom:26px}
.breadcrumb a{color:rgba(247,245,240,.75);text-decoration:none}
.breadcrumb a:hover{color:var(--nude)}

/* blog index grid */
.blog-index{padding:90px 0 140px;background:var(--creme)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.blog-card{background:var(--navy);color:var(--creme);text-decoration:none;display:block;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s}
.blog-card:hover{transform:translateY(-6px);box-shadow:0 24px 40px -20px rgba(46,54,72,.35)}
.blog-card__tag{display:inline-block;background:rgba(195,163,152,.16);color:var(--nude-light);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding:6px 12px;border-radius:20px;margin:30px 26px 0}
.blog-card h3,.blog-card h2{font-size:21px;margin:18px 26px 12px;line-height:1.28;color:var(--creme)}
.blog-card p{font-size:14px;color:rgba(247,245,240,.68);font-weight:300;margin:0 26px 26px}
.blog-card .read{display:flex;align-items:center;gap:8px;margin:0 26px 28px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--nude);font-weight:600}
@media(max-width:940px){.blog-grid{grid-template-columns:1fr;max-width:520px;margin:0 auto}}

/* article */
.article{padding:80px 0 60px;background:var(--creme)}
.article .meta{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--navy-mid);margin-bottom:26px}
.article .meta .tag{background:rgba(195,163,152,.16);color:#8a6a5c;padding:4px 12px;border-radius:20px;font-weight:600}
.article__body{max-width:72ch;margin:0 auto;padding:0 28px}
.article__body > *{max-width:72ch}
.article__body h2{font-size:clamp(24px,3vw,32px);margin:52px 0 20px}
.article__body h3{font-size:20px;margin:36px 0 14px}
.article__body p{font-size:17px;font-weight:300;margin-bottom:20px;color:#3b4457}
.article__body p b{font-weight:600;color:var(--navy)}
.article__body ul,.article__body ol{margin:0 0 24px 22px}
.article__body li{font-size:17px;font-weight:300;margin-bottom:10px;color:#3b4457}
.article__body blockquote{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--navy);border-left:3px solid var(--nude);padding-left:24px;margin:36px 0}
.article-cta{margin-top:56px;padding:44px;background:var(--navy);color:var(--creme);text-align:center}
.article-cta h3{color:var(--creme);font-size:24px;margin-bottom:14px}
.article-cta p{color:rgba(247,245,240,.75);font-weight:300;margin-bottom:26px}
.related{padding:90px 0 130px;background:var(--navy-deep)}
.related h2{color:var(--creme);font-size:26px;margin-bottom:36px}

/* footer */
footer{background:var(--navy-deep);padding:80px 0 36px;color:rgba(247,245,240,.6)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:50px;padding-bottom:56px;border-bottom:1px solid rgba(195,163,152,.14)}
.foot-brand{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.foot-brand img{height:28px}
.foot-brand span{font-family:var(--serif);font-size:19px;color:var(--creme)}
.foot-grid p{font-size:14px;font-weight:300;max-width:34ch;line-height:1.7}
.foot-col h5{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--nude);font-weight:600;margin-bottom:20px}
.foot-col a{display:block;text-decoration:none;color:rgba(247,245,240,.68);font-size:14.5px;margin-bottom:12px;transition:color .2s}
.foot-col a:hover{color:var(--nude-light)}
.foot-bottom{padding-top:28px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr;gap:34px}}

.wa-float{position:fixed;right:22px;bottom:22px;z-index:400;background:#25D366;color:#fff;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 10px 24px -6px rgba(0,0,0,.4);transition:transform .25s}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:28px;height:28px;fill:#fff}