/*
Theme Name: Sundry
Theme URI: https://example.com/sundry
Author: Your Name
Author URI: https://example.com
Description: A refined shop and interiors theme with a product-style grid, prices and sale badges, category tiles and a calm, editorial feel. WooCommerce-friendly but works out of the box with the demo. Dark by default with a light mode, self-hosted fonts and one-click demo content with original artwork.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sundry
Tags: blog, e-commerce, portfolio, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, full-width-template
*/

:root {
  --bg: #1b1f1f;
  --surface: #232828;
  --surface-2: #2b3030;
  --text: #f0ece4;
  --text-2: #cdc8bd;
  --muted: #9a958a;
  --line: #333938;
  --accent: #46b3a2;
  --accent-ink: #0e1413;
  --accent-hover: #f0ece4;
  --accent-hover-ink: #1b1f1f;
  --sale: #e8746a;

  --font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body: "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-ui: "Jost", system-ui, -apple-system, sans-serif;
  --w-display: 600;
  --lh-display: 1.1;
  --track-display: 0;

  --radius: 2px;
  --radius-ui: 2px;
  --footer-bg: #14191a;
  --footer-text: #f0ece4;
  --footer-muted: #9a958a;
  --footer-line: rgba(255,255,255,.1);
  --overlay: linear-gradient(180deg, rgba(10,14,13,0) 40%, rgba(10,14,13,.85) 100%);
}
:root[data-theme="light"] {
  --bg: #faf8f4;
  --surface: #ffffff;
  --surface-2: #f0ece4;
  --text: #20211e;
  --text-2: #46453f;
  --muted: #7a776e;
  --line: #e3ded4;
  --accent: #2f8577;
  --accent-ink: #ffffff;
  --accent-hover: #20211e;
  --accent-hover-ink: #ffffff;
  --footer-bg: #20211e;
  --footer-text: #faf8f4;
}

body { font-size: 17px; }
.btn, .icon-btn, .meta, .primary-menu a, .mobile-menu a, .section-link, .sun-product__cats, .sun-price, .widget-title { font-family: var(--font-ui); }
.brand__name { font-family: var(--font-display); font-weight: 600; font-size: 1.7rem; font-style: italic; letter-spacing: 0; }
h1, h2, h3, h4, .card__title, .entry-title, .section-title, .sun-product__title { font-family: var(--font-display); font-weight: 600; }

.site-header { border-bottom: 1px solid var(--line); }
.primary-menu > li > a { font-size: .9rem; font-weight: 400; letter-spacing: .02em; text-transform: none; }
.section-title { font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
.btn { border-radius: 2px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; font-size: .78rem; }

/* ---------- Intro ---------- */
.sun-intro { padding-block: clamp(32px, 5vw, 56px) 1.5rem; text-align: center; }
.sun-intro__kicker { font-family: var(--font-ui); text-transform: uppercase; letter-spacing: .2em; font-size: .72rem; color: var(--accent); }
.sun-intro__title { font-size: clamp(2rem, 5vw, 3.4rem); font-style: italic; margin-block: .4rem; }
.sun-intro__sort { color: var(--muted); font-family: var(--font-ui); font-size: .85rem; }

/* ---------- Product grid ---------- */
.sun-grid { gap: 36px 24px; }
.sun-product { display: flex; flex-direction: column; gap: .7rem; }
.sun-product .media { aspect-ratio: 1; background: var(--surface-2); border-radius: 2px; }
.sun-product__body { display: flex; flex-direction: column; gap: .35rem; }
.sun-product__cats { display: flex; gap: .5rem; font-size: .68rem; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.sun-product__cats a:hover { color: var(--accent); }
.sun-product__title { font-size: 1.35rem; line-height: 1.15; }
.sun-product__title a:hover { color: var(--accent); }
.sun-price { font-family: var(--font-ui); font-size: 1.05rem; display: flex; gap: .5rem; align-items: baseline; }
.sun-price__old { color: var(--muted); text-decoration: line-through; font-size: .9rem; }
.sun-price__now { font-weight: 500; }
.sun-product__btn { margin-top: .4rem; align-self: flex-start; background: transparent; color: var(--text); border: 1px solid var(--line); }
.sun-product__btn:hover { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.sun-badge { position: absolute; top: 10px; left: 10px; z-index: 2; background: var(--surface); color: var(--text); font-family: var(--font-ui); font-size: .68rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; padding: .25rem .6rem; border-radius: 2px; }
.sun-badge--sale { background: var(--sale); color: #fff; }
.sun-shop__more { text-align: center; margin-top: 2.5rem; }

/* ---------- Rooms ---------- */
.sun-rooms { background: var(--surface); }
.sun-rooms__grid { display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); }
.sun-room { position: relative; display: block; aspect-ratio: 3/2; overflow: hidden; border-radius: 2px; }
.sun-room__media { position: absolute; inset: 0; }
.sun-room__img, .sun-room .media__ph { width: 100%; height: 100%; object-fit: cover; }
.sun-room .media__ph { position: static; display: block; }
.sun-room::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,14,13,.1), rgba(10,14,13,.7)); }
.sun-room__name { position: absolute; left: 1.2rem; bottom: 1.6rem; z-index: 2; color: #fff; font-family: var(--font-display); font-size: 1.6rem; font-style: italic; }
.sun-room__count { position: absolute; left: 1.2rem; bottom: 1rem; z-index: 2; color: rgba(255,255,255,.8); font-family: var(--font-ui); font-size: .78rem; }
.sun-room:hover .sun-room__img { transform: scale(1.05); }
@media (max-width: 860px) { .sun-rooms__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .sun-rooms__grid { grid-template-columns: 1fr; } }

/* ---------- Journal + signup ---------- */
.sun-journal .card .media { aspect-ratio: 4/3; }
.sun-signup { padding-bottom: clamp(36px, 5vw, 56px); }
.signup--band { background: var(--surface); border: 1px solid var(--line); border-radius: 2px; padding: clamp(28px, 4vw, 48px); text-align: center; align-items: center; }
.signup--band .signup__title { font-family: var(--font-display); font-style: italic; font-size: 2rem; }
.signup--band .signup__form { max-width: 440px; margin-inline: auto; width: 100%; }
.signup--band .signup__button { background: var(--accent); color: var(--accent-ink); }

.widget-title { font-family: var(--font-ui); text-transform: uppercase; letter-spacing: .1em; font-size: .82rem; }
.entry-content { font-family: var(--font-body); }