/*
Theme Name: DomainWolf
Theme URI: https://domainwolf.com
Author: Riyad Al-Bandi
Description: Block theme for DomainWolf, the transparent domain appraisal tool. Built to pair with the DomainWolf plugin.
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.9.0
License: GPL-2.0-or-later
Text Domain: domainwolf-theme
Tags: block-patterns, full-site-editing, one-column, wide-blocks, rtl-language-support
*/

:root {
	--dwt-gutter: clamp(1.1rem, 4vw, 2rem);
	--dwt-wide: 1180px;
	--dwt-radius: 14px;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body { -webkit-font-smoothing: antialiased; }

/* Footer stays at the bottom on short pages: the page is a full-height column
   and the main area grows to fill the space. */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
}
.admin-bar .wp-site-blocks { min-height: calc(100dvh - 32px); }
@media (max-width: 782px) { .admin-bar .wp-site-blocks { min-height: calc(100dvh - 46px); } }
.wp-site-blocks > main,
.wp-site-blocks > .dwt-main { flex: 1 0 auto; width: 100%; }
.wp-site-blocks > footer { margin-top: auto; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.dwt-main > * { margin-block-start: 0; }

/* Anchor targets clear the sticky header. */
[id] { scroll-margin-top: 90px; }

/* Header ----------------------------------------------------------------- */

.dwt-site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(255, 255, 255, 0.92);
	backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.admin-bar .dwt-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .dwt-site-header { top: 46px; } }

.dwt-header {
	max-width: var(--dwt-wide);
	margin-inline: auto;
	padding: 14px var(--dwt-gutter);
	gap: 1rem;
}
.dwt-header-right { gap: clamp(0.75rem, 2.5vw, 2rem); }

.dwt-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: var(--wp--preset--color--pine);
	font: 700 1.3rem/1 var(--wp--preset--font-family--display);
	letter-spacing: -0.02em;
}
.dwt-brand b { font-weight: 800; }
.dwt-brand img { display: block; }
.dwt-brand-light { color: var(--wp--preset--color--frost); }

.dwt-nav a { text-decoration: none; }

/* Free Tools dropdown */
.dwt-nav .wp-block-navigation__submenu-container {
	min-width: 230px;
	padding: 8px !important;
	border: 1px solid var(--wp--preset--color--line) !important;
	border-radius: 12px;
	background: var(--wp--preset--color--paper) !important;
	box-shadow: 0 18px 40px -18px rgba(24, 58, 55, 0.35);
}
.dwt-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	padding: 9px 12px !important;
	border-radius: 8px;
	font-weight: 500;
	white-space: nowrap;
}
.dwt-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--frost);
	text-decoration: none;
}
.dwt-nav .wp-block-navigation-submenu__toggle { color: inherit; }
/* Mobile menu: show the tools as an indented list. */
.dwt-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	border: 0 !important;
	box-shadow: none;
	padding: 0 0 0 12px !important;
	min-width: 0;
}
.dwt-nav a:hover { text-decoration: underline; text-underline-offset: 4px; }
.dwt-header-cta .wp-block-button__link { padding: 0.55rem 1.1rem; font-size: 0.95rem; }

@media (max-width: 600px) {
	.dwt-header-cta { display: none; }
	.dwt-brand span { font-size: 1.15rem; }
}

/* Sections --------------------------------------------------------------- */

.dwt-section { padding-block: var(--wp--preset--spacing--60); }
.dwt-inner {
	max-width: var(--dwt-wide);
	margin-inline: auto;
	padding-inline: var(--dwt-gutter);
}
.dwt-narrow { max-width: calc(820px + 2 * var(--dwt-gutter)); }

.dwt-section-title {
	margin-block: 0 var(--wp--preset--spacing--50);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 800;
	letter-spacing: -0.03em;
}

.dwt-eyebrow {
	margin: 0 0 1rem;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lichen);
}
.dwt-lead {
	max-width: 62ch;
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--pine-soft);
}

