/* Tenancy Agreement Ireland generator. Prefix: tga-
 *
 * Written mobile first with min-width queries, unlike the older desktop-first page
 * styles in this theme. Inputs are 16px so iOS does not zoom on focus, and every
 * control clears a 44px tap target.
 *
 * Body is #0a0f1e site wide, so every section class below declares its own
 * background. A section with padding only renders invisible text on this site.
 *
 * Accent is Rentalize Core orange. #ea580c is used for fills and rules only;
 * anything carrying text uses #c2410c, per scripts/contrast-audit.js.
 */

.tga {
	--tga-ink: #0a0f1e;
	--tga-ink-2: #1b2440;
	--tga-text: #334155;
	--tga-muted: #5b6b7f;
	--tga-border: #e2e8f0;
	--tga-bg: #ffffff;
	--tga-bg-2: #f8fafc;
	--tga-bg-3: #f1f5f9;
	--tga-orange: #ea580c;
	--tga-orange-text: #c2410c;
	--tga-orange-deep: #9a3412;
	--tga-orange-pale: #fff7ed;
	--tga-red: #b91c1c;
	--tga-red-pale: #fef2f2;
	--tga-green-text: #047857;
	--tga-green-pale: #ecfdf5;
	--tga-radius: 16px;
	--tga-radius-sm: 10px;
	--tga-shadow: 0 1px 3px rgba(10, 15, 30, .06);
	--tga-shadow-lg: 0 10px 40px rgba(10, 15, 30, .10);
	--tga-font: 'DM Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-family: var(--tga-font);
	color: var(--tga-text);
	background: var(--tga-bg);
}

/* Avada / theme chrome reset, same block every custom template uses. */
.fusion-page-title-bar { display: none !important; }
#main { padding-top: 0 !important; }
#main > .fusion-row { max-width: 100% !important; padding: 0 !important; margin: 0 !important; }
#awb-ptb-heading, .avada-page-titlebar-wrapper { display: none !important; }
#content.full-width { padding: 0 !important; margin: 0 !important; }
#content .post-content { padding: 0 !important; margin: 0 !important; }
#content .post-content > .tga {
	width: 100vw; position: relative; left: 50%; right: 50%;
	margin-left: -50vw; margin-right: -50vw;
}

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

/* The wizard hides things with the `hidden` attribute. Any author `display` rule
 * beats the UA stylesheet's [hidden]{display:none}, so without this the Generate
 * button (display:inline-flex) stays visible on every step. */
.tga [hidden] { display: none !important; }

.tga-section { padding: 56px 5%; background: var(--tga-bg); }
.tga-container { max-width: 1100px; margin: 0 auto; }
.tga-container--narrow { max-width: 780px; }

.tga-h1 {
	font-size: clamp(32px, 8vw, 56px); font-weight: 800; line-height: 1.06;
	letter-spacing: -1.5px; margin: 0 0 16px; color: #fff;
}
.tga-h2 {
	font-size: clamp(25px, 5.5vw, 38px); font-weight: 700; line-height: 1.18;
	letter-spacing: -0.8px; margin: 0 0 20px; color: var(--tga-ink);
}
.tga-h3 { font-size: 19px; font-weight: 700; line-height: 1.3; margin: 28px 0 8px; color: var(--tga-ink); }
.tga-eyebrow {
	font-size: 12px; font-weight: 700; letter-spacing: 2.4px; text-transform: uppercase;
	margin: 0 0 14px; color: #fdba74;
}

/* ---------------------------------------------------------------- hero */

