/* ==========================================================================
   Heart to Home — theme styles
   Values are the design export's own. Its only responsive logic was JS
   (width < 1200 = "mobile" layout, width >= 760 = wide steps); those are the
   two breakpoints here. Phone-only refinements live at the end of the file.
   ========================================================================== */

:root {
	--ink: #2A3253;
	--text: #4B4A57;
	--purple: #8C6CB4;
	--purple-d: #7E63AA;
	--pink: #D8618F;
	--pink-d: #B94A78;
	--teal: #4DB6AC;
	--teal-d: #3EA096;
	--cream: #FCF8F7;
	--lilac: #F6F3F8;
	--line: #EDE7EE;
	--line2: #E6DFEA;
	--plum: #2B2333;
	--muted: #6b7086;
	--ease: cubic-bezier(.2,.7,.2,1);
	--serif: 'Newsreader', Georgia, serif;
	--sans: 'Instrument Sans', Helvetica, Arial, sans-serif;
	--shadow: 0 1px 2px rgba(42,50,83,.04), 0 16px 48px rgba(42,50,83,.06);
	--header-h: 104px;
}

/* ---------- Base (design <style> block) ---------- */
html, body { margin: 0; padding: 0; background: var(--cream); color: var(--text); font-family: var(--sans); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-kerning: normal; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } html { scroll-behavior: auto; } }
*, *::before, *::after { box-sizing: border-box; }
a { color: var(--purple); text-decoration: none; }
a:hover { color: var(--pink); }
h1, h2, h3, h4 { font-family: var(--serif); color: var(--ink); margin: 0; line-height: 1.1; letter-spacing: -.01em; font-weight: 500; text-wrap: balance; font-feature-settings: 'liga', 'kern'; }
h3, h4 { line-height: 1.2; }
p { margin: 0; text-wrap: pretty; }
p strong, li strong, .h2h-strong strong { color: var(--ink); }
ul, ol { margin: 0; padding: 0; list-style: none; }
img { max-width: 100%; }
figure, blockquote, address { margin: 0; font-style: normal; }
input, textarea, select, button { font-family: inherit; font-size: inherit; }
::selection { background: #EDE6F5; color: var(--ink); }
:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; }
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
.h2h-skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--ink); color: #fff; border-radius: 4px; transition: top .2s; }
.h2h-skip:focus { top: 12px; color: #fff; }

@keyframes h2hFade { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes h2hKen { from { transform: scale(1.06); } to { transform: scale(1); } }
@keyframes h2hFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes h2hArrow { 0%,100% { transform: translateX(0); } 50% { transform: translateX(5px); } }
@keyframes h2hRise { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes h2hWord { from { opacity: 0; transform: translateY(105%); } to { opacity: 1; transform: none; } }
@keyframes h2hDrop { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

.h2h-site { min-height: 100vh; display: flex; flex-direction: column; }
.h2h-main { flex: 1; animation: h2hFade .4s ease-out; }

/* ---------- Utilities ---------- */
.h2h-wrap { max-width: 1240px; margin: 0 auto; width: 100%; }
.h2h-sec { padding: var(--pt, 120px) 24px var(--pb, 120px); }
.h2h-stack { display: flex; flex-direction: column; }
.h2h-center { text-align: center; }
.h2h-grow { flex: 1; }
.h2h-self-start { align-self: flex-start; }
.h2h-none { flex: none; }
.h2h-mt8 { margin-top: 8px; }
.h2h-lead { font-size: 17px; }
.h2h-strong { font-weight: 700; color: var(--ink); }
.h2h-kicker { font-weight: 700; color: var(--ink); font-size: 17px; }
.h2h-em { color: var(--purple); font-style: italic; font-weight: 400; }
.h2h-em-i { font-style: italic; color: var(--purple); }
.h2h-eyebrow { font-size: 11px; letter-spacing: 2.4px; text-transform: uppercase; color: var(--purple); font-weight: 700; }
.h2h-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.h2h-grid2--300 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.h2h-grid2--400 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); }
.h2h-grid2--center { align-items: center; }
.h2h-pic { border-radius: 6px; overflow: hidden; position: relative; }
.h2h-pic > img, .h2h-pic > iframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; border: 0; }
.h2h-card { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 32px; box-shadow: var(--shadow); }
.h2h-card--28 { padding: 28px; }
.h2h-card--edge { border-left: 4px solid var(--purple); }
.h2h-card--edge-teal { border-left: 4px solid var(--teal); }
.h2h-cardh { color: var(--pink); font-size: 25px; }
.h2h-pinkbar { width: 56px; height: 3px; border-radius: 3px; background: var(--pink); }
.h2h-sticky { position: sticky; top: 108px; }
.h2h-plain { color: inherit; }

/* Bullet lists (dot + text) */
.h2h-list { display: flex; flex-direction: column; gap: 10px; }
.h2h-list--8 { gap: 8px; }
.h2h-list--12 { gap: 12px; }
.h2h-list--14 { gap: 14px; }
.h2h-list--sm { font-size: 15px; }
.h2h-list--lg { font-size: 17px; }
.h2h-list--cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 10px; }
.h2h-li { display: flex; gap: 12px; align-items: flex-start; }
.h2h-list--8 .h2h-li, .h2h-list--cols .h2h-li { gap: 10px; }
.h2h-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--purple); box-shadow: 0 0 0 4px #EDE6F5; flex: none; margin: 9px 8px 0 5px; }
.h2h-dot--pink { background: var(--pink); box-shadow: 0 0 0 4px #FBE4EE; }
.h2h-dot--teal { background: var(--teal); box-shadow: 0 0 0 4px #E3F4F2; }

/* Buttons */
.h2h-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 32px; border-radius: 3px; background: var(--pink); color: #fff; font-weight: 700; font-size: 12.5px; letter-spacing: 2px; text-transform: uppercase; line-height: 1.6; transition: all .25s; }
.h2h-btn:hover { background: var(--pink-d); color: #fff; transform: translateY(-2px); }
.h2h-btn--lg { padding: 17px 34px; box-shadow: 0 12px 30px rgba(216,97,143,.28); }
.h2h-btn--lg:hover { box-shadow: 0 16px 36px rgba(216,97,143,.34); }
.h2h-btn--md { padding: 15px 30px; }
.h2h-btn--md:hover, .h2h-btn--sm:hover, .h2h-btn--xs:hover { transform: none; }
.h2h-btn--sm { padding: 14px 26px; }
.h2h-btn--xs { padding: 10px 20px; font-size: 12px; letter-spacing: 1.6px; }
.h2h-shadow { box-shadow: 0 12px 30px rgba(216,97,143,.28); }
.h2h-btn[aria-disabled="true"], .h2h-darkbtn[aria-disabled="true"], .h2h-stores [aria-disabled="true"] { cursor: default; }
.h2h-stores span[aria-disabled] { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border-radius: 10px; background: var(--ink); color: #fff; font-weight: 700; font-size: 14px; }
.h2h-arrowlink { display: inline-flex; align-self: flex-start; align-items: center; gap: 10px; color: var(--pink); font-weight: 700; font-size: 12px; letter-spacing: 1.6px; text-transform: uppercase; border-bottom: 1px solid var(--pink); padding-bottom: 4px; margin-top: 4px; }
.h2h-arrowlink > span[aria-hidden] { display: inline-block; transition: transform .3s; }
a:hover .h2h-arrowlink > span[aria-hidden], .h2h-arrowlink:hover > span[aria-hidden] { transform: translateX(4px); }
.h2h-darkbtn { display: inline-flex; align-items: center; gap: 9px; padding: 11px 18px; border-radius: 3px; background: var(--ink); color: #fff; font-weight: 700; font-size: 12px; letter-spacing: 1.4px; text-transform: uppercase; transition: all .25s; }
.h2h-darkbtn:hover { background: var(--pink); color: #fff; transform: translateY(-1px); }
.h2h-darkbtn__i { font-size: 14px; line-height: 1; display: inline-flex; }
.h2h-stores svg { flex: none; }

/* ---------- Header ---------- */
.h2h-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.94); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); transition: box-shadow .25s; }
.admin-bar .h2h-header { top: 32px; }
.h2h-header.is-scrolled { box-shadow: 0 8px 30px rgba(42,50,83,.08); }
.h2h-util { background: var(--plum); color: rgba(255,255,255,.78); font-size: 13px; overflow: hidden; height: 40px; transition: height .35s var(--ease); }
.is-scrolled .h2h-util { height: 0; }
.h2h-util__in { max-width: 1320px; margin: 0 auto; padding: 0 32px; height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.h2h-util__contact { display: flex; align-items: center; gap: 28px; }
.h2h-util a { display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,.85); transition: color .2s; }
.h2h-util__phone { letter-spacing: .3px; font-variant-numeric: tabular-nums; }
.h2h-util a:hover { color: #fff; }
.h2h-util__social { display: flex; align-items: center; gap: 18px; }
.h2h-util__social a { color: rgba(255,255,255,.7); }
.h2h-bar { max-width: 1320px; margin: 0 auto; padding: 0 32px; height: var(--header-h); display: flex; align-items: center; justify-content: space-between; gap: 32px; transition: height .35s var(--ease); }
.is-scrolled .h2h-bar { height: 78px; }
.h2h-logo { display: flex; align-items: center; flex: none; }
.h2h-logo img { height: 74px; width: auto; display: block; transition: height .35s var(--ease); }
.is-scrolled .h2h-logo img { height: 56px; }
.h2h-nav { display: flex; align-items: center; gap: 6px; margin-left: auto; margin-right: -10px; }
.h2h-nav__a { display: flex; align-items: center; gap: 6px; padding: 10px 16px; font-size: 17px; font-weight: 500; letter-spacing: -.01em; white-space: nowrap; color: var(--ink); border-radius: 8px; position: relative; transition: color .2s; }
.h2h-nav__a::after { content: ''; position: absolute; left: 16px; right: 16px; bottom: 5px; height: 1px; background: var(--pink); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.h2h-nav__a.is-active { color: var(--pink); }
.h2h-nav__a.is-active::after { transform: scaleX(1); }
.h2h-headcta { display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px; border-radius: 3px; background: var(--pink); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; white-space: nowrap; box-shadow: 0 8px 20px rgba(216,97,143,.22); transition: all .25s; flex: none; margin-left: 22px; }
.h2h-headcta:hover { background: var(--pink-d); color: #fff; transform: translateY(-1px); box-shadow: 0 12px 26px rgba(216,97,143,.3); }
.h2h-headcta__arrow { display: inline-block; font-size: 15px; line-height: 1; animation: h2hArrow 1.6s ease-in-out infinite; }
.h2h-burger { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 10px; background: #fff; flex-direction: column; align-items: center; justify-content: center; gap: 5px; cursor: pointer; padding: 0; }
.h2h-burger span { width: 20px; height: 2px; background: var(--ink); border-radius: 2px; transition: transform .25s, opacity .2s; }
.h2h-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.h2h-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.h2h-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.h2h-mnav { border-top: 1px solid var(--line); background: #fff; padding: 12px 24px 20px; display: flex; flex-direction: column; gap: 2px; animation: h2hDrop .18s ease-out; max-height: calc(100vh - 78px); max-height: calc(100dvh - 78px); overflow-y: auto; overscroll-behavior: contain; }
.h2h-mnav[hidden] { display: none; }
.h2h-mnav a { padding: 12px 8px; font-size: 17px; font-weight: 500; color: var(--ink); border-bottom: 1px solid var(--lilac); }
.h2h-mnav a.is-active { color: var(--pink); }
.h2h-mnav .h2h-mnav__call { margin-top: 14px; display: inline-flex; align-items: center; justify-content: center; padding: 14px; border-radius: 3px; background: var(--purple); color: #fff; font-weight: 700; font-size: 12.5px; letter-spacing: 2px; text-transform: uppercase; border: 0; }

/* ---------- Home hero ---------- */
.h2h-home-hero { --off: clamp(0px, 7vw, 140px); --w: max(62%, 560px); position: relative; overflow: hidden; background: var(--cream); min-height: min(90vh, 820px); display: flex; align-items: center; }
.h2h-home-hero__img { position: absolute; top: -80px; bottom: -80px; right: var(--off); width: var(--w); will-change: transform; }
.h2h-home-hero__ken { position: absolute; inset: 0; animation: h2hKen 22s ease-out both; }
.h2h-home-hero__ken img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.h2h-home-hero__mask { position: absolute; top: 0; bottom: 0; left: 0; width: calc(100% - var(--w) - var(--off) + 2px); background: var(--cream); }
.h2h-home-hero__fade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #FCF8F7 0, #FCF8F7 calc(100% - var(--w) - var(--off) - 1px), rgba(252,248,247,.96) calc(100% - var(--w) - var(--off) + 90px), rgba(252,248,247,.55) calc(100% - var(--w) - var(--off) + 240px), rgba(252,248,247,.12) calc(100% - var(--w) - var(--off) + 390px), rgba(252,248,247,0) calc(100% - var(--w) - var(--off) + 480px)); }
.h2h-home-hero__rfade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(270deg, #FCF8F7 0, #FCF8F7 calc(var(--off) - 1px), rgba(252,248,247,.6) calc(var(--off) + 60px), rgba(252,248,247,0) calc(var(--off) + 180px)); }
.h2h-home-hero__bfade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(246,243,248,0) 45%, rgba(246,243,248,.45) 75%, rgba(246,243,248,.92) 92%, #F6F3F8 100%); }
.h2h-home-hero__in { position: relative; width: 100%; max-width: 1320px; margin: 0 auto; padding: clamp(67px, 8.4vw, 119px) 32px clamp(60px, 7.4vw, 104px); }
.h2h-home-hero__text { max-width: min(620px, calc(100% - max(62%, 560px) + 60px)); display: flex; flex-direction: column; gap: 28px; }
.h2h-home-hero__h1 { font-weight: 500; color: var(--ink); font-size: clamp(47px, 5vw, 78px); line-height: .98; letter-spacing: -.02em; }
.h2h-home-hero__em { display: block; font-style: italic; font-weight: 400; color: var(--purple); margin-top: .1em; }
.h2h-word { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .14em; margin-bottom: -.14em; }
.h2h-word > span { display: inline-block; animation: h2hWord .9s var(--ease) both; }
.h2h-home-hero__p { font-size: 17px; line-height: 1.8; max-width: 560px; color: #3F3E4A; animation: h2hFade .7s .16s ease-out both; }
.h2h-home-hero__btns { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; animation: h2hFade .7s .24s ease-out both; }
.h2h-facts { display: flex; gap: 18px 36px; flex-wrap: wrap; margin-top: 20px; border-top: 1px solid rgba(42,50,83,.14); padding-top: 26px; animation: h2hFade .7s .34s ease-out both; }
.h2h-fact { display: flex; flex-direction: column; gap: 2px; padding-left: 14px; border-left: 2px solid var(--pink); }
.h2h-fact__big { font-family: var(--serif); font-size: 30px; font-weight: 600; color: var(--ink); line-height: 1; }
.h2h-fact__small { font-size: 12px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--purple); font-weight: 700; }
.h2h-home-hero__stacked { display: none; }
.h2h-floatcard { position: absolute; right: 32px; bottom: clamp(45px, 5.6vw, 74px); background: rgba(255,255,255,.92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.7); border-radius: 6px; padding: 22px 26px; display: flex; flex-direction: column; gap: 6px; box-shadow: 0 20px 50px rgba(42,50,83,.18); max-width: 300px; animation: h2hFade .8s .4s ease-out both, h2hFloat 7s 1.2s ease-in-out infinite; }
.h2h-floatcard__title { font-family: var(--serif); font-size: 34px; font-weight: 600; color: var(--ink); line-height: 1.05; }
.h2h-floatcard__title em { font-style: italic; font-weight: 400; color: var(--pink); }
.h2h-floatcard__link { margin-top: 8px; font-size: 12px; letter-spacing: 1.6px; text-transform: uppercase; font-weight: 700; color: var(--pink); display: inline-flex; align-items: center; gap: 8px; }
.h2h-floatcard__link:hover { color: var(--pink-d); }

/* ---------- Home: values + services ---------- */
.h2h-values { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px clamp(16px, 2.4vw, 36px); padding: 0 0 48px; margin-bottom: 88px; border-bottom: 1px solid #DDD3E3; text-align: center; }
.h2h-values__item { display: inline-flex; align-items: center; gap: clamp(16px, 2.4vw, 36px); }
.h2h-values__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--pink); flex: none; }
.h2h-values__word { font-family: var(--serif); font-size: clamp(28px, 3.4vw, 46px); font-weight: 400; color: var(--ink); letter-spacing: -.01em; line-height: 1.1; }
.h2h-values__word.is-em { font-style: italic; color: var(--purple); }
.h2h-home-svc__intro { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 40px; align-items: start; margin-bottom: 56px; }
.h2h-home-svc__intro .h2h-lead { line-height: 1.75; }
.h2h-rulehead { display: flex; align-items: center; gap: 20px; margin-bottom: 36px; }
.h2h-rulehead h3 { font-size: 30px; color: var(--ink); font-style: italic; font-weight: 400; }
.h2h-rulehead > span { flex: 1; height: 1px; background: #DDD3E3; }
.h2h-rulehead--center { gap: 16px; }
.h2h-band .h2h-rulehead > span { background: rgba(255,255,255,.3); }
.h2h-band .h2h-rulehead h3 { color: #fff; }
.h2h-band .h2h-rulehead { gap: 20px; }

.h2h-svcgrid { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.h2h-svccard { flex: 0 1 calc((100% - 48px) / 3); min-width: min(100%, 300px); display: flex; flex-direction: column; gap: 16px; background: #fff; border-radius: 6px; padding: 36px 32px; border: 1px solid var(--line); box-shadow: var(--shadow); color: inherit; transition: all .25s; position: relative; overflow: hidden; }
.h2h-svccard:hover { color: inherit; transform: translateY(-4px); box-shadow: 0 18px 40px rgba(140,108,180,.18); border-color: #D9CBE8; }
.h2h-svccard h3 { font-size: 27px; }
.h2h-svccard__price { color: var(--ink); font-family: var(--serif); font-weight: 600; font-size: 24px; letter-spacing: .2px; }
.h2h-svccard p { font-size: 15px; line-height: 1.65; flex: 1; }
.h2h-svccard--band { gap: 12px; padding: 28px; border: 0; box-shadow: none; }
.h2h-svccard--band:hover { box-shadow: 0 20px 40px rgba(0,0,0,.2); border-color: transparent; }
.h2h-svccard--band .h2h-arrowlink { margin-top: 6px; }

.h2h-products { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 24px; }
.h2h-product { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 28px; align-items: start; background: #fff; border-radius: 6px; padding: 32px; border: 1px solid var(--line); box-shadow: var(--shadow); }
.h2h-product__img { width: 120px; border-radius: 5px; overflow: hidden; background: var(--lilac); box-shadow: 0 10px 24px rgba(42,50,83,.12); position: relative; }
.h2h-product__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.h2h-product__img img.h2h-img--contain { object-fit: contain; }
.h2h-product__body { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.h2h-product h3 { font-size: 27px; }
.h2h-product__price { color: var(--ink); font-family: var(--serif); font-weight: 600; font-size: 22px; }
.h2h-product p { font-size: 15px; line-height: 1.65; }
.h2h-product__links { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; }

/* What makes us different — photo with pink block */
.h2h-offsetpic { position: relative; padding: 0 28px 28px 0; }
.h2h-offsetpic__block { position: absolute; right: 0; top: 40px; width: 52%; height: 60%; background: #E94F91; border-radius: 6px; }
.h2h-offsetpic__img { position: relative; border-radius: 6px; overflow: hidden; box-shadow: 0 20px 50px rgba(42,50,83,.15); aspect-ratio: 4/5; background: #e9dfef; }
.h2h-offsetpic__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Contact form card */
.h2h-formcard { background: var(--lilac); border-radius: 8px; padding: 36px; border: 1px solid var(--line); }
.h2h-formcard__h { font-size: 36px; margin-bottom: 24px; }
.h2h-formcard--tall textarea.h2h-input { min-height: 170px; }

/* ---------- Inner hero ---------- */
.h2h-hero { --f1: 90px; --f2: 240px; --f3: 390px; --f4: 480px; position: relative; min-height: var(--hmin, 380px); display: flex; align-items: center; overflow: hidden; background: var(--cream); }
.h2h-hero--narrow { --f1: 60px; --f2: 170px; --f3: 280px; --f4: 360px; }
.h2h-hero__img { position: absolute; top: 0; bottom: 0; right: var(--hr); width: var(--hw); overflow: hidden; animation: h2hKen 18s ease-out both; }
.h2h-hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
@media (min-width: 1200px) { .h2h-hero--shift .h2h-hero__photo { left: -10%; width: 110%; } } /* subject sits ~5% further left */
.h2h-hero__veil { display: none; position: absolute; inset: 0; background: rgba(252,248,247,.9); }
.h2h-hero__fade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #FCF8F7 0, #FCF8F7 calc(100% - var(--hw) - var(--hf) - 1px), rgba(252,248,247,.96) calc(100% - var(--hw) - var(--hf) + var(--f1)), rgba(252,248,247,.55) calc(100% - var(--hw) - var(--hf) + var(--f2)), rgba(252,248,247,.12) calc(100% - var(--hw) - var(--hf) + var(--f3)), rgba(252,248,247,0) calc(100% - var(--hw) - var(--hf) + var(--f4))); }
.h2h-hero__rfade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(270deg, #FCF8F7 0, #FCF8F7 calc(var(--hf) - 1px), rgba(252,248,247,.6) calc(var(--hf) + 60px), rgba(252,248,247,0) calc(var(--hf) + 160px)); }
.h2h-hero__bfade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(252,248,247,0) 55%, rgba(252,248,247,.7) 100%); }
.h2h-hero__in { position: relative; width: 100%; max-width: 1320px; margin: 0 auto; padding: clamp(52px, 5.6vw, 82px) 32px; }
.h2h-hero__text { position: relative; max-width: min(640px, calc(100% - max(58%, 520px) + 60px)); display: flex; flex-direction: column; gap: var(--hgap, 12px); align-items: flex-start; }
.h2h-hero--noimg .h2h-hero__text { max-width: 720px; }
.h2h-hero__h1 { font-weight: 500; color: var(--ink); line-height: 1; letter-spacing: -.015em; animation: h2hRise .9s .08s var(--ease) both; font-size: var(--h1); }
.h2h-hero__sub { color: var(--purple); font-family: var(--serif); font-style: italic; font-size: 26px; font-weight: 500; line-height: 1.3; animation: h2hRise .9s .18s var(--ease) both; }
.h2h-hero__lead { color: var(--text); font-size: 17px; line-height: 1.75; animation: h2hRise .9s .18s var(--ease) both; }
.h2h-hero__btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---------- How it works ---------- */
.h2h-steps { max-width: 1000px; margin: 0 auto; display: flex; flex-direction: column; }
.h2h-step { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 0 40px; align-items: stretch; }
.h2h-step__rail { display: flex; flex-direction: column; align-items: center; padding-top: 36px; }
.h2h-step__num { width: 64px; height: 64px; border-radius: 50%; background: #fff; border: 1px solid #D9CBE8; box-shadow: 0 8px 24px rgba(140,108,180,.15); display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 26px; font-weight: 500; color: var(--purple); flex: none; }
.h2h-step__line { flex: 1; width: 1px; margin: 12px 0; background: linear-gradient(180deg, #D9CBE8, rgba(217,203,232,1)); }
.h2h-step.is-last .h2h-step__line { background: linear-gradient(180deg, #D9CBE8, rgba(217,203,232,0)); }
.h2h-step__card { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 36px; margin-bottom: 28px; display: grid; grid-template-columns: 1fr; gap: 28px; align-items: start; box-shadow: var(--shadow); transition: all .25s; }
.h2h-step.is-last .h2h-step__card { margin-bottom: 0; }
.h2h-step__card.has-photo { grid-template-columns: minmax(0, 1.4fr) minmax(220px, 1fr); }
.h2h-step__card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(140,108,180,.15); }
.h2h-step__head { display: flex; align-items: baseline; gap: 14px; }
.h2h-step__inline { display: none; font-family: var(--serif); font-weight: 500; font-size: 40px; line-height: 1; color: #B79BD1; }
.h2h-step__label { font-size: 12px; letter-spacing: 2.4px; font-weight: 700; color: var(--purple); text-transform: uppercase; }
.h2h-step__title { font-size: 28px; line-height: 1.2; }
.h2h-step__photo { border-radius: 5px; overflow: hidden; aspect-ratio: 4/5; background: #e9e2ea; min-height: 260px; position: relative; }
.h2h-step__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Lilac split */
.h2h-split { background: var(--lilac); }
.h2h-split__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); align-items: stretch; }
.h2h-split__copy { padding: 104px clamp(22px, 5.6vw, 104px); display: flex; flex-direction: column; justify-content: center; }
.h2h-split__img { position: relative; }
/* The design's image slots fall back to a 3:2 ratio, which sets the row height
   whenever the copy is shorter than width × 2/3. */
.h2h-split__img::before { content: ''; display: block; padding-top: 66.667%; }
.h2h-split__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.h2h-bigh { font-size: clamp(50px, 6vw, 88px); font-weight: 400; line-height: .98; letter-spacing: -.02em; }
.h2h-kick-pink { font-size: 12px; letter-spacing: 2.6px; text-transform: uppercase; font-weight: 700; color: var(--pink); margin-top: 6px; }

/* ---------- Services ---------- */
.h2h-swipe { display: none; }
.h2h-compare { overflow-x: auto; border-radius: 6px; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow); -webkit-overflow-scrolling: touch; }
.h2h-compare table { width: 100%; border-collapse: collapse; min-width: 900px; font-size: 14px; }
.h2h-compare thead th { text-align: center; padding: 20px 14px; background: #fff; color: var(--ink); font-weight: 700; line-height: 1.35; border-bottom: 2px solid var(--purple); }
.h2h-compare thead th.h2h-compare__first { text-align: left; padding: 20px; color: var(--purple); font-size: 12px; letter-spacing: 2px; text-transform: uppercase; position: sticky; left: 0; z-index: 1; }
.h2h-compare__price { color: var(--purple); font-family: var(--serif); font-size: 20px; font-weight: 600; }
.h2h-compare tbody tr { background: #fff; transition: background .2s; }
.h2h-compare tbody tr:nth-child(even) { background: #FBF3F7; }
.h2h-compare tbody tr:hover { background: #EDE6F5; }
.h2h-compare tbody th { padding: 13px 20px; color: var(--ink); font-weight: 600; text-align: left; position: sticky; left: 0; background: inherit; }
.h2h-compare tbody tr:nth-child(odd) th { background: #fff; }
.h2h-compare tbody tr:nth-child(even) th { background: #FBF3F7; }
.h2h-compare tbody tr:hover th { background: #EDE6F5; }
.h2h-compare td { padding: 13px 14px; text-align: center; }
.h2h-compare td.is-yes { color: var(--pink); font-weight: 700; font-size: 16px; }
.h2h-compare td.is-no { color: #C9C2D3; font-weight: 400; font-size: 14px; }
.h2h-compare td.is-text { color: #4A4F63; font-weight: 600; font-size: 13px; }
.h2h-legend { margin-top: 16px; font-size: 13px; color: var(--muted); display: flex; gap: 18px; flex-wrap: wrap; }
.h2h-notsure { margin-top: 48px; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 40px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; box-shadow: var(--shadow); }
.h2h-notsure .h2h-btn:hover { transform: none; }

.h2h-faq { display: flex; flex-direction: column; gap: 12px; }
.h2h-faq__item { border-radius: 5px; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.h2h-faq summary { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; background: var(--lilac); color: var(--ink); font-weight: 700; font-size: 16px; line-height: normal; text-align: left; cursor: pointer; transition: all .2s; list-style: none; }
.h2h-faq summary::-webkit-details-marker { display: none; }
.h2h-faq__chev { width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.25); display: inline-flex; align-items: center; justify-content: center; transition: transform .25s; flex: none; }
.h2h-faq__item[open] summary { background: var(--purple); color: #fff; }
.h2h-faq__item[open] .h2h-faq__chev { transform: rotate(180deg); }
.h2h-faq__a { padding: 18px 22px 22px; line-height: 1.7; white-space: pre-line; animation: h2hDrop .2s ease-out; }
.h2h-faq--call .h2h-faq__item { border-color: #CFE9E6; }
.h2h-faq--call summary { background: #F3FAF9; }
.h2h-faq--call .h2h-faq__chev { width: auto; height: auto; background: none; }
.h2h-faq--call .h2h-faq__item[open] summary { background: var(--teal); }

/* Service detail */
.h2h-investment { display: inline-flex; align-self: center; align-items: center; gap: 12px; padding: 8px 18px; border-radius: 999px; background: #fff; border: 1px solid var(--line); }
.h2h-investment span { font-size: 13px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; color: var(--purple); }
.h2h-investment strong { font-family: var(--serif); font-size: 22px; font-weight: 700; color: var(--pink); }
.h2h-svcpay { margin-top: 56px; display: flex; justify-content: center; }
.h2h-svcpay .h2h-btn svg { flex: none; }
.h2h-otherpills { margin-top: 48px; display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.h2h-otherpills a { padding: 10px 18px; border-radius: 999px; border: 1px solid var(--line2); background: #fff; font-size: 14px; font-weight: 600; color: var(--ink); transition: all .2s; }
.h2h-otherpills a:hover { border-color: var(--purple); color: var(--purple); }

/* ---------- App ---------- */
.h2h-shot { display: flex; flex-direction: column; gap: 14px; }
.h2h-shot__img { border-radius: 8px; overflow: hidden; background: #F3EEF8; box-shadow: 0 1px 2px rgba(42,50,83,.04), 0 16px 48px rgba(42,50,83,.08); position: relative; }
.h2h-shot__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.h2h-shot figcaption { display: flex; flex-direction: column; gap: 4px; padding: 0 4px; font-size: 15px; color: var(--text); }
.h2h-shot__t { font-family: var(--serif); font-size: 24px; font-weight: 500; color: var(--ink); }
.h2h-tier { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 36px; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 6px 24px rgba(42,50,83,.05); position: relative; }
.h2h-tier.is-featured { border-color: var(--pink); box-shadow: 0 24px 60px rgba(222,106,158,.18); }
.h2h-tier__badge { position: absolute; top: -13px; left: 32px; padding: 5px 14px; border-radius: 999px; background: var(--pink); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.h2h-tier__head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.h2h-tier__name { font-size: 40px; line-height: 1.1; }
.h2h-tier__price { font-family: var(--serif); font-size: 28px; font-weight: 700; color: var(--purple); }
.h2h-tier__per { color: var(--purple); font-weight: 600; }
.h2h-tier__inc { font-weight: 700; color: var(--pink); }
.h2h-stores { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.h2h-stores a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border-radius: 10px; background: var(--ink); color: #fff; font-weight: 700; font-size: 14px; }
.h2h-stores a:hover { background: #3b4470; color: #fff; }

/* ---------- Resources ---------- */
.h2h-comp { background: radial-gradient(ellipse at 0% 0%, rgba(222,106,158,.16), transparent 40%), radial-gradient(ellipse at 100% 100%, rgba(77,182,172,.16), transparent 40%), var(--cream); }
.h2h-comptable { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: #fff; border-radius: 6px; border: 1px solid var(--line); overflow: hidden; box-shadow: var(--shadow); }
.h2h-comptable thead th { padding: 16px 22px; color: #fff; font-weight: 700; letter-spacing: 1px; font-size: 13px; text-transform: uppercase; text-align: left; background: var(--purple); }
.h2h-comptable thead th + th { background: var(--teal); }
.h2h-comptable tbody tr { background: #fff; transition: background .15s; }
.h2h-comptable tbody tr:nth-child(even) { background: var(--cream); }
.h2h-comptable tbody tr:hover { background: var(--lilac); }
.h2h-comptable tbody th, .h2h-comptable td { padding: 12px 22px; font-size: 15px; border-top: 1px solid var(--lilac); text-align: left; vertical-align: top; }
.h2h-comptable tbody th { color: var(--ink); font-weight: 600; }
.h2h-note { background: #fff; border: 1px solid #CFE9E6; border-radius: 6px; padding: 32px; display: flex; flex-direction: column; gap: 12px; }
.h2h-note__head { display: flex; align-items: center; gap: 14px; }
.h2h-note__icon { width: 40px; height: 40px; border-radius: 50%; background: #E3F4F2; color: var(--teal-d); display: flex; align-items: center; justify-content: center; flex: none; }
.h2h-fundhead { margin-bottom: 56px; padding-bottom: 48px; border-bottom: 1px solid var(--line2); }
.h2h-cards3 { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.h2h-cards3 > * { flex: 0 1 calc((100% - 48px) / 3); min-width: min(100%, 300px); }
.h2h-glass { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); border-radius: 6px; padding: 24px; display: flex; flex-direction: column; gap: 8px; }
.h2h-glass h3 { color: #fff; font-size: 24px; }
.h2h-glass p { color: rgba(255,255,255,.9); font-size: 15px; }

/* Guide / About framed image */
.h2h-framed { position: relative; margin: 14px; }
.h2h-framed::before { content: ''; position: absolute; inset: -14px; border: 1px solid #D9CBE8; border-radius: 8px; pointer-events: none; }
/* Surrogacy Guide cover: a 9:14 book, capped so it doesn't tower over the copy. */
.h2h-bookframe { width: min(100% - 28px, 380px); justify-self: center; }
.h2h-dashed { border: 1.5px dashed #D9CBE8; border-radius: 6px; padding: 56px 32px; text-align: center; color: var(--purple); background: rgba(255,255,255,.6); }

/* ---------- About ---------- */
.h2h-quote { margin: 18px 0; padding: 8px 0 8px 28px; border-left: 2px solid var(--pink); font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(26px, 2.4vw, 35px); line-height: 1.2; color: var(--ink); }
.h2h-purpose { background: var(--lilac); border-radius: 6px; padding: 28px; display: flex; flex-direction: column; gap: 14px; border-left: 4px solid var(--pink); }
.h2h-testis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 24px; margin-top: 40px; text-align: left; width: 100%; }
.h2h-testi { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 32px; display: flex; flex-direction: column; gap: 18px; box-shadow: var(--shadow); }
.h2h-testi blockquote { font-family: var(--serif); font-style: italic; font-size: 21px; line-height: 1.45; color: var(--ink); }
.h2h-testi figcaption { display: flex; flex-direction: column; font-size: 14px; }
.h2h-testi figcaption strong { color: var(--ink); }
.h2h-testi figcaption span { color: var(--purple); font-weight: 700; font-size: 12px; letter-spacing: 1.6px; text-transform: uppercase; }

/* ---------- Start your journey ---------- */
.h2h-who { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 32px; width: 100%; max-width: 820px; }
.h2h-who__card { background: #fff; border: 2px solid var(--line); border-radius: 8px; padding: 16px; min-width: 0; display: flex; flex-direction: column; gap: 14px; color: inherit; transition: all .25s; box-shadow: 0 6px 24px rgba(42,50,83,.05); text-align: center; }
.h2h-who__card:hover { transform: translateY(-3px); color: inherit; }
.h2h-who__btn { display: inline-flex; justify-content: center; padding: 14px 18px; border-radius: 3px; color: #fff; font-weight: 700; font-size: 12px; letter-spacing: 1.4px; text-transform: uppercase; }
.h2h-who__sub { font-size: 14px; color: var(--muted); }
.h2h-timeline { position: relative; display: flex; flex-direction: column; gap: 22px; }
.h2h-timeline::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 3px; margin-left: -1.5px; background: linear-gradient(180deg, var(--purple), var(--pink) 50%, var(--teal)); border-radius: 3px; opacity: .6; }
.h2h-tl { display: grid; grid-template-columns: 1fr 56px 1fr; align-items: center; --dot: var(--purple); }
.h2h-tl.is-right { --dot: var(--pink); }
.h2h-tl__card { grid-column: 1; grid-row: 1; background: var(--lilac); border-radius: 6px; padding: 20px 24px; display: flex; flex-direction: column; gap: 6px; transition: all .25s; border: 1px solid transparent; }
.h2h-tl.is-right .h2h-tl__card { grid-column: 3; }
.h2h-tl__card:hover { border-color: #D9CBE8; background: #fff; box-shadow: 0 12px 30px rgba(140,108,180,.15); }
.h2h-tl__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.h2h-tl__head h3 { font-size: 22px; }
.h2h-tl__when { font-size: 12px; font-weight: 700; color: var(--dot); letter-spacing: .5px; text-transform: uppercase; }
.h2h-tl__card p { font-size: 15px; }
.h2h-tl__dot { grid-column: 2; grid-row: 1; display: flex; justify-content: center; }
.h2h-tl__dot span { width: 36px; height: 36px; border-radius: 50%; background: var(--dot); border: 5px solid #fff; box-shadow: 0 0 0 2px var(--dot); display: block; }

/* ---------- Book a call ---------- */
.h2h-topics { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; width: 100%; }
.h2h-topics li { border: 1.5px solid #CFE9E6; border-radius: 6px; padding: 26px 20px; text-align: center; display: flex; flex-direction: column; gap: 12px; align-items: center; background: #fff; transition: all .25s; }
.h2h-topics li:hover { background: #F3FAF9; transform: translateY(-3px); }
.h2h-topics__n { width: 44px; height: 44px; border-radius: 50%; background: #E3F4F2; color: var(--teal); font-weight: 700; font-family: var(--serif); display: flex; align-items: center; justify-content: center; }
.h2h-topics__t { font-weight: 700; color: var(--ink); font-size: 15px; line-height: 1.4; }
.h2h-calendly { width: 100%; min-width: 320px; height: 700px; border-radius: 8px; overflow: hidden; background: #fff; }
.h2h-faqgrid { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr); gap: 48px; align-items: start; }

/* ---------- Questions ---------- */
.h2h-qlist { display: flex; flex-direction: column; gap: 6px; }
.h2h-qlist .h2h-li { gap: 14px; padding: 12px 14px; border-radius: 10px; transition: background .2s; font-size: 17px; }
.h2h-qlist .h2h-li:hover { background: #fff; }

/* ---------- Contact ---------- */
.h2h-contactlist { display: flex; flex-direction: column; gap: 14px; padding: 24px; background: var(--lilac); border-radius: 6px; }
.h2h-contactlist > div { display: flex; gap: 12px; align-items: flex-start; }
.h2h-contactlist__i { width: 36px; height: 36px; border-radius: 10px; background: #fff; color: var(--purple); display: flex; align-items: center; justify-content: center; flex: none; font-weight: 700; }
.h2h-contactlist a { overflow-wrap: anywhere; }
.h2h-talk { background: linear-gradient(135deg, #4DB6AC, #6CC6BD); border-radius: 6px; padding: 32px; color: #fff; display: flex; flex-direction: column; gap: 10px; }
.h2h-talk h3 { color: #fff; font-size: 26px; }
.h2h-talk p { color: rgba(255,255,255,.95); }
.h2h-talk__btn { align-self: flex-start; margin-top: 6px; display: inline-flex; padding: 12px 22px; border-radius: 3px; background: #fff; color: var(--teal-d); font-weight: 700; font-size: 12px; letter-spacing: 1.6px; text-transform: uppercase; }
.h2h-talk__btn:hover { background: #F3FAF9; color: var(--teal-d); }

/* ---------- Payment ---------- */
.h2h-pay__lock { width: 64px; height: 64px; border-radius: 50%; background: #fff; border: 1px solid var(--line2); box-shadow: 0 10px 30px rgba(42,50,83,.08); display: flex; align-items: center; justify-content: center; color: var(--purple); }
.h2h-pay .h2h-btn svg { flex: none; }
.h2h-pay__trust { display: flex; gap: 10px 22px; flex-wrap: wrap; justify-content: center; font-size: 13px; color: #6b6a78; margin-top: 6px; }
.h2h-pay__sep { color: #D9CBE8; }
.h2h-pay__note { font-size: 14px; color: #6b6a78; margin-top: 18px; padding-top: 22px; border-top: 1px solid var(--line2); width: 100%; }
.h2h-pinklink { color: var(--pink); font-weight: 700; }
.h2h-inklink { color: var(--ink); font-weight: 700; }

/* ---------- Legal / prose ---------- */
.h2h-prose { display: flex; flex-direction: column; gap: 20px; font-size: 17px; }
.h2h-prose h2 { font-size: 30px; margin-top: 16px; }
.h2h-prose h3 { font-size: 23px; margin-top: 8px; }
.h2h-prose ul { list-style: disc; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.h2h-prose ol { list-style: decimal; padding-left: 22px; }
.h2h-prose a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Forms ---------- */
.h2h-form { display: flex; flex-direction: column; gap: 18px; }
.h2h-form[hidden], .h2h-thanks[hidden] { display: none; }
.h2h-form__blurb { display: flex; align-items: center; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid var(--line2); }
.h2h-form__blurb img { height: 48px; width: auto; flex: none; }
.h2h-form__blurb span { font-size: 13px; line-height: 1.5; color: var(--text); }
.h2h-f-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.h2h-f { display: flex; flex-direction: column; gap: 6px; }
.h2h-f[hidden] { display: none; }
.h2h-f--contact .h2h-f-label { font-size: 13px; font-weight: 700; color: var(--ink); }
.h2h-input { padding: 13px 14px; border: 1px solid var(--line2); border-radius: 8px; background: #fff; font-size: 15px; font-weight: 400; color: var(--ink); width: 100%; min-width: 0; line-height: normal; -webkit-appearance: none; appearance: none; }
textarea.h2h-input { resize: vertical; }
select.h2h-input { min-height: 49px; cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238C6CB4' stroke-width='1.8'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
.h2h-input:focus, .h2h-phone:focus-within { outline: none; border-color: var(--purple) !important; box-shadow: 0 0 0 3px rgba(140,108,180,.18); }
.h2h-input::placeholder { color: #9a98a6; }
.h2h-input.is-invalid, .is-invalid .h2h-input, .is-invalid .h2h-phone { border-color: var(--pink); }
.h2h-phone { display: flex; border: 1px solid var(--line2); border-radius: 8px; background: #fff; overflow: hidden; }
.h2h-cc { border: none; border-right: 1px solid var(--line2); background: var(--cream); padding: 0 10px; font-size: 14px; font-weight: 600; color: var(--ink); cursor: pointer; }
.h2h-input--bare { flex: 1; border: none; background: transparent; border-radius: 0; }
.h2h-input--bare:focus { box-shadow: none; }
.h2h-f-sensitive { font-size: 13px; font-weight: 400; font-style: italic; color: var(--muted); }
.h2h-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.h2h-req { color: var(--pink); }
.h2h-f--contact .h2h-req { display: none; } /* The design's contact form shows no asterisks. */

.h2h-consent { display: flex; flex-direction: column; gap: 14px; padding: 18px; border: 1px solid var(--line2); border-radius: 8px; background: #fff; margin: 0; min-width: 0; }
.h2h-consent__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.h2h-consent legend { font-size: 13px; font-weight: 700; color: var(--ink); padding: 0; float: left; }
.h2h-consent__all { background: none; border: 1px solid var(--purple); border-radius: 3px; padding: 6px 12px; color: var(--purple); font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; cursor: pointer; transition: all .2s; }
.h2h-consent__all:hover { background: var(--purple); color: #fff; }
.h2h-consent__row { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; font-size: 13px; line-height: 1.55; color: var(--text); font-weight: 400; position: relative; }
.h2h-consent__row input, .h2h-pill input { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.h2h-consent__box { width: 20px; height: 20px; flex: none; margin-top: 1px; border-radius: 4px; border: 1.5px solid #B9AFC6; background: #fff; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; transition: all .15s; }
.h2h-consent__row input:checked + .h2h-consent__box { background: var(--purple); border-color: var(--purple); }
.h2h-consent__row input:checked + .h2h-consent__box::after, .h2h-pill input:checked + .h2h-pill__box::after { content: '✓'; }
.h2h-consent__row input:focus-visible + .h2h-consent__box, .h2h-pill input:focus-visible + .h2h-pill__box { outline: 2px solid var(--purple); outline-offset: 2px; }
.h2h-consent__row a { color: var(--purple); font-weight: 700; }
.h2h-consent__row.is-invalid .h2h-consent__box { border-color: var(--pink); }
.h2h-consent__subs { display: flex; flex-direction: column; gap: 14px; padding-left: 16px; border-left: 2px solid #EDE6F5; }

.h2h-form__error { padding: 14px 16px; border-radius: 6px; background: #FBE4EE; color: #9B2F5E; font-size: 14px; }
.h2h-form__error[hidden] { display: none; }
.h2h-form__submit { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.h2h-submit { padding: 14px 30px; border-radius: 3px; border: none; background: var(--teal); color: #fff; font-weight: 700; font-size: 12.5px; letter-spacing: 2px; text-transform: uppercase; cursor: pointer; transition: all .2s; box-shadow: 0 8px 20px rgba(77,182,172,.3); }
.h2h-submit:hover { background: var(--teal-d); transform: translateY(-1px); }
.h2h-submit[disabled] { opacity: .65; cursor: wait; transform: none; }
.h2h-form--wide .h2h-form__submit { align-items: stretch; }
.h2h-form--wide .h2h-submit { padding: 15px 30px; box-shadow: none; }
.h2h-form--wide .h2h-submit:hover { transform: none; }
.h2h-form__small { font-size: 12px; color: var(--muted); }
.h2h-form__note { font-size: 14px; color: var(--ink); }

/* Intake variant (IP / GC forms) */
.h2h-intake { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: clamp(24px, 4vw, 44px); box-shadow: var(--shadow); }
.h2h-form--intake { gap: 30px; }
.h2h-f--intake { gap: 10px; }
.h2h-f--intake .h2h-f-label { font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.45; }
.h2h-f-name { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 14px; }
.h2h-f-sub { display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: var(--muted); }
.h2h-f-hint { font-size: 12px; color: var(--muted); }
.h2h-f-section { font-size: 30px; padding-top: 12px; border-top: 1px solid var(--line); margin-top: 6px; }
.h2h-w200 { max-width: 200px; }
.h2h-w320 { max-width: 320px; }
.h2h-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.h2h-pill { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; border: 1.5px solid var(--line2); background: #fff; color: var(--ink); font-size: 14px; line-height: normal; cursor: pointer; transition: all .15s; position: relative; }
.h2h-pill:has(input:checked) { border-color: var(--purple); background: #EDE6F5; }
.h2h-pill__box { width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid #B9AFC6; background: #fff; color: #fff; font-size: 10px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.h2h-pill__box--round { border-radius: 50%; }
.h2h-pill input:checked + .h2h-pill__box { background: var(--purple); border-color: var(--purple); }
.h2h-submit--intake { padding: 16px 34px; background: var(--pink); box-shadow: 0 12px 30px rgba(216,97,143,.28); }
.h2h-submit--intake:hover { background: var(--pink-d); }

.h2h-thanks { background: #fff; border-radius: 6px; padding: 32px; text-align: center; display: flex; flex-direction: column; gap: 10px; align-items: center; animation: h2hFade .3s; }
.h2h-thanks__tick { width: 56px; height: 56px; border-radius: 50%; background: var(--teal); color: #fff; font-size: 26px; display: flex; align-items: center; justify-content: center; }
.h2h-thanks__h { font-size: 28px; }
.h2h-thanks--intake { border: 1px solid var(--line); border-radius: 8px; padding: 48px 32px; gap: 12px; }
.h2h-thanks--intake .h2h-thanks__h { font-size: 32px; }
.h2h-thanks--intake p { max-width: 520px; }
.h2h-thanks__again { margin-top: 8px; background: none; border: none; color: var(--purple); font-weight: 700; cursor: pointer; font-size: 16px; }
.h2h-intake .h2h-thanks { box-shadow: none; border: 0; padding: 16px 0; }

/* ---------- CTA band + footer ---------- */
.h2h-cta { position: relative; overflow: hidden; background: var(--plum); text-align: center; }
.h2h-cta__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.h2h-cta__veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(43,35,51,.55) 0%, rgba(43,35,51,.6) 50%, rgba(43,35,51,.92) 85%, #2B2333 100%); pointer-events: none; }
.h2h-cta__in { position: relative; padding: 112px 24px 128px; max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; align-items: center; }
.h2h-cta h2 { color: #fff; font-size: clamp(37px, 4.3vw, 56px); font-weight: 500; }
.h2h-cta p { color: rgba(255,255,255,.92); font-size: 17px; }
.h2h-cta__btns { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }
.h2h-cta .h2h-btn { transition: all .2s; }

.h2h-footer { background: var(--plum); position: relative; color: rgba(255,255,255,.72); }
.h2h-footer__grid { max-width: 1240px; margin: 0 auto; padding: 24px 24px 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 48px; }
.h2h-footer--solo .h2h-footer__grid { padding-top: 80px; }
.h2h-footer__brand { display: flex; flex-direction: column; gap: 18px; max-width: 340px; }
.h2h-footer__brand img { width: 200px; height: auto; display: block; align-self: flex-start; }
.h2h-footer__tag { font-family: var(--serif); font-style: italic; font-size: 24px; color: #C9B3E6; line-height: 1.2; }
.h2h-footer__tag span { color: #F08DB5; }
.h2h-footer__brand p:last-child { font-size: 15px; color: rgba(255,255,255,.72); }
.h2h-footer__col { display: flex; flex-direction: column; gap: 12px; }
.h2h-footer__h { font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; font-family: var(--sans); font-weight: 700; color: #fff; line-height: 1.2; }
.h2h-footer__rule { width: 32px; height: 1px; background: var(--pink); }
.h2h-footer__col > a { color: rgba(255,255,255,.78); font-size: 15px; transition: color .2s; display: flex; gap: 10px; align-items: center; }
.h2h-footer__col > a:hover { color: #fff; }
.h2h-footer__col > a.h2h-footer__addr { align-items: flex-start; }
.h2h-footer__addr svg { flex: none; margin-top: 3px; }
.h2h-footer__glyph { color: var(--pink); font-weight: 700; }
.h2h-footer__social { display: flex; gap: 10px; margin-top: 10px; }
.h2h-footer__social a { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.22); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.85); transition: all .25s; }
.h2h-footer__social a:hover { background: var(--pink); border-color: var(--pink); color: #fff; transform: translateY(-2px); }
.h2h-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); }
.h2h-footer__bottom-in { max-width: 1240px; margin: 0 auto; padding: 20px 24px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; color: rgba(255,255,255,.5); }
.h2h-footer__legal { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.h2h-footer__legal a { color: rgba(255,255,255,.5); transition: color .2s; }
.h2h-footer__legal a:hover { color: #fff; }
.h2h-footer__pay { display: inline-flex; align-items: center; gap: 7px; }
.h2h-footer__sep { width: 1px; height: 12px; background: rgba(255,255,255,.2); }

.h2h-top { position: fixed; right: 24px; bottom: 24px; width: 46px; height: 46px; border-radius: 5px; border: none; background: var(--purple); color: #fff; font-size: 18px; cursor: pointer; box-shadow: 0 10px 24px rgba(140,108,180,.4); z-index: 40; animation: h2hFade .25s; }
.h2h-top:hover { background: var(--pink); }
.h2h-top[hidden] { display: none; }

/* Scroll reveal (only armed by JS, so content never hides without it) */
.h2h-js [data-reveal].is-pending { opacity: 0; transform: translateY(26px); }
.h2h-js [data-reveal].is-revealing { transition: opacity .8s var(--ease), transform .8s var(--ease); }

/* ==========================================================================
   < 1200px — the design's "mobile" layout (its isMobile breakpoint)
   ========================================================================== */
@media (max-width: 1199.98px) {
	.h2h-util, .h2h-nav, .h2h-headcta { display: none; }
	.h2h-burger { display: flex; }

	.h2h-home-hero { min-height: 0; }
	.h2h-home-hero__img, .h2h-home-hero__mask, .h2h-home-hero__fade, .h2h-home-hero__rfade, .h2h-home-hero__bfade, .h2h-floatcard { display: none; }
	.h2h-home-hero__text { max-width: 680px; }
	.h2h-home-hero__stacked { display: block; margin: 48px -32px calc(-1 * clamp(60px, 7.4vw, 104px)); position: relative; height: min(520px, 62vw); overflow: hidden; }
	.h2h-home-hero__stacked img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

	.h2h-hero__img { inset: 0; width: auto; right: 0; animation: none; }
	.h2h-hero__veil { display: block; }
	.h2h-hero__fade, .h2h-hero__rfade, .h2h-hero__bfade { display: none; }
	.h2h-hero__text { max-width: 720px; pointer-events: auto; }
}

/* < 760px — steps collapse (the design's stepsWide) */
@media (max-width: 759.98px) {
	.h2h-step { grid-template-columns: minmax(0, 1fr); }
	.h2h-step__rail { display: none; }
	.h2h-step__inline { display: inline; }
	.h2h-step__card.has-photo { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Tablet + phone refinements (beyond the export, which had no media queries)
   ========================================================================== */
@media (max-width: 1199.98px) {
	.admin-bar .h2h-header { top: 0; }
	.h2h-sticky { position: static; }
	/* The stacked hero photo otherwise butts straight into the values row. */
	.h2h-home-svc.h2h-sec { padding-top: 40px; }
}

@media (max-width: 900px) {
	/* Call FAQ: heading above the accordion instead of a cramped side column. */
	.h2h-faqgrid { grid-template-columns: 1fr; gap: 28px; }
	.h2h-swipe { display: block; margin: -32px 0 12px; font-size: 12px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--purple); text-align: right; }
	.h2h-compare table { min-width: 820px; }
	.h2h-compare tbody th { box-shadow: 1px 0 0 var(--line); }
}

@media (max-width: 759.98px) {
	:root { --header-h: 76px; }
	html { scroll-padding-top: 80px; }
	.h2h-bar { padding: 0 20px; gap: 16px; }
	.h2h-logo img { height: 54px; }
	.is-scrolled .h2h-bar { height: 66px; }
	.is-scrolled .h2h-logo img { height: 46px; }
	.h2h-mnav { padding: 8px 20px 20px; }

	.h2h-sec { padding: calc(var(--pt, 120px) * .62) 20px calc(var(--pb, 120px) * .62); }
	.h2h-home-hero__in, .h2h-hero__in { padding-left: 20px; padding-right: 20px; }
	.h2h-home-hero__stacked { margin-left: -20px; margin-right: -20px; height: min(420px, 78vw); }
	.h2h-home-hero__text { gap: 22px; }
	.h2h-home-hero__h1 { font-size: clamp(40px, 11vw, 47px); }
	.h2h-home-hero__btns .h2h-btn { flex: 1 1 200px; }
	.h2h-facts { gap: 16px 24px; }
	.h2h-fact__big { font-size: 26px; }
	.h2h-hero { min-height: min(var(--hmin, 380px), 340px); }
	.h2h-hero__sub { font-size: 22px; }
	.h2h-hero__lead { font-size: 16px; }
	.h2h-hero__btns { width: 100%; }
	.h2h-hero__btns .h2h-btn { flex: 1 1 180px; }

	.h2h-values { margin-bottom: 56px; padding-bottom: 36px; }
	.h2h-home-svc__intro { gap: 20px; margin-bottom: 40px; }
	.h2h-rulehead h3 { font-size: 26px; }
	.h2h-svccard { padding: 28px 24px; flex-basis: 100%; }
	.h2h-cards3 > * { flex-basis: 100%; }
	.h2h-card, .h2h-note, .h2h-tier, .h2h-testi { padding: 24px; }
	.h2h-card--28 { padding: 24px; }
	.h2h-product { grid-template-columns: 1fr; gap: 20px; padding: 24px; }
	.h2h-product__img { width: 120px; }
	.h2h-formcard { padding: 24px 18px; }
	.h2h-formcard__h { font-size: 32px; margin-bottom: 18px; }
	.h2h-offsetpic { padding: 0 18px 18px 0; }

	.h2h-step__card { padding: 26px 22px; margin-bottom: 18px; }
	.h2h-split__copy { padding: 64px 20px; }
	.h2h-split__img { min-height: 320px !important; }
	.h2h-bigh { font-size: clamp(46px, 13vw, 56px); }

	.h2h-notsure { padding: 28px 24px; }
	.h2h-notsure .h2h-btn { width: 100%; }
	.h2h-faq summary { padding: 16px 18px; font-size: 15.5px; }
	.h2h-faq__a { padding: 16px 18px 20px; }
	.h2h-tier__badge { left: 24px; }
	.h2h-tier__name { font-size: 34px; }
	.h2h-comptable thead th, .h2h-comptable tbody th, .h2h-comptable td { padding: 11px 14px; font-size: 14px; }
	.h2h-comptable thead th { font-size: 12px; }
	.h2h-quote { padding-left: 20px; }

	/* Timeline: single column on a left rail. */
	.h2h-timeline::before { left: 17px; }
	.h2h-tl, .h2h-tl.is-right { grid-template-columns: 36px 1fr; gap: 0 14px; align-items: start; }
	.h2h-tl__dot, .h2h-tl.is-right .h2h-tl__dot { grid-column: 1; padding-top: 16px; }
	.h2h-tl__dot span { width: 28px; height: 28px; border-width: 4px; }
	.h2h-tl__card, .h2h-tl.is-right .h2h-tl__card { grid-column: 2; padding: 16px 18px; }
	.h2h-tl__head h3 { font-size: 20px; }

	.h2h-topics { grid-template-columns: 1fr 1fr; gap: 12px; }
	.h2h-topics li { padding: 20px 14px; }
	.h2h-topics li:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.h2h-calendly { min-width: 0; height: 1060px; }
	.h2h-qlist .h2h-li { padding: 10px 6px; font-size: 16px; }

	.h2h-f-grid { grid-template-columns: 1fr; }
	.h2h-input { font-size: 16px; } /* 16px stops iOS zooming into fields. */
	.h2h-intake { padding: 22px 16px; }
	.h2h-f-section { font-size: 26px; }
	.h2h-submit, .h2h-submit--intake { width: 100%; }
	.h2h-form__submit { align-items: stretch; }

	.h2h-cta__in { padding: 80px 20px 92px; }
	.h2h-cta__btns .h2h-btn { flex: 1 1 200px; }
	.h2h-footer__grid { gap: 36px; padding-left: 20px; padding-right: 20px; }
	.h2h-footer__col:nth-child(2) { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
	.h2h-footer__col:nth-child(2) > .h2h-footer__h, .h2h-footer__col:nth-child(2) > .h2h-footer__rule { grid-column: 1 / -1; }
	.h2h-compare tbody th { min-width: 148px; max-width: 148px; font-size: 13px; padding: 12px 14px; }
	.h2h-compare thead th.h2h-compare__first { padding: 16px 14px; }
	.h2h-footer__bottom-in { padding: 20px; flex-direction: column; }
	.h2h-top { right: 16px; bottom: 16px; }
}

@media (max-width: 380px) {
	.h2h-topics { grid-template-columns: 1fr; }
	.h2h-pill { padding: 9px 13px; }
}

@media (hover: none) {
	.h2h-step__card:hover, .h2h-svccard:hover, .h2h-topics li:hover, .h2h-who__card:hover { transform: none; }
}

/* ==========================================================================
   Client Payments — on-page checkout. Native Gravity Forms markup (so the
   Stripe add-on can run it) restyled to the H2H_latest handoff; h2h.js wraps
   the fields into .h2h-paystep cards and builds the Order Summary.
   ========================================================================== */
.h2h-checkout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr); gap: 28px; align-items: start; text-align: left; }
.h2h-checkout__main { min-width: 0; }
.h2h-checkout__side { position: sticky; top: 112px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.admin-bar .h2h-checkout__side { top: 144px; }
@media (max-width: 979.98px) { .h2h-checkout { grid-template-columns: minmax(0, 1fr); } .h2h-checkout__side { position: static; } }

.h2h-checkout .gform_wrapper, .h2h-checkout form { margin: 0; }
.h2h-payform .gform-footer { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } /* the summary's Pay button submits */
.h2h-payform .gform_fields { display: flex; flex-direction: column; gap: 24px; }
.h2h-payform .gfield { margin: 0; padding: 0; border: 0; min-width: 0; }
.h2h-payform .gfield_required, .h2h-payform .gform_validation_container, .h2h-payform .h2h-gf-hidden,
.h2h-payform .gfield_validation_message, .h2h-payform .validation_message, .h2h-payform .gform_hidden,
.h2h-checkout .gform_ajax_spinner, .h2h-checkout iframe[name^="gform_ajax_frame"] { display: none !important; }
.h2h-payform .hidden_label > .gfield_label, .h2h-payform .h2h-pkgs > .gfield_label, .h2h-payform .h2h-addon > .gfield_label, .h2h-payform .h2h-other > .gfield_label,
.h2h-payform .h2h-consent-terms > .gfield_label, .h2h-payform .h2h-consent-sms > .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Step cards (built by h2h.js from each Gravity Forms section). */
.h2h-paystep { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: clamp(22px, 3.4vw, 32px); display: flex; flex-direction: column; gap: 18px; box-shadow: var(--shadow); }
.h2h-paystep--open { background: none; border: 0; padding: 0; box-shadow: none; gap: 14px; }
.h2h-paystep__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.h2h-paystep__title { display: flex; align-items: baseline; gap: 14px; }
.h2h-paystep__title h2 { font-size: 26px; line-height: 1.2; }
.h2h-paystep__desc { font-size: 14px; color: #6B6A78; margin-top: -8px; }
.h2h-paystep__grid > .gsection { display: none !important; }
.h2h-payform .instruction, .h2h-payform .ginput_counter, .h2h-payform .charleft { display: none !important; }
.h2h-cards { display: flex; gap: 6px; }
.h2h-cards span { padding: 3px 7px; border: 1px solid var(--line2); border-radius: 4px; font-size: 10px; font-weight: 700; letter-spacing: .5px; color: #6B6A78; background: #fff; }
.h2h-paystep__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.h2h-paystep__grid > .gfield { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; }
.h2h-paystep__grid > .h2h-col-half { grid-column: span 3; }
.h2h-paystep__grid > .h2h-col-third { grid-column: span 2; }
@media (max-width: 520px) { .h2h-paystep__grid > .h2h-col-half, .h2h-paystep__grid > .h2h-col-third { grid-column: 1 / -1; } }
.h2h-paystep__rule { grid-column: 1 / -1; height: 1px; background: var(--line); margin: 4px 0; }
.h2h-paystep__sub { grid-column: 1 / -1; font-size: 11px; letter-spacing: 2.2px; text-transform: uppercase; font-weight: 700; color: var(--purple); margin-top: 6px; }

/* Labels + inputs (13px bold labels, design inputs). */
.h2h-payform .gfield_label, .h2h-payform .gform-field-label--type-sub { font-size: 13px; font-weight: 700; color: var(--ink); line-height: 1.6; padding: 0; }
.h2h-payform .ginput_container_name { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 16px; }
.h2h-payform .ginput_container_name > span { display: flex; flex-direction: column; gap: 6px; }
.h2h-payform input[type=text], .h2h-payform input[type=email], .h2h-payform input[type=tel], .h2h-payform input[type=number], .h2h-payform select { padding: 13px 14px; border: 1px solid var(--line2); border-radius: 8px; background: #fff; font-size: 15px; font-weight: 400; color: var(--ink); width: 100%; min-width: 0; line-height: normal; -webkit-appearance: none; appearance: none; font-family: inherit; }
.h2h-payform select { min-height: 49px; cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238C6CB4' stroke-width='1.8'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
.h2h-payform input:focus, .h2h-payform select:focus { outline: none; border-color: var(--purple); box-shadow: 0 0 0 3px rgba(140,108,180,.18); }
.h2h-payform input::placeholder { color: #9a98a6; }
.h2h-payform .gfield_error input, .h2h-payform .gfield_error select { border-color: var(--pink); }
.h2h-optional { font-weight: 400; color: #6B6A78; }

/* Step 01 — package rows. */
.h2h-payform .ginput_container_checkbox .gfield_checkbox, .h2h-payform .gfield_radio { display: flex; flex-direction: column; gap: 10px; }
.h2h-pkgs .gchoice, .h2h-addon .gchoice { position: relative; }
.h2h-pkgs .gchoice input, .h2h-addon .gchoice input, .h2h-other .gchoice input, .h2h-consent-terms .gchoice input, .h2h-consent-sms .gchoice input { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.h2h-pkgs .gchoice label { display: flex; align-items: center; gap: 14px; width: 100%; padding: 16px 18px; border-radius: 8px; border: 1.5px solid var(--line2); background: #fff; cursor: pointer; transition: all .15s; }
.h2h-pkgs .gchoice label::before, .h2h-addon .gchoice label::before, .h2h-other .gchoice label::before { content: ''; width: 20px; height: 20px; flex: none; border-radius: 4px; border: 1.5px solid #B9AFC6; background: #fff; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; transition: all .15s; }
.h2h-pkgs .gchoice input:checked + label, .h2h-other.is-on .h2h-otherbox__row { border-color: var(--purple); background: var(--lilac); }
.h2h-pkgs .gchoice input:checked + label::before, .h2h-addon .gchoice input:checked + label::before, .h2h-other .gchoice input:checked + label::before { content: '✓'; background: var(--purple); border-color: var(--purple); }
.h2h-payform .gchoice input:focus-visible + label::before { outline: 2px solid var(--purple); outline-offset: 2px; }
.h2h-pkg__name { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; color: var(--ink); }
.h2h-pkg__price { font-family: var(--serif); font-size: 20px; font-weight: 600; color: var(--ink); white-space: nowrap; }
.h2h-payform .ginput_price { display: none; }
.h2h-addon { margin: 0 0 0 28px; }
.h2h-pkgs .h2h-addon .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.h2h-addon .gchoice label { display: flex; align-items: center; gap: 14px; width: 100%; padding: 12px 16px; border-radius: 8px; border: 1.5px dashed var(--line2); background: #fff; cursor: pointer; animation: h2hDrop .2s ease-out; transition: all .15s; }
.h2h-addon .gchoice label::before { width: 18px; height: 18px; font-size: 11px; }
.h2h-addon .gchoice input:checked + label { border-color: var(--purple); background: var(--lilac); }
.h2h-addon .h2h-pkg__name { font-size: 14px; font-weight: 400; }
.h2h-addon .h2h-pkg__name strong { font-weight: 700; }
.h2h-pkg__price--addon { font-family: var(--sans); font-size: 15px; font-weight: 700; }
.h2h-save { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: #E3F4F2; color: var(--teal-d); font-size: 11px; font-weight: 700; }

/* Other: box with checkbox row + Description / Type / Amount. */
.h2h-otherbox { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; border-radius: 8px; border: 1.5px solid var(--line2); background: #fff; transition: all .15s; }
.h2h-otherbox.is-on { border-color: var(--purple); background: var(--lilac); }
.h2h-other .gchoice label { display: flex; align-items: center; gap: 14px; cursor: pointer; font-size: 15px; font-weight: 700; color: var(--ink); }
.h2h-other .gchoice label em { font-style: normal; font-weight: 400; color: #6B6A78; }
.h2h-otherbox__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; animation: h2hDrop .2s ease-out; }
.h2h-otherbox__fields[hidden] { display: none; }
.h2h-otherbox__fields > .gfield { display: flex; flex-direction: column; gap: 6px; }
.h2h-otherbox__fields > .gfield[style*="display: none"] { display: none !important; }
.h2h-seg .gfield_radio { flex-direction: row; gap: 0; border: 1px solid var(--line2); border-radius: 8px; overflow: hidden; background: #fff; }
.h2h-seg .gchoice { flex: 1; position: relative; }
.h2h-seg .gchoice input { position: absolute; opacity: 0; }
.h2h-seg .gchoice label { display: block; padding: 12px 8px; text-align: center; font-size: 13px; font-weight: 700; color: var(--ink); cursor: pointer; transition: all .15s; }
.h2h-seg .gchoice input:checked + label { background: var(--purple); color: #fff; }
.h2h-seg .gchoice input:focus-visible + label { outline: 2px solid var(--purple); outline-offset: -3px; }
.h2h-other-amt .ginput_container { display: flex; align-items: center; border: 1px solid var(--line2); border-radius: 8px; background: #fff; overflow: hidden; }
.h2h-other-amt .ginput_container:focus-within { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(140,108,180,.18); }
.h2h-other-amt input { border: none !important; background: transparent !important; padding: 13px 14px 13px 4px !important; font-weight: 600 !important; box-shadow: none !important; -moz-appearance: textfield; }
.h2h-other-amt input::-webkit-outer-spin-button, .h2h-other-amt input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.h2h-dollar { padding: 0 2px 0 14px; font-size: 16px; font-weight: 700; color: var(--purple); white-space: nowrap; flex: none; }
.h2h-dollar__minus { display: none; }
.is-discount .h2h-dollar__minus { display: inline; }

/* Step 03 — Stripe card field (Card Element). Name on Card first, as in the
   design, then Stripe's one-line number / expiry / CVC box (its text styling is
   gform_stripe_elements_style in inc/forms.php). The add-on hides the whole
   field while the total is $0. Until Stripe is live, .h2h-cardslot stands in. */
.h2h-cardslot { padding: 22px 18px; border: 1.5px dashed #D9CBE8; border-radius: 8px; background: var(--lilac); color: var(--purple); font-size: 14px; font-weight: 600; text-align: center; }
.h2h-payform .ginput_stripe_creditcard { display: flex; flex-direction: column; gap: 18px; }
.h2h-payform .ginput_stripe_creditcard > .ginput_full { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.h2h-payform .ginput_stripe_creditcard > [id$="_5_container"] { order: -1; }
.h2h-payform .StripeElement--card { padding: 12px 14px; border: 1px solid var(--line2); border-radius: 8px; background: #fff; min-height: 47px; box-sizing: border-box; transition: border-color .15s, box-shadow .15s; }
.h2h-payform .StripeElement--focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(140,108,180,.18); }
.h2h-payform .StripeElement--invalid, .h2h-payform .gfield_error .StripeElement--card { border-color: var(--pink); }
.h2h-payform .gfield--type-stripe_creditcard .validation_message { display: block !important; margin: 8px 0 0; font-size: 13px; font-weight: 600; color: #B3261E; }

/* Step 04 — consent block, same look as every other form. */
.h2h-consentbox { display: flex; flex-direction: column; gap: 14px; padding: 18px; border: 1px solid var(--line2); border-radius: 8px; background: #fff; }
.h2h-consentbox .gfield_checkbox { display: flex; flex-direction: column; gap: 14px; }
.h2h-consentbox .h2h-consent-sms .gfield_checkbox { padding-left: 16px; border-left: 2px solid #EDE6F5; }
.h2h-consentbox .gchoice { position: relative; }
.h2h-consentbox .gchoice label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; font-size: 13px; line-height: 1.55; color: var(--text); font-weight: 400; }
.h2h-consentbox .gchoice label::before { content: ''; width: 20px; height: 20px; flex: none; margin-top: 1px; border-radius: 4px; border: 1.5px solid #B9AFC6; background: #fff; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; transition: all .15s; }
.h2h-consentbox .gchoice input:checked + label::before { content: '✓'; background: var(--purple); border-color: var(--purple); }
.h2h-consentbox .gchoice label strong { color: var(--ink); }
.h2h-consentbox .gchoice label a { color: var(--purple); font-weight: 700; }
.h2h-consentbox .gfield_error .gchoice label::before { border-color: var(--pink); }

/* Order Summary. */
.h2h-sumcard { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: clamp(22px, 3.4vw, 32px); display: flex; flex-direction: column; gap: 16px; box-shadow: var(--shadow); }
.h2h-sumcard h2 { font-size: 26px; }
.h2h-sumcard__empty { font-size: 14px; color: #6B6A78; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.h2h-sumcard__empty[hidden], .h2h-sumcard__lines[hidden] { display: none; }
.h2h-sumcard__lines { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.h2h-sumline { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid #F3EEF8; font-size: 14px; animation: h2hDrop .2s ease-out; }
.h2h-sumline span { color: var(--ink); min-width: 0; }
.h2h-sumline small { display: block; font-size: 12px; color: #6B6A78; }
.h2h-sumline b { font-weight: 700; color: var(--ink); white-space: nowrap; }
.h2h-sumline b.is-neg { color: var(--teal-d); }
.h2h-sumcard__fee { display: flex; justify-content: space-between; font-size: 13px; color: #6B6A78; }
.h2h-sumcard__fee span:last-child { color: var(--teal-d); font-weight: 700; }
.h2h-sumcard__total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 14px; border-top: 1px solid var(--line); }
.h2h-sumcard__total span:first-child { font-weight: 700; color: var(--ink); }
.h2h-sumcard__total span:last-child { font-family: var(--serif); font-size: 34px; font-weight: 600; color: var(--ink); line-height: 1; }
.h2h-sumcard .gform_validation_errors { padding: 12px 14px; border-radius: 6px; background: #FBE4EE; color: #9B2F5E; font-size: 14px; line-height: 1.5; margin: 0; }
.h2h-sumcard .gform_validation_errors:focus { outline: none; }
.h2h-sumcard .gform_validation_errors ol { display: none; }
.h2h-payerr { margin: 0; }
.h2h-paybtn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 17px 24px; border-radius: 3px; border: none; background: var(--pink); color: #fff; font-family: inherit; font-weight: 700; font-size: 12.5px; letter-spacing: 2px; text-transform: uppercase; line-height: 1.6; cursor: pointer; box-shadow: 0 12px 30px rgba(216,97,143,.28); transition: all .25s; }
.h2h-paybtn:hover { background: var(--pink-d); transform: translateY(-2px); }
.h2h-paybtn[disabled] { background: #E7C9D8; box-shadow: none; cursor: not-allowed; transform: none; }
.h2h-paybtn.is-busy { opacity: .7; cursor: wait; }
.h2h-sumcard__off { margin-top: -6px; font-size: 13px; line-height: 1.5; color: #9B2F5E; text-align: center; }
.h2h-sumcard__off a { color: inherit; font-weight: 700; text-decoration: underline; }
.h2h-paycard__stripe { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 12px; color: #6b6a78; margin: 0; }
.h2h-paycard__stripe svg { flex: none; }
.h2h-paycard__stripe strong { color: #635BFF; font-weight: 700; }
.h2h-sumcard__receipt { font-size: 12px; line-height: 1.55; color: #6B6A78; text-align: center; }
.h2h-sumcard__note { font-size: 13px; color: #6B6A78; text-align: center; }

/* Receipt (Gravity Forms confirmation after a successful payment). */
.h2h-checkout.is-done { grid-template-columns: minmax(0, 1fr); }
.h2h-checkout.is-done .h2h-checkout__side { display: none; }
.h2h-checkout .gform_confirmation_message { margin: 0; }
.h2h-rcpt { max-width: 720px; width: 100%; margin: 0 auto; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: clamp(22px, 3.4vw, 32px); display: flex; flex-direction: column; gap: 22px; box-shadow: var(--shadow); animation: h2hFade .3s; font-size: 14px; line-height: 1.6; }
.h2h-rcpt__head { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.h2h-rcpt__head h2 { font-size: 34px; }
.h2h-rcpt__head p { font-size: 15px; }
.h2h-rcpt__brand { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.h2h-rcpt__brand img { height: 52px; width: auto; }
.h2h-rcpt__no { display: flex; flex-direction: column; text-align: right; font-size: 13px; }
.h2h-rcpt__no strong, .h2h-rcpt__grid strong { color: var(--ink); }
.h2h-rcpt__k { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; color: var(--purple); margin-bottom: 4px; }
.h2h-rcpt__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 18px; }
.h2h-rcpt__grid > div { display: flex; flex-direction: column; }
.h2h-rcpt__table { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.h2h-rcpt__line { display: flex; justify-content: space-between; gap: 16px; padding: 12px 16px; border-bottom: 1px solid #F3EEF8; }
.h2h-rcpt__line span { color: var(--ink); }
.h2h-rcpt__line small { display: block; font-size: 12px; color: #6B6A78; }
.h2h-rcpt__line b { font-weight: 700; color: var(--ink); white-space: nowrap; }
.h2h-rcpt__line b.is-neg { color: var(--teal-d); }
.h2h-rcpt__line--fee { font-size: 13px; }
.h2h-rcpt__line--fee span { color: #6B6A78; }
.h2h-rcpt__line--total { background: var(--lilac); border-bottom: 0; padding: 16px; }
.h2h-rcpt__line--total span { font-weight: 700; }
.h2h-rcpt__line--total b { font-family: var(--serif); font-size: 24px; font-weight: 600; }
.h2h-rcpt__consent { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 6px; background: var(--cream); font-size: 13px; }
.h2h-rcpt__consent > div { display: flex; gap: 10px; align-items: flex-start; }
.h2h-rcpt__tick { width: 18px; height: 18px; flex: none; border-radius: 4px; background: var(--purple); color: #fff; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; margin-top: 2px; }
.h2h-rcpt__consent a { color: var(--purple); font-weight: 700; }
.h2h-rcpt__sms { color: #6B6A78; }
.h2h-rcpt__sms > span:first-child { width: 18px; flex: none; text-align: center; }
.h2h-rcpt__help { font-size: 13px; color: #6B6A78; text-align: center; }
.h2h-consentbox__h { font-size: 13px; font-weight: 700; color: var(--ink); }

/* ==========================================================================
   Legal pages (Terms / Privacy) — H2H_UPDATES handoff
   ========================================================================== */
.h2h-legal__head { display: flex; flex-direction: column; gap: 12px; max-width: 760px; }
.h2h-legal__head h1 { font-weight: 500; color: var(--ink); font-size: clamp(39px, 4.5vw, 56px); line-height: 1.05; }
.h2h-legal__date { font-size: 15px; color: #6B6A78; }
.h2h-legal__grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; align-items: start; }
.h2h-legal__grid--solo { grid-template-columns: minmax(0, 1fr); }
.h2h-legal__toc { position: sticky; top: 120px; display: flex; flex-direction: column; padding: 22px 24px; background: #fff; border: 1px solid var(--line); border-radius: 8px; max-height: calc(100vh - 160px); overflow: auto; }
.admin-bar .h2h-legal__toc { top: 152px; }
.h2h-legal__toc-h { font-size: 11px; letter-spacing: 2.2px; text-transform: uppercase; font-weight: 700; color: var(--purple); margin-bottom: 8px; }
.h2h-legal__toc a { display: block; padding: 6px 0; font-size: 14px; line-height: 1.4; color: var(--text); transition: color .2s; }
.h2h-legal__toc a:hover, .h2h-legal__toc a.is-current { color: var(--pink); }
.h2h-legal__doc { display: flex; flex-direction: column; gap: 16px; min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: clamp(24px, 4vw, 56px); color: var(--text); }
.h2h-legal__doc p { font-size: 16px; line-height: 1.8; }
.h2h-legal__doc strong { color: var(--ink); }
.h2h-legal__doc a { color: var(--purple); font-weight: 700; }
.h2h-legal__doc a:hover { color: var(--pink); }
.h2h-legal__doc h2 { font-size: clamp(24px, 2.4vw, 30px); line-height: 1.2; margin-top: 22px; padding-top: 30px; border-top: 1px solid var(--line); scroll-margin-top: 110px; }
.h2h-legal__doc ul { margin: 0; padding-left: 22px; list-style: disc; display: flex; flex-direction: column; gap: 8px; }
.h2h-legal__doc li { font-size: 16px; line-height: 1.75; padding-left: 4px; }
.h2h-legal__address { font-style: normal; display: flex; flex-direction: column; gap: 4px; padding: 20px 22px; border-radius: 6px; background: var(--lilac); font-size: 16px; line-height: 1.6; }
@media (max-width: 979.98px) { .h2h-legal__grid { grid-template-columns: minmax(0, 1fr); } .h2h-legal__toc { display: none; } }