/**
 * DT Schede Turismo – pagine dei luoghi (grafica Bootstrap Italia del tema).
 *
 * Digital-Tech Web Agency – https://www.digital-tech.cloud
 */
.dtl-page {
	--dtl-p: var(--bs-primary, #0b6e3e);
	--dtl-line: #d9dadb;
	--dtl-muted: #5c6f82;
	--dtl-soft: #f2f7f4;
	max-width: 980px;
}
.dtl-page [hidden] { display: none !important; }
.dtl-ico { width: 22px; height: 22px; flex: 0 0 auto; }
.dtl-title { font-size: 1.5rem !important; font-weight: 700; margin: 0 0 1rem !important; }
.dtl { margin: 0 0 2rem; }
.dtl-page > p.wp-block-paragraph { font-size: 1.05rem; line-height: 1.65; }

/* In breve */
.dtl-facts { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .75rem; }
.dtl-fact { display: flex; flex-direction: column; padding: 1rem 1.1rem; border: 1px solid var(--dtl-line); border-radius: 6px; background: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .04); }
.dtl-fact-ico { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: var(--dtl-soft); color: var(--dtl-p); margin-bottom: .55rem; }
.dtl-fact-label { font-size: .85rem; color: var(--dtl-muted); }
.dtl-fact-value { font-size: 1.2rem; line-height: 1.3; margin: .1rem 0; color: #1a1a1a; }
.dtl-fact-sub { font-size: .85rem; color: var(--dtl-muted); }

/* Documenti e indicazioni */
.dtl-after { margin: 2rem 0; }
.dtl-docs { list-style: none; padding: 0; margin: 0 0 2rem; display: grid; gap: .6rem; max-width: 640px; }
.dtl-doc { display: flex; align-items: center; gap: .75rem; padding: .9rem 1.1rem; border: 1px solid var(--dtl-line); border-radius: 6px; background: #fff; font-weight: 600; text-decoration: none; }
.dtl-doc:hover, .dtl-doc:focus { border-color: var(--dtl-p); background: var(--dtl-soft); }
.dtl-doc .dtl-ico { color: #c02525; }
.dtl-doc-name { flex: 1; }
.dtl-doc-type { font-size: .75rem; font-weight: 700; color: var(--dtl-muted); border: 1px solid var(--dtl-line); border-radius: 4px; padding: .05rem .4rem; }
.dtl-where { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin: 0 0 2rem; }
.dtl-btn { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1rem; border-radius: 4px; background: var(--dtl-p); color: #fff !important; font-weight: 600; text-decoration: none; }
.dtl-btn:hover, .dtl-btn:focus { background: #08552f; }
.dtl-btn .dtl-ico { width: 18px; height: 18px; }
.dtl-caption { margin-top: .5rem; font-size: .9rem; color: var(--dtl-muted); text-align: center; }
.dtl-page .wp-block-image img { border-radius: 6px; max-width: 100%; height: auto; }

/* Impianti */
.dtl-info { margin: 0 0 2rem; padding: 1.25rem; border: 1px solid var(--dtl-line); border-radius: 6px; background: #fafbfc; }
.dtl-note { margin: 0 0 1rem; }
.dtl-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.dtl-btn-outline { background: #fff; color: var(--dtl-p) !important; border: 1px solid var(--dtl-p); }
.dtl-btn-outline:hover, .dtl-btn-outline:focus { background: var(--dtl-soft); }
.dtl-related { list-style: none; padding: 0; margin: 0 0 2rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .6rem; }
.dtl-rel { display: flex; align-items: center; gap: .6rem; height: 100%; padding: .9rem 1.1rem; border: 1px solid var(--dtl-line); border-radius: 6px; background: #fff; font-weight: 600; text-decoration: none; }
.dtl-rel .dtl-ico { color: var(--dtl-p); }
.dtl-rel:hover, .dtl-rel:focus { border-color: var(--dtl-p); background: var(--dtl-soft); }

/* Itinerario */
.dtl-lead { font-size: 1.1rem !important; }
.dtl-profile-wrap { margin: 1.5rem 0 2rem; padding: 1rem 1rem .25rem; border: 1px solid var(--dtl-line); border-radius: 6px; background: #fff; }
.dtl-profile-title { font-weight: 600; font-size: .95rem; margin-bottom: .25rem; }
.dtl-profile { width: 100%; height: auto; display: block; }
.dtl-prof-area { fill: var(--dtl-soft); }
.dtl-prof-line { fill: none; stroke: var(--dtl-p); stroke-width: 3; stroke-linejoin: round; }
.dtl-prof-dot { fill: #fff; stroke: var(--dtl-p); stroke-width: 3; }
.dtl-prof-alt { font-size: 13px; font-weight: 700; fill: #1a1a1a; }
.dtl-prof-name { font-size: 12px; fill: var(--dtl-muted); }
.dtl-steps { list-style: none; counter-reset: dtl; padding: 0; margin: 0 0 2rem; }
.dtl-steps > li { counter-increment: dtl; position: relative; padding: 0 0 .25rem 3.25rem; border-left: 2px solid var(--dtl-line); margin-left: 1rem; }
.dtl-steps > li:last-child { border-left-color: transparent; }
.dtl-steps > li::before { content: counter(dtl); position: absolute; left: -1rem; top: 0; width: 2rem; height: 2rem; border-radius: 50%; background: var(--dtl-p); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.dtl-steps > li > p { margin: 0 0 1.25rem; line-height: 1.65; }
.dtl-zoom { display: inline-block; cursor: zoom-in; }

@media (max-width: 575.98px) {
	.dtl-steps > li { padding-left: 2rem; margin-left: .9rem; }
	.dtl-prof-name { font-size: 18px; }
	.dtl-prof-alt { font-size: 18px; }
	.dtl-facts { grid-template-columns: 1fr 1fr; }
	.dtl-fact { padding: .85rem; }
	.dtl-fact-value { font-size: 1.05rem; }
}
