/*
Theme Name: Lumen Linens
Theme URI: https://lumenlinens.example
Author: Lumen Linens Studio
Author URI: https://lumenlinens.example
Description: A boutique home-textile storefront theme for WordPress. Classic (non-FSE) theme with a customizable homepage (hero text/images, series/collection display, fabric story, four-pieces, reviews, newsletter), a series/collection archive, and a product detail page -- all tunable from the Customizer and per-product meta boxes.
Version: 1.0.0
Requires at least: WordPress 6.0
Tested up to: WordPress 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lumen-linens
Tags: e-commerce, custom-menu, custom-logo, threaded-comments
*/
<?php
/**
 * Theme styles for Lumen Linens (classic theme).
 *
 * @package LumenLinens
 */

/* Base */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Inter',sans-serif; font-size:14px; color:#2c2a26; line-height:1.6; background:#faf9f6; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
.container { max-width:1280px; margin:0 auto; padding:0 40px; }
.serif { font-family:'Cormorant Garamond',serif; }
.label { font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:#8a857a; }
.label-dark { font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.72); }

/* Topbar */
.topbar { background:#1e1c19; color:rgba(255,255,255,.85); font-size:10px; letter-spacing:.14em; text-transform:uppercase; text-align:center; padding:9px 12px; display:flex; justify-content:center; gap:28px; flex-wrap:wrap; }
.topbar span { display:inline-flex; align-items:center; gap:8px; }
.topbar em { font-style:normal; color:#fff; font-weight:600; }

/* Header */
.site-header { background:#fff; border-bottom:1px solid #ece8e0; position:sticky; top:0; z-index:50; }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand { font-family:'Cormorant Garamond',serif; font-size:22px; letter-spacing:.18em; font-weight:500; }
.brand small { display:block; font-family:'Inter',sans-serif; font-size:7.5px; letter-spacing:.34em; color:#8a857a; margin-top:2px; }
.main-nav { display:flex; gap:36px; }
.main-nav a { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#4a463e; padding:4px 0; border-bottom:1px solid transparent; transition:border-color .2s; }
.main-nav a:hover, .main-nav a.active { border-bottom-color:#2c2a26; }
.main-nav a.sub { color:#8a857a; }

/* Buttons */
.btn { display:inline-block; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:14px 26px; cursor:pointer; transition:opacity .2s; border:1px solid transparent; }
.btn-dark { background:#2c2a26; color:#fff; }
.btn-dark:hover { opacity:.85; }
.btn-outline { background:transparent; color:#2c2a26; border-color:#d8d2c6; }
.btn-outline:hover { border-color:#2c2a26; }

/* Hero */
.hero { padding:72px 0 84px; }
.hero-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.hero-eyebrow { display:flex; align-items:center; gap:10px; margin-bottom:26px; }
.hero-eyebrow::before { content:""; width:22px; height:1px; background:#8a857a; display:inline-block; }
.hero h1 { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:64px; line-height:1.02; letter-spacing:-.01em; }
.hero h1 .i { font-style:italic; font-weight:300; }
.hero-sub { margin:22px 0 30px; max-width:430px; color:#6d675c; font-size:13.5px; line-height:1.8; }
.hero-actions { display:flex; gap:14px; align-items:center; margin-bottom:26px; }
.hero-actions .linklike { font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:#6d675c; border-bottom:1px solid #c9c2b4; padding-bottom:2px; }
.hero-proof { display:flex; gap:28px; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#8a857a; }
.hero-proof span { display:flex; align-items:center; gap:7px; }
.hero-proof .dot { width:4px; height:4px; background:#8a857a; border-radius:50%; }
.hero-visual { position:relative; }
.hero-visual .frame { background:linear-gradient(155deg,#8f9b7a 0%,#6e7d5a 60%,#59674a 100%); aspect-ratio:4/4.6; display:flex; align-items:flex-end; padding:22px; position:relative; overflow:hidden; }
.hero-tag { background:#fff; color:#2c2a26; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; padding:9px 14px; position:relative; z-index:2; }
.hero-badge { position:absolute; top:18px; right:18px; background:rgba(255,255,255,.14); backdrop-filter:blur(4px); color:#fff; border:1px solid rgba(255,255,255,.35); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; padding:8px 14px; z-index:2; }

/* Included strip */
.included { border-top:1px solid #ece8e0; border-bottom:1px solid #ece8e0; background:#fff; }
.included-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr 1fr; gap:0; }
.included-grid > div { padding:30px 32px; }
.included-grid > div + div { border-left:1px solid #f0ece3; }
.included-grid .lead .label { margin-bottom:10px; }
.included-grid .lead p { font-size:12.5px; color:#6d675c; line-height:1.7; }
.included-grid h4 { font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; margin-bottom:8px; }
.included-grid p { font-size:12px; color:#8a857a; line-height:1.6; }
.ic { width:34px; height:34px; border:1px solid #e3ddd0; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:14px; color:#8a857a; }
.ic svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.4; }

/* Section heads */
.sec-head { text-align:center; margin-bottom:44px; }
.sec-head .label { margin-bottom:14px; display:block; }
.sec-head h2 { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:38px; line-height:1.15; }
.sec-head h2 .i, .sec-head h2 em { font-style:italic; }
.sec-head p { margin:14px auto 0; max-width:460px; font-size:12.5px; color:#8a857a; line-height:1.7; }

/* Collections / sets */
.sets { padding:84px 0; background:#faf9f6; }
.chips { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:36px; }
.chip { font-size:10px; letter-spacing:.12em; text-transform:uppercase; padding:9px 18px; border:1px solid #d8d2c6; border-radius:999px; cursor:pointer; transition:all .15s; background:#fff; color:#4a463e; font-family:'Inter',sans-serif; }
.chip:hover { border-color:#2c2a26; }
.chip.active { background:#2c2a26; color:#fff; border-color:#2c2a26; }
.sets-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.set-card { cursor:pointer; }
.set-card .swatch { display:block; aspect-ratio:1/1.08; position:relative; overflow:hidden; padding:14px; }
.set-card .swatch img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s; z-index:1; }
.set-card:hover .swatch img { transform:scale(1.04); }
.flag { position:relative; z-index:2; background:rgba(255,255,255,.88); color:#2c2a26; font-size:8.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:5px 10px; display:inline-block; }
.set-card .meta { padding:16px 2px 0; }
.set-card .meta .label { margin-bottom:7px; display:block; }
.set-card h3 { font-family:'Cormorant Garamond',serif; font-weight:400; font-size:19px; }
.set-card .price { margin-top:5px; font-size:12px; color:#8a857a; }
.set-card .price s { margin-right:8px; }
.set-card .price .now { color:#2c2a26; font-weight:600; }

/* Fabric section */
.fabric { background:#fff; padding:90px 0; }
.fabric-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.fabric .label { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.fabric .label::before { content:""; width:22px; height:1px; background:#8a857a; }
.fabric h2 { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:44px; line-height:1.08; }
.fabric h2 em { font-style:italic; }
.fabric .body { margin:20px 0 26px; font-size:13px; color:#6d675c; line-height:1.8; max-width:440px; }
.fabric ul { list-style:none; margin:0 0 30px; }
.fabric li { display:flex; gap:12px; font-size:12.5px; color:#4a463e; padding:9px 0; border-bottom:1px solid #f0ece3; }
.fabric li .ic2 { flex:0 0 auto; width:18px; height:18px; border:1px solid #d8d2c6; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:8px; color:#8a857a; }
.fabric .badge { margin-top:18px; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:#8a857a; }
.fabric-visual { position:relative; }
.fabric-visual .main { background:linear-gradient(150deg,#d8c9b4,#c4b096); aspect-ratio:4/5; display:flex; align-items:flex-end; padding:22px; }
.fabric-visual .card { position:absolute; width:190px; right:-30px; bottom:-40px; background:#fff; box-shadow:0 18px 44px rgba(60,50,35,.18); padding:20px; }
.fabric-visual .card h4 { font-family:'Cormorant Garamond',serif; font-weight:400; font-size:17px; }
.fabric-visual .card p { font-size:10px; color:#8a857a; letter-spacing:.1em; text-transform:uppercase; margin-top:8px; }

/* Four pieces */
.pieces { padding:90px 0; background:#faf9f6; }
.pieces-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid #ece8e0; }
.piece { padding:34px 26px; border-left:1px solid #ece8e0; }
.piece:first-child { border-left:none; padding-left:0; }
.piece .num { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:15px; color:#b0a48d; margin-bottom:18px; }
.piece h4 { font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:600; margin-bottom:12px; }
.piece p { font-size:12px; color:#8a857a; line-height:1.7; }

/* Testimonials */
.testi { background:#1e1c19; color:#fff; padding:88px 0; }
.testi .sec-head .label { color:rgba(255,255,255,.55); }
.testi .sec-head h2 { color:#fff; font-size:36px; }
.testi .sec-head h2 .i, .testi .sec-head h2 em { color:#c9c2b4; font-style:italic; }
.testi-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.t-card { background:#2a2723; border:1px solid rgba(255,255,255,.07); padding:26px 22px; }
.stars { color:#c9a86a; font-size:11px; letter-spacing:3px; margin-bottom:14px; }
.t-card p { font-size:12px; color:rgba(255,255,255,.78); line-height:1.7; font-style:italic; }
.t-card .who { margin-top:16px; font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.4); }
.t-score { background:#2a2723; border:1px solid rgba(255,255,255,.07); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.t-score .big { font-family:'Cormorant Garamond',serif; font-size:52px; font-weight:300; line-height:1; }
.t-score .sub { margin-top:10px; font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.45); text-align:center; }

/* Newsletter */
.email { padding:84px 0; background:#faf9f6; }
.email-box { background:#fff; border:1px solid #ece8e0; padding:56px; text-align:center; }
.email-box .label { display:block; margin-bottom:16px; }
.email-box h3 { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:32px; }
.email-box p { margin:12px auto 28px; max-width:420px; font-size:12px; color:#8a857a; }
.email-form { display:flex; gap:10px; max-width:460px; margin:0 auto; }
.email-form input { flex:1; border:1px solid #d8d2c6; padding:13px 16px; font-family:'Inter',sans-serif; font-size:12px; background:#faf9f6; }
.email-form input:focus { outline:none; border-color:#2c2a26; }
.email-note { margin-top:14px; font-size:9.5px; color:#b0a894; letter-spacing:.04em; }

/* Mobile menu */
.menu-toggle { display:none; background:none; border:none; cursor:pointer; padding:8px; }
.menu-toggle span { display:block; width:22px; height:1.5px; background:#2c2a26; margin:5px 0; }

/* Pagination */
.nav-links { margin-top:40px; text-align:center; }
.nav-links .page-numbers { display:inline-block; padding:8px 14px; border:1px solid #d8d2c6; margin:0 4px; font-size:11px; letter-spacing:.1em; }
.nav-links .current { background:#2c2a26; color:#fff; border-color:#2c2a26; }

/* Responsive */
@media (max-width:1024px) {
	.sets-grid { grid-template-columns:repeat(3,1fr); }
	.pieces-grid { grid-template-columns:repeat(2,1fr); gap:24px; }
	.piece { border-left:none; padding:20px 0; }
	.testi-grid { grid-template-columns:repeat(3,1fr); }
	.t-score { grid-column:span 3; }
}
@media (max-width:768px) {
	.topbar { display:none; }
	.main-nav { display:none; }
	.main-nav.open { display:flex; flex-direction:column; position:absolute; top:64px; left:0; right:0; background:#fff; border-bottom:1px solid #ece8e0; padding:24px 40px; gap:18px; z-index:60; }
	.menu-toggle { display:block; }
	.hero-grid, .fabric-grid { grid-template-columns:1fr; gap:44px; }
	.hero h1 { font-size:46px; }
	.hero { padding:48px 0 56px; }
	.included-grid { grid-template-columns:1fr 1fr; }
	.included-grid > div { border:1px solid #f0ece3; }
	.sets-grid { grid-template-columns:repeat(2,1fr); gap:18px; }
	.fabric h2 { font-size:34px; }
	.fabric .card { position:relative; width:100%; right:0; bottom:0; margin-top:20px; }
	.testi-grid { grid-template-columns:1fr 1fr; }
	.t-score { grid-column:span 2; }
	.email-form { flex-direction:column; }
	.container { padding:0 22px; }
}
@media (max-width:480px) {
	.sets-grid { grid-template-columns:1fr; }
	.testi-grid { grid-template-columns:1fr; }
	.t-score { grid-column:span 1; }
	.hero-actions { flex-direction:column; align-items:flex-start; }
}