.reforma-home-hero{position:relative;overflow:hidden}.reforma-home-hero-botanical img{max-width:380px;height:auto;margin:0 auto;display:block;opacity:.95}.reforma-home-hero-title{max-width:920px;margin-left:auto!important;margin-right:auto!important}.reforma-eyebrow{display:inline-block}.reforma-section-title{max-width:880px;margin-left:auto!important;margin-right:auto!important}.reforma-section-lede{max-width:680px;margin-left:auto!important;margin-right:auto!important}.reforma-treatment-grid{width:100%}.reforma-treatment-card{background:oklch(100% 0 0);box-shadow:0 1px 3px oklch(0% 0 0 / .06),0 8px 24px oklch(0% 0 0 / .04);transition:transform 220ms cubic-bezier(.22,1,.36,1),box-shadow 220ms cubic-bezier(.22,1,.36,1)}.reforma-treatment-card:hover{transform:translateY(-3px);box-shadow:0 4px 8px oklch(0% 0 0 / .08),0 16px 36px oklch(0% 0 0 / .08)}.reforma-treatment-card-image{overflow:hidden}.reforma-treatment-card-image img{transition:transform 600ms cubic-bezier(.22,1,.36,1)}.reforma-treatment-card:hover .reforma-treatment-card-image img{transform:scale(1.04)}.reforma-home-art img{border-radius:0;width:100%;height:auto;display:block}.reforma-physician-grid{width:100%}.reforma-physician-card{box-shadow:0 1px 3px oklch(0% 0 0 / .06),0 8px 24px oklch(0% 0 0 / .04);transition:transform 220ms cubic-bezier(.22,1,.36,1)}.reforma-physician-card:hover{transform:translateY(-3px)}.reforma-product-grid{width:100%}.reforma-product-card .wp-block-image{transition:transform 220ms cubic-bezier(.22,1,.36,1)}.reforma-product-card:hover .wp-block-image{transform:translateY(-3px)}.reforma-testimonial-grid{width:100%}.reforma-testimonial-card{box-shadow:0 1px 3px oklch(0% 0 0 / .04),0 8px 24px oklch(0% 0 0 / .03)}.reforma-testimonial-quote::before{content:"";display:block;width:32px;height:4px;background:oklch(58.4% .093 78);margin-bottom:var(--wp--preset--spacing--30)}.reforma-article-grid{width:100%}.reforma-article-card{box-shadow:0 1px 3px oklch(0% 0 0 / .06),0 8px 24px oklch(0% 0 0 / .04);transition:transform 220ms cubic-bezier(.22,1,.36,1)}.reforma-article-card:hover{transform:translateY(-3px)}.reforma-article-card .wp-block-image{overflow:hidden}.reforma-article-card .wp-block-image img{transition:transform 600ms cubic-bezier(.22,1,.36,1)}.reforma-article-card:hover .wp-block-image img{transform:scale(1.04)}.reforma-home-footer-cta{position:relative}.reforma-home-footer-cta a:not(.wp-block-button__link){color:oklch(78.5% .163 72)}.reforma-book-appointment-btn .wp-block-button__link{transition:background-color 200ms ease,transform 200ms ease}.reforma-book-appointment-btn .wp-block-button__link:hover{background-color:oklch(59.5% .091 79)!important;transform:translateY(-1px)}.reforma-primary-nav .wp-block-navigation-item__content{position:relative;padding-bottom:4px;transition:color 180ms ease}.reforma-primary-nav .wp-block-navigation-item__content::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:oklch(58.4% .093 78);transform:scaleX(0);transform-origin:left center;transition:transform 200ms ease}.reforma-primary-nav .wp-block-navigation-item__content:hover::after,.reforma-primary-nav .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content::after{transform:scaleX(1)}.reforma-site-footer a{color:oklch(100% 0 0 / .85);text-decoration:none;transition:color 180ms ease}.reforma-site-footer a:hover{color:oklch(78.5% .163 72)}.reforma-site-footer .reforma-footer-tagline{color:oklch(100% 0 0 / .85)}@media (max-width:899px){.reforma-treatment-grid,.reforma-physician-grid,.reforma-testimonial-grid,.reforma-article-grid{grid-template-columns:1fr!important}.reforma-product-grid{grid-template-columns:repeat(2,1fr)!important}.reforma-home-hero-title{font-size:clamp(2.2rem, 8vw, 3rem)!important}.reforma-section-title{font-size:clamp(1.8rem, 6vw, 2.5rem)!important}.reforma-home-hero-botanical img{max-width:240px}}@media (max-width:599px){.reforma-product-grid{grid-template-columns:1fr!important}}.reforma-home-hero{position:relative;background:#fff0e6!important;overflow:hidden;padding:clamp(120px, 14vw, 180px) 0 80px}.reforma-hero-watermark{position:absolute;inset:0;background-image:none;background-size:200px auto;background-repeat:space;opacity:.08;pointer-events:none;z-index:0;filter:hue-rotate(0deg)}.reforma-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;max-width:1440px;margin:0 auto;padding:0 74px}.reforma-hero-left{position:relative;z-index:2}.reforma-hero-eyebrow{font-family:'Fraunces','Playfair Display',Georgia,serif;font-weight:600;font-size:22px;letter-spacing:.04em;color:#9b7535;margin:0 0 32px}.reforma-hero-title{font-family:'Fraunces','Playfair Display',Georgia,serif;font-weight:700;font-size:clamp(56px, 7vw, 108px);line-height:1.02;letter-spacing:-.015em;color:#2a1c20;margin:0 0 32px}.reforma-hero-lede{font-family:'Poppins',sans-serif;font-size:16px;line-height:1.7;color:rgb(62 39 59 / .78);margin:0 0 48px;max-width:460px}.reforma-hero-ctas{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:64px}.reforma-cta{display:inline-flex;align-items:center;gap:10px;text-decoration:none!important;font-family:'Fraunces','Playfair Display',Georgia,serif;font-weight:600;font-size:17px;padding:18px 36px;border-radius:0 24px 0 0;transition:transform 200ms ease,background 200ms ease}.reforma-cta--primary{background:linear-gradient(180deg,#a07c42 0%,#825a14 100%);color:#ffffff!important}.reforma-cta--primary:hover{transform:translateY(-1px)}.reforma-cta--outline{background:#fff0;color:#a07c42!important;border:1px solid rgb(160 124 66 / .55);letter-spacing:.08em}.reforma-cta--outline:hover{background:rgb(160 124 66 / .08)}.reforma-hero-socials{list-style:none;margin:0;padding:0;display:flex;gap:12px}.reforma-hero-socials a{width:44px;height:44px;border-radius:8px;border:1px solid rgb(62 39 59 / .25);color:#3e273b;display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important;transition:background 180ms ease,color 180ms ease}.reforma-hero-socials a:hover{background:#a07c42;border-color:#a07c42;color:#fff}.reforma-hero-right{position:relative;height:clamp(540px, 50vw, 760px)}.reforma-hero-hand-flower{position:absolute;left:-140px;top:30%;width:clamp(280px, 26vw, 380px);height:auto;z-index:2;pointer-events:none;transform:rotate(-8deg)}.reforma-hero-arches{position:absolute;top:0;right:-40px;display:flex;gap:12px;height:100%;z-index:1}.reforma-hero-arch{position:relative;width:clamp(220px, 22vw, 320px);height:100%;border-radius:50% / 30%;border:2px solid rgb(160 124 66 / .4);overflow:hidden;background:#fff0e6}.reforma-hero-arch--right{margin-top:40px}.reforma-hero-arch-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0}.reforma-hero-arch-person{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100%;height:88%;object-fit:cover;object-position:top center;z-index:1}@media (max-width:1023px){.reforma-hero-grid{grid-template-columns:1fr;gap:48px;padding:0 32px}.reforma-hero-right{height:480px}.reforma-hero-hand-flower{left:-40px;width:220px;top:10%}.reforma-hero-arches{right:0}.reforma-hero-arch{width:clamp(160px, 38vw, 240px)}}@media (max-width:599px){.reforma-hero-title{font-size:clamp(40px, 11vw, 56px)}.reforma-hero-right{height:380px}.reforma-hero-arch{width:140px}.reforma-hero-hand-flower{width:160px;left:-20px}}
/* =========================================================================
   v2.8.5 — HERO REBUILD (exact Figma geometry + reveal bird backdrop + responsive)
   Replaces all prior .reforma-home-hero inline styling. Class-based + responsive.
   ========================================================================= */
.reforma-home-hero{
	position:relative;
	background:#fff0e6;
	overflow:hidden;
	padding:140px 0 90px;          /* top clears the transparent sticky header */
	isolation:isolate;
}
.reforma-home-hero .reforma-hero-watermark{
	position:absolute;inset:-8%;
	background-repeat:repeat;
	background-size:440px 96px;
	background-position:center;
	opacity:0.08;
	transform:rotate(-8deg) scale(1.4);
	transform-origin:center center;
	pointer-events:none;z-index:0;
}
.reforma-home-hero .reforma-hero-grid{
	position:relative;z-index:1;
	display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;
	max-width:1440px;margin:0 auto;padding:0 74px;
}
/* Figma text column left edge = page x74 (eyebrow/title). padding 80->74 lands x74.
   align-items:center leaves the whole block ~6px low (eyebrow y162 vs Figma y156);
   translateY lifts the column without disturbing the absolutely-placed cluster. */
.reforma-home-hero .reforma-hero-left{position:relative;z-index:2;transform:translateY(-6px);}
.reforma-home-hero .reforma-hero-eyebrow{
	font-family:'Fraunces','Playfair Display',Georgia,serif;font-weight:600;font-size:22px;
	letter-spacing:0.04em;color:#9b7535;margin:0 0 28px;
}
.reforma-home-hero .reforma-hero-title{
	font-family:'Fraunces','Playfair Display',Georgia,serif;font-weight:600;
	font-size:clamp(40px,4.55vw,64px);line-height:1.2;letter-spacing:-0.015em;
	color:#2a1c20;margin:0 0 30px;
}
.reforma-home-hero .reforma-hero-sub{
	font-family:Poppins,sans-serif;font-size:16px;line-height:1.7;
	color:rgba(62,39,59,0.78);margin:0 0 44px;max-width:460px;
}
.reforma-home-hero .reforma-hero-cta-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:56px;}
.reforma-home-hero .reforma-hero-btn{
	display:inline-flex;align-items:center;gap:10px;text-decoration:none;
	font-family:'Fraunces','Playfair Display',Georgia,serif;font-weight:600;font-size:17px;
	padding:18px 34px;border-radius:0 22px 0 22px;     /* Figma notched pill */
	transition:transform .2s ease,box-shadow .2s ease;
}
.reforma-home-hero .reforma-hero-btn--primary{
	background:linear-gradient(180deg,#a07c42 0%,#825a14 100%);color:#fff;
}
.reforma-home-hero .reforma-hero-btn--primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(130,90,20,0.28);}
.reforma-home-hero .reforma-hero-btn--ghost{
	background:transparent;color:#9C783A;border:1px solid #9C783A;
	font-size:14px;letter-spacing:0.16em;text-transform:uppercase;
}
.reforma-home-hero .reforma-hero-btn--ghost:hover{background:rgba(160,124,66,0.08);}
.reforma-home-hero .reforma-hero-socials{list-style:none;margin:0;padding:0;display:flex;gap:16px;}
.reforma-home-hero .reforma-hero-socials li{margin:0;}
.reforma-home-hero .reforma-hero-socials a{
	width:52px;height:52px;border-radius:0;border:1px solid #9C783A;
	color:#3e273b;display:inline-flex;align-items:center;justify-content:center;
	text-decoration:none;background:#ffffff;transition:border-color .2s,color .2s;
}
.reforma-home-hero .reforma-hero-socials a:hover{border-color:#a07c42;color:#a07c42;}

/* RIGHT column — arches + decorations */
.reforma-home-hero .reforma-hero-right{position:relative;min-height:620px;}
.reforma-home-hero .reforma-hero-arches{
	position:absolute;top:50%;right:0;transform:translateY(-50%);
	display:flex;gap:14px;z-index:2;
}
.reforma-home-hero .reforma-arch{
	position:relative;width:300px;height:560px;background:#fff;
	border:1px solid #9c783a;overflow:hidden;flex-shrink:0;
	box-shadow:inset 0 0 0 4px #fff, inset 0 0 0 7px #9c783a;
}
.reforma-home-hero .reforma-arch--left{border-radius:500px 500px 0 495px;}      /* sharp bottom-right (inner) */
.reforma-home-hero .reforma-arch--right{border-radius:500px 500px 495px 0;}     /* mirror: sharp bottom-left (inner) */
.reforma-home-hero .reforma-arch-bg{
	position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
	object-position:center;z-index:0;
}
.reforma-home-hero .reforma-arch-photo{
	position:absolute;bottom:0;left:50%;transform:translateX(-50%);
	width:94%;height:80%;object-fit:cover;z-index:1;
}
.reforma-home-hero .reforma-arch-photo--left{object-position:28% center;transform:translateX(-50%) scaleX(-1);}
.reforma-home-hero .reforma-arch-photo--right{object-position:54% top;}

.reforma-home-hero .reforma-hero-hand{
	position:absolute;left:-150px;top:60px;width:440px;height:auto;
	z-index:3;pointer-events:none;
}
.reforma-home-hero .reforma-hero-butterfly{
	position:absolute;right:-70px;top:-30px;width:230px;height:auto;
	z-index:4;pointer-events:none;
}

/* ── TABLET (≤1024px) ───────────────────────────────────────────── */
@media (max-width:1024px){
	.reforma-home-hero{padding:130px 0 70px;}
	.reforma-home-hero .reforma-hero-grid{gap:28px;padding:0 40px;}
	.reforma-home-hero .reforma-hero-title{font-size:clamp(42px,6vw,72px);}
	.reforma-home-hero .reforma-hero-right{min-height:500px;}
	.reforma-home-hero .reforma-arch{width:230px;height:440px;}
	.reforma-home-hero .reforma-hero-hand{width:320px;left:-90px;top:50px;}
	.reforma-home-hero .reforma-hero-butterfly{width:170px;right:-30px;}}

/* ── MOBILE (≤768px) — stack: text on top, arches centered below ── */
@media (max-width:768px){
	.reforma-home-hero{padding:120px 0 60px;overflow:hidden;}
	.reforma-home-hero .reforma-hero-grid{grid-template-columns:1fr;gap:48px;padding:0 24px;}
	.reforma-home-hero .reforma-hero-left{text-align:left;}
	.reforma-home-hero .reforma-hero-title{font-size:clamp(40px,11vw,60px);}
	.reforma-home-hero .reforma-hero-sub{max-width:none;}
	.reforma-home-hero .reforma-hero-right{min-height:480px;}
	.reforma-home-hero .reforma-hero-arches{
		position:relative;top:auto;right:auto;transform:none;
		justify-content:center;
	}
	.reforma-home-hero .reforma-arch{width:clamp(140px,42vw,220px);height:auto;aspect-ratio:300/560;}
	.reforma-home-hero .reforma-hero-hand{width:200px;left:-30px;top:0;opacity:0.9;}
	.reforma-home-hero .reforma-hero-butterfly{width:120px;right:0;top:-10px;}}

/* ── SMALL MOBILE (≤480px) ──────────────────────────────────────── */
@media (max-width:480px){
	.reforma-home-hero .reforma-hero-cta-row{flex-direction:column;align-items:flex-start;}
	.reforma-home-hero .reforma-hero-btn{width:100%;max-width:320px;justify-content:center;}
	.reforma-home-hero .reforma-arch{width:clamp(130px,44vw,180px);}
	.reforma-home-hero .reforma-hero-arches{gap:8px;}
	.reforma-home-hero .reforma-hero-hand{display:none;}     /* declutter on tiny screens */
}

/* v2.8.6 — mobile hero button fit + spacing polish */
@media (max-width:768px){
	.reforma-home-hero{padding-top:128px;}
	.reforma-home-hero .reforma-hero-cta-row{width:100%;max-width:100%;}
	.reforma-home-hero .reforma-hero-btn{
		box-sizing:border-box;width:100%;max-width:100%;
		padding:16px 22px;font-size:15px;justify-content:center;
	}
	.reforma-home-hero .reforma-hero-eyebrow{margin-top:0;}}
@media (max-width:480px){
	.reforma-home-hero .reforma-hero-btn{max-width:100%;}}

/* v2.8.7 — beat the original `body.home ... .reforma-home-hero{padding-top:0!important}`.
   Header is sticky+in-flow+transparent over a peach body, so the hero needs its own
   modest top padding for breathing room (eyebrow was clipping under the header). */
body.home main#reforma-main > .reforma-home-hero,
body.home .reforma-home-hero,
.reforma-home-hero{ padding-top:64px !important; }
@media (max-width:1024px){ body.home main#reforma-main > .reforma-home-hero, .reforma-home-hero{ padding-top:52px !important; }}
@media (max-width:768px){ body.home main#reforma-main > .reforma-home-hero, .reforma-home-hero{ padding-top:44px !important; }}

/* =========================================================================
   v2.9.2 — HERO arches rebuilt to EXACT Figma geometry (Group 126).
   Figma frame 1233 wide; scaled x1.168 to the 1440 canvas.
   LEFT arch (Group 96) on TOP; RIGHT arch (Group 95) behind, +238/+26 (x1.168),
   overlapping 42px. BOTH radius 500 500 0 495 (identical, NOT mirrored).
   Butterfly 335w, hand-flower from the left.
   ========================================================================= */
.reforma-home-hero .reforma-hero-right{ position:relative; min-height:560px; }

/* arch composition box (Figma Group 97 518x439 -> x1.168 = 605x513), right-aligned */
.reforma-home-hero .reforma-hero-arches{
	position:absolute; top:50%; right:0; transform:translateY(-50%);
	width:605px; height:513px; display:block; gap:0;
}
.reforma-home-hero .reforma-arch{
	position:absolute; width:327px; height:482px;
	background:#fff; border:1px solid #9c783a; overflow:hidden;
	box-shadow:none;
}
/* LEFT arch (Group 96): at (0,0), ON TOP */
.reforma-home-hero .reforma-arch--left{
	left:0; top:0; z-index:2;
	border-radius:500px 500px 0 495px !important;
}
/* RIGHT arch (Group 95): +238x1.168=278 right, +26x1.168=30 down, BEHIND */
.reforma-home-hero .reforma-arch--right{
	left:278px; top:30px; z-index:1;
	border-radius:500px 500px 0 495px !important;
}
.reforma-home-hero .reforma-arch-bg{
	position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0;
}
.reforma-home-hero .reforma-arch-photo{
	position:absolute; bottom:0; left:50%; transform:translateX(-50%);
	width:96%; height:82%; object-fit:cover; z-index:1;
}
.reforma-home-hero .reforma-arch-photo--left{ object-position:28% center; transform:translateX(-50%) scaleX(-1); }
.reforma-home-hero .reforma-arch-photo--right{ object-position:54% top; }

/* Butterfly (Figma [898,175] 335x187 -> rel to composition: x317,y-70, x1.168) top-right */
.reforma-home-hero .reforma-hero-butterfly{
	position:absolute; left:370px; top:-82px; width:391px; height:auto; z-index:4; pointer-events:none;
}
/* Hand-with-tulip reaches in from the left toward the arches */
.reforma-home-hero .reforma-hero-hand{
	position:absolute; left:-150px; top:70px; width:460px; height:auto; z-index:3; pointer-events:none;
}

/* ---- TABLET (<=1024) scale the composition down ---- */
@media (max-width:1024px){
	.reforma-home-hero .reforma-hero-right{ min-height:470px; }
	.reforma-home-hero .reforma-hero-arches{ width:480px; height:420px; transform:translateY(-50%) scale(0.82); transform-origin:right center; }
	.reforma-home-hero .reforma-hero-butterfly{ left:300px; top:-60px; width:300px; }
	.reforma-home-hero .reforma-hero-hand{ width:330px; left:-80px; }}
/* ---- MOBILE (<=768) stack: composition centered below text ---- */
@media (max-width:768px){
	.reforma-home-hero .reforma-hero-right{ min-height:420px; }
	.reforma-home-hero .reforma-hero-arches{
		position:relative; top:auto; right:auto; left:50%;
		transform:translateX(-50%) scale(0.66); transform-origin:top center; margin:0 auto;
	}
	.reforma-home-hero .reforma-hero-butterfly{ width:200px; left:auto; right:-10px; top:-20px; }
	.reforma-home-hero .reforma-hero-hand{ width:170px; left:-20px; top:20px; opacity:0.9; }}
@media (max-width:480px){
	.reforma-home-hero .reforma-hero-arches{ transform:translateX(-50%) scale(0.5); }
	.reforma-home-hero .reforma-hero-hand{ display:none; }}

/* v2.9.3 — mobile fixes: (1) Book Appointment collapses to a real 44px gold circle
   (match desktop rule specificity so it actually wins); (2) hero arches use REAL
   small px on mobile (transform:scale kept 605px layout width → horizontal overflow). */

/* (1) mobile gold circle — same specificity as the v2.9.1 desktop gold rule */
@media (max-width:900px){
	body.home .reforma-site-header:not(.is-scrolled) .reforma-header-actions .reforma-header-cta-link,
	.reforma-site-header.is-scrolled .reforma-header-actions .reforma-header-cta-link,
	.reforma-site-header .reforma-header-actions .reforma-header-cta-link{
		width:46px !important; height:46px !important; border-radius:50% !important;
		padding:0 !important; justify-content:center !important; font-size:0 !important;
	}
	.reforma-site-header .reforma-header-actions .reforma-header-cta-link svg{ width:18px;height:18px;margin:0; }}

/* (2) hero arches: real px on mobile (no transform-scale layout bug) */
@media (max-width:768px){
	.reforma-home-hero .reforma-hero-right{ min-height:360px; }
	.reforma-home-hero .reforma-hero-arches{
		position:relative; top:auto; right:auto; left:50%;
		transform:translateX(-50%); transform-origin:center;
		width:330px !important; height:300px !important; margin:0 auto;
	}
	.reforma-home-hero .reforma-arch{ width:196px !important; height:290px !important; }
	.reforma-home-hero .reforma-arch--left{ left:0; top:0; }
	.reforma-home-hero .reforma-arch--right{ left:134px !important; top:14px !important; }
	.reforma-home-hero .reforma-hero-butterfly{ width:150px !important; left:auto !important; right:-6px !important; top:-14px !important; }
	.reforma-home-hero .reforma-hero-hand{ width:150px !important; left:-18px !important; top:18px !important; opacity:0.9; }}
@media (max-width:480px){
	.reforma-home-hero .reforma-hero-arches{ width:300px !important; height:270px !important; }
	.reforma-home-hero .reforma-arch{ width:176px !important; height:260px !important; }
	.reforma-home-hero .reforma-arch--right{ left:120px !important; }
	.reforma-home-hero .reforma-hero-hand{ display:none; }}

/* =========================================================================
   v2.10.5 — LEFT arch 180° rotation fix (Figma Group 96 rotation:π).
   The left arch must be rotated 180° to produce the "DD"/egg layout.
   Both arches keep identical radius (500 500 0 495) — the shape difference
   comes entirely from the rotation, not from mirroring the radius values.
   Inner photo is counter-rotated and repositioned so it reads upright at
   the visual bottom of the arch after the parent's 180° flip.
   ========================================================================= */

/* Rotate left arch 180° — creates the left "D" of the egg layout */
.reforma-home-hero .reforma-arch--left{
	transform:rotate(180deg) !important;
}

/* Counter-rotate left arch photo so the woman reads upright.
   After parent rotate(180deg), DOM top:0 = visual bottom.
   Use left:0/right:0/margin:auto to center without translateX (avoids
   axis-reversal confusion). rotate(180deg) on the photo cancels the
   parent's flip, rendering the woman right-side up. */
.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
	bottom:auto !important;
	top:0 !important;
	left:0 !important;
	right:0 !important;
	margin:0 auto !important;
	transform:rotate(180deg) !important;
	transform-origin:center center !important;
	object-position:28% center !important;
}

/* Mobile (≤768) — same photo fixes at real-px sizes */
@media (max-width:768px){
	.reforma-home-hero .reforma-arch--left{
		transform:rotate(180deg) !important;
	}
	.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
		bottom:auto !important;
		top:0 !important;
		left:0 !important;
		right:0 !important;
		margin:0 auto !important;
		transform:rotate(180deg) !important;
		transform-origin:center center !important;
	}}
@media (max-width:480px){
	.reforma-home-hero .reforma-arch--left{
		transform:rotate(180deg) !important;
	}}

/* =========================================================================
   v2.10.8 — Hero pixel-polish: bird crop, butterfly, hand, bg #fff0e6
   Arch scale = 327/280 = 1.1679 (Figma Group 126 at 1440)
   ========================================================================= */

/* 1. PEACH BG — explicit reinforcement (already in v2.8.5 but belt + suspenders) */
.reforma-home-hero,
body .reforma-home-hero,
body.home .reforma-home-hero{
	background:#fff0e6 !important;
}

/* 2. RIGHT ARCH bird backdrop — exact Figma crop
   Figma: image 1324×739, offset (-231,-161) inside 280×413 arch
   CSS scale (327/280=1.1679): img 1547×863px; pos -270 -188
   Switch arch-bg from object-fit:cover to absolute-positioned crop */
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
	position:absolute !important;
	width:1547px !important;
	height:863px !important;
	max-width:none !important;
	object-fit:none !important;
	object-position:unset !important;
	top:-188px !important;
	left:-270px !important;
	transform:scale(0.9) !important;
	z-index:0;
}