.dwt-dark {
	background: var(--wp--preset--color--pine);
	color: var(--wp--preset--color--frost);
}
.dwt-dark .dwt-section-title,
.dwt-dark h2,
.dwt-dark h3 { color: var(--wp--preset--color--paper); }
.dwt-dark p { color: #c9d7d1; }
.dwt-dark a:not(.wp-element-button) { color: var(--wp--preset--color--amber-soft); }

/* Hero ------------------------------------------------------------------- */

.dwt-hero {
	position: relative;
	overflow: hidden;
	background: var(--wp--preset--color--frost);
	padding-block: clamp(3rem, 8vw, 6.5rem) var(--wp--preset--spacing--60);
}
/* Faint oversized wolf watching from the edge. */
.dwt-hero::after {
	content: "";
	position: absolute;
	inset-inline-end: -120px;
	top: -60px;
	width: 520px;
	height: 520px;
	background: url("assets/img/wolf-mark.svg") no-repeat center / contain;
	opacity: 0.05;
	pointer-events: none;
}
[dir="rtl"] .dwt-hero::after { transform: scaleX(-1); }
.dwt-hero .dwt-inner { position: relative; z-index: 1; }

.dwt-hero-title {
	margin: 0 0 1.25rem;
	max-width: 15ch;
	font-size: var(--wp--preset--font-size--hero);
	font-weight: 800;
	line-height: 0.98;
	letter-spacing: -0.04em;
}
.dwt-hero-title em {
	font-style: normal;
	background: linear-gradient(transparent 62%, var(--wp--preset--color--amber) 62%, var(--wp--preset--color--amber) 90%, transparent 90%);
}
.dwt-hero .dwt-lead { margin-bottom: 2.25rem; }

/* Give the plugin's tool room inside the hero. */
.dwt-hero .dw-app { max-width: none; margin: 0; }
.dwt-hero .dw-search { box-shadow: 0 10px 30px -18px rgba(24, 58, 55, 0.45); }

.dwt-checks {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin: 1.75rem 0 0;
	padding: 0;
	list-style: none;
	font-size: 0.92rem;
	color: var(--wp--preset--color--pine-soft);
}
.dwt-checks li { display: inline-flex; align-items: center; gap: 8px; }
.dwt-checks li::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 2px;
	background: var(--wp--preset--color--amber);
}
/* Once a report is on screen, the checklist is noise. */
.dwt-hero:has(.dw-report) .dwt-checks { display: none; }

/* Shown only if the DomainWolf plugin is inactive. */
.dwt-unavailable {
	padding: 1rem 1.25rem;
	border-inline-start: 4px solid var(--wp--preset--color--amber);
	background: var(--wp--preset--color--paper);
	border-radius: 0 8px 8px 0;
}

/* How it works ----------------------------------------------------------- */

.dwt-steps-grid { gap: clamp(1.5rem, 4vw, 3rem); }
.dwt-step { border-top: 2px solid var(--wp--preset--color--pine); padding-top: 1.25rem; }
.dwt-step h3 { margin: 0.25rem 0 0.5rem; }
.dwt-step p { margin: 0; color: var(--wp--preset--color--pine-soft); }
.dwt-step .dwt-step-num {
	margin: 0;
	font: 800 2.5rem/1 var(--wp--preset--font-family--display);
	letter-spacing: -0.04em;
	color: var(--wp--preset--color--amber);
}

/* Report showcase -------------------------------------------------------- */

.dwt-report-sec { background: var(--wp--preset--color--frost); }
.dwt-split { gap: clamp(2rem, 6vw, 5rem); }

.dwt-features { margin: 0; display: grid; gap: 1.1rem; }
.dwt-features > div { padding-inline-start: 18px; border-inline-start: 3px solid var(--wp--preset--color--line); }
.dwt-features dt { font-weight: 600; }
.dwt-features dd { margin: 0.15rem 0 0; color: var(--wp--preset--color--lichen); }

