/* NAI Peptides · identidad v2 (basada en la entrega "web"): paleta crema y dorado, Georgia + Arial. */

:root {
	--naip-cream: #fcfaf6;
	--naip-cream-2: #f1e8da;
	--naip-white: #fffdf9;
	--naip-gold: #a9844e;
	--naip-gold-dark: #80632f;
	--naip-ink: #29241e;
	--naip-muted: #7b7367;
	--naip-line: #e5d9c6;
	--naip-radius: 3px;
	--naip-serif: Georgia, "Times New Roman", serif;
	--naip-sans: Arial, Helvetica, sans-serif;
	--naip-wrap: 1280px;
	--naip-btn: linear-gradient(110deg, #b08f5e, #926b37);
	--naip-sand: #f0e4ce;
	--naip-sand-line: #c4ac7b;
}

body { background: var(--naip-cream); color: #302e29; font-family: var(--naip-sans); font-size: 15px; }
h1, h2, h3, h4 { font-family: var(--naip-serif); font-weight: 400; letter-spacing: -.5px; color: var(--naip-ink); }
h4 { font-family: var(--naip-sans); font-weight: 600; letter-spacing: .08em; }
a { color: var(--naip-gold-dark); }
.naip-container { max-width: var(--naip-wrap); padding-left: 24px; padding-right: 24px; }
.naip-eyebrow { font-family: var(--naip-sans); font-size: 11px; letter-spacing: 1.8px; color: #8e713b; font-weight: 400; margin: 0 0 12px; }
.naip-link { font-weight: 400; font-size: 13px; }

/* ---------- Botones ---------- */
/* Efecto hover común: línea inferior que aparece de izquierda a derecha */
.naip-btn, .woocommerce a.button, .woocommerce button.button, .wp-block-button__link { position: relative; overflow: hidden; }
.naip-btn::after,
.woocommerce a.button::after,
.woocommerce button.button::after,
.wp-block-button__link::after {
	content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: currentColor;
	transform: scaleX(0); transform-origin: left; transition: transform .35s ease; pointer-events: none;
}
.naip-btn:hover::after,
.woocommerce a.button:hover::after,
.woocommerce button.button:hover::after,
.wp-block-button__link:hover::after { transform: scaleX(1); }

.naip-btn,
.woocommerce a.button.alt, .woocommerce button.button.alt, .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 48px; padding: 14px 25px;
	background: var(--naip-btn); color: #fff !important; border: 1px solid var(--naip-gold); border-radius: 3px;
	font: 400 15px/1.3 var(--naip-sans); letter-spacing: .6px; text-decoration: none; cursor: pointer;
}
.naip-btn:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover { background: #806334; border-color: #806334; color: #fff !important; }
.naip-btn--ghost { background: rgba(251, 245, 235, .37); color: #332a1f !important; border-color: var(--naip-gold); }
.naip-btn--ghost:hover { background: var(--naip-sand); color: #332a1f !important; border-color: var(--naip-gold); }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit {
	background: var(--naip-sand); color: #49392c !important; border: 1px solid var(--naip-sand-line); border-radius: 0; font: 600 15px/1.3 var(--naip-sans); padding: 13px 22px; letter-spacing: 0;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { background: #ddcba7; border-color: #ad915a; color: #3e2e14 !important; }

/* ---------- Logotipo (solo CSS) ---------- */
.nb-logo { display: inline-flex; flex-direction: column; align-items: center; width: 125px; color: #a78043; line-height: 1; text-align: center; font-family: var(--naip-serif); font-weight: 400; }
.nb-logo-name { font-size: 38px; letter-spacing: 10px; margin-right: -10px; }
.nb-logo-rule { display: flex; align-items: center; width: 100%; gap: 7px; margin: 5px 0; }
.nb-logo-rule i { height: 1px; background: currentColor; flex: 1; }
.nb-logo-rule b { font-size: 8px; font-weight: 400; }
.nb-logo-sub { font-size: 10px; letter-spacing: 4px; margin-right: -4px; }
.nb-logo--hero { width: 180px; }
.nb-logo--hero .nb-logo-name { font-size: 56px; letter-spacing: 13px; margin-right: -13px; }
.nb-logo--hero .nb-logo-sub { font-size: 15px; letter-spacing: 5px; margin-right: -5px; }
.nb-logo--footer { width: 170px; color: #d9bf87; }
.nb-logo--footer .nb-logo-name { font-size: 51px; letter-spacing: 13px; margin-right: -13px; }
.nb-logo--footer .nb-logo-sub { font-size: 14px; letter-spacing: 5px; margin-right: -5px; }

/* ---------- Franjas superiores ---------- */
.naip-demo-bar { background: #352e25; color: #fff5df; width: 100%; text-align: center; padding: 10px 18px; font-size: 15px; font-weight: 700; letter-spacing: 1px; text-transform: none; line-height: 1.4; }
.naip-demo-bar span { display: block; font-size: 12px; font-weight: 400; letter-spacing: 0; margin-top: 2px; }
.naip-topbar { background: var(--naip-cream-2); color: var(--naip-muted); font-size: 12px; padding: 5px 12px; line-height: 1.4; border-bottom: 0; }
.naip-topline { display: flex; justify-content: space-between; gap: 16px; background: linear-gradient(110deg, #b99e72, #866132); color: #fff; padding: 10px 4%; font-size: 12px; }
.naip-topline a { color: #fff; text-decoration: none; }
.naip-topline a:hover { text-decoration: underline; }

/* ---------- Cabecera: logotipo centrado y menú debajo ---------- */
.naip-header { position: relative; background: var(--naip-cream); backdrop-filter: none; border-bottom: 1px solid var(--naip-line); z-index: 60; }
.naip-header-inner { flex-direction: column; justify-content: center; gap: 6px; min-height: 0; padding-top: 14px; padding-bottom: 10px; position: relative; }
.naip-brand { display: flex; justify-content: center; }
.naip-logo { display: inline-flex; padding: 0; color: #a78043; }
.naip-nav { gap: 26px; justify-content: center; flex-wrap: wrap; }
.naip-menu { gap: 28px; align-items: center; justify-content: center; flex-wrap: wrap; }
.naip-menu > li { position: relative; }
.naip-menu a, .naip-menu .menu-item-soon span { color: var(--naip-ink); font-size: 17px; font-weight: 400; padding: 7px 0; display: inline-block; }
.naip-menu > li > a:hover, .naip-menu .current-menu-item > a { color: var(--naip-gold-dark); }
.naip-cart-link { font-size: 17px; font-weight: 400; color: var(--naip-ink); }
.naip-menu .menu-item-has-children > a::after { content: "⌄"; margin-left: 6px; font-size: 14px; }
.naip-menu .sub-menu { display: none; position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); z-index: 100; width: 250px; margin: 0; padding: 10px; list-style: none; background: #fffdf8; border: 1px solid #e4dcc9; border-radius: 10px; box-shadow: 0 10px 30px #302c251a; }
.naip-menu .menu-item-has-children:hover > .sub-menu,
.naip-menu .menu-item-has-children:focus-within > .sub-menu,
.naip-menu .menu-item-has-children.is-open > .sub-menu { display: block; }
.naip-menu .sub-menu a, .naip-menu .sub-menu .menu-item-soon span { display: block; padding: 12px; font-size: 16px; line-height: 1.5; text-align: left; white-space: normal; }
.naip-menu .sub-menu a:hover { background: #f4efe5; border-radius: 6px; color: var(--naip-ink); }
.naip-menu .sub-menu .menu-item-soon span { color: #797263; cursor: default; }
.naip-menu-toggle { position: absolute; right: 24px; top: 18px; }

/* ---------- Hero ---------- */
.naip-hero { padding: 0; background-color: #f6f0e6; border-bottom: 1px solid var(--naip-line); }
.naip-hero-grid { display: grid; grid-template-columns: 42% 58%; min-height: 600px; align-items: stretch; position: relative; z-index: 2; }
.naip-hero-grid.no-image { grid-template-columns: 1fr; min-height: 0; }
.naip-hero-copy { padding: 55px 15px 50px max(24px, calc((100vw - var(--naip-wrap)) / 2 + 24px)); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.naip-hero-brand { margin-bottom: 20px; }
.naip-hero h1 { font-size: clamp(38px, 4.5vw, 65px); line-height: 1.08; letter-spacing: -1.2px; margin: 12px 0 22px; max-width: 12ch; }
.naip-lead { font-size: 17px; color: #39342d; line-height: 1.6; margin: 0 0 16px; }
.naip-hero-photo { position: relative; overflow: hidden; }
.naip-hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; object-fit: cover; }
.naip-hero .naip-ruo-badge { display: block; border: 0; border-left: 3px solid var(--naip-gold); border-radius: 0; padding: 2px 0 2px 16px; margin: 0 0 18px; font-size: 20px; font-weight: 700; letter-spacing: .5px; line-height: 1.3; color: #6f4f2a; text-transform: uppercase; }
.naip-hero-actions { gap: 36px; margin-top: 18px; align-items: center; }
.naip-hero-actions .naip-btn, .naip-hero-actions .naip-btn:hover { background: none; border: 0; border-radius: 0; padding: 0 0 4px; color: #4a3b2a !important; font-weight: 400; transition: color .2s ease; }
.naip-hero-actions .naip-btn:hover { color: var(--naip-gold-dark) !important; }
.naip-hero--has-strip .naip-hero-grid { margin-bottom: 0; }
.naip-hero.naip-hero--has-strip { padding-bottom: 0; }
.naip-hero-strip { background: var(--naip-cream-2); border-top: 1px solid var(--naip-line); padding: 12px 0; font-size: 13px; color: #6f572f; text-align: center; }
.naip-hero-strip p { margin: 0; }

/* ---------- ¿Qué recibes? ---------- */
.naip-reasons { padding: 34px 0 32px; border-bottom: 1px solid var(--naip-line); }
.naip-reasons h2 { text-align: center; font-size: 28px; margin: 0 0 26px; }
.naip-reasons-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 40px; }
.naip-reasons-grid > a { display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: start; gap: 10px; color: var(--naip-ink); text-decoration: none; }
.naip-reasons-grid .naip-icon { color: #96703f; width: 26px; height: 26px; font-size: 24px; line-height: 26px; text-align: center; flex: none; }
.naip-reasons-grid h3 { font: 600 15px/1.45 var(--naip-sans); letter-spacing: 0; margin: 1px 0 5px; }
.naip-reasons-grid p { font: 400 14px/1.5 var(--naip-sans); color: #625747; margin: 0; }
.naip-reasons-grid > a:hover h3 { text-decoration: underline; text-underline-offset: 3px; }
.naip-more { display: inline-block; margin-top: 9px; font-size: 12px; color: #806033; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Filtro por tipo de producto ---------- */
.naip-strip { background: transparent; border-bottom: 1px solid #eee7da; padding: 15px 0; text-align: center; }
.naip-chips { gap: 4px 8px; }
.naip-chips a { background: transparent; border: 0; border-radius: 0; padding: 8px 14px; font-size: 16px; color: #49392c; text-decoration: none; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.naip-chips a:hover { background: transparent; color: var(--naip-gold-dark); text-decoration: underline; }
.naip-chips a.is-active { background: transparent; color: var(--naip-gold-dark); font-weight: 600; text-decoration: underline; text-decoration-color: var(--naip-gold); text-decoration-thickness: 2px; }
.naip-filter-wrap .naip-chips a { padding-left: 0; padding-right: 20px; }

/* ---------- Secciones ---------- */
.naip-section { padding: 48px 0; }
.naip-section h2, .naip-band h2 { font-size: 32px; line-height: 1.2; margin: 0 0 16px; }
.naip-section-head { align-items: center; margin-bottom: 24px; }
.naip-section-head h2 { margin: 0; font-size: 34px; }
.naip-section-head .naip-link { font-size: 14px; color: #80632f; white-space: nowrap; text-decoration: none; padding-bottom: 2px; border-bottom: 1px solid transparent; transition: border-color .2s ease; }
.naip-section-head .naip-link:hover { border-bottom-color: currentColor; }
.naip-note { font-size: 11px; line-height: 1.7; color: #877e71; margin: 23px 0 0; }
.naip-section--packs { background: transparent; border: 0; border-top: 1px solid #eee7da; }
.naip-intro { color: #7e776b; font-size: 15px; margin: 0 0 26px; }
.naip-band { padding: 48px 0; background: var(--naip-cream-2); }

/* ---------- Tarjetas de producto (WooCommerce) ---------- */
.woocommerce ul.products { gap: 23px; }
.woocommerce ul.products li.product { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
.woocommerce ul.products li.product:hover { box-shadow: none; border: 0; }
.woocommerce ul.products li.product img { background: #eee0cd; border-radius: 3px; margin-bottom: 0; object-fit: cover; }
.woocommerce ul.products li.product .naip-card-kicker { font-size: 10px; letter-spacing: 1px; color: #8b713f; margin: 16px 0 0; padding: 0 4px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font: 400 17px/1.35 var(--naip-sans); letter-spacing: 0; margin: 9px 0 6px; padding: 0 4px; color: var(--naip-ink); }
.woocommerce ul.products li.product .naip-card-sub { font-size: 12px; color: #80796e; margin: 0 0 8px; padding: 0 4px; line-height: 1.6; }
.woocommerce ul.products li.product .price { font-size: 20px; font-weight: 400; color: #815b2b; margin: 8px 0 12px; padding: 0 4px; }
.woocommerce ul.products li.product .price del { display: inline; font-size: 14px; color: #918779; margin-right: 8px; }
.woocommerce ul.products li.product .price ins { display: inline; font-weight: 400; }
.woocommerce ul.products li.product .price small { font-size: 12px; }
.woocommerce ul.products li.product .naip-card-saving { color: #8b713f; font-size: 11px; margin: 0 0 15px; padding: 0 4px; }
.woocommerce ul.products li.product a.button, .woocommerce ul.products li.product button.button {
	background: var(--naip-sand); color: #49392c !important; border: 1px solid var(--naip-sand-line); border-radius: 0; font: 600 16px/1.3 var(--naip-sans); padding: 14px; min-height: 48px; margin-top: auto; width: 100%;
}
.woocommerce ul.products li.product a.button:hover { background: #ddcba7; border-color: #ad915a; color: #3e2e14 !important; }
.woocommerce ul.products li.product .naip-card-badge { top: 12px; left: 4px; background: #a4874e; font-size: 10px; letter-spacing: .7px; padding: 5px 8px; border-radius: 3px; font-weight: 400; }
.woocommerce ul.products li.product a.button.naip-view-btn { background: transparent; }

/* Packs: dos columnas grandes */
.naip-section--packs .woocommerce ul.products, .naip-section--packs ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 40px; }
.naip-section--packs .woocommerce ul.products li.product img, .naip-section--packs ul.products li.product img { background: none; mix-blend-mode: multiply; }
.naip-section--packs .woocommerce ul.products li.product .woocommerce-loop-product__title { font: 400 28px/1.2 var(--naip-serif); margin: 14px 0; }
.naip-section--packs .woocommerce ul.products li.product .price { font-size: 24px; }

/* ---------- Objetivos ---------- */
.naip-objectives .naip-eyebrow { margin-bottom: 12px; }
.naip-goal-grid { gap: 16px; }
.naip-goal { padding: 22px; background: #fcf7ee; border: 1px solid #dccbb0; border-radius: 3px; }
.naip-goal:hover { border-color: var(--naip-gold); transform: none; }
.naip-goal h3 { font-size: 23px; margin: 14px 0 8px; letter-spacing: 0; }
.naip-goal p { font-size: 12px; line-height: 1.65; color: #82796c; margin: 0 0 12px; }
.naip-goal-link { font-size: 11px; color: #8e713b; font-weight: 400; }
.naip-tag { font-size: 9px; letter-spacing: .8px; background: #eee7d8; color: #806838; padding: 4px 7px; border: 0; border-radius: 0; }

/* ---------- Paneles (Resellers / COA) ---------- */
.naip-duo { max-width: var(--naip-wrap); margin: 35px auto; padding: 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.naip-panel { position: relative; overflow: hidden; min-height: 300px; padding: 35px; background: linear-gradient(115deg, #f5eadb, #e1ccaa); }
.naip-panel .naip-eyebrow { font-size: 10px; letter-spacing: 1.5px; color: #977343; }
.naip-panel h2 { font-size: 34px; line-height: 1.15; margin: 18px 0; }
.naip-panel p { font-size: 14px; line-height: 1.7; max-width: 340px; position: relative; z-index: 1; }
.naip-panel .naip-btn { position: relative; z-index: 1; }
.naip-panel-mark { position: absolute; right: -8px; bottom: -18px; opacity: .9; pointer-events: none; }
.naip-panel-mark .nb-logo { width: 100px; }
.naip-panel-mark .nb-logo-name { font-size: 32px; }
.naip-panel-mark .nb-logo-sub { font-size: 9px; }

/* ---------- Academia ---------- */
.naip-academy { background: #f5eddf; }
.naip-academy-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 45px; align-items: center; }
.naip-academy .naip-eyebrow { color: #96703f; letter-spacing: 2px; }
.naip-academy h2 { font-size: clamp(30px, 3.5vw, 44px); line-height: 1.15; letter-spacing: -.8px; margin: 12px 0 20px; }
.naip-academy p { font-size: 15px; line-height: 1.7; }
.naip-academy-links { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.naip-academy-links .naip-btn { background: #eee2cd; border-color: #b69a6b; color: #382d21 !important; border-radius: 0; font-weight: 600; padding: 14px 22px; }
.naip-academy-news { font-size: 14px; color: #806033; }
.naip-academy-links small { color: #8a8274; font-size: 12px; }

/* ---------- Marca y FAQ ---------- */
.naip-about p { font-size: 15px; line-height: 1.9; color: #7b7367; margin-bottom: 18px; max-width: 860px; }
.naip-about a { color: #8a6e36; }
.naip-faq details { border: 1px solid #e3dacb; border-radius: 3px; margin: 12px 0; background: #fffdf9; }
.naip-faq summary { padding: 19px 20px; font-size: 14px; font-weight: 400; }
.naip-faq summary::after { content: "+"; color: #93733a; transform: none; font-size: 16px; }
.naip-faq details[open] summary::after { content: "−"; transform: none; }
.naip-faq-answer { padding: 0 20px 20px; font-size: 14px; line-height: 1.8; color: #787064; }

/* ---------- Pie de página ---------- */
.naip-footer { background: #392d24; color: #f4ecdc; border-top: 1px solid #b99d68; margin-top: 64px; padding: 0; }
.naip-footer .naip-container { max-width: 1200px; padding: 0 28px; }
.naip-footer-grid { grid-template-columns: 1.3fr 1.15fr 1fr 1fr; gap: 40px; padding: 52px 0 40px; }
.naip-footer a { color: #f4ecdc; }
.naip-footer a:hover { color: #e1c48a; text-decoration: underline; text-underline-offset: 5px; }
.naip-footer-brand .naip-logo { color: #d9bf87; }
.naip-footer-brand .naip-logo { display: block; width: fit-content; }
.naip-footer-brand .naip-footer-claim { font-size: 18px; color: #f4ecdc; margin: 24px 0 12px; }
.naip-footer-brand p { color: #e5d9c6; font-size: 15px; line-height: 1.7; max-width: 260px; margin: 0 0 14px; }
.naip-footer-badge { display: inline-block; color: #e5d9c6; border: 1px solid #8b7657; font-size: 10px; letter-spacing: .1em; line-height: 1.6; padding: 7px 9px; }
.naip-footer h3 { color: #d9bf87; font-family: var(--naip-serif); font-size: 15px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; margin: 0 0 20px; }
.naip-footer-menu { list-style: none; margin: 0; padding: 0; }
.naip-footer-menu li { margin: 0 0 8px; }
.naip-footer-menu a { display: inline-block; font-size: 15px; line-height: 1.5; padding: 5px 0; }
.naip-footer-company { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; border-top: 1px solid #75604a; padding: 25px 0; font-size: 13px; line-height: 1.7; color: #d9cbb7; }
.naip-footer-company p { margin: 0; }
.naip-footer-notice { border-top: 1px solid #75604a; padding: 25px 0; }
.naip-footer-notice strong { color: #e1c48a; font-size: 13px; letter-spacing: .04em; }
.naip-footer-notice p { color: #d9cbb7; font-size: 13px; line-height: 1.7; max-width: 940px; margin: 8px 0 0; }
.naip-footer-bottom { border-top: 1px solid #75604a; color: #d9cbb7; font-size: 12px; padding: 22px 0; display: flex; justify-content: space-between; gap: 16px; }

/* ---------- Aviso +18 ---------- */
.naip-agegate-card { background: #fffdf8; border: 1px solid var(--naip-gold); border-radius: 0; max-width: 520px; text-align: left; padding: 36px; }
.naip-agegate-card h2 { font-size: 34px; margin: 0 0 12px; }
.naip-agegate-card .naip-btn { width: 100%; }
.naip-check { margin: 14px 0; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	.naip-goal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.naip-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
	.naip-header-inner { flex-direction: row; justify-content: space-between; align-items: center; }
	.naip-brand { justify-content: flex-start; }
	.naip-menu-toggle { position: static; }
	.naip-nav { position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: flex-start; gap: 16px; background: var(--naip-cream); border-bottom: 1px solid var(--naip-line); padding: 20px 24px; }
	.naip-menu { flex-direction: column; align-items: flex-start; gap: 6px; }
	.naip-menu .sub-menu { position: static; transform: none; width: auto; box-shadow: none; border: 0; padding: 0 0 0 14px; background: transparent; }
	.naip-hero-grid { grid-template-columns: 1fr; min-height: 0; }
	.naip-hero-copy { padding: 40px 24px; }
	.naip-hero-photo { min-height: 320px; }
	.naip-reasons-grid { grid-template-columns: 1fr 1fr; gap: 22px 24px; }
	.naip-duo, .naip-academy-grid { grid-template-columns: 1fr; }
	.naip-section--packs .woocommerce ul.products, .naip-section--packs ul.products { grid-template-columns: 1fr; }
	.naip-topline { padding: 8px 16px; flex-wrap: wrap; }
}
@media (max-width: 560px) {
	.naip-reasons-grid, .naip-goal-grid, .naip-footer-grid, .naip-footer-company { grid-template-columns: 1fr; }
	.naip-section-head h2 { font-size: 28px; }
}
