/* The Barakah Birth Guide page (guide.html). Everything is scoped to .guide-page so the site header and footer are untouched. */
.guide-page{font-family:'Cormorant Garamond',Garamond,serif;color:#2C1A14;background:#FAF6F2;width:100%}
.guide-page a{color:#6B1E2E}
.guide-page a:hover{color:#2C1A14}
.guide-page h1,.guide-page h2{text-wrap:balance}
.guide-page h1{font-weight:600!important;letter-spacing:-0.005em}
.guide-page h2{font-weight:500!important;font-style:italic}
.guide-page h3{font-weight:600!important}
.guide-page .iman{color:#6B1E2E!important}
.guide-page p:not(figure *):not([style*="italic"]):not([lang]),.guide-page li:not(figure *) span,.guide-page span[style*="color: #5A4A42"]:not(figure *),.guide-page figcaption,.guide-page details p{font-family:Lato,sans-serif!important}
.guide-page p:not(figure *):not([style*="italic"]):not([lang]){font-size:clamp(17px,1.4vw,20px)!important;line-height:1.65!important}
.guide-page span[style*="text-transform: uppercase"]:not(figure *),.guide-page span[style*="color: #7E6330"]:not(figure *){font-family:Lato,sans-serif!important;font-size:12px!important;font-weight:700!important;letter-spacing:.28em!important;text-transform:uppercase;color:#8C6A2E!important}
.guide-page span[style*="color: #D9BE8A"]{color:#D9BE8A!important}
.guide-page figcaption{font-size:13px!important;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#8C6A2E!important}
.guide-page [style*="#E8DDD2"]{border-color:rgba(140,106,46,.35)!important}
.guide-page blockquote,.guide-page [style*="border: 1px solid #B89552"]:not(figure *){border-width:1.5px!important}
.guide-page a[style*="min-height: 5"]{font-family:Lato,sans-serif!important;font-size:14px!important;font-weight:700!important;letter-spacing:.2em!important;text-transform:uppercase}
.guide-page a[style*="background: #6B1E2E"]{background:#2C1A14!important;transition:background .3s}
.guide-page a[style*="background: #6B1E2E"]:hover{background:#6B1E2E!important;color:#FAF6F2!important}
.guide-page summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.guide-page summary::-webkit-details-marker{display:none}
.guide-page summary::after{content:'+';color:#7E6330;font-size:28px;line-height:1}
.guide-page details[open] summary::after{content:'\2212'}
.guide-page section,.guide-page section *{box-sizing:border-box}

@keyframes gp-rise{from{opacity:0;transform:translateY(28px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes gp-settle{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
@keyframes gp-underline{to{background-size:100% 2px}}
@media (prefers-reduced-motion: no-preference){
.guide-page .hero-in>*{animation:gp-rise .9s cubic-bezier(.2,.7,.2,1) both}
.guide-page .hero-in>*:nth-child(2){animation-delay:.12s}
.guide-page .hero-in>*:nth-child(3){animation-delay:.24s}
.guide-page .hero-in>*:nth-child(4){animation-delay:.36s}
.guide-page .hero-in>*:nth-child(5){animation-delay:.48s}
.guide-page .hero-img{animation:gp-settle 1.6s cubic-bezier(.2,.7,.2,1) .2s both}
.guide-page .iman{background:linear-gradient(#B89552,#B89552) 0 94%/0 2px no-repeat;animation:gp-underline 1s ease-out 1.1s forwards}
@supports (animation-timeline: view()){
.guide-page section:not(:first-of-type)>div>*,.guide-page section figure,.guide-page section blockquote,.guide-page section li{animation:gp-rise linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
}
.guide-page figure>div:first-child{transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}
.guide-page figure:hover>div:first-child{transform:translateY(-6px);box-shadow:0 26px 50px rgba(44,26,20,.16)}
.guide-page a[style*="background: #6B1E2E"],.guide-page a[style*="background: #B89552"]{position:relative;overflow:hidden}
.guide-page a[style*="background: #6B1E2E"]::after,.guide-page a[style*="background: #B89552"]::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(250,246,242,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .9s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.guide-page a[style*="background: #6B1E2E"]:hover::after,.guide-page a[style*="background: #B89552"]:hover::after{transform:translateX(120%)}
}