.dwt-mock {
	padding: clamp(1.25rem, 3vw, 2rem);
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--dwt-radius);
	box-shadow: 0 30px 60px -40px rgba(24, 58, 55, 0.5);
	transform: rotate(-1.2deg);
}
[dir="rtl"] .dwt-mock { transform: rotate(1.2deg); }
.dwt-mock-domain {
	padding-bottom: 14px;
	border-bottom: 2px solid var(--wp--preset--color--pine);
	font: 800 clamp(2rem, 4vw, 2.8rem)/1 var(--wp--preset--font-family--display);
	letter-spacing: -0.03em;
}
.dwt-mock-domain span { font-weight: 400; color: var(--wp--preset--color--lichen); }
.dwt-mock-row { display: flex; align-items: flex-end; gap: 28px; margin-top: 18px; }
.dwt-mock-score { font: 800 3.4rem/0.85 var(--wp--preset--font-family--display); letter-spacing: -0.04em; }
.dwt-mock-score small { font-size: 1rem; font-weight: 400; color: var(--wp--preset--color--lichen); letter-spacing: 0; }
.dwt-mock-range { font: 600 1.5rem/1.1 var(--wp--preset--font-family--display); }
.dwt-mock-cap { font-size: 0.85rem; color: var(--wp--preset--color--lichen); }
.dwt-mock-ruler {
	position: relative;
	height: 14px;
	margin-top: 22px;
	border-radius: 4px;
	border: 1px solid var(--wp--preset--color--line);
	background: repeating-linear-gradient(90deg, var(--wp--preset--color--line) 0 1px, transparent 1px 10%), var(--wp--preset--color--frost);
}
.dwt-mock-ruler span {
	position: absolute;
	top: -4px;
	bottom: -4px;
	border-radius: 4px;
	background: var(--wp--preset--color--amber);
}
.dwt-mock-ticks {
	display: flex;
	justify-content: space-between;
	margin-top: 6px;
	font-size: 0.75rem;
	color: var(--wp--preset--color--lichen);
}
.dwt-mock-list { margin: 18px 0 0; padding: 0; list-style: none; font-size: 0.95rem; }
.dwt-mock-list li { position: relative; padding-inline-start: 18px; margin: 6px 0; }
.dwt-mock-list li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 0.55em;
	width: 8px;
	height: 8px;
	border-radius: 2px;
}
.dwt-mock-list .is-good::before { background: var(--wp--preset--color--moss); }
.dwt-mock-list .is-bad::before { background: var(--wp--preset--color--ember); }

/* Portfolio promo ------------------------------------------------------ */

