/**
 * Single product page.
 *
 * Scoped entirely under .fx-pdp so nothing here can reach the cart, the
 * archive, or the home page sections.
 */

.fx-pdp{
	--fx-forest:#163d2b;
	--fx-forest-deep:#0f2c1f;
	--fx-marigold:#d9863a;
	--fx-marigold-ink:#9a5a12;
	--fx-marigold-soft:#f4f1ea;
	--fx-tomato:#d2452e;
	--fx-green:#2f7a4f;
	--fx-green-soft:#e8f2ea;
	--fx-ink:#1a2b22;
	--fx-muted:#7a8078;
	--fx-line:#ebe8e1;
	--fx-radius:16px;

	/* Site container convention, shared with .fx-products-in, .fx-split-in,
	 * .fx-why-in, .fx-ft-in and the rest: 1360px cap with a 20px gutter. */
	max-width:1360px;
	width:calc(100% - 40px);
	margin:0 auto;
	padding:24px 0 96px;
	color:var(--fx-ink);
	box-sizing:border-box;
}

.fx-pdp *{box-sizing:border-box;}
.fx-pdp img{max-width:100%;height:auto;}

/* --- breadcrumb --------------------------------------------------------- */

.fx-crumbs{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
	font-size:.85rem;
	color:var(--fx-muted);
	margin-bottom:22px;
}

.fx-crumbs a{color:var(--fx-muted);text-decoration:none;}
.fx-crumbs a:hover{color:var(--fx-tomato);}
.fx-crumbs .is-current{color:var(--fx-ink);font-weight:600;}

/* --- layout ------------------------------------------------------------- */

.fx-pdp-top{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,1fr);
	gap:44px;
	align-items:start;
	margin-bottom:56px;
}

/* --- gallery ------------------------------------------------------------ */

.fx-gallery-main{
	position:relative;
	border-radius:var(--fx-radius);
	overflow:hidden;
	background:var(--fx-marigold-soft);
}

.fx-gallery-main img{
	display:block;
	width:100%;
	aspect-ratio:1/1;
	object-fit:cover;
}

.fx-gallery-badges{
	position:absolute;
	inset:14px 14px auto 14px;
	display:flex;
	gap:8px;
	z-index:2;
	pointer-events:none;
}

.fx-gbadge{
	background:rgba(255,255,255,.94);
	color:var(--fx-ink);
	border-radius:999px;
	padding:7px 14px;
	font-size:.68rem;
	font-weight:700;
	letter-spacing:.06em;
	white-space:nowrap;
	box-shadow:0 1px 3px rgba(22,61,43,.12);
}

.fx-gbadge.is-right{margin-left:auto;}

.fx-gallery-foot{
	position:absolute;
	inset:auto 14px 14px 14px;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	gap:8px;
	z-index:2;
	pointer-events:none;
}

.fx-gpill{
	display:inline-flex;
	align-items:center;
	gap:6px;
	background:rgba(255,255,255,.94);
	border-radius:999px;
	padding:7px 14px;
	font-size:.78rem;
	font-weight:600;
	color:var(--fx-ink);
	box-shadow:0 1px 3px rgba(22,61,43,.12);
}

.fx-gpill.is-note{color:var(--fx-green);}

.fx-thumbs{
	display:grid;
	grid-template-columns:repeat(5,1fr);
	gap:10px;
	margin-top:12px;
}

.fx-thumb{
	border:1px solid var(--fx-line);
	border-radius:12px;
	padding:0;
	overflow:hidden;
	background:var(--fx-marigold-soft);
	cursor:pointer;
	transition:border-color .18s ease;
}

.fx-thumb img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;}
.fx-thumb:hover,.fx-thumb.is-active{border-color:var(--fx-forest);}

/* --- stars -------------------------------------------------------------- */

