/* ==========================================================================
   Thab Wear — Elementor bridge (loads BEFORE proto.css)
   --------------------------------------------------------------------------
   Pages are built from native Elementor Containers, Headings, Images, HTML and
   Shortcode widgets that carry the prototype's own CSS classes. proto.css (the
   prototype stylesheet) does all the styling; this file only makes Elementor's
   wrappers behave like the prototype elements they stand in for:

     .tw-c     Container → behaves like a plain element (no flex, padding or gap
               until proto.css gives it the prototype's layout)
     .tw-box   Widget with a prototype class → the widget wrapper IS the element;
               the heading tag/link inside it is transparent
     .tw-pass  Widget without a class → the wrapper is transparent; the tag inside
               is the element
   Selectors here are weaker than proto.css so it always wins; the few rules that must hold
   whatever proto.css says (transparent wrappers, image fill) use !important.
   ========================================================================== */

/* the header/footer template wrappers disappear so .site-header can stick to the page */
.tw-slot, .tw-slot > .elementor, .elementor-location-header, .elementor-location-footer { display: contents; }

/* ---------- containers ---------- */
body .e-con.tw-c {
	display: block; flex: 0 1 auto; flex-direction: initial; flex-wrap: initial; gap: normal;
	align-items: normal; align-content: normal; justify-content: normal; align-self: auto;
	width: auto; max-width: none; min-width: 0; height: auto; min-height: auto;
	margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
	position: static; overflow: visible; z-index: auto; text-align: inherit; color: inherit;
	--padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; --gap: 0px; --row-gap: 0px; --column-gap: 0px;
}
body a.e-con.tw-c { cursor: pointer; }

/* ---------- widgets ---------- */
body .elementor-widget.tw-box, body .elementor-widget.tw-pass {
	margin: 0; width: auto; max-width: none; min-width: 0; flex: 0 1 auto; align-self: auto; position: static; text-align: inherit;
	--container-widget-width: auto; --container-widget-flex-grow: 0;
}
body .elementor-widget.tw-pass { display: contents !important; }
body .elementor-widget.tw-box > .elementor-heading-title,
body .elementor-widget.tw-box > .elementor-heading-title > a,
body .elementor-widget > .elementor-shortcode,
body .elementor-widget.tw-box.elementor-widget-image > a { display: contents !important; }
body .elementor-widget.tw-box > .elementor-heading-title { font-size: inherit; font-weight: inherit; line-height: inherit; }
body .elementor-heading-title { line-height: inherit; color: inherit; }
body .elementor-heading-title > a { color: inherit; }
/* whole button is the link, as in the prototype */
body .elementor-widget.btn a::after { content: ""; position: absolute; inset: 0; }
/* image widget with a prototype class: the wrapper is the image box, the <img> fills it */
body .elementor-widget-image.tw-box img {
	display: block !important; width: 100% !important; height: 100% !important; max-width: none !important;
	object-fit: inherit !important; object-position: inherit !important; border-radius: inherit !important;
}

/* ---------- prototype rules whose `>` crosses an Elementor wrapper ---------- */
:root body.thab.thab .btn span[aria-hidden] { transition: transform .35s var(--ease); }
:root body.thab.thab .btn:hover span[aria-hidden] { transform: translateX(4px); }
:root body.thab.thab .ab-name__text { color: rgba(237, 228, 214, .72); max-width: 46ch; font-size: 16px; }
:root body.thab.thab .ab-statement__tag { margin-top: 16px; }

/* reveal-on-scroll: --d delays written as classes by the page converter */
.tw-d-1 { --d: 1; } .tw-d-2 { --d: 2; } .tw-d-3 { --d: 3; } .tw-d-4 { --d: 4; } .tw-d-5 { --d: 5; }

/* Elementor editor: every hero slide stacked (so each can be selected and edited), nothing hidden by reveal */
:root body.thab.thab.elementor-editor-active .hero__track { height: auto; display: grid; gap: 12px; overflow: visible; background: none; }
:root body.thab.thab.elementor-editor-active .hero__slide { position: relative; inset: auto; min-height: 560px; opacity: 1; visibility: visible; border-radius: var(--r-lg); overflow: hidden; }
:root body.thab.thab.elementor-editor-active .hero__ui { position: relative; inset: auto; padding: 8px 0; mix-blend-mode: normal; color: var(--ink); }
:root body.thab.thab.elementor-editor-active .tw-rv { opacity: 1; transform: none; }
/* the editor inserts its own handles as first children, so the prototype's :nth-child backgrounds use :nth-of-type here */
:root body.thab.thab.elementor-editor-active .hero__slide:nth-of-type(1) { background: var(--pattern) 0 0 / 44px 44px, radial-gradient(90% 90% at 70% 45%, #2A2A27, #0B0B0B 75%); background-blend-mode: soft-light, normal; }
:root body.thab.thab.elementor-editor-active .hero__slide:nth-of-type(2) { background: var(--pattern) 0 0 / 44px 44px, radial-gradient(90% 90% at 70% 45%, #3F4637, #161A13 78%); background-blend-mode: soft-light, normal; }
:root body.thab.thab.elementor-editor-active .hero__slide:nth-of-type(3) { background: var(--pattern) 0 0 / 44px 44px, radial-gradient(90% 90% at 70% 45%, #4A3F33, #17130F 78%); background-blend-mode: soft-light, normal; }
:root body.thab.thab.elementor-editor-active .cat-card:nth-of-type(2) { background: linear-gradient(#E4DBCD, #D6CAB7); }
:root body.thab.thab.elementor-editor-active .cat-card:nth-of-type(3) { background: linear-gradient(#D9CDBB, #C9BBA7); }