.tga-hero {
	position: relative; overflow: hidden; background: var(--tga-ink);
	padding-top: 90px; padding-bottom: 64px;
}
.tga-hero__grid {
	position: absolute; inset: 0; pointer-events: none;
	background-image:
		linear-gradient(rgba(234, 88, 12, .05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(234, 88, 12, .05) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 35%, #000 20%, transparent 72%);
	mask-image: radial-gradient(ellipse 70% 60% at 50% 35%, #000 20%, transparent 72%);
}
.tga-hero__glow {
	position: absolute; top: -160px; left: 50%; transform: translateX(-50%);
	width: 520px; height: 520px; border-radius: 50%; pointer-events: none;
	background: var(--tga-orange); filter: blur(130px); opacity: .16;
}
.tga-hero__inner { position: relative; z-index: 2; }
.tga-lede { font-size: 17px; line-height: 1.62; color: #cbd5e1; margin: 0 0 24px; max-width: 62ch; }
.tga-lede strong { color: #fff; font-weight: 600; }

.tga-hero__badges { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 28px; }
.tga-badge {
	display: inline-block; padding: 7px 13px; border-radius: 999px; font-size: 13px;
	background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); color: #e2e8f0;
}
.tga-badge--key { background: rgba(234, 88, 12, .16); border-color: rgba(234, 88, 12, .42); color: #fed7aa; }

.tga-hero__cta {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 52px; padding: 14px 32px; border-radius: var(--tga-radius-sm);
	background: linear-gradient(135deg, var(--tga-orange-text), var(--tga-orange-deep));
	color: #fff !important; font-weight: 700; font-size: 16px; text-decoration: none;
	box-shadow: 0 8px 24px rgba(234, 88, 12, .32); transition: transform .15s, box-shadow .15s;
}
.tga-hero__cta:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(234, 88, 12, .4); }

/* ---------------------------------------------------------------- answer first */

.tga-answer { background: var(--tga-bg-2); padding-top: 44px; padding-bottom: 44px; }
.tga-answer__card {
	background: var(--tga-bg); border: 1px solid var(--tga-border);
	border-radius: var(--tga-radius); padding: 28px 22px; box-shadow: var(--tga-shadow);
}
.tga-answer__h2 { font-size: clamp(21px, 4.6vw, 27px); font-weight: 700; margin: 0 0 14px; color: var(--tga-ink); letter-spacing: -0.5px; }
.tga-answer p { font-size: 16px; line-height: 1.68; margin: 0 0 14px; color: var(--tga-text); }
/* The citable answer. Sits first, states the entity and the direct answer, and is
 * the passage AI engines lift when they quote this page. */
.tga-answer__lead {
	font-size: 17px !important; line-height: 1.62 !important; color: var(--tga-ink) !important;
	padding: 16px 18px; margin-bottom: 18px !important;
	background: var(--tga-orange-pale); border-left: 3px solid var(--tga-orange);
	border-radius: 0 var(--tga-radius-sm) var(--tga-radius-sm) 0;
}
.tga-answer p:last-child { margin-bottom: 0; }
.tga-answer strong { color: var(--tga-ink); font-weight: 600; }

/* ---------------------------------------------------------------- wizard shell */

.tga-wizard-section { background: var(--tga-bg-2); padding-bottom: 64px; }
.tga-wizard {
	background: var(--tga-bg); border: 1px solid var(--tga-border);
	border-radius: var(--tga-radius); box-shadow: var(--tga-shadow-lg);
	/* `hidden` makes this a scroll container, which silently disables the sticky
	   action bar inside it. `clip` clips the rounded corners identically without
	   creating one. Older engines keep `hidden`: corners still clip, the bar just
	   scrolls normally, which is what it did before. */
	overflow: hidden; overflow: clip;
	/* Clears the fixed site header with room to spare. 84px was exact, and a long
	   upward scroll landed 3px behind the header because the header re-expands as
	   it settles. */
	max-width: 860px; margin: 0 auto; scroll-margin-top: 104px;
}

.tga-progress { background: var(--tga-bg-2); border-bottom: 1px solid var(--tga-border); padding: 14px 18px; }
.tga-progress__track { height: 6px; border-radius: 99px; background: var(--tga-border); overflow: hidden; }
.tga-progress__fill {
	height: 100%; width: 6.6%; border-radius: 99px;
	background: linear-gradient(90deg, var(--tga-orange), var(--tga-orange-text));
	transition: width .28s cubic-bezier(.4, 0, .2, 1);
}
.tga-progress__meta {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	flex-wrap: wrap;
	margin-top: 9px; font-size: 13px; font-weight: 600; color: var(--tga-muted);
}
/* The dots are the map of the form AND the way back to an earlier answer, so a
   phone gets them too. Fifteen fixed-width dots will not fit at 360px, so they
   share the row equally and drop to their own line under the step count. */
.tga-progress__dots { display: flex; gap: 4px; width: 100%; margin-top: 8px; }
.tga-dot {
	flex: 1 1 0; min-width: 0; height: 5px; border-radius: 99px;
	background: var(--tga-border); transition: background .2s, transform .2s;
	padding: 0; border: 0; appearance: none; -webkit-appearance: none;
	display: block; position: relative;
}
/* The bar stays 5px so the row keeps its height, but the hit area is what a
   thumb actually needs. */
.tga-dot::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 24px; transform: translateY(-50%); }
.tga-dot:disabled { cursor: default; }
.tga-dot.is-reachable { cursor: pointer; }
.tga-dot.is-reachable:hover { background: var(--tga-orange-text); transform: scaleY(1.6); }
.tga-dot:focus-visible { outline: 2px solid var(--tga-orange-text); outline-offset: 4px; }
.tga-dot.is-done { background: #fdba74; }
.tga-dot.is-current { background: var(--tga-orange-text); }
.tga-dot__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Errors are shown beside their fields, never repeated in a block at the top of
   the step. This element survives only to announce the count to a screen reader,
   so it is removed from the visual layout entirely. */
.tga-errors {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Inline message, sitting directly under the control that is wrong. */
.tga-inline-err {
	display: flex; align-items: flex-start; gap: 7px;
	margin: 7px 0 0; padding: 9px 11px;
	background: var(--tga-red-pale); border-left: 3px solid var(--tga-red);
	border-radius: 0 8px 8px 0;
	font-size: 13.5px; line-height: 1.5; color: #991b1b;
}
.tga-inline-err__mark {
	flex: 0 0 17px; width: 17px; height: 17px; margin-top: 1px; border-radius: 50%;
	background: var(--tga-red); color: #fff; font-size: 12px; font-weight: 700;
	display: flex; align-items: center; justify-content: center; line-height: 1;
}
.tga-field--invalid > .tga-label { color: var(--tga-red); }
.tga-field--invalid .tga-input,
.tga-field--invalid .tga-select,
.tga-field--invalid .tga-textarea { border-color: var(--tga-red); background: #fffafa; }
.tga-field--invalid .tga-opt { border-color: #fca5a5; }
.tga-input[aria-invalid="true"]:focus,
.tga-select[aria-invalid="true"]:focus,
.tga-textarea[aria-invalid="true"]:focus {
	border-color: var(--tga-red); box-shadow: 0 0 0 3px rgba(185, 28, 28, .14);
}

.tga-step { display: none; padding: 24px 18px 8px; }
.tga-step.is-active { display: block; }
.tga-step__h { font-size: 22px; font-weight: 700; line-height: 1.22; margin: 0 0 6px; color: var(--tga-ink); letter-spacing: -0.4px; }
/* The heading takes focus on every step change so the step is announced and the
   reading position moves. It is never in the tab order, so the browser's default
   focus box would just be a blue rectangle drawn around the title after every
   Continue. Suppress it; the announcement is the point, not the ring. */
.tga-step__h:focus { outline: none; }
.tga-step__sub { font-size: 14px; line-height: 1.55; color: var(--tga-muted); margin: 0 0 20px; }
.tga-step__sub a { color: var(--tga-orange-text); }

.tga-foot {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 16px 18px; background: var(--tga-bg-2); border-top: 1px solid var(--tga-border);
}
/* Several steps are taller than a phone screen, which leaves Continue below the
   fold and the wizard feeling stalled. The bar therefore floats at the bottom of
   the viewport while the card is on screen and its real position is out of view.
   `position: sticky` cannot do this here: html and body carry a site-wide
   `overflow-x: hidden`, which stops sticky working for anything inside them. So
   the state is toggled from JS instead, and a spacer holds the space it leaves. */
.tga-foot.is-floating {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
	max-width: 860px; margin: 0 auto;
	padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--tga-border);
	box-shadow: 0 -8px 24px rgba(10, 15, 30, .14);
	animation: tga-foot-in .18s ease-out;
}
@keyframes tga-foot-in { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .tga-foot.is-floating { animation: none; } }
.tga-foot-spacer { display: none; }
.tga-foot-spacer.is-shown { display: block; }
/* The theme's back-to-top button occupies the same bottom-right corner and
   clips the Continue label. This file only loads on this page, so hiding it
   while the bar is floating is scoped to the wizard. */
.tga-foot-floating #rf-back-to-top { opacity: 0; pointer-events: none; }
.tga-foot__right { display: flex; gap: 10px; }

/* ---------------------------------------------------------------- controls */

.tga-field { margin-bottom: 20px; }
.tga-label { display: block; font-size: 14px; font-weight: 600; color: var(--tga-ink); margin-bottom: 7px; line-height: 1.4; }
.tga-req { color: var(--tga-red); font-weight: 700; }
.tga-hint { font-size: 13px; line-height: 1.5; color: var(--tga-muted); margin: 7px 0 0; }
.tga-hint strong { color: var(--tga-text); }

.tga-input, .tga-select, .tga-textarea {
	width: 100%; min-height: 48px; padding: 12px 14px;
	border: 1.5px solid var(--tga-border); border-radius: var(--tga-radius-sm);
	font-family: var(--tga-font); font-size: 16px; color: var(--tga-ink);
	background: var(--tga-bg); outline: none;
	transition: border-color .15s, box-shadow .15s;
}
.tga-textarea { min-height: 84px; resize: vertical; line-height: 1.5; }
.tga-input:focus, .tga-select:focus, .tga-textarea:focus {
	border-color: var(--tga-orange-text); box-shadow: 0 0 0 3px rgba(234, 88, 12, .14);
}
.tga-input--narrow { max-width: 160px; }

.tga-select {
	appearance: none; -webkit-appearance: none; padding-right: 40px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'><path d='M1 1l6 6 6-6' fill='none' stroke='%235b6b7f' stroke-width='2' stroke-linecap='round'/></svg>");
	background-repeat: no-repeat; background-position: right 14px center;
}

.tga-input-wrap { position: relative; }
.tga-prefix {
	position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
	font-size: 16px; color: var(--tga-muted); pointer-events: none;
}
.tga-input--prefixed { padding-left: 32px; }

.tga-field--invalid .tga-input,
.tga-field--invalid .tga-select,
.tga-field--invalid .tga-textarea { border-color: var(--tga-red); }
.tga-field--invalid > .tga-label { color: var(--tga-red); }

.tga-row { display: grid; grid-template-columns: 1fr; gap: 0 16px; }

.tga-fieldset { border: 0; padding: 0; margin: 0 0 20px; }
.tga-fieldset legend { padding: 0; }

/* Native input kept in the tab order, visually replaced. */
.tga-opt {
	position: relative; display: flex; align-items: flex-start; gap: 11px;
	min-height: 48px; padding: 13px 14px; margin-bottom: 9px;
	border: 1.5px solid var(--tga-border); border-radius: var(--tga-radius-sm);
	background: var(--tga-bg); cursor: pointer; font-size: 15px; line-height: 1.45;
	color: var(--tga-text); transition: border-color .15s, background .15s;
}
.tga-opt input { position: absolute; opacity: 0; pointer-events: none; }
.tga-opt__box {
	flex: 0 0 20px; width: 20px; height: 20px; margin-top: 1px;
	border: 1.5px solid #94a3b8; border-radius: 6px; background: var(--tga-bg);
	display: flex; align-items: center; justify-content: center; transition: background .15s, border-color .15s;
}
.tga-opt__box--radio { border-radius: 50%; }
.tga-opt__box::after { content: ''; display: block; opacity: 0; transition: opacity .15s; }
.tga-opt__box:not(.tga-opt__box--radio)::after {
	width: 11px; height: 11px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'><path d='M13.5 1.5 5.6 11 2.5 7.4' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
}
.tga-opt__box--radio::after { width: 8px; height: 8px; border-radius: 50%; background: #fff; }
.tga-opt input:checked + .tga-opt__box { background: var(--tga-orange-text); border-color: var(--tga-orange-text); }
.tga-opt input:checked + .tga-opt__box::after { opacity: 1; }
.tga-opt input:focus-visible + .tga-opt__box { outline: 3px solid var(--tga-orange-text); outline-offset: 2px; }
.tga-opt:has(input:checked) { border-color: var(--tga-orange-text); background: var(--tga-orange-pale); }
.tga-opt strong { color: var(--tga-ink); font-weight: 600; }
.tga-opt__hint { display: inline-block; margin-top: 3px; font-size: 13px; color: var(--tga-muted); line-height: 1.45; }

.tga-pill { position: relative; display: inline-flex; }
.tga-pill input { position: absolute; opacity: 0; pointer-events: none; }
.tga-pill span {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 44px; padding: 10px 18px; border: 1.5px solid var(--tga-border);
	border-radius: 999px; font-size: 15px; cursor: pointer; background: var(--tga-bg);
	color: var(--tga-text); transition: all .15s;
}
.tga-pill input:checked + span { background: var(--tga-orange-text); border-color: var(--tga-orange-text); color: #fff; font-weight: 600; }
.tga-pill input:focus-visible + span { outline: 3px solid var(--tga-orange-text); outline-offset: 2px; }

.tga-util {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
	padding: 12px 0; border-bottom: 1px solid var(--tga-border);
}
.tga-util__name { font-size: 15px; font-weight: 600; color: var(--tga-ink); }
.tga-util__opts { display: flex; gap: 8px; }

/* ---------------------------------------------------------------- buttons */

.tga-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 13px 24px; border: none; border-radius: var(--tga-radius-sm);
	font-family: var(--tga-font); font-size: 16px; font-weight: 600; line-height: 1;
	cursor: pointer; transition: transform .15s, box-shadow .15s, background .15s;
}
.tga-btn--primary {
	background: linear-gradient(135deg, var(--tga-orange-text), var(--tga-orange-deep));
	color: #fff !important; box-shadow: 0 6px 18px rgba(234, 88, 12, .28); text-decoration: none;
}
.tga-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 9px 24px rgba(234, 88, 12, .36); }
.tga-btn--ghost { background: transparent; color: var(--tga-muted); border: 1.5px solid var(--tga-border); }
.tga-btn--ghost:hover { color: var(--tga-ink); border-color: var(--tga-ink); }
.tga-btn--sm { min-height: 44px; padding: 10px 18px; font-size: 15px; }
.tga-btn--wide { width: 100%; }
.tga-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.tga-btn.is-busy { opacity: .6; pointer-events: none; }

.tga-link-btn {
	background: none; border: 0; padding: 6px 2px; min-height: 44px;
	font-family: var(--tga-font); font-size: 14px; font-weight: 600;
	color: var(--tga-orange-text); cursor: pointer; text-decoration: underline;
}

/* ---------------------------------------------------------------- callouts */

.tga-callout {
	border-left: 3px solid var(--tga-orange); background: var(--tga-orange-pale);
	border-radius: 0 var(--tga-radius-sm) var(--tga-radius-sm) 0;
	padding: 15px 17px; margin: 0 0 22px;
}
.tga-callout p { margin: 0 0 9px; font-size: 14.5px; line-height: 1.55; color: var(--tga-text); }
.tga-callout p:last-child { margin-bottom: 0; }
.tga-callout strong { color: var(--tga-ink); font-weight: 600; }
.tga-callout a { color: var(--tga-orange-text); font-weight: 600; }
.tga-callout--warn { border-left-color: var(--tga-red); background: var(--tga-red-pale); }
.tga-callout--warn strong { color: #7f1d1d; }

/* ---------------------------------------------------------------- repeat rows */

.tga-repeat__row { padding: 18px 0 4px; border-top: 1px solid var(--tga-border); }
.tga-repeat__row:first-child { border-top: 0; padding-top: 0; }
.tga-repeat__head {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	font-size: 13px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
	color: var(--tga-muted); margin-bottom: 12px;
}
.tga-repeat--compact .tga-repeat__row { padding-top: 12px; }
.tga-inv-row { display: flex; flex-direction: column; gap: 0; }

/* ---------------------------------------------------------------- rent panel */

.tga-rent-panel { display: none; margin: 24px 0; }
.tga-rent-panel.is-shown { display: block; }

.tga-verdict { border-radius: var(--tga-radius-sm); padding: 15px 17px; margin-bottom: 14px; }
.tga-verdict__tag {
	display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 1.4px;
	text-transform: uppercase; margin-bottom: 7px;
}
.tga-verdict p { margin: 0; font-size: 14.5px; line-height: 1.55; }
.tga-verdict--market { background: var(--tga-green-pale); border: 1px solid #a7f3d0; }
.tga-verdict--market .tga-verdict__tag { color: var(--tga-green-text); }
.tga-verdict--market p { color: #065f46; }
.tga-verdict--capped { background: var(--tga-orange-pale); border: 1px solid #fed7aa; }
.tga-verdict--capped .tga-verdict__tag { color: var(--tga-orange-text); }
.tga-verdict--capped p { color: #7c2d12; }
.tga-verdict--blocked { background: var(--tga-red-pale); border: 1px solid #fecaca; }
.tga-verdict--blocked .tga-verdict__tag { color: var(--tga-red); }
.tga-verdict--blocked p { color: #7f1d1d; }

.tga-working {
	background: var(--tga-ink); border-radius: var(--tga-radius); padding: 20px 18px; color: #e2e8f0;
}
.tga-working h4 {
	margin: 0 0 14px; font-size: 12px; font-weight: 700; letter-spacing: 1.6px;
	text-transform: uppercase; color: #fdba74;
}
.tga-working dl { margin: 0; }
.tga-working__row {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px;
	padding: 8px 0; border-bottom: 1px solid rgba(255, 255, 255, .1); font-size: 14.5px;
}
.tga-working__row dt { color: #94a3b8; margin: 0; }
.tga-working__row dd { margin: 0; color: #fff; font-weight: 600; text-align: right; }
.tga-working__row dd em { font-style: normal; color: #fdba74; font-weight: 700; font-size: 12px; letter-spacing: .8px; text-transform: uppercase; }
.tga-working__out {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px;
	margin-top: 16px; padding-top: 16px; border-top: 2px solid rgba(255, 255, 255, .18);
}
.tga-working__out span { font-size: 14px; color: #cbd5e1; }
.tga-working__out strong { font-size: 30px; font-weight: 800; color: #fff; letter-spacing: -0.8px; }
.tga-working__note { margin: 14px 0 0; font-size: 13px; line-height: 1.55; color: #94a3b8; }
.tga-working__note a { color: #fdba74; }

.tga-comparables { border-top: 1px solid var(--tga-border); padding-top: 22px; margin-top: 4px; }

/* ---------------------------------------------------------------- review step */

.tga-summary { margin-bottom: 26px; }
.tga-sum {
	margin: 0; border: 1px solid var(--tga-border); border-radius: var(--tga-radius); overflow: hidden;
}
.tga-sum > div {
	display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 12px 15px;
	border-bottom: 1px solid var(--tga-border); background: var(--tga-bg);
}
.tga-sum > div:nth-child(odd) { background: var(--tga-bg-2); }
.tga-sum > div:last-child { border-bottom: 0; }
.tga-sum dt { margin: 0; flex: 0 0 100%; font-size: 12px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--tga-muted); }
.tga-sum dd { margin: 0; font-size: 15.5px; font-weight: 600; color: var(--tga-ink); }

.tga-downloads { border-top: 1px solid var(--tga-border); padding-top: 22px; }
.tga-downloads.is-loading { opacity: .55; }
.tga-downloads__lead { margin: 0 0 14px; font-size: 15px; color: var(--tga-text); }
/* A quiet divider between the one-click route and the individual files, so the
   zip reads as the main action and the four documents as the alternative. */
.tga-downloads__or {
	display: flex; align-items: center; gap: 12px;
	margin: 18px 0 12px; font-size: 12.5px; font-weight: 600; color: var(--tga-muted);
	text-transform: uppercase; letter-spacing: .6px;
}
.tga-downloads__or::before, .tga-downloads__or::after {
	content: ""; flex: 1; height: 1px; background: var(--tga-border);
}
.tga-downloads__grid { display: grid; grid-template-columns: 1fr; gap: 11px; margin-bottom: 4px; }
/* These are buttons that download a file, and they were read as a passive list
   because nothing in them said so. The icon and the PDF tag are the affordance. */
.tga-doc {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	width: 100%; min-height: 48px; padding: 14px 15px; text-align: left; cursor: pointer;
	background: var(--tga-bg); border: 1.5px solid var(--tga-border);
	border-radius: var(--tga-radius-sm); font-family: var(--tga-font);
	transition: border-color .15s, background .15s, transform .15s, box-shadow .15s;
}
.tga-doc__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tga-doc__go {
	display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto;
	padding: 7px 11px; border-radius: 999px;
	background: var(--tga-bg-3); color: var(--tga-orange-text);
	font-size: 12px; font-weight: 700; letter-spacing: .3px;
	transition: background .15s, color .15s;
}
.tga-doc:hover, .tga-doc:focus-visible {
	border-color: var(--tga-orange-text); transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(10, 15, 30, .08);
}
.tga-doc:hover .tga-doc__go, .tga-doc:focus-visible .tga-doc__go {
	background: var(--tga-orange-text); color: #fff;
}
.tga-doc:focus-visible { outline: 2px solid var(--tga-orange-text); outline-offset: 2px; }
.tga-doc.is-busy { opacity: .55; pointer-events: none; }
.tga-doc__name { font-size: 15.5px; font-weight: 700; color: var(--tga-ink); }
.tga-doc__meta { font-size: 13px; color: var(--tga-muted); line-height: 1.45; }
.tga-doc--key { border-color: #fed7aa; background: var(--tga-orange-pale); }
.tga-doc--key .tga-doc__meta { color: var(--tga-orange-text); font-weight: 600; }
.tga-doc--key .tga-doc__go { background: #fed7aa; }
/* Shown when an answer changes after the documents were built. */
.tga-stale {
	display: none; margin: 0 0 14px; padding: 12px 14px; font-size: 14px;
	background: var(--tga-orange-pale); border-left: 3px solid var(--tga-orange);
	border-radius: 0 var(--tga-radius-sm) var(--tga-radius-sm) 0; color: var(--tga-ink);
}
.tga-stale.is-shown { display: block; }
.tga-downloads__note { margin: 12px 0 0; font-size: 13px; color: var(--tga-muted); }
.tga-downloads.is-failed .tga-downloads__note { color: var(--tga-red); }

/* Always-on autosave bar, sits above the step controls on every step. */
.tga-draft { padding: 14px 18px; background: var(--tga-bg-2); border-top: 1px solid var(--tga-border); }
.tga-draft__lead {
	display: flex; align-items: flex-start; gap: 9px;
	margin: 0 0 8px; font-size: 13px; line-height: 1.55; color: var(--tga-text);
}
.tga-draft__dot {
	flex: 0 0 8px; width: 8px; height: 8px; margin-top: 6px; border-radius: 50%;
	background: var(--tga-green-text);
}
.tga-draft__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.tga-draft__note { font-size: 12.5px; color: var(--tga-muted); }
.tga-draft__note.is-ok { color: var(--tga-green-text); font-weight: 600; }
.tga-draft__note.is-fail { color: var(--tga-red); font-weight: 600; }
.tga-draft__warn { margin: 8px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--tga-muted); }

/* Banner shown when a previous session is brought back. */
.tga-restored {
	display: none; padding: 13px 18px; font-size: 13.5px; line-height: 1.55;
	background: var(--tga-green-pale); border-bottom: 1px solid #a7f3d0; color: #065f46;
}
.tga-restored.is-shown { display: block; }
.tga-restored .tga-link-btn { color: #065f46; font-size: 13.5px; min-height: 0; padding: 0; }

/* Terms and conditions. */
.tga-legal__meta { font-size: 12.5px; color: var(--tga-muted); margin: 0 0 20px; }
.tga-terms { margin: 0; padding-left: 20px; }
.tga-terms > li { margin: 0 0 20px; font-size: 13.5px; line-height: 1.64; color: var(--tga-muted); }
.tga-terms > li::marker { color: var(--tga-ink); font-weight: 700; }
.tga-terms .tga-terms__h {
	margin: 0 0 6px; font-size: 15px; font-weight: 700; color: var(--tga-ink); line-height: 1.35;
}
.tga-terms p { margin: 0 0 9px; font-size: 13.5px; line-height: 1.64; color: var(--tga-muted); }
.tga-terms p:last-child { margin-bottom: 0; }
.tga-terms ul { margin: 0 0 9px; padding-left: 18px; }
.tga-terms ul li { margin: 0 0 5px; }
.tga-terms strong { color: var(--tga-text); }

.tga-notice__ol { margin: 0; padding-left: 19px; }
.tga-notice__ol li { margin: 0 0 8px; font-size: 13px; line-height: 1.58; color: #7f1d1d; }
.tga-notice__more { margin: 10px 0 0; font-size: 13px; }
.tga-notice__more a { color: #991b1b; font-weight: 600; }

/* ---------------------------------------------------------------- what you get */

.tga-what { background: var(--tga-bg); }
.tga-cards { display: grid; grid-template-columns: 1fr; gap: 16px; }
.tga-card {
	background: var(--tga-bg-2); border: 1px solid var(--tga-border);
	border-radius: var(--tga-radius); padding: 24px 20px;
}
.tga-card h3 { margin: 0 0 9px; font-size: 18px; font-weight: 700; color: var(--tga-ink); }
.tga-card p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--tga-text); }
.tga-card--key { background: var(--tga-orange-pale); border-color: #fed7aa; }

/* ---------------------------------------------------------------- faq */

.tga-faq { background: var(--tga-bg-2); }
.tga-faq__item {
	background: var(--tga-bg); border: 1px solid var(--tga-border);
	border-radius: var(--tga-radius-sm); margin-bottom: 11px; overflow: hidden;
}
.tga-faq__item summary {
	list-style: none; cursor: pointer; padding: 16px 46px 16px 18px; position: relative; min-height: 48px;
}
.tga-faq__item summary::-webkit-details-marker { display: none; }
.tga-faq__item summary h3 { margin: 0; font-size: 16.5px; font-weight: 600; color: var(--tga-ink); line-height: 1.4; }
.tga-faq__item summary::after {
	content: '+'; position: absolute; right: 18px; top: 50%; transform: translateY(-50%);
	font-size: 22px; font-weight: 400; color: var(--tga-orange-text); line-height: 1;
}
.tga-faq__item[open] summary::after { content: '\2013'; }
.tga-faq__item:focus-within summary { outline: 3px solid var(--tga-orange-text); outline-offset: -3px; }
.tga-faq__a { padding: 0 18px 17px; }
.tga-faq__a p { margin: 0; font-size: 15.5px; line-height: 1.65; color: var(--tga-text); }
.tga-faq__a strong { color: var(--tga-ink); font-weight: 600; }
.tga-faq__a a { color: var(--tga-orange-text); }

/* ---------------------------------------------------------------- more, cta, legal */

.tga-more { background: var(--tga-bg); }
.tga-more__grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
.tga-more__grid a {
	display: flex; align-items: center; min-height: 48px; padding: 13px 16px;
	background: var(--tga-bg-2); border: 1px solid var(--tga-border);
	border-radius: var(--tga-radius-sm); color: var(--tga-ink); text-decoration: none;
	font-size: 15px; font-weight: 600; transition: border-color .15s, transform .15s;
}
.tga-more__grid a:hover { border-color: var(--tga-orange-text); transform: translateY(-1px); }

.tga-cta { background: var(--tga-ink); text-align: center; }
.tga-cta .tga-h2 { color: #fff; }
.tga-cta p { font-size: 16.5px; line-height: 1.6; color: #cbd5e1; margin: 0 0 24px; }

.tga-legal { background: var(--tga-bg-3); padding: 40px 5%; scroll-margin-top: 80px; }
.tga-legal__h {
	font-size: 19px; font-weight: 700; color: var(--tga-ink); margin: 0 0 14px; letter-spacing: -0.3px;
}
.tga-legal p { margin: 0 0 12px; font-size: 13.5px; line-height: 1.64; color: var(--tga-muted); }
.tga-legal strong { color: var(--tga-text); }
.tga-legal__list { margin: 0 0 12px; padding-left: 18px; }
.tga-legal__list li { margin: 0 0 9px; font-size: 13.5px; line-height: 1.64; color: var(--tga-muted); }
.tga-legal__foot { margin: 0; font-style: italic; }
.tga-legal a { color: var(--tga-orange-text); }

/* Legal notice inside the wizard, on the review step. */
.tga-notice {
	background: var(--tga-red-pale); border: 1px solid #fecaca;
	border-left: 4px solid var(--tga-red); border-radius: 0 var(--tga-radius-sm) var(--tga-radius-sm) 0;
	padding: 18px 18px 16px; margin: 0 0 20px;
}
.tga-notice__h { margin: 0 0 10px; font-size: 15.5px; font-weight: 700; color: #7f1d1d; }
.tga-notice p { margin: 0 0 10px; font-size: 13.5px; line-height: 1.6; color: #7f1d1d; }
.tga-notice ul { margin: 0; padding-left: 18px; }
.tga-notice li { margin: 0 0 7px; font-size: 13px; line-height: 1.58; color: #7f1d1d; }
.tga-notice strong { color: #641515; font-weight: 700; }
.tga-notice a { color: #991b1b; }

.tga-accept { margin-bottom: 22px; }
.tga-opt--accept { border-color: #fca5a5; background: #fff; align-items: flex-start; }
.tga-opt--accept:has(input:checked) { border-color: var(--tga-green-text); background: var(--tga-green-pale); }
.tga-opt--accept input:checked + .tga-opt__box { background: var(--tga-green-text); border-color: var(--tga-green-text); }

.tga-badge--warn { background: rgba(185, 28, 28, .22); border-color: rgba(248, 113, 113, .5); color: #fecaca; }
.tga-hero__disclaimer {
	margin: 18px 0 0; max-width: 62ch; font-size: 13.5px; line-height: 1.6; color: #94a3b8;
}
.tga-hero__disclaimer strong { color: #fecaca; }
.tga-hero__disclaimer a { color: #fdba74; }

/* ================================================================ */
/* 576px and up                                                     */
/* ================================================================ */
@media (min-width: 576px) {
	.tga-section { padding: 68px 6%; }
	.tga-row { grid-template-columns: 1fr 1fr; }
	.tga-step { padding: 30px 26px 12px; }
	.tga-progress, .tga-foot { padding-left: 26px; padding-right: 26px; }
	.tga-answer__card { padding: 32px 30px; }
	.tga-downloads__grid { grid-template-columns: 1fr 1fr; }
	.tga-more__grid { grid-template-columns: 1fr 1fr; }
	.tga-sum dt { flex: 0 0 210px; }
	.tga-sum dd { flex: 1; text-align: right; }
	.tga-btn--wide { width: auto; min-width: 280px; }
}

/* ================================================================ */
/* 768px and up                                                     */
/* ================================================================ */
@media (min-width: 768px) {
	.tga-section { padding: 84px 6%; }
	.tga-hero { padding-top: 118px; padding-bottom: 88px; }
	.tga-cards { grid-template-columns: 1fr 1fr; }
	.tga-step { padding: 38px 36px 16px; }
	.tga-progress, .tga-foot { padding-left: 36px; padding-right: 36px; }
	.tga-working { padding: 26px 28px; }
	.tga-row--inv { grid-template-columns: 1fr 1fr 140px 1fr; }
	.tga-progress__dots { flex: 0 0 auto; width: auto; gap: 5px; margin-top: 0; }
	.tga-dot { flex: 0 0 22px; }
}

/* ================================================================ */
/* 992px and up                                                     */
/* ================================================================ */
@media (min-width: 992px) {
	.tga-section { padding: 96px 6%; }
	.tga-hero { padding-top: 138px; padding-bottom: 100px; }
	.tga-cards { grid-template-columns: repeat(4, 1fr); }
	.tga-more__grid { grid-template-columns: repeat(4, 1fr); }
	.tga-lede { font-size: 18.5px; }
}

/* ---------------------------------------------------------------- a11y */

@media (prefers-reduced-motion: reduce) {
	.tga * { animation: none !important; transition: none !important; }
	.tga-progress__fill { transition: none; }
}

.tga a:focus-visible,
.tga button:focus-visible,
.tga input:focus-visible,
.tga select:focus-visible,
.tga textarea:focus-visible,
.tga summary:focus-visible {
	outline: 3px solid var(--tga-orange-text); outline-offset: 2px;
}

@media (forced-colors: active) {
	.tga-opt input:checked + .tga-opt__box { background: Highlight; border-color: Highlight; }
	.tga-btn--primary { border: 2px solid ButtonText; }
}

@media print {
	.tga-hero, .tga-cta, .tga-more, .tga-foot, .tga-progress, .tga-downloads { display: none !important; }
}