.dwt-pf-list { margin: 0 0 1.75rem; padding: 0; list-style: none; display: grid; gap: 0.6rem; }
.dwt-pf-list li { position: relative; padding-inline-start: 26px; }
.dwt-pf-list li::before {
	content: ""; position: absolute; inset-inline-start: 0; top: 0.45em;
	width: 12px; height: 12px; border-radius: 3px; background: var(--wp--preset--color--amber);
}
.dwt-pf-mock {
	padding: clamp(1.25rem, 3vw, 2rem); border-radius: var(--dwt-radius, 14px);
	background: var(--wp--preset--color--pine); color: var(--wp--preset--color--frost);
	box-shadow: 0 30px 60px -40px rgba(24, 58, 55, 0.6);
}
.dwt-pf-mock-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(243,246,244,.15); }
.dwt-pf-mock-stats small { display: block; font-size: 0.8rem; color: #a9bdb5; }
.dwt-pf-mock-stats strong { font: 800 2.1rem/1 var(--wp--preset--font-family--display); letter-spacing: -0.03em; color: #fff; }
.dwt-pf-mock-bar { display: flex; gap: 3px; height: 12px; margin: 1.25rem 0 0.6rem; border-radius: 5px; overflow: hidden; }
.dwt-pf-mock-bar span:nth-child(1) { flex: 32; background: #5fa47a; }
.dwt-pf-mock-bar span:nth-child(2) { flex: 25; background: var(--wp--preset--color--amber); }
.dwt-pf-mock-bar span:nth-child(3) { flex: 43; background: #d4745c; }
.dwt-pf-mock-legend { display: flex; flex-wrap: wrap; gap: 14px; font-size: 0.85rem; color: #c9d7d1; }
.dwt-pf-mock-rows { margin: 1.25rem 0 0; padding: 0; list-style: none; font-size: 0.95rem; }
.dwt-pf-mock-rows li { display: flex; justify-content: space-between; padding: 0.45rem 0; border-top: 1px solid rgba(243,246,244,.1); }
.dwt-pf-mock-rows em { font-style: normal; font-size: 0.8rem; padding: 1px 9px; border-radius: 999px; background: rgba(212,116,92,.2); color: #f0b3a3; }

/* Generator promo (homepage) --------------------------------------------- */

.dwt-gen-promo { background: var(--wp--preset--color--frost); border-block: 1px solid var(--wp--preset--color--line); }
.dwt-gen-promo .dwt-section-title { margin-bottom: 1rem; }
.dwt-gen-promo .dwt-lead { margin: 0 0 1.5rem; }
.dwt-gen-form {
	display: flex; max-width: 620px; border: 2px solid var(--wp--preset--color--pine); border-radius: 14px;
	background: var(--wp--preset--color--paper); overflow: hidden;
}
.dwt-gen-form:focus-within { box-shadow: 0 0 0 4px var(--wp--preset--color--amber-soft); }
.dwt-gen-form input {
	flex: 1; min-width: 0; margin: 0; padding: 16px 18px; border: 0; background: transparent;
	font: 500 1.05rem/1.2 var(--wp--preset--font-family--body); color: var(--wp--preset--color--pine);
}
.dwt-gen-form input:focus { outline: none; }
.dwt-gen-form button {
	margin: 0; padding: 0 24px; border: 0; background: var(--wp--preset--color--amber); color: var(--wp--preset--color--pine-deep);
	font: 700 1rem/1 var(--wp--preset--font-family--body); cursor: pointer;
}
.dwt-gen-form button:hover { background: var(--wp--preset--color--amber-soft); }
.dwt-gen-try { margin: 0.9rem 0 0; font-size: 0.92rem; color: var(--wp--preset--color--lichen); }
.dwt-gen-try a { margin-inline-start: 6px; padding: 2px 10px; border: 1px solid var(--wp--preset--color--line); border-radius: 999px; background: var(--wp--preset--color--paper); color: var(--wp--preset--color--pine); text-decoration: none; white-space: nowrap; line-height: 2.2; }
.dwt-gen-try a:hover { border-color: var(--wp--preset--color--pine); }
.dwt-gen-mock {
	display: grid; gap: 10px; padding: 1.25rem; border-radius: var(--dwt-radius);
	background: var(--wp--preset--color--paper); border: 1px solid var(--wp--preset--color--line);
	box-shadow: 0 30px 60px -40px rgba(24, 58, 55, 0.5);
}
.dwt-gen-mock-row { display: grid; grid-template-columns: 1fr 70px auto; gap: 14px; align-items: center; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--wp--preset--color--line); }
.dwt-gen-mock-row.is-taken { opacity: 0.55; }
.dwt-gen-mock-name { font: 700 1.1rem/1.2 var(--wp--preset--font-family--display); letter-spacing: -0.02em; }
.dwt-gen-mock-name em { font-style: normal; font-weight: 400; color: var(--wp--preset--color--lichen); }
.dwt-gen-mock-bar { height: 6px; border-radius: 3px; background: var(--wp--preset--color--frost); overflow: hidden; }
.dwt-gen-mock-bar i { display: block; height: 100%; background: var(--wp--preset--color--amber); }
.dwt-gen-mock-tag { font-size: 0.78rem; font-weight: 600; padding: 2px 9px; border-radius: 999px; border: 1px solid var(--wp--preset--color--moss); color: var(--wp--preset--color--moss); }
.dwt-gen-mock-row.is-taken .dwt-gen-mock-tag { border-color: var(--wp--preset--color--ember); color: var(--wp--preset--color--ember); }
@media (max-width: 600px) {
	.dwt-gen-form { flex-direction: column; }
	.dwt-gen-form button { padding: 14px; }
}

/* Article call to action */
.dwt-post-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 780px; margin: 3rem auto 0; padding-inline: var(--dwt-gutter); }
.dwt-post-cta-card {
	display: flex; flex-direction: column; gap: 4px; padding: 1.25rem 1.4rem; border-radius: 14px;
	border: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--frost);
	color: var(--wp--preset--color--pine); text-decoration: none; transition: border-color .15s;
}
.dwt-post-cta-card:hover { border-color: var(--wp--preset--color--pine); }
.dwt-post-cta-kicker { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--wp--preset--color--lichen); }
.dwt-post-cta-card strong { font: 700 1.15rem/1.25 var(--wp--preset--font-family--display); }
.dwt-post-cta-card span:last-child { font-size: 0.92rem; color: var(--wp--preset--color--pine-soft); }
@media (max-width: 600px) { .dwt-post-cta { grid-template-columns: 1fr; } }

/* Article tables */
.wp-block-post-content .wp-block-table table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.wp-block-post-content .wp-block-table th, .wp-block-post-content .wp-block-table td { padding: 10px 12px; border: 1px solid var(--wp--preset--color--line); text-align: start; vertical-align: top; }
.wp-block-post-content .wp-block-table th { background: var(--wp--preset--color--frost); }

/* Accuracy band -------------------------------------------------------- */

.dwt-acc-band .dwt-section-title { font-size: var(--wp--preset--font-size--x-large); margin-bottom: 1rem; }
.dwt-acc-band p { font-size: var(--wp--preset--font-size--large); max-width: 46ch; margin-bottom: 1.75rem; }
.dwt-acc-points { margin: 0; padding: 0; list-style: none; counter-reset: pt; display: grid; gap: 1rem; }
.dwt-acc-points li {
	counter-increment: pt;
	display: grid;
	grid-template-columns: 3rem 1fr;
	grid-template-rows: auto auto;
	column-gap: 1rem;
	padding: 1.1rem 1.25rem;
	border: 1px solid rgba(243, 246, 244, 0.16);
	border-radius: 12px;
}
.dwt-acc-points li::before {
	content: counter(pt, decimal-leading-zero);
	grid-row: 1 / 3;
	font: 800 1.9rem/1 var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--amber);
}
.dwt-acc-points strong { font: 600 1.15rem/1.3 var(--wp--preset--font-family--display); color: #fff; }
.dwt-acc-points span { color: #c9d7d1; font-size: 0.95rem; }

/* Pricing ---------------------------------------------------------------- */

.dwt-pricing .dwt-lead { margin-top: -1.5rem; margin-bottom: 1rem; }
.dwt-pricing .dw-app { max-width: none; }
.dwt-pricing .dw-packs { margin-top: 2rem; }

/* FAQ -------------------------------------------------------------------- */

.dwt-faq { background: var(--wp--preset--color--frost); }
.dwt-faq .wp-block-details summary {
	cursor: pointer;
	font: 600 1.15rem/1.3 var(--wp--preset--font-family--display);
	list-style: none;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}
.dwt-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.dwt-faq .wp-block-details summary::after {
	content: "+";
	flex: none;
	font-weight: 400;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--wp--preset--color--lichen);
	transition: transform 0.2s;
}
.dwt-faq .wp-block-details[open] summary::after { transform: rotate(45deg); }
.dwt-faq .wp-block-details p { margin: 0.75rem 0 0; color: var(--wp--preset--color--pine-soft); max-width: 68ch; }

/* CTA -------------------------------------------------------------------- */

.dwt-cta { text-align: center; }
.dwt-cta .dwt-inner { display: flex; flex-direction: column; align-items: center; gap: 1.75rem; }
.dwt-cta-title {
	margin: 0;
	font-size: var(--wp--preset--font-size--hero);
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 1;
}
.dwt-btn-amber .wp-block-button__link {
	background: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--pine-deep);
	padding: 1rem 1.8rem;
	font-size: 1.05rem;
}
.dwt-btn-amber .wp-block-button__link:hover { background: var(--wp--preset--color--amber-soft); color: var(--wp--preset--color--pine-deep); }

/* Footer ----------------------------------------------------------------- */

.dwt-footer {
	background: var(--wp--preset--color--pine-deep);
	color: #b8c9c2;
	padding: var(--wp--preset--spacing--50) var(--dwt-gutter) 1.5rem;
}
.dwt-footer-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2.5rem;
	max-width: var(--dwt-wide);
	margin-inline: auto;
}
.dwt-footer-brand p { max-width: 34ch; margin: 1rem 0 0; }
.dwt-footer-links { display: flex; gap: clamp(2rem, 6vw, 5rem); }
.dwt-footer-links h2 {
	margin: 0 0 0.75rem;
	font: 600 0.8rem/1 var(--wp--preset--font-family--body);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lichen);
}
.dwt-footer-links a { display: block; margin: 0.4rem 0; color: var(--wp--preset--color--frost); text-decoration: none; }
.dwt-footer-links a:hover { text-decoration: underline; }
.dwt-footer-legal {
	max-width: var(--dwt-wide);
	margin: var(--wp--preset--spacing--50) auto 0;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(243, 246, 244, 0.12);
	font-size: 0.85rem;
}

