/*
 * Strat responsiv peste SimpleFolio (tema are lățimi fixe de 960 px).
 * Pe ecrane late nu schimbă nimic; sub 1000 px totul devine fluid, sub 640 px se reașază pentru telefon.
 */

/* reguli generale (toate ecranele) */
.menu-toggle, .site-name { display: none; }
#footer .footer-contact { clear: both; text-align: center; font-size: 13px; color: #424242; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #d6d6c8; }
#footer .footer-contact a { color: #424242; }
#footer .footer-contact .sep { margin: 0 8px; color: #9a9a8a; }

/* --- până la 1000 px: layout fluid, fără scroll orizontal --- */
@media (max-width: 1000px) {
	html, body { overflow-x: hidden; }
	body { font-size: 15px; line-height: 1.55; }

	#wrapper, #header, #frontpage, .columns, #main .container .fullwidth, #footer { width: auto !important; max-width: 100%; }
	#wrapper { margin: 0; }

	/* antet: meniul și contactul devin bare normale, imaginea cu mașina rămâne dedesubt */
	#header, #frontpage {
		height: auto !important;
		background: #0d0d0d !important;
		display: flex !important;
		flex-direction: column;
	}
	#header #pagenav, #frontpage #pagenav { float: none !important; clear: none !important; margin: 0 !important; order: 1; width: 100%; background: #0d0d0d; }
	.sf-menu { float: none !important; margin: 0 !important; display: flex; flex-wrap: wrap; justify-content: center; }
	.sf-menu li { float: none !important; }
	.sf-menu a { background: none !important; padding: 12px 12px !important; font-size: 13px; letter-spacing: 0.03em; }
	.sf-menu li { font-size: 13px; }
	/* partea de jos a imaginii din antet (cer, mașină), scalată la lățimea ecranului, cu titlul (logo.png) peste ea */
	#header, #frontpage { position: relative; }
	#header::after, #frontpage::after {
		content: ""; display: block; order: 3; width: 100%; aspect-ratio: 960 / 280;
		background: url(images/header.jpg) center bottom / 100% auto no-repeat;
	}
	#frontpage::after { background-image: url(images/header_frontpage.jpg); aspect-ratio: 960 / 250; }
	/* poziționat față de banner (lat cât ecranul: înălțime = 100vw·280/960), nu față de tot antetul, ca să nu urce peste meniul deschis */
	#header #logo, #frontpage #logo { display: block !important; float: none !important; clear: none !important; margin: 0 !important; position: absolute; left: 4vw; bottom: 5vw; width: 38vw; max-width: 266px; z-index: 2; }
	#header #logo img, #frontpage #logo img { width: 100%; height: auto; display: block; }

	/* conținut */
	#main .container { padding: 18px 16px; }
	#main .container .content { width: auto !important; float: none !important; }
	#main .container .sidebar { width: auto !important; margin: 20px 0 0 !important; float: none !important; }
	#main .container .content .title { font-size: 24px; line-height: 1.25; }
	#main .container .content h1 { font-size: 24px; }
	#main .container .content img, .columns img { max-width: 100%; height: auto; }
	#main .container .content iframe { width: 100% !important; max-width: 100%; }
	#main .container .content table { width: 100% !important; max-width: 100%; table-layout: auto; }
	#main .container .content td, #main .container .content th { word-break: break-word; }
	#main .container .content form { margin: 20px 0 !important; }
	#main .container .content form input[type="text"], #main .container .content form input[type="email"], #main .container .content form input[type="tel"],
	#main .container .content form textarea, #main .container .content form select { width: 100%; box-sizing: border-box; font-size: 16px; }
	#main .container .content form input[type="submit"] { width: auto; padding: 10px 18px; font-size: 16px; }

	/* prima pagină */
	/* banda „înscrie-te acum!”: pe desktop e continuarea pozei din antet; pe ecrane mici devine un fundal galben simplu */
	.slogan { height: auto !important; background: linear-gradient(180deg, #ffd54f 0%, #f4b400 100%) !important; padding: 14px 0 10px; overflow: hidden; }
	.slogan .qbutton { float: none !important; display: table; margin: 6px auto 10px !important; }
	.slogan p { max-width: none !important; text-align: center; padding: 4px 16px 0 !important; color: #3b3b3b; text-shadow: none; font-size: 15px; line-height: 1.4; }
	.columns { height: auto !important; display: flex; flex-wrap: wrap; background: #fff; }
	#front-column1, #front-column2, #front-column3, #front-column4 { width: 50% !important; height: auto !important; float: none !important; display: block !important; box-sizing: border-box; padding-bottom: 16px !important; }
	.columns #desc { height: auto !important; }
	.columns img { width: 100%; height: auto; display: block; padding: 0 15px; box-sizing: border-box; }

	/* subsol */
	#footer { width: auto !important; padding: 16px; }
	#footer .footernav, #footer .copyright { float: none !important; width: auto !important; text-align: center; }
	#footer .footernav ul { display: flex; flex-wrap: wrap; justify-content: center; }
	#footer .footernav ul li { float: none !important; }
	#footer .copyright { margin-top: 10px; }
}

/* --- telefon --- */
@media (max-width: 640px) {
	#header, #frontpage { flex-direction: row !important; flex-wrap: wrap; align-items: center; }
	.menu-toggle {
		display: inline-flex; align-items: center; gap: 8px; order: 1; margin: 0 10px 0 auto; padding: 12px 10px;
		background: none; border: 0; color: #fff; font: bold 13px/1 "Trebuchet MS", Arial, sans-serif; text-transform: uppercase; letter-spacing: 0.04em; cursor: pointer;
	}
	.menu-toggle-icon { display: inline-block; width: 22px; }
	.menu-toggle-icon i { display: block; height: 3px; margin: 4px 0; background: #ffcb2d; border-radius: 2px; transition: transform .2s, opacity .2s; }
	#pagenav.is-open ~ .menu-toggle .menu-toggle-icon i:nth-child(2), .menu-toggle[aria-expanded="true"] .menu-toggle-icon i:nth-child(2) { opacity: 0; }
	.menu-toggle[aria-expanded="true"] .menu-toggle-icon i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.menu-toggle[aria-expanded="true"] .menu-toggle-icon i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
	.site-name { display: block; order: 0; padding: 12px 12px; color: #fff; font: bold 13px/1.2 "Trebuchet MS", Arial, sans-serif; text-transform: uppercase; letter-spacing: 0.03em; }
	#header #pagenav, #frontpage #pagenav { order: 2; display: none; border-top: 1px solid #2a2a2a; }
	#header #pagenav.is-open, #frontpage #pagenav.is-open { display: block; }
	.sf-menu { flex-direction: column; }
	.sf-menu li { border-bottom: 1px solid #2a2a2a; }
	.sf-menu a { padding: 14px 16px !important; font-size: 14px; }
	#header::after, #frontpage::after { order: 3; }
	#front-column1, #front-column2, #front-column3, #front-column4 { width: 100% !important; }
	#main .container { padding: 16px 12px; }
	#main .container .content iframe { height: 75vh; min-height: 420px; }
	#main .container .content .title { font-size: 22px; }
	/* pagina de contact: formularul și „acte necesare” sunt într-un tabel cu două coloane → una sub alta */
	.page-id-2 #main .container .content table, .page-id-2 #main .container .content tbody, .page-id-2 #main .container .content tr, .page-id-2 #main .container .content td { display: block; width: 100% !important; box-sizing: border-box; }
	.page-id-2 #main .container .content td { padding: 8px 0 !important; }
	.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea { width: 100% !important; }
}