/*
Theme Name: Derin
Theme URI: https://example.com/derin
Author: Debojyoti Nath
Description: Block theme for Derin — professional painting tools & accessories by Jain Trading Corporation. Includes ready-made Home, About, Expertise and International/Contact page layouts and a built-in enquiry form.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: derin
*/

/* ---------- Base ---------- */
body h1, body h2, body h3, body h4 { color: var(--wp--preset--color--navy); }
.has-text-color :is(h1, h2, h3, h4, h5, h6):not(.has-text-color) { color: inherit; }
:is(.has-navy-background-color, .has-navy-mid-background-color, .has-navy-deep-background-color, .has-red-background-color) a:not(.wp-element-button) { color: inherit; }
.wp-block-image img { border-radius: 6px; }
.derin-logo img { border-radius: 0; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
img { max-width: 100%; height: auto; }

/* ---------- Sections ---------- */
.derin-section { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--70); }
.derin-section.is-compact { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }
.derin-page-hero { padding-top: clamp(56px, 7vw, 80px); padding-bottom: clamp(56px, 7vw, 88px); }

/* ---------- Text styles ---------- */
.is-style-eyebrow,
.is-style-eyebrow-mark {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--red);
}
.is-style-eyebrow-mark { display: flex; align-items: center; gap: 12px; color: var(--wp--preset--color--sky-light); }
.is-style-eyebrow-mark::before {
	content: "";
	flex: none;
	width: 48px;
	height: 12px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='12' viewBox='0 0 48 12'%3E%3Cpath d='M2 7 C10 1 18 11 26 6 S40 2 46 6' stroke='%23D94541' stroke-width='3.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
:is(.is-style-eyebrow, .is-style-eyebrow-mark) + :is(h1, h2, h3) { margin-block-start: 12px; }
.is-style-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.55; }
.is-style-index { font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: 15px; color: var(--wp--preset--color--blue); margin: 0; }
.derin-stat-num { font-family: var(--wp--preset--font-family--heading); font-weight: 800; line-height: 1; margin: 0; }
.derin-stat-label { margin-block-start: 8px !important; font-size: 15px; }

