/*
Theme Name:   Rapido Child
Theme URI:    https://rapidolabel.com
Description:  Rapido Labels child theme for Kadence. Brand C3 "Field Green & Sunflower": Field Green #18723C, Sunflower #FFCC33 (dark text only), Forest Night #12261B, Warm White #FBF8EC. Fonts: Archivo Black (display) + Inter (UI), self-hosted.
Author:       Rapido Labels
Template:     kadence
Version:      0.2.0
Requires at least: 6.9
Requires PHP: 8.3
Text Domain:  rapido-child
*/

:root {
	--rp-green: #18723C;
	--rp-green-dark: #0F5A2D;
	--rp-sun: #FFCC33;
	--rp-night: #12261B;
	--rp-cream: #FBF8EC;
	--rp-green-on-dark: #7EDB93;
	--rp-border: #EFEAD6;
	--rp-display: "Archivo Black", Inter, system-ui, sans-serif;
	--rp-radius: 16px;
	--rp-wrap: 1240px;
}

body { -webkit-font-smoothing: antialiased; }

/* ---------- Header ---------- */
.site-top-header-wrap .header-html,
.site-top-header-wrap .header-html a,
.mobile-html { color: var(--rp-cream); font-size: 13px; font-weight: 600; letter-spacing: .01em; }
#mobile-header .site-top-header-wrap { background: var(--rp-night); }
.site-header .header-button,
.mobile-header-button-wrap .button { border-radius: 8px; font-weight: 700; }
.site-header .header-cart-button { color: var(--rp-night); }
.header-navigation .header-menu-container > ul > li > a { padding-left: 14px; padding-right: 14px; }
.header-navigation .sub-menu { border-radius: 12px; box-shadow: 0 12px 30px rgba(18,38,27,.14); border: 1px solid var(--rp-border); padding: 6px 0; }
.header-navigation .sub-menu a { font-size: 14px; }

