/* /chi-duong only. The theme loads this asset for that page slug. */
.kicap-directions {
	--kicap-directions-one: #147a4c;
	--kicap-directions-two: #175fc5;
	--kicap-directions-three: #d25b26;
	padding: var(--kicap-space-8) 0 var(--kicap-section-space);
	background: var(--kicap-page);
	color: var(--kicap-text);
	font-family: var(--kicap-font-sans);
}

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

.kicap-directions h1,
.kicap-directions h2,
.kicap-directions h3,
.kicap-directions p,
.kicap-directions figure { margin: 0; }

.kicap-directions a { text-decoration: none; }
.kicap-directions a:focus-visible,
.kicap-directions button:focus-visible { outline: var(--kicap-focus-width) solid var(--kicap-focus-ring); outline-offset: var(--kicap-focus-offset); }

.kicap-directions__intro { max-width: 790px; margin-bottom: var(--kicap-space-7); }
.kicap-directions__eyebrow { margin-bottom: var(--kicap-space-3) !important; color: var(--kicap-color-accent-strong); font-size: var(--kicap-font-size-xs); font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.kicap-directions__intro h1 { font-size: clamp(2rem, 4vw, 3.25rem); font-weight: 760; line-height: 1.07; letter-spacing: -.045em; text-transform: uppercase; }
.kicap-directions__intro .kicap-directions__address-lead { margin-top: var(--kicap-space-3); color: var(--kicap-text); font-size: clamp(1rem, 2vw, 1.25rem); font-weight: 620; }
.kicap-directions__intro > p:last-child { max-width: 720px; margin-top: var(--kicap-space-3); color: var(--kicap-text-muted); font-size: var(--kicap-font-size-base); line-height: var(--kicap-line-height-relaxed); }

.kicap-directions__overview { display: grid; grid-template-columns: minmax(0, 2fr) minmax(320px, .9fr); align-items: start; gap: var(--kicap-space-5); }
.kicap-directions__map,
.kicap-directions__side,
.kicap-directions__detail { min-width: 0; }
.kicap-directions__map-viewport { position: relative; width: 100%; overflow: hidden; border: 1px solid var(--kicap-border); border-radius: var(--kicap-radius-md); background: var(--kicap-surface-elevated); }
.kicap-directions__map-canvas { position: relative; width: 100%; aspect-ratio: 2643 / 1298; }
.kicap-directions__map-canvas > img { display: block; width: 100%; height: 100%; object-fit: fill; }
.kicap-directions__map-overlay { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.kicap-directions__route-halo { fill: none; stroke: #fff; stroke-width: 30; stroke-linecap: round; stroke-linejoin: round; opacity: .95; }
.kicap-directions__route { fill: none; stroke-width: 16; stroke-linecap: round; stroke-linejoin: round; }
.kicap-directions__route--one { stroke: var(--kicap-directions-one); }
.kicap-directions__route--two { stroke: var(--kicap-directions-two); }
.kicap-directions__route--three { stroke: var(--kicap-directions-three); stroke-dasharray: 35 20; }
.kicap-directions__map-marker circle { stroke: #fff; stroke-width: 12; }
.kicap-directions__map-marker text { fill: #fff; font: 750 44px var(--kicap-font-sans); }
.kicap-directions__map-marker--one circle { fill: var(--kicap-directions-one); }
.kicap-directions__map-marker--two circle { fill: var(--kicap-directions-two); }
.kicap-directions__map-marker--three circle { fill: var(--kicap-directions-three); }
.kicap-directions__map-destination circle:first-child { fill: #b72d33; stroke: #fff; stroke-width: 12; }
.kicap-directions__map-destination circle:last-child { fill: #fff; }
.kicap-directions__map-tag { position: absolute; display: block; max-width: 220px; padding: 7px 10px; border: 1px solid #fff; border-radius: var(--kicap-radius-sm); background: #19201c; color: #fff; font-size: 13px; font-weight: 750; line-height: 1.2; text-align: center; box-shadow: var(--kicap-shadow-soft); }
.kicap-directions__map-tag small { display: block; margin-top: 2px; font-size: 10px; font-weight: 500; }
.kicap-directions__map-tag--destination { top: 63%; left: 42.5%; transform: translate(-50%, 0); }
.kicap-directions__map-credit { position: absolute; right: 6px; bottom: 6px; z-index: 1; padding: 3px 5px; border-radius: 3px; background: rgba(255,255,255,.94); color: #28313a; font-size: 10px; line-height: 1.2; }
.kicap-directions__map figcaption { margin-top: var(--kicap-space-3); color: var(--kicap-text-muted); font-size: var(--kicap-font-size-sm); line-height: var(--kicap-line-height-base); }

.kicap-directions__side { display: grid; gap: var(--kicap-space-4); }
.kicap-directions__note,
.kicap-directions__selector,
.kicap-directions__travel-note,
.kicap-directions__address-card { padding: var(--kicap-space-5); border: 1px solid var(--kicap-border); border-radius: var(--kicap-radius-md); background: var(--kicap-surface); }
.kicap-directions__note { display: grid; gap: var(--kicap-space-2); border-left: 3px solid var(--kicap-color-accent); }
.kicap-directions__note strong { font-size: var(--kicap-font-size-sm); }
.kicap-directions__note span { color: var(--kicap-text-muted); font-size: var(--kicap-font-size-sm); line-height: var(--kicap-line-height-base); }
.kicap-directions__selector h2 { margin-bottom: var(--kicap-space-4); font-size: var(--kicap-font-size-base); font-weight: 750; }
.kicap-directions__choice { display: grid; grid-template-columns: 44px minmax(0,1fr) auto 16px; align-items: center; gap: var(--kicap-space-3); min-height: 70px; margin-top: var(--kicap-space-3); padding: var(--kicap-space-3); border: 1px solid var(--kicap-border); border-radius: var(--kicap-radius-sm); background: var(--kicap-surface-elevated); color: var(--kicap-text); transition: border-color var(--kicap-motion-fast) var(--kicap-ease-out), box-shadow var(--kicap-motion-fast) var(--kicap-ease-out); }
.kicap-directions__choice:hover { border-color: var(--kicap-border-strong); box-shadow: var(--kicap-shadow-soft); }
.kicap-directions__choice > .kicap-icon { width: 16px; height: 16px; }
.kicap-directions__number { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; border-radius: 50%; color: #fff; font-size: 23px; font-weight: 750; line-height: 1; }
.kicap-directions__choice--one .kicap-directions__number,
.kicap-directions__detail--one .kicap-directions__number { background: var(--kicap-directions-one); }
.kicap-directions__choice--two .kicap-directions__number,
.kicap-directions__detail--two .kicap-directions__number { background: var(--kicap-directions-two); }
.kicap-directions__choice--three .kicap-directions__number,
.kicap-directions__detail--three .kicap-directions__number { background: var(--kicap-directions-three); }
.kicap-directions__choice-copy { min-width: 0; }
.kicap-directions__choice-copy strong,
.kicap-directions__choice-copy small { display: block; }
.kicap-directions__choice-copy strong { font-size: var(--kicap-font-size-sm); font-weight: 750; line-height: 1.3; }
.kicap-directions__choice-copy small { margin-top: 2px; color: var(--kicap-text-muted); font-size: 12px; line-height: 1.3; }
.kicap-directions__badge { justify-self: end; padding: 4px 7px; border: 1px solid var(--kicap-border); border-radius: var(--kicap-radius-pill); color: var(--kicap-text-muted); font-size: 11px; font-weight: 700; line-height: 1.2; white-space: nowrap; }
.kicap-directions__choice--three .kicap-directions__badge,
.kicap-directions__detail--three .kicap-directions__badge { border-color: var(--kicap-directions-three); color: var(--kicap-directions-three); }
.kicap-directions__travel-note { display: grid; gap: var(--kicap-space-2); }
.kicap-directions__travel-note p { color: var(--kicap-text-muted); font-size: var(--kicap-font-size-sm); line-height: var(--kicap-line-height-base); }
.kicap-directions__travel-note strong { color: var(--kicap-text); }
.kicap-directions__address-card > strong { display: block; margin-bottom: var(--kicap-space-2); font-size: var(--kicap-font-size-sm); }
.kicap-directions__address-card address { font-size: var(--kicap-font-size-sm); font-style: normal; line-height: var(--kicap-line-height-base); }
.kicap-directions__address-actions { display: flex; flex-wrap: wrap; gap: var(--kicap-space-3); margin-top: var(--kicap-space-4); }
.kicap-directions__address-actions .kicap-button { min-height: 44px; padding-inline: var(--kicap-space-4); font-size: var(--kicap-font-size-sm); }
.kicap-directions__copy-status { display: block; min-height: 1px; color: var(--kicap-status-success); font-size: var(--kicap-font-size-xs); }
.kicap-directions__copy-status:not(:empty) { margin-top: var(--kicap-space-3); }

.kicap-directions__details { margin-top: var(--kicap-space-8); padding-top: var(--kicap-space-7); border-top: 1px solid var(--kicap-border); }
.kicap-directions__section-head { margin-bottom: var(--kicap-space-5); }
.kicap-directions__section-head h2 { font-size: clamp(1.45rem, 2.4vw, 2rem); font-weight: 760; line-height: 1.2; letter-spacing: -.03em; text-transform: uppercase; }
.kicap-directions__detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--kicap-space-4); }
.kicap-directions__detail { scroll-margin-top: 110px; padding: var(--kicap-space-5); border: 1px solid var(--kicap-border); border-top: 3px solid; border-radius: var(--kicap-radius-md); background: var(--kicap-surface); }
.kicap-directions__detail--one { border-top-color: var(--kicap-directions-one); }
.kicap-directions__detail--two { border-top-color: var(--kicap-directions-two); }
.kicap-directions__detail--three { border-top-color: var(--kicap-directions-three); }
.kicap-directions__detail header { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: var(--kicap-space-3); }
.kicap-directions__detail h3 { font-size: var(--kicap-font-size-base); font-weight: 750; line-height: 1.2; }
.kicap-directions__detail header p { margin-top: 2px; color: var(--kicap-text-muted); font-size: var(--kicap-font-size-sm); line-height: 1.3; }
.kicap-directions__detail ol { margin: var(--kicap-space-5) 0; padding-left: 24px; color: var(--kicap-text); font-size: var(--kicap-font-size-sm); line-height: var(--kicap-line-height-relaxed); }
.kicap-directions__detail ol li { padding-left: var(--kicap-space-2); }
.kicap-directions__detail ol li + li { margin-top: var(--kicap-space-3); }
.kicap-directions__photo-placeholder { display: grid; min-height: 190px; align-content: center; gap: var(--kicap-space-2); padding: var(--kicap-space-5); border: 1px dashed var(--kicap-border-strong); border-radius: var(--kicap-radius-sm); background: var(--kicap-surface-elevated); text-align: center; }
.kicap-directions__photo-placeholder strong { font-size: var(--kicap-font-size-sm); }
.kicap-directions__photo-placeholder span { color: var(--kicap-text-muted); font-size: var(--kicap-font-size-xs); line-height: 1.4; }
.kicap-directions__benefits { margin: var(--kicap-space-5) 0 0; padding-left: 20px; color: var(--kicap-text-muted); font-size: var(--kicap-font-size-sm); line-height: var(--kicap-line-height-base); }
.kicap-directions__benefits li + li { margin-top: var(--kicap-space-2); }
.kicap-directions__reassurance { margin-top: var(--kicap-space-5); padding: var(--kicap-space-4); border: 1px solid var(--kicap-directions-three); border-radius: var(--kicap-radius-sm); }
.kicap-directions__reassurance strong { color: var(--kicap-directions-three); font-size: var(--kicap-font-size-sm); line-height: 1.35; text-transform: uppercase; }
.kicap-directions__reassurance p { margin-top: var(--kicap-space-2); color: var(--kicap-text-muted); font-size: var(--kicap-font-size-sm); line-height: var(--kicap-line-height-base); }
.kicap-directions__street-photo img { display: block; width: 100%; height: auto; border-radius: var(--kicap-radius-sm); }
.kicap-directions__street-photo figcaption { margin-top: var(--kicap-space-2); color: var(--kicap-text-muted); font-size: var(--kicap-font-size-xs); line-height: 1.4; }

html[data-theme="dark"] .kicap-directions { --kicap-directions-one: #57b985; --kicap-directions-two: #75aaf0; --kicap-directions-three: #e79264; }
html[data-theme="dark"] .kicap-directions__number { color: #161916; }
html[data-theme="dark"] .kicap-directions__map-marker--one circle { fill: #147a4c; }
html[data-theme="dark"] .kicap-directions__map-marker--two circle { fill: #175fc5; }
html[data-theme="dark"] .kicap-directions__map-marker--three circle { fill: #d25b26; }

@media (max-width: 1100px) {
	.kicap-directions__overview { grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr); }
	.kicap-directions__choice { grid-template-columns: 44px minmax(0,1fr) 16px; }
	.kicap-directions__choice .kicap-directions__badge { grid-column: 2; justify-self: start; }
	.kicap-directions__choice > .kicap-icon { grid-column: 3; grid-row: 1 / 3; }
	.kicap-directions__detail header { grid-template-columns: 44px minmax(0,1fr); }
	.kicap-directions__detail header .kicap-directions__badge { grid-column: 2; justify-self: start; }
}

@media (max-width: 900px) {
	.kicap-directions__overview { grid-template-columns: minmax(0,1fr); }
	.kicap-directions__side { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.kicap-directions__selector { grid-row: span 3; }
	.kicap-directions__detail-grid { grid-template-columns: minmax(0,1fr); }
	.kicap-directions__detail header { grid-template-columns: 44px minmax(0,1fr) auto; }
	.kicap-directions__detail header .kicap-directions__badge { grid-column: auto; justify-self: end; }
}

@media (max-width: 767px) {
	.kicap-directions { padding-top: var(--kicap-space-6); }
	.kicap-directions__intro { margin-bottom: var(--kicap-space-5); }
	.kicap-directions__intro h1 { font-size: clamp(1.9rem, 8vw, 2.5rem); }
	.kicap-directions__intro > p:last-child { font-size: 15px; }
	.kicap-directions__map-viewport { height: min(98vw, 400px); }
	.kicap-directions__map-canvas { position: absolute; top: 50%; left: 44%; width: 215%; transform: translate(-50%,-50%); }
	.kicap-directions__map figcaption { font-size: 12px; }
	.kicap-directions__side { grid-template-columns: minmax(0,1fr); }
	.kicap-directions__selector { grid-row: auto; order: 1; }
	.kicap-directions__note { order: 2; }
	.kicap-directions__travel-note { order: 3; }
	.kicap-directions__address-card { order: 4; }
	.kicap-directions__choice { grid-template-columns: 44px minmax(0,1fr) auto 16px; }
	.kicap-directions__choice .kicap-directions__badge { grid-column: auto; justify-self: end; }
	.kicap-directions__choice > .kicap-icon { grid-column: auto; grid-row: auto; }
	.kicap-directions__detail header { grid-template-columns: 44px minmax(0,1fr); }
	.kicap-directions__detail header .kicap-directions__badge { grid-column: 2; justify-self: start; }
	.kicap-directions__details { margin-top: var(--kicap-space-7); }
	.kicap-directions__photo-placeholder { min-height: 150px; }
}

@media (max-width: 430px) {
	.kicap-directions__choice { grid-template-columns: 44px minmax(0,1fr) 16px; }
	.kicap-directions__choice .kicap-directions__badge { grid-column: 2; justify-self: start; }
	.kicap-directions__choice > .kicap-icon { grid-column: 3; grid-row: 1 / 3; }
}

@media (prefers-reduced-motion: reduce) {
	.kicap-directions__choice { transition: none; }
}