/* ---------- Cards ---------- */
.is-style-card,
.is-style-card-paper {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius);
	padding: 32px 28px;
	box-sizing: border-box;
}
.is-style-card-paper { background: var(--wp--preset--color--paper); }
.is-style-card.has-background, .is-style-card-paper.has-background { border-color: transparent; }
.is-style-topline-sky,
.is-style-topline-red { border-top: 4px solid var(--wp--preset--color--sky); padding-top: 24px; }
.is-style-topline-red { border-top-color: #D94541; }
.is-style-card.is-style-card, .is-style-topline-sky, .is-style-topline-red { min-width: 0; }
:is(.is-style-card, .is-style-card-paper, .is-style-topline-sky, .is-style-topline-red) > * + * { margin-block-start: 10px; }
:is(.is-style-card, .is-style-card-paper, .is-style-topline-sky, .is-style-topline-red) > :is(h2, h3) { margin-block-start: 12px; }
:is(.is-style-card, .is-style-card-paper, .is-style-topline-sky, .is-style-topline-red) > :first-child { margin-block-start: 0; }
.derin-card-ts.is-style-card { border-top: 4px solid var(--wp--preset--color--sky); }
.derin-card-tr.is-style-card { border-top: 4px solid #D94541; }
.derin-chip { border: 1px solid var(--wp--preset--color--line); border-radius: 6px; padding: 20px 22px; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 18px; color: var(--wp--preset--color--navy); margin: 0; }
.derin-chip.is-accent { border: 2px solid var(--wp--preset--color--red); color: var(--wp--preset--color--red-dark); }
.derin-row-item { border-top: 1px solid var(--wp--preset--color--line); padding-top: 24px; padding-bottom: 24px; }
.derin-row-item > * + * { margin-block-start: 8px; }
.derin-row-item > :first-child { margin-block-start: 0; }

/* ---------- Product cards ---------- */
.derin-product > * + * { margin-block-start: 6px; }
.derin-product .wp-block-image { margin-bottom: 10px; }
.derin-product h3 { font-size: 20px; }

/* ---------- Hero & stats ---------- */
.derin-stats { border-top: 1px solid #23476C; }
.derin-stats .derin-stat { padding: 28px 24px 28px 0; border-right: 1px solid #23476C; }
.derin-stats .derin-stat:last-child { border-right: 0; }
@media (max-width: 781px) {
	.derin-stats .derin-stat { border-right: 0; border-bottom: 1px solid #23476C; }
	.derin-stats .derin-stat:last-child { border-bottom: 0; }
}

/* ---------- Lists ---------- */
.is-style-checklist { list-style: none; padding-left: 0; display: grid; gap: 10px; }
.is-style-checklist li { display: flex; gap: 12px; align-items: flex-start; }
.is-style-checklist li::before {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	margin-top: 3px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4 8-9' stroke='%231B6EA8' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
.has-navy-background-color .is-style-checklist li::before,
.has-navy-mid-background-color .is-style-checklist li::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4 8-9' stroke='%238FCBF2' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.is-style-checklist.is-tiles { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.is-style-checklist.is-tiles li { background: var(--wp--preset--color--white); border-radius: 6px; padding: 16px 18px; font-weight: 600; color: var(--wp--preset--color--navy); }

.is-style-steps { list-style: none; padding-left: 0; counter-reset: step; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.is-style-steps li { counter-increment: step; border-top: 3px solid var(--wp--preset--color--sky); padding-top: 16px; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 19px; }
.is-style-steps li::before { content: counter(step, decimal-leading-zero); display: block; font-weight: 800; font-size: 14px; color: var(--wp--preset--color--sky-light); margin-bottom: 6px; }
.is-style-steps li:last-child { border-top-color: #D94541; }
.is-style-steps li:last-child::before { color: #F2A3A0; }

.is-style-numbered-rows { list-style: none; padding-left: 0; counter-reset: row; margin: 0; }
.is-style-numbered-rows li { counter-increment: row; display: flex; gap: 16px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid #23476C; font-size: 18px; }
.is-style-numbered-rows li:last-child { border-bottom: 0; }
.is-style-numbered-rows li::before { content: counter(row, decimal-leading-zero); font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: 14px; color: var(--wp--preset--color--sky-light); }

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline-light .wp-block-button__link { background: transparent; color: #fff; border: 2px solid #fff; padding: 13px 24px; }
.wp-block-button.is-style-outline-light .wp-block-button__link:hover,
.wp-block-button.is-style-outline-light .wp-block-button__link:focus { background: #fff; color: var(--wp--preset--color--navy); }
.wp-block-button.is-style-outline-dark .wp-block-button__link { background: transparent; color: var(--wp--preset--color--navy); border: 2px solid var(--wp--preset--color--navy); padding: 13px 24px; }
.wp-block-button.is-style-outline-dark .wp-block-button__link:hover,
.wp-block-button.is-style-outline-dark .wp-block-button__link:focus { background: var(--wp--preset--color--navy); color: #fff; }
.wp-block-button__link { min-height: 50px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Header ---------- */
.derin-topbar p { margin: 0; }
.derin-header { border-bottom: 1px solid var(--wp--preset--color--line); }
.derin-header .wp-block-navigation a:hover { color: var(--wp--preset--color--blue); }
.derin-header .wp-block-navigation .current-menu-item > a { box-shadow: inset 0 -3px 0 #D94541; }
.derin-header .wp-block-navigation-item__content { padding: 10px 0; }
.derin-logo { margin: 0; }

/* ---------- Footer ---------- */
.derin-footer a { color: #C9D6E3; text-decoration: none; }
.derin-footer a:hover { color: #fff; }
.derin-footer h3 { font-size: 15px; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; }
.derin-footer p { margin-block-start: 10px; }
.derin-footer-bottom { border-top: 1px solid #1F3A55; }
.derin-footer-bottom p { margin: 0; }

/* ---------- Enquiry form ---------- */
.derin-form { background: #fff; border-radius: var(--wp--custom--radius); padding: clamp(24px, 4vw, 40px); display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; box-sizing: border-box; }
.derin-form label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: 15px; color: var(--wp--preset--color--navy); }
.derin-form .is-full { grid-column: 1 / -1; }
.derin-form input[type="text"], .derin-form input[type="email"], .derin-form input[type="tel"], .derin-form select, .derin-form textarea {
	min-height: 48px; box-sizing: border-box; width: 100%; border: 1px solid #B8C6D4; border-radius: 4px; padding: 10px 14px; font: inherit; font-weight: 400; font-size: 16px; color: var(--wp--preset--color--ink); background: #fff;
}
.derin-form textarea { resize: vertical; }
.derin-form :is(input, select, textarea):focus { outline: 2px solid var(--wp--preset--color--blue); outline-offset: 1px; border-color: var(--wp--preset--color--blue); }
.derin-form .derin-check { flex-direction: row; align-items: center; gap: 10px; font-weight: 400; color: var(--wp--preset--color--muted); }
.derin-form .derin-check input { width: 20px; height: 20px; }
.derin-form .derin-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; }
.derin-form button { min-height: 50px; padding: 0 26px; background: var(--wp--preset--color--red); color: #fff; border: 0; border-radius: 4px; font: inherit; font-weight: 700; cursor: pointer; }
.derin-form button:hover, .derin-form button:focus { background: var(--wp--preset--color--red-dark); }
.derin-form .derin-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.derin-notice { grid-column: 1 / -1; padding: 14px 18px; border-radius: 6px; font-weight: 600; margin: 0; }
.derin-notice.is-success { background: #E7F5EC; color: #1D5E36; }
.derin-notice.is-error { background: #FBECEB; color: #8E2724; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* ---------- Layout fixes ---------- */
.wp-block-post-content > .alignfull,
main > .wp-block-post-content { margin-block-start: 0 !important; }
.derin-hero .wp-block-columns { margin-bottom: 0; }
.wp-block-columns.derin-section { margin-bottom: 0; }
.derin-stat-num { font-size: 40px; color: inherit; }
.derin-stat-num.is-small { font-size: 26px; line-height: 1.5; }
.derin-stat-num.is-big { font-size: var(--wp--preset--font-size--stat); }
.derin-stat-num.is-year { font-size: 44px; }
.derin-stats .derin-stat:not(:first-child) { padding-left: 24px; }
@media (max-width: 781px) { .derin-stats .derin-stat:not(:first-child) { padding-left: 0; } }
.derin-badge { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 15px; padding: 10px 16px; border-radius: 4px; margin: 0; }
.derin-badge.is-blue { background: #EAF4FC; color: #0F4F7D; }
.derin-badge.is-red { background: #FBECEB; color: var(--wp--preset--color--red-dark); }
.derin-fact { border: 1px dashed #9FB3C8; border-radius: 6px; padding: 14px 16px; font-size: 15px; color: var(--wp--preset--color--muted); margin: 0; }
.derin-fact strong { color: var(--wp--preset--color--navy); font-family: var(--wp--preset--font-family--heading); }
.derin-quality-grid { background: var(--wp--preset--color--line); border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); overflow: hidden; }
.derin-quality-grid > * > * + * { margin-block-start: 8px; }
.derin-contact-label { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--wp--preset--color--blue); margin-block-start: 22px !important; margin-bottom: 0; }
.derin-contact-value { margin-block-start: 4px !important; }
.is-style-card.has-navy-mid-background-color { border: 0; }