/* ---------- Generic sections ---------- */
.entry-content > .alignfull { margin-top: 0; margin-bottom: 0; }
.entry-content .rp-section, .entry-content .rp-hero, .entry-content .rp-trust, .entry-content .rp-cta { padding-left: 24px !important; padding-right: 24px !important; }
.rp-section { padding-top: 88px; padding-bottom: 88px; }
.rp-section > *, .rp-hero > *, .rp-trust > *, .rp-cta > * { max-width: var(--rp-wrap); margin-left: auto !important; margin-right: auto !important; }
.rp-eyebrow { color: var(--rp-green); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: 13px; margin-bottom: 10px; }
.rp-eyebrow::before { content: ""; display: inline-block; width: 22px; height: 4px; border-radius: 2px; background: var(--rp-sun); margin-right: 10px; vertical-align: middle; }
.rp-lead { font-size: 19px; color: #3F5648; max-width: 640px; }
.rp-section h2, .rp-cta h2 { font-family: var(--rp-display); font-weight: 400; letter-spacing: -.01em; text-transform: uppercase; margin-top: 0; }
.rp-section h2 { margin-bottom: 14px; }

/* Buttons */
.wp-block-button__link { border-radius: 8px; font-weight: 700; padding: 14px 26px; }
.wp-block-button.is-style-accent .wp-block-button__link { background: var(--rp-sun); color: var(--rp-night); }
.wp-block-button.is-style-accent .wp-block-button__link:hover { background: #F2BD1D; color: var(--rp-night); }
.wp-block-button.is-style-dark .wp-block-button__link { background: var(--rp-night); color: #fff; }
.wp-block-button.is-style-dark .wp-block-button__link:hover { background: #000; color: #fff; }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--rp-green); border: 2px solid var(--rp-green); padding: 12px 24px; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--rp-green); color: #fff; }
.wp-block-button.is-style-outline-dark .wp-block-button__link { background: transparent; color: var(--rp-night); border: 2px solid var(--rp-night); padding: 12px 24px; }
.wp-block-button.is-style-outline-dark .wp-block-button__link:hover { background: var(--rp-night); color: #fff; }

/* ---------- Hero ---------- */
.rp-hero { background: var(--rp-cream); padding-top: 72px; padding-bottom: 80px; overflow: hidden; }
.rp-hero-cols { align-items: center !important; gap: 48px !important; }
.rp-hero-title { font-family: var(--rp-display); font-weight: 400; text-transform: uppercase; font-style: italic; letter-spacing: -.01em; line-height: 1.02; font-size: clamp(38px, 5.6vw, 72px); margin: 8px 0 22px; }
.rp-label-hero .rp-hero-title, .rp-hub-hero .rp-hero-title { font-size: clamp(34px, 4.4vw, 58px); }
.rp-hero-title .rp-accent { color: var(--rp-green); }
.rp-hero .wp-block-buttons { margin-top: 26px; gap: 12px; }
.rp-hero-note { font-size: 14px; color: #3F5648; margin-top: 18px; font-weight: 600; }
.rp-hero-art { position: relative; margin: 0 auto; max-width: 420px; }
.rp-hero-art img { width: 100%; height: auto; border-radius: 28%; box-shadow: 0 30px 60px rgba(18,38,27,.25); transform: rotate(-3deg); }
.rp-hero-art::before, .rp-hero-art::after {
	position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center;
	width: 104px; height: 104px; border-radius: 50%; font-family: var(--rp-display); font-size: 19px; text-transform: uppercase;
	outline: 2px dashed currentColor; outline-offset: -8px;
}
.rp-hero-art::before { content: "Fast"; top: -26px; right: -18px; background: var(--rp-night); color: var(--rp-cream); transform: rotate(12deg); }
.rp-hero-art::after { content: "Fresh"; bottom: -24px; left: -22px; background: var(--rp-sun); color: var(--rp-night); transform: rotate(-12deg); }
.rp-hub-hero > * { max-width: 900px; }
.rp-crumbs { font-size: 14px; color: #3F5648; margin-bottom: 0; }
.rp-crumbs a { color: var(--rp-green); }
.rp-specs { list-style: none; padding: 0; margin: 22px 0 0; }
.rp-specs li { position: relative; padding: 7px 0 7px 30px; border-bottom: 1px solid var(--rp-border); }
.rp-specs li::before { content: ""; position: absolute; left: 0; top: 13px; width: 16px; height: 16px; border-radius: 50%; background: var(--rp-green); box-shadow: inset 0 0 0 4px var(--rp-sun); }
.rp-label-photo img { border-radius: var(--rp-radius); box-shadow: 0 20px 50px rgba(18,38,27,.18); outline: 6px solid #fff; }

/* ---------- Trust strip ---------- */
.rp-trust { background: var(--rp-night); padding-top: 30px; padding-bottom: 30px; }
.rp-stats { gap: 24px !important; margin-bottom: 0 !important; }
.rp-stats > .wp-block-column { border-left: 4px solid var(--rp-sun); padding-left: 16px; }
.rp-trust p { margin: 0; color: var(--rp-cream); }
.rp-trust .rp-stat { font-family: var(--rp-display); font-size: 22px; text-transform: uppercase; color: #fff; }
.rp-trust .rp-stat-text { font-size: 15px; opacity: .85; }

/* ---------- Label tiles ---------- */
.rp-types { background: #fff; }
.rp-subhead { margin: 48px auto 18px !important; font-size: 20px; }
.rp-tiles { gap: 22px !important; }
.rp-tiles > * { margin: 0 !important; }
.rp-tiles-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.rp-tile { position: relative; background: #fff; border: 1px solid var(--rp-border); border-radius: var(--rp-radius); overflow: hidden; padding: 0 0 18px; transition: transform .15s ease, box-shadow .15s ease; }
.rp-tile:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(18,38,27,.12); border-color: #d9d2b4; }
.rp-tile .wp-block-image { margin: 0 0 14px; aspect-ratio: 3 / 2; overflow: hidden; background: var(--rp-cream); }
.rp-tile .wp-block-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rp-tile > *:not(.wp-block-image) { padding-left: 18px; padding-right: 18px; }
.rp-tile-title { font-size: 18px !important; margin: 0 0 4px !important; }
.rp-tile-title a { color: var(--rp-night); text-decoration: none; }
.rp-tile-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.rp-tile-title a::before { content: "→"; float: right; color: var(--rp-green); }
.rp-tile-text { font-size: 15px; color: #3F5648; margin: 0; }

/* ---------- How it works ---------- */
.rp-how { background: var(--rp-cream); }
.rp-steps { margin-top: 36px; gap: 22px !important; }
.rp-steps > .wp-block-column { background: #fff; border-radius: var(--rp-radius); padding: 28px; border: 1px solid var(--rp-border); }
.rp-step-num { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var(--rp-green); color: #fff; font-family: var(--rp-display); font-size: 18px; margin-bottom: 14px; box-shadow: 4px 4px 0 var(--rp-sun); }
.rp-steps h3 { margin-top: 0; }

/* ---------- Quality points ---------- */
.rp-quality { background: #fff; }
.rp-points { margin-top: 30px; gap: 28px !important; }
.rp-points > .wp-block-column { border-top: 4px solid var(--rp-green); padding-top: 18px; }
.rp-points h3 { margin-top: 0; font-size: 19px; }
.rp-points p { color: #3F5648; font-size: 16px; }

/* ---------- FAQ ---------- */
.rp-faq { background: var(--rp-cream); }
.rp-faq .wp-block-details { max-width: 900px; margin-left: 0 !important; }
.rp-faq .wp-block-details { background: #fff; border: 1px solid var(--rp-border); border-radius: 12px; padding: 0; margin-top: 12px; }
.rp-faq .wp-block-details summary { cursor: pointer; list-style: none; padding: 18px 56px 18px 22px; font-weight: 700; font-size: 17px; color: var(--rp-night); position: relative; }
.rp-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.rp-faq .wp-block-details summary::after { content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: var(--rp-sun); color: var(--rp-night); display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; }
.rp-faq .wp-block-details[open] summary::after { content: "–"; }
.rp-faq .wp-block-details p { padding: 0 22px 18px; margin: 0; color: #3F5648; }

/* ---------- CTA ---------- */
.rp-cta { background: var(--rp-sun); padding-top: 72px; padding-bottom: 72px; text-align: center; }
.rp-cta h2 { color: var(--rp-night); font-size: clamp(28px, 3.6vw, 44px); margin-bottom: 12px; }
.rp-cta p { color: var(--rp-night); font-size: 18px; max-width: 640px; margin-left: auto !important; margin-right: auto !important; }
.rp-cta .wp-block-buttons { justify-content: center; gap: 12px; margin-top: 24px; }

/* ---------- Footer ---------- */
.site-footer, .site-footer p, .site-footer li { color: var(--rp-cream); }
.site-footer .widget-title { color: var(--rp-sun) !important; font-size: 13px !important; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 14px; }
.site-footer a { color: var(--rp-cream); text-decoration: none; }
.site-footer a:hover { color: var(--rp-sun); text-decoration: underline; }
.site-middle-footer-inner-wrap { padding-top: 56px; padding-bottom: 40px; }
.rp-footer-brand img { width: 220px; height: auto; margin-bottom: 14px; }
.rp-footer-brand p { max-width: 340px; font-size: 15px; opacity: .9; }
.rp-footer-address { font-size: 14px !important; }
.site-footer .rp-footer-links { list-style: none; margin: 0; padding: 0 !important; }
.rp-footer-links li { margin: 0 0 8px; font-size: 15px; }
.site-bottom-footer-wrap .footer-html { font-size: 14px; opacity: .8; }

/* ---------- Responsive ---------- */
@media (max-width: 781px) {
	.rp-section { padding-top: 60px; padding-bottom: 60px; }
	.rp-hero { padding-top: 44px; padding-bottom: 60px; }
	.rp-hero-cols { gap: 40px !important; }
	.rp-hero-art { max-width: 230px; }
	.rp-hero-art::before, .rp-hero-art::after { width: 80px; height: 80px; font-size: 15px; }
	.rp-hero-art::before { right: -8px; }
	.rp-hero-art::after { left: -8px; }
	.rp-lead { font-size: 17px; }
	.rp-stats { display: grid !important; grid-template-columns: 1fr 1fr; }
	.entry-content .rp-section, .entry-content .rp-hero, .entry-content .rp-trust, .entry-content .rp-cta { padding-left: 18px !important; padding-right: 18px !important; }
	.rp-tiles { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
	.rp-tile { padding-bottom: 12px; }
	.rp-tile .wp-block-image { margin-bottom: 10px; }
	.rp-tile > *:not(.wp-block-image) { padding-left: 10px; padding-right: 10px; }
	.rp-tile-title { font-size: 15px !important; }
	.rp-tile-title a::before { display: none; }
	.rp-tile-text { font-size: 13px; }
	.rp-subhead { margin-top: 32px !important; }
	.rp-trust .rp-stat { font-size: 18px; }
	.rp-cta { text-align: left; }
	.rp-cta p { margin-left: 0 !important; }
	.rp-cta .wp-block-buttons { justify-content: flex-start; }
}