/*
Theme Name: Atelier
Theme URI: https://example.com/atelier
Author: Przygotowane w Claude
Author URI: https://example.com
Description: Elegancki motyw galerii sztuki dla WooCommerce. Zaprojektowany do sprzedaży obrazów: przestronna siatka prac, ceny i wymiary w stylu muzealnych tabliczek opisowych, pełna zgodność z koszykiem i kasą WooCommerce. Motyw klasyczny, gotowy do wgrania.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
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: atelier
Tags: e-commerce, art, gallery, custom-menu, featured-images, translation-ready, two-columns, right-sidebar
WC requires at least: 6.0
WC tested up to: 10.9
*/

/* =========================================================
   ATELIER — design tokens
   Palette: gallery white + ink, single deep-slate accent.
   Signature: museum wall-label placards (mono, letterspaced).
   ========================================================= */
:root{
  --paper:      #FCFCFA;   /* gallery white, barely warm */
  --panel:      #F3F2EE;   /* subtle wall panel, used sparingly */
  --ink:        #16161A;   /* near-black text */
  --stone:      #6B6B70;   /* secondary text */
  --line:       #E4E3DE;   /* hairlines */
  --accent:     #232532;   /* deep slate ink — links, buttons */
  --accent-2:   #3B3E52;   /* hover */
  --sale:       #7A2E2E;   /* muted oxblood for sale price only */

  --serif: "Fraunces", Georgia, "Times New Roman", serif;
  --sans:  "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono:  "Space Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --wrap: 1240px;
  --gap: clamp(1.5rem, 4vw, 3.5rem);
  --radius: 0px;   /* galleries hang square edges */
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:var(--accent); text-decoration:none; }
a:hover{ color:var(--accent-2); }

h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:500;
  line-height:1.08;
  letter-spacing:-0.01em;
  margin:0 0 0.6em;
  color:var(--ink);
}
h1{ font-size:clamp(2.4rem, 6vw, 4.4rem); font-weight:400; }
h2{ font-size:clamp(1.8rem, 3.6vw, 2.7rem); }
h3{ font-size:1.35rem; }
p{ margin:0 0 1.1em; }

.container{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1.2rem,4vw,2.5rem); }

/* ---- wall-label eyebrow / placard language ---- */
.eyebrow{
  font-family:var(--mono);
  font-size:0.72rem;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--stone);
  margin:0 0 1.2rem;
}

/* Skip link */
.skip-link{ position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff; padding:.6rem 1rem; z-index:1000; }
.skip-link:focus{ left:1rem; top:1rem; }

/* =========================================================
   Header
   ========================================================= */
.site-header{
  position:sticky; top:0; z-index:100;
  background:color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter:saturate(1.1) blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  min-height:76px; gap:2rem;
}
.brand{ display:flex; align-items:baseline; gap:.6rem; }
.brand a{ color:var(--ink); }
.brand .wordmark{
  font-family:var(--serif);
  font-size:1.5rem;
  font-weight:500;
  letter-spacing:0.02em;
}
.brand .tagline{
  font-family:var(--mono);
  font-size:0.62rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--stone);
}
.custom-logo{ max-height:44px; width:auto; }

.main-nav ul{ list-style:none; display:flex; gap:1.6rem; margin:0; padding:0; align-items:center; }
.main-nav a{
  color:var(--ink);
  font-size:0.92rem;
  letter-spacing:0.01em;
  padding:.4rem 0;
  position:relative;
}
.main-nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--ink); transition:right .28s ease;
}
.main-nav a:hover::after,
.main-nav .current-menu-item > a::after{ right:0; }

.header-tools{ display:flex; align-items:center; gap:1.1rem; }
.cart-link{
  font-family:var(--mono); font-size:0.78rem; letter-spacing:0.06em;
  color:var(--ink); display:inline-flex; align-items:center; gap:.4rem;
}
.cart-link .count{
  background:var(--ink); color:#fff; border-radius:999px;
  min-width:1.3rem; height:1.3rem; padding:0 .35rem;
  display:inline-grid; place-items:center; font-size:0.68rem;
}

.menu-toggle{ display:none; }

/* =========================================================
   Front page — hero
   ========================================================= */
.hero{ border-bottom:1px solid var(--line); }
.hero .container{
  display:grid; grid-template-columns:1.05fr 0.95fr; gap:var(--gap);
  align-items:center; padding-block:clamp(3rem,7vw,6rem);
}
.hero-copy h1 span.line{ display:block; }
.hero-copy .lede{
  font-size:1.15rem; color:var(--stone); max-width:44ch; margin-top:1.4rem;
}
.hero-actions{ margin-top:2.2rem; display:flex; gap:1rem; flex-wrap:wrap; }

