/*
Theme Name: Vedamrut Blocks
Theme URI: https://vedamrutfarms.com
Author: Prasad Rode
Description: Premium block theme for Vedamrut Farms Gir cow ghee. Every page is built from normal WordPress blocks, so text, photos, buttons, the header and the footer can be edited in the WordPress editor.
Version: 2.0.0
Requires at least: 6.6
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: vedamrut-blocks
*/

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; }
.wp-site-blocks > * + * { margin-block-start: 0; }
body p, body h1, body h2, body h3, body figure { margin: 0; }
body .wp-block-image { margin: 0; }
body .wp-block-image img { display: block; width: 100%; height: auto; }
body .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 14px; }
body .wp-block-button__link { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
:where(body) a:focus-visible, :where(body) button:focus-visible, :where(body) input:focus-visible, :where(body) select:focus-visible, :where(body) textarea:focus-visible { outline: 2px solid #D4A84B; outline-offset: 2px; }
.vf-marathi, .vf-marathi * { font-family: 'Tiro Devanagari Marathi', serif !important; }

/* Button styles (choose them in the block sidebar under Styles) */
body .wp-block-button.is-style-vf-gold .wp-block-button__link { background: #D4A84B; color: #1E0F06; }
body .wp-block-button.is-style-vf-outline .wp-block-button__link { background: transparent; color: #1E0F06; border: 1px solid #1E0F06; }
body .wp-block-button.is-style-vf-outline-light .wp-block-button__link { background: transparent; color: #FAF5EA; border: 1px solid #A8957A; }
body .wp-block-button .wp-block-button__link:hover { opacity: .9; }

/* ---------- Sections ---------- */
.vf-section { position: relative; padding: 128px 24px; }
.vf-section.is-panel { background: #F2E9D6; }
.vf-section.is-dark { background: #1E0F06; color: #F2E9D6; }
.vf-section.is-dark h1, .vf-section.is-dark h2, .vf-section.is-dark h3 { color: #FFF6E3; }
.vf-section.is-tight { padding: 96px 24px 104px; }
.vf-wrap { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; gap: 40px; position: relative; z-index: 1; }
.vf-wrap.is-narrow { max-width: 820px; }
.vf-stack { display: flex; flex-direction: column; gap: 16px; }
.vf-stack.is-tight { gap: 10px; max-width: 680px; }
.vf-stack.is-center { align-items: center; text-align: center; margin: 0 auto; }
.vf-split { display: flex; flex-wrap: wrap; gap: 48px; align-items: center; }
.vf-split.is-top { align-items: flex-start; gap: 56px; }
.vf-split > * { flex: 1 1 420px; min-width: 0; }

/* Text */
.vf-eyebrow { font-size: 12px; letter-spacing: 4px; text-transform: uppercase; color: #8A6420; font-weight: 500; }
.is-dark .vf-eyebrow, .vf-hero .vf-eyebrow, .vf-banner .vf-eyebrow, .vf-bg .vf-eyebrow { color: #D4A84B; }
body h1.wp-block-heading { font-size: 58px; line-height: 1.05; letter-spacing: -.5px; }
body h2.wp-block-heading { font-size: 48px; line-height: 1.1; letter-spacing: -.5px; }
body h3.wp-block-heading { font-size: 26px; }
.vf-lead { color: #6B5A44; font-size: 17px; }
.vf-muted { color: #6B5A44; }
.is-dark .vf-lead, .is-dark .vf-muted { color: #CDB894; }
.vf-link { font-weight: 500; }

/* Background photo with dark overlay (the photo is an Image block you can replace) */
.vf-bg { position: relative; overflow: hidden; background: #1E0F06; color: #FAF5EA; }
.vf-bg > .wp-block-image.vf-bg-img { position: absolute; inset: 0; z-index: 0; }
.vf-bg > .wp-block-image.vf-bg-img img { width: 100%; height: 100%; object-fit: cover; }
.vf-bg::after { content: ""; position: absolute; inset: 0; z-index: 0; background: rgba(30,15,6,.78); pointer-events: none; }
.vf-bg h1, .vf-bg h2 { color: #FFFFFF !important; }
.vf-bg p { color: #E3D2B0; }

/* ---------- Home hero ---------- */
.vf-hero { padding: 120px 24px 112px; }
.vf-hero::after { background: linear-gradient(90deg, rgba(30,15,6,.94) 0%, rgba(30,15,6,.82) 45%, rgba(30,15,6,.45) 100%); }
.vf-hero .vf-split { gap: 32px; }
.vf-hero .vf-split > * { flex-basis: 440px; }
.vf-hero h1.wp-block-heading { font-size: 76px; line-height: 1; letter-spacing: -1px; font-weight: 400; color: #FAF5EA !important; }
.vf-hero h1 em { font-style: italic; color: #D4A84B; }
.vf-hero .vf-hero-text { display: flex; flex-direction: column; gap: 18px; }
.vf-hero .vf-hero-text > p:not(.vf-marathi):not(.vf-trust) { font-size: 18px; font-weight: 300; color: #E3D2B0; max-width: 480px; }
.vf-hero .vf-marathi { font-size: 20px; color: #D4A84B; }
.vf-trust { font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: #CDB894 !important; margin-top: 18px !important; padding-top: 22px; border-top: 1px solid #4A3220; }
.vf-hero-art { display: flex; justify-content: center; }
.vf-hero-art img { max-width: 560px; filter: drop-shadow(0 30px 50px rgba(0,0,0,.55)); }

/* Marathi band */
.vf-band { background: #1E0F06; border-top: 1px solid #3A2614; padding: 34px 24px; }
.vf-band .vf-band-row { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 48px; text-align: center; }
.vf-band .vf-band-item p:first-child { font-family: 'Tiro Devanagari Marathi', serif; font-size: 22px; color: #D4A84B; }
.vf-band .vf-band-item p:last-child { font-size: 13px; letter-spacing: 1px; color: #CDB894; }

/* Feature cards */
.vf-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.vf-card { display: flex; gap: 14px; align-items: center; background: #FFFFFF; border: 1px solid #E3D6BC; border-radius: 2px; padding: 18px 20px; }
.is-dark .vf-card { background: transparent; border-color: #3A2614; }
.vf-card p { font-size: 17px; font-weight: 500; }
.is-dark .vf-card p { color: #FFFFFF; }
.vf-icon { width: 48px; height: 48px; flex: none; border-radius: 50%; border: 1px solid #E3D6BC; display: inline-flex; align-items: center; justify-content: center; color: #8A6420; }
.is-dark .vf-icon { border-color: #4A3220; color: #D4A84B; }
.vf-icon svg { width: 24px; height: 24px; }

/* Quality icons */
.vf-badges { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; }
.vf-badge { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.vf-badge .vf-icon { width: 76px; height: 76px; border-color: #D4A84B; }
.vf-badge .vf-icon svg { width: 32px; height: 32px; }
.vf-badge p { font-size: 15px; font-weight: 500; }
.vf-fssai { align-self: flex-start; background: #FFFFFF; border: 1px solid #E3D6BC; border-radius: 2px; padding: 14px 18px; }
.vf-fssai strong { color: #8A6420; font-weight: 500; margin-right: 8px; }

/* Nutrition table */
.vf-table { background: #FFFFFF; border: 1px solid #E3D6BC; border-radius: 2px; overflow: hidden; }
.vf-table table { width: 100%; border-collapse: collapse; font-size: 15px; }
.vf-table caption { text-align: left; padding: 16px 14px 10px; font-weight: 500; font-size: 17px; }
.vf-table thead tr { background: #F2E9D6; }
.vf-table th { text-align: left; padding: 9px 14px; font-weight: 500; }
.vf-table th:last-child, .vf-table td:last-child { text-align: right; }
.vf-table td { padding: 9px 14px; border-top: 1px solid #E3D6BC; }
.vf-table td:last-child { font-weight: 500; }
.vf-table .vf-note { padding: 10px 14px 14px; font-size: 13px; color: #6B5A44; }

/* Thali banner */
.vf-banner { min-height: 520px; display: flex; align-items: flex-end; padding: 64px 24px; }
.vf-banner::after { background: linear-gradient(180deg, rgba(30,15,6,.05) 30%, rgba(30,15,6,.88) 100%); }
.vf-banner .vf-wrap { width: 100%; gap: 12px; }
.vf-banner p.vf-quote { max-width: 760px; font-family: Fraunces, Georgia, serif; font-weight: 600; font-size: 46px; line-height: 1.12; color: #FFF6E3; }

/* Pack cards */
.vf-packs { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 26px; }
.vf-pack { background: #FFFFFF; border: 1px solid #E3D6BC; border-radius: 2px; overflow: hidden; display: flex; flex-direction: column; }
.vf-pack > .wp-block-image { background: #F2E9D6; height: 280px; padding: 18px; display: flex; align-items: center; justify-content: center; }
.vf-pack > .wp-block-image img { width: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.vf-pack-body { padding: 22px 24px 26px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.vf-pack-body .vf-eyebrow { letter-spacing: 1px; font-size: 13px; }
.vf-pack-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto !important; padding-top: 12px; }
.vf-price { font-size: 20px; font-weight: 500; }

/* Farm story (dark photo section) */
.vf-photo-frame img { aspect-ratio: 4 / 5; object-fit: cover; border: 1px solid #D4A84B; padding: 10px; max-width: 440px; }

/* Order panel */
.vf-cta-wrap { padding: 88px 24px; }
.vf-cta { max-width: 1200px; margin: 0 auto; background: #1E0F06; color: #FAF5EA; border: 1px solid #D4A84B; outline: 1px solid #1E0F06; outline-offset: 6px; padding: 72px 64px; display: flex; flex-wrap: wrap; gap: 28px; align-items: center; justify-content: space-between; }
.vf-cta > .vf-stack { flex: 1 1 380px; gap: 8px; }
.vf-cta h2.wp-block-heading { color: #FFFFFF; font-size: 38px; }
.vf-cta p { color: #CDB894; font-size: 17px; }

/* About hero */
.vf-page-hero { padding: 136px 24px; text-align: center; }
.vf-page-hero .vf-wrap { max-width: 860px; align-items: center; gap: 14px; }
.vf-page-hero h1.wp-block-heading { font-size: 64px; }
.vf-page-hero .vf-marathi { font-size: 22px; color: #D4A84B !important; }

/* Products */
.vf-product-media { display: flex; flex-direction: column; gap: 14px; }
.vf-product-media > .wp-block-image { background: #F2E9D6; border: 1px solid #E3D6BC; padding: 32px; }
.vf-thumbs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.vf-thumbs .wp-block-image { height: 190px; background: #F2E9D6; overflow: hidden; }
.vf-thumbs .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
.vf-thumbs .wp-block-image.is-contain img { object-fit: contain; padding: 10px; }
.vf-product-info { display: flex; flex-direction: column; gap: 20px; }
.vf-product-info .vf-marathi { font-size: 22px; color: #8A6420; }
.vf-sizes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.vf-size { border: 1px solid #E3D6BC; border-radius: 2px; padding: 14px; text-align: center; background: #FFFFFF; }
.vf-size.is-featured { border: 2px solid #8A6420; }
.vf-size p:first-child { font-weight: 500; }
.vf-size p:last-child { font-size: 14px; color: #6B5A44; }
.vf-specs dl { margin: 6px 0 0; display: grid; grid-template-columns: 140px 1fr; gap: 10px 16px; font-size: 15px; border-top: 1px solid #E3D6BC; padding-top: 20px; }
.vf-specs dt { color: #6B5A44; }
.vf-specs dd { margin: 0; font-weight: 500; }
.vf-uses { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
.vf-use { display: flex; flex-direction: column; gap: 18px; }
.vf-use .wp-block-image img { aspect-ratio: 3 / 4; object-fit: cover; border-radius: 4px; }
.vf-use-text { border-top: 1px solid #5A3A1E; padding-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.vf-use h3.wp-block-heading { font-size: 22px; font-weight: 600; color: #FFF6E3; }
.vf-use p { font-size: 15px; color: #CDB894; }
.vf-split-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px; }
.vf-split-head > p { max-width: 380px; color: #CDB894; }
.vf-faq { border-top: 1px solid #E3D6BC; }
.vf-faq-item { border-bottom: 1px solid #E3D6BC; padding: 20px 0; display: flex; flex-direction: column; gap: 6px; }
.vf-faq-item p:first-child { font-size: 17px; font-weight: 500; }
.vf-faq-item p:last-child { color: #6B5A44; }

/* Gallery */
body .wp-block-gallery.vf-gallery { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); grid-auto-rows: 250px; gap: 18px !important; }
body .wp-block-gallery.vf-gallery > .wp-block-image { width: 100% !important; height: 100%; margin: 0 !important; border-radius: 2px; overflow: hidden; background: #F2E9D6; }
body .wp-block-gallery.vf-gallery > .wp-block-image img { width: 100% !important; height: 100% !important; object-fit: cover; }
body .wp-block-gallery.vf-gallery > .wp-block-image:nth-child(1),
body .wp-block-gallery.vf-gallery > .wp-block-image:nth-child(4) { grid-row: span 2; }
body .wp-block-gallery.vf-gallery > .wp-block-image:nth-child(7) { grid-column: span 2; }

/* Contact */
.vf-contact-list { display: flex; flex-direction: column; gap: 12px; }
.vf-contact { display: flex; gap: 14px; align-items: center; background: #F2E9D6; border-radius: 2px; padding: 14px 18px; }
.vf-contact p { font-size: 15px; color: #6B5A44; }
.vf-contact p strong { display: block; color: #1E0F06; font-weight: 500; font-size: 16px; }
.vf-contact a { color: inherit; text-decoration: none; }
.vf-form { background: #FFFFFF; border: 1px solid #E3D6BC; border-top: 2px solid #D4A84B; border-radius: 2px; padding: 36px; display: flex; flex-direction: column; gap: 18px; }
.vf-form h2 { margin: 0; font-family: Fraunces, Georgia, serif; font-weight: 500; font-size: 30px; }
.vf-form .vf-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.vf-form label { display: flex; flex-direction: column; gap: 6px; font-size: 15px; font-weight: 500; }
.vf-form input, .vf-form select, .vf-form textarea { font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid #CDBB98; border-radius: 2px; background: #FAF5EA; min-height: 48px; color: #1E0F06; width: 100%; }
.vf-form textarea { resize: vertical; }
.vf-form button { font: inherit; background: #1E0F06; color: #FAF5EA; border: 0; padding: 14px 26px; border-radius: 2px; font-weight: 500; font-size: 17px; min-height: 50px; cursor: pointer; }
.vf-hp { position: absolute; left: -9999px; }
.vf-notice { margin: 0; padding: 12px 16px; border: 1px solid #E3D6BC; background: #F2E9D6; font-size: 15px; }
.vf-notice.is-error { border-color: #B4472A; color: #7A2410; background: #FBEDE7; }
.vf-map iframe { display: block; width: 100%; height: 380px; border: 1px solid #E3D6BC; border-radius: 2px; }
.vf-map-wrap { padding: 0 24px 88px; }
.vf-map-wrap .vf-map { max-width: 1200px; margin: 0 auto; }

/* ---------- Header ---------- */
.vf-topbar { background: #1E0F06; color: #F2E9D6; font-size: 14px; padding: 8px 24px; }
.vf-topbar .vf-row { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 20px; }
.vf-topbar a { color: #D4A84B; text-decoration: none; font-weight: 500; }
.vf-header { background: #FAF5EA; border-bottom: 1px solid #E3D6BC; padding: 10px 24px; position: relative; z-index: 20; }
.vf-header .vf-row { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.vf-brand { display: flex; align-items: center; gap: 12px; }
.vf-brand .wp-block-image img { width: 64px; height: 64px; object-fit: contain; }
.vf-brand p:first-child { font-family: Fraunces, Georgia, serif; font-size: 23px; font-weight: 500; line-height: 1.1; }
.vf-brand p:first-child a { color: #1E0F06; text-decoration: none; }
.vf-brand p:last-child { font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: #8A6420; font-weight: 500; line-height: 1.1; }
.vf-nav { font-size: 16px; font-weight: 500; gap: 6px 26px; }
.vf-nav .wp-block-navigation-item a { color: #1E0F06; text-decoration: none; padding: 4px 0; border-bottom: 1px solid transparent; }
.vf-nav .current-menu-item > a, .vf-nav .wp-block-navigation-item a[aria-current="page"] { color: #8A6420; border-bottom-color: #8A6420; }
.vf-nav .wp-block-navigation__responsive-container.is-menu-open { background: #FAF5EA; padding: 24px; }

/* ---------- Footer ---------- */
.vf-footer { background: #1E0F06; color: #F2E9D6; padding: 56px 24px 26px; }
.vf-footer .vf-wrap { gap: 36px; }
.vf-footer-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 32px; }
.vf-footer-col { display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.vf-footer-col h3.wp-block-heading { font-family: Poppins, system-ui, sans-serif; font-size: 15px; font-weight: 600; color: #FFFFFF; margin-bottom: 4px; letter-spacing: 0; }
.vf-footer a { color: #F2E9D6; }
.vf-footer .wp-block-image img { width: 96px; height: 96px; object-fit: contain; }
.vf-footer-bottom { border-top: 1px solid #3A2614; padding-top: 18px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: 14px; color: #A8957A; }
.vf-social { display: flex; gap: 10px; }
.vf-social a { color: #F2E9D6; width: 44px; height: 44px; border: 1px solid #4A3220; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.vf-wa-float { position: fixed; right: 24px; bottom: 24px; z-index: 50; width: 60px; height: 60px; border-radius: 50%; background: #1E0F06; color: #D4A84B; border: 1px solid #D4A84B; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 30px rgba(30,15,6,.35); }

/* ---------- Phones ---------- */
@media (max-width: 782px) {
  .vf-section, .vf-page-hero { padding-top: 72px; padding-bottom: 72px; }
  .vf-hero { padding: 72px 24px 64px; }
  body h1.wp-block-heading, .vf-hero h1.wp-block-heading, .vf-page-hero h1.wp-block-heading { font-size: 40px; }
  body h2.wp-block-heading { font-size: 34px; }
  .vf-banner p.vf-quote { font-size: 30px; }
  .vf-split > *, .vf-hero .vf-split > *, .vf-cta > .vf-stack { flex-basis: 100%; }
  .vf-cards, .vf-packs { grid-template-columns: 1fr; }
  .vf-cta { padding: 40px 24px; }
  .vf-form { padding: 24px; }
  body .wp-block-gallery.vf-gallery > .wp-block-image:nth-child(7) { grid-column: auto; }
  .vf-specs dl { grid-template-columns: 1fr; gap: 2px; }
  .vf-specs dd { margin-bottom: 10px; }
}

/* Icon sizes */
.vf-social svg { width: 20px; height: 20px; }
.vf-wa-float svg { width: 28px; height: 28px; }