/* TLA Partner Hub public and member-facing foundation styles. */ .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main { background: var(--tla-ph-bg); color: var(--tla-ph-text); font-family: var(--tla-ph-font); font-size: var(--tla-ph-body); letter-spacing: var(--tla-ph-letter-spacing); line-height: var(--tla-ph-line-height-body); padding: clamp(1.25rem, 2.4vw, 2.5rem); } .tla-ph-shell *, .tla-ph-component * { box-sizing: border-box; } .tla-ph-shell h1, .tla-ph-shell h2, .tla-ph-shell h3, .tla-ph-component h1, .tla-ph-component h2, .tla-ph-component h3 { color: var(--tla-ph-heading); font-family: var(--tla-ph-font); letter-spacing: var(--tla-ph-letter-spacing-tight); line-height: var(--tla-ph-line-height-tight); } .tla-ph-shell p, .tla-ph-shell small, .tla-ph-shell label, .tla-ph-shell td, .tla-ph-shell th, .tla-ph-shell input, .tla-ph-shell textarea, .tla-ph-shell select, .tla-ph-shell button, .tla-ph-component p, .tla-ph-component small, .tla-ph-component label, .tla-ph-component td, .tla-ph-component th, .tla-ph-component input, .tla-ph-component textarea, .tla-ph-component select, .tla-ph-component button { font-family: inherit; } .tla-ph-shell-inner { margin: 0 auto; max-width: calc(var(--tla-ph-wrap) + 2rem); overflow-x: clip; padding-inline: clamp(0.75rem, 2vw, 1.25rem); width: min(100%, calc(var(--tla-ph-wrap) + 2rem)); } .tla-ph-frontend-hero { background: linear-gradient(135deg, var(--tla-ph-surface), var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 25px; box-shadow: var(--tla-ph-shadow-lg); overflow: hidden; padding: clamp(28px, 5vw, 62px); position: relative; } .tla-ph-frontend-hero::after { background: var(--tla-ph-grad); border-radius: 50%; content: ""; filter: blur(75px); height: 260px; opacity: .15; position: absolute; right: -70px; top: -130px; width: 260px; } .tla-ph-frontend-hero > * { position: relative; z-index: 1; } .tla-ph-frontend-eyebrow { align-items: center; color: var(--tla-ph-blue); display: inline-flex; font-size:0.7rem; font-weight: 850; gap: 8px; letter-spacing: .11em; text-transform: uppercase; } .tla-ph-frontend-eyebrow::before { background: currentColor; border-radius: 2px; content: ""; height: 2px; width: 20px; } .tla-ph-frontend-hero h1 { font-size: clamp(32px, 5.2vw, 64px); font-weight: 850; letter-spacing: -.045em; line-height: 1.02; margin: 14px 0 17px; max-width: 900px; } .tla-ph-frontend-hero p { color: var(--tla-ph-muted); font-size: clamp(14px, 1.5vw, 18px); line-height: 1.7; margin: 0; max-width: 780px; } .tla-ph-gradient-text { background: var(--tla-ph-grad); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tla-ph-frontend-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; } .tla-ph-frontend-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: var(--tla-ph-radius); box-shadow: 0 2px 14px rgba(20,17,70,.03); color: inherit; padding: 24px; text-decoration: none; } .tla-ph-frontend-card h2, .tla-ph-frontend-card h3 { margin: 10px 0 8px; } .tla-ph-frontend-card p { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.6; } .tla-ph-frontend-card small { color: var(--tla-ph-muted-light); font-size:0.7rem; font-weight: 750; } .tla-ph-frontend-icon { background: var(--tla-ph-pastel-blue); border: 1px solid rgba(10,144,246,.14); border-radius: 14px; color: var(--tla-ph-blue); display: grid; height: 48px; place-items: center; width: 48px; } .tla-ph-frontend-pill { background: rgba(10,144,246,.09); border-radius: 999px; color: var(--tla-ph-blue); display: inline-flex; font-size:0.68rem; font-weight: 850; letter-spacing: .06em; padding: 6px 9px; text-transform: uppercase; } .tla-ph-frontend-pill.is-active { background: rgba(5,150,105,.10); color: var(--tla-ph-green); } .tla-ph-feature-list { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0,1fr)); list-style: none; margin: 22px 0 0; padding: 0; } .tla-ph-feature-list li { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius:12px; color: var(--tla-ph-muted); display: flex; font-size: 12px; gap: 9px; padding: 11px 13px; } .tla-ph-feature-list li::before { background: rgba(5,150,105,.10); border-radius: 6px; color: var(--tla-ph-green); content: "✓"; display: grid; flex: 0 0 20px; font-size: 11px; font-weight: 900; height: 20px; place-items: center; } .tla-ph-coming-soon { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 16px; color: var(--tla-ph-muted); font-family: var(--tla-ph-font); padding: 20px; } @media (max-width: 900px) { .tla-ph-frontend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 640px) { .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main { padding: 1rem 0; } .tla-ph-shell-inner { padding-inline: 1rem; } .tla-ph-frontend-grid, .tla-ph-feature-list { grid-template-columns: 1fr; } .tla-ph-frontend-hero { border-radius: 18px; padding: 1.35rem 1rem; } } /* Version 0.3.0 — membership-aware calls to action. */ .tla-ph-cta-card { align-items: center; background: linear-gradient(135deg, var(--tla-ph-surface), var(--tla-ph-soft)); display: flex; gap: 28px; justify-content: space-between; overflow: hidden; position: relative; } .tla-ph-cta-card::after { background: var(--tla-ph-grad); border-radius: 50%; content: ""; filter: blur(55px); height: 150px; opacity: .1; position: absolute; right: -40px; top: -70px; width: 150px; } .tla-ph-cta-card > * { position: relative; z-index: 1; } .tla-ph-cta-card h2 { font-size: clamp(22px, 3vw, 34px); letter-spacing: -.035em; margin: 10px 0 8px; } .tla-ph-cta-card p { margin-bottom: 0; max-width: 760px; } .tla-ph-frontend-actions { align-items: center; display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 10px; } .tla-ph-frontend-button { align-items: center; border-radius: 999px; display: inline-flex; font-size: 12px; font-weight: 800; justify-content: center; min-height: 44px; padding: 10px 18px; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; } .tla-ph-frontend-button:hover { transform: translateY(-1px); } .tla-ph-frontend-button-primary { background: var(--tla-ph-grad); box-shadow: 0 12px 28px rgba(223,41,211,.2); color: #fff; } .tla-ph-frontend-button-primary:hover { color: #fff; filter: brightness(1.04); } .tla-ph-frontend-button-secondary { background: var(--tla-ph-surface); border: 1px solid rgba(10,144,246,.24); color: var(--tla-ph-blue); } .tla-ph-dynamic-cta[data-state="unknown"] .tla-ph-frontend-pill, .tla-ph-dynamic-cta[data-state="corporate_disabled"] .tla-ph-frontend-pill { background: rgba(217,119,6,.11); color: var(--tla-ph-amber); } .tla-ph-dynamic-cta[data-state="eligible"] .tla-ph-frontend-pill, .tla-ph-dynamic-cta[data-state="active"] .tla-ph-frontend-pill { background: rgba(5,150,105,.10); color: var(--tla-ph-green); } @media (max-width: 760px) { .tla-ph-cta-card { align-items: flex-start; flex-direction: column; } .tla-ph-frontend-actions { width: 100%; } .tla-ph-frontend-button { width: 100%; } } /* Version 0.4.0 — partner dashboard and save-and-resume onboarding. */ .tla-ph-alert { border: 1px solid var(--tla-ph-border); border-radius: 14px; font-size: 13px; line-height: 1.55; margin: 0 0 18px; padding: 14px 16px; } .tla-ph-alert-success { background: rgba(5,150,105,.08); border-color: rgba(5,150,105,.2); color: var(--tla-ph-green); } .tla-ph-alert-info { background: rgba(10,144,246,.07); border-color: rgba(10,144,246,.2); color: #075f9d; } .tla-ph-alert-error { background: rgba(220,38,38,.07); border-color: rgba(220,38,38,.2); color: var(--tla-ph-red); } .tla-ph-onboarding-head, .tla-ph-dashboard-hero { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: var(--tla-ph-shadow); display: flex; gap: 20px; justify-content: space-between; min-width: 0; overflow: hidden; padding: clamp(20px,3.2vw,32px); position: relative; width: 100%; } .tla-ph-dashboard-hero > div:first-child { flex: 1 1 auto; min-width: 0; } .tla-ph-dashboard-hero > .tla-ph-dashboard-status { flex: 0 0 auto; max-width: min(100%, 300px); min-width: 0; } .tla-ph-onboarding-head::after, .tla-ph-dashboard-hero::after { background: var(--tla-ph-grad); border-radius: 50%; content: ""; filter: blur(70px); height: 220px; opacity: .11; position: absolute; right: -70px; top: -120px; width: 220px; } .tla-ph-onboarding-head > *, .tla-ph-dashboard-hero > * { position: relative; z-index: 1; } .tla-ph-onboarding-head h1, .tla-ph-dashboard-hero h1 { font-size: clamp(30px,4.5vw,52px); letter-spacing: -.045em; line-height: 1.04; margin: 12px 0; max-width: 100%; overflow-wrap: anywhere; white-space: normal; } .tla-ph-onboarding-head p, .tla-ph-dashboard-hero p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; max-width: 760px; } .tla-ph-progress-orb { align-items: center; background: var(--tla-ph-surface); border: 1px solid rgba(10,144,246,.18); border-radius: 50%; box-shadow: 0 16px 40px rgba(10,144,246,.12); display: flex; flex: 0 0 112px; flex-direction: column; height: 112px; justify-content: center; } .tla-ph-progress-orb strong { color: var(--tla-ph-blue); font-size: 27px; letter-spacing: -.03em; } .tla-ph-progress-orb span { color: var(--tla-ph-muted-light); font-size:0.7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; } .tla-ph-progress-track { background: var(--tla-ph-soft); border-radius: 999px; height: 8px; margin: 18px 0 26px; overflow: hidden; } .tla-ph-progress-track > span { background: var(--tla-ph-grad); border-radius: inherit; display: block; height: 100%; transition: width .25s ease; } .tla-ph-onboarding-layout { align-items: start; display: grid; gap: 22px; grid-template-columns: minmax(235px,290px) minmax(0,1fr); } .tla-ph-step-nav { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; box-shadow: 0 10px 28px rgba(21,18,70,.05); display: grid; gap: 4px; max-height: calc(100vh - 120px); overflow: auto; padding: 10px; position: sticky; top: 28px; } .tla-ph-step-link { align-items: center; border: 1px solid transparent; border-radius: 12px; color: var(--tla-ph-text); display: flex; gap: 11px; padding: 10px; text-decoration: none; } .tla-ph-step-link:hover { background: var(--tla-ph-soft); color: var(--tla-ph-heading); } .tla-ph-step-link.is-active { background: var(--tla-ph-pastel-blue); border-color: rgba(10,144,246,.18); } .tla-ph-step-link.has-error { background: rgba(220,38,38,.05); border-color: rgba(220,38,38,.16); } .tla-ph-step-number { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 9px; color: var(--tla-ph-muted); display: flex; flex: 0 0 30px; font-size: 11px; font-weight: 850; height: 30px; justify-content: center; } .tla-ph-step-link.is-active .tla-ph-step-number { background: var(--tla-ph-grad-blue); border-color: transparent; color: #fff; } .tla-ph-step-link.is-complete .tla-ph-step-number { background: rgba(5,150,105,.1); border-color: rgba(5,150,105,.18); color: var(--tla-ph-green); } .tla-ph-step-link strong { display: block; font-size: 12px; line-height: 1.25; } .tla-ph-step-link small { color: var(--tla-ph-muted-light); display: block; font-size:0.68rem; margin-top: 3px; } .tla-ph-wizard-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: var(--tla-ph-shadow); min-width: 0; overflow: hidden; padding: clamp(22px,3.5vw,40px); } .tla-ph-wizard-title { border-bottom: 1px solid var(--tla-ph-divider); margin-bottom: 26px; padding-bottom: 22px; } .tla-ph-wizard-title > span { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-wizard-title h2 { font-size: clamp(25px,3vw,37px); letter-spacing: -.035em; margin: 8px 0 9px; } .tla-ph-wizard-title p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; } .tla-ph-form-grid { display: grid; gap: 22px; } .tla-ph-form-field > label:first-child { color: var(--tla-ph-heading); display: block; font-size: 13px; font-weight: 780; margin-bottom: 8px; } .tla-ph-required { color: var(--tla-ph-pink); margin-left: 4px; } .tla-ph-input, .tla-ph-select, .tla-ph-textarea { background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius: 12px; color: var(--tla-ph-text); font-family: var(--tla-ph-font); font-size: 14px; min-height: 48px; padding: 11px 13px; transition: border-color .18s ease, box-shadow .18s ease; width: 100%; } .tla-ph-textarea { min-height: 150px; resize: vertical; } .tla-ph-input:focus, .tla-ph-select:focus, .tla-ph-textarea:focus { border-color: rgba(10,144,246,.55); box-shadow: 0 0 0 4px rgba(10,144,246,.08); outline: none; } .tla-ph-form-field.has-error .tla-ph-input, .tla-ph-form-field.has-error .tla-ph-select, .tla-ph-form-field.has-error .tla-ph-textarea { border-color: rgba(220,38,38,.45); } .tla-ph-field-help { color: var(--tla-ph-muted-light); font-size: 11px; line-height: 1.5; margin: 7px 0 0; } .tla-ph-field-error { color: var(--tla-ph-red); font-size: 11px; font-weight: 700; margin: 7px 0 0; } .tla-ph-choice-row { display: flex; flex-wrap: wrap; gap: 10px; } .tla-ph-choice-row label, .tla-ph-check-consent { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 12px; cursor: pointer; display: flex; gap: 9px; min-height: 46px; padding: 10px 13px; } .tla-ph-check-consent { align-items: flex-start; line-height: 1.5; } .tla-ph-choice-row input, .tla-ph-check-consent input, .tla-ph-option-card input { accent-color: var(--tla-ph-blue); margin-top: 2px; } .tla-ph-option-grid { display: grid; gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-option-card { align-items: flex-start; background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius:14px; cursor: pointer; display: flex; gap: 10px; padding: 13px; } .tla-ph-option-card:has(input:checked) { background: var(--tla-ph-pastel-blue); border-color: rgba(10,144,246,.28); } .tla-ph-option-card strong { display: block; font-size: 12px; } .tla-ph-option-card small { color: var(--tla-ph-muted); display: block; font-size:0.7rem; line-height: 1.45; margin-top: 4px; } .tla-ph-repeater { display: grid; gap: 13px; } .tla-ph-repeater-rows { display: grid; gap: 14px; } .tla-ph-repeater-row { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 15px; margin: 0; padding: 16px; } .tla-ph-repeater-row legend { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 850; letter-spacing: .08em; padding: 0 6px; text-transform: uppercase; } .tla-ph-repeater-grid { display: grid; gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-repeater-grid label > span { color: var(--tla-ph-muted); display: block; font-size:0.7rem; font-weight: 750; margin-bottom: 5px; } .tla-ph-repeater-public { align-items: center; display: flex; gap: 8px; grid-column: 1/-1; } .tla-ph-add-row, .tla-ph-remove-row { background: transparent; border: 1px solid rgba(10,144,246,.26); border-radius: 999px; color: var(--tla-ph-blue); cursor: pointer; font-family: var(--tla-ph-font); font-size: 11px; font-weight: 800; padding: 8px 13px; } .tla-ph-remove-row { border-color: rgba(220,38,38,.2); color: var(--tla-ph-red); margin-top: 12px; } .tla-ph-inline-notice, .tla-ph-submit-assurance { background: var(--tla-ph-pastel-mix); border: 1px solid rgba(223,41,211,.14); border-radius:14px; color: var(--tla-ph-muted); font-size: 12px; line-height: 1.6; margin-top: 12px; padding: 13px 15px; } .tla-ph-document-list { display: grid; gap: 8px; grid-template-columns: repeat(2,minmax(0,1fr)); list-style: none; margin: 0 0 16px; padding: 0; } .tla-ph-document-list li { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 10px; font-size: 11px; padding: 10px 12px; } .tla-ph-document-list li::before { color: var(--tla-ph-green); content: "✓"; font-weight: 900; margin-right: 7px; } .tla-ph-wizard-actions { align-items: center; border-top: 1px solid var(--tla-ph-divider); display: flex; gap: 12px; justify-content: space-between; margin-top: 28px; padding-top: 22px; } .tla-ph-wizard-actions > div { display: flex; flex-wrap: wrap; gap: 10px; } .tla-ph-review-grid { display: grid; gap: 14px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-review-card { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 15px; padding: 16px; } .tla-ph-review-card > div:first-child { align-items: center; display: flex; gap: 10px; justify-content: space-between; } .tla-ph-review-card > div:first-child span { color: var(--tla-ph-heading); font-size: 12px; font-weight: 850; } .tla-ph-review-card > div:first-child a { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 800; } .tla-ph-review-card dl { margin: 13px 0 0; } .tla-ph-review-card dl > div { border-top: 1px solid var(--tla-ph-divider); display: grid; gap: 10px; grid-template-columns: minmax(100px,.8fr) 1.2fr; padding: 9px 0; } .tla-ph-review-card dt { color: var(--tla-ph-muted-light); font-size:0.68rem; font-weight: 750; } .tla-ph-review-card dd { color: var(--tla-ph-text); font-size:0.7rem; margin: 0; overflow-wrap: anywhere; } .tla-ph-review-warning { color: var(--tla-ph-red); font-size:0.7rem; font-weight: 800; } .tla-ph-submitted-card .tla-ph-frontend-actions { margin-top: 24px; } .tla-ph-submission-meta { display: grid; gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 22px; max-width: 700px; } .tla-ph-submission-meta > div { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 12px; padding: 13px; } .tla-ph-submission-meta span { color: var(--tla-ph-muted-light); display: block; font-size:0.68rem; font-weight: 800; text-transform: uppercase; } .tla-ph-submission-meta strong { display: block; font-size: 13px; margin-top: 4px; } .tla-ph-dashboard-status { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 15px; min-width: 210px; padding: 15px; text-align: right; } .tla-ph-dashboard-status span, .tla-ph-dashboard-status small { color: var(--tla-ph-muted-light); display: block; font-size:0.68rem; font-weight: 800; text-transform: uppercase; } .tla-ph-dashboard-status strong { display: block; font-size: 17px; margin: 5px 0; } .tla-ph-dashboard-metrics { display: grid; gap: 15px; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 20px 0; } .tla-ph-dashboard-metrics > div { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 16px; box-shadow: 0 8px 24px rgba(21,18,70,.04); padding: 17px; } .tla-ph-dashboard-metrics span, .tla-ph-dashboard-metrics small { color: var(--tla-ph-muted-light); display: block; font-size:0.68rem; font-weight: 750; } .tla-ph-dashboard-metrics strong { display: block; font-size: 18px; margin: 6px 0; } .tla-ph-dashboard-metrics .tla-ph-progress-track { height: 6px; margin: 9px 0 0; } .tla-ph-dashboard-grid { display: grid; gap: 16px; grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-dashboard-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; box-shadow: 0 8px 25px rgba(21,18,70,.04); display: flex; flex-direction: column; gap: 12px; min-height: 220px; padding: 18px; } .tla-ph-dashboard-card > .dashicons { align-items: center; background: var(--tla-ph-pastel-blue); border-radius:14px; color: var(--tla-ph-blue); display: flex; font-size: 23px; height: 46px; justify-content: center; width: 46px; } .tla-ph-dashboard-card h2 { font-size: 18px; letter-spacing: -.025em; margin: 0 0 7px; } .tla-ph-dashboard-card p { color: var(--tla-ph-muted); font-size: 12px; line-height: 1.6; margin: 0; } .tla-ph-dashboard-card .tla-ph-frontend-button, .tla-ph-card-lock, .tla-ph-card-version { margin-top: auto; } .tla-ph-card-lock, .tla-ph-card-version { color: var(--tla-ph-muted-light); font-size:0.7rem; font-weight: 800; text-transform: uppercase; } .tla-ph-dashboard-card.is-future { background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-soft)); } .tla-ph-dashboard-assurance { align-items: flex-start; background: var(--tla-ph-pastel-violet); border: 1px solid rgba(223,41,211,.14); border-radius: 16px; display: flex; gap: 13px; margin-top: 20px; padding: 17px; } .tla-ph-dashboard-assurance .dashicons { color: var(--tla-ph-violet); } .tla-ph-dashboard-assurance strong { display: block; font-size: 12px; } .tla-ph-dashboard-assurance p { color: var(--tla-ph-muted); font-size: 11px; line-height: 1.55; margin: 5px 0 0; } @media (max-width: 1050px) { .tla-ph-onboarding-layout { grid-template-columns: 1fr; } .tla-ph-step-nav { display: flex; max-height: none; overflow-x: auto; position: static; } .tla-ph-step-link { flex: 0 0 190px; } .tla-ph-dashboard-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 760px) { .tla-ph-onboarding-head, .tla-ph-dashboard-hero { align-items: flex-start; flex-direction: column; } .tla-ph-progress-orb { height: 86px; width: 86px; flex-basis: 86px; } .tla-ph-progress-orb strong { font-size: 22px; } .tla-ph-option-grid, .tla-ph-review-grid, .tla-ph-dashboard-metrics, .tla-ph-dashboard-grid, .tla-ph-document-list, .tla-ph-submission-meta { grid-template-columns: 1fr; } .tla-ph-repeater-grid { grid-template-columns: 1fr; } .tla-ph-wizard-actions { align-items: stretch; flex-direction: column; } .tla-ph-wizard-actions > div { width: 100%; } .tla-ph-wizard-actions .tla-ph-frontend-button { flex: 1 1 100%; } .tla-ph-dashboard-status { min-width: 0; text-align: left; width: 100%; } } /* Version 0.5.0 — partner-facing review and information-request states. */ .tla-ph-partner-message { align-items: flex-start; background: var(--tla-ph-pastel-blue); border: 1px solid rgba(10,144,246,.18); border-radius: 16px; display: flex; gap: 13px; margin: 0 0 18px; padding: 16px 18px; } .tla-ph-partner-message > .dashicons { color: var(--tla-ph-blue); flex: 0 0 24px; font-size: 24px; height: 24px; width: 24px; } .tla-ph-partner-message strong { color: var(--tla-ph-heading); display: block; font-size: 13px; } .tla-ph-partner-message p { color: var(--tla-ph-text); font-size: 12px; line-height: 1.65; margin: 6px 0; } .tla-ph-partner-message small { color: var(--tla-ph-muted-light); display: block; font-size:0.68rem; } .tla-ph-partner-message-action { background: linear-gradient(135deg, rgba(255,247,237,.96), rgba(255,255,255,.96)); border-color: rgba(217,119,6,.2); } .tla-ph-partner-message-action > .dashicons { color: #b45309; } /* Version 0.5.1 — theme integration and light-mode flush correction. */ body:has(.tla-ph-shell), body:has(.tla-ph-component) { background: var(--tla-ph-bg) !important; } body:has(.tla-ph-shell) main, body:has(.tla-ph-component) main, body:has(.tla-ph-shell) .site-main, body:has(.tla-ph-component) .site-main, body:has(.tla-ph-shell) .content-area, body:has(.tla-ph-component) .content-area { background: var(--tla-ph-bg) !important; margin-top: 0 !important; padding-top: 0 !important; } html:not([data-tla-theme="dark"]) .tla-ph-shell, html:not([data-tla-theme="dark"]) .tla-ph-component { background: #f7f8fc; } /* Version 0.5.3 — one-time Partner Hub action notifications. */ .tla-ph-flash-notice { align-items: center; background: rgba(255,255,255,.98); border: 1px solid rgba(10,144,246,.18); border-left: 4px solid var(--tla-ph-blue); border-radius: 14px; box-shadow: 0 14px 38px rgba(15,23,42,.10); color: var(--tla-ph-heading); display: flex; gap: 11px; margin: 0 0 18px; padding: 14px 46px 14px 16px; position: relative; transition: opacity .25s ease, transform .25s ease; } .tla-ph-flash-notice > .dashicons { color: var(--tla-ph-blue); flex: 0 0 22px; height: 22px; width: 22px; } .tla-ph-flash-notice strong { font-size: 13px; line-height: 1.45; } .tla-ph-flash-success { background: linear-gradient(135deg, rgba(236,253,245,.98), rgba(255,255,255,.98)); border-color: rgba(5,150,105,.24); border-left-color: #059669; } .tla-ph-flash-success > .dashicons { color: #059669; } .tla-ph-flash-error { background: linear-gradient(135deg, rgba(254,242,242,.98), rgba(255,255,255,.98)); border-color: rgba(220,38,38,.22); border-left-color: #dc2626; } .tla-ph-flash-error > .dashicons { color: #dc2626; } .tla-ph-flash-warning { background: linear-gradient(135deg, rgba(255,247,237,.98), rgba(255,255,255,.98)); border-color: rgba(217,119,6,.22); border-left-color: #d97706; } .tla-ph-flash-dismiss { appearance: none; background: transparent; border: 0; color: var(--tla-ph-muted); cursor: pointer; font-size: 24px; line-height: 1; padding: 6px; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); } .tla-ph-flash-notice.is-hiding { opacity: 0; transform: translateY(-8px); } html[data-tla-theme="dark"] .tla-ph-flash-notice { background: rgba(11,16,36,.98); } /* Version 0.6.0 — secure verification workspace and reliable light-mode header flush. */ html:not([data-tla-theme="dark"]) .tla-ph-shell, html:not([data-tla-theme="dark"]) .tla-ph-component { position: relative; z-index: 1; } html:not([data-tla-theme="dark"]) .tla-ph-shell::before, html:not([data-tla-theme="dark"]) .tla-ph-component::before { background: #f7f8fc; content: ""; height: 14px; left: 0; pointer-events: none; position: absolute; right: 0; top: -14px; z-index: -1; } body:has(.tla-ph-shell) #content, body:has(.tla-ph-shell) .site-content, body:has(.tla-ph-shell) .entry-content, body:has(.tla-ph-shell) .page-content, body:has(.tla-ph-shell) .elementor-location-single { background: var(--tla-ph-bg) !important; margin-top: 0 !important; padding-top: 0 !important; } .tla-ph-frontend-back { color: var(--tla-ph-blue); display: inline-block; font-size: 12px; font-weight: 800; margin: 0 0 16px; text-decoration: none; } .tla-ph-verification-workspace { display: grid; gap: 20px; } .tla-ph-verification-head { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 22px; display: flex; gap: 20px; justify-content: space-between; padding: 28px; } .tla-ph-verification-head h2 { font-size: clamp(26px,4vw,42px); letter-spacing: -.04em; margin: 10px 0; } .tla-ph-verification-head p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; max-width: 760px; } .tla-ph-verification-score { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; display: flex; flex: 0 0 130px; flex-direction: column; padding: 19px; } .tla-ph-verification-score strong { color: var(--tla-ph-blue); font-size: 28px; } .tla-ph-verification-score span { color: var(--tla-ph-muted-light); font-size:0.68rem; font-weight: 850; text-transform: uppercase; } .tla-ph-verification-list { display: grid; gap: 14px; } .tla-ph-verification-item { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; box-shadow: 0 4px 18px rgba(21,18,70,.04); padding: 20px; } .tla-ph-verification-summary { align-items: flex-start; display: flex; gap: 15px; justify-content: space-between; } .tla-ph-verification-summary > div { padding-left: 20px; position: relative; } .tla-ph-status-dot { background: var(--tla-ph-muted-light); border-radius: 50%; height: 9px; left: 0; position: absolute; top: 7px; width: 9px; } .status-approved .tla-ph-status-dot { background: var(--tla-ph-green); } .status-pending_review .tla-ph-status-dot { background: var(--tla-ph-blue); } .status-replacement_requested .tla-ph-status-dot, .status-rejected .tla-ph-status-dot, .status-failed .tla-ph-status-dot { background: var(--tla-ph-amber); } .tla-ph-verification-summary h3 { font-size: 17px; margin: 0 0 5px; } .tla-ph-verification-summary p { color: var(--tla-ph-muted); font-size: 12px; margin: 0; } .tla-ph-document-row { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 12px; display: flex; gap: 12px; justify-content: space-between; margin-top: 15px; padding: 12px 14px; } .tla-ph-document-row strong { display: block; font-size: 12px; overflow-wrap: anywhere; } .tla-ph-document-row small { color: var(--tla-ph-muted); display: block; font-size:0.68rem; margin-top: 3px; } .tla-ph-text-link { color: var(--tla-ph-blue); font-size: 11px; font-weight: 800; } .tla-ph-upload-form { align-items: end; border-top: 1px solid var(--tla-ph-divider); display: grid; gap: 12px; grid-template-columns: minmax(0,1fr) minmax(150px,.35fr) auto; margin-top: 16px; padding-top: 16px; } .tla-ph-upload-form label > span { color: var(--tla-ph-muted); display: block; font-size:0.7rem; font-weight: 750; margin-bottom: 6px; } .tla-ph-upload-form input { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 10px; color: var(--tla-ph-text); min-height: 42px; padding: 8px 10px; width: 100%; } @media(max-width:760px){.tla-ph-verification-head{align-items:flex-start;flex-direction:column}.tla-ph-verification-score{align-items:flex-start;width:100%}.tla-ph-upload-form{grid-template-columns:1fr}.tla-ph-verification-summary{align-items:flex-start;flex-direction:column}.tla-ph-document-row{align-items:flex-start;flex-direction:column}} /* 0.6.0 light-mode flush hardening for TLA global page templates. */ html:not([data-tla-theme="dark"]) body.page .tla-ph-shell:first-child, html:not([data-tla-theme="dark"]) body.page .tla-ph-component:first-child { margin-top: 0 !important; } html:not([data-tla-theme="dark"]) body:has(.tla-ph-onboarding), html:not([data-tla-theme="dark"]) body:has(.tla-ph-dashboard), html:not([data-tla-theme="dark"]) body:has(.tla-ph-verification-workspace) { background: var(--tla-ph-bg) !important; } html:not([data-tla-theme="dark"]) body:has(.tla-ph-onboarding) .site-main, html:not([data-tla-theme="dark"]) body:has(.tla-ph-dashboard) .site-main, html:not([data-tla-theme="dark"]) body:has(.tla-ph-verification-workspace) .site-main { border-top: 0 !important; margin-top: 0 !important; padding-top: 0 !important; } /* Hide empty theme page-title bands on Partner Hub workspace pages only. */ body:has(.tla-ph-onboarding) .entry-header, body:has(.tla-ph-onboarding) .page-header, body:has(.tla-ph-dashboard) .entry-header, body:has(.tla-ph-dashboard) .page-header, body:has(.tla-ph-verification-workspace) .entry-header, body:has(.tla-ph-verification-workspace) .page-header { display: none !important; } /* Version 0.6.1 — verification completion, multi-upload and progress states. */ .tla-ph-frontend-button-primary, .tla-ph-frontend-button-primary:visited, .tla-ph-frontend-button-primary:hover, .tla-ph-frontend-button-primary:focus, button.tla-ph-frontend-button-primary, button.tla-ph-frontend-button-primary:hover, button.tla-ph-frontend-button-primary:focus { color: #fff !important; -webkit-text-fill-color: #fff !important; text-shadow: 0 1px 1px rgba(0,0,0,.16); } .tla-ph-frontend-button-primary:disabled { color: rgba(255,255,255,.72) !important; -webkit-text-fill-color: rgba(255,255,255,.72) !important; cursor: not-allowed; filter: grayscale(.2); opacity: .72; } /* Partner workspace buttons use light surfaces with high-contrast dark text. */ .tla-ph-shell :where(.tla-ph-frontend-button,.tla-ph-button,button[type="submit"],input[type="submit"]):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu) { background: #ffffff !important; border: 1px solid rgba(31,38,70,.18) !important; box-shadow: 0 8px 20px rgba(21,28,59,.08) !important; color: #111326 !important; -webkit-text-fill-color: #111326 !important; } .tla-ph-shell :where(.tla-ph-frontend-button,.tla-ph-button,button[type="submit"],input[type="submit"]):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu):hover, .tla-ph-shell :where(.tla-ph-frontend-button,.tla-ph-button,button[type="submit"],input[type="submit"]):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu):focus-visible { background: #eef5ff !important; border-color: rgba(10,144,246,.42) !important; color: #090b1c !important; -webkit-text-fill-color: #090b1c !important; } .tla-ph-verification-shell { padding-top: clamp(58px, 6vw, 78px); } .tla-ph-verification-shell .tla-ph-flash-notice { margin-bottom: 18px; position: relative; z-index: 4; } .tla-ph-verification-metrics { display: grid; gap: 12px; grid-template-columns: repeat(4,minmax(0,1fr)); } .tla-ph-verification-metrics > div { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 15px; padding: 15px 17px; } .tla-ph-verification-metrics span { color: var(--tla-ph-muted); display: block; font-size:0.7rem; font-weight: 750; margin-bottom: 6px; } .tla-ph-verification-metrics strong { color: var(--tla-ph-heading); font-size: 23px; letter-spacing: -.03em; } .tla-ph-verification-batch-form { display: grid; gap: 18px; } .tla-ph-verification-completion { align-items: flex-start; background: var(--tla-ph-pastel-blue); border: 1px solid rgba(10,144,246,.18); border-radius: 17px; display: flex; gap: 13px; padding: 17px 19px; } .tla-ph-verification-completion > .dashicons { color: var(--tla-ph-blue); flex: 0 0 24px; font-size: 24px; height: 24px; width: 24px; } .tla-ph-verification-completion strong { color: var(--tla-ph-heading); display: block; font-size: 13px; } .tla-ph-verification-completion p { color: var(--tla-ph-muted); font-size: 11px; line-height: 1.6; margin: 5px 0 0; } .tla-ph-verification-completion.is-complete { background: rgba(236,253,245,.88); border-color: rgba(5,150,105,.22); } .tla-ph-verification-completion.is-complete > .dashicons { color: var(--tla-ph-green); } .tla-ph-verification-completion.needs-action { background: rgba(255,247,237,.9); border-color: rgba(217,119,6,.22); } .tla-ph-verification-completion.needs-action > .dashicons { color: var(--tla-ph-amber); } .tla-ph-verification-footer { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 18px; display: flex; gap: 20px; justify-content: space-between; padding: 18px; } .tla-ph-verification-footer > div:first-child strong { color: var(--tla-ph-heading); display: block; font-size: 12px; } .tla-ph-verification-footer > div:first-child span { color: var(--tla-ph-muted); display: block; font-size:0.7rem; margin-top: 4px; } .tla-ph-verification-footer-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 9px; justify-content: flex-end; } .tla-ph-card-progress { background: rgba(10,144,246,.09); border-radius: 999px; color: var(--tla-ph-blue); display: inline-flex; font-size:0.68rem; font-weight: 850; letter-spacing: .045em; margin-top: 10px; padding: 6px 9px; text-transform: uppercase; } .tla-ph-card-progress.is-complete { background: rgba(5,150,105,.10); color: var(--tla-ph-green); } .tla-ph-card-progress.is-reviewing { background: rgba(10,144,246,.10); color: var(--tla-ph-blue); } .tla-ph-card-progress.needs-action { background: rgba(217,119,6,.11); color: var(--tla-ph-amber); } @media(max-width:900px){.tla-ph-verification-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-verification-footer{align-items:flex-start;flex-direction:column}.tla-ph-verification-footer-actions{justify-content:flex-start;width:100%}} @media(max-width:640px){.tla-ph-verification-shell{padding-top:38px}.tla-ph-verification-metrics{grid-template-columns:1fr 1fr}.tla-ph-verification-footer-actions{flex-direction:column}.tla-ph-verification-footer-actions .tla-ph-frontend-button{width:100%}} /* Version 0.7.0 — organisation profile, coverage, public profiles and help. */ .tla-ph-profile-workspace,.tla-ph-help-center,.tla-ph-public-profile{background:var(--tla-ph-bg);padding:clamp(42px,5vw,72px) 0;} .tla-ph-workspace-hero{align-items:center;background:linear-gradient(135deg,var(--tla-ph-surface),rgba(223,41,211,.06));border:1px solid var(--tla-ph-border);border-radius:26px;display:flex;gap:28px;justify-content:space-between;margin:18px 0 20px;padding:clamp(25px,4vw,48px);} .tla-ph-workspace-hero h1{font-size:clamp(36px,5vw,64px);letter-spacing:-.055em;line-height:1;margin:12px 0 16px;} .tla-ph-workspace-hero p{color:var(--tla-ph-muted);font-size:15px;line-height:1.7;margin:0;max-width:850px;} .tla-ph-workspace-tabs,.tla-ph-help-nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;} .tla-ph-workspace-tabs a,.tla-ph-help-nav a{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:999px;color:var(--tla-ph-muted);font-size:11px;font-weight:800;padding:10px 15px;text-decoration:none;} .tla-ph-workspace-tabs a.is-active,.tla-ph-workspace-tabs a:hover,.tla-ph-help-nav a:hover{background:var(--tla-ph-grad);border-color:transparent;color:#fff!important;} .tla-ph-workspace-panel{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:22px;box-shadow:0 10px 35px rgba(21,18,70,.06);margin-bottom:20px;padding:clamp(20px,3vw,34px);} .tla-ph-workspace-panel h2{font-size:24px;letter-spacing:-.035em;margin:0 0 8px;} .tla-ph-choice-grid{border:0;display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:0;} .tla-ph-choice-grid legend{font-size:15px;font-weight:850;margin-bottom:12px;} .tla-ph-choice-grid label{align-items:flex-start;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:14px;display:flex;gap:10px;padding:12px;} .tla-ph-choice-grid label span strong,.tla-ph-choice-grid label span small{display:block}.tla-ph-choice-grid label span small{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.45;margin-top:3px;} .tla-ph-branch-list{display:grid;gap:16px}.tla-ph-branch-row{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:17px;padding:18px}.tla-ph-branch-row legend{font-size:13px;font-weight:850;padding:0 6px;} .tla-ph-media-guidance{background:linear-gradient(135deg,rgba(10,144,246,.07),rgba(223,41,211,.06));border:1px solid rgba(10,144,246,.16);border-radius:20px;margin-top:20px;padding:22px;} .tla-ph-media-spec-grid{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:15px}.tla-ph-media-spec-grid>div{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:14px;padding:15px}.tla-ph-media-spec-grid strong,.tla-ph-media-spec-grid span,.tla-ph-media-spec-grid small{display:block}.tla-ph-media-spec-grid span{color:var(--tla-ph-blue);font-size:12px;font-weight:800;margin-top:5px}.tla-ph-media-spec-grid small{color:var(--tla-ph-muted);font-size:0.68rem;margin-top:4px}.tla-ph-media-spec-grid p{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.5;margin:8px 0 0;} .tla-ph-help-grid{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr));margin:20px 0}.tla-ph-help-card{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:18px;padding:20px}.tla-ph-help-card>.dashicons{color:var(--tla-ph-blue);font-size:25px;height:25px;width:25px}.tla-ph-help-card h2{font-size:18px;margin:13px 0 8px}.tla-ph-help-card p,.tla-ph-help-card li{color:var(--tla-ph-muted);font-size:11px;line-height:1.6}.tla-ph-help-card ul{margin:12px 0 0 18px;padding:0}.tla-ph-help-accordion details{border-top:1px solid var(--tla-ph-divider);padding:14px 0}.tla-ph-help-accordion summary{cursor:pointer;font-size:14px;font-weight:850}.tla-ph-help-accordion p,.tla-ph-help-accordion li{color:var(--tla-ph-muted);font-size:11px;line-height:1.6} .tla-ph-public-profile-hero{align-items:center;background:linear-gradient(135deg,var(--tla-ph-surface),rgba(10,144,246,.08),rgba(223,41,211,.05));border:1px solid var(--tla-ph-border);border-radius:28px;display:flex;gap:30px;justify-content:space-between;padding:clamp(28px,5vw,60px)}.tla-ph-public-profile-hero h1{font-size:clamp(40px,6vw,72px);letter-spacing:-.06em;line-height:1;margin:12px 0 18px}.tla-ph-public-profile-hero p{color:var(--tla-ph-muted);font-size:15px;line-height:1.75;max-width:820px}.tla-ph-public-trust{align-items:center;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:20px;display:flex;flex:0 0 250px;flex-direction:column;padding:24px;text-align:center}.tla-ph-public-trust>.dashicons{color:var(--tla-ph-green);font-size:36px;height:36px;width:36px}.tla-ph-public-trust strong{font-size:14px;margin-top:10px}.tla-ph-public-trust small{color:var(--tla-ph-muted);font-size:0.68rem;margin-top:5px}.tla-ph-public-profile-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr));margin:20px 0}.tla-ph-public-profile-grid>section,.tla-ph-public-state{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:20px;padding:24px}.tla-ph-public-tags{display:flex;flex-wrap:wrap;gap:8px}.tla-ph-public-tags span{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:999px;color:var(--tla-ph-text);font-size:0.7rem;font-weight:750;padding:8px 11px} html:not([data-tla-theme="dark"]) body:has(.tla-ph-profile-workspace),html:not([data-tla-theme="dark"]) body:has(.tla-ph-help-center),html:not([data-tla-theme="dark"]) body:has(.tla-ph-public-profile){background:#f7f8fc!important}.tla-ph-profile-workspace,.tla-ph-help-center{margin-top:0!important} @media(max-width:960px){.tla-ph-workspace-hero,.tla-ph-public-profile-hero{align-items:flex-start;flex-direction:column}.tla-ph-public-trust{width:100%}.tla-ph-help-grid,.tla-ph-media-spec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:640px){.tla-ph-choice-grid,.tla-ph-help-grid,.tla-ph-media-spec-grid,.tla-ph-public-profile-grid{grid-template-columns:1fr}.tla-ph-workspace-tabs a,.tla-ph-help-nav a{width:100%;text-align:center}.tla-ph-workspace-panel{border-radius:16px;padding:18px}.tla-ph-workspace-hero{border-radius:18px}} .tla-ph-directory-filter{align-items:end;display:grid;gap:12px;grid-template-columns:1.2fr 1fr 1fr auto auto}.tla-ph-directory-filter label>span{color:var(--tla-ph-muted);display:block;font-size:0.7rem;font-weight:750;margin-bottom:6px}.tla-ph-directory-filter input,.tla-ph-directory-filter select{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:10px;color:var(--tla-ph-text);min-height:44px;width:100%}.tla-ph-directory-summary{margin:15px 0}.tla-ph-directory-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}.tla-ph-directory-card{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:20px;display:flex;flex-direction:column;padding:22px}.tla-ph-directory-card h2{font-size:21px;margin:13px 0 8px}.tla-ph-directory-card p{color:var(--tla-ph-muted);font-size:11px;line-height:1.6}.tla-ph-directory-card .tla-ph-frontend-button{margin-top:auto}.tla-ph-directory-card .tla-ph-card-progress{margin-bottom:15px}@media(max-width:1000px){.tla-ph-directory-filter{grid-template-columns:1fr 1fr}.tla-ph-directory-grid{grid-template-columns:1fr 1fr}}@media(max-width:640px){.tla-ph-directory-filter,.tla-ph-directory-grid{grid-template-columns:1fr}} /* 0.7.0 multi-sector workspace selector */ .tla-ph-sector-switcher{display:flex;gap:10px;align-items:center;overflow-x:auto;margin:0 0 18px;padding:6px 0;scrollbar-width:thin} .tla-ph-sector-switcher a{flex:0 0 auto;text-decoration:none;border:1px solid var(--tla-ph-border,#dfe5f2);background:var(--tla-ph-surface,#fff);color:var(--tla-ph-text,#0b1020);border-radius:999px;padding:10px 16px;font-size:13px;font-weight:800;box-shadow:0 6px 18px rgba(10,27,58,.05)} .tla-ph-sector-switcher a:hover,.tla-ph-sector-switcher a:focus-visible{border-color:#0a90f6;outline:none} .tla-ph-sector-switcher a.is-active{border-color:transparent;color:#fff;background:linear-gradient(90deg,#df29d3,#0a90f6);box-shadow:0 10px 24px rgba(10,144,246,.2)} html[data-tla-theme="dark"] .tla-ph-sector-switcher a{background:#11182a;color:#f4f7ff;border-color:#29334b} html[data-tla-theme="dark"] .tla-ph-sector-switcher a.is-active{background:linear-gradient(90deg,#df29d3,#0a90f6);border-color:transparent;color:#fff} /* Version 0.7.1 — organisation microsite, people and richer dashboard. */ .tla-ph-dashboard-metrics-4{grid-template-columns:repeat(4,minmax(0,1fr))}.tla-ph-profile-layout{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr)}.tla-ph-profile-main-form{min-width:0}.tla-ph-profile-side{display:grid;gap:16px;position:sticky;top:110px}.tla-ph-profile-side .tla-ph-workspace-panel{margin:0}.tla-ph-profile-definition{display:grid;gap:12px;grid-template-columns:1fr 1fr;margin:18px 0}.tla-ph-profile-definition>div{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:14px;padding:14px 16px}.tla-ph-profile-definition strong,.tla-ph-profile-definition span{display:block}.tla-ph-profile-definition span{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.5;margin-top:5px}.tla-ph-profile-completion{align-items:center;display:flex;flex-direction:column;gap:6px}.tla-ph-profile-completion small{color:var(--tla-ph-muted);font-size:0.68rem}.tla-ph-completion-ring{align-items:center;background:conic-gradient(var(--tla-ph-blue) calc(var(--tla-completion)*1%),var(--tla-ph-soft) 0);border-radius:50%;display:flex;flex-direction:column;height:100px;justify-content:center;position:relative;width:100px}.tla-ph-completion-ring:before{background:var(--tla-ph-surface);border-radius:50%;content:"";inset:8px;position:absolute}.tla-ph-completion-ring strong,.tla-ph-completion-ring span{position:relative;z-index:1}.tla-ph-completion-ring strong{font-size:22px}.tla-ph-completion-ring span{color:var(--tla-ph-muted-light);font-size:0.68rem;font-weight:800;text-transform:uppercase}.tla-ph-media-upload-card h2,.tla-ph-readiness-panel h2{font-size:16px;margin:0}.tla-ph-media-upload-card p,.tla-ph-readiness-panel p,.tla-ph-readiness-panel li{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.55}.tla-ph-media-upload-head{align-items:flex-start;display:flex;gap:10px;justify-content:space-between}.tla-ph-profile-media-preview{align-items:center;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:14px;display:flex;justify-content:center;margin:12px 0;overflow:hidden}.tla-ph-profile-media-preview.is-logo{aspect-ratio:1/1;max-height:210px}.tla-ph-profile-media-preview.is-cover{aspect-ratio:16/9}.tla-ph-profile-media-preview img{height:100%;object-fit:contain;width:100%}.tla-ph-profile-media-preview.is-cover img{object-fit:cover}.tla-ph-profile-media-empty{align-items:center;background:var(--tla-ph-soft);border:1px dashed var(--tla-ph-border);border-radius:14px;color:var(--tla-ph-muted);display:flex;flex-direction:column;gap:7px;justify-content:center;margin:12px 0;min-height:120px}.tla-ph-profile-media-empty .dashicons{font-size:30px;height:30px;width:30px}.tla-ph-media-upload-card form{display:grid;gap:10px}.tla-ph-media-upload-card input[type=file]{font-size:0.7rem;width:100%}.tla-ph-readiness-panel>strong{display:block;font-size:24px;margin-top:8px}.tla-ph-readiness-panel ul{margin:8px 0 15px 18px}.tla-ph-people-row{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:16px;margin:0 0 16px;padding:18px}.tla-ph-people-row legend{color:var(--tla-ph-blue);font-size:0.7rem;font-weight:850;letter-spacing:.08em;padding:0 7px;text-transform:uppercase}.tla-ph-team-editor{display:grid;gap:16px;grid-template-columns:110px minmax(0,1fr)}.tla-ph-team-photo{align-items:center;aspect-ratio:1/1;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:16px;display:flex;justify-content:center;overflow:hidden}.tla-ph-team-photo img{height:100%;object-fit:cover;width:100%}.tla-ph-team-photo .dashicons{color:var(--tla-ph-blue);font-size:34px;height:34px;width:34px}.tla-ph-preview-notice{align-items:flex-start;background:var(--tla-ph-pastel-blue);border:1px solid rgba(10,144,246,.18);border-radius:15px;display:flex;gap:12px;margin-bottom:18px;padding:15px}.tla-ph-preview-notice strong{display:block}.tla-ph-preview-notice p{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.55;margin:4px 0 0}.tla-ph-microsite-preview{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:24px;box-shadow:0 24px 70px rgba(21,18,70,.09);overflow:hidden}.tla-ph-microsite-cover{background-position:center;background-size:cover;height:280px}.tla-ph-microsite-inner{padding:30px}.tla-ph-microsite-header{align-items:center;display:grid;gap:20px;grid-template-columns:auto 1fr auto}.tla-ph-microsite-logo{align-items:center;background:#fff;border:1px solid var(--tla-ph-border);border-radius:20px;display:flex;height:120px;justify-content:center;overflow:hidden;padding:10px;width:120px}.tla-ph-microsite-logo img{height:100%;object-fit:contain;width:100%}.tla-ph-microsite-header h1{font-size:38px;margin:6px 0}.tla-ph-microsite-tagline{color:var(--tla-ph-muted);font-size:15px}.tla-ph-microsite-section,.tla-ph-microsite-about{border-top:1px solid var(--tla-ph-divider);margin-top:25px;padding-top:25px}.tla-ph-department-grid,.tla-ph-team-grid{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}.tla-ph-department-grid article,.tla-ph-team-grid article{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:15px;padding:16px}.tla-ph-team-grid img{aspect-ratio:1/1;border-radius:14px;object-fit:cover;width:100%}.tla-ph-team-grid>article>.dashicons{align-items:center;background:var(--tla-ph-pastel-blue);border-radius:14px;color:var(--tla-ph-blue);display:flex;font-size:34px;height:120px;justify-content:center;width:100%}.tla-ph-department-grid h3,.tla-ph-team-grid h3{font-size:15px;margin:10px 0 5px}.tla-ph-department-grid p,.tla-ph-team-grid p{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.55}.tla-ph-team-grid strong,.tla-ph-team-grid small{display:block}.tla-ph-team-grid small{color:var(--tla-ph-muted-light);font-size:0.68rem;margin-top:3px}.tla-ph-microsite-contact{align-items:center;background:linear-gradient(135deg,var(--tla-ph-pastel-violet),var(--tla-ph-pastel-blue));border-radius:18px;display:flex;gap:20px;justify-content:space-between;margin-top:28px;padding:22px}.tla-ph-microsite-contact h2{margin:0}.tla-ph-microsite-contact p{color:var(--tla-ph-muted);margin:5px 0 0}.tla-ph-workspace-tabs{overflow-x:auto}.tla-ph-workspace-tabs a{white-space:nowrap} @media(max-width:1180px){.tla-ph-dashboard-metrics-4{grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-profile-layout{grid-template-columns:1fr}.tla-ph-profile-side{grid-template-columns:repeat(2,minmax(0,1fr));position:static}.tla-ph-readiness-panel{grid-column:1/-1}.tla-ph-department-grid,.tla-ph-team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:760px){.tla-ph-dashboard-metrics-4,.tla-ph-profile-definition,.tla-ph-profile-side,.tla-ph-department-grid,.tla-ph-team-grid{grid-template-columns:1fr}.tla-ph-team-editor,.tla-ph-microsite-header{grid-template-columns:1fr}.tla-ph-team-photo{max-width:130px}.tla-ph-microsite-inner{padding:18px}.tla-ph-microsite-header h1{font-size:30px}.tla-ph-microsite-contact{align-items:flex-start;flex-direction:column}.tla-ph-microsite-cover{height:190px}} /* Version 0.7.2 — premium Trusted Partner microsite and dashboard notice spacing. */ .tla-ph-dashboard > .tla-ph-shell-inner { padding-top: 16px; } .tla-ph-dashboard .tla-ph-sector-switcher:first-child, .tla-ph-dashboard .tla-ph-partner-message:first-of-type, .tla-ph-dashboard .tla-ph-flash-notice:first-of-type { scroll-margin-top: 120px; } .tla-ph-frontend-button-quiet { background: transparent; border: 1px solid var(--tla-ph-border); color: var(--tla-ph-heading); } .tla-ph-frontend-button-quiet:hover { background: var(--tla-ph-soft); color: var(--tla-ph-blue); } .tla-ph-frontend-button .dashicons { font-size: 16px; height: 16px; margin-right: 6px; width: 16px; } .tla-ph-premium-profile { --tla-profile-ink: #0a1026; display: grid; gap: 20px; } .tla-ph-preview-toolbar { align-items: center; background: linear-gradient(135deg, rgba(10,144,246,.09), rgba(223,41,211,.08)); border: 1px solid rgba(10,144,246,.18); border-radius: 17px; display: flex; gap: 18px; justify-content: space-between; padding: 14px 16px; } .tla-ph-preview-toolbar > div { align-items: center; display: flex; gap: 11px; } .tla-ph-preview-toolbar > div > .dashicons { color: var(--tla-ph-blue); font-size: 22px; height: 22px; width: 22px; } .tla-ph-preview-toolbar strong, .tla-ph-preview-toolbar small { display: block; } .tla-ph-preview-toolbar small { color: var(--tla-ph-muted); font-size:0.7rem; margin-top: 2px; } .tla-ph-preview-toolbar nav { display: flex; flex-wrap: wrap; gap: 7px; } .tla-ph-preview-toolbar nav a { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-heading); font-size:0.7rem; font-weight: 800; padding: 8px 11px; text-decoration: none; } .tla-ph-preview-toolbar nav a:hover { border-color: rgba(10,144,246,.35); color: var(--tla-ph-blue); } .tla-ph-profile-hero { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 28px; box-shadow: 0 30px 80px rgba(21,18,70,.11); overflow: hidden; } .tla-ph-profile-cover { background: linear-gradient(125deg, #0c1537 0%, #15185a 45%, #8c24ca 100%); background-position: center; background-size: cover; height: 280px; overflow: hidden; position: relative; } .tla-ph-profile-cover::before { background-image: radial-gradient(circle at 20% 20%, rgba(23,178,226,.4), transparent 28%), radial-gradient(circle at 80% 25%, rgba(223,41,211,.34), transparent 30%); content: ""; inset: 0; position: absolute; } .tla-ph-profile-cover-overlay { background: linear-gradient(to bottom, rgba(4,8,24,.08), rgba(4,8,24,.56)); inset: 0; position: absolute; } .tla-ph-edit-overlay { align-items: center; border: 1px dashed rgba(255,255,255,.55); border-radius: 18px; color: #fff; display: flex; flex-direction: column; gap: 5px; inset: 50% auto auto 50%; min-width: 260px; padding: 18px; position: absolute; text-align: center; text-decoration: none; transform: translate(-50%,-50%); z-index: 2; } .tla-ph-edit-overlay:hover { background: rgba(255,255,255,.1); color: #fff; } .tla-ph-edit-overlay .dashicons { font-size: 28px; height: 28px; width: 28px; } .tla-ph-edit-overlay small { opacity: .78; } .tla-ph-profile-hero-body { margin-top: -54px; padding: 0 clamp(22px,4vw,44px) 32px; position: relative; z-index: 3; } .tla-ph-profile-brand-row { align-items: center; display: grid; gap: 22px; grid-template-columns: 138px minmax(0,1fr) minmax(245px,auto); } .tla-ph-profile-logo { align-items: center; background: #fff; border: 6px solid rgba(255,255,255,.95); border-radius: 24px; box-shadow: 0 18px 45px rgba(15,23,42,.2); display: flex; height: 138px; justify-content: center; overflow: hidden; width: 138px; } .tla-ph-profile-logo img { height: 100%; object-fit: contain; padding: 8px; width: 100%; } .tla-ph-profile-logo.is-placeholder a { align-items: center; color: var(--tla-ph-blue); display: flex; flex-direction: column; gap: 5px; text-decoration: none; } .tla-ph-profile-logo-initials { background: var(--tla-ph-grad); background-clip: text; font-size: 38px; font-weight: 900; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tla-ph-profile-identity { min-width: 0; padding-top: 58px; } .tla-ph-profile-identity h1 { font-size: clamp(34px,4.8vw,58px); letter-spacing: -.055em; line-height: 1; margin: 8px 0 10px; } .tla-ph-profile-tagline { color: var(--tla-ph-muted); font-size: clamp(14px,1.5vw,18px); line-height: 1.55; margin: 0; } .tla-ph-inline-missing { align-items: center; color: var(--tla-ph-blue); display: inline-flex; font-size: 11px; font-weight: 800; gap: 6px; margin-top: 7px; text-decoration: none; } .tla-ph-inline-missing .dashicons { font-size: 15px; height: 15px; width: 15px; } .tla-ph-profile-meta-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; } .tla-ph-profile-meta-row > span { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-muted); display: inline-flex; font-size:0.7rem; font-weight: 750; gap: 5px; padding: 8px 10px; } .tla-ph-profile-meta-row .dashicons { color: var(--tla-ph-blue); font-size: 15px; height: 15px; width: 15px; } .tla-ph-profile-meta-row .is-available { background: rgba(5,150,105,.08); color: #047857; } .tla-ph-profile-meta-row .is-available .dashicons { color: #059669; } .tla-ph-profile-meta-row .is-unavailable { background: rgba(217,119,6,.08); color: #a16207; } .tla-ph-trust-panel { align-items: center; align-self: end; background: linear-gradient(135deg,#fff,rgba(246,247,255,.95)); border: 1px solid var(--tla-ph-border); border-radius: 20px; box-shadow: 0 18px 40px rgba(21,18,70,.09); display: flex; gap: 12px; margin-bottom: 2px; padding: 16px; } .tla-ph-trust-panel.is-approved { border-color: rgba(5,150,105,.2); } .tla-ph-trust-panel.is-reviewing { border-color: rgba(217,119,6,.2); } .tla-ph-trust-icon { align-items: center; background: var(--tla-ph-grad); border-radius: 14px; color: #fff; display: flex; flex: 0 0 44px; height: 44px; justify-content: center; } .tla-ph-trust-icon .dashicons { font-size: 23px; height: 23px; width: 23px; } .tla-ph-trust-panel strong, .tla-ph-trust-panel small { display: block; } .tla-ph-trust-panel strong { color: var(--tla-ph-heading); font-size: 12px; } .tla-ph-trust-panel small { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.45; margin-top: 3px; } .tla-ph-profile-hero-actions { align-items: center; border-top: 1px solid var(--tla-ph-divider); display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; padding-top: 20px; } .tla-ph-profile-anchor-nav { align-items: center; background: rgba(255,255,255,.96); border: 1px solid var(--tla-ph-border); border-radius: 16px; box-shadow: 0 14px 34px rgba(15,23,42,.07); display: flex; gap: 5px; overflow-x: auto; padding: 7px; position: sticky; top: 92px; z-index: 8; } .tla-ph-profile-anchor-nav a { border-radius: 10px; color: var(--tla-ph-muted); flex: 0 0 auto; font-size:0.7rem; font-weight: 800; padding: 9px 12px; text-decoration: none; } .tla-ph-profile-anchor-nav a:hover { background: var(--tla-ph-pastel-blue); color: var(--tla-ph-blue); } .tla-ph-profile-page-grid { align-items: start; display: grid; gap: 20px; grid-template-columns: minmax(0,1fr) minmax(280px,350px); } .tla-ph-profile-main-content { display: grid; gap: 18px; min-width: 0; } .tla-ph-profile-section { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 14px 38px rgba(21,18,70,.05); padding: clamp(22px,3vw,32px); scroll-margin-top: 150px; } .tla-ph-section-heading { align-items: flex-start; display: flex; gap: 18px; justify-content: space-between; margin-bottom: 20px; } .tla-ph-section-heading span { color: var(--tla-ph-blue); display: block; font-size:0.68rem; font-weight: 850; letter-spacing: .12em; margin-bottom: 5px; text-transform: uppercase; } .tla-ph-section-heading h2 { font-size: clamp(22px,2.7vw,31px); letter-spacing: -.035em; margin: 0; } .tla-ph-section-heading > a { background: var(--tla-ph-soft); border-radius: 999px; color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 800; padding: 8px 11px; text-decoration: none; } .tla-ph-expandable-copy { color: var(--tla-ph-text); font-size: 14px; line-height: 1.8; } .tla-ph-expandable-copy p { margin: 0; white-space: normal; } .tla-ph-profile-metrics-grid { display: grid; gap: 12px; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 22px; } .tla-ph-profile-metrics-grid > div { background: linear-gradient(135deg,var(--tla-ph-soft),var(--tla-ph-surface)); border: 1px solid var(--tla-ph-border); border-radius: 16px; padding: 16px; } .tla-ph-profile-metrics-grid .dashicons { color: var(--tla-ph-blue); display: block; font-size: 21px; height: 21px; margin-bottom: 12px; width: 21px; } .tla-ph-profile-metrics-grid strong { color: var(--tla-ph-heading); display: block; font-size: 24px; letter-spacing: -.035em; } .tla-ph-profile-metrics-grid small { color: var(--tla-ph-muted); display: block; font-size:0.68rem; margin-top: 4px; } .tla-ph-capability-columns { display: grid; gap: 22px; grid-template-columns: 1.2fr .8fr; } .tla-ph-capability-columns h3 { font-size: 14px; margin: 0 0 11px; } .tla-ph-capability-grid { display: grid; gap: 10px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-capability-grid article { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 15px; padding: 15px; } .tla-ph-capability-grid .dashicons { color: var(--tla-ph-blue); font-size: 19px; height: 19px; margin-bottom: 9px; width: 19px; } .tla-ph-capability-grid strong { color: var(--tla-ph-heading); display: block; font-size: 12px; } .tla-ph-capability-grid p { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.55; margin: 6px 0 0; } .tla-ph-specialism-pills, .tla-ph-coverage-pills { display: flex; flex-wrap: wrap; gap: 8px; } .tla-ph-specialism-pills > span, .tla-ph-coverage-pills > span { align-items: center; background: linear-gradient(135deg,rgba(10,144,246,.08),rgba(223,41,211,.07)); border: 1px solid rgba(10,144,246,.15); border-radius: 999px; color: var(--tla-ph-heading); display: inline-flex; font-size:0.7rem; font-weight: 750; gap: 5px; padding: 8px 10px; } .tla-ph-specialism-pills .dashicons { color: #df29d3; font-size: 14px; height: 14px; width: 14px; } .tla-ph-credential-grid { display: grid; gap: 11px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-credential-grid article { align-items: center; background: linear-gradient(135deg,rgba(5,150,105,.07),rgba(255,255,255,.96)); border: 1px solid rgba(5,150,105,.16); border-radius: 16px; display: flex; gap: 12px; padding: 15px; } .tla-ph-credential-grid .dashicons { align-items: center; background: rgba(5,150,105,.1); border-radius: 12px; color: #059669; display: flex; flex: 0 0 40px; font-size: 22px; height: 40px; justify-content: center; width: 40px; } .tla-ph-credential-grid strong, .tla-ph-credential-grid small { display: block; } .tla-ph-credential-grid strong { color: var(--tla-ph-heading); font-size: 11px; } .tla-ph-credential-grid small { color: #047857; font-size:0.68rem; font-weight: 800; margin-top: 3px; text-transform: uppercase; } .tla-ph-premium-team-grid { display: grid; gap: 14px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-premium-team-grid article { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 18px; display: grid; gap: 15px; grid-template-columns: 110px minmax(0,1fr); overflow: hidden; padding: 14px; } .tla-ph-premium-team-photo { align-items: center; aspect-ratio: 1/1; background: var(--tla-ph-pastel-blue); border-radius: 14px; display: flex; justify-content: center; overflow: hidden; } .tla-ph-premium-team-photo img { height: 100%; object-fit: cover; width: 100%; } .tla-ph-premium-team-photo .dashicons { color: var(--tla-ph-blue); font-size: 34px; height: 34px; width: 34px; } .tla-ph-premium-team-grid h3 { font-size: 15px; margin: 3px 0; } .tla-ph-premium-team-grid strong { color: var(--tla-ph-blue); display: block; font-size:0.7rem; } .tla-ph-premium-team-grid small { color: var(--tla-ph-muted-light); display: block; font-size:0.68rem; margin-top: 3px; } .tla-ph-premium-team-grid p { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.55; margin: 8px 0; } .tla-ph-premium-team-grid a { color: var(--tla-ph-blue); font-size:0.68rem; font-weight: 800; text-decoration: none; } .tla-ph-location-grid { display: grid; gap: 11px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-location-grid article { align-items: flex-start; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 16px; display: flex; gap: 11px; padding: 15px; } .tla-ph-location-grid article.is-coverage { grid-column: 1/-1; } .tla-ph-location-grid .dashicons { color: var(--tla-ph-blue); font-size: 21px; height: 21px; width: 21px; } .tla-ph-location-grid h3 { font-size: 13px; margin: 0 0 4px; } .tla-ph-location-grid p { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.5; margin: 0; } .tla-ph-contact-area-grid { display: grid; gap: 11px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-contact-area-grid article { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 16px; padding: 16px; } .tla-ph-contact-area-grid > article > .dashicons { color: var(--tla-ph-blue); font-size: 21px; height: 21px; width: 21px; } .tla-ph-contact-area-grid h3 { font-size: 14px; margin: 10px 0 6px; } .tla-ph-contact-area-grid p { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.55; } .tla-ph-contact-area-grid article div { display: grid; gap: 4px; } .tla-ph-contact-area-grid a { color: var(--tla-ph-blue); font-size:0.68rem; text-decoration: none; } .tla-ph-missing-content { align-items: flex-start; background: linear-gradient(135deg,rgba(10,144,246,.06),rgba(223,41,211,.055)); border: 1px dashed rgba(10,144,246,.35); border-radius: 17px; display: flex; gap: 14px; padding: 18px; } .tla-ph-missing-content > .dashicons { align-items: center; background: var(--tla-ph-surface); border-radius:14px; color: var(--tla-ph-blue); display: flex; flex: 0 0 44px; font-size: 23px; height: 44px; justify-content: center; width: 44px; } .tla-ph-missing-content strong { color: var(--tla-ph-heading); display: block; font-size: 13px; } .tla-ph-missing-content p { color: var(--tla-ph-muted); font-size:0.7rem; line-height: 1.55; margin: 6px 0 9px; } .tla-ph-missing-content a { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 850; text-decoration: none; } .tla-ph-profile-sidebar { display: grid; gap: 14px; position: sticky; top: 155px; } .tla-ph-inquiry-card, .tla-ph-profile-assurance-card, .tla-ph-profile-readiness-list { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; box-shadow: 0 16px 44px rgba(21,18,70,.07); padding: 20px; } .tla-ph-inquiry-card h2 { font-size: 25px; letter-spacing: -.035em; margin: 12px 0 8px; } .tla-ph-inquiry-card > p { color: var(--tla-ph-muted); font-size:0.7rem; line-height: 1.6; } .tla-ph-inquiry-card > .tla-ph-frontend-button { margin: 10px 0 13px; width: 100%; } .tla-ph-contact-line { align-items: center; border-top: 1px solid var(--tla-ph-divider); color: var(--tla-ph-heading); display: flex; gap: 10px; padding: 12px 0; text-decoration: none; } .tla-ph-contact-line > .dashicons { color: var(--tla-ph-blue); font-size: 20px; height: 20px; width: 20px; } .tla-ph-contact-line small, .tla-ph-contact-line strong { display: block; } .tla-ph-contact-line small { color: var(--tla-ph-muted-light); font-size:0.68rem; text-transform: uppercase; } .tla-ph-contact-line strong { font-size:0.7rem; margin-top: 2px; overflow-wrap: anywhere; } .tla-ph-phone-reveal { border-top: 1px solid var(--tla-ph-divider); padding: 12px 0; } .tla-ph-phone-reveal summary { align-items: center; color: var(--tla-ph-heading); cursor: pointer; display: flex; font-size:0.7rem; font-weight: 800; gap: 8px; list-style: none; } .tla-ph-phone-reveal summary::-webkit-details-marker { display: none; } .tla-ph-phone-reveal summary .dashicons { color: var(--tla-ph-blue); } .tla-ph-phone-reveal > a { color: var(--tla-ph-blue); display: block; font-size: 15px; font-weight: 850; margin: 10px 0 0 28px; text-decoration: none; } .tla-ph-profile-assurance-card { align-items: flex-start; display: flex; gap: 11px; } .tla-ph-profile-assurance-card > .dashicons { color: var(--tla-ph-blue); font-size: 23px; height: 23px; width: 23px; } .tla-ph-profile-assurance-card strong { color: var(--tla-ph-heading); font-size: 11px; } .tla-ph-profile-assurance-card p { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.55; margin: 5px 0 0; } .tla-ph-profile-readiness-list h3 { font-size: 15px; margin: 0 0 6px; } .tla-ph-profile-readiness-list p, .tla-ph-profile-readiness-list li { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.5; } .tla-ph-profile-readiness-list ul { margin: 10px 0 12px 17px; } .tla-ph-profile-readiness-list > a { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 850; text-decoration: none; } html[data-tla-theme="dark"] .tla-ph-preview-toolbar, html[data-tla-theme="dark"] .tla-ph-profile-anchor-nav { background: rgba(11,16,36,.96); } html[data-tla-theme="dark"] .tla-ph-trust-panel, html[data-tla-theme="dark"] .tla-ph-credential-grid article { background: linear-gradient(135deg,rgba(11,16,36,.98),rgba(23,28,55,.98)); } html[data-tla-theme="dark"] .tla-ph-profile-logo { background: #fff; } @media (max-width: 1050px) { .tla-ph-profile-brand-row { grid-template-columns: 120px 1fr; } .tla-ph-profile-logo { height: 120px; width: 120px; } .tla-ph-trust-panel { grid-column: 1/-1; margin-left: 142px; } .tla-ph-profile-page-grid { grid-template-columns: 1fr; } .tla-ph-profile-sidebar { grid-template-columns: repeat(2,minmax(0,1fr)); position: static; } .tla-ph-profile-readiness-list { grid-column: 1/-1; } } @media (max-width: 760px) { .tla-ph-dashboard > .tla-ph-shell-inner { padding-top: 10px; } .tla-ph-preview-toolbar { align-items: flex-start; flex-direction: column; } .tla-ph-profile-cover { height: 205px; } .tla-ph-profile-hero-body { margin-top: -42px; padding: 0 18px 22px; } .tla-ph-profile-brand-row { align-items: start; grid-template-columns: 88px 1fr; gap: 13px; } .tla-ph-profile-logo { border-radius: 18px; height: 88px; width: 88px; } .tla-ph-profile-identity { padding-top: 44px; } .tla-ph-profile-identity h1 { font-size: 32px; } .tla-ph-trust-panel { grid-column: 1/-1; margin-left: 0; } .tla-ph-profile-hero-actions { align-items: stretch; flex-direction: column; } .tla-ph-profile-hero-actions .tla-ph-frontend-button { width: 100%; } .tla-ph-profile-anchor-nav { top: 76px; } .tla-ph-profile-metrics-grid, .tla-ph-capability-grid, .tla-ph-credential-grid, .tla-ph-premium-team-grid, .tla-ph-location-grid, .tla-ph-contact-area-grid, .tla-ph-profile-sidebar { grid-template-columns: 1fr; } .tla-ph-capability-columns { grid-template-columns: 1fr; } .tla-ph-premium-team-grid article { grid-template-columns: 86px minmax(0,1fr); } .tla-ph-profile-section { padding: 20px 17px; } } /* Version 0.7.3 — enterprise directory typography, network previews and tiered listings. */ .tla-ph-shell, .tla-ph-component, .tla-ph-premium-profile { font-size: 17px; line-height: 1.62; } .tla-ph-shell-inner { max-width: 1380px; } .tla-ph-shell { padding: clamp(22px,3vw,40px); } .tla-ph-frontend-eyebrow, .tla-ph-section-heading span, .tla-ph-card-kicker { font-size: 13px !important; letter-spacing: .095em; } .tla-ph-frontend-pill, .tla-ph-tier-pill { font-size: 13px !important; line-height: 1.2; padding: 7px 11px; } .tla-ph-frontend-button { font-size: 16px; min-height: 50px; padding: 12px 22px; } .tla-ph-frontend-card p, .tla-ph-frontend-card small, .tla-ph-alert, .tla-ph-inline-notice { font-size: 16px; } .tla-ph-network-preview-banner { align-items: center; background: linear-gradient(135deg,rgba(10,144,246,.1),rgba(223,41,211,.08)); border: 1px solid rgba(10,144,246,.2); border-radius: 18px; display: flex; gap: 14px; margin-bottom: 14px; padding: 15px 18px; } .tla-ph-network-preview-banner > .dashicons { color: var(--tla-ph-blue); font-size: 28px; height: 28px; width: 28px; } .tla-ph-network-preview-banner strong { display: block; font-size: 17px; } .tla-ph-network-preview-banner p { color: var(--tla-ph-muted); font-size: 15px; margin: 2px 0 0; } .tla-ph-network-nav { align-items: center; background: rgba(255,255,255,.97); border: 1px solid var(--tla-ph-border); border-radius: 18px; box-shadow: 0 12px 32px rgba(15,23,42,.07); display: flex; gap: 20px; justify-content: space-between; margin-bottom: 18px; padding: 12px 15px; position: sticky; top: 92px; z-index: 25; } .tla-ph-network-nav-brand { align-items: center; display: flex; flex: 0 0 auto; gap: 10px; } .tla-ph-network-nav-brand .dashicons { align-items: center; background: var(--tla-ph-grad); border-radius:12px; color: #fff; display: flex; height: 38px; justify-content: center; width: 38px; } .tla-ph-network-nav-brand strong { font-size: 16px; } .tla-ph-network-nav-links { display: flex; gap: 4px; overflow-x: auto; } .tla-ph-network-nav-links a { border-radius:12px; color: var(--tla-ph-muted); flex: 0 0 auto; font-size: 15px; font-weight: 800; padding: 9px 12px; text-decoration: none; } .tla-ph-network-nav-links a:hover, .tla-ph-network-nav-links a.is-active { background: var(--tla-ph-pastel-blue); color: var(--tla-ph-blue); } .tla-ph-network-hero, .tla-ph-sector-hero, .tla-ph-directory-hero { background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 26px; box-shadow: var(--tla-ph-shadow-lg); display: grid; gap: 28px; grid-template-columns: minmax(0,1.45fr) minmax(300px,.55fr); overflow: hidden; padding: clamp(30px,4vw,52px); position: relative; } .tla-ph-network-hero::after, .tla-ph-sector-hero::after, .tla-ph-directory-hero::after { background: var(--tla-ph-grad); border-radius: 50%; content: ""; filter: blur(80px); height: 280px; opacity: .13; position: absolute; right: -90px; top: -140px; width: 280px; } .tla-ph-network-hero > *, .tla-ph-sector-hero > *, .tla-ph-directory-hero > * { position: relative; z-index: 1; } .tla-ph-network-hero h1, .tla-ph-sector-hero h1, .tla-ph-directory-hero h1 { font-size: clamp(40px,5.2vw,68px); letter-spacing: -.055em; line-height: 1.01; margin: 13px 0 18px; } .tla-ph-network-hero p, .tla-ph-sector-hero p, .tla-ph-directory-hero p { color: var(--tla-ph-muted); font-size: 19px; line-height: 1.65; margin: 0; max-width: 840px; } .tla-ph-network-hero .tla-ph-frontend-actions, .tla-ph-sector-hero .tla-ph-frontend-actions { margin-top: 24px; } .tla-ph-network-trust-card { align-self: stretch; background: linear-gradient(145deg,#071127,#171342); border: 1px solid rgba(255,255,255,.12); border-radius: 22px; color: #fff; display: flex; flex-direction: column; justify-content: center; padding: 25px; } .tla-ph-network-trust-card > .dashicons { color: #5ed8ff; font-size: 36px; height: 36px; margin-bottom: 18px; width: 36px; } .tla-ph-network-trust-card strong { color: #fff; font-size: 24px; line-height: 1.25; } .tla-ph-network-trust-card p { color: rgba(255,255,255,.77); font-size: 16px; line-height: 1.65; margin: 10px 0 20px; } .tla-ph-network-stat-row { border-top: 1px solid rgba(255,255,255,.13); display: grid; gap: 10px; grid-template-columns: 1fr 1fr; padding-top: 18px; } .tla-ph-network-stat-row span { color: rgba(255,255,255,.68); font-size: 14px; } .tla-ph-network-stat-row b { color: #fff; display: block; font-size: 28px; } .tla-ph-network-steps { display: grid; gap: 14px; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 18px 0; } .tla-ph-network-steps article { align-items: flex-start; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; display: flex; gap: 14px; padding: 20px; } .tla-ph-network-steps article > span { align-items: center; background: var(--tla-ph-grad); border-radius: 12px; color: #fff; display: flex; flex: 0 0 42px; font-size: 18px; font-weight: 900; height: 42px; justify-content: center; } .tla-ph-network-steps strong { display: block; font-size: 18px; } .tla-ph-network-steps p { color: var(--tla-ph-muted); font-size: 15px; line-height: 1.55; margin: 5px 0 0; } .tla-ph-network-sector-section, .tla-ph-sector-capabilities, .tla-ph-sector-partners, .tla-ph-tier-explainer { margin-top: 22px; } .tla-ph-sector-card-grid { display: grid; gap: 15px; grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-sector-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 21px; box-shadow: 0 12px 30px rgba(21,18,70,.05); display: flex; flex-direction: column; padding: 23px; } .tla-ph-sector-card-icon { align-items: center; background: var(--tla-ph-pastel-mix); border-radius: 15px; color: var(--tla-ph-blue); display: flex; height: 52px; justify-content: center; margin-bottom: 16px; width: 52px; } .tla-ph-sector-card-icon .dashicons { font-size: 27px; height: 27px; width: 27px; } .tla-ph-sector-card h3 { font-size: 24px; line-height: 1.2; margin: 13px 0 8px; } .tla-ph-sector-card p { color: var(--tla-ph-muted); font-size: 16px; line-height: 1.6; margin: 0; } .tla-ph-sector-card-meta { border-top: 1px solid var(--tla-ph-divider); color: var(--tla-ph-muted); font-size: 14px; margin-top: auto; padding-top: 17px; } .tla-ph-sector-card a { color: var(--tla-ph-blue); font-size: 16px; font-weight: 850; margin-top: 12px; text-decoration: none; } .tla-ph-sector-card small { color: var(--tla-ph-muted); font-size: 14px; line-height: 1.5; margin-top: 12px; } .tla-ph-network-business-cta { align-items: center; background: linear-gradient(135deg,#071127,#261253); border-radius: 24px; color: #fff; display: flex; gap: 28px; justify-content: space-between; margin-top: 22px; padding: 28px 30px; } .tla-ph-network-business-cta h2 { color: #fff; font-size: clamp(28px,3.4vw,42px); margin: 8px 0 10px; } .tla-ph-network-business-cta p { color: rgba(255,255,255,.75); font-size: 17px; line-height: 1.62; margin: 0; max-width: 900px; } .tla-ph-sector-facts { align-self: center; display: grid; gap: 10px; grid-template-columns: 1fr 1fr; } .tla-ph-sector-facts > div { background: rgba(255,255,255,.78); border: 1px solid var(--tla-ph-border); border-radius: 17px; min-width: 135px; padding: 17px; text-align: center; } .tla-ph-sector-facts strong { display: block; font-size: 30px; } .tla-ph-sector-facts span { color: var(--tla-ph-muted); display: block; font-size: 14px; } .tla-ph-capability-preview { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; display: grid; gap: 26px; grid-template-columns: 1.3fr .7fr; padding: 24px; } .tla-ph-capability-preview h3 { font-size: 22px; margin: 0 0 14px; } .tla-ph-tier-summary-grid { display: grid; gap: 14px; grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-tier-summary-grid article { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; padding: 22px; } .tla-ph-tier-summary-grid article.is-pro { background: linear-gradient(135deg,rgba(223,41,211,.08),rgba(10,144,246,.08)); border-color: rgba(223,41,211,.22); } .tla-ph-tier-summary-grid article > span { color: var(--tla-ph-blue); font-size: 13px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-tier-summary-grid h3 { font-size: 22px; margin: 9px 0; } .tla-ph-tier-summary-grid p { color: var(--tla-ph-muted); font-size: 16px; line-height: 1.6; margin: 0; } .tla-ph-directory-hero { grid-template-columns: minmax(0,1fr) minmax(260px,.38fr); } .tla-ph-directory-legend { align-self: center; background: rgba(255,255,255,.82); border: 1px solid var(--tla-ph-border); border-radius: 18px; display: grid; gap: 12px; padding: 20px; } .tla-ph-directory-legend span { align-items: center; display: flex; font-size: 15px; font-weight: 800; gap: 9px; } .tla-ph-directory-legend i { border-radius: 50%; display: block; height: 12px; width: 12px; } .tla-ph-directory-legend .is-trusted i { background: #059669; } .tla-ph-directory-legend .is-basic i { background: #94a3b8; } .tla-ph-directory-filter { align-items: end; display: grid; gap: 13px; grid-template-columns: minmax(190px,1.2fr) minmax(170px,1fr) minmax(170px,1fr) minmax(170px,.8fr) auto; margin: 18px 0; padding: 18px; } .tla-ph-directory-filter label > span { color: var(--tla-ph-heading); display: block; font-size: 14px; font-weight: 800; margin-bottom: 6px; } .tla-ph-directory-filter input[type="text"], .tla-ph-directory-filter select { background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius:12px; color: var(--tla-ph-text); font-size: 16px; min-height: 48px; padding: 9px 12px; width: 100%; } .tla-ph-directory-filter .tla-ph-check { align-items: center; display: flex; font-size: 15px; gap: 8px; min-height: 48px; } .tla-ph-directory-summary { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 15px; display: flex; gap: 16px; justify-content: space-between; margin-bottom: 17px; padding: 14px 17px; } .tla-ph-directory-summary strong { font-size: 19px; } .tla-ph-directory-summary span { color: var(--tla-ph-muted); font-size: 15px; } .tla-ph-directory-group { margin-top: 22px; } .tla-ph-directory-basic-note { align-items: flex-start; background: #f8fafc; border: 1px solid #dbe3ed; border-radius: 15px; display: flex; gap: 12px; margin-bottom: 14px; padding: 15px 17px; } .tla-ph-directory-basic-note .dashicons { color: #64748b; font-size: 23px; height: 23px; width: 23px; } .tla-ph-directory-basic-note p { color: #526077; font-size: 15px; line-height: 1.55; margin: 0; } .tla-ph-directory-grid { align-items: start; display: grid; gap: 16px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-directory-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 12px 30px rgba(21,18,70,.055); display: flex; flex-direction: column; padding: 22px; } .tla-ph-directory-card.is-pro { border-color: rgba(223,41,211,.28); box-shadow: 0 16px 36px rgba(223,41,211,.09); } .tla-ph-directory-card.is-basic { background: #fbfcfe; border-color: #dce3eb; } .tla-ph-directory-card-top { align-items: center; display: grid; gap: 15px; grid-template-columns: 78px minmax(0,1fr); } .tla-ph-directory-logo { align-items: center; background: #fff; border: 1px solid var(--tla-ph-border); border-radius: 17px; display: flex; height: 78px; justify-content: center; overflow: hidden; width: 78px; } .tla-ph-directory-logo img { height: 100%; object-fit: contain; padding: 7px; width: 100%; } .tla-ph-directory-logo span { color: var(--tla-ph-blue); font-size: 24px; font-weight: 900; } .tla-ph-directory-card h2 { font-size: 25px; letter-spacing: -.035em; line-height: 1.17; margin: 8px 0 5px; } .tla-ph-directory-location { align-items: center; color: var(--tla-ph-muted); display: flex; font-size: 15px; gap: 5px; margin: 0; } .tla-ph-directory-description { color: var(--tla-ph-text); font-size: 16px; line-height: 1.62; margin: 18px 0 13px; } .tla-ph-directory-tags { display: flex; flex-wrap: wrap; gap: 7px; } .tla-ph-directory-tags span { background: var(--tla-ph-pastel-blue); border: 1px solid rgba(10,144,246,.15); border-radius: 999px; color: var(--tla-ph-heading); font-size: 14px; font-weight: 750; padding: 7px 10px; } .tla-ph-directory-operational-row { border-top: 1px solid var(--tla-ph-divider); display: flex; flex-wrap: wrap; gap: 8px; margin-top: 17px; padding-top: 15px; } .tla-ph-directory-operational-row > span { align-items: center; background: var(--tla-ph-soft); border-radius: 999px; color: var(--tla-ph-muted); display: inline-flex; font-size: 14px; font-weight: 750; gap: 5px; padding: 7px 10px; } .tla-ph-directory-operational-row .is-open { background: rgba(5,150,105,.09); color: #047857; } .tla-ph-directory-message-ready { background: rgba(223,41,211,.09)!important; color: var(--tla-ph-violet)!important; } .tla-ph-directory-discount { align-items: center; background: rgba(110,34,255,.1); border-radius: 999px; color: var(--tla-ph-violet); display: inline-flex; font-size: 14px; font-weight: 750; gap: 5px; padding: 7px 10px; } .tla-ph-directory-discount .dashicons { font-size: 15px; height: 15px; width: 15px; } .tla-ph-directory-discount.is-compact { font-size: 12px; margin-top: 6px; padding: 5px 9px; } html[data-tla-theme="dark"] .tla-ph-directory-discount { background: rgba(180,140,255,.16); color: #c9a8ff; } .tla-ph-directory-card-footer { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin-top: auto; padding-top: 18px; } .tla-ph-directory-card-footer > span { color: var(--tla-ph-muted); font-size: 14px; font-weight: 750; } /* Premium profile: readable, compact and information-dense. */ .tla-ph-premium-profile { color: var(--tla-ph-text); } .tla-ph-premium-profile p, .tla-ph-premium-profile li, .tla-ph-premium-profile address, .tla-ph-premium-profile dd { font-size: 17px; line-height: 1.65; } .tla-ph-profile-identity h1 { font-size: clamp(42px,5.2vw,66px); } .tla-ph-profile-tagline { font-size: 19px; } .tla-ph-inline-missing { font-size: 15px; } .tla-ph-profile-meta-row > span { font-size: 14px; padding: 8px 11px; } .tla-ph-trust-panel { padding: 18px; } .tla-ph-trust-panel strong { font-size: 17px; } .tla-ph-trust-panel small { font-size: 14px; line-height: 1.45; } .tla-ph-profile-anchor-nav a { font-size: 15px; padding: 9px 13px; } .tla-ph-profile-page-grid { gap: 16px; grid-template-columns: minmax(0,1fr) minmax(310px,360px); } .tla-ph-profile-main-content { gap: 14px; } .tla-ph-profile-section { padding: clamp(20px,2.4vw,28px); } .tla-ph-section-heading { margin-bottom: 15px; } .tla-ph-section-heading h2 { font-size: clamp(28px,3vw,38px); } .tla-ph-section-heading > a { font-size: 14px; padding: 8px 12px; } .tla-ph-expandable-copy { font-size: 18px; line-height: 1.72; } .tla-ph-profile-metrics-grid { gap: 9px; margin-top: 17px; } .tla-ph-profile-metrics-grid > div { padding: 14px; } .tla-ph-profile-metrics-grid strong { font-size: 28px; } .tla-ph-profile-metrics-grid small { font-size: 14px; } .tla-ph-capability-columns h3 { font-size: 21px; } .tla-ph-capability-grid article { padding: 16px; } .tla-ph-capability-grid strong { font-size: 17px; } .tla-ph-capability-grid p { font-size: 15px; line-height: 1.6; } .tla-ph-specialism-pills > span, .tla-ph-coverage-pills > span { font-size: 14px; padding: 8px 11px; } .tla-ph-credential-grid strong { font-size: 16px; } .tla-ph-credential-grid small { font-size: 13px; } .tla-ph-premium-team-grid h3 { font-size: 20px; } .tla-ph-premium-team-grid strong { font-size: 15px; } .tla-ph-premium-team-grid small, .tla-ph-premium-team-grid p { font-size: 15px; } .tla-ph-profile-sidebar { gap: 14px; } .tla-ph-profile-sidebar-card, .tla-ph-opening-hours-card, .tla-ph-messaging-card { padding: 20px; } .tla-ph-profile-sidebar-card h2 { font-size: 28px; } .tla-ph-profile-sidebar-card p, .tla-ph-opening-hours-card p, .tla-ph-messaging-card p { font-size: 15px; } .tla-ph-opening-hours-list > div { font-size: 15px; padding: 8px 0; } .tla-ph-missing-content strong { font-size: 18px; } .tla-ph-missing-content p { font-size: 15px; } .tla-ph-missing-content a { font-size: 15px; } .tla-ph-tier-pill.is-basic { background: #edf1f5; color: #526077; } .tla-ph-tier-pill.is-trusted { background: rgba(5,150,105,.1); color: #047857; } .tla-ph-tier-pill.is-pro { background: linear-gradient(135deg,rgba(223,41,211,.13),rgba(10,144,246,.13)); color: var(--tla-ph-violet); } .tla-ph-opening-hours-editor { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 18px; padding: 16px; } .tla-ph-hours-row { align-items: center; border-bottom: 1px solid var(--tla-ph-divider); display: grid; gap: 10px; grid-template-columns: minmax(100px,.7fr) 1fr 1fr auto; padding: 10px 0; } .tla-ph-hours-row:last-child { border-bottom: 0; } .tla-ph-hours-row > strong { font-size: 16px; } .tla-ph-hours-row input[type="time"] { border: 1px solid var(--tla-ph-border); border-radius: 10px; font-size: 16px; min-height: 43px; padding: 7px 9px; } .tla-ph-messaging-card { align-items: flex-start; background: linear-gradient(135deg,rgba(223,41,211,.08),rgba(10,144,246,.07)); border: 1px solid rgba(223,41,211,.18); border-radius: 18px; display: flex; gap: 12px; } .tla-ph-messaging-card > .dashicons { color: var(--tla-ph-violet); font-size: 26px; height: 26px; width: 26px; } .tla-ph-messaging-card strong { display: block; font-size: 17px; } .tla-ph-messaging-card a { color: var(--tla-ph-blue); font-size: 15px; font-weight: 800; } .tla-ph-upsell-inline { background: linear-gradient(135deg,rgba(223,41,211,.09),rgba(10,144,246,.08)); border: 1px solid rgba(223,41,211,.18); border-radius: 17px; padding: 16px; } .tla-ph-upsell-inline strong { display: block; font-size: 18px; } .tla-ph-upsell-inline p { color: var(--tla-ph-muted); font-size: 15px; margin: 5px 0 10px; } .tla-ph-public-experience-panel { align-items: center; background: linear-gradient(135deg,#071127,#24124e); border-radius: 23px; color: #fff; display: grid; gap: 22px; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); margin: 19px 0; padding: 26px; } .tla-ph-public-experience-panel h2 { color: #fff; font-size: 32px; margin: 8px 0; } .tla-ph-public-experience-panel p { color: rgba(255,255,255,.75); font-size: 16px; line-height: 1.6; margin: 0; } .tla-ph-public-experience-links { display: grid; gap: 9px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-public-experience-links a { align-items: center; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); border-radius: 15px; color: #fff; display: grid; gap: 3px; grid-template-columns: 38px 1fr; padding: 13px; text-decoration: none; } .tla-ph-public-experience-links .dashicons { color: #5ed8ff; font-size: 24px; grid-row: 1/3; height: 24px; width: 24px; } .tla-ph-public-experience-links strong { font-size: 16px; } .tla-ph-public-experience-links small { color: rgba(255,255,255,.66); font-size: 13px; } @media (max-width: 1180px) { .tla-ph-directory-filter { grid-template-columns: 1fr 1fr; } .tla-ph-directory-filter .tla-ph-frontend-button { width: 100%; } .tla-ph-sector-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 900px) { .tla-ph-network-nav { align-items: flex-start; flex-direction: column; position: static; } .tla-ph-network-nav-links { max-width: 100%; width: 100%; } .tla-ph-network-hero, .tla-ph-sector-hero, .tla-ph-directory-hero, .tla-ph-capability-preview, .tla-ph-public-experience-panel { grid-template-columns: 1fr; } .tla-ph-network-steps, .tla-ph-tier-summary-grid { grid-template-columns: 1fr; } .tla-ph-profile-page-grid { grid-template-columns: 1fr; } .tla-ph-profile-sidebar { position: static; } } @media (max-width: 720px) { .tla-ph-shell { padding: 16px 0; } .tla-ph-network-hero, .tla-ph-sector-hero, .tla-ph-directory-hero { border-radius: 20px; padding: 24px 19px; } .tla-ph-network-hero h1, .tla-ph-sector-hero h1, .tla-ph-directory-hero h1 { font-size: 39px; } .tla-ph-network-hero p, .tla-ph-sector-hero p, .tla-ph-directory-hero p { font-size: 17px; } .tla-ph-sector-card-grid, .tla-ph-directory-grid, .tla-ph-capability-grid, .tla-ph-credential-grid, .tla-ph-premium-team-grid, .tla-ph-profile-metrics-grid, .tla-ph-public-experience-links { grid-template-columns: 1fr; } .tla-ph-network-business-cta { align-items: flex-start; flex-direction: column; } .tla-ph-directory-filter { grid-template-columns: 1fr; } .tla-ph-directory-summary, .tla-ph-directory-card-footer { align-items: flex-start; flex-direction: column; } .tla-ph-profile-brand-row { align-items: flex-start; grid-template-columns: 96px 1fr; } .tla-ph-profile-logo { height: 96px; width: 96px; } .tla-ph-trust-panel { grid-column: 1/-1; } .tla-ph-profile-identity { padding-top: 42px; } .tla-ph-profile-anchor-nav { top: 0; } .tla-ph-hours-row { grid-template-columns: 1fr 1fr; } .tla-ph-hours-row > strong { grid-column: 1/-1; } } /* 0.7.3 readability for Partner Hub forms, dashboard and documentation. */ .tla-ph-dashboard-hero p, .tla-ph-onboarding-head p, .tla-ph-dashboard-card p, .tla-ph-dashboard-assurance p, .tla-ph-form-section p, .tla-ph-workspace-panel > p { font-size: 16px; line-height: 1.65; } .tla-ph-dashboard-status strong { font-size: 20px; } .tla-ph-dashboard-status span, .tla-ph-dashboard-status small, .tla-ph-dashboard-metrics span, .tla-ph-dashboard-metrics small { font-size: 13px; } .tla-ph-dashboard-metrics strong { font-size: 23px; } .tla-ph-dashboard-card h2 { font-size: 23px; } .tla-ph-dashboard-card p { font-size: 16px; } .tla-ph-card-lock, .tla-ph-card-version { font-size: 13px; } .tla-ph-form-field > label, .tla-ph-form-grid label > span, .tla-ph-profile-main-form label > span, .tla-ph-field-help, .tla-ph-field-error { font-size: 15px; } .tla-ph-input, .tla-ph-select, .tla-ph-textarea, .tla-ph-profile-main-form input, .tla-ph-profile-main-form select, .tla-ph-profile-main-form textarea { font-size: 16px; } .tla-ph-choice-grid strong, .tla-ph-option-card strong { font-size: 16px; } .tla-ph-choice-grid small, .tla-ph-option-card small { font-size: 14px; line-height: 1.55; } .tla-ph-tier-summary span { font-size: 13px; } .tla-ph-tier-summary strong { font-size: 21px; } .tla-ph-tier-summary p { font-size: 15px; } .tla-ph-help-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-help-card h2 { font-size: 24px; } .tla-ph-help-card p, .tla-ph-help-card li { font-size: 16px; line-height: 1.65; } .tla-ph-doc-columns h3 { font-size: 21px; } .tla-ph-doc-columns p, .tla-ph-doc-columns li { font-size: 15px; line-height: 1.6; } .tla-ph-media-spec-grid strong { font-size: 17px; } .tla-ph-media-spec-grid span { font-size: 15px; } .tla-ph-media-spec-grid small, .tla-ph-media-spec-grid p { font-size: 14px; line-height: 1.55; } @media(max-width:782px){.tla-ph-help-grid{grid-template-columns:1fr}} html[data-tla-theme="dark"] .tla-ph-network-nav, html[data-tla-theme="dark"] .tla-ph-sector-facts > div, html[data-tla-theme="dark"] .tla-ph-directory-legend, html[data-tla-theme="dark"] .tla-ph-directory-logo, html[data-tla-theme="dark"] .tla-ph-profile-logo { background: rgba(6,7,32,.97); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-basic, html[data-tla-theme="dark"] .tla-ph-directory-basic-note { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.1); } html[data-tla-theme="dark"] .tla-ph-directory-basic-note p { color: var(--tla-ph-muted); } html[data-tla-theme="dark"] .tla-ph-network-trust-card, html[data-tla-theme="dark"] .tla-ph-network-business-cta { background: linear-gradient(135deg,#08051f,#25114d); } .tla-ph-basic-listing-hero { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: var(--tla-ph-shadow); display: grid; gap: 20px; grid-template-columns: 110px minmax(0,1fr) auto; padding: 26px; } .tla-ph-basic-listing-logo { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; display: flex; height: 110px; justify-content: center; overflow: hidden; width: 110px; } .tla-ph-basic-listing-logo img { height: 100%; object-fit: contain; padding: 8px; width: 100%; } .tla-ph-basic-listing-logo span { color: var(--tla-ph-blue); font-size: 32px; font-weight: 900; } .tla-ph-basic-listing-identity h1 { font-size: clamp(36px,4.6vw,58px); letter-spacing: -.05em; line-height: 1.04; margin: 10px 0 7px; } .tla-ph-basic-listing-identity > p { color: var(--tla-ph-muted); font-size: 18px; margin: 0; } .tla-ph-basic-listing-actions { display: flex; flex-direction: column; gap: 9px; min-width: 220px; } .tla-ph-basic-listing-grid { align-items: start; display: grid; gap: 16px; grid-template-columns: minmax(0,1fr) minmax(300px,.4fr); margin-top: 16px; } .tla-ph-basic-listing-grid main { display: grid; gap: 14px; } .tla-ph-basic-listing-grid aside { display: grid; gap: 14px; position: sticky; top: 172px; } .tla-ph-network-listing-disclaimer { align-items: flex-start; background: #f8fafc; border: 1px solid #dbe3ed; border-radius: 17px; display: flex; gap: 11px; padding: 16px; } .tla-ph-network-listing-disclaimer .dashicons { color: #64748b; font-size: 24px; height: 24px; width: 24px; } .tla-ph-network-listing-disclaimer p { color: #526077; font-size: 15px; line-height: 1.55; margin: 0; } html[data-tla-theme="dark"] .tla-ph-network-listing-disclaimer { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.1); } html[data-tla-theme="dark"] .tla-ph-network-listing-disclaimer p { color: var(--tla-ph-muted); } @media(max-width:900px){.tla-ph-basic-listing-hero,.tla-ph-basic-listing-grid{grid-template-columns:1fr}.tla-ph-basic-listing-actions{flex-direction:row;min-width:0}.tla-ph-basic-listing-grid aside{position:static}} @media(max-width:640px){.tla-ph-basic-listing-hero{grid-template-columns:82px 1fr;padding:20px}.tla-ph-basic-listing-logo{height:82px;width:82px}.tla-ph-basic-listing-actions{grid-column:1/-1;flex-direction:column}.tla-ph-basic-listing-identity h1{font-size:36px}} /* 0.7.3 final profile readability floor: primary profile copy 17-18px, supporting UI never tiny. */ .tla-ph-premium-profile .tla-ph-profile-meta-row > span, .tla-ph-premium-profile .tla-ph-profile-anchor-nav a, .tla-ph-premium-profile .tla-ph-specialism-pills > span, .tla-ph-premium-profile .tla-ph-coverage-pills > span, .tla-ph-premium-profile .tla-ph-credential-grid small, .tla-ph-premium-profile .tla-ph-premium-team-grid strong, .tla-ph-premium-profile .tla-ph-premium-team-grid small, .tla-ph-premium-profile .tla-ph-premium-team-grid p, .tla-ph-premium-profile .tla-ph-profile-sidebar-card p, .tla-ph-premium-profile .tla-ph-opening-hours-card p, .tla-ph-premium-profile .tla-ph-messaging-card p, .tla-ph-premium-profile .tla-ph-opening-hours-list > div, .tla-ph-premium-profile .tla-ph-missing-content p, .tla-ph-premium-profile .tla-ph-missing-content a, .tla-ph-premium-profile .tla-ph-capability-grid p, .tla-ph-premium-profile .tla-ph-inline-missing { font-size: 16px; } .tla-ph-premium-profile .tla-ph-expandable-copy, .tla-ph-premium-profile .tla-ph-profile-tagline { font-size: 18px; } .tla-ph-premium-profile .tla-ph-contact-line strong, .tla-ph-premium-profile .tla-ph-phone-reveal summary, .tla-ph-premium-profile .tla-ph-profile-assurance-card strong, .tla-ph-premium-profile .tla-ph-profile-assurance-card p, .tla-ph-premium-profile .tla-ph-profile-readiness-list p, .tla-ph-premium-profile .tla-ph-profile-readiness-list li, .tla-ph-premium-profile .tla-ph-profile-readiness-list > a, .tla-ph-premium-profile .tla-ph-inquiry-card > p { font-size: 16px; } .tla-ph-premium-profile .tla-ph-contact-line small { font-size: 13px; } .tla-ph-premium-profile .tla-ph-profile-section, .tla-ph-premium-profile .tla-ph-profile-sidebar-card, .tla-ph-premium-profile .tla-ph-opening-hours-card, .tla-ph-premium-profile .tla-ph-messaging-card { padding: clamp(18px,2.1vw,25px); } /* 0.7.4 public access preview clarification */ .tla-ph-public-preview-banner{display:flex;align-items:flex-start;gap:16px;margin:0 0 22px;padding:18px 20px;border:1px solid rgba(23,178,226,.32);border-radius:20px;background:linear-gradient(135deg,rgba(23,178,226,.10),rgba(223,41,211,.08));box-shadow:0 14px 34px rgba(10,23,58,.08)}.tla-ph-public-preview-banner .dashicons{width:30px;height:30px;font-size:30px;color:#0a90f6}.tla-ph-public-preview-banner strong{display:block;margin-bottom:5px;font-size:17px;line-height:1.25}.tla-ph-public-preview-banner p{margin:0;font-size:16px;line-height:1.6;color:var(--tla-ph-text-muted)} /* 0.7.5: claim flow, membership promotion and inline access. */ .tla-ph-membership-gateway,.tla-ph-claim-page,.tla-ph-join-hub{font-size:17px;line-height:1.65} .tla-ph-membership-gateway{display:grid;gap:22px} .tla-ph-membership-gateway-hero{padding:34px;border:1px solid var(--tla-ph-border,#e1e6f0);border-radius:28px;background:linear-gradient(135deg,#fff 55%,rgba(23,178,226,.09),rgba(223,41,211,.08));box-shadow:0 20px 55px rgba(19,27,68,.08)} .tla-ph-membership-gateway-hero h2,.tla-ph-join-hero h1,.tla-ph-claim-hero h1{font-size:clamp(36px,5vw,68px);line-height:1.03;letter-spacing:-.045em;margin:.25em 0} .tla-ph-membership-gateway-hero p,.tla-ph-join-hero p,.tla-ph-claim-hero p{font-size:18px;max-width:900px} .tla-ph-membership-benefits,.tla-ph-benefit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px} .tla-ph-membership-benefits article,.tla-ph-benefit-grid article,.tla-ph-sector-opportunities article{padding:24px;border:1px solid var(--tla-ph-border,#e1e6f0);border-radius:20px;background:#fff;box-shadow:0 12px 34px rgba(19,27,68,.06)} .tla-ph-membership-benefits .dashicons,.tla-ph-benefit-grid .dashicons{font-size:30px;width:30px;height:30px;color:#0a90f6}.tla-ph-membership-benefits h3,.tla-ph-benefit-grid h2{font-size:22px;margin:14px 0 6px} .tla-ph-inline-login{max-width:720px;padding:28px;border-radius:22px;background:#fff;border:1px solid var(--tla-ph-border,#e1e6f0);box-shadow:0 18px 48px rgba(19,27,68,.08)} .tla-ph-inline-login form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.tla-ph-inline-login label{display:grid;gap:6px}.tla-ph-inline-login label span{font-weight:750}.tla-ph-inline-login input[type=text],.tla-ph-inline-login input[type=password]{min-height:52px;border:1px solid #ccd5e4;border-radius:12px;padding:0 14px;font-size:17px}.tla-ph-inline-login .tla-ph-checkbox-row,.tla-ph-inline-login button,.tla-ph-inline-login-message{grid-column:1/-1}.tla-ph-inline-login-message{font-weight:700;color:#28344f} .tla-ph-join-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:30px;padding:48px;border-radius:30px;background:linear-gradient(140deg,#fff 45%,rgba(23,178,226,.14),rgba(223,41,211,.12));border:1px solid var(--tla-ph-border,#e1e6f0);margin:22px 0} .tla-ph-join-trust{display:grid;gap:10px;align-content:center;padding:24px;border-radius:22px;background:#07071c;color:#fff}.tla-ph-join-trust strong{font-size:23px}.tla-ph-join-trust span{padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.09)} .tla-ph-benefit-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin:24px 0}.tla-ph-tier-comparison,.tla-ph-sector-opportunities{margin:44px 0}.tla-ph-sector-opportunities .tla-ph-sector-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.tla-ph-sector-opportunities h3{font-size:23px;margin:12px 0}.tla-ph-sector-opportunities a{font-weight:800} .tla-ph-claim-hero{padding:40px;border-radius:28px;background:linear-gradient(135deg,#fff 55%,rgba(10,144,246,.1),rgba(223,41,211,.08));border:1px solid var(--tla-ph-border,#e1e6f0);margin:24px 0}.tla-ph-public-two-column{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:22px}.tla-ph-public-form{display:grid;gap:16px}.tla-ph-public-form label{display:grid;gap:7px}.tla-ph-public-form label span{font-weight:750}.tla-ph-public-form input,.tla-ph-public-form textarea{font-size:17px;padding:13px 14px;border:1px solid #ccd5e4;border-radius:12px}.tla-ph-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.tla-ph-claim-next ol{padding-left:22px}.tla-ph-claim-next li{margin-bottom:12px} .tla-ph-network-listing-disclaimer{display:flex;gap:14px;padding:18px;border:1px solid #dbe5f5;border-radius:16px;background:#f7faff}.tla-ph-network-listing-disclaimer strong{font-size:18px}.tla-ph-network-listing-disclaimer a,.tla-ph-claim-listing-button{font-weight:800}.tla-ph-directory-footer-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.tla-ph-availability.is-neutral{background:#eef3fb;color:#3f4b68} @media(max-width:1020px){.tla-ph-benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-membership-benefits,.tla-ph-sector-opportunities .tla-ph-sector-card-grid{grid-template-columns:1fr 1fr}.tla-ph-join-hero,.tla-ph-public-two-column{grid-template-columns:1fr}} @media(max-width:700px){.tla-ph-membership-benefits,.tla-ph-benefit-grid,.tla-ph-sector-opportunities .tla-ph-sector-card-grid,.tla-ph-inline-login form{grid-template-columns:1fr}.tla-ph-membership-gateway-hero,.tla-ph-join-hero,.tla-ph-claim-hero{padding:24px}.tla-ph-inline-login .tla-ph-checkbox-row,.tla-ph-inline-login button,.tla-ph-inline-login-message{grid-column:auto}} html[data-tla-theme="dark"] .tla-ph-membership-gateway-hero,html[data-tla-theme="dark"] .tla-ph-membership-benefits article,html[data-tla-theme="dark"] .tla-ph-benefit-grid article,html[data-tla-theme="dark"] .tla-ph-inline-login,html[data-tla-theme="dark"] .tla-ph-claim-hero,html[data-tla-theme="dark"] .tla-ph-sector-opportunities article{background:#101225;color:#fff;border-color:#2a3052} /* Version 0.7.11 — richer claim/upgrade messaging and TLA-approved link colours. */ .tla-ph-basic-public-listing a:not(.tla-ph-frontend-button), .tla-ph-premium-profile a:not(.tla-ph-frontend-button), .tla-ph-claim-page a:not(.tla-ph-frontend-button) { color: var(--tla-ph-blue); text-decoration-color: rgba(10,144,246,.34); text-underline-offset: 3px; } .tla-ph-basic-public-listing a:not(.tla-ph-frontend-button):hover, .tla-ph-premium-profile a:not(.tla-ph-frontend-button):hover, .tla-ph-claim-page a:not(.tla-ph-frontend-button):hover { color: var(--tla-ph-violet); text-decoration-color: currentColor; } html[data-tla-theme="dark"] .tla-ph-basic-public-listing a:not(.tla-ph-frontend-button), html[data-tla-theme="dark"] .tla-ph-premium-profile a:not(.tla-ph-frontend-button), html[data-tla-theme="dark"] .tla-ph-claim-page a:not(.tla-ph-frontend-button) { color: #72d7ff; text-decoration-color: rgba(114,215,255,.4); } html[data-tla-theme="dark"] .tla-ph-basic-public-listing a:not(.tla-ph-frontend-button):hover, html[data-tla-theme="dark"] .tla-ph-premium-profile a:not(.tla-ph-frontend-button):hover, html[data-tla-theme="dark"] .tla-ph-claim-page a:not(.tla-ph-frontend-button):hover { color: #ff78e7; } .tla-ph-network-upgrade-card { background: linear-gradient(145deg, rgba(10,144,246,.075), rgba(223,41,211,.06) 52%, rgba(223,41,211,.055)); border-color: rgba(10,144,246,.2); box-shadow: 0 18px 46px rgba(32,35,96,.08); gap: 14px; padding: 20px; } .tla-ph-network-upgrade-icon { align-items: center; background: var(--tla-ph-grad); border-radius: 14px; box-shadow: 0 12px 28px rgba(223,41,211,.2); color: #fff; display: flex; flex: 0 0 46px; height: 46px; justify-content: center; width: 46px; } .tla-ph-network-upgrade-icon .dashicons { color: #fff; font-size: 24px; height: 24px; width: 24px; } .tla-ph-network-upgrade-content { min-width: 0; } .tla-ph-network-upgrade-kicker { color: var(--tla-ph-blue); display: block; font-size:0.7rem; font-weight: 900; letter-spacing: .1em; margin-bottom: 5px; text-transform: uppercase; } .tla-ph-network-upgrade-card strong { color: var(--tla-ph-heading); display: block; font-size: 20px; line-height: 1.25; } .tla-ph-network-upgrade-card p { color: var(--tla-ph-muted); font-size: 15px; line-height: 1.62; margin: 8px 0 14px; } .tla-ph-network-upgrade-label { color: var(--tla-ph-heading); font-size: 13px; font-weight: 850; margin-bottom: 8px; } .tla-ph-network-exclusions { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; } .tla-ph-network-exclusions li { align-items: flex-start; color: var(--tla-ph-text); display: flex; font-size: 13px; gap: 9px; line-height: 1.45; } .tla-ph-network-exclusions li::before { align-items: center; background: rgba(217,119,6,.11); border-radius: 50%; color: var(--tla-ph-amber); content: "–"; display: flex; flex: 0 0 20px; font-size: 14px; font-weight: 900; height: 20px; justify-content: center; margin-top: 1px; width: 20px; } .tla-ph-network-upgrade-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 16px; } .tla-ph-network-action-primary, .tla-ph-network-action-secondary { align-items: center; border-radius: 999px; display: inline-flex; font-size: 13px; font-weight: 850; justify-content: center; min-height: 44px; padding: 11px 16px; text-decoration: none !important; } .tla-ph-network-action-primary { background: var(--tla-ph-grad); box-shadow: 0 10px 26px rgba(223,41,211,.2); color: #fff !important; } .tla-ph-network-action-primary:hover { color: #fff !important; filter: brightness(1.04); transform: translateY(-1px); } .tla-ph-network-action-secondary { background: var(--tla-ph-surface); border: 1px solid rgba(10,144,246,.28); color: var(--tla-ph-blue) !important; } .tla-ph-network-action-secondary:hover { border-color: var(--tla-ph-violet); color: var(--tla-ph-violet) !important; transform: translateY(-1px); } .tla-ph-network-upgrade-card small { color: var(--tla-ph-muted-light); display: block; font-size: 11px; line-height: 1.5; margin-top: 13px; } html[data-tla-theme="dark"] .tla-ph-network-upgrade-card { background: linear-gradient(145deg, rgba(10,144,246,.13), rgba(223,41,211,.12) 52%, rgba(223,41,211,.09)); border-color: rgba(114,215,255,.18); } html[data-tla-theme="dark"] .tla-ph-network-action-secondary { background: rgba(255,255,255,.045); border-color: rgba(114,215,255,.25); color: #72d7ff !important; } html[data-tla-theme="dark"] .tla-ph-network-action-secondary:hover { border-color: #ff78e7; color: #ff78e7 !important; } @media (max-width: 640px) { .tla-ph-network-upgrade-card { align-items: flex-start; flex-direction: column; } .tla-ph-network-upgrade-actions { display: grid; grid-template-columns: 1fr; width: 100%; } .tla-ph-network-action-primary, .tla-ph-network-action-secondary { width: 100%; } } /* 0.7.13: clear public pricing and sector conversion architecture. */ .tla-ph-public-pricing{margin:48px 0;font-size:16px} .tla-ph-pricing-intro{align-items:center;background:linear-gradient(135deg,#081028 0%,#2a185e 54%,#0a90f6 145%);border:1px solid rgba(255,255,255,.12);border-radius:28px;color:#fff;display:grid;gap:28px;grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr);padding:34px} .tla-ph-pricing-intro .tla-ph-frontend-eyebrow{color:#7de5ff} .tla-ph-pricing-intro h2{color:#fff;font-size:clamp(34px,4vw,52px);letter-spacing:-.045em;line-height:1.05;margin:7px 0 12px} .tla-ph-pricing-intro p{color:rgba(255,255,255,.78);font-size:18px;line-height:1.65;margin:0;max-width:850px} .tla-ph-pricing-principle{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);border-radius:19px;display:grid;gap:10px;padding:20px} .tla-ph-pricing-principle strong{font-size:21px}.tla-ph-pricing-principle span{background:rgba(255,255,255,.08);border-radius:10px;padding:9px 11px} .tla-ph-pricing-sector-index{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr));margin:20px 0} .tla-ph-pricing-sector-index a{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:16px;color:inherit;display:grid;gap:4px;padding:16px;text-decoration:none;transition:.18s ease} .tla-ph-pricing-sector-index a:hover,.tla-ph-pricing-sector-index a:focus{border-color:rgba(10,144,246,.45);box-shadow:var(--tla-ph-shadow);transform:translateY(-2px)} .tla-ph-pricing-sector-index span{color:var(--tla-ph-muted);font-size:14px}.tla-ph-pricing-sector-index strong{color:var(--tla-ph-heading);font-size:17px} .tla-ph-pricing-sector-list{display:grid;gap:24px}.tla-ph-pricing-sector{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:24px;box-shadow:var(--tla-ph-shadow);padding:26px;scroll-margin-top:150px} .tla-ph-pricing-sector-head{align-items:flex-start;display:flex;gap:20px;justify-content:space-between;margin-bottom:20px}.tla-ph-pricing-sector-head>div>span{color:var(--tla-ph-blue);font-size:13px;font-weight:850;letter-spacing:.06em;text-transform:uppercase}.tla-ph-pricing-sector-head h3{font-size:30px;letter-spacing:-.035em;margin:5px 0 7px}.tla-ph-pricing-sector-head p{color:var(--tla-ph-muted);font-size:16px;line-height:1.55;margin:0;max-width:780px} .tla-ph-pricing-status{border-radius:999px;font-size:12px;font-weight:850;padding:8px 12px;white-space:nowrap}.tla-ph-pricing-status.is-live{background:rgba(5,150,105,.11);color:#047857}.tla-ph-pricing-status.is-preview{background:rgba(245,158,11,.12);color:#a16207} .tla-ph-public-pricing-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))} .tla-ph-public-price-card{background:linear-gradient(145deg,var(--tla-ph-surface),var(--tla-ph-soft));border:1px solid var(--tla-ph-border);border-radius:20px;display:flex;flex-direction:column;min-height:100%;padding:22px;position:relative} .tla-ph-public-price-card.is-trusted{border-color:rgba(10,144,246,.4);box-shadow:0 18px 42px rgba(10,144,246,.12)}.tla-ph-public-price-card.is-pro{border-color:rgba(223,41,211,.32)} .tla-ph-public-price-card-head{align-items:flex-start;display:flex;gap:12px;justify-content:space-between}.tla-ph-public-price-card-head span{color:var(--tla-ph-blue);font-size:12px;font-weight:850;text-transform:uppercase}.tla-ph-public-price-card h4{font-size:24px;letter-spacing:-.03em;margin:4px 0}.tla-ph-public-price-card>p{color:var(--tla-ph-muted);font-size:16px;line-height:1.55;min-height:76px} .tla-ph-public-price-value{text-align:right}.tla-ph-public-price-value strong{color:var(--tla-ph-heading);display:block;font-size:30px;letter-spacing:-.04em;line-height:1}.tla-ph-public-price-value small{color:var(--tla-ph-muted);font-size:12px} .tla-ph-public-founding-offer{background:linear-gradient(135deg,rgba(223,41,211,.085),rgba(10,144,246,.09));border:1px solid rgba(10,144,246,.24);border-radius:14px;display:grid;gap:4px;margin-top:16px;padding:13px 14px}.tla-ph-public-founding-offer>span{color:#075fa9;font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.tla-ph-public-founding-offer>strong{color:var(--tla-ph-heading);font-size:19px;line-height:1.25}.tla-ph-public-founding-offer>small{color:var(--tla-ph-muted);font-size:11px;line-height:1.5}html[data-tla-theme="dark"] .tla-ph-public-founding-offer>span{color:#7dd3fc} .tla-ph-public-price-card ul{display:grid;gap:9px;list-style:none;margin:8px 0 20px;padding:0}.tla-ph-public-price-card li{align-items:flex-start;display:flex;font-size:15px;gap:8px;line-height:1.45}.tla-ph-public-price-card li .dashicons{flex:0 0 18px;font-size:18px;height:18px;width:18px}.tla-ph-public-price-card li.is-on .dashicons{color:#059669}.tla-ph-public-price-card li.is-off{color:var(--tla-ph-muted)} .tla-ph-public-price-card .tla-ph-frontend-button{margin-top:auto;text-align:center}.tla-ph-plan-pending-note{color:var(--tla-ph-muted);display:block;font-size:12px;line-height:1.45;margin-top:9px} .tla-ph-pricing-footnote{align-items:flex-start;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:16px;display:flex;gap:11px;margin-top:20px;padding:16px 18px}.tla-ph-pricing-footnote .dashicons{color:var(--tla-ph-blue);flex:0 0 22px}.tla-ph-pricing-footnote p{color:var(--tla-ph-muted);font-size:14px;line-height:1.55;margin:0} .tla-ph-public-pricing.is-compact .tla-ph-pricing-sector-index{display:none}.tla-ph-public-pricing.is-compact .tla-ph-pricing-intro{padding:28px}.tla-ph-public-pricing.is-compact .tla-ph-pricing-sector{box-shadow:none} html[data-tla-theme="dark"] .tla-ph-pricing-status.is-live{background:rgba(52,211,153,.12);color:#6ee7b7}html[data-tla-theme="dark"] .tla-ph-pricing-status.is-preview{background:rgba(251,191,36,.12);color:#fcd34d} @media(max-width:1050px){.tla-ph-public-pricing-grid{grid-template-columns:1fr}.tla-ph-public-price-card>p{min-height:0}.tla-ph-pricing-sector-index{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:760px){.tla-ph-pricing-intro{grid-template-columns:1fr;padding:24px}.tla-ph-pricing-sector-index{grid-template-columns:1fr}.tla-ph-pricing-sector{padding:19px}.tla-ph-pricing-sector-head{flex-direction:column}.tla-ph-public-price-card-head{flex-direction:column}.tla-ph-public-price-value{text-align:left}} /* 0.7.14: local Market Opportunity explorer. */ .tla-ph-market-opportunity{background:linear-gradient(135deg,rgba(10,144,246,.07),rgba(223,41,211,.055) 54%,rgba(223,41,211,.06)),var(--tla-ph-surface);border:1px solid rgba(10,144,246,.2);border-radius:28px;box-shadow:var(--tla-ph-shadow);margin:26px 0 22px;overflow:hidden;padding:clamp(24px,4vw,42px);position:relative} .tla-ph-market-opportunity:before{background:linear-gradient(90deg,#17b2e2,#df29d3,#df29d3);content:"";height:5px;left:0;position:absolute;right:0;top:0} .tla-ph-market-opportunity-head{align-items:center;display:grid;gap:28px;grid-template-columns:minmax(0,1.35fr) minmax(230px,.65fr)} .tla-ph-market-opportunity-head h2{color:var(--tla-ph-heading);font-size:clamp(30px,4vw,46px);letter-spacing:-.045em;line-height:1.07;margin:7px 0 12px}.tla-ph-market-opportunity-head p{color:var(--tla-ph-muted);font-size:17px;line-height:1.65;margin:0;max-width:800px} .tla-ph-market-national{background:linear-gradient(135deg,#081028,#2a185e 58%,#0a90f6 145%);border:1px solid rgba(255,255,255,.12);border-radius:20px;color:#fff;padding:22px;text-align:center}.tla-ph-market-national strong{display:block;font-size:38px;letter-spacing:-.04em;line-height:1}.tla-ph-market-national span{color:rgba(255,255,255,.78);display:block;font-size:13px;line-height:1.4;margin-top:8px} .tla-ph-market-form{align-items:end;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:20px;display:grid;gap:14px;grid-template-columns:1fr 1fr .75fr auto;margin-top:28px;padding:18px}.tla-ph-market-form label{display:grid;gap:7px}.tla-ph-market-form label>span{color:var(--tla-ph-heading);font-size:13px;font-weight:800}.tla-ph-market-form input,.tla-ph-market-form select{background:var(--tla-ph-bg);border:1px solid var(--tla-ph-border);border-radius:12px;color:var(--tla-ph-text);font-size:16px;min-height:50px;padding:10px 12px;width:100%} .tla-ph-market-loading,.tla-ph-market-error{border-radius:14px;margin-top:16px;padding:14px 16px}.tla-ph-market-loading{align-items:center;background:rgba(10,144,246,.08);color:var(--tla-ph-blue);display:flex;gap:10px}.tla-ph-market-error{background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.18);color:#b91c1c} .tla-ph-market-results{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:22px;margin-top:20px;padding:22px}.tla-ph-market-results>header{align-items:flex-start;display:flex;gap:20px;justify-content:space-between}.tla-ph-market-result-kicker{color:var(--tla-ph-blue);font-size:12px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}.tla-ph-market-result-title{color:var(--tla-ph-heading);font-size:30px;letter-spacing:-.035em;margin:5px 0 0}.tla-ph-market-signal{background:rgba(5,150,105,.1);border-radius:999px;color:#047857;font-size:12px;font-weight:850;padding:8px 12px;white-space:nowrap} .tla-ph-market-stat-grid{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:20px}.tla-ph-market-stat-grid article{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:16px;padding:16px}.tla-ph-market-stat-grid small{color:var(--tla-ph-muted);display:block;font-size:12px;font-weight:750}.tla-ph-market-stat-grid strong{color:var(--tla-ph-heading);display:block;font-size:30px;letter-spacing:-.04em;line-height:1.1;margin:7px 0}.tla-ph-market-stat-grid span{color:var(--tla-ph-muted);display:block;font-size:11px;line-height:1.4} .tla-ph-market-detail-grid{display:grid;gap:16px;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);margin-top:16px}.tla-ph-market-detail-grid>div{border:1px solid var(--tla-ph-border);border-radius:16px;padding:18px}.tla-ph-market-detail-grid h4{color:var(--tla-ph-heading);font-size:17px;margin:0 0 12px}.tla-ph-market-business-list{display:grid;gap:8px}.tla-ph-market-business{align-items:center;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:12px;color:var(--tla-ph-text)!important;display:grid;gap:3px;grid-template-columns:minmax(0,1fr) auto;padding:11px 13px;text-decoration:none!important}.tla-ph-market-business strong{font-size:14px}.tla-ph-market-business span{color:var(--tla-ph-blue);font-size:0.7rem;font-weight:800;grid-row:2}.tla-ph-market-business small{color:var(--tla-ph-muted);font-size:11px;grid-column:2;grid-row:1/3}.tla-ph-market-disclaimer{color:var(--tla-ph-muted);font-size:13px;line-height:1.6;margin:0}.tla-ph-market-updated{color:var(--tla-ph-muted);display:block;font-size:0.7rem;margin-top:10px}.tla-ph-market-empty{color:var(--tla-ph-muted);font-size:14px;margin:0} html[data-tla-theme="dark"] .tla-ph-market-signal{background:rgba(52,211,153,.12);color:#6ee7b7}html[data-tla-theme="dark"] .tla-ph-market-error{color:#fca5a5} @media(max-width:1050px){.tla-ph-market-form{grid-template-columns:1fr 1fr}.tla-ph-market-form button{width:100%}.tla-ph-market-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:760px){.tla-ph-market-opportunity-head,.tla-ph-market-form,.tla-ph-market-detail-grid{grid-template-columns:1fr}.tla-ph-market-stat-grid{grid-template-columns:1fr}.tla-ph-market-results>header{align-items:flex-start;flex-direction:column}.tla-ph-market-signal{white-space:normal}} /* 0.7.15: wider TLA audience benchmarks and transparent local modelling. */ .tla-ph-market-benchmark-grid{display:grid;gap:10px;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:24px}.tla-ph-market-benchmark-grid article{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:15px;padding:15px}.tla-ph-market-benchmark-grid small{color:var(--tla-ph-muted);display:block;font-size:0.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.tla-ph-market-benchmark-grid strong{color:var(--tla-ph-heading);display:block;font-size:24px;letter-spacing:-.035em;margin:5px 0}.tla-ph-market-benchmark-grid span{color:var(--tla-ph-muted);display:block;font-size:0.7rem;line-height:1.35}.tla-ph-market-model-note{align-items:flex-start;background:rgba(10,144,246,.065);border:1px solid rgba(10,144,246,.16);border-radius:14px;display:grid;gap:3px;margin-top:15px;padding:13px 15px}.tla-ph-market-model-note strong{color:var(--tla-ph-heading);font-size:13px}.tla-ph-market-model-note p{color:var(--tla-ph-muted);font-size:12px;line-height:1.55;margin:0}.tla-ph-market-model-note a,.tla-ph-market-media-link{color:var(--tla-ph-blue)!important;font-weight:800}.tla-ph-market-sample{color:var(--tla-ph-muted);display:block;font-size:0.7rem;margin-top:10px}.tla-ph-market-media-link{display:inline-flex;font-size:12px;margin-top:12px;text-decoration:none!important} @media(max-width:1050px){.tla-ph-market-benchmark-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.tla-ph-market-benchmark-grid{grid-template-columns:1fr 1fr}} @media(max-width:480px){.tla-ph-market-benchmark-grid{grid-template-columns:1fr}} /* 0.7.15: media-kit audience quality indicators. */ .tla-ph-market-planning-context{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:20px;margin-top:18px;padding:20px} .tla-ph-market-planning-head{align-items:flex-end;display:flex;gap:20px;justify-content:space-between;margin-bottom:15px} .tla-ph-market-planning-head h3{color:var(--tla-ph-heading);font-size:21px;letter-spacing:-.025em;margin:5px 0 0} .tla-ph-market-planning-head small{color:var(--tla-ph-muted);font-size:11px;line-height:1.45;max-width:250px;text-align:right} .tla-ph-market-planning-grid{display:grid;gap:10px;grid-template-columns:repeat(7,minmax(0,1fr))} .tla-ph-market-planning-grid article{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:14px;min-height:118px;padding:14px} .tla-ph-market-planning-grid strong{background:linear-gradient(90deg,#0a90f6,#df29d3,#df29d3);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;display:block;font-size:25px;letter-spacing:-.035em;line-height:1} .tla-ph-market-planning-grid span{color:var(--tla-ph-muted);display:block;font-size:11px;line-height:1.45;margin-top:8px} @media(max-width:1180px){.tla-ph-market-planning-grid{grid-template-columns:repeat(4,minmax(0,1fr))}} @media(max-width:760px){.tla-ph-market-planning-head{align-items:flex-start;flex-direction:column}.tla-ph-market-planning-head small{text-align:left}.tla-ph-market-planning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:430px){.tla-ph-market-planning-grid{grid-template-columns:1fr}} /* 0.7.16: national published audience remains visible when the local postcode sample is unavailable. */ /* 0.7.17: complete audience-model opportunity report. */ .tla-ph-market-results{padding:clamp(20px,3vw,30px)} .tla-ph-market-results-head{border-bottom:1px solid var(--tla-ph-border);padding-bottom:20px} .tla-ph-market-result-method{color:var(--tla-ph-muted);font-size:14px;line-height:1.55;margin:8px 0 0} .tla-ph-market-report-section{border-top:1px solid var(--tla-ph-border);margin-top:24px;padding-top:24px} .tla-ph-market-report-section:first-of-type{border-top:0;margin-top:18px;padding-top:0} .tla-ph-market-section-head{align-items:flex-end;display:flex;gap:18px;justify-content:space-between;margin-bottom:15px} .tla-ph-market-section-head span{color:var(--tla-ph-blue);display:block;font-size:0.7rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase} .tla-ph-market-section-head h4{color:var(--tla-ph-heading);font-size:clamp(20px,2.4vw,28px);letter-spacing:-.035em;line-height:1.1;margin:5px 0 0} .tla-ph-market-stat-grid.is-five{grid-template-columns:repeat(5,minmax(0,1fr))}.tla-ph-market-stat-grid.is-four{grid-template-columns:repeat(4,minmax(0,1fr))} .tla-ph-market-financial-grid{display:grid;gap:11px;grid-template-columns:repeat(4,minmax(0,1fr))} .tla-ph-market-financial-grid article{background:linear-gradient(145deg,var(--tla-ph-soft),var(--tla-ph-surface));border:1px solid var(--tla-ph-border);border-radius:15px;min-height:112px;padding:15px} .tla-ph-market-financial-grid small{color:var(--tla-ph-muted);display:block;font-size:11px;font-weight:750;line-height:1.35} .tla-ph-market-financial-grid strong{background:linear-gradient(90deg,#0a90f6,#df29d3,#df29d3);background-clip:text;-webkit-background-clip:text;color:transparent;display:block;font-size:clamp(21px,2.2vw,29px);letter-spacing:-.04em;line-height:1.05;margin-top:10px;-webkit-text-fill-color:transparent} .tla-ph-market-rate-grid{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))} .tla-ph-market-rate-grid>div{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:15px;padding:15px} .tla-ph-market-rate-grid>div>div{align-items:flex-start;display:flex;gap:10px;justify-content:space-between}.tla-ph-market-rate-grid strong{color:var(--tla-ph-heading);font-size:24px;letter-spacing:-.03em}.tla-ph-market-rate-grid span{color:var(--tla-ph-muted);font-size:11px;line-height:1.35;max-width:120px;text-align:right}.tla-ph-market-rate-grid i,.tla-ph-market-intent-card>i,.tla-ph-market-profile-row>i{background:rgba(10,144,246,.1);border-radius:999px;display:block;height:7px;margin-top:12px;overflow:hidden}.tla-ph-market-rate-grid i b,.tla-ph-market-intent-card>i b,.tla-ph-market-profile-row>i b{background:linear-gradient(90deg,#17b2e2,#df29d3,#df29d3);border-radius:inherit;display:block;height:100%;transition:width .7s ease;width:0} .tla-ph-market-intent-grid{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px} .tla-ph-market-intent-card{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:14px;padding:14px}.tla-ph-market-intent-card>div{align-items:flex-start;display:flex;gap:10px;justify-content:space-between}.tla-ph-market-intent-card strong{color:var(--tla-ph-heading);font-size:22px}.tla-ph-market-intent-card span{color:var(--tla-ph-text);font-size:12px;font-weight:750;line-height:1.35;text-align:right}.tla-ph-market-intent-card small{color:var(--tla-ph-muted);display:block;font-size:0.7rem;margin-top:7px} .tla-ph-market-profile-grid{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.tla-ph-market-profile-card{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:16px;padding:16px}.tla-ph-market-profile-card h5{color:var(--tla-ph-heading);font-size:15px;margin:0 0 13px}.tla-ph-market-profile-bars{display:grid;gap:10px}.tla-ph-market-profile-row>div{align-items:center;display:flex;gap:10px;justify-content:space-between}.tla-ph-market-profile-row span{color:var(--tla-ph-text);font-size:11px;line-height:1.25}.tla-ph-market-profile-row strong{color:var(--tla-ph-muted);font-size:0.7rem;white-space:nowrap}.tla-ph-market-profile-row>i{height:5px;margin-top:5px} .tla-ph-market-area-list{display:grid;gap:8px;margin:0 0 15px}.tla-ph-market-area{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:12px;display:grid;gap:2px;padding:10px 11px}.tla-ph-market-area strong{color:var(--tla-ph-heading);font-size:12px}.tla-ph-market-area span{color:var(--tla-ph-blue);font-size:0.7rem;font-weight:800}.tla-ph-market-area small{color:var(--tla-ph-muted);font-size:0.68rem} .tla-ph-market-business span{font-size:11px;line-height:1.3} @media(max-width:1180px){.tla-ph-market-stat-grid.is-five{grid-template-columns:repeat(3,minmax(0,1fr))}.tla-ph-market-financial-grid,.tla-ph-market-intent-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:900px){.tla-ph-market-financial-grid,.tla-ph-market-rate-grid,.tla-ph-market-intent-grid,.tla-ph-market-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:620px){.tla-ph-market-stat-grid.is-five,.tla-ph-market-stat-grid.is-four,.tla-ph-market-financial-grid,.tla-ph-market-rate-grid,.tla-ph-market-intent-grid,.tla-ph-market-profile-grid{grid-template-columns:1fr}} /* 0.7.17: agency-first pricing with collapsible future-sector previews. */ .tla-ph-pricing-sector-accordion{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:22px;box-shadow:0 12px 34px rgba(19,27,68,.055);margin-top:16px;overflow:hidden} .tla-ph-pricing-sector-accordion>summary{cursor:pointer;list-style:none;padding:22px 24px}.tla-ph-pricing-sector-accordion>summary::-webkit-details-marker{display:none} .tla-ph-pricing-accordion-summary{align-items:center;display:grid;gap:24px;grid-template-columns:minmax(0,1fr) auto}.tla-ph-pricing-accordion-summary>div:first-child>span{color:var(--tla-ph-blue);display:block;font-size:0.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.tla-ph-pricing-accordion-summary h3{color:var(--tla-ph-heading);font-size:24px;letter-spacing:-.035em;margin:4px 0 7px}.tla-ph-pricing-accordion-summary p{color:var(--tla-ph-muted);font-size:14px;line-height:1.5;margin:0;max-width:760px}.tla-ph-pricing-accordion-meta{align-items:flex-end;display:flex;flex-direction:column;gap:7px;min-width:160px}.tla-ph-pricing-accordion-meta strong{color:var(--tla-ph-heading);font-size:13px}.tla-ph-pricing-accordion-meta i{color:var(--tla-ph-blue);font-size:20px;height:20px;transition:transform .2s;width:20px}.tla-ph-pricing-sector-accordion[open] .tla-ph-pricing-accordion-meta i{transform:rotate(180deg)} .tla-ph-pricing-sector-accordion-body{border-top:1px solid var(--tla-ph-border);padding:0}.tla-ph-pricing-sector-accordion-body>.tla-ph-pricing-sector{border:0;border-radius:0;box-shadow:none;margin:0}.tla-ph-pricing-sector-accordion-body .tla-ph-pricing-sector-head{display:none} /* 0.9.12: hard-pin pricing heading sizes so no theme/Elementor/global heading rule can inflate a single sector card (e.g. Insurance rendering oversized while its siblings render correctly). Specificity + !important guarantees uniformity regardless of stylesheet load order on the live page. */ body.tla-ph-join-partner-page .tla-ph-pricing-accordion-summary h3, .tla-ph-public-pricing .tla-ph-pricing-accordion-summary h3 { font-size: 24px !important; font-weight: 800 !important; letter-spacing: -.035em !important; line-height: 1.25 !important; margin: 4px 0 7px !important; } body.tla-ph-join-partner-page .tla-ph-pricing-sector-head h3, .tla-ph-public-pricing .tla-ph-pricing-sector-head h3 { font-size: 30px !important; font-weight: 800 !important; letter-spacing: -.035em !important; line-height: 1.2 !important; margin: 5px 0 7px !important; } @media(max-width:700px){.tla-ph-pricing-accordion-summary{align-items:flex-start;grid-template-columns:1fr}.tla-ph-pricing-accordion-meta{align-items:flex-start;min-width:0}} /* 0.7.17: public business listing search and claim journey. */ .tla-ph-directory-claim-panel{align-items:center;background:linear-gradient(135deg,rgba(10,144,246,.08),rgba(223,41,211,.06),rgba(223,41,211,.055));border:1px solid rgba(10,144,246,.2);border-radius:22px;display:grid;gap:18px;grid-template-columns:auto minmax(0,1fr) auto;margin:20px 0;padding:22px}.tla-ph-directory-claim-icon{align-items:center;background:var(--tla-ph-grad);border-radius:15px;box-shadow:0 12px 28px rgba(223,41,211,.2);color:#fff;display:flex;height:52px;justify-content:center;width:52px}.tla-ph-directory-claim-icon .dashicons{font-size:27px;height:27px;width:27px}.tla-ph-directory-claim-panel>div:nth-child(2)>span{color:var(--tla-ph-blue);display:block;font-size:0.7rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.tla-ph-directory-claim-panel h2{color:var(--tla-ph-heading);font-size:22px;letter-spacing:-.03em;margin:4px 0 6px}.tla-ph-directory-claim-panel p{color:var(--tla-ph-muted);font-size:14px;line-height:1.55;margin:0;max-width:850px}.tla-ph-directory-filter.is-expanded{grid-template-columns:1.25fr .8fr 1fr 1fr}.tla-ph-directory-filter.is-expanded label.is-wide{grid-column:span 2}.tla-ph-directory-filter.is-expanded .tla-ph-check{align-self:center}.tla-ph-directory-filter.is-expanded button{align-self:end} @media(max-width:1050px){.tla-ph-directory-filter.is-expanded{grid-template-columns:1fr 1fr}.tla-ph-directory-filter.is-expanded label.is-wide{grid-column:1/-1}.tla-ph-directory-claim-panel{grid-template-columns:auto minmax(0,1fr)}.tla-ph-directory-claim-panel>a{grid-column:1/-1;justify-self:start}} @media(max-width:650px){.tla-ph-directory-filter.is-expanded,.tla-ph-directory-claim-panel{grid-template-columns:1fr}.tla-ph-directory-filter.is-expanded label.is-wide{grid-column:auto}.tla-ph-directory-claim-icon{height:46px;width:46px}} .tla-ph-market-average-grid{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:12px}.tla-ph-market-average-grid article{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:14px;padding:14px}.tla-ph-market-average-grid small{color:var(--tla-ph-muted);display:block;font-size:0.7rem;font-weight:800;text-transform:uppercase}.tla-ph-market-average-grid strong{color:var(--tla-ph-heading);display:block;font-size:24px;margin:7px 0 3px}.tla-ph-market-average-grid span{color:var(--tla-ph-muted);font-size:0.7rem}.tla-ph-market-rate-grid{grid-template-columns:repeat(3,minmax(0,1fr))} @media(max-width:900px){.tla-ph-market-average-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:620px){.tla-ph-market-average-grid{grid-template-columns:1fr}} /* ========================================================= Market Opportunity report redesign - 0.7.18 ========================================================= */ .tla-ph-market-opportunity { background: transparent; border: 0; border-radius: 0; box-shadow: none; color: var(--tla-ph-text, #101225); margin: clamp(42px, 7vw, 92px) 0 0; max-width: none; overflow: visible; padding: 0; width: 100%; } .tla-ph-market-hero, .tla-ph-market-search-shell, .tla-ph-market-report-header, .tla-ph-market-panel, .tla-ph-market-tabs, .tla-ph-market-local-ribbon { margin-left: auto; margin-right: auto; max-width: 1440px; width: calc(100% - clamp(24px, 6vw, 96px)); } .tla-ph-market-hero { align-items: center; background: linear-gradient(135deg, rgba(10,144,246,.09), rgba(223,41,211,.08) 55%, rgba(223,41,211,.08)); border: 1px solid rgba(10,144,246,.15); border-radius: 30px; display: grid; gap: clamp(28px, 5vw, 70px); grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr); padding: clamp(30px, 5vw, 68px); } .tla-ph-market-hero h2 {font-size: clamp(2rem, 4vw, 3.75rem); letter-spacing: -.055em; line-height: 1.02; margin: 12px 0 18px; max-width: 900px;} .tla-ph-market-hero p {font-size: clamp(17px, 1.7vw, 21px); line-height: 1.65; margin: 0; max-width: 850px;} .tla-ph-market-uk-proof {display: grid; gap: 12px; grid-template-columns: 1fr 1fr;} .tla-ph-market-uk-proof > div {align-items: center; background: var(--tla-ph-surface, #fff); border: 1px solid rgba(10,144,246,.13); border-radius: 20px; display: grid; gap: 3px; grid-template-columns: 40px 1fr; padding: 18px;} .tla-ph-market-uk-proof .dashicons {align-items: center; background: rgba(10,144,246,.09); border-radius: 12px; color: #0a90f6; display: flex; grid-row: 1 / 3; height: 40px; justify-content: center; width: 40px;} .tla-ph-market-uk-proof strong {font-size: 25px; line-height: 1;} .tla-ph-market-uk-proof small {color: var(--tla-ph-muted, #60657d); font-size: 12px; line-height: 1.35;} .tla-ph-market-search-shell {background: var(--tla-ph-surface, #fff); border: 1px solid rgba(10,144,246,.15); border-radius: 26px; box-shadow: 0 22px 65px rgba(13,20,57,.1); margin-top: -22px; padding: clamp(24px, 4vw, 38px); position: relative; z-index: 2;} .tla-ph-market-search-intro {align-items: center; display: flex; gap: 14px; margin-bottom: 22px;} .tla-ph-market-search-intro > .dashicons {align-items: center; background: linear-gradient(135deg,#17b2e2,#df29d3); border-radius: 14px; color: #fff; display: flex; height: 46px; justify-content: center; width: 46px;} .tla-ph-market-search-intro strong,.tla-ph-market-search-intro span {display:block}.tla-ph-market-search-intro strong{font-size:19px}.tla-ph-market-search-intro span{color:var(--tla-ph-muted,#60657d);font-size:14px;margin-top:3px} .tla-ph-market-form {align-items: end; display: grid; gap: 14px; grid-template-columns: 1.1fr 1fr .7fr auto;} .tla-ph-market-form label {display: grid; gap: 8px;} .tla-ph-market-form label > span {font-size: 13px; font-weight: 800; letter-spacing: .02em;} .tla-ph-market-form input,.tla-ph-market-form select {background: var(--tla-ph-surface-alt,#f7f8fc); border: 1px solid rgba(87,96,132,.2); border-radius: 14px; color: var(--tla-ph-text,#101225); font-size: 17px; min-height: 54px; padding: 0 16px; width: 100%;} .tla-ph-market-form button {min-height: 54px; white-space: nowrap;}.tla-ph-market-form button .dashicons{margin-right:7px} .tla-ph-market-source-line {align-items: center; color: var(--tla-ph-muted,#60657d); display: flex; flex-wrap: wrap; font-size: 13px; gap: 7px; margin: 18px 0 0;}.tla-ph-market-source-line a{font-weight:800} .tla-ph-market-loading,.tla-ph-market-error {margin: 30px auto; max-width: 1320px; width: calc(100% - 48px);}.tla-ph-market-loading{align-items:center;display:flex;gap:10px}.tla-ph-market-error{background:#fff3f4;border:1px solid #ef8894;border-radius:14px;color:#9b1730;padding:16px 20px} .tla-ph-market-results {margin-top: clamp(40px, 6vw, 76px);} .tla-ph-market-report-header {align-items: flex-end; display: flex; gap: 26px; justify-content: space-between; padding-bottom: 24px;} .tla-ph-market-report-header h3 {font-size: clamp(2.1rem,4vw,4rem); letter-spacing: -.055em; line-height: 1; margin: 8px 0 12px;} .tla-ph-market-result-kicker {color:#0a90f6;font-size:13px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.tla-ph-market-result-method{color:var(--tla-ph-muted,#60657d);font-size:16px;line-height:1.6;margin:0;max-width:900px} .tla-ph-market-report-actions {align-items: flex-end; display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end;}.tla-ph-market-report-actions button{align-items:center;background:var(--tla-ph-surface,#fff);border:1px solid rgba(10,144,246,.22);border-radius:999px;color:#0a90f6;cursor:pointer;display:flex;font-weight:800;gap:7px;padding:12px 17px}.tla-ph-market-signal{background:linear-gradient(90deg,#df29d3,#0a90f6);border-radius:999px;color:#fff;font-size:13px;font-weight:900;padding:12px 17px} .tla-ph-market-local-ribbon {align-items:center;background:#eaf8ff;border:1px solid #b9e8ff;border-radius:16px;color:#133c62;display:flex;gap:12px;margin-bottom:18px;padding:15px 20px}.tla-ph-market-local-ribbon strong{font-size:15px}.tla-ph-market-local-ribbon span:last-child{font-size:14px} .tla-ph-market-tabs {background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.14);border-radius:18px;display:flex;gap:6px;overflow-x:auto;padding:7px;position:sticky;top:84px;z-index:20}.tla-ph-market-tabs button{align-items:center;background:transparent;border:0;border-radius:14px;color:var(--tla-ph-muted,#60657d);cursor:pointer;display:flex;flex:1;font-size:14px;font-weight:800;gap:7px;justify-content:center;min-width:140px;padding:13px 14px;white-space:nowrap}.tla-ph-market-tabs button[aria-selected="true"]{background:linear-gradient(90deg,#df29d3,#0a90f6);color:#fff;box-shadow:0 8px 22px rgba(48,79,220,.24)} .tla-ph-market-panel {padding: clamp(28px,4vw,52px) 0 0;}.tla-ph-market-panel[hidden]{display:none!important}.tla-ph-market-panel.is-active{animation:tlaPhReportIn .25s ease}@keyframes tlaPhReportIn{from{opacity:.25;transform:translateY(6px)}to{opacity:1;transform:none}} .tla-ph-market-overview-grid {display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr));}.tla-ph-market-kpi{background:var(--tla-ph-surface,#fff);border:1px solid rgba(10,144,246,.14);border-radius:22px;min-height:190px;padding:24px;position:relative}.tla-ph-market-kpi>.dashicons{align-items:center;background:rgba(10,144,246,.09);border-radius:12px;color:#0a90f6;display:flex;height:42px;justify-content:center;margin-bottom:28px;width:42px}.tla-ph-market-kpi small{color:var(--tla-ph-muted,#60657d);display:block;font-size:13px;font-weight:800;line-height:1.35}.tla-ph-market-kpi strong{display:block;font-size:clamp(2rem,3vw,3.2rem);letter-spacing:-.05em;line-height:1;margin:8px 0}.tla-ph-market-kpi p{color:var(--tla-ph-muted,#60657d);font-size:13px;line-height:1.45;margin:0} .tla-ph-market-partner-cta {align-items:center;background:linear-gradient(125deg,#050421 0%,#111456 55%,#182b79 100%);border-radius:28px;color:#fff;display:grid;gap:35px;grid-template-columns:1.2fr .8fr;margin-top:20px;overflow:hidden;padding:clamp(30px,5vw,58px);position:relative}.tla-ph-market-partner-cta:after{background:radial-gradient(circle,rgba(223,41,211,.35),transparent 68%);content:"";height:380px;position:absolute;right:-130px;top:-160px;width:380px}.tla-ph-market-partner-cta h4{color:#fff;font-size:clamp(1.8rem,3vw,3rem);letter-spacing:-.04em;line-height:1.08;margin:10px 0 14px}.tla-ph-market-partner-cta p{color:#d8dcff;font-size:16px;line-height:1.65;max-width:760px}.tla-ph-market-partner-cta-copy,.tla-ph-market-partner-cta-stats{position:relative;z-index:1}.tla-ph-market-partner-cta-stats{display:grid;gap:10px}.tla-ph-market-partner-cta-stats>div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:16px;display:grid;gap:2px;grid-template-columns:74px 1fr;padding:16px 18px}.tla-ph-market-partner-cta-stats strong{font-size:30px}.tla-ph-market-partner-cta-stats span{align-self:center;color:#d8dcff;font-size:13px;line-height:1.4} .tla-ph-market-section-heading{margin-bottom:25px}.tla-ph-market-section-heading>span{color:#0a90f6;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.tla-ph-market-section-heading h4{font-size:clamp(1.7rem,3vw,2.8rem);letter-spacing:-.045em;margin:8px 0 10px}.tla-ph-market-section-heading p{color:var(--tla-ph-muted,#60657d);font-size:16px;line-height:1.6;margin:0;max-width:900px} .tla-ph-market-icon-stat-grid{display:grid;gap:14px;grid-template-columns:repeat(5,minmax(0,1fr))}.tla-ph-market-icon-stat-grid article{background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.13);border-radius:20px;padding:22px}.tla-ph-market-icon-stat-grid .dashicons{color:#0a90f6;font-size:25px;height:25px;width:25px}.tla-ph-market-icon-stat-grid small{color:var(--tla-ph-muted,#60657d);display:block;font-size:12px;font-weight:800;margin:20px 0 7px}.tla-ph-market-icon-stat-grid strong{font-size:30px} .tla-ph-market-landlord-strip{background:linear-gradient(90deg,rgba(10,144,246,.08),rgba(223,41,211,.07));border:1px solid rgba(10,144,246,.14);border-radius:20px;display:grid;gap:0;grid-template-columns:repeat(4,1fr);margin:18px 0;padding:20px}.tla-ph-market-landlord-strip>div{border-right:1px solid rgba(87,96,132,.16);padding:7px 20px}.tla-ph-market-landlord-strip>div:last-child{border-right:0}.tla-ph-market-landlord-strip strong,.tla-ph-market-landlord-strip span{display:block}.tla-ph-market-landlord-strip strong{font-size:27px}.tla-ph-market-landlord-strip span{color:var(--tla-ph-muted,#60657d);font-size:13px;margin-top:3px} .tla-ph-market-profile-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}.tla-ph-market-profile-card{background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.13);border-radius:20px;padding:22px}.tla-ph-market-profile-card h5{font-size:17px;margin:0 0 18px}.tla-ph-market-profile-row{margin:12px 0}.tla-ph-market-profile-row>div{display:flex;font-size:12px;gap:10px;justify-content:space-between}.tla-ph-market-profile-row>div span{color:var(--tla-ph-muted,#60657d)}.tla-ph-market-profile-row i,.tla-ph-market-intent-card i,.tla-ph-market-rate-grid i{background:rgba(87,96,132,.12);border-radius:999px;display:block;height:6px;margin-top:7px;overflow:hidden}.tla-ph-market-profile-row i b,.tla-ph-market-intent-card i b,.tla-ph-market-rate-grid i b{background:linear-gradient(90deg,#17b2e2,#df29d3,#df29d3);border-radius:inherit;display:block;height:100%} .tla-ph-market-finance-groups{display:grid;gap:20px}.tla-ph-market-finance-groups>section{background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.13);border-radius:24px;padding:25px}.tla-ph-market-finance-groups>section>header{align-items:center;display:flex;gap:14px;margin-bottom:20px}.tla-ph-market-finance-groups>section>header>.dashicons{align-items:center;background:rgba(10,144,246,.09);border-radius:14px;color:#0a90f6;display:flex;height:46px;justify-content:center;width:46px}.tla-ph-market-finance-groups h5{font-size:20px;margin:0 0 3px}.tla-ph-market-finance-groups header p{color:var(--tla-ph-muted,#60657d);font-size:13px;margin:0}.tla-ph-market-finance-grid{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))}.tla-ph-market-finance-grid article{background:var(--tla-ph-surface-alt,#f7f8fc);border-radius:15px;padding:17px}.tla-ph-market-finance-grid small{color:var(--tla-ph-muted,#60657d);display:block;font-size:12px;line-height:1.35;min-height:33px}.tla-ph-market-finance-grid strong{display:block;font-size:24px;margin-top:8px} .tla-ph-market-rate-grid{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}.tla-ph-market-rate-grid>div{background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.13);border-radius:18px;padding:18px}.tla-ph-market-rate-grid>div>div{align-items:center;display:flex;gap:10px;justify-content:space-between}.tla-ph-market-rate-grid strong{font-size:25px}.tla-ph-market-rate-grid span{color:var(--tla-ph-muted,#60657d);font-size:13px;text-align:right}.tla-ph-market-average-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:16px}.tla-ph-market-average-grid article{background:linear-gradient(135deg,rgba(10,144,246,.07),rgba(223,41,211,.06));border:1px solid rgba(10,144,246,.13);border-radius:18px;padding:20px}.tla-ph-market-average-grid small,.tla-ph-market-average-grid span{color:var(--tla-ph-muted,#60657d);display:block;font-size:12px}.tla-ph-market-average-grid strong{display:block;font-size:27px;margin:6px 0} .tla-ph-market-intent-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:20px}.tla-ph-market-intent-card{align-items:flex-start;background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.13);border-radius:18px;display:flex;gap:13px;padding:18px}.tla-ph-market-intent-card>.dashicons{color:#0a90f6;margin-top:2px}.tla-ph-market-intent-card>div{flex:1}.tla-ph-market-intent-card strong,.tla-ph-market-intent-card span,.tla-ph-market-intent-card small{display:block}.tla-ph-market-intent-card strong{font-size:23px}.tla-ph-market-intent-card span{font-size:13px;font-weight:800;margin:3px 0}.tla-ph-market-intent-card small{color:var(--tla-ph-muted,#60657d);font-size:11px} .tla-ph-market-partners-layout{display:grid;gap:22px;grid-template-columns:1.2fr .8fr}.tla-ph-market-business-list{display:grid;gap:10px}.tla-ph-market-business{align-items:center;background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.14);border-radius:17px;color:inherit;display:grid;gap:13px;grid-template-columns:42px 1fr 22px;padding:15px 17px;text-decoration:none}.tla-ph-market-business>.dashicons{align-items:center;background:rgba(10,144,246,.09);border-radius:12px;color:#0a90f6;display:flex;height:42px;justify-content:center;width:42px}.tla-ph-market-business strong,.tla-ph-market-business span,.tla-ph-market-business small{display:block}.tla-ph-market-business span{color:#0a90f6;font-size:12px;font-weight:800;margin:3px 0}.tla-ph-market-business small{color:var(--tla-ph-muted,#60657d);font-size:11px}.tla-ph-market-join-card{background:linear-gradient(145deg,#060421,#15226c);border-radius:25px;color:#fff;padding:30px}.tla-ph-market-join-card>.dashicons{color:#74d8ff;font-size:36px;height:36px;width:36px}.tla-ph-market-join-card h4{color:#fff;font-size:27px;line-height:1.1;margin:20px 0 12px}.tla-ph-market-join-card p,.tla-ph-market-join-card li{color:#d9ddff;font-size:14px;line-height:1.55}.tla-ph-market-join-card ul{padding-left:20px}.tla-ph-market-empty-state{background:var(--tla-ph-surface,#fff);border:1px dashed rgba(10,144,246,.35);border-radius:18px;padding:24px;text-align:center}.tla-ph-market-empty-state>.dashicons{color:#0a90f6;font-size:32px;height:32px;width:32px}.tla-ph-market-empty-state strong{display:block;font-size:18px;margin:12px 0 6px}.tla-ph-market-empty-state p{color:var(--tla-ph-muted,#60657d);margin:0} .tla-ph-market-method-details{background:var(--tla-ph-surface,#fff);border:1px solid rgba(87,96,132,.14);border-radius:18px;overflow:hidden}.tla-ph-market-method-details summary{cursor:pointer;font-size:16px;font-weight:800;padding:20px}.tla-ph-market-area-list{border-top:1px solid rgba(87,96,132,.12);display:grid;grid-template-columns:repeat(2,1fr);padding:12px}.tla-ph-market-area{align-items:flex-start;display:flex;gap:11px;padding:13px}.tla-ph-market-area>.dashicons{color:#0a90f6}.tla-ph-market-area strong,.tla-ph-market-area span,.tla-ph-market-area small{display:block}.tla-ph-market-area span,.tla-ph-market-area small{color:var(--tla-ph-muted,#60657d);font-size:12px;margin-top:2px}.tla-ph-market-method-note{align-items:flex-start;background:linear-gradient(90deg,rgba(223,41,211,.07),rgba(10,144,246,.07));border:1px solid rgba(223,41,211,.14);border-radius:18px;display:flex;gap:13px;margin-top:16px;padding:21px}.tla-ph-market-method-note>.dashicons{color:#df29d3}.tla-ph-market-method-note p{color:var(--tla-ph-muted,#60657d);font-size:14px;line-height:1.55;margin:5px 0}.tla-ph-market-method-note small{color:var(--tla-ph-muted,#60657d)}.tla-ph-market-media-link{display:inline-block;font-weight:800;margin-top:18px} html[data-tla-theme="dark"] .tla-ph-market-local-ribbon{background:#102541;border-color:#22577f;color:#dff4ff}html[data-tla-theme="dark"] .tla-ph-market-partner-cta,html[data-tla-theme="dark"] .tla-ph-market-join-card{border:1px solid rgba(116,216,255,.16)} @media(max-width:1100px){.tla-ph-market-hero{grid-template-columns:1fr}.tla-ph-market-form{grid-template-columns:1fr 1fr}.tla-ph-market-overview-grid{grid-template-columns:1fr 1fr}.tla-ph-market-icon-stat-grid{grid-template-columns:repeat(3,1fr)}.tla-ph-market-finance-grid{grid-template-columns:1fr 1fr}.tla-ph-market-intent-grid{grid-template-columns:1fr 1fr}.tla-ph-market-partners-layout,.tla-ph-market-partner-cta{grid-template-columns:1fr}.tla-ph-market-profile-grid{grid-template-columns:1fr 1fr}} @media(max-width:720px){.tla-ph-market-hero,.tla-ph-market-search-shell,.tla-ph-market-report-header,.tla-ph-market-panel,.tla-ph-market-tabs,.tla-ph-market-local-ribbon{width:calc(100% - 24px)}.tla-ph-market-hero{border-radius:22px;padding:25px}.tla-ph-market-uk-proof,.tla-ph-market-form,.tla-ph-market-overview-grid,.tla-ph-market-icon-stat-grid,.tla-ph-market-profile-grid,.tla-ph-market-finance-grid,.tla-ph-market-rate-grid,.tla-ph-market-average-grid,.tla-ph-market-intent-grid,.tla-ph-market-area-list{grid-template-columns:1fr}.tla-ph-market-report-header{align-items:flex-start;flex-direction:column}.tla-ph-market-report-actions{justify-content:flex-start}.tla-ph-market-local-ribbon{align-items:flex-start;flex-wrap:wrap}.tla-ph-market-landlord-strip{grid-template-columns:1fr 1fr}.tla-ph-market-landlord-strip>div{border-bottom:1px solid rgba(87,96,132,.16);border-right:0}.tla-ph-market-tabs{justify-content:flex-start;top:70px}.tla-ph-market-tabs button{flex:none}.tla-ph-market-partner-cta{padding:27px}.tla-ph-market-partner-cta-stats>div{grid-template-columns:60px 1fr}} .tla-ph-legal-strategic-note{align-items:flex-start;background:linear-gradient(90deg,rgba(223,41,211,.08),rgba(10,144,246,.08));border:1px solid rgba(223,41,211,.17);border-radius:18px;display:flex;gap:14px;margin:0 0 22px;padding:20px}.tla-ph-legal-strategic-note>.dashicons{color:#df29d3;font-size:28px;height:28px;width:28px}.tla-ph-legal-strategic-note strong{display:block;font-size:17px}.tla-ph-legal-strategic-note p{color:var(--tla-ph-muted,#60657d);font-size:14px;line-height:1.55;margin:5px 0 8px}.tla-ph-legal-strategic-note a{font-weight:800} .tla-ph-directory-route{background:var(--tla-ph-page-bg,#f6f7fb);margin:0;max-width:none!important;padding:clamp(28px,5vw,70px) 0;width:100%}.tla-ph-directory-route>.tla-ph-public-experience,.tla-ph-directory-route>.tla-ph-partner-directory{margin-left:auto;margin-right:auto;max-width:1440px;width:calc(100% - clamp(24px,6vw,96px))} /* 0.7.19: canonical TLA network design alignment, flatter surfaces and richer trust presentation. */ .tla-ph-join-hub, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route { font-family: var(--tla-ph-font); font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; } /* Keep public headings authoritative without overwhelming the global header. */ .tla-ph-join-hero h1, .tla-ph-membership-gateway-hero h2, .tla-ph-claim-hero h1 { font-size: clamp(36px, 4.4vw, 54px); line-height: 1.06; letter-spacing: -.042em; } .tla-ph-pricing-intro h2, .tla-ph-market-hero h2, .tla-ph-market-opportunity-head h2 { font-size: clamp(32px, 3.6vw, 46px); } .tla-ph-section-heading h2, .tla-ph-market-intelligence-jump h2, .tla-ph-trust-brand-copy h2 { font-size: clamp(28px, 3vw, 40px); letter-spacing: -.035em; line-height: 1.12; } /* A single page canvas with intentional surfaces - not cards nested inside cards. */ .tla-ph-public-pricing, .tla-ph-market-opportunity { background: transparent; border: 0; border-radius: 0; box-shadow: none; margin: 58px 0; overflow: visible; padding: 0; } .tla-ph-market-opportunity::before { display: none; } .tla-ph-pricing-sector-list { gap: 34px; } .tla-ph-pricing-sector { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 30px 0 0; } .tla-ph-pricing-sector + .tla-ph-pricing-sector, .tla-ph-pricing-sector-accordion { border-top: 1px solid var(--tla-ph-border); } .tla-ph-pricing-sector-accordion { background: transparent; border-bottom: 0; border-left: 0; border-radius: 0; border-right: 0; box-shadow: none; margin-top: 0; } .tla-ph-pricing-sector-accordion > summary { padding: 25px 4px; } .tla-ph-pricing-sector-accordion-body { border-top: 1px solid var(--tla-ph-border); } .tla-ph-pricing-sector-accordion-body > .tla-ph-pricing-sector { padding: 28px 0 4px; } .tla-ph-public-pricing.is-compact .tla-ph-pricing-sector { box-shadow: none; } .tla-ph-public-price-card { background: var(--tla-ph-surface); border-radius: 20px; box-shadow: 0 2px 14px rgba(20,17,70,.035); } .tla-ph-public-price-card.is-trusted { box-shadow: 0 18px 44px rgba(10,144,246,.12); } /* Hero shortcuts mirror the canonical network's compact, confident action language. */ .tla-ph-join-primary-actions { margin-bottom: 20px; } .tla-ph-join-quick-links { border-top: 1px solid rgba(87,96,132,.14); display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; padding-top: 18px; } .tla-ph-join-quick-links a { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-heading); display: inline-flex; font-size: 14px; font-weight: 780; gap: 8px; min-height: 44px; padding: 10px 15px; text-decoration: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .tla-ph-join-quick-links a:hover, .tla-ph-join-quick-links a:focus-visible { border-color: rgba(10,144,246,.42); box-shadow: 0 10px 25px rgba(10,144,246,.10); transform: translateY(-2px); } .tla-ph-join-quick-links .dashicons { color: var(--tla-ph-blue); } .tla-ph-market-intelligence-jump { align-items: center; background: linear-gradient(135deg, rgba(10,144,246,.075), rgba(223,41,211,.07), rgba(223,41,211,.05)); border-bottom: 1px solid rgba(87,96,132,.12); border-top: 1px solid rgba(87,96,132,.12); display: grid; gap: 24px; grid-template-columns: 58px minmax(0,1fr) auto; margin: 42px 0 24px; padding: 30px 4px; scroll-margin-top: 130px; } .tla-ph-market-jump-icon { align-items: center; background: linear-gradient(135deg, rgba(10,144,246,.14), rgba(223,41,211,.11)); border: 1px solid rgba(10,144,246,.17); border-radius: 17px; color: var(--tla-ph-blue); display: flex; height: 54px; justify-content: center; width: 54px; } .tla-ph-market-jump-icon .dashicons { font-size: 28px; height: 28px; width: 28px; } .tla-ph-market-intelligence-jump h2 { margin: 4px 0 8px; } .tla-ph-market-intelligence-jump p { color: var(--tla-ph-muted); font-size: 17px; margin: 0; max-width: 860px; } /* Trusted Partner mark: a visible, theme-aware outcome of verification. */ .tla-ph-trust-brand-showcase { align-items: center; background: linear-gradient(135deg, rgba(223,41,211,.055), rgba(255,255,255,0) 42%, rgba(10,144,246,.06)); border-bottom: 1px solid var(--tla-ph-border); border-top: 1px solid var(--tla-ph-border); display: grid; gap: clamp(34px, 5vw, 68px); grid-template-columns: minmax(0,.9fr) minmax(420px,1.1fr); margin: 54px 0; padding: clamp(46px, 6vw, 78px) 4px; scroll-margin-top: 130px; } .tla-ph-trust-brand-copy p { color: var(--tla-ph-muted); font-size: 17px; line-height: 1.72; } .tla-ph-trust-brand-copy ul { display: grid; gap: 10px; list-style: none; margin: 24px 0 28px; padding: 0; } .tla-ph-trust-brand-copy li { align-items: flex-start; display: flex; font-size: 16px; gap: 10px; } .tla-ph-trust-brand-copy li::before { align-items: center; background: rgba(5,150,105,.11); border-radius: 7px; color: #059669; content: '✓'; display: inline-flex; flex: 0 0 22px; font-size: 12px; font-weight: 900; height: 22px; justify-content: center; margin-top: 1px; } .tla-ph-trust-site-mockup { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: 0 24px 70px rgba(21,18,70,.14); overflow: visible; position: relative; } .tla-ph-trust-browser-bar { align-items: center; background: var(--tla-ph-soft); border-bottom: 1px solid var(--tla-ph-border); border-radius: 24px 24px 0 0; display: flex; gap: 7px; padding: 14px 16px; } .tla-ph-trust-browser-bar i { border-radius: 50%; display: block; height: 9px; width: 9px; } .tla-ph-trust-browser-bar i:nth-child(1){background:#ff6b6b}.tla-ph-trust-browser-bar i:nth-child(2){background:#f7c948}.tla-ph-trust-browser-bar i:nth-child(3){background:#38c172} .tla-ph-trust-browser-bar span { background: var(--tla-ph-bg); border: 1px solid var(--tla-ph-border); border-radius: 8px; color: var(--tla-ph-muted); flex: 1; font-family: var(--tla-ph-font-mono); font-size: 11px; margin-left: 7px; overflow: hidden; padding: 5px 10px; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-trust-browser-body { padding: clamp(24px,4vw,38px); } .tla-ph-trust-mock-brand { align-items: center; display: flex; gap: 13px; } .tla-ph-trust-mock-brand > .dashicons { align-items: center; background: var(--tla-ph-grad); border-radius:14px; color:#fff; display:flex; font-size:24px; height:48px; justify-content:center; width:48px; } .tla-ph-trust-mock-brand strong,.tla-ph-trust-mock-brand small { display:block; }.tla-ph-trust-mock-brand strong{font-size:17px}.tla-ph-trust-mock-brand small{color:var(--tla-ph-muted);font-size:12px;margin-top:2px} .tla-ph-trust-mock-copy { margin: 34px 0 26px; max-width: 620px; } .tla-ph-trust-mock-copy h3 { font-size: clamp(24px,3vw,34px); letter-spacing:-.035em; line-height:1.1; margin:0 0 12px; } .tla-ph-trust-mock-copy p { color:var(--tla-ph-muted); font-size:15px; line-height:1.65; margin:0; } .tla-ph-trust-badge-stage { align-items:center; background:#fff; border:1px solid rgba(10,0,50,.09); border-radius:17px; display:flex; justify-content:center; min-height:174px; overflow:hidden; padding:24px; position:relative; } .tla-ph-trust-badge-stage::after { background:radial-gradient(circle,rgba(10,144,246,.11),transparent 67%); content:''; inset:-30%; position:absolute; } .tla-ph-trust-badge-stage img { height:auto; max-height:126px; max-width:92%; position:relative; width:auto; z-index:1; } .tla-ph-trust-badge-dark { display:none; } html[data-tla-theme="dark"] .tla-ph-trust-badge-stage { background:#010012; border-color:rgba(255,255,255,.09); } html[data-tla-theme="dark"] .tla-ph-trust-badge-light { display:none; } html[data-tla-theme="dark"] .tla-ph-trust-badge-dark { display:block; } .tla-ph-trust-mock-footer { border-top:1px solid var(--tla-ph-border); display:flex; gap:18px; margin-top:24px; padding-top:18px; } .tla-ph-trust-mock-footer span { color:var(--tla-ph-muted); font-size:12px; font-weight:700; } .tla-ph-trust-float-chip { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:12px; box-shadow:0 12px 34px rgba(21,18,70,.13); display:flex; font-size:12px; font-weight:800; gap:7px; padding:10px 13px; position:absolute; z-index:3; } .tla-ph-trust-float-chip::before { background:#059669; border-radius:50%; content:''; height:7px; width:7px; } .tla-ph-trust-float-chip.is-one { right:24px; top:-19px; animation:tlaPhTrustFloat 4s ease-in-out infinite; } .tla-ph-trust-float-chip.is-two { bottom:44px; left:-31px; animation:tlaPhTrustFloat 4s ease-in-out -2s infinite; }.tla-ph-trust-float-chip.is-two::before{background:var(--tla-ph-blue)} @keyframes tlaPhTrustFloat { 0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)} } /* Pricing hierarchy and national legal proposition. */ .tla-ph-public-price-value em { color:var(--tla-ph-blue); display:block; font-size:12px; font-style:normal; font-weight:800; margin-top:6px; } .tla-ph-plan-discovery { align-items:flex-start; background:rgba(10,144,246,.065); border-radius:12px; display:flex; gap:9px; margin:0 0 17px; padding:12px; } .tla-ph-plan-discovery .dashicons { color:var(--tla-ph-blue); flex:0 0 20px; }.tla-ph-plan-discovery strong{font-size:13px;line-height:1.45} .tla-ph-legal-integration-ladder { display:grid; gap:9px; grid-template-columns:repeat(4,minmax(0,1fr)); margin:4px 0 20px; } .tla-ph-legal-integration-ladder>div { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:15px; padding:16px; position:relative; } .tla-ph-legal-integration-ladder>div:not(:last-child)::after { background:linear-gradient(90deg,rgba(10,144,246,.4),rgba(223,41,211,.4)); content:''; height:1px; position:absolute; right:-10px; top:29px; width:10px; } .tla-ph-legal-integration-ladder span,.tla-ph-legal-integration-ladder strong,.tla-ph-legal-integration-ladder small{display:block}.tla-ph-legal-integration-ladder span{color:var(--tla-ph-blue);font-size:0.7rem;font-weight:900;letter-spacing:.09em}.tla-ph-legal-integration-ladder strong{font-size:15px;margin:7px 0 5px}.tla-ph-legal-integration-ladder small{color:var(--tla-ph-muted);font-size:11px;line-height:1.4} .tla-ph-legal-integration-ladder .is-national { background:linear-gradient(145deg,#060421,#142267); border-color:rgba(116,216,255,.22); box-shadow:0 16px 38px rgba(7,12,61,.2); color:#fff; }.tla-ph-legal-integration-ladder .is-national strong{color:#fff}.tla-ph-legal-integration-ladder .is-national small{color:#d9ddff}.tla-ph-legal-integration-ladder .is-national span{color:#74d8ff} .tla-ph-national-legal-partnership { align-items:center; background:linear-gradient(135deg,#030319 0%,#13144d 46%,#101f66 72%,#0a90f6 150%); border:1px solid rgba(255,255,255,.14); border-radius:24px; box-shadow:0 26px 70px rgba(5,8,45,.27); color:#fff; display:grid; gap:34px; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); margin-top:22px; overflow:hidden; padding:clamp(30px,4vw,48px); position:relative; } .tla-ph-national-legal-partnership::before { background:radial-gradient(circle,rgba(223,41,211,.22),transparent 66%); content:''; height:350px; position:absolute; right:-100px; top:-180px; width:350px; }.tla-ph-national-legal-partnership>*{position:relative;z-index:1} .tla-ph-national-legal-partnership .tla-ph-frontend-eyebrow { color:#79e3ff; }.tla-ph-national-legal-partnership h4{color:#fff;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.04em;line-height:1.08;margin:8px 0 13px}.tla-ph-national-legal-partnership p{color:#d9ddff;font-size:16px;line-height:1.65;margin:0;max-width:770px} .tla-ph-national-deliverables { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }.tla-ph-national-deliverables span{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);border-radius:999px;color:#fff;font-size:12px;font-weight:750;padding:8px 11px} .tla-ph-national-legal-value { background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.14); border-radius:20px; display:grid; gap:8px; padding:24px; }.tla-ph-national-legal-value small{color:#bdeeff;font-size:12px;font-weight:800;text-transform:uppercase}.tla-ph-national-legal-value strong{color:#fff;font-size:clamp(32px,4vw,48px);letter-spacing:-.045em;line-height:1}.tla-ph-national-legal-value strong em{font-size:14px;font-style:normal}.tla-ph-national-legal-value>span{color:#d9ddff;font-size:13px;margin-bottom:12px} /* The market tool sits on the page canvas; search, report header and active panels are the only surfaces. */ .tla-ph-market-hero, .tla-ph-market-search-shell, .tla-ph-market-report-header, .tla-ph-market-local-ribbon, .tla-ph-market-tabs, .tla-ph-market-panel { max-width: 1360px; } .tla-ph-market-hero { box-shadow:0 20px 55px rgba(19,27,68,.09); } .tla-ph-market-search-shell { border-radius:20px; box-shadow:0 10px 30px rgba(19,27,68,.055); } .tla-ph-market-results { background:transparent; border:0; border-radius:0; margin-top:24px; padding:0; } .tla-ph-market-panel { background:transparent; border:0; border-radius:0; box-shadow:none; padding:24px 0 8px; } .tla-ph-market-finance-groups>section { background:transparent; border:0; border-bottom:1px solid rgba(87,96,132,.14); border-radius:0; padding:26px 0 30px; } .tla-ph-market-finance-groups>section:last-child { border-bottom:0; } .tla-ph-market-finance-grid article { border:1px solid rgba(87,96,132,.10); } .tla-ph-market-method-details { background:transparent; } /* Saved-area comparison: useful planning, with explicit non-deduplication warning. */ .tla-ph-market-saved-reports { border-top:1px solid var(--tla-ph-border); margin:34px auto 0; max-width:1360px; padding-top:30px; width:calc(100% - 48px); } .tla-ph-market-saved-reports>header { align-items:flex-start; display:flex; gap:20px; justify-content:space-between; } .tla-ph-market-saved-reports h3 { font-size:clamp(25px,3vw,36px);letter-spacing:-.035em;margin:5px 0 8px}.tla-ph-market-saved-reports header p{color:var(--tla-ph-muted);font-size:15px;margin:0;max-width:760px} .tla-ph-market-saved-summary { display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));margin:22px 0 16px}.tla-ph-market-saved-summary article{background:linear-gradient(135deg,rgba(10,144,246,.07),rgba(223,41,211,.055));border:1px solid rgba(10,144,246,.13);border-radius:17px;padding:19px}.tla-ph-market-saved-summary small,.tla-ph-market-saved-summary strong{display:block}.tla-ph-market-saved-summary small{color:var(--tla-ph-muted);font-size:12px}.tla-ph-market-saved-summary strong{font-size:27px;margin-top:6px} .tla-ph-market-saved-list{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.tla-ph-market-saved-card{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:17px;padding:18px;position:relative}.tla-ph-market-saved-card h4{font-size:18px;margin:0 38px 6px 0}.tla-ph-market-saved-card>p{color:var(--tla-ph-muted);font-size:12px;margin:0 0 14px}.tla-ph-market-saved-card dl{display:grid;gap:7px;margin:0}.tla-ph-market-saved-card dl>div{display:flex;font-size:12px;gap:8px;justify-content:space-between}.tla-ph-market-saved-card dt{color:var(--tla-ph-muted)}.tla-ph-market-saved-card dd{font-weight:800;margin:0;text-align:right}.tla-ph-market-saved-remove{align-items:center;background:transparent;border:0;border-radius:8px;color:var(--tla-ph-muted);cursor:pointer;display:flex;height:32px;justify-content:center;position:absolute;right:10px;top:10px;width:32px}.tla-ph-market-saved-remove:hover{background:rgba(220,38,38,.08);color:#dc2626}.tla-ph-market-saved-note{align-items:flex-start;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.17);border-radius:14px;color:var(--tla-ph-muted);display:flex;font-size:13px;gap:10px;margin-top:14px;padding:13px}.tla-ph-market-saved-note .dashicons{color:#d97706;flex:0 0 20px} html[data-tla-theme="dark"] .tla-ph-market-intelligence-jump, html[data-tla-theme="dark"] .tla-ph-trust-brand-showcase { border-color:rgba(255,255,255,.08); } html[data-tla-theme="dark"] .tla-ph-trust-site-mockup, html[data-tla-theme="dark"] .tla-ph-public-price-card, html[data-tla-theme="dark"] .tla-ph-market-saved-card { background:#060720; } @media(max-width:1050px){ .tla-ph-trust-brand-showcase{grid-template-columns:1fr}.tla-ph-trust-site-mockup{max-width:720px}.tla-ph-legal-integration-ladder{grid-template-columns:1fr 1fr}.tla-ph-national-legal-partnership{grid-template-columns:1fr}.tla-ph-market-saved-list{grid-template-columns:1fr 1fr} } @media(max-width:760px){ .tla-ph-market-intelligence-jump{align-items:flex-start;grid-template-columns:54px 1fr}.tla-ph-market-intelligence-jump>a{grid-column:1/-1;width:100%}.tla-ph-trust-brand-showcase{padding-left:0;padding-right:0}.tla-ph-trust-float-chip{display:none}.tla-ph-legal-integration-ladder,.tla-ph-market-saved-summary,.tla-ph-market-saved-list{grid-template-columns:1fr}.tla-ph-legal-integration-ladder>div:not(:last-child)::after{display:none}.tla-ph-market-saved-reports{width:calc(100% - 24px)}.tla-ph-market-saved-reports>header{flex-direction:column}.tla-ph-market-saved-reports .tla-ph-frontend-button{width:100%} } @media(prefers-reduced-motion:reduce){.tla-ph-trust-float-chip{animation:none!important}.tla-ph-join-quick-links a{transition:none!important}} /* 0.7.19 saved-area component selectors. */ .tla-ph-market-saved{border-top:1px solid var(--tla-ph-border);margin:34px auto 0;max-width:1360px;padding-top:30px;width:calc(100% - 48px)} .tla-ph-market-saved>header{align-items:flex-start;display:flex;gap:20px;justify-content:space-between}.tla-ph-market-saved h3{font-size:clamp(25px,3vw,36px);letter-spacing:-.035em;margin:5px 0 8px}.tla-ph-market-saved header p{color:var(--tla-ph-muted);font-size:15px;margin:0;max-width:760px} .tla-ph-market-clear-saved{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:999px;color:var(--tla-ph-heading);cursor:pointer;font-size:13px;font-weight:800;min-height:42px;padding:9px 15px}.tla-ph-market-clear-saved:hover{border-color:rgba(220,38,38,.35);color:#dc2626} .tla-ph-market-saved-metrics{display:grid;gap:7px;margin-top:14px}.tla-ph-market-saved-metrics span{align-items:center;color:var(--tla-ph-muted);display:flex;font-size:12px;gap:8px;justify-content:space-between}.tla-ph-market-saved-metrics strong{color:var(--tla-ph-heading);font-size:13px} .tla-ph-market-saved-card-head>span{color:var(--tla-ph-blue);display:block;font-size:0.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.tla-ph-market-saved-card-head h4{font-size:18px;margin:5px 38px 5px 0}.tla-ph-market-saved-card-head p{color:var(--tla-ph-muted);font-size:12px;margin:0} .tla-ph-market-save,.tla-ph-market-refine{align-items:center;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:999px;color:var(--tla-ph-heading);cursor:pointer;display:inline-flex;font-size:13px;font-weight:800;gap:7px;min-height:42px;padding:9px 14px}.tla-ph-market-save:hover,.tla-ph-market-refine:hover{border-color:rgba(10,144,246,.42);color:var(--tla-ph-blue)}.tla-ph-market-save:disabled{cursor:not-allowed;opacity:.48}.tla-ph-market-save.is-saved{background:rgba(5,150,105,.09);border-color:rgba(5,150,105,.25);color:#047857} @media(max-width:760px){.tla-ph-market-saved{width:calc(100% - 24px)}.tla-ph-market-saved>header{flex-direction:column}.tla-ph-market-clear-saved{width:100%}} /* 0.7.19 shared public typography floor across Partner Hub journeys. */ .tla-ph-shell,.tla-ph-public-shell,.tla-ph-dashboard,.tla-ph-onboarding,.tla-ph-verification-shell,.tla-ph-profile-workspace,.tla-ph-public-profile,.tla-ph-sector-public,.tla-ph-network-home,.tla-ph-directory,.tla-ph-help-center{font-family:var(--tla-ph-font);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased} .tla-ph-dashboard-hero h1,.tla-ph-workspace-hero h1,.tla-ph-onboarding-head h1,.tla-ph-verification-head h1,.tla-ph-frontend-hero h1,.tla-ph-directory-hero h1,.tla-ph-sector-hero h1,.tla-ph-network-hero h1{font-size:clamp(34px,4vw,52px);letter-spacing:-.042em;line-height:1.06} .tla-ph-profile-section p,.tla-ph-dashboard-card p,.tla-ph-sector-public p,.tla-ph-network-home p,.tla-ph-directory p,.tla-ph-help-center p{line-height:1.65} /* 0.7.20: professional join-page typography, audience CTA and clear upgrade language. */ body.tla-ph-join-partner-page main h1, body.tla-ph-join-partner-page .elementor h1, body.tla-ph-join-partner-page .tla-ph-join-hero h1 { font-size: clamp(38px, 4.25vw, 54px) !important; letter-spacing: -.042em !important; line-height: 1.06 !important; } body.tla-ph-join-partner-page main h2, body.tla-ph-join-partner-page .elementor h2, body.tla-ph-join-partner-page .tla-ph-section-heading h2, body.tla-ph-join-partner-page .tla-ph-market-intelligence-jump h2 { font-size: clamp(30px, 3vw, 40px) !important; letter-spacing: -.035em !important; line-height: 1.12 !important; } body.tla-ph-join-partner-page h3.tla-ph-professional-heading, body.tla-ph-join-partner-page h2.tla-ph-professional-heading, body.tla-ph-join-partner-page h1.tla-ph-professional-heading { font-size: clamp(30px, 3.25vw, 44px) !important; max-width: 1050px; } body.tla-ph-join-partner-page .tla-ph-market-report-header h3 {font-size:clamp(30px,3.5vw,46px)} body.tla-ph-join-partner-page .tla-ph-market-partner-cta h4 {font-size:clamp(28px,3vw,40px);line-height:1.1} .tla-ph-join-primary-actions {align-items:center;display:flex;flex-wrap:wrap;gap:12px} .tla-ph-frontend-button-audience { align-items:center; background:linear-gradient(90deg,#0a90f6,#df29d3); border:1px solid transparent; border-radius:999px; box-shadow:0 12px 28px rgba(10,144,246,.2); color:#fff !important; display:inline-flex; font-weight:850; gap:8px; justify-content:center; min-height:52px; padding:13px 22px; text-decoration:none !important; } .tla-ph-frontend-button-audience:hover {background:linear-gradient(90deg,#087fd8,#5d1ce0);box-shadow:0 16px 34px rgba(77,73,225,.28);transform:translateY(-1px)} .tla-ph-audience-cta-hint {align-items:flex-start;color:var(--tla-ph-muted,#59617b);display:flex;font-size:15px;line-height:1.55;margin:14px 0 0;max-width:850px} .tla-ph-audience-cta-hint::before {color:#0a90f6;content:'↳';font-size:19px;font-weight:900;margin-right:8px} /* Elementor FAQ hover/active colours now use the established TLA blue-purple theme. */ body.tla-ph-join-partner-page .elementor-accordion .elementor-tab-title:hover, body.tla-ph-join-partner-page .elementor-accordion .elementor-tab-title.elementor-active, body.tla-ph-join-partner-page .elementor-accordion .elementor-tab-title[aria-expanded="true"], body.tla-ph-join-partner-page .elementor-toggle .elementor-tab-title:hover, body.tla-ph-join-partner-page .elementor-toggle .elementor-tab-title.elementor-active { background:linear-gradient(90deg,#df29d3 0%,#0a90f6 100%) !important; border-color:transparent !important; color:#fff !important; } body.tla-ph-join-partner-page .elementor-accordion .elementor-tab-title:hover *, body.tla-ph-join-partner-page .elementor-accordion .elementor-tab-title.elementor-active *, body.tla-ph-join-partner-page .elementor-accordion .elementor-tab-title[aria-expanded="true"] *, body.tla-ph-join-partner-page .elementor-toggle .elementor-tab-title:hover *, body.tla-ph-join-partner-page .elementor-toggle .elementor-tab-title.elementor-active * {color:#fff !important;fill:#fff !important} /* Positive upgrade presentation replaces orange minus symbols. */ .tla-ph-upgrade-benefit {position:relative} .tla-ph-upgrade-benefit::before { align-items:center; background:rgba(5,150,105,.11); border:1px solid rgba(5,150,105,.2); border-radius:999px; color:#047857; content:'✓'; display:flex; font-size:15px; font-weight:950; height:28px; justify-content:center; left:18px; position:absolute; top:50%; transform:translateY(-50%); width:28px; z-index:2; } .tla-ph-upgrade-benefit > * {padding-left:42px} .tla-ph-upgrade-benefits-intro {color:#047857;font-size:14px;font-weight:900;letter-spacing:.02em;margin:0 0 10px;text-transform:uppercase} .tla-ph-public-price-card li.is-off .dashicons {color:#dc2626} .tla-ph-public-price-card li.is-on .dashicons {color:#059669} .tla-ph-membership-inclusion-note {align-items:flex-start;background:rgba(5,150,105,.08);border:1px solid rgba(5,150,105,.2);border-radius:14px;display:flex;gap:10px;margin:14px 0;padding:13px 14px} .tla-ph-membership-inclusion-note>.dashicons{color:#059669;flex:0 0 20px}.tla-ph-membership-inclusion-note strong,.tla-ph-membership-inclusion-note small{display:block}.tla-ph-membership-inclusion-note strong{color:#047857;font-size:14px}.tla-ph-membership-inclusion-note small{color:var(--tla-ph-muted);font-size:12px;line-height:1.45;margin-top:3px} /* Market opportunity: clear launch state and direct Trusted Partner conversion. */ .tla-ph-market-launch-badge {background:linear-gradient(90deg,#df29d3,#0a90f6);border-radius:999px;color:#fff;display:inline-flex;font-size:11px;font-weight:950;letter-spacing:.11em;margin-bottom:8px;padding:8px 12px;text-transform:uppercase} .tla-ph-market-launch-badge[hidden]{display:none!important} .tla-ph-market-partner-cta.is-just-launched {border:1px solid rgba(116,216,255,.34);box-shadow:0 24px 70px rgba(12,33,117,.24)} .tla-ph-market-empty-state.is-just-launched {align-items:flex-start;text-align:left} .tla-ph-market-empty-state.is-just-launched .tla-ph-market-launch-badge {align-self:flex-start} .tla-ph-market-empty-state.is-just-launched .tla-ph-frontend-button {margin-top:10px} /* CRM priority cues: existing TLA relationships are commercially surfaced first. */ .tla-ph-crm-member-row td:first-child {border-left:4px solid #0a90f6} .tla-ph-crm-external-row {opacity:.84} .tla-ph-crm-priority {border-radius:999px;display:inline-flex;font-size:11px;font-weight:850;line-height:1;padding:7px 10px;white-space:nowrap} .tla-ph-crm-priority.is-member {background:rgba(10,144,246,.1);color:#0875c7} .tla-ph-crm-priority.is-external {background:rgba(100,107,132,.1);color:#59617b} .tla-ph-crm-priority-note {border-left:4px solid #0a90f6;margin:0 0 20px} @media (max-width:760px) { body.tla-ph-join-partner-page main h1, body.tla-ph-join-partner-page .elementor h1, body.tla-ph-join-partner-page .tla-ph-join-hero h1 {font-size:clamp(34px,10vw,46px)!important} body.tla-ph-join-partner-page main h2, body.tla-ph-join-partner-page .elementor h2 {font-size:clamp(28px,8vw,36px)!important} .tla-ph-join-primary-actions .tla-ph-frontend-button, .tla-ph-injected-audience-cta {width:100%} } .tla-ph-upgrade-benefit .tla-ph-upgrade-old-icon {display:none!important} /* Consistent professional public heading scale across Partner Hub pages. */ .tla-ph-dashboard-hero h1,.tla-ph-workspace-hero h1,.tla-ph-onboarding-head h1,.tla-ph-verification-head h1,.tla-ph-frontend-hero h1,.tla-ph-directory-hero h1,.tla-ph-sector-hero h1,.tla-ph-network-hero h1{font-size:clamp(34px,3.8vw,48px)} .tla-ph-section-heading h2,.tla-ph-market-section-heading h4{font-size:clamp(27px,2.7vw,38px)} /* 0.7.21: publication recovery, dynamic claim route and final public UI corrections. */ /* Dynamic claim pages use the same full-width canvas and asset foundation as shortcode pages. */ body.tla-ph-claim-business-page .tla-ph-claim-page { background: radial-gradient(circle at 12% 8%, rgba(10,144,246,.09), transparent 28%), radial-gradient(circle at 88% 18%, rgba(223,41,211,.08), transparent 30%), var(--tla-ph-bg, #f6f7fb); min-height: 100vh; padding: clamp(26px,4vw,54px) clamp(18px,4vw,54px) clamp(54px,7vw,90px); } body.tla-ph-claim-business-page .tla-ph-claim-page *, body.tla-ph-claim-business-page .tla-ph-claim-page *::before, body.tla-ph-claim-business-page .tla-ph-claim-page *::after {box-sizing:border-box} body.tla-ph-claim-business-page .tla-ph-claim-page > .tla-ph-shell-inner {max-width:1320px;padding:0;width:100%} .tla-ph-claim-hero { align-items:center; background:linear-gradient(135deg,rgba(255,255,255,.98) 0%,rgba(247,250,255,.98) 52%,rgba(240,236,255,.98) 100%); border:1px solid rgba(69,84,132,.14); border-radius:28px; box-shadow:0 24px 70px rgba(20,25,72,.10); display:grid; gap:34px; grid-template-columns:minmax(0,1fr) 150px; margin:24px 0; overflow:hidden; padding:clamp(30px,5vw,54px); position:relative; } .tla-ph-claim-hero::after {background:linear-gradient(135deg,rgba(10,144,246,.18),rgba(223,41,211,.15),rgba(223,41,211,.12));border-radius:50%;content:"";filter:blur(45px);height:240px;position:absolute;right:-70px;top:-120px;width:240px} .tla-ph-claim-hero-copy,.tla-ph-claim-hero-mark{position:relative;z-index:1} .tla-ph-claim-hero h1 {color:var(--tla-ph-heading,#111827);font-size:clamp(36px,4.6vw,58px);letter-spacing:-.045em;line-height:1.04;margin:13px 0 16px;max-width:980px} .tla-ph-claim-hero p {color:var(--tla-ph-muted,#59617b);font-size:17px;line-height:1.68;margin:0;max-width:900px} .tla-ph-claim-hero-mark {align-items:center;background:linear-gradient(135deg,#0a90f6,#df29d3 54%,#df29d3);border:8px solid rgba(255,255,255,.72);border-radius:34px;box-shadow:0 24px 55px rgba(58,45,174,.28);display:flex;height:132px;justify-content:center;transform:rotate(4deg);width:132px} .tla-ph-claim-hero-mark .dashicons {color:#fff;font-size:58px;height:58px;width:58px} .tla-ph-claim-status-row {display:flex;flex-wrap:wrap;gap:9px;margin-top:24px} .tla-ph-claim-status-row>span {align-items:center;background:rgba(255,255,255,.78);border:1px solid rgba(72,86,133,.13);border-radius:999px;color:#29334f;display:inline-flex;font-size:12px;font-weight:800;gap:7px;padding:9px 12px} .tla-ph-claim-status-row i {color:#0a90f6;font-size:17px;height:17px;width:17px} .tla-ph-claim-layout {align-items:start;display:grid;gap:24px;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr)} .tla-ph-claim-form-card,.tla-ph-claim-next-card {background:var(--tla-ph-surface,#fff);border:1px solid rgba(69,84,132,.14);border-radius:24px;box-shadow:0 18px 55px rgba(20,25,72,.075)} .tla-ph-claim-form-card {overflow:hidden;padding:clamp(24px,3.5vw,38px)} .tla-ph-claim-card-heading {border-bottom:1px solid rgba(69,84,132,.11);margin-bottom:26px;padding-bottom:22px} .tla-ph-claim-card-heading h2,.tla-ph-claim-next-card h2 {color:var(--tla-ph-heading,#111827);font-size:clamp(26px,2.7vw,36px);letter-spacing:-.035em;line-height:1.12;margin:7px 0 9px} .tla-ph-claim-card-heading p {color:var(--tla-ph-muted,#59617b);font-size:15px;line-height:1.6;margin:0;max-width:760px} .tla-ph-claim-step-label {color:#0a90f6;display:block;font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase} .tla-ph-claim-form {display:grid;gap:20px;margin:0} .tla-ph-claim-field-grid {display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr))} .tla-ph-claim-form label {display:grid;gap:8px;margin:0;min-width:0} .tla-ph-claim-form label>span {color:#27314d;font-size:14px;font-weight:800;line-height:1.35} .tla-ph-claim-form label>span b {color:#dc2626} .tla-ph-claim-form input[type="text"], .tla-ph-claim-form input[type="email"], .tla-ph-claim-form input[type="tel"], .tla-ph-claim-form textarea { appearance:none; background:#fff; border:1px solid #cfd7e7; border-radius:14px; box-shadow:0 1px 2px rgba(17,24,39,.02); color:#131a2d; display:block; font:inherit; font-size:16px; line-height:1.45; margin:0; min-height:52px; outline:0; padding:13px 14px; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; width:100%; } .tla-ph-claim-form textarea {min-height:132px;resize:vertical} .tla-ph-claim-form input:focus,.tla-ph-claim-form textarea:focus {border-color:#0a90f6;box-shadow:0 0 0 4px rgba(10,144,246,.12)} .tla-ph-claim-form input::placeholder,.tla-ph-claim-form textarea::placeholder {color:#8a93a8;opacity:1} .tla-ph-claim-form input[readonly] {background:#f5f7fb;border-color:#d7ddea;color:#4a556f;cursor:not-allowed} .tla-ph-claim-account-note {color:#68728a;display:block;font-size:12px;font-weight:600;line-height:1.45;margin-top:-1px} .tla-ph-claim-field-full {grid-column:1/-1} .tla-ph-claim-authority {align-items:flex-start!important;background:linear-gradient(90deg,rgba(10,144,246,.065),rgba(223,41,211,.05));border:1px solid rgba(10,144,246,.14);border-radius:14px;display:flex!important;gap:11px!important;padding:14px 15px} .tla-ph-claim-authority input {accent-color:#0a90f6;flex:0 0 19px;height:19px;margin:2px 0 0;width:19px} .tla-ph-claim-authority span {color:#34405e!important;font-size:14px!important;font-weight:650!important;line-height:1.55!important} .tla-ph-claim-form-actions {align-items:center;display:flex;flex-wrap:wrap;gap:11px} .tla-ph-claim-form-actions .tla-ph-frontend-button {font-size:14px;min-height:50px;padding:12px 20px} .tla-ph-honeypot {clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;height:1px!important;left:-9999px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important} .tla-ph-claim-sidebar {display:grid;gap:16px;position:sticky;top:110px} .tla-ph-claim-next-card {padding:28px} .tla-ph-claim-next-card>.tla-ph-frontend-button {font-size:13px;margin-top:20px;width:100%} .tla-ph-claim-steps {display:grid;gap:16px;list-style:none;margin:22px 0 0;padding:0} .tla-ph-claim-steps li {align-items:flex-start;display:grid;gap:12px;grid-template-columns:36px 1fr;margin:0} .tla-ph-claim-steps li>span {align-items:center;background:linear-gradient(135deg,rgba(10,144,246,.12),rgba(223,41,211,.12));border:1px solid rgba(10,144,246,.16);border-radius:12px;color:#0877c9;display:flex;font-size:13px;font-weight:950;height:36px;justify-content:center;width:36px} .tla-ph-claim-steps strong {color:#202a45;display:block;font-size:14px;line-height:1.35} .tla-ph-claim-steps p {color:var(--tla-ph-muted,#59617b);font-size:13px;line-height:1.5;margin:3px 0 0} .tla-ph-claim-assurance {align-items:flex-start;background:linear-gradient(135deg,#080722,#12184b);border:1px solid rgba(116,216,255,.18);border-radius:18px;box-shadow:0 16px 38px rgba(10,12,48,.18);color:#fff;display:flex;gap:13px;padding:19px} .tla-ph-claim-assurance>.dashicons {color:#74d8ff;flex:0 0 23px;font-size:23px;height:23px;width:23px} .tla-ph-claim-assurance strong {color:#fff;display:block;font-size:14px} .tla-ph-claim-assurance p {color:#d9ddff;font-size:12px;line-height:1.55;margin:4px 0 0} .tla-ph-claim-alert {align-items:flex-start;display:flex;gap:12px;font-size:15px;margin:0 0 20px;padding:16px 18px} .tla-ph-claim-alert>.dashicons {flex:0 0 22px;font-size:22px;height:22px;width:22px} .tla-ph-claim-alert strong {display:block;font-size:15px} .tla-ph-claim-alert p {font-size:14px;line-height:1.5;margin:3px 0 0} .tla-ph-claim-account-alert {align-items:flex-start;display:flex;gap:12px;font-size:15px;margin:0 0 20px;padding:16px 18px} .tla-ph-claim-account-alert>.dashicons {flex:0 0 22px;font-size:22px;height:22px;width:22px} .tla-ph-claim-account-alert>div {min-width:0} .tla-ph-claim-account-alert strong {display:block;font-size:15px} .tla-ph-claim-account-alert p {color:inherit;font-size:14px;line-height:1.55;margin:4px 0 0} .tla-ph-claim-account-button {margin-top:12px;min-height:42px;padding:10px 16px;width:auto} .tla-ph-claim-missing {background:var(--tla-ph-surface,#fff);border:1px solid var(--tla-ph-border,#dfe4ef);border-radius:24px;margin:28px auto;max-width:760px;padding:50px;text-align:center} .tla-ph-claim-missing>.dashicons {color:#0a90f6;font-size:48px;height:48px;width:48px} .tla-ph-claim-missing h1 {font-size:38px;margin:16px 0 9px}.tla-ph-claim-missing p{color:var(--tla-ph-muted);margin:0 0 22px} /* Replace every legacy orange dash with a clean, ordered green benefit number. */ .tla-ph-upgrade-section .tla-ph-upgrade-benefit-list {counter-reset:tla-upgrade-benefit} .tla-ph-upgrade-section .tla-ph-upgrade-benefit { align-items:center!important; background:rgba(255,255,255,.94)!important; border:1px solid rgba(69,84,132,.12)!important; border-radius:16px!important; box-shadow:0 8px 24px rgba(27,31,79,.045)!important; counter-increment:tla-upgrade-benefit; display:flex!important; min-height:66px!important; overflow:hidden!important; padding:13px 18px 13px 68px!important; position:relative!important; } .tla-ph-upgrade-section .tla-ph-upgrade-benefit::before { align-items:center; background:linear-gradient(135deg,#059669,#20b486); border:0; border-radius:12px; box-shadow:0 8px 18px rgba(5,150,105,.22); color:#fff; content:counter(tla-upgrade-benefit); display:flex; font-size:14px; font-weight:950; height:36px; justify-content:center; left:17px; position:absolute; top:50%; transform:translateY(-50%); width:36px; } .tla-ph-upgrade-section .tla-ph-upgrade-benefit-text {color:#1d2742!important;display:block!important;font-size:15px!important;font-weight:650!important;line-height:1.45!important;padding:0!important;width:100%} .tla-ph-upgrade-section .tla-ph-upgrade-benefit .elementor-icon-list-icon, .tla-ph-upgrade-section .tla-ph-upgrade-benefit .elementor-icon, .tla-ph-upgrade-section .tla-ph-upgrade-benefit .tla-ph-upgrade-old-icon {display:none!important} .tla-ph-upgrade-section .tla-ph-upgrade-benefits-intro {color:#28334f;font-size:14px;font-weight:900;letter-spacing:.04em;margin:0 0 12px;text-transform:uppercase} /* Enforce established TLA colours on FAQ/toggle hover and active states. */ body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:hover, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:focus, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title.is-tla-hover, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title.elementor-active, body.tla-ph-join-partner-page .elementor-tab-title:hover, body.tla-ph-join-partner-page .elementor-tab-title:focus, body.tla-ph-join-partner-page .elementor-tab-title.elementor-active, body.tla-ph-join-partner-page details>summary:hover, body.tla-ph-join-partner-page details[open]>summary { background:linear-gradient(90deg,#0a90f6 0%,#df29d3 54%,#df29d3 118%)!important; border-color:transparent!important; box-shadow:0 12px 28px rgba(62,56,188,.18)!important; color:#fff!important; } body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:hover *, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:focus *, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title.is-tla-hover *, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title.elementor-active *, body.tla-ph-join-partner-page .elementor-tab-title:hover *, body.tla-ph-join-partner-page .elementor-tab-title:focus *, body.tla-ph-join-partner-page .elementor-tab-title.elementor-active *, body.tla-ph-join-partner-page details>summary:hover *, body.tla-ph-join-partner-page details[open]>summary * {background:transparent!important;color:#fff!important;fill:#fff!important} /* Saved audience areas use one consistent, accessible red remove control. */ .tla-ph-market-saved-remove { align-items:center!important; background:#fff!important; border:1px solid rgba(220,38,38,.38)!important; border-radius:9px!important; box-shadow:0 4px 12px rgba(27,31,79,.06)!important; color:#dc2626!important; display:flex!important; font-family:var(--tla-ph-font)!important; font-size:20px!important; font-weight:500!important; height:38px!important; justify-content:center!important; line-height:1!important; padding:0!important; right:11px!important; top:11px!important; width:38px!important; } .tla-ph-market-saved-remove:hover,.tla-ph-market-saved-remove:focus {background:#dc2626!important;border-color:#dc2626!important;box-shadow:0 8px 20px rgba(220,38,38,.2)!important;color:#fff!important;outline:0!important;transform:translateY(-1px)} .tla-ph-market-saved-card {padding:20px!important}.tla-ph-market-saved-card-head h4{margin-right:48px!important} html[data-tla-theme="dark"] .tla-ph-claim-hero, html[data-tla-theme="dark"] .tla-ph-claim-form-card, html[data-tla-theme="dark"] .tla-ph-claim-next-card {background:#101225;border-color:#2a3052;color:#fff} html[data-tla-theme="dark"] .tla-ph-claim-hero h1, html[data-tla-theme="dark"] .tla-ph-claim-card-heading h2, html[data-tla-theme="dark"] .tla-ph-claim-next-card h2, html[data-tla-theme="dark"] .tla-ph-claim-steps strong {color:#fff} html[data-tla-theme="dark"] .tla-ph-claim-hero p, html[data-tla-theme="dark"] .tla-ph-claim-card-heading p, html[data-tla-theme="dark"] .tla-ph-claim-steps p {color:#c9cee5} html[data-tla-theme="dark"] .tla-ph-claim-form label>span {color:#eef1ff} html[data-tla-theme="dark"] .tla-ph-claim-form input[type="text"],html[data-tla-theme="dark"] .tla-ph-claim-form input[type="email"],html[data-tla-theme="dark"] .tla-ph-claim-form input[type="tel"],html[data-tla-theme="dark"] .tla-ph-claim-form textarea {background:#080a19;border-color:#343b61;color:#fff} html[data-tla-theme="dark"] .tla-ph-claim-form input[readonly] {background:#101326;border-color:#343b61;color:#cbd2ec} html[data-tla-theme="dark"] .tla-ph-claim-account-note {color:#aeb6d2} html[data-tla-theme="dark"] .tla-ph-alert-info {background:rgba(10,144,246,.1);border-color:rgba(116,216,255,.2);color:#b9e9ff} html[data-tla-theme="dark"] .tla-ph-claim-authority {background:rgba(10,144,246,.08);border-color:rgba(116,216,255,.16)} html[data-tla-theme="dark"] .tla-ph-claim-authority span {color:#e5e9ff!important} html[data-tla-theme="dark"] .tla-ph-upgrade-section .tla-ph-upgrade-benefit {background:#101225!important;border-color:#2a3052!important} html[data-tla-theme="dark"] .tla-ph-upgrade-section .tla-ph-upgrade-benefit-text {color:#f2f4ff!important} html[data-tla-theme="dark"] .tla-ph-market-saved-remove {background:#101225!important} @media(max-width:980px){.tla-ph-claim-layout{grid-template-columns:1fr}.tla-ph-claim-sidebar{position:static}.tla-ph-claim-hero{grid-template-columns:1fr}.tla-ph-claim-hero-mark{display:none}} @media(max-width:680px){body.tla-ph-claim-business-page .tla-ph-claim-page{padding-left:12px;padding-right:12px}.tla-ph-claim-hero{border-radius:21px;padding:25px}.tla-ph-claim-hero h1{font-size:clamp(34px,10vw,44px)}.tla-ph-claim-field-grid{grid-template-columns:1fr}.tla-ph-claim-field-full{grid-column:auto}.tla-ph-claim-form-card,.tla-ph-claim-next-card{border-radius:19px;padding:21px}.tla-ph-claim-form-actions{align-items:stretch;flex-direction:column}.tla-ph-claim-form-actions .tla-ph-frontend-button{width:100%}.tla-ph-claim-status-row{align-items:stretch;flex-direction:column}.tla-ph-claim-status-row>span{justify-content:flex-start}.tla-ph-upgrade-section .tla-ph-upgrade-benefit{padding-left:62px!important}} /* Elementor nested accordion support (current Elementor markup). */ body.tla-ph-join-partner-page .e-n-accordion-item-title, body.tla-ph-join-partner-page .e-n-accordion-item-title-text, body.tla-ph-join-partner-page [class*="accordion-item-title"] {color:#0a90f6!important} body.tla-ph-join-partner-page .e-n-accordion-item-title:hover, body.tla-ph-join-partner-page .e-n-accordion-item-title:focus, body.tla-ph-join-partner-page details[open]>.e-n-accordion-item-title, body.tla-ph-join-partner-page [class*="accordion-item-title"]:hover, body.tla-ph-join-partner-page [class*="accordion-item-title"]:focus { background:linear-gradient(90deg,#0a90f6 0%,#df29d3 54%,#df29d3 118%)!important; border-color:transparent!important; box-shadow:0 12px 28px rgba(62,56,188,.18)!important; color:#fff!important; } body.tla-ph-join-partner-page .e-n-accordion-item-title:hover *, body.tla-ph-join-partner-page .e-n-accordion-item-title:focus *, body.tla-ph-join-partner-page details[open]>.e-n-accordion-item-title *, body.tla-ph-join-partner-page [class*="accordion-item-title"]:hover *, body.tla-ph-join-partner-page [class*="accordion-item-title"]:focus * {background:transparent!important;color:#fff!important;fill:#fff!important} /* 0.7.22: public profile canvas and site-wide TLA interactive colour enforcement. */ .tla-ph-basic-public-listing, .tla-ph-premium-profile { box-sizing:border-box; margin:clamp(18px,2.6vw,38px) auto clamp(46px,6vw,86px)!important; max-width:1480px; padding-left:clamp(16px,3vw,48px)!important; padding-right:clamp(16px,3vw,48px)!important; width:calc(100% - 32px)!important; } .tla-ph-basic-public-listing>.tla-ph-network-nav, .tla-ph-premium-profile>.tla-ph-network-nav {margin-left:0;margin-right:0;width:100%} @media(max-width:680px){.tla-ph-basic-public-listing,.tla-ph-premium-profile{padding-left:12px!important;padding-right:12px!important}} /* Elementor's theme colours must never reintroduce salmon/pink interaction states. */ .tla-ph-theme-accordion-title:hover, .tla-ph-theme-accordion-title:focus, .tla-ph-theme-accordion-title.is-tla-hover, .tla-ph-theme-accordion-title.elementor-active, .tla-ph-join-partner-page .e-n-accordion-item-title:hover, .tla-ph-join-partner-page .e-n-accordion-item-title:focus, .tla-ph-join-partner-page details[open]>.e-n-accordion-item-title, .tla-ph-join-partner-page .elementor-tab-title:hover, .tla-ph-join-partner-page .elementor-tab-title:focus, .tla-ph-join-partner-page .elementor-tab-title.elementor-active { background:linear-gradient(90deg,#0a90f6 0%,#df29d3 54%,#df29d3 118%)!important; border-color:transparent!important; box-shadow:0 12px 28px rgba(62,56,188,.18)!important; color:#fff!important; } .tla-ph-theme-accordion-title:hover *, .tla-ph-theme-accordion-title:focus *, .tla-ph-theme-accordion-title.is-tla-hover *, .tla-ph-theme-accordion-title.elementor-active *, .tla-ph-join-partner-page .e-n-accordion-item-title:hover *, .tla-ph-join-partner-page .e-n-accordion-item-title:focus *, .tla-ph-join-partner-page details[open]>.e-n-accordion-item-title *, .tla-ph-join-partner-page .elementor-tab-title:hover *, .tla-ph-join-partner-page .elementor-tab-title:focus *, .tla-ph-join-partner-page .elementor-tab-title.elementor-active * {background:transparent!important;color:#fff!important;fill:#fff!important} .tla-ph-market-form label small{color:var(--tla-ph-muted,#60657d);display:block;font-size:11px;font-weight:600;line-height:1.35;margin-top:7px} /* 0.7.22 final interaction and public-canvas safeguards. */ body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"], body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:focus, body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active, body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover { background-color:#0a90f6!important; background-image:linear-gradient(90deg,#0a90f6 0%,#df29d3 54%,#df29d3 118%)!important; border-color:transparent!important; color:#fff!important; } body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"] *, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover *, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:focus *, body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active *, body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover * {color:#fff!important;fill:#fff!important} @media(max-width:680px){.tla-ph-basic-public-listing,.tla-ph-premium-profile{width:calc(100% - 16px)!important}} /* 0.7.23: calm, single-colour accordion interaction states. */ body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:hover, body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:focus-visible, body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion[open] > summary, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:focus, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"], body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover, body.tla-ph-join-partner-page .elementor .elementor-tab-title:focus, body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:hover, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:focus, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title.elementor-active { background:#f2f5fa!important; background-color:#f2f5fa!important; background-image:none!important; border-color:#d9e1ee!important; box-shadow:none!important; color:#131a2d!important; } body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:hover *, body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:focus-visible *, body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion[open] > summary *, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover *, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:focus *, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"] *, body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover *, body.tla-ph-join-partner-page .elementor .elementor-tab-title:focus *, body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active *, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:hover *, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title:focus *, body.tla-ph-join-partner-page .tla-ph-theme-accordion-title.elementor-active * { background:transparent!important; color:#131a2d!important; fill:#0a90f6!important; } body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:hover i, body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion[open] > summary i, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover i, body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"] i, body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover i, body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active i {color:#0a90f6!important;fill:#0a90f6!important} html[data-tla-theme="dark"] body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:hover, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion[open] > summary, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"], html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active { background:#171a2b!important; border-color:#303650!important; color:#f5f7ff!important; } html[data-tla-theme="dark"] body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion > summary:hover *, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .tla-ph-pricing-sector-accordion[open] > summary *, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title:hover *, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .e-n-accordion-item-title[aria-expanded="true"] *, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .elementor-tab-title:hover *, html[data-tla-theme="dark"] body.tla-ph-join-partner-page .elementor .elementor-tab-title.elementor-active * {color:#f5f7ff!important} /* 0.7.23: agency property advertising workspace and public property cards. */ .tla-ph-property-entitlement{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr));margin:20px 0}.tla-ph-property-entitlement>div{background:linear-gradient(135deg,rgba(10,144,246,.07),rgba(223,41,211,.05));border:1px solid rgba(10,144,246,.14);border-radius:18px;padding:20px}.tla-ph-property-entitlement span,.tla-ph-property-entitlement strong{display:block}.tla-ph-property-entitlement span{color:var(--tla-ph-muted);font-size:13px}.tla-ph-property-entitlement strong{color:var(--tla-ph-heading);font-size:24px;margin-top:6px}.tla-ph-upgrade-panel{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:22px;padding:26px}.tla-ph-upgrade-panel strong{font-size:22px}.tla-ph-upgrade-panel p{color:var(--tla-ph-muted);font-size:15px;line-height:1.6}.tla-ph-property-manager-grid{display:grid;gap:13px}.tla-ph-property-manager-grid article{align-items:center;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:16px;display:flex;gap:18px;justify-content:space-between;padding:18px}.tla-ph-property-manager-grid h3{font-size:19px;margin:8px 0 4px}.tla-ph-property-manager-grid p{color:var(--tla-ph-muted);margin:0}.tla-ph-public-property-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-public-property-grid article{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:20px;overflow:hidden}.tla-ph-public-property-grid img{aspect-ratio:16/9;display:block;height:auto;object-fit:cover;width:100%}.tla-ph-public-property-grid article>div{padding:21px}.tla-ph-public-property-grid article>div>span{color:var(--tla-ph-blue);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.tla-ph-public-property-grid h3{font-size:22px;margin:7px 0}.tla-ph-public-property-grid p{color:var(--tla-ph-muted);font-size:14px;line-height:1.55}.tla-ph-property-facts{align-items:center;display:flex;gap:12px;margin:12px 0}.tla-ph-property-facts strong{font-size:19px}.tla-ph-property-facts small{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:999px;padding:6px 9px} @media(max-width:760px){.tla-ph-property-entitlement,.tla-ph-public-property-grid{grid-template-columns:1fr}.tla-ph-property-manager-grid article{align-items:flex-start;flex-direction:column}} /* Version 0.7.25 - refined Agency property submission workspace. */ .tla-ph-property-workspace { padding: clamp(34px, 5vw, 68px) 0; } .tla-ph-property-workspace .tla-ph-shell-inner { padding-inline: clamp(18px, 3vw, 34px); } .tla-ph-property-workspace-hero { background: radial-gradient(circle at 88% 15%, rgba(23,178,226,.13), transparent 27%), radial-gradient(circle at 76% 90%, rgba(223,41,211,.10), transparent 31%), linear-gradient(135deg, var(--tla-ph-surface), var(--tla-ph-soft)); margin-top: 0; } .tla-ph-property-workspace-hero h1 { font-size: clamp(34px, 4.2vw, 52px); line-height: 1.04; max-width: 860px; } .tla-ph-property-workspace-hero p { font-size: 17px; max-width: 800px; } .tla-ph-property-workspace-hero .tla-ph-frontend-button { flex: 0 0 auto; white-space: nowrap; } .tla-ph-property-workspace .tla-ph-property-entitlement { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 20px 0 24px; } .tla-ph-property-workspace .tla-ph-property-entitlement > div { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; box-shadow: 0 8px 28px rgba(21,18,70,.045); display: grid; gap: 2px 13px; grid-template-columns: 46px minmax(0,1fr); padding: 18px; } .tla-ph-property-workspace .tla-ph-property-entitlement > div > span:not(.tla-ph-property-stat-icon), .tla-ph-property-workspace .tla-ph-property-entitlement > div > strong { grid-column: 2; } .tla-ph-property-workspace .tla-ph-property-entitlement > div > span:not(.tla-ph-property-stat-icon) { font-size: 13px; line-height: 1.4; } .tla-ph-property-workspace .tla-ph-property-entitlement > div > strong { font-size: 22px; line-height: 1.2; margin-top: 2px; } .tla-ph-property-stat-icon { align-items: center; background: linear-gradient(145deg, rgba(10,144,246,.12), rgba(223,41,211,.10)); border: 1px solid rgba(10,144,246,.15); border-radius:14px; color: var(--tla-ph-blue); display: flex !important; grid-row: 1 / 3; height: 46px; justify-content: center; width: 46px; } .tla-ph-property-stat-icon .dashicons { font-size: 23px; height: 23px; width: 23px; } .tla-ph-property-editor-layout { align-items: start; display: grid; gap: 22px; grid-template-columns: minmax(0, 1fr) minmax(280px, 330px); } .tla-ph-property-editor { min-width: 0; overflow: hidden; padding: 0; } .tla-ph-property-form-heading { align-items: flex-start; background: linear-gradient(135deg, rgba(10,144,246,.07), rgba(223,41,211,.045)); border-bottom: 1px solid var(--tla-ph-border); display: flex; gap: 20px; justify-content: space-between; padding: clamp(24px, 3vw, 34px); } .tla-ph-property-form-heading h2 { font-size: clamp(27px, 3vw, 36px); line-height: 1.08; margin: 8px 0 10px; } .tla-ph-property-form-heading p { color: var(--tla-ph-muted); font-size: 16px; line-height: 1.6; margin: 0; max-width: 650px; } .tla-ph-property-review-badge { align-items: center; background: var(--tla-ph-surface); border: 1px solid rgba(10,144,246,.18); border-radius: 999px; color: var(--tla-ph-blue); display: inline-flex; flex: 0 1 auto; font-size: 12px; max-width: 100%; font-weight: 850; gap: 7px; padding: 9px 12px; white-space: nowrap; } .tla-ph-property-review-badge .dashicons { font-size: 17px; height: 17px; width: 17px; } .tla-ph-property-form-section { padding: clamp(24px, 3vw, 34px); } .tla-ph-property-form-section + .tla-ph-property-form-section { border-top: 1px solid var(--tla-ph-divider); } .tla-ph-property-form-section > header { align-items: flex-start; display: grid; gap: 13px; grid-template-columns: 42px minmax(0,1fr); margin-bottom: 22px; } .tla-ph-property-form-section > header > span { align-items: center; background: var(--tla-ph-grad-blue); border-radius: 12px; box-shadow: 0 9px 22px rgba(10,144,246,.18); color: #fff; display: flex; font-size: 12px; font-weight: 900; height: 42px; justify-content: center; letter-spacing: .04em; width: 42px; } .tla-ph-property-form-section > header h3 { font-size: 22px; letter-spacing: -.025em; line-height: 1.2; margin: 0 0 4px; } .tla-ph-property-form-section > header p { color: var(--tla-ph-muted); font-size: 14px; line-height: 1.55; margin: 0; } .tla-ph-property-purpose-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0,1fr)); margin-bottom: 22px; } .tla-ph-property-purpose-option { cursor: pointer; display: block; margin: 0; position: relative; } .tla-ph-property-purpose-option > input { height: 1px; opacity: 0; position: absolute; width: 1px; } .tla-ph-property-purpose-option > span { align-items: flex-start; background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius: 16px; display: grid; gap: 3px 12px; grid-template-columns: 40px minmax(0,1fr); min-height: 108px; padding: 16px; transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease; } .tla-ph-property-purpose-option > span > i { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius:12px; color: var(--tla-ph-blue); display: flex; font-style: normal; grid-row: 1 / 3; height: 40px; justify-content: center; width: 40px; } .tla-ph-property-purpose-option > span > strong, .tla-ph-property-purpose-option > span > small { display: block; grid-column: 2; } .tla-ph-property-purpose-option > span > strong { color: var(--tla-ph-heading); font-size: 16px; line-height: 1.35; } .tla-ph-property-purpose-option > span > small { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.45; } .tla-ph-property-purpose-option:hover > span { background: var(--tla-ph-soft); border-color: rgba(10,144,246,.28); transform: translateY(-1px); } .tla-ph-property-purpose-option > input:focus-visible + span { box-shadow: 0 0 0 4px rgba(10,144,246,.10); outline: none; } .tla-ph-property-purpose-option > input:checked + span { background: linear-gradient(135deg, rgba(10,144,246,.09), rgba(223,41,211,.06)); border-color: rgba(10,144,246,.38); box-shadow: inset 0 0 0 1px rgba(10,144,246,.08); } .tla-ph-property-purpose-option > input:checked + span > i { background: var(--tla-ph-grad-blue); border-color: transparent; color: #fff; } .tla-ph-property-form-grid { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0,1fr)); } .tla-ph-property-form-grid .tla-ph-field-full { grid-column: 1 / -1; } .tla-ph-property-form-grid .tla-ph-form-field, .tla-ph-property-form-field-pair .tla-ph-form-field { min-width: 0; } .tla-ph-property-form-grid .tla-ph-form-field > label, .tla-ph-property-form-field-pair .tla-ph-form-field > label { color: var(--tla-ph-heading); display: block; font-size: 14px; font-weight: 800; margin-bottom: 7px; } .tla-ph-property-form-grid .tla-ph-input, .tla-ph-property-form-grid .tla-ph-select, .tla-ph-property-form-grid .tla-ph-textarea { background: var(--tla-ph-bg-alt); border-color: var(--tla-ph-border); border-radius:14px; font-size: 16px; min-height: 52px; padding: 12px 14px; } .tla-ph-property-form-grid .tla-ph-textarea { min-height: 160px; } .tla-ph-property-form-grid input::placeholder, .tla-ph-property-form-grid textarea::placeholder { color: var(--tla-ph-muted-light); opacity: .78; } .tla-ph-property-form-grid .tla-ph-field-help { font-size: 13px; line-height: 1.5; margin-top: 7px; } .tla-ph-property-form-field-pair { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0,1fr)); } .tla-ph-property-input-prefix { position: relative; } .tla-ph-property-input-prefix > span { align-items: center; border-right: 1px solid var(--tla-ph-border); color: var(--tla-ph-muted); display: flex; font-size: 16px; font-weight: 850; height: calc(100% - 2px); justify-content: center; left: 1px; position: absolute; top: 1px; width: 44px; } .tla-ph-property-input-prefix .tla-ph-input { padding-left: 58px; } .tla-ph-property-consent { border-radius: 15px; padding: 14px 15px; } .tla-ph-property-consent > span > strong, .tla-ph-property-consent > span > small { display: block; } .tla-ph-property-consent > span > strong { color: var(--tla-ph-heading); font-size: 14px; } .tla-ph-property-consent > span > small { color: var(--tla-ph-muted); font-size: 13px; margin-top: 3px; } .tla-ph-property-form-actions { align-items: center; background: var(--tla-ph-soft); border-top: 1px solid var(--tla-ph-border); display: flex; gap: 22px; justify-content: space-between; padding: 22px clamp(24px, 3vw, 34px); } .tla-ph-property-form-actions > div { align-items: flex-start; display: flex; gap: 11px; max-width: 560px; } .tla-ph-property-form-actions > div > .dashicons { color: var(--tla-ph-blue); flex: 0 0 22px; font-size: 22px; height: 22px; margin-top: 2px; width: 22px; } .tla-ph-property-form-actions p { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.5; margin: 0; } .tla-ph-property-form-actions p strong { color: var(--tla-ph-heading); display: block; font-size: 14px; margin-bottom: 2px; } .tla-ph-property-form-actions .tla-ph-frontend-button { flex: 0 0 auto; min-height: 50px; padding-inline: 21px; } .tla-ph-property-editor-side { display: grid; gap: 16px; position: sticky; top: 110px; } .tla-ph-property-editor-side .tla-ph-workspace-panel { margin: 0; padding: 22px; } .tla-ph-property-guidance-card h2, .tla-ph-property-quality-card h2 { font-size: 23px; line-height: 1.2; margin: 9px 0 16px; } .tla-ph-property-guidance-card ol { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; } .tla-ph-property-guidance-card li { align-items: flex-start; display: grid; gap: 11px; grid-template-columns: 34px minmax(0,1fr); } .tla-ph-property-guidance-card li > span { align-items: center; background: rgba(10,144,246,.09); border: 1px solid rgba(10,144,246,.15); border-radius: 10px; color: var(--tla-ph-blue); display: flex; font-size: 12px; font-weight: 900; height: 34px; justify-content: center; width: 34px; } .tla-ph-property-guidance-card li strong { color: var(--tla-ph-heading); display: block; font-size: 15px; } .tla-ph-property-guidance-card li p { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.45; margin: 3px 0 0; } .tla-ph-property-quality-card { background: linear-gradient(145deg, rgba(10,144,246,.06), rgba(223,41,211,.05)); } .tla-ph-property-quality-icon { align-items: center; background: var(--tla-ph-grad-blue); border-radius:14px; box-shadow: 0 10px 25px rgba(10,144,246,.17); color: #fff; display: flex; height: 44px; justify-content: center; width: 44px; } .tla-ph-property-quality-card ul { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; } .tla-ph-property-quality-card li { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.45; padding-left: 24px; position: relative; } .tla-ph-property-quality-card li::before { align-items: center; background: rgba(5,150,105,.10); border-radius: 50%; color: var(--tla-ph-green); content: "✓"; display: flex; font-size:0.7rem; font-weight: 900; height: 17px; justify-content: center; left: 0; position: absolute; top: 1px; width: 17px; } .tla-ph-property-upgrade-panel { align-items: center; background: linear-gradient(135deg, var(--tla-ph-surface), rgba(223,41,211,.06)); display: grid; gap: 20px; grid-template-columns: auto minmax(0,1fr) auto; margin-bottom: 22px; } .tla-ph-property-upgrade-panel h2 { font-size: clamp(26px,3vw,36px); margin: 7px 0 8px; } .tla-ph-property-upgrade-icon { align-items: center; background: var(--tla-ph-grad); border-radius: 16px; box-shadow: 0 13px 30px rgba(223,41,211,.22); color: #fff; display: flex; height: 58px; justify-content: center; width: 58px; } .tla-ph-property-upgrade-icon .dashicons { font-size: 28px; height: 28px; width: 28px; } .tla-ph-property-listings-panel { margin-top: 22px; } .tla-ph-property-listings-heading { align-items: flex-start; display: flex; gap: 18px; justify-content: space-between; margin-bottom: 20px; } .tla-ph-property-listings-heading h2 { font-size: clamp(25px,3vw,34px); margin: 7px 0 6px; } .tla-ph-property-listings-heading p { color: var(--tla-ph-muted); font-size: 15px; margin: 0; } .tla-ph-property-count { align-items: center; background: var(--tla-ph-grad-blue); border-radius:14px; color: #fff; display: flex; flex: 0 0 46px; font-size: 18px; font-weight: 900; height: 46px; justify-content: center; } .tla-ph-property-manager-grid { display: grid; gap: 13px; } .tla-ph-property-manager-card { align-items: center; background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius: 18px; display: grid; gap: 16px; grid-template-columns: 110px minmax(0,1fr) auto; overflow: hidden; padding: 14px; } .tla-ph-property-manager-image { align-items: center; aspect-ratio: 4 / 3; background: linear-gradient(145deg, rgba(10,144,246,.10), rgba(223,41,211,.08)); border: 1px solid var(--tla-ph-border); border-radius: 14px; color: var(--tla-ph-blue); display: flex; justify-content: center; overflow: hidden; } .tla-ph-property-manager-image img { height: 100%; object-fit: cover; width: 100%; } .tla-ph-property-manager-image .dashicons { font-size: 34px; height: 34px; width: 34px; } .tla-ph-property-manager-copy { min-width: 0; } .tla-ph-property-manager-meta, .tla-ph-property-manager-facts { align-items: center; display: flex; flex-wrap: wrap; gap: 8px 12px; } .tla-ph-property-manager-meta > span:not(.tla-ph-status-pill) { color: var(--tla-ph-muted); font-size: 12px; font-weight: 750; } .tla-ph-property-manager-card h3 { font-size: 20px; line-height: 1.25; margin: 7px 0 4px; } .tla-ph-property-manager-card p { color: var(--tla-ph-muted); font-size: 14px; margin: 0; } .tla-ph-property-manager-facts { margin-top: 9px; } .tla-ph-property-manager-facts strong { color: var(--tla-ph-heading); font-size: 15px; } .tla-ph-property-manager-facts span { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-muted); font-size: 12px; padding: 5px 8px; } .tla-ph-property-remove-button { align-items: center; background: var(--tla-ph-surface); border: 1px solid rgba(220,38,38,.22); border-radius: 999px; color: var(--tla-ph-red); cursor: pointer; display: inline-flex; font-family: var(--tla-ph-font); font-size: 12px; font-weight: 850; gap: 6px; min-height: 42px; padding: 9px 13px; transition: background .18s ease, color .18s ease, border-color .18s ease; } .tla-ph-property-remove-button:hover { background: var(--tla-ph-red); border-color: var(--tla-ph-red); color: #fff; } .tla-ph-property-remove-button .dashicons { font-size: 16px; height: 16px; width: 16px; } .tla-ph-property-empty-state { align-items: center; background: var(--tla-ph-bg-alt); border: 1px dashed var(--tla-ph-border); border-radius: 18px; display: flex; flex-direction: column; min-height: 220px; justify-content: center; padding: 28px; text-align: center; } .tla-ph-property-empty-state > .dashicons { color: var(--tla-ph-blue); font-size: 40px; height: 40px; width: 40px; } .tla-ph-property-empty-state h3 { font-size: 21px; margin: 12px 0 6px; } .tla-ph-property-empty-state p { color: var(--tla-ph-muted); font-size: 14px; margin: 0; max-width: 470px; } html[data-tla-theme="dark"] .tla-ph-property-purpose-option > input:checked + span, html[data-tla-theme="dark"] .tla-ph-property-quality-card, html[data-tla-theme="dark"] .tla-ph-property-upgrade-panel { background: linear-gradient(135deg, rgba(10,144,246,.10), rgba(223,41,211,.10)); } html[data-tla-theme="dark"] .tla-ph-property-form-heading, html[data-tla-theme="dark"] .tla-ph-property-form-actions { background: rgba(255,255,255,.025); } @media (max-width: 1080px) { .tla-ph-property-editor-layout { grid-template-columns: 1fr; } .tla-ph-property-editor-side { grid-template-columns: repeat(2, minmax(0,1fr)); position: static; } } @media (max-width: 820px) { .tla-ph-property-workspace .tla-ph-property-entitlement, .tla-ph-property-form-grid, .tla-ph-property-purpose-grid { grid-template-columns: 1fr; } .tla-ph-property-form-grid .tla-ph-field-full { grid-column: auto; } .tla-ph-property-form-heading, .tla-ph-property-form-actions, .tla-ph-property-upgrade-panel { align-items: flex-start; flex-direction: column; } .tla-ph-property-upgrade-panel { grid-template-columns: 1fr; } .tla-ph-property-form-heading { display: flex; } .tla-ph-property-form-actions { display: flex; } .tla-ph-property-review-badge { white-space: normal; } .tla-ph-property-form-actions .tla-ph-frontend-button, .tla-ph-property-upgrade-panel .tla-ph-frontend-button { width: 100%; } .tla-ph-property-manager-card { grid-template-columns: 90px minmax(0,1fr); } .tla-ph-property-manager-card > form { grid-column: 1 / -1; } } @media (max-width: 640px) { .tla-ph-property-workspace { padding: 24px 0 40px; } .tla-ph-property-workspace .tla-ph-shell-inner { padding-inline: 14px; } .tla-ph-property-workspace-hero p { font-size: 16px; } .tla-ph-property-workspace .tla-ph-property-entitlement, .tla-ph-property-editor-side { grid-template-columns: 1fr; } .tla-ph-property-form-section, .tla-ph-property-form-heading, .tla-ph-property-form-actions { padding: 20px 18px; } .tla-ph-property-form-section > header { grid-template-columns: 36px minmax(0,1fr); } .tla-ph-property-form-section > header > span { border-radius: 10px; height: 36px; width: 36px; } .tla-ph-property-form-field-pair { grid-template-columns: 1fr; } .tla-ph-property-manager-card { align-items: flex-start; grid-template-columns: 1fr; } .tla-ph-property-manager-image { aspect-ratio: 16 / 9; width: 100%; } .tla-ph-property-listings-heading { align-items: flex-start; } } /* -------------------------------------------------------------------------- * 0.7.26: property media galleries and unified Network Listing experience * -------------------------------------------------------------------------- */ .tla-ph-property-media-field { grid-column: 1 / -1; } .tla-ph-property-upload-zone { align-items: center; background: linear-gradient(135deg, color-mix(in srgb, var(--tla-ph-blue) 5%, var(--tla-ph-surface)), color-mix(in srgb, var(--tla-ph-purple) 5%, var(--tla-ph-surface))); border: 1px dashed color-mix(in srgb, var(--tla-ph-blue) 35%, var(--tla-ph-border)); border-radius: 18px; display: grid; gap: 14px; grid-template-columns: 48px minmax(0,1fr) auto; padding: 20px; } .tla-ph-property-upload-zone > .dashicons { align-items: center; background: linear-gradient(135deg,var(--tla-ph-blue),var(--tla-ph-purple)); border-radius: 14px; color: #fff; display: flex; font-size: 23px; height: 48px; justify-content: center; width: 48px; } .tla-ph-property-upload-zone strong { display: block; font-size: 16px; margin-bottom: 3px; } .tla-ph-property-upload-zone p { color: var(--tla-ph-muted); font-size: 14px; margin: 0; } .tla-ph-property-upload-zone input[type="file"] { height: 1px; opacity: 0; overflow: hidden; position: absolute; width: 1px; } .tla-ph-property-upload-button { background: var(--tla-ph-surface); border: 1px solid color-mix(in srgb, var(--tla-ph-blue) 30%, var(--tla-ph-border)); border-radius: 999px; color: var(--tla-ph-blue); cursor: pointer; font-weight: 800; padding: 11px 17px; white-space: nowrap; } .tla-ph-property-upload-button:hover, .tla-ph-property-upload-button:focus-visible { background: var(--tla-ph-soft); border-color: var(--tla-ph-blue); color: var(--tla-ph-purple); } .tla-ph-property-upload-preview { display: grid; gap: 10px; grid-template-columns: repeat(5,minmax(0,1fr)); margin-top: 14px; } .tla-ph-property-upload-thumb { aspect-ratio: 4 / 3; background: var(--tla-ph-soft); border: 2px solid transparent; border-radius:14px; cursor: pointer; overflow: hidden; padding: 0; position: relative; } .tla-ph-property-upload-thumb img { height: 100%; object-fit: cover; width: 100%; } .tla-ph-property-upload-thumb span { background: rgba(6,13,34,.84); bottom: 6px; border-radius: 999px; color: #fff; font-size: 11px; font-weight: 800; left: 6px; padding: 4px 7px; position: absolute; } .tla-ph-property-upload-thumb.is-featured { border-color: #14a96e; box-shadow: 0 0 0 3px rgba(20,169,110,.12); } .tla-ph-property-upload-thumb.is-featured span { background: #0b8f5b; } .tla-ph-property-media-message { color: #b42336; font-size: 14px; font-weight: 700; margin: 8px 0 0; min-height: 1em; } .tla-ph-public-property-gallery { background: var(--tla-ph-soft); overflow: hidden; } .tla-ph-public-property-gallery > img { aspect-ratio: 16 / 10; display: block; height: auto; object-fit: cover; width: 100%; } .tla-ph-public-property-thumbs { display: flex; gap: 7px; overflow-x: auto; padding: 9px; } .tla-ph-public-property-thumbs button { background: transparent; border: 2px solid transparent; border-radius: 8px; cursor: pointer; flex: 0 0 62px; overflow: hidden; padding: 0; } .tla-ph-public-property-thumbs button.is-active { border-color: var(--tla-ph-blue); } .tla-ph-public-property-thumbs img { aspect-ratio: 4 / 3; display: block; object-fit: cover; width: 100%; } .tla-ph-public-property-copy { padding: 20px; } .tla-ph-basic-full-layout { margin-top: 18px; } .tla-ph-basic-full-layout main { min-width: 0; } .tla-ph-basic-full-layout aside { top: 150px; } .tla-ph-basic-location-summary { align-items: flex-start; background: var(--tla-ph-soft); border-radius: 16px; display: flex; gap: 13px; margin-bottom: 14px; padding: 17px; } .tla-ph-basic-location-summary > .dashicons { color: var(--tla-ph-blue); font-size: 23px; } .tla-ph-basic-location-summary strong { display: block; font-size: 17px; } .tla-ph-basic-location-summary p { color: var(--tla-ph-muted); margin: 4px 0 0; } .tla-ph-basic-contact-card h2 { font-size: 25px; margin: 8px 0 18px; } .tla-ph-profile-assurance-card.is-basic { background: var(--tla-ph-soft); border-color: var(--tla-ph-border); } .tla-ph-locked-feature { align-items: flex-start; background: color-mix(in srgb, var(--tla-ph-soft) 84%, transparent); border: 1px solid var(--tla-ph-border); border-radius: 16px; display: flex; gap: 15px; margin-top: 15px; padding: 17px; } .tla-ph-locked-feature > span { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 50%; color: var(--tla-ph-muted); display: flex; flex: 0 0 34px; font-size: 21px; font-weight: 800; height: 34px; justify-content: center; } .tla-ph-locked-feature strong { display: block; font-size: 16px; } .tla-ph-locked-feature p { color: var(--tla-ph-muted); font-size: 15px; margin: 4px 0 8px; } .tla-ph-locked-feature a { color: var(--tla-ph-blue); font-size: 14px; font-weight: 800; text-decoration: none; } .tla-ph-locked-feature a:hover { color: var(--tla-ph-purple); text-decoration: underline; } .tla-ph-basic-listing-footer { align-items: center; border-top: 1px solid var(--tla-ph-border); display: flex; gap: 18px; justify-content: space-between; margin-top: 28px; padding: 22px 4px 8px; } .tla-ph-basic-listing-footer p { color: var(--tla-ph-muted); margin: 0; } .tla-ph-basic-listing-footer a { color: var(--tla-ph-blue); font-weight: 800; } .tla-ph-basic-listing-footer a:hover { color: var(--tla-ph-purple); } .tla-ph-manage-listing-drawer { position: relative; z-index: 9998; } .tla-ph-manage-listing-tab { align-items: center; background: #081329; border: 0; border-radius: 16px 0 0 16px; box-shadow: 0 14px 34px rgba(4,11,30,.24); color: #fff; cursor: pointer; display: flex; gap: 9px; font-size: 14px; font-weight: 800; padding: 14px 17px; position: fixed; right: 0; top: 52%; transform: translateY(-50%); z-index: 10000; } .tla-ph-manage-listing-tab:hover, .tla-ph-manage-listing-tab:focus-visible { background: #15284a; color: #fff; } .tla-ph-manage-listing-panel { background: var(--tla-ph-surface); box-shadow: -18px 0 50px rgba(5,12,31,.2); height: 100vh; max-width: 92vw; overflow-y: auto; padding: 52px 34px 34px; position: fixed; right: 0; top: 0; transform: translateX(105%); transition: transform .28s ease; width: 430px; z-index: 10002; } .tla-ph-manage-listing-drawer.is-open .tla-ph-manage-listing-panel { transform: translateX(0); } .tla-ph-manage-listing-overlay { background: rgba(4,9,24,.46); inset: 0; opacity: 0; pointer-events: none; position: fixed; transition: opacity .25s ease; z-index: 10001; } .tla-ph-manage-listing-drawer.is-open .tla-ph-manage-listing-overlay { opacity: 1; pointer-events: auto; } .tla-ph-manage-listing-close { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 50%; color: var(--tla-ph-text); cursor: pointer; font-size: 27px; height: 40px; line-height: 1; position: absolute; right: 18px; top: 18px; width: 40px; } .tla-ph-manage-listing-panel h2 { font-size: 31px; letter-spacing: -.035em; line-height: 1.12; margin: 9px 0 12px; } .tla-ph-manage-listing-panel > p { color: var(--tla-ph-muted); font-size: 16px; } .tla-ph-manage-listing-panel ul { display: grid; gap: 10px; list-style: none; margin: 23px 0; padding: 0; } .tla-ph-manage-listing-panel li { background: var(--tla-ph-soft); border-radius: 12px; font-size: 14px; font-weight: 700; padding: 12px 13px 12px 36px; position: relative; } .tla-ph-manage-listing-panel li::before { color: #109d67; content: "✓"; font-size: 17px; font-weight: 900; left: 13px; position: absolute; top: 10px; } .tla-ph-manage-listing-actions { display: grid; gap: 10px; margin: 22px 0; } .tla-ph-manage-listing-panel > small { color: var(--tla-ph-muted); display: block; line-height: 1.5; } html.tla-ph-drawer-open { overflow: hidden; } html[data-tla-theme="dark"] .tla-ph-manage-listing-tab { background: #f4f7ff; color: #071127; } html[data-tla-theme="dark"] .tla-ph-manage-listing-tab:hover { background: #dce7fb; color: #071127; } html[data-tla-theme="dark"] .tla-ph-property-upload-zone { background: color-mix(in srgb, var(--tla-ph-surface) 88%, #162449); } @media (max-width: 900px) { .tla-ph-property-upload-preview { grid-template-columns: repeat(4,minmax(0,1fr)); } .tla-ph-basic-listing-footer { align-items: flex-start; flex-direction: column; } } @media (max-width: 640px) { .tla-ph-property-upload-zone { grid-template-columns: 44px minmax(0,1fr); } .tla-ph-property-upload-button { grid-column: 1 / -1; text-align: center; } .tla-ph-property-upload-preview { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-manage-listing-tab { border-radius: 14px 14px 0 0; bottom: 0; left: 50%; right: auto; top: auto; transform: translateX(-50%); width: max-content; } .tla-ph-manage-listing-panel { border-radius: 22px 22px 0 0; bottom: 0; height: min(84vh,760px); max-width: none; padding: 48px 22px 26px; top: auto; transform: translateY(105%); width: 100%; } .tla-ph-manage-listing-drawer.is-open .tla-ph-manage-listing-panel { transform: translateY(0); } } .tla-ph-public-property-grid article > .tla-ph-public-property-gallery { padding: 0; } .tla-ph-public-property-grid article > .tla-ph-public-property-copy { padding: 20px; } /* 0.7.27 public business profile, research and promotion workspace */ .tla-ph-basic-profile-label { background: color-mix(in srgb, var(--tla-ph-blue) 8%, var(--tla-ph-surface)); border: 1px solid color-mix(in srgb, var(--tla-ph-blue) 15%, var(--tla-ph-border)); border-radius: 8px; color: var(--tla-ph-muted); display: inline-flex; font-size: 12px; font-weight: 750; letter-spacing: .025em; margin-bottom: 12px; padding: 7px 10px; } .tla-ph-basic-contact-card { display: grid; gap: 17px; } .tla-ph-basic-contact-card h2 { margin: 0; } .tla-ph-basic-contact-lines { display: grid; gap: 9px; } .tla-ph-basic-contact-line { align-items: flex-start; background: color-mix(in srgb, var(--tla-ph-soft) 82%, transparent); border: 1px solid var(--tla-ph-border); border-radius:14px; color: var(--tla-ph-text) !important; display: flex; gap: 11px; padding: 12px; text-decoration: none !important; } .tla-ph-basic-contact-line:hover, .tla-ph-basic-contact-line:focus-visible { background: var(--tla-ph-soft); border-color: color-mix(in srgb, var(--tla-ph-blue) 38%, var(--tla-ph-border)); } .tla-ph-basic-contact-line > .dashicons { color: var(--tla-ph-blue); flex: 0 0 22px; font-size: 20px; margin-top: 2px; } .tla-ph-basic-contact-line span:last-child { min-width: 0; } .tla-ph-basic-contact-line small { color: var(--tla-ph-muted); display: block; font-size: 11px; font-weight: 800; letter-spacing: .07em; margin-bottom: 2px; text-transform: uppercase; } .tla-ph-basic-contact-line strong { display: block; font-size: 14px; overflow-wrap: anywhere; } .tla-ph-basic-contact-line.is-static { cursor: default; } .tla-ph-basic-contact-notes, .tla-ph-basic-opening-hours { border-top: 1px solid var(--tla-ph-border); padding-top: 15px; } .tla-ph-basic-contact-notes > strong, .tla-ph-basic-opening-hours > strong { display: block; font-size: 14px; margin-bottom: 7px; } .tla-ph-basic-contact-notes p { color: var(--tla-ph-muted); font-size: 14px; line-height: 1.6; margin: 0; } .tla-ph-basic-contact-cta { justify-content: center; width: 100%; } .tla-ph-basic-profile-disclaimer { color: var(--tla-ph-muted); font-size: 12px; line-height: 1.55; margin: 0; } .tla-ph-locked-feature p { margin-bottom: 0; } .tla-ph-locked-feature a { display: none !important; } .tla-ph-manage-listing-tab { background: #3b414c; border: 1px solid rgba(255,255,255,.1); border-radius:12px 0 0 11px; box-shadow: 0 10px 24px rgba(8,13,25,.2); gap: 6px; font-size: 12px; line-height: 1.15; max-width: 158px; padding: 10px 11px; top: 55%; } .tla-ph-manage-listing-tab .dashicons { font-size: 17px; height: 17px; width: 17px; } .tla-ph-manage-listing-tab:hover, .tla-ph-manage-listing-tab:focus-visible { background: #292f39; color: #fff; } html[data-tla-theme="dark"] .tla-ph-manage-listing-tab, html[data-tla-theme="dark"] .tla-ph-manage-listing-tab:hover { background: #3b414c; color: #fff; } .tla-ph-intelligence-panel, .tla-ph-sector-research { align-items: center; background: linear-gradient(135deg, color-mix(in srgb, var(--tla-ph-blue) 8%, var(--tla-ph-surface)), color-mix(in srgb, var(--tla-ph-purple) 8%, var(--tla-ph-surface))); border: 1px solid color-mix(in srgb, var(--tla-ph-blue) 18%, var(--tla-ph-border)); border-radius: 22px; display: grid; gap: 22px; grid-template-columns: minmax(0,1.25fr) minmax(260px,.75fr); margin: 24px 0; padding: 25px; } .tla-ph-intelligence-copy h2, .tla-ph-sector-research h2 { font-size: clamp(24px,2.6vw,34px); letter-spacing: -.035em; line-height: 1.12; margin: 7px 0 9px; } .tla-ph-intelligence-copy p, .tla-ph-sector-research p { color: var(--tla-ph-muted); margin: 0 0 17px; } .tla-ph-intelligence-feature { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 17px; color: var(--tla-ph-text) !important; display: grid; gap: 6px; padding: 20px; text-decoration: none !important; } .tla-ph-intelligence-feature:hover { background: var(--tla-ph-soft); border-color: var(--tla-ph-blue); } .tla-ph-intelligence-feature > span { color: var(--tla-ph-blue); font-size: 11px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; } .tla-ph-intelligence-feature > strong { font-size: 18px; line-height: 1.28; } .tla-ph-intelligence-feature > small { color: var(--tla-ph-muted); font-weight: 750; } .tla-ph-sector-research-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; } .tla-ph-promotion-workspace { background: var(--tla-ph-bg); min-height: 100vh; padding: 34px 20px 70px; } .tla-ph-promotion-hero { align-items: center; background: linear-gradient(135deg, color-mix(in srgb, var(--tla-ph-blue) 10%, var(--tla-ph-surface)), color-mix(in srgb, var(--tla-ph-purple) 11%, var(--tla-ph-surface))); border: 1px solid color-mix(in srgb, var(--tla-ph-blue) 18%, var(--tla-ph-border)); border-radius: 25px; display: grid; gap: 24px; /* An unconstrained "auto" track sizes to the max-content width of whatever's inside .tla-ph-promotion-hero-side — including the first-campaign offer's unwrapped sentence-length copy, which can demand 600px+. That starved the heading column down to a near-zero width, wrapping it one word per line. Capping this track keeps the offer card's own text wrapping normally inside a fixed sidebar width instead of dictating the whole grid. */ grid-template-columns: minmax(0,1fr) minmax(250px,320px); margin: 18px 0 24px; padding: clamp(25px,4vw,42px); } .tla-ph-promotion-hero h1 { font-size: clamp(34px,5vw,58px); letter-spacing: -.05em; line-height: 1.02; margin: 9px 0 14px; max-width: 900px; } .tla-ph-promotion-hero p { color: var(--tla-ph-muted); font-size: 17px; line-height: 1.65; margin: 0; max-width: 790px; } .tla-ph-promotion-hero-stat { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; display: grid; min-width: 210px; padding: 22px; } .tla-ph-promotion-hero-stat span, .tla-ph-promotion-result span { color: var(--tla-ph-muted); font-size: 12px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; } .tla-ph-promotion-hero-stat strong { font-size: 38px; letter-spacing: -.04em; } .tla-ph-promotion-hero-stat small { color: var(--tla-ph-muted); } .tla-ph-promotion-section { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 23px; margin: 18px 0; padding: clamp(21px,3vw,31px); } .tla-ph-promotion-placement-grid { display: grid; gap: 13px; grid-template-columns: repeat(4,minmax(0,1fr)); } .tla-ph-promotion-placement { cursor: pointer; position: relative; } .tla-ph-promotion-placement input { height: 1px; opacity: 0; position: absolute; width: 1px; } .tla-ph-promotion-placement-body { background: var(--tla-ph-soft); border: 2px solid transparent; border-radius: 17px; display: flex; flex-direction: column; height: 100%; min-height: 190px; padding: 18px; transition: border-color .16s ease, background .16s ease, transform .16s ease; } .tla-ph-promotion-placement:hover .tla-ph-promotion-placement-body { background: color-mix(in srgb, var(--tla-ph-soft) 78%, var(--tla-ph-blue) 4%); transform: translateY(-2px); } .tla-ph-promotion-placement.is-selected .tla-ph-promotion-placement-body, .tla-ph-promotion-placement input:focus-visible + .tla-ph-promotion-placement-body { background: color-mix(in srgb, var(--tla-ph-blue) 7%, var(--tla-ph-surface)); border-color: var(--tla-ph-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--tla-ph-blue) 12%, transparent); } .tla-ph-promotion-placement-body > strong { font-size: 17px; line-height: 1.25; } .tla-ph-promotion-placement-body > b { color: var(--tla-ph-blue); font-size: 24px; letter-spacing: -.03em; margin: 12px 0 7px; } .tla-ph-promotion-placement-body > b small { color: var(--tla-ph-muted); font-size: 11px; font-weight: 750; letter-spacing: 0; } .tla-ph-promotion-placement-body > p { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.55; margin: auto 0 0; } .tla-ph-promotion-audience-form, .tla-ph-promotion-request-form { display: grid; gap: 15px; grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-promotion-field { display: grid; gap: 7px; } .tla-ph-promotion-field.is-wide { grid-column: 1 / -1; } .tla-ph-promotion-field label { font-size: 13px; font-weight: 850; } .tla-ph-promotion-field input, .tla-ph-promotion-field select, .tla-ph-promotion-field textarea { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius:14px; color: var(--tla-ph-text); font: inherit; min-height: 49px; padding: 11px 13px; width: 100%; } .tla-ph-promotion-field textarea { min-height: 130px; resize: vertical; } .tla-ph-promotion-field input:focus, .tla-ph-promotion-field select:focus, .tla-ph-promotion-field textarea:focus { border-color: var(--tla-ph-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--tla-ph-blue) 11%, transparent); outline: 0; } .tla-ph-promotion-field[hidden] { display: none !important; } .tla-ph-promotion-checks { background: var(--tla-ph-soft); border-radius: 16px; display: grid; gap: 10px; grid-column: 1 / -1; grid-template-columns: repeat(5,minmax(0,1fr)); padding: 16px; } .tla-ph-promotion-checks label { align-items: flex-start; display: flex; font-size: 13px; font-weight: 700; gap: 8px; } .tla-ph-promotion-checks input { margin-top: 2px; } .tla-ph-promotion-calculate, .tla-ph-promotion-request-actions { align-items: center; display: flex; gap: 15px; grid-column: 1 / -1; } .tla-ph-promotion-calculate p { color: #b42336; font-weight: 750; margin: 0; } .tla-ph-promotion-result { align-items: stretch; background: linear-gradient(135deg, color-mix(in srgb, var(--tla-ph-blue) 7%, var(--tla-ph-soft)), color-mix(in srgb, var(--tla-ph-purple) 7%, var(--tla-ph-soft))); border: 1px solid color-mix(in srgb, var(--tla-ph-blue) 22%, var(--tla-ph-border)); border-radius: 19px; display: grid; gap: 15px; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 20px; padding: 19px; } .tla-ph-promotion-result[hidden] { display: none !important; } .tla-ph-promotion-result > div { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 14px; display: grid; gap: 3px; padding: 16px; } .tla-ph-promotion-result strong { font-size: 29px; letter-spacing: -.035em; } .tla-ph-promotion-result small { color: var(--tla-ph-muted); } .tla-ph-promotion-result > p { color: var(--tla-ph-muted); grid-column: 1 / -1; margin: 0; } .tla-ph-promotion-request-actions p { color: var(--tla-ph-muted); font-size: 13px; margin: 0; max-width: 680px; } .tla-ph-promotion-request-actions button:disabled { cursor: not-allowed; filter: grayscale(.45); opacity: .5; } html[data-tla-theme="dark"] .tla-ph-promotion-placement-body, html[data-tla-theme="dark"] .tla-ph-basic-contact-line { background: color-mix(in srgb, var(--tla-ph-surface) 88%, #162449); } @media (max-width: 1100px) { .tla-ph-promotion-placement-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-promotion-checks { grid-template-columns: repeat(3,minmax(0,1fr)); } } @media (max-width: 900px) { .tla-ph-intelligence-panel, .tla-ph-sector-research, .tla-ph-promotion-hero { grid-template-columns: 1fr; } .tla-ph-sector-research-actions { justify-content: flex-start; } .tla-ph-promotion-audience-form, .tla-ph-promotion-request-form { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 640px) { .tla-ph-manage-listing-tab { border-radius: 10px 10px 0 0; font-size: 11px; max-width: none; padding: 9px 12px; } .tla-ph-promotion-workspace { padding: 22px 12px 58px; } .tla-ph-promotion-placement-grid, .tla-ph-promotion-audience-form, .tla-ph-promotion-request-form, .tla-ph-promotion-result { grid-template-columns: 1fr; } .tla-ph-promotion-checks { grid-template-columns: 1fr; } .tla-ph-promotion-result > p { grid-column: auto; } .tla-ph-promotion-calculate, .tla-ph-promotion-request-actions { align-items: stretch; flex-direction: column; } .tla-ph-promotion-calculate .tla-ph-frontend-button, .tla-ph-promotion-request-actions .tla-ph-frontend-button { justify-content: center; width: 100%; } } /* -------------------------------------------------------------------------- * 0.7.28: canonical Network Home, public profile polish and basic-tier preview * -------------------------------------------------------------------------- */ body.tla-ph-network-home-page .entry-title, body.tla-ph-network-home-page .page-title, body.tla-ph-network-home-page .elementor-page-title { display: none !important; } body.tla-ph-network-home-page .site-main, body.tla-ph-network-home-page .content-area, body.tla-ph-network-home-page .entry-content, body.tla-ph-network-home-page main { max-width: none !important; width: 100% !important; } body.tla-ph-network-home-page .entry-content { margin: 0 !important; padding: 0 !important; } .tla-ph-network-home { background: var(--tla-ph-bg); color: var(--tla-ph-text); min-height: 70vh; } html[data-tla-theme="dark"] .tla-ph-network-home { color-scheme: dark; } /* Keep the network navigation professional and prevent desktop scrollbars. */ .tla-ph-network-nav { flex-wrap: wrap; } .tla-ph-network-nav-links { flex-wrap: wrap; justify-content: flex-end; overflow: visible; } @media (max-width: 1180px) { .tla-ph-network-nav { align-items: flex-start; flex-direction: column; position: static; } .tla-ph-network-nav-links { justify-content: flex-start; max-width: 100%; width: 100%; } } /* Dashboard public-view links retain white contrast on every state. */ .tla-ph-public-experience-links a, .tla-ph-public-experience-links a:visited, .tla-ph-public-experience-links a:hover, .tla-ph-public-experience-links a:focus-visible, .tla-ph-public-experience-links a strong, .tla-ph-public-experience-links a:hover strong, .tla-ph-public-experience-links a:focus-visible strong { color: #fff !important; } .tla-ph-public-experience-links a small, .tla-ph-public-experience-links a:hover small, .tla-ph-public-experience-links a:focus-visible small { color: rgba(255,255,255,.72) !important; } .tla-ph-public-experience-links a:hover, .tla-ph-public-experience-links a:focus-visible { background: rgba(255,255,255,.13); border-color: rgba(255,255,255,.26); box-shadow: 0 10px 25px rgba(0,0,0,.14); text-decoration: none !important; } .tla-ph-public-experience-links a:hover strong, .tla-ph-public-experience-links a:focus-visible strong { font-weight: 950; } /* Manage This Business now lives inside the contact card rather than floating. */ .tla-ph-manage-listing-drawer { position: relative; z-index: 35; } .tla-ph-manage-business-trigger { align-items: center; background: #3b414c; border: 1px solid #4d5562; border-radius: 12px; color: #fff; cursor: pointer; display: flex; font: inherit; font-size: 13px; font-weight: 800; gap: 9px; justify-content: center; min-height: 45px; padding: 11px 14px; transition: background .16s ease, border-color .16s ease, transform .16s ease; width: 100%; } .tla-ph-manage-business-trigger .dashicons { font-size: 18px; height: 18px; width: 18px; } .tla-ph-manage-business-trigger:hover, .tla-ph-manage-business-trigger:focus-visible { background: #292f39; border-color: #667080; color: #fff; transform: translateY(-1px); } html[data-tla-theme="dark"] .tla-ph-manage-business-trigger { background: #353c48; border-color: #596273; color: #fff; } html[data-tla-theme="dark"] .tla-ph-manage-business-trigger:hover, html[data-tla-theme="dark"] .tla-ph-manage-business-trigger:focus-visible { background: #46505f; } /* Screenshot-style premium profile illustration shown only to basic members. */ .tla-ph-premium-preview-panel { align-items: center; background: linear-gradient(135deg,color-mix(in srgb,var(--tla-ph-blue) 7%,var(--tla-ph-surface)),color-mix(in srgb,var(--tla-ph-purple) 8%,var(--tla-ph-surface))); border: 1px solid color-mix(in srgb,var(--tla-ph-blue) 20%,var(--tla-ph-border)); border-radius: 25px; display: grid; gap: clamp(24px,4vw,48px); grid-template-columns: minmax(320px,.78fr) minmax(480px,1.22fr); margin: 24px 0; overflow: hidden; padding: clamp(25px,4vw,42px); position: relative; } .tla-ph-premium-preview-panel::after { background: var(--tla-ph-grad); border-radius: 50%; content: ""; filter: blur(75px); height: 250px; opacity: .12; position: absolute; right: -80px; top: -100px; width: 250px; } .tla-ph-premium-preview-panel > * { position: relative; z-index: 1; } .tla-ph-premium-preview-copy h2 { font-size: clamp(29px,3.4vw,43px); letter-spacing: -.045em; line-height: 1.06; margin: 9px 0 14px; } .tla-ph-premium-preview-copy > p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; } .tla-ph-premium-preview-copy ul { display: grid; gap: 9px; list-style: none; margin: 20px 0; padding: 0; } .tla-ph-premium-preview-copy li { padding-left: 27px; position: relative; } .tla-ph-premium-preview-copy li::before { color: #159b69; content: "✓"; font-weight: 950; left: 2px; position: absolute; } .tla-ph-premium-preview-copy > small { color: var(--tla-ph-muted); display: block; font-size: 12px; line-height: 1.5; margin-top: 12px; } .tla-ph-premium-preview-visual { perspective: 1100px; } .tla-ph-premium-browser { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; box-shadow: 0 26px 58px rgba(13,20,44,.18); overflow: hidden; transform: rotateY(-3deg) rotateX(1deg); } .tla-ph-premium-browser-bar { align-items: center; background: var(--tla-ph-soft); border-bottom: 1px solid var(--tla-ph-border); display: flex; gap: 7px; padding: 10px 13px; } .tla-ph-premium-browser-bar i { background: #cbd3df; border-radius: 50%; display: block; height: 8px; width: 8px; } .tla-ph-premium-browser-bar i:first-child { background: #ff7c8d; } .tla-ph-premium-browser-bar i:nth-child(2) { background: #ffbf55; } .tla-ph-premium-browser-bar i:nth-child(3) { background: #37c98a; } .tla-ph-premium-browser-bar span { color: var(--tla-ph-muted); font-size:0.68rem; margin-left: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-premium-demo-cover { align-items: end; background: linear-gradient(125deg,rgba(5,14,38,.9),rgba(51,25,108,.65)),radial-gradient(circle at 82% 18%,#2ab7ec 0,transparent 34%),linear-gradient(145deg,#071127,#4b1a79); color: #fff; display: grid; gap: 14px; grid-template-columns: 72px minmax(0,1fr) auto; min-height: 200px; padding: 28px; } .tla-ph-premium-demo-logo { align-items: center; background: #fff; border-radius: 17px; color: #0a90f6; display: flex; font-size: 23px; font-weight: 950; height: 72px; justify-content: center; width: 72px; } .tla-ph-premium-demo-cover small { color: #7de2ff; display: block; font-size:0.7rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; } .tla-ph-premium-demo-cover strong { color: #fff; display: block; font-size: 27px; line-height: 1.08; } .tla-ph-premium-demo-cover span { color: rgba(255,255,255,.72); display: block; font-size: 11px; margin-top: 5px; } .tla-ph-premium-demo-cover > b { align-items: center; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: #fff; display: flex; font-size: 11px; gap: 5px; padding: 8px 11px; } .tla-ph-premium-demo-cover > b .dashicons { color: #63e4ff; font-size: 15px; height: 15px; width: 15px; } .tla-ph-premium-demo-tabs { border-bottom: 1px solid var(--tla-ph-border); display: flex; gap: 20px; overflow: hidden; padding: 12px 18px; } .tla-ph-premium-demo-tabs span { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 850; white-space: nowrap; } .tla-ph-premium-demo-content { display: grid; gap: 15px; grid-template-columns: 1fr 160px; padding: 18px; } .tla-ph-premium-demo-content > div { background: var(--tla-ph-soft); border-radius:14px; padding: 15px; } .tla-ph-premium-demo-content strong { font-size: 13px; } .tla-ph-premium-demo-content p { background: color-mix(in srgb,var(--tla-ph-muted) 20%,transparent); border-radius: 999px; height: 7px; margin: 10px 0 0; width: 92%; } .tla-ph-premium-demo-content p:nth-child(3) { width: 68%; } .tla-ph-premium-demo-pills { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 15px; } .tla-ph-premium-demo-pills span { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-text); font-size:0.68rem; padding: 5px 7px; } .tla-ph-premium-demo-content aside { align-items: center; background: linear-gradient(145deg,#071127,#22104b); border-radius:14px; color: #fff; display: flex; flex-direction: column; justify-content: center; padding: 14px; text-align: center; } .tla-ph-premium-demo-content aside .dashicons { color: #63dcff; } .tla-ph-premium-demo-content aside strong { color: #fff; margin: 7px 0 11px; } .tla-ph-premium-demo-content aside button { background: linear-gradient(135deg,#d820dc,#159df1); border: 0; border-radius: 999px; color: #fff; font-size:0.68rem; font-weight: 850; padding: 8px 10px; } html[data-tla-theme="dark"] .tla-ph-premium-browser { box-shadow: 0 26px 58px rgba(0,0,0,.38); } @media (max-width: 980px) { .tla-ph-premium-preview-panel { grid-template-columns: 1fr; } .tla-ph-premium-preview-visual { margin: 0 auto; max-width: 760px; width: 100%; } } @media (max-width: 640px) { .tla-ph-premium-preview-panel { border-radius: 20px; padding: 22px 17px; } .tla-ph-premium-browser { transform: none; } .tla-ph-premium-demo-cover { align-items: center; grid-template-columns: 58px minmax(0,1fr); min-height: 175px; padding: 19px; } .tla-ph-premium-demo-logo { border-radius:14px; height: 58px; width: 58px; } .tla-ph-premium-demo-cover > b { grid-column: 1 / -1; justify-self: start; } .tla-ph-premium-demo-content { grid-template-columns: 1fr; } } /* 0.7.29: source-of-truth audience reconciliation, stable profile canvas and production Trusted Partner branding. */ .tla-ph-basic-public-listing, .tla-ph-premium-profile { box-sizing: border-box; max-width: 1480px; overflow-x: clip; padding-top: clamp(26px,3vw,44px) !important; } .tla-ph-basic-public-listing *, .tla-ph-premium-profile * { box-sizing: border-box; } .tla-ph-basic-listing-grid, .tla-ph-basic-listing-hero, .tla-ph-profile-anchor-nav, .tla-ph-network-nav { max-width: 100%; min-width: 0; } .tla-ph-basic-listing-grid { gap: clamp(18px,2vw,28px); grid-template-columns: minmax(0,1fr) minmax(320px,380px); width: 100%; } .tla-ph-basic-listing-grid > main, .tla-ph-basic-listing-grid > aside, .tla-ph-basic-listing-grid section { min-width: 0; } .tla-ph-basic-listing-grid > aside { width: 100%; } .tla-ph-basic-contact-card { overflow: hidden; width: 100%; } .tla-ph-basic-contact-line { max-width: 100%; min-width: 0; } .tla-ph-basic-contact-line strong { max-width: 100%; word-break: break-word; } .tla-ph-profile-anchor-nav { flex-wrap: wrap; overflow: visible; } @media (max-width: 1120px) { .tla-ph-basic-listing-grid { grid-template-columns: 1fr; } .tla-ph-basic-listing-grid > aside { position: static; } } /* The drawer was removed: management is now one compact, non-intrusive link inside the contact card. */ .tla-ph-manage-listing-drawer, .tla-ph-manage-listing-panel, .tla-ph-manage-listing-overlay, .tla-ph-manage-business-trigger { display: none !important; } .tla-ph-manage-business-compact { align-items: center; border-top: 1px solid var(--tla-ph-border); display: flex; justify-content: flex-start; margin-top: 1px; min-width: 0; padding-top: 15px; width: 100%; } .tla-ph-manage-business-link, .tla-ph-manage-business-link:visited { align-items: center; background: #3b414c; border: 1px solid #4d5562; border-radius: 9px; color: #fff !important; display: inline-flex; flex: 0 1 auto; font-size: 12px; max-width: 100%; font-weight: 850; gap: 6px; justify-content: center; line-height: 1.2; padding: 9px 11px; text-decoration: none !important; } .tla-ph-manage-business-link .dashicons { font-size: 15px; height: 15px; width: 15px; } .tla-ph-manage-business-link:hover, .tla-ph-manage-business-link:focus-visible { background: #292f39; border-color: #667080; color: #fff !important; } html[data-tla-theme="dark"] .tla-ph-manage-business-compact { border-color: rgba(255,255,255,.12); } html[data-tla-theme="dark"] .tla-ph-manage-business-link, html[data-tla-theme="dark"] .tla-ph-manage-business-link:hover { background: #414956; border-color: #687282; color: #fff !important; } @media (max-width: 520px) { .tla-ph-manage-business-link { width: 100%; } } /* Production Trusted Partner logos: colour/navy artwork for light surfaces, white artwork for dark surfaces. */ .tla-ph-trusted-partner-brand { align-items: center; display: inline-flex; line-height: 0; max-width: 100%; } .tla-ph-trusted-logo { display: block; height: auto; object-fit: contain; width: 100%; } .tla-ph-trusted-logo.is-dark { display: none; } html[data-tla-theme="dark"] .tla-ph-trusted-logo.is-light { display: none; } html[data-tla-theme="dark"] .tla-ph-trusted-logo.is-dark { display: block; } .tla-ph-trusted-partner-brand.is-navigation { width: 158px; } .tla-ph-network-nav-brand { align-items: center; border-radius: 10px; display: inline-flex; flex: 0 0 auto; line-height: 0; padding: 2px 4px; text-decoration: none !important; } .tla-ph-network-nav-brand:hover, .tla-ph-network-nav-brand:focus-visible { background: color-mix(in srgb,var(--tla-ph-blue) 7%,transparent); } .tla-ph-trusted-partner-brand.is-network-hero { display: flex; margin-bottom: 18px; width: min(310px,72%); } .tla-ph-trusted-partner-brand.is-trust-card { display: flex; margin-bottom: 16px; width: min(220px,80%); } .tla-ph-trusted-partner-brand.is-profile-trust { flex: 0 0 125px; width: 125px; } .tla-ph-trust-panel .tla-ph-trusted-partner-brand { margin-right: 4px; } @media (max-width: 680px) { .tla-ph-trusted-partner-brand.is-navigation { width: 136px; } .tla-ph-trusted-partner-brand.is-profile-trust { flex-basis: 105px; width: 105px; } } /* -------------------------------------------------------------------------- * 0.7.31: unified public navigation, constrained logo and service language * -------------------------------------------------------------------------- */ .tla-ph-network-nav, .tla-ph-network-home .tla-ph-network-nav { align-items: center; background: color-mix(in srgb,var(--tla-ph-surface) 97%,transparent); display: grid; gap: clamp(8px,1.2vw,16px); grid-template-columns: minmax(108px,142px) minmax(0,1fr); margin-bottom: clamp(20px,2.2vw,30px) !important; max-width: 100%; padding: 12px 14px; position: sticky; top: 92px; width: 100%; } .tla-ph-network-nav-brand, .tla-ph-network-home .tla-ph-network-nav-brand { display: flex; flex: none; max-width: 142px; min-width: 0; overflow: hidden; width: 100%; } .tla-ph-network-nav-brand .tla-ph-trusted-partner-brand.is-navigation, .tla-ph-network-home .tla-ph-trusted-partner-brand.is-navigation { display: flex; max-height: 42px; max-width: 142px; min-width: 0; width: 100%; } .tla-ph-network-nav-brand .tla-ph-trusted-logo { height: auto; max-height: 42px; max-width: 100%; object-fit: contain; object-position: left center; width: 100%; } .tla-ph-network-nav-links, .tla-ph-network-home .tla-ph-network-nav-links { align-items: center; display: flex; flex: none; flex-wrap: nowrap; gap: 2px; justify-content: flex-end; min-width: 0; overflow: visible; width: 100%; } .tla-ph-network-nav-links a, .tla-ph-network-home .tla-ph-network-nav-links a { flex: 0 1 auto; font-size: clamp(11.5px,.84vw,13.5px); line-height: 1.25; min-width: 0; padding: 9px clamp(7px,.72vw,10px); text-align: center; white-space: nowrap; } html[data-tla-theme="dark"] .tla-ph-network-nav { background: color-mix(in srgb,var(--tla-ph-surface) 96%,#050717); border-color: var(--tla-ph-border); box-shadow: 0 12px 32px rgba(0,0,0,.24); } html[data-tla-theme="dark"] .tla-ph-network-nav-links a:hover, html[data-tla-theme="dark"] .tla-ph-network-nav-links a:focus-visible, html[data-tla-theme="dark"] .tla-ph-network-nav-links a.is-active { background: color-mix(in srgb,var(--tla-ph-blue) 18%,var(--tla-ph-surface)); color: #8edcff; } @media (max-width: 980px) { .tla-ph-network-nav, .tla-ph-network-home .tla-ph-network-nav { grid-template-columns: minmax(102px,126px) minmax(0,1fr); position: static; } .tla-ph-network-nav-brand, .tla-ph-network-home .tla-ph-network-nav-brand, .tla-ph-network-nav-brand .tla-ph-trusted-partner-brand.is-navigation, .tla-ph-network-home .tla-ph-trusted-partner-brand.is-navigation { max-width: 126px; } .tla-ph-network-nav-links a, .tla-ph-network-home .tla-ph-network-nav-links a { font-size: 11.5px; padding-inline: 6px; } } @media (max-width: 760px) { .tla-ph-network-nav, .tla-ph-network-home .tla-ph-network-nav { align-items: start; grid-template-columns: 1fr; padding: 13px; } .tla-ph-network-nav-brand, .tla-ph-network-home .tla-ph-network-nav-brand { max-width: 132px; } .tla-ph-network-nav-links, .tla-ph-network-home .tla-ph-network-nav-links { display: grid; gap: 6px; grid-template-columns: repeat(2,minmax(0,1fr)); justify-content: stretch; } .tla-ph-network-nav-links a, .tla-ph-network-home .tla-ph-network-nav-links a { align-items: center; display: flex; font-size: 12px; justify-content: center; min-height: 39px; padding: 8px; white-space: normal; } .tla-ph-network-nav-links a:last-child { grid-column: 1 / -1; } } @media (max-width: 420px) { .tla-ph-network-nav-links, .tla-ph-network-home .tla-ph-network-nav-links { grid-template-columns: 1fr; } .tla-ph-network-nav-links a:last-child { grid-column: auto; } } /* Promotion audience source-of-truth strip and dual base/target result. */ .tla-ph-promotion-source-strip { display: grid; gap: 12px; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 18px 0 24px; } .tla-ph-promotion-source-strip > div { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 15px; display: grid; gap: 4px; padding: 15px 17px; } .tla-ph-promotion-source-strip span { color: var(--tla-ph-muted); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; } .tla-ph-promotion-source-strip strong { color: var(--tla-ph-heading); font-size: 24px; letter-spacing: -.03em; } .tla-ph-promotion-result { grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-promotion-result-context, .tla-ph-promotion-intent-benchmark, .tla-ph-promotion-active-filters, .tla-ph-promotion-result > p { grid-column: 1 / -1; } .tla-ph-promotion-result-context { color: var(--tla-ph-heading) !important; font-weight: 750; } .tla-ph-promotion-intent-benchmark { background: color-mix(in srgb,var(--tla-ph-blue) 7%,var(--tla-ph-surface)); border-left: 3px solid var(--tla-ph-blue); border-radius: 0 10px 10px 0; color: var(--tla-ph-muted); padding: 11px 13px; } .tla-ph-promotion-active-filters { display: flex; flex-wrap: wrap; gap: 7px; } .tla-ph-promotion-active-filters[hidden] { display: none !important; } .tla-ph-promotion-active-filters span { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-text); font-size: 12px; font-weight: 750; padding: 6px 9px; text-transform: none; } @media (max-width: 900px) { .tla-ph-promotion-source-strip { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-promotion-result { grid-template-columns: 1fr; } .tla-ph-promotion-result-context, .tla-ph-promotion-intent-benchmark, .tla-ph-promotion-active-filters, .tla-ph-promotion-result > p { grid-column: auto; } } @media (max-width: 520px) { .tla-ph-promotion-source-strip { grid-template-columns: 1fr; } } .tla-ph-trusted-partner-brand.is-dashboard-status { display: flex; margin-bottom: 12px; width: min(170px,100%); } /* -------------------------------------------------------------------------- * 0.7.30: restrained Trusted Partner branding and separated Network Home cards * -------------------------------------------------------------------------- */ .tla-ph-network-home > .tla-ph-shell-inner { display: flow-root; } .tla-ph-network-home .tla-ph-network-nav { align-items: center; flex-wrap: nowrap; gap: 12px; margin: 0 0 clamp(24px,2.4vw,34px) !important; padding: 14px 18px; } .tla-ph-network-home .tla-ph-network-nav-brand { flex: 0 0 auto; padding: 0; } .tla-ph-network-home .tla-ph-trusted-partner-brand.is-navigation { width: 142px; } .tla-ph-network-home .tla-ph-network-nav-links { flex: 1 1 auto; flex-wrap: nowrap; gap: 2px; justify-content: flex-end; min-width: 0; overflow: visible; } .tla-ph-network-home .tla-ph-network-nav-links a { font-size: 14px; padding: 9px 10px; } .tla-ph-network-home .tla-ph-network-hero { margin: 0; } .tla-ph-network-home .tla-ph-network-hero-copy > .tla-ph-frontend-eyebrow { margin-top: 0; } .tla-ph-network-home .tla-ph-network-trust-card > .dashicons { color: #5ed8ff; display: block; font-size: 36px; height: 36px; margin: 0 0 18px; width: 36px; } /* The full lockup belongs in the network navigation, not repeatedly inside the same page. */ .tla-ph-network-home .tla-ph-trusted-partner-brand.is-network-hero, .tla-ph-network-home .tla-ph-trusted-partner-brand.is-trust-card { display: none !important; } /* Current-status cards use status text; the full partner lockup is reserved for public trust and toolkit contexts. */ .tla-ph-dashboard-status .tla-ph-trusted-partner-brand.is-dashboard-status { display: none !important; } @media (max-width: 1240px) { .tla-ph-network-home .tla-ph-network-nav { align-items: flex-start; flex-wrap: wrap; } .tla-ph-network-home .tla-ph-network-nav-links { flex-basis: 100%; flex-wrap: wrap; justify-content: flex-start; width: 100%; } } @media (max-width: 680px) { .tla-ph-network-home .tla-ph-network-nav { border-radius: 16px; padding: 13px 14px; } .tla-ph-network-home .tla-ph-trusted-partner-brand.is-navigation { width: 126px; } .tla-ph-network-home .tla-ph-network-nav-links a { font-size: 13px; padding: 8px 9px; } } /* 0.7.31 final cascade: supersede the earlier 0.7.30 home-only breakpoints. */ .tla-ph-network-home .tla-ph-network-nav { display: grid; grid-template-columns: minmax(108px,142px) minmax(0,1fr); padding: 12px 14px; } .tla-ph-network-home .tla-ph-network-nav-links { flex-basis: auto; flex-wrap: nowrap; justify-content: flex-end; } .tla-ph-network-home .tla-ph-network-nav-links a { font-size: clamp(11.5px,.84vw,13.5px); padding: 9px clamp(7px,.72vw,10px); } @media (max-width: 980px) { .tla-ph-network-home .tla-ph-network-nav { align-items: center; grid-template-columns: minmax(102px,126px) minmax(0,1fr); } .tla-ph-network-home .tla-ph-network-nav-links { flex-basis: auto; flex-wrap: nowrap; justify-content: flex-end; } .tla-ph-network-home .tla-ph-network-nav-links a { font-size: 11.5px; padding-inline: 6px; } } @media (max-width: 760px) { .tla-ph-network-home .tla-ph-network-nav { align-items: start; grid-template-columns: 1fr; padding: 13px; } .tla-ph-network-home .tla-ph-network-nav-links { display: grid; gap: 6px; grid-template-columns: repeat(2,minmax(0,1fr)); justify-content: stretch; } .tla-ph-network-home .tla-ph-network-nav-links a { font-size: 12px; padding: 8px; white-space: normal; } } @media (max-width: 420px) { .tla-ph-network-home .tla-ph-network-nav-links { grid-template-columns: 1fr; } } /* -------------------------------------------------------------------------- * 0.9.1 source-of-truth public experience * -------------------------------------------------------------------------- */ .tla-ph-canonical-main { background: var(--tla-ph-bg); margin: 0; min-height: 60vh; padding: 0; width: 100%; } .tla-ph-match-page { background: var(--tla-ph-bg); color: var(--tla-ph-text); padding: clamp(28px,4vw,52px) clamp(18px,4vw,54px) 78px; } .tla-ph-match-page > .tla-ph-shell-inner { max-width: 1360px; } /* The Hub menu is deliberately a content module, never an extension of the site header. */ .tla-ph-network-portal { align-items: center; background: color-mix(in srgb,var(--tla-ph-surface) 97%,transparent); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 15px 42px rgba(21,18,70,.08); display: grid; gap: 18px; grid-template-columns: minmax(195px,.42fr) minmax(0,1.58fr); margin: 0 0 clamp(42px,5vw,72px); padding: 16px 18px; position: relative; top: auto; width: 100%; z-index: 3; } .tla-ph-network-portal::before { background: var(--tla-ph-grad); border-radius: 22px 22px 0 0; content: ""; height: 3px; left: 18px; position: absolute; right: 18px; top: -1px; } .tla-ph-network-portal-head { align-items: center; display: flex; gap: 10px; min-width: 0; } .tla-ph-network-portal .tla-ph-network-nav-brand { flex: 0 0 92px; max-width: 92px; overflow: hidden; padding: 2px; width: 92px; } .tla-ph-network-portal .tla-ph-trusted-partner-brand.is-navigation { display: flex; max-height: 38px; max-width: 92px; width: 92px; } .tla-ph-network-portal .tla-ph-trusted-logo { max-height: 38px; max-width: 92px; object-fit: contain; object-position: left center; width: 92px; } .tla-ph-network-portal-copy { border-left: 1px solid var(--tla-ph-divider); display: grid; gap: 1px; min-width: 0; padding-left: 10px; } .tla-ph-network-portal-copy span { color: var(--tla-ph-blue); font-size:0.68rem; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; } .tla-ph-network-portal-copy strong { color: var(--tla-ph-heading); font-size: 13px; line-height: 1.2; } .tla-ph-network-portal .tla-ph-network-nav, .tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav { background: transparent !important; border: 0 !important; box-shadow: none !important; display: block !important; margin: 0 !important; padding: 0 !important; position: static !important; width: 100%; } .tla-ph-network-portal .tla-ph-network-nav-links, .tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links { display: grid; gap: 6px; grid-template-columns: repeat(5,minmax(0,1fr)); width: 100%; } .tla-ph-network-portal .tla-ph-network-nav-links a, .tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links a { align-items: center; border: 1px solid transparent; border-radius:12px; color: var(--tla-ph-muted); display: flex; font-size: clamp(11px,.77vw,12.5px); font-weight: 780; justify-content: center; line-height: 1.3; min-height: 42px; padding: 8px; text-align: center; white-space: normal; } .tla-ph-network-portal .tla-ph-network-nav-links a:hover, .tla-ph-network-portal .tla-ph-network-nav-links a:focus-visible { background: var(--tla-ph-soft); border-color: var(--tla-ph-border); color: var(--tla-ph-heading); } .tla-ph-network-portal .tla-ph-network-nav-links a.is-active { background: var(--tla-ph-pastel-blue); border-color: rgba(10,144,246,.16); color: var(--tla-ph-blue); } .tla-ph-match-hero { align-items: center; background: linear-gradient(135deg,#fff 0%,#faf8ff 45%,#eef8ff 100%); border: 1px solid rgba(72,52,150,.10); border-radius: 28px; box-shadow: 0 24px 70px rgba(21,18,70,.10); display: grid; gap: clamp(30px,5vw,68px); grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr); overflow: hidden; padding: clamp(38px,6vw,78px); position: relative; } .tla-ph-match-hero::before { background: radial-gradient(circle,rgba(223,41,211,.12),transparent 65%); content: ""; height: 360px; left: -170px; position: absolute; top: -210px; width: 360px; } .tla-ph-match-hero-copy { position: relative; z-index: 1; } .tla-ph-match-hero h1 { color: #060614; font-size: clamp(36px,4.7vw,60px); font-weight: 850; letter-spacing: -.052em; line-height: 1.01; margin: 15px 0 20px; max-width: 840px; } .tla-ph-match-hero p { color: #4f4f70; font-size: clamp(16px,1.35vw,19px); line-height: 1.72; margin: 0; max-width: 790px; } .tla-ph-match-trust-row { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; } .tla-ph-match-trust-row span { background: rgba(255,255,255,.72); border: 1px solid rgba(10,0,50,.08); border-radius: 999px; color: #34344f; font-size: 11px; font-weight: 760; padding: 8px 12px; } .tla-ph-match-trust-row span::before { color: var(--tla-ph-green); content: "✓"; font-weight: 900; margin-right: 6px; } .tla-ph-match-hero-visual { align-items: center; background: rgba(255,255,255,.76); border: 1px solid rgba(223,41,211,.13); border-radius: 24px; box-shadow: 0 18px 50px rgba(61,37,145,.10); display: flex; flex-direction: column; min-height: 290px; padding: 32px; position: relative; z-index: 1; } .tla-ph-match-hero-visual strong { color: #060614; font-size: 18px; margin-top: 20px; } .tla-ph-match-hero-visual small { color: #686887; font-size: 11px; margin-top: 6px; } .tla-ph-match-orbit { height: 142px; position: relative; width: 142px; } .tla-ph-match-orbit::before,.tla-ph-match-orbit::after,.tla-ph-match-orbit i { border: 1px solid rgba(223,41,211,.18); border-radius: 50%; content: ""; inset: 0; position: absolute; } .tla-ph-match-orbit::after { border-color: rgba(10,144,246,.22); inset: 17px; } .tla-ph-match-orbit i:nth-child(1) { background: var(--tla-ph-pink); border: 0; height: 13px; inset: 8px auto auto 25px; width: 13px; } .tla-ph-match-orbit i:nth-child(2) { background: var(--tla-ph-blue); border: 0; height: 10px; inset: auto 5px 38px auto; width: 10px; } .tla-ph-match-orbit i:nth-child(3) { background: var(--tla-ph-cyan); border: 0; height: 8px; inset: auto auto 17px 28px; width: 8px; } .tla-ph-match-orbit span { align-items: center; background: var(--tla-ph-grad); border: 8px solid #f5f2ff; border-radius: 50%; color: #fff; display: flex; font-size: 28px; height: 66px; justify-content: center; left: 38px; position: absolute; top: 38px; width: 66px; } .tla-ph-match-section { padding: clamp(74px,8vw,108px) 0 0; } .tla-ph-match-section-heading { margin: 0 auto 38px; max-width: 820px; text-align: center; } .tla-ph-match-section-heading h2 { font-size: clamp(30px,4vw,52px); letter-spacing: -.045em; line-height: 1.08; margin: 13px 0 16px; } .tla-ph-match-section-heading p { color: var(--tla-ph-muted); font-size: 16px; line-height: 1.7; margin: 0; } .tla-ph-match-console { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 25px; box-shadow: 0 26px 72px rgba(21,18,70,.12); display: grid; grid-template-columns: minmax(270px,.72fr) minmax(0,1.28fr); overflow: hidden; } .tla-ph-match-intro { background: linear-gradient(145deg,rgba(223,41,211,.095),rgba(223,41,211,.045) 48%,rgba(10,144,246,.075)); border-right: 1px solid rgba(223,41,211,.10); padding: clamp(30px,4vw,50px); } .tla-ph-match-badge { align-items: center; background: rgba(255,255,255,.78); border: 1px solid rgba(223,41,211,.13); border-radius: 999px; color: var(--tla-ph-violet); display: inline-flex; font-size:0.7rem; font-weight: 850; gap: 7px; letter-spacing: .07em; padding: 8px 11px; text-transform: uppercase; } .tla-ph-match-badge i { background: var(--tla-ph-green); border-radius: 50%; box-shadow: 0 0 0 4px rgba(5,150,105,.10); height: 7px; width: 7px; } .tla-ph-match-intro h3 { font-size: clamp(25px,2.7vw,36px); letter-spacing: -.04em; line-height: 1.12; margin: 24px 0 14px; } .tla-ph-match-intro > p { color: var(--tla-ph-muted); line-height: 1.7; margin: 0; } .tla-ph-match-points { display: grid; gap: 16px; list-style: none; margin: 30px 0 0; padding: 0; } .tla-ph-match-points li { align-items: center; color: var(--tla-ph-text); display: flex; font-size: 12px; font-weight: 720; gap: 11px; } .tla-ph-match-points span { align-items: center; background: var(--tla-ph-surface); border: 1px solid rgba(223,41,211,.14); border-radius: 10px; color: var(--tla-ph-violet); display: flex; flex: 0 0 34px; height: 34px; justify-content: center; } .tla-ph-match-wizard { background: var(--tla-ph-surface); border: 0; box-shadow: none; min-width: 0; padding: clamp(30px,4vw,52px); } .tla-ph-match-progress { background: var(--tla-ph-soft); border-radius: 999px; height: 5px; margin: 0 0 14px; overflow: hidden; } .tla-ph-match-progress span { background: var(--tla-ph-grad); border: 0; display: block; height: 100%; padding: 0; transition: width .25s ease; width: 25%; } .tla-ph-match-step-label { color: var(--tla-ph-blue); font-size:0.7rem; font-weight: 850; letter-spacing: .09em; margin-bottom: 28px; text-transform: uppercase; } .tla-ph-match-step { border: 0; margin: 0; min-width: 0; padding: 0; } .tla-ph-match-wizard.is-enhanced .tla-ph-match-step { display: none; } .tla-ph-match-wizard.is-enhanced .tla-ph-match-step.is-active { display: block; } .tla-ph-match-step:focus { outline: none; } .tla-ph-match-step legend { color: var(--tla-ph-heading); float: left; font-size: clamp(23px,3vw,34px); font-weight: 830; letter-spacing: -.035em; line-height: 1.15; margin-bottom: 10px; width: 100%; } .tla-ph-match-step > p { clear: both; color: var(--tla-ph-muted); line-height: 1.65; margin: 0 0 25px; } .tla-ph-match-options { display: grid; gap: 11px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-match-option { cursor: pointer; min-width: 0; } .tla-ph-match-option input { height: 1px; opacity: 0; position: absolute; width: 1px; } .tla-ph-match-option > span { align-items: center; background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius:14px; color: var(--tla-ph-text); display: flex; font-size: 12px; font-weight: 740; justify-content: space-between; line-height: 1.42; min-height: 58px; padding: 13px 15px; transition: border-color .15s,box-shadow .15s,transform .15s; } .tla-ph-match-option > span::after { border: 2px solid #c7c8d9; border-radius: 50%; content: ""; flex: 0 0 17px; height: 17px; margin-left: 9px; width: 17px; } .tla-ph-match-option input:focus-visible + span { box-shadow: 0 0 0 3px rgba(10,144,246,.17); } .tla-ph-match-option input:checked + span { background: linear-gradient(135deg,rgba(223,41,211,.075),rgba(10,144,246,.065)); border-color: rgba(223,41,211,.30); box-shadow: 0 10px 26px rgba(53,39,118,.08); transform: translateY(-1px); } .tla-ph-match-option input:checked + span::after { background: var(--tla-ph-grad); border-color: transparent; box-shadow: inset 0 0 0 4px #fff; } .tla-ph-match-option strong,.tla-ph-match-option small { display: block; } .tla-ph-match-option small { color: var(--tla-ph-muted); font-size:0.68rem; font-weight: 650; margin-top: 3px; } .tla-ph-match-field { display: grid; gap: 8px; margin-top: 18px; } .tla-ph-match-fields { display: grid; gap: 16px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-match-field > span,.tla-ph-match-fields label > span { color: var(--tla-ph-heading); font-size: 11px; font-weight: 780; } .tla-ph-match-field input,.tla-ph-match-field select,.tla-ph-match-field textarea,.tla-ph-match-fields input:not([type=checkbox]),.tla-ph-match-fields select,.tla-ph-match-fields textarea { background: var(--tla-ph-bg-alt); border: 1px solid var(--tla-ph-border); border-radius:12px; color: var(--tla-ph-text); font: inherit; min-height: 48px; padding: 11px 13px; width: 100%; } .tla-ph-match-field textarea,.tla-ph-match-fields textarea { min-height: 110px; resize: vertical; } .tla-ph-match-field input:focus,.tla-ph-match-field select:focus,.tla-ph-match-field textarea:focus,.tla-ph-match-fields input:focus,.tla-ph-match-fields select:focus,.tla-ph-match-fields textarea:focus { border-color: var(--tla-ph-blue); box-shadow: 0 0 0 3px rgba(10,144,246,.13); outline: 0; } .tla-ph-match-wizard .tla-ph-check { align-items: flex-start; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 12px; display: flex; gap: 9px; margin-top: 18px; padding: 12px 14px; } .tla-ph-match-wizard .tla-ph-check input { accent-color: var(--tla-ph-violet); margin-top: 3px; } .tla-ph-match-wizard .tla-ph-check span { color: var(--tla-ph-text); font-size: 11px; line-height: 1.5; } .tla-ph-match-actions { align-items: center; border-top: 1px solid var(--tla-ph-divider); display: flex; gap: 12px; justify-content: space-between; margin-top: 30px; padding-top: 22px; } .tla-ph-match-results { padding: 88px 0 8px; scroll-margin-top: 24px; } .tla-ph-match-results .tla-ph-section-heading p { color: var(--tla-ph-muted); max-width: 760px; } .tla-ph-match-selection-help { background: var(--tla-ph-pastel-blue); border: 1px solid rgba(10,144,246,.14); border-radius:14px; color: var(--tla-ph-text); line-height: 1.55; margin: 0 0 22px; padding: 15px 18px; } .tla-ph-match-grid { display: grid; gap: 24px; grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-match-result { align-self: start; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; box-shadow: 0 12px 34px rgba(21,18,70,.07); overflow: hidden; } .tla-ph-match-result .tla-ph-directory-card { border: 0; border-radius: 0; box-shadow: none; } .tla-ph-match-select { align-items: center; background: var(--tla-ph-pastel-mix); border-bottom: 1px solid var(--tla-ph-border); color: var(--tla-ph-heading); cursor: pointer; display: grid; gap: 10px; grid-template-columns: auto 1fr auto; padding: 16px 19px; } .tla-ph-match-select input { accent-color: var(--tla-ph-violet); height: 19px; margin: 0; width: 19px; } .tla-ph-match-select span { font-size: 12px; font-weight: 760; } .tla-ph-match-select strong { color: var(--tla-ph-violet); font-size: 20px; } .tla-ph-match-reasons { border-bottom: 1px solid var(--tla-ph-divider); padding: 17px 20px 14px; } .tla-ph-match-reasons > span { color: var(--tla-ph-blue); font-size:0.68rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-match-reasons ul { display: grid; gap: 5px; margin: 10px 0 0 18px; padding: 0; } .tla-ph-match-reasons li { color: var(--tla-ph-muted); font-size: 11px; line-height: 1.5; } .tla-ph-match-contact { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: var(--tla-ph-shadow); display: grid; gap: 24px; margin-top: 34px; padding: clamp(24px,4vw,42px); } .tla-ph-match-contact h3 { font-size: clamp(24px,3vw,38px); margin: 8px 0 10px; } .tla-ph-match-contact p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; } .tla-ph-match-contact .tla-ph-check { align-items: flex-start; display: flex; gap: 9px; } .tla-ph-match-contact .tla-ph-check span { color: var(--tla-ph-text); font-size: 11px; line-height: 1.55; } .tla-ph-match-disclaimer { border-top: 1px solid var(--tla-ph-divider); display: grid; gap: 10px; grid-template-columns: auto 1fr; margin-top: 50px; padding-top: 24px; } .tla-ph-match-disclaimer strong { color: var(--tla-ph-heading); font-size: 12px; } .tla-ph-match-disclaimer p { color: var(--tla-ph-muted); font-size: 11px; line-height: 1.6; margin: 0; } .tla-ph-honeypot { height: 1px !important; left: -10000px !important; overflow: hidden !important; position: absolute !important; top: auto !important; width: 1px !important; } html[data-tla-theme="dark"] .tla-ph-match-hero { background: linear-gradient(135deg,#060720,#0b0c29 54%,#07152b); border-color: rgba(255,255,255,.09); } html[data-tla-theme="dark"] .tla-ph-match-hero h1,html[data-tla-theme="dark"] .tla-ph-match-hero-visual strong { color: var(--tla-ph-heading); } html[data-tla-theme="dark"] .tla-ph-match-hero p,html[data-tla-theme="dark"] .tla-ph-match-hero-visual small { color: var(--tla-ph-muted); } html[data-tla-theme="dark"] .tla-ph-match-trust-row span,html[data-tla-theme="dark"] .tla-ph-match-hero-visual,html[data-tla-theme="dark"] .tla-ph-match-badge { background: rgba(255,255,255,.055); border-color: rgba(255,255,255,.09); color: var(--tla-ph-text); } html[data-tla-theme="dark"] .tla-ph-match-intro { background: linear-gradient(145deg,rgba(223,41,211,.18),rgba(223,41,211,.08) 48%,rgba(10,144,246,.13)); } html[data-tla-theme="dark"] .tla-ph-match-option input:checked + span { background: linear-gradient(135deg,rgba(223,41,211,.20),rgba(10,144,246,.14)); } html[data-tla-theme="dark"] .tla-ph-network-portal { background: #060720; } @media (max-width: 1060px) { .tla-ph-network-portal { grid-template-columns: 1fr; } .tla-ph-network-portal .tla-ph-network-nav-links,.tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links { grid-template-columns: repeat(5,minmax(110px,1fr)); overflow-x: auto; } .tla-ph-match-console { grid-template-columns: minmax(240px,.65fr) minmax(0,1.35fr); } } @media (max-width: 820px) { .tla-ph-match-hero,.tla-ph-match-console,.tla-ph-match-grid { grid-template-columns: 1fr; } .tla-ph-match-hero-visual { display: none; } .tla-ph-match-intro { border-bottom: 1px solid rgba(223,41,211,.10); border-right: 0; } } @media (max-width: 620px) { .tla-ph-match-page { padding-inline: 14px; } .tla-ph-network-portal { border-radius: 17px; margin-bottom: 38px; padding: 14px; } .tla-ph-network-portal .tla-ph-network-nav-links,.tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; } .tla-ph-network-portal .tla-ph-network-nav-links a:last-child { grid-column: 1/-1; } .tla-ph-match-hero { border-radius: 22px; padding: 32px 23px; } .tla-ph-match-hero h1 { font-size: clamp(34px,11vw,44px); } .tla-ph-match-options,.tla-ph-match-fields { grid-template-columns: 1fr; } .tla-ph-match-wizard,.tla-ph-match-intro { padding: 26px 21px; } .tla-ph-match-actions { align-items: stretch; flex-direction: column-reverse; } .tla-ph-match-actions > * { justify-content: center; width: 100%; } .tla-ph-match-disclaimer { grid-template-columns: 1fr; } } @media (max-width: 390px) { .tla-ph-network-portal .tla-ph-network-nav-links,.tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links { grid-template-columns: 1fr; } .tla-ph-network-portal .tla-ph-network-nav-links a:last-child { grid-column: auto; } } /* -------------------------------------------------------------------------- * 0.9.1 sector-aware Partner Hub application shell * -------------------------------------------------------------------------- */ .tla-ph-partner-app { background: var(--tla-ph-bg); color: var(--tla-ph-text); font-family: var(--tla-ph-font); min-height: 72vh; padding: clamp(26px,3vw,44px) clamp(14px,3vw,38px) 64px; } .tla-ph-partner-app * { box-sizing: border-box; } .tla-ph-partner-app-frame { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 25px; box-shadow: 0 25px 75px rgba(21,18,70,.11); display: grid; grid-template-columns: 268px minmax(0,1fr); margin: 0 auto; max-width: 1500px; min-height: 760px; overflow: hidden; } .tla-ph-partner-rail { background: linear-gradient(180deg,color-mix(in srgb,var(--tla-ph-surface) 97%,#f1efff),color-mix(in srgb,var(--tla-ph-surface) 97%,#edf8ff)); border-right: 1px solid var(--tla-ph-divider); display: flex; flex-direction: column; min-width: 0; padding: 19px 13px 15px; } .tla-ph-partner-rail-brand { align-items: center; border-bottom: 1px solid var(--tla-ph-divider); display: flex; gap: 11px; margin: 0 5px 14px; padding: 3px 2px 17px; } .tla-ph-partner-rail-mark { align-items: center; background: var(--tla-ph-grad); border-radius: 12px; box-shadow: 0 9px 24px rgba(223,41,211,.18); color: #fff; display: flex; flex: 0 0 43px; font-size: 13px; font-weight: 900; height: 43px; justify-content: center; letter-spacing: -.03em; } .tla-ph-partner-rail-brand > div { display: grid; gap: 2px; min-width: 0; } .tla-ph-partner-rail-brand small { color: var(--tla-ph-blue); font-size:0.68rem; font-weight: 850; letter-spacing: .10em; text-transform: uppercase; } .tla-ph-partner-rail-brand strong { color: var(--tla-ph-heading); font-size: 13px; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-partner-rail .tla-ph-sector-switcher { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 12px; display: grid; gap: 4px; margin: 0 2px 15px; padding: 5px; } .tla-ph-partner-rail .tla-ph-sector-switcher a { background: transparent; border: 0; border-radius: 8px; color: var(--tla-ph-muted); font-size:0.7rem; font-weight: 760; padding: 8px 10px; text-align: left; } .tla-ph-partner-rail .tla-ph-sector-switcher a.is-active { background: var(--tla-ph-surface); box-shadow: 0 5px 15px rgba(21,18,70,.06); color: var(--tla-ph-blue); } .tla-ph-partner-nav { display: flex; flex: 1; flex-direction: column; gap: 13px; min-height: 0; overflow-y: auto; padding: 1px 2px 14px; scrollbar-width: thin; } .tla-ph-partner-nav-group { display: grid; gap: 4px; } .tla-ph-partner-nav-group-label { color: var(--tla-ph-muted-light); font-size:0.68rem; font-weight: 850; letter-spacing: .13em; padding: 0 10px 3px; text-transform: uppercase; } .tla-ph-partner-nav-item { align-items: center; border: 1px solid transparent; border-radius:12px; color: var(--tla-ph-muted) !important; display: flex; gap: 10px; min-height: 47px; padding: 7px 9px; text-decoration: none !important; transition: background .15s,border-color .15s,transform .15s; } .tla-ph-partner-nav-item:hover,.tla-ph-partner-nav-item:focus-visible { background: var(--tla-ph-soft); border-color: var(--tla-ph-border); color: var(--tla-ph-heading) !important; transform: translateX(2px); } .tla-ph-partner-nav-item.is-active { background: linear-gradient(135deg,rgba(223,41,211,.10),rgba(10,144,246,.10)); border-color: rgba(223,41,211,.17); color: var(--tla-ph-heading) !important; } .tla-ph-partner-nav-item.is-locked { cursor: not-allowed; opacity: .52; } .tla-ph-partner-nav-icon { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 9px; color: var(--tla-ph-muted); display: flex; flex: 0 0 32px; font-size: 16px; height: 32px; justify-content: center; width: 32px; } .tla-ph-partner-nav-item.is-active .tla-ph-partner-nav-icon { background: var(--tla-ph-grad); border-color: transparent; box-shadow: 0 7px 18px rgba(223,41,211,.17); color: #fff; } .tla-ph-partner-nav-copy { display: grid; gap: 1px; min-width: 0; } .tla-ph-partner-nav-copy strong { color: inherit; font-size: 11.5px; font-weight: 780; line-height: 1.25; } .tla-ph-partner-nav-copy small { color: var(--tla-ph-muted-light); font-size:0.68rem; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-partner-rail-footer { align-items: flex-start; background: var(--tla-ph-pastel-blue); border: 1px solid rgba(10,144,246,.12); border-radius: 12px; display: flex; gap: 9px; margin: 8px 2px 0; padding: 11px; } .tla-ph-partner-rail-footer > .dashicons { color: var(--tla-ph-blue); flex: 0 0 18px; font-size: 17px; } .tla-ph-partner-rail-footer span:last-child { display: grid; gap: 2px; } .tla-ph-partner-rail-footer strong { color: var(--tla-ph-heading); font-size:0.68rem; } .tla-ph-partner-rail-footer small { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.35; } .tla-ph-partner-main { background: linear-gradient(145deg,color-mix(in srgb,var(--tla-ph-bg) 88%,#fff),color-mix(in srgb,var(--tla-ph-bg) 95%,#eef7ff)); min-width: 0; outline: 0; padding: 0; position: relative; } .tla-ph-partner-panel-toolbar { align-items: center; border-bottom: 1px solid var(--tla-ph-divider); display: flex; justify-content: flex-end; min-height: 54px; padding: 10px clamp(18px,3vw,34px); } .tla-ph-partner-panel-toolbar > span { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-muted); font-size:0.68rem; font-weight: 760; padding: 7px 10px; } .tla-ph-partner-mobile-menu { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 10px; color: var(--tla-ph-heading); cursor: pointer; display: none; font: 750 11px/1 var(--tla-ph-font); gap: 7px; padding: 9px 11px; } .tla-ph-partner-panel-content { min-height: 660px; padding: clamp(22px,3vw,36px); transition: opacity .16s; } .tla-ph-partner-app.is-loading .tla-ph-partner-panel-content { opacity: .38; pointer-events: none; } .tla-ph-partner-app.is-loading .tla-ph-partner-main::after { animation: tla-ph-workspace-spin .8s linear infinite; border: 3px solid rgba(10,144,246,.18); border-radius: 50%; border-top-color: var(--tla-ph-blue); content: ""; height: 30px; left: 50%; position: absolute; top: 110px; width: 30px; z-index: 5; } @keyframes tla-ph-workspace-spin { to { transform: rotate(360deg); } } .tla-ph-partner-workspace-status { height: 1px; overflow: hidden; position: absolute; width: 1px; clip-path: inset(50%); } /* Existing data workspaces are rendered inside the persistent application panel. */ .tla-ph-partner-panel-content > .tla-ph-shell,.tla-ph-partner-panel-content > .tla-ph-component,.tla-ph-partner-panel-content .tla-ph-dashboard { background: transparent !important; margin: 0 !important; padding: 0 !important; } .tla-ph-partner-panel-content > .tla-ph-shell::before,.tla-ph-partner-panel-content > .tla-ph-component::before { display: none !important; } .tla-ph-partner-panel-content .tla-ph-shell-inner,.tla-ph-partner-panel-content .tla-ph-dashboard > .tla-ph-shell-inner,.tla-ph-partner-panel-content .tla-ph-property-workspace .tla-ph-shell-inner { margin: 0; max-width: none; padding: 0; width: 100%; } .tla-ph-partner-panel-content .tla-ph-frontend-back { display: none; } .tla-ph-partner-panel-content .tla-ph-dashboard-hero { border-radius: 20px; box-shadow: 0 14px 40px rgba(21,18,70,.07); padding: clamp(24px,3.5vw,38px); } .tla-ph-partner-panel-content .tla-ph-dashboard-hero h1 { font-size: clamp(30px,3.5vw,46px); } .tla-ph-partner-panel-content .tla-ph-dashboard-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-partner-panel-content .tla-ph-dashboard-card { min-height: 210px; } html[data-tla-theme="dark"] .tla-ph-partner-app { background: #010012; } html[data-tla-theme="dark"] .tla-ph-partner-app-frame { box-shadow: 0 28px 80px rgba(0,0,0,.48); } html[data-tla-theme="dark"] .tla-ph-partner-rail { background: linear-gradient(180deg,#060720,#05061c); } html[data-tla-theme="dark"] .tla-ph-partner-main { background: linear-gradient(145deg,#010012,#04051a); } html[data-tla-theme="dark"] .tla-ph-partner-nav-item:hover { background: rgba(255,255,255,.055); } html[data-tla-theme="dark"] .tla-ph-partner-nav-item.is-active { background: linear-gradient(135deg,rgba(223,41,211,.22),rgba(10,144,246,.16)); border-color: rgba(255,255,255,.10); } @media (max-width: 1040px) { .tla-ph-partner-app-frame { grid-template-columns: 232px minmax(0,1fr); } .tla-ph-partner-nav-copy small { display: none; } .tla-ph-partner-panel-content { padding: 24px 20px 30px; } } @media (max-width: 820px) { .tla-ph-partner-app-frame { display: block; min-height: 0; overflow: visible; } .tla-ph-partner-rail { border-bottom: 1px solid var(--tla-ph-divider); border-right: 0; display: block; padding: 14px; } .tla-ph-partner-rail-brand { border: 0; margin-bottom: 0; padding-bottom: 2px; } .tla-ph-partner-rail .tla-ph-sector-switcher,.tla-ph-partner-nav,.tla-ph-partner-rail-footer { display: none; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-rail .tla-ph-sector-switcher { display: flex; overflow-x: auto; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav { display: flex; flex-direction: row; gap: 8px; margin-top: 13px; overflow-x: auto; padding-bottom: 8px; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav-group { display: flex; flex-direction: row; gap: 5px; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav-group-label { display: none; } .tla-ph-partner-nav-item { flex: 0 0 auto; min-height: 42px; } .tla-ph-partner-nav-copy small { display: none; } .tla-ph-partner-panel-toolbar { justify-content: space-between; } .tla-ph-partner-mobile-menu { display: inline-flex; } } @media (max-width: 620px) { .tla-ph-partner-app { padding: 14px 8px 42px; } .tla-ph-partner-app-frame { border-radius: 18px; } .tla-ph-partner-panel-content { padding: 18px 12px 26px; } .tla-ph-partner-panel-content .tla-ph-dashboard-grid,.tla-ph-partner-panel-content .tla-ph-dashboard-metrics { grid-template-columns: 1fr; } .tla-ph-partner-panel-toolbar { padding-inline: 14px; } } /* -------------------------------------------------------------------------- * 0.9.2 premium matching motion and resilient empty discovery * -------------------------------------------------------------------------- */ .tla-ph-match-results:focus { outline: 0 !important; } .tla-ph-match-results { padding-top: clamp(58px,7vw,82px); } .tla-ph-match-hero-visual.tla-ph-match-logistics { background: linear-gradient(145deg,rgba(255,255,255,.94),rgba(248,246,255,.92)); display: grid; grid-template-rows: minmax(300px,1fr) auto; min-height: 455px; overflow: hidden; padding: 22px; } .tla-ph-match-logistics-aura { animation: tla-ph-logistics-spin 16s linear infinite; background: conic-gradient(from 45deg,rgba(223,41,211,.18),rgba(10,144,246,.16),rgba(23,178,226,.12),rgba(223,41,211,.18)); border-radius: 50%; filter: blur(33px); height: 260px; left: 50%; position: absolute; top: 44%; transform: translate(-50%,-50%); width: 260px; } .tla-ph-match-logistics-stage { aspect-ratio: 1; margin: auto; max-width: 330px; position: relative; width: 100%; } .tla-ph-match-logistics-ring { border: 1.5px dashed rgba(10,144,246,.28); border-radius: 50%; inset: 7%; position: absolute; } .tla-ph-match-logistics-ring.is-outer { animation: tla-ph-logistics-ring 34s linear infinite; } .tla-ph-match-logistics-ring.is-inner { animation: tla-ph-logistics-ring-reverse 24s linear infinite; border-color: rgba(223,41,211,.25); inset: 27%; } .tla-ph-match-logistics-core { align-items: center; background: linear-gradient(135deg,#df29d3,#df29d3 50%,#0a90f6); border: 7px solid rgba(255,255,255,.86); border-radius: 24px; box-shadow: 0 18px 45px rgba(223,41,211,.28); color: #fff; display: flex; flex-direction: column; height: 92px; justify-content: center; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 92px; z-index: 4; } .tla-ph-match-logistics-core::after { animation: tla-ph-logistics-pulse 2.8s ease-out infinite; border: 1px solid rgba(10,144,246,.34); border-radius: 28px; content: ""; inset: -8px; position: absolute; } .tla-ph-match-logistics-core svg { fill: none; height: 35px; stroke: currentColor; stroke-linecap: round; stroke-width: 3; width: 35px; } .tla-ph-match-logistics-core strong { color: #fff; font-size:0.7rem; letter-spacing: .10em; margin: 2px 0 0; text-transform: uppercase; } .tla-ph-match-logistics-node { --node-accent: #0a90f6; align-items: center; animation: tla-ph-logistics-float 5.6s ease-in-out infinite; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius:14px; box-shadow: 0 10px 26px rgba(21,18,70,.11); display: flex; gap: 6px; padding: 7px 9px 7px 7px; position: absolute; transition: border-color .25s,box-shadow .25s,transform .25s; white-space: nowrap; z-index: 5; } .tla-ph-match-logistics-node::after { border: 1px solid transparent; border-radius: 17px; content: ""; inset: -5px; opacity: 0; position: absolute; } .tla-ph-match-logistics-node.is-active { border-color: var(--node-accent); box-shadow: 0 0 0 5px color-mix(in srgb,var(--node-accent) 12%,transparent),0 15px 34px rgba(21,18,70,.15); } .tla-ph-match-logistics-node.is-active::after { animation: tla-ph-logistics-node-pulse 1.9s ease-out infinite; border-color: color-mix(in srgb,var(--node-accent) 38%,transparent); } .tla-ph-match-logistics-node i { align-items: center; background: color-mix(in srgb,var(--node-accent) 12%,transparent); border-radius: 8px; color: var(--node-accent); display: flex; font-size: 14px; height: 27px; justify-content: center; width: 27px; } .tla-ph-match-logistics-node b { color: var(--tla-ph-heading); font-size:0.68rem; line-height: 1; } .tla-ph-match-logistics-node.is-service { left: 50%; top: 0; transform: translateX(-50%); --node-accent:#df29d3; } .tla-ph-match-logistics-node.is-location { right: -3%; top: 30%; --node-accent:#0a90f6; } .tla-ph-match-logistics-node.is-trust { bottom: 4%; right: 7%; --node-accent:#00996b; } .tla-ph-match-logistics-node.is-capacity { bottom: 4%; left: 5%; --node-accent:#df29d3; } .tla-ph-match-logistics-node.is-timing { left: -2%; top: 30%; --node-accent:#17b2e2; } .tla-ph-match-logistics-signal { --tx: 0; --ty: -128px; animation: tla-ph-logistics-signal 4.1s ease-in-out infinite; background: linear-gradient(135deg,#df29d3,#0a90f6); border-radius: 50%; box-shadow: 0 0 9px rgba(10,144,246,.65); height: 7px; left: 50%; opacity: 0; position: absolute; top: 50%; width: 7px; z-index: 3; } .tla-ph-match-logistics-signal.is-two { --tx: 128px; --ty: -38px; animation-delay:.75s; } .tla-ph-match-logistics-signal.is-three { --tx: 85px; --ty: 112px; animation-delay:1.5s; } .tla-ph-match-logistics-signal.is-four { --tx: -88px; --ty: 112px; animation-delay:2.25s; } .tla-ph-match-logistics-signal.is-five { --tx: -128px; --ty: -38px; animation-delay:3s; } .tla-ph-match-logistics-copy { background: rgba(255,255,255,.84); border: 1px solid rgba(223,41,211,.12); border-radius: 15px; display: grid; gap: 3px; padding: 13px 15px; position: relative; text-align: left; z-index: 6; } .tla-ph-match-logistics-copy > span { color: var(--tla-ph-blue); font-size:0.68rem; font-weight: 850; letter-spacing: .10em; text-transform: uppercase; } .tla-ph-match-logistics-copy strong { color: var(--tla-ph-heading); font-size: 13px; margin: 0; transition: opacity .18s; } .tla-ph-match-logistics-copy small { color: var(--tla-ph-muted); font-size:0.68rem; line-height: 1.4; margin: 0; } @keyframes tla-ph-logistics-spin { to { transform: translate(-50%,-50%) rotate(360deg); } } @keyframes tla-ph-logistics-ring { to { transform: rotate(360deg); } } @keyframes tla-ph-logistics-ring-reverse { to { transform: rotate(-360deg); } } @keyframes tla-ph-logistics-pulse { 0% { opacity:.8; transform:scale(.95); } 75%,100% { opacity:0; transform:scale(1.25); } } @keyframes tla-ph-logistics-node-pulse { 0% { opacity:.8; transform:scale(.96); } 75%,100% { opacity:0; transform:scale(1.13); } } @keyframes tla-ph-logistics-float { 0%,100% { margin-top:0; } 50% { margin-top:-6px; } } @keyframes tla-ph-logistics-signal { 0% { opacity:0; transform:translate(-50%,-50%); } 12% { opacity:1; } 50% { opacity:1; transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))); } 63%,100% { opacity:0; } } .tla-ph-match-legal-audience { background: linear-gradient(135deg,rgba(223,41,211,.055),rgba(10,144,246,.06)); border: 1px solid rgba(223,41,211,.14); border-radius: 16px; margin-top: 18px; padding: 17px; } .tla-ph-match-legal-audience[hidden] { display: none !important; } .tla-ph-match-field-label { color: var(--tla-ph-heading); display: block; font-size: 13px; font-weight: 820; } .tla-ph-match-legal-audience > p { color: var(--tla-ph-muted); font-size:0.7rem; line-height: 1.55; margin: 5px 0 13px; } .tla-ph-match-empty { display: grid; gap: 26px; } .tla-ph-match-empty-actions { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-pastel-blue)); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 16px 42px rgba(21,18,70,.07); display: grid; gap: 26px; grid-template-columns: minmax(0,1fr) auto; padding: clamp(25px,4vw,42px); } .tla-ph-match-empty-actions h3 { font-size: clamp(24px,3vw,36px); letter-spacing: -.035em; margin: 9px 0 10px; } .tla-ph-match-empty-actions p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; max-width: 760px; } .tla-ph-match-empty-buttons { align-items: stretch; display: grid; gap: 10px; min-width: 205px; } .tla-ph-match-alternatives { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: 0 18px 52px rgba(21,18,70,.07); padding: clamp(24px,4vw,42px); } .tla-ph-match-alternatives .tla-ph-section-heading { margin-bottom: 24px; } .tla-ph-match-alternatives .tla-ph-section-heading h3 { font-size: clamp(24px,3vw,38px); margin: 7px 0; } .tla-ph-match-recruit { align-items: center; background: linear-gradient(135deg,rgba(223,41,211,.07),rgba(223,41,211,.075),rgba(10,144,246,.075)); border: 1px solid rgba(223,41,211,.15); border-radius: 20px; display: grid; gap: 18px; grid-template-columns: auto minmax(0,1fr) auto; padding: 22px 24px; } .tla-ph-match-recruit > .dashicons { align-items: center; background: var(--tla-ph-surface); border: 1px solid rgba(223,41,211,.13); border-radius: 15px; color: var(--tla-ph-violet); display: flex; font-size: 24px; height: 52px; justify-content: center; width: 52px; } .tla-ph-match-recruit small { color: var(--tla-ph-blue); display: block; font-size:0.68rem; font-weight: 850; letter-spacing: .10em; text-transform: uppercase; } .tla-ph-match-recruit h3 { font-size: 18px; margin: 4px 0; } .tla-ph-match-recruit p { color: var(--tla-ph-muted); font-size: 11px; line-height: 1.5; margin: 0; } html[data-tla-theme="dark"] .tla-ph-match-hero-visual.tla-ph-match-logistics { background: linear-gradient(145deg,#060720,#090a28); } html[data-tla-theme="dark"] .tla-ph-match-logistics-copy { background: rgba(1,0,18,.78); border-color: rgba(255,255,255,.10); } html[data-tla-theme="dark"] .tla-ph-match-logistics-core { border-color: #11122f; } html[data-tla-theme="dark"] .tla-ph-match-logistics-node { box-shadow: 0 10px 28px rgba(0,0,0,.42); } @media (max-width: 820px) { .tla-ph-match-hero-visual.tla-ph-match-logistics { display: grid; margin-top: 6px; min-height: 420px; } .tla-ph-match-empty-actions { grid-template-columns: 1fr; } .tla-ph-match-empty-buttons { display: flex; flex-wrap: wrap; min-width: 0; } .tla-ph-match-recruit { align-items: start; grid-template-columns: auto 1fr; } .tla-ph-match-recruit > a { grid-column: 1/-1; justify-self: start; } } @media (max-width: 520px) { .tla-ph-match-logistics-stage { max-width: 285px; } .tla-ph-match-logistics-node b { display: none; } .tla-ph-match-logistics-node { padding: 6px; } .tla-ph-match-logistics-node i { height: 26px; width: 26px; } .tla-ph-match-hero-visual.tla-ph-match-logistics { min-height: 390px; padding: 16px; } .tla-ph-match-empty-buttons { display: grid; } .tla-ph-match-recruit { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { .tla-ph-match-logistics * { animation: none !important; transition: none !important; } .tla-ph-match-logistics-signal { display: none; } } /* 0.9.19: Agency and Legal onboarding launch treatment. Future-sector previews deliberately contain no public prices until their launch. */ .tla-ph-join-onboarding-pill, .tla-ph-pricing-status.is-onboarding { background: linear-gradient(135deg,#df29d3,#6e22ff 48%,#0a90f6 100%) !important; border-color: transparent !important; color: #fff !important; -webkit-text-fill-color: #fff !important; box-shadow: 0 8px 24px rgba(110,34,255,.22); font-weight: 900; letter-spacing: .07em; } .tla-ph-join-onboarding-grid { display: grid; gap: 16px; grid-template-columns: repeat(2,minmax(0,1fr)); margin: 22px 0 30px; } .tla-ph-join-onboarding-grid > a { background: linear-gradient(135deg,rgba(223,41,211,.07),rgba(10,144,246,.08)),var(--tla-ph-surface); border: 1px solid rgba(10,144,246,.22); border-radius: 20px; box-shadow: 0 10px 30px rgba(21,18,70,.06); color: var(--tla-ph-text) !important; display: grid; gap: 7px; padding: 22px; text-decoration: none; transition: border-color .2s ease,box-shadow .2s ease,transform .2s ease; } .tla-ph-join-onboarding-grid > a:hover, .tla-ph-join-onboarding-grid > a:focus-visible { border-color: rgba(10,144,246,.42); box-shadow: var(--tla-ph-shadow); transform: translateY(-3px); } .tla-ph-join-onboarding-grid > a:focus-visible { outline: 3px solid rgba(23,178,226,.34); outline-offset: 3px; } .tla-ph-join-onboarding-grid span { color: var(--tla-ph-blue); font-size: 11px; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; } .tla-ph-join-onboarding-grid strong { color: var(--tla-ph-heading); font-size: 20px; line-height: 1.3; } .tla-ph-join-onboarding-grid small { color: var(--tla-ph-muted); font-size: 14px; line-height: 1.55; } .tla-ph-public-price-value.is-interest-only strong { font-size: 20px; letter-spacing: -.02em; } html[data-tla-theme="dark"] .tla-ph-join-onboarding-grid > a { box-shadow: 0 10px 30px rgba(0,0,0,.28); } @media(max-width:760px){.tla-ph-join-onboarding-grid{grid-template-columns:1fr}.tla-ph-join-onboarding-grid> a{padding:18px}} @media(prefers-reduced-motion:reduce){.tla-ph-join-onboarding-grid>a:hover,.tla-ph-join-onboarding-grid>a:focus-visible{transform:none}} /* -------------------------------------------------------------------------- * 0.9.2 partner workspace alignment, theme-aware identity and exact preview * -------------------------------------------------------------------------- */ .tla-ph-canonical-workspace-main { padding-top: clamp(16px,1.8vw,28px); } .tla-ph-partner-app .tla-ph-partner-mobile-menu { display: none !important; } .tla-ph-partner-rail-brand { align-items: stretch; display: grid; gap: 10px; justify-items: stretch; margin-inline: 2px; padding: 7px 4px 20px; text-align: center; } .tla-ph-partner-rail-logo { display: flex; justify-content: center; width: 100%; } .tla-ph-partner-rail-logo .tla-ph-trusted-logo { max-height: 88px; object-position: center; width: 100%; } .tla-ph-partner-rail-title { color: var(--tla-ph-heading); display: block; font-size: 12px; font-weight: 820; letter-spacing: .01em; line-height: 1.35; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; width: 100%; } .tla-ph-partner-panel-content > :first-child { scroll-margin-top: 130px; } .tla-ph-media-guidance { scroll-margin-top: 132px; } .tla-ph-media-guidance-link { align-items: center; color: var(--tla-ph-blue) !important; display: inline-flex; font-size:0.7rem; font-weight: 780; gap: 6px; margin-top: 11px; text-decoration: none !important; } .tla-ph-media-guidance-link:hover,.tla-ph-media-guidance-link:focus-visible { color: var(--tla-ph-violet) !important; text-decoration: underline !important; text-underline-offset: 3px; } .tla-ph-media-guidance-link .dashicons { font-size: 15px; height: 15px; width: 15px; } .tla-ph-preview-launcher { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),color-mix(in srgb,var(--tla-ph-pastel-purple) 64%,var(--tla-ph-surface)),color-mix(in srgb,var(--tla-ph-pastel-blue) 68%,var(--tla-ph-surface))); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: 0 22px 58px rgba(21,18,70,.09); display: grid; gap: 34px; grid-template-columns: minmax(0,1fr) auto; min-height: 330px; overflow: hidden; padding: clamp(30px,5vw,58px); position: relative; } .tla-ph-preview-launcher::before { background: radial-gradient(circle,rgba(223,41,211,.16),transparent 68%); border-radius: 50%; content: ""; height: 310px; pointer-events: none; position: absolute; right: -90px; top: -120px; width: 310px; } .tla-ph-preview-launcher-copy { position: relative; z-index: 1; } .tla-ph-preview-launcher-copy h2 { color: var(--tla-ph-heading); font-size: clamp(30px,4vw,52px); letter-spacing: -.045em; line-height: 1.04; margin: 12px 0 17px; max-width: 820px; } .tla-ph-preview-launcher-copy p { color: var(--tla-ph-muted); font-size: clamp(13px,1.5vw,17px); line-height: 1.7; margin: 0; max-width: 820px; } .tla-ph-preview-launcher-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 26px; } .tla-ph-preview-launcher-status { align-items: center; aspect-ratio: 1; background: color-mix(in srgb,var(--tla-ph-surface) 88%,transparent); border: 1px solid var(--tla-ph-border); border-radius: 28px; box-shadow: 0 18px 46px rgba(21,18,70,.09); display: flex; flex-direction: column; justify-content: center; min-width: 210px; padding: 26px; position: relative; text-align: center; z-index: 1; } .tla-ph-preview-launcher-status span { color: var(--tla-ph-muted); font-size:0.68rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; } .tla-ph-preview-launcher-status strong { background: var(--tla-ph-grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-size: 50px; letter-spacing: -.05em; line-height: 1; margin: 13px 0 9px; } .tla-ph-preview-launcher-status small { color: var(--tla-ph-muted); font-size:0.68rem; } html.tla-ph-preview-open { overflow: hidden; } .tla-ph-profile-preview-dialog { background: var(--tla-ph-bg); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 35px 100px rgba(1,0,18,.36); color: var(--tla-ph-text); height: calc(100vh - 32px); inset: 16px; margin: auto; max-height: none; max-width: none; overflow: hidden; padding: 0; position: fixed; width: calc(100vw - 32px); } .tla-ph-profile-preview-dialog:not([open]) { display: none; } .tla-ph-profile-preview-dialog[open] { display: grid; grid-template-rows: auto minmax(0,1fr); } .tla-ph-profile-preview-dialog::backdrop { backdrop-filter: blur(9px); background: rgba(1,0,18,.62); } .tla-ph-profile-preview-dialog-bar { align-items: center; background: var(--tla-ph-surface); border-bottom: 1px solid var(--tla-ph-divider); display: flex; justify-content: space-between; min-height: 64px; padding: 10px 16px 10px 20px; } .tla-ph-profile-preview-dialog-bar > div { align-items: center; display: flex; gap: 11px; min-width: 0; } .tla-ph-profile-preview-dialog-bar > div:first-child > .dashicons { align-items: center; background: var(--tla-ph-grad); border-radius: 10px; color: #fff; display: flex; font-size: 18px; height: 38px; justify-content: center; width: 38px; } .tla-ph-profile-preview-dialog-bar span { display: grid; gap: 2px; min-width: 0; } .tla-ph-profile-preview-dialog-bar strong { color: var(--tla-ph-heading); font-size: 12px; } .tla-ph-profile-preview-dialog-bar small { color: var(--tla-ph-muted); font-size:0.68rem; } .tla-ph-profile-preview-dialog-bar a { color: var(--tla-ph-blue) !important; font-size:0.7rem; font-weight: 780; text-decoration: none !important; } .tla-ph-profile-preview-dialog-bar button { align-items: center; background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 10px; color: var(--tla-ph-heading); cursor: pointer; display: flex; font:25px/1 var(--tla-ph-font); height: 40px; justify-content: center; padding: 0; width: 40px; } .tla-ph-profile-preview-dialog iframe { background: var(--tla-ph-bg); border: 0; display: block; height: 100%; width: 100%; } .tla-ph-full-profile-preview { background: var(--tla-ph-bg); color: var(--tla-ph-text); min-height: 80vh; padding-top: clamp(42px,5vw,70px); } .tla-ph-partner-preview-banner { align-items: center; background: color-mix(in srgb,var(--tla-ph-surface) 92%,var(--tla-ph-pastel-blue)); border: 1px solid var(--tla-ph-border); border-radius: 14px; display: flex; gap: 11px; margin: 0 auto 20px; max-width: 1500px; padding: 12px 16px; width: calc(100% - clamp(28px,6vw,92px)); } .tla-ph-partner-preview-banner > .dashicons { color: var(--tla-ph-blue); } .tla-ph-partner-preview-banner > div { display: grid; gap: 2px; } .tla-ph-partner-preview-banner strong { color: var(--tla-ph-heading); font-size: 11px; } .tla-ph-partner-preview-banner small { color: var(--tla-ph-muted); font-size:0.68rem; } html[data-tla-theme="dark"] .tla-ph-preview-launcher { background: linear-gradient(135deg,#060720,#090a28,#071126); } html[data-tla-theme="dark"] .tla-ph-profile-preview-dialog { background: #010012; border-color: rgba(255,255,255,.11); } html[data-tla-theme="dark"] .tla-ph-profile-preview-dialog-bar { background: #060720; } @media (max-width: 820px) { .tla-ph-canonical-workspace-main { padding-top: 28px; } .tla-ph-partner-app .tla-ph-partner-mobile-menu { display: inline-flex !important; } .tla-ph-partner-rail-brand { border-bottom: 1px solid var(--tla-ph-divider); margin-bottom: 12px; padding: 5px 10px 16px; } .tla-ph-partner-rail-logo { margin: 0 auto; max-width: 245px; } .tla-ph-partner-rail-logo .tla-ph-trusted-logo { max-height: 76px; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-rail .tla-ph-sector-switcher { display: grid; margin-top: 12px; overflow: visible; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav { display: grid; gap: 15px; margin-top: 13px; overflow: visible; padding: 0 0 10px; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav-group { display: grid; gap: 5px; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav-group-label { display: block; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav-item { min-height: 48px; width: 100%; } .tla-ph-partner-app.is-menu-open .tla-ph-partner-nav-copy small { display: block; } .tla-ph-preview-launcher { grid-template-columns: 1fr; } .tla-ph-preview-launcher-status { aspect-ratio: auto; display: grid; grid-template-columns: 1fr auto; justify-items: start; min-width: 0; text-align: left; width: 100%; } .tla-ph-preview-launcher-status strong { grid-row: 1/3; margin: 0 0 0 20px; } } @media (max-width: 560px) { .tla-ph-profile-preview-dialog { border-radius:14px; height: calc(100vh - 12px); inset: 6px; width: calc(100vw - 12px); } .tla-ph-profile-preview-dialog-bar { min-height: 58px; padding: 8px 9px 8px 12px; } .tla-ph-profile-preview-dialog-bar small,.tla-ph-profile-preview-dialog-bar a { display: none; } .tla-ph-preview-launcher { border-radius: 20px; padding: 26px 20px; } .tla-ph-preview-launcher-actions { display: grid; } .tla-ph-preview-launcher-actions > * { justify-content: center; width: 100%; } } /* -------------------------------------------------------------------------- * 0.9.4 compact site-header clearance for every Partner Hub-owned surface * -------------------------------------------------------------------------- */ body.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.tla-ph-services-page .tla-ph-canonical-main, body.tla-ph-matching-page .tla-ph-canonical-main, body.tla-ph-partner-preview-page .tla-ph-canonical-main, body.tla-ph-sector-landing-page .tla-ph-canonical-main, body.tla-ph-partner-content-page #primary, body.tla-ph-network-home-page #primary, body.tla-ph-join-partner-page #primary, body.tla-ph-public-route-page .tla-ph-public-shell { padding-top: clamp(16px,1.6vw,26px) !important; } body.admin-bar.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.admin-bar.tla-ph-services-page .tla-ph-canonical-main, body.admin-bar.tla-ph-matching-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-preview-page .tla-ph-canonical-main, body.admin-bar.tla-ph-sector-landing-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-content-page #primary, body.admin-bar.tla-ph-network-home-page #primary, body.admin-bar.tla-ph-join-partner-page #primary, body.admin-bar.tla-ph-public-route-page .tla-ph-public-shell { padding-top: clamp(24px,2.2vw,34px) !important; } .tla-ph-directory-filter .tla-ph-check { align-items: center !important; align-self: end !important; display: inline-flex !important; gap: 9px !important; justify-self: start; min-height: 48px; } .tla-ph-directory-filter .tla-ph-check > input[type="checkbox"] { flex: 0 0 18px; height: 18px; margin: 0 !important; min-height: 18px; padding: 0; width: 18px; } .tla-ph-directory-filter .tla-ph-check > span { display: inline-block; line-height: 1.2; margin: 0; } @media (max-width: 820px) { body.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.tla-ph-services-page .tla-ph-canonical-main, body.tla-ph-matching-page .tla-ph-canonical-main, body.tla-ph-partner-preview-page .tla-ph-canonical-main, body.tla-ph-sector-landing-page .tla-ph-canonical-main, body.tla-ph-partner-content-page #primary, body.tla-ph-network-home-page #primary, body.tla-ph-join-partner-page #primary, body.tla-ph-public-route-page .tla-ph-public-shell, body.admin-bar.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.admin-bar.tla-ph-services-page .tla-ph-canonical-main, body.admin-bar.tla-ph-matching-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-preview-page .tla-ph-canonical-main, body.admin-bar.tla-ph-sector-landing-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-content-page #primary, body.admin-bar.tla-ph-network-home-page #primary, body.admin-bar.tla-ph-join-partner-page #primary, body.admin-bar.tla-ph-public-route-page .tla-ph-public-shell { padding-top: 18px !important; } } /* -------------------------------------------------------------------------- * 0.9.20 join-page polish: aligned demand search, restrained launch states, * clearer future-sector hierarchy and benefit-led listing comparison. * -------------------------------------------------------------------------- */ body.tla-ph-join-partner-page .tla-ph-join-primary-actions { align-items: center; gap: 10px; } body.tla-ph-join-partner-page .tla-ph-join-primary-actions .tla-ph-frontend-button { font-size: 13px !important; min-height: 44px !important; padding: 10px 17px !important; } body.tla-ph-join-partner-page .tla-ph-join-primary-actions .dashicons { font-size: 16px; height: 16px; width: 16px; } .tla-ph-join-onboarding-pill, .tla-ph-pricing-status.is-onboarding { align-items: center; background: rgba(5,150,105,.09) !important; border: 1px solid rgba(5,150,105,.22) !important; box-shadow: none !important; color: #047857 !important; display: inline-flex; font-size: 10px !important; gap: 7px; letter-spacing: .075em !important; padding: 7px 11px !important; text-transform: uppercase; -webkit-text-fill-color: #047857 !important; } .tla-ph-join-onboarding-pill::before, .tla-ph-pricing-status.is-onboarding::before { background: #059669; border-radius: 50%; box-shadow: 0 0 0 4px rgba(5,150,105,.1); content: ""; flex: 0 0 auto; height: 6px; width: 6px; } html[data-tla-theme="dark"] .tla-ph-join-onboarding-pill, html[data-tla-theme="dark"] .tla-ph-pricing-status.is-onboarding { background: rgba(52,211,153,.12) !important; border-color: rgba(110,231,183,.25) !important; color: #6ee7b7 !important; -webkit-text-fill-color: #6ee7b7 !important; } .tla-ph-join-onboarding-grid > a { border: 1.5px solid rgba(10,144,246,.3); box-shadow: 0 10px 28px rgba(10,144,246,.07); overflow: hidden; position: relative; } .tla-ph-join-onboarding-grid > a::before { background: linear-gradient(180deg,#0a90f6,#17b2e2); content: ""; inset: 0 auto 0 0; position: absolute; width: 4px; } .tla-ph-join-onboarding-grid span { align-items: center; background: rgba(5,150,105,.09); border: 1px solid rgba(5,150,105,.18); border-radius: 999px; color: #047857; display: inline-flex; font-size: 9px; justify-self: start; letter-spacing: .075em; padding: 5px 9px; } .tla-ph-pricing-sector-index a { min-height: 132px; position: relative; } .tla-ph-pricing-sector-index a.is-onboarding { background: linear-gradient(145deg,rgba(10,144,246,.055),rgba(23,178,226,.035)),var(--tla-ph-surface); border: 1.5px solid rgba(10,144,246,.36); box-shadow: 0 8px 24px rgba(10,144,246,.07); } .tla-ph-pricing-sector-index a.is-onboarding::before { background: linear-gradient(90deg,#0a90f6,#17b2e2); border-radius: 16px 16px 0 0; content: ""; height: 3px; inset: 0 0 auto; position: absolute; } .tla-ph-pricing-sector-index a.is-onboarding strong { color: #075fa9; } .tla-ph-pricing-sector-index a.is-coming-soon { background: color-mix(in srgb,var(--tla-ph-soft) 72%,var(--tla-ph-surface)); border-color: color-mix(in srgb,var(--tla-ph-border) 78%,transparent); box-shadow: none; filter: saturate(.42); opacity: .64; } .tla-ph-pricing-sector-index a.is-coming-soon:hover, .tla-ph-pricing-sector-index a.is-coming-soon:focus-visible { border-color: rgba(87,96,132,.26); box-shadow: 0 7px 20px rgba(21,18,70,.05); filter: saturate(.65); opacity: .82; transform: translateY(-1px); } .tla-ph-market-form { align-items: end !important; gap: 12px !important; grid-template-columns: minmax(220px,1.05fr) minmax(300px,1.25fr) minmax(160px,.65fr) minmax(180px,auto) !important; } .tla-ph-market-form label { align-content: end; gap: 7px !important; grid-template-rows: auto 48px; margin: 0 !important; min-width: 0; } .tla-ph-market-form input, .tla-ph-market-form select, .tla-ph-market-form button { height: 48px !important; min-height: 48px !important; margin: 0 !important; } .tla-ph-market-form input, .tla-ph-market-form select { font-size: 15px !important; padding: 0 14px !important; } .tla-ph-market-form button { font-size: 13px !important; padding: 10px 16px !important; white-space: nowrap; } .tla-ph-market-form-help { align-items: flex-start; color: var(--tla-ph-muted); display: flex; font-size: 11px; font-weight: 600; gap: 7px; line-height: 1.5; margin: 9px 18px 0; } .tla-ph-market-form-help .dashicons { color: var(--tla-ph-blue); flex: 0 0 auto; font-size: 15px; height: 15px; margin-top: 1px; width: 15px; } .tla-ph-upgrade-section .tla-ph-upgrade-benefit { align-items: center !important; display: grid !important; gap: 14px !important; grid-template-columns: 30px minmax(0,1fr) !important; min-height: 72px; padding: 14px 18px !important; } .tla-ph-upgrade-section .tla-ph-upgrade-benefit::before { align-items: center; align-self: center; background: rgba(5,150,105,.11) !important; border: 1px solid rgba(5,150,105,.2); border-radius: 50%; color: #047857 !important; content: "\2713" !important; display: flex !important; font-size: 14px !important; font-weight: 950; grid-column: 1; height: 28px !important; justify-content: center; left: auto !important; position: static !important; top: auto !important; transform: none !important; width: 28px !important; } .tla-ph-upgrade-section .tla-ph-upgrade-benefit > * { grid-column: 2; margin: 0 !important; padding: 0 !important; } .tla-ph-upgrade-section .tla-ph-upgrade-benefit-text { color: var(--tla-ph-heading) !important; font-size: 15px !important; font-weight: 680 !important; line-height: 1.5 !important; } .tla-ph-upgrade-section .tla-ph-upgrade-benefits-intro { color: #047857 !important; font-size: 12px !important; letter-spacing: .075em !important; } @media (max-width:1100px) { .tla-ph-market-form { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } .tla-ph-market-form button { width: 100%; } } @media (max-width:720px) { body.tla-ph-join-partner-page .tla-ph-join-primary-actions { align-items: stretch; } body.tla-ph-join-partner-page .tla-ph-join-primary-actions .tla-ph-frontend-button { width: 100%; } .tla-ph-market-form { grid-template-columns: 1fr !important; } .tla-ph-market-form-help { margin-inline: 0; } } /* Version 0.9.6 — premium Partner Profile information architecture. */ .tla-ph-profile-experience, .tla-ph-basic-public-listing { --tla-profile-accent:#158ff4; --tla-profile-violet:var(--tla-ph-pink); } .tla-ph-profile-hero-v2 { box-shadow:0 28px 75px rgba(29,35,92,.12); } .tla-ph-profile-hero-v2 .tla-ph-profile-cover { height:clamp(220px,26vw,340px); } .tla-ph-profile-cover-copy { bottom:28px; color:#fff; display:grid; gap:4px; left:clamp(24px,4vw,48px); position:absolute; z-index:2; } .tla-ph-profile-cover-copy span { font-size:12px; font-weight:850; letter-spacing:.14em; opacity:.8; text-transform:uppercase; } .tla-ph-profile-cover-copy strong { color:#fff; font-size:clamp(18px,2vw,26px); } .tla-ph-profile-hero-v2 .tla-ph-profile-brand-row { grid-template-columns:144px minmax(0,1fr) minmax(250px,320px); } .tla-ph-profile-hero-v2 .tla-ph-profile-identity h1 { max-width:900px; } .tla-ph-profile-tabs { border-radius:18px; flex-wrap:nowrap; gap:6px; overflow-x:auto; padding:8px; top:96px; } .tla-ph-profile-tabs a { border:1px solid transparent; font-size:14px; padding:11px 16px; transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease; white-space:nowrap; } .tla-ph-profile-tabs a.is-active, .tla-ph-profile-tabs a[aria-current="location"] { background:linear-gradient(135deg,rgba(10,144,246,.1),rgba(223,41,211,.08)); border-color:rgba(10,144,246,.2); box-shadow:0 5px 16px rgba(42,111,207,.08); color:var(--tla-ph-blue); } .tla-ph-profile-page-grid { align-items:start; } .tla-ph-profile-page-grid section[id], .tla-ph-profile-hero-v2, .tla-ph-profile-sidebar { scroll-margin-top:180px; } .tla-ph-profile-overview-section { background:linear-gradient(145deg,var(--tla-ph-surface),color-mix(in srgb,var(--tla-ph-pastel-blue) 45%,var(--tla-ph-surface))); } .tla-ph-capability-grid { display:grid; gap:11px; grid-template-columns:repeat(2,minmax(0,1fr)); } .tla-ph-capability-grid article { align-items:flex-start; background:color-mix(in srgb,var(--tla-ph-soft) 78%,transparent); border:1px solid var(--tla-ph-border); border-radius:16px; display:flex; gap:12px; min-height:100%; } .tla-ph-capability-grid article>.dashicons { background:linear-gradient(135deg,var(--tla-profile-violet),var(--tla-profile-accent)); border-radius:10px; color:#fff; flex:0 0 34px; font-size:19px; height:34px; padding:7px; width:34px; } .tla-ph-profile-specialisms { border-top:1px solid var(--tla-ph-border); margin-top:22px; padding-top:20px; } .tla-ph-profile-specialisms h3 { font-size:18px; margin:0 0 11px; } .tla-ph-profile-sidebar { top:164px; } .tla-ph-profile-sidebar>.tla-ph-profile-sidebar-card:first-child { background:linear-gradient(145deg,var(--tla-ph-surface),color-mix(in srgb,var(--tla-ph-pastel-violet) 42%,var(--tla-ph-surface))); box-shadow:0 18px 45px rgba(30,37,91,.1); } .tla-ph-profile-sidebar .tla-ph-frontend-button-primary { justify-content:center; width:100%; } .tla-ph-related-searches { align-items:flex-start; background:linear-gradient(135deg,color-mix(in srgb,var(--tla-ph-pastel-violet) 48%,var(--tla-ph-surface)),color-mix(in srgb,var(--tla-ph-pastel-blue) 52%,var(--tla-ph-surface))); border:1px solid var(--tla-ph-border); border-radius:24px; display:grid; gap:22px; grid-template-columns:minmax(230px,.38fr) minmax(0,1fr); margin-top:4px; padding:clamp(22px,3vw,34px); } .tla-ph-related-searches>div>span, .tla-ph-related-partners-head>div>span { color:var(--tla-ph-blue); display:block; font-size:12px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; } .tla-ph-related-searches h2, .tla-ph-related-partners h2 { font-size:clamp(25px,3vw,36px); letter-spacing:-.035em; margin:6px 0 0; } .tla-ph-related-searches nav { display:flex; flex-wrap:wrap; gap:9px; } .tla-ph-related-searches nav a { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:999px; color:var(--tla-ph-heading)!important; display:inline-flex; font-size:14px; font-weight:780; gap:8px; padding:11px 14px; text-decoration:none!important; } .tla-ph-related-searches nav a:hover { border-color:color-mix(in srgb,var(--tla-ph-blue) 42%,var(--tla-ph-border)); color:var(--tla-ph-blue)!important; transform:translateY(-1px); } .tla-ph-profile-claim-card { align-items:flex-start; background:linear-gradient(145deg,color-mix(in srgb,var(--tla-ph-pastel-violet) 65%,var(--tla-ph-surface)),color-mix(in srgb,var(--tla-ph-pastel-blue) 55%,var(--tla-ph-surface))); border:1px solid color-mix(in srgb,var(--tla-ph-violet) 23%,var(--tla-ph-border)); border-radius:20px; display:flex; gap:14px; padding:21px; } .tla-ph-profile-claim-card>.dashicons { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:12px; color:var(--tla-ph-violet); display:flex; flex:0 0 42px; font-size:21px; height:42px; justify-content:center; width:42px; } .tla-ph-profile-claim-card>div>span { color:var(--tla-ph-blue); font-size:11px; font-weight:850; letter-spacing:.1em; text-transform:uppercase; } .tla-ph-profile-claim-card h2 { font-size:24px; letter-spacing:-.025em; margin:5px 0 8px; } .tla-ph-profile-claim-card p { color:var(--tla-ph-muted); font-size:14px; line-height:1.6; margin:0 0 14px; } .tla-ph-profile-claim-card small { color:var(--tla-ph-muted); display:block; font-size:11px; line-height:1.5; margin-top:10px; } .tla-ph-profile-claim-card .tla-ph-frontend-button { font-size:13px; justify-content:center; width:100%; } .tla-ph-related-partners { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:26px; margin-top:20px; padding:clamp(24px,3.5vw,40px); } .tla-ph-related-partners-head { align-items:flex-end; display:flex; gap:24px; justify-content:space-between; margin-bottom:23px; } .tla-ph-related-partners-head p { color:var(--tla-ph-muted); font-size:15px; line-height:1.6; margin:8px 0 0; max-width:760px; } .tla-ph-related-partners-head>a { color:var(--tla-ph-blue); flex:0 0 auto; font-size:14px; font-weight:850; text-decoration:none; } .tla-ph-related-partner-grid { display:grid; gap:14px; grid-template-columns:repeat(2,minmax(0,1fr)); } .tla-ph-related-partner-grid .tla-ph-directory-card { min-width:0; } .tla-ph-basic-public-listing .tla-ph-basic-listing-hero { background:radial-gradient(circle at 90% 0,rgba(223,41,211,.1),transparent 35%),linear-gradient(145deg,var(--tla-ph-surface),color-mix(in srgb,var(--tla-ph-pastel-blue) 42%,var(--tla-ph-surface))); border-radius:28px; box-shadow:0 28px 70px rgba(30,37,91,.11); padding:clamp(24px,3vw,38px); } .tla-ph-basic-public-listing .tla-ph-basic-listing-identity h1 { font-size:clamp(38px,5vw,64px); } .tla-ph-basic-public-listing .tla-ph-profile-anchor-nav { margin-top:2px; } html[data-tla-theme="dark"] .tla-ph-profile-overview-section, html[data-tla-theme="dark"] .tla-ph-related-searches, html[data-tla-theme="dark"] .tla-ph-profile-claim-card, html[data-tla-theme="dark"] .tla-ph-basic-public-listing .tla-ph-basic-listing-hero, html[data-tla-theme="dark"] .tla-ph-profile-sidebar>.tla-ph-profile-sidebar-card:first-child { background:linear-gradient(145deg,#0d1430,#17123b); } html[data-tla-theme="dark"] .tla-ph-related-searches nav a { background:#111a38; } @media(max-width:1120px){ .tla-ph-profile-hero-v2 .tla-ph-profile-brand-row { grid-template-columns:120px minmax(0,1fr); } .tla-ph-profile-hero-v2 .tla-ph-profile-logo { height:120px; width:120px; } .tla-ph-profile-hero-v2 .tla-ph-trust-panel { grid-column:1/-1; } } @media(max-width:900px){ .tla-ph-profile-tabs { position:sticky; top:0; } .tla-ph-profile-sidebar { position:static; } .tla-ph-related-searches { grid-template-columns:1fr; } } @media(max-width:700px){ .tla-ph-profile-tabs a { font-size:13px; padding:10px 13px; } .tla-ph-capability-grid, .tla-ph-related-partner-grid { grid-template-columns:1fr; } .tla-ph-related-partners-head { align-items:flex-start; flex-direction:column; } .tla-ph-profile-cover-copy { bottom:18px; left:20px; } } /* -------------------------------------------------------------------------- * 0.9.7 compact Hub chrome, consistent header clearance and Inter typography * -------------------------------------------------------------------------- */ .tla-ph-canonical-main, .tla-ph-canonical-main :where(button,input,select,textarea), .tla-ph-partner-app, .tla-ph-partner-app :where(button,input,select,textarea), .tla-ph-public-shell, .tla-ph-public-shell :where(button,input,select,textarea), body.tla-ph-join-partner-page #primary, body.tla-ph-join-partner-page #primary :where(button,input,select,textarea) { font-family:var(--tla-ph-font)!important; } .tla-ph-canonical-main .dashicons, .tla-ph-partner-app .dashicons, .tla-ph-public-shell .dashicons, body.tla-ph-join-partner-page #primary .dashicons { font-family: dashicons !important; } body.tla-ph-join-partner-page #primary{border-top:0!important;margin-top:0!important} body.tla-ph-join-partner-page #primary>.elementor{border-top:0!important;margin-top:0!important} body.tla-ph-join-partner-page #primary>.elementor>.e-con:first-child, body.tla-ph-join-partner-page #primary>.elementor>.elementor-element:first-child{margin-top:0!important;padding-top:clamp(32px,4vw,54px)!important} body.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.tla-ph-services-page .tla-ph-canonical-main, body.tla-ph-matching-page .tla-ph-canonical-main, body.tla-ph-partner-preview-page .tla-ph-canonical-main, body.tla-ph-sector-landing-page .tla-ph-canonical-main, body.tla-ph-partner-content-page #primary, body.tla-ph-network-home-page #primary, body.tla-ph-join-partner-page #primary, body.tla-ph-public-route-page .tla-ph-public-shell, body.admin-bar.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.admin-bar.tla-ph-services-page .tla-ph-canonical-main, body.admin-bar.tla-ph-matching-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-preview-page .tla-ph-canonical-main, body.admin-bar.tla-ph-sector-landing-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-content-page #primary, body.admin-bar.tla-ph-network-home-page #primary, body.admin-bar.tla-ph-join-partner-page #primary, body.admin-bar.tla-ph-public-route-page .tla-ph-public-shell { padding-top: clamp(28px,2.35vw,38px) !important; } body.tla-ph-sector-workspace-page .tla-ph-partner-app { padding-top: clamp(16px,1.7vw,24px); } .tla-ph-network-portal { gap: clamp(14px,2vw,28px); grid-template-columns: minmax(158px,190px) minmax(0,1fr); margin-bottom: clamp(24px,3vw,40px); min-height: 78px; padding: 10px 14px; } .tla-ph-network-portal-head { justify-content:center; } .tla-ph-network-portal .tla-ph-network-nav-brand { align-items:center; display:flex; flex:1 1 auto; justify-content:center; max-width:180px; overflow:visible; padding:0; width:100%; } .tla-ph-network-portal .tla-ph-trusted-partner-brand.is-navigation { display:flex; max-height:66px; max-width:180px; width:100%; } .tla-ph-network-portal .tla-ph-trusted-logo { height:auto; max-height:66px; max-width:180px; object-fit:contain; object-position:center; width:100%; } .tla-ph-network-portal .tla-ph-network-nav-links a, .tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links a { border-radius:10px; font-size:clamp(11px,.74vw,12px); min-height:38px; padding:7px 6px; } .tla-ph-dashboard-hero h1 { font-size:clamp(30px,3vw,44px); line-height:1.04; } .tla-ph-dashboard-card .tla-ph-frontend-button, .tla-ph-match-empty-buttons .tla-ph-frontend-button, .tla-ph-directory-empty .tla-ph-frontend-button { font-size:13px; justify-content:center; min-height:42px; padding:10px 16px; width:auto; } .tla-ph-match-empty-buttons { align-items:center; display:flex; flex-wrap:wrap; gap:10px; } .tla-ph-match-empty-buttons .tla-ph-frontend-button { min-width:0; } @media (min-width:1100px) { .tla-ph-dashboard-hero h1 { white-space: normal; } } @media (max-width:820px) { body.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.tla-ph-services-page .tla-ph-canonical-main, body.tla-ph-matching-page .tla-ph-canonical-main, body.tla-ph-partner-preview-page .tla-ph-canonical-main, body.tla-ph-sector-landing-page .tla-ph-canonical-main, body.tla-ph-partner-content-page #primary, body.tla-ph-network-home-page #primary, body.tla-ph-join-partner-page #primary, body.tla-ph-public-route-page .tla-ph-public-shell, body.admin-bar.tla-ph-sector-workspace-page .tla-ph-canonical-main, body.admin-bar.tla-ph-services-page .tla-ph-canonical-main, body.admin-bar.tla-ph-matching-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-preview-page .tla-ph-canonical-main, body.admin-bar.tla-ph-sector-landing-page .tla-ph-canonical-main, body.admin-bar.tla-ph-partner-content-page #primary, body.admin-bar.tla-ph-network-home-page #primary, body.admin-bar.tla-ph-join-partner-page #primary, body.admin-bar.tla-ph-public-route-page .tla-ph-public-shell { padding-top:24px !important; } .tla-ph-network-portal { grid-template-columns:1fr; } .tla-ph-network-portal .tla-ph-network-nav-brand { max-width:190px; } .tla-ph-network-portal .tla-ph-trusted-partner-brand.is-navigation, .tla-ph-network-portal .tla-ph-trusted-logo { max-height:64px; max-width:190px; } } @media (max-width:560px) { .tla-ph-network-portal { border-radius:18px; margin-bottom:22px; padding:10px; } .tla-ph-network-portal .tla-ph-network-nav-links, .tla-ph-network-home .tla-ph-network-portal .tla-ph-network-nav-links { grid-template-columns:repeat(2,minmax(0,1fr)); } .tla-ph-network-portal .tla-ph-network-nav-links a:last-child { grid-column:1/-1; } } .tla-ph-public-profile-controls{background:linear-gradient(135deg,var(--tla-ph-pastel-violet),var(--tla-ph-pastel-blue));border:1px solid var(--tla-ph-border);border-radius:20px;display:grid;gap:18px;margin-top:24px;padding:clamp(20px,3vw,30px)} .tla-ph-visibility-choice-grid{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))} .tla-ph-visibility-choice-grid>label{align-items:flex-start;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:15px;display:flex;gap:11px;padding:15px} .tla-ph-visibility-choice-grid input,.tla-ph-public-section-switches input{flex:0 0 auto;height:18px;margin:2px 0 0;width:18px} .tla-ph-visibility-choice-grid strong,.tla-ph-visibility-choice-grid small{display:block}.tla-ph-visibility-choice-grid strong{font-size:14px}.tla-ph-visibility-choice-grid small{color:var(--tla-ph-muted);font-size:0.7rem;line-height:1.5;margin-top:4px} .tla-ph-public-section-switches{border:0;margin:0;padding:0}.tla-ph-public-section-switches legend{color:var(--tla-ph-heading);font-size:15px;font-weight:850}.tla-ph-public-section-switches>p{color:var(--tla-ph-muted);font-size:11px;line-height:1.5;margin:5px 0 12px}.tla-ph-public-section-switches>div{display:flex;flex-wrap:wrap;gap:8px}.tla-ph-public-section-switches label{align-items:center;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:999px;display:inline-flex;font-size:11px;font-weight:750;gap:8px;padding:9px 12px} @media(max-width:640px){.tla-ph-visibility-choice-grid{grid-template-columns:1fr}} /* Partner-selected microsite modules remain saved but are omitted from display. */ .tla-ph-profile-experience.is-section-services-hidden #services, .tla-ph-profile-experience.is-section-services-hidden .tla-ph-profile-tabs a[href="#services"], .tla-ph-profile-experience.is-section-credentials-hidden #credentials, .tla-ph-profile-experience.is-section-credentials-hidden .tla-ph-profile-tabs a[href="#credentials"], .tla-ph-profile-experience.is-section-people-hidden #team, .tla-ph-profile-experience.is-section-people-hidden #departments, .tla-ph-profile-experience.is-section-people-hidden .tla-ph-profile-tabs a[href="#team"], .tla-ph-profile-experience.is-section-locations-hidden #locations, .tla-ph-profile-experience.is-section-locations-hidden .tla-ph-profile-tabs a[href="#locations"], .tla-ph-profile-experience.is-section-properties-hidden #properties, .tla-ph-profile-experience.is-section-properties-hidden .tla-ph-profile-tabs a[href="#properties"], .tla-ph-profile-experience.is-section-opening_hours-hidden .tla-ph-opening-hours-card, .tla-ph-profile-experience.is-section-opening_hours-hidden .tla-ph-basic-opening-hours {display:none!important} /* -------------------------------------------------------------------------- * 0.9.9 scoped design-system safeguards * -------------------------------------------------------------------------- */ .tla-ph-canonical-main, .tla-ph-public-shell, .tla-ph-partner-app, .tla-ph-component, .tla-ph-shell, body.tla-ph-join-partner-page #primary { font-family: var(--tla-ph-font) !important; } .tla-ph-canonical-main :where(button,input,select,textarea), .tla-ph-public-shell :where(button,input,select,textarea), .tla-ph-partner-app :where(button,input,select,textarea), .tla-ph-component :where(button,input,select,textarea), .tla-ph-shell :where(button,input,select,textarea), body.tla-ph-join-partner-page #primary :where(button,input,select,textarea) { font-family: inherit; } .tla-ph-canonical-main .dashicons, .tla-ph-public-shell .dashicons, .tla-ph-partner-app .dashicons, .tla-ph-component .dashicons, .tla-ph-shell .dashicons, body.tla-ph-join-partner-page #primary .dashicons { font-family: dashicons !important; } .tla-ph-dashboard-hero h1, .tla-ph-workspace-hero h1, .tla-ph-partner-panel h1 { font-size: clamp(1.8rem,3vw,2.75rem); line-height: 1.08; } .tla-ph-public-profile img, .tla-ph-premium-profile img, .tla-ph-directory img, .tla-ph-partner-card img { display: block; height: auto; max-width: 100%; } .tla-ph-profile-gallery img, .tla-ph-property-gallery img { aspect-ratio: 4 / 3; border-radius: var(--tla-ph-radius-sm); object-fit: cover; width: 100%; } .tla-ph-profile-cover img, .tla-ph-property-cover img { aspect-ratio: 16 / 6; object-fit: cover; width: 100%; } .tla-ph-partner-logo img, .tla-ph-profile-logo img { aspect-ratio: 1 / 1; object-fit: contain; } .tla-ph-canonical-main :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible, .tla-ph-public-shell :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible, .tla-ph-partner-app :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline: 2px solid var(--tla-ph-blue); outline-offset: 2px; } @media(max-width:900px) { .tla-ph-canonical-main :where(button,input[type="submit"],a.tla-ph-frontend-button), .tla-ph-public-shell :where(button,input[type="submit"],a.tla-ph-frontend-button), .tla-ph-partner-app :where(button,input[type="submit"],a.tla-ph-frontend-button) { min-height: 44px; } } @media(prefers-reduced-motion:reduce) { .tla-ph-canonical-main *, .tla-ph-public-shell *, .tla-ph-partner-app * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } } /* ========================================================================== * 0.9.11 UI CONSISTENCY PATCH * 1) Workspace hero at application scale, not marketing scale. * 2) Uniform spacing around the public Hub navigation across all pages. * 3) Button contrast hardening for dark theme and Elementor override cases. * 4) BETA badge component with hover tooltip. * ========================================================================== */ /* ---- 1) Workspace/dashboard hero. Was 30-52px. Application scale is 20-32px. Homepage marketing headings stay untouched. ---- */ .tla-ph-dashboard-hero h1, .tla-ph-workspace-hero h1, .tla-ph-onboarding-head h1, .tla-ph-verification-head h1 { font-size: clamp(1.4rem, 2.2vw, 2rem); letter-spacing: -0.025em; line-height: 1.12; margin: 0.5rem 0 0.65rem; } .tla-ph-dashboard-hero p, .tla-ph-workspace-hero p, .tla-ph-onboarding-head p, .tla-ph-verification-head p { font-size: 0.95rem; line-height: 1.6; max-width: 640px; } /* Public marketing surfaces (claim/network/sector/directory) keep the larger scale intended for landing pages. Explicit override to make that clear. */ .tla-ph-frontend-hero h1, .tla-ph-directory-hero h1, .tla-ph-sector-hero h1, .tla-ph-network-hero h1, .tla-ph-claim-hero h1 { font-size: clamp(1.8rem, 3.2vw, 2.8rem); letter-spacing: -0.03em; line-height: 1.1; } /* ---- 2) Public Hub menu spacing. Every page that renders PublicNetworkNavigation() should surround it with the same rhythm. ---- */ .tla-ph-public-shell > .tla-ph-shell-inner > .tla-ph-public-menu, .tla-ph-public-shell .tla-ph-shell-inner > .tla-ph-public-menu, .tla-ph-shell.tla-ph-public-shell .tla-ph-public-menu:first-child { margin-top: clamp(1rem, 2vw, 1.5rem); margin-bottom: clamp(1.5rem, 3vw, 2.25rem); } /* Sector, directory, matching and claim pages all use the same shell. Neutralise any per-page margin that has drifted. */ .tla-ph-claim-page .tla-ph-public-menu, .tla-ph-sector-workspace-page .tla-ph-public-menu, .tla-ph-directory-page .tla-ph-public-menu, .tla-ph-matching-page .tla-ph-public-menu, .tla-ph-network-home .tla-ph-public-menu { margin-top: clamp(1rem, 2vw, 1.5rem); margin-bottom: clamp(1.5rem, 3vw, 2.25rem); } /* ---- 3) Button contrast hardening. Some themes ship .entry-content a { color: X !important } that beats a plain colour rule. Raise the selector weight and lock text-fill-color so gradient buttons never render dark on dark. ---- */ :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-primary, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-primary:visited, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-primary:hover, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-primary:focus, :where(.tla-ph-shell, .tla-ph-public-shell) button.tla-ph-frontend-button-primary, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-public-menu__business, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-public-menu__business:visited, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-public-menu__business:hover, :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-public-menu__business:focus { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; text-shadow: none; } /* Secondary buttons must never be dark text on dark surface. */ html[data-tla-theme="dark"] :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-secondary, html[data-tla-theme="dark"] :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-secondary:visited { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.2); color: var(--tla-ph-heading); -webkit-text-fill-color: var(--tla-ph-heading); } html[data-tla-theme="dark"] :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-secondary:hover, html[data-tla-theme="dark"] :where(.tla-ph-shell, .tla-ph-public-shell) .tla-ph-frontend-button-secondary:focus-visible { background: rgba(255, 255, 255, 0.09); border-color: rgba(10, 144, 246, 0.45); color: #ffffff; -webkit-text-fill-color: #ffffff; } /* Anything named "cta" or "pri" that sits on a gradient must have white text. */ .tla-ph-frontend-button-primary .dashicons { color: #ffffff !important; } /* ---- 4) BETA badge component. Subtle pill, brand-tinted, hover-reveals a tooltip explaining the phase. Renders inline next to any heading that carries the .tla-ph-beta-flag class. ---- */ .tla-ph-beta-flag { position: relative; display: inline-flex; align-items: center; gap: 5px; margin-left: 0.5rem; padding: 3px 8px; border-radius: 100px; background: linear-gradient(135deg, rgba(223, 41, 211, 0.10), rgba(10, 144, 246, 0.12)); border: 1px solid rgba(10, 144, 246, 0.22); color: var(--tla-ph-blue); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.09em; line-height: 1; text-transform: uppercase; vertical-align: middle; cursor: help; } .tla-ph-beta-flag::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: linear-gradient(135deg, #DF29D3, #0A90F6); } /* ========================================================================== * 0.9.13 corrective UI release * - one public-page rhythm around the Partner Services navigation * - deterministic pricing-heading scale * - resilient claim-card and related-search layout * - functional partner-facing website toolkit * ========================================================================== */ /* Public profiles previously accumulated padding from the outer component, inner profile canvas and navigation margins. Keep the same clearance used by the canonical Services page and remove only the duplicated inner offset. */ body .tla-ph-public-profile.tla-ph-component { padding-top: clamp(28px, 2.35vw, 38px) !important; } body .tla-ph-public-profile > .tla-ph-shell-inner > .tla-ph-basic-public-listing, body .tla-ph-public-profile > .tla-ph-shell-inner > .tla-ph-premium-profile { margin-top: 0 !important; padding-top: 0 !important; } .tla-ph-public-profile .tla-ph-public-menu, .tla-ph-basic-public-listing > .tla-ph-public-menu, .tla-ph-premium-profile > .tla-ph-public-menu, .tla-ph-canonical-main .tla-ph-public-menu, .tla-ph-join-hub .tla-ph-public-menu { margin-top: 0 !important; margin-bottom: clamp(1.5rem, 3vw, 2.25rem) !important; } body .tla-ph-component .tla-ph-frontend-button-primary, body .tla-ph-component .tla-ph-frontend-button-primary:link, body .tla-ph-component .tla-ph-frontend-button-primary:visited, body .tla-ph-component .tla-ph-frontend-button-primary:hover, body .tla-ph-component .tla-ph-frontend-button-primary:focus, body .tla-ph-component .tla-ph-frontend-button-primary:active, body .tla-ph-public-shell .tla-ph-frontend-button-primary, body .tla-ph-public-shell .tla-ph-frontend-button-primary:visited { background-clip: border-box !important; -webkit-background-clip: border-box !important; color: #fff !important; -webkit-text-fill-color: #fff !important; text-shadow: none !important; } /* Apply the size to the exact summary descendants and reset any inherited theme shorthand. Long sector names wrap without changing scale. */ body.tla-ph-join-partner-page .tla-ph-public-pricing details.tla-ph-pricing-sector-accordion > summary .tla-ph-pricing-accordion-summary h3, body.tla-ph-join-partner-page .tla-ph-public-pricing .tla-ph-pricing-accordion-summary > div > h3, .tla-ph-public-pricing details.tla-ph-pricing-sector-accordion > summary .tla-ph-pricing-accordion-summary h3 { font-family: var(--tla-ph-font) !important; font-size: clamp(1.25rem, 1.6vw, 1.5rem) !important; font-style: normal !important; font-weight: 800 !important; letter-spacing: -0.035em !important; line-height: 1.25 !important; margin: 4px 0 7px !important; max-width: 820px; text-wrap: balance; } /* The ownership panel is a real two-column component. The content column and its full-width button must never compete for intrinsic width. */ .tla-ph-basic-public-listing .tla-ph-profile-claim-card { align-items: start !important; display: grid !important; gap: 14px !important; grid-template-columns: 42px minmax(0, 1fr) !important; margin-top: 18px; width: 100%; } .tla-ph-basic-public-listing .tla-ph-profile-claim-card > div { display: grid; gap: 10px; min-width: 0; width: 100%; } .tla-ph-basic-public-listing .tla-ph-profile-claim-card h2, .tla-ph-basic-public-listing .tla-ph-profile-claim-card p, .tla-ph-basic-public-listing .tla-ph-profile-claim-card small { margin: 0 !important; min-width: 0; overflow-wrap: anywhere; } .tla-ph-basic-public-listing .tla-ph-profile-claim-card .tla-ph-frontend-button { box-sizing: border-box; display: flex !important; font-size: 0.78rem; line-height: 1.3; min-width: 0; padding-inline: 14px; text-align: center; white-space: normal; width: 100% !important; } .tla-ph-basic-public-listing .tla-ph-profile-claim-card small { display: block !important; font-size: 0.75rem; line-height: 1.55; width: 100%; } /* Prevent a theme's generic entry-content anchor rules from flattening the related-search pills into an unreadable continuous line. */ .tla-ph-basic-public-listing .tla-ph-related-searches nav, .tla-ph-premium-profile .tla-ph-related-searches nav { display: flex !important; flex-wrap: wrap !important; gap: 9px !important; } .tla-ph-basic-public-listing .tla-ph-related-searches nav > a, .tla-ph-premium-profile .tla-ph-related-searches nav > a { align-items: center !important; background: var(--tla-ph-surface) !important; border: 1px solid var(--tla-ph-border) !important; border-radius: 999px !important; color: var(--tla-ph-heading) !important; display: inline-flex !important; gap: 8px !important; line-height: 1.35 !important; margin: 0 !important; padding: 11px 14px !important; text-decoration: none !important; width: auto !important; } /* Partner website toolkit. */ .tla-ph-toolkit > .tla-ph-shell-inner { max-width: 1180px; } .tla-ph-toolkit-hero, .tla-ph-toolkit-state { background: linear-gradient(135deg, var(--tla-ph-surface), var(--tla-ph-soft)); border: 1px solid var(--tla-ph-border); border-radius: 24px; box-shadow: var(--tla-ph-shadow); padding: clamp(24px, 4vw, 42px); } .tla-ph-toolkit-hero { align-items: center; display: flex; gap: 28px; justify-content: space-between; } .tla-ph-toolkit-hero h1, .tla-ph-toolkit-state h1 { font-size: clamp(1.8rem, 3vw, 2.6rem); margin: 12px 0 10px; } .tla-ph-toolkit-hero p, .tla-ph-toolkit-state p { color: var(--tla-ph-muted); line-height: 1.65; margin: 0; max-width: 760px; } .tla-ph-toolkit-state .tla-ph-frontend-button { margin-top: 22px; } .tla-ph-toolkit-status { align-items: center; background: rgba(5,150,105,.1); border: 1px solid rgba(5,150,105,.2); border-radius: 999px; color: #047857; display: inline-flex; flex: 0 0 auto; font-size: .78rem; font-weight: 800; gap: 7px; padding: 10px 14px; } .tla-ph-toolkit-grid { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0,1fr)); margin-top: 22px; } .tla-ph-toolkit-asset { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: var(--tla-ph-shadow); overflow: hidden; } .tla-ph-toolkit-preview { align-items: center; display: flex; justify-content: center; min-height: 245px; padding: 32px; } .tla-ph-toolkit-preview.is-light { background: #f5f7fb; } .tla-ph-toolkit-preview.is-dark { background: #071127; } .tla-ph-toolkit-preview img { display: block; height: auto; max-height: 185px; max-width: 100%; object-fit: contain; width: auto; } .tla-ph-toolkit-asset-body { display: grid; gap: 12px; padding: 24px; } .tla-ph-toolkit-asset-body h2 { font-size: 1.3rem; margin: 0; } .tla-ph-toolkit-asset-body p { color: var(--tla-ph-muted); font-size: .88rem; line-height: 1.6; margin: 0; } .tla-ph-toolkit-code { display: grid; gap: 7px; margin-top: 4px; } .tla-ph-toolkit-code > span { color: var(--tla-ph-heading); font-size: .76rem; font-weight: 800; } .tla-ph-toolkit-code textarea { background: var(--tla-ph-bg); border: 1px solid var(--tla-ph-border); border-radius: 12px; color: var(--tla-ph-text); font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: 12px; resize: vertical; width: 100%; } .tla-ph-toolkit-guidance { background: linear-gradient(135deg, var(--tla-ph-pastel-blue), var(--tla-ph-pastel-violet)); border: 1px solid var(--tla-ph-border); border-radius: 22px; display: grid; gap: 24px; grid-template-columns: 1.15fr .85fr; margin-top: 22px; padding: clamp(22px, 3vw, 32px); } .tla-ph-toolkit-guidance > div:first-child { align-items: flex-start; display: flex; gap: 14px; } .tla-ph-toolkit-guidance .dashicons { color: var(--tla-ph-blue); flex: 0 0 28px; font-size: 28px; height: 28px; width: 28px; } .tla-ph-toolkit-guidance h2 { font-size: 1.25rem; margin: 0 0 7px; } .tla-ph-toolkit-guidance p { color: var(--tla-ph-muted); font-size: .85rem; line-height: 1.6; margin: 0; } .tla-ph-toolkit-guidance > div:last-child { background: color-mix(in srgb, var(--tla-ph-surface) 76%, transparent); border: 1px solid var(--tla-ph-border); border-radius: 15px; padding: 17px; } .tla-ph-toolkit-guidance strong { display: block; margin-bottom: 6px; } @media (max-width: 820px) { .tla-ph-toolkit-grid, .tla-ph-toolkit-guidance { grid-template-columns: 1fr; } .tla-ph-toolkit-hero { align-items: flex-start; flex-direction: column; } } @media (max-width: 560px) { .tla-ph-basic-public-listing .tla-ph-profile-claim-card { grid-template-columns: 1fr !important; } .tla-ph-toolkit-preview { min-height: 190px; padding: 22px; } } html[data-tla-theme="dark"] .tla-ph-beta-flag { color: #7dd3fc; border-color: rgba(125, 211, 252, 0.28); } /* ========================================================================== * 0.9.14 focused profile corrections * ========================================================================== */ /* The live business-profile route sits beneath a taller fixed site header than the other public routes. Keep this extra clearance scoped to that route's outer component so Services, join, directory and workspace pages do not move. */ body .tla-ph-public-profile.tla-ph-component { padding-top: clamp(60px, 5vw, 78px) !important; } /* Optional public sections are completion-aware. Incomplete sections are visibly unavailable and never reach the public renderer. */ .tla-ph-public-section-switches label { align-items: flex-start; border-radius: 14px; min-width: min(100%, 240px); } .tla-ph-public-section-switches label > span { display: grid; gap: 2px; } .tla-ph-public-section-switches label small { color: var(--tla-ph-muted); display: block; font-size: 10px; font-weight: 600; line-height: 1.35; } .tla-ph-public-section-switches label.is-waiting { background: color-mix(in srgb, var(--tla-ph-surface) 76%, var(--tla-ph-canvas)); opacity: .72; } .tla-ph-public-section-switches label.is-waiting input[type="checkbox"] { cursor: not-allowed; } @media (max-width: 760px) { body .tla-ph-public-profile.tla-ph-component { padding-top: 36px !important; } .tla-ph-public-section-switches label { width: 100%; } } /* Tooltip. Hidden by default, revealed on hover/focus of the badge. */ .tla-ph-beta-flag-tip { position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; width: max-content; max-width: 260px; padding: 0.6rem 0.75rem; border-radius: 10px; background: var(--tla-ph-heading); color: #ffffff; font-size: 0.72rem; font-weight: 500; letter-spacing: 0; text-transform: none; line-height: 1.45; opacity: 0; pointer-events: none; transform: translateY(-4px); transition: opacity 0.15s ease, transform 0.15s ease; box-shadow: 0 8px 24px rgba(10, 0, 50, 0.18); } .tla-ph-beta-flag-tip::before { content: ''; position: absolute; top: -4px; left: 12px; width: 8px; height: 8px; background: inherit; transform: rotate(45deg); } .tla-ph-beta-flag:hover .tla-ph-beta-flag-tip, .tla-ph-beta-flag:focus-visible .tla-ph-beta-flag-tip, .tla-ph-beta-flag:focus-within .tla-ph-beta-flag-tip { opacity: 1; pointer-events: auto; transform: translateY(0); } /* ========================================================================== * 0.9.15 homepage and Agent Network design-source alignment * ========================================================================== */ /* One keyboard treatment across public pages and authenticated workspaces. */ :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) :where(a, button, summary, [tabindex]):focus-visible { outline: 3px solid rgba(23, 178, 226, .36) !important; outline-offset: 3px !important; } /* Filled actions always carry solid white text, including site-builder text-fill and visited-link overrides. */ body :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) :where(.tla-ph-frontend-button-primary, .tla-ph-network-action-primary), body :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) :where(.tla-ph-frontend-button-primary, .tla-ph-network-action-primary):visited, body :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) :where(.tla-ph-frontend-button-primary, .tla-ph-network-action-primary):hover, body :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) :where(.tla-ph-frontend-button-primary, .tla-ph-network-action-primary):focus-visible { background: var(--tla-ph-grad-action) !important; background-clip: border-box !important; -webkit-background-clip: border-box !important; color: #fff !important; -webkit-text-fill-color: #fff !important; text-shadow: none !important; } .tla-ph-frontend-button, .tla-ph-network-action-primary, .tla-ph-network-action-secondary { transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease !important; } .tla-ph-frontend-button-primary:hover, .tla-ph-network-action-primary:hover { box-shadow: 0 12px 32px rgba(110, 34, 255, .32) !important; filter: none !important; transform: translateY(-2px); } .tla-ph-frontend-button-secondary:hover, .tla-ph-frontend-button-secondary:focus-visible, .tla-ph-network-action-secondary:hover, .tla-ph-network-action-secondary:focus-visible { background: var(--tla-ph-soft) !important; border-color: rgba(10, 144, 246, .42) !important; color: var(--tla-ph-blue) !important; -webkit-text-fill-color: var(--tla-ph-blue) !important; transform: translateY(-2px); } html[data-tla-theme="dark"] .tla-ph-frontend-button-secondary:hover, html[data-tla-theme="dark"] .tla-ph-frontend-button-secondary:focus-visible, html[data-tla-theme="dark"] .tla-ph-network-action-secondary:hover, html[data-tla-theme="dark"] .tla-ph-network-action-secondary:focus-visible { background: rgba(10, 144, 246, .12) !important; border-color: rgba(125, 211, 252, .42) !important; color: #7dd3fc !important; -webkit-text-fill-color: #7dd3fc !important; } /* Active workspace tabs remain filled; ordinary hover is the calmer secondary interaction used by the homepage and Agent Network. */ .tla-ph-workspace-tabs a:hover:not(.is-active), .tla-ph-help-nav a:hover:not(.is-active) { background: var(--tla-ph-soft) !important; border-color: rgba(10, 144, 246, .3) !important; color: var(--tla-ph-blue) !important; -webkit-text-fill-color: var(--tla-ph-blue) !important; } /* Consistent interactive-card lift. Static content inside each card retains its semantic foreground colours in both themes. */ :where( .tla-ph-frontend-card, .tla-ph-dashboard-card, .tla-ph-directory-card, .tla-ph-sector-card, .tla-ph-toolkit-asset, .tla-ph-help-card, .tla-ph-public-price-card, .tla-ph-property-manager-card ) { transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; } :where( .tla-ph-frontend-card, .tla-ph-dashboard-card, .tla-ph-directory-card, .tla-ph-sector-card, .tla-ph-toolkit-asset, .tla-ph-help-card, .tla-ph-public-price-card, .tla-ph-property-manager-card ):hover { border-color: rgba(10, 144, 246, .25) !important; box-shadow: var(--tla-ph-shadow) !important; transform: translateY(-3px); } .tla-ph-contact-line, .tla-ph-section-heading > a, .tla-ph-profile-anchor-nav a { transition: background .2s ease, border-color .2s ease, color .2s ease; } .tla-ph-contact-line:hover, .tla-ph-contact-line:focus-visible, .tla-ph-section-heading > a:hover, .tla-ph-section-heading > a:focus-visible { color: var(--tla-ph-blue) !important; } @media (prefers-reduced-motion: reduce) { :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) *, :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) *::before, :where(.tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-public-shell) *::after { animation: none !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } :where( .tla-ph-frontend-card, .tla-ph-dashboard-card, .tla-ph-directory-card, .tla-ph-sector-card, .tla-ph-toolkit-asset, .tla-ph-help-card, .tla-ph-public-price-card, .tla-ph-property-manager-card ):hover, .tla-ph-frontend-button:hover { transform: none !important; } } /* * Global-header clearance contract. * Partner Hub measures the active fixed TLA header and reserves exactly that * height. The WordPress toolbar keeps its own native html offset, so it must * never be added to this value a second time. */ body.tla-ph-header-safe-page.tla-ph-has-fixed-header { padding-top: var(--tla-ph-global-header-height, 66px) !important; } body.tla-ph-header-safe-page .tla-ph-component, body.tla-ph-header-safe-page .tla-ph-shell, body.tla-ph-header-safe-page .tla-ph-network-home, body.tla-ph-header-safe-page .tla-mcc { scroll-margin-top: calc(var(--tla-ph-global-header-height, 66px) + 18px); } /* * Theme-correct surface for the otherwise transparent global header on * Partner Hub routes. These selectors intentionally outrank the header * snippet's inline, important transparency declaration without changing the * header on unrelated TLA pages. */ html[data-tla-theme="light"] body.tla-ph-header-safe-page :is(#tla-uh, #tla-hg, #tla-ha, #tla-hl, #tla-ht, #tla-hadm) { background: rgba(255, 255, 255, .96) !important; border-bottom-color: rgba(10, 0, 50, .09) !important; color-scheme: light !important; } html[data-tla-theme="dark"] body.tla-ph-header-safe-page :is(#tla-uh, #tla-hg, #tla-ha, #tla-hl, #tla-ht, #tla-hadm) { background: rgba(1, 2, 30, .96) !important; border-bottom-color: rgba(255, 255, 255, .09) !important; color-scheme: dark !important; } /* Replace the join template's generic shield lockup with the real production Trusted Partner brand. One image occupies the slot and its source is changed by JavaScript when the TLA theme changes. */ body.tla-ph-join-partner-page .tla-ph-join-brand-lockup { align-items: center !important; display: inline-flex !important; min-width: 0 !important; } body.tla-ph-join-partner-page .tla-ph-join-generic-brand-icon { display: none !important; } body.tla-ph-join-partner-page .tla-ph-join-brand-label { align-items: center !important; display: flex !important; line-height: 0 !important; margin: 0 !important; min-width: 0 !important; } body.tla-ph-join-partner-page .tla-ph-join-trusted-brand-logo { display: block !important; height: auto !important; margin: 0 !important; max-height: 64px !important; max-width: 240px !important; object-fit: contain !important; object-position: left center !important; width: min(240px, 32vw) !important; } body.tla-ph-join-partner-page #market-opportunity { scroll-margin-top: calc(var(--tla-ph-global-header-height, 66px) + 96px) !important; } body.tla-ph-join-partner-page .tla-ph-join-demand-nav-link { align-items: center !important; color: #0877ca !important; display: inline-flex !important; gap: 7px !important; -webkit-text-fill-color: #0877ca !important; } body.tla-ph-join-partner-page .tla-ph-join-demand-nav-link::before { background: #0a90f6; border-radius: 50%; box-shadow: 0 0 0 4px rgba(10,144,246,.1); content: ""; flex: 0 0 6px; height: 6px; width: 6px; } html[data-tla-theme="dark"] body.tla-ph-join-partner-page .tla-ph-join-demand-nav-link { color: #6bdcff !important; -webkit-text-fill-color: #6bdcff !important; } @media (max-width: 900px) { body.tla-ph-join-partner-page .tla-ph-join-trusted-brand-logo { max-height: 58px !important; max-width: 215px !important; width: min(215px, calc(100vw - 96px)) !important; } } @media (max-width: 480px) { body.tla-ph-join-partner-page .tla-ph-join-trusted-brand-logo { max-height: 50px !important; max-width: 185px !important; width: min(185px, calc(100vw - 82px)) !important; } } /* 0.9.31: premium full-width local-demand search experience. */ .tla-ph-market-opportunity { --tla-market-blue:#0a90f6; --tla-market-cyan:#17b2e2; --tla-market-ink:#07152f; isolation:isolate; padding-bottom:clamp(40px,7vw,92px); position:relative; } .tla-ph-market-opportunity::before { background: radial-gradient(circle at 8% 2%,rgba(255,255,255,.25),transparent 27%), radial-gradient(circle at 94% 20%,rgba(76,219,255,.46),transparent 30%), linear-gradient(126deg,#066dcc 0%,#0a90f6 46%,#17b2e2 100%); border-radius:0; content:""; display:block; height:clamp(710px,55vw,860px); inset:0 0 auto; pointer-events:none; position:absolute; z-index:-2; } .tla-ph-market-opportunity::after { background: linear-gradient(132deg,transparent 0 48%,rgba(255,255,255,.08) 48.15% 68%,transparent 68.15%), linear-gradient(25deg,transparent 0 72%,rgba(255,255,255,.065) 72.15% 84%,transparent 84.15%); content:""; height:clamp(710px,55vw,860px); inset:0 0 auto; pointer-events:none; position:absolute; z-index:-1; } body.tla-ph-join-partner-page .tla-ph-join-hub #market-opportunity { left:50%; margin-left:-50vw; margin-right:-50vw; max-width:none!important; right:50%; width:100vw!important; } .tla-ph-market-hero, .tla-ph-market-search-shell, .tla-ph-market-loading, .tla-ph-market-error, .tla-ph-market-results, .tla-ph-market-saved { position:relative; z-index:1; } .tla-ph-market-hero { align-items:center; background:transparent; border:0; border-radius:0; color:#fff; gap:clamp(30px,5vw,72px); grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr); padding:clamp(62px,7vw,102px) 0 clamp(85px,8vw,126px); } .tla-ph-market-eyebrow { align-items:center; background:rgba(2,54,118,.22); border:1px solid rgba(255,255,255,.34); border-radius:999px; color:#fff; display:inline-flex; font-size:11px; font-weight:900; gap:8px; letter-spacing:.105em; padding:8px 12px; text-transform:uppercase; } .tla-ph-market-eyebrow svg {height:15px;width:15px} .tla-ph-market-hero h2 { color:#fff; font-size:clamp(2.55rem,5vw,5.25rem); letter-spacing:-.062em; line-height:.98; margin:18px 0 22px; max-width:930px; text-wrap:balance; } .tla-ph-market-hero p { color:rgba(255,255,255,.88); font-size:clamp(16px,1.45vw,20px); line-height:1.65; max-width:780px; } .tla-ph-market-hero-assurance { display:flex; flex-wrap:wrap; gap:9px 17px; margin-top:24px; } .tla-ph-market-hero-assurance span { align-items:center; color:#fff; display:inline-flex; font-size:12px; font-weight:760; gap:6px; } .tla-ph-market-hero-assurance svg { background:rgba(255,255,255,.16); border-radius:50%; height:19px; padding:3px; width:19px; } .tla-ph-market-uk-proof {gap:12px} .tla-ph-market-uk-proof>div { background:rgba(3,49,112,.19); border:1px solid rgba(255,255,255,.28); border-radius:22px; box-shadow:0 20px 46px rgba(0,42,100,.14); color:#fff; grid-template-columns:48px 1fr; min-height:122px; padding:19px; transition:background .2s ease,border-color .2s ease,transform .2s ease; } .tla-ph-market-uk-proof>div:hover { background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.42); transform:translateY(-2px); } .tla-ph-market-proof-icon { align-items:center; align-self:center; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.2); border-radius:15px; display:flex; grid-row:1/3; height:48px; justify-content:center; width:48px; } .tla-ph-market-proof-icon svg {height:22px;width:22px} .tla-ph-market-uk-proof strong {color:#fff;font-size:clamp(22px,2.3vw,31px)} .tla-ph-market-uk-proof small {color:rgba(255,255,255,.78);font-size:11px} .tla-ph-market-search-shell { background:rgba(255,255,255,.98); border:1px solid rgba(255,255,255,.8); border-radius:30px; box-shadow:0 34px 80px rgba(1,47,112,.25),0 2px 8px rgba(0,0,0,.04); margin-top:clamp(-74px,-5vw,-54px); max-width:1320px; overflow:hidden; padding:clamp(24px,3.5vw,44px); } .tla-ph-market-search-shell::before { background:linear-gradient(90deg,#17b2e2,#0a90f6 48%,#7b3cff 74%,#df29d3); content:""; height:5px; inset:0 0 auto; position:absolute; } .tla-ph-market-search-intro { align-items:center; display:grid; gap:16px; grid-template-columns:58px minmax(0,1fr); margin:0 0 25px; } .tla-ph-market-search-icon { align-items:center; background:linear-gradient(135deg,#e6f6ff,#eef0ff); border:1px solid rgba(10,144,246,.15); border-radius:18px; color:#0a90f6; display:flex!important; height:58px; justify-content:center; margin:0!important; width:58px; } .tla-ph-market-search-icon svg {height:27px;width:27px} .tla-ph-market-search-intro small { color:#0877ca; display:block; font-size:10px; font-weight:900; letter-spacing:.11em; margin-bottom:3px; text-transform:uppercase; } .tla-ph-market-search-intro strong {color:var(--tla-market-ink);font-size:clamp(21px,2vw,29px);letter-spacing:-.025em} .tla-ph-market-search-intro span {color:#626a82;font-size:13px;line-height:1.55;margin-top:4px} .tla-ph-market-form { align-items:stretch!important; display:block; margin:0; } .tla-ph-market-field { display:grid!important; gap:8px!important; grid-template-rows:auto auto!important; } .tla-ph-market-field>span:first-child { color:#18243c; font-size:11px!important; font-weight:850!important; letter-spacing:.035em!important; } .tla-ph-market-field-location {margin-bottom:14px!important} .tla-ph-market-control { align-items:center; background:#f4f7fc; border:1px solid #d9e2f0; border-radius:18px; display:grid; gap:10px; grid-template-columns:24px minmax(0,1fr); min-height:62px; padding:0 18px; transition:background .18s ease,border-color .18s ease,box-shadow .18s ease; } .tla-ph-market-field-location .tla-ph-market-control { background:#fff; border:2px solid rgba(10,144,246,.42); box-shadow:0 8px 25px rgba(10,144,246,.09); min-height:72px; padding-inline:22px; } .tla-ph-market-control:focus-within { background:#fff; border-color:#0a90f6; box-shadow:0 0 0 5px rgba(10,144,246,.12),0 14px 28px rgba(10,144,246,.1); } .tla-ph-market-control svg { color:#0a90f6; height:22px; pointer-events:none; width:22px; } .tla-ph-market-form .tla-ph-market-control input, .tla-ph-market-form .tla-ph-market-control select { appearance:none; -webkit-appearance:none; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; color:#111a2e!important; font-size:16px!important; height:auto!important; margin:0!important; min-height:58px!important; outline:0!important; padding:0!important; width:100%; } .tla-ph-market-field-location input {font-size:18px!important;font-weight:650} .tla-ph-market-control-select {grid-template-columns:22px minmax(0,1fr) 18px} .tla-ph-market-control-select svg:last-child {color:#68718a;height:17px;width:17px} .tla-ph-market-refine-grid { align-items:end; display:grid; gap:14px; grid-template-columns:minmax(240px,1fr) minmax(190px,.55fr) minmax(240px,.72fr); } .tla-ph-market-submit { align-items:center; background:linear-gradient(135deg,#066dcc,#0a90f6 58%,#17b2e2); border:0; border-radius:18px; box-shadow:0 16px 32px rgba(10,144,246,.24); color:#fff; cursor:pointer; display:flex; font-size:14px!important; font-weight:850; gap:14px; height:62px!important; justify-content:center; margin:0!important; min-height:62px!important; padding:0 24px!important; transition:box-shadow .18s ease,transform .18s ease,filter .18s ease; } .tla-ph-market-submit:hover { box-shadow:0 20px 38px rgba(10,144,246,.34); filter:saturate(1.08); transform:translateY(-2px); } .tla-ph-market-submit:focus-visible {outline:3px solid rgba(10,144,246,.28);outline-offset:3px} .tla-ph-market-submit svg {height:20px;width:20px} .tla-ph-market-search-meta { border-top:1px solid #e3e9f2; display:grid; gap:8px 22px; grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:22px; padding-top:18px; } .tla-ph-market-form-help, .tla-ph-market-source-line { align-items:flex-start; color:#69718a!important; display:flex; font-size:11px!important; font-weight:630; gap:8px; line-height:1.55; margin:0!important; } .tla-ph-market-form-help svg, .tla-ph-market-source-line svg {color:#0a90f6;flex:0 0 auto;height:17px;margin-top:1px;width:17px} .tla-ph-market-source-line a {color:#0877ca;font-weight:850;white-space:nowrap} .tla-ph-market-opportunity svg { fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.85; } .tla-ph-market-loading, .tla-ph-market-error {border-radius:18px} .tla-ph-market-results {margin-top:clamp(68px,7vw,100px)} html[data-tla-theme="dark"] .tla-ph-market-search-shell { background:#080b24; border-color:rgba(255,255,255,.12); } html[data-tla-theme="dark"] .tla-ph-market-search-intro strong, html[data-tla-theme="dark"] .tla-ph-market-field>span:first-child {color:#fff} html[data-tla-theme="dark"] .tla-ph-market-search-intro span, html[data-tla-theme="dark"] .tla-ph-market-form-help, html[data-tla-theme="dark"] .tla-ph-market-source-line {color:#b8bfd7!important} html[data-tla-theme="dark"] .tla-ph-market-control {background:#101531;border-color:rgba(255,255,255,.14)} html[data-tla-theme="dark"] .tla-ph-market-field-location .tla-ph-market-control {background:#0d122d;border-color:rgba(23,178,226,.55)} html[data-tla-theme="dark"] .tla-ph-market-control:focus-within {background:#111735;border-color:#17b2e2} html[data-tla-theme="dark"] .tla-ph-market-form .tla-ph-market-control input, html[data-tla-theme="dark"] .tla-ph-market-form .tla-ph-market-control select {color:#fff!important} html[data-tla-theme="dark"] .tla-ph-market-search-meta {border-top-color:rgba(255,255,255,.12)} @media(max-width:1100px) { .tla-ph-market-hero {grid-template-columns:1fr;padding-top:60px} .tla-ph-market-uk-proof {grid-template-columns:repeat(4,minmax(0,1fr))} .tla-ph-market-uk-proof>div {grid-template-columns:40px 1fr;min-height:104px;padding:14px} .tla-ph-market-proof-icon {height:40px;width:40px} .tla-ph-market-refine-grid {grid-template-columns:1fr 1fr} .tla-ph-market-submit {grid-column:1/-1;width:100%} .tla-ph-market-opportunity::before,.tla-ph-market-opportunity::after {height:1050px} } @media(max-width:760px) { .tla-ph-market-hero,.tla-ph-market-search-shell,.tla-ph-market-report-header,.tla-ph-market-panel,.tla-ph-market-tabs,.tla-ph-market-local-ribbon {width:calc(100% - 28px)} .tla-ph-market-hero {padding:48px 0 90px;width:calc(100% - 36px)} .tla-ph-market-hero h2 {font-size:clamp(2.35rem,12vw,4rem)} .tla-ph-market-hero-assurance {align-items:flex-start;flex-direction:column} .tla-ph-market-uk-proof {grid-template-columns:1fr 1fr;width:100%} .tla-ph-market-uk-proof>div {min-height:112px} .tla-ph-market-search-shell {border-radius:24px;margin-top:-58px;padding:27px 20px} .tla-ph-market-search-intro {align-items:start;grid-template-columns:48px 1fr} .tla-ph-market-search-icon {border-radius:15px;height:48px;width:48px} .tla-ph-market-refine-grid,.tla-ph-market-search-meta {grid-template-columns:1fr} .tla-ph-market-submit {grid-column:auto} .tla-ph-market-control,.tla-ph-market-field-location .tla-ph-market-control {border-radius:16px;min-height:60px;padding-inline:15px} .tla-ph-market-field-location .tla-ph-market-control {min-height:66px} .tla-ph-market-submit {border-radius:16px;height:60px!important;min-height:60px!important} .tla-ph-market-opportunity::before,.tla-ph-market-opportunity::after {height:1540px} } @media(max-width:480px) { .tla-ph-market-uk-proof {grid-template-columns:1fr} .tla-ph-market-uk-proof>div {min-height:96px} .tla-ph-market-search-intro {grid-template-columns:1fr} .tla-ph-market-search-icon {height:44px;width:44px} .tla-ph-market-opportunity::before,.tla-ph-market-opportunity::after {height:1780px} } @media(prefers-reduced-motion:reduce) { .tla-ph-market-uk-proof>div,.tla-ph-market-submit {transition:none} .tla-ph-market-uk-proof>div:hover,.tla-ph-market-submit:hover {transform:none} } /* ===================================================================== TLA MARKET OPPORTUNITY — FINAL PREMIUM REBUILD (v0.9.35) Full-bleed blue hero that ends cleanly, white search card floating over the fold, generous spacing. Overrides all earlier layers. ===================================================================== */ /* Container: strip the old rounded tinted panel so the blue can run edge-to-edge and never look "boxed". No radius, border, bg or shadow. */ .tla-ph-market-opportunity { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 0 clamp(28px,4vw,52px) !important; overflow: visible !important; isolation: isolate; position: relative; } .tla-ph-market-opportunity::before, .tla-ph-market-opportunity::after { display: none !important; } /* HERO: paints its own full-bleed blue that auto-sizes to its content, so the band always ends exactly where the hero ends — never halfway. */ .tla-ph-market-hero { position: relative !important; z-index: 1 !important; display: grid !important; grid-template-columns: minmax(0,1.1fr) minmax(360px,.9fr) !important; align-items: center !important; gap: clamp(32px,5vw,72px) !important; color: #fff !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; margin: 0 auto !important; padding: clamp(56px,6vw,96px) clamp(20px,4vw,40px) clamp(150px,13vw,210px) !important; max-width: 1240px !important; } .tla-ph-market-hero::before { content: "" !important; position: absolute !important; top: 0 !important; bottom: 0 !important; left: 50% !important; right: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; width: 100vw !important; background: radial-gradient(circle at 6% -4%, rgba(255,255,255,.20), transparent 26%), radial-gradient(circle at 96% 12%, rgba(90,224,255,.40), transparent 34%), linear-gradient(128deg,#0663c4 0%,#0a90f6 46%,#19b6e6 100%) !important; z-index: -1 !important; pointer-events: none !important; } .tla-ph-market-hero-copy { max-width: 620px !important; } .tla-ph-market-eyebrow { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: rgba(255,255,255,.14) !important; border: 1px solid rgba(255,255,255,.35) !important; border-radius: 999px !important; padding: 8px 14px !important; color: #fff !important; font-size: 11px !important; font-weight: 900 !important; letter-spacing: .11em !important; text-transform: uppercase !important; margin-bottom: 22px !important; } .tla-ph-market-eyebrow svg { height: 15px !important; width: 15px !important; } .tla-ph-market-hero h2 { color: #fff !important; font-size: clamp(2.4rem,4.4vw,4.4rem) !important; line-height: 1.03 !important; letter-spacing: -.04em !important; margin: 0 0 20px !important; max-width: 600px !important; text-wrap: balance; } .tla-ph-market-hero p { color: rgba(255,255,255,.9) !important; font-size: clamp(16px,1.4vw,19px) !important; line-height: 1.65 !important; margin: 0 !important; max-width: 560px !important; } .tla-ph-market-hero-assurance { display: flex !important; flex-wrap: wrap !important; gap: 12px 22px !important; margin-top: 30px !important; } .tla-ph-market-hero-assurance span { display: inline-flex !important; align-items: center !important; gap: 7px !important; color: #fff !important; font-size: 13px !important; font-weight: 700 !important; } .tla-ph-market-hero-assurance svg { height: 20px !important; width: 20px !important; padding: 3px !important; background: rgba(255,255,255,.18) !important; border-radius: 50% !important; } /* UK proof stat cards — glassy on the blue */ .tla-ph-market-uk-proof { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 15px !important; } .tla-ph-market-uk-proof > div { display: grid !important; grid-template-columns: 48px 1fr !important; align-items: center !important; gap: 3px 14px !important; background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,255,255,.26) !important; border-radius: 20px !important; box-shadow: 0 18px 44px rgba(0,40,96,.16) !important; color: #fff !important; min-height: 120px !important; padding: 20px !important; transition: background .2s ease, transform .2s ease !important; } .tla-ph-market-uk-proof > div:hover { background: rgba(255,255,255,.2) !important; transform: translateY(-2px) !important; } .tla-ph-market-proof-icon { grid-row: 1/3 !important; display: flex !important; align-items: center !important; justify-content: center !important; height: 48px !important; width: 48px !important; background: rgba(255,255,255,.18) !important; border: 1px solid rgba(255,255,255,.22) !important; border-radius: 14px !important; } .tla-ph-market-proof-icon svg { height: 22px !important; width: 22px !important; color: #fff !important; } .tla-ph-market-uk-proof strong { color: #fff !important; font-size: clamp(22px,2.2vw,30px) !important; line-height: 1 !important; } .tla-ph-market-uk-proof small { color: rgba(255,255,255,.82) !important; font-size: 12px !important; line-height: 1.35 !important; } /* SEARCH CARD — floats over the blue fold, clean white, generous padding */ .tla-ph-market-search-shell { position: relative !important; z-index: 3 !important; background: #fff !important; border: 1px solid rgba(10,144,246,.12) !important; border-radius: 28px !important; box-shadow: 0 40px 90px rgba(1,47,112,.22), 0 4px 12px rgba(0,0,0,.05) !important; max-width: 1180px !important; margin: clamp(-124px,-10vw,-96px) auto 0 !important; padding: clamp(28px,3.4vw,44px) !important; overflow: hidden !important; } .tla-ph-market-search-shell::before { content: "" !important; position: absolute !important; inset: 0 0 auto !important; height: 5px !important; background: linear-gradient(90deg,#17b2e2,#0a90f6 46%,#7b3cff 74%,#df29d3) !important; } .tla-ph-market-search-intro { display: grid !important; grid-template-columns: 58px 1fr !important; align-items: center !important; gap: 16px !important; margin: 6px 0 28px !important; } .tla-ph-market-search-icon { display: flex !important; align-items: center !important; justify-content: center !important; height: 58px !important; width: 58px !important; background: linear-gradient(135deg,#e6f6ff,#eef0ff) !important; border: 1px solid rgba(10,144,246,.15) !important; border-radius: 18px !important; color: #0a90f6 !important; margin: 0 !important; } .tla-ph-market-search-icon svg { height: 27px !important; width: 27px !important; } .tla-ph-market-search-intro small { display: block !important; color: #0877ca !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .12em !important; text-transform: uppercase !important; margin-bottom: 4px !important; } .tla-ph-market-search-intro strong { display: block !important; color: #07152f !important; font-size: clamp(20px,1.9vw,27px) !important; letter-spacing: -.02em !important; } .tla-ph-market-search-intro > div > span { display: block !important; color: #626a82 !important; font-size: 13px !important; line-height: 1.55 !important; margin-top: 4px !important; } .tla-ph-market-form { display: block !important; margin: 0 !important; } .tla-ph-market-field { display: grid !important; gap: 8px !important; } .tla-ph-market-field > span:first-child { color: #18243c !important; font-size: 11px !important; font-weight: 850 !important; letter-spacing: .04em !important; text-transform: uppercase !important; } .tla-ph-market-field-location { margin-bottom: 16px !important; } .tla-ph-market-control { display: grid !important; grid-template-columns: 24px 1fr !important; align-items: center !important; gap: 10px !important; background: #f4f7fc !important; border: 1px solid #d9e2f0 !important; border-radius: 16px !important; min-height: 60px !important; padding: 0 18px !important; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease !important; } .tla-ph-market-field-location .tla-ph-market-control { background: #fff !important; border: 2px solid rgba(10,144,246,.4) !important; box-shadow: 0 8px 24px rgba(10,144,246,.08) !important; min-height: 68px !important; } .tla-ph-market-control:focus-within { background: #fff !important; border-color: #0a90f6 !important; box-shadow: 0 0 0 5px rgba(10,144,246,.12) !important; } .tla-ph-market-control svg { height: 22px !important; width: 22px !important; color: #0a90f6 !important; pointer-events: none !important; } .tla-ph-market-control-select { grid-template-columns: 22px 1fr 18px !important; } .tla-ph-market-control-select svg:last-child { height: 17px !important; width: 17px !important; color: #68718a !important; } .tla-ph-market-form .tla-ph-market-control input, .tla-ph-market-form .tla-ph-market-control select { appearance: none !important; -webkit-appearance: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; outline: 0 !important; color: #111a2e !important; font-size: 16px !important; min-height: 56px !important; padding: 0 !important; margin: 0 !important; width: 100% !important; } .tla-ph-market-field-location input { font-size: 18px !important; font-weight: 650 !important; } .tla-ph-market-refine-grid { display: grid !important; grid-template-columns: minmax(220px,1fr) minmax(170px,.5fr) minmax(220px,.7fr) !important; align-items: end !important; gap: 16px !important; } /* SUBMIT — force white text/icon over any theme or Elementor button styles */ .tla-ph-market-opportunity .tla-ph-market-form button.tla-ph-market-submit, .tla-ph-market-opportunity .tla-ph-market-form button.tla-ph-market-submit:link, .tla-ph-market-opportunity .tla-ph-market-form button.tla-ph-market-submit:visited, .tla-ph-market-opportunity .tla-ph-market-form button.tla-ph-market-submit:hover, .tla-ph-market-opportunity .tla-ph-market-form button.tla-ph-market-submit:focus { display: flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important; background: linear-gradient(135deg,#0663c4,#0a90f6 58%,#17b2e2) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; border: 0 !important; border-radius: 16px !important; box-shadow: 0 16px 32px rgba(10,144,246,.26) !important; height: 60px !important; min-height: 60px !important; padding: 0 24px !important; font-size: 14px !important; font-weight: 850 !important; text-shadow: none !important; cursor: pointer !important; transition: transform .18s ease, box-shadow .18s ease !important; } .tla-ph-market-submit:hover { transform: translateY(-2px) !important; box-shadow: 0 20px 38px rgba(10,144,246,.34) !important; } .tla-ph-market-submit span { color: #fff !important; -webkit-text-fill-color: #fff !important; } .tla-ph-market-submit svg { height: 20px !important; width: 20px !important; color: #fff !important; stroke: currentColor !important; fill: none !important; opacity: 1 !important; } .tla-ph-market-search-meta { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 20px !important; margin-top: 24px !important; padding-top: 22px !important; border-top: 1px solid #e3e9f2 !important; } .tla-ph-market-search-meta p { display: flex !important; gap: 9px !important; margin: 0 !important; color: #626a82 !important; font-size: 12px !important; line-height: 1.55 !important; } .tla-ph-market-search-meta svg { flex: 0 0 auto !important; height: 16px !important; width: 16px !important; color: #8a91a8 !important; margin-top: 1px !important; } .tla-ph-market-search-meta a { color: #0a75d8 !important; font-weight: 700 !important; } /* RESPONSIVE */ @media (max-width:1024px) { .tla-ph-market-hero { grid-template-columns: 1fr !important; padding-bottom: clamp(130px,16vw,170px) !important; } .tla-ph-market-hero-copy { max-width: 100% !important; } .tla-ph-market-hero h2 { max-width: 100% !important; } } @media (max-width:760px) { .tla-ph-market-hero { padding: 44px 20px 130px !important; } .tla-ph-market-uk-proof { grid-template-columns: 1fr 1fr !important; } .tla-ph-market-search-shell { margin-top: -128px !important; border-radius: 22px !important; padding: 24px 18px !important; width: calc(100% - 28px) !important; } .tla-ph-market-search-intro { grid-template-columns: 46px 1fr !important; align-items: start !important; } .tla-ph-market-search-icon { height: 46px !important; width: 46px !important; } .tla-ph-market-refine-grid, .tla-ph-market-search-meta { grid-template-columns: 1fr !important; } } @media (max-width:480px) { .tla-ph-market-uk-proof { grid-template-columns: 1fr !important; } } @media (prefers-reduced-motion:reduce) { .tla-ph-market-uk-proof > div, .tla-ph-market-submit { transition: none !important; } .tla-ph-market-uk-proof > div:hover, .tla-ph-market-submit:hover { transform: none !important; } } /* ===================================================================== TLA MARKET OPPORTUNITY — PRODUCTION DESIGN SYSTEM (v0.9.38) One final, scoped source of truth for the public search and its report. ===================================================================== */ .tla-ph-market-opportunity { --tla-market-accent: #0a90f6; --tla-market-accent-strong: #0576d4; --tla-market-cyan: #17b2e2; --tla-market-ink: #07152f; --tla-market-muted: #5d6680; --tla-market-line: #dbe4f0; --tla-market-soft: #f3f7fc; --tla-market-surface: #ffffff; background: linear-gradient(180deg,#0a90f6 0,#10a5df 520px,#f5f7fc 520px,#f5f7fc 100%) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; box-sizing: border-box !important; color: var(--tla-market-ink) !important; inline-size: 100vw !important; isolation: isolate !important; margin-block: clamp(38px,5vw,72px) !important; margin-inline: calc(50% - 50vw) !important; max-inline-size: none !important; overflow: clip !important; padding: 0 0 clamp(54px,6vw,88px) !important; position: relative !important; } .tla-ph-market-opportunity::before { background: radial-gradient(circle at 6% 7%,rgba(255,255,255,.25),transparent 25%), radial-gradient(circle at 94% 13%,rgba(96,231,255,.35),transparent 29%), linear-gradient(130deg,#0666c8 0%,#0a90f6 49%,#17b2e2 100%) !important; content: "" !important; display: block !important; height: 520px !important; inset: 0 0 auto !important; pointer-events: none !important; position: absolute !important; z-index: -2 !important; } .tla-ph-market-opportunity::after { background: linear-gradient(140deg,transparent 46%,rgba(255,255,255,.07) 46.2% 61%,transparent 61.2%), linear-gradient(26deg,transparent 70%,rgba(255,255,255,.055) 70.2% 82%,transparent 82.2%) !important; content: "" !important; display: block !important; height: 520px !important; inset: 0 0 auto !important; pointer-events: none !important; position: absolute !important; z-index: -1 !important; } .tla-ph-market-opportunity, .tla-ph-market-opportunity * { box-sizing: border-box !important; } /* Shared alignment contract: hero, search and report use the same width. */ .tla-ph-market-opportunity .tla-ph-market-hero, .tla-ph-market-opportunity .tla-ph-market-search-shell, .tla-ph-market-opportunity .tla-ph-market-loading, .tla-ph-market-opportunity .tla-ph-market-error, .tla-ph-market-opportunity .tla-ph-market-results, .tla-ph-market-opportunity .tla-ph-market-saved { margin-inline: auto !important; max-width: 1280px !important; width: min(1280px,calc(100% - 48px)) !important; } .tla-ph-market-opportunity .tla-ph-market-hero { align-items: center !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; color: #fff !important; display: grid !important; gap: clamp(34px,5vw,70px) !important; grid-template-columns: minmax(0,1.12fr) minmax(420px,.88fr) !important; margin: 0 auto !important; padding: clamp(58px,6vw,86px) clamp(24px,2.25vw,36px) 118px !important; position: relative !important; z-index: 1 !important; } .tla-ph-market-opportunity .tla-ph-market-hero::before { display: none !important; } .tla-ph-market-opportunity .tla-ph-market-hero-copy { max-width: 660px !important; min-width: 0 !important; overflow-wrap: anywhere !important; } .tla-ph-market-opportunity .tla-ph-market-eyebrow { align-items: center !important; background: rgba(2,50,111,.23) !important; border: 1px solid rgba(255,255,255,.38) !important; border-radius: 999px !important; color: #fff !important; display: inline-flex !important; font-size: 11px !important; font-weight: 900 !important; gap: 8px !important; letter-spacing: .105em !important; margin: 0 0 18px !important; padding: 8px 13px !important; text-transform: uppercase !important; } .tla-ph-market-opportunity .tla-ph-market-eyebrow svg { height: 15px !important; width: 15px !important; } .tla-ph-market-opportunity .tla-ph-market-hero h2 { color: #fff !important; font-size: clamp(2.55rem,4.6vw,4.65rem) !important; letter-spacing: -.052em !important; line-height: 1 !important; margin: 0 0 20px !important; max-width: 650px !important; text-wrap: balance !important; } .tla-ph-market-opportunity .tla-ph-market-hero p { color: rgba(255,255,255,.92) !important; font-size: clamp(16px,1.25vw,19px) !important; line-height: 1.65 !important; margin: 0 !important; max-width: 630px !important; } .tla-ph-market-opportunity .tla-ph-market-hero-assurance { display: flex !important; flex-wrap: wrap !important; gap: 10px 20px !important; margin-top: 26px !important; } .tla-ph-market-opportunity .tla-ph-market-hero-assurance span { align-items: center !important; color: #fff !important; display: inline-flex !important; font-size: 12px !important; font-weight: 760 !important; gap: 7px !important; } .tla-ph-market-opportunity .tla-ph-market-hero-assurance svg { background: rgba(255,255,255,.18) !important; border-radius: 50% !important; height: 19px !important; padding: 3px !important; width: 19px !important; } /* Four equal benchmark cards. */ .tla-ph-market-opportunity .tla-ph-market-uk-proof { align-self: stretch !important; display: grid !important; gap: 13px !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof > div { align-content: center !important; align-items: center !important; background: rgba(2,53,116,.2) !important; border: 1px solid rgba(255,255,255,.3) !important; border-radius: 20px !important; box-shadow: 0 18px 44px rgba(0,42,100,.13) !important; color: #fff !important; display: grid !important; gap: 4px 13px !important; grid-template-columns: 46px minmax(0,1fr) !important; min-height: 112px !important; padding: 17px !important; } .tla-ph-market-opportunity .tla-ph-market-proof-icon { align-items: center !important; background: rgba(255,255,255,.17) !important; border: 1px solid rgba(255,255,255,.2) !important; border-radius: 14px !important; display: flex !important; grid-row: 1 / 3 !important; height: 46px !important; justify-content: center !important; width: 46px !important; } .tla-ph-market-opportunity .tla-ph-market-proof-icon svg { color: #fff !important; height: 21px !important; width: 21px !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof strong { color: #fff !important; font-size: clamp(22px,2vw,29px) !important; line-height: 1 !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof small { color: rgba(255,255,255,.83) !important; font-size: 11px !important; line-height: 1.35 !important; } /* Search card and three-step guidance. */ .tla-ph-market-opportunity .tla-ph-market-search-shell { background: var(--tla-market-surface) !important; border: 1px solid rgba(10,144,246,.16) !important; border-radius: 28px !important; box-shadow: 0 32px 75px rgba(1,47,112,.2),0 4px 12px rgba(8,21,48,.05) !important; margin: -72px auto 0 !important; overflow: hidden !important; padding: clamp(28px,3.2vw,42px) !important; position: relative !important; z-index: 3 !important; } .tla-ph-market-opportunity .tla-ph-market-search-shell::before { background: linear-gradient(90deg,#17b2e2,#0a90f6 45%,#793cff 72%,#df29d3) !important; content: "" !important; height: 5px !important; inset: 0 0 auto !important; position: absolute !important; } .tla-ph-market-opportunity .tla-ph-market-search-intro { align-items: center !important; display: grid !important; gap: 16px !important; grid-template-columns: 58px minmax(0,1fr) !important; margin: 2px 0 22px !important; } .tla-ph-market-opportunity .tla-ph-market-search-icon { align-items: center !important; background: linear-gradient(135deg,#e6f6ff,#eef0ff) !important; border: 1px solid rgba(10,144,246,.17) !important; border-radius: 18px !important; color: var(--tla-market-accent) !important; display: flex !important; height: 58px !important; justify-content: center !important; margin: 0 !important; width: 58px !important; } .tla-ph-market-opportunity .tla-ph-market-search-icon svg { height: 27px !important; width: 27px !important; } .tla-ph-market-opportunity .tla-ph-market-search-intro small { color: var(--tla-market-accent-strong) !important; display: block !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .115em !important; margin-bottom: 3px !important; text-transform: uppercase !important; } .tla-ph-market-opportunity .tla-ph-market-search-intro strong { color: var(--tla-market-ink) !important; display: block !important; font-size: clamp(22px,2vw,29px) !important; letter-spacing: -.026em !important; line-height: 1.2 !important; } .tla-ph-market-opportunity .tla-ph-market-search-intro > div > span { color: var(--tla-market-muted) !important; display: block !important; font-size: 13px !important; line-height: 1.55 !important; margin-top: 4px !important; } .tla-ph-market-opportunity .tla-ph-market-search-steps { display: grid !important; gap: 10px !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; list-style: none !important; margin: 0 0 22px !important; padding: 0 !important; } .tla-ph-market-opportunity .tla-ph-market-search-steps li { align-items: center !important; background: var(--tla-market-soft) !important; border: 1px solid var(--tla-market-line) !important; border-radius: 13px !important; color: #34415a !important; display: flex !important; font-size: 12px !important; font-weight: 760 !important; gap: 9px !important; min-height: 44px !important; padding: 9px 12px !important; } .tla-ph-market-opportunity .tla-ph-market-search-steps li > span { background: linear-gradient(135deg,#0a90f6,#17b2e2) !important; border-radius: 50% !important; color: #fff !important; display: grid !important; flex: 0 0 24px !important; font-size: 11px !important; font-weight: 900 !important; height: 24px !important; place-items: center !important; width: 24px !important; } /* Consistent fields, radius and call to action. */ .tla-ph-market-opportunity .tla-ph-market-form { display: block !important; margin: 0 !important; } .tla-ph-market-opportunity .tla-ph-market-field { display: grid !important; gap: 8px !important; margin: 0 !important; } .tla-ph-market-opportunity .tla-ph-market-field > span:first-child { color: #17233b !important; font-size: 11px !important; font-weight: 850 !important; letter-spacing: .04em !important; text-transform: uppercase !important; } .tla-ph-market-opportunity .tla-ph-market-field-location { margin-bottom: 14px !important; } .tla-ph-market-opportunity .tla-ph-market-control { align-items: center !important; background: #f5f8fc !important; border: 1px solid var(--tla-market-line) !important; border-radius: 16px !important; display: grid !important; gap: 10px !important; grid-template-columns: 23px minmax(0,1fr) !important; min-height: 60px !important; padding: 0 17px !important; transition: background .18s ease,border-color .18s ease,box-shadow .18s ease !important; } .tla-ph-market-opportunity .tla-ph-market-field-location .tla-ph-market-control { background: #fff !important; border: 2px solid rgba(10,144,246,.42) !important; box-shadow: 0 9px 24px rgba(10,144,246,.08) !important; min-height: 68px !important; padding-inline: 20px !important; } .tla-ph-market-opportunity .tla-ph-market-control:focus-within { background: #fff !important; border-color: var(--tla-market-accent) !important; box-shadow: 0 0 0 4px rgba(10,144,246,.14),0 12px 28px rgba(10,144,246,.09) !important; } .tla-ph-market-opportunity .tla-ph-market-control svg { color: var(--tla-market-accent) !important; height: 21px !important; pointer-events: none !important; width: 21px !important; } .tla-ph-market-opportunity .tla-ph-market-control-select { grid-template-columns: 21px minmax(0,1fr) 17px !important; } .tla-ph-market-opportunity .tla-ph-market-control-select svg:last-child { color: #65708a !important; height: 16px !important; width: 16px !important; } .tla-ph-market-opportunity .tla-ph-market-control input, .tla-ph-market-opportunity .tla-ph-market-control select { appearance: none !important; -webkit-appearance: none !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #111a2e !important; font-size: 16px !important; height: auto !important; margin: 0 !important; min-height: 56px !important; outline: 0 !important; padding: 0 !important; width: 100% !important; } .tla-ph-market-opportunity .tla-ph-market-field-location input { font-size: 17px !important; font-weight: 650 !important; } .tla-ph-market-opportunity .tla-ph-market-refine-grid { align-items: end !important; display: grid !important; gap: 14px !important; grid-template-columns: minmax(250px,1fr) minmax(180px,.48fr) minmax(240px,.65fr) !important; } .tla-ph-market-opportunity .tla-ph-market-submit { align-items: center !important; background: linear-gradient(135deg,#0666c8,#0a90f6 58%,#17b2e2) !important; border: 0 !important; border-radius: 16px !important; box-shadow: 0 15px 30px rgba(10,144,246,.25) !important; color: #fff !important; cursor: pointer !important; display: flex !important; font-size: 14px !important; font-weight: 850 !important; gap: 12px !important; height: 60px !important; justify-content: center !important; margin: 0 !important; min-height: 60px !important; padding: 0 22px !important; text-shadow: none !important; transition: transform .18s ease,box-shadow .18s ease,filter .18s ease !important; -webkit-text-fill-color: #fff !important; } .tla-ph-market-opportunity .tla-ph-market-submit span, .tla-ph-market-opportunity .tla-ph-market-submit svg { color: #fff !important; -webkit-text-fill-color: #fff !important; } .tla-ph-market-opportunity .tla-ph-market-submit svg { fill: none !important; height: 20px !important; stroke: currentColor !important; width: 20px !important; } .tla-ph-market-opportunity .tla-ph-market-submit:hover { box-shadow: 0 19px 36px rgba(10,144,246,.34) !important; filter: saturate(1.08) !important; transform: translateY(-2px) !important; } .tla-ph-market-opportunity .tla-ph-market-submit:focus-visible { outline: 3px solid rgba(10,144,246,.32) !important; outline-offset: 3px !important; } /* Methodology and precision notes become one tidy footer rail. */ .tla-ph-market-opportunity .tla-ph-market-search-meta { background: #f7f9fc !important; border: 1px solid var(--tla-market-line) !important; border-radius: 15px !important; display: grid !important; gap: 14px 24px !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; margin-top: 22px !important; padding: 15px 17px !important; } .tla-ph-market-opportunity .tla-ph-market-form-help, .tla-ph-market-opportunity .tla-ph-market-source-line { align-items: flex-start !important; color: var(--tla-market-muted) !important; display: flex !important; font-size: 11px !important; font-weight: 620 !important; gap: 8px !important; line-height: 1.55 !important; margin: 0 !important; } .tla-ph-market-opportunity .tla-ph-market-form-help svg, .tla-ph-market-opportunity .tla-ph-market-source-line svg { color: var(--tla-market-accent) !important; flex: 0 0 auto !important; height: 17px !important; margin-top: 1px !important; width: 17px !important; } .tla-ph-market-opportunity .tla-ph-market-source-line a { color: var(--tla-market-accent-strong) !important; font-weight: 850 !important; white-space: nowrap !important; } /* Generated report continues the same geometry and surface language. */ .tla-ph-market-opportunity .tla-ph-market-loading, .tla-ph-market-opportunity .tla-ph-market-error { border-radius: 16px !important; margin-top: 24px !important; padding: 16px 18px !important; } .tla-ph-market-opportunity .tla-ph-market-results { margin-top: clamp(46px,5vw,72px) !important; } .tla-ph-market-opportunity .tla-ph-market-report-header, .tla-ph-market-opportunity .tla-ph-market-local-ribbon, .tla-ph-market-opportunity .tla-ph-market-tabs, .tla-ph-market-opportunity .tla-ph-market-panel { border-color: var(--tla-market-line) !important; } .tla-ph-market-opportunity .tla-ph-market-report-header, .tla-ph-market-opportunity .tla-ph-market-panel { background: var(--tla-market-surface) !important; border-radius: 22px !important; } .tla-ph-market-opportunity .tla-ph-market-kpi, .tla-ph-market-opportunity .tla-ph-market-icon-stat, .tla-ph-market-opportunity .tla-ph-market-profile-card, .tla-ph-market-opportunity .tla-ph-market-finance-card, .tla-ph-market-opportunity .tla-ph-market-intent-card, .tla-ph-market-opportunity .tla-ph-market-business, .tla-ph-market-opportunity .tla-ph-market-method-details { border-radius: 17px !important; } /* Dark mode keeps contrast without changing the TLA-blue intelligence band. */ html[data-tla-theme="dark"] .tla-ph-market-opportunity { --tla-market-ink: #f5f7ff; --tla-market-muted: #b9c1d8; --tla-market-line: rgba(255,255,255,.13); --tla-market-soft: #101630; --tla-market-surface: #080c24; background: linear-gradient(180deg,#0758ad 0,#087fbf 520px,#03051b 520px,#03051b 100%) !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-search-intro strong, html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-field > span:first-child { color: #fff !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-search-steps li { color: #edf1ff !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-control, html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-search-meta { background: #101630 !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-field-location .tla-ph-market-control { background: #0b112d !important; border-color: rgba(23,178,226,.58) !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-control:focus-within { background: #111935 !important; border-color: #17b2e2 !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-control input, html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-control select { color: #fff !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity .tla-ph-market-control input::placeholder { color: #9da7c4 !important; opacity: 1 !important; } /* Tablet and mobile: balanced stacking, no clipped controls or horizontal drift. */ @media (max-width: 1120px) { .tla-ph-market-opportunity .tla-ph-market-hero { gap: 32px !important; grid-template-columns: 1fr !important; padding-bottom: 116px !important; } .tla-ph-market-opportunity .tla-ph-market-hero-copy, .tla-ph-market-opportunity .tla-ph-market-hero h2 { max-width: 850px !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof { grid-template-columns: repeat(4,minmax(0,1fr)) !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof > div { grid-template-columns: 40px minmax(0,1fr) !important; min-height: 100px !important; padding: 14px !important; } .tla-ph-market-opportunity .tla-ph-market-proof-icon { height: 40px !important; width: 40px !important; } .tla-ph-market-opportunity .tla-ph-market-refine-grid { grid-template-columns: minmax(0,1fr) minmax(180px,.55fr) !important; } .tla-ph-market-opportunity .tla-ph-market-submit { grid-column: 1 / -1 !important; width: 100% !important; } } @media (max-width: 820px) { .tla-ph-market-opportunity { background-position: 0 0 !important; margin-block: 30px 52px !important; } .tla-ph-market-opportunity .tla-ph-market-hero, .tla-ph-market-opportunity .tla-ph-market-search-shell, .tla-ph-market-opportunity .tla-ph-market-loading, .tla-ph-market-opportunity .tla-ph-market-error, .tla-ph-market-opportunity .tla-ph-market-results, .tla-ph-market-opportunity .tla-ph-market-saved { width: calc(100% - 28px) !important; } .tla-ph-market-opportunity .tla-ph-market-hero { padding: 46px 22px 110px !important; } .tla-ph-market-opportunity .tla-ph-market-hero h2 { font-size: clamp(2.35rem,10vw,4rem) !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } .tla-ph-market-opportunity .tla-ph-market-search-shell { border-radius: 22px !important; margin-top: -70px !important; padding: 25px 19px !important; } .tla-ph-market-opportunity .tla-ph-market-search-steps { grid-template-columns: 1fr !important; } .tla-ph-market-opportunity .tla-ph-market-search-steps li { min-height: 40px !important; } .tla-ph-market-opportunity .tla-ph-market-refine-grid, .tla-ph-market-opportunity .tla-ph-market-search-meta { grid-template-columns: 1fr !important; } .tla-ph-market-opportunity .tla-ph-market-submit { grid-column: auto !important; } } @media (max-width: 520px) { .tla-ph-market-opportunity::before, .tla-ph-market-opportunity::after { height: 720px !important; } .tla-ph-market-opportunity { background: linear-gradient(180deg,#0a90f6 0,#10a5df 720px,#f5f7fc 720px,#f5f7fc 100%) !important; } html[data-tla-theme="dark"] .tla-ph-market-opportunity { background: linear-gradient(180deg,#0758ad 0,#087fbf 720px,#03051b 720px,#03051b 100%) !important; } .tla-ph-market-opportunity .tla-ph-market-hero { padding-top: 38px !important; } .tla-ph-market-opportunity .tla-ph-market-hero-assurance { align-items: flex-start !important; flex-direction: column !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof { grid-template-columns: 1fr !important; } .tla-ph-market-opportunity .tla-ph-market-uk-proof > div { min-height: 88px !important; } .tla-ph-market-opportunity .tla-ph-market-search-intro { align-items: start !important; grid-template-columns: 46px minmax(0,1fr) !important; } .tla-ph-market-opportunity .tla-ph-market-search-icon { border-radius: 14px !important; height: 46px !important; width: 46px !important; } .tla-ph-market-opportunity .tla-ph-market-control, .tla-ph-market-opportunity .tla-ph-market-field-location .tla-ph-market-control, .tla-ph-market-opportunity .tla-ph-market-submit { border-radius: 14px !important; } } @media (prefers-reduced-motion: reduce) { .tla-ph-market-opportunity .tla-ph-market-control, .tla-ph-market-opportunity .tla-ph-market-submit { transition: none !important; } .tla-ph-market-opportunity .tla-ph-market-submit:hover { transform: none !important; } } /* ===================================================================== 0.9.39 TRUSTED PARTNER BRAND PLACEMENT SHOWCASE ===================================================================== */ .tla-ph-market-trusted-lockup { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 7px !important; margin: 0 0 24px !important; max-width: 280px !important; } .tla-ph-market-trusted-lockup img { display: block !important; height: auto !important; max-height: 106px !important; object-fit: contain !important; object-position: left center !important; width: min(250px,100%) !important; } .tla-ph-market-trusted-lockup span { color: #a9eaff !important; font-size: 10px !important; font-weight: 850 !important; letter-spacing: .09em !important; text-transform: uppercase !important; } .tla-ph-trust-site-mockup[data-tla-partner-showcase] { background: #fff !important; border-color: rgba(10,0,50,.12) !important; box-shadow: 0 30px 75px rgba(19,25,67,.2) !important; overflow: visible !important; } .tla-ph-trust-site-mockup[data-tla-partner-showcase] .tla-ph-trust-browser-bar { background: #eef1f7 !important; border-color: #dfe4ee !important; } .tla-ph-trust-site-mockup[data-tla-partner-showcase] .tla-ph-trust-browser-bar span { background: #fff !important; border-color: #d7deea !important; color: #65708a !important; } .tla-ph-trust-rotator { background: #f6f8fc !important; min-height: 455px !important; overflow: hidden !important; padding: 0 !important; position: relative !important; } .tla-ph-trust-website { --tla-demo-accent: #0a90f6; --tla-demo-accent-2: #17b2e2; background: #fff !important; color: #101528 !important; inset: 0 !important; opacity: 0 !important; pointer-events: none !important; position: absolute !important; transform: translateX(24px) scale(.985) !important; transition: opacity .48s ease,transform .48s cubic-bezier(.22,1,.36,1) !important; } .tla-ph-trust-website.is-active { opacity: 1 !important; pointer-events: auto !important; transform: none !important; z-index: 2 !important; } .tla-ph-trust-website.is-legal { --tla-demo-accent: #5d36a9; --tla-demo-accent-2: #df29d3; } .tla-ph-trust-website.is-enforcement { --tla-demo-accent: #072f5f; --tla-demo-accent-2: #0a90f6; } .tla-ph-trust-website > header { align-items: center !important; background: #fff !important; border-bottom: 1px solid #e6eaf1 !important; display: flex !important; justify-content: space-between !important; min-height: 76px !important; padding: 15px 22px !important; } .tla-ph-trust-demo-brand { align-items: center !important; display: flex !important; gap: 10px !important; min-width: 0 !important; } .tla-ph-trust-demo-brand > .dashicons { align-items: center !important; background: linear-gradient(135deg,var(--tla-demo-accent),var(--tla-demo-accent-2)) !important; border-radius: 11px !important; color: #fff !important; display: flex !important; flex: 0 0 40px !important; font-size: 20px !important; height: 40px !important; justify-content: center !important; width: 40px !important; } .tla-ph-trust-demo-brand strong, .tla-ph-trust-demo-brand small { display: block !important; } .tla-ph-trust-demo-brand strong { color: #11172a !important; font-size: 14px !important; line-height: 1.2 !important; } .tla-ph-trust-demo-brand small { color: #6a7288 !important; font-size: 9px !important; line-height: 1.35 !important; margin-top: 3px !important; } .tla-ph-trust-website > header nav { display: flex !important; gap: 14px !important; } .tla-ph-trust-website > header nav span { color: #555e73 !important; font-size: 9px !important; font-weight: 750 !important; } .tla-ph-trust-demo-hero { background: radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--tla-demo-accent-2) 28%,transparent),transparent 33%), linear-gradient(135deg,color-mix(in srgb,var(--tla-demo-accent) 9%,white),#fff 72%) !important; min-height: 260px !important; padding: 42px 34px !important; } .tla-ph-trust-demo-hero small { color: var(--tla-demo-accent) !important; display: block !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .11em !important; text-transform: uppercase !important; } .tla-ph-trust-demo-hero h3 { color: #0b1022 !important; font-size: clamp(25px,3.1vw,38px) !important; letter-spacing: -.045em !important; line-height: 1.05 !important; margin: 9px 0 23px !important; max-width: 470px !important; } .tla-ph-trust-demo-hero > span { background: linear-gradient(135deg,var(--tla-demo-accent),var(--tla-demo-accent-2)) !important; border-radius: 999px !important; color: #fff !important; display: inline-block !important; font-size: 10px !important; font-weight: 850 !important; padding: 10px 15px !important; } .tla-ph-trust-website > footer { align-items: center !important; background: #f5f7fb !important; border-top: 1px solid #e2e7f0 !important; display: flex !important; gap: 18px !important; min-height: 118px !important; padding: 17px 22px !important; } .tla-ph-trust-website > footer img { display: block !important; height: auto !important; max-height: 74px !important; object-fit: contain !important; width: min(178px,42%) !important; } .tla-ph-trust-website > footer strong, .tla-ph-trust-website > footer small { display: block !important; } .tla-ph-trust-website > footer strong { color: #1a2033 !important; font-size: 11px !important; } .tla-ph-trust-website > footer small, .tla-ph-trust-website > footer span { color: #687187 !important; font-size: 9px !important; } .tla-ph-trust-website > footer.is-logo-right img { margin-left: auto !important; } .tla-ph-trust-website > footer.is-logo-centre { flex-direction: column !important; gap: 8px !important; justify-content: center !important; text-align: center !important; } .tla-ph-trust-website > footer.is-logo-centre div { display: flex !important; gap: 14px !important; order: 2 !important; } .tla-ph-trust-website > footer.is-logo-centre img { order: 1 !important; width: min(188px,54%) !important; } .tla-ph-trust-website > footer.is-logo-left div { display: flex !important; gap: 13px !important; margin-left: auto !important; } .tla-ph-trust-showcase-controls { align-items: center !important; background: #fff !important; border-top: 1px solid #e1e6ef !important; display: flex !important; justify-content: space-between !important; min-height: 52px !important; padding: 10px 16px !important; position: relative !important; border-radius: 0 0 24px 24px !important; z-index: 4 !important; } .tla-ph-trust-showcase-controls > strong { color: #323a50 !important; font-size: 10px !important; } .tla-ph-trust-showcase-controls > div { display: flex !important; gap: 7px !important; } .tla-ph-trust-showcase-controls button { background: #cfd6e3 !important; border: 0 !important; border-radius: 999px !important; cursor: pointer !important; height: 8px !important; padding: 0 !important; transition: background .2s ease,width .2s ease !important; width: 8px !important; } .tla-ph-trust-showcase-controls button.is-active { background: linear-gradient(90deg,#df29d3,#0a90f6) !important; width: 24px !important; } .tla-ph-trust-showcase-controls button:focus-visible { outline: 3px solid rgba(10,144,246,.3) !important; outline-offset: 3px !important; } @media (max-width: 620px) { .tla-ph-market-trusted-lockup { max-width: 230px !important; } .tla-ph-trust-rotator { min-height: 465px !important; } .tla-ph-trust-website > header { align-items: flex-start !important; min-height: 96px !important; padding: 14px 16px !important; } .tla-ph-trust-website > header nav { display: none !important; } .tla-ph-trust-demo-hero { min-height: 250px !important; padding: 34px 22px !important; } .tla-ph-trust-website > footer { min-height: 119px !important; padding: 15px 16px !important; } .tla-ph-trust-website > footer img { max-height: 66px !important; width: min(156px,48%) !important; } .tla-ph-trust-website > footer.is-logo-left div { align-items: flex-end !important; flex-direction: column !important; gap: 2px !important; } } @media (prefers-reduced-motion: reduce) { .tla-ph-trust-website, .tla-ph-trust-showcase-controls button { transition: none !important; } } /* ===================================================================== 0.9.41 FOUR-SITE LIGHT/DARK TRUSTED PARTNER SHOWCASE ===================================================================== */ .tla-ph-trust-rotator { min-height: 520px !important; } .tla-ph-trust-website.is-agency-alt { --tla-demo-accent:#087e8b; --tla-demo-accent-2:#17b2e2; } .tla-ph-trust-website.is-housing-law { --tla-demo-accent:#9b2c74; --tla-demo-accent-2:#df29d3; } .tla-ph-trust-website > footer { min-height: 184px !important; padding: 20px 24px !important; } .tla-ph-trust-footer-copy { flex: 1 1 145px !important; min-width: 110px !important; } .tla-ph-trust-footer-points { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 6px 14px !important; } .tla-ph-trust-mark { align-items: flex-start !important; display: grid !important; flex: 0 1 350px !important; gap: 7px !important; justify-items: start !important; max-width: 100% !important; min-width: 0 !important; } .tla-ph-trust-mark > span { color: #3f4962 !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .11em !important; line-height: 1.25 !important; text-transform: uppercase !important; } .tla-ph-trust-website > footer .tla-ph-trust-mark > img, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark > img { display: block !important; height: auto !important; margin: 0 !important; max-height: 142px !important; max-width: 100% !important; object-fit: contain !important; object-position: left center !important; order: initial !important; width: min(340px,100%) !important; } .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark { justify-items: end !important; margin-left: auto !important; text-align: right !important; } .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark > img { object-position: right center !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark { display: grid !important; flex: 0 1 350px !important; gap: 7px !important; margin: 0 !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-footer-points { margin-left: auto !important; } .tla-ph-trust-website > footer.is-logo-centre { gap: 10px !important; min-height: 184px !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { display: grid !important; flex: 0 1 auto !important; gap: 7px !important; justify-items: center !important; order: 1 !important; text-align: center !important; width: 100% !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark > img { object-position: center !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-footer-points { display: flex !important; flex: 0 0 auto !important; gap: 14px !important; order: 2 !important; } /* Dark partner sites use the production white Trusted Partner artwork. */ .tla-ph-trust-website.is-dark-site { background:#06091a !important; color:#fff !important; } .tla-ph-trust-website.is-dark-site > header { background:#080b1d !important; border-bottom-color:rgba(255,255,255,.11) !important; } .tla-ph-trust-website.is-dark-site .tla-ph-trust-demo-brand strong { color:#fff !important; } .tla-ph-trust-website.is-dark-site .tla-ph-trust-demo-brand small, .tla-ph-trust-website.is-dark-site > header nav span { color:#bac2d9 !important; } .tla-ph-trust-website.is-dark-site .tla-ph-trust-demo-hero { background: radial-gradient(circle at 86% 18%,rgba(223,41,211,.24),transparent 34%), linear-gradient(135deg,#080b1f,#151b42 72%) !important; } .tla-ph-trust-website.is-dark-site .tla-ph-trust-demo-hero small { color:#70dfff !important; } .tla-ph-trust-website.is-dark-site .tla-ph-trust-demo-hero h3 { color:#fff !important; } .tla-ph-trust-website.is-dark-site > footer { background:#040716 !important; border-top-color:rgba(255,255,255,.11) !important; } .tla-ph-trust-website.is-dark-site > footer strong, .tla-ph-trust-website.is-dark-site > footer .tla-ph-trust-mark > span { color:#fff !important; } .tla-ph-trust-website.is-dark-site > footer small, .tla-ph-trust-website.is-dark-site > footer .tla-ph-trust-footer-points > span { color:#bac2d9 !important; } @media (max-width: 620px) { .tla-ph-trust-rotator { min-height: 580px !important; } .tla-ph-trust-website > footer, .tla-ph-trust-website > footer.is-logo-centre { align-items: flex-start !important; flex-direction: column !important; gap: 11px !important; min-height: 234px !important; padding: 17px 18px !important; text-align: left !important; } .tla-ph-trust-footer-copy { flex: 0 0 auto !important; } .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { flex: 0 0 auto !important; justify-items: start !important; margin: 0 !important; text-align: left !important; width: 100% !important; } .tla-ph-trust-website > footer .tla-ph-trust-mark > img, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark > img { max-height: 118px !important; object-position: left center !important; width: min(270px,82vw) !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-footer-points, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-footer-points { margin: 0 !important; } } /* ===================================================================== 0.9.42 VISIBLE-ARTWORK CROP AND 2X TRUST MARK SCALE The production PNG canvas is 1600x800 while the painted artwork occupies roughly 1146x552. This viewport removes that transparent safety area at render time, preserving the official files while making the mark itself more than twice as large as the pre-0.9.42 visible treatment. ===================================================================== */ .tla-ph-trust-rotator { min-height: 670px !important; } .tla-ph-trust-website > footer, .tla-ph-trust-website > footer.is-logo-centre { align-items: flex-start !important; flex-direction: column !important; gap: 12px !important; min-height: 334px !important; padding: 22px 26px !important; } .tla-ph-trust-website > footer.is-logo-right { align-items: flex-end !important; text-align: right !important; } .tla-ph-trust-website > footer.is-logo-centre { align-items: center !important; text-align: center !important; } .tla-ph-trust-website > footer.is-logo-left { align-items: flex-start !important; text-align: left !important; } .tla-ph-trust-footer-copy { flex: 0 0 auto !important; } .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { display: grid !important; flex: 0 0 auto !important; gap: 8px !important; margin: 0 !important; max-width: 100% !important; width: 100% !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark { justify-items: start !important; } .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark { justify-items: end !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { justify-items: center !important; } .tla-ph-trust-mark > .tla-ph-trust-mark-label { color: #303b56 !important; display: block !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .12em !important; line-height: 1.25 !important; text-transform: uppercase !important; } .tla-ph-trust-logo-viewport { aspect-ratio: 1146 / 552 !important; display: block !important; flex: none !important; height: auto !important; max-width: 100% !important; overflow: hidden !important; position: relative !important; width: min(500px,100%) !important; } .tla-ph-trust-website > footer .tla-ph-trust-logo-viewport > img, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-logo-viewport > img { display: block !important; height: auto !important; left: 50% !important; margin: 0 !important; max-height: none !important; max-width: none !important; object-fit: initial !important; order: initial !important; position: absolute !important; top: 50% !important; transform: translate(-52%,-48%) !important; width: 139.62% !important; } .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-logo-viewport { margin-left: auto !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-logo-viewport { margin-inline: auto !important; } .tla-ph-trust-website.is-dark-site > footer .tla-ph-trust-mark-label { color: #fff !important; } .tla-ph-trust-website > footer .tla-ph-trust-footer-points { flex: 0 0 auto !important; margin: 0 !important; order: initial !important; } @media (max-width: 620px) { .tla-ph-trust-rotator { min-height: 700px !important; } .tla-ph-trust-website > footer, .tla-ph-trust-website > footer.is-logo-centre { min-height: 354px !important; padding: 18px !important; } .tla-ph-trust-logo-viewport { width: min(390px,100%) !important; } .tla-ph-trust-mark > .tla-ph-trust-mark-label { font-size: 9px !important; } } /* Partner news, announcements and events — 0.9.43 */ .tla-ph-update-workspace{color:var(--tla-ph-text)} .tla-ph-update-workspace-hero{align-items:center;background:linear-gradient(135deg,var(--tla-ph-surface),var(--tla-ph-pastel-blue));display:flex;justify-content:space-between}.tla-ph-update-workspace-hero>div{max-width:760px} .tla-ph-update-stats{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 20px}.tla-ph-update-stats>div{align-items:center;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:18px;box-shadow:0 10px 30px rgba(21,18,70,.05);display:grid;gap:4px;grid-template-columns:46px 1fr auto;padding:16px 18px}.tla-ph-update-stats .dashicons{align-items:center;background:linear-gradient(135deg,rgba(223,41,211,.12),rgba(10,144,246,.14));border-radius:13px;color:var(--tla-ph-blue);display:flex;font-size:22px;height:46px;justify-content:center;width:46px}.tla-ph-update-stats small{color:var(--tla-ph-muted);font-size:.72rem;font-weight:750}.tla-ph-update-stats strong{font-size:26px} .tla-ph-update-editor-layout{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1.75fr) minmax(260px,.65fr)}.tla-ph-update-editor{overflow:hidden;padding:0!important}.tla-ph-update-editor-heading{align-items:flex-start;border-bottom:1px solid var(--tla-ph-border);display:flex;gap:18px;justify-content:space-between;padding:clamp(20px,3vw,30px)}.tla-ph-update-editor-heading h2{margin:5px 0 7px}.tla-ph-update-editor-heading p{color:var(--tla-ph-muted);font-size:.78rem;margin:0;max-width:620px} .tla-ph-update-form-section{border-bottom:1px solid var(--tla-ph-border);padding:clamp(20px,3vw,30px)}.tla-ph-update-form-section>header{align-items:flex-start;display:flex;gap:13px;margin-bottom:20px}.tla-ph-update-form-section>header>span{align-items:center;background:linear-gradient(135deg,#df29d3,#0a90f6);border-radius:10px;color:#fff;display:flex;flex:0 0 34px;font-size:.68rem;font-weight:900;height:34px;justify-content:center}.tla-ph-update-form-section>header h3{font-size:18px;margin:0 0 4px}.tla-ph-update-form-section>header p{color:var(--tla-ph-muted);font-size:.72rem;line-height:1.55;margin:0} .tla-ph-update-type-grid{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:18px}.tla-ph-update-type-grid label{cursor:pointer}.tla-ph-update-type-grid input{opacity:0;position:absolute}.tla-ph-update-type-grid label>span{align-items:center;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:15px;display:flex;gap:10px;min-height:62px;padding:12px 14px;transition:.18s ease}.tla-ph-update-type-grid i{align-items:center;background:var(--tla-ph-surface);border-radius:10px;color:var(--tla-ph-blue);display:flex;height:36px;justify-content:center;width:36px}.tla-ph-update-type-grid strong{font-size:.78rem}.tla-ph-update-type-grid input:checked+span{background:linear-gradient(135deg,rgba(223,41,211,.08),rgba(10,144,246,.1));border-color:rgba(10,144,246,.5);box-shadow:0 0 0 3px rgba(10,144,246,.08)} .tla-ph-update-form-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-update-form-grid .tla-ph-field-full{grid-column:1/-1}.tla-ph-update-form-grid .tla-ph-form-field>label{display:block;font-size:.72rem;font-weight:800;margin-bottom:7px}.tla-ph-update-form-grid .tla-ph-input,.tla-ph-update-form-grid .tla-ph-textarea{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:13px;color:var(--tla-ph-text);font-size:.82rem;line-height:1.55;padding:12px 14px;width:100%}.tla-ph-update-form-grid .tla-ph-input:focus,.tla-ph-update-form-grid .tla-ph-textarea:focus{border-color:var(--tla-ph-blue);box-shadow:0 0 0 3px rgba(10,144,246,.1);outline:0}.tla-ph-update-body{min-height:250px;resize:vertical}.tla-ph-update-form-grid .tla-ph-field-help{color:var(--tla-ph-muted);font-size:.68rem;line-height:1.5;margin:6px 0 0} .tla-ph-update-media-grid{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-update-upload{align-items:center;background:var(--tla-ph-soft);border:1px dashed rgba(10,144,246,.45);border-radius:16px;cursor:pointer;display:grid;gap:5px;grid-template-columns:44px 1fr;padding:16px}.tla-ph-update-upload>.dashicons{align-items:center;background:var(--tla-ph-surface);border-radius:12px;color:var(--tla-ph-blue);display:flex;grid-row:1/3;height:44px;justify-content:center;width:44px}.tla-ph-update-upload strong{font-size:.77rem}.tla-ph-update-upload small{color:var(--tla-ph-muted);font-size:.65rem}.tla-ph-update-upload input{font-size:.68rem;grid-column:1/-1;margin-top:8px;width:100%}.tla-ph-update-current-image{align-items:center;background:var(--tla-ph-soft);border-radius:14px;display:flex;gap:14px;margin-top:14px;padding:12px}.tla-ph-update-current-image img{border-radius:10px;height:74px;object-fit:cover;width:110px}.tla-ph-update-current-image span{color:var(--tla-ph-muted);font-size:.7rem}.tla-ph-update-current-files{background:var(--tla-ph-soft);border-radius:14px;display:grid;gap:8px;margin-top:14px;padding:14px}.tla-ph-update-current-files>strong{font-size:.74rem}.tla-ph-update-current-files label{align-items:center;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:10px;display:grid;font-size:.7rem;gap:8px;grid-template-columns:auto 1fr auto;padding:9px 11px}.tla-ph-update-current-files small{color:#b4233c} .tla-ph-update-active{margin:20px clamp(20px,3vw,30px) 0}.tla-ph-update-form-actions{align-items:center;display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;padding:20px clamp(20px,3vw,30px) clamp(20px,3vw,30px)}.tla-ph-update-form-actions>div{align-items:center;display:flex;gap:10px;margin-right:auto;max-width:420px}.tla-ph-update-form-actions>div>.dashicons{color:var(--tla-ph-blue)}.tla-ph-update-form-actions p{color:var(--tla-ph-muted);font-size:.67rem;line-height:1.45;margin:0}.tla-ph-update-form-actions p strong{color:var(--tla-ph-heading);display:block} .tla-ph-update-guidance{display:grid;gap:16px;position:sticky;top:105px}.tla-ph-update-guidance .tla-ph-workspace-panel{margin:0}.tla-ph-update-guidance h2{font-size:18px}.tla-ph-update-guidance ol,.tla-ph-update-guidance ul{display:grid;gap:12px;list-style:none;margin:18px 0 0;padding:0}.tla-ph-update-guidance li{align-items:flex-start;color:var(--tla-ph-muted);display:flex;font-size:.7rem;gap:10px;line-height:1.5}.tla-ph-update-guidance ol li>span{align-items:center;background:var(--tla-ph-pastel-blue);border-radius:50%;color:var(--tla-ph-blue);display:flex;flex:0 0 28px;font-weight:900;height:28px;justify-content:center}.tla-ph-update-guidance li strong{color:var(--tla-ph-heading);display:block}.tla-ph-update-guidance li p{margin:2px 0 0}.tla-ph-update-guidance ul li:before{color:#008b62;content:'✓';font-weight:900} .tla-ph-update-library{margin-top:20px}.tla-ph-update-library-head{align-items:center;display:flex;justify-content:space-between}.tla-ph-update-library-head h2{margin:4px 0 0}.tla-ph-update-library-head>span{background:var(--tla-ph-soft);border-radius:999px;color:var(--tla-ph-muted);font-size:.7rem;font-weight:800;padding:7px 11px}.tla-ph-update-library-grid{display:grid;gap:14px;margin-top:20px}.tla-ph-update-library-grid>article{align-items:center;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:16px;display:grid;gap:16px;grid-template-columns:150px minmax(0,1fr) auto;overflow:hidden;padding:10px}.tla-ph-update-library-image{align-items:center;background:linear-gradient(135deg,var(--tla-ph-pastel-violet),var(--tla-ph-pastel-blue));border-radius:12px;display:flex;height:108px;justify-content:center;overflow:hidden}.tla-ph-update-library-image img{height:100%;object-fit:cover;width:100%}.tla-ph-update-library-image>.dashicons{color:var(--tla-ph-blue);font-size:32px;height:32px;width:32px}.tla-ph-update-library-copy>div{align-items:center;display:flex;gap:7px}.tla-ph-update-library-copy>div>small{color:var(--tla-ph-muted);font-size:.65rem}.tla-ph-update-library-copy h3{font-size:16px;margin:8px 0 4px}.tla-ph-update-library-copy p{color:var(--tla-ph-muted);font-size:.7rem;line-height:1.5;margin:0 0 5px}.tla-ph-update-library-copy>small{color:var(--tla-ph-muted-light);font-size:.63rem}.tla-ph-update-library-actions{display:flex;flex-direction:column;gap:5px}.tla-ph-update-library-actions a,.tla-ph-update-library-actions button{align-items:center;background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:9px;color:var(--tla-ph-text);cursor:pointer;display:flex;font-size:.68rem;font-weight:750;gap:5px;padding:8px 10px;text-decoration:none;width:100%}.tla-ph-update-library-actions button{color:#b4233c}.tla-ph-update-library-actions .dashicons{font-size:15px;height:15px;width:15px}.tla-ph-update-empty{align-items:center;background:var(--tla-ph-soft);border:1px dashed var(--tla-ph-border);border-radius:16px;display:flex;flex-direction:column;margin-top:18px;padding:34px;text-align:center}.tla-ph-update-empty>.dashicons{color:var(--tla-ph-blue);font-size:34px;height:34px;width:34px}.tla-ph-update-empty strong{margin-top:10px}.tla-ph-update-empty p{color:var(--tla-ph-muted);font-size:.72rem} .tla-ph-profile-update-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.tla-ph-profile-update-grid>article{background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:17px;overflow:hidden}.tla-ph-profile-update-image{align-items:center;background:linear-gradient(135deg,rgba(223,41,211,.12),rgba(10,144,246,.15));display:flex;height:170px;justify-content:center}.tla-ph-profile-update-image img{height:100%;object-fit:cover;width:100%}.tla-ph-profile-update-image>.dashicons{color:var(--tla-ph-blue);font-size:42px;height:42px;width:42px}.tla-ph-profile-update-copy{padding:18px}.tla-ph-profile-update-meta{align-items:center;display:flex;flex-wrap:wrap;gap:7px}.tla-ph-profile-update-meta span{background:rgba(10,144,246,.1);border-radius:999px;color:var(--tla-ph-blue);font-size:.62rem;font-weight:850;padding:4px 8px;text-transform:uppercase}.tla-ph-profile-update-meta time,.tla-ph-profile-update-meta small{color:var(--tla-ph-muted);font-size:.64rem}.tla-ph-profile-update-meta small{background:#fff4dc;border-radius:999px;color:#8b5b00;padding:3px 7px}.tla-ph-profile-update-copy h3{font-size:18px;margin:10px 0 6px}.tla-ph-profile-update-copy>p{color:var(--tla-ph-muted);font-size:.73rem;line-height:1.6}.tla-ph-profile-update-link{color:var(--tla-ph-blue);font-size:.72rem;font-weight:800;text-decoration:none}.tla-ph-profile-event-detail{align-items:center;background:var(--tla-ph-surface);border-radius:10px;display:grid;gap:2px;grid-template-columns:28px 1fr;margin:12px 0;padding:10px}.tla-ph-profile-event-detail>.dashicons{color:var(--tla-ph-blue);grid-row:1/3}.tla-ph-profile-event-detail strong{font-size:.68rem}.tla-ph-profile-event-detail small{color:var(--tla-ph-muted);font-size:.63rem} .tla-ph-update-source,.tla-ph-update-event-summary,.tla-ph-update-downloads{border:1px solid var(--tla-ph-border);border-radius:16px;margin:18px 0;padding:16px 18px}.tla-ph-update-source{background:linear-gradient(135deg,var(--tla-ph-pastel-violet),var(--tla-ph-pastel-blue));display:grid;gap:4px}.tla-ph-update-source span{color:var(--tla-ph-blue);font-size:.68rem;font-weight:850;text-transform:uppercase}.tla-ph-update-source strong{font-size:18px}.tla-ph-update-source a{color:var(--tla-ph-blue);font-size:.72rem;font-weight:800;margin-top:4px}.tla-ph-update-event-summary{background:var(--tla-ph-soft);display:flex;flex-wrap:wrap;gap:10px 18px}.tla-ph-update-event-summary strong{width:100%}.tla-ph-update-event-summary span{color:var(--tla-ph-muted);font-size:.8rem}.tla-ph-update-downloads{display:grid;gap:8px}.tla-ph-update-downloads>a{align-items:center;background:var(--tla-ph-soft);border-radius:10px;color:var(--tla-ph-blue);display:flex;font-size:.75rem;font-weight:750;gap:7px;padding:10px;text-decoration:none} @media(max-width:980px){.tla-ph-update-editor-layout{grid-template-columns:1fr}.tla-ph-update-guidance{grid-template-columns:repeat(2,minmax(0,1fr));position:static}.tla-ph-update-library-grid>article{grid-template-columns:120px minmax(0,1fr)}.tla-ph-update-library-actions{flex-direction:row;grid-column:1/-1}.tla-ph-update-library-actions form{display:inline-flex}} @media(max-width:700px){.tla-ph-update-workspace-hero{align-items:flex-start;flex-direction:column}.tla-ph-update-stats{grid-template-columns:1fr}.tla-ph-update-type-grid,.tla-ph-update-form-grid,.tla-ph-update-media-grid,.tla-ph-update-guidance,.tla-ph-profile-update-grid{grid-template-columns:1fr}.tla-ph-update-editor-heading{flex-direction:column}.tla-ph-update-library-grid>article{align-items:start;grid-template-columns:84px minmax(0,1fr)}.tla-ph-update-library-image{height:84px}.tla-ph-update-library-actions{grid-column:1/-1;overflow-x:auto}.tla-ph-update-form-actions{align-items:stretch;flex-direction:column}.tla-ph-update-form-actions>div{margin:0 0 5px}.tla-ph-update-form-actions .tla-ph-frontend-button{justify-content:center;width:100%}} .tla-ph-update-current-image label{color:#b4233c;display:block;font-size:.66rem;font-weight:750;margin-top:7px} /* ===================================================================== 0.9.44 COMPACT, CONTENT-HEIGHT PARTNER WEBSITE FOOTERS The four animated examples now take their height from the active slide instead of reserving a fixed canvas. The production badge artwork begins at the top-left of its transparent PNG, so the crop is anchored there. ===================================================================== */ .tla-ph-trust-rotator { min-height: 0 !important; } .tla-ph-trust-website { bottom: auto !important; left: 0 !important; right: 0 !important; top: 0 !important; width: 100% !important; } .tla-ph-trust-website.is-active { position: relative !important; } .tla-ph-trust-website > footer, .tla-ph-trust-website > footer.is-logo-centre { align-items: center !important; flex-direction: row !important; gap: 18px !important; justify-content: space-between !important; min-height: 0 !important; padding: 16px 22px !important; } .tla-ph-trust-website > footer.is-logo-left { align-items: center !important; text-align: left !important; } .tla-ph-trust-website > footer.is-logo-right { align-items: center !important; text-align: right !important; } .tla-ph-trust-website > footer.is-logo-centre { flex-direction: column !important; gap: 7px !important; justify-content: center !important; padding-block: 14px !important; text-align: center !important; } .tla-ph-trust-footer-copy { flex: 1 1 160px !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark { flex: 0 1 500px !important; width: min(500px,70%) !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { width: min(500px,100%) !important; } .tla-ph-trust-logo-viewport { width: min(500px,100%) !important; } .tla-ph-trust-website > footer .tla-ph-trust-logo-viewport > img, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-logo-viewport > img { left: 0 !important; top: 0 !important; transform: none !important; } .tla-ph-trust-website > footer .tla-ph-trust-footer-points { flex: 0 1 auto !important; } @media (max-width: 620px) { .tla-ph-trust-rotator { min-height: 0 !important; } .tla-ph-trust-website > footer, .tla-ph-trust-website > footer.is-logo-centre, .tla-ph-trust-website > footer.is-logo-left, .tla-ph-trust-website > footer.is-logo-right { align-items: flex-start !important; flex-direction: column !important; gap: 8px !important; min-height: 0 !important; padding: 14px 16px !important; text-align: left !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { justify-items: start !important; width: 100% !important; } .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-logo-viewport, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-logo-viewport { margin-left: 0 !important; margin-right: auto !important; } .tla-ph-trust-logo-viewport { width: min(390px,100%) !important; } } /* ===================================================================== 0.9.45 STRICT COMPACT SHOWCASE FOOTER GRID This final override deliberately follows every historical showcase rule. Explicit grid tracks prevent legacy flex declarations from stretching the centred legal examples or pushing their supporting points to the bottom. ===================================================================== */ .tla-ph-trust-website > footer, .tla-ph-trust-website > footer.is-logo-left, .tla-ph-trust-website > footer.is-logo-right, .tla-ph-trust-website > footer.is-logo-centre { align-content: center !important; height: auto !important; max-height: none !important; min-height: 0 !important; padding: 14px 20px !important; } .tla-ph-trust-website > footer.is-logo-right { align-items: center !important; display: grid !important; gap: 16px !important; grid-template-columns: minmax(0,1fr) minmax(260px,360px) !important; } .tla-ph-trust-website > footer.is-logo-left { align-items: center !important; display: grid !important; gap: 16px !important; grid-template-columns: minmax(260px,360px) minmax(0,1fr) !important; } .tla-ph-trust-website > footer.is-logo-centre { align-items: center !important; display: grid !important; gap: 6px !important; grid-template-columns: minmax(0,1fr) !important; justify-items: center !important; } .tla-ph-trust-footer-copy, .tla-ph-trust-footer-points, .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { align-self: center !important; height: auto !important; margin-block: 0 !important; max-height: none !important; min-height: 0 !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark { flex: none !important; width: min(360px,100%) !important; } .tla-ph-trust-logo-viewport { aspect-ratio: 1146 / 552 !important; height: auto !important; max-height: none !important; min-height: 0 !important; width: min(360px,100%) !important; } .tla-ph-trust-website > footer .tla-ph-trust-logo-viewport > img, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-logo-viewport > img { left: 0 !important; top: 0 !important; transform: none !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-footer-points { justify-content: center !important; margin: 0 !important; } @media (max-width: 620px) { .tla-ph-trust-website > footer.is-logo-left, .tla-ph-trust-website > footer.is-logo-right, .tla-ph-trust-website > footer.is-logo-centre { display: grid !important; gap: 7px !important; grid-template-columns: minmax(0,1fr) !important; justify-items: start !important; padding: 12px 14px !important; } .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-footer-points { justify-content: flex-start !important; } .tla-ph-trust-website > footer.is-logo-left .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-right .tla-ph-trust-mark, .tla-ph-trust-website > footer.is-logo-centre .tla-ph-trust-mark, .tla-ph-trust-logo-viewport { width: min(320px,100%) !important; } } /* ===================================================================== 0.9.46 TRUSTED-PARTNER BRAND AND HUB ACTION TYPOGRAPHY The production light/dark lock-up replaces the generic verification glyph. Action typography is deliberately scoped to Partner Hub canvases, so the site's global header retains its own independent design system. ===================================================================== */ .tla-ph-profile-assurance-card { align-items: start !important; display: grid !important; gap: 14px !important; grid-template-columns: minmax(0,1fr) !important; } .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand { aspect-ratio: 1146 / 552 !important; display: block !important; height: auto !important; line-height: 0 !important; max-width: 100% !important; overflow: hidden !important; position: relative !important; width: min(210px,82%) !important; } .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo { height: auto !important; left: 0 !important; margin: 0 !important; max-height: none !important; max-width: none !important; position: absolute !important; top: 0 !important; width: 139.62% !important; } .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo.is-dark { display: none !important; } html[data-tla-theme="dark"] .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo.is-light { display: none !important; } html[data-tla-theme="dark"] .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo.is-dark { display: block !important; } /* Bring anomalous promotional headings back onto the established Hub scale. */ .tla-ph-preview-launcher-copy h2 { font-size: clamp(30px,3vw,42px) !important; letter-spacing: -.04em !important; line-height: 1.08 !important; max-width: 760px !important; } .tla-ph-premium-profile .tla-ph-profile-section .tla-ph-section-heading h2 { font-size: clamp(22px,2.2vw,32px) !important; letter-spacing: -.032em !important; line-height: 1.14 !important; } /* One compact uppercase action label across every Partner Hub surface. */ :where( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :where(button, input[type="button"], input[type="submit"], input[type="reset"], .button, .tla-ph-frontend-button, .tla-ph-network-action-primary, .tla-ph-network-action-secondary, .tla-ph-section-heading > a, .tla-ph-manage-business-link, .tla-ph-property-upload-button, .tla-ph-public-menu__business) { font-weight: 850 !important; letter-spacing: .065em !important; text-transform: uppercase !important; } :where( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :where(.tla-ph-frontend-button, input[type="button"], input[type="submit"], input[type="reset"], button[type="submit"], button[type="button"]:not([aria-label]), .button, .tla-ph-network-action-primary, .tla-ph-network-action-secondary, .tla-ph-manage-business-link, .tla-ph-property-upload-button, .tla-ph-public-menu__business) { font-size: .68rem !important; line-height: 1.15 !important; } :where( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing ) .tla-ph-frontend-button { min-height: 42px !important; padding: 9px 16px !important; } .tla-ph-premium-profile .tla-ph-section-heading > a { align-items: center !important; display: inline-flex !important; font-size: .68rem !important; justify-content: center !important; letter-spacing: .065em !important; line-height: 1.15 !important; min-height: 38px !important; padding: 8px 12px !important; text-transform: uppercase !important; } @media (max-width: 520px) { .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand { width: min(190px,86%) !important; } .tla-ph-preview-launcher-copy h2 { font-size: clamp(28px,9vw,36px) !important; } } /* ===================================================================== 0.9.47 HUB TYPOGRAPHY STANDARD Primary Hub headings use a consistent 32px desktop scale. Every textual Hub button and button-style action uses a uniform 14px uppercase label. The global TLA site header remains outside these scoped selectors. ===================================================================== */ :where( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :where( .tla-ph-workspace-hero h1, .tla-ph-frontend-hero h1, .tla-ph-preview-launcher-copy h2, .tla-ph-profile-identity h1, .tla-ph-public-profile-hero h1, .tla-ph-verification-head h2, .tla-ph-profile-section > .tla-ph-section-heading h2 ) { font-size: 32px !important; line-height: 1.14 !important; } :where( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :where( button:not([aria-label]), input[type="button"], input[type="submit"], input[type="reset"], .button, .tla-ph-frontend-button, .tla-ph-network-action-primary, .tla-ph-network-action-secondary, .tla-ph-section-heading > a, .tla-ph-manage-business-link, .tla-ph-property-upload-button, .tla-ph-public-menu__business ) { font-size: 14px !important; line-height: 1.15 !important; } @media (max-width: 520px) { :where( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :where( .tla-ph-workspace-hero h1, .tla-ph-frontend-hero h1, .tla-ph-preview-launcher-copy h2, .tla-ph-profile-identity h1, .tla-ph-public-profile-hero h1, .tla-ph-verification-head h2, .tla-ph-profile-section > .tla-ph-section-heading h2 ) { font-size: 28px !important; } } /* ===================================================================== 0.9.48 HUB COMPACT TYPOGRAPHY ENFORCEMENT This final, frontend-only design-system layer is the Hub-wide source of truth: every Hub heading is 22px and every textual button/action label is 12px uppercase. The global TLA site header is intentionally out of scope. ===================================================================== */ :is( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :is(h1, h2, h3, h4, h5, h6) { font-size: 22px !important; line-height: 1.2 !important; } :is( .tla-ph-shell, .tla-ph-component, .tla-ph-canonical-main, .tla-ph-partner-app, .tla-ph-public-shell, .tla-ph-premium-profile, .tla-ph-basic-public-listing, .tla-ph-public-pricing, .tla-ph-market-opportunity, .tla-ph-membership-gateway, .tla-ph-claim-page, .tla-ph-directory-route ) :is( button:not([aria-label]), input[type="button"], input[type="submit"], input[type="reset"], [role="button"]:not([aria-label]), .button, a[class*="tla-ph-"][class*="button"], a[class*="tla-ph-"][class*="action"], .tla-ph-public-menu__business ) { font-size: 12px !important; font-weight: 850 !important; letter-spacing: .065em !important; line-height: 1.15 !important; text-transform: uppercase !important; } /* ===================================================================== 0.9.49 MARKET EXPLORER PRODUCTION SAFETY + MOBILE ESSENTIALS Desktop receives an isolated, dimensionally bounded search component. Mobile removes the data explorer and non-essential duplicated marketing sections, leaving the join journey, live plans and account route. ===================================================================== */ .tla-ph-market-opportunity { contain: layout paint !important; isolation: isolate !important; max-width: 100% !important; overflow: hidden !important; width: 100% !important; } .tla-ph-market-opportunity .tla-ph-market-hero, .tla-ph-market-opportunity .tla-ph-market-search-shell, .tla-ph-market-opportunity .tla-ph-market-loading, .tla-ph-market-opportunity .tla-ph-market-error, .tla-ph-market-opportunity .tla-ph-market-results, .tla-ph-market-opportunity .tla-ph-market-saved { max-width: 1280px !important; width: min(1280px, calc(100% - 48px)) !important; } .tla-ph-market-opportunity :is( .tla-ph-market-hero-copy, .tla-ph-market-uk-proof, .tla-ph-market-search-shell, .tla-ph-market-search-intro, .tla-ph-market-form, .tla-ph-market-field, .tla-ph-market-control, .tla-ph-market-refine-grid, .tla-ph-market-refine-grid > *, .tla-ph-market-search-meta, .tla-ph-market-search-meta > * ) { max-width: 100% !important; min-width: 0 !important; } .tla-ph-market-opportunity svg.tla-ph-market-svg { display: block !important; fill: none !important; flex: 0 0 24px !important; height: 24px !important; max-height: 24px !important; max-width: 24px !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; stroke: currentColor !important; stroke-linecap: round !important; stroke-linejoin: round !important; stroke-width: 1.85 !important; width: 24px !important; } .tla-ph-market-opportunity .tla-ph-market-control { overflow: hidden !important; } .tla-ph-market-opportunity .tla-ph-market-control :is(input, select) { max-width: 100% !important; min-width: 0 !important; } @media (min-width: 1121px) { .tla-ph-market-opportunity .tla-ph-market-hero { grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr) !important; } .tla-ph-market-opportunity .tla-ph-market-refine-grid { grid-template-columns: minmax(250px, 1fr) minmax(180px, .48fr) minmax(240px, .65fr) !important; } .tla-ph-market-opportunity .tla-ph-market-submit { grid-column: auto !important; max-width: 100% !important; width: 100% !important; } } @media (min-width: 821px) and (max-width: 1120px) { .tla-ph-market-opportunity .tla-ph-market-refine-grid { grid-template-columns: minmax(0, 1fr) minmax(180px, .55fr) !important; } .tla-ph-market-opportunity .tla-ph-market-submit { grid-column: 1 / -1 !important; width: 100% !important; } } @media (max-width: 820px) { .tla-ph-market-opportunity, .tla-ph-join-hub .tla-ph-frontend-button-audience, .tla-ph-join-hub .tla-ph-audience-cta-hint, .tla-ph-join-hub .tla-ph-join-quick-links, .tla-ph-join-hub .tla-ph-benefit-grid, .tla-ph-join-hub .tla-ph-tier-comparison, .tla-ph-join-hub .tla-ph-sector-opportunities, .tla-ph-join-hub + .tla-ph-trust-brand-showcase, .tla-ph-trust-brand-showcase { display: none !important; } .tla-ph-join-hub .tla-ph-shell-inner { padding-inline: 14px !important; } .tla-ph-join-hub .tla-ph-join-hero { gap: 18px !important; margin-block: 16px 22px !important; padding: 22px 18px !important; } .tla-ph-join-hub .tla-ph-join-trust { display: none !important; } .tla-ph-join-hub .tla-ph-join-primary-actions { display: grid !important; gap: 10px !important; grid-template-columns: 1fr !important; } .tla-ph-join-hub .tla-ph-join-primary-actions .tla-ph-frontend-button { min-height: 44px !important; width: 100% !important; } .tla-ph-join-hub .tla-ph-join-onboarding-grid { gap: 10px !important; grid-template-columns: 1fr !important; margin-block: 0 24px !important; } } /* Version 0.9.51 — verification upload availability and dual progress. */ .tla-ph-verification-progress{background:var(--tla-ph-surface);border:1px solid var(--tla-ph-border);border-radius:15px;margin:0 0 14px;padding:14px 16px}.tla-ph-verification-progress small{color:var(--tla-ph-muted);display:block;font-size:.7rem;font-weight:750;margin-top:8px}.tla-ph-verification-progress .tla-ph-progress-track{height:9px} /* 0.9.53: central join page publishes only live, checkout-ready sectors. */ .tla-ph-public-pricing.is-central .tla-ph-pricing-intro{padding:26px 30px} .tla-ph-public-pricing.is-central .tla-ph-pricing-intro h2{font-size:clamp(30px,3.4vw,44px)} .tla-ph-public-pricing.is-central .tla-ph-pricing-intro p{font-size:16px;line-height:1.55} .tla-ph-public-pricing.is-central .tla-ph-pricing-sector-index{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin:16px 0 12px} .tla-ph-public-pricing.is-central .tla-ph-pricing-sector-index a{min-height:0;padding:14px 16px} .tla-ph-pricing-general-enquiry{align-items:center;background:var(--tla-ph-soft);border:1px solid var(--tla-ph-border);border-radius:18px;display:flex;gap:24px;justify-content:space-between;margin:12px 0 22px;padding:18px 20px} .tla-ph-pricing-general-enquiry>div{max-width:780px} .tla-ph-pricing-general-enquiry strong{color:var(--tla-ph-heading);display:block;font-size:20px;line-height:1.25;margin:4px 0} .tla-ph-pricing-general-enquiry p{color:var(--tla-ph-muted);font-size:14px;line-height:1.55;margin:0} .tla-ph-pricing-general-enquiry .tla-ph-frontend-button{flex:0 0 auto;white-space:nowrap} @media(max-width:760px){.tla-ph-pricing-general-enquiry{align-items:stretch;flex-direction:column}.tla-ph-pricing-general-enquiry .tla-ph-frontend-button{justify-content:center;width:100%}} /* ===================================================================== 0.9.69 JOIN PAGE MOBILE CORRECTION Scoped to the public Partner Hub join page. This corrects the compact header lockup and hero/action layout without changing any Partner Hub, onboarding, CRM or listing functionality. ===================================================================== */ body.tla-ph-join-partner-page { overflow-x: clip !important; } body.tla-ph-join-partner-page .tla-ph-join-header-shell, body.tla-ph-join-partner-page .tla-ph-join-header-shell > .elementor-container, body.tla-ph-join-partner-page .tla-ph-join-header-shell > .e-con-inner { min-width: 0 !important; } @media (max-width: 820px) { body.tla-ph-join-partner-page .tla-ph-join-header-shell { align-items: center !important; gap: 8px !important; overflow: visible !important; } body.tla-ph-join-partner-page .tla-ph-join-brand-lockup { flex: 1 1 auto !important; max-width: calc(100vw - 170px) !important; overflow: hidden !important; } body.tla-ph-join-partner-page .tla-ph-join-brand-label { max-width: 100% !important; overflow: hidden !important; } body.tla-ph-join-partner-page .tla-ph-join-trusted-brand-logo { height: auto !important; max-height: 42px !important; max-width: 165px !important; width: min(165px, 100%) !important; } body.tla-ph-join-partner-page .tla-ph-join-hub { font-size: 16px !important; line-height: 1.55 !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-shell-inner { max-width: 100% !important; padding-inline: 14px !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-join-hero { border-radius: 22px !important; gap: 16px !important; margin: 12px 0 20px !important; padding: 24px 20px !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-join-hero h1, body.tla-ph-join-partner-page main .tla-ph-join-hero h1, body.tla-ph-join-partner-page .elementor .tla-ph-join-hero h1 { font-size: clamp(32px, 8.6vw, 42px) !important; letter-spacing: -0.045em !important; line-height: 1.04 !important; margin: 12px 0 18px !important; max-width: 100% !important; overflow-wrap: normal !important; text-wrap: balance !important; word-break: normal !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-join-hero p { font-size: 16px !important; line-height: 1.58 !important; margin-bottom: 0 !important; max-width: 100% !important; } body.tla-ph-join-partner-page .tla-ph-join-primary-actions { display: grid !important; gap: 10px !important; grid-template-columns: 1fr !important; width: 100% !important; } body.tla-ph-join-partner-page .tla-ph-join-primary-actions .tla-ph-frontend-button { font-size: 13px !important; justify-content: center !important; min-height: 50px !important; padding: 12px 16px !important; white-space: normal !important; width: 100% !important; } } @media (max-width: 480px) { body.tla-ph-join-partner-page .tla-ph-join-brand-lockup { max-width: calc(100vw - 146px) !important; } body.tla-ph-join-partner-page .tla-ph-join-trusted-brand-logo { max-height: 36px !important; max-width: 138px !important; width: min(138px, 100%) !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-join-hero { border-radius: 18px !important; padding: 20px 16px !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-join-hero h1, body.tla-ph-join-partner-page main .tla-ph-join-hero h1, body.tla-ph-join-partner-page .elementor .tla-ph-join-hero h1 { font-size: clamp(29px, 8.9vw, 36px) !important; line-height: 1.06 !important; } body.tla-ph-join-partner-page .tla-ph-join-hub .tla-ph-join-hero p { font-size: 15.5px !important; line-height: 1.55 !important; } } /* ===================================================================== BUSINESS TYPE SELECTOR (v0.9.75) Member-facing control that determines which Hub they see. ===================================================================== */ .tla-ph-business-type-card { background: #fff; border: 1px solid rgba(10,144,246,.14); border-radius: 20px; box-shadow: 0 18px 44px rgba(1,47,112,.08); padding: clamp(22px,3vw,34px); margin: 0 0 24px; } .tla-ph-business-type-card header { margin-bottom: 18px; } .tla-ph-business-type-card .tla-ph-eyebrow { display: block; color: #0877ca; font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 6px; } .tla-ph-business-type-card h2 { margin: 0 0 8px; color: #07152f; } .tla-ph-business-type-card p { margin: 0; color: #5d6478; line-height: 1.6; } .tla-ph-business-type-current { margin: 0 0 18px !important; padding: 12px 16px; background: #f2f7ff; border-left: 4px solid #0a90f6; border-radius: 10px; color: #252742 !important; } .tla-ph-business-type-card form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; } .tla-ph-business-type-card label { display: block; width: 100%; margin-bottom: 2px; color: #18243c; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; } .tla-ph-business-type-card select { flex: 1 1 260px; min-height: 52px; padding: 0 16px; border: 1px solid #d9e2f0; border-radius: 12px; background: #f5f8fc; color: #111a2e; font-size: 15px; } .tla-ph-business-type-card select:focus { outline: 0; background: #fff; border-color: #0a90f6; box-shadow: 0 0 0 4px rgba(10,144,246,.12); } .tla-ph-business-type-card button { flex: 0 0 auto; min-height: 52px; padding: 0 24px; border: 1px solid #cbd5e1 !important; border-radius: 12px; background: #f8fafc !important; color: #111827 !important; font-weight: 800; cursor: pointer; } .tla-ph-business-type-card button:hover, .tla-ph-business-type-card button:focus, .tla-ph-business-type-card button:active, .tla-ph-business-type-card button:visited { border-color: #94a3b8 !important; background: #e2e8f0 !important; color: #111827 !important; transform: translateY(-1px); } .tla-ph-business-type-preview { margin-top: 20px; padding-top: 18px; border-top: 1px solid #e6ebf3; } .tla-ph-business-type-preview strong { display: block; color: #07152f; margin-bottom: 6px; } .tla-ph-business-type-preview ul { margin: 10px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 10px; } .tla-ph-business-type-preview li a { display: inline-block; padding: 8px 14px; border: 1px solid rgba(10,144,246,.2); border-radius: 999px; background: #f2f7ff; color: #0a75d8; font-size: 13px; font-weight: 700; text-decoration: none; } @media (max-width: 600px) { .tla-ph-business-type-card select, .tla-ph-business-type-card button { flex: 1 1 100%; } } /* ===================================================================== BUSINESS TYPE PROFILE FIELDS (v0.9.78) ===================================================================== */ .tla-ph-profile-fields-card { background: #fff; border: 1px solid rgba(10,144,246,.14); border-radius: 20px; box-shadow: 0 18px 44px rgba(1,47,112,.08); padding: clamp(22px,3vw,34px); margin: 0 0 24px; } .tla-ph-profile-fields-card header { margin-bottom: 16px; } .tla-ph-profile-fields-card h2 { margin: 0 0 8px; color: #07152f; } .tla-ph-profile-fields-card header p { margin: 0; color: #5d6478; line-height: 1.6; } .tla-ph-profile-progress { height: 8px; background: #eef2f8; border-radius: 999px; overflow: hidden; margin-bottom: 6px; } .tla-ph-profile-progress-bar { height: 100%; background: linear-gradient(90deg,#0a90f6,#17b2e2); border-radius: 999px; transition: width .3s ease; } .tla-ph-profile-progress-label { margin: 0 0 20px !important; color: #5d6478; font-size: 13px; font-weight: 700; } .tla-ph-profile-fields-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 16px; margin-bottom: 20px; } .tla-ph-profile-field.is-wide { grid-column: 1 / -1; } .tla-ph-profile-field label { display: block; margin-bottom: 6px; color: #18243c; font-size: 12px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; } .tla-ph-required { color: #d64545; margin-left: 3px; } .tla-ph-profile-field input[type="text"], .tla-ph-profile-field input[type="email"], .tla-ph-profile-field input[type="url"], .tla-ph-profile-field input[type="tel"], .tla-ph-profile-field input[type="number"], .tla-ph-profile-field select, .tla-ph-profile-field textarea { width: 100%; padding: 12px 14px; border: 1px solid #d9e2f0; border-radius: 12px; background: #f5f8fc; color: #111a2e; font-size: 15px; font-family: inherit; } .tla-ph-profile-field input:focus, .tla-ph-profile-field select:focus, .tla-ph-profile-field textarea:focus { outline: 0; background: #fff; border-color: #0a90f6; box-shadow: 0 0 0 4px rgba(10,144,246,.12); } .tla-ph-profile-check { display: flex !important; align-items: center; gap: 10px; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; font-weight: 600 !important; cursor: pointer; } .tla-ph-profile-check input { width: 18px; height: 18px; accent-color: #0a90f6; } .tla-ph-profile-field small { display: block; margin-top: 6px; color: #6b7285; font-size: 12px; line-height: 1.5; } .tla-ph-profile-fields-card button[type="submit"] { min-height: 52px; padding: 0 26px; border: 0; border-radius: 12px; background: linear-gradient(135deg,#0663c4,#0a90f6 58%,#17b2e2); color: #fff; font-weight: 800; cursor: pointer; } /* ===================================================================== MATCH RESULTS — TLA Trusted Partner Network (v0.9.80) Design intent: a member arrives with a problem, not a shopping list. The signature element is the reasoning strip — the visible argument for each recommendation. Everything else is deliberately quiet so that reasoning carries the weight. Palette is drawn from the TLA marks already in use rather than invented: ink #0B1220 authority, all primary type slate #5A6478 supporting copy hairline #E4E9F2 structure without weight signal #0A75D8 the network's own blue, used only for reasoning accredit #0F7B5F accreditation, the one earned colour ===================================================================== */ .tla-ph-match-results { --tla-m-ink: #0b1220; --tla-m-slate: #5a6478; --tla-m-hairline: #e4e9f2; --tla-m-signal: #0a75d8; --tla-m-accredit: #0f7b5f; --tla-m-paper: #fff; max-width: 940px; margin: 0 auto; } /* ── Results header: states the brief back to the member ─────────────── */ .tla-ph-match-results-head { margin-bottom: 28px; } .tla-ph-match-eyebrow { margin: 0 0 10px !important; color: var(--tla-m-slate); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; } .tla-ph-match-results-head h2 { margin: 0 0 8px; color: var(--tla-m-ink); font-size: clamp(26px, 3.4vw, 38px); font-weight: 700; letter-spacing: -.028em; line-height: 1.1; text-wrap: balance; } .tla-ph-match-count { margin: 0 !important; color: var(--tla-m-slate); font-size: 15px; line-height: 1.6; } /* ── The list ────────────────────────────────────────────────────────── */ .tla-ph-match-list { display: grid; gap: 16px; } .tla-ph-match { position: relative; overflow: hidden; padding: 24px clamp(20px, 3vw, 30px) 22px; border: 1px solid var(--tla-m-hairline); border-radius: 16px; background: var(--tla-m-paper); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; } .tla-ph-match:hover { border-color: #cfd9e8; box-shadow: 0 14px 40px rgba(11, 18, 32, .07); transform: translateY(-1px); } /* Accredited partners earn a single quiet marker, not a louder card. */ .tla-ph-match.is-accredited { border-left: 3px solid var(--tla-m-accredit); } .tla-ph-match-lead { margin: 0 0 14px !important; color: var(--tla-m-accredit); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; } /* ── Head: mark, identity, accreditation ─────────────────────────────── */ .tla-ph-match-head { display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 16px; } .tla-ph-match-mark { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid var(--tla-m-hairline); border-radius: 12px; background: #f7f9fc; overflow: hidden; } .tla-ph-match-mark img { width: 100%; height: 100%; object-fit: contain; padding: 6px; } .tla-ph-match-mark.is-initials span { color: var(--tla-m-slate); font-size: 15px; font-weight: 800; letter-spacing: .04em; } .tla-ph-match-identity { min-width: 0; } .tla-ph-match-identity h3 { margin: 0 0 4px; color: var(--tla-m-ink); font-size: 19px; font-weight: 700; letter-spacing: -.015em; line-height: 1.25; } .tla-ph-match-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 !important; color: var(--tla-m-slate); font-size: 13px; } .tla-ph-match-meta span { position: relative; } .tla-ph-match-meta span + span::before { content: ""; position: absolute; left: -8px; top: 50%; width: 3px; height: 3px; border-radius: 50%; background: #b9c2d2; transform: translateY(-50%); } .tla-ph-match-accreditation { margin: 0 !important; padding: 6px 12px; border: 1px solid rgba(15, 123, 95, .28); border-radius: 999px; background: rgba(15, 123, 95, .07); color: var(--tla-m-accredit); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; } .tla-ph-match-accreditation.is-verified { border-color: rgba(90, 100, 120, .26); background: #f4f6fa; color: var(--tla-m-slate); } /* ── SIGNATURE: the reasoning strip ──────────────────────────────────── */ .tla-ph-match-reasoning { margin: 18px 0 0; padding: 16px 18px; border-left: 2px solid var(--tla-m-signal); border-radius: 0 12px 12px 0; background: linear-gradient(90deg, rgba(10, 117, 216, .055), rgba(10, 117, 216, 0) 72%); } .tla-ph-match-reasoning-title { margin: 0 0 10px !important; color: var(--tla-m-signal); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; } .tla-ph-match-reasoning ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 7px; } .tla-ph-match-reasoning li { position: relative; margin: 0; padding-left: 20px; color: #1d2740; font-size: 14px; line-height: 1.5; } /* Drawn tick: no icon dependency, cannot fail to render. */ .tla-ph-match-reasoning li::before { content: ""; position: absolute; left: 2px; top: 6px; width: 5px; height: 9px; border-right: 2px solid var(--tla-m-signal); border-bottom: 2px solid var(--tla-m-signal); transform: rotate(45deg); } /* ── Services ────────────────────────────────────────────────────────── */ .tla-ph-match-services { display: flex; flex-wrap: wrap; gap: 7px; margin: 16px 0 0; padding: 0; list-style: none; } .tla-ph-match-services li { margin: 0; padding: 5px 11px; border: 1px solid var(--tla-m-hairline); border-radius: 6px; color: var(--tla-m-slate); font-size: 12px; font-weight: 600; } /* ── Foot ────────────────────────────────────────────────────────────── */ .tla-ph-match-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--tla-m-hairline); } .tla-ph-match-availability { display: inline-flex; align-items: center; gap: 8px; margin: 0 !important; color: var(--tla-m-slate); font-size: 13px; font-weight: 600; } .tla-ph-match-availability::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #c2cad8; } .tla-ph-match-availability.is-open { color: var(--tla-m-accredit); } .tla-ph-match-availability.is-open::before { background: var(--tla-m-accredit); } /* Landlord SOS Priority badge — free Business Partner incentive, Legal sector only. Sits on its own full-width row above availability so it never fights the footer's space-between layout. The calmer "eligible" state (a genuine but slower committed response) uses the same signal blue as the rest of the reasoning strip; only a confirmed within-24-hours commitment earns the amber priority treatment. */ .tla-ph-match-sos { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; width: 100%; order: -1; margin: 0 0 12px !important; font-size: 12.5px; } .tla-ph-match-sos-badge { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; background: rgba(10, 117, 216, .09); color: var(--tla-m-signal); font-weight: 800; letter-spacing: .01em; } .tla-ph-match-sos.is-priority .tla-ph-match-sos-badge { background: rgba(217, 119, 6, .12); color: var(--tla-ph-amber); } .tla-ph-match-sos-label { color: var(--tla-m-slate); font-weight: 600; } .tla-ph-match-discount { margin: 0 !important; width: 100%; } .tla-ph-match-discount-badge { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 999px; background: rgba(110,34,255,.1); color: var(--tla-ph-violet); font-weight: 800; font-size: 12.5px; letter-spacing: .01em; } .tla-ph-match-discount-badge .dashicons { font-size: 14px; height: 14px; width: 14px; } html[data-tla-theme="dark"] .tla-ph-match-discount-badge { background: rgba(180,140,255,.16); color: #c9a8ff; } .tla-ph-match-actions { display: flex; align-items: center; gap: 10px; } .tla-ph-match-secondary { padding: 10px 16px; border: 1px solid var(--tla-m-hairline); border-radius: 10px; color: var(--tla-m-ink); font-size: 13px; font-weight: 700; text-decoration: none; transition: border-color .18s ease, background .18s ease; } .tla-ph-match-secondary:hover { border-color: #b9c6da; background: #f7f9fc; } .tla-ph-match-select { display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px; border: 1px solid var(--tla-m-signal); border-radius: 10px; background: var(--tla-m-signal); color: #fff; font-size: 13px; font-weight: 700; cursor: pointer; transition: background .18s ease; } .tla-ph-match-select:hover { background: #0961b7; } .tla-ph-match-select input { width: 15px; height: 15px; accent-color: #fff; cursor: pointer; } .tla-ph-match-select:has(input:checked) { background: var(--tla-m-accredit); border-color: var(--tla-m-accredit); } /* Confidence hairline: read as a measure, never as a percentage badge. */ .tla-ph-match-confidence { position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; margin: 0 !important; background: var(--tla-m-hairline); } .tla-ph-match-confidence::after { content: ""; display: block; width: var(--tla-match-fill, 0%); height: 100%; background: linear-gradient(90deg, var(--tla-m-signal), #2e9bff); } /* ── Empty state: an invitation to act, not an apology ───────────────── */ .tla-ph-match-empty { padding: 40px 28px; border: 1px dashed #d2dae7; border-radius: 16px; background: #fafbfd; text-align: center; } .tla-ph-match-empty p:first-child { margin: 0 0 6px !important; color: var(--tla-m-ink); font-size: 17px; font-weight: 700; } .tla-ph-match-empty p:last-child { margin: 0 !important; color: var(--tla-m-slate); font-size: 14px; } /* ── Entry: one orchestrated reveal, not scattered effects ───────────── */ @media (prefers-reduced-motion: no-preference) { .tla-ph-match { animation: tla-match-in .42s cubic-bezier(.22, .68, .36, 1) both; animation-delay: calc((var(--tla-match-index, 0)) * 55ms); } .tla-ph-match[data-rank="1"] { --tla-match-index: 0; } .tla-ph-match[data-rank="2"] { --tla-match-index: 1; } .tla-ph-match[data-rank="3"] { --tla-match-index: 2; } .tla-ph-match[data-rank="4"] { --tla-match-index: 3; } .tla-ph-match[data-rank="5"] { --tla-match-index: 4; } .tla-ph-match[data-rank="6"] { --tla-match-index: 5; } } @keyframes tla-match-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } } /* ── Focus: visible, always ──────────────────────────────────────────── */ .tla-ph-match a:focus-visible, .tla-ph-match input:focus-visible { outline: 2px solid var(--tla-m-signal); outline-offset: 3px; } /* ── Mobile ──────────────────────────────────────────────────────────── */ @media (max-width: 640px) { .tla-ph-match-head { grid-template-columns: 44px 1fr; gap: 12px; } .tla-ph-match-mark { width: 44px; height: 44px; } .tla-ph-match-accreditation { grid-column: 2; justify-self: start; margin-top: 8px !important; } .tla-ph-match-foot { flex-direction: column; align-items: stretch; } .tla-ph-match-actions { display: grid; grid-template-columns: 1fr 1fr; } .tla-ph-match-secondary, .tla-ph-match-select { justify-content: center; text-align: center; } } /* ===================================================================== FIND A PARTNER — search experience (v0.9.82) The previous page led with an animated diagram of the matching engine. That explained the mechanism to someone who only wants the outcome. This leads with the question itself, and lets the form be the hero. Shares the match-results palette so search and results read as one continuous journey rather than two different products. ===================================================================== */ .tla-ph-match-page { --tla-f-ink: #0b1220; --tla-f-slate: #5a6478; --tla-f-hairline: #e4e9f2; --tla-f-signal: #0a75d8; --tla-f-accredit: #0f7b5f; } /* ── Hero: the question, stated plainly ──────────────────────────────── */ .tla-ph-find-hero { max-width: 720px; margin: 0 0 clamp(28px, 4vw, 44px); padding: clamp(24px, 4vw, 40px) 0 0; } .tla-ph-find-eyebrow { margin: 0 0 14px !important; color: var(--tla-f-slate); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; } .tla-ph-find-hero h1 { margin: 0 0 16px; color: var(--tla-f-ink); font-size: clamp(32px, 5vw, 52px); font-weight: 700; letter-spacing: -.035em; line-height: 1.04; text-wrap: balance; } .tla-ph-find-standfirst { margin: 0 0 22px !important; max-width: 60ch; color: var(--tla-f-slate); font-size: clamp(16px, 1.6vw, 18px); line-height: 1.6; } .tla-ph-find-assurances { display: flex; flex-wrap: wrap; gap: 10px 12px; margin: 0; padding: 0; list-style: none; } .tla-ph-find-assurances li { position: relative; margin: 0; padding: 7px 14px 7px 30px; border: 1px solid var(--tla-f-hairline); border-radius: 999px; color: var(--tla-f-ink); font-size: 13px; font-weight: 600; } /* Drawn tick: no icon dependency. */ .tla-ph-find-assurances li::before { content: ""; position: absolute; left: 13px; top: 50%; width: 5px; height: 9px; margin-top: -6px; border-right: 2px solid var(--tla-f-accredit); border-bottom: 2px solid var(--tla-f-accredit); transform: rotate(45deg); } /* ── Section heading above the wizard ────────────────────────────────── */ .tla-ph-match-section-heading { margin-bottom: 22px; } .tla-ph-match-section-heading h2 { margin: 6px 0 8px; color: var(--tla-f-ink); font-size: clamp(22px, 2.6vw, 30px); font-weight: 700; letter-spacing: -.024em; line-height: 1.15; } .tla-ph-match-section-heading p { margin: 0 !important; max-width: 62ch; color: var(--tla-f-slate); font-size: 15px; line-height: 1.6; } /* ── Console: the aside is now a quiet companion, not a rival ────────── */ .tla-ph-match-console { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: clamp(20px, 3vw, 36px); align-items: start; } .tla-ph-match-intro { padding: 24px; border: 1px solid var(--tla-f-hairline); border-radius: 16px; background: #fafbfd; } .tla-ph-match-intro h3 { margin: 12px 0 8px; color: var(--tla-f-ink); font-size: 17px; font-weight: 700; line-height: 1.3; } .tla-ph-match-intro p { margin: 0 0 16px !important; color: var(--tla-f-slate); font-size: 14px; line-height: 1.6; } .tla-ph-match-badge { display: inline-flex; align-items: center; gap: 8px; color: var(--tla-f-accredit); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; } .tla-ph-match-badge i { width: 7px; height: 7px; border-radius: 50%; background: var(--tla-f-accredit); } /* The numbered list is a real sequence, so numbering earns its place. */ .tla-ph-match-points { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; counter-reset: none; } .tla-ph-match-points li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; margin: 0; color: var(--tla-f-slate); font-size: 13px; line-height: 1.45; } .tla-ph-match-points li span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #eaf2fc; color: var(--tla-f-signal); font-size: 11px; font-weight: 800; } /* ── Wizard ──────────────────────────────────────────────────────────── */ .tla-ph-match-wizard { padding: clamp(24px, 3vw, 34px); border: 1px solid var(--tla-f-hairline); border-radius: 18px; background: #fff; box-shadow: 0 20px 56px rgba(11, 18, 32, .06); } .tla-ph-match-progress { height: 3px; margin-bottom: 8px; border-radius: 999px; background: var(--tla-f-hairline); overflow: hidden; } .tla-ph-match-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--tla-f-signal), #2e9bff); transition: width .35s cubic-bezier(.22, .68, .36, 1); } .tla-ph-match-step-label { margin-bottom: 20px; color: var(--tla-f-slate); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-match-step { margin: 0; padding: 0; border: 0; } .tla-ph-match-step legend { display: block; width: 100%; margin-bottom: 6px; padding: 0; color: var(--tla-f-ink); font-size: clamp(20px, 2.2vw, 26px); font-weight: 700; letter-spacing: -.02em; line-height: 1.2; } .tla-ph-match-step > p { margin: 0 0 20px !important; max-width: 58ch; color: var(--tla-f-slate); font-size: 15px; line-height: 1.6; } /* Options read as decisions, with a generous hit area. */ .tla-ph-match-options { display: grid; gap: 10px; margin-bottom: 20px; } .tla-ph-match-option { display: flex; align-items: center; gap: 12px; padding: 15px 18px; border: 1px solid var(--tla-f-hairline); border-radius: 12px; color: var(--tla-f-ink); font-size: 15px; font-weight: 600; cursor: pointer; transition: border-color .16s ease, background .16s ease; } .tla-ph-match-option:hover { border-color: #bfcde0; background: #fafbfd; } .tla-ph-match-option input { width: 18px; height: 18px; accent-color: var(--tla-f-signal); cursor: pointer; } .tla-ph-match-option:has(input:checked) { border-color: var(--tla-f-signal); background: rgba(10, 117, 216, .05); box-shadow: inset 0 0 0 1px var(--tla-f-signal); } .tla-ph-match-fields { display: grid; gap: 16px; margin-bottom: 20px; } .tla-ph-match-field { display: block; } .tla-ph-match-field > span, .tla-ph-match-field-label { display: block; margin-bottom: 7px; color: var(--tla-f-ink); font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; } .tla-ph-match-field input[type="text"], .tla-ph-match-field select, .tla-ph-match-field textarea { width: 100%; padding: 14px 16px; border: 1px solid #d9e2f0; border-radius: 12px; background: #f7f9fc; color: var(--tla-f-ink); font-size: 16px; font-family: inherit; } .tla-ph-match-field input:focus, .tla-ph-match-field select:focus, .tla-ph-match-field textarea:focus { outline: 0; background: #fff; border-color: var(--tla-f-signal); box-shadow: 0 0 0 4px rgba(10, 117, 216, .12); } .tla-ph-check { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; color: var(--tla-f-slate); font-size: 14px; cursor: pointer; } .tla-ph-check input { width: 17px; height: 17px; accent-color: var(--tla-f-signal); } /* ── Recruit banner and disclaimer: quiet, factual ───────────────────── */ .tla-ph-match-recruit { margin-top: 28px; padding: 20px 24px; border: 1px solid var(--tla-f-hairline); border-radius: 14px; background: #fafbfd; } .tla-ph-match-recruit small { display: block; margin-bottom: 4px; color: var(--tla-f-slate); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; } .tla-ph-match-disclaimer { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--tla-f-hairline); color: var(--tla-f-slate); font-size: 13px; line-height: 1.6; } @media (max-width: 900px) { .tla-ph-match-console { grid-template-columns: 1fr; } .tla-ph-match-intro { order: 2; } } @media (prefers-reduced-motion: reduce) { .tla-ph-match-progress span { transition: none; } } /* Unclaimed listings: present, but never dressed as verified partners. */ .tla-ph-match-accreditation.is-unclaimed { border-color: #e0d4b8; background: #fdf8ec; color: #8a6d1f; } .tla-ph-match-unclaimed-note { flex: 1 1 100%; margin: 0 0 10px !important; color: #6b7285; font-size: 12.5px; line-height: 1.55; } /* ===================================================================== HUB DASHBOARD WIDGETS (v0.9.90) Business Type determines which widgets a member sees. Quiet and factual: this sits above the shared action cards, not competing. ===================================================================== */ .tla-ph-hub-widgets { --tla-w-ink: #0b1220; --tla-w-slate: #5a6478; --tla-w-hairline: #e4e9f2; --tla-w-signal: #0a75d8; margin: 0 0 28px; } .tla-ph-hub-widgets-head { margin-bottom: 16px; } .tla-ph-hub-eyebrow { margin: 0 0 4px !important; color: var(--tla-w-signal); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; } .tla-ph-hub-standfirst { margin: 0 !important; max-width: 62ch; color: var(--tla-w-slate); font-size: 14px; line-height: 1.6; } .tla-ph-hub-widget-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; } .tla-ph-hub-widget { padding: 18px 20px; border: 1px solid var(--tla-w-hairline); border-radius: 14px; background: #fff; } .tla-ph-hub-widget h3 { margin: 0 0 10px; color: var(--tla-w-ink); font-size: 13px; font-weight: 800; letter-spacing: .02em; } .tla-ph-hub-figure { margin: 0 0 10px !important; color: var(--tla-w-ink); font-size: 26px; font-weight: 700; letter-spacing: -.02em; line-height: 1; } .tla-ph-hub-meter { height: 5px; margin-bottom: 10px; border-radius: 999px; background: #eef2f8; overflow: hidden; } .tla-ph-hub-meter span { display: block; height: 100%; background: linear-gradient(90deg, var(--tla-w-signal), #2e9bff); } .tla-ph-hub-note { margin: 0 !important; color: var(--tla-w-slate); font-size: 12.5px; line-height: 1.55; } .tla-ph-hub-widget.is-descriptive { background: #fafbfd; } .tla-ph-hub-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; } .tla-ph-hub-tags li { margin: 0; padding: 5px 10px; border: 1px solid var(--tla-w-hairline); border-radius: 6px; color: var(--tla-w-slate); font-size: 12px; font-weight: 600; } /* ===================================================================== FIND A PARTNER — search-led hero (v0.9.92) The previous page opened with a full-viewport headline and three pills; the form itself sat below the fold. This puts a real search in the first screen, as the reference platforms do, and scrolls into the wizard once the member has said where they need help. ===================================================================== */ .tla-ph-find-hero { position: relative; max-width: none; margin: 0 0 clamp(24px, 3vw, 40px); padding: clamp(38px, 5vw, 68px) clamp(20px, 4vw, 48px) clamp(34px, 4vw, 56px); border-radius: 22px; overflow: hidden; background: radial-gradient(circle at 88% 4%, rgba(90, 224, 255, .30), transparent 42%), radial-gradient(circle at 4% 96%, rgba(123, 60, 255, .22), transparent 46%), linear-gradient(128deg, #08234a 0%, #0b3c86 52%, #0a75d8 100%); color: #fff; } /* Fine grid, drawn in CSS. Depth without an image dependency. */ .tla-ph-find-hero::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 46px 46px; mask-image: radial-gradient(circle at 70% 30%, #000 0%, transparent 72%); pointer-events: none; } .tla-ph-find-hero-inner { position: relative; z-index: 1; max-width: 760px; } .tla-ph-find-hero .tla-ph-find-eyebrow { margin: 0 0 12px !important; color: rgba(255,255,255,.72); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; } .tla-ph-find-hero h1 { margin: 0 0 14px; color: #fff; font-size: clamp(30px, 4.4vw, 50px); font-weight: 700; letter-spacing: -.035em; line-height: 1.04; text-wrap: balance; } .tla-ph-find-standfirst { margin: 0 0 26px !important; max-width: 58ch; color: rgba(255,255,255,.82); font-size: clamp(15px, 1.5vw, 17px); line-height: 1.6; } /* The search bar is the hero's single job. */ .tla-ph-find-searchbar { display: flex; align-items: stretch; gap: 8px; max-width: 620px; padding: 8px; border-radius: 16px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.24); backdrop-filter: blur(8px); } .tla-ph-find-searchbar-field { flex: 1 1 auto; display: block; padding: 8px 14px; border-radius: 11px; background: #fff; text-align: left; } .tla-ph-find-searchbar-field span { display: block; margin-bottom: 2px; color: #5a6478; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-find-searchbar-field input { width: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: #0b1220; font-size: 16px; font-weight: 600; } .tla-ph-find-searchbar-go { flex: 0 0 auto; padding: 0 26px; border: 0; border-radius: 11px; background: #fff; color: #0b3c86; font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .16s ease, box-shadow .16s ease; } .tla-ph-find-searchbar-go:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(0,0,0,.22); } .tla-ph-find-hero .tla-ph-find-assurances { margin-top: 22px; } .tla-ph-find-hero .tla-ph-find-assurances li { border-color: rgba(255,255,255,.26); background: rgba(255,255,255,.08); color: #fff; } .tla-ph-find-hero .tla-ph-find-assurances li::before { border-right-color: #7ce6c0; border-bottom-color: #7ce6c0; } /* ── Fix: option label ran and together inline ──────── */ .tla-ph-match-option-body { display: block; line-height: 1.35; } .tla-ph-match-option-body strong { display: block; color: #0b1220; font-size: 15px; font-weight: 700; } .tla-ph-match-option-body small { display: block; margin-top: 3px; color: #5a6478; font-size: 12.5px; font-weight: 600; } /* The service options were double-boxed; the label carries the border. */ .tla-ph-match-service-options { gap: 10px; } .tla-ph-match-service-options .tla-ph-match-option { align-items: flex-start; padding: 16px 18px; } /* ── Fix: single fields floating in a vast card ──────────────────────── */ .tla-ph-match-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; } .tla-ph-match-step > p { margin-bottom: 22px !important; } /* ── No-match state: direction, not apology ─────────────────────────── */ .tla-ph-match-empty-state, .tla-ph-match-alternatives { max-width: 940px; margin-inline: auto; } @media (max-width: 720px) { .tla-ph-find-searchbar { flex-direction: column; } .tla-ph-find-searchbar-go { padding: 15px 20px; } } @media (prefers-reduced-motion: reduce) { .tla-ph-find-searchbar-go:hover { transform: none; } } /* ===================================================================== FIND PAGE — hero graphic, contrast, nav fixes (v0.9.93) ===================================================================== */ /* 1. NAV: the light and dark trusted marks were both rendering, producing a stray coloured block beside the logo. Force one per theme. */ .tla-ph-trusted-logo.is-dark { display: none !important; } .tla-ph-trusted-logo.is-light { display: block !important; } html[data-tla-theme="dark"] .tla-ph-trusted-logo.is-light { display: none !important; } html[data-tla-theme="dark"] .tla-ph-trusted-logo.is-dark { display: block !important; } /* Nav simplified: one row, wraps rather than growing tall on tablet. */ .tla-ph-public-menu { display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px 18px; min-height: 0 !important; padding: 14px 20px !important; } .tla-ph-public-menu__header { flex: 0 0 auto; margin: 0 !important; } .tla-ph-public-menu__panel { flex: 1 1 auto; display: flex !important; align-items: center; justify-content: flex-end; gap: 10px 18px; } .tla-ph-public-menu__nav { flex: 1 1 auto; } .tla-ph-public-menu__links { display: flex; flex-wrap: wrap; gap: 4px 6px; justify-content: flex-end; } .tla-ph-public-menu__actions { flex: 0 0 auto; } .tla-ph-public-menu__brand { display: block; max-width: 132px; } @media (max-width: 1024px) { .tla-ph-public-menu { padding: 12px 16px !important; } .tla-ph-public-menu__panel { flex: 1 1 100%; justify-content: flex-start; } .tla-ph-public-menu__links { justify-content: flex-start; } } @media (max-width: 640px) { .tla-ph-public-menu__links a { font-size: 13px; padding: 7px 10px; } .tla-ph-public-menu__brand { max-width: 108px; } } /* 2. HERO: two-column so the right side carries the graphic. */ .tla-ph-find-hero-inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: clamp(24px, 4vw, 56px); max-width: 1180px; } .tla-ph-find-hero-copy { min-width: 0; } /* 3. START MATCHING: white on deep blue. Maximum contrast, no pink. */ .tla-ph-find-searchbar-go { background: #ffffff !important; color: #0a2d5e !important; border: 0 !important; font-weight: 800 !important; letter-spacing: .01em; box-shadow: 0 6px 18px rgba(0, 0, 0, .22); } .tla-ph-find-searchbar-go:hover { background: #f2f7ff !important; color: #08234a !important; } /* 4. THE GRAPHIC — a compliance deadline reaching crisis, then resolved. Drawn entirely in CSS: no image, no icon font, nothing that can fail to load or render at the wrong size. It shows the member's actual world: a certificate expiring, an urgent repair, a notice to serve. */ .tla-ph-find-scene { position: relative; min-height: 300px; display: grid; gap: 12px; align-content: center; } .tla-ph-find-alert { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 14px; padding: 15px 17px; border-radius: 14px; background: rgba(255, 255, 255, .10); border: 1px solid rgba(255, 255, 255, .20); backdrop-filter: blur(6px); animation: tla-alert-in .55s cubic-bezier(.22,.68,.36,1) both; } .tla-ph-find-alert:nth-child(1) { animation-delay: .15s; } .tla-ph-find-alert:nth-child(2) { animation-delay: .40s; } .tla-ph-find-alert:nth-child(3) { animation-delay: .65s; } .tla-ph-find-alert-dot { position: relative; width: 42px; height: 42px; border-radius: 12px; background: rgba(255, 255, 255, .14); display: grid; place-items: center; } /* Countdown ring, drawn with a conic gradient. */ .tla-ph-find-alert-dot::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: conic-gradient(var(--tla-alert-colour, #ffcf5c) var(--tla-alert-pct, 70%), rgba(255,255,255,.16) 0); mask: radial-gradient(circle, transparent 56%, #000 58%); } .tla-ph-find-alert-dot span { position: relative; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: -.02em; } .tla-ph-find-alert-body strong { display: block; color: #fff; font-size: 14px; font-weight: 700; line-height: 1.3; } .tla-ph-find-alert-body small { display: block; margin-top: 2px; color: rgba(255, 255, 255, .74); font-size: 12px; line-height: 1.45; } .tla-ph-find-alert-state { padding: 6px 11px; border-radius: 999px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; } .tla-ph-find-alert.is-urgent .tla-ph-find-alert-state { background: rgba(255, 138, 128, .18); color: #ffb3aa; } .tla-ph-find-alert.is-soon .tla-ph-find-alert-state { background: rgba(255, 207, 92, .18); color: #ffd980; } .tla-ph-find-alert.is-solved .tla-ph-find-alert-state { background: rgba(124, 230, 192, .20); color: #8ef0ce; } /* The resolution line: this is what the hub does about it. */ .tla-ph-find-scene-outcome { display: flex; align-items: center; gap: 10px; margin-top: 4px; padding: 13px 17px; border-radius: 14px; background: rgba(124, 230, 192, .12); border: 1px solid rgba(124, 230, 192, .30); color: #d7fff0; font-size: 13px; font-weight: 650; animation: tla-alert-in .55s cubic-bezier(.22,.68,.36,1) .9s both; } .tla-ph-find-scene-outcome::before { content: ""; flex: 0 0 auto; width: 6px; height: 11px; margin-left: 3px; border-right: 2px solid #8ef0ce; border-bottom: 2px solid #8ef0ce; transform: rotate(45deg); } @keyframes tla-alert-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } } @media (max-width: 900px) { .tla-ph-find-hero-inner { grid-template-columns: 1fr; } .tla-ph-find-scene { min-height: 0; margin-top: 8px; } } @media (prefers-reduced-motion: reduce) { .tla-ph-find-alert, .tla-ph-find-scene-outcome { animation: none !important; } } /* ===================================================================== FIND PAGE — alignment corrections (v0.9.94) ===================================================================== */ .tla-ph-match-section-heading { max-width: 760px; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; } .tla-ph-match-section-heading p { margin-left: 0 !important; margin-right: 0 !important; } .tla-ph-match-options { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } .tla-ph-match-option { display: grid !important; grid-template-columns: 20px minmax(0, 1fr); align-items: center !important; gap: 12px; min-height: 60px; padding: 14px 18px !important; text-align: left; } .tla-ph-match-option input { position: static !important; width: 18px !important; height: 18px !important; margin: 0 !important; opacity: 1 !important; } .tla-ph-match-option > span { min-width: 0; } .tla-ph-match-option > span:not(.tla-ph-match-option-body) { font-size: 15px; font-weight: 650; line-height: 1.35; } .tla-ph-match-option > span::after { display: none !important; content: none !important; } .tla-ph-match-service-options { padding: 0 !important; border: 0 !important; background: none !important; } .tla-ph-match-service-options .tla-ph-match-option { align-items: center !important; } @media (max-width: 720px) { .tla-ph-match-options { grid-template-columns: 1fr; } } /* ===================================================================== PARTNER HUB v1.0 — service-first guided finder ===================================================================== */ .tla-ph-match-v1{background:#f6f7fb;padding:44px 0 72px} .tla-ph-match-v1 .tla-ph-shell-inner{max-width:1120px} .tla-ph-v1-hero{max-width:850px;margin:0 auto 28px;text-align:center;padding:28px 20px 8px} .tla-ph-v1-hero h1{max-width:820px;margin:10px auto 14px;font-size:clamp(38px,6vw,68px);line-height:1.02;letter-spacing:-.045em;color:#101126} .tla-ph-v1-hero>p:last-child{max-width:740px;margin:0 auto;color:#5a5d72;font-size:18px;line-height:1.65} .tla-ph-v1-finder{max-width:900px;margin:0 auto;background:#fff;border:1px solid #e4e6ef;border-radius:28px;padding:28px;box-shadow:0 22px 65px rgba(18,20,45,.09)} .tla-ph-v1-progress{display:flex;align-items:center;gap:18px;margin-bottom:24px;color:#676a7d;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em} .tla-ph-v1-progress>div{height:7px;flex:1;background:#eceef5;border-radius:99px;overflow:hidden} .tla-ph-v1-progress i{display:block;width:33.33%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#d92ecb,#7626ec,#168be8);transition:width .25s ease} .tla-ph-v1-step{border:0;padding:0;margin:0;min-width:0} .tla-ph-v1-finder.is-enhanced .tla-ph-v1-step{display:none} .tla-ph-v1-finder.is-enhanced .tla-ph-v1-step.is-active{display:block;animation:tlaV1In .25s ease} @keyframes tlaV1In{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .tla-ph-v1-step legend{display:flex;align-items:center;gap:14px;width:100%;font-size:clamp(25px,4vw,38px);font-weight:850;letter-spacing:-.025em;color:#15162a} .tla-ph-v1-step legend>span{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:50%;background:#17182d;color:#fff;font-size:17px} .tla-ph-v1-step-copy{margin:12px 0 24px;color:#66697a;font-size:16px;line-height:1.6} .tla-ph-v1-sector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:20px} .tla-ph-v1-sector{cursor:pointer} .tla-ph-v1-sector input{position:absolute;opacity:0;pointer-events:none} .tla-ph-v1-sector>span{display:flex;min-height:96px;flex-direction:column;justify-content:center;padding:18px;border:1px solid #dfe2ec;border-radius:17px;background:#fafbfe;transition:.18s ease} .tla-ph-v1-sector strong{font-size:16px;color:#18192d} .tla-ph-v1-sector small{margin-top:5px;color:#787b8c} .tla-ph-v1-sector:hover>span{transform:translateY(-2px);border-color:#b8bed2} .tla-ph-v1-sector input:checked+span{border-color:#7b2be9;background:#f7f1ff;box-shadow:0 0 0 3px rgba(123,43,233,.12)} .tla-ph-v1-service{margin-top:6px} .tla-ph-v1-question{font-weight:800;color:#1f2034;margin:20px 0 10px} .tla-ph-v1-inline-options,.tla-ph-v1-timing{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .tla-ph-v1-inline-options label,.tla-ph-v1-timing label{cursor:pointer} .tla-ph-v1-inline-options input,.tla-ph-v1-timing input{position:absolute;opacity:0} .tla-ph-v1-inline-options span,.tla-ph-v1-timing span{display:flex;align-items:center;min-height:58px;padding:14px 16px;border:1px solid #dfe2ec;border-radius:15px;background:#fff;font-weight:750;color:#292a3e} .tla-ph-v1-inline-options input:checked+span,.tla-ph-v1-timing input:checked+span{border-color:#7728ea;background:#f7f1ff;box-shadow:0 0 0 3px rgba(119,40,234,.11)} .tla-ph-v1-sos-note{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:14px 16px;border:1px solid rgba(217,119,6,.22);border-radius:14px;background:rgba(217,119,6,.06)} .tla-ph-v1-sos-note[hidden]{display:none!important} .tla-ph-v1-sos-note .dashicons{color:var(--tla-ph-amber);flex:0 0 auto;margin-top:2px} .tla-ph-v1-sos-note p{margin:0;color:var(--tla-ph-muted);font-size:.82rem;line-height:1.55} .tla-ph-v1-sos-note strong{color:var(--tla-ph-heading)} .tla-ph-v1-location input{font-size:20px;padding:17px 18px} .tla-ph-v1-location small{display:block;margin-top:8px;color:#777a8d} .tla-ph-v1-location small.is-valid{color:#147c58;font-weight:700} .tla-ph-v1-optional-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0} .tla-ph-v1-finder .tla-ph-match-actions{margin-top:26px;padding-top:20px;border-top:1px solid #eceef4} .tla-ph-v1-trust{max-width:900px;margin:18px auto 36px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px} .tla-ph-v1-trust span{position:relative;padding:10px 10px 10px 30px;color:#5f6275;font-size:13px;font-weight:700} .tla-ph-v1-trust span:before{content:'✓';position:absolute;left:8px;color:#14865d;font-weight:900} .tla-ph-match-v1 .tla-ph-match-results{max-width:1040px;margin:30px auto 0} .tla-ph-match-v1 .tla-ph-match-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px} .tla-ph-match-v1 .tla-ph-match{height:100%;border-radius:22px} .tla-ph-match-v1 .tla-ph-match-confidence{display:none!important} .tla-ph-v1-shortlist{position:sticky;z-index:30;bottom:18px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:22px auto;padding:14px 16px 14px 22px;max-width:760px;border-radius:18px;background:#15162a;color:#fff;box-shadow:0 18px 50px rgba(12,13,31,.28)} .tla-ph-v1-shortlist[hidden],.tla-ph-match-contact[hidden]{display:none!important} .tla-ph-v1-shortlist strong{font-size:16px} .tla-ph-match-v1 .tla-ph-match-contact{margin-top:28px;border-radius:24px;scroll-margin-top:24px} .tla-ph-match-v1 .tla-ph-match-disclaimer{max-width:900px;margin:48px auto 0} @media(max-width:820px){.tla-ph-v1-sector-grid,.tla-ph-match-v1 .tla-ph-match-grid{grid-template-columns:1fr 1fr}.tla-ph-v1-trust{grid-template-columns:1fr}.tla-ph-v1-finder{padding:22px;border-radius:22px}} @media(max-width:560px){.tla-ph-match-v1{padding-top:20px}.tla-ph-v1-hero{padding-inline:6px}.tla-ph-v1-sector-grid,.tla-ph-v1-inline-options,.tla-ph-v1-timing,.tla-ph-v1-optional-grid,.tla-ph-match-v1 .tla-ph-match-grid{grid-template-columns:1fr}.tla-ph-v1-finder{padding:18px}.tla-ph-v1-shortlist{bottom:8px;flex-direction:column;align-items:stretch;text-align:center}} /* ===================================================================== MATCHING ENGINE 2.0 — consistent section alignment (v1.0.1) ===================================================================== */ .tla-ph-match-results > .tla-ph-section-heading, .tla-ph-match-alternatives > .tla-ph-section-heading { display: flex !important; flex-direction: column; align-items: center !important; justify-content: center !important; gap: 10px; text-align: center !important; } .tla-ph-match-results > .tla-ph-section-heading > div, .tla-ph-match-alternatives > .tla-ph-section-heading > div { width: 100%; max-width: 880px; margin-inline: auto; text-align: center !important; } .tla-ph-match-results > .tla-ph-section-heading span, .tla-ph-match-results > .tla-ph-section-heading h2, .tla-ph-match-results > .tla-ph-section-heading h3, .tla-ph-match-results > .tla-ph-section-heading p, .tla-ph-match-alternatives > .tla-ph-section-heading span, .tla-ph-match-alternatives > .tla-ph-section-heading h2, .tla-ph-match-alternatives > .tla-ph-section-heading h3, .tla-ph-match-alternatives > .tla-ph-section-heading p { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } .tla-ph-match-alternatives > .tla-ph-section-heading > strong { align-self: center; } .tla-ph-match-empty-actions > div:first-child, .tla-ph-match-contact > div:first-child { text-align: center; } .tla-ph-match-empty-actions > div:first-child p, .tla-ph-match-contact > div:first-child p { margin-left: auto !important; margin-right: auto !important; } /* ===================================================================== MATCHING ENGINE 2.1 — score, sourced profiles and direct search (v1.0.2) ===================================================================== */ .tla-ph-match-head{grid-template-columns:52px minmax(0,1fr) auto auto} .tla-ph-match-score{ --score-angle:calc(var(--tla-match-score) * 3.6deg); position:relative;display:grid;place-items:center;align-content:center; width:82px;height:82px;border-radius:50%;text-align:center; background:conic-gradient(#168be8 0 var(--score-angle),#e8edf5 var(--score-angle) 360deg); box-shadow:0 8px 24px rgba(20,112,200,.12) } .tla-ph-match-score:before{content:"";position:absolute;inset:6px;border-radius:50%;background:#fff} .tla-ph-match-score>*{position:relative;z-index:1} .tla-ph-match-score strong{font-size:22px;line-height:1;color:#11152a} .tla-ph-match-score span{font-size:10px;font-weight:800;color:#74798d} .tla-ph-match-score small{position:absolute;top:88px;width:110px;font-size:10px;font-weight:800;color:#1680cf;text-transform:uppercase;letter-spacing:.04em} .tla-ph-match-accreditation.is-unclaimed{border-color:rgba(222,149,19,.35);background:#fff8e8;color:#94620b} .tla-ph-v1-business-search{max-width:900px;margin:0 auto 26px;padding:22px 24px;border:1px solid #dfe5ef;border-radius:22px;background:linear-gradient(135deg,#fff,#f7faff);box-shadow:0 14px 40px rgba(18,33,62,.06);text-align:center} .tla-ph-v1-business-search h2{margin:6px 0 6px;font-size:clamp(22px,3vw,31px);letter-spacing:-.025em} .tla-ph-v1-business-search p{max-width:700px;margin:0 auto 18px;color:#666b7e} .tla-ph-v1-business-search-form{display:grid;grid-template-columns:1.25fr 1fr auto;gap:12px;align-items:end;text-align:left} .tla-ph-v1-business-search-form label span{display:block;margin:0 0 6px;font-size:12px;font-weight:800;color:#42475a} .tla-ph-v1-business-search-form input{width:100%;min-height:48px;padding:11px 14px;border:1px solid #d9dfeb;border-radius:12px;background:#fff} .tla-ph-v1-business-search-form button{min-height:48px;white-space:nowrap} .tla-ph-match-results>.tla-ph-section-heading h2,.tla-ph-match-results>.tla-ph-section-heading p,.tla-ph-match-results>.tla-ph-section-heading span{text-align:center!important} @media(max-width:900px){.tla-ph-match-head{grid-template-columns:52px minmax(0,1fr) auto}.tla-ph-match-score{grid-row:2;grid-column:2;justify-self:start;margin-top:12px}.tla-ph-match-accreditation{grid-column:3;grid-row:1}.tla-ph-v1-business-search-form{grid-template-columns:1fr 1fr}.tla-ph-v1-business-search-form button{grid-column:1/-1}} @media(max-width:560px){.tla-ph-v1-business-search-form{grid-template-columns:1fr}.tla-ph-v1-business-search-form button{grid-column:auto}.tla-ph-match-head{grid-template-columns:44px 1fr}.tla-ph-match-score{grid-column:2}.tla-ph-match-accreditation{grid-column:2;grid-row:auto}.tla-ph-match-score small{position:static;width:auto;margin-top:3px}.tla-ph-match-score{width:74px;height:74px}} /* ===================================================================== UNIFIED MEMBERSHIP PRICING — v1.0.3 ===================================================================== */ .tla-ph-public-price-value del { color: var(--tla-ph-muted, #626780); display: block; font-size: 1rem; font-weight: 750; margin-bottom: 3px; opacity: .8; } .tla-ph-public-price-value .tla-ph-price-offer-label { background: rgba(223,41,211,.09); border: 1px solid rgba(223,41,211,.18); border-radius: 999px; color: #a514a7; display: inline-flex; font-size: .66rem; font-weight: 900; letter-spacing: .05em; margin-bottom: 6px; padding: 5px 8px; text-transform: uppercase; } .tla-ph-public-price-value strong { display:block; } .tla-ph-pricing-sector-head > div, .tla-ph-pricing-intro > div:first-child { text-align:center; } .tla-ph-pricing-sector-head { align-items:center; justify-content:center; text-align:center; } .tla-ph-pricing-sector-head .tla-ph-pricing-status { position:absolute; right:24px; } @media (max-width:760px) { .tla-ph-pricing-sector-head .tla-ph-pricing-status { position:static; } } /* ===================================================================== FINDER BRAND SYSTEM — large, symmetrical Trusted Partner lockup (v1.0.4) ===================================================================== */ .tla-ph-v1-hero { max-width: 900px; margin: 0 auto 36px; padding: 34px 20px 10px; text-align: center; } .tla-ph-v1-hero-brand { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 132px; margin: 0 auto 24px; } .tla-ph-v1-hero-logo { display: inline-flex; justify-content: center; align-items: center; width: min(100%, 430px); margin: 0 auto; } .tla-ph-v1-hero-logo .tla-ph-trusted-logo { width: 100% !important; max-width: 430px !important; max-height: 132px; height: auto; margin: 0 auto; object-fit: contain; object-position: center; } .tla-ph-v1-hero .tla-ph-find-eyebrow { margin: 0 auto 14px; text-align: center; } .tla-ph-v1-hero h1, .tla-ph-v1-hero > p:last-child { text-align: center; } .tla-ph-match-v1 .tla-ph-v1-business-search, .tla-ph-match-v1 .tla-ph-v1-finder, .tla-ph-match-v1 .tla-ph-match-results { margin-left: auto; margin-right: auto; } .tla-ph-results-brand { display: flex; justify-content: center; align-items: center; width: 100%; margin: 0 auto 18px; } .tla-ph-results-logo { display: inline-flex; justify-content: center; align-items: center; width: min(100%, 270px); margin: 0 auto; } .tla-ph-results-logo .tla-ph-trusted-logo { width: 100% !important; max-width: 270px !important; max-height: 84px; height: auto; margin: 0 auto; object-fit: contain; object-position: center; } .tla-ph-match-results > .tla-ph-section-heading, .tla-ph-match-results > .tla-ph-section-heading > div { width: 100%; text-align: center !important; } @media (max-width: 900px) { .tla-ph-v1-hero-brand { min-height: 108px; margin-bottom: 20px; } .tla-ph-v1-hero-logo { width: min(100%, 340px); } .tla-ph-v1-hero-logo .tla-ph-trusted-logo { max-width: 340px !important; max-height: 108px; } } @media (max-width: 560px) { .tla-ph-v1-hero { padding-top: 22px; margin-bottom: 26px; } .tla-ph-v1-hero-brand { min-height: 82px; margin-bottom: 16px; } .tla-ph-v1-hero-logo { width: min(100%, 250px); } .tla-ph-v1-hero-logo .tla-ph-trusted-logo { max-width: 250px !important; max-height: 82px; } .tla-ph-results-logo { width: min(100%, 210px); } .tla-ph-results-logo .tla-ph-trusted-logo { max-width: 210px !important; max-height: 66px; } } /* ===================================================================== FINDER BRAND REFINEMENT — unclipped logo, clean hierarchy (v1.0.5) ===================================================================== */ .tla-ph-v1-hero { max-width: 900px; margin: 0 auto 28px; padding: 44px 20px 8px; text-align: center; } .tla-ph-v1-hero-brand { display: block; width: 100%; min-height: 0; margin: 0 auto 38px; overflow: visible; text-align: center; } .tla-ph-v1-hero-logo { display: block; width: min(100%, 320px); margin: 0 auto; line-height: 0; overflow: visible; } .tla-ph-v1-hero-logo .tla-ph-trusted-logo { display: block; width: 100% !important; max-width: 320px !important; max-height: none !important; height: auto !important; margin: 0 auto !important; object-fit: contain; object-position: center; } .tla-ph-v1-hero-logo .tla-ph-trusted-logo.is-dark { display: none !important; } html[data-tla-theme="dark"] .tla-ph-v1-hero-logo .tla-ph-trusted-logo.is-light { display: none !important; } html[data-tla-theme="dark"] .tla-ph-v1-hero-logo .tla-ph-trusted-logo.is-dark { display: block !important; } .tla-ph-v1-hero h1 { max-width: 760px; margin: 0 auto 20px; text-align: center; } .tla-ph-v1-hero > p:last-child { max-width: 900px; margin: 0 auto; text-align: center; } .tla-ph-match-v1 .tla-ph-v1-business-search { margin-top: 0; } .tla-ph-results-logo .tla-ph-trusted-logo { max-height: none !important; height: auto !important; } .tla-ph-results-logo .tla-ph-trusted-logo.is-dark { display: none !important; } html[data-tla-theme="dark"] .tla-ph-results-logo .tla-ph-trusted-logo.is-light { display: none !important; } html[data-tla-theme="dark"] .tla-ph-results-logo .tla-ph-trusted-logo.is-dark { display: block !important; } @media (max-width: 900px) { .tla-ph-v1-hero { padding-top: 34px; margin-bottom: 26px; } .tla-ph-v1-hero-brand { min-height: 0; margin-bottom: 32px; } .tla-ph-v1-hero-logo { width: min(100%, 260px); } .tla-ph-v1-hero-logo .tla-ph-trusted-logo { max-width: 260px !important; max-height: none !important; } } @media (max-width: 560px) { .tla-ph-v1-hero { padding-top: 26px; margin-bottom: 22px; } .tla-ph-v1-hero-brand { min-height: 0; margin-bottom: 26px; } .tla-ph-v1-hero-logo { width: min(100%, 180px); } .tla-ph-v1-hero-logo .tla-ph-trusted-logo { max-width: 180px !important; max-height: none !important; } .tla-ph-v1-hero h1 { margin-bottom: 16px; } } /* ===================================================================== MATCH GROUPING AND BEST-MATCH HIERARCHY (v1.0.6) ===================================================================== */ .tla-ph-best-match, .tla-ph-other-matches { margin-top: 30px; } .tla-ph-other-matches { margin-top: 48px; } .tla-ph-result-group-head { max-width: 760px; margin: 0 auto 20px; text-align: center; } .tla-ph-result-group-head h3 { margin: 0 0 10px; color: var(--tla-m-ink, #0b1220); font-size: clamp(23px, 3vw, 32px); line-height: 1.15; letter-spacing: -.025em; } .tla-ph-result-group-head > p:last-child { max-width: 700px; margin: 0 auto !important; color: var(--tla-m-slate, #5a6478); font-size: 14px; line-height: 1.65; } .tla-ph-match-list.is-best { max-width: 760px; margin: 0 auto; } .tla-ph-match-list.is-best .tla-ph-match { border-width: 2px; border-color: rgba(10,117,216,.34); box-shadow: 0 20px 55px rgba(11,18,32,.09); } @media (min-width: 760px) { .tla-ph-other-matches .tla-ph-match-list { grid-template-columns: repeat(2,minmax(0,1fr)); } } /* ===================================================================== RANKED SECONDARY MATCHES + PARTNER CAPABILITIES (v1.0.7) ===================================================================== */ .tla-ph-match-capability-group { margin-top: 16px; } .tla-ph-match-capability-group > span { display: block; margin-bottom: 8px; color: var(--tla-m-slate, #5a6478); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; } .tla-ph-match-specialisms, .tla-ph-match-services { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; } .tla-ph-match-specialisms li, .tla-ph-match-services li { padding: 7px 10px; border: 1px solid var(--tla-m-hairline, #dfe5ee); border-radius: 8px; background: var(--tla-m-paper, #fff); color: var(--tla-m-slate, #5a6478); font-size: 12px; line-height: 1.25; } .tla-ph-match-capability-group.is-specialisms li { border-style: dashed; } .tla-ph-match.is-alternative { border-color: rgba(92, 109, 137, .24); background: color-mix(in srgb, var(--tla-m-paper, #fff) 96%, #edf3fa 4%); } .tla-ph-match.is-alternative .tla-ph-match-score small { color: #5c6d89; } .tla-ph-match-related-note { margin: 16px 0 0 !important; padding: 11px 13px; border-radius: 10px; background: rgba(22, 139, 232, .07); color: var(--tla-m-slate, #5a6478); font-size: 12px; line-height: 1.5; } .tla-ph-best-match + .tla-ph-other-matches { padding-top: 8px; border-top: 1px solid var(--tla-m-hairline, #e0e6ef); } .tla-ph-best-match .tla-ph-match-list.is-best { max-width: 820px; } .tla-ph-other-matches .tla-ph-match-list { align-items: stretch; } @media (max-width: 759px) { .tla-ph-other-matches .tla-ph-match-list { grid-template-columns: 1fr; } } /* ===================================================================== FINDER RESPONSIVE PRODUCTION LAYER (v1.0.12) This is the final responsive source of truth for the public matching page. It intentionally sits after legacy finder rules so tablet and mobile layouts cannot inherit conflicting historical grid settings. ===================================================================== */ .tla-ph-match-v1 { width: 100%; max-width: none; overflow-x: clip; background: var(--tla-ph-bg, #f6f7fb); } .tla-ph-match-v1, .tla-ph-match-v1 * { min-width: 0; } .tla-ph-match-v1 .tla-ph-shell-inner { width: 100%; max-width: 1120px; overflow: visible; } .tla-ph-match-v1 :is(input, select, textarea, button, a) { max-width: 100%; } .tla-ph-match-v1 :is(input, select, textarea) { font-size: 16px; } .tla-ph-match-v1 .tla-ph-v1-finder, .tla-ph-match-v1 .tla-ph-v1-business-search, .tla-ph-match-v1 .tla-ph-match, .tla-ph-match-v1 .tla-ph-match-contact, .tla-ph-match-v1 .tla-ph-match-empty-actions, .tla-ph-match-v1 .tla-ph-match-alternatives, .tla-ph-match-v1 .tla-ph-match-recruit { max-width: 100%; } .tla-ph-match-v1 .tla-ph-v1-step, .tla-ph-match-v1 .tla-ph-match-results, .tla-ph-match-v1 .tla-ph-match-introduction, .tla-ph-match-v1 .tla-ph-best-match, .tla-ph-match-v1 .tla-ph-other-matches { scroll-margin-top: calc(var(--tla-ph-global-header-height, 76px) + 18px); } .tla-ph-match-v1 .tla-ph-match-meta span, .tla-ph-match-v1 .tla-ph-match-reasoning li, .tla-ph-match-v1 .tla-ph-match-unclaimed-note, .tla-ph-match-v1 .tla-ph-match-related-note, .tla-ph-match-v1 .tla-ph-result-group-head p, .tla-ph-match-v1 .tla-ph-section-heading p { overflow-wrap: anywhere; } /* Tablet: preserve the premium card treatment, but remove cramped two-card result columns and give the form a predictable reading width. */ @media (max-width: 1024px) { .tla-ph-match-v1 { padding: 30px 0 60px; } .tla-ph-match-v1 > .tla-ph-shell-inner { padding-inline: clamp(18px, 3vw, 30px); } .tla-ph-match-v1 .tla-ph-v1-hero { max-width: 760px; padding: 30px 12px 8px; margin-bottom: 26px; } .tla-ph-match-v1 .tla-ph-v1-hero-brand { margin-bottom: 28px; } .tla-ph-match-v1 .tla-ph-v1-hero h1 { font-size: clamp(34px, 5vw, 44px) !important; line-height: 1.09 !important; } .tla-ph-match-v1 .tla-ph-v1-business-search h2, .tla-ph-match-v1 .tla-ph-match-results > .tla-ph-section-heading h2 { font-size: clamp(27px, 4vw, 32px) !important; line-height: 1.15 !important; } .tla-ph-match-v1 .tla-ph-v1-step legend { font-size: clamp(29px, 4.4vw, 36px) !important; line-height: 1.16 !important; } .tla-ph-match-v1 .tla-ph-result-group-head h3, .tla-ph-match-v1 .tla-ph-match-contact h3, .tla-ph-match-v1 .tla-ph-match-empty-actions h3 { font-size: clamp(25px, 4vw, 31px) !important; line-height: 1.16 !important; } .tla-ph-match-v1 .tla-ph-v1-business-search, .tla-ph-match-v1 .tla-ph-v1-finder { max-width: 820px; } .tla-ph-match-v1 .tla-ph-v1-business-search { padding: 24px; } .tla-ph-match-v1 .tla-ph-v1-business-search-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .tla-ph-match-v1 .tla-ph-v1-business-search-form button { grid-column: 1 / -1; width: 100%; } .tla-ph-match-v1 .tla-ph-v1-sector-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tla-ph-match-v1 .tla-ph-v1-finder { padding: 26px; } .tla-ph-match-v1 .tla-ph-other-matches .tla-ph-match-list, .tla-ph-match-v1 .tla-ph-match-list.is-best { grid-template-columns: 1fr !important; max-width: 820px; margin-inline: auto; } .tla-ph-match-v1 .tla-ph-match { height: auto; } .tla-ph-match-v1 .tla-ph-match-head { grid-template-columns: 52px minmax(0, 1fr) 86px; grid-template-areas: "mark identity score" ". badge score"; align-items: center; column-gap: 16px; row-gap: 8px; } .tla-ph-match-v1 .tla-ph-match-mark { grid-area: mark; } .tla-ph-match-v1 .tla-ph-match-identity { grid-area: identity; } .tla-ph-match-v1 .tla-ph-match-score { grid-area: score; justify-self: end; margin: 0; } .tla-ph-match-v1 .tla-ph-match-accreditation { grid-area: badge; justify-self: start; margin: 0 !important; } .tla-ph-match-v1 .tla-ph-v1-trust { max-width: 820px; grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* Mobile: one clear vertical journey with touch-sized controls and no desktop grid leftovers. */ @media (max-width: 640px) { .tla-ph-match-v1 { padding: 14px 0 44px !important; } .tla-ph-match-v1 > .tla-ph-shell-inner { padding-inline: 12px !important; } .tla-ph-match-v1 .tla-ph-v1-hero { padding: 18px 4px 4px !important; margin: 0 auto 20px !important; } .tla-ph-match-v1 .tla-ph-v1-hero-brand { margin-bottom: 22px !important; } .tla-ph-match-v1 .tla-ph-v1-hero-logo { width: min(100%, 200px) !important; } .tla-ph-match-v1 .tla-ph-v1-hero-logo .tla-ph-trusted-logo { max-width: 200px !important; } .tla-ph-match-v1 .tla-ph-v1-hero h1 { max-width: 360px; margin: 0 auto 13px !important; font-size: clamp(29px, 8.2vw, 36px) !important; line-height: 1.08 !important; letter-spacing: -.035em !important; text-wrap: balance; } .tla-ph-match-v1 .tla-ph-v1-hero > p:last-child { max-width: 390px; font-size: 15px !important; line-height: 1.58 !important; } .tla-ph-match-v1 .tla-ph-v1-business-search { margin-bottom: 16px; padding: 19px 16px; border-radius: 18px; text-align: center; box-shadow: 0 10px 30px rgba(18, 33, 62, .07); } .tla-ph-match-v1 .tla-ph-v1-business-search .tla-ph-frontend-eyebrow { justify-content: center; } .tla-ph-match-v1 .tla-ph-v1-business-search h2 { margin: 7px auto 7px; font-size: 24px !important; line-height: 1.18 !important; text-wrap: balance; } .tla-ph-match-v1 .tla-ph-v1-business-search p { margin-bottom: 16px; font-size: 14px; line-height: 1.55; } .tla-ph-match-v1 .tla-ph-v1-business-search-form { display: grid; grid-template-columns: 1fr !important; gap: 13px; } .tla-ph-match-v1 .tla-ph-v1-business-search-form label, .tla-ph-match-v1 .tla-ph-v1-business-search-form button { width: 100%; } .tla-ph-match-v1 .tla-ph-v1-business-search-form input, .tla-ph-match-v1 .tla-ph-v1-business-search-form button { min-height: 50px; border-radius: 12px; } .tla-ph-match-v1 .tla-ph-v1-business-search-form button { grid-column: auto !important; } .tla-ph-match-v1 .tla-ph-v1-finder { padding: 19px 16px 17px !important; border-radius: 19px !important; box-shadow: 0 14px 38px rgba(18, 20, 45, .10); } .tla-ph-match-v1 .tla-ph-v1-progress { display: grid; grid-template-columns: 1fr; gap: 9px; margin-bottom: 22px; } .tla-ph-match-v1 .tla-ph-v1-progress > div { width: 100%; height: 6px; } .tla-ph-match-v1 .tla-ph-v1-step legend { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 11px; float: none; margin: 0 0 10px; font-size: clamp(25px, 7.2vw, 30px) !important; line-height: 1.12 !important; letter-spacing: -.025em !important; } .tla-ph-match-v1 .tla-ph-v1-step legend > span { width: 38px; height: 38px; flex-basis: 38px; font-size: 16px; } .tla-ph-match-v1 .tla-ph-v1-step-copy { clear: both; margin: 0 0 20px; font-size: 15px; line-height: 1.55; } .tla-ph-match-v1 .tla-ph-v1-sector-grid, .tla-ph-match-v1 .tla-ph-v1-optional-grid, .tla-ph-match-v1 .tla-ph-match-fields { grid-template-columns: 1fr !important; gap: 12px; } .tla-ph-match-v1 .tla-ph-v1-sector-grid { margin-bottom: 17px; } .tla-ph-match-v1 .tla-ph-v1-sector > span { min-height: 76px; padding: 15px 16px; border-radius: 14px; } .tla-ph-match-v1 .tla-ph-v1-sector strong { font-size: 15px; } .tla-ph-match-v1 .tla-ph-v1-sector small { font-size: 12px; } .tla-ph-match-v1 .tla-ph-v1-inline-options, .tla-ph-match-v1 .tla-ph-v1-timing { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; } .tla-ph-match-v1 .tla-ph-v1-inline-options span, .tla-ph-match-v1 .tla-ph-v1-timing span { min-height: 54px; justify-content: center; padding: 12px 10px; border-radius: 13px; text-align: center; line-height: 1.3; } .tla-ph-match-v1 .tla-ph-match-field { margin-top: 15px; } .tla-ph-match-v1 .tla-ph-match-field > span, .tla-ph-match-v1 .tla-ph-match-fields label > span, .tla-ph-match-v1 .tla-ph-v1-business-search-form label span { font-size: 12px; } .tla-ph-match-v1 .tla-ph-match-field input, .tla-ph-match-v1 .tla-ph-match-field select, .tla-ph-match-v1 .tla-ph-match-field textarea, .tla-ph-match-v1 .tla-ph-match-fields input:not([type="checkbox"]), .tla-ph-match-v1 .tla-ph-match-fields select, .tla-ph-match-v1 .tla-ph-match-fields textarea { min-height: 50px; border-radius: 12px; padding: 12px 13px; } .tla-ph-match-v1 .tla-ph-v1-location input { font-size: 17px; padding: 14px; } .tla-ph-match-v1 .tla-ph-v1-optional-grid { margin: 17px 0; } .tla-ph-match-v1 .tla-ph-v1-step .tla-ph-match-actions { display: grid !important; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 10px; margin-top: 22px; padding-top: 17px; } .tla-ph-match-v1 .tla-ph-v1-step .tla-ph-match-actions > span:empty { display: none; } .tla-ph-match-v1 .tla-ph-v1-step .tla-ph-match-actions:has(> span:empty) { grid-template-columns: 1fr; } .tla-ph-match-v1 .tla-ph-v1-step .tla-ph-match-actions > * { width: 100%; min-height: 48px !important; } .tla-ph-match-v1 .tla-ph-v1-trust { grid-template-columns: 1fr !important; gap: 8px; margin: 14px auto 30px; } .tla-ph-match-v1 .tla-ph-v1-trust span { min-height: 44px; padding: 10px 12px 10px 38px; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: var(--tla-ph-surface); font-size: 12px; line-height: 1.4; } .tla-ph-match-v1 .tla-ph-v1-trust span::before { left: 14px; top: 50%; transform: translateY(-50%); } .tla-ph-match-v1 .tla-ph-match-results { padding: 44px 0 6px !important; margin-top: 0 !important; } .tla-ph-match-v1 .tla-ph-match-results > .tla-ph-section-heading { margin-bottom: 20px; } .tla-ph-match-v1 .tla-ph-results-brand { margin-bottom: 14px; } .tla-ph-match-v1 .tla-ph-results-logo { width: min(100%, 190px); } .tla-ph-match-v1 .tla-ph-results-logo .tla-ph-trusted-logo { max-width: 190px !important; } .tla-ph-match-v1 .tla-ph-match-results > .tla-ph-section-heading h2 { margin: 7px 0 8px !important; font-size: 28px !important; line-height: 1.15 !important; text-wrap: balance; } .tla-ph-match-v1 .tla-ph-match-results > .tla-ph-section-heading p, .tla-ph-match-v1 .tla-ph-result-group-head > p:last-child { font-size: 14px; line-height: 1.55; } .tla-ph-match-v1 .tla-ph-match-selection-help { margin-bottom: 20px; padding: 13px 14px; border-radius: 12px; font-size: 13px; } .tla-ph-match-v1 .tla-ph-best-match, .tla-ph-match-v1 .tla-ph-other-matches { margin-top: 26px; } .tla-ph-match-v1 .tla-ph-other-matches { margin-top: 38px; } .tla-ph-match-v1 .tla-ph-result-group-head { margin-bottom: 16px; padding-inline: 4px; } .tla-ph-match-v1 .tla-ph-result-group-head h3 { margin-bottom: 8px; font-size: 26px !important; line-height: 1.16 !important; text-wrap: balance; } .tla-ph-match-v1 .tla-ph-match-list, .tla-ph-match-v1 .tla-ph-other-matches .tla-ph-match-list, .tla-ph-match-v1 .tla-ph-match-list.is-best { grid-template-columns: 1fr !important; gap: 14px; width: 100%; max-width: none; } .tla-ph-match-v1 .tla-ph-match { width: 100%; height: auto !important; padding: 18px 16px 16px; border-radius: 17px; overflow: hidden; } .tla-ph-match-v1 .tla-ph-match:hover { transform: none; } .tla-ph-match-v1 .tla-ph-match-head { display: grid; grid-template-columns: 72px minmax(0, 1fr); grid-template-areas: "mark identity" "score badge"; align-items: center; column-gap: 12px; row-gap: 12px; } .tla-ph-match-v1 .tla-ph-match-mark { grid-area: mark; width: 46px; height: 46px; justify-self: center; } .tla-ph-match-v1 .tla-ph-match-identity { grid-area: identity; } .tla-ph-match-v1 .tla-ph-match-identity h3 { margin-bottom: 3px; font-size: 22px !important; line-height: 1.18 !important; overflow-wrap: anywhere; } .tla-ph-match-v1 .tla-ph-match-meta { display: grid; gap: 2px; font-size: 12px; } .tla-ph-match-v1 .tla-ph-match-meta span + span::before { display: none; } .tla-ph-match-v1 .tla-ph-match-score { grid-area: score; justify-self: center; width: 70px; height: 70px; margin: 0; } .tla-ph-match-v1 .tla-ph-match-score::before { inset: 5px; } .tla-ph-match-v1 .tla-ph-match-score strong { font-size: 19px; } .tla-ph-match-v1 .tla-ph-match-score span { font-size: 9px; } .tla-ph-match-v1 .tla-ph-match-score small { position: static; width: auto; max-width: 60px; margin-top: 2px; font-size: 8px; line-height: 1.05; text-align: center; } .tla-ph-match-v1 .tla-ph-match-accreditation { grid-area: badge; justify-self: start; align-self: center; max-width: 100%; margin: 0 !important; padding: 6px 9px; font-size: 9px; line-height: 1.2; white-space: normal; text-align: center; } .tla-ph-match-v1 .tla-ph-match-reasoning { margin-top: 16px; padding: 14px 13px 14px 15px; border-radius: 0 10px 10px 0; } .tla-ph-match-v1 .tla-ph-match-reasoning-title { margin-bottom: 8px !important; } .tla-ph-match-v1 .tla-ph-match-reasoning li { padding-left: 19px; font-size: 13px; line-height: 1.48; } .tla-ph-match-v1 .tla-ph-match-capability-group { margin-top: 15px; } .tla-ph-match-v1 .tla-ph-match-specialisms, .tla-ph-match-v1 .tla-ph-match-services { gap: 7px; } .tla-ph-match-v1 .tla-ph-match-specialisms li, .tla-ph-match-v1 .tla-ph-match-services li { max-width: 100%; padding: 6px 8px; font-size: 11px; overflow-wrap: anywhere; } .tla-ph-match-v1 .tla-ph-match-foot { display: grid; grid-template-columns: 1fr; align-items: stretch; gap: 12px; margin-top: 17px; padding-top: 15px; } .tla-ph-match-v1 .tla-ph-match-availability { font-size: 12px; } .tla-ph-match-v1 .tla-ph-match-unclaimed-note, .tla-ph-match-v1 .tla-ph-match-related-note { margin: 0 !important; font-size: 12px; line-height: 1.5; } .tla-ph-match-v1 .tla-ph-match-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 9px; width: 100%; margin-top: 0; padding-top: 0; border-top: 0; } .tla-ph-match-v1 .tla-ph-match-secondary, .tla-ph-match-v1 .tla-ph-match-select { width: 100%; min-height: 46px; justify-content: center; padding: 10px 11px; border-radius: 10px; font-size: 12px; line-height: 1.25; text-align: center; } .tla-ph-match-v1 .tla-ph-match-select input { flex: 0 0 16px; } .tla-ph-match-v1 .tla-ph-v1-shortlist { position: sticky; z-index: 50; bottom: calc(8px + env(safe-area-inset-bottom)); width: calc(100% - 4px); margin: 18px auto; padding: 13px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 15px; flex-direction: column; align-items: stretch; gap: 10px; text-align: center; } .tla-ph-match-v1 .tla-ph-v1-shortlist strong { font-size: 14px; } .tla-ph-match-v1 .tla-ph-v1-shortlist .tla-ph-frontend-button { width: 100%; min-height: 46px !important; } .tla-ph-match-v1 .tla-ph-match-contact { gap: 20px; margin-top: 24px; padding: 20px 16px; border-radius: 18px; } .tla-ph-match-v1 .tla-ph-match-contact h3 { margin: 8px 0 9px; font-size: 26px !important; line-height: 1.15 !important; text-wrap: balance; } .tla-ph-match-v1 .tla-ph-match-contact > div:first-child p { font-size: 14px; line-height: 1.55; } .tla-ph-match-v1 .tla-ph-match-contact .tla-ph-check { padding: 12px; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: var(--tla-ph-soft); } .tla-ph-match-v1 .tla-ph-match-contact .tla-ph-check span { font-size: 12px; } .tla-ph-match-v1 .tla-ph-match-contact > .tla-ph-match-actions { display: grid !important; grid-template-columns: 1fr; gap: 12px; margin-top: 0; } .tla-ph-match-v1 .tla-ph-match-contact > .tla-ph-match-actions > * { width: 100%; } .tla-ph-match-v1 .tla-ph-match-contact > .tla-ph-match-actions > span { font-size: 12px; line-height: 1.45; text-align: center; } .tla-ph-match-v1 .tla-ph-match-empty-actions, .tla-ph-match-v1 .tla-ph-match-recruit { grid-template-columns: 1fr !important; gap: 17px; padding: 20px 16px; border-radius: 18px; text-align: center; } .tla-ph-match-v1 .tla-ph-match-empty-buttons { display: grid !important; grid-template-columns: 1fr; width: 100%; min-width: 0; } .tla-ph-match-v1 .tla-ph-match-empty-buttons .tla-ph-frontend-button, .tla-ph-match-v1 .tla-ph-match-recruit .tla-ph-frontend-button { width: 100%; } .tla-ph-match-v1 .tla-ph-match-alternatives { padding: 20px 16px; border-radius: 18px; } .tla-ph-match-v1 .tla-ph-match-alternatives .tla-ph-directory-grid { grid-template-columns: 1fr !important; } .tla-ph-match-v1 .tla-ph-match-disclaimer { grid-template-columns: 1fr; margin-top: 34px; padding-top: 20px; } } /* Very narrow phones: avoid compressed paired controls. */ @media (max-width: 390px) { .tla-ph-match-v1 > .tla-ph-shell-inner { padding-inline: 9px !important; } .tla-ph-match-v1 .tla-ph-v1-finder, .tla-ph-match-v1 .tla-ph-v1-business-search { padding-inline: 14px !important; } .tla-ph-match-v1 .tla-ph-v1-inline-options, .tla-ph-match-v1 .tla-ph-v1-timing, .tla-ph-match-v1 .tla-ph-v1-step .tla-ph-match-actions, .tla-ph-match-v1 .tla-ph-match-actions { grid-template-columns: 1fr !important; } .tla-ph-match-v1 .tla-ph-v1-step .tla-ph-match-actions > span:empty { display: none; } .tla-ph-match-v1 .tla-ph-match-head { grid-template-columns: 66px minmax(0, 1fr); } .tla-ph-match-v1 .tla-ph-match { padding-inline: 14px; } } /* Finder dark mode: replace historical hard-coded white surfaces and ink values with the live Partner Hub theme tokens. */ html[data-tla-theme="dark"] .tla-ph-match-v1 { background: var(--tla-ph-bg, #010012); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-hero h1, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-business-search h2, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-step legend, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-question, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-result-group-head h3, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-identity h3, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-contact h3 { color: var(--tla-ph-heading, #f8f8ff) !important; } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-hero > p:last-child, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-business-search p, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-step-copy, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-sector small, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-location small, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-result-group-head > p:last-child, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-meta, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-capability-group > span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-unclaimed-note, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-related-note { color: var(--tla-ph-muted, #a0a0c0); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-business-search, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-finder, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-contact, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-empty-actions, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-alternatives, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-trust span { border-color: var(--tla-ph-border, rgba(255, 255, 255, .09)); background: var(--tla-ph-surface, #060720); color: var(--tla-ph-text, #e4e5f2); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-business-search { background: linear-gradient(135deg, var(--tla-ph-surface, #060720), #0b0d2a); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-progress > div { background: rgba(255, 255, 255, .10); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-sector > span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-inline-options span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-timing span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-field input, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-field select, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-field textarea, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-business-search-form input, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-fields input:not([type="checkbox"]), html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-fields select, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-fields textarea { border-color: var(--tla-ph-border, rgba(255, 255, 255, .09)); background: var(--tla-ph-bg-alt, #0a0a18); color: var(--tla-ph-text, #e4e5f2); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-sector strong, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-inline-options span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-timing span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-field > span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-fields label > span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-business-search-form label span { color: var(--tla-ph-text, #e4e5f2); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-sector input:checked + span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-inline-options input:checked + span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-timing input:checked + span { border-color: rgba(157, 92, 255, .70); background: linear-gradient(135deg, rgba(223, 41, 211, .18), rgba(10, 144, 246, .14)); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-score::before { background: var(--tla-ph-surface, #060720); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-score strong, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-reasoning li { color: var(--tla-ph-text, #e4e5f2); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-specialisms li, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-services li, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-secondary { border-color: var(--tla-ph-border, rgba(255, 255, 255, .09)); background: var(--tla-ph-bg-alt, #0a0a18); color: var(--tla-ph-text, #e4e5f2); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-reasoning { background: linear-gradient(90deg, rgba(10, 144, 246, .15), rgba(10, 144, 246, 0) 78%); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-accreditation.is-unclaimed { border-color: rgba(247, 183, 62, .35); background: rgba(247, 183, 62, .10); color: #ffd37a; } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-related-note { background: rgba(10, 144, 246, .12); } /* ===================================================================== MATCHING - stable-service introduction clarification (v1.0.13) ===================================================================== */ .tla-ph-match-query-summary { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 12px auto 0 !important; max-width: none !important; text-align: center; } .tla-ph-match-query-summary strong { color: var(--tla-ph-heading, #111827); } .tla-ph-match-related-note.is-introducible { background: rgba(14, 165, 233, .08); border: 1px solid rgba(14, 165, 233, .28); color: var(--tla-ph-text, #111827); } [data-tla-theme="dark"] .tla-ph-match-query-summary, .tla-theme-dark .tla-ph-match-query-summary, .dark .tla-ph-match-query-summary { color: rgba(226, 232, 240, .78); } [data-tla-theme="dark"] .tla-ph-match-query-summary strong, .tla-theme-dark .tla-ph-match-query-summary strong, .dark .tla-ph-match-query-summary strong, [data-tla-theme="dark"] .tla-ph-match-related-note.is-introducible, .tla-theme-dark .tla-ph-match-related-note.is-introducible, .dark .tla-ph-match-related-note.is-introducible { color: #f8fafc; } /* ===================================================================== MATCHING - recorded introduction confirmation (v1.0.14) ===================================================================== */ .tla-ph-match-v1 .tla-ph-match-confirmation { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 22px; width: min(100%, 1240px); margin: 18px auto 34px; padding: clamp(22px, 3vw, 34px); overflow: hidden; border: 1px solid rgba(5, 150, 105, .25); border-radius: 24px; background: radial-gradient(circle at 100% 0%, rgba(10, 144, 246, .10), transparent 34%), linear-gradient(135deg, rgba(236, 253, 245, .98), rgba(255, 255, 255, .98)); box-shadow: 0 22px 58px rgba(10, 0, 50, .09); color: var(--tla-ph-text, #111827); scroll-margin-top: calc(var(--tla-ph-global-header-height, 80px) + 22px); } .tla-ph-match-v1 .tla-ph-match-confirmation.is-review { border-color: rgba(245, 158, 11, .30); background: radial-gradient(circle at 100% 0%, rgba(245, 158, 11, .11), transparent 34%), linear-gradient(135deg, rgba(255, 251, 235, .98), rgba(255, 255, 255, .98)); } .tla-ph-match-v1 .tla-ph-match-confirmation:focus { outline: 3px solid rgba(10, 144, 246, .25); outline-offset: 4px; } .tla-ph-match-v1 .tla-ph-match-confirmation-mark { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 19px; background: linear-gradient(135deg, #059669, #0a90f6); color: #fff; box-shadow: 0 12px 28px rgba(5, 150, 105, .20); } .tla-ph-match-v1 .tla-ph-match-confirmation.is-review .tla-ph-match-confirmation-mark { background: linear-gradient(135deg, #d97706, #df29d3); } .tla-ph-match-v1 .tla-ph-match-confirmation-mark .dashicons { width: auto; height: auto; font-size: 31px; line-height: 1; } .tla-ph-match-v1 .tla-ph-match-confirmation-main { min-width: 0; } .tla-ph-match-v1 .tla-ph-match-confirmation h2 { max-width: 940px; margin: 8px 0 10px; color: var(--tla-ph-heading, #090a18); font-size: clamp(26px, 3vw, 40px) !important; font-weight: 850; letter-spacing: -.035em; line-height: 1.08; text-align: left; } .tla-ph-match-v1 .tla-ph-match-confirmation-main > p { max-width: 980px; margin: 0; color: var(--tla-ph-muted, #5f667d); font-size: 15px; line-height: 1.66; } .tla-ph-match-v1 .tla-ph-match-confirmation-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; margin-top: 22px; } .tla-ph-match-v1 .tla-ph-match-confirmation-facts > div { min-width: 0; padding: 14px 15px; border: 1px solid rgba(5, 150, 105, .16); border-radius: 14px; background: rgba(255, 255, 255, .72); } .tla-ph-match-v1 .tla-ph-match-confirmation.is-review .tla-ph-match-confirmation-facts > div { border-color: rgba(245, 158, 11, .20); } .tla-ph-match-v1 .tla-ph-match-confirmation-facts span { display: block; margin-bottom: 4px; color: var(--tla-ph-muted, #687087); font-size: 9px; font-weight: 850; letter-spacing: .09em; line-height: 1.2; text-transform: uppercase; } .tla-ph-match-v1 .tla-ph-match-confirmation-facts strong { display: block; color: var(--tla-ph-heading, #090a18); font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; } .tla-ph-match-v1 .tla-ph-match-confirmation-next { margin-top: 24px; padding-top: 21px; border-top: 1px solid rgba(5, 150, 105, .15); } .tla-ph-match-v1 .tla-ph-match-confirmation.is-review .tla-ph-match-confirmation-next { border-top-color: rgba(245, 158, 11, .19); } .tla-ph-match-v1 .tla-ph-match-confirmation-next h3 { margin: 0 0 13px; color: var(--tla-ph-heading, #090a18); font-size: 16px !important; font-weight: 820; } .tla-ph-match-v1 .tla-ph-match-confirmation-next ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; } .tla-ph-match-v1 .tla-ph-match-confirmation-next li { display: grid; grid-template-columns: 31px minmax(0, 1fr); gap: 10px; align-items: start; min-width: 0; } .tla-ph-match-v1 .tla-ph-match-confirmation-next li > span { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 10px; background: rgba(5, 150, 105, .11); color: #047857; font-size: 12px; font-weight: 900; } .tla-ph-match-v1 .tla-ph-match-confirmation.is-review .tla-ph-match-confirmation-next li > span { background: rgba(245, 158, 11, .12); color: #b45309; } .tla-ph-match-v1 .tla-ph-match-confirmation-next strong { display: block; color: var(--tla-ph-heading, #090a18); font-size: 13px; line-height: 1.35; } .tla-ph-match-v1 .tla-ph-match-confirmation-next p { margin: 4px 0 0; color: var(--tla-ph-muted, #687087); font-size: 12px; line-height: 1.5; } .tla-ph-match-v1 .tla-ph-match-confirmation-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; } .tla-ph-match-v1 .tla-ph-match-submit-alert { margin: 18px auto 28px; scroll-margin-top: calc(var(--tla-ph-global-header-height, 80px) + 22px); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-confirmation, .tla-theme-dark .tla-ph-match-v1 .tla-ph-match-confirmation, .dark .tla-ph-match-v1 .tla-ph-match-confirmation { border-color: rgba(99, 230, 184, .24); background: radial-gradient(circle at 100% 0%, rgba(10, 144, 246, .16), transparent 35%), linear-gradient(135deg, #071c1b, #08091d 65%); color: var(--tla-ph-text, #eef2ff); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-confirmation.is-review, .tla-theme-dark .tla-ph-match-v1 .tla-ph-match-confirmation.is-review, .dark .tla-ph-match-v1 .tla-ph-match-confirmation.is-review { border-color: rgba(251, 191, 36, .28); background: radial-gradient(circle at 100% 0%, rgba(245, 158, 11, .16), transparent 35%), linear-gradient(135deg, #1c1607, #08091d 65%); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-confirmation :where(h2, h3, strong), .tla-theme-dark .tla-ph-match-v1 .tla-ph-match-confirmation :where(h2, h3, strong), .dark .tla-ph-match-v1 .tla-ph-match-confirmation :where(h2, h3, strong) { color: #f8f9ff; } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-confirmation :where(p, .tla-ph-match-confirmation-facts span), .tla-theme-dark .tla-ph-match-v1 .tla-ph-match-confirmation :where(p, .tla-ph-match-confirmation-facts span), .dark .tla-ph-match-v1 .tla-ph-match-confirmation :where(p, .tla-ph-match-confirmation-facts span) { color: #b9bdd8; } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-match-confirmation-facts > div, .tla-theme-dark .tla-ph-match-v1 .tla-ph-match-confirmation-facts > div, .dark .tla-ph-match-v1 .tla-ph-match-confirmation-facts > div { border-color: rgba(255, 255, 255, .10); background: rgba(255, 255, 255, .045); } @media (max-width: 820px) { .tla-ph-match-v1 .tla-ph-match-confirmation { grid-template-columns: 52px minmax(0, 1fr); gap: 16px; border-radius: 20px; } .tla-ph-match-v1 .tla-ph-match-confirmation-mark { width: 52px; height: 52px; border-radius: 15px; } .tla-ph-match-v1 .tla-ph-match-confirmation-mark .dashicons { font-size: 26px; } .tla-ph-match-v1 .tla-ph-match-confirmation-facts { grid-template-columns: 1fr; } .tla-ph-match-v1 .tla-ph-match-confirmation-next ol { grid-template-columns: 1fr; gap: 14px; } } @media (max-width: 560px) { .tla-ph-match-v1 .tla-ph-match-confirmation { grid-template-columns: 1fr; margin: 12px auto 24px; padding: 19px 16px; text-align: center; } .tla-ph-match-v1 .tla-ph-match-confirmation-mark { margin: 0 auto; } .tla-ph-match-v1 .tla-ph-match-confirmation h2 { text-align: center; } .tla-ph-match-v1 .tla-ph-match-confirmation-next { text-align: left; } .tla-ph-match-v1 .tla-ph-match-confirmation-actions { display: grid; grid-template-columns: 1fr; } .tla-ph-match-v1 .tla-ph-match-confirmation-actions .tla-ph-frontend-button { width: 100%; } } /* 1.0.19 Business Opportunities communication suite. */ .tla-ph-opportunity-suite{background:var(--tla-ph-bg,#f5f7fc);min-height:700px;padding:28px 0 50px}.tla-ph-opportunity-head{align-items:center;display:flex;gap:24px;justify-content:space-between;margin-bottom:22px}.tla-ph-opportunity-head h1{color:var(--tla-ph-heading);font-size:clamp(30px,4vw,46px);letter-spacing:-.04em;margin:5px 0 8px}.tla-ph-opportunity-head p{color:var(--tla-ph-muted);font-size:16px;line-height:1.6;margin:0;max-width:760px}.tla-ph-opportunity-service-standard{background:#fff;border:1px solid var(--tla-ph-border);border-radius:16px;color:var(--tla-ph-muted);display:flex;flex-direction:column;min-width:220px;padding:15px 18px}.tla-ph-opportunity-service-standard strong{color:#087fc2;margin-top:4px}.tla-ph-opportunity-metrics{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:20px}.tla-ph-opportunity-metrics>div{background:#fff;border:1px solid var(--tla-ph-border);border-radius:15px;padding:16px}.tla-ph-opportunity-metrics span{color:var(--tla-ph-muted);display:block;font-size:12px;font-weight:700;text-transform:uppercase}.tla-ph-opportunity-metrics strong{color:var(--tla-ph-heading);font-size:28px}.tla-ph-opportunity-layout{display:grid;gap:18px;grid-template-columns:minmax(250px,.72fr) minmax(0,1.7fr)}.tla-ph-opportunity-list,.tla-ph-opportunity-detail{background:#fff;border:1px solid var(--tla-ph-border);border-radius:20px;min-width:0;padding:20px}.tla-ph-opportunity-list h2{font-size:20px;margin:0 0 15px}.tla-ph-opportunity-list-item{border:1px solid var(--tla-ph-border);border-radius:13px;color:inherit;display:flex;flex-direction:column;gap:6px;margin-top:10px;padding:14px;text-decoration:none!important}.tla-ph-opportunity-list-item:hover,.tla-ph-opportunity-list-item.is-active{background:#f1f8ff;border-color:#17b2e2}.tla-ph-opportunity-list-item strong{color:var(--tla-ph-heading);font-size:15px}.tla-ph-opportunity-list-item small{color:var(--tla-ph-muted)}.tla-ph-opportunity-title{align-items:flex-start;border-bottom:1px solid var(--tla-ph-border);display:flex;justify-content:space-between;margin-bottom:18px;padding-bottom:16px}.tla-ph-opportunity-title h2{font-size:24px;margin:3px 0}.tla-ph-opportunity-title p,.tla-ph-opportunity-title span{color:var(--tla-ph-muted);margin:0}.tla-ph-private-brief{background:#f4f8ff;border-left:4px solid #17b2e2;border-radius:12px;display:flex;gap:12px;margin:18px 0;padding:17px}.tla-ph-private-brief p{line-height:1.65;margin:6px 0 0}.tla-ph-opportunity-contact{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin:18px 0}.tla-ph-opportunity-contact>div{background:#f8f9fc;border-radius:10px;padding:12px}.tla-ph-opportunity-contact span{color:var(--tla-ph-muted);display:block;font-size:12px}.tla-ph-opportunity-thread,.tla-ph-opportunity-outcome{border-top:1px solid var(--tla-ph-border);margin-top:22px;padding-top:20px}.tla-ph-opportunity-thread article{background:#eef8ff;border-radius:13px;margin:10px 0 10px 12%;padding:14px}.tla-ph-opportunity-thread article.is-member{background:#f5f1ff;margin-left:0;margin-right:12%}.tla-ph-opportunity-thread article p{line-height:1.55;margin:5px 0}.tla-ph-opportunity-thread article small{color:var(--tla-ph-muted)}.tla-ph-opportunity-suite label{display:flex;flex-direction:column;font-weight:700;gap:7px;margin:12px 0}.tla-ph-opportunity-suite textarea,.tla-ph-opportunity-suite select,.tla-ph-opportunity-suite input[type=number]{border:1px solid #cfd5e3;border-radius:10px;font:inherit;padding:11px;width:100%}.tla-ph-opportunity-outcome>div{display:grid;gap:12px;grid-template-columns:1fr 1fr}.tla-ph-opportunity-settings{background:#fff;border:1px solid var(--tla-ph-border);border-radius:16px;margin-top:18px;padding:16px 20px}.tla-ph-opportunity-settings summary{color:var(--tla-ph-heading);cursor:pointer;font-weight:800}.tla-ph-opportunity-settings form>label{align-items:center;flex-direction:row;font-weight:600}.tla-ph-opportunity-settings p{color:var(--tla-ph-muted);font-size:13px}.tla-ph-status-pill.is-new{background:#e9f7ff;color:#087fc2}.tla-ph-status-pill.is-converted{background:#e9f9ef;color:#187a3d}.tla-ph-status-pill.is-closed,.tla-ph-status-pill.is-not_suitable{background:#f1f2f5;color:#555d70} @media(max-width:900px){.tla-ph-opportunity-head{align-items:stretch;flex-direction:column}.tla-ph-opportunity-layout{grid-template-columns:1fr}.tla-ph-opportunity-metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.tla-ph-opportunity-metrics,.tla-ph-opportunity-contact,.tla-ph-opportunity-outcome>div{grid-template-columns:1fr}.tla-ph-opportunity-list,.tla-ph-opportunity-detail{border-radius:14px;padding:15px}} /* 1.0.21 coherent membership, approval and opportunity states. */ .tla-ph-opportunity-suite .tla-ph-empty-state .tla-ph-frontend-button{display:inline-flex;margin-top:14px} .tla-ph-opportunity-suite .tla-ph-empty-state p{max-width:680px} .tla-ph-shell :where(a.tla-ph-frontend-button,a.tla-ph-button,button.tla-ph-frontend-button,button.tla-ph-button):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu), .tla-ph-shell :where(a.tla-ph-frontend-button,a.tla-ph-button,button.tla-ph-frontend-button,button.tla-ph-button):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu):visited{ background:#fff!important; border:1px solid rgba(31,38,70,.18)!important; color:#111326!important; -webkit-text-fill-color:#111326!important; } .tla-ph-shell :where(a.tla-ph-frontend-button,a.tla-ph-button,button.tla-ph-frontend-button,button.tla-ph-button):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu):hover, .tla-ph-shell :where(a.tla-ph-frontend-button,a.tla-ph-button,button.tla-ph-frontend-button,button.tla-ph-button):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu):focus-visible{ background:#eef5ff!important; border-color:rgba(10,144,246,.42)!important; color:#090b1c!important; -webkit-text-fill-color:#090b1c!important; } /* 1.0.24 final customer-facing design safeguards. */ .tla-ph-shell :where(h1,h2,h3,h4):not(.tla-ph-public-profile-hero h1):not(.tla-ph-match-v1 h1), .tla-ph-opportunity-suite :where(h1,h2,h3,h4) { font-family:var(--tla-ph-font)!important; font-size:22px!important; line-height:1.25!important; } .tla-ph-shell :where( a.tla-ph-frontend-button, a.tla-ph-button, button.tla-ph-frontend-button, button.tla-ph-button, input.tla-ph-button, .tla-ph-claim-listing-button ):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu), .tla-ph-shell :where( a.tla-ph-frontend-button, a.tla-ph-button, button.tla-ph-frontend-button, button.tla-ph-button, input.tla-ph-button, .tla-ph-claim-listing-button ):not(.tla-ph-flash-dismiss):not(.tla-ph-partner-mobile-menu):is(:hover,:focus,:active,:visited) { min-height:42px!important; padding:10px 17px!important; border:1px solid #8dcef5!important; border-radius:12px!important; background:#eaf6fe!important; background-image:none!important; color:#063a63!important; -webkit-text-fill-color:#063a63!important; font-family:var(--tla-ph-font)!important; font-size:12px!important; font-weight:800!important; line-height:1.2!important; text-shadow:none!important; box-shadow:none!important; filter:none!important; } .tla-ph-shell :where( .tla-ph-workspace-panel, .tla-ph-frontend-card, .tla-ph-empty-state, .tla-ph-opportunity-list, .tla-ph-opportunity-detail, .tla-ph-opportunity-settings, .tla-ph-opportunity-metrics > div ) { border-radius:18px!important; } /* 1.0.42 — member recommendation banner on the Partner Hub join route. */ .tla-ph-referral-banner{display:flex;gap:18px;align-items:flex-start;max-width:1180px;margin:24px auto;padding:22px 24px;border:1px solid rgba(10,144,246,.2);border-radius:18px;background:linear-gradient(135deg,#f6f2ff,#eef9ff);box-shadow:0 14px 40px rgba(13,20,54,.08)} .tla-ph-referral-banner>.dashicons{display:inline-flex;flex:0 0 auto;width:48px;height:48px;align-items:center;justify-content:center;border-radius:14px;background:linear-gradient(135deg,#df29d3,#6e22ff,#17b2e2);color:#fff;font-size:24px} .tla-ph-referral-banner small{color:#6e22ff;font-size:10px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}.tla-ph-referral-banner h2{margin:5px 0 7px!important;color:#11162b!important;font-size:24px!important}.tla-ph-referral-banner p{margin:0!important;color:#59627c!important;font-size:14px!important;line-height:1.65!important} html[data-tla-theme="dark"] .tla-ph-referral-banner{border-color:rgba(77,168,218,.24);background:linear-gradient(135deg,#16102f,#0b1b32);box-shadow:0 18px 46px rgba(0,0,0,.28)}html[data-tla-theme="dark"] .tla-ph-referral-banner h2{color:#fff!important}html[data-tla-theme="dark"] .tla-ph-referral-banner p{color:#c5cce0!important}html[data-tla-theme="dark"] .tla-ph-referral-banner small{color:#7bd8f4} @media(max-width:820px){.tla-ph-referral-banner{margin:18px 14px;padding:18px}.tla-ph-referral-banner h2{font-size:20px!important}} /* 1.0.43 — transparent membership visibility power and maximum-visibility plan. */ .tla-ph-public-price-card.is-pro{ border-color:rgba(110,34,255,.42); box-shadow:0 22px 55px rgba(110,34,255,.14); } .tla-ph-plan-recommendation{ align-items:center; align-self:flex-start; background:linear-gradient(135deg,#df29d3,#6e22ff,#17b2e2); border-radius:999px; box-shadow:0 10px 24px rgba(110,34,255,.2); color:#fff; display:inline-flex; font-size:11px; font-weight:900; letter-spacing:.08em; margin:-8px 0 16px; padding:8px 13px; text-transform:uppercase; } .tla-ph-plan-visibility{ align-items:center; background:#f7f9fd; border:1px solid #dfe5ef; border-radius:15px; display:grid; gap:4px; grid-template-columns:minmax(0,1fr) auto; margin:4px 0 14px; padding:14px 15px; } .tla-ph-plan-visibility>span{ color:#667089; font-size:10px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; } .tla-ph-plan-visibility>strong{ color:#11162b; font-size:25px; grid-column:2; grid-row:1/3; letter-spacing:-.04em; } .tla-ph-plan-visibility>small{ color:#59627c; font-size:12px; font-weight:700; line-height:1.45; } .tla-ph-plan-visibility.is-trusted{ background:linear-gradient(135deg,rgba(10,144,246,.08),rgba(23,178,226,.05)); border-color:rgba(10,144,246,.25); } .tla-ph-plan-visibility.is-pro{ background:linear-gradient(135deg,rgba(223,41,211,.08),rgba(110,34,255,.08),rgba(23,178,226,.06)); border-color:rgba(110,34,255,.28); } .tla-ph-plan-visibility.is-trusted>strong{color:#0876c9} .tla-ph-plan-visibility.is-pro>strong{color:#6e22ff} .tla-ph-plan-visibility-note{ color:#727a8f!important; font-size:11px!important; line-height:1.55!important; margin:0 0 14px!important; min-height:0!important; } .tla-ph-match-visibility{ align-items:center; border:1px solid #dfe5ef; border-radius:12px; display:grid; gap:2px; margin:0!important; min-width:126px; padding:8px 10px; text-align:right; } .tla-ph-match-visibility strong{ color:#11162b; font-size:10px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; } .tla-ph-match-visibility span{ color:#6a7288; font-size:10px; font-weight:750; white-space:nowrap; } .tla-ph-match-visibility.is-trusted{ background:rgba(10,144,246,.07); border-color:rgba(10,144,246,.24); } .tla-ph-match-visibility.is-pro{ background:linear-gradient(135deg,rgba(223,41,211,.08),rgba(110,34,255,.08)); border-color:rgba(110,34,255,.28); } .tla-ph-match-visibility.is-trusted strong{color:#0876c9} .tla-ph-match-visibility.is-pro strong{color:#6e22ff} html[data-tla-theme="dark"] .tla-ph-plan-visibility, html[data-tla-theme="dark"] .tla-ph-match-visibility{ background:#11142d; border-color:#303655; } html[data-tla-theme="dark"] .tla-ph-plan-visibility>span, html[data-tla-theme="dark"] .tla-ph-plan-visibility>small, html[data-tla-theme="dark"] .tla-ph-match-visibility span{color:#b5bdd2} html[data-tla-theme="dark"] .tla-ph-plan-visibility>strong, html[data-tla-theme="dark"] .tla-ph-match-visibility strong{color:#fff} html[data-tla-theme="dark"] .tla-ph-plan-visibility.is-trusted, html[data-tla-theme="dark"] .tla-ph-match-visibility.is-trusted{background:rgba(10,144,246,.12);border-color:rgba(23,178,226,.28)} html[data-tla-theme="dark"] .tla-ph-plan-visibility.is-pro, html[data-tla-theme="dark"] .tla-ph-match-visibility.is-pro{background:linear-gradient(135deg,rgba(223,41,211,.13),rgba(110,34,255,.16));border-color:rgba(223,41,211,.3)} @media(max-width:900px){ .tla-ph-match-head{grid-template-columns:52px minmax(0,1fr) auto} .tla-ph-match-visibility{grid-column:2/4;justify-self:start;margin-top:10px!important;text-align:left} } @media(max-width:560px){ .tla-ph-match-visibility{grid-column:2;min-width:0;width:100%} .tla-ph-plan-visibility{grid-template-columns:minmax(0,1fr) auto} } /* ========================================================= 1.0.45 — BOOST YOUR VISIBILITY FOCUS WORKSPACE ========================================================= */ .tla-ph-partner-app.is-promotions-focus .tla-ph-partner-app-frame { grid-template-columns: minmax(205px, 235px) minmax(0, 1fr); } .tla-ph-partner-app.is-promotions-focus .tla-ph-partner-main { min-width: 0; } .tla-ph-partner-app.is-promotions-focus .tla-ph-partner-panel-content { width: 100%; } .tla-ph-partner-app.is-promotions-focus .tla-ph-promotion-workspace .tla-ph-shell-inner { max-width: 1560px; } .tla-ph-promotion-stage-nav { position: sticky; top: var(--tla-ph-header-clearance, 96px); z-index: 12; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 18px 0; padding: 8px; border: 1px solid var(--tla-ph-border); border-radius: 16px; background: color-mix(in srgb, var(--tla-ph-surface) 94%, transparent); box-shadow: 0 16px 38px rgba(0,0,0,.08); backdrop-filter: blur(18px); } .tla-ph-promotion-stage-nav a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 12px; border-radius: 11px; color: var(--tla-ph-muted); font-size: 12px; font-weight: 850; text-decoration: none; } .tla-ph-promotion-stage-nav a:hover, .tla-ph-promotion-stage-nav a.is-active { background: color-mix(in srgb, var(--tla-ph-blue) 9%, var(--tla-ph-surface)); color: var(--tla-ph-heading); } .tla-ph-promotion-stage-nav span { color: var(--tla-ph-blue); font-size: 10px; letter-spacing: .08em; } .tla-ph-promotion-opportunities .tla-ph-section-heading { align-items: end; display: flex; justify-content: space-between; gap: 20px; } .tla-ph-promotion-opportunities .tla-ph-section-heading > p { max-width: 560px; margin: 0; color: var(--tla-ph-muted); font-size: 13px; line-height: 1.6; text-align: right; } .tla-ph-promotion-empty-state { display: flex; align-items: flex-start; gap: 15px; padding: 20px; border: 1px dashed color-mix(in srgb, var(--tla-ph-blue) 28%, var(--tla-ph-border)); border-radius: 16px; background: color-mix(in srgb, var(--tla-ph-blue) 4%, var(--tla-ph-soft)); } .tla-ph-promotion-empty-state > span { color: var(--tla-ph-blue); font-size: 25px; width: 28px; height: 28px; } .tla-ph-promotion-empty-state strong { display: block; margin-bottom: 4px; color: var(--tla-ph-heading); font-size: 15px; } .tla-ph-promotion-empty-state p { margin: 0; color: var(--tla-ph-muted); font-size: 13px; line-height: 1.65; } .tla-ph-promotion-inventory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } .tla-ph-promotion-inventory-card { padding: 17px; border: 1px solid var(--tla-ph-border); border-radius: 15px; background: var(--tla-ph-soft); } .tla-ph-promotion-inventory-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; } .tla-ph-promotion-inventory-top span, .tla-ph-promotion-inventory-top b { font-size: 10px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; } .tla-ph-promotion-inventory-top span { color: var(--tla-ph-muted); } .tla-ph-promotion-inventory-top b { color: var(--tla-ph-blue); } .tla-ph-promotion-inventory-card h3 { margin: 0 0 8px; font-size: 16px; line-height: 1.25; } .tla-ph-promotion-inventory-card p { min-height: 42px; margin: 0 0 12px; color: var(--tla-ph-muted); font-size: 12px; line-height: 1.55; } .tla-ph-promotion-inventory-card a { color: var(--tla-ph-blue); font-size: 12px; font-weight: 850; text-decoration: none; } @media (max-width: 1180px) { .tla-ph-promotion-inventory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 900px) { .tla-ph-partner-app.is-promotions-focus .tla-ph-partner-app-frame { grid-template-columns: 1fr; } .tla-ph-promotion-stage-nav { top: var(--tla-ph-header-clearance, 82px); overflow-x: auto; grid-template-columns: repeat(4, minmax(145px, 1fr)); } } @media (max-width: 680px) { .tla-ph-promotion-opportunities .tla-ph-section-heading { align-items: flex-start; flex-direction: column; } .tla-ph-promotion-opportunities .tla-ph-section-heading > p { text-align: left; } .tla-ph-promotion-inventory-grid { grid-template-columns: 1fr; } } /* ========================================================= 1.0.46 — COMMERCIAL DASHBOARD FOUNDATION ========================================================= */ .tla-ph-commercial-dashboard { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin: 0 0 22px; } .tla-ph-commercial-card { display: flex; flex-direction: column; min-height: 228px; padding: 20px; border: 1px solid var(--tla-ph-border); border-radius: 19px; background: var(--tla-ph-surface); box-shadow: 0 14px 34px rgba(0,0,0,.055); } .tla-ph-commercial-card-head { display:flex;align-items:center;gap:9px;margin-bottom:17px;color:var(--tla-ph-muted); } .tla-ph-commercial-card-head .dashicons { color:var(--tla-ph-blue);font-size:19px;width:19px;height:19px; } .tla-ph-commercial-card-head b { font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase; } .tla-ph-commercial-card > strong { color:var(--tla-ph-heading);font-size:35px;line-height:1;letter-spacing:-.045em;margin-bottom:10px; } .tla-ph-commercial-card > p { color:var(--tla-ph-muted);font-size:13px;line-height:1.55;margin:0 0 16px; } .tla-ph-commercial-card > a { color:var(--tla-ph-blue);font-size:12px;font-weight:850;margin-top:auto;text-decoration:none; } .tla-ph-commercial-card ul { display:grid;gap:7px;list-style:none;margin:0;padding:0; } .tla-ph-commercial-card li a { align-items:center;background:var(--tla-ph-soft);border:1px solid transparent;border-radius:11px;color:var(--tla-ph-text);display:flex;font-size:12px;font-weight:750;gap:8px;justify-content:space-between;padding:9px 10px;text-decoration:none; } .tla-ph-commercial-card li a:hover { border-color:var(--tla-ph-blue); } .tla-ph-commercial-card li b { color:var(--tla-ph-blue);font-size:12px;white-space:nowrap; } .tla-ph-commercial-card.is-recommended { background:linear-gradient(145deg,color-mix(in srgb,var(--tla-ph-purple) 8%,var(--tla-ph-surface)),var(--tla-ph-surface)); } .tla-ph-commercial-card.is-availability { background:linear-gradient(145deg,color-mix(in srgb,var(--tla-ph-blue) 7%,var(--tla-ph-surface)),var(--tla-ph-surface)); } @media(max-width:1180px){.tla-ph-commercial-dashboard{grid-template-columns:repeat(2,minmax(0,1fr));}} @media(max-width:620px){.tla-ph-commercial-dashboard{grid-template-columns:1fr}.tla-ph-commercial-card{min-height:0}.tla-ph-commercial-card > strong{font-size:31px}} /* ========================================================= 1.0.47 — AUDIENCE INTELLIGENCE CENTRE ========================================================= */ .tla-ph-audience-intelligence { margin: 0 0 22px; overflow: hidden; border: 1px solid var(--tla-ph-border); border-radius: 22px; background: radial-gradient(circle at top right, color-mix(in srgb,var(--tla-ph-purple) 10%,transparent), transparent 36%), var(--tla-ph-surface); box-shadow: 0 18px 44px rgba(0,0,0,.06); } .tla-ph-intelligence-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 24px 26px 18px; } .tla-ph-intelligence-head h2 { margin: 5px 0 8px; color: var(--tla-ph-heading); font-size: clamp(22px,2.5vw,31px); line-height: 1.1; letter-spacing: -.035em; } .tla-ph-intelligence-head p { max-width: 760px; margin: 0; color: var(--tla-ph-muted); font-size: 13px; line-height: 1.65; } .tla-ph-intelligence-verified { display: flex; align-items: center; gap: 10px; min-width: 250px; padding: 13px 14px; border: 1px solid color-mix(in srgb,var(--tla-ph-blue) 22%,var(--tla-ph-border)); border-radius: 14px; background: color-mix(in srgb,var(--tla-ph-blue) 6%,var(--tla-ph-surface)); } .tla-ph-intelligence-verified .dashicons { color: var(--tla-ph-blue); } .tla-ph-intelligence-verified strong, .tla-ph-intelligence-verified small { display: block; } .tla-ph-intelligence-verified strong { color: var(--tla-ph-heading); font-size: 12px; line-height: 1.35; } .tla-ph-intelligence-verified small { margin-top: 2px; color: var(--tla-ph-muted); font-size: 10px; } .tla-ph-intelligence-recommendation { display: grid; grid-template-columns: auto 1fr; gap: 13px; margin: 0 26px 18px; padding: 15px 17px; border: 1px solid color-mix(in srgb,var(--tla-ph-purple) 20%,var(--tla-ph-border)); border-radius: 15px; background: linear-gradient(135deg,color-mix(in srgb,var(--tla-ph-purple) 8%,var(--tla-ph-surface)),var(--tla-ph-surface)); } .tla-ph-intelligence-recommendation > div:first-child { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 11px; background: color-mix(in srgb,var(--tla-ph-purple) 13%,var(--tla-ph-surface)); color: var(--tla-ph-purple); } .tla-ph-intelligence-recommendation span, .tla-ph-intelligence-recommendation strong, .tla-ph-intelligence-recommendation p { display: block; } .tla-ph-intelligence-recommendation > div:last-child > span { margin-bottom: 3px; color: var(--tla-ph-purple); font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-intelligence-recommendation strong { color: var(--tla-ph-heading); font-size: 15px; line-height: 1.35; } .tla-ph-intelligence-recommendation p { margin: 4px 0 0; color: var(--tla-ph-muted); font-size: 11px; line-height: 1.5; } .tla-ph-intelligence-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; padding: 0 26px; border-bottom: 1px solid var(--tla-ph-border); } .tla-ph-intelligence-tabs button { position: relative; padding: 14px 12px; border: 0; background: transparent; color: var(--tla-ph-muted); cursor: pointer; font-size: 12px; font-weight: 850; } .tla-ph-intelligence-tabs button::after { content: ""; position: absolute; right: 18px; bottom: -1px; left: 18px; height: 3px; border-radius: 3px 3px 0 0; background: transparent; } .tla-ph-intelligence-tabs button.is-active { color: var(--tla-ph-heading); } .tla-ph-intelligence-tabs button.is-active::after { background: linear-gradient(90deg,var(--tla-ph-purple),var(--tla-ph-blue)); } .tla-ph-intelligence-panel { padding: 22px 26px 24px; } .tla-ph-intelligence-panel[hidden] { display: none !important; } .tla-ph-intelligence-kpis { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; } .tla-ph-intelligence-kpis > div, .tla-ph-intelligence-portfolio-summary > div { padding: 15px; border: 1px solid var(--tla-ph-border); border-radius: 14px; background: var(--tla-ph-soft); } .tla-ph-intelligence-kpis span, .tla-ph-intelligence-kpis strong, .tla-ph-intelligence-portfolio-summary span, .tla-ph-intelligence-portfolio-summary strong { display: block; } .tla-ph-intelligence-kpis span, .tla-ph-intelligence-portfolio-summary span { min-height: 26px; color: var(--tla-ph-muted); font-size: 10px; font-weight: 800; line-height: 1.3; text-transform: uppercase; } .tla-ph-intelligence-kpis strong, .tla-ph-intelligence-portfolio-summary strong { margin-top: 7px; color: var(--tla-ph-heading); font-size: 23px; line-height: 1; letter-spacing: -.04em; } .tla-ph-intelligence-role-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-top: 10px; } .tla-ph-intelligence-role-grid > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 13px; border-radius: 12px; background: color-mix(in srgb,var(--tla-ph-blue) 5%,var(--tla-ph-surface)); } .tla-ph-intelligence-role-grid span { color: var(--tla-ph-muted); font-size: 11px; font-weight: 750; } .tla-ph-intelligence-role-grid b { color: var(--tla-ph-heading); font-size: 14px; } .tla-ph-intelligence-bars { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 20px; } .tla-ph-intelligence-bar { min-width: 0; } .tla-ph-intelligence-bar > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; } .tla-ph-intelligence-bar span { overflow: hidden; color: var(--tla-ph-text); font-size: 12px; font-weight: 780; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-intelligence-bar b { color: var(--tla-ph-heading); font-size: 12px; } .tla-ph-intelligence-bar i { display: block; height: 8px; overflow: hidden; border-radius: 999px; background: var(--tla-ph-soft); } .tla-ph-intelligence-bar i em { display: block; width: var(--tla-intelligence-width,0%); height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--tla-ph-purple),var(--tla-ph-blue)); } .tla-ph-intelligence-bar small { display: block; margin-top: 5px; color: var(--tla-ph-muted); font-size: 9px; } .tla-ph-intelligence-helper { margin: 18px 0 0; padding: 11px 13px; border-radius: 11px; background: var(--tla-ph-soft); color: var(--tla-ph-muted); font-size: 11px; } .tla-ph-intelligence-portfolio-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 18px; } .tla-ph-intelligence-split { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; } .tla-ph-intelligence-split > div { padding: 16px; border: 1px solid var(--tla-ph-border); border-radius: 15px; background: var(--tla-ph-soft); } .tla-ph-intelligence-split h3 { margin: 0 0 10px; color: var(--tla-ph-heading); font-size: 13px; } .tla-ph-intelligence-split ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; } .tla-ph-intelligence-split li { display: flex; justify-content: space-between; gap: 10px; color: var(--tla-ph-muted); font-size: 11px; } .tla-ph-intelligence-split li b { color: var(--tla-ph-heading); } .tla-ph-intelligence-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 26px; border-top: 1px solid var(--tla-ph-border); background: var(--tla-ph-soft); } .tla-ph-intelligence-foot p { margin: 0; color: var(--tla-ph-muted); font-size: 9px; line-height: 1.45; } .tla-ph-intelligence-foot a { flex: 0 0 auto; color: var(--tla-ph-blue); font-size: 10px; font-weight: 850; text-decoration: none; } @media (max-width: 1180px) { .tla-ph-intelligence-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); } } @media (max-width: 820px) { .tla-ph-intelligence-head { flex-direction: column; } .tla-ph-intelligence-verified { width: 100%; min-width: 0; } .tla-ph-intelligence-kpis, .tla-ph-intelligence-role-grid, .tla-ph-intelligence-portfolio-summary { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-intelligence-tabs { overflow-x: auto; grid-template-columns: repeat(4,minmax(145px,1fr)); } } @media (max-width: 620px) { .tla-ph-intelligence-head, .tla-ph-intelligence-panel { padding-right: 18px; padding-left: 18px; } .tla-ph-intelligence-recommendation { margin-right: 18px; margin-left: 18px; } .tla-ph-intelligence-tabs { padding: 0 8px; } .tla-ph-intelligence-kpis, .tla-ph-intelligence-role-grid, .tla-ph-intelligence-bars, .tla-ph-intelligence-portfolio-summary, .tla-ph-intelligence-split { grid-template-columns: 1fr; } .tla-ph-intelligence-foot { align-items: flex-start; flex-direction: column; padding-right: 18px; padding-left: 18px; } } /* ========================================================= 1.0.48 — COMPACT AUDIENCE INTELLIGENCE REFINEMENT ========================================================= */ .tla-ph-audience-intelligence { font-size: 12px; } .tla-ph-audience-intelligence .tla-ph-intelligence-head { gap: 18px; padding: 19px 21px 14px; } .tla-ph-audience-intelligence .tla-ph-intelligence-head h2 { margin: 3px 0 6px; font-size: clamp(20px,2vw,25px); line-height: 1.12; } .tla-ph-audience-intelligence .tla-ph-intelligence-head p { max-width: 690px; font-size: 11.5px; line-height: 1.5; } .tla-ph-audience-intelligence .tla-ph-frontend-eyebrow { font-size: 10px; } .tla-ph-audience-intelligence .tla-ph-intelligence-verified { min-width: 220px; padding: 10px 12px; border-radius: 12px; } .tla-ph-audience-intelligence .tla-ph-intelligence-verified strong { font-size: 11px; line-height: 1.3; } .tla-ph-audience-intelligence .tla-ph-intelligence-verified small { font-size: 9px; } .tla-ph-audience-intelligence .tla-ph-intelligence-recommendation { gap: 11px; margin: 0 21px 13px; padding: 11px 13px; border-radius: 13px; } .tla-ph-audience-intelligence .tla-ph-intelligence-recommendation > div:first-child { width: 32px; height: 32px; border-radius: 10px; } .tla-ph-audience-intelligence .tla-ph-intelligence-recommendation > div:last-child > span { font-size: 9px; } .tla-ph-audience-intelligence .tla-ph-intelligence-recommendation strong { font-size: 13px; line-height: 1.3; } .tla-ph-audience-intelligence .tla-ph-intelligence-recommendation p { margin-top: 2px; font-size: 10px; line-height: 1.4; } .tla-ph-audience-intelligence .tla-ph-intelligence-tabs { padding: 0 21px; } .tla-ph-audience-intelligence .tla-ph-intelligence-tabs button { min-height: 42px; padding: 10px 8px; font-size: 10.5px; letter-spacing: .015em; } /* This higher-specificity rule prevents the legacy two-column intelligence panel from leaking into this workspace. */ .tla-ph-audience-intelligence .tla-ph-intelligence-panel { display: block; margin: 0; padding: 16px 21px 18px; border: 0; border-radius: 0; background: transparent; box-shadow: none; } .tla-ph-audience-intelligence .tla-ph-intelligence-panel[hidden] { display: none !important; } .tla-ph-audience-intelligence .tla-ph-intelligence-kpis { grid-template-columns: repeat(auto-fit,minmax(126px,1fr)); gap: 8px; } .tla-ph-audience-intelligence .tla-ph-intelligence-kpis > div, .tla-ph-audience-intelligence .tla-ph-intelligence-portfolio-summary > div { min-width: 0; padding: 11px 12px; border-radius: 12px; } .tla-ph-audience-intelligence .tla-ph-intelligence-kpis span, .tla-ph-audience-intelligence .tla-ph-intelligence-portfolio-summary span { min-height: 23px; overflow-wrap: anywhere; font-size: 8.5px; line-height: 1.25; } .tla-ph-audience-intelligence .tla-ph-intelligence-kpis strong, .tla-ph-audience-intelligence .tla-ph-intelligence-portfolio-summary strong { margin-top: 5px; font-size: 20px; line-height: 1; } .tla-ph-audience-intelligence .tla-ph-intelligence-role-grid { grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); gap: 8px; margin-top: 8px; } .tla-ph-audience-intelligence .tla-ph-intelligence-role-grid > div { min-width: 0; padding: 9px 11px; border-radius: 10px; } .tla-ph-audience-intelligence .tla-ph-intelligence-role-grid span { overflow-wrap: anywhere; font-size: 10px; } .tla-ph-audience-intelligence .tla-ph-intelligence-role-grid b { flex: 0 0 auto; font-size: 12px; } .tla-ph-audience-intelligence .tla-ph-intelligence-bars { gap: 11px 16px; } .tla-ph-audience-intelligence .tla-ph-intelligence-bar span, .tla-ph-audience-intelligence .tla-ph-intelligence-bar b { font-size: 10.5px; } .tla-ph-audience-intelligence .tla-ph-intelligence-bar small { font-size: 8.5px; } .tla-ph-audience-intelligence .tla-ph-intelligence-helper, .tla-ph-audience-intelligence .tla-ph-intelligence-split li { font-size: 10px; } .tla-ph-audience-intelligence .tla-ph-intelligence-split h3 { font-size: 12px; } .tla-ph-audience-intelligence .tla-ph-intelligence-foot { gap: 14px; padding: 10px 21px; } .tla-ph-audience-intelligence .tla-ph-intelligence-foot p { font-size: 8.5px; } .tla-ph-audience-intelligence .tla-ph-intelligence-foot a { font-size: 9px; } /* Keep other information-dense Promotions controls compact and consistent. */ .tla-ph-promotion-workspace .tla-ph-commercial-card { min-height: 205px; padding: 16px; } .tla-ph-promotion-workspace .tla-ph-commercial-card-head { margin-bottom: 12px; } .tla-ph-promotion-workspace .tla-ph-commercial-card > strong { margin-bottom: 7px; font-size: 29px; } .tla-ph-promotion-workspace .tla-ph-commercial-card > p { margin-bottom: 12px; font-size: 11px; line-height: 1.45; } .tla-ph-promotion-workspace .tla-ph-commercial-card > a, .tla-ph-promotion-workspace .tla-ph-commercial-card li a { font-size: 10.5px; } .tla-ph-promotion-workspace .tla-ph-promotion-placement-body { min-height: 166px; padding: 15px; } .tla-ph-promotion-workspace .tla-ph-promotion-placement-body > strong { font-size: 14px; } .tla-ph-promotion-workspace .tla-ph-promotion-placement-body > b { margin: 9px 0 5px; font-size: 21px; } .tla-ph-promotion-workspace .tla-ph-promotion-placement-body > p { font-size: 11px; line-height: 1.45; } .tla-ph-promotion-workspace .tla-ph-promotion-field label, .tla-ph-promotion-workspace .tla-ph-promotion-checks label { font-size: 11px; } .tla-ph-promotion-workspace .tla-ph-promotion-field input, .tla-ph-promotion-workspace .tla-ph-promotion-field select, .tla-ph-promotion-workspace .tla-ph-promotion-field textarea { font-size: 12px; } @media (max-width: 820px) { .tla-ph-audience-intelligence .tla-ph-intelligence-head { gap: 12px; } .tla-ph-audience-intelligence .tla-ph-intelligence-verified { width: 100%; min-width: 0; } } @media (max-width: 620px) { .tla-ph-audience-intelligence .tla-ph-intelligence-head, .tla-ph-audience-intelligence .tla-ph-intelligence-panel { padding-right: 15px; padding-left: 15px; } .tla-ph-audience-intelligence .tla-ph-intelligence-recommendation { margin-right: 15px; margin-left: 15px; } .tla-ph-audience-intelligence .tla-ph-intelligence-kpis, .tla-ph-audience-intelligence .tla-ph-intelligence-role-grid, .tla-ph-audience-intelligence .tla-ph-intelligence-portfolio-summary { grid-template-columns: repeat(2,minmax(0,1fr)); } } /* ========================================================= 1.0.49 — PLAIN PROMOTIONS UI + PUBLICATION ISSUE PLANNER ========================================================= */ .tla-ph-promotion-workspace { --tla-ph-salmon: #d55773; } /* Plain, controlled treatment for the dense intelligence area. */ .tla-ph-promotion-workspace .tla-ph-audience-intelligence, .tla-ph-promotion-workspace .tla-ph-commercial-card, .tla-ph-promotion-workspace .tla-ph-intelligence-recommendation, .tla-ph-promotion-workspace .tla-ph-intelligence-verified { background: var(--tla-ph-surface) !important; box-shadow: none !important; } .tla-ph-promotion-workspace .tla-ph-audience-intelligence { border-radius: 16px; } .tla-ph-promotion-workspace .tla-ph-intelligence-recommendation { border-left: 3px solid var(--tla-ph-blue); } .tla-ph-promotion-workspace .tla-ph-intelligence-recommendation > div:first-child { background: var(--tla-ph-soft); color: var(--tla-ph-blue); } .tla-ph-promotion-workspace .tla-ph-intelligence-recommendation > div:last-child > span { color: var(--tla-ph-blue); } /* Hard-scoped salmon hover/focus. The selected tab stays plain until hovered. */ .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button, .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button.is-active { border-radius: 8px 8px 0 0 !important; background: transparent !important; color: var(--tla-ph-heading) !important; box-shadow: none !important; } .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button:hover, .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button:focus-visible, .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button.is-active:hover, .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button.is-active:focus-visible { background: var(--tla-ph-salmon) !important; color: #fff !important; } .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button.is-active::after { background: var(--tla-ph-blue) !important; } .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button:hover::after, .tla-ph-promotion-workspace .tla-ph-intelligence-tabs button:focus-visible::after { background: transparent !important; } /* Content links are blue throughout this workspace. */ .tla-ph-promotion-workspace .tla-ph-commercial-card > a, .tla-ph-promotion-workspace .tla-ph-commercial-card li a, .tla-ph-promotion-workspace .tla-ph-intelligence-foot a, .tla-ph-promotion-workspace .tla-ph-promotion-inventory-card a, .tla-ph-promotion-workspace .tla-ph-issue-summary > a, .tla-ph-promotion-workspace .tla-ph-section-heading a { color: var(--tla-ph-blue) !important; } .tla-ph-issue-planner-controls { display: grid; grid-template-columns: minmax(180px,.75fr) minmax(0,2.25fr); gap: 18px; align-items: center; margin: 16px 0 14px; padding: 14px; border: 1px solid var(--tla-ph-border); border-radius: 13px; background: var(--tla-ph-surface); } .tla-ph-issue-planner-controls > div:first-child strong, .tla-ph-issue-planner-controls > div:first-child span { display: block; } .tla-ph-issue-planner-controls > div:first-child strong { color: var(--tla-ph-heading); font-size: 12px; } .tla-ph-issue-planner-controls > div:first-child span { margin-top: 3px; color: var(--tla-ph-muted); font-size: 10px; line-height: 1.4; } .tla-ph-zone-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; } .tla-ph-zone-options label { cursor: pointer; } .tla-ph-zone-options input { position: absolute; opacity: 0; pointer-events: none; } .tla-ph-zone-options label > span { display: block; min-height: 58px; padding: 10px 11px; border: 1px solid var(--tla-ph-border); border-radius: 10px; background: var(--tla-ph-soft); transition: border-color .16s ease, background .16s ease, color .16s ease; } .tla-ph-zone-options b, .tla-ph-zone-options small { display: block; } .tla-ph-zone-options b { color: var(--tla-ph-heading); font-size: 11px; } .tla-ph-zone-options small { margin-top: 4px; color: var(--tla-ph-muted); font-size: 9px; } .tla-ph-zone-options label:hover > span, .tla-ph-zone-options label:focus-within > span { border-color: var(--tla-ph-salmon) !important; background: color-mix(in srgb,var(--tla-ph-salmon) 10%,var(--tla-ph-surface)) !important; } .tla-ph-zone-options input:checked + span { border-color: var(--tla-ph-blue); background: color-mix(in srgb,var(--tla-ph-blue) 7%,var(--tla-ph-surface)); } .tla-ph-issue-timeline { display: grid; grid-auto-columns: minmax(148px,1fr); grid-auto-flow: column; gap: 9px; overflow-x: auto; padding: 2px 1px 10px; scrollbar-width: thin; scroll-snap-type: x proximity; } .tla-ph-issue-card { min-width: 0; cursor: pointer; scroll-snap-align: start; } .tla-ph-issue-card > input { position: absolute; opacity: 0; pointer-events: none; } .tla-ph-issue-card-body { display: flex; min-height: 166px; flex-direction: column; padding: 12px; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: var(--tla-ph-surface); transition: border-color .16s ease, background .16s ease, transform .16s ease; } .tla-ph-issue-card:hover .tla-ph-issue-card-body, .tla-ph-issue-card:focus-within .tla-ph-issue-card-body { border-color: var(--tla-ph-salmon) !important; background: color-mix(in srgb,var(--tla-ph-salmon) 8%,var(--tla-ph-surface)) !important; transform: translateY(-1px); } .tla-ph-issue-card.is-selected .tla-ph-issue-card-body { border-color: var(--tla-ph-blue); background: color-mix(in srgb,var(--tla-ph-blue) 6%,var(--tla-ph-surface)); } .tla-ph-issue-card.is-disabled { cursor: not-allowed; opacity: .5; } .tla-ph-issue-card-body > small { color: var(--tla-ph-blue); font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-issue-card-body > strong { margin: 2px 0 7px; color: var(--tla-ph-heading); font-size: 27px; line-height: 1; } .tla-ph-issue-card-body > b { min-height: 31px; color: var(--tla-ph-heading); font-size: 11px; line-height: 1.35; } .tla-ph-issue-card-body > em { align-self: flex-start; margin: 7px 0; padding: 3px 6px; border-radius: 999px; background: var(--tla-ph-soft); color: var(--tla-ph-text); font-size: 8px; font-style: normal; font-weight: 800; } .tla-ph-issue-card-body > span { margin-top: 3px; color: var(--tla-ph-muted); font-size: 8.5px; line-height: 1.35; } .tla-ph-issue-summary { display: grid; grid-template-columns: .7fr .7fr 1.4fr auto; gap: 12px; align-items: center; margin-top: 4px; padding: 12px 14px; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: var(--tla-ph-soft); } .tla-ph-issue-summary span, .tla-ph-issue-summary strong, .tla-ph-issue-summary small { display: block; } .tla-ph-issue-summary span { color: var(--tla-ph-muted); font-size: 8px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; } .tla-ph-issue-summary strong { margin-top: 3px; color: var(--tla-ph-heading); font-size: 15px; } .tla-ph-issue-summary small { margin-top: 2px; color: var(--tla-ph-muted); font-size: 8px; } .tla-ph-issue-summary > a { font-size: 10px; font-weight: 850; text-decoration: none; white-space: nowrap; } @media (max-width: 900px) { .tla-ph-issue-planner-controls { grid-template-columns: 1fr; } .tla-ph-issue-summary { grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-issue-summary > a { grid-column: 1 / -1; } } @media (max-width: 620px) { .tla-ph-zone-options { grid-template-columns: 1fr; } .tla-ph-issue-summary { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-issue-summary > div:nth-child(3), .tla-ph-issue-summary > a { grid-column: 1 / -1; } } /* ========================================================= 1.0.50 — VISUAL PUBLICATION PREVIEW + ZONE MAPPER ========================================================= */ .tla-ph-placement-studio { display: grid; grid-template-columns: minmax(360px,.9fr) minmax(320px,1.1fr); gap: 18px; align-items: stretch; margin: 16px 0; padding: 16px; border: 1px solid var(--tla-ph-border); border-radius: 14px; background: var(--tla-ph-surface); } .tla-ph-publication-preview { overflow: hidden; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: #fff; } .tla-ph-publication-preview header { padding: 14px 16px; border-bottom: 1px solid #dfe7f2; background: #f3f8fd; } .tla-ph-publication-preview header span, .tla-ph-publication-preview header strong, .tla-ph-publication-preview header small { display: block; } .tla-ph-publication-preview header span { color: var(--tla-ph-blue); font-size: 9px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; } .tla-ph-publication-preview header strong { margin-top: 4px; color: var(--tla-ph-heading); font-size: 13px; } .tla-ph-publication-preview header small { margin-top: 3px; color: var(--tla-ph-muted); font-size: 9px; } .tla-ph-preview-zone { display: block; width: calc(100% - 24px); margin: 12px; padding: 11px 12px; border: 1px dashed #9fc8ef; border-radius: 9px; background: #f7fbff; color: var(--tla-ph-heading); text-align: left; cursor: pointer; box-shadow: none; transition: border-color .15s ease, background .15s ease, color .15s ease; } .tla-ph-preview-zone span, .tla-ph-preview-zone small { display: block; } .tla-ph-preview-zone span { font-size: 10px; font-weight: 900; } .tla-ph-preview-zone small { margin-top: 3px; color: var(--tla-ph-muted); font-size: 8.5px; line-height: 1.35; } .tla-ph-preview-zone:hover, .tla-ph-preview-zone:focus-visible { border-color: var(--tla-ph-salmon) !important; background: #fff4f1 !important; color: var(--tla-ph-heading) !important; outline: none; } .tla-ph-preview-zone.is-selected { border-style: solid; border-color: var(--tla-ph-blue); background: #edf7ff; } .tla-ph-preview-editorial { display: grid; gap: 5px; padding: 0 16px 2px; } .tla-ph-preview-editorial i { display: block; height: 6px; border-radius: 999px; background: #e8ebf1; } .tla-ph-preview-editorial i:nth-child(2) { width: 92%; } .tla-ph-preview-editorial i:nth-child(3) { width: 84%; } .tla-ph-preview-editorial i:nth-child(4) { width: 67%; } .tla-ph-preview-news-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; padding: 1px 12px 0; } .tla-ph-preview-news-grid > div { padding: 8px; border: 1px solid #e6e8ee; border-radius: 8px; } .tla-ph-preview-news-grid i, .tla-ph-preview-news-grid b, .tla-ph-preview-news-grid em { display: block; border-radius: 5px; background: #edf0f5; } .tla-ph-preview-news-grid i { height: 34px; margin-bottom: 7px; } .tla-ph-preview-news-grid b { width: 85%; height: 6px; } .tla-ph-preview-news-grid em { width: 62%; height: 5px; margin-top: 5px; } .tla-ph-publication-preview footer { padding: 10px 14px; border-top: 1px solid #eceef2; color: var(--tla-ph-muted); font-size: 8px; text-align: center; } .tla-ph-placement-summary { min-width: 0; padding: 16px; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: var(--tla-ph-soft); } .tla-ph-placement-summary > span { color: var(--tla-ph-blue); font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-placement-summary h3 { margin: 5px 0 6px; color: var(--tla-ph-heading); font-size: 17px; } .tla-ph-placement-summary > p { margin: 0; color: var(--tla-ph-text); font-size: 10px; line-height: 1.55; } .tla-ph-placement-price { display: flex; gap: 9px; align-items: baseline; margin: 12px 0; padding-bottom: 12px; border-bottom: 1px solid var(--tla-ph-border); } .tla-ph-placement-price strong { color: var(--tla-ph-heading); font-size: 21px; } .tla-ph-placement-price small { color: var(--tla-ph-muted); font-size: 8.5px; } .tla-ph-placement-summary .tla-ph-zone-options { grid-template-columns: 1fr; } .tla-ph-placement-summary .tla-ph-zone-options label > span { min-height: 0; padding: 9px 10px; } .tla-ph-placement-summary .tla-ph-zone-options input:checked + span { border-color: var(--tla-ph-blue); background: #edf7ff; } .tla-ph-placement-spec { margin: 11px 0 0 !important; padding: 10px 11px; border-left: 3px solid var(--tla-ph-blue); border-radius: 4px 8px 8px 4px; background: var(--tla-ph-surface); color: var(--tla-ph-muted) !important; font-size: 9px !important; line-height: 1.45 !important; } .tla-ph-placement-selection { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 12px; } .tla-ph-placement-selection > div { padding: 9px 10px; border: 1px solid var(--tla-ph-border); border-radius: 9px; background: var(--tla-ph-surface); } .tla-ph-placement-selection span, .tla-ph-placement-selection strong { display: block; } .tla-ph-placement-selection span { color: var(--tla-ph-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; } .tla-ph-placement-selection strong { margin-top: 3px; color: var(--tla-ph-heading); font-size: 15px; } @media (max-width: 900px) { .tla-ph-placement-studio { grid-template-columns: 1fr; } } @media (max-width: 620px) { .tla-ph-placement-studio { padding: 10px; } .tla-ph-preview-news-grid { grid-template-columns: 1fr; } .tla-ph-placement-selection { grid-template-columns: 1fr 1fr; } } /* ========================================================= 1.0.51 — CREATIVE BRIEF + PRIVATE ASSET HANDOFF ========================================================= */ .tla-ph-creative-brief { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(260px,.65fr); gap: 14px; align-items: start; } .tla-ph-creative-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; } .tla-ph-creative-fields .is-wide { grid-column: 1 / -1; } .tla-ph-creative-fields .tla-ph-promotion-field small { display: block; margin-top: 4px; color: var(--tla-ph-muted); font-size: 8.5px; line-height: 1.4; } .tla-ph-creative-handoff { padding: 14px; border: 1px solid var(--tla-ph-border); border-radius: 12px; background: var(--tla-ph-soft); } .tla-ph-creative-handoff > span { color: var(--tla-ph-blue); font-size: 8.5px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-creative-handoff h3 { margin: 5px 0 6px; color: var(--tla-ph-heading); font-size: 15px; line-height: 1.25; } .tla-ph-creative-handoff > p, .tla-ph-creative-handoff li { color: var(--tla-ph-muted); font-size: 9px; line-height: 1.45; } .tla-ph-creative-handoff > p { margin: 0 0 10px; } .tla-ph-creative-handoff ul { margin: 10px 0 0 16px; padding: 0; } .tla-ph-creative-handoff li + li { margin-top: 4px; } .tla-ph-creative-upload { display: flex; min-height: 76px; padding: 12px; border: 1px dashed #9fc8ef; border-radius: 10px; background: var(--tla-ph-surface); align-items: center; justify-content: center; flex-direction: column; text-align: center; cursor: pointer; transition: border-color .15s ease, background .15s ease; } .tla-ph-creative-upload:hover, .tla-ph-creative-upload:focus-within { border-color: var(--tla-ph-salmon) !important; background: #fff4f1 !important; } .tla-ph-creative-upload .dashicons { color: var(--tla-ph-blue); } .tla-ph-creative-upload b { margin-top: 4px; color: var(--tla-ph-heading); font-size: 10px; } .tla-ph-creative-upload small { margin-top: 3px; color: var(--tla-ph-muted); font-size: 8.5px; overflow-wrap: anywhere; } .tla-ph-creative-confirm { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding: 10px 12px; border: 1px solid var(--tla-ph-border); border-radius: 10px; background: var(--tla-ph-surface); color: var(--tla-ph-text); font-size: 9px; line-height: 1.45; } .tla-ph-creative-confirm input { margin-top: 2px; } @media (max-width: 900px) { .tla-ph-creative-brief { grid-template-columns: 1fr; } } @media (max-width: 620px) { .tla-ph-creative-fields { grid-template-columns: 1fr; } .tla-ph-creative-fields .is-wide { grid-column: auto; } } /* ========================================================= 1.0.52 — CREATIVE REVIEW LAYOUT CORRECTION ========================================================= */ #tla-promotion-review .tla-ph-promotion-request-form { display: block !important; width: 100%; min-width: 0; } #tla-promotion-review .tla-ph-creative-brief { display: grid !important; grid-template-columns: minmax(0, 1.9fr) minmax(270px, .72fr) !important; gap: 16px !important; width: 100%; min-width: 0; align-items: start; } #tla-promotion-review .tla-ph-creative-fields { display: grid !important; grid-template-columns: repeat(12, minmax(0, 1fr)) !important; gap: 10px 12px !important; min-width: 0; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field { grid-column: 1 / -1; min-width: 0; gap: 5px; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(1) { grid-column: span 4; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(2) { grid-column: span 8; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(3) { grid-column: span 8; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(4) { grid-column: span 4; } #tla-promotion-review .tla-ph-promotion-field label { display: block; margin: 0; font-size: 10.5px !important; line-height: 1.25 !important; font-weight: 800 !important; } #tla-promotion-review .tla-ph-promotion-field input, #tla-promotion-review .tla-ph-promotion-field textarea { box-sizing: border-box; width: 100% !important; min-width: 0 !important; min-height: 40px !important; padding: 9px 11px !important; border-radius: 9px !important; font-size: 11px !important; line-height: 1.4 !important; } #tla-promotion-review .tla-ph-promotion-field textarea { min-height: 82px !important; resize: vertical; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(7) textarea { min-height: 64px !important; } #tla-promotion-review .tla-ph-promotion-field small { margin-top: 2px !important; font-size: 8.5px !important; line-height: 1.35 !important; } #tla-promotion-review .tla-ph-creative-handoff { box-sizing: border-box; width: 100%; min-width: 0; padding: 14px !important; border-radius: 12px !important; } #tla-promotion-review .tla-ph-creative-handoff h3 { margin: 5px 0 6px !important; font-size: 15px !important; line-height: 1.2 !important; } #tla-promotion-review .tla-ph-creative-handoff > p, #tla-promotion-review .tla-ph-creative-handoff li { font-size: 9px !important; line-height: 1.4 !important; } #tla-promotion-review .tla-ph-creative-upload { min-height: 72px !important; margin-top: 9px; padding: 10px !important; border-radius: 9px !important; } #tla-promotion-review .tla-ph-visually-hidden, #tla-promotion-review #tla-promo-creative { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important; } #tla-promotion-review .tla-ph-creative-confirm { box-sizing: border-box; width: 100%; min-height: 0 !important; margin: 12px 0 0 !important; padding: 9px 11px !important; gap: 8px !important; border-radius: 9px !important; font-size: 9.5px !important; line-height: 1.4 !important; } #tla-promotion-review .tla-ph-creative-confirm input { flex: 0 0 auto; width: 15px !important; height: 15px !important; min-height: 0 !important; margin: 1px 0 0 !important; padding: 0 !important; } #tla-promotion-review .tla-ph-promotion-request-actions { display: flex !important; width: 100%; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--tla-ph-border); align-items: center; justify-content: space-between; gap: 14px; } #tla-promotion-review .tla-ph-promotion-request-actions p { margin: 0; max-width: 650px; font-size: 9.5px !important; line-height: 1.4 !important; } #tla-promotion-review .tla-ph-promotion-request-actions .tla-ph-frontend-button { flex: 0 0 auto; min-height: 38px; padding: 9px 15px; font-size: 10.5px; } @media (max-width: 980px) { #tla-promotion-review .tla-ph-creative-brief { grid-template-columns: 1fr !important; } #tla-promotion-review .tla-ph-creative-handoff { max-width: none; } } @media (max-width: 700px) { #tla-promotion-review .tla-ph-creative-fields { grid-template-columns: 1fr !important; } #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field, #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(1), #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(2), #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(3), #tla-promotion-review .tla-ph-creative-fields > .tla-ph-promotion-field:nth-child(4) { grid-column: auto !important; } #tla-promotion-review .tla-ph-promotion-request-actions { align-items: stretch; flex-direction: column; } #tla-promotion-review .tla-ph-promotion-request-actions .tla-ph-frontend-button { width: 100%; justify-content: center; } } /* ========================================================= 1.0.53 — FORMAT-SPECIFIC AUDIENCE CONTROLS ========================================================= */ .tla-ph-promotion-placement-body > em { display: inline-flex; width: fit-content; margin: 7px 0 0; padding: 4px 7px; border: 1px solid rgba(10,144,246,.22); border-radius: 999px; background: rgba(10,144,246,.06); color: #087fda; font-size: 8.5px; line-height: 1.1; font-style: normal; font-weight: 800; } .tla-ph-audience-policy { display: grid; grid-template-columns: 38px minmax(0,1fr) minmax(220px,.72fr); gap: 12px; margin: 0 0 14px; padding: 14px; border: 1px solid rgba(10,144,246,.24); border-radius: 12px; background: #f7fbff; align-items: center; } .tla-ph-audience-policy-icon { display: grid; width: 36px; height: 36px; border-radius: 9px; background: #e7f4ff; color: #0a90f6; place-items: center; } .tla-ph-audience-policy > div:nth-child(2) > span, .tla-ph-fixed-audience-summary span { display: block; color: var(--tla-ph-muted); font-size: 8.5px; line-height: 1.2; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; } .tla-ph-audience-policy strong { display: block; margin: 3px 0 2px; font-size: 13px; line-height: 1.25; } .tla-ph-audience-policy p { margin: 0; color: var(--tla-ph-muted); font-size: 9.5px; line-height: 1.45; } .tla-ph-audience-policy ul { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; } .tla-ph-audience-policy li { position: relative; margin: 0; padding-left: 15px; color: var(--tla-ph-muted); font-size: 9px; line-height: 1.35; } .tla-ph-audience-policy li::before { position: absolute; top: 3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #0a90f6; content: ''; } .tla-ph-custom-audience-fields { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; width: 100%; } .tla-ph-custom-audience-fields[hidden], .tla-ph-fixed-audience-summary[hidden] { display: none !important; } .tla-ph-custom-audience-fields .tla-ph-promotion-checks { grid-column: 1 / -1; } .tla-ph-fixed-audience-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; } .tla-ph-fixed-audience-summary > div { min-width: 0; padding: 12px; border: 1px solid var(--tla-ph-border); border-radius: 10px; background: var(--tla-ph-panel-soft,#f8f9fd); } .tla-ph-fixed-audience-summary strong { display: block; margin-top: 4px; font-size: 11px; line-height: 1.3; } .tla-ph-promotion-stage-nav a b { font: inherit; } @media (max-width: 980px) { .tla-ph-audience-policy { grid-template-columns: 38px minmax(0,1fr); } .tla-ph-audience-policy ul { grid-column: 1 / -1; grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-custom-audience-fields { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 700px) { .tla-ph-audience-policy { grid-template-columns: 1fr; } .tla-ph-audience-policy ul, .tla-ph-custom-audience-fields, .tla-ph-fixed-audience-summary { grid-template-columns: 1fr; } } /* ========================================================= 1.0.54 — FORMAT-AWARE CREATIVE BRIEFS + REQUEST LEDGER ========================================================= */ .tla-ph-creative-copy-fields, .tla-ph-creative-banner-fields { display: contents; } .tla-ph-creative-copy-fields[hidden], .tla-ph-creative-banner-fields[hidden] { display: none !important; } .tla-ph-promotion-request-ledger { margin: 14px 0 18px; padding: 15px; border: 1px solid var(--tla-ph-border); border-radius: 14px; background: var(--tla-ph-surface); } .tla-ph-promotion-request-ledger > header { display: flex; gap: 18px; align-items: flex-end; justify-content: space-between; margin-bottom: 11px; } .tla-ph-promotion-request-ledger h2 { margin: 3px 0 0; color: var(--tla-ph-heading); font-size: 16px; line-height: 1.25; } .tla-ph-promotion-request-ledger > header p { max-width: 520px; margin: 0; color: var(--tla-ph-muted); font-size: 9.5px; line-height: 1.45; text-align: right; } .tla-ph-promotion-request-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; } .tla-ph-promotion-request-card { min-width: 0; padding: 11px; border: 1px solid var(--tla-ph-border); border-radius: 11px; background: var(--tla-ph-soft); } .tla-ph-promotion-request-card > div { display: flex; gap: 7px; align-items: center; justify-content: space-between; } .tla-ph-promotion-request-card > div span { min-width: 0; overflow: hidden; color: var(--tla-ph-muted); font-size: 8px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-promotion-request-card > div em { flex: 0 0 auto; padding: 3px 6px; border: 1px solid rgba(10,144,246,.2); border-radius: 999px; background: rgba(10,144,246,.07); color: #087fda; font-size: 7.5px; font-style: normal; font-weight: 850; } .tla-ph-promotion-request-card.is-attention > div em { border-color: rgba(229,116,92,.3); background: #fff4f1; color: #b54c37; } .tla-ph-promotion-request-card > strong { display: block; margin: 9px 0; color: var(--tla-ph-heading); font-size: 12px; line-height: 1.3; } .tla-ph-promotion-request-card ul { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; } .tla-ph-promotion-request-card li { display: flex; gap: 8px; align-items: baseline; justify-content: space-between; color: var(--tla-ph-muted); font-size: 8.5px; } .tla-ph-promotion-request-card li b { color: var(--tla-ph-text); font-size: 8.5px; text-align: right; } @media (max-width: 1050px) { .tla-ph-promotion-request-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 650px) { .tla-ph-promotion-request-ledger > header { align-items: flex-start; flex-direction: column; } .tla-ph-promotion-request-ledger > header p { text-align: left; } .tla-ph-promotion-request-grid { grid-template-columns: 1fr; } } #tla-promotion-review .tla-ph-creative-copy-fields > .tla-ph-promotion-field, #tla-promotion-review .tla-ph-creative-banner-fields > .tla-ph-promotion-field { min-width: 0; } #tla-promotion-review .tla-ph-creative-copy-fields > .tla-ph-promotion-field:nth-child(1) { grid-column: span 8; } #tla-promotion-review .tla-ph-creative-copy-fields > .tla-ph-promotion-field:nth-child(2) { grid-column: span 4; } #tla-promotion-review .tla-ph-creative-copy-fields > .tla-ph-promotion-field:nth-child(3), #tla-promotion-review .tla-ph-creative-banner-fields > .tla-ph-promotion-field { grid-column: 1 / -1; } @media (max-width: 700px) { #tla-promotion-review .tla-ph-creative-copy-fields > .tla-ph-promotion-field, #tla-promotion-review .tla-ph-creative-banner-fields > .tla-ph-promotion-field { grid-column: auto !important; } } /* ========================================================= 1.0.55 — PROVISIONAL PUBLICATION INVENTORY HOLDS ========================================================= */ .tla-ph-provisional-hold-note { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 10px; align-items: start; margin: -2px 0 12px; padding: 10px 12px; border: 1px solid #cfe5ff; border-radius: 10px; background: #f4f9ff; } .tla-ph-provisional-hold-note > .dashicons { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 8px; background: #e4f2ff; color: #087fda; font-size: 16px; } .tla-ph-provisional-hold-note strong { display: block; margin: 0 0 2px; color: var(--tla-ph-heading); font-size: 10.5px; line-height: 1.3; } .tla-ph-provisional-hold-note p { margin: 0; color: var(--tla-ph-muted); font-size: 8.8px; line-height: 1.45; } .tla-ph-issue-card.is-held, .tla-ph-issue-card.is-held-own { opacity: 1; } .tla-ph-issue-card.is-held { border-color: #edc9c0 !important; background: #fff7f4 !important; } .tla-ph-issue-card.is-held-own { border-color: #a8d6f6 !important; background: #f2f9ff !important; } .tla-ph-issue-card.is-held em { color: #b54c37 !important; } .tla-ph-issue-card.is-held-own em { color: #087fda !important; } .tla-ph-promotion-request-card.is-held { border-color: #a8d6f6; background: #f5faff; } .tla-ph-promotion-request-card.is-held > div em { border-color: rgba(10,144,246,.25); background: #eaf6ff; color: #087fda; } .tla-ph-promotion-request-card.is-expired { border-color: #edc9c0; background: #fff8f6; } .tla-ph-promotion-request-card.is-expired > div em { border-color: rgba(229,116,92,.3); background: #fff1ed; color: #b54c37; } /* v1.0.56 promotion review workflow states. */ .tla-ph-promotion-request-card.is-approved { border-color: rgba(4, 120, 87, .28); box-shadow: 0 12px 28px rgba(4, 120, 87, .08); } .tla-ph-promotion-request-card.is-approved > div em { background: #ecfdf5; color: #047857; } .tla-ph-promotion-request-card.is-changes { border-color: rgba(217, 119, 6, .3); } .tla-ph-promotion-request-card.is-changes > div em { background: #fff7ed; color: #b45309; } .tla-ph-promotion-request-card.is-declined { border-color: rgba(220, 38, 38, .24); } .tla-ph-promotion-request-card.is-declined > div em { background: #fff1f2; color: #b91c1c; } /* ========================================================= 1.0.57 — SECURE PROMOTION CHECKOUT ========================================================= */ .tla-ph-promotion-request-card.is-awaiting_payment { border-color: rgba(10,144,246,.28); background: #f5faff; } .tla-ph-promotion-request-card.is-awaiting_payment > div:first-child em { border-color: rgba(10,144,246,.22); background: #eaf6ff; color: #087fda; } .tla-ph-promotion-request-card.is-confirmed { border-color: rgba(4,120,87,.3); background: #f2fbf7; box-shadow: 0 12px 28px rgba(4,120,87,.08); } .tla-ph-promotion-request-card.is-confirmed > div:first-child em { border-color: rgba(4,120,87,.2); background: #dcfce7; color: #047857; } .tla-ph-promotion-request-card.is-payment_expired { border-color: rgba(220,38,38,.24); background: #fff8f8; } .tla-ph-promotion-request-card.is-payment_expired > div:first-child em { border-color: rgba(220,38,38,.2); background: #fff1f2; color: #b91c1c; } .tla-ph-promotion-request-card > .tla-ph-promotion-request-action { display: block; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--tla-ph-border); } .tla-ph-promotion-request-action form { margin: 0; } .tla-ph-promotion-request-action .tla-ph-button { width: 100%; min-height: 34px; padding: 8px 12px; border: 0; border-radius: 8px; background: #0a90f6 !important; color: #fff !important; font-size: 9px; font-weight: 850; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; } .tla-ph-promotion-request-action .tla-ph-button:hover, .tla-ph-promotion-request-action .tla-ph-button:focus { background: #e5745c !important; color: #fff !important; } /* ========================================================= 1.0.58 — PIXEL-PERFECT PUBLICATION PLACEMENT PREVIEW ========================================================= */ .tla-ph-publication-preview { min-width: 0; overflow: hidden; isolation: isolate; } .tla-ph-publication-preview, .tla-ph-publication-preview * { box-sizing: border-box; } .tla-ph-publication-preview .tla-ph-preview-zone { display: flex !important; width: auto !important; max-width: calc(100% - 28px) !important; min-width: 0 !important; min-height: 52px; margin: 12px 14px !important; padding: 10px 14px !important; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; white-space: normal !important; text-align: center !important; } .tla-ph-publication-preview .tla-ph-preview-zone span, .tla-ph-publication-preview .tla-ph-preview-zone small { display: block; width: 100%; max-width: 100%; min-width: 0; margin-right: 0; margin-left: 0; overflow: visible; white-space: normal !important; overflow-wrap: anywhere; word-break: normal; text-align: center !important; text-overflow: clip; } .tla-ph-publication-preview .tla-ph-preview-zone span { font-size: 10px; line-height: 1.25; letter-spacing: .065em; text-transform: uppercase; text-wrap: balance; } .tla-ph-publication-preview .tla-ph-preview-zone small { margin-top: 4px; font-size: 8.25px; line-height: 1.4; letter-spacing: .015em; text-transform: none !important; text-wrap: pretty; } .tla-ph-publication-preview .tla-ph-preview-editorial { padding-right: 18px; padding-left: 18px; } .tla-ph-publication-preview .tla-ph-preview-news-grid { padding-right: 14px; padding-left: 14px; } @media (max-width: 520px) { .tla-ph-publication-preview .tla-ph-preview-zone { max-width: calc(100% - 20px) !important; margin: 10px !important; padding: 9px 10px !important; } .tla-ph-publication-preview .tla-ph-preview-zone span { font-size: 9.5px; } } /* ========================================================= 1.0.59 — BALANCED PUBLICATION CREATIVE CANVAS ========================================================= */ .tla-ph-publication-preview .tla-ph-preview-creative { display: grid; width: 100%; min-width: 0; margin: 0 auto; padding: 14px 16px 16px; gap: 12px; box-sizing: border-box; } .tla-ph-publication-preview .tla-ph-preview-creative > * { min-width: 0; box-sizing: border-box; } .tla-ph-publication-preview .tla-ph-preview-creative .tla-ph-preview-zone { width: 100% !important; max-width: none !important; min-height: 54px; margin: 0 !important; padding: 10px 14px !important; justify-self: stretch; } .tla-ph-publication-preview .tla-ph-preview-creative .tla-ph-preview-editorial { width: 100%; padding: 0 4px !important; } .tla-ph-publication-preview .tla-ph-preview-creative .tla-ph-preview-news-grid { width: 100%; padding: 0 !important; gap: 10px; } @media (max-width: 520px) { .tla-ph-publication-preview .tla-ph-preview-creative { padding: 12px; gap: 10px; } .tla-ph-publication-preview .tla-ph-preview-creative .tla-ph-preview-zone { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 9px 11px !important; } } /* ========================================================= 1.0.60 — PAID PROMOTION PRODUCTION HANDOFF ========================================================= */ .tla-ph-promotion-request-card.is-awaiting_creative, .tla-ph-promotion-request-card.is-production_changes { border-color: rgba(217,119,6,.34); } .tla-ph-promotion-request-card.is-awaiting_creative > div:first-child em, .tla-ph-promotion-request-card.is-production_changes > div:first-child em { background: #fff7ed; color: #b45309; } .tla-ph-promotion-request-card.is-creative_review { border-color: rgba(10,144,246,.28); } .tla-ph-promotion-request-card.is-creative_review > div:first-child em { background: #eef7ff; color: #087fc2; } .tla-ph-promotion-request-card.is-production_approved, .tla-ph-promotion-request-card.is-scheduled, .tla-ph-promotion-request-card.is-completed { border-color: rgba(5,150,105,.28); } .tla-ph-promotion-request-card.is-production_approved > div:first-child em, .tla-ph-promotion-request-card.is-scheduled > div:first-child em, .tla-ph-promotion-request-card.is-completed > div:first-child em { background: #ecfdf5; color: #047857; } .tla-ph-promotion-creative-upload { display: grid; gap: 9px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--tla-ph-border); } .tla-ph-promotion-creative-upload label { display: grid; gap: 6px; margin: 0; color: var(--tla-ph-heading); font-size: 12px; font-weight: 800; } .tla-ph-promotion-creative-upload input[type=file] { width: 100%; min-width: 0; padding: 9px; border: 1px solid var(--tla-ph-border); border-radius: 10px; background: #fff; font-size: 12px; } .tla-ph-promotion-creative-upload small { color: var(--tla-ph-muted); font-size: 10px; line-height: 1.45; } .tla-ph-promotion-creative-upload .tla-ph-button { justify-content: center; width: 100%; } /* 1.0.67 — annual-plan sector journey, onboarding guidance and Promotions launch */ .tla-ph-start-here-panel{align-items:center;background:linear-gradient(135deg,rgba(10,144,246,.09),rgba(110,34,255,.06),rgba(223,41,211,.05));border:1px solid rgba(10,144,246,.20);border-radius:18px;display:grid;gap:16px;grid-template-columns:auto minmax(0,1fr) auto;margin:18px 0;padding:18px 20px}.tla-ph-start-here-panel h2{font-size:18px;margin:0 0 5px}.tla-ph-start-here-panel p{color:var(--tla-ph-muted);font-size:13px;line-height:1.55;margin:0}.tla-ph-start-here-badge,.tla-ph-partner-nav-badge{background:linear-gradient(135deg,#0a90f6,#6e22ff);border-radius:999px;color:#fff;display:inline-flex;font-size:9px;font-weight:850;letter-spacing:.06em;padding:4px 7px;white-space:nowrap}.tla-ph-partner-nav-copy strong{align-items:center;display:flex;gap:6px}.tla-ph-partner-nav-copy small{overflow:visible;text-overflow:clip;white-space:normal}.tla-ph-partner-nav-item.is-featured-promotion{background:linear-gradient(135deg,rgba(10,144,246,.10),rgba(23,178,226,.07),rgba(110,34,255,.06));border-color:rgba(10,144,246,.18);min-height:64px}.tla-ph-partner-nav-item.is-featured-promotion:hover,.tla-ph-partner-nav-item.is-featured-promotion:focus-visible{background:linear-gradient(135deg,rgba(10,144,246,.16),rgba(23,178,226,.10),rgba(110,34,255,.09));border-color:rgba(10,144,246,.30)}.tla-ph-partner-nav-notice{color:var(--tla-ph-blue);display:block;font-size:10px;font-style:normal;font-weight:800;line-height:1.3;margin-top:3px}.tla-ph-promotion-hero-side{display:grid;gap:10px;min-width:250px}.tla-ph-first-campaign-offer{align-items:flex-start;background:linear-gradient(135deg,rgba(10,144,246,.11),rgba(110,34,255,.08));border:1px solid rgba(10,144,246,.22);border-radius:16px;display:flex;gap:11px;padding:13px}.tla-ph-first-campaign-offer>span{background:linear-gradient(135deg,#0a90f6,#6e22ff);border-radius:999px;color:#fff;font-size:10px;font-weight:900;padding:5px 8px;white-space:nowrap}.tla-ph-first-campaign-offer strong{color:var(--tla-ph-heading);display:block;font-size:13px}.tla-ph-first-campaign-offer p{color:var(--tla-ph-muted);font-size:11px;line-height:1.45;margin:4px 0}.tla-ph-first-campaign-offer small{color:var(--tla-ph-blue);font-size:10px;font-weight:750;line-height:1.4}.tla-ph-dashboard-card:has(.dashicons-megaphone){background:linear-gradient(145deg,var(--tla-ph-surface),rgba(10,144,246,.055));border-color:rgba(10,144,246,.18)} html[data-tla-theme="dark"] .tla-ph-partner-nav-item.is-featured-promotion{background:linear-gradient(135deg,rgba(10,144,246,.20),rgba(23,178,226,.11),rgba(110,34,255,.14));border-color:rgba(77,168,218,.28)} @media(max-width:760px){.tla-ph-start-here-panel{align-items:flex-start;grid-template-columns:1fr}.tla-ph-promotion-hero-side{min-width:0;width:100%}.tla-ph-first-campaign-offer{flex-direction:column}} /* Version 1.0.69 — personal workspace identity and adaptive guidance. */ .tla-ph-dashboard-brand-card{align-items:center;background:linear-gradient(145deg,var(--tla-ph-surface),rgba(10,144,246,.055));border:1px solid rgba(10,144,246,.16);border-radius:18px;display:grid;flex:0 0 min(100%,310px);gap:13px;grid-template-columns:76px minmax(0,1fr);max-width:min(100%,310px);padding:13px 15px;text-align:left}.tla-ph-dashboard-brand-card img,.tla-ph-dashboard-brand-initials{background:#fff;border:1px solid var(--tla-ph-border);border-radius:14px;box-shadow:0 8px 24px rgba(16,24,40,.08);display:block;height:76px;object-fit:contain;padding:8px;width:76px}.tla-ph-dashboard-brand-initials{align-items:center;background:linear-gradient(135deg,#0a90f6,#6e22ff);color:#fff;display:flex;font-size:22px;font-weight:900;justify-content:center;letter-spacing:.03em;padding:0}.tla-ph-dashboard-brand-card>div{min-width:0}.tla-ph-dashboard-brand-card span,.tla-ph-dashboard-brand-card small{color:var(--tla-ph-muted);display:block;font-size:10px;font-weight:800;letter-spacing:.055em;line-height:1.35;text-transform:uppercase}.tla-ph-dashboard-brand-card strong{color:var(--tla-ph-heading);display:block;font-size:15px;line-height:1.3;margin:4px 0;overflow-wrap:anywhere}.tla-ph-guidance-banner{align-items:center;background:linear-gradient(135deg,rgba(10,144,246,.08),rgba(23,178,226,.045),rgba(110,34,255,.05));border:1px solid rgba(10,144,246,.18);border-radius:18px;display:grid;gap:15px;grid-template-columns:42px minmax(0,1fr) auto;margin:18px 0;padding:15px 17px}.tla-ph-guidance-banner.is-start{background:linear-gradient(135deg,rgba(10,144,246,.11),rgba(110,34,255,.065),rgba(223,41,211,.045));border-color:rgba(10,144,246,.24)}.tla-ph-guidance-banner.is-ready{background:linear-gradient(135deg,rgba(7,148,85,.08),rgba(10,144,246,.055));border-color:rgba(7,148,85,.18)}.tla-ph-guidance-icon{align-items:center;background:linear-gradient(135deg,#0a90f6,#6e22ff);border-radius:13px;color:#fff;display:flex;font-size:20px;height:42px;justify-content:center;width:42px}.tla-ph-guidance-banner.is-ready .tla-ph-guidance-icon{background:linear-gradient(135deg,#079455,#0a90f6)}.tla-ph-guidance-copy{min-width:0}.tla-ph-guidance-copy small{color:var(--tla-ph-blue);display:block;font-size:9.5px;font-weight:900;letter-spacing:.09em;line-height:1.3;text-transform:uppercase}.tla-ph-guidance-copy h2{color:var(--tla-ph-heading);font-size:16px;line-height:1.3;margin:3px 0 4px}.tla-ph-guidance-copy p{color:var(--tla-ph-muted);font-size:12px;line-height:1.5;margin:0}.tla-ph-guidance-action{align-items:center;background:var(--tla-ph-heading);border:1px solid var(--tla-ph-heading);border-radius:999px;color:var(--tla-ph-surface)!important;display:inline-flex;font-size:11px;font-weight:850;gap:6px;justify-content:center;line-height:1.25;min-height:39px;padding:9px 14px;text-align:center;text-decoration:none!important;white-space:nowrap}.tla-ph-guidance-action:hover,.tla-ph-guidance-action:focus-visible{background:linear-gradient(135deg,#0a90f6,#6e22ff);border-color:transparent;color:#fff!important;transform:translateY(-1px)}.tla-ph-guidance-action .dashicons{font-size:15px;height:15px;width:15px}.tla-ph-partner-rail-title{overflow-wrap:anywhere;text-overflow:clip;white-space:normal}.tla-ph-partner-panel-toolbar>span{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} @media(max-width:820px){.tla-ph-dashboard-brand-card{flex-basis:auto;max-width:100%;width:100%}.tla-ph-guidance-banner{align-items:flex-start;grid-template-columns:42px minmax(0,1fr)}.tla-ph-guidance-action{grid-column:1/-1;width:100%}} @media(max-width:520px){.tla-ph-dashboard-brand-card{grid-template-columns:60px minmax(0,1fr)}.tla-ph-dashboard-brand-card img,.tla-ph-dashboard-brand-initials{height:60px;width:60px}.tla-ph-guidance-banner{grid-template-columns:36px minmax(0,1fr);padding:14px}.tla-ph-guidance-icon{font-size:18px;height:36px;width:36px}} /* ===================================================================== Version 1.0.70 - trusted logo correction and public property marketplace ===================================================================== */ /* The production Trusted Partner artwork must always be fully visible. */ .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand { aspect-ratio: auto !important; align-items: center !important; display: flex !important; height: auto !important; justify-content: flex-start !important; max-width: 100% !important; min-height: 72px !important; overflow: visible !important; position: static !important; width: min(230px,100%) !important; } .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo { display: block !important; height: auto !important; inset: auto !important; margin: 0 !important; max-height: 104px !important; max-width: 100% !important; object-fit: contain !important; object-position: left center !important; position: static !important; width: 100% !important; } .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo.is-dark { display: none !important; } html[data-tla-theme="dark"] .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo.is-light { display: none !important; } html[data-tla-theme="dark"] .tla-ph-profile-assurance-card > .tla-ph-trusted-partner-brand.is-assurance-brand > .tla-ph-trusted-logo.is-dark { display: block !important; } .tla-ph-trusted-partner-brand.is-profile-trust { align-items: center !important; display: flex !important; overflow: visible !important; } .tla-ph-trusted-partner-brand.is-profile-trust .tla-ph-trusted-logo { max-height: 72px !important; object-fit: contain !important; width: 100% !important; } .tla-ph-canonical-properties-main, .tla-ph-canonical-property-detail-main { background: radial-gradient(circle at 4% 4%,rgba(23,178,226,.10),transparent 28%), radial-gradient(circle at 96% 4%,rgba(223,41,211,.08),transparent 27%), var(--tla-ph-bg); min-height: 70vh; padding: clamp(22px,3vw,44px) 18px clamp(52px,7vw,90px); } .tla-ph-property-marketplace, .tla-ph-property-detail { margin: 0 auto; max-width: 1320px; width: 100%; } .tla-ph-property-market-hero { align-items: center; background: linear-gradient(135deg,var(--tla-ph-surface),color-mix(in srgb,var(--tla-ph-blue) 6%,var(--tla-ph-surface)),color-mix(in srgb,var(--tla-ph-pink) 4%,var(--tla-ph-surface))); border: 1px solid var(--tla-ph-border); border-radius: 28px; box-shadow: 0 24px 70px rgba(16,24,40,.09); display: grid; gap: clamp(24px,4vw,54px); grid-template-columns: minmax(0,1.5fr) minmax(280px,.62fr); overflow: hidden; padding: clamp(28px,4vw,54px); position: relative; } .tla-ph-property-market-hero::after { background: radial-gradient(circle,rgba(10,144,246,.16),transparent 66%); border-radius: 50%; content: ""; height: 300px; pointer-events: none; position: absolute; right: -110px; top: -130px; width: 300px; } .tla-ph-property-market-hero-copy, .tla-ph-property-market-trust { position: relative; z-index: 1; } .tla-ph-property-market-hero h1 { color: var(--tla-ph-heading) !important; font-size: clamp(34px,4.7vw,66px) !important; font-weight: 900 !important; letter-spacing: -.052em !important; line-height: 1.01 !important; margin: 10px 0 15px !important; max-width: 860px; } .tla-ph-property-market-hero-copy > p { color: var(--tla-ph-muted); font-size: clamp(15px,1.45vw,18px); line-height: 1.65; margin: 0; max-width: 780px; } .tla-ph-property-market-trust { align-items: flex-start; background: color-mix(in srgb,var(--tla-ph-surface) 88%,transparent); border: 1px solid color-mix(in srgb,var(--tla-ph-blue) 20%,var(--tla-ph-border)); border-radius: 20px; display: flex; gap: 13px; padding: 18px; } .tla-ph-property-market-trust > .dashicons { align-items: center; background: linear-gradient(135deg,var(--tla-ph-blue),var(--tla-ph-purple)); border-radius: 12px; color: #fff; display: flex; flex: 0 0 42px; font-size: 21px; height: 42px; justify-content: center; width: 42px; } .tla-ph-property-market-trust strong, .tla-ph-property-market-trust small { display: block; } .tla-ph-property-market-trust strong { color: var(--tla-ph-heading); font-size: 14px; } .tla-ph-property-market-trust small { color: var(--tla-ph-muted); font-size: 11.5px; line-height: 1.5; margin-top: 4px; } .tla-ph-property-search { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 18px 50px rgba(16,24,40,.08); margin: -22px auto 34px; max-width: calc(100% - 42px); padding: 18px; position: relative; z-index: 3; } .tla-ph-property-search-primary { align-items: end; display: grid; gap: 12px; grid-template-columns: minmax(220px,1.4fr) minmax(165px,.72fr) minmax(135px,.55fr) minmax(170px,.65fr) auto; } .tla-ph-property-search label { display: grid; gap: 6px; min-width: 0; } .tla-ph-property-search label > span { color: var(--tla-ph-heading); font-size: 10.5px; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; } .tla-ph-property-search input, .tla-ph-property-search select { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 11px; color: var(--tla-ph-text); font-size: 14px; height: 46px; min-width: 0; padding: 0 12px; width: 100%; } .tla-ph-property-search input:focus, .tla-ph-property-search select:focus { border-color: var(--tla-ph-blue); box-shadow: 0 0 0 3px rgba(10,144,246,.11); outline: none; } .tla-ph-property-search-primary > .tla-ph-frontend-button { min-height: 46px !important; white-space: nowrap; } .tla-ph-property-search-more { border-top: 1px solid var(--tla-ph-border); margin-top: 14px; padding-top: 12px; } .tla-ph-property-search-more summary { align-items: center; color: var(--tla-ph-blue); cursor: pointer; display: inline-flex; font-size: 11px; font-weight: 850; gap: 5px; letter-spacing: .045em; list-style: none; text-transform: uppercase; } .tla-ph-property-search-more summary::-webkit-details-marker { display: none; } .tla-ph-property-search-more[open] summary .dashicons { transform: rotate(180deg); } .tla-ph-property-search-more > div { align-items: end; display: grid; gap: 12px; grid-template-columns: repeat(3,minmax(0,1fr)) auto; padding-top: 13px; } .tla-ph-property-clear-filters { color: var(--tla-ph-muted) !important; font-size: 11px; font-weight: 800; padding: 12px 3px; text-decoration: none !important; white-space: nowrap; } .tla-ph-property-clear-filters:hover { color: var(--tla-ph-pink) !important; } .tla-ph-property-results-heading, .tla-ph-property-related-head { align-items: end; display: flex; gap: 20px; justify-content: space-between; margin: 0 0 18px; } .tla-ph-property-results-heading span, .tla-ph-property-related-head .tla-ph-frontend-eyebrow { color: var(--tla-ph-blue); font-size: 10px; font-weight: 850; letter-spacing: .075em; text-transform: uppercase; } .tla-ph-property-results-heading h2, .tla-ph-property-related-head h2 { color: var(--tla-ph-heading) !important; font-size: clamp(24px,2.7vw,38px) !important; letter-spacing: -.04em !important; line-height: 1.1 !important; margin: 5px 0 0 !important; } .tla-ph-property-results-heading > a, .tla-ph-property-related-head > a { color: var(--tla-ph-blue) !important; font-size: 11px; font-weight: 850; text-decoration: none !important; white-space: nowrap; } .tla-ph-property-results-grid { display: grid; gap: 20px; grid-template-columns: repeat(3,minmax(0,1fr)); } .tla-ph-property-result-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 20px; box-shadow: 0 16px 46px rgba(16,24,40,.075); display: flex; flex-direction: column; min-width: 0; overflow: hidden; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; } .tla-ph-property-result-card:hover { border-color: rgba(10,144,246,.28); box-shadow: 0 22px 58px rgba(16,24,40,.11); transform: translateY(-3px); } .tla-ph-property-result-media { background: linear-gradient(135deg,rgba(10,144,246,.09),rgba(110,34,255,.08)); display: block; overflow: hidden; position: relative; text-decoration: none !important; } .tla-ph-property-result-media > img, .tla-ph-property-result-placeholder { aspect-ratio: 16 / 10; display: block; height: auto; object-fit: cover; transition: transform .3s ease; width: 100%; } .tla-ph-property-result-card:hover .tla-ph-property-result-media > img { transform: scale(1.025); } .tla-ph-property-result-placeholder { align-items: center; color: var(--tla-ph-blue); display: flex; justify-content: center; } .tla-ph-property-result-placeholder .dashicons { font-size: 48px; height: 48px; width: 48px; } .tla-ph-property-result-type, .tla-ph-property-result-photo-count { align-items: center; backdrop-filter: blur(8px); background: rgba(1,0,18,.82); border-radius: 999px; color: #fff; display: inline-flex; font-size: 9.5px; font-weight: 850; gap: 4px; letter-spacing: .055em; padding: 6px 9px; position: absolute; text-transform: uppercase; top: 12px; } .tla-ph-property-result-type { left: 12px; } .tla-ph-property-result-photo-count { right: 12px; } .tla-ph-property-result-photo-count .dashicons { font-size: 14px; height: 14px; width: 14px; } .tla-ph-property-result-copy { flex: 1 1 auto; padding: 18px 18px 15px; } .tla-ph-property-result-price-row { align-items: baseline; display: flex; gap: 10px; justify-content: space-between; } .tla-ph-property-result-price-row > strong { color: var(--tla-ph-heading); font-size: 21px; letter-spacing: -.025em; } .tla-ph-property-result-price-row > strong small { color: var(--tla-ph-muted); font-size: 11px; font-weight: 700; } .tla-ph-property-result-price-row > span { color: var(--tla-ph-muted); font-size: 9.5px; font-weight: 750; text-align: right; } .tla-ph-property-result-copy h2 { font-size: 18px !important; line-height: 1.25 !important; margin: 10px 0 6px !important; } .tla-ph-property-result-copy h2 a { color: var(--tla-ph-heading) !important; text-decoration: none !important; } .tla-ph-property-result-copy h2 a:hover { color: var(--tla-ph-blue) !important; } .tla-ph-property-result-location { align-items: center; color: var(--tla-ph-muted); display: flex; font-size: 12px; gap: 4px; margin: 0; } .tla-ph-property-result-location .dashicons { color: var(--tla-ph-blue); font-size: 16px; height: 16px; width: 16px; } .tla-ph-property-result-facts { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; } .tla-ph-property-result-facts span { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-muted); font-size: 10px; font-weight: 700; padding: 5px 8px; } .tla-ph-property-result-facts strong { color: var(--tla-ph-heading); margin-right: 3px; } .tla-ph-property-result-agency { align-items: center; border-top: 1px solid var(--tla-ph-border); display: flex; gap: 10px; justify-content: space-between; padding: 12px 15px; } .tla-ph-property-agency-identity { align-items: center; display: flex; gap: 9px; min-width: 0; text-decoration: none !important; } .tla-ph-property-agency-logo { align-items: center; background: linear-gradient(135deg,var(--tla-ph-blue),var(--tla-ph-purple)); border-radius: 9px; color: #fff; display: flex; flex: 0 0 38px; height: 38px; justify-content: center; overflow: hidden; width: 38px; } .tla-ph-property-agency-logo.has-logo { background: #fff; border: 1px solid var(--tla-ph-border); } .tla-ph-property-agency-logo img { height: 100%; object-fit: contain; padding: 4px; width: 100%; } .tla-ph-property-agency-logo strong { color: #fff; font-size: 11px; } .tla-ph-property-agency-identity > span:last-child { min-width: 0; } .tla-ph-property-agency-identity small, .tla-ph-property-agency-identity strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tla-ph-property-agency-identity small { color: var(--tla-ph-muted); font-size: 8.5px; font-weight: 750; text-transform: uppercase; } .tla-ph-property-agency-identity strong { color: var(--tla-ph-heading); font-size: 10.5px; margin-top: 2px; } .tla-ph-property-result-open { color: var(--tla-ph-blue) !important; flex: 0 0 auto; font-size: 10px; font-weight: 850; text-decoration: none !important; } .tla-ph-property-pagination { align-items: center; display: flex; gap: 16px; justify-content: center; margin-top: 28px; } .tla-ph-property-pagination a { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-heading) !important; font-size: 11px; font-weight: 850; padding: 10px 15px; text-decoration: none !important; } .tla-ph-property-pagination a:hover { border-color: var(--tla-ph-blue); color: var(--tla-ph-blue) !important; } .tla-ph-property-pagination > span { color: var(--tla-ph-muted); font-size: 11px; font-weight: 750; } .tla-ph-property-empty-state { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; padding: 54px 24px; text-align: center; } .tla-ph-property-empty-state > .dashicons { color: var(--tla-ph-blue); font-size: 42px; height: 42px; width: 42px; } .tla-ph-property-empty-state h2 { color: var(--tla-ph-heading); font-size: 25px !important; margin: 14px 0 8px !important; } .tla-ph-property-empty-state p { color: var(--tla-ph-muted); font-size: 13px; line-height: 1.6; margin: 0 auto 18px; max-width: 620px; } .tla-ph-property-breadcrumb { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; } .tla-ph-property-breadcrumb a { color: var(--tla-ph-blue) !important; font-size: 11px; font-weight: 800; text-decoration: none !important; } .tla-ph-property-breadcrumb > span { color: var(--tla-ph-muted); } .tla-ph-property-detail-head { align-items: end; display: flex; gap: 24px; justify-content: space-between; margin-bottom: 22px; } .tla-ph-property-detail-head h1 { color: var(--tla-ph-heading) !important; font-size: clamp(32px,4.2vw,58px) !important; letter-spacing: -.048em !important; line-height: 1.04 !important; margin: 9px 0 10px !important; max-width: 900px; } .tla-ph-property-detail-head p { align-items: center; color: var(--tla-ph-muted); display: flex; font-size: 14px; gap: 6px; margin: 0; } .tla-ph-property-detail-head p .dashicons { color: var(--tla-ph-blue); } .tla-ph-property-detail-price { flex: 0 0 auto; text-align: right; } .tla-ph-property-detail-price strong { color: var(--tla-ph-heading); display: block; font-size: clamp(27px,3vw,42px); letter-spacing: -.04em; } .tla-ph-property-detail-price strong small { color: var(--tla-ph-muted); font-size: 13px; } .tla-ph-property-detail-price span { color: var(--tla-ph-muted); display: block; font-size: 11px; font-weight: 750; margin-top: 4px; } .tla-ph-property-detail-grid { align-items: start; display: grid; gap: 22px; grid-template-columns: minmax(0,1fr) minmax(300px,.35fr); } .tla-ph-property-detail-grid > main { display: grid; gap: 18px; min-width: 0; } .tla-ph-property-detail-grid > aside { display: grid; gap: 14px; position: sticky; top: 118px; } .tla-ph-property-detail-gallery, .tla-ph-property-detail-section, .tla-ph-property-agent-card, .tla-ph-property-disclaimer, .tla-ph-property-detail-note { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 22px; box-shadow: 0 16px 48px rgba(16,24,40,.07); overflow: hidden; } .tla-ph-property-detail-gallery > img { aspect-ratio: 16 / 9; display: block; object-fit: cover; width: 100%; } .tla-ph-property-detail-thumbs { display: grid; gap: 8px; grid-template-columns: repeat(6,minmax(0,1fr)); padding: 10px; } .tla-ph-property-detail-thumbs button { background: transparent; border: 2px solid transparent; border-radius: 9px; cursor: pointer; overflow: hidden; padding: 0; } .tla-ph-property-detail-thumbs button.is-active { border-color: var(--tla-ph-blue); } .tla-ph-property-detail-thumbs img { aspect-ratio: 4 / 3; display: block; object-fit: cover; width: 100%; } .tla-ph-property-detail-image-placeholder { align-items: center; aspect-ratio: 16 / 9; background: linear-gradient(135deg,rgba(10,144,246,.08),rgba(110,34,255,.07)); color: var(--tla-ph-blue); display: flex; flex-direction: column; gap: 9px; justify-content: center; } .tla-ph-property-detail-image-placeholder .dashicons { font-size: 52px; height: 52px; width: 52px; } .tla-ph-property-detail-facts { display: grid; gap: 10px; grid-template-columns: repeat(4,minmax(0,1fr)); } .tla-ph-property-detail-facts > div { align-items: center; background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 15px; display: grid; gap: 2px; grid-template-columns: 34px minmax(0,1fr); padding: 13px; } .tla-ph-property-detail-facts .dashicons { color: var(--tla-ph-blue); font-size: 21px; grid-row: 1 / 3; height: 21px; width: 21px; } .tla-ph-property-detail-facts strong { color: var(--tla-ph-heading); font-size: 13px; } .tla-ph-property-detail-facts small { color: var(--tla-ph-muted); font-size: 9px; font-weight: 750; text-transform: uppercase; } .tla-ph-property-detail-section { padding: clamp(22px,3vw,34px); } .tla-ph-property-detail-section h2 { color: var(--tla-ph-heading) !important; font-size: clamp(23px,2.5vw,34px) !important; letter-spacing: -.035em !important; margin: 7px 0 13px !important; } .tla-ph-property-detail-section > p { color: var(--tla-ph-text); font-size: 14px; line-height: 1.75; margin: 0; } .tla-ph-property-detail-note, .tla-ph-property-disclaimer { align-items: flex-start; display: flex; gap: 12px; padding: 16px; } .tla-ph-property-detail-note > .dashicons, .tla-ph-property-disclaimer > .dashicons { color: var(--tla-ph-blue); flex: 0 0 21px; } .tla-ph-property-detail-note strong, .tla-ph-property-disclaimer strong { color: var(--tla-ph-heading); display: block; font-size: 12px; } .tla-ph-property-detail-note p, .tla-ph-property-disclaimer p { color: var(--tla-ph-muted); font-size: 10.5px; line-height: 1.5; margin: 4px 0 0; } .tla-ph-property-agent-card { padding: 20px; } .tla-ph-property-agent-brand { align-items: center; display: flex; gap: 12px; margin: 15px 0 16px; } .tla-ph-property-agent-card-logo { align-items: center; background: linear-gradient(135deg,var(--tla-ph-blue),var(--tla-ph-purple)); border-radius: 13px; color: #fff; display: flex; flex: 0 0 68px; height: 68px; justify-content: center; overflow: hidden; width: 68px; } .tla-ph-property-agent-card-logo.has-logo { background: #fff; border: 1px solid var(--tla-ph-border); } .tla-ph-property-agent-card-logo img { height: 100%; object-fit: contain; padding: 7px; width: 100%; } .tla-ph-property-agent-card-logo .dashicons { font-size: 30px; height: 30px; width: 30px; } .tla-ph-property-agent-brand > div { min-width: 0; } .tla-ph-property-agent-brand strong { color: var(--tla-ph-heading); display: block; font-size: 15px; line-height: 1.3; } .tla-ph-property-agent-brand small { color: var(--tla-ph-muted); display: block; font-size: 10px; line-height: 1.45; margin-top: 4px; } .tla-ph-property-agent-card .tla-ph-frontend-button { margin-top: 8px; width: 100%; } .tla-ph-property-agent-contact { align-items: center; border-top: 1px solid var(--tla-ph-border); color: var(--tla-ph-text) !important; display: flex; font-size: 11px; gap: 8px; margin-top: 12px; overflow-wrap: anywhere; padding-top: 12px; text-decoration: none !important; } .tla-ph-property-agent-contact + .tla-ph-property-agent-contact { margin-top: 8px; } .tla-ph-property-agent-contact .dashicons { color: var(--tla-ph-blue); } .tla-ph-property-related { margin-top: clamp(38px,5vw,68px); } .tla-ph-property-results-grid.is-related { grid-template-columns: repeat(4,minmax(0,1fr)); } .tla-ph-property-results-grid.is-related .tla-ph-property-result-copy h2 { font-size: 15px !important; } .tla-ph-property-detail-return { border-top: 1px solid var(--tla-ph-border); margin-top: 32px; padding-top: 20px; text-align: center; } .tla-ph-property-detail-return a { color: var(--tla-ph-blue) !important; font-size: 12px; font-weight: 850; text-decoration: none !important; } .tla-ph-profile-property-heading-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; } .tla-ph-profile-property-heading-actions a { background: var(--tla-ph-soft); border: 1px solid var(--tla-ph-border); border-radius: 999px; color: var(--tla-ph-blue) !important; font-size: 9.5px; font-weight: 850; padding: 8px 11px; text-decoration: none !important; text-transform: uppercase; } .tla-ph-public-property-copy h3 a { color: var(--tla-ph-heading) !important; text-decoration: none !important; } .tla-ph-public-property-copy h3 a:hover { color: var(--tla-ph-blue) !important; } .tla-ph-public-property-gallery { display: block; } html[data-tla-theme="dark"] .tla-ph-property-agency-logo.has-logo, html[data-tla-theme="dark"] .tla-ph-property-agent-card-logo.has-logo { background: #fff; } @media (max-width: 1080px) { .tla-ph-property-search-primary { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-property-search-primary > .tla-ph-frontend-button { width: 100%; } .tla-ph-property-results-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-property-results-grid.is-related { grid-template-columns: repeat(2,minmax(0,1fr)); } .tla-ph-property-detail-facts { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 860px) { .tla-ph-property-market-hero { grid-template-columns: 1fr; } .tla-ph-property-search { margin-top: 16px; max-width: 100%; } .tla-ph-property-detail-head { align-items: flex-start; flex-direction: column; } .tla-ph-property-detail-price { text-align: left; } .tla-ph-property-detail-grid { grid-template-columns: 1fr; } .tla-ph-property-detail-grid > aside { position: static; } } @media (max-width: 680px) { .tla-ph-canonical-properties-main, .tla-ph-canonical-property-detail-main { padding-left: 12px; padding-right: 12px; } .tla-ph-property-market-hero { border-radius: 20px; padding: 24px 18px; } .tla-ph-property-market-hero h1 { font-size: 37px !important; } .tla-ph-property-search { border-radius: 17px; padding: 14px; } .tla-ph-property-search-primary, .tla-ph-property-search-more > div { grid-template-columns: 1fr; } .tla-ph-property-results-heading, .tla-ph-property-related-head { align-items: flex-start; flex-direction: column; } .tla-ph-property-results-grid, .tla-ph-property-results-grid.is-related { grid-template-columns: 1fr; } .tla-ph-property-detail-thumbs { grid-template-columns: repeat(4,minmax(0,1fr)); } .tla-ph-property-detail-facts { grid-template-columns: 1fr 1fr; } .tla-ph-property-pagination { justify-content: space-between; } .tla-ph-property-result-open { display: none; } } @media (max-width: 420px) { .tla-ph-property-detail-facts { grid-template-columns: 1fr; } .tla-ph-property-detail-thumbs { grid-template-columns: repeat(3,minmax(0,1fr)); } } .tla-ph-property-workspace-hero-actions{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end} @media(max-width:760px){.tla-ph-property-workspace-hero-actions{justify-content:flex-start;width:100%}.tla-ph-property-workspace-hero-actions .tla-ph-frontend-button{width:100%}} /* -------------------------------------------------------------------------- * 1.0.71: regional services hub, universal tier hierarchy and profile identity * -------------------------------------------------------------------------- */ /* Tier colour system: Partner = gold, Verified = blue, Business = silver. */ .tla-ph-tier-pill { align-items:center; border:1px solid transparent; border-radius:999px; display:inline-flex; font-weight:850; gap:6px; letter-spacing:.02em; padding:8px 13px !important; white-space:nowrap; } .tla-ph-tier-pill.is-pro { background:linear-gradient(135deg,#fff4c9,#ffe39a); border-color:rgba(168,111,0,.28); box-shadow:0 7px 18px rgba(174,116,0,.12); color:#825300; } .tla-ph-tier-pill.is-trusted { background:linear-gradient(135deg,rgba(10,144,246,.12),rgba(23,178,226,.14)); border-color:rgba(10,144,246,.24); box-shadow:0 7px 18px rgba(10,144,246,.09); color:#0671c6; } .tla-ph-tier-pill.is-basic { background:linear-gradient(135deg,#f4f6f8,#e9edf2); border-color:#d4dae2; color:#536071; } html[data-tla-theme="dark"] .tla-ph-tier-pill.is-pro { background:linear-gradient(135deg,rgba(214,159,35,.24),rgba(244,201,93,.14)); border-color:rgba(244,201,93,.36); color:#ffd873; } html[data-tla-theme="dark"] .tla-ph-tier-pill.is-trusted { background:linear-gradient(135deg,rgba(10,144,246,.22),rgba(23,178,226,.15)); border-color:rgba(61,184,255,.34); color:#75ccff; } html[data-tla-theme="dark"] .tla-ph-tier-pill.is-basic { background:linear-gradient(135deg,#252c3a,#1c2230); border-color:#3c4658; color:#c3cad5; } .tla-ph-profile-experience.is-tier-pro { --tla-profile-accent:#c58a12; --tla-profile-violet:#e8b83e; } .tla-ph-profile-experience.is-tier-trusted { --tla-profile-accent:#0a90f6; --tla-profile-violet:#17b2e2; } .tla-ph-basic-public-listing.is-tier-basic { --tla-profile-accent:#667085; --tla-profile-violet:#98a2b3; } .tla-ph-profile-experience.is-tier-pro .tla-ph-frontend-button-primary { background:linear-gradient(135deg,#9c6500,#d89b1b 56%,#f0bd49) !important; box-shadow:0 10px 26px rgba(166,107,0,.25) !important; } .tla-ph-profile-experience.is-tier-trusted .tla-ph-frontend-button-primary { background:linear-gradient(135deg,#0877cc,#0a90f6 55%,#17b2e2) !important; box-shadow:0 10px 26px rgba(10,144,246,.23) !important; } .tla-ph-basic-public-listing.is-tier-basic .tla-ph-frontend-button-primary { background:linear-gradient(135deg,#414b5a,#667085) !important; box-shadow:0 10px 24px rgba(65,75,90,.2) !important; } .tla-ph-profile-experience.is-tier-pro .tla-ph-profile-tabs a.is-active, .tla-ph-profile-experience.is-tier-pro .tla-ph-profile-tabs a[aria-current="location"] { background:linear-gradient(135deg,rgba(244,201,93,.18),rgba(197,138,18,.1)); border-color:rgba(197,138,18,.28); color:#9a6705; } .tla-ph-profile-experience.is-tier-trusted .tla-ph-profile-tabs a.is-active, .tla-ph-profile-experience.is-tier-trusted .tla-ph-profile-tabs a[aria-current="location"] { background:linear-gradient(135deg,rgba(10,144,246,.12),rgba(23,178,226,.1)); border-color:rgba(10,144,246,.25); color:#0879d0; } /* Profile cover: one restrained verification mark and a clean sector label. */ .tla-ph-profile-cover-brand { align-items:center; backdrop-filter:blur(12px); background:rgba(3,8,24,.62); border:1px solid rgba(255,255,255,.18); border-radius:14px; bottom:24px; box-shadow:0 12px 30px rgba(0,0,0,.22); display:flex; left:clamp(20px,3.2vw,42px); max-width:190px; padding:10px 13px; position:absolute; z-index:3; } .tla-ph-trusted-partner-brand.is-cover-brand { display:flex; width:160px; } .tla-ph-trusted-partner-brand.is-cover-brand .tla-ph-trusted-logo.is-light { display:none !important; } .tla-ph-trusted-partner-brand.is-cover-brand .tla-ph-trusted-logo.is-dark { display:block !important; } .tla-ph-profile-cover-sector { backdrop-filter:blur(10px); background:rgba(3,8,24,.5); border:1px solid rgba(255,255,255,.15); border-radius:999px; bottom:24px; color:#fff; font-size:12px; font-weight:850; letter-spacing:.09em; padding:9px 13px; position:absolute; right:clamp(20px,3.2vw,42px); text-transform:uppercase; z-index:3; } .tla-ph-profile-kicker-row { align-items:center; display:flex; flex-wrap:wrap; gap:11px; margin-bottom:6px; } .tla-ph-profile-kicker-row .tla-ph-frontend-eyebrow { margin:0; } .tla-ph-trust-panel { border-radius:18px; gap:13px; padding:17px 18px; } .tla-ph-trust-panel .tla-ph-trust-icon { align-items:center; border-radius:12px; display:flex; flex:0 0 42px; height:42px; justify-content:center; width:42px; } .tla-ph-trust-panel .tla-ph-trust-icon .dashicons { font-size:21px; height:21px; width:21px; } .tla-ph-trust-panel.is-tier-pro.is-approved { background:linear-gradient(135deg,#fffaf0,#fff4d3); border-color:rgba(197,138,18,.3); } .tla-ph-trust-panel.is-tier-pro.is-approved .tla-ph-trust-icon { background:rgba(197,138,18,.13); color:#9a6705; } .tla-ph-trust-panel.is-tier-trusted.is-approved { background:linear-gradient(135deg,#f7fcff,#eaf7ff); border-color:rgba(10,144,246,.25); } .tla-ph-trust-panel.is-tier-trusted.is-approved .tla-ph-trust-icon { background:rgba(10,144,246,.11); color:#0879d0; } .tla-ph-trust-panel.is-reviewing .tla-ph-trust-icon { background:rgba(217,119,6,.1); color:#b45309; } html[data-tla-theme="dark"] .tla-ph-trust-panel.is-tier-pro.is-approved { background:linear-gradient(135deg,#261f10,#33260d); border-color:rgba(244,201,93,.3); } html[data-tla-theme="dark"] .tla-ph-trust-panel.is-tier-trusted.is-approved { background:linear-gradient(135deg,#0b1b31,#0a263d); border-color:rgba(61,184,255,.28); } /* Customer-facing profile cards and guided-match cards. */ .tla-ph-directory-card { position:relative; overflow:hidden; } .tla-ph-directory-card.is-pro { background:linear-gradient(145deg,var(--tla-ph-surface),color-mix(in srgb,#fff3c4 38%,var(--tla-ph-surface))); border-color:rgba(197,138,18,.32); box-shadow:0 18px 42px rgba(166,107,0,.12); } .tla-ph-directory-card.is-trusted { background:linear-gradient(145deg,var(--tla-ph-surface),color-mix(in srgb,#eaf7ff 40%,var(--tla-ph-surface))); border-color:rgba(10,144,246,.24); box-shadow:0 16px 38px rgba(10,144,246,.09); } .tla-ph-directory-card.is-basic { background:linear-gradient(145deg,var(--tla-ph-surface),color-mix(in srgb,#eef1f5 50%,var(--tla-ph-surface))); border-color:#d8dee7; } .tla-ph-directory-trust-mark { align-items:center; background:rgba(255,255,255,.9); border:1px solid var(--tla-ph-border); border-radius:10px; display:flex; max-width:118px; padding:6px 8px; position:absolute; right:14px; top:14px; z-index:2; } .tla-ph-trusted-partner-brand.is-directory-card-brand { display:flex; width:100px; } .tla-ph-directory-card-top { padding-right:106px; } .tla-ph-directory-card.is-basic .tla-ph-directory-card-top { padding-right:0; } .tla-ph-directory-group.is-pro > .tla-ph-section-heading span, .tla-ph-region-tier-group.is-pro > .tla-ph-section-heading span { color:#a06a05; } .tla-ph-directory-group.is-trusted > .tla-ph-section-heading span, .tla-ph-region-tier-group.is-trusted > .tla-ph-section-heading span { color:#0879d0; } .tla-ph-directory-group.is-basic > .tla-ph-section-heading span, .tla-ph-region-tier-group.is-basic > .tla-ph-section-heading span { color:#667085; } .tla-ph-directory-legend .is-pro i { background:linear-gradient(135deg,#a66b00,#f0bd49); } .tla-ph-directory-legend .is-trusted i { background:linear-gradient(135deg,#0a90f6,#17b2e2); } .tla-ph-directory-legend .is-basic i { background:linear-gradient(135deg,#667085,#b8c0cc); } .tla-ph-directory-route-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:18px; } .tla-ph-directory-route-actions .tla-ph-frontend-button { align-items:center; gap:7px; } .tla-ph-match { position:relative; } .tla-ph-match.is-tier-pro { border-color:rgba(197,138,18,.32); box-shadow:0 18px 42px rgba(166,107,0,.1); } .tla-ph-match.is-tier-trusted { border-color:rgba(10,144,246,.24); box-shadow:0 16px 38px rgba(10,144,246,.08); } .tla-ph-match-trust-mark { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:10px; display:flex; max-width:112px; padding:6px 8px; position:absolute; right:16px; top:16px; } .tla-ph-trusted-partner-brand.is-match-card-brand { display:flex; width:94px; } .tla-ph-match-head { position:relative; } /* .tla-ph-match-head had an unconditional padding-right:126px reserved for the absolutely-positioned trust-mark badge, applied even to the majority of cards that never render one (unclaimed/sourced partners). That starved the identity column down to ~35px, forcing the business name and location to wrap character-by-character — the bug this block fixes. The pill below the head (.tla-ph-match-visibility) is also given an explicit position instead of silently auto-wrapping into the 52px logo column. */ .tla-ph-match-visibility { grid-column:2/-1; justify-self:start; margin-top:8px; } /* When a trust-mark badge IS present, one row is genuinely too narrow to also fit the score circle and status pills next to a readable business name — even a normal-length name collided with the score circle. Trust- marked cards get a two-row layout instead: name on its own row, then the score circle, accreditation and visibility pills below it. Scoped to min-width:1025px only — below that, the existing tablet/mobile .tla-ph-match-v1 .tla-ph-match-head rules already define their own grid-template-areas for this exact scenario, and being equal specificity and later in the file, this block would otherwise win and silently override them at those breakpoints too. */ @media (min-width:1025px) { .tla-ph-match-head:has(.tla-ph-match-trust-mark) { grid-template-columns:52px minmax(0,1fr); grid-template-areas:"mark identity" "score badge" "score visibility"; row-gap:10px; padding-right:126px; } .tla-ph-match-head:has(.tla-ph-match-trust-mark) .tla-ph-match-mark { grid-area:mark; } .tla-ph-match-head:has(.tla-ph-match-trust-mark) .tla-ph-match-identity { grid-area:identity; } .tla-ph-match-head:has(.tla-ph-match-trust-mark) .tla-ph-match-score { grid-area:score; justify-self:start; margin:0; } .tla-ph-match-head:has(.tla-ph-match-trust-mark) .tla-ph-match-accreditation { grid-area:badge; justify-self:start; align-self:end; margin:0 !important; } .tla-ph-match-head:has(.tla-ph-match-trust-mark) .tla-ph-match-visibility { grid-area:visibility; justify-self:start; align-self:start; margin:0; } } .tla-ph-match-visibility.is-pro { background:linear-gradient(135deg,rgba(244,201,93,.16),rgba(197,138,18,.1)); border-color:rgba(197,138,18,.23); color:#8b5d03; } .tla-ph-match-visibility.is-trusted { background:linear-gradient(135deg,rgba(10,144,246,.12),rgba(23,178,226,.1)); border-color:rgba(10,144,246,.22); color:#0879d0; } .tla-ph-match-visibility.is-basic { background:#eef1f5; border-color:#d8dee7; color:#596575; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro { background:linear-gradient(145deg,#151a2c,#2a220e); border-color:rgba(244,201,93,.3); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-trusted { background:linear-gradient(145deg,#11172b,#0a263d); border-color:rgba(61,184,255,.28); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-basic { background:linear-gradient(145deg,#11172b,#202633); border-color:#343e50; } html[data-tla-theme="dark"] .tla-ph-directory-trust-mark, html[data-tla-theme="dark"] .tla-ph-match-trust-mark { background:#10172b; } /* -------------------------------------------------------------------------- * 1.0.74: tier-differentiated card sizing, premium Partner treatment, claim CTA * -------------------------------------------------------------------------- */ /* Business tier: a compact row — logo, name and one action, nothing more. */ .tla-ph-directory-card.is-basic { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:14px; box-shadow:none; flex-direction:row; gap:13px; padding:12px 15px; } .tla-ph-directory-logo.is-compact { border-radius:11px; flex:0 0 46px; height:46px; width:46px; } .tla-ph-directory-logo.is-compact img { padding:4px; } .tla-ph-directory-logo.is-compact span { font-size:14px; } .tla-ph-directory-compact-identity { display:grid; flex:1 1 auto; gap:2px; min-width:0; } .tla-ph-directory-compact-name { color:var(--tla-ph-heading); font-size:15px; letter-spacing:-.01em; line-height:1.3; margin:0; } .tla-ph-directory-compact-meta { color:var(--tla-ph-muted); font-size:11.5px; line-height:1.4; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .tla-ph-directory-compact-actions { align-items:center; display:flex; flex:0 0 auto; flex-wrap:wrap; gap:8px; justify-content:flex-end; } .tla-ph-frontend-button.is-compact { font-size:11px; min-height:34px; padding:7px 14px; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-basic { background:var(--tla-ph-surface); border-color:var(--tla-ph-border); } /* Claim-business: was a bare text link, now a real branded pill so it's never lost on the card. */ .tla-ph-claim-cta { align-items:center; background:var(--tla-ph-grad-action); border-radius:999px; color:#fff !important; display:inline-flex; font-size:11px; font-weight:800; padding:8px 14px; text-decoration:none !important; transition:transform .18s ease,box-shadow .18s ease,filter .18s ease; white-space:nowrap; } .tla-ph-claim-cta:hover { box-shadow:0 10px 22px rgba(91,24,219,.28); filter:brightness(1.08); transform:translateY(-1px); } .tla-ph-claim-cta:focus-visible { box-shadow:0 0 0 4px rgba(91,24,219,.35); outline:2px solid #fff; outline-offset:2px; } /* Partner tier: the largest, richest card and unmistakably the preferred choice. Light theme: a warm, restrained gold-on-white "premium" card — appropriate to sit inside legal/compliance documents. Dark theme: the fuller gold-foil plate. */ .tla-ph-directory-card.is-pro { background:linear-gradient(160deg,var(--tla-ph-surface) 0%,#fff8e9 55%,#fdecc4 100%) !important; border:1.5px solid rgba(197,138,18,.4) !important; box-shadow:0 20px 46px rgba(197,138,18,.16),0 0 0 1px rgba(197,138,18,.08) inset !important; padding:26px !important; } .tla-ph-directory-card.is-pro .tla-ph-directory-logo { background:#fff; height:92px; width:92px; } .tla-ph-directory-card.is-pro .tla-ph-directory-card-top { grid-template-columns:92px minmax(0,1fr); padding-right:118px; } .tla-ph-directory-card.is-pro h2 { color:var(--tla-ph-heading); font-size:27px; } .tla-ph-directory-card.is-pro .tla-ph-directory-tags span { background:rgba(197,138,18,.12); border-color:rgba(197,138,18,.3); color:#8b5d03; } .tla-ph-directory-card.is-pro .tla-ph-frontend-button-secondary { background:linear-gradient(135deg,#c58a12,#f0bd49) !important; border:0 !important; color:#2a1a04 !important; } .tla-ph-directory-card.is-pro .tla-ph-frontend-button-secondary:hover, .tla-ph-directory-card.is-pro .tla-ph-frontend-button-secondary:focus-visible { background:linear-gradient(135deg,#d89b1b,#f7cc63) !important; border-color:transparent !important; color:#2a1a04 !important; -webkit-text-fill-color:#2a1a04 !important; } .tla-ph-directory-card.is-pro .tla-ph-tier-pill.is-pro { background:linear-gradient(135deg,#f0bd49,#ffdf9b); border-color:rgba(197,138,18,.35); color:#4a2e00; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro { background:linear-gradient(160deg,#1c1330 0%,#2b1a46 46%,#3a2054 100%) !important; border-color:rgba(240,189,73,.4) !important; box-shadow:0 26px 60px rgba(20,8,50,.35),0 0 0 1px rgba(240,189,73,.12) inset !important; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro h2 { color:#fff; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-location { color:rgba(255,255,255,.68); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-description { color:rgba(255,255,255,.86); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-tags span { background:rgba(240,189,73,.14); border-color:rgba(240,189,73,.32); color:#ffd873; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-operational-row { border-top-color:rgba(255,255,255,.14); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-operational-row > span { background:rgba(255,255,255,.08); color:rgba(255,255,255,.78); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-operational-row .is-open { background:rgba(16,185,129,.18); color:#6ee7b7; } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-card-footer > span { color:rgba(255,255,255,.6); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-directory-trust-mark { background:rgba(255,255,255,.94); } html[data-tla-theme="dark"] .tla-ph-directory-card.is-pro .tla-ph-tier-pill.is-pro { border-color:rgba(255,255,255,.3); } .tla-ph-partner-ribbon { align-items:center; align-self:flex-start; background:linear-gradient(135deg,#c58a12,#f0bd49); border:1px solid rgba(197,138,18,.35); border-radius:999px; color:#2a1a04; display:inline-flex; font-size:10.5px; font-weight:850; gap:5px; letter-spacing:.04em; margin-bottom:12px; padding:6px 12px; text-transform:uppercase; } .tla-ph-partner-ribbon .dashicons { font-size:12px; height:12px; width:12px; } /* Matching-page gateway to the regional browse journey. */ .tla-ph-v1-business-search { position:relative; } .tla-ph-v1-regional-link { align-items:center; background:linear-gradient(135deg,rgba(10,144,246,.08),rgba(23,178,226,.06)); border:1px solid rgba(10,144,246,.18); border-radius:14px; color:var(--tla-ph-heading) !important; display:flex; gap:11px; margin-top:12px; padding:12px 14px; text-decoration:none !important; } .tla-ph-v1-regional-link > .dashicons { color:var(--tla-ph-blue); flex:0 0 22px; font-size:22px; height:22px; width:22px; } .tla-ph-v1-regional-link strong, .tla-ph-v1-regional-link small { display:block; } .tla-ph-v1-regional-link strong { font-size:13px; } .tla-ph-v1-regional-link small { color:var(--tla-ph-muted); font-size:10.5px; margin-top:2px; } /* Shared Partner Services signposting. */ .tla-ph-service-breadcrumbs { align-items:center; color:var(--tla-ph-muted); display:flex; flex-wrap:wrap; font-size:12px; font-weight:750; gap:8px; margin:0 0 15px; } .tla-ph-service-breadcrumbs > * + *::before { color:var(--tla-ph-muted); content:"/"; margin-right:8px; opacity:.55; } .tla-ph-service-breadcrumbs a { color:var(--tla-ph-blue) !important; text-decoration:none !important; } .tla-ph-service-breadcrumbs span { color:var(--tla-ph-muted); } .tla-ph-service-journey-links { display:grid; gap:12px; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:28px; } .tla-ph-service-journey-links a { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:17px; color:var(--tla-ph-heading) !important; display:grid; gap:3px 10px; grid-template-columns:38px minmax(0,1fr); padding:15px; text-decoration:none !important; } .tla-ph-service-journey-links a:hover { border-color:rgba(10,144,246,.34); transform:translateY(-1px); } .tla-ph-service-journey-links .dashicons { align-items:center; background:rgba(10,144,246,.09); border-radius:10px; color:var(--tla-ph-blue); display:flex; grid-row:1/3; height:36px; justify-content:center; width:36px; } .tla-ph-service-journey-links strong { font-size:13px; } .tla-ph-service-journey-links small { color:var(--tla-ph-muted); font-size:10px; line-height:1.4; } /* National Regional Services Hub. */ .tla-ph-regional-hub, .tla-ph-region-page { color:var(--tla-ph-text); } .tla-ph-region-hero, .tla-ph-region-page-hero { align-items:center; background:radial-gradient(circle at 90% 0,rgba(23,178,226,.16),transparent 34%),radial-gradient(circle at 10% 100%,rgba(110,34,255,.11),transparent 38%),var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:28px; box-shadow:0 24px 62px rgba(20,31,77,.11); display:grid; gap:28px; grid-template-columns:minmax(0,1.25fr) minmax(260px,.55fr); padding:clamp(28px,4vw,48px); } .tla-ph-region-hero h1, .tla-ph-region-page-hero h1 { color:var(--tla-ph-heading) !important; font-size:clamp(38px,5.2vw,66px) !important; letter-spacing:-.05em !important; line-height:1.02 !important; margin:8px 0 15px !important; } .tla-ph-region-hero p, .tla-ph-region-page-hero p { color:var(--tla-ph-muted); font-size:16px; line-height:1.7; margin:0; max-width:850px; } .tla-ph-region-hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; } .tla-ph-region-hero-note, .tla-ph-region-page-stat { background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(239,248,255,.88)); border:1px solid rgba(10,144,246,.18); border-radius:20px; padding:21px; } .tla-ph-region-hero-note strong { color:var(--tla-ph-heading); display:block; font-size:15px; } .tla-ph-region-hero-note p { font-size:12px; line-height:1.6; margin-top:7px; } .tla-ph-region-page-stat strong { color:var(--tla-ph-blue); display:block; font-size:50px; line-height:1; } .tla-ph-region-page-stat span { color:var(--tla-ph-heading); display:block; font-size:14px; font-weight:850; margin-top:7px; } .tla-ph-region-page-stat small { color:var(--tla-ph-muted); display:block; font-size:10.5px; line-height:1.5; margin-top:9px; } .tla-ph-region-map-shell { align-items:start; background:radial-gradient(circle at 90% 0,rgba(23,178,226,.16),transparent 40%),radial-gradient(circle at 10% 100%,rgba(110,34,255,.11),transparent 44%),var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:28px; box-shadow:0 24px 62px rgba(20,31,77,.11); display:grid; gap:28px; grid-template-columns:minmax(320px,.5fr) minmax(0,1fr); margin-top:22px; overflow:hidden; padding:clamp(25px,4vw,45px); position:relative; } .tla-ph-region-map-shell::before { background:radial-gradient(circle,rgba(23,178,226,.2),transparent 68%); content:""; height:420px; position:absolute; right:-120px; top:-150px; width:420px; } .tla-ph-region-map-copy { position:relative; z-index:1; } .tla-ph-region-map-copy > span { color:var(--tla-ph-blue); font-size:12px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; } .tla-ph-region-map-copy h2 { color:var(--tla-ph-heading) !important; font-size:clamp(30px,4vw,48px) !important; letter-spacing:-.04em !important; margin:7px 0 12px !important; } .tla-ph-region-map-copy p { color:var(--tla-ph-muted); font-size:14px; line-height:1.7; margin:0; } html[data-tla-theme="dark"] .tla-ph-region-map-shell { background:linear-gradient(145deg,#07122b,#171344); border-color:rgba(255,255,255,.1); } html[data-tla-theme="dark"] .tla-ph-region-map-copy > span { color:#5ed8ff; } html[data-tla-theme="dark"] .tla-ph-region-map-copy h2 { color:#fff !important; } html[data-tla-theme="dark"] .tla-ph-region-map-copy p { color:rgba(255,255,255,.72); } .tla-ph-region-map-how { margin-top:22px; position:relative; z-index:1; } .tla-ph-region-map-how h3 { color:var(--tla-ph-heading); font-size:12px; font-weight:850; letter-spacing:.06em; margin:0 0 11px; text-transform:uppercase; } .tla-ph-region-map-how ul { display:grid; gap:10px; list-style:none; margin:0; padding:0; } .tla-ph-region-map-how li { align-items:flex-start; color:var(--tla-ph-muted); display:flex; font-size:12.5px; gap:9px; line-height:1.55; } .tla-ph-region-map-how li .dashicons { color:var(--tla-ph-blue); flex:0 0 15px; font-size:15px; height:15px; margin-top:2px; width:15px; } html[data-tla-theme="dark"] .tla-ph-region-map-how h3 { color:#fff; } html[data-tla-theme="dark"] .tla-ph-region-map-how li { color:rgba(255,255,255,.72); } .tla-ph-nationwide-section { border-top:1px solid var(--tla-ph-divider); margin-top:26px; padding-top:24px; position:relative; z-index:1; } .tla-ph-nationwide-eyebrow { color:var(--tla-ph-violet); display:block; font-size:11px; font-weight:850; letter-spacing:.1em; text-transform:uppercase; } .tla-ph-nationwide-section h3 { color:var(--tla-ph-heading); font-size:19px; letter-spacing:-.02em; margin:7px 0 9px; } .tla-ph-nationwide-section > p { color:var(--tla-ph-muted); font-size:12.5px; line-height:1.65; margin:0 0 18px; } .tla-ph-nationwide-grid { display:grid; gap:13px; } .tla-ph-nationwide-card { background:linear-gradient(160deg,var(--tla-ph-surface) 0%,#f6f3fd 55%,#efe9fc 100%); border:1.5px solid rgba(110,34,255,.28); border-radius:18px; box-shadow:0 16px 36px rgba(110,34,255,.1); overflow:hidden; padding:19px; position:relative; } .tla-ph-nationwide-card::before { background:var(--tla-ph-grad-tri); content:""; height:4px; left:0; position:absolute; top:0; width:100%; } .tla-ph-nationwide-card.is-planned { background:var(--tla-ph-soft); border-color:var(--tla-ph-border); border-style:dashed; box-shadow:none; } .tla-ph-nationwide-card.is-planned::before { opacity:.5; } .tla-ph-nationwide-badge { align-items:center; background:rgba(110,34,255,.12); border-radius:999px; color:var(--tla-ph-violet); display:inline-flex; font-size:9.5px; font-weight:850; gap:5px; letter-spacing:.05em; padding:5px 10px; text-transform:uppercase; } .tla-ph-nationwide-badge .dashicons { font-size:11px; height:11px; width:11px; } .tla-ph-nationwide-icon { align-items:center; background:rgba(110,34,255,.1); border-radius:11px; color:var(--tla-ph-violet); display:flex; height:38px; justify-content:center; margin:14px 0 10px; width:38px; } .tla-ph-nationwide-icon.dashicons { font-size:19px; } .tla-ph-nationwide-card h4 { color:var(--tla-ph-heading); font-size:15.5px; margin:0 0 8px; } .tla-ph-nationwide-status { align-items:center; color:var(--tla-ph-muted); display:flex; font-size:11px; font-weight:750; gap:7px; margin:0; } .tla-ph-nationwide-status-dot { background:#d07000; border-radius:50%; flex:0 0 7px; height:7px; width:7px; } .tla-ph-nationwide-apply { color:var(--tla-ph-violet); display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:800; margin-top:12px; text-decoration:none; } .tla-ph-nationwide-apply:hover { text-decoration:underline; } html[data-tla-theme="dark"] .tla-ph-nationwide-apply { color:#c9a8ff; } .tla-ph-member-discount-card { background: linear-gradient(140deg, rgba(10,144,246,.10), rgba(110,34,255,.10)); border: 1px solid rgba(110,34,255,.28); border-radius: 18px; box-shadow: 0 14px 34px rgba(19,27,68,.06); padding: clamp(16px,2vw,22px); } .tla-ph-member-discount-eyebrow { align-items: center; color: var(--tla-ph-violet); display: inline-flex; font-size: 11px; font-weight: 850; gap: 6px; letter-spacing: .06em; text-transform: uppercase; } .tla-ph-member-discount-eyebrow .dashicons { font-size: 15px; height: 15px; width: 15px; } .tla-ph-member-discount-desc { color: var(--tla-ph-text); font-size: 14px; line-height: 1.6; margin: 8px 0 12px; } .tla-ph-member-discount-code { align-items: center; background: var(--tla-ph-surface); border: 1px dashed rgba(110,34,255,.4); border-radius: 12px; display: flex; justify-content: space-between; padding: 10px 14px; } .tla-ph-member-discount-code span { color: var(--tla-ph-muted); font-size: 11px; font-weight: 700; text-transform: uppercase; } .tla-ph-member-discount-code strong { color: var(--tla-ph-heading); font-size: 16px; letter-spacing: .04em; } .tla-ph-member-discount-card > small { color: var(--tla-ph-muted); display: block; font-size: 11px; margin-top: 10px; } html[data-tla-theme="dark"] .tla-ph-member-discount-eyebrow { color: #c9a8ff; } html[data-tla-theme="dark"] .tla-ph-member-discount-card { border-color: rgba(180,140,255,.32); } html[data-tla-theme="dark"] .tla-ph-member-discount-code { border-color: rgba(180,140,255,.4); } .tla-ph-trust-stats-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 16px; display: grid; gap: 12px; padding: clamp(14px,1.8vw,20px); } .tla-ph-trust-stat { align-items: flex-start; display: flex; gap: 10px; } .tla-ph-trust-stat .dashicons { color: #059669; flex: 0 0 auto; font-size: 18px; height: 18px; margin-top: 2px; width: 18px; } .tla-ph-trust-stat strong { color: var(--tla-ph-heading); display: block; font-size: 13.5px; line-height: 1.4; } .tla-ph-trust-stat small { color: var(--tla-ph-muted); font-size: 11px; } html[data-tla-theme="dark"] .tla-ph-trust-stat .dashicons { color: #34d399; } .tla-ph-perks-hero { margin: 22px 0 30px; max-width: 760px; } .tla-ph-perks-hero h1 { font-size: clamp(30px,4vw,44px); letter-spacing: -.03em; line-height: 1.08; margin: 10px 0; } .tla-ph-perks-hero p { color: var(--tla-ph-muted); font-size: 15px; line-height: 1.65; } .tla-ph-perks-grid { display: grid; gap: 16px; grid-template-columns: repeat(3,minmax(0,1fr)); margin-bottom: 40px; } .tla-ph-perk-card { background: var(--tla-ph-surface); border: 1px solid var(--tla-ph-border); border-radius: 18px; color: var(--tla-ph-heading) !important; display: flex; flex-direction: column; gap: 8px; padding: 20px; text-decoration: none !important; transition: transform .15s ease, box-shadow .15s ease; } .tla-ph-perk-card:hover { box-shadow: 0 14px 34px rgba(19,27,68,.1); transform: translateY(-2px); } .tla-ph-perk-sector { color: var(--tla-ph-violet); font-size: 10.5px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; } .tla-ph-perk-card h2 { font-size: 18px; margin: 0; } .tla-ph-perk-card > p { color: var(--tla-ph-muted); flex: 1 1 auto; font-size: 13px; line-height: 1.55; margin: 0; } .tla-ph-perk-code { align-items: center; background: rgba(110,34,255,.08); border: 1px dashed rgba(110,34,255,.35); border-radius: 10px; display: flex; justify-content: space-between; margin-top: 4px; padding: 8px 12px; } .tla-ph-perk-code span { color: var(--tla-ph-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; } .tla-ph-perk-code strong { color: var(--tla-ph-heading); font-size: 14px; } .tla-ph-perk-link { color: var(--tla-ph-violet); font-size: 12px; font-weight: 800; } @media (max-width: 900px) { .tla-ph-perks-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 640px) { .tla-ph-perks-grid { grid-template-columns: 1fr; } } .tla-ph-ad-slot { margin: 20px 0; position: relative; } .tla-ph-ad-slot-item { border-radius: 16px; display: none; overflow: hidden; position: relative; } .tla-ph-ad-slot-item.is-active { display: block; } .tla-ph-ad-slot-item img { display: block; height: auto; width: 100%; } .tla-ph-ad-slot-badge { background: rgba(9,9,26,.65); border-radius: 999px; color: #fff; font-size: 9.5px; font-weight: 700; letter-spacing: .06em; padding: 4px 9px; position: absolute; right: 10px; text-transform: uppercase; top: 10px; z-index: 1; } .tla-ph-ad-slot-dashboard-banner .tla-ph-ad-slot-item img { max-height: 160px; object-fit: cover; } .tla-ph-ad-slot-homepage-billboard .tla-ph-ad-slot-item img, .tla-ph-ad-slot-homepage-takeover .tla-ph-ad-slot-item img { max-height: 320px; object-fit: cover; } .tla-ph-nationwide-card.is-onboarding .tla-ph-nationwide-status-dot { animation:tla-ph-nationwide-pulse 2s ease-in-out infinite; } @keyframes tla-ph-nationwide-pulse { 0%,100% { opacity:1; } 50% { opacity:.35; } } @media (prefers-reduced-motion: reduce) { .tla-ph-nationwide-card.is-onboarding .tla-ph-nationwide-status-dot { animation:none; } } html[data-tla-theme="dark"] .tla-ph-nationwide-section h3 { color:#fff; } html[data-tla-theme="dark"] .tla-ph-nationwide-section > p { color:rgba(255,255,255,.68); } html[data-tla-theme="dark"] .tla-ph-nationwide-card { background:linear-gradient(160deg,#0a0a16 0%,#140f22 50%,#1c1430 100%); border-color:rgba(180,140,255,.4); box-shadow:0 20px 46px rgba(0,0,0,.4); } html[data-tla-theme="dark"] .tla-ph-nationwide-card.is-planned { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.14); box-shadow:none; } html[data-tla-theme="dark"] .tla-ph-nationwide-card h4 { color:#fff; } html[data-tla-theme="dark"] .tla-ph-nationwide-status { color:rgba(255,255,255,.62); } html[data-tla-theme="dark"] .tla-ph-nationwide-badge { background:rgba(180,140,255,.18); color:#c9a8ff; } html[data-tla-theme="dark"] .tla-ph-nationwide-icon { background:rgba(180,140,255,.16); color:#c9a8ff; } .tla-ph-uk-map-wrap { position:relative; z-index:1; } .tla-ph-uk-map { aspect-ratio:5/6; background:radial-gradient(circle at 50% 40%,rgba(23,178,226,.14),transparent 70%); border:1px solid var(--tla-ph-border); border-radius:18px; font-family:var(--tla-ph-font) !important; min-height:360px; overflow:hidden; position:relative; } .tla-ph-uk-map-fallback { color:var(--tla-ph-muted); font-size:12px; margin:0; padding:20px; text-align:center; } .tla-ph-uk-map.is-active .tla-ph-uk-map-fallback { display:none; } .tla-ph-uk-map .maplibregl-ctrl-attrib, .tla-ph-uk-map .maplibregl-ctrl-attrib a { background:var(--tla-ph-surface) !important; color:var(--tla-ph-muted) !important; } .tla-ph-uk-map .maplibregl-ctrl-group { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); box-shadow:none; } .tla-ph-uk-map .maplibregl-ctrl-group button { background:transparent; } html[data-tla-theme="dark"] .tla-ph-uk-map .maplibregl-ctrl-icon { filter:invert(1); } .tla-ph-uk-map-tooltip { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:10px; box-shadow:var(--tla-ph-shadow-lg); color:var(--tla-ph-heading); max-width:220px; padding:10px 13px; pointer-events:none; position:absolute; transform:translate(-50%,calc(-100% - 14px)); white-space:normal; z-index:3; } .tla-ph-uk-map-tooltip strong { display:block; font-size:12.5px; margin-bottom:6px; } .tla-ph-uk-map-tooltip > span { color:var(--tla-ph-muted); font-size:10.5px; } .tla-ph-uk-map-tooltip ul { display:grid; gap:6px; list-style:none; margin:0; padding:0; } .tla-ph-uk-map-tooltip li { align-items:center; color:var(--tla-ph-text); display:flex; font-size:11px; font-weight:650; gap:7px; } .tla-ph-map-tip-icon { align-items:center; border-radius:50%; color:#fff; display:flex; flex:0 0 auto; height:20px; justify-content:center; width:20px; } .tla-ph-map-tip-icon svg { height:12px; width:12px; } .tla-ph-map-tip-label { flex:1 1 auto; } .tla-ph-map-tip-count { color:var(--tla-ph-muted); font-weight:600; } .tla-ph-uk-map-credit { color:var(--tla-ph-muted-light); font-size:9.5px; margin:10px 0 0; position:relative; text-align:right; z-index:1; } .tla-ph-region-postcode-search { margin-top:20px; max-width:420px; } .tla-ph-region-postcode-search label { color:var(--tla-ph-heading); display:block; font-size:11px; font-weight:800; margin-bottom:6px; } .tla-ph-region-postcode-search-row { display:flex; gap:8px; } .tla-ph-region-postcode-search-row input { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:11px; color:var(--tla-ph-text); flex:1 1 auto; min-height:45px; padding:8px 13px; } .tla-ph-region-sector-snapshot { margin-top:30px; } .tla-ph-region-sector-grid { display:grid; gap:13px; grid-template-columns:repeat(4,minmax(0,1fr)); } .tla-ph-region-sector-card { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:18px; display:flex; flex-direction:column; gap:6px; padding:19px; } .tla-ph-region-sector-card.is-active { border-color:var(--tla-ph-blue); box-shadow:0 0 0 1px var(--tla-ph-blue); } .tla-ph-region-sector-card > .dashicons { align-items:center; background:rgba(10,144,246,.09); border-radius:10px; color:var(--tla-ph-blue); display:flex; height:34px; justify-content:center; width:34px; } .tla-ph-region-sector-card h3 { color:var(--tla-ph-heading); font-size:14px; margin:4px 0 0; } .tla-ph-region-sector-card p { color:var(--tla-ph-muted); flex:1 1 auto; font-size:11px; line-height:1.55; margin:0; } .tla-ph-region-sector-count { color:var(--tla-ph-blue); font-size:11px; font-weight:800; } .tla-ph-region-sector-link { color:var(--tla-ph-blue) !important; font-size:11.5px; font-weight:800; text-decoration:none !important; } .tla-ph-region-sector-link:hover { text-decoration:underline !important; } .tla-ph-region-sector-card.is-onboarding { background:var(--tla-ph-soft); border-style:dashed; } .tla-ph-region-sector-status { background:var(--tla-ph-pastel-violet); border-radius:999px; color:var(--tla-ph-violet); font-size:10px; font-weight:800; padding:4px 10px; text-transform:uppercase; width:fit-content; } .tla-ph-region-sector-note { color:var(--tla-ph-muted-light) !important; font-size:10.5px !important; } .tla-ph-region-card-section { margin-top:28px; } .tla-ph-region-card-grid { display:grid; gap:13px; grid-template-columns:repeat(3,minmax(0,1fr)); } .tla-ph-region-card { align-items:flex-start; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:18px; color:var(--tla-ph-heading) !important; display:grid; gap:5px 12px; grid-template-columns:38px minmax(0,1fr); padding:18px; text-decoration:none !important; } .tla-ph-region-card:hover { border-color:rgba(10,144,246,.32); box-shadow:0 14px 32px rgba(10,144,246,.08); transform:translateY(-1px); } .tla-ph-region-card > .dashicons { align-items:center; background:rgba(10,144,246,.09); border-radius:10px; color:var(--tla-ph-blue); display:flex; grid-row:1/3; height:36px; justify-content:center; width:36px; } .tla-ph-region-card strong { font-size:15px; } .tla-ph-region-card p { color:var(--tla-ph-muted); font-size:11px; line-height:1.5; margin:5px 0 0; } .tla-ph-region-card > small { color:var(--tla-ph-blue); font-size:10px; font-weight:800; grid-column:2; } .tla-ph-region-filter { align-items:end; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:19px; box-shadow:0 14px 34px rgba(20,31,77,.07); display:grid; gap:12px; grid-template-columns:minmax(190px,1fr) minmax(190px,1fr) auto auto; margin-top:18px; padding:17px; } .tla-ph-region-filter label { display:grid; gap:6px; } .tla-ph-region-filter label > span { color:var(--tla-ph-heading); font-size:11px; font-weight:800; } .tla-ph-region-filter select { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:11px; color:var(--tla-ph-text); min-height:45px; padding:8px 11px; width:100%; } .tla-ph-region-clear { color:var(--tla-ph-blue) !important; font-size:11px; font-weight:800; padding:13px 5px; text-decoration:none !important; } .tla-ph-region-area-links { background:linear-gradient(135deg,rgba(10,144,246,.06),rgba(23,178,226,.04)); border:1px solid rgba(10,144,246,.13); border-radius:17px; margin-top:14px; padding:15px; } .tla-ph-region-area-links > span { color:var(--tla-ph-heading); display:block; font-size:11px; font-weight:850; margin-bottom:9px; text-transform:uppercase; } .tla-ph-region-area-links > div { display:flex; flex-wrap:wrap; gap:7px; } .tla-ph-region-area-links a { background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:999px; color:var(--tla-ph-text) !important; font-size:10.5px; font-weight:750; padding:7px 10px; text-decoration:none !important; } .tla-ph-region-area-links a:hover { border-color:rgba(10,144,246,.3); color:var(--tla-ph-blue) !important; } .tla-ph-regional-results-summary { align-items:flex-start; display:flex; gap:16px; justify-content:space-between; margin:19px 0 6px; } .tla-ph-regional-results-summary strong { color:var(--tla-ph-heading); font-size:15px; } .tla-ph-regional-results-summary span { color:var(--tla-ph-muted); font-size:10.5px; line-height:1.5; max-width:800px; text-align:right; } .tla-ph-region-tier-group { margin-top:24px; } .tla-ph-region-tier-group .tla-ph-section-heading p { color:var(--tla-ph-muted); font-size:12px; margin:6px 0 0; } html[data-tla-theme="dark"] .tla-ph-region-hero, html[data-tla-theme="dark"] .tla-ph-region-page-hero { background:radial-gradient(circle at 90% 0,rgba(23,178,226,.13),transparent 34%),radial-gradient(circle at 10% 100%,rgba(110,34,255,.12),transparent 38%),#0c1228; } html[data-tla-theme="dark"] .tla-ph-region-hero-note, html[data-tla-theme="dark"] .tla-ph-region-page-stat { background:linear-gradient(145deg,#101932,#0b2035); } html[data-tla-theme="dark"] .tla-ph-region-card, html[data-tla-theme="dark"] .tla-ph-region-filter, html[data-tla-theme="dark"] .tla-ph-service-journey-links a { background:#0f162d; } html[data-tla-theme="dark"] .tla-ph-region-area-links { background:linear-gradient(135deg,rgba(10,144,246,.11),rgba(23,178,226,.06)); } @media (max-width:1080px) { .tla-ph-region-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .tla-ph-region-sector-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .tla-ph-region-filter { grid-template-columns:1fr 1fr; } .tla-ph-region-filter .tla-ph-frontend-button { width:100%; } .tla-ph-region-clear { text-align:center; } } @media (max-width:900px) { .tla-ph-region-hero, .tla-ph-region-page-hero, .tla-ph-region-map-shell { grid-template-columns:1fr; } .tla-ph-uk-map { aspect-ratio:auto; min-height:420px; } .tla-ph-service-journey-links { grid-template-columns:1fr; } } @media (max-width:700px) { .tla-ph-profile-cover-brand { bottom:16px; left:16px; max-width:145px; padding:8px 10px; } .tla-ph-trusted-partner-brand.is-cover-brand { width:124px; } .tla-ph-profile-cover-sector { bottom:16px; font-size:9px; padding:7px 9px; right:16px; } .tla-ph-directory-card-top, .tla-ph-directory-card.is-pro .tla-ph-directory-card-top { padding-right:0; } .tla-ph-directory-trust-mark { margin-bottom:12px; max-width:104px; position:static; } .tla-ph-trusted-partner-brand.is-directory-card-brand { width:88px; } .tla-ph-directory-card.is-basic { flex-wrap:wrap; } .tla-ph-directory-compact-actions { justify-content:flex-start; width:100%; } .tla-ph-match-head { padding-right:0; } .tla-ph-match-trust-mark { margin-bottom:12px; max-width:104px; position:static; } .tla-ph-region-hero, .tla-ph-region-page-hero, .tla-ph-region-map-shell { border-radius:20px; padding:23px 18px; } .tla-ph-region-hero h1, .tla-ph-region-page-hero h1 { font-size:39px !important; } .tla-ph-uk-map { min-height:340px; } .tla-ph-region-card-grid, .tla-ph-region-sector-grid, .tla-ph-region-filter { grid-template-columns:1fr; } .tla-ph-region-postcode-search-row { flex-direction:column; } .tla-ph-regional-results-summary { flex-direction:column; } .tla-ph-regional-results-summary span { text-align:left; } .tla-ph-directory-route-actions .tla-ph-frontend-button, .tla-ph-region-hero-actions .tla-ph-frontend-button, .tla-ph-region-postcode-search-row .tla-ph-frontend-button { width:100%; } } /* ========================================================== Version 1.0.71 - persistent profile journey signposting ========================================================== */ .tla-ph-profile-service-nav { align-items:center; display:flex; gap:18px; justify-content:space-between; margin:0 auto 14px; max-width:1280px; padding:0 2px; } .tla-ph-profile-service-nav .tla-ph-service-breadcrumbs { margin:0; min-width:0; } .tla-ph-profile-service-actions { align-items:center; display:flex; flex:0 0 auto; flex-wrap:wrap; gap:7px; justify-content:flex-end; } .tla-ph-profile-service-actions a { align-items:center; background:rgba(255,255,255,.78); border:1px solid rgba(10,144,246,.16); border-radius:999px; color:var(--tla-ph-text) !important; display:inline-flex; font-size:10px; font-weight:800; gap:5px; letter-spacing:.04em; line-height:1; padding:8px 10px; text-decoration:none !important; text-transform:uppercase; } .tla-ph-profile-service-actions a:hover { border-color:rgba(10,144,246,.4); color:var(--tla-ph-blue) !important; transform:translateY(-1px); } .tla-ph-profile-service-actions .dashicons { color:var(--tla-ph-blue); font-size:14px; height:14px; width:14px; } html[data-tla-theme="dark"] .tla-ph-profile-service-actions a, body[data-tla-theme="dark"] .tla-ph-profile-service-actions a, body.tla-dark-mode .tla-ph-profile-service-actions a { background:rgba(15,22,45,.86); border-color:rgba(99,179,255,.2); } @media (max-width:900px) { .tla-ph-profile-service-nav { align-items:flex-start; flex-direction:column; gap:10px; } .tla-ph-profile-service-actions { justify-content:flex-start; } } @media (max-width:620px) { .tla-ph-profile-service-actions { display:grid; grid-template-columns:1fr; width:100%; } .tla-ph-profile-service-actions a { justify-content:center; width:100%; } } .tla-ph-profile-assurance-icon { align-items:center; background:rgba(10,144,246,.1); border-radius:12px; color:var(--tla-ph-blue); display:flex; flex:0 0 42px; height:42px; justify-content:center; width:42px; } .tla-ph-profile-assurance-icon .dashicons { font-size:21px; height:21px; width:21px; } .tla-ph-profile-assurance-card.is-reviewing .tla-ph-profile-assurance-icon { background:rgba(217,119,6,.1); color:#b45309; } /* ========================================================== Version 1.0.81 - explicit single-region partner presence ========================================================== */ .tla-ph-region-suggest { align-items:center; display:flex; flex-wrap:wrap; gap:12px; margin-top:14px; } .tla-ph-region-suggest-status { color:var(--tla-ph-muted); font-size:12.5px; line-height:1.5; } .tla-ph-region-picker { display:grid; gap:16px; } .tla-ph-region-radio-grid { display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); } .tla-ph-region-radio-card { align-items:center; background:var(--tla-ph-surface); border:1px solid var(--tla-ph-border); border-radius:12px; cursor:pointer; display:flex; gap:9px; min-height:46px; padding:10px 13px; transition:border-color .15s ease,background .15s ease; } .tla-ph-region-radio-card input { accent-color:var(--tla-ph-blue); margin:0; } .tla-ph-region-radio-card span { color:var(--tla-ph-text); font-size:13px; font-weight:650; } .tla-ph-region-radio-card:has(input:checked) { background:var(--tla-ph-pastel-blue); border-color:var(--tla-ph-blue); } .tla-ph-region-radio-card.is-clear { border-style:dashed; } .tla-ph-region-area-fieldset { background:var(--tla-ph-soft); border:1px solid var(--tla-ph-border); border-radius:14px; display:block; margin:0; padding:16px; } .tla-ph-region-area-fieldset legend { color:var(--tla-ph-heading); font-size:13px; font-weight:800; padding:0 4px; } .tla-ph-region-area-checks { display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); margin-top:8px; } .tla-ph-region-area-checks label { align-items:center; display:flex; gap:7px; font-size:12.5px; } .tla-ph-region-area-checks input { accent-color:var(--tla-ph-blue); margin:0; } /* Progressive enhancement only. Every browser (including those without :has() support) sees every fieldset by default and the form works correctly on submit either way — the server only ever keeps areas that actually belong to the submitted region. Where :has() is supported, this first collapses every fieldset, then the specific rule below it reveals only the one matching the checked region radio. */ .tla-ph-region-picker:has(input[name="primary_region_key"]) .tla-ph-region-area-fieldset { display:none; } .tla-ph-region-picker:has(input[value="scotland"]:checked) .tla-ph-region-area-fieldset[data-region-areas="scotland"], .tla-ph-region-picker:has(input[value="north-east"]:checked) .tla-ph-region-area-fieldset[data-region-areas="north-east"], .tla-ph-region-picker:has(input[value="north-west"]:checked) .tla-ph-region-area-fieldset[data-region-areas="north-west"], .tla-ph-region-picker:has(input[value="yorkshire-and-the-humber"]:checked) .tla-ph-region-area-fieldset[data-region-areas="yorkshire-and-the-humber"], .tla-ph-region-picker:has(input[value="east-midlands"]:checked) .tla-ph-region-area-fieldset[data-region-areas="east-midlands"], .tla-ph-region-picker:has(input[value="west-midlands"]:checked) .tla-ph-region-area-fieldset[data-region-areas="west-midlands"], .tla-ph-region-picker:has(input[value="east-of-england"]:checked) .tla-ph-region-area-fieldset[data-region-areas="east-of-england"], .tla-ph-region-picker:has(input[value="wales"]:checked) .tla-ph-region-area-fieldset[data-region-areas="wales"], .tla-ph-region-picker:has(input[value="london"]:checked) .tla-ph-region-area-fieldset[data-region-areas="london"], .tla-ph-region-picker:has(input[value="south-east"]:checked) .tla-ph-region-area-fieldset[data-region-areas="south-east"], .tla-ph-region-picker:has(input[value="south-west"]:checked) .tla-ph-region-area-fieldset[data-region-areas="south-west"], .tla-ph-region-picker:has(input[value="northern-ireland"]:checked) .tla-ph-region-area-fieldset[data-region-areas="northern-ireland"] { display:block; } @media (max-width:700px) { .tla-ph-region-radio-grid, .tla-ph-region-area-checks { grid-template-columns:1fr 1fr; } } /* ===================================================================== FIND & MATCH — PREMIUM VISUAL SYSTEM (v1.0.88) Token-routed reskin of the guided-matching experience to match the TLA promo design language (Inter, pink/violet/blue gradient system, eyebrow labels, pill chips, generous radius, card hover-lift). Markup, layout and JS behaviour are untouched — every rule below is cosmetic only and appended last so it wins the cascade on selectors already defined earlier in this file, without needing !important. This also adds the dark-mode coverage the hero/finder/wizard never had: those rules were hardcoded hex with no html[data-tla-theme="dark"] handling at all. ===================================================================== */ .tla-ph-match-v1 .tla-ph-v1-hero { position: relative; z-index: 0; } .tla-ph-match-v1 .tla-ph-v1-hero::before { content: ""; position: absolute; z-index: -1; inset: -40px -10% auto -10%; height: 320px; background: radial-gradient(circle at 18% 20%, color-mix(in srgb, var(--tla-ph-pink) 14%, transparent), transparent 42%), radial-gradient(circle at 82% 10%, color-mix(in srgb, var(--tla-ph-blue) 14%, transparent), transparent 46%); pointer-events: none; } .tla-ph-match-v1 .tla-ph-v1-hero-eyebrow { justify-content: center; margin: 4px 0 14px; width: 100%; } .tla-ph-match-v1 .tla-ph-v1-hero h1 { color: var(--tla-ph-heading); background: var(--tla-ph-grad); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tla-ph-match-v1 .tla-ph-v1-hero > p:last-child { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-finder { position: relative; overflow: hidden; background: var(--tla-ph-surface); border-color: var(--tla-ph-border); border-radius: var(--tla-ph-radius-lg); box-shadow: var(--tla-ph-shadow-lg); } .tla-ph-match-v1 .tla-ph-v1-finder::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--tla-ph-grad); } .tla-ph-match-v1 .tla-ph-v1-progress { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-progress > div { background: var(--tla-ph-soft); } .tla-ph-match-v1 .tla-ph-v1-progress i { background: var(--tla-ph-grad); } .tla-ph-match-v1 .tla-ph-v1-step legend { color: var(--tla-ph-heading); } .tla-ph-match-v1 .tla-ph-v1-step legend > span { background: var(--tla-ph-grad); box-shadow: 0 8px 18px color-mix(in srgb, var(--tla-ph-violet) 30%, transparent); } .tla-ph-match-v1 .tla-ph-v1-step-copy { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-sector > span { background: var(--tla-ph-soft); border-color: var(--tla-ph-border); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease; } .tla-ph-match-v1 .tla-ph-v1-sector strong { color: var(--tla-ph-heading); } .tla-ph-match-v1 .tla-ph-v1-sector small { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-sector:hover > span { transform: translateY(-3px); border-color: color-mix(in srgb, var(--tla-ph-violet) 40%, var(--tla-ph-border)); box-shadow: var(--tla-ph-shadow); } .tla-ph-match-v1 .tla-ph-v1-sector input:checked + span { border-color: transparent; background: color-mix(in srgb, var(--tla-ph-violet) 8%, var(--tla-ph-surface)); box-shadow: 0 0 0 2px var(--tla-ph-violet), var(--tla-ph-shadow); } .tla-ph-match-v1 .tla-ph-v1-question { color: var(--tla-ph-heading); } .tla-ph-match-v1 .tla-ph-v1-inline-options span, .tla-ph-match-v1 .tla-ph-v1-timing span { background: var(--tla-ph-surface); border-color: var(--tla-ph-border); color: var(--tla-ph-text); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; } .tla-ph-match-v1 .tla-ph-v1-inline-options label:hover span, .tla-ph-match-v1 .tla-ph-v1-timing label:hover span { transform: translateY(-2px); border-color: color-mix(in srgb, var(--tla-ph-blue) 40%, var(--tla-ph-border)); } .tla-ph-match-v1 .tla-ph-v1-inline-options input:checked + span, .tla-ph-match-v1 .tla-ph-v1-timing input:checked + span { border-color: transparent; background: color-mix(in srgb, var(--tla-ph-violet) 8%, var(--tla-ph-surface)); box-shadow: 0 0 0 2px var(--tla-ph-violet); } .tla-ph-match-v1 .tla-ph-v1-location input { background: var(--tla-ph-surface); border-color: var(--tla-ph-border); color: var(--tla-ph-text); } .tla-ph-match-v1 .tla-ph-v1-location small { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-location small.is-valid { color: var(--tla-ph-green); } .tla-ph-match-v1 .tla-ph-v1-trust span { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-trust span::before { color: var(--tla-ph-green); } .tla-ph-match-v1 .tla-ph-v1-finder .tla-ph-match-actions { border-top-color: var(--tla-ph-border); } .tla-ph-match-v1 .tla-ph-v1-business-search { background: linear-gradient(135deg, var(--tla-ph-surface), var(--tla-ph-pastel-blue)); border-color: var(--tla-ph-border); box-shadow: var(--tla-ph-shadow); } .tla-ph-match-v1 .tla-ph-v1-business-search h2 { color: var(--tla-ph-heading); } .tla-ph-match-v1 .tla-ph-v1-business-search p { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-business-search-form label span { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-v1-business-search-form input { background: var(--tla-ph-surface); border-color: var(--tla-ph-border); color: var(--tla-ph-text); } .tla-ph-match-v1 .tla-ph-v1-shortlist { background: linear-gradient(135deg, var(--tla-ph-navy), #1b1246); box-shadow: var(--tla-ph-shadow-lg); } /* Match cards read their palette from local custom properties on .tla-ph-match-results — retargeting those to design tokens cascades the whole card system (head, reasoning strip, services, foot, empty state) without editing each rule that already consumes var(--tla-m-*). */ .tla-ph-match-v1 .tla-ph-match-results { --tla-m-ink: var(--tla-ph-heading); --tla-m-slate: var(--tla-ph-muted); --tla-m-hairline: var(--tla-ph-border); --tla-m-signal: var(--tla-ph-blue); --tla-m-accredit: var(--tla-ph-green); --tla-m-paper: var(--tla-ph-surface); } .tla-ph-match-v1 .tla-ph-match-results-head h2 { color: var(--tla-ph-heading); } .tla-ph-match-v1 .tla-ph-match-eyebrow { color: var(--tla-ph-blue); } .tla-ph-match-v1 .tla-ph-match { border-radius: var(--tla-ph-radius); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; } .tla-ph-match-v1 .tla-ph-match:hover { transform: translateY(-4px); box-shadow: var(--tla-ph-shadow-lg); } .tla-ph-match-v1 .tla-ph-match-list.is-best .tla-ph-match { border-color: transparent; box-shadow: 0 0 0 2px var(--tla-ph-violet), var(--tla-ph-shadow-lg); } .tla-ph-match-v1 .tla-ph-match-select { background: var(--tla-ph-grad); border-color: transparent; } .tla-ph-match-v1 .tla-ph-match-select:hover { filter: brightness(1.06); } .tla-ph-match-v1 .tla-ph-match-select:has(input:checked) { background: var(--tla-ph-green); border-color: var(--tla-ph-green); } .tla-ph-match-v1 .tla-ph-match-score { background: conic-gradient(var(--tla-ph-blue) 0 var(--score-angle), var(--tla-ph-soft) var(--score-angle) 360deg); box-shadow: var(--tla-ph-shadow); } .tla-ph-match-v1 .tla-ph-match-score::before { background: var(--tla-ph-surface); } .tla-ph-match-v1 .tla-ph-match-score strong { color: var(--tla-ph-heading); } .tla-ph-match-v1 .tla-ph-match-score span { color: var(--tla-ph-muted); } .tla-ph-match-v1 .tla-ph-match-score small { color: var(--tla-ph-blue); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-finder::before, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-step legend > span { box-shadow: 0 8px 22px rgba(0,0,0,.45); } html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-sector input:checked + span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-inline-options input:checked + span, html[data-tla-theme="dark"] .tla-ph-match-v1 .tla-ph-v1-timing input:checked + span { background: color-mix(in srgb, var(--tla-ph-violet) 16%, var(--tla-ph-surface)); } /* ===================================================================== SECTOR PICKER — category imagery + launching-soon cards (v1.0.89) Each sector card is a wide banner photo with its category name already baked into the image (design supplied by TLA). The HTML label text is kept for screen readers/SEO only (.tla-ph-v1-sector-sr), not shown visually, since the image already carries it. Cards for sectors that exist in the plugin but aren't switched to public yet render as a non-interactive (not a