.fx-stars{display:inline-flex;gap:1px;line-height:1;}
.fx-star{color:#dcdcd4;font-size:1rem;}
.fx-star.is-on{color:var(--fx-marigold);}

/* --- summary ------------------------------------------------------------ */

.fx-summary-meta{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:14px;
	margin-bottom:14px;
}

.fx-tag{
	background:var(--fx-green-soft);
	color:var(--fx-green);
	border-radius:999px;
	padding:6px 13px;
	font-size:.68rem;
	font-weight:700;
	letter-spacing:.07em;
}

.fx-stock{
	display:inline-flex;
	align-items:center;
	gap:7px;
	font-size:.85rem;
	color:var(--fx-muted);
}

.fx-dot{
	width:8px;
	height:8px;
	border-radius:50%;
	background:var(--fx-green);
	display:inline-block;
}

.fx-title{
	font-size:clamp(1.8rem,3.2vw,2.4rem);
	font-weight:800;
	line-height:1.15;
	letter-spacing:-.02em;
	margin:0 0 12px;
}

.fx-blurb{
	color:var(--fx-muted);
	line-height:1.6;
	margin:0 0 16px;
	max-width:52ch;
}

.fx-rating-row{
	display:flex;
	align-items:center;
	gap:9px;
	font-size:.92rem;
	margin-bottom:18px;
}

.fx-review-link{color:var(--fx-muted);text-decoration:none;}
.fx-review-link:hover{color:var(--fx-tomato);text-decoration:underline;text-underline-offset:3px;}

.fx-price-row{
	display:flex;
	align-items:baseline;
	flex-wrap:wrap;
	gap:12px;
	margin-bottom:26px;
}

.fx-price{font-size:2.1rem;font-weight:800;letter-spacing:-.02em;}
.fx-price-was{color:var(--fx-muted);text-decoration:line-through;font-size:1.05rem;}
.fx-price-was .amount{text-decoration:line-through;}

.fx-off{
	background:var(--fx-green-soft);
	color:var(--fx-green);
	border-radius:999px;
	padding:5px 12px;
	font-size:.75rem;
	font-weight:700;
}

/* --- option fields ------------------------------------------------------ */

.fx-field{margin-bottom:22px;}

.fx-field-label{
	display:block;
	font-size:.7rem;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--fx-muted);
	margin-bottom:10px;
}

.fx-swatches{display:flex;flex-wrap:wrap;gap:9px;}

.fx-swatch{
	display:inline-flex;
	align-items:center;
	gap:8px;
	border:1px solid var(--fx-line);
	border-radius:999px;
	padding:9px 16px;
	font-size:.9rem;
	font-weight:500;
	color:var(--fx-ink);
	text-decoration:none;
	background:#fff;
	transition:border-color .18s ease,background-color .18s ease;
}

.fx-swatch:hover{border-color:var(--fx-forest);}

.fx-swatch.is-active{
	background:var(--fx-forest);
	border-color:var(--fx-forest);
	color:#fff;
	font-weight:600;
}

.fx-swatch-dot{
	width:10px;
	height:10px;
	border-radius:50%;
	flex-shrink:0;
	box-shadow:0 0 0 1px rgba(0,0,0,.08) inset;
}

.fx-packs{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
	gap:11px;
}

.fx-pack{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:2px;
	border:1.5px solid var(--fx-line);
	border-radius:14px;
	padding:16px 12px 14px;
	cursor:pointer;
	background:#fff;
	text-align:center;
	transition:border-color .18s ease,background-color .18s ease;
}

