/* =====================================================
   Fiorella Elementor Widgets — structural CSS.
   Colors, fonts, and sizes are controlled per-widget-instance
   from the Elementor Style tab (see each widgets/*.php file),
   so nothing here needs editing by hand.
===================================================== */

.fio-hero,.fio-about,.fio-programs,.fio-offerings,.fio-environment{ overflow:hidden; }
.fio-hero img,.fio-about img,.fio-programs img,.fio-offerings img{ max-width:100%; display:block; }

/* ---------- HERO ---------- */
.fio-hero{ text-align:center; padding: 72px 24px 90px; }
.fio-hero-title{ margin:0 0 18px; line-height:1.15; }
.fio-hero-tagline{ margin:0 auto; max-width: 40ch; font-style:italic; }

.fio-photo-cluster{ position:relative; max-width: 660px; margin: 56px auto 0; height: 320px; }
.fio-hex{
	--hex-poly: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
	position:absolute; width: 210px; aspect-ratio: 1/1.06;
	clip-path: var(--hex-poly);
}
.fio-hex img{ width:100%; height:100%; object-fit:cover; }
.fio-hex::after{
	content:""; position:absolute; inset:0; clip-path: var(--hex-poly);
	box-shadow: inset 0 0 0 10px var(--fio-hex-ring, #16233f), inset 0 0 0 14px var(--fio-hex-ring-bg, #f5f0e6);
	pointer-events:none;
}
.fio-hex--top{ left:50%; top:0; transform:translateX(-50%); z-index:2; }
.fio-hex--left{ left:4%; top:104px; z-index:1; }
.fio-hex--right{ right:4%; top:104px; z-index:1; }

.fio-earth-wrap{
	position:absolute; left:50%; bottom:-4px; transform:translateX(-50%);
	width:150px; height:74px; overflow:hidden; z-index:3; border-radius: 999px 999px 0 0;
}
.fio-earth-wrap img{ width:150px; height:148px; object-fit:cover; object-position: top; }

@media(min-width:700px){ .fio-photo-cluster{ height: 360px; } }

/* ---------- ABOUT BAND ---------- */
.fio-about{ text-align:center; padding: 70px 24px; }
.fio-about-title{ margin:0 0 10px; }
.fio-about-text{ margin:0 auto; max-width: 46ch; }
.fio-strip{ display:flex; margin-top: 56px; height: 220px; overflow:hidden; }
.fio-strip-item{ flex:1; overflow:hidden; }
.fio-strip-item img{ width:100%; height:100%; object-fit:cover; }

/* ---------- PROGRAMS ---------- */
.fio-programs{ padding: 90px 24px; position:relative; }
.fio-programs-title{ text-align:center; margin:0 0 64px; }
.fio-leaf{ position:absolute; width:150px; opacity:.85; pointer-events:none; }
.fio-leaf.tl{ top:20px; left:-20px; transform: rotate(-8deg); }
.fio-leaf.br{ bottom:20px; right:-20px; transform: rotate(178deg); }

.fio-program-list{ max-width: 980px; margin: 0 auto; position:relative; z-index:1; display:flex; flex-direction:column; gap: 64px; }
.fio-program-row{ display:grid; grid-template-columns: auto 1fr; gap: 32px; align-items:center; }
.fio-program-row.reverse{ grid-template-columns: 1fr auto; }
.fio-program-row.reverse .fio-program-photo{ order:2; }
.fio-program-row.reverse .fio-program-copy{ order:1; text-align:right; }
.fio-program-row.reverse .fio-program-copy p{ margin-left:auto; }

.fio-program-photo{
	width: 260px; height: 260px; border-radius:50%; overflow:hidden; flex-shrink:0;
	box-shadow: 0 0 0 14px var(--ring, #ddd);
}
.fio-program-photo img{ width:100%; height:100%; object-fit:cover; }
.fio-program-title{ margin:0 0 10px; }
.fio-program-copy p{ margin:0; max-width:46ch; line-height:1.6; }

@media (max-width: 620px){
	.fio-program-row, .fio-program-row.reverse{ grid-template-columns: 1fr; justify-items:center; text-align:center; gap:20px; }
	.fio-program-row.reverse .fio-program-photo{ order:1; }
	.fio-program-row.reverse .fio-program-copy{ order:2; text-align:center; }
	.fio-program-row.reverse .fio-program-copy p{ margin-left:0; }
	.fio-program-photo{ width:200px; height:200px; }
}

/* ---------- OFFERINGS ---------- */
.fio-offerings{ padding: 80px 24px; }
.fio-offerings-grid{ max-width: 760px; margin: 0 auto; display:grid; grid-template-columns: repeat(2,1fr); gap: 48px 56px; justify-items:center; }
.fio-offering{ text-align:center; }
.fio-scallop{ width: 300px; aspect-ratio:1/1; position:relative; }
.fio-scallop-clip{ width:100%; height:100%; overflow:hidden; }
.fio-scallop-clip img{ width:100%; height:100%; object-fit:cover; }
.fio-scallop::after{
	content:""; position:absolute; inset:0;
	box-shadow: inset 0 0 0 10px var(--ring, #c96a4b); pointer-events:none;
}
.fio-offering-title{ margin:18px 0 0; }

@media (max-width: 560px){
	.fio-offerings-grid{ grid-template-columns: 1fr; }
	.fio-scallop{ width: 240px; }
}

/* ---------- ENVIRONMENT ---------- */
.fio-environment{ text-align:center; padding: 70px 24px; }
.fio-environment-title{ margin:0 0 10px; }
.fio-environment-status{ font-weight:700; margin:0; }