/* 3. LEFT ARCH bird backdrop — same image, Figma local offset (-911,-252) in rotated frame
   At scale (x1.1679): left:-1064px; top:-294px (local coords inside rotate(180deg) div)
   Background shows the complementary orange-bird region of the same jungle image */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
	position:absolute !important;
	width:1547px !important;
	height:863px !important;
	max-width:none !important;
	object-fit:none !important;
	object-position:unset !important;
	top:-294px !important;
	left:-1064px !important;
	transform:scale(0.9) !important;
	z-index:0;
}

/* 4. BUTTERFLY — Figma 335×187 at scale 1.168 → 391×218px
   Frame pos (898,175) relative to 1233-wide frame.
   Hero right-column: position top-right, overlapping arch upper-right.
   Absolute from .reforma-hero-right; right edge near arch right edge. */
.reforma-home-hero .reforma-hero-butterfly{
	position:absolute !important;
	width:391px !important;
	height:auto !important;
	right:-60px !important;
	top:-8px !important;
	left:auto !important;
	z-index:6 !important;
	pointer-events:none;
}

/* 5. HAND-WITH-TULIP — Figma node "10 1", 1030×862, rotated -22.4°
   Scale to displayed size relative to hero right col (min-height:560px hero-right).
   Figma composition: 1030px wide at 1.0 scale on the 1233 frame → ~836px displayed.
   Anchored top-left, entering from the left of the right column. */