.fx-pack input{position:absolute;opacity:0;pointer-events:none;}
.fx-pack:hover{border-color:#c9cec4;}

.fx-pack.is-active{
	border-color:var(--fx-green);
	background:#f6fbf7;
}

.fx-pack-name{font-weight:700;font-size:.95rem;}
.fx-pack-meta{font-size:.78rem;color:var(--fx-muted);}
.fx-pack-price{font-weight:700;margin-top:4px;}

.fx-pack-badge{
	position:absolute;
	right:-1px;
	bottom:-1px;
	background:var(--fx-marigold);
	color:#241a0c;
	font-size:.6rem;
	font-weight:700;
	letter-spacing:.04em;
	padding:3px 9px;
	border-radius:8px 0 12px 0;
}

/* --- buy row ------------------------------------------------------------ */

.fx-buy{
	display:flex;
	align-items:stretch;
	gap:12px;
	flex-wrap:wrap;
	margin-top:26px;
}

.fx-qty{
	display:inline-flex;
	align-items:center;
	border:1px solid var(--fx-line);
	border-radius:12px;
	background:#fff;
	overflow:hidden;
}

.fx-qty-btn{
	width:42px;
	border:0;
	background:transparent;
	font-size:1.1rem;
	font-weight:600;
	color:var(--fx-ink);
	cursor:pointer;
	line-height:1;
}

.fx-qty-btn:hover{background:#faf9f6;color:var(--fx-tomato);}

.fx-qty input{
	width:44px;
	border:0;
	background:transparent;
	text-align:center;
	font-weight:700;
	font-size:1rem;
	color:var(--fx-ink);
	padding:12px 0;
	-moz-appearance:textfield;
}

.fx-qty input::-webkit-outer-spin-button,
.fx-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}

.fx-add{
	flex:1 1 240px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	border:0;
	border-radius:12px;
	background:var(--fx-forest);
	color:#fff;
	font-size:1rem;
	font-weight:700;
	padding:15px 26px;
	cursor:pointer;
	transition:background-color .18s ease;
}

.fx-add:hover{background:var(--fx-forest-deep);}
.fx-add.is-busy{opacity:.7;pointer-events:none;}
.fx-add.is-done{background:var(--fx-green);}

/* --- tabs --------------------------------------------------------------- */

.fx-tabs{margin-bottom:64px;}

.fx-tabnav{
	display:flex;
	gap:28px;
	border-bottom:1px solid var(--fx-line);
	margin-bottom:28px;
	overflow-x:auto;
	scrollbar-width:none;
}

.fx-tabnav::-webkit-scrollbar{display:none;}

.fx-tabbtn{
	border:0;
	background:none;
	padding:0 0 14px;
	font-size:.95rem;
	font-weight:600;
	color:var(--fx-muted);
	cursor:pointer;
	white-space:nowrap;
	border-bottom:2px solid transparent;
	margin-bottom:-1px;
	transition:color .18s ease,border-color .18s ease;
}

.fx-tabbtn:hover{color:var(--fx-ink);}
.fx-tabbtn.is-active{color:var(--fx-forest);border-bottom-color:var(--fx-forest);}

/* foodx-navbar.css declares a global `.fx-panel{display:contents}` for its
 * mobile dropdown wrapper. A `display` declaration from an author stylesheet
 * outranks the UA `[hidden]{display:none}` rule, so every tab panel here
 * rendered at once regardless of the hidden attribute. Re-scope it. */
.fx-pdp .fx-panel{display:block;}
.fx-pdp .fx-panel[hidden]{display:none;}
/* --- review form -------------------------------------------------------- */

.fx-pdp .fx-review-form{
	margin-top:36px;
	padding:28px 26px 30px;
	border:1px solid var(--fx-line);
	border-radius:var(--fx-radius);
	background:#fdfcfa;
}
.fx-pdp .fx-form-title{font-size:1.15rem;font-weight:800;margin:0 0 4px;}
.fx-pdp .fx-form-note{color:var(--fx-muted);font-size:.82rem;margin:0 0 20px;}
.fx-pdp .fx-ff{margin:0 0 16px;display:flex;flex-direction:column;gap:7px;}
.fx-pdp .fx-ff label{font-size:.82rem;font-weight:700;letter-spacing:.01em;}
.fx-pdp .fx-req{color:var(--fx-tomato);}
.fx-pdp .fx-ff input,
.fx-pdp .fx-ff select,
.fx-pdp .fx-ff textarea{
	width:100%;
	font:inherit;
	font-size:.92rem;
	color:var(--fx-ink);
	background:#fff;
	border:1px solid var(--fx-line);
	border-radius:10px;
	padding:11px 13px;
}
.fx-pdp .fx-ff textarea{resize:vertical;min-height:120px;line-height:1.55;}
.fx-pdp .fx-ff input:focus,
.fx-pdp .fx-ff select:focus,
.fx-pdp .fx-ff textarea:focus{
	outline:none;
	border-color:var(--fx-green);
	box-shadow:0 0 0 3px rgba(47,122,79,.14);
}
.fx-pdp .fx-review-form .form-submit{margin:22px 0 0;}
.fx-pdp .fx-form-submit{
	appearance:none;
	border:0;
	cursor:pointer;
	font:inherit;
	font-weight:700;
	font-size:.92rem;
	color:#fff;
	background:var(--fx-forest);
	border-radius:999px;
	padding:13px 30px;
	transition:background .18s ease;
}
.fx-pdp .fx-form-submit:hover{background:var(--fx-forest-deep);}
.fx-pdp .comment-form-cookies-consent{
	display:flex;flex-direction:row;align-items:center;gap:9px;
	font-size:.82rem;color:var(--fx-muted);margin:0 0 6px;
}
.fx-pdp .comment-form-cookies-consent input{width:auto;}

@media (min-width:720px){
	.fx-pdp .comment-form-author,
	.fx-pdp .comment-form-email{width:calc(50% - 8px);display:inline-flex;vertical-align:top;}
	.fx-pdp .comment-form-author{margin-right:12px;}
}

.fx-panel h2{font-size:1.35rem;font-weight:800;margin:0 0 6px;}
.fx-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-bottom:20px;}
.fx-panel-sub{color:var(--fx-muted);font-size:.88rem;margin:0;}