/* Tool pages (appraisal, portfolio, account, accuracy) ------------------ */

.dwt-tool-hero { padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(2.5rem, 6vw, 4rem); }
.dwt-tool-title {
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 800;
	letter-spacing: -0.035em;
	line-height: 1;
}
.dwt-tool-hero .dwt-lead { margin-bottom: 2rem; }
/* The tool page keeps its checklist visible only until a report appears. */
.dwt-tool-hero:has(.dw-report) .dwt-lead { display: none; }

.dwt-page-head {
	position: relative;
	overflow: hidden;
	background: var(--wp--preset--color--frost);
	padding-block: clamp(2.5rem, 6vw, 4rem) clamp(2rem, 5vw, 3rem);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.dwt-page-head .dwt-lead { margin: 0; }
.dwt-tool-body {
	max-width: var(--dwt-wide);
	margin-inline: auto;
	padding-inline: var(--dwt-gutter);
	padding-top: clamp(2rem, 5vw, 3.5rem);
	padding-bottom: var(--wp--preset--spacing--60, 4rem);
}
.dwt-tool-body-top { padding-top: clamp(2.5rem, 6vw, 4.5rem); }
.dwt-tool-body .dw-app { margin-inline: 0; }
.dwt-tool-body .dw-account { max-width: none; }

.dwt-next { padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60); }
.dwt-next-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.dwt-next-card {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 1.5rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 14px;
	text-decoration: none;
	color: var(--wp--preset--color--pine);
	transition: border-color 0.15s, transform 0.15s;
}
.dwt-next-card:hover { border-color: var(--wp--preset--color--pine); transform: translateY(-2px); }
.dwt-next-q { font: 700 1.2rem/1.2 var(--wp--preset--font-family--display); }
.dwt-next-a { color: var(--wp--preset--color--lichen); font-size: 0.95rem; flex: 1; }
.dwt-next-link { margin-top: 8px; font-weight: 600; }
@media (max-width: 781px) { .dwt-next-grid { grid-template-columns: 1fr; } }