.reforma-home-hero .reforma-hero-hand{
	position:absolute !important;
	width:836px !important;
	height:auto !important;
	left:-280px !important;
	top:-60px !important;
	transform:rotate(-22.4deg) !important;
	transform-origin:bottom right !important;
	z-index:3 !important;
	pointer-events:none;
}

/* Tablet adjustments (≤1024px) */
@media (max-width:1024px){
	.reforma-home-hero .reforma-arch--right .reforma-arch-bg,
	.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
		width:1200px !important;
		height:669px !important;
	}
	.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
		top:-146px !important;
		left:-210px !important;
	}
	.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
		top:-228px !important;
		left:-824px !important;
	}
	.reforma-home-hero .reforma-hero-butterfly{
		width:280px !important;
		right:-20px !important;
		top:-4px !important;
	}
	.reforma-home-hero .reforma-hero-hand{
		width:580px !important;
		left:-200px !important;
		top:-40px !important;
	}}

/* Mobile (≤768px) — scale down proportionally, keep hand visible at real-px */
@media (max-width:768px){
	.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
		width:700px !important; height:391px !important;
		top:-85px !important; left:-122px !important;
	}
	.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
		width:700px !important; height:391px !important;
		top:-130px !important; left:-480px !important;
	}
	.reforma-home-hero .reforma-hero-butterfly{
		width:160px !important;
		right:0 !important;
		top:-8px !important;
	}
	.reforma-home-hero .reforma-hero-hand{
		width:300px !important;
		left:-80px !important;
		top:0 !important;
		transform:rotate(-22.4deg) !important;
		transform-origin:bottom right !important;
		opacity:0.9;
	}}

/* Small mobile (≤480px) */
@media (max-width:480px){
	.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
		width:560px !important; height:313px !important;
		top:-68px !important; left:-97px !important;
	}
	.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
		width:560px !important; height:313px !important;
		top:-104px !important; left:-384px !important;
	}
	.reforma-home-hero .reforma-hero-butterfly{
		width:120px !important;
	}
	.reforma-home-hero .reforma-hero-hand{
		display:none !important;
	}}

/* v2.10.9 — hero watermark: REFORMA monogram RING (39 instances, Figma exact positions) */
.reforma-home-hero .reforma-hero-watermark{
	position:absolute;inset:0;
	background-image:none !important;
	background:none !important;
	opacity:1 !important;
	transform:scale(0.9) !important;
	pointer-events:none;z-index:0;overflow:hidden;
	display:flex;align-items:center;justify-content:center;
}
.reforma-home-hero .reforma-hero-ring{
	position:relative;
	/* square ring frame (Figma 1636.81 x 1639.86) — large, centered in peach area */
	width:min(118%, 1640px);
	aspect-ratio:1636.81 / 1639.86;
	max-width:none;
}
.reforma-home-hero .reforma-ring-mono{
	position:absolute;
	width:10.43%;height:auto;
	opacity:0.10;
	pointer-events:none;
	display:block;
	/* each monogram positioned by inline left%/top%; left/top mark the cell's top-left */
}
@media (max-width:1023px){
	.reforma-home-hero .reforma-hero-ring{width:min(150%, 900px);}}
@media (max-width:599px){
	.reforma-home-hero .reforma-hero-ring{width:min(180%, 640px);}
	.reforma-home-hero .reforma-ring-mono{opacity:0.08;}}

/* =========================================================================
   v2.10.11 — HERO egg/arch FULL REBUILD to match Figma Group 126 render.
   Key corrections over v2.10.5/2.10.8:
   - NO div rotation. Left & right arches are MIRRORED radii (the 180° in
     Figma data nets to a mirror, not a flip): the sharp 0-corner sits at
     bottom-RIGHT (left arch) / bottom-LEFT (right arch).
   - object-fit:none was a bug (it showed the natural 2069px image, ignoring
     the 1547px sizing => offsets landed off-frame, right arch read white).
     Switch to object-fit:fill so the 1324x739 Figma placement (x1.168 =>
     1547x863) is honored and the bird crop lands correctly.
   - Left backdrop uses the SAME upright image rotated 180deg (Figma 45:981
     rotation=pi) so its complementary bird/leaf region shows.
   - Photos upright (no counter-rotate), composited bottom ~80%.
   - Hand-with-tulip: smaller, lower-left, reaching up toward the arch waist.
   Scale S = 327/280 = 1.1679 (Group 126 mapped onto the 1440 canvas).
   ========================================================================= */