.fx-chip{
	background:var(--fx-green-soft);
	color:var(--fx-green);
	border-radius:999px;
	padding:8px 15px;
	font-size:.68rem;
	font-weight:700;
	letter-spacing:.07em;
	white-space:nowrap;
}

/* --- nutrition ---------------------------------------------------------- */

.fx-nutri-grid{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,420px);
	gap:24px;
	align-items:start;
}

.fx-nutri-table{
	border:1px solid var(--fx-line);
	border-radius:var(--fx-radius);
	overflow:hidden;
	background:#fff;
}

.fx-nutri-head,
.fx-nutri-row{
	display:grid;
	grid-template-columns:minmax(0,1fr) 90px 70px;
	gap:12px;
	align-items:center;
	padding:14px 20px;
}

.fx-nutri-head{
	background:#faf9f6;
	border-bottom:1px solid var(--fx-line);
	font-size:.68rem;
	font-weight:700;
	letter-spacing:.1em;
	text-transform:uppercase;
	color:var(--fx-muted);
}

.fx-nutri-head span:nth-child(2),
.fx-nutri-head span:nth-child(3),
.fx-nutri-amount,
.fx-nutri-dv{text-align:right;}

.fx-nutri-row + .fx-nutri-row{border-top:1px solid var(--fx-line);}
.fx-nutri-name{font-weight:600;font-size:.95rem;}

.fx-nutri-bar{
	display:block;
	height:3px;
	width:56px;
	margin-top:6px;
	border-radius:999px;
	background:#eef0ea;
	overflow:hidden;
}

.fx-nutri-bar span{display:block;height:100%;background:var(--fx-green);border-radius:999px;}
.fx-nutri-amount{font-weight:700;font-variant-numeric:tabular-nums;}
.fx-nutri-dv{color:var(--fx-muted);font-variant-numeric:tabular-nums;}

.fx-nutri-foot{
	margin:0;
	padding:14px 20px;
	border-top:1px solid var(--fx-line);
	font-size:.72rem;
	color:var(--fx-muted);
}

