/*
Theme Name:   SnapCrea Storefront
Theme URI:    https://snapcrea.dev.pikali.fr
Description:  Theme of the SnapCrea demonstration shop: SnapCrea brand (logo, blue / cyan / night palette, Sora + Inter), French and English.
Author:       Pikali
Author URI:   https://pikali.fr
Template:     storefront
Version:      1.0.0
Requires PHP: 7.4
License:      GPL-2.0-or-later
Text Domain:  snapcrea-storefront
*/

/* ---------- Brand tokens ---------- */
@font-face { font-family: "Inter"; src: url("fonts/inter.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Sora"; src: url("fonts/sora.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
:root {
	--snc-blue: #2563EB;
	--snc-blue-deep: #1E3A8A;
	--snc-cyan: #06B6D4;
	--snc-green: #22C55E;
	--snc-night: #0F172A;
	--snc-night-2: #172554;
	--snc-mist: #F8FAFC;
	--snc-line: #E2E8F0;
	--snc-ink: #0F172A;
	--snc-text: #334155;
	--snc-muted: #64748B;
	--snc-radius: 18px;
	--snc-grad: linear-gradient(135deg, #2563EB 0%, #06B6D4 100%);
}
body { font-family: "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif; color: var(--snc-text); background: var(--snc-mist); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, .site-title, .woocommerce-loop-product__title, .product_title { font-family: "Sora", "Inter", Arial, sans-serif; color: var(--snc-ink); letter-spacing: -.02em; }
a { color: var(--snc-blue); }
a:hover, a:focus { color: var(--snc-blue-deep); }
::selection { background: #BFDBFE; }

/* ---------- Buttons ---------- */
.snc-btn, button, input[type=submit], .button, .added_to_cart, .wc-block-components-button {
	font-family: "Inter", Arial, sans-serif; font-weight: 600; border-radius: 12px !important;
}
.snc-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; padding: .85em 1.35em; background: var(--snc-blue); color: #fff !important; text-decoration: none !important; border: 1px solid transparent; transition: transform .15s, box-shadow .2s, background .2s; box-shadow: 0 10px 24px -12px rgba(37,99,235,.8); }
.snc-btn:hover { background: var(--snc-blue-deep); transform: translateY(-1px); }
.snc-btn--big { padding: 1em 1.7em; font-size: 1.05em; }
.snc-btn--small { padding: .55em 1em; font-size: .9em; box-shadow: none; }
.snc-btn--ghost { background: transparent; border-color: rgba(255,255,255,.35); box-shadow: none; }
.snc-btn--ghost:hover { background: rgba(255,255,255,.08); }
.snc-cta .snc-btn--ghost, .snc-examples .snc-btn--ghost { color: var(--snc-ink) !important; border-color: var(--snc-line); }
button, input[type=submit], .button, .added_to_cart { background: var(--snc-blue); }
button.alt, .button.alt, .single_add_to_cart_button { background: var(--snc-night) !important; }

/* ---------- Header ---------- */
.site-header { background: rgba(255,255,255,.94) !important; border-bottom: 1px solid var(--snc-line); padding-top: 1em !important; backdrop-filter: blur(10px); }
.site-header .col-full { display: flex; flex-wrap: wrap; align-items: center; gap: 0 1.5em; }
.site-header .site-branding { margin: 0 auto 0 0 !important; width: auto !important; float: none !important; padding: .4em 0; }
.snc-logo { display: inline-flex; align-items: center; gap: .6em; text-decoration: none !important; }
.snc-logo__word { font-family: "Sora", Arial, sans-serif; font-weight: 800; font-size: 1.45rem; letter-spacing: -.04em; color: var(--snc-ink); }
.snc-logo__word b { color: var(--snc-blue); font-weight: 800; }
.snc-logo--light .snc-logo__word { color: #fff; }
.snc-logo--light .snc-logo__word b { color: #67E8F9; }
.snc-mark { flex: 0 0 auto; border-radius: 10px; }
.snc-header-actions { display: flex; align-items: center; gap: 1em; order: 3; }
.site-header .site-header-cart { order: 4; width: auto !important; float: none !important; margin: 0 !important; }
.storefront-primary-navigation { background: transparent !important; order: 2; width: auto; clear: none; }
.storefront-primary-navigation .col-full { padding: 0 !important; }
.main-navigation ul.menu > li > a, .main-navigation ul.nav-menu > li > a { color: var(--snc-ink) !important; font-weight: 500; padding: 1em .9em; }
.main-navigation ul.menu > li > a:hover { color: var(--snc-blue) !important; }
.snc-lang { display: inline-flex; border: 1px solid var(--snc-line); border-radius: 999px; padding: 3px; background: #fff; }
.snc-lang a, .snc-lang span { padding: .25em .7em; border-radius: 999px; font-size: .8em; font-weight: 700; text-decoration: none; color: var(--snc-muted); }
.snc-lang .is-current { background: var(--snc-night); color: #fff; }
.snc-lang a:hover { color: var(--snc-blue); }
@media (max-width: 767px) {
	.snc-header-actions { width: 100%; justify-content: space-between; padding: .4em 0 .8em; }
	.snc-logo__word { font-size: 1.25rem; }
}

/* ---------- Landing ---------- */
.snc-home .site-header { margin-bottom: 0 !important; }
#trp-floater-ls, .trp-language-switcher.trp-switcher-position-bottom, .trp-floating-switcher { display: none !important; } /* Our own FR / EN switch is in the header. */
.snc-home .site-content { padding: 0; }
.snc-home .site-content > .col-full { max-width: none; padding: 0; margin: 0; }
.snc-home .storefront-breadcrumb { display: none; }
.snc-wrap { max-width: 1180px; margin: 0 auto; padding: 0 1.5rem; }
.snc-hero { background: radial-gradient(1200px 500px at 85% -10%, rgba(6,182,212,.35), transparent 60%), linear-gradient(160deg, var(--snc-night) 0%, var(--snc-night-2) 100%); color: #CBD5E1; padding: 5rem 0 4.5rem; overflow: hidden; }
.snc-hero__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 3rem; align-items: center; }
.snc-eyebrow { display: inline-block; margin: 0 0 1.2rem; padding: .35em .9em; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15); color: #67E8F9; font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.snc-hero h1 { color: #fff; font-size: clamp(2.4rem, 5.4vw, 4.4rem); line-height: 1.02; font-weight: 800; margin: 0 0 1.2rem; }
.snc-hero h1 span { background: var(--snc-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.snc-lead { font-size: 1.15rem; line-height: 1.7; max-width: 38rem; margin: 0 0 2rem; }
.snc-hero__cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: 1.4rem; }
.snc-hero__note { font-size: .9rem; color: #94A3B8; margin: 0; }
.snc-hero__phone { display: flex; justify-content: center; }
.snc-phone { width: 280px; border-radius: 40px; padding: 12px; background: #0B1220; box-shadow: 0 40px 80px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.08) inset; transform: rotate(3deg); }
.snc-phone img { display: block; width: 100%; height: 560px; object-fit: cover; object-position: top; border-radius: 30px; }

.snc-h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.15; margin: 0 0 .6rem; text-align: center; }
.snc-sub { text-align: center; color: var(--snc-muted); max-width: 44rem; margin: 0 auto 2.2rem; }
.snc-flow, .snc-features, .snc-examples, .snc-trades { padding: 5rem 0; }
.snc-flow { background: #fff; }
.snc-steps { list-style: none; margin: 2.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; counter-reset: none; }
.snc-steps li { position: relative; margin: 0; padding: 1.6rem 1.4rem; border-radius: var(--snc-radius); background: var(--snc-mist); border: 1px solid var(--snc-line); }
.snc-steps__n { display: inline-flex; width: 2.4rem; height: 2.4rem; align-items: center; justify-content: center; border-radius: 12px; background: var(--snc-grad); color: #fff; font-weight: 800; font-family: "Sora", Arial, sans-serif; margin-bottom: 1rem; }
.snc-steps li:last-child .snc-steps__n { background: var(--snc-green); }
.snc-steps h3 { font-size: 1.15rem; margin: 0 0 .4rem; }
.snc-steps p { margin: 0; color: var(--snc-muted); font-size: .95rem; line-height: 1.6; }
.snc-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; margin-top: 2.5rem; }
.snc-cards article { background: #fff; border: 1px solid var(--snc-line); border-radius: var(--snc-radius); padding: 1.6rem; transition: transform .2s, box-shadow .2s; }
.snc-cards article:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -24px rgba(15,23,42,.35); }
.snc-cards h3 { font-size: 1.1rem; margin: 0 0 .5rem; }
.snc-cards h3::before { content: ""; display: block; width: 36px; height: 4px; border-radius: 4px; background: var(--snc-grad); margin-bottom: 1rem; }
.snc-cards p { margin: 0; color: var(--snc-muted); line-height: 1.65; }
.snc-examples { background: #fff; }
.snc-examples ul.products { margin-top: 1rem; }
.snc-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; }
.snc-tags li { margin: 0; padding: .6em 1.1em; border-radius: 999px; background: #fff; border: 1px solid var(--snc-line); font-weight: 500; color: var(--snc-ink); }
.snc-cta { padding: 0 0 5rem; }
.snc-cta__box { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 2.5rem; border-radius: 26px; background: var(--snc-grad); color: #EFF6FF; }
.snc-cta__box h2 { color: #fff; margin: 0 0 .3rem; font-size: 1.9rem; }
.snc-cta__box p { margin: 0; }
.snc-cta__actions { display: flex; flex-wrap: wrap; gap: .8rem; }
.snc-cta__box .snc-btn { background: var(--snc-night); box-shadow: none; }
.snc-cta__box .snc-btn--ghost { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.4); color: #fff !important; }
@media (max-width: 900px) {
	.snc-hero__grid { grid-template-columns: 1fr; }
	.snc-hero__phone { display: none; }
	.snc-steps, .snc-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
	.snc-steps, .snc-cards { grid-template-columns: 1fr; }
	.snc-hero { padding: 3.5rem 0; }
}
@media (prefers-reduced-motion: reduce) { .snc-btn, .snc-cards article { transition: none; } }

/* ---------- Shop pages ---------- */
.site-content { padding-top: 2.5em; }
.storefront-breadcrumb { background: transparent; margin-bottom: 1em; }
ul.products li.product { background: #fff; border: 1px solid var(--snc-line); border-radius: var(--snc-radius); padding: 1rem 1rem 1.4rem !important; transition: box-shadow .2s, transform .2s; }
ul.products li.product:hover { box-shadow: 0 20px 40px -26px rgba(15,23,42,.4); transform: translateY(-2px); }
ul.products li.product img { border-radius: 12px; }
ul.products li.product .woocommerce-loop-product__title { font-size: 1rem; font-weight: 600; }
ul.products li.product .price { color: var(--snc-blue); font-weight: 700; }
.single-product div.product .product_title { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.15; }
.single-product div.product .woocommerce-product-gallery img { border-radius: var(--snc-radius); }
.single-product div.product p.price { color: var(--snc-blue); font-weight: 700; }
.woocommerce-tabs ul.tabs li a { font-weight: 600; }
.snapcrea-note { border-left-color: var(--snc-blue) !important; background: #EFF6FF !important; }
.snapcrea-note__label { color: var(--snc-blue); }
.snapcrea-grid__tile { background: #fff; }
.snapcrea-grid dt { color: var(--snc-muted); }
.snapcrea-link { color: var(--snc-blue); }
.widget-area .widget { background: #fff; border: 1px solid var(--snc-line); border-radius: var(--snc-radius); padding: 1.2rem; }

/* ---------- Demo banner (mu-plugin) ---------- */
.snc-demo-bar { background: var(--snc-night); color: #CBD5E1; font-size: .85rem; text-align: center; padding: .55em 1em; }
.snc-demo-bar b { color: #67E8F9; }
.snc-demo-bar a { color: #fff; font-weight: 600; }

/* ---------- Footer ---------- */
.site-footer { background: var(--snc-night) !important; color: #94A3B8; padding: 3.5rem 0 2rem; }
.snc-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem 2rem; align-items: start; }
.snc-footer__brand p { margin: .8rem 0 0; color: #94A3B8; font-family: "Sora", Arial, sans-serif; font-weight: 600; }
.snc-footer__nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.snc-footer__nav a { color: #fff; text-decoration: none; }
.snc-footer__nav a:hover { color: #67E8F9; }
.snc-footer__legal { grid-column: 1 / -1; margin: 1.5rem 0 0; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); font-size: .85rem; }
.snc-footer__legal a { color: #fff; }
.site-footer .footer-widgets { display: none; }
@media (max-width: 700px) { .snc-footer { grid-template-columns: 1fr; } }

/* ---------- Brand pages ----------
   Storefront orders the brand header itself: logo (1), title (2). The SnapCrea
   page comes after them (3), left-aligned like the rest of the shop. */
.tax-product_brand .woocommerce-products-header { text-align: left !important; padding-bottom: 1em !important; }
.tax-product_brand .woocommerce-products-header .brand-thumbnail { align-self: flex-start !important; max-height: 90px !important; margin: 0 0 .8em !important; }
.tax-product_brand .woocommerce-products-header .woocommerce-products-header__title { text-align: left; margin-bottom: .6em; }
.tax-product_brand .woocommerce-products-header .snapcrea-maker { order: 3; }
.tax-product_brand .snapcrea-maker__head { display: none; }
.tax-product_brand .snapcrea-maker__text { margin-left: 0 !important; } /* WooCommerce already prints the logo above the title. */