/* --- composition box: Group 97 518x439 -> x1.168 = 605x513, right-aligned --- */
.reforma-home-hero .reforma-hero-right{ position:relative; min-height:560px !important; }
.reforma-home-hero .reforma-hero-arches{
	position:absolute !important; top:50% !important; right:0 !important;
	transform:translateY(-50%) !important; left:auto !important;
	width:605px !important; height:513px !important; display:block !important; gap:0 !important;
}
.reforma-home-hero .reforma-arch{
	position:absolute !important; width:327px !important; height:482px !important;
	background:#fff !important; border:1px solid #9c783a !important; overflow:hidden !important;
	box-shadow:none !important;
}
/* LEFT arch (Group 96): top-left of comp, ON TOP, sharp corner bottom-RIGHT */
.reforma-home-hero .reforma-arch--left{
	left:0 !important; top:0 !important; z-index:2 !important;
	transform:scale(0.9) !important;
	border-radius:500px 500px 0 495px !important;   /* TL TR BR BL : sharp BR */
}
/* RIGHT arch (Group 95): BEHIND, sharp corner bottom-LEFT (mirror).
   Nudged left (262 vs Figma 278) for a tighter egg waist matching the render. */
.reforma-home-hero .reforma-arch--right{
	left:262px !important; top:30px !important; z-index:1 !important;
	transform:scale(0.9) !important;
	border-radius:500px 500px 495px 0 !important;   /* mirror: sharp BL */
}

/* --- backdrops: honor the 1547x863 sizing (object-fit:fill, NOT none) --- */
.reforma-home-hero .reforma-arch-bg{
	position:absolute !important; max-width:none !important;
	width:1547px !important; height:863px !important;
	object-fit:fill !important; object-position:0 0 !important; z-index:0 !important;
}
/* RIGHT arch: offset (-231,-161) x1.168 = (-270,-188) — orange+red birds */
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
	top:-188px !important; left:-270px !important; transform:scale(0.9) !important;
}
/* LEFT arch: SAME upright image (NOT rotated), shifted to the LEFT region of
   the backdrop (green leaves top + orange bird) to match the render.
   Figma render-size offset (-110,-80) x1.168 => (-128,-93). */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
	top:-93px !important; left:-128px !important;
	transform:scale(0.9) !important; transform-origin:center center !important;
}

/* --- women photos: upright, composited at the bottom, ~110% arch width --- */
.reforma-home-hero .reforma-arch-photo{
	position:absolute !important; bottom:0 !important; top:auto !important;
	left:50% !important; right:auto !important; margin:0 !important;
	transform:translateX(-50%) !important;
	object-fit:cover !important; z-index:1 !important;
}
/* LEFT woman (Figma w316 on 280 arch = 113%, top ~18% down, anchored bottom).
   Selector matches v2.10.5's (0,3,0) so we beat its upside-down rotate rule. */
.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
	bottom:0 !important; top:auto !important;
	left:50% !important; right:auto !important; margin:0 !important;
	transform:translateX(-50%) !important; transform-origin:center !important;
	width:104% !important; height:92% !important;
	object-fit:cover !important;
	object-position:25% 22% !important;   /* woman sits in left ~45% of the 4096-wide asset */
}
/* RIGHT woman (4096x2732, centered; anchored bottom ~86%) */
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
	transform:translateX(-50%) !important;
	width:108% !important; height:88% !important;
	object-fit:cover !important;
	object-position:50% 18% !important;
}

/* --- butterfly: Figma (898,175) 335x187 -> top-right over right arch --- */
.reforma-home-hero .reforma-hero-butterfly{
	position:absolute !important; width:330px !important; height:auto !important;
	right:-28px !important; top:-6px !important; left:auto !important;
	z-index:6 !important; pointer-events:none;
}

/* --- hand-with-tulip: smaller, lower-left, reaching up toward arch waist --- */
.reforma-home-hero .reforma-hero-hand{
	position:absolute !important; width:430px !important; height:auto !important;
	left:-150px !important; top:auto !important; bottom:30px !important;
	transform:rotate(-8deg) !important; transform-origin:bottom right !important;
	z-index:3 !important; pointer-events:none;
}

/* ---- TABLET (<=1024) ---- */
@media (max-width:1024px){
	.reforma-home-hero .reforma-hero-arches{ width:480px !important; height:420px !important; transform:translateY(-50%) scale(0.82) !important; transform-origin:right center !important; }
	.reforma-home-hero .reforma-hero-butterfly{ width:240px !important; right:-18px !important; top:-4px !important; }
	.reforma-home-hero .reforma-hero-hand{ width:320px !important; left:-110px !important; bottom:20px !important; }}
/* ---- MOBILE (<=768) stack centered ---- */
@media (max-width:768px){
	/* prevent grid blowout: 1fr track must be allowed to shrink below content */
	.reforma-home-hero .reforma-hero-grid{ grid-template-columns:minmax(0,1fr) !important; }
	.reforma-home-hero .reforma-hero-left,
	.reforma-home-hero .reforma-hero-right{ min-width:0 !important; max-width:100% !important; }
	.reforma-home-hero .reforma-hero-right{ min-height:380px !important; }
	.reforma-home-hero .reforma-hero-arches{
		position:relative !important; top:auto !important; right:auto !important; left:50% !important;
		transform:translateX(-50%) scale(0.62) !important; transform-origin:top center !important; margin:0 auto !important;
	}
	/* keep left arch + woman upright on mobile (beat v2.10.5 mobile rotate rule) */
	.reforma-home-hero .reforma-arch--left{ transform:scale(0.9) !important; }
	.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
		bottom:0 !important; top:auto !important; left:50% !important; right:auto !important;
		margin:0 !important; transform:translateX(-50%) !important;
	}
	.reforma-home-hero .reforma-arch--left .reforma-arch-bg{ transform:scale(0.9) !important; }
	.reforma-home-hero .reforma-hero-butterfly{ width:150px !important; right:-6px !important; top:-10px !important; }
	.reforma-home-hero .reforma-hero-hand{ width:230px !important; left:-30px !important; bottom:10px !important; }}
@media (max-width:480px){
	.reforma-home-hero .reforma-hero-arches{ transform:translateX(-50%) scale(0.46) !important; transform-origin:top center !important; }
	.reforma-home-hero .reforma-arch--left{ transform:scale(0.9) !important; }
	.reforma-home-hero .reforma-hero-butterfly{ width:120px !important; }
	.reforma-home-hero .reforma-hero-hand{ display:none !important; }}

/* =========================================================================
   v2.10.27 — HERO corrections (hand sprig / watermark ring / arch waist seam)
   Asset now = hand-flower-sprig.png (tightly cropped node "10 1", 2111x2374).
   ========================================================================= */

/* (1) HAND-WITH-FLOWER-SPRIG — lower-left, real visual weight, rot -22.4deg
   (Figma node "10 1": left-anchored, ~full-height, rotation -0.391rad). The
   cropped asset has no transparent margins, so width == visible hand width. */
.reforma-home-hero .reforma-hero-hand{
	width:370px !important; height:auto !important;
	left:-170px !important; right:auto !important;
	top:auto !important; bottom:-10px !important;
	transform:rotate(-22.4deg) !important; transform-origin:center center !important;
	z-index:4 !important; opacity:1 !important; pointer-events:none;
	filter:drop-shadow(0 14px 26px rgb(58 38 22 / .14));
}

/* (2) WATERMARK RING — enlarge each monogram ~1.7x and shift the ring toward
   the right-centre behind the arches (Figma 03-text shows a larger, cleaner
   ring offset right). Keep gold #9A7435 @ opacity 0.10. */
.reforma-home-hero .reforma-hero-watermark{
	justify-content:flex-end !important;   /* push ring toward right-centre */
}
.reforma-home-hero .reforma-hero-ring{
	width:min(150%, 2050px) !important;     /* larger frame => larger monograms */
	transform:translate(13%, 5%) !important; /* shift right-of-centre behind arches (Figma) */
}
.reforma-home-hero .reforma-ring-mono{
	width:17.5% !important;                  /* ~1.7x the prior 10.43% */
}

/* (3) ARCH WAIST SEAM — tighten the white gap so the women's inner shoulders
   nearly touch. Pull the right arch left (262 -> 236) for a tighter egg waist,
   and nudge each woman toward the seam so skin meets at the waist. */
.reforma-home-hero .reforma-arch--right{
	left:206px !important;                    /* tighter egg waist (more overlap kills white seam) */
}
.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
	width:112% !important;
	object-position:44% 22% !important;      /* shift left woman hard toward inner (right) edge */
}
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
	width:118% !important;
	object-position:24% 18% !important;      /* shift right woman hard toward inner (left/seam) edge */
}
/* right-arch backdrop: nudge a coloured region over the lower-left (seam) corner */
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
	left:-300px !important;
}

/* responsive: keep hand visible + scaled, ring tuned */
@media (max-width:1024px){
	.reforma-home-hero .reforma-hero-hand{ width:280px !important; left:-120px !important; bottom:0 !important; }
	.reforma-home-hero .reforma-ring-mono{ width:16% !important; }}
@media (max-width:768px){
	.reforma-home-hero .reforma-hero-hand{ width:210px !important; left:-30px !important; bottom:6px !important; }
	.reforma-home-hero .reforma-hero-watermark{ justify-content:center !important; }
	.reforma-home-hero .reforma-hero-ring{ transform:translate(8%, 4%) !important; }}

/* v2.10.30 — art-of-transformation: floral must fill card & bottom-anchor so it paints in the strip below the green overlay. The global `.reforma-home-art img{height:auto}` rule was collapsing the floral to its 352px aspect-height at the top, hiding it entirely behind the 91%-tall green overlay. Restore full-card cover, bottom-aligned, z-index below green. Matches Figma 08-group-129 (floral 710x716 full card, green 710x652 top-aligned -> floral visible in bottom ~64px). */
.reforma-home-art .reforma-art-left .reforma-art-floral{
	position:absolute !important;
	top:0 !important;
	left:0 !important;
	right:0 !important;
	bottom:0 !important;
	width:100% !important;
	height:100% !important;
	object-fit:cover !important;
	object-position:center bottom !important;
	border-radius:inherit !important;
	display:block !important;
	z-index:1 !important;
}
.reforma-home-art .reforma-art-left .reforma-art-overlay{
	z-index:2 !important;
}
.reforma-home-art .reforma-art-left .reforma-art-content{
	z-index:3 !important;
}