/* Free tool pages: tool full width, guide text at a readable width. */
.dwt-article .wp-block-post-content > :is(h2, h3, p, ul, ol, .wp-block-list, .wp-block-details) { max-width: 760px; }
.dwt-article .wp-block-post-content > h2 { margin-top: 3rem; font-size: var(--wp--preset--font-size--x-large); }
.dwt-article .wp-block-post-content > h2:first-of-type { margin-top: 4rem; }
.dwt-article .wp-block-post-content li { margin: 0.6rem 0; }
.dwt-article .wp-block-details { border-bottom: 1px solid var(--wp--preset--color--line); padding-block: 0.9rem; }
.dwt-article .wp-block-details summary { cursor: pointer; font: 600 1.08rem/1.35 var(--wp--preset--font-family--display); }
.dwt-article .wp-block-details p { color: var(--wp--preset--color--pine-soft); margin: 0.6rem 0 0; }

/* Inner pages ------------------------------------------------------------ */

.dwt-page { padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60); }
.dwt-page-title { margin-bottom: var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--xx-large); font-weight: 800; letter-spacing: -0.03em; }
.dwt-meta-date { color: var(--wp--preset--color--lichen); font-size: 0.9rem; }
.dwt-posts > li { padding-block: 1.5rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.dwt-posts h2 { margin: 0.25rem 0 0.5rem; font-size: var(--wp--preset--font-size--x-large); }
.dwt-posts h2 a { text-decoration: none; }

/* Mobile ----------------------------------------------------------------- */

@media (max-width: 781px) {
	.dwt-mock { transform: none; }
	.dwt-acc-band .wp-block-column { flex-basis: 100% !important; }
	.dwt-hero::after { width: 300px; height: 300px; inset-inline-end: -90px; top: -30px; }
}