/* ==========================================================================
   responsive.css – tablet and mobile layouts
   1200px  small desktop
   1024px  tablet landscape  (mobile navigation starts here)
    782px  tablet portrait   (WordPress admin bar changes height here)
    600px  mobile
   ========================================================================== */

/* ---------- Small desktop ---------- */
@media (max-width: 1200px) {
	:root { --dp-section: 96px; }
	.dp-service-grid { grid-template-columns: repeat(3, 1fr); }
	.dp-hero__inner { gap: 40px; }
	.dp-company__body { padding: 44px 40px; }
	.dp-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 36px; }
}

/* ---------- Tablet landscape: mobile navigation ---------- */
@media (max-width: 1024px) {
	:root { --dp-header-h: 70px; }

	.dp-nav-toggle { display: inline-flex; }

	/* backdrop-filter would trap the fixed off-canvas menu inside the header */
	.dp-header { background: var(--dp-white); backdrop-filter: none; -webkit-backdrop-filter: none; }

	.dp-nav {
		position: fixed;
		top: 0; right: 0; bottom: 0;
		width: min(380px, 88vw);
		flex-direction: column; align-items: stretch; gap: 20px;
		padding: 90px 22px 30px;
		background: var(--dp-white);
		box-shadow: -20px 0 60px -20px rgba(0, 0, 0, .3);
		overflow-y: auto; overscroll-behavior: contain;
		transform: translateX(105%);
		visibility: hidden;
		transition: transform .35s var(--dp-ease), visibility .35s;
		z-index: 110;
	}
	.dp-nav.is-open { transform: none; visibility: visible; }

	.dp-nav-toggle { position: relative; z-index: 120; }

	body.dp-nav-open { overflow: hidden; }
	body.dp-nav-open::after {
		content: ""; position: fixed; inset: 0; z-index: 99;
		background: rgba(10, 22, 19, .5);
	}

	.dp-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.dp-menu > li { border-bottom: 1px solid var(--dp-line); }
	.dp-menu li { display: flex; flex-wrap: wrap; align-items: center; }
	.dp-menu > li > a { flex: 1; padding: 15px 6px; border-radius: 0; font-size: 16.5px; }
	.dp-menu > li > a:hover { background: transparent; }
	.dp-menu .menu-item-has-children > a::after { display: none; }

	.dp-submenu-toggle {
		display: grid; place-items: center;
		width: 42px; height: 42px; border-radius: 10px;
		border: 0; background: var(--dp-cream); color: var(--dp-ink); cursor: pointer;
	}
	.dp-submenu-toggle .dp-icon { width: 18px; height: 18px; transition: transform .25s; }
	.dp-menu li.is-open > .dp-submenu-toggle .dp-icon { transform: rotate(180deg); }

	.dp-menu .sub-menu,
	.dp-menu .sub-menu .sub-menu {
		position: static; flex-basis: 100%;
		min-width: 0; margin: 0 0 12px; padding: 4px 0 4px 12px;
		border: 0; border-left: 2px solid var(--dp-gold);
		border-radius: 0; box-shadow: none;
		opacity: 1; visibility: visible; transform: none;
		display: none;
	}
	.dp-menu li:hover > .sub-menu,
	.dp-menu li:focus-within > .sub-menu { display: none; }
	.dp-menu li.is-open > .sub-menu { display: block; }
	.dp-menu .sub-menu a { padding: 10px 12px; }

	.dp-nav__cta { width: 100%; }

	.dp-topbar__addr { display: none !important; }

	.dp-hero__inner { grid-template-columns: 1fr 340px; }
	.dp-hero__badge { left: -20px; }

	.dp-about__grid,
	.dp-experience__grid,
	.dp-contact__grid { gap: 50px; }

	.dp-program-grid { grid-template-columns: repeat(2, 1fr); }
	.dp-course-grid { grid-template-columns: repeat(2, 1fr); }
	.dp-layout { grid-template-columns: 1fr; }
	.dp-layout__side { position: static; grid-template-columns: repeat(2, 1fr); }

	.dp-digital__head { flex-direction: column; align-items: flex-start; }

	.dp-footer__grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- Tablet portrait ---------- */
@media (max-width: 860px) {
	:root { --dp-section: 80px; }

	.dp-hero { padding-top: 60px; }
	.dp-hero__inner { grid-template-columns: 1fr; padding-bottom: 90px; text-align: center; }
	.dp-hero__content { order: 2; }
	.dp-hero__lead { margin-left: auto; margin-right: auto; }
	.dp-hero__actions,
	.dp-hero__companies { justify-content: center; }
	.dp-hero .dp-eyebrow::before { display: none; }
	.dp-hero__portrait { order: 1; justify-self: center; max-width: 300px; }
	.dp-hero__badge { left: 50%; transform: translateX(-50%); bottom: -24px; max-width: none; white-space: nowrap; }

	.dp-stats { grid-template-columns: repeat(2, 1fr); transform: translateY(40%); }
	.dp-stats > div:nth-child(3) { border-left: 0; }
	.dp-stats > div:nth-child(n+3) { border-top: 1px solid var(--dp-line); }

	.dp-about { padding-top: calc(var(--dp-section) + 110px); }
	.dp-about__grid,
	.dp-experience__grid,
	.dp-contact__grid { grid-template-columns: 1fr; }
	.dp-about__media { max-width: 560px; margin: 0 auto; }

	.dp-pillars { grid-template-columns: 1fr; margin-top: 56px; }

	.dp-company,
	.dp-company:nth-of-type(even) { grid-template-columns: 1fr; }
	.dp-company:nth-of-type(even) .dp-company__media { order: 0; }
	.dp-company__media { min-height: 280px; }

	.dp-service-grid { grid-template-columns: repeat(2, 1fr); }
	.dp-experience__gallery { grid-template-rows: 200px 200px; }
}

/* ---------- WordPress admin bar ---------- */
@media (max-width: 782px) {
	.admin-bar .dp-header { top: 46px; }
}
@media (max-width: 600px) {
	.admin-bar .dp-header { top: 0; }
}

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
	:root { --dp-gutter: 16px; --dp-section: 64px; --dp-radius: 14px; }
	body { font-size: 15.5px; }

	.dp-topbar__contact a:nth-child(2) { display: none; }
	.dp-topbar__inner { min-height: 38px; }

	.dp-brand__name { font-size: 20px; }
	.dp-brand__role { font-size: 10px; letter-spacing: .08em; }
	.dp-brand__mark { width: 40px; height: 40px; font-size: 17px; }

	.dp-title { font-size: 32px; }
	.dp-lead { font-size: 16.5px; }
	.dp-section__head { margin-bottom: 40px; }

	.dp-btn { padding: 14px 22px; white-space: normal; }
	.dp-hero__actions .dp-btn,
	.dp-cta__actions .dp-btn { width: 100%; }
	.dp-hero__lead { font-size: 16.5px; }
	.dp-hero__companies { flex-direction: column; align-items: stretch; }
	.dp-hero__companies a { justify-content: flex-start; }
	.dp-hero__portrait { max-width: 240px; }
	.dp-hero__portrait::before { inset: -10px 10px 10px -10px; }
	.dp-hero__badge { font-size: 12.5px; padding: 10px 14px; }
	.dp-hero__badge strong { display: inline; font-size: 14px; }

	.dp-stats dt { font-size: 34px; }
	.dp-stats > div { padding: 22px 12px; }
	.dp-stats dd { font-size: 12.5px; }

	.dp-about__media { padding: 0 30px 50px 0; }
	.dp-about__img--small { border-width: 5px; }
	.dp-quote { padding: 20px; }
	.dp-quote p { font-size: 19px; }
	.dp-pillar { padding: 26px 22px; }

	.dp-company__body { padding: 30px 22px; }
	.dp-company__name { font-size: 26px; }
	.dp-company__media { min-height: 220px; }
	.dp-company__stats { gap: 8px; }
	.dp-company__stats > div { padding: 10px 6px; }
	.dp-company__stats dt { font-size: 21px; }
	.dp-company__stats dd { font-size: 11.5px; }
	.dp-company__actions .dp-btn { flex: 1 1 100%; }

	.dp-program-grid { grid-template-columns: 1fr; }
	.dp-program:first-child { grid-column: auto; }
	.dp-program a { min-height: 300px; }

	.dp-tabs { border-radius: 16px; width: 100%; }
	.dp-tab { flex: 1 1 100%; border-radius: 12px; padding: 11px 14px; }
	.dp-chips { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; width: 100%; padding-bottom: 6px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
	.dp-chip { flex-shrink: 0; }

	.dp-course-grid { grid-template-columns: 1fr; }
	.dp-course { padding: 22px; }
	.dp-course__title { font-size: 21px; }

	.dp-service-grid { grid-template-columns: 1fr; }
	.dp-digital__actions,
	.dp-digital__actions .dp-btn { width: 100%; }

	.dp-features li { gap: 14px; }
	.dp-features__icon { width: 46px; height: 46px; }
	.dp-experience__gallery { grid-template-rows: 170px 150px; gap: 10px; }

	.dp-cta { padding: 76px 0; }

	.dp-contact__card { padding: 26px 18px; }
	.dp-form__row { grid-template-columns: 1fr; gap: 0; }
	.dp-form__footer .dp-btn { width: 100%; }
	.dp-contact__social a { flex: 1 1 100%; justify-content: center; }

	.dp-post-grid,
	.dp-layout__side { grid-template-columns: 1fr; }
	.post-navigation .nav-links { grid-template-columns: 1fr; }
	.dp-page-hero { padding: 60px 0 54px; }

	.dp-footer { padding-top: 64px; }
	.dp-footer__grid { grid-template-columns: 1fr; gap: 36px; padding-bottom: 40px; }
	.dp-footer__bottom { flex-direction: column; text-align: center; padding-bottom: 96px; }

	.dp-whatsapp-float { right: 16px; bottom: 16px; width: 54px; height: 54px; }
	.dp-to-top { right: 21px; bottom: 82px; }

	.alignleft,
	.alignright { float: none; margin: 1em auto; }
}

/* ---------- Very small phones ---------- */
@media (max-width: 380px) {
	.dp-brand__role { display: none; }
	.dp-topbar__contact a span { font-size: 12.5px; }
	.dp-stats dt { font-size: 28px; }
}
