/* Elementor pages: let the theme's classes and tokens work on Elementor widget markup. */

/* Elementor content spans the full width; its sections handle their own boxed width and padding. */
.elementor-page .wp-block-post-content.has-global-padding { padding-left: 0; padding-right: 0; }
.elementor-page .wp-block-post-content.has-global-padding > .alignfull { margin-left: 0 !important; margin-right: 0 !important; }
.elementor-page .wp-block-post-content > .elementor { max-width: none; }

/* Paragraph spacing inside text widgets. */
.elementor-widget-text-editor > :last-child,
.elementor-widget-text-editor > * > :last-child { margin-bottom: 0; }
.elementor-widget-text-editor p:first-child { margin-top: 0; }

/* Elementor removes link underlines; keep the theme's underlined links in body text. */
.elementor-widget-text-editor a:not(.elementor-button) { text-decoration: underline; }

/* Elementor buttons take the theme button style. Per-widget colours set in Elementor still win,
   since they use a more specific selector. */
.elementor .elementor-button {
	background-color: var(--wp--preset--color--leaf);
	color: #fff;
	border-radius: 999px;
	padding: .95rem 1.75rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.2;
}
.elementor .elementor-button:hover,
.elementor .elementor-button:focus { background-color: var(--wp--preset--color--leaf-deep); color: #fff; }

/* Hairline dividers between columns of a strip (class "is-divided" on the column containers). */
@media (min-width: 768px) { .e-con.is-divided { border-left: 1px solid var(--wp--preset--color--line); } }
@media (max-width: 767px) { .e-con.is-divided { border-top: 1px solid var(--wp--preset--color--line); padding-top: var(--wp--preset--spacing--50) !important; } }

/* Image widgets: theme ratios and captions. */
.elementor-widget-image img { width: 100%; }
.elementor-widget-image.ratio-portrait img { aspect-ratio: 4 / 5; object-fit: cover; }
.elementor-widget-image.ratio-wide img { aspect-ratio: 3 / 2; object-fit: cover; }
.elementor-widget-image.ratio-square img { aspect-ratio: 1; object-fit: cover; }
.elementor-widget-image .widget-image-caption { margin-top: .6rem; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); text-align: left; }

/* Image Carousel: even slide heights (4:3 crops); slides open Elementor's lightbox. */
.elementor-image-carousel .swiper-slide-image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.elementor-image-carousel a { cursor: zoom-in; }

/* Silong: heads, page heads, cards, the hero, the leaf band, photos. Mirrors the theme's block
   styles on Elementor's widget markup. */
.elementor h2.elementor-heading-title { font-size: clamp(2rem, 1.3rem + 2.2vw, 3.25rem) !important; font-weight: 500 !important; line-height: 1.05 !important; letter-spacing: -.02em; font-variation-settings: "opsz" 144; }
.elementor h3.elementor-heading-title { font-family: var(--wp--preset--font-family--sans) !important; font-size: 1.25rem !important; font-weight: 600 !important; letter-spacing: -.01em; }
.elementor h1.elementor-heading-title { font-variation-settings: "opsz" 144; }
.elementor .elementor-button { border-radius: 999px; font-size: 1rem; font-weight: 600; padding: .95rem 1.6rem; }
.elementor .elementor-button { transition: background-color .2s, color .2s; }
/* Section head: text left, arrow link right. */
.elementor .e-con.sg-head { --flex-direction: row; flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; margin-bottom: var(--wp--preset--spacing--50); }
.elementor .e-con.sg-head > .e-con.sg-head__text { width: auto; flex: 1 1 24rem; }
.elementor .e-con.sg-head > .elementor-widget-text-editor { width: auto; flex: 0 0 auto; }
.elementor .sg-head__text > .elementor-widget + .elementor-widget { margin-top: 0; }
.elementor .sg-head .elementor-heading-title { max-width: 18ch; }
.elementor .sg-intro p { max-width: 52ch; color: var(--wp--preset--color--muted); }
.elementor .sg-kicker { margin: 0; }
.elementor .elementor-widget:has(> .elementor-widget-container > .sg-arrow), .elementor .elementor-widget:has(> .sg-arrow) { width: auto; }
/* Cards and panels. */
.elementor .e-con.sg-card, .elementor .e-con.sg-panel { padding: clamp(1.5rem, 3vw, 2.5rem) !important; border-radius: 12px; background: var(--wp--preset--color--base); }
/* Page heads. */
.elementor .e-con.sg-page-head { border-bottom: 1px solid var(--wp--preset--color--line); }
.elementor .sg-page-head .elementor-heading-title { font-size: clamp(2.75rem, 1.6rem + 4vw, 5rem) !important; line-height: 1 !important; letter-spacing: -.03em; max-width: 16ch; font-weight: 500; }
.elementor .sg-band-lead p { max-width: 54ch; color: var(--wp--preset--color--muted); font-size: 1.125rem; }
/* Hero: the photo framed in the page margin, the cream panel over its lower left corner. */
.elementor .e-con.sg-hero__frame { position: relative; display: block; padding: 0 !important; border-radius: 18px; overflow: hidden; }
.elementor .sg-hero__frame > .elementor-widget-image { width: 100%; }
.elementor .sg-hero__photo img { display: block; width: 100%; height: clamp(420px, 72vh, 720px) !important; object-fit: cover; border-radius: 0; }
.elementor .e-con.sg-hero__panel { position: relative; width: auto; margin: -4rem 1rem 0; padding: 2rem 1.5rem !important; border-radius: 12px; background: var(--wp--preset--color--base); }
@media (min-width: 900px) { .elementor .e-con.sg-hero__panel { position: absolute; left: 2.5rem; bottom: 2.5rem; max-width: 34rem; margin: 0; padding: 2.75rem 2.75rem 2.5rem !important; } }
.elementor .sg-hero__title .elementor-heading-title { font-size: clamp(2.75rem, 1.6rem + 4vw, 5rem) !important; line-height: .98 !important; letter-spacing: -.03em; font-weight: 500; }
.elementor .sg-hero__lead p { max-width: 40ch; color: var(--wp--preset--color--muted); }
/* The leaf band. */
.elementor .e-con.sg-band .elementor-heading-title { color: #fff !important; }
.elementor .e-con.sg-band .sg-kicker { color: rgba(255, 255, 255, .8); }
.elementor .e-con.sg-band .sg-arrow a { color: #fff; }
/* Photos fill their column (Elementor shrinks widgets in flex columns otherwise). */
.elementor .e-con > .elementor-widget-image.sg-photo { width: 100%; }
.elementor-widget-image.sg-photo img { aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; }
.elementor-widget-image.sg-photo.is-tall img { aspect-ratio: 4 / 5; }