/* ==========================================================================
   Thank-you pages (template-parts/page-thanks.php)
   ========================================================================== */

.ty-hero{position:relative;overflow:hidden;isolation:isolate;padding-block:40px 88px}
.ty-hero__wrap{position:relative;z-index:1}
.ty-hero .rt-breadcrumb{margin-bottom:22px}

.ty-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:40px;max-width:760px;margin-inline:auto;padding:48px 48px 40px;border-radius:32px;background:var(--card);color:var(--text);border:1px solid var(--line);box-shadow:0 40px 90px rgba(0,0,0,.35);overflow:hidden;text-align:center}
.ty-card.has-aside{max-width:1040px;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);text-align:start}
.ty-card::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,var(--gold),#FFD34D,var(--ok))}
.ty-card__main{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center}
.ty-card.has-aside .ty-card__main{align-items:flex-start}

/* The check draws itself. */
.ty-check{width:112px;height:112px;margin-bottom:14px;overflow:visible}
.ty-check__halo{fill:var(--ok-bg)}
.ty-check__ring{fill:none;stroke:var(--ok);stroke-width:6;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transform:rotate(-90deg);transform-origin:50% 50%}
.ty-check__tick{fill:none;stroke:var(--ok);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.has-motion .ty-check__halo{transform-origin:50% 50%;animation:ty-pop .7s cubic-bezier(.2,1.4,.4,1) both}
.has-motion .ty-check__ring{stroke-dashoffset:1;animation:ty-draw .7s .15s cubic-bezier(.65,0,.35,1) forwards}
.has-motion .ty-check__tick{stroke-dashoffset:1;animation:ty-draw .45s .75s cubic-bezier(.65,0,.35,1) forwards}
@keyframes ty-draw{to{stroke-dashoffset:0}}
@keyframes ty-pop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}

.ty-kicker{display:inline-flex;margin:0 0 8px;padding:4px 14px;border-radius:999px;background:var(--ok-bg);color:var(--ok);font-weight:800;font-size:14px}
.ty-title{margin:0;font-size:34px;line-height:1.5;font-weight:900;color:var(--ink-text);text-wrap:balance}
.ty-msg{margin-top:12px;max-width:60ch}
.ty-msg p{margin:0 0 6px;font-size:17px;line-height:2;color:var(--muted)}
.ty-msg p:first-child{color:var(--text);font-weight:700}