/* v2.10.33 — home-objects-of-beauty: enlarge + lower the blue-flower decoration to match Figma right edge.
   Figma Group 166 (541x448) right-flush; floral RECTANGLE 423x393 scaleMode FILL (object-fit:cover),
   top 55/448, right 0 -> bottom reaches 45.5% of the 985-tall section.
   Live floral was width-correct (421px) but height:auto letterboxed the 1.79:1 source to ~235px (bottom ~32%),
   so it read SMALLER + HIGHER. Restore the cropped near-square box, scale ~16% larger, extend lower. */
.reforma-objects-of-beauty .reforma-oob-deco{
	width:clamp(280px, 43.5vw, 628px) !important;   /* 541 * 1.16 */
	height:clamp(340px, 36.1vw, 520px) !important;  /* 448 * 1.16 */
}
.reforma-objects-of-beauty .reforma-oob-deco-floral{
	top:9% !important;            /* slightly higher within taller box so bottom drops lower along the cards */
	right:0 !important;
	width:81% !important;         /* ~423/541 * 1.04 -> larger */
	height:auto !important;
	aspect-ratio:423 / 393 !important;  /* Figma crop box; with cover this stops the short letterbox */
	object-fit:cover !important;
	object-position:center top !important;
}
.reforma-objects-of-beauty .reforma-oob-deco-butterfly{
	top:0 !important;
	right:46% !important;
	width:50% !important;
}

/* Tablet: keep the flower present and lower, scaled to viewport */
@media (max-width:1024px){
	.reforma-objects-of-beauty .reforma-oob-deco{
		width:38vw !important;
		height:34vw !important;
		opacity:0.85 !important;
	}}
/* Mobile: smaller but still lower along the right edge */
@media (max-width:640px){
	.reforma-objects-of-beauty .reforma-oob-deco{
		width:46vw !important;
		height:42vw !important;
		opacity:0.6 !important;
	}}
/* =========================================================================
   v2.10.42 — HERO exact-Figma rebuild (Group 126).
   Fixes: arch "flip" (no parent 180deg — both arches are plain domes with
   the sharp corner bottom-right, identical radius 500 500 0 495, matching the
   Figma SVG paths 45:970 & 45:977); egg overlap (right arch +238/+26 ->
   x1.168 = left:278 top:30, overlap ~49px); backdrop compositing (bird-jungle
   shows as a band behind each woman, object-fit cover); both women upright &
   in front of the backdrop; hand-with-tulip real asset, big, lower-left,
   rotated -22.4deg (node "10 1" rotation -0.391rad).
   Appended LAST so it wins over v2.10.5 / v2.10.8.
   ========================================================================= */

/* composition box: Group 97 (517.6x438.9) x1.168 = 605x513 */
.reforma-home-hero .reforma-hero-arches{
	position:absolute; top:50%; right:0; transform:translateY(-50%);
	width:605px; height:513px; gap:0;
}
.reforma-home-hero .reforma-arch{
	position:absolute; top:0; width:327px; height:483px; overflow:hidden;
	border:2px solid rgba(156,120,58,0.9); background:#fff0e6;
	border-radius:500px 500px 0 495px;          /* dome, sharp bottom-right */
	transform:scale(0.9) !important;                   /* kill the old 180deg flip */
}
/* LEFT arch (Group 96) at (0,0), ON TOP */
.reforma-home-hero .reforma-arch--left{
	left:0; top:0; z-index:2;
	border-radius:500px 500px 0 495px;
	transform:scale(0.9) !important;
}
/* RIGHT arch (Group 95) at (238,26)*1.168 = (278,30), BEHIND */
.reforma-home-hero .reforma-arch--right{
	left:278px; top:30px; z-index:1;
	border-radius:500px 500px 0 495px;
	transform:scale(0.9) !important;
}

/* backdrop: bird-jungle fills the arch, sits behind the woman as a band */
.reforma-home-hero .reforma-arch-bg{
	position:absolute; inset:0; width:100%; height:100%;
	object-fit:cover; z-index:0; transform:scale(0.9) !important;
}
.reforma-home-hero .reforma-arch--left  .reforma-arch-bg{ object-position:62% 32%; transform:scale(0.9) !important; }
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{ object-position:30% 38%; transform:scale(0.9) !important; }

/* women: upright, in FRONT of backdrop, anchored to arch bottom */
.reforma-home-hero .reforma-arch-photo{
	position:absolute; bottom:0; left:50%;
	transform:translateX(-50%) !important;
	width:100%; height:84%; object-fit:cover; z-index:1;
}
.reforma-home-hero .reforma-arch--left  .reforma-arch-photo{
	object-position:46% top; transform:translateX(-50%) !important;
}
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
	object-position:52% top; transform:translateX(-50%) !important;
}

/* hand-with-tulip: real asset, large, lower-left, tilted -22.4deg */
.reforma-home-hero .reforma-hero-hand{
	position:absolute; left:-150px; bottom:-30px;
	width:clamp(420px,42vw,560px); height:auto; z-index:3;
	transform:rotate(-22.4deg); transform-origin:bottom left; pointer-events:none;
}
/* butterfly stays top-right */
.reforma-home-hero .reforma-hero-butterfly{
	position:absolute; right:-20px; top:-46px; left:auto;
	width:clamp(240px,24vw,335px); height:auto; z-index:3; pointer-events:none;
}

@media (max-width:1199px){
	.reforma-home-hero .reforma-hero-arches{
		width:540px; height:458px; transform:translateY(-50%) scale(0.9); transform-origin:right center;
	}
	.reforma-home-hero .reforma-hero-hand{ left:-90px; width:380px; }
}
@media (max-width:1023px){
	.reforma-home-hero .reforma-hero-arches{
		position:relative; top:auto; right:auto; transform:none; margin:0 auto; left:0;
		width:560px; height:483px;
	}
	.reforma-home-hero .reforma-hero-hand{ left:-30px; bottom:0; width:300px; }
	.reforma-home-hero .reforma-hero-butterfly{ right:0; top:-20px; width:220px; }
}
@media (max-width:767px){
	.reforma-home-hero .reforma-hero-arches{
		width:340px; height:300px;
	}
	.reforma-home-hero .reforma-arch{ width:200px; height:300px; }
	.reforma-home-hero .reforma-arch--left{ left:0; top:0; }
	.reforma-home-hero .reforma-arch--right{ left:148px; top:18px; }
	.reforma-home-hero .reforma-hero-hand{ display:none; }
	.reforma-home-hero .reforma-hero-butterfly{ width:150px; right:-6px; top:-12px; }
}

/* =========================================================================
   v2.10.43 — HERO fine-tune: reveal orange bird in backdrop band, lift women
   so heads sit just under the dome top (matches Figma 01-group-126).
   ========================================================================= */
/* backdrops: show the orange bird (upper band of 74e4d00e) behind each head */
.reforma-home-hero .reforma-arch--left  .reforma-arch-bg{ object-position:58% 20% !important; }
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{ object-position:34% 24% !important; }

/* women: a touch taller, heads near dome top */
.reforma-home-hero .reforma-arch-photo{ height:88% !important; }
.reforma-home-hero .reforma-arch--left  .reforma-arch-photo{ object-position:48% top !important; }
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{ object-position:52% top !important; }

/* =========================================================================
   v2.10.50 — HERO FINAL REBUILD: exact Figma Group 126 arch shapes + jungle
   backdrop fix + hand/butterfly/watermark placement.

   KEY CHANGES vs prior attempts:
   - LEFT arch = TRUE EGG (all-corners rounded), NOT a dome
   - RIGHT arch = TALL ARCH (rounded top, squared bottom)
   - Backdrop object-position tuned to show GREEN JUNGLE (left portion of
     the 2069px image) rather than the bird-dominant centre
   - Left woman object-position targets the woman's body (left ~30% of
     4096px image — she's at the left of the transparent PNG)
   - Right woman object-position centres her redhead face
   - Hand placed in .reforma-hero-right overlapping the headline area:
     large (~480px), at mid-hero height, rotated ~-20deg, tulip up-right
   - Watermark ring shifted LEFT behind the headline text (flex-start)
   ========================================================================= */

/* ---- arch composition container: Figma Group 97 (517.6×438.9) × 1.168 = 605×513 ---- */
.reforma-home-hero .reforma-hero-arches{
    position:absolute !important;
    top:50% !important;
    right:0 !important;
    left:auto !important;
    transform:translateY(-50%) !important;
    width:605px !important;
    height:513px !important;
    display:block !important;
    gap:0 !important;
}

/* ---- shared arch base ---- */
.reforma-home-hero .reforma-arch{
    position:absolute !important;
    width:327px !important;
    height:483px !important;
    overflow:hidden !important;
    border:1px solid #9c783a !important;
    background:#c8b89a !important;  /* warm fallback instead of white */
    box-shadow:none !important;
    transform:scale(0.9) !important;
}

/* ---- LEFT arch: EGG / OVAL (all corners heavily rounded) ---- */
/* Figma render shows a true oval — the bottom curves out just like the top.
   border-radius shorthand TL TR BR BL using elliptical (H/V). */
.reforma-home-hero .reforma-arch--left{
    left:0 !important;
    top:0 !important;
    z-index:2 !important;
    transform:scale(0.9) !important;
    /* Egg: heavily rounded all four corners, slightly narrower at top */
    border-radius:50% 50% 50% 50% / 55% 55% 45% 45% !important;
}

/* ---- RIGHT arch: TALL ARCH (dome top, squared bottom) ---- */
.reforma-home-hero .reforma-arch--right{
    left:278px !important;
    top:30px !important;
    z-index:1 !important;
    transform:scale(0.9) !important;
    border-radius:260px 260px 12px 12px !important;
}

/* ---- backdrop: object-fit cover, position to show GREEN JUNGLE region ----
   The 2069px-wide image: left portion = rich green palm foliage + orange bird.
   object-position: 18% brings us to the left-green band.
   Vertical: 30% shows the middle of the scene (bird + leaves). */
.reforma-home-hero .reforma-arch-bg{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    object-fit:cover !important;
    z-index:0 !important;
    transform:scale(0.9) !important;
}
/* Left arch backdrop — show green foliage + bird (LEFT portion of image) */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
    object-position:18% 35% !important;
    transform:scale(0.9) !important;
}
/* Right arch backdrop — slightly different crop, show orange bird among foliage */
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
    object-position:28% 30% !important;
    transform:scale(0.9) !important;
}

