/* Layout: containers, page shells, shared components (buttons, ads, visibility helpers). */

.tmp-container {
	width: 100%;
	max-width: var(--tmp-container);
	margin: 0 auto;
	padding: 0 var(--tmp-gutter);
}
@media (min-width: 600px) and (max-width: 1023px) {
	.tmp-container { width: 92%; padding: 0; }
}

.tmp-main { display: block; min-height: 50vh; padding: 24px 0 48px; }
.tmp-main:focus { outline: none; }

.tmp-sentinel { position: absolute; top: 120px; left: 0; width: 1px; height: 1px; }

.tmp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: 999px;
	background: var(--tmp-accent-orange);
	color: var(--tmp-ink);
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}
.tmp-btn:hover { background: #ff7a22; color: var(--tmp-ink); }

.tmp-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: var(--tmp-ink);
	cursor: pointer;
}
.tmp-icon-btn:hover { background: var(--tmp-surface); }

/* Ads: label + reserved space; device-limited slots hidden by breakpoint. */
.tmp-ad { margin: 24px auto; text-align: center; overflow: hidden; }
.tmp-ad__label { display: block; margin-bottom: 4px; color: var(--tmp-muted); font-size: 12px; letter-spacing: .04em; }
@media (max-width: 599px) { .tmp-ad--tablet-up { display: none; } }
@media (max-width: 1023px) { .tmp-ad--desktop { display: none; } }

/* Device visibility helpers (ticker). */
.tmp-show-desktop, .tmp-show-tablet, .tmp-show-mobile { display: none; }
@media (min-width: 1024px) { .tmp-show-desktop { display: block; } }
@media (min-width: 600px) and (max-width: 1023px) { .tmp-show-tablet { display: block; } }
@media (max-width: 599px) { .tmp-show-mobile { display: block; } }

.tmp-ticker-wrap { background: var(--tmp-card); border-bottom: 1px solid var(--tmp-border); }
.tmp-ticker { overflow: hidden; }

/* Search form */
.tmp-search-form { display: flex; gap: 8px; }
.tmp-search-form input[type="search"] {
	flex: 1;
	min-width: 0;
	min-height: 44px;
	padding: 0 16px;
	border: 1px solid var(--tmp-border);
	border-radius: 999px;
	background: var(--tmp-card);
}
.tmp-search-form .tmp-btn { width: 44px; padding: 0; }

/* Category chips (phones and tablets only). */
.tmp-chips { background: var(--tmp-card); border-bottom: 1px solid var(--tmp-border); }
.tmp-chips__list {
	display: flex;
	gap: 8px;
	margin: 0;
	padding: 10px var(--tmp-gutter);
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
}
.tmp-chips__list::-webkit-scrollbar { display: none; }
.tmp-chips__list li { scroll-snap-align: start; flex: none; }
.tmp-chip {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid var(--tmp-border);
	border-radius: 999px;
	background: var(--tmp-surface);
	color: var(--tmp-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
}
.tmp-chip[aria-current] { background: var(--tmp-ink); border-color: var(--tmp-ink); color: #fff; }
@media (min-width: 1024px) { .tmp-chips { display: none; } }

/* Social icons */
.tmp-social { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.tmp-social a { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; color: inherit; }
.tmp-social a:hover { background: rgba(127, 127, 127, .15); }

/* Language switcher */
.tmp-lang-switcher { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; }
.tmp-lang-switcher a { color: inherit; font-weight: 600; text-decoration: none; }
.tmp-lang-switcher a[aria-current] { text-decoration: underline; text-decoration-color: var(--tmp-accent-orange); text-decoration-thickness: 2px; }
.tmp-lang-switcher--pill a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	padding: 0 10px;
	border: 1px solid var(--tmp-border);
	border-radius: 999px;
	font-size: 14px;
}
.tmp-lang-switcher--pill a[aria-current] { display: none; }

/* Pages (About, Contact, policies, calculators) */
.tmp-page-header { padding: 24px 0 8px; }
.tmp-page-header .tmp-container { max-width: calc(var(--tmp-reading) + 2 * var(--tmp-gutter)); }
.tmp-page-header__title { margin: 0 0 4px; }
.tmp-page__updated { margin: 0; color: var(--tmp-muted); font-size: 15px; }
.tmp-page { max-width: var(--tmp-reading); margin: 16px auto 0; padding: 24px var(--tmp-gutter); background: var(--tmp-card); border-radius: var(--tmp-radius); }
@media (min-width: 600px) { .tmp-page { padding: 32px 40px; border: 1px solid var(--tmp-border); } }
.tmp-page .tmp-content { margin-top: 0; }
.tmp-page--calc { max-width: 960px; padding: 0; background: none; border: 0; }
.tmp-page--calc + .tmp-page-header .tmp-container, .page-template-calculator .tmp-page-header .tmp-container { max-width: calc(960px + 2 * var(--tmp-gutter)); }
.tmp-calc-card { padding: 20px var(--tmp-gutter); border: 1px solid var(--tmp-border); border-radius: var(--tmp-radius); background: var(--tmp-card); overflow-x: auto; }
@media (min-width: 600px) { .tmp-calc-card { padding: 32px; } }
.tmp-calc-card input, .tmp-calc-card select { max-width: 100%; }

.tmp-authors { margin-top: 32px; }
.tmp-authors__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px; }
.tmp-author-mini { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 16px; border: 1px solid var(--tmp-border); border-radius: var(--tmp-radius); color: var(--tmp-ink); text-align: center; text-decoration: none; }
.tmp-author-mini img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.tmp-author-mini__name { font-weight: 700; line-height: 1.4; }
.tmp-author-mini__role { color: var(--tmp-muted); font-size: 14px; line-height: 1.4; }
.tmp-trust-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.tmp-trust-links a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid var(--tmp-border); border-radius: 999px; color: var(--tmp-ink); font-size: 15px; font-weight: 600; text-decoration: none; }