.fx-why{
	background:linear-gradient(160deg,#1d4a35,#12301f);
	color:#fff;
	border-radius:var(--fx-radius);
	padding:26px 24px;
}

.fx-why h3{
	font-size:.7rem;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#a9c4b2;
	margin:0 0 12px;
}

.fx-why p{color:#dce8df;line-height:1.6;font-size:.92rem;margin:0 0 20px;}

.fx-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px;}

.fx-stat{
	background:rgba(255,255,255,.07);
	border-radius:12px;
	padding:14px 10px;
	text-align:center;
}

.fx-stat-value{display:block;font-size:1.35rem;font-weight:800;color:#8fd6a4;line-height:1.1;}
.fx-stat-value small{font-size:.7rem;font-weight:600;margin-left:2px;}
.fx-stat-label{display:block;font-size:.72rem;color:#b9cfc0;margin-top:3px;}

.fx-ticks{list-style:none;margin:0;padding:0;display:grid;gap:9px;}

.fx-ticks li{
	display:flex;
	align-items:center;
	gap:10px;
	background:rgba(255,255,255,.07);
	border-radius:10px;
	padding:11px 14px;
	font-size:.88rem;
	color:#e4ede6;
}

.fx-tick{
	width:20px;
	height:20px;
	flex-shrink:0;
	display:grid;
	place-items:center;
	border-radius:50%;
	background:#8fd6a4;
	color:#12301f;
	font-size:.7rem;
	font-weight:700;
}

/* --- prose panels ------------------------------------------------------- */

.fx-prose{color:var(--fx-muted);line-height:1.7;max-width:70ch;margin:0 0 12px;}

.fx-steps{list-style:none;margin:0;padding:0;display:grid;gap:16px;max-width:70ch;}
.fx-steps li{display:flex;gap:14px;align-items:flex-start;}

.fx-step-num{
	width:30px;
	height:30px;
	flex-shrink:0;
	display:grid;
	place-items:center;
	border-radius:50%;
	background:var(--fx-green-soft);
	color:var(--fx-green);
	font-weight:700;
	font-size:.85rem;
}

.fx-steps strong{display:block;margin-bottom:3px;}
.fx-steps p{margin:0;color:var(--fx-muted);line-height:1.6;font-size:.93rem;}

.fx-faqs{display:grid;gap:10px;max-width:70ch;}

.fx-faq{
	border:1px solid var(--fx-line);
	border-radius:12px;
	padding:14px 18px;
	background:#fff;
}

.fx-faq summary{font-weight:600;cursor:pointer;list-style:none;}
.fx-faq summary::-webkit-details-marker{display:none;}
.fx-faq summary::after{content:"+";float:right;color:var(--fx-muted);font-weight:400;}
.fx-faq[open] summary::after{content:"\2212";}
.fx-faq p{margin:10px 0 0;color:var(--fx-muted);line-height:1.6;font-size:.93rem;}

/* --- reviews ------------------------------------------------------------ */

.fx-eyebrow{
	font-size:.7rem;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--fx-marigold);
	margin:0 0 6px;
}

.fx-reviews-head{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:20px;
	flex-wrap:wrap;
	margin-bottom:20px;
}

.fx-reviews-head h2{font-size:1.6rem;font-weight:800;margin:0;}

.fx-write{
	border:1px solid var(--fx-line);
	border-radius:999px;
	padding:11px 20px;
	font-size:.9rem;
	font-weight:600;
	color:var(--fx-ink);
	text-decoration:none;
	background:#fff;
}

.fx-write:hover{border-color:var(--fx-forest);}

.fx-review-summary{
	background:#faf9f6;
	border:1px solid var(--fx-line);
	border-radius:var(--fx-radius);
	padding:26px;
	margin-bottom:28px;
}

.fx-score{display:block;font-size:2.6rem;font-weight:800;line-height:1;color:var(--fx-forest);}
.fx-score small{font-size:.85rem;font-weight:500;color:var(--fx-muted);margin-left:8px;}
.fx-review-score .fx-stars{margin:10px 0 6px;}
.fx-review-count{margin:0;color:var(--fx-muted);font-size:.88rem;}

.fx-review-listhead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.fx-review-listhead h3{font-size:1.15rem;font-weight:700;margin:0;}
.fx-review-showing{margin:0;color:var(--fx-muted);font-size:.85rem;}

.fx-review-list{list-style:none;margin:0;padding:0;display:grid;gap:14px;}

.fx-review{
	border:1px solid var(--fx-line);
	border-radius:var(--fx-radius);
	padding:20px;
	background:#fff;
}

.fx-review-top{display:flex;align-items:center;gap:12px;margin-bottom:12px;}

.fx-avatar{
	width:36px;
	height:36px;
	flex-shrink:0;
	display:grid;
	place-items:center;
	border-radius:50%;
	background:var(--fx-green);
	color:#fff;
	font-weight:700;
}

.fx-review-who strong{display:block;font-size:.95rem;}
.fx-verified{font-size:.75rem;color:var(--fx-green);}
.fx-review-top time{margin-left:auto;font-size:.78rem;color:var(--fx-muted);}
.fx-review-body p{margin:0 0 8px;color:var(--fx-muted);line-height:1.6;font-size:.93rem;}
.fx-review-stars{display:flex;align-items:center;gap:8px;font-size:.85rem;}

/* --- focus + motion ----------------------------------------------------- */

.fx-pdp a:focus-visible,
.fx-pdp button:focus-visible,
.fx-pdp input:focus-visible,
.fx-pdp summary:focus-visible{
	outline:2px solid var(--fx-marigold);
	outline-offset:2px;
}

.fx-pack:focus-within{outline:2px solid var(--fx-marigold);outline-offset:2px;}

@media (prefers-reduced-motion:reduce){
	.fx-pdp *{transition:none !important;}
}

/* --- responsive --------------------------------------------------------- */

@media (max-width:960px){
	.fx-pdp-top{grid-template-columns:1fr;gap:32px;}
	.fx-nutri-grid{grid-template-columns:1fr;}
}

@media (max-width:600px){
	.fx-pdp{width:calc(100% - 28px);padding:16px 0 64px;}
	.fx-title{font-size:1.55rem;}
	.fx-price{font-size:1.7rem;}
	.fx-thumbs{grid-template-columns:repeat(4,1fr);}
	.fx-packs{grid-template-columns:1fr 1fr;}
	.fx-buy{gap:10px;}
	.fx-add{flex:1 1 100%;}
	.fx-nutri-head,.fx-nutri-row{grid-template-columns:minmax(0,1fr) 74px 52px;padding:12px 14px;gap:8px;}
	.fx-stats{grid-template-columns:1fr;}
}