/*
 * Price Table Elementor Addon – v3.3.0
 * Added: full style controls for single-card info/pills, complete tablet responsiveness
 */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600;700&family=Inter:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400&display=swap');

/* ────────────────────────────────────────────────────────────
   BASE
──────────────────────────────────────────────────────────── */
.pte-pricing-wrap {
	font-family: 'Inter', sans-serif;
	box-sizing: border-box;
	width: 100%;
}
.pte-pricing-wrap *,
.pte-pricing-wrap *::before,
.pte-pricing-wrap *::after { box-sizing: border-box; }

/* ────────────────────────────────────────────────────────────
   TAB BAR
──────────────────────────────────────────────────────────── */
.pte-tabs-wrap {
	display: flex;
	justify-content: center;
	margin-bottom: 40px;
}
.pte-tabs-bar {
	display: inline-flex;
	align-items: center;
	background-color: #efefef;
	border-radius: 50px;
	padding: 4px;
	gap: 2px;
}
.pte-tab-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 24px;
	border-radius: 50px;
	border: none;
	background: transparent;
	color: #888888;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
	white-space: nowrap;
	outline: none;
	letter-spacing: -0.01em;
	-webkit-font-smoothing: antialiased;
}
.pte-tab-btn.pte-tab-active { background-color: #1a1a1a; color: #ffffff; }
.pte-tab-btn:not(.pte-tab-active):hover { color: #444444; }

/* ────────────────────────────────────────────────────────────
   TAB PANELS
──────────────────────────────────────────────────────────── */
.pte-tab-panel { display: none; animation: pte-fadein 0.22s ease; }
.pte-tab-panel--active { display: block; }
@keyframes pte-fadein {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ────────────────────────────────────────────────────────────
   CARDS GRID
──────────────────────────────────────────────────────────── */
.pte-cards-grid {
	display: grid;
	grid-template-columns: repeat(var(--pte-cols, 3), 1fr);
	gap: 24px;
	align-items: stretch;
}
.pte-cards-grid.pte-single-card {
	grid-template-columns: 1fr;
	max-width: 100%;
}

/* ════════════════════════════════════════════════════════════
   MULTI-CARD LAYOUT
════════════════════════════════════════════════════════════ */
.pte-card {
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	border-radius: 16px;
	padding: 36px 32px;
	position: relative;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	font-family: 'Inter', sans-serif;
}
.pte-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 40px rgba(0,0,0,0.07);
}
.pte-card--featured { background-color: #111111; }

.pte-card-top  { display: flex; flex-direction: column; }
.pte-card-bottom { display: flex; flex-direction: column; flex: 1; }

/* Label */
.pte-label {
	font-family: 'JetBrains Mono', monospace;
	font-size: 13px;
	font-weight: 600;
	color: #1A1A1A;
	line-height: 1.4;
	margin-bottom: 12px;
	display: block;
}
.pte-card--featured .pte-label { color: #ffffff; }
.pte-label strong { font-weight: 700; }
.pte-label em     { font-style: italic; }

/* Price row – multi */
.pte-price-section { margin-bottom: 14px; }
.pte-price-row { display: flex; flex-direction: row; align-items: center; gap: 14px; }
.pte-price {
	font-family: 'Inter', sans-serif;
	font-size: 64px;
	font-weight: 900;
	color: #1A1A1A;
	line-height: 1;
	letter-spacing: -2px;
	flex-shrink: 0;
}
.pte-card--featured .pte-price { color: #ffffff; }
.pte-price sup, .pte-price sub { font-size: 0.45em; font-weight: 700; letter-spacing: 0; vertical-align: super; }
.pte-price sub { vertical-align: sub; }
.pte-price-right { display: flex; flex-direction: column; gap: 2px; }
.pte-price-desc {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 500;
	color: #1A1A1A;
	line-height: 1.4;
	max-width: 140px;
}
.pte-card--featured .pte-price-desc { color: rgba(255,255,255,0.9); }
.pte-billing {
	font-family: 'Inter', sans-serif;
	font-size: 11px;
	font-weight: 400;
	color: #888888;
	line-height: 1.4;
}
.pte-card--featured .pte-billing { color: rgba(255,255,255,0.65); }

/* Tagline – multi */
.pte-tagline {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: #555555;
	line-height: 1.55;
	margin: 0 0 18px 0;
}
.pte-card--featured .pte-tagline { color: rgba(255,255,255,0.72); }

/* Divider – multi */
.pte-divider {
	border: none;
	border-top: 1px solid #e5e5e5;
	width: 100%;
	margin-top: 24px;
	margin-bottom: 24px;
}
.pte-card--featured .pte-divider { border-top-color: rgba(255,255,255,0.15); }

/* Features – multi */
.pte-features-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-bottom: 28px;
	padding: 0;
	margin-left: 0;
	list-style: none;
}
.pte-feature-item { display: flex; flex-direction: row; align-items: flex-start; gap: 10px; }
.pte-feature-icon {
	color: #C8102E;
	width: 16px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 2px;
	line-height: 1;
}
.pte-card--featured .pte-feature-icon { color: #C8102E; }
.pte-check-svg { width: 16px; height: 16px; display: block; flex-shrink: 0; }
.pte-feature-icon i { font-size: 16px; line-height: 1; display: block; }
.pte-feature-icon svg:not(.pte-check-svg) { width: 16px; height: 16px; fill: currentColor; display: block; }
.pte-icon-svg-img { width: 16px; height: 16px; display: block; flex-shrink: 0; object-fit: contain; }
.pte-feature-text {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: #333333;
	line-height: 1.5;
	display: block;
}
.pte-card--featured .pte-feature-text { color: #ffffff; }
.pte-feature-text strong, .pte-feature-text b   { font-weight: 700; }
.pte-feature-text em, .pte-feature-text i       { font-style: italic; }
.pte-feature-text a                              { color: inherit; text-decoration: underline; }
.pte-feature-text u                              { text-decoration: underline; }
.pte-feature-text s, .pte-feature-text del      { text-decoration: line-through; }

/* Button wrap – pushes button to card bottom */
.pte-button-wrap { display: flex; justify-content: center; margin-top: auto; }
.pte-button-wrap--full { width: 100%; }

/* Button */
.pte-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-color: #C8102E;
	color: #FFFFFF;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.3px;
	text-decoration: none;
	border-radius: 6px;
	height: 52px;
	padding: 0 24px;
	cursor: pointer;
	border: none;
	outline: none;
	box-sizing: border-box;
	white-space: nowrap;
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
	-webkit-font-smoothing: antialiased;
}
.pte-button--full { width: 100%; }
.pte-button:hover, .pte-button:focus {
	background-color: #A00D24;
	color: #FFFFFF;
	text-decoration: none;
	transform: translateY(-1px);
	outline: none;
}
.pte-button:active { transform: translateY(0); }
.pte-button strong { font-weight: 700; }
.pte-button em     { font-style: italic; }

/* ════════════════════════════════════════════════════════════
   SINGLE-CARD LAYOUT — pixel-perfect Figma
   White card / 3-col price row: meta | price | tagline
════════════════════════════════════════════════════════════ */

.pte-card--single {
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	border-radius: 16px;
	padding: 36px 40px;
	font-family: 'Inter', sans-serif;
	transition: box-shadow 0.2s ease;
	width: 100%;
}
.pte-card--single:hover { box-shadow: 0 12px 40px rgba(0,0,0,0.06); }

/* Label */
.pte-label--single {
	font-family: 'JetBrains Mono', monospace;
	font-size: 15px;
	font-weight: 700;
	color: #1A1A1A;
	line-height: 1.4;
	margin-bottom: 20px;
	display: block;
}
.pte-label--single strong { font-weight: 800; }

/* 3-column price row */
.pte-price-section--single { margin-bottom: 0; }
.pte-price-row--single {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	gap: 0;
}

/* LEFT: meta lines */
.pte-price-meta-left {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 0 0 auto;
	padding-right: 24px;
	min-width: 110px;
}
.pte-price-meta-line1,
.pte-price-meta-line2 {
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #888888;
	line-height: 1.45;
}

/* CENTER: big price */
.pte-price--single {
	font-family: 'Inter', sans-serif;
	font-size: 72px;
	font-weight: 900;
	color: #1A1A1A;
	line-height: 1;
	letter-spacing: -3px;
	flex: 0 0 auto;
	padding-right: 32px;
}
.pte-price--single sup, .pte-price--single sub {
	font-size: 0.42em;
	font-weight: 700;
	letter-spacing: 0;
	vertical-align: super;
}
.pte-price--single sub { vertical-align: sub; }

/* RIGHT: tagline */
.pte-tagline--single {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: #555555;
	line-height: 1.6;
	flex: 1 1 auto;
	margin: 0;
}

/* Divider – single */
.pte-divider--single {
	border: none;
	border-top: 1px solid #e5e5e5;
	width: 100%;
	margin-top: 28px;
	margin-bottom: 28px;
}

/* Features – single: bigger text */
.pte-features-list--single {
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin-bottom: 28px;
	padding: 0;
	margin-left: 0;
	list-style: none;
}
.pte-feature-text--single {
	font-family: 'Inter', sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: #1A1A1A;
	line-height: 1.5;
	display: block;
}
.pte-feature-text--single strong, .pte-feature-text--single b { font-weight: 700; }
.pte-feature-text--single em, .pte-feature-text--single i     { font-style: italic; }

/* Pills block */
.pte-pills-block { margin-bottom: 24px; }

.pte-pills-label {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: #888888;
	line-height: 1.5;
	margin-bottom: 10px;
	display: block;
}

.pte-pills-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pte-pill {
	display: inline-flex;
	align-items: center;
	padding: 4px 14px;
	border-radius: 20px;
	border: 1.5px solid #CCCCCC;
	background: transparent;
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 500;
	color: #444444;
	line-height: 1.5;
	white-space: nowrap;
	transition: border-color 0.15s ease, color 0.15s ease;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — TABLET  769px – 1024px
   3-col grid → 2-col, price row stacks to 2-col
════════════════════════════════════════════════════════════ */
@media (min-width: 769px) and (max-width: 1024px) {

	/* Tab bar: scrollable pill strip */
	.pte-tabs-wrap { justify-content: stretch; padding: 0 4px; }
	.pte-tabs-bar {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		-ms-overflow-style: none;
		width: 100%;
		border-radius: 50px;
	}
	.pte-tabs-bar::-webkit-scrollbar { display: none; }
	.pte-tab-btn {
		flex: 0 0 auto;
		scroll-snap-align: start;
		padding: 9px 20px;
		font-size: 13px;
	}

	/* Multi-card grid: 3-col → 2-col for 3 cards, 1-col for others */
	.pte-cards-grid { grid-template-columns: repeat(2, 1fr); }
	/* When exactly 2 cards keep 2-col; when 1 card keep 1-col */
	.pte-cards-grid[style*="--pte-cols: 1"] { grid-template-columns: 1fr; }
	.pte-cards-grid[style*="--pte-cols: 2"] { grid-template-columns: repeat(2, 1fr); }
	/* 3+ cols collapse to 2 */
	.pte-cards-grid[style*="--pte-cols: 3"],
	.pte-cards-grid[style*="--pte-cols: 4"] { grid-template-columns: repeat(2, 1fr); }

	/* Multi-card price: shrink font */
	.pte-price { font-size: 52px; }

	/* Single-card: meta-left gets less min-width */
	.pte-price-meta-left { min-width: 90px; padding-right: 16px; }
	.pte-price--single { font-size: 58px; letter-spacing: -2px; padding-right: 20px; }
	.pte-tagline--single { font-size: 13px; }

	/* Single-card card padding */
	.pte-card--single { padding: 32px 32px; }
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE  ≤ 768px
   All grids → 1-col; single-card price row → vertical stack
════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

	/* Tab bar: full-width segmented */
	.pte-tabs-wrap { padding: 0; }
	.pte-tabs-bar {
		width: 100%;
		border-radius: 14px;
		padding: 3px;
		gap: 2px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.pte-tabs-bar::-webkit-scrollbar { display: none; }
	.pte-tab-btn {
		flex: 1 1 0;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		padding: 9px 10px;
		font-size: 12px;
		border-radius: 11px;
		letter-spacing: 0;
		text-align: center;
	}
	.pte-tab-btn.pte-tab-active { box-shadow: 0 1px 4px rgba(0,0,0,0.18); }

	/* Multi-card grid: always 1-col on mobile */
	.pte-cards-grid,
	.pte-cards-grid[style] { grid-template-columns: 1fr !important; max-width: 520px; margin: 0 auto; }
	.pte-cards-grid.pte-single-card { max-width: 100%; }

	/* Multi-card card */
	.pte-card { padding: 24px 20px; }
	.pte-price { font-size: 44px; letter-spacing: -1px; }

	/* Single-card: stack 3-col price row → 2 rows */
	.pte-card--single { padding: 24px 20px; }
	.pte-price-row--single {
		flex-wrap: wrap;
		align-items: flex-start;
		gap: 12px;
	}
	/* Row 1: meta-left + big price side by side */
	.pte-price-meta-left {
		flex: 0 0 auto;
		min-width: unset;
		padding-right: 16px;
		order: 1;
		align-self: center;
	}
	.pte-price--single {
		font-size: 52px;
		letter-spacing: -2px;
		padding-right: 0;
		order: 2;
		flex: 0 0 auto;
	}
	/* Row 2: tagline full width */
	.pte-tagline--single {
		font-size: 13px;
		line-height: 1.55;
		order: 3;
		flex: 0 0 100%;
	}

	.pte-label--single { font-size: 13px; margin-bottom: 16px; }
	.pte-feature-text--single { font-size: 14px; }
	.pte-pills-row { gap: 6px; }
	.pte-pill { font-size: 12px; padding: 3px 10px; }
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — SMALL MOBILE  ≤ 480px
════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
	.pte-tab-btn { flex: 0 0 auto; min-width: 80px; }
	.pte-tabs-bar { padding-left: 3px; }
	.pte-price { font-size: 38px; }
	.pte-price--single { font-size: 44px; letter-spacing: -1.5px; }
	.pte-card { padding: 20px 16px; }
	.pte-card--single { padding: 20px 16px; }
}