/* ---- women: upright, in FRONT of backdrop, anchored bottom ---- */
.reforma-home-hero .reforma-arch-photo{
    position:absolute !important;
    bottom:0 !important;
    top:auto !important;
    left:50% !important;
    right:auto !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
    object-fit:cover !important;
    z-index:1 !important;
}
/* LEFT woman (4096×1820): headband woman is in left ~30% of the 4096px image.
   object-position x=15% lands on her. Height 88% fills arch bottom. */
.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
    width:106% !important;
    height:88% !important;
    object-position:15% top !important;
    transform:translateX(-50%) !important;
    transform-origin:center !important;
}
/* RIGHT woman (4096×2732): redhead is centred in the image. */
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
    width:106% !important;
    height:88% !important;
    object-position:50% top !important;
    transform:translateX(-50%) !important;
}

/* ---- hand + tulip: large, lower-left of .reforma-hero-right, reaching up-right ---- */
/* The hand PNG is 4096×2657 — the actual hand+sprig occupies the full canvas,
   so at width:460px the sprig tip reaches up to headline height. */
.reforma-home-hero .reforma-hero-hand{
    position:absolute !important;
    left:-180px !important;
    bottom:-20px !important;
    top:auto !important;
    width:460px !important;
    height:auto !important;
    transform:rotate(-20deg) !important;
    transform-origin:bottom left !important;
    z-index:3 !important;
    pointer-events:none;
    filter:drop-shadow(0 12px 24px rgb(58 38 22 / .12));
}

/* ---- butterfly: upper-right, overlapping right arch top-right corner ---- */
.reforma-home-hero .reforma-hero-butterfly{
    position:absolute !important;
    right:-30px !important;
    top:-30px !important;
    left:auto !important;
    width:200px !important;
    height:auto !important;
    z-index:6 !important;
    pointer-events:none;
}

/* ---- watermark ring: cluster BEHIND the headline (left side of hero) ---- */
.reforma-home-hero .reforma-hero-watermark{
    position:absolute !important;
    inset:0 !important;
    background:none !important;
    opacity:1 !important;
    transform:scale(0.9) !important;
    pointer-events:none;
    z-index:0 !important;
    overflow:hidden;
    /* align ring to left-centre, behind the text column */
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
}
.reforma-home-hero .reforma-hero-ring{
    position:relative !important;
    /* Large ring centred on the left 50% of hero */
    width:min(60%, 900px) !important;
    aspect-ratio:1 !important;
    /* shift it into the headline zone */
    transform:translate(-10%, -5%) !important;
}
.reforma-home-hero .reforma-ring-mono{
    position:absolute !important;
    /* Each monogram ~18% of the ring frame = ~162px at 900px frame */
    width:18% !important;
    height:auto !important;
    opacity:0.10 !important;
    pointer-events:none;
    display:block !important;
    filter:sepia(1) saturate(1.5) hue-rotate(15deg) !important;
}

/* ---- hero-right container height ---- */
.reforma-home-hero .reforma-hero-right{
    position:relative !important;
    min-height:560px !important;
}

/* ---- TABLET ≤1199 ---- */
@media (max-width:1199px){
    .reforma-home-hero .reforma-hero-arches{
        width:540px !important;
        height:458px !important;
        transform:translateY(-50%) scale(0.9) !important;
        transform-origin:right center !important;
    }
    .reforma-home-hero .reforma-hero-hand{
        width:360px !important;
        left:-120px !important;
    }
    .reforma-home-hero .reforma-hero-butterfly{
        width:165px !important;
        right:-15px !important;
        top:-20px !important;
    }
}

/* ---- TABLET ≤1023 (stack) ---- */
@media (max-width:1023px){
    .reforma-home-hero .reforma-hero-grid{
        grid-template-columns:1fr !important;
    }
    .reforma-home-hero .reforma-hero-right{
        min-height:440px !important;
    }
    .reforma-home-hero .reforma-hero-arches{
        position:relative !important;
        top:auto !important;
        right:auto !important;
        left:50% !important;
        transform:translateX(-50%) !important;
        margin:0 auto !important;
        width:500px !important;
        height:423px !important;
    }
    .reforma-home-hero .reforma-hero-hand{
        width:280px !important;
        left:-60px !important;
        bottom:0 !important;
    }
    .reforma-home-hero .reforma-hero-butterfly{
        width:150px !important;
        right:0 !important;
        top:-15px !important;
    }
}

/* ---- MOBILE ≤767 ---- */
@media (max-width:767px){
    .reforma-home-hero .reforma-hero-right{
        min-height:360px !important;
    }
    .reforma-home-hero .reforma-hero-arches{
        width:340px !important;
        height:288px !important;
        transform:translateX(-50%) !important;
    }
    .reforma-home-hero .reforma-arch{
        width:200px !important;
        height:296px !important;
    }
    .reforma-home-hero .reforma-arch--left{
        left:0 !important;
        top:0 !important;
    }
    .reforma-home-hero .reforma-arch--right{
        left:170px !important;
        top:18px !important;
    }
    .reforma-home-hero .reforma-hero-hand{
        display:none !important;
    }
    .reforma-home-hero .reforma-hero-butterfly{
        width:130px !important;
        right:-6px !important;
        top:-10px !important;
    }
    .reforma-home-hero .reforma-hero-ring{
        width:min(120%, 600px) !important;
    }
}

/* ---- SMALL MOBILE ≤480 ---- */
@media (max-width:480px){
    .reforma-home-hero .reforma-hero-arches{
        width:280px !important;
        height:240px !important;
    }
    .reforma-home-hero .reforma-arch{
        width:165px !important;
        height:244px !important;
    }
    .reforma-home-hero .reforma-arch--right{
        left:140px !important;
        top:15px !important;
    }
}

/* =========================================================================
   v2.10.51 — HERO PIXEL-EXACT PASS 2
   Fixes over v2.10.50:
   1. Backdrop: object-position → top-left corner (dark green avoids white centre)
      Left arch: 3% 3%  Right arch: 85% 8% (right side has orange+green too)
   2. Hand: mix-blend-mode:multiply removes white background (asset is NOT transparent)
   3. Women: height 92% + object-position tuned per asset layout
   4. Left arch: egg border-radius with px values (% can misfire on absolute divs)
   5. Right arch: tall dome 240px 240px 8px 8px
   ========================================================================= */

/* --- LEFT arch EGG: px-based to guarantee rounded bottom --- */
.reforma-home-hero .reforma-arch--left{
    border-radius:164px 164px 164px 164px / 242px 242px 210px 210px !important;
}
/* --- RIGHT arch TALL DOME: large top radius, flat bottom --- */
.reforma-home-hero .reforma-arch--right{
    border-radius:240px 240px 8px 8px !important;
}

/* --- backdrop: avoid the blown-out white centre of the 2069×1155 image ---
   The dark-green + orange bird occupies the LEFT edge (x<30%).
   For the left arch we go extreme top-left (3% 3%).
   For the right arch we go top-right (88% 8%) where there is orange+green. */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
    object-position:3% 3% !important;
    object-fit:cover !important;
    transform:scale(0.9) !important;
}
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
    object-position:88% 8% !important;
    object-fit:cover !important;
    transform:scale(0.9) !important;
}

/* --- women: taller + correct object-position ---
   Left woman (4096×1820): woman is in LEFT 35% of the image.
   Right woman (4096×2732): centred at ~55%. */
.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
    width:110% !important;
    height:92% !important;
    object-position:12% top !important;
    transform:translateX(-50%) !important;
    bottom:0 !important;
    top:auto !important;
}
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
    width:110% !important;
    height:92% !important;
    object-position:54% top !important;
    transform:translateX(-50%) !important;
    bottom:0 !important;
    top:auto !important;
}

/* --- hand: mix-blend-mode:multiply removes white bg (asset has white bg) --- */
.reforma-home-hero .reforma-hero-hand{
    mix-blend-mode:multiply !important;
}

/* =========================================================================
   v2.10.52 — HERO PASS 3: hand size/position, arch bottom clip fix, overlay
   ========================================================================= */

/* --- HAND: much larger, anchored at mid-height of hero-right, rotated so
   the sprig tip points upper-right toward arch top. The asset (4096×2657)
   at width:600px → height:389px. Hand/arm occupies bottom ~60% of asset,
   flower at top. With bottom:40px+rotate(-22deg) the hand enters from left
   and the flower reaches toward upper arch area. mix-blend-mode keeps it. */
.reforma-home-hero .reforma-hero-hand{
    position:absolute !important;
    left:-200px !important;
    bottom:40px !important;
    top:auto !important;
    width:600px !important;
    height:auto !important;
    transform:rotate(-22deg) !important;
    transform-origin:bottom left !important;
    z-index:3 !important;
    pointer-events:none;
    mix-blend-mode:multiply !important;
    filter:drop-shadow(0 8px 20px rgb(58 38 22 / .10)) !important;
}

/* --- Ensure arch composition is tall enough to not clip egg bottom ---
   Hero-right min-height 580px (slightly more room). */
.reforma-home-hero .reforma-hero-right{
    min-height:580px !important;
}

/* --- LEFT arch: slightly less height to expose the full egg curve ---
   Figma Group 96: 280×413 × 1.168 = 327×482. Keep 483 but verify overflow:hidden
   doesn't clip. The ISSUE was overflow:hidden on the arch, which is correct.
   The egg bottom IS rendering — it just needs to be within the viewport. */
.reforma-home-hero .reforma-arch--left{
    height:483px !important;
    /* EGG: border-radius in px for reliability */
    border-radius:164px 164px 164px 164px / 242px 242px 210px 210px !important;
}

/* Tablet hand */
@media (max-width:1199px){
    .reforma-home-hero .reforma-hero-hand{
        width:460px !important;
        left:-140px !important;
        bottom:20px !important;
    }
}
@media (max-width:1023px){
    .reforma-home-hero .reforma-hero-hand{
        width:340px !important;
        left:-60px !important;
        bottom:10px !important;
    }
}

/* =========================================================================
   v2.10.53 — HERO PASS 4: hand rotation fix + backdrop left-arch green
   ========================================================================= */

/* --- HAND: positive rotation (clockwise) so the flower-tip swings UP-RIGHT.
   The asset (4096×2657): flower at upper portion, arm at lower-right.
   +18deg CW: arm goes lower-right (enters from left), flower points upper-left.
   Actually the Figma shows the flower going UP, so the stem is diagonal.
   Use +20deg with transform-origin bottom-left: wrist at lower-left of
   the displayed rect, flower pointing upper-right. */