.hero-figure{ position:relative; }
.hero-figure .frame{
  background:var(--panel);
  padding:clamp(1rem,2.5vw,2rem);
  box-shadow:0 30px 60px -30px rgba(20,20,26,.35);
}
.hero-figure img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.hero-figure .placard{
  position:absolute; left:clamp(1rem,3vw,2.5rem); bottom:-1.1rem;
  background:var(--paper); border:1px solid var(--line);
  padding:.7rem 1rem;
}
.placard .p-title{ font-family:var(--serif); font-size:1rem; }
.placard .p-meta{
  font-family:var(--mono); font-size:0.68rem; letter-spacing:0.1em;
  color:var(--stone); text-transform:uppercase; margin-top:.2rem;
}

/* Buttons */
.btn,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt{
  display:inline-block;
  font-family:var(--sans); font-weight:500; font-size:0.95rem;
  letter-spacing:0.02em; line-height:1;
  padding:0.95rem 1.6rem;
  background:var(--accent); color:#fff !important;
  border:1px solid var(--accent); border-radius:var(--radius);
  cursor:pointer; transition:background .2s ease, transform .2s ease;
  text-align:center;
}
.btn:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover{
  background:var(--accent-2); border-color:var(--accent-2); color:#fff !important;
}
.btn.ghost{
  background:transparent; color:var(--ink); border:1px solid var(--ink);
}
.btn.ghost:hover{ background:var(--ink); color:#fff; }

/* =========================================================
   Section headings
   ========================================================= */
.section{ padding-block:clamp(3rem,6vw,5.5rem); }
.section-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:1rem; margin-bottom:2.6rem; border-bottom:1px solid var(--line);
  padding-bottom:1.2rem; flex-wrap:wrap;
}
.section-head h2{ margin:0; }
.section-head .more{
  font-family:var(--mono); font-size:0.75rem; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--ink);
}

/* =========================================================
   WooCommerce — product grid
   ========================================================= */
.woocommerce ul.products,
ul.products{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(clamp(220px,26vw,300px), 1fr));
  gap:clamp(1.4rem, 3vw, 2.6rem);
  margin:0 !important; padding:0 !important; list-style:none;
}
.woocommerce ul.products li.product,
ul.products li.product{
  width:auto !important; margin:0 !important; float:none !important;
  padding:0 !important; text-align:left;
}
.woocommerce ul.products li.product a img,
ul.products li.product img{
  margin:0 0 1rem !important;
  width:100%; aspect-ratio:4/5; object-fit:cover;
  background:var(--panel);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), filter .5s ease;
}
.woocommerce ul.products li.product a:hover img{ transform:scale(1.03); }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2,
ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--serif) !important; font-weight:500 !important;
  font-size:1.15rem !important; padding:0 !important; margin:0 0 .35rem !important;
  color:var(--ink);
}
/* price rendered like a museum placard */
.woocommerce ul.products li.product .price,
ul.products li.product .price{
  font-family:var(--mono) !important; color:var(--ink) !important;
  font-size:0.85rem !important; letter-spacing:0.06em; font-weight:400 !important;
  margin:0 0 .8rem !important;
}
.woocommerce ul.products li.product .price del{ color:var(--stone); opacity:.7; }
.woocommerce ul.products li.product .price ins{ color:var(--sale); text-decoration:none; }
.woocommerce ul.products li.product .button{ margin-top:.2rem; }
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale{
  background:var(--ink); color:#fff; border-radius:0;
  font-family:var(--mono); font-size:0.66rem; letter-spacing:0.12em;
  text-transform:uppercase; padding:.35rem .6rem; min-height:0; line-height:1;
  top:.6rem; left:.6rem; right:auto; margin:0;
}

/* =========================================================
   WooCommerce — single product ("wall label")
   ========================================================= */
.woocommerce div.product{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:var(--gap); }
.woocommerce div.product .woocommerce-product-gallery{ width:100% !important; float:none !important; margin:0 !important; }
.woocommerce div.product .summary{ margin:0 !important; float:none !important; width:100% !important; }
.woocommerce div.product .product_title{
  font-family:var(--serif); font-size:clamp(2rem,4vw,3rem); font-weight:400;
  margin-bottom:.5rem;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-family:var(--mono); color:var(--ink); font-size:1.15rem;
  letter-spacing:0.04em; margin:0 0 1.4rem;
}
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins{ color:var(--sale); text-decoration:none; }
.woocommerce div.product .woocommerce-product-details__short-description{
  color:var(--stone); border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); padding:1.3rem 0; margin-bottom:1.6rem;
}
.woocommerce div.product form.cart{ margin-top:.5rem; }
.woocommerce div.product form.cart .quantity input{
  padding:.9rem .6rem; border:1px solid var(--line); font-family:var(--mono);
  width:4.5rem; text-align:center;
}
.woocommerce div.product .product_meta{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--stone); margin-top:1.8rem;
  border-top:1px solid var(--line); padding-top:1.2rem;
}
.woocommerce div.product .product_meta a{ color:var(--ink); }
.woocommerce-tabs{ margin-top:3rem; grid-column:1 / -1; }
.woocommerce div.product .woocommerce-tabs ul.tabs{ padding:0; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before{ border-color:var(--line); }
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:transparent; border-color:var(--line); border-radius:0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ font-family:var(--sans); }

