/*
Theme Name: Time2Pay Child
Theme URI: https://time2pay.uk/
Description: Narrowly scoped brand layer for Time2Pay on Astra. Brand tokens, self-hosted Poppins, focus and contrast rules, and a few components Elementor Free cannot style. Page content stays in Elementor.
Template: astra
Version: 1.0.0
Text Domain: time2pay-child
*/

/* ---- Self-hosted Poppins (SIL Open Font License), latin subset ---- */
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/poppins-400-latin.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/poppins-500-latin.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/poppins-600-latin.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/poppins-700-latin.woff2") format("woff2")}

/* ---- Brand tokens (see design/brand-system.md; contrast table in the master plan, P1.03) ---- */
:root{
  --t2p-purple:#51427A;       /* primary: 8.71:1 on white */
  --t2p-purple-deep:#3A2D6F;  /* footer / dark surfaces: 11.77:1 with white text */
  --t2p-teal:#40A6A7;         /* decoration and icons only: 2.90:1 on white */
  --t2p-gold:#E0AB47;         /* decoration only on light surfaces: 2.08:1 on white */
  --t2p-ink:#222222;
  --t2p-copy:#333333;
  --t2p-muted:#707070;        /* 4.95:1 on white, 4.70:1 on surface: do not lighten */
  --t2p-surface:#F9F9F9;
  --t2p-white:#FFFFFF;
  --t2p-line:#E5E7EB;
  --t2p-radius-sm:8px;
  --t2p-radius-card:14px;
  --t2p-container:1200px;
  --t2p-font:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

body,button,input,select,textarea,.ast-button,.elementor-widget-container,
h1,h2,h3,h4,h5,h6{font-family:var(--t2p-font)}
body{color:var(--t2p-copy);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{color:var(--t2p-ink)}
a{color:var(--t2p-purple)}
a:hover{color:var(--t2p-purple-deep)}

/* ---- Focus: 3:1 or better on light AND dark backgrounds (gold failed, 2.08:1). Specificity beats Astra's dotted outline. ---- */
html body a:focus-visible,html body button:focus-visible,html body input:focus-visible,html body select:focus-visible,html body textarea:focus-visible,
html body summary:focus-visible,html body [tabindex]:focus-visible,html body [role=button]:focus-visible{
  outline:3px solid var(--t2p-purple-deep)!important;outline-offset:3px!important;box-shadow:0 0 0 6px var(--t2p-white);border-radius:4px}
html body .t2p-on-dark a:focus-visible,html body .t2p-on-dark button:focus-visible,html body .t2p-footer a:focus-visible,html body .t2p-footer button:focus-visible{
  outline:3px solid var(--t2p-white)!important;box-shadow:0 0 0 6px var(--t2p-purple-deep)}

/* ---- Reusable classes (applied through the Elementor "CSS Classes" field) ---- */
.t2p-section{padding-block:clamp(44px,6vw,88px)}
.t2p-card{background:var(--t2p-white);border:1px solid var(--t2p-line);border-radius:var(--t2p-radius-card)}
.t2p-surface{background:var(--t2p-surface)}
.t2p-eyebrow{font-size:.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--t2p-purple)}
.t2p-gold-rule .elementor-divider{padding:0}
.t2p-gold-rule .elementor-divider-separator{width:56px!important;border-block-start:4px solid var(--t2p-gold)!important;margin:0!important;border-radius:2px}
.t2p-archive-hero .t2p-gold-rule{display:block;width:56px;height:4px;background:var(--t2p-gold);border-radius:2px}
/* Primary button: white on purple, 8.71:1 */
.t2p-btn-primary .elementor-button,.t2p-btn-primary.elementor-button,.t2p-btn-primary a{background:var(--t2p-purple);color:var(--t2p-white);border-radius:var(--t2p-radius-sm);font-weight:600;min-height:44px}
.t2p-btn-primary .elementor-button:hover,.t2p-btn-primary a:hover{background:var(--t2p-purple-deep);color:var(--t2p-white)}
/* Gold button: ink on gold, 7.64:1 (never white text on gold or teal) */
.t2p-btn-gold .elementor-button,.t2p-btn-gold a{background:var(--t2p-gold);color:var(--t2p-ink);border-radius:var(--t2p-radius-sm);font-weight:600;min-height:44px}
.t2p-btn-gold .elementor-button:hover,.t2p-btn-gold a:hover{background:#d19c36;color:var(--t2p-ink)}
/* Outline button on light backgrounds */
.t2p-btn-outline .elementor-button,.t2p-btn-outline a{background:transparent;color:var(--t2p-purple);border:2px solid var(--t2p-purple);border-radius:var(--t2p-radius-sm);font-weight:600;min-height:44px}
.t2p-btn-outline .elementor-button:hover,.t2p-btn-outline a:hover{background:var(--t2p-purple);color:var(--t2p-white)}
/* Outline button on dark backgrounds */
.t2p-btn-outline-light .elementor-button,.t2p-btn-outline-light a{background:transparent;color:var(--t2p-white);border:2px solid var(--t2p-white);border-radius:var(--t2p-radius-sm);font-weight:600;min-height:44px}
.t2p-btn-outline-light .elementor-button:hover,.t2p-btn-outline-light a:hover{background:var(--t2p-white);color:var(--t2p-purple-deep)}

/* ---- Header (UAE header template, class t2p-header) ---- */
.t2p-header{background:var(--t2p-white);border-bottom:1px solid var(--t2p-line)}
.t2p-header .hfe-nav-menu a.hfe-menu-item,.t2p-header .hfe-nav-menu a.hfe-sub-menu-item{color:var(--t2p-purple);font-weight:500}
.t2p-header .hfe-nav-menu a.hfe-menu-item:hover,.t2p-header .hfe-nav-menu .current-menu-item>a{color:var(--t2p-purple-deep);text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--t2p-gold);text-decoration-thickness:3px}
.t2p-header .menu-item-apply>a.hfe-menu-item{background:var(--t2p-purple);color:var(--t2p-white)!important;border-radius:var(--t2p-radius-sm);padding:10px 22px;font-weight:600;text-decoration:none!important}
.t2p-header .menu-item-apply>a.hfe-menu-item:hover{background:var(--t2p-purple-deep)}

/* header layout: logo never shrinks; button label never wraps; on tablet/phone the separate Apply Now button replaces the menu item */
.t2p-header .elementor-widget-site-logo{flex:0 0 auto}
.t2p-header .elementor-widget-navigation-menu{flex:0 1 auto;margin-left:auto}
.t2p-header .t2p-header-apply{flex:0 0 auto;margin-left:auto}
.t2p-header .t2p-header-apply .elementor-button{white-space:nowrap;padding:10px 18px}
@media (max-width:1024px){.t2p-header .menu-item-apply{display:none}.t2p-header .elementor-widget-navigation-menu{margin-left:0}}
@media (min-width:1025px){.t2p-header .t2p-header-apply{display:none}}

/* ---- Footer (UAE footer template, class t2p-footer) ---- */
/* footer links: no underline at rest (list links are not running text); underline plus gold on hover and focus */

/* ---- Nested tabs (calculator product tabs): purple active tab, white text 8.71:1 (the default gold fails) ---- */
.e-n-tabs .e-n-tab-title{background:var(--t2p-surface);color:var(--t2p-purple);border:1px solid var(--t2p-line);border-radius:var(--t2p-radius-sm) var(--t2p-radius-sm) 0 0;font-weight:600;padding:12px 22px;min-height:44px}
.e-n-tabs .e-n-tab-title .e-n-tab-title-text{color:inherit;font-weight:600}
.e-n-tabs .e-n-tab-title[aria-selected="true"],.e-n-tabs .e-n-tab-title:hover{background:var(--t2p-purple);color:var(--t2p-white);border-color:var(--t2p-purple)}

/* ---- Forms (SureForms and plugin widgets) ---- */
input[type=text],input[type=email],input[type=tel],input[type=number],select,textarea{border:1px solid #767676;border-radius:var(--t2p-radius-sm);min-height:44px}

/* ---- Never let content cause sideways scroll ---- */
html,body{max-width:100%;overflow-x:clip}
img,svg,video{max-width:100%;height:auto}

/* ---- Blog index and single posts (Astra templates) ---- */
.t2p-archive-hero{background:var(--t2p-surface);margin:0 calc(50% - 50vw) 32px;padding:56px 20px 40px;width:100vw}
.t2p-archive-hero__inner{max-width:1160px;margin:0 auto}
.t2p-archive-hero h1{margin:0 0 14px;font-size:clamp(2rem,4vw,2.75rem);font-weight:700;color:var(--t2p-purple)}
.t2p-archive-hero .t2p-gold-rule{margin:0;width:56px}
.ast-separate-container .ast-article-post,.ast-separate-container .ast-article-single{border:1px solid var(--t2p-line);border-radius:var(--t2p-radius-card);box-shadow:none}
.entry-title a{color:var(--t2p-ink)}
.entry-title a:hover{color:var(--t2p-purple)}
.t2p-prose{max-width:860px}
.t2p-prose table{width:100%;border-collapse:collapse;margin:1rem 0}
.t2p-prose th,.t2p-prose td{border:1px solid var(--t2p-line);padding:8px 10px;text-align:left;vertical-align:top}
.t2p-prose p,.t2p-prose li{line-height:1.7}
.t2p-placeholder{border:2px dashed #B45309;background:#FFF7ED;padding:12px 16px;border-radius:8px}
.t2p-staging-only{border:2px dashed #B45309!important;background:#FFF7ED!important}

/* ---- SureForms: stronger field borders (default 25% grey is ~1.5:1; non-text UI needs 3:1) ---- */
html body .srfm-form-container{--srfm-color-input-border:#767676;--srfm-color-input-border-hover:#51427A;--srfm-color-input-background:#FFFFFF;--srfm-color-input-text:#222222;--srfm-btn-color-hover:#3A2D6F}
html body .srfm-form-container .srfm-submit-button{background:#51427A;color:#FFFFFF;min-height:44px;font-weight:600;border-radius:8px}

/* ---- Accessibility fixes found by axe ---- */
/* links inside running text must not rely on colour alone */
.elementor-widget-text-editor a,.t2p-prose a,.srfm-form-container a,.entry-content p a{text-decoration:underline;text-underline-offset:3px}
/* quote on a dark band: white, not Astra's grey blockquote colour */
.t2p-on-dark blockquote,.t2p-on-dark blockquote p,.t2p-on-dark blockquote cite{color:var(--t2p-white)}
blockquote{border-left:4px solid var(--t2p-gold);padding-left:20px;margin-left:0}
/* nested accordion (FAQs): native details/summary */
.t2p-accordion .e-n-accordion-item{border:1px solid var(--t2p-line);border-radius:var(--t2p-radius-sm);margin-bottom:10px;background:var(--t2p-white)}
.t2p-accordion .e-n-accordion-item-title{padding:16px 20px;min-height:44px;cursor:pointer}
.t2p-accordion .e-n-accordion-item-title-text{color:var(--t2p-ink);font-weight:600;font-size:1.0625rem}
.t2p-accordion .e-n-accordion-item[open] .e-n-accordion-item-title-text{color:var(--t2p-purple)}
.t2p-accordion .e-n-accordion-item>.e-con{padding:0 20px 14px}

/* ---- Calculator plugin controls: its own CSS removes the focus outline (WCAG 2.4.7); restore it without editing the plugin ---- */
html body .vwtf.vwtf input:focus-visible,html body .vwtf.vwtf button:focus-visible,html body .vwtf.vwtf select:focus-visible,html body .vwtf.vwtf a:focus-visible{
  outline:3px solid var(--t2p-purple-deep)!important;outline-offset:2px!important;box-shadow:0 0 0 5px var(--t2p-white)!important}

/* ---- Visual polish: homepage hero, highlight, icon badges, card lift, blog cards ---- */
.t2p-hero-bg{background:linear-gradient(180deg,#F3F0FA 0%,#FFFFFF 100%)}
.t2p-iconbox--center .elementor-icon-box-wrapper{text-align:center}
.t2p-iconbox--center .elementor-icon-box-icon{margin-inline:auto;margin-bottom:12px}
.t2p-iconbox .elementor-icon-box-title{font-size:1.125rem;font-weight:600}
.t2p-hero-bg .elementor-button{min-width:230px;justify-content:center}
.t2p-blogcards .hfe-posts-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr))!important;gap:24px}
.t2p-blogcards .hfe-post-card{display:grid!important;grid-template-columns:minmax(170px,38%) 1fr;overflow:hidden;border:1px solid var(--t2p-line);border-radius:var(--t2p-radius-card);background:#fff;box-shadow:0 10px 28px rgba(81,66,122,.07);padding:0!important}
.t2p-blogcards .hfe-post-image{margin:0!important}
.t2p-blogcards .hfe-post-image a,.t2p-blogcards .hfe-post-image img{display:block;width:100%;height:100%;object-fit:cover}
.t2p-blogcards .hfe-post-content{padding:26px 28px!important;display:flex;flex-direction:column;gap:8px;justify-content:center}
.t2p-blogcards .hfe-post-title{margin:0;font-size:1.3rem;line-height:1.3}
.t2p-blogcards .hfe-post-title a{color:var(--t2p-ink)}
.t2p-blogcards .hfe-post-meta{color:var(--t2p-muted);font-size:.875rem}
.t2p-blogcards .hfe-post-excerpt{color:var(--t2p-copy)}
.t2p-blogcards .hfe-read-more{font-weight:600;color:var(--t2p-purple);text-decoration:underline;text-underline-offset:3px;min-height:24px}
@media (max-width:767px){.t2p-blogcards .hfe-post-card{grid-template-columns:1fr}.t2p-blogcards .hfe-post-image img{height:220px}}

/* ---- Calculator tabs on phones: a stray fixed height (about 1,078px) was left under the calculator; let content decide ---- */
@media (max-width:767px){
  .e-n-tabs-content>.e-con,.e-n-tabs-content>.e-con .elementor-widget-shortcode,.e-n-tabs-content>.e-con .elementor-widget-shortcode>.elementor-widget-container{height:auto!important;min-height:0!important}
}
.t2p-blogcards,.t2p-blogcards>.elementor-widget-container,.t2p-blogcards .hfe-posts-grid{width:100%;max-width:100%}

/* ---- About page: pills and product tiles ---- */
.t2p-pills .elementor-icon-list-items{display:flex;flex-wrap:wrap;gap:10px}
.t2p-pills .elementor-icon-list-item{background:#fff;border:1px solid var(--t2p-line);border-radius:999px;padding:8px 18px;box-shadow:0 2px 8px rgba(81,66,122,.06)}
.t2p-pills .elementor-icon-list-text{font-weight:500;color:var(--t2p-ink)}
.t2p-tile .elementor-icon-box-title{margin:0}


/* =====================================================================================================
   ORIGINAL-FIDELITY LAYER (measured from the live time2pay.uk page, 13 Oct 2026; see design/brand-system.md)
   Headline 45px/400 with gold words; gold line icons in a light grey circle; cards with a pale blue-grey border and 12px
   radius that fill purple on hover (400ms); squarer buttons (6px); nav purple with a gold pill on the active item and a
   200ms hover. Differences from the original are deliberate and listed in design/brand-system.md.
   ===================================================================================================== */
.t2p-hero-title .elementor-heading-title{font-size:45px!important;font-weight:400!important;line-height:1.2!important;color:var(--t2p-ink)}
@media (max-width:767px){.t2p-hero-title .elementor-heading-title{font-size:30px!important}}
.t2p-hl{color:var(--t2p-gold);font-weight:inherit;background:none;padding:0}
/* feature cards: white, 1px #D9E3F0, radius 12; whole card fills purple on hover and on keyboard focus-within */
.t2p-card-lift{border:1px solid #D9E3F0!important;border-radius:12px!important;box-shadow:none!important;transition:background-color .4s ease,color .4s ease,border-color .4s ease!important;transform:none!important}
.t2p-card-lift:hover,.t2p-card-lift:focus-within{background-color:var(--t2p-purple)!important;border-color:var(--t2p-purple)!important}
.t2p-card-lift:hover .elementor-icon-box-title,.t2p-card-lift:hover .elementor-icon-box-description,.t2p-card-lift:focus-within .elementor-icon-box-title,.t2p-card-lift:focus-within .elementor-icon-box-description{color:var(--t2p-white)!important;transition:color .4s ease}
.t2p-card-lift .elementor-icon-box-title{font-weight:700;font-size:1.25rem;color:var(--t2p-ink)}
.t2p-card-lift .elementor-icon-box-description{font-size:.9375rem;color:var(--t2p-copy)}
/* icons: gold line icon in a light grey circle with a thin border */
.t2p-iconbox .elementor-icon,.t2p-iconbox .elementor-view-framed .elementor-icon,.t2p-iconbox .elementor-view-stacked .elementor-icon{background:#F8F8F8!important;border:1px solid #E5E5E5!important;border-color:#E5E5E5!important;border-radius:50%!important;width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;font-size:22px;color:var(--t2p-gold)!important}
.t2p-iconbox .elementor-icon i,.t2p-iconbox .elementor-icon svg{color:var(--t2p-gold)!important;fill:var(--t2p-gold)!important}
/* buttons: squarer, 200ms; hover inverts (filled becomes white with a coloured border), as the original's brand rules do */
.t2p-btn-primary .elementor-button,.t2p-btn-gold .elementor-button,.t2p-btn-outline .elementor-button,.t2p-btn-outline-light .elementor-button{border-radius:6px!important;border:2px solid transparent;transition:background-color .2s ease,color .2s ease,border-color .2s ease!important}
.t2p-btn-primary .elementor-button{background:var(--t2p-purple);border-color:var(--t2p-purple);color:var(--t2p-white)}
.t2p-btn-primary .elementor-button:hover,.t2p-btn-primary .elementor-button:focus{background:var(--t2p-white)!important;color:var(--t2p-purple)!important;border-color:var(--t2p-purple)!important}
.t2p-btn-gold .elementor-button{background:var(--t2p-gold);border-color:var(--t2p-gold);color:var(--t2p-ink)}
.t2p-btn-gold .elementor-button:hover,.t2p-btn-gold .elementor-button:focus{background:var(--t2p-white)!important;color:var(--t2p-ink)!important;border-color:var(--t2p-gold)!important}
.t2p-btn-outline .elementor-button{background:transparent;border-color:var(--t2p-purple);color:var(--t2p-purple)}
.t2p-btn-outline .elementor-button:hover,.t2p-btn-outline .elementor-button:focus{background:var(--t2p-purple)!important;color:var(--t2p-white)!important}
.t2p-btn-outline-light .elementor-button{background:transparent;border-color:var(--t2p-white);color:var(--t2p-white)}
.t2p-btn-outline-light .elementor-button:hover,.t2p-btn-outline-light .elementor-button:focus{background:var(--t2p-white)!important;color:var(--t2p-purple)!important}
.t2p-header-apply .elementor-button{border-radius:6px!important}
/* nav: purple, 17px/400; hover is a 200ms colour change to a readable coral (the original's #FF4949 is 3.3:1, below AA); active item is a gold pill */
.t2p-header .hfe-nav-menu a.hfe-menu-item{font-size:17px;font-weight:400;color:var(--t2p-purple);transition:color .2s ease,background-color .2s ease;border-radius:10px;padding:8px 14px}
.t2p-header .hfe-nav-menu a.hfe-menu-item:hover{color:#C62828;text-decoration:none}
.t2p-header .hfe-nav-menu .current-menu-item>a.hfe-menu-item,.t2p-header .hfe-nav-menu .current_page_item>a.hfe-menu-item{background:var(--t2p-gold);color:var(--t2p-ink);text-decoration:none}
.t2p-header .menu-item-apply>a.hfe-menu-item{background:var(--t2p-purple);color:var(--t2p-white)!important;border:2px solid var(--t2p-purple);border-radius:6px;padding:8px 20px;font-weight:600;text-decoration:none!important}
.t2p-header .menu-item-apply>a.hfe-menu-item:hover{background:var(--t2p-white);color:var(--t2p-purple)!important}
/* links: underline on hover only (original), footer links fade from 85% to full opacity */
.t2p-blogcards .hfe-read-more{text-decoration:none}
.t2p-blogcards .hfe-read-more:hover,.t2p-blogcards .hfe-read-more:focus-visible{text-decoration:underline}
/* calculator product tabs: the original's grey "type" buttons, purple when active */
.e-n-tabs .e-n-tab-title{background:#F1F1F6!important;color:#333333!important;border:0!important;border-radius:6px!important;font-weight:600;padding:8px 20px;transition:background-color .2s ease,color .2s ease}
.e-n-tabs .e-n-tab-title .e-n-tab-title-text{color:inherit!important}
.e-n-tabs .e-n-tab-title[aria-selected="true"],.e-n-tabs .e-n-tab-title:hover{background:var(--t2p-purple)!important;color:var(--t2p-white)!important}
.e-n-tabs-heading{gap:10px}
@media (prefers-reduced-motion:reduce){.t2p-card-lift,.elementor-button,.t2p-footer a,.hfe-menu-item{transition:none!important}}

/* =====================================================================================================
   V4 LAYER: what Elementor's atomic-element converter cannot express. Classes are Elementor global classes (design system).
   ===================================================================================================== */
.t2p-icon{color:var(--t2p-gold);width:26px;height:26px;display:block;flex:0 0 auto}
.t2p-btn-linked p{color:inherit;margin:0}
.t2p-hero-title span,.t2p-hero-title strong,.t2p-h2 span{color:var(--t2p-gold);font-weight:inherit}
.t2p-feature-card .t2p-card-title,.t2p-feature-card .t2p-card-text{transition:color .4s ease}
.t2p-feature-card:hover .t2p-card-title,.t2p-feature-card:hover .t2p-card-text,.t2p-feature-card:focus-within .t2p-card-title,.t2p-feature-card:focus-within .t2p-card-text{color:var(--t2p-white)}
.t2p-feature-card{transition:background-color .4s ease,border-color .4s ease}
[class*="t2p-btn-"]{transition:background-color .2s ease,color .2s ease,border-color .2s ease;cursor:pointer}
.t2p-btn-primary:hover p,.t2p-btn-gold:hover p,.t2p-btn-outline:hover p{color:inherit}
.t2p-tab{transition:background-color .2s ease,color .2s ease}
.t2p-tab[aria-selected="true"],.t2p-tab[aria-selected="true"] .t2p-tab-label{background-color:#4A3F78;color:var(--t2p-white)}
.t2p-tab:hover .t2p-tab-label{color:inherit}
.t2p-faq-item summary{cursor:pointer;list-style:none}
@media (prefers-reduced-motion:reduce){[class*="t2p-btn-"],.t2p-feature-card,.t2p-feature-card *,.t2p-tab{transition:none!important}}

.t2p-tab,.t2p-tab *{white-space:nowrap}
.t2p-tab{border:0;font-family:inherit;min-height:44px;display:flex;align-items:center}
/* V3 widgets (header and footer buttons) share the old class names; stop the V4 global-class CSS from double-styling their wrappers */
.elementor-widget.t2p-btn-primary,.elementor-widget.t2p-btn-gold,.elementor-widget.t2p-btn-outline,.elementor-widget.t2p-btn-outline-light{padding:0!important;border:0!important;background:none!important;border-radius:0!important}
.t2p-contact-row{text-decoration:none}
/* V4 accordion: summary layout and a CSS plus/minus in the (empty, aria-hidden) icon slot */
.t2p-faq-item>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 20px 0 0;cursor:pointer;list-style:none;min-height:66px}
.t2p-faq-item>summary::-webkit-details-marker{display:none}
.t2p-faq-item .e-accordion-item-icon-base{position:relative;width:20px!important;height:20px!important;flex:0 0 20px}
.t2p-faq-item .e-accordion-item-content-base{padding:0}

/* the Apply Now menu button keeps its purple button look on its own page (the gold pill is for ordinary active items) */
.t2p-header .menu-item-apply.current-menu-item>a.hfe-menu-item,.t2p-header .menu-item-apply.current_page_item>a.hfe-menu-item{background:var(--t2p-purple);color:var(--t2p-white)!important}
.t2p-header .menu-item-apply.current-menu-item>a.hfe-menu-item:hover{background:var(--t2p-white);color:var(--t2p-purple)!important}
/* border colour pinned: the variable does not resolve inside the converted border shorthand */
.t2p-feature-card,.t2p-card,.t2p-faq-item,.t2p-pill{border-color:#D9E3F0}
.t2p-feature-card:hover{border-color:var(--t2p-purple)}
/* focus ring on dark and primary-purple bands (V4 band classes): white ring */
html body .t2p-section-primary a:focus-visible,html body .t2p-section-primary button:focus-visible,html body .t2p-section-deep a:focus-visible,html body .t2p-section-deep button:focus-visible{
  outline:3px solid var(--t2p-white)!important;box-shadow:0 0 0 6px var(--t2p-purple-deep)}
/* very small phones: the logo, Apply Now button and hamburger must all fit inside 320px */
@media (max-width:400px){
  .t2p-header.e-con,.t2p-header{gap:10px!important;padding-inline:14px!important}
  .t2p-header .elementor-widget-site-logo img{width:104px!important}
  .t2p-header .t2p-header-apply .elementor-button{padding:8px 12px!important;font-size:14px!important;min-height:40px}
  .t2p-header .hfe-nav-menu__toggle{padding:0 4px}
}

/* header spans the full width like the original's fluid navbar (logo at the left edge, menu at the right) */
.t2p-header{padding-inline:22px!important}
.t2p-header>.e-con-inner{max-width:none!important}
/* icon files carry their own colours (original artwork): never recolour them */
.t2p-icon-badge-svg svg,.t2p-icon-btn svg,.t2p-icon-sm svg{width:100%;height:100%;display:block}
/* Elementor writes fill="currentColor" on the svg root, which would flood the original icons' stroke rects: the originals are fill="none" at the root */
.t2p-icon-badge-svg svg,.t2p-icon-btn svg,.t2p-icon-sm svg{fill:none}

/* footer container = the original's 1,140px Bootstrap container */

/* CALCULATOR LAYOUT (matches the original home page): form column about 7/12 and "Your payment plan" panel about 5/12, side by side from 992px */
@media (min-width:992px){
  .vwtf:not([data-look="original"]) .vwtf__shell{grid-template-columns:7fr 5fr!important;gap:30px!important;align-items:start}
  .vwtf:not([data-look="original"]) .vwtf__main{grid-template-columns:minmax(0,1fr)!important}
  .vwtf:not([data-look="original"]) .vwtf__main>*{grid-column:1/-1!important}
  .vwtf:not([data-look="original"]) .vwtf__results{grid-template-columns:minmax(0,1fr)!important}
}

/* TESTIMONIAL (original look): hand-drawn underline under "Real", brand-coloured "Time2Pay", five orange stars */
.t2p-h2 u{text-decoration:none;display:inline-block;padding-bottom:.35em;background:url(assets/underline.svg) no-repeat center bottom/150px 17px}
.t2p-h2 b{font-weight:inherit;color:var(--t2p-purple)}
.t2p-h2 b span{color:var(--t2p-gold)}
.t2p-stars{background:url(assets/stars.svg) no-repeat center/contain}

/* FAQ chevron as in the original: bold black chevron-down, turns up when open */
.t2p-faq-item .e-accordion-item-icon-base::before{content:"";display:block;width:9px;height:9px;border-right:3px solid #000;border-bottom:3px solid #000;transform:translateY(3px) rotate(45deg);transition:transform .2s ease}
.t2p-faq-item[open] .e-accordion-item-icon-base::before{transform:translateY(8px) rotate(-135deg)}
.t2p-faq-item .e-accordion-item-icon-base{width:20px!important;height:20px!important;flex:0 0 20px;display:flex;align-items:center;justify-content:center}
/* TESTIMONIAL heading: underline under Time2Pay (the original draws it 150px wide from the left of "Time"), brand colours */
.t2p-h2-sm b{position:relative;display:inline-block;font-weight:inherit;color:var(--t2p-purple)}
.t2p-h2-sm b span{color:var(--t2p-gold)}
.t2p-h2-sm b::after{content:"";position:absolute;left:0;top:calc(100% - 4px);width:150px;height:17px;background:url(assets/underline.svg) no-repeat left top/150px 17px}
.t2p-h2 u{text-decoration:none}
.t2p-testimonial .t2p-body{text-align:center}
/* blog cards as the original: 20px/700 black title, grey date and excerpt */
.t2p-blogcards .hfe-post-title{font-size:20px;font-weight:700;line-height:24px}
.t2p-blogcards .hfe-post-title a{color:#000}
.t2p-blogcards .hfe-post-meta{font-size:12.8px;color:#6c757d}
.t2p-blogcards .hfe-post-excerpt{color:#6c757d;font-size:16px}

/* FOOTER (V4): underline the label on hover and focus; no resting underline */
.t2p-footer-link,.t2p-footer-contact{text-underline-offset:4px}
/* the original renders text with the browser default smoothing, which looks heavier on dark backgrounds than Astra's antialiased */
.t2p-footer,.t2p-footer *{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}

/* calculator tabs as the original: no border (Elementor adds a 2px dark one on the selected tab), 38px high */
.t2p-tab.t2p-tab,.t2p-tab[aria-selected="true"],.t2p-tab[aria-selected="false"]{border:0!important;min-height:38px}

/* HEADER as the original: 25px padding (92px high), 150px logo, 17px items with 8px padding and 15px gaps, gold pill on the current page, no button */
.t2p-header{padding:25px!important}
.t2p-header .hfe-site-logo img,.t2p-header .hfe-site-logo-img{width:150px!important;max-width:150px!important;height:auto}
.t2p-header .hfe-nav-menu a.hfe-menu-item{padding:8px!important;margin-left:15px!important;border-radius:10px;line-height:26px}
.t2p-header .hfe-nav-menu__layout-horizontal .hfe-nav-menu>li{margin:0!important}
.t2p-header .menu-item-apply{display:none!important}
.t2p-header>.e-con-inner{padding:0!important;min-height:0!important}
.t2p-header{min-height:0!important}
.t2p-header{border-bottom:0!important;box-shadow:none!important}
.t2p-header .hfe-nav-menu li:last-child a.hfe-menu-item{margin-right:15px!important}

/* POLICY PAGES as the original: 16px/24px black copy, 16px paragraph spacing, lists indented 40px, Bootstrap-blue links, borderless tables */
.t2p-policy-copy .elementor-widget-container{padding:0}
.t2p-policy-copy p{margin:0 0 16px;font-size:16px;line-height:24px;color:#000}
.t2p-policy-copy ul,.t2p-policy-copy ol{margin:0 0 16px;padding-left:40px;font-size:16px;line-height:24px;color:#000}
.t2p-policy-copy li{margin:0;color:#000}
.t2p-policy-copy a{color:#0069d9;text-decoration:none}
.t2p-policy-copy a:hover{text-decoration:none}
.t2p-policy-copy table{border-collapse:collapse;border:0;margin:0;width:auto}
.t2p-policy-copy td,.t2p-policy-copy th{padding:1px;border:0;text-align:left;vertical-align:top;font-size:16px;line-height:24px;color:#000}

/* BLOG and ARTICLE templates (home.php, single.php) as the original */
.t2p-blog-title{font-size:32px;font-weight:700;line-height:38.4px;color:#333;text-align:center;margin:0 0 48px;width:100%}
.t2p-blog-card{display:grid;grid-template-columns:1fr 2fr;width:100%;border:1px solid #e5e5e5;border-radius:12px;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.075);margin-bottom:24px;background:#fff}
.t2p-blog-card__img,.t2p-blog-card__img img{display:block;width:100%;height:250px;object-fit:cover;border-radius:12px 0 0 12px}
.t2p-blog-card__body{padding:24px}
.t2p-blog-card__date{margin:0 0 4px;font-size:12.8px;line-height:19.2px;color:#6c757d}
.t2p-blog-card__title{margin:0 0 16px;font-size:20px;font-weight:700;line-height:24px;color:#000}
.t2p-blog-card__excerpt{margin:0 0 16px;font-size:16px;line-height:24px;color:#6c757d}
.t2p-read-more{font-size:16px;font-weight:700;color:#B45F06;text-decoration:none}
.t2p-read-more:hover{text-decoration:underline}
.t2p-back{display:inline-flex;align-items:center;gap:6px;color:#0069d9;text-decoration:none;font-size:16px;line-height:24px}
.t2p-post-img{display:block;width:100%;height:250px;object-fit:cover;border-radius:12px 0 0 12px}
.t2p-post-copy{margin-top:0}
@media (max-width:767px){.t2p-blog-card{grid-template-columns:1fr}.t2p-blog-card__img,.t2p-blog-card__img img{border-radius:12px 12px 0 0}}

/* The blog and article templates are not Elementor pages, so the layout classes they share with the policy pages are repeated here */
.t2p-blog .t2p-policy-band{display:flex;flex-direction:column;align-items:center;width:100%;padding:48px 15px 80px;background:#fff}
.t2p-blog .t2p-policy-inner{display:flex;flex-direction:column;align-items:flex-start;width:100%;max-width:1080px;padding:0}
.t2p-blog .t2p-policy-title{font-size:32px;font-weight:700;line-height:38.4px;color:#333;margin:16px 0;text-align:left}
.t2p-blog .t2p-policy-copy{width:100%;padding:24px;margin:0 0 24px}
.t2p-blog .t2p-policy-copy p{margin:0 0 16px;font-size:16px;line-height:24px;color:#000}
.t2p-blog h1.t2p-blog-title{font-size:32px!important;font-weight:700!important;line-height:38.4px!important;color:#333!important;text-align:center!important;margin:0 0 48px!important}
.t2p-blog h2.t2p-blog-card__title{font-size:20px!important;font-weight:700!important;line-height:24px!important;color:#000!important;margin:0 0 16px!important}
.t2p-blog h1.t2p-policy-title{font-size:32px!important;font-weight:700!important;line-height:38.4px!important;color:#333!important}
.t2p-header .hfe-nav-menu .current_page_parent>a.hfe-menu-item,.t2p-header .hfe-nav-menu .current-menu-ancestor>a.hfe-menu-item{background:var(--t2p-gold);color:var(--t2p-ink);text-decoration:none}

/* FAQ items as the original: no inner padding (Elementor's accordion item adds 10px), 68px closed height */
details.t2p-faq-item.t2p-faq-item{padding:0!important}
details.t2p-faq-item>summary{padding:0 20px 0 0!important;min-height:66px}

/* ABOUT and CORE VALUES as the original */
.t2p-brand-h b{font-weight:inherit;color:#51427A}
.t2p-brand-h b span{color:#E0AB47}
.t2p-cv-title span{color:#FFC107}
.t2p-check,.t2p-cv-list{list-style:none;margin:0;padding:0}
.t2p-check li{position:relative;padding-left:28px;margin:0 0 10px;font-size:16px;line-height:24px;color:#212529}
.t2p-check li::before{content:"✓";position:absolute;left:0;color:#f4b740;font-weight:700}
.t2p-cv-list li{position:relative;padding-left:24px;margin:0 0 16px;font-size:16px;line-height:24px;color:#000}
.t2p-cv-list li::before{content:"";position:absolute;left:0;top:6px;width:14px;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='%23ffc107' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/></svg>") no-repeat center/contain}

/* Desktop menu stays on one row (it wrapped after a window resize because the UAE menu container re-measured 15px short) */
@media (min-width:1025px){
  .t2p-header .hfe-nav-menu__layout-horizontal .hfe-nav-menu{flex-wrap:nowrap!important}
  .t2p-header .hfe-nav-menu a.hfe-menu-item{white-space:nowrap}
  .t2p-header .hfe-nav-menu,.t2p-header .elementor-widget-navigation-menu{flex-shrink:0}
}

/* APPLY page: gold first words in the form title, original-style (Bootstrap) form fields */
.t2p-apply-title span{color:#E0AB47}
.t2p-policy-title span{color:#E0AB47}
/* APPLY form fields as the original's Bootstrap form: 38px inputs, #ced4da borders, plain radio list, full-width submit */
.srfm-form-container .srfm-block-label,.srfm-form-container .srfm-block-legend{font-size:16px;font-weight:400;line-height:24px;color:#212529;margin:0 0 8px;padding:0}
.srfm-form-container .srfm-required{color:#212529}
.srfm-form-container .srfm-block-single{margin-bottom:16px!important}
.srfm-form-container .srfm-input-common{height:38px;min-height:38px;padding:6px 12px;font-size:16px;line-height:24px;color:#495057;border:1px solid #ced4da;border-radius:4px;background:#fff;box-shadow:none}
.srfm-form-container textarea.srfm-input-common{height:110px}
.srfm-form-container .srfm-input-common::placeholder{color:#6c757d;opacity:1}
.srfm-form-container .srfm-multi-choice-single .srfm-block-content-wrap{border:0;background:none;box-shadow:none;padding:0;min-height:24px;flex-direction:row-reverse;justify-content:flex-end;gap:8px;align-items:center}
.srfm-form-container .srfm-multi-choice-single{margin:0;padding:0;border:0;background:none;box-shadow:none}
.srfm-form-container .srfm-block-wrap.srfm-choice-width-100{gap:0}
.srfm-form-container .srfm-submit-container .wp-block-button{width:100%!important}
.srfm-form-container .srfm-submit-button{width:100%;height:38px;padding:6px 12px;font-size:16px;font-weight:600;line-height:24px;border-radius:4px;background:#51427A;color:#fff;border:1px solid #51427A}
.srfm-form-container{--srfm-input-height:38px;--srfm-row-gap-between-blocks:0px;--srfm-row-gap-between-fields:16px;--srfm-multi-choice-vertical-padding:0px;--srfm-multi-choice-horizontal-padding:0px;--srfm-multi-choice-outer-padding:0px;--srfm-color-input-border:#ced4da;--srfm-color-input-background:#fff;--srfm-color-input-background-hover:#fff;--srfm-color-input-border-hover:#ced4da}
.srfm-form-container .srfm-input-common{height:38px!important;border-radius:4px!important;border-color:#ced4da!important;padding-block:6px!important;padding-right:12px!important}
.srfm-form-container :is(.srfm-input-block,.srfm-email-block,.srfm-number-block,.srfm-textarea-block) .srfm-input-common{padding-left:12px!important}
.srfm-form-container textarea.srfm-input-common{height:110px!important}
.srfm-form-container .srfm-multi-choice-single .srfm-block-content-wrap{border:0!important;padding:0!important;background:none!important;box-shadow:none!important;outline:0!important}
.srfm-form-container .srfm-error-wrap{min-height:0;margin:0}
.srfm-form-container .srfm-block-single{margin-bottom:0!important}
.srfm-form-container .srfm-multi-choice-single{padding:0!important}
.srfm-form-container .srfm-multi-choice-single .srfm-block-content-wrap{min-height:24px!important;height:24px}
.srfm-form-container .srfm-block-wrap.srfm-choice-width-100{margin:0!important}
.srfm-form-container .srfm-block-wrap{margin-top:0}
.srfm-form-container .srfm-block-wrap{margin-top:2px}
.srfm-form-container .srfm-error-wrap{height:auto}
.srfm-form-container .srfm-submit-button{height:38px!important;min-height:38px!important;padding:6px 12px!important}
.srfm-form-container .srfm-error-wrap{padding-bottom:8px}

/* home blog card: white like the original (the grey card put the grey text under 4.5:1) */
.t2p-blogcards .hfe-post-card{background:#fff!important}
/* MOBILE header: the desktop 25px padding and 150px logo overflowed at 320px */
@media (max-width:1024px){
  .t2p-header{padding:12px 16px!important}
  .t2p-header .hfe-site-logo img,.t2p-header .hfe-site-logo-img{width:120px!important;max-width:120px!important}
}

/* the original header has no button (desktop or phone) */
.t2p-header .elementor-widget-button,.t2p-header .hfe-button-wrapper,.t2p-header .elementor-button-wrapper{display:none!important}

/* CALCULATOR as the original's two cards: a white form card and a light-grey results card, 1px #D9E3F0 borders, 12px radius, 25px padding */
.vwtf:not([data-look="original"]) .vwtf__shell{border:0!important;box-shadow:none!important;background:transparent!important;padding:0!important}
.vwtf:not([data-look="original"]) .vwtf__main{background:#fff!important;border:1px solid #d9e3f0!important;border-radius:12px!important;padding:25px!important}
.vwtf:not([data-look="original"]) .vwtf__results{background:#f8f9fa!important;border:1px solid #d9e3f0!important;border-radius:12px!important;padding:25px!important;align-self:start}
.vwtf:not([data-look="original"]) .vwtf__results .vwtf__card{background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}

/* MENU DROPDOWNS. (1) The parent item is highlighted (gold pill) while a page inside its dropdown is shown: in the Ultimate Addons menu a parent's link sits inside
   .hfe-has-submenu-container, so the earlier "li > a" rules missed it. (2) The dropdown of the last item opens right-aligned so it never runs off the screen. */
.t2p-header .hfe-nav-menu li.current-menu-ancestor>.hfe-has-submenu-container>a.hfe-menu-item,
.t2p-header .hfe-nav-menu li.current-menu-parent>.hfe-has-submenu-container>a.hfe-menu-item,
.t2p-header .hfe-nav-menu li.current_page_ancestor>.hfe-has-submenu-container>a.hfe-menu-item,
.t2p-header .hfe-nav-menu li.current-menu-item>.hfe-has-submenu-container>a.hfe-menu-item{background:var(--t2p-gold);color:var(--t2p-ink)}
.t2p-header .hfe-nav-menu li.current-menu-ancestor>.hfe-has-submenu-container>a.hfe-menu-item .sub-arrow,
.t2p-header .hfe-nav-menu li.current-menu-item>.hfe-has-submenu-container>a.hfe-menu-item .sub-arrow{color:var(--t2p-ink)}
@media (min-width:1025px){
  .t2p-header .hfe-nav-menu>li:last-child>ul.sub-menu{left:auto!important;right:0!important}
}

/* ==== NEW HERO DRAFT (draft page "Home (new hero draft)", classes t2p-nh-*). Additive: nothing here matches an existing class.
   Pieces the V4 global classes cannot express: gradient, arrows, ticks, hover and focus. Teal text/fills use #2B8284 (4.54:1 on white);
   the headline's teal #35979A is large text (3.28:1 on #F8F8FB, needs 3:1). ==== */
.t2p-nh-section{background-image:radial-gradient(60% 70% at 88% 45%,rgba(64,166,167,.12),transparent 70%),radial-gradient(40% 55% at 100% 0,rgba(81,66,122,.07),transparent 70%)}
.t2p-nh-title span{color:#35979a}
.t2p-nh-btn::after{content:"";flex:0 0 18px;width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
.t2p-nh-btn-outline::after{display:none}
.t2p-nh-btn-primary:hover{background-color:#fff;color:var(--t2p-purple)}
.t2p-nh-btn-outline:hover{background-color:var(--t2p-purple);border-color:var(--t2p-purple);color:#fff}
.t2p-nh-btn:focus-visible{outline:3px solid var(--t2p-purple);outline-offset:3px}
.t2p-nh-check::before{content:"";flex:0 0 16px;width:16px;height:16px;background:#2b8284;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}
@media (prefers-reduced-motion:reduce){.t2p-nh-btn{transition:none}}

/* ==== NEW HERO DRAFT: header (template "Time2Pay header (new hero draft)", shown on the draft page only; classes t2p-nh-*) ====
   Apply button: deep purple #3A2D6F on gold #E0AB47 is 5.7:1 (the draft's lighter purple on gold is 4.18:1, under 4.5). */
.t2p-nh-header{background:#fff;border-bottom:1px solid #ecebf3}
.t2p-nh-strip{background:#51427a}
.t2p-nh-strip-text p{margin:0;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.5;color:#fff;text-align:center}
.t2p-nh-main .elementor-widget-site-logo{flex:0 0 auto}
.t2p-nh-main .elementor-widget-navigation-menu{flex:1 1 auto}
.t2p-nh-nav .hfe-nav-menu a.hfe-menu-item,.t2p-nh-nav .hfe-nav-menu a.hfe-sub-menu-item{color:#51427a;font-size:17px;font-weight:400;line-height:26px;background:none;border-radius:0;border-bottom:2px solid transparent;padding:6px 4px;margin:0 14px;transition:color .2s ease,border-color .2s ease}
.t2p-nh-nav .hfe-nav-menu li.menu-item>a.hfe-menu-item:hover{color:#3a2d6f;border-bottom-color:#e0ab47;text-decoration:none}
.t2p-nh-nav .hfe-nav-menu .current-menu-item>a.hfe-menu-item,.t2p-nh-nav .hfe-nav-menu .current_page_item>a.hfe-menu-item{color:#51427a;border-bottom-color:#e0ab47;background:none}
.t2p-nh-nav .hfe-nav-menu a:focus-visible,.t2p-nh-apply .elementor-button:focus-visible,.t2p-nh-phone a:focus-visible{outline:3px solid #51427a;outline-offset:3px}
.t2p-nh-phone p{margin:0;text-align:right;line-height:1.25}
.t2p-nh-phone a{display:block;font-size:16px;font-weight:700;color:#51427a;text-decoration:none;white-space:nowrap}
.t2p-nh-phone span{display:block;font-size:12px;font-weight:400;color:#6b6b80;white-space:nowrap}
.t2p-nh-apply .elementor-button{display:inline-flex;align-items:center;gap:10px;background:#e0ab47;color:#3a2d6f;font-size:16px;font-weight:600;line-height:24px;padding:14px 22px;border-radius:6px;white-space:nowrap;transition:filter .2s ease}
.t2p-nh-apply .elementor-button:hover{filter:brightness(.94);color:#3a2d6f}
.t2p-nh-apply .elementor-button::after{content:"";flex:0 0 18px;width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
@media (max-width:1180px){.t2p-nh-phone{display:none}}
@media (max-width:1024px){.t2p-nh-nav .hfe-nav-menu a.hfe-menu-item{margin:0}.t2p-nh-main .elementor-widget-navigation-menu{flex:0 0 auto;margin-left:auto}}
@media (max-width:767px){.t2p-nh-strip-more{display:none}.t2p-nh-apply .elementor-button{padding:9px 14px;font-size:14px}.t2p-nh-apply .elementor-button::after{display:none}}
@media (prefers-reduced-motion:reduce){.t2p-nh-nav a,.t2p-nh-apply .elementor-button{transition:none}}
/* new hero draft header: the actions group sizes to its content so the menu keeps the room, and the menu stays on one line */
.t2p-nh-main .t2p-nh-actions{flex:0 0 auto;width:auto;max-width:none}
.t2p-nh-main .t2p-nh-actions>.elementor-widget{width:auto!important;flex:0 0 auto}
.t2p-nh-main .t2p-nh-nav{flex:1 1 auto;min-width:0;width:auto}
@media (min-width:1025px){.t2p-nh-nav ul.hfe-nav-menu{flex-wrap:nowrap;justify-content:center}}
@media (max-width:1024px){.t2p-nh-nav ul.hfe-nav-menu{flex-direction:column;align-items:stretch}.t2p-nh-nav .hfe-nav-menu a.hfe-menu-item{display:block;margin:0;padding:12px 20px}}
@media (max-width:1024px){.t2p-nh-main .t2p-nh-nav{flex:0 0 auto}}
/* new hero draft header on tablet and phone: the header button group is hidden and "Apply now" appears in the dropdown menu instead */
.t2p-nh-nav .menu-item.t2p-nh-menu-apply{display:none}
@media (max-width:1024px){
  .t2p-nh-main .t2p-nh-actions{display:none}
  .t2p-nh-nav .menu-item.t2p-nh-menu-apply{display:list-item}
  .t2p-nh-nav .t2p-nh-menu-apply>a.hfe-menu-item{display:inline-block;background:#e0ab47;color:#3a2d6f;font-weight:600;border-radius:6px;border-bottom-color:transparent;padding:10px 20px;margin:8px 16px}
  .t2p-nh-main .t2p-nh-nav{flex:1 1 auto;width:auto}
}
@media (max-width:1024px){
  .t2p-nh-nav .hfe-nav-menu li.t2p-nh-menu-apply>a.hfe-menu-item{display:inline-block;width:auto;background:#e0ab47!important;color:#3a2d6f;font-weight:600;border-radius:6px;border-bottom:0;padding:10px 22px;margin:12px 20px 16px}
  .t2p-nh-nav .hfe-nav-menu .hfe-has-submenu-container{display:flex;align-items:center;justify-content:space-between}
  .t2p-nh-nav .hfe-nav-menu .hfe-has-submenu-container>a.hfe-menu-item{flex:1 1 auto}
}

/* ==== NEW HERO DRAFT, photo variant (draft page "Home (new hero draft, photo)"): the photograph is the section background, with nothing laid over it ==== */
@media (max-width:1024px){
  /* stacked layout (tablet and phone): no text over the photograph. It becomes a banner above the copy, edge to edge */
  .t2p-nh-section-photo .t2p-nh-bg-img{position:static!important;z-index:auto!important;width:calc(100% + 48px)!important;max-width:none!important;height:clamp(200px,42vw,380px)!important;margin:-56px -24px 28px!important;object-fit:cover!important;object-position:62% 38%!important}
}
@media (max-width:767px){
  .t2p-nh-section-photo .t2p-nh-bg-img{width:calc(100% + 40px)!important;height:clamp(190px,56vw,300px)!important;margin:-40px -20px 24px!important}
}

/* ==== NEW HERO DRAFT, small-screen fixes found in the device test ==== */
@media (max-width:360px){.t2p-nh-title{font-size:28px!important}}
@media (max-width:1024px){.t2p-nh-nav .hfe-nav-menu__toggle{min-width:44px;min-height:44px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin-left:auto!important;margin-right:0!important}}