/*
 * Trang trong (shop, sản phẩm, giỏ, checkout, dự án, dịch vụ, blog).
 *
 * Trang chủ dùng forma.css với markup riêng. Các trang này do Blocksy + WooCommerce
 * render, nên ở đây chỉ ÁNH XẠ design token của FORMA lên chúng — không dựng lại layout.
 * Nhờ vậy khỏi phải tự viết template checkout, mà vẫn đúng nhận diện.
 */

:root{
  --navy:#2A3A43; --navy-deep:#1D2A31; --bone:#F3EFE8; --paper:#FAF8F4;
  --stone:#E7E0D4; --ink:#1E1D1B; --ink-2:#5F5A52; --ink-3:#8C867C;
  --brass:#B6935E; --terra:#B26A43;
  --line:rgba(30,29,27,.12);
  --forma-serif:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --forma-sans:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

body{ font-family:var(--forma-sans); font-weight:300; color:var(--ink); background:var(--paper); }
h1,h2,h3,h4,.woocommerce-loop-product__title,.product_title{
  font-family:var(--forma-serif); font-weight:500; letter-spacing:-.01em; line-height:1.1;
}

/* nút: vuông góc, chữ nhỏ giãn — đúng ngôn ngữ FORMA */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .wp-block-button__link, .ct-button{
  border-radius:0 !important;
  background:var(--navy) !important; color:#F1ECE3 !important;
  font-family:var(--forma-sans); font-weight:400; font-size:14px; letter-spacing:.04em;
  padding:16px 30px; transition:background .4s cubic-bezier(.22,.7,.12,1);
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce #respond input#submit:hover{ background:var(--navy-deep) !important; }

.woocommerce a.button.alt, .woocommerce button.button.alt{ background:var(--brass) !important; }

/* giá */
.woocommerce .price, .woocommerce span.amount{ color:var(--ink); font-weight:400; }
.woocommerce del span.amount{ color:var(--ink-3); font-weight:300; }
.woocommerce ins{ text-decoration:none; }

/* thẻ sản phẩm trong shop */
.woocommerce ul.products li.product{ text-align:left; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:22px; margin:14px 0 4px; }
.woocommerce ul.products li.product img{ border-radius:0; }
.woocommerce span.onsale{
  border-radius:0; background:var(--terra); color:#fff;
  font-family:var(--forma-sans); font-size:12px; letter-spacing:.04em; font-weight:400;
  min-width:auto; min-height:auto; padding:6px 12px; line-height:1;
}

/* bảng giỏ hàng + checkout */
.woocommerce table.shop_table{ border-radius:0; border-color:var(--line); }
.woocommerce table.shop_table th{ font-weight:500; }
.woocommerce-checkout #payment{ background:var(--bone); border-radius:0; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container--default .select2-selection--single{
  border-radius:0; border:1px solid var(--line); background:#fff; padding:14px 16px; font-family:var(--forma-sans);
}
.woocommerce-info, .woocommerce-message{ border-top-color:var(--brass); border-radius:0; }

/* swatches màu vải/chất liệu */
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item){
  border-radius:0; box-shadow:0 0 0 1px var(--line);
}
.woo-variation-swatches .variable-items-wrapper .variable-item.selected{
  box-shadow:0 0 0 2px var(--brass);
}

/* lưới dự án + dịch vụ ở trang archive */
.forma-archive{ max-width:1320px; margin:0 auto; padding:clamp(60px,6.8vw,104px) clamp(20px,4vw,56px); }
.forma-archive h1{ font-size:clamp(46px,5.4vw,82px); margin:0 0 clamp(28px,3.2vw,44px); }
.forma-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,2.4vw,34px); }
.forma-grid article{ margin:0; }
.forma-grid img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.forma-grid h2{ font-size:26px; margin:16px 0 4px; }
.forma-grid p{ color:var(--ink-2); font-size:14.5px; margin:0; }
.forma-single{ max-width:900px; margin:0 auto; padding:clamp(60px,6.8vw,104px) clamp(20px,4vw,56px); }
.forma-single h1{ font-size:clamp(40px,4.6vw,68px); margin:0 0 20px; }
.forma-single .lead{ color:var(--ink-2); font-size:18px; }
.forma-single img{ width:100%; height:auto; margin:28px 0; }
@media (max-width:900px){ .forma-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .forma-grid{ grid-template-columns:minmax(0,1fr); } }

/* Trang trong không có hero, nên header phải đặc ngay và nội dung phải đẩy xuống dưới nó. */
.forma-inner-page .hdr{ position:sticky; top:0; }
.forma-inner-page > main,
.forma-inner-page .woocommerce-notices-wrapper,
.forma-inner-page .ct-container,
.forma-inner-page #main-container{ padding-top:clamp(24px,3vw,48px); }
.forma-inner-page .woocommerce-breadcrumb{
  font-size:13px; letter-spacing:.03em; color:var(--ink-3);
  max-width:1320px; margin:0 auto; padding:24px clamp(20px,4vw,56px) 0;
}
/* nút chính trong trang sản phẩm dùng navy, brass để dành cho điểm nhấn nhỏ */
.woocommerce a.button.alt, .woocommerce button.button.alt{ background:var(--navy) !important; }
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{ background:var(--navy-deep) !important; }