.ty-downloads{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;width:100%;margin-top:24px}
.ty-dl{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:var(--ink);color:#fff;text-align:start;transition:transform .2s,box-shadow .2s,background .2s}
.ty-dl:hover{color:#fff;transform:translateY(-3px);box-shadow:0 16px 34px var(--shadow);background:var(--navy-bg)}
.ty-dl__icon{flex:none;width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--gold);color:#0A1430}
.ty-dl__icon svg,.ty-dl__arrow svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ty-dl__text{flex:1;display:flex;flex-direction:column;line-height:1.6}
.ty-dl__text b{font-size:15px;white-space:nowrap}
.ty-dl__text small{font-size:12px;color:var(--on-ink-2);font-family:var(--font)}
.ty-dl__arrow{flex:none;color:var(--gold)}
.has-motion .ty-dl__arrow svg{animation:ty-nudge 1.8s 1.4s ease-in-out infinite}
@keyframes ty-nudge{0%,60%,100%{transform:none}30%{transform:translateY(3px)}}

.ty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:24px}
.ty-card.has-aside .ty-actions{justify-content:flex-start}
.ty-actions .btn-line{color:var(--ink-text)}

.ty-card__aside{position:relative;z-index:1;display:flex;flex-direction:column;gap:18px;align-self:center}
.ty-media{margin:0;text-align:center}
.ty-media img{display:block;margin-inline:auto;max-height:340px;width:auto;border-radius:18px}
.ty-extra{padding:18px 20px;border-radius:20px;background:var(--paper);border:1px solid var(--line);font-size:15px;line-height:1.9}
.ty-extra h2,.ty-extra h3{margin:0 0 8px;font-size:17px;color:var(--ink-text)}
.ty-extra ul{margin:0;padding-inline-start:18px}

/* Confetti: pieces are added by thanks.js when motion is allowed. */
.ty-confetti{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.ty-confetti i{position:absolute;top:-16px;left:var(--x);width:var(--w,8px);height:var(--h,14px);border-radius:2px;background:var(--c);opacity:0;animation:ty-fall var(--t,2.6s) var(--d,0s) cubic-bezier(.25,.6,.4,1) forwards}
.ty-confetti i.is-dot{border-radius:50%}
@keyframes ty-fall{
	0%{opacity:0;transform:translate3d(0,0,0) rotate(0)}
	10%{opacity:1}
	100%{opacity:0;transform:translate3d(var(--dx,0px),var(--fall,520px),0) rotate(var(--r,540deg))}
}

/* Next steps. */
.ty-next{padding-block:80px;background:var(--paper)}
.ty-next .sv-head{margin-bottom:36px}
.ty-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.ty-step{position:relative;height:100%;display:flex;flex-direction:column;gap:8px;padding:24px 22px 22px;border-radius:24px;background:var(--card);border:1px solid var(--line);color:var(--text);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,border-color .25s}
.ty-step:hover{color:var(--text);transform:translateY(-6px);box-shadow:0 24px 50px var(--shadow);border-color:rgba(243,188,0,.6)}
.ty-step b{font-size:18px;font-weight:900;color:var(--ink-text)}
.ty-step>span:not([class]){color:var(--muted);font-size:14.5px;line-height:1.9}
.ty-step__n{position:absolute;top:16px;inset-inline-end:18px;font-family:var(--font-lat);font-size:30px;font-weight:800;line-height:1;color:var(--line)}
.ty-step__icon{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:#fff;margin-bottom:6px}
.ty-step__icon svg{width:26px;height:26px}
.ty-step__icon .d{fill:rgba(243,188,0,.9);stroke:#F3BC00}
.ty-step__go{margin-top:auto;padding-top:6px;color:var(--navy)}
.ty-step__go svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.ty-step:hover .ty-step__go svg{transform:translateX(-4px)}

.ty-blog{background:var(--card)}
.ty-blog__grid{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Phone strip. */
.ty-call{padding-block:0 80px;background:var(--card)}
.ty-call__box{display:flex;align-items:center;gap:22px;padding:28px 32px;border-radius:28px;background:var(--ink);color:var(--on-ink)}
.ty-call__box h2{margin:0;font-size:22px;font-weight:900;color:#fff}
.ty-call__box p{margin:4px 0 0;color:var(--on-ink-2)}
.ty-call__box>div{flex:1}
.ty-call__icon{flex:none;width:60px;height:60px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:rgba(243,188,0,.14);color:var(--gold)}
.ty-call__icon svg{width:30px;height:30px}
.ty-call__icon .d{fill:rgba(243,188,0,.35)}

@media (max-width:1100px){
	.ty-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
	.ty-blog__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
	.ty-card.has-aside{grid-template-columns:minmax(0,1fr);text-align:center}
	.ty-card.has-aside .ty-card__main{align-items:center}
	.ty-card.has-aside .ty-actions{justify-content:center}
	.ty-call__box{flex-direction:column;text-align:center}
}
@media (max-width:640px){
	.ty-hero{padding-block:24px 48px}
	.ty-card{padding:36px 20px 28px;border-radius:24px;gap:28px}
	.ty-title{font-size:25px}
	.ty-msg p{font-size:16px}
	.ty-check{width:92px;height:92px}
	.ty-actions{width:100%}
	.ty-actions .btn{flex:1 1 100%}
	.ty-next{padding-block:56px}
	.ty-steps{grid-template-columns:minmax(0,1fr);gap:12px}
	.ty-step{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:18px}
	.ty-step__icon{margin:0;width:46px;height:46px}
	.ty-step b{flex:1}
	.ty-step>span:not([class]){flex-basis:100%}
	.ty-step__go{display:none}
	.ty-blog__grid{grid-template-columns:minmax(0,1fr)}
	.ty-call{padding-bottom:56px}
	.ty-call__box{padding:24px 20px}
	.ty-call__box .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
	.ty-check__ring,.ty-check__tick{stroke-dashoffset:0!important;animation:none!important}
	.ty-confetti{display:none}
}