/* Related products full width under */
.woocommerce .related.products,
.woocommerce .upsells.products{ grid-column:1 / -1; margin-top:3.5rem; }
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2{
  font-size:1.6rem; border-bottom:1px solid var(--line); padding-bottom:1rem; margin-bottom:2rem;
}

/* =========================================================
   WooCommerce — notices, breadcrumb, cart, checkout
   ========================================================= */
.woocommerce-breadcrumb{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--stone); margin-bottom:2rem;
}
.woocommerce-breadcrumb a{ color:var(--stone); }
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error{
  border-top:2px solid var(--accent); background:var(--panel);
  border-radius:0; font-size:0.95rem;
}
.woocommerce .woocommerce-error{ border-top-color:var(--sale); }

.woocommerce table.shop_table{ border:1px solid var(--line); border-radius:0; }
.woocommerce table.shop_table th{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase;
}
.woocommerce-cart table.cart img{ width:80px; }
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-checkout #order_review,
.woocommerce form.checkout_coupon{ border:1px solid var(--line); padding:1.6rem; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.select2-container .select2-selection--single{
  border:1px solid var(--line) !important; border-radius:0 !important; padding:.85rem !important;
}
.woocommerce-checkout h3{ font-size:1.4rem; }

/* Result count + ordering on shop */
.woocommerce .woocommerce-result-count{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--stone);
}
.woocommerce .woocommerce-ordering select{
  border:1px solid var(--line); padding:.6rem; border-radius:0; font-family:var(--sans);
}

/* =========================================================
   Blog / pages fallback
   ========================================================= */
.page-hero{ border-bottom:1px solid var(--line); padding-block:clamp(2.5rem,5vw,4rem); }
.entry{ max-width:72ch; margin-inline:auto; padding-block:clamp(2rem,5vw,4rem); }
.entry .entry-title{ margin-bottom:1rem; }
.post-list{ display:grid; gap:2.5rem; }

/* =========================================================
   Footer
   ========================================================= */
.site-footer{
  border-top:1px solid var(--line); margin-top:4rem;
  padding-block:clamp(2.5rem,5vw,4rem); background:var(--paper);
}
.site-footer .container{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2.5rem;
}
.site-footer .wordmark{ font-family:var(--serif); font-size:1.4rem; }
.site-footer .foot-note{ color:var(--stone); font-size:0.9rem; max-width:36ch; }
.footer-widgets h3, .site-footer h3{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--stone); margin-bottom:1rem;
}
.site-footer ul{ list-style:none; padding:0; margin:0; }
.site-footer li{ margin-bottom:.5rem; }
.site-footer a{ color:var(--ink); }
.colophon{
  border-top:1px solid var(--line); margin-top:2.5rem; padding-top:1.5rem;
  font-family:var(--mono); font-size:0.7rem; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--stone);
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:900px){
  .hero .container{ grid-template-columns:1fr; }
  .hero-figure{ order:-1; max-width:460px; }
  .woocommerce div.product{ grid-template-columns:1fr; }
  .site-footer .container{ grid-template-columns:1fr 1fr; }
}
@media (max-width:680px){
  body{ font-size:16px; }
  .menu-toggle{
    display:inline-flex; background:none; border:1px solid var(--line);
    padding:.55rem .8rem; font-family:var(--mono); font-size:.72rem;
    letter-spacing:.1em; text-transform:uppercase; cursor:pointer; color:var(--ink);
  }
  .main-nav{
    position:fixed; inset:76px 0 auto 0; background:var(--paper);
    border-bottom:1px solid var(--line); transform:translateY(-120%);
    transition:transform .3s ease; padding:1.5rem; z-index:99;
  }
  .main-nav.open{ transform:translateY(0); }
  .main-nav ul{ flex-direction:column; gap:1.1rem; align-items:flex-start; }
  .site-footer .container{ grid-template-columns:1fr; }
  .tagline{ display:none; }
}

/* Accessibility */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
.woocommerce a.button:focus-visible, .woocommerce button:focus-visible{
  outline:2px solid var(--accent); outline-offset:3px;
}
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
}

/* WordPress core alignment helpers */
.alignright{ float:right; margin:0 0 1rem 1.5rem; }
.alignleft{ float:left; margin:0 1.5rem 1rem 0; }
.aligncenter{ display:block; margin-inline:auto; }
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); width:1px; height:1px; overflow:hidden; }