.reforma-home-hero .reforma-hero-hand{
    position:absolute !important;
    left:-260px !important;
    bottom:30px !important;
    top:auto !important;
    width:680px !important;
    height:auto !important;
    transform:rotate(20deg) !important;
    transform-origin:bottom left !important;
    z-index:3 !important;
    pointer-events:none;
    mix-blend-mode:multiply !important;
    filter:drop-shadow(0 8px 20px rgb(58 38 22 / .10)) !important;
}

/* --- LEFT arch backdrop: push to extreme left edge for dark green.
   0% 0% = top-left corner = darkest green fronds, minimal white. */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
    object-position:0% 5% !important;
}

/* Tablet/mobile hand */
@media (max-width:1199px){
    .reforma-home-hero .reforma-hero-hand{
        width:520px !important;
        left:-180px !important;
        bottom:20px !important;
    }
}
@media (max-width:1023px){
    .reforma-home-hero .reforma-hero-hand{
        width:380px !important;
        left:-70px !important;
        bottom:10px !important;
    }
}

/* =========================================================================
   v2.10.54 — HERO PASS 5: backdrop crop refined, women taller
   Fix: right arch backdrop was showing ONLY the large orange bird (too dominant).
   Both arches should show the LEFT portion of the jungle image (balanced scene).
   Also: right woman height increased so she covers more arch area.
   ========================================================================= */

/* Both arches: use LEFT portion of the 2069px image to avoid white centre.
   Left arch: 5% across, 15% down = green fronds + top of orange bird.
   Right arch: 12% across, 40% down = orange bird body + green leaves below. */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
    object-position:5% 15% !important;
}
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
    object-position:12% 40% !important;
}

/* Right woman: fill more of the arch (height 96%, width 115%) */
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
    height:96% !important;
    width:115% !important;
    object-position:54% top !important;
}

/* Hand: move to mid-height (not bottom) so it enters at headline level.
   bottom:auto, set top to ~40% of hero-right height. */
.reforma-home-hero .reforma-hero-hand{
    bottom:auto !important;
    top:38% !important;
    left:-260px !important;
    width:640px !important;
    transform:rotate(18deg) !important;
    transform-origin:bottom left !important;
}
@media (max-width:1199px){
    .reforma-home-hero .reforma-hero-hand{
        top:42% !important;
        left:-160px !important;
        width:480px !important;
    }
}
@media (max-width:1023px){
    .reforma-home-hero .reforma-hero-hand{
        top:45% !important;
        left:-60px !important;
        width:340px !important;
    }
}

/* =========================================================================
   v2.10.55 — HERO PASS 6: hand large+bottom-anchored so hand (not just sprig)
   is visible; backdrop both arches tuned to orange-bird-in-green-foliage.
   ========================================================================= */

/* HAND: 800px wide (4096×2657 → 800×519). Bottom-anchored so the hand/palm
   occupies the vertical center of the hero-right column. Slight positive
   rotation keeps the sprig pointing toward the right/arch area.
   The asset is RGBA transparent outside the painting — multiply blend
   makes the white paper match the peach bg, making the watercolor float. */
.reforma-home-hero .reforma-hero-hand{
    position:absolute !important;
    left:-280px !important;
    bottom:-20px !important;
    top:auto !important;
    width:800px !important;
    height:auto !important;
    transform:rotate(18deg) !important;
    transform-origin:bottom left !important;
    z-index:3 !important;
    pointer-events:none;
    mix-blend-mode:multiply !important;
    filter:none !important;
}

/* Backdrop: show UPPER-LEFT of jungle (green fronds + orange bird together).
   Both arches share the same LEFT-REGION of the 2069px image.
   object-fit:cover on 327×483 → image renders at 0.418 scale (height-fit).
   Displayed width = 327/0.418=782px. With x% offset:
   x=8%: shows 2069*0.08=165px offset → displays 165-947px of orig.
   Orange bird centre ≈ x=310px → in arch at (310-165)/782 = 18% from left.
   So object-position:8% 8% shows green fronds top + orange bird side. */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{
    object-position:8% 8% !important;
}
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{
    object-position:6% 35% !important;
}

/* Tablet */
@media (max-width:1199px){
    .reforma-home-hero .reforma-hero-hand{
        width:600px !important;
        left:-180px !important;
        bottom:-15px !important;
    }
}
@media (max-width:1023px){
    .reforma-home-hero .reforma-hero-hand{
        width:400px !important;
        left:-60px !important;
        bottom:-10px !important;
    }
}

/* =========================================================================
   v2.10.56 — HERO PASS 7: hand enters from far left (crosses the text column),
   making it large + prominent at mid-hero height. The hero has overflow:hidden
   at the section level so the hand can extend far left without breaking layout.
   Grid: padding 0 80px, 2 × 1fr. Right column starts at ≈ 720px from viewport.
   To appear from x≈80px, hand.left = -(720-80) = -640px in the right column.
   At width:900px the hand canvas ends at -640+900=260px within the right col
   → right edge at ≈ 720+260 = 980px from left (just inside the arch area).
   ========================================================================= */
.reforma-home-hero .reforma-hero-hand{
    position:absolute !important;
    left:-620px !important;
    top:30% !important;
    bottom:auto !important;
    width:900px !important;
    height:auto !important;
    /* +18deg: bottom-left (wrist) swings down, top (flower) swings right/up */
    transform:rotate(15deg) !important;
    transform-origin:50% 70% !important;
    z-index:3 !important;
    pointer-events:none;
    mix-blend-mode:multiply !important;
    filter:none !important;
}

@media (max-width:1199px){
    .reforma-home-hero .reforma-hero-hand{
        left:-480px !important;
        width:700px !important;
        top:32% !important;
    }
}
@media (max-width:1023px){
    .reforma-home-hero .reforma-hero-hand{
        left:-200px !important;
        width:500px !important;
        top:35% !important;
        transform-origin:50% 70% !important;
    }
}
@media (max-width:767px){
    .reforma-home-hero .reforma-hero-hand{
        display:none !important;
    }
}

/* =========================================================================
   v2.10.57 — HERO PASS 8: right woman fuller + arch bottom coverage
   ========================================================================= */

/* Right woman: taller to cover the arch bottom white gap.
   Right arch is 483px tall. Woman at height:100% = full coverage.
   object-position stays centered. */
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
    height:100% !important;
    width:115% !important;
    object-position:54% 10% !important;
    bottom:0 !important;
    top:auto !important;
    transform:translateX(-50%) !important;
}

/* Right arch fallback bg: use a warm skin/golden tone instead of white
   so any uncovered corners don't look stark. */
.reforma-home-hero .reforma-arch--right{
    background:oklch(82% 0.06 72) !important;
}
.reforma-home-hero .reforma-arch--left{
    background:oklch(60% 0.12 150) !important;
}

/* =========================================================================
   v2.10.58 — HERO PASS 9: women much larger (fill arch), backdrop tuned
   Key insight: women MUST cover most of the arch so the backdrop shows only
   at the edges and top. Both women: width 130%+, height 94%+.
   Left woman: 4096×1820. Her body is in the LEFT 35% of the wide canvas.
   object-position:x=8% centres on her body. At width:130%=425px displayed,
   cover scale = max(425/4096, 94%_of_483/1820) = max(0.104, 0.250) = 0.250.
   Rendered: 1024×455px. x-clip=1024-425=599px. At 8%: x=48, show 48-473px.
   Her body is at original x≈0-1500; scaled x=0-375. So show 48-473 incl her.
   ========================================================================= */

/* Left woman: large, centered on her body (left side of the 4096px canvas) */
.reforma-home-hero .reforma-arch--left .reforma-arch-photo{
    width:130% !important;
    height:94% !important;
    object-fit:cover !important;
    object-position:8% top !important;
    bottom:0 !important;
    top:auto !important;
    left:50% !important;
    right:auto !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
    z-index:2 !important;
}

/* Right woman: large, centered (she's centred in 4096px canvas) */
.reforma-home-hero .reforma-arch--right .reforma-arch-photo{
    width:130% !important;
    height:94% !important;
    object-fit:cover !important;
    object-position:52% top !important;
    bottom:0 !important;
    top:auto !important;
    left:50% !important;
    right:auto !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
    z-index:2 !important;
}

/* Arch fallback bg: keep as warm tones matching the jungle */
.reforma-home-hero .reforma-arch--left{
    background:#c8b890 !important;
}
.reforma-home-hero .reforma-arch--right{
    background:#d4b896 !important;
}

/* v2.10.60 — arch backdrops now use saturated jungle crops (no white center). Reset object-position to fill the arch with foliage. */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{ object-fit:cover !important; object-position:55% 35% !important; width:100% !important; height:100% !important; left:0 !important; top:0 !important; }
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{ object-fit:cover !important; object-position:45% 30% !important; width:100% !important; height:100% !important; left:0 !important; top:0 !important; }

/* v2.10.61 — butterfly larger + overlapping right arch top-right (match Figma); left backdrop surfaces the orange flying bird */
.reforma-home-hero .reforma-hero-butterfly{ width:200px !important; right:8px !important; top:34px !important; z-index:6 !important; }
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{ object-position:42% 22% !important; }

/* v2.10.62 — surface orange bird at arch top (bird sits cols33-42% rows0-16% of crop) + butterfly larger + solid hand */
.reforma-home-hero .reforma-arch--left .reforma-arch-bg{ object-fit:cover !important; object-position:37% 4% !important; transform:scale(0.9) !important; }
.reforma-home-hero .reforma-arch--right .reforma-arch-bg{ object-fit:cover !important; object-position:50% 4% !important; transform:scale(0.9) !important; }
.reforma-home-hero .reforma-hero-butterfly{ width:210px !important; right:-6px !important; top:28px !important; z-index:7 !important; }
.reforma-home-hero .reforma-hero-hand{ opacity:1 !important; mix-blend-mode:normal !important; }

/* v2.10.64 — HERO ARCHES: replaced CSS-composite with the EXACT Figma render crop (transparent peach). Single artwork image = 100% Figma-accurate birds/jungle/women/butterfly. */
.reforma-home-hero .reforma-hero-artwork{
	position:absolute; right:0; top:50%; transform:translateY(-50%);
	width:min(56%, 760px); height:auto; z-index:3; pointer-events:none;
}
/* old separate butterfly no longer used (artwork includes it) */
.reforma-home-hero .reforma-hero-butterfly{ display:none !important; }
@media (max-width:900px){
	.reforma-home-hero .reforma-hero-artwork{ position:static; transform:none; width:100%; max-width:520px; margin:24px auto 0; display:block; }
}

/* v2.10.65 — hero artwork sizing: larger + raised to fill the right column like Figma */
.reforma-home-hero .reforma-hero-artwork{
	width:min(48vw, 720px) !important;
	right:-10px !important; top:46% !important;
}

