/*
Theme Name: Probashi Seba
Theme URI: https://example.com/
Author: Probashi Seba
Description: A Bangla-first WordPress theme for expatriate services, designed for low-literacy users. Icon-led navigation, audio explainers, and a persistent call bar. Self-hosted subsetted Hind Siliguri.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: probashi-seba
Tags: bangla, bengali, accessibility-ready, custom-logo, custom-menu, translation-ready
*/

/* ==========================================================================
   1. Fonts — self-hosted, subsetted. Includes U+0964 (danda) which the
   Bengali Unicode block does not contain.
   ========================================================================== */

@font-face {
	font-family: 'Hind Siliguri';
	src: url('assets/fonts/HindSiliguri-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Hind Siliguri';
	src: url('assets/fonts/HindSiliguri-SemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   2. Tokens
   ========================================================================== */

:root {
	--ps-green: #006A4E;
	--ps-green-dark: #00523C;
	--ps-leaf: #1D9E75;
	--ps-ring: #A3CBC0;
	--ps-light: #E1F5EE;
	--ps-red: #F42A41;
	--ps-red-dark: #C81E32;
	--ps-ink: #1F2421;
	--ps-muted: #5F5E5A;
	--ps-line: #D9D7CF;
	--ps-bg: #FFFFFF;
	--ps-sand: #FBFAF7;

	/* Bangla needs a larger base than Latin: conjuncts stack vertically and
	   the matra sits above the x-height, so small sizes lose legibility. */
	--ps-text: 1.125rem;
	--ps-lead: 1.3125rem;
	--ps-h1: clamp(1.875rem, 5.5vw, 3rem);
	--ps-h2: clamp(1.5rem, 4vw, 2.125rem);
	--ps-h3: 1.375rem;

	/* Bangla line-height must be generous — vertical conjuncts collide below 1.7 */
	--ps-lh: 1.8;
	--ps-lh-tight: 1.45;

	--ps-tap: 3.5rem;          /* 56px minimum touch target */
	--ps-bar: 4.5rem;          /* mobile action bar height */
	--ps-radius: 0.875rem;
	--ps-shadow: 0 1px 2px rgba(31, 36, 33, .06), 0 4px 16px rgba(31, 36, 33, .06);
	--ps-shadow-lift: 0 2px 4px rgba(31, 36, 33, .08), 0 12px 28px rgba(31, 36, 33, .10);
	--ps-wrap: 72rem;
}

/* ==========================================================================
   3. Reset and base
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

body {
	margin: 0;
	font-family: 'Hind Siliguri', system-ui, -apple-system, 'Segoe UI', sans-serif;
	font-size: var(--ps-text);
	line-height: var(--ps-lh);
	color: var(--ps-ink);
	background: var(--ps-bg);

	/* Never use word-break: break-all on Bangla — it splits conjuncts apart. */
	word-break: normal;
	overflow-wrap: break-word;
	/* Bangla has no hyphenation dictionary; leave it off. */
	hyphens: none;
	-webkit-font-smoothing: antialiased;
}

/* Leave room for the fixed action bar on phones */
body.has-action-bar { padding-bottom: var(--ps-bar); }
@media (min-width: 48em) { body.has-action-bar { padding-bottom: 0; } }

img, svg, video { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4 {
	margin: 0 0 .5em;
	font-weight: 600;
	line-height: var(--ps-lh-tight);
	color: var(--ps-green);
}

h1 { font-size: var(--ps-h1); }
h2 { font-size: var(--ps-h2); }
h3 { font-size: var(--ps-h3); }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

a { color: var(--ps-green); text-decoration-thickness: .08em; text-underline-offset: .22em; }
a:hover { color: var(--ps-green-dark); }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--ps-red);
	outline-offset: 3px;
	border-radius: 4px;
}

.ps-skip {
	position: absolute; left: -9999px; top: 0; z-index: 999;
	padding: 1rem 1.5rem; background: var(--ps-green); color: #fff;
}
.ps-skip:focus { left: 0; }

.ps-sr {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ==========================================================================
   4. Layout
   ========================================================================== */

.ps-wrap { width: 100%; max-width: var(--ps-wrap); margin-inline: auto; padding-inline: 1.25rem; }
@media (min-width: 48em) { .ps-wrap { padding-inline: 2rem; } }

.ps-section { padding-block: 3.5rem; }
@media (min-width: 48em) { .ps-section { padding-block: 5rem; } }

.ps-section--sand { background: var(--ps-sand); }
.ps-section--light { background: var(--ps-light); }

.ps-section__head { max-width: 44rem; margin-bottom: 2.5rem; }
.ps-section__head--center { margin-inline: auto; text-align: center; }
.ps-section__head p { color: var(--ps-muted); font-size: var(--ps-lead); margin-bottom: 0; }

.ps-eyebrow {
	display: inline-block; margin-bottom: .75rem;
	font-size: 1rem; font-weight: 600; color: var(--ps-leaf);
}

/* ==========================================================================
   5. Buttons — everything meets the 56px touch target
   ========================================================================== */

.ps-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .625rem;
	min-height: var(--ps-tap); padding: .75rem 1.5rem;
	font-family: inherit; font-size: var(--ps-lead); font-weight: 600; line-height: 1.3;
	border: 2px solid transparent; border-radius: var(--ps-radius);
	text-decoration: none; cursor: pointer;
	transition: background-color .15s ease, transform .1s ease, box-shadow .15s ease;
}
.ps-btn:active { transform: translateY(1px); }
.ps-btn svg { flex: 0 0 auto; }

.ps-btn--call { background: var(--ps-red); color: #fff; box-shadow: var(--ps-shadow); }
.ps-btn--call:hover { background: var(--ps-red-dark); color: #fff; }

.ps-btn--primary { background: var(--ps-green); color: #fff; }
.ps-btn--primary:hover { background: var(--ps-green-dark); color: #fff; }

.ps-btn--ghost { background: #fff; color: var(--ps-green); border-color: var(--ps-ring); }
.ps-btn--ghost:hover { background: var(--ps-light); color: var(--ps-green-dark); }

.ps-btn--block { width: 100%; }

.ps-btn-row { display: flex; flex-wrap: wrap; gap: .875rem; }

/* ==========================================================================
   6. Header
   ========================================================================== */

.ps-header {
	position: sticky; top: 0; z-index: 60;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--ps-line);
}

.ps-header__strip {
	background: var(--ps-green); color: #fff;
	font-size: 1rem; text-align: center; padding: .5rem 1.25rem;
}
.ps-header__strip a { color: #fff; font-weight: 600; }

.ps-header__inner {
	display: flex; align-items: center; gap: 1rem;
	min-height: 4.5rem; padding-block: .625rem;
}

.ps-logo { display: flex; align-items: center; flex: 0 0 auto; text-decoration: none; }
.ps-logo img, .ps-logo svg { height: 2.75rem; width: auto; }
@media (min-width: 62em) { .ps-logo img, .ps-logo svg { height: 3.5rem; } }
.ps-logo--full { display: none; }
@media (min-width: 62em) {
	.ps-logo--full { display: block; }
	.ps-logo--compact { display: none; }
}

.ps-header__spacer { flex: 1 1 auto; }

.ps-nav { display: none; }
@media (min-width: 62em) {
	.ps-nav { display: block; }
	.ps-nav ul { display: flex; align-items: center; gap: .25rem; list-style: none; margin: 0; padding: 0; }
	.ps-nav a {
		display: block; padding: .625rem .875rem; border-radius: .5rem;
		font-weight: 600; color: var(--ps-ink); text-decoration: none;
	}
	.ps-nav a:hover { background: var(--ps-light); color: var(--ps-green); }
	.ps-nav .current-menu-item > a { color: var(--ps-green); background: var(--ps-light); }
}

.ps-header__call { display: none; }
@media (min-width: 62em) { .ps-header__call { display: inline-flex; } }

.ps-burger {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	min-height: var(--ps-tap); min-width: var(--ps-tap); padding: .5rem .875rem;
	background: #fff; border: 2px solid var(--ps-ring); border-radius: var(--ps-radius);
	color: var(--ps-green); font-family: inherit; font-size: 1rem; font-weight: 600;
	cursor: pointer;
}
@media (min-width: 62em) { .ps-burger { display: none; } }

.ps-drawer {
	display: none; border-top: 1px solid var(--ps-line);
	background: #fff; padding: 1rem 0 1.5rem;
}
.ps-drawer[data-open="true"] { display: block; }
@media (min-width: 62em) { .ps-drawer { display: none !important; } }
.ps-drawer ul { list-style: none; margin: 0; padding: 0; }
.ps-drawer a {
	display: flex; align-items: center; min-height: var(--ps-tap);
	padding: .5rem .25rem; font-size: var(--ps-lead); font-weight: 600;
	color: var(--ps-ink); text-decoration: none;
	border-bottom: 1px solid var(--ps-line);
}
.ps-drawer a:hover { color: var(--ps-green); }

/* ==========================================================================
   7. Hero
   ========================================================================== */

.ps-hero { background: var(--ps-light); padding-block: 3rem 3.5rem; }
@media (min-width: 62em) { .ps-hero { padding-block: 4.5rem 5rem; } }

.ps-hero__grid { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 62em) { .ps-hero__grid { grid-template-columns: 1.1fr .9fr; gap: 4rem; } }

.ps-hero h1 { margin-bottom: .75rem; }
.ps-hero__lead {
	font-size: clamp(1.1875rem, 3.2vw, 1.5rem);
	color: var(--ps-ink); margin-bottom: 1.75rem; max-width: 34rem;
}

.ps-hero__media {
	border-radius: 1.25rem; overflow: hidden;
	box-shadow: var(--ps-shadow-lift); background: #fff;
}
.ps-hero__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.ps-hero__mark { display: grid; place-items: center; padding: 3rem; }
.ps-hero__mark svg { width: min(16rem, 60%); height: auto; }

.ps-trustline {
	display: flex; flex-wrap: wrap; gap: .5rem 1.25rem;
	margin-top: 1.5rem; font-size: 1rem; color: var(--ps-green);
}
.ps-trustline span { display: inline-flex; align-items: center; gap: .375rem; font-weight: 600; }

/* ==========================================================================
   8. Service grid — icons carry the meaning, not the text
   ========================================================================== */

.ps-services { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 40em) { .ps-services { grid-template-columns: repeat(3, 1fr); gap: 1.25rem; } }
@media (min-width: 62em) { .ps-services { grid-template-columns: repeat(4, 1fr); } }

.ps-service {
	display: flex; flex-direction: column; align-items: center; gap: .875rem;
	padding: 1.5rem 1rem; min-height: 11rem;
	background: #fff; border: 1px solid var(--ps-line); border-radius: var(--ps-radius);
	text-align: center; text-decoration: none; color: var(--ps-ink);
	transition: border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.ps-service:hover {
	border-color: var(--ps-green); box-shadow: var(--ps-shadow-lift);
	color: var(--ps-green); transform: translateY(-2px);
}
.ps-service:active { transform: translateY(0); }

.ps-service__icon {
	display: grid; place-items: center;
	width: 4.25rem; height: 4.25rem; flex: 0 0 auto;
	background: var(--ps-light); border-radius: 50%; color: var(--ps-green);
}
.ps-service:hover .ps-service__icon { background: var(--ps-green); color: #fff; }
.ps-service__icon svg { width: 2.125rem; height: 2.125rem; }

.ps-service__name { font-size: 1.0625rem; font-weight: 600; line-height: 1.5; }
@media (min-width: 40em) { .ps-service__name { font-size: 1.125rem; } }

/* ==========================================================================
   9. Audio explainer — the accessibility centrepiece
   ========================================================================== */

.ps-audio {
	display: flex; align-items: center; gap: 1rem;
	padding: 1rem 1.25rem; margin-block: 1.5rem;
	background: var(--ps-light); border: 2px solid var(--ps-ring);
	border-radius: var(--ps-radius);
}

.ps-audio__btn {
	display: grid; place-items: center; flex: 0 0 auto;
	width: 4rem; height: 4rem; padding: 0;
	background: var(--ps-green); color: #fff;
	border: 0; border-radius: 50%; cursor: pointer;
	transition: background-color .15s ease, transform .1s ease;
}
.ps-audio__btn:hover { background: var(--ps-green-dark); }
.ps-audio__btn:active { transform: scale(.96); }
.ps-audio__btn svg { width: 1.75rem; height: 1.75rem; }
.ps-audio__btn .ps-audio__pause { display: none; }
.ps-audio[data-playing="true"] .ps-audio__play { display: none; }
.ps-audio[data-playing="true"] .ps-audio__pause { display: block; }

.ps-audio__label { font-size: var(--ps-lead); font-weight: 600; color: var(--ps-green); }
.ps-audio__hint { font-size: 1rem; color: var(--ps-muted); }

/* ==========================================================================
   10. Steps
   ========================================================================== */

.ps-steps { display: grid; gap: 1.5rem; counter-reset: ps-step; }
@media (min-width: 48em) { .ps-steps { grid-template-columns: repeat(3, 1fr); gap: 2rem; } }

.ps-step { display: flex; gap: 1.125rem; }
@media (min-width: 48em) { .ps-step { flex-direction: column; gap: 1rem; } }

.ps-step__num {
	display: grid; place-items: center; flex: 0 0 auto;
	width: 3rem; height: 3rem;
	background: var(--ps-green); color: #fff;
	border-radius: 50%; font-size: 1.375rem; font-weight: 600;
}
.ps-step h3 { margin-bottom: .25rem; }
.ps-step p { color: var(--ps-muted); margin-bottom: 0; }

/* ==========================================================================
   11. Trust cards
   ========================================================================== */

.ps-trust { display: grid; gap: 1.25rem; }
@media (min-width: 40em) { .ps-trust { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 62em) { .ps-trust { grid-template-columns: repeat(4, 1fr); } }

.ps-trust__card {
	padding: 1.75rem 1.5rem; background: #fff;
	border: 1px solid var(--ps-line); border-radius: var(--ps-radius);
}
.ps-trust__card svg { width: 2.25rem; height: 2.25rem; color: var(--ps-leaf); margin-bottom: .875rem; }
.ps-trust__card h3 { font-size: 1.1875rem; margin-bottom: .375rem; }
.ps-trust__card p { color: var(--ps-muted); font-size: 1.0625rem; margin-bottom: 0; }

.ps-licence {
	display: inline-flex; align-items: center; gap: .625rem;
	padding: .75rem 1.25rem; margin-top: 1.5rem;
	background: #fff; border: 2px solid var(--ps-green); border-radius: var(--ps-radius);
	font-weight: 600; color: var(--ps-green);
}

/* ==========================================================================
   12. Testimonials
   ========================================================================== */

.ps-quotes { display: grid; gap: 1.25rem; }
@media (min-width: 48em) { .ps-quotes { grid-template-columns: repeat(3, 1fr); } }

.ps-quote {
	display: flex; flex-direction: column; gap: 1rem;
	padding: 1.75rem; background: #fff;
	border: 1px solid var(--ps-line); border-radius: var(--ps-radius);
}
.ps-quote p { font-size: 1.0625rem; margin: 0; }
.ps-quote footer { display: flex; align-items: center; gap: .875rem; margin-top: auto; }
.ps-quote img { width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.ps-quote__who { font-weight: 600; line-height: 1.4; }
.ps-quote__where { font-size: 1rem; color: var(--ps-muted); }

/* ==========================================================================
   13. Contact
   ========================================================================== */

.ps-contact { display: grid; gap: 2rem; }
@media (min-width: 62em) { .ps-contact { grid-template-columns: 1fr 1fr; gap: 3rem; } }

.ps-contact__list { list-style: none; margin: 0 0 1.75rem; padding: 0; display: grid; gap: 1.125rem; }
.ps-contact__list li { display: flex; gap: .875rem; align-items: flex-start; }
.ps-contact__list svg { width: 1.5rem; height: 1.5rem; color: var(--ps-leaf); flex: 0 0 auto; margin-top: .25rem; }
.ps-contact__list strong { display: block; }
.ps-contact__list span { color: var(--ps-muted); }

.ps-map { border-radius: var(--ps-radius); overflow: hidden; border: 1px solid var(--ps-line); }
.ps-map iframe { display: block; width: 100%; height: 22rem; border: 0; }

/* ==========================================================================
   14. Fraud warning — protective, and a trust signal in its own right
   ========================================================================== */

.ps-warning {
	display: flex; gap: 1rem; align-items: flex-start;
	padding: 1.25rem 1.5rem; margin-block: 2rem;
	background: #FFF6F0; border-inline-start: 5px solid var(--ps-red);
	border-radius: .625rem;
}
.ps-warning svg { width: 1.75rem; height: 1.75rem; color: var(--ps-red); flex: 0 0 auto; }
.ps-warning strong { display: block; color: var(--ps-red-dark); }
.ps-warning p { margin: 0; font-size: 1.0625rem; }

/* ==========================================================================
   15. Content pages
   ========================================================================== */

.ps-page { padding-block: 2.5rem 3.5rem; }
.ps-page__head { padding-bottom: 1.75rem; margin-bottom: 2rem; border-bottom: 1px solid var(--ps-line); }

.ps-prose { max-width: 44rem; }
.ps-prose h2 { margin-top: 2.25rem; }
.ps-prose h3 { margin-top: 1.75rem; }
.ps-prose ul, .ps-prose ol { padding-inline-start: 1.5rem; margin-bottom: 1.25rem; }
.ps-prose li { margin-bottom: .5rem; }
.ps-prose img { border-radius: var(--ps-radius); margin-block: 1.5rem; }
.ps-prose blockquote {
	margin: 1.75rem 0; padding: 1.25rem 1.5rem;
	background: var(--ps-light); border-inline-start: 5px solid var(--ps-green);
	border-radius: .625rem;
}
.ps-prose table { width: 100%; border-collapse: collapse; margin-block: 1.5rem; }
.ps-prose th, .ps-prose td { padding: .75rem 1rem; border: 1px solid var(--ps-line); text-align: start; }
.ps-prose th { background: var(--ps-light); font-weight: 600; }

.ps-breadcrumb { font-size: 1rem; color: var(--ps-muted); margin-bottom: 1rem; }
.ps-breadcrumb a { color: var(--ps-muted); }

.ps-cards { display: grid; gap: 1.25rem; }
@media (min-width: 48em) { .ps-cards { grid-template-columns: repeat(2, 1fr); } }
.ps-card {
	display: flex; flex-direction: column; gap: .625rem;
	padding: 1.5rem; background: #fff;
	border: 1px solid var(--ps-line); border-radius: var(--ps-radius);
	text-decoration: none; color: var(--ps-ink);
}
.ps-card:hover { border-color: var(--ps-green); box-shadow: var(--ps-shadow); }
.ps-card h3 { margin: 0; }
.ps-card p { color: var(--ps-muted); margin: 0; }

.ps-pagination { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 2.5rem; }
.ps-pagination .page-numbers {
	display: grid; place-items: center; min-width: var(--ps-tap); min-height: var(--ps-tap);
	padding: 0 .75rem; border: 1px solid var(--ps-line); border-radius: .625rem;
	text-decoration: none; font-weight: 600;
}
.ps-pagination .current { background: var(--ps-green); color: #fff; border-color: var(--ps-green); }

/* ==========================================================================
   16. Footer
   ========================================================================== */

.ps-footer { background: var(--ps-green); color: #fff; padding-block: 3rem 2rem; }
.ps-footer a { color: #fff; }
.ps-footer__grid { display: grid; gap: 2.5rem; }
@media (min-width: 48em) { .ps-footer__grid { grid-template-columns: 1.4fr 1fr 1fr; gap: 3rem; } }
.ps-footer h2 { font-size: 1.1875rem; color: #fff; margin-bottom: 1rem; }
.ps-footer img { height: 3.25rem; width: auto; margin-bottom: 1.25rem; }
.ps-footer p { color: #CFE6DC; }
.ps-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .375rem; }
.ps-footer ul a { display: inline-block; padding-block: .375rem; }
.ps-footer__bottom {
	margin-top: 2.5rem; padding-top: 1.5rem;
	border-top: 1px solid #3C8B74;
	font-size: 1rem; color: #CFE6DC;
	display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; justify-content: space-between;
}

/* ==========================================================================
   17. Mobile action bar — the most important element on the site
   ========================================================================== */

.ps-actionbar {
	position: fixed; inset-inline: 0; bottom: 0; z-index: 80;
	display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
	background: #fff; border-top: 1px solid var(--ps-line);
	box-shadow: 0 -4px 20px rgba(31, 36, 33, .10);
	padding-bottom: env(safe-area-inset-bottom);
}
@media (min-width: 48em) { .ps-actionbar { display: none; } }

.ps-actionbar a {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1875rem;
	min-height: var(--ps-bar); padding: .5rem .25rem;
	font-size: .9375rem; font-weight: 600; line-height: 1.3;
	text-decoration: none; color: var(--ps-ink);
	border-inline-end: 1px solid var(--ps-line);
}
.ps-actionbar a:last-child { border-inline-end: 0; }
.ps-actionbar svg { width: 1.5rem; height: 1.5rem; }
.ps-actionbar__call { background: var(--ps-red); color: #fff !important; }
.ps-actionbar__wa { color: var(--ps-green) !important; }

/* ==========================================================================
   18. Print
   ========================================================================== */

@media print {
	.ps-header, .ps-actionbar, .ps-audio, .ps-map { display: none !important; }
	body { padding-bottom: 0; font-size: 11pt; }
	a { text-decoration: none; color: #000; }
}

/* ==========================================================================
   19. Page lead paragraph
   ========================================================================== */

.ps-page__lead {
	font-size: var(--ps-lead);
	color: var(--ps-muted);
	max-width: 46rem;
	margin: 0;
}

.ps-section--inset {
	margin-top: 3.5rem;
	padding: 2.5rem 1.5rem;
	background: var(--ps-sand);
	border-radius: var(--ps-radius);
}
@media (min-width: 48em) { .ps-section--inset { padding: 2.75rem 2.5rem; } }
.ps-section--inset > h2 { margin-bottom: 1.75rem; }

/* ==========================================================================
   20. Contact channel buttons — the whole point of the contact page
   ========================================================================== */

.ps-channels {
	display: grid; gap: 1rem;
	margin-bottom: 2.5rem;
}
@media (min-width: 40em) { .ps-channels { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 62em) { .ps-channels { grid-template-columns: repeat(4, 1fr); } }

.ps-channel {
	display: flex; align-items: center; gap: 1rem;
	min-height: 5.5rem; padding: 1rem 1.25rem;
	background: #fff; border: 2px solid var(--ps-ring); border-radius: var(--ps-radius);
	text-decoration: none; color: var(--ps-ink);
	transition: border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.ps-channel:hover { border-color: var(--ps-green); box-shadow: var(--ps-shadow-lift); transform: translateY(-2px); }
.ps-channel:active { transform: translateY(0); }

.ps-channel__icon {
	display: grid; place-items: center; flex: 0 0 auto;
	width: 3.5rem; height: 3.5rem;
	background: var(--ps-light); border-radius: 50%; color: var(--ps-green);
}
.ps-channel__body { display: flex; flex-direction: column; line-height: 1.45; min-width: 0; }
.ps-channel__body strong { font-size: 1.125rem; }
.ps-channel__body span { font-size: 1rem; color: var(--ps-muted); overflow-wrap: anywhere; }

.ps-channel--call {
	background: var(--ps-red); border-color: var(--ps-red); color: #fff;
}
.ps-channel--call:hover { background: var(--ps-red-dark); border-color: var(--ps-red-dark); color: #fff; }
.ps-channel--call .ps-channel__icon { background: rgba(255, 255, 255, .2); color: #fff; }
.ps-channel--call .ps-channel__body span { color: #FFE3E6; }

/* ==========================================================================
   21. Form
   ========================================================================== */

.ps-form {
	padding: 1.75rem 1.5rem;
	background: var(--ps-sand);
	border: 1px solid var(--ps-line);
	border-radius: var(--ps-radius);
}
@media (min-width: 48em) { .ps-form { padding: 2rem; } }

.ps-form__intro { font-size: 1.0625rem; color: var(--ps-muted); margin-bottom: 1.5rem; }

.ps-field { margin-bottom: 1.25rem; }
.ps-field label { display: block; font-weight: 600; margin-bottom: .375rem; }
.ps-field label span { color: var(--ps-red); }

.ps-field input,
.ps-field textarea {
	width: 100%;
	min-height: var(--ps-tap);
	padding: .75rem 1rem;
	font-family: inherit;
	font-size: var(--ps-text);
	line-height: var(--ps-lh);
	color: var(--ps-ink);
	background: #fff;
	border: 2px solid var(--ps-ring);
	border-radius: .75rem;
}
.ps-field textarea { min-height: 7rem; resize: vertical; }
.ps-field input:focus, .ps-field textarea:focus { border-color: var(--ps-green); }

.ps-field__hint { display: block; margin-top: .375rem; font-size: 1rem; color: var(--ps-muted); }

/* Honeypot. Hidden from people, visible to bots that ignore CSS. */
.ps-field--trap {
	position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;
}

.ps-notice {
	display: flex; gap: 1rem; align-items: flex-start;
	padding: 1.25rem 1.5rem; margin-bottom: 1.75rem;
	border-radius: .75rem;
}
.ps-notice svg { flex: 0 0 auto; }
.ps-notice strong { display: block; font-size: var(--ps-lead); }
.ps-notice p { margin: .25rem 0 0; font-size: 1.0625rem; }
.ps-notice--ok { background: var(--ps-light); border-inline-start: 5px solid var(--ps-green); color: var(--ps-ink); }
.ps-notice--ok svg { color: var(--ps-green); }
.ps-notice--bad { background: #FFF6F0; border-inline-start: 5px solid var(--ps-red); }
.ps-notice--bad svg { color: var(--ps-red); }

/* ==========================================================================
   22. Detailed service listing
   ========================================================================== */

.ps-detail-list { display: grid; gap: 1.5rem; }

.ps-detail {
	padding: 1.75rem 1.5rem;
	background: #fff;
	border: 1px solid var(--ps-line);
	border-radius: var(--ps-radius);
	scroll-margin-top: 8rem;
}
@media (min-width: 48em) { .ps-detail { padding: 2.25rem 2rem; } }

.ps-detail__head {
	display: flex; align-items: center; gap: 1.125rem;
	margin-bottom: 1.25rem;
}
.ps-detail__head h2 { margin: 0; font-size: 1.5rem; }

.ps-detail__icon {
	display: grid; place-items: center; flex: 0 0 auto;
	width: 4.5rem; height: 4.5rem;
	background: var(--ps-light); border-radius: 50%; color: var(--ps-green);
}

.ps-detail__price {
	display: inline-flex; align-items: center; gap: .5rem;
	margin: .5rem 0 0; font-size: 1.0625rem; color: var(--ps-green);
}
.ps-detail__price svg { flex: 0 0 auto; }

.ps-detail .ps-btn-row { margin-top: 1.5rem; }

/* ==========================================================================
   23. FAQ
   ========================================================================== */

.ps-faq { display: grid; gap: .875rem; }

.ps-faq details {
	background: #fff;
	border: 1px solid var(--ps-line);
	border-radius: var(--ps-radius);
	overflow: hidden;
}
.ps-faq details[open] { border-color: var(--ps-ring); }

.ps-faq summary {
	display: flex; align-items: center; gap: .75rem;
	min-height: var(--ps-tap); padding: 1rem 1.25rem;
	font-size: var(--ps-lead); font-weight: 600; color: var(--ps-green);
	cursor: pointer; list-style: none;
}
.ps-faq summary::-webkit-details-marker { display: none; }
.ps-faq summary::after {
	content: ""; flex: 0 0 auto; margin-inline-start: auto;
	width: .65rem; height: .65rem;
	border-inline-end: 2.5px solid currentColor; border-block-end: 2.5px solid currentColor;
	transform: rotate(45deg); transition: transform .15s ease;
}
.ps-faq details[open] summary::after { transform: rotate(-135deg); }
.ps-faq summary:hover { background: var(--ps-light); }
.ps-faq details > .ps-prose { padding: 0 1.25rem 1.25rem; }

/* ==========================================================================
   24. Closing call to action
   ========================================================================== */

.ps-cta {
	margin-top: 3.5rem;
	padding: 2.5rem 1.5rem;
	background: var(--ps-light);
	border-radius: var(--ps-radius);
	text-align: center;
}
@media (min-width: 48em) { .ps-cta { padding: 3rem 2.5rem; } }
.ps-cta h2 { margin-bottom: .5rem; }
.ps-cta p { max-width: 34rem; margin-inline: auto; margin-bottom: 1.75rem; color: var(--ps-ink); }

/* ==========================================================================
   25. Elementor
   ==========================================================================
   Two jobs here. First, stop Elementor's kit defaults from shrinking Bangla
   text below the legible floor inside its containers. Second, make sure the
   theme's own components keep their spacing when they are dropped into an
   Elementor column.
   ========================================================================== */

.ps-elementor { padding-block: 0; }

/* Elementor's reset sets line-height on the container; Bangla conjuncts
   collide below 1.7, so reassert it. */
.elementor-widget-container,
.elementor-widget-text-editor,
.elementor-widget-heading {
	line-height: inherit;
}

.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-icon-list .elementor-icon-list-text {
	font-size: var(--ps-text);
	line-height: var(--ps-lh);
	word-break: normal;
	overflow-wrap: break-word;
	hyphens: none;
}

.elementor-widget-heading .elementor-heading-title {
	line-height: var(--ps-lh-tight);
	color: var(--ps-green);
}

/* Any stock Elementor button still meets the touch target minimum. */
.elementor-button {
	min-height: var(--ps-tap);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	font-family: inherit;
	font-weight: 600;
	border-radius: var(--ps-radius);
}

/* Theme components dropped into an Elementor column should not inherit the
   editor's zeroed margins. */
.elementor-widget-ps_service_grid .ps-services,
.elementor-widget-ps_trust_cards .ps-trust,
.elementor-widget-ps_steps .ps-steps,
.elementor-widget-ps_quotes .ps-quotes { margin: 0; }

.elementor-widget-ps_channels .ps-channels { margin-bottom: 0; }
.elementor-widget-ps_warning .ps-warning { margin-block: 0; }
.elementor-widget-ps_audio .ps-audio { margin-block: 0; }
.elementor-widget-ps_licence .ps-licence { margin-top: 0; }

/* The editor renders widgets outside .ps-wrap, so give the detail cards a
   sensible measure of their own. */
.elementor-widget-ps_service_details .ps-detail .ps-prose { max-width: none; }

/* Editor-only helper text. */
.elementor-widget-container > .ps-form__intro:only-child {
	padding: 1rem;
	background: var(--ps-light);
	border-radius: .5rem;
	margin: 0;
}

.ps-licence-wrap { display: block; }

/* ==========================================================================
   26. English reference name
   ==========================================================================
   The Bangla title leads because that is what the visitor reads. The English
   name sits under it in small grey type for employers, embassies, partners,
   and anyone searching in English.
   ========================================================================== */

.ps-en {
	margin: .125rem 0 0;
	font-size: .9375rem;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: .02em;
	color: var(--ps-muted);
}

.ps-detail__head .ps-en { margin-bottom: .25rem; }

/* ==========================================================================
   27. Full enquiry form
   ==========================================================================
   Progressive disclosure: only the chosen service's questions are shown. If
   JavaScript never runs, .ps-form--js is never added and every group stays
   visible, which is longer but still completable.
   ========================================================================== */

.ps-formwrap { scroll-margin-top: 8rem; }

.ps-form--full { padding: 1.5rem 1.25rem; }
@media (min-width: 48em) { .ps-form--full { padding: 2rem; } }

.ps-form--js .ps-group--conditional[hidden] { display: none; }

/* Belt and braces: [hidden] is easily overridden by a display rule. */
.ps-group--conditional[hidden] { display: none; }

.ps-group {
	margin: 0 0 1.5rem;
	padding: 0;
	border: 0;
	border-top: 1px solid var(--ps-line);
	padding-top: 1.5rem;
}
.ps-group:first-of-type { border-top: 0; padding-top: 0; }

.ps-group__legend {
	display: block;
	padding: 0;
	margin-bottom: 1rem;
	font-size: 1.1875rem;
	font-weight: 600;
	color: var(--ps-green);
}

.ps-group__note {
	margin: -.5rem 0 1.25rem;
	font-size: 1.0625rem;
	color: var(--ps-muted);
}

.ps-grid { display: grid; gap: 1.125rem; }
@media (min-width: 40em) {
	.ps-grid { grid-template-columns: repeat(2, 1fr); }
	.ps-field--full { grid-column: 1 / -1; }
}

.ps-form--full .ps-field { margin-bottom: 0; }

/* Native date and time inputs need explicit sizing on iOS or they collapse. */
.ps-field input[type="date"],
.ps-field input[type="time"] {
	min-height: var(--ps-tap);
	-webkit-appearance: none;
	appearance: none;
}

.ps-field select {
	width: 100%;
	min-height: var(--ps-tap);
	padding: .75rem 2.5rem .75rem 1rem;
	font-family: inherit;
	font-size: var(--ps-text);
	line-height: var(--ps-lh);
	color: var(--ps-ink);
	background-color: #fff;
	background-image: linear-gradient(45deg, transparent 50%, var(--ps-green) 50%),
		linear-gradient(135deg, var(--ps-green) 50%, transparent 50%);
	background-position: calc(100% - 1.25rem) 55%, calc(100% - .8rem) 55%;
	background-size: .45rem .45rem, .45rem .45rem;
	background-repeat: no-repeat;
	border: 2px solid var(--ps-ring);
	border-radius: .75rem;
	-webkit-appearance: none;
	appearance: none;
}
.ps-field select:focus { border-color: var(--ps-green); }

/* Radios and checkboxes as full-size tappable cards. A 20px radio is not
   usable outdoors on a cracked screen. */
.ps-choicegroup { margin: 0; padding: 0; border: 0; }
.ps-choicegroup legend {
	display: block;
	padding: 0;
	margin-bottom: .5rem;
	font-weight: 600;
}
.ps-choicegroup legend span { color: var(--ps-red); }

.ps-choices { display: grid; gap: .5rem; margin-top: .5rem; }
@media (min-width: 30em) { .ps-choices { grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); } }

.ps-choice {
	display: flex;
	align-items: center;
	gap: .75rem;
	min-height: var(--ps-tap);
	padding: .625rem 1rem;
	background: #fff;
	border: 2px solid var(--ps-ring);
	border-radius: .75rem;
	cursor: pointer;
	font-size: 1.0625rem;
	line-height: 1.4;
}
.ps-choice:hover { border-color: var(--ps-green); background: var(--ps-light); }
.ps-choice input {
	flex: 0 0 auto;
	width: 1.375rem;
	height: 1.375rem;
	margin: 0;
	accent-color: var(--ps-green);
}
.ps-choice.is-checked {
	border-color: var(--ps-green);
	background: var(--ps-light);
	font-weight: 600;
}

/* Kept for browsers that support it, harmlessly ignored by those that don't. */
@supports selector(:has(*)) {
	.ps-choice:has(input:checked) {
		border-color: var(--ps-green);
		background: var(--ps-light);
		font-weight: 600;
	}
}

.ps-warning--form { margin-block: 1.5rem 0; }

.ps-form__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .875rem;
	margin-top: 1.75rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--ps-line);
}
.ps-form__actions .ps-btn { flex: 1 1 14rem; }

/* ==========================================================================
   28. Live chat (tawk.to)
   ==========================================================================
   tawk.to's floating launcher sits bottom right, which is precisely where the
   sticky call bar lives. Two fixes:

   On phones the launcher is hidden by script and chat becomes a fourth segment
   in the bar, so all four contact routes sit together instead of stacking.

   On desktop there is no bar, so the bubble is left alone — but the footer is
   given room so the bubble never covers the licence number.
   ========================================================================== */

/* Four segments need slightly tighter type to stay on one line at 320px. */
body.has-tawk-in-bar .ps-actionbar a {
	font-size: .875rem;
	padding-inline: .125rem;
}
body.has-tawk-in-bar .ps-actionbar svg { width: 1.375rem; height: 1.375rem; }

.ps-actionbar__chat { color: var(--ps-leaf) !important; }

/* Belt and braces: if the script fails to hide the launcher, force it off on
   phones so it cannot cover the call button. The bar carries chat anyway. */
@media (max-width: 47.99em) {
	body.has-tawk-in-bar #tawkchat-container,
	body.has-tawk-in-bar .tawk-min-container,
	body.has-tawk-in-bar iframe[title*="chat" i][style*="fixed"] {
		display: none !important;
	}
	/* Except once opened, when the panel itself must be visible. */
	body.has-tawk-in-bar.tawk-open #tawkchat-container,
	body.has-tawk-in-bar.tawk-open iframe[title*="chat" i][style*="fixed"] {
		display: block !important;
	}
}

/* Desktop: keep the bubble clear of footer content. */
@media (min-width: 48em) {
	body.has-tawk .ps-footer { padding-bottom: 5.5rem; }
}

/* A chat link anywhere in content. */
.ps-chatlink {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-weight: 600;
	cursor: pointer;
}