/* =========================================================================
   v2.10.158 — HERO CLUSTER: single exact-Figma crop (hand+sprig + both arches
   + women + butterfly), peach flood-filled transparent. Replaces the separate
   artwork PNG + hand. Crop is 752x500, taken from Figma 1440 canvas at
   (x648,y138). Hero top = y88, grid top = hero top. So inside the grid:
     left = 648px  (= viewport x648 on a 1440 canvas; grid border-box left = 0)
     top  = 138-88 = 50px from grid top
   Anchored to the RIGHT (right:40px = 1440-(648+752)) so it tracks the right
   edge on >1440 screens. width:752px keeps the 1:1 Figma geometry.
   ========================================================================= */
.reforma-home-hero .reforma-hero-cluster{
	position:absolute !important;
	right:40px !important;
	left:auto !important;
	top:50px !important;
	bottom:auto !important;
	width:752px !important;
	height:auto !important;
	max-width:none !important;
	transform:scale(0.9) !important;
	z-index:3 !important;
	pointer-events:none;
}
/* anchor the cluster off the grid so px math maps to the 1440 canvas */
.reforma-home-hero .reforma-hero-grid{ position:relative; }
.reforma-home-hero .reforma-hero-right{ position:static !important; min-height:560px; }

/* ---- responsive: scale the cluster down, keep right-anchored ---- */
@media (max-width:1439px){
	.reforma-home-hero .reforma-hero-cluster{ width:52vw !important; right:2vw !important; top:60px !important; }
}
@media (max-width:1023px){
	.reforma-home-hero .reforma-hero-cluster{ width:60vw !important; right:1vw !important; top:40px !important; }
}
@media (max-width:899px){
	.reforma-home-hero .reforma-hero-right{ min-height:0 !important; }
	.reforma-home-hero .reforma-hero-cluster{
		position:static !important; width:100% !important; max-width:560px !important;
		margin:8px auto 0 !important; display:block !important; top:auto !important; right:auto !important;
	}
}

/* =========================================================================
   v2.10.158 — HERO TEXT to exact Figma: title color #402800 (warm brown,
   measured srgb(64,40,0)), title 70px, line spacing + vertical rhythm.
   ========================================================================= */
.reforma-home-hero .reforma-hero-title{
	color:#402800 !important;
	font-size:71px !important;           /* Figma "Natural Beauty" 424px @ measured 71px */
	line-height:1.05 !important;         /* Figma line spacing ~73px @71px */
	letter-spacing:-0.01em !important;
	margin:0 0 4px !important;           /* Figma title->subtext gap ~11px (line-box adds the rest) */
}
.reforma-home-hero .reforma-hero-eyebrow{
	color:#9d793d !important;            /* measured srgb(157,121,61) */
	font-size:22px !important;
	margin:0 0 11px !important;          /* lift title ~11px so line1 cap lands at Figma y180 (leading offset) */
}
.reforma-home-hero .reforma-hero-sub{
	color:#6b5236 !important;            /* warm brown subtext (Figma) */
	margin:0 0 26px !important;          /* Figma subtext->buttons gap ~49px (incl btn whitespace) */
	max-width:430px !important;
}
.reforma-home-hero .reforma-hero-cta-row{ margin-bottom:120px !important; }  /* Figma buttons->socials ~134px */
.reforma-home-hero .reforma-hero-btn{
	padding:15px 30px !important;        /* Figma button h ~52px (was 63) */
	font-size:16px !important;
}
.reforma-home-hero .reforma-hero-btn--ghost{ font-size:13px !important; }

/* =========================================================================
   v2.10.158 — HERO WATERMARK ring to match Figma: smaller monograms, ring
   shifted lower-left (Figma ring centre ~x380,y330 in the 1440 canvas).
   Figma single monogram measured ~80px. Ring frame 720px -> mono 11% = 79px.
   ========================================================================= */
.reforma-home-hero .reforma-hero-watermark{
	display:block !important;
	overflow:visible !important;
}
.reforma-home-hero .reforma-hero-ring{
	position:absolute !important;
	width:1637px !important;
	height:1637px !important;
	aspect-ratio:auto !important;
	/* Figma ring is a large open arc centred lower-left (~viewport x370,y360).
	   Hero starts at viewport y88, watermark inset:0 -> top:0 = viewport y88.
	   Frame centre = top + 370. For centre at hero-relative y272 (viewport ~360):
	     top = 272 - 370 = -98  ; left for centre x370: 370-370 = 0, nudge -30. */
	left:-68px !important;
	top:135px !important;
	right:auto !important;
	transform:scale(0.9) !important;
}
.reforma-home-hero .reforma-ring-mono{
	width:var(--mw, 12%) !important;          /* per-coin Figma node size via inline --mw */
	max-width:none !important;
	height:auto !important;
	opacity:0.10 !important;       /* match Figma faint-gold visibility */
	filter:none !important;
	/* WP block-layout injects has-global-padding/is-layout-constrained onto the
	   FIRST coin img, inflating its border-box (+~32px) and shifting the glyph +16px.
	   Neutralise so every coin's box == its --mw width at the exact Figma left/top. */
	padding:0 !important;
	margin:0 !important;
	box-sizing:border-box !important;
	/* Figma's monogram marks sit with more breathing room than our filled glyph
	   (live measured 36% ink vs Figma 26.7%). Scale each coin's glyph down around
	   its own centre to add space between marks (coin positions unchanged). */
	transform:scale(0.9) !important;
	transform-origin:center !important;
}
@media (max-width:1023px){
	.reforma-home-hero .reforma-hero-ring{ width:560px !important; height:560px !important; left:-40px !important; }
}
@media (max-width:899px){
	.reforma-home-hero .reforma-hero-ring{ width:440px !important; height:440px !important; left:-30px !important; top:40px !important; }
}
/* v2.10.242 — watermark as ONE exact image rendered from the Figma coin glyph at the
   exact 39 positions (10% per coin so overlaps darken like Figma). Replaces the 39 DOM
   coins (which had scale/density drift). Fills the ring container (left:-68,top:135,1637). */
.reforma-home-hero .reforma-hero-ring .reforma-hero-wm-img{
	position:absolute !important; left:0 !important; top:0 !important;
	width:100% !important; height:auto !important; max-width:none !important;
	opacity:1 !important; filter:none !important; transform:none !important;
	margin:0 !important; padding:0 !important; pointer-events:none !important;
}


/* =========================================================================
   v2.10.349 — MOBILE hero re-order: the image cluster (two clients + arches)
   now sits ABOVE the CTA buttons instead of buried at the bottom. .reforma-hero-left
   is a plain block (children space themselves via their own margins) so
   display:contents promotes eyebrow/title/sub/cta/socials into the flex grid
   without losing their rhythm; flex `order` then drops the cluster between the
   sub-text and the CTAs. Order => eyebrow, title, sub, CLUSTER, CTAs, socials. */
@media (max-width:1023px){
  html body .reforma-home-hero .reforma-hero-grid{
    display:flex !important; flex-direction:column !important; gap:0 !important;
    align-items:stretch !important;
  }
  html body .reforma-home-hero .reforma-hero-left,
  html body .reforma-home-hero .reforma-hero-right{ display:contents !important; }
  html body .reforma-home-hero .reforma-hero-eyebrow{ order:1 !important; }
  html body .reforma-home-hero .reforma-hero-title{ order:2 !important; }
  html body .reforma-home-hero .reforma-hero-sub{ order:3 !important; margin-bottom:6px !important; }
  html body .reforma-home-hero .reforma-hero-cluster{
    order:4 !important; position:static !important; display:block !important;
    width:100% !important; max-width:440px !important; height:auto !important;
    margin:18px auto 26px !important; right:auto !important; top:auto !important; left:auto !important;
  }
  html body .reforma-home-hero .reforma-hero-cta-row{ order:5 !important; margin-bottom:28px !important; }
  html body .reforma-home-hero .reforma-hero-socials{ order:6 !important; }
}


/* =========================================================================
   v2.10.353 — MOBILE carousels for Treatments / Doctors / Products. On phones
   (<=767px) the three home card grids become a high-end horizontal swipe
   carousel: scroll-snap + a next-card "peek" as the primary affordance, plus an
   animated "Swipe" hint that fades out on first interaction. Tablet/desktop keep
   their grids untouched. (home product carousel) */
.reforma-swipe-hint{ display:none; }
@media (max-width:767px){
  html body .reforma-mcarousel{
    display:flex !important; flex-wrap:nowrap !important; grid-template-columns:none !important;
    width:100% !important; max-width:none !important; align-self:stretch !important;
    overflow-x:auto !important; overflow-y:hidden !important; touch-action:pan-x !important; overscroll-behavior-x:contain !important; overscroll-behavior-y:auto !important;
    scroll-snap-type:x mandatory !important; -webkit-overflow-scrolling:touch !important;
    gap:14px !important; margin:0 0 14px !important; padding:4px 2px 12px !important;
    align-items:stretch !important;
    scrollbar-width:none !important; -ms-overflow-style:none !important;
  }
  html body .reforma-mcarousel::-webkit-scrollbar{ display:none !important; height:0 !important; }
  html body .reforma-mcarousel > *{
    flex:0 0 82% !important; width:82% !important; max-width:330px !important; min-width:0 !important;
    scroll-snap-align:start !important; margin:0 !important; align-self:stretch !important; touch-action:pan-x !important;
  }
  /* product cards read better a touch narrower (bigger peek) */
  html body .reforma-objects-of-beauty .reforma-mcarousel > *{
    flex-basis:72% !important; width:72% !important; max-width:280px !important;
  }
  /* SWIPE HINT */
  html body .reforma-swipe-hint{
    display:flex !important; align-items:center; justify-content:center; gap:9px;
    margin:2px auto 4px; padding:0; color:#9c783a;
    font-family:'Fraunces','TRY Vesterbro','Playfair Display',Georgia,serif;
    font-size:13px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; opacity:0.85;
    transition:opacity .45s ease, transform .45s ease;
  }
  html body .reforma-swipe-hint__icon{ display:block; animation:reforma-swipe-bob 1.6s ease-in-out infinite; will-change:transform; }
  html body .reforma-swipe-hint.is-swiped{ opacity:0 !important; transform:translateY(-6px) !important; pointer-events:none; }
}
@keyframes reforma-swipe-bob{ 0%,100%{ transform:translateX(-5px);} 50%{ transform:translateX(5px);} }
@media (prefers-reduced-motion:reduce){ .reforma-swipe-hint__icon{ animation:none !important; } }