/* =========================================================
   ANIMO LABEL — PRODUCT CATALOG
   Proporsi mengikuti Beranda:
   - container 1500px / 5%
   - spacing section 105px
   - heading clamp yang konsisten
   - grid desktop 4 kolom
   - grid HP 2 kolom
   ========================================================= */

.catalog-hero {
max-width:1500px;
margin:auto;
padding:86px 5% 68px;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:50px;
background:radial-gradient(circle at 88% 15%,#e0f1e7 0,transparent 30%),linear-gradient(180deg,#fbfefc,#fff);
}

.catalog-hero small {
font-size:11px;
letter-spacing:.16em;
font-weight:900;
color:#16834a;
}

.catalog-hero h1 {
max-width:800px;
margin:10px 0 18px;
font-size:clamp(35px,4vw,55px);
line-height:1.05;
letter-spacing:-.04em;
font-weight:800;
}

.catalog-hero p {
max-width:760px;
margin:0;
font-size:16px;
line-height:1.75;
color:#66746c;
font-weight:500;
}

.catalog-hero-link {
font-weight:800;
color:#0d5c34;
white-space:nowrap;
}

.catalog-shell {
padding:38px 5% 105px;
background:#f5f9f6;
border-top:1px solid #e5eee9;
}

.catalog-toolbar-modern {
max-width:1500px;
margin:0 auto 38px;
padding:20px;
background:#fff;
border:1px solid #dfe9e3;
border-radius:18px;
box-shadow:0 12px 35px rgba(18,59,42,.055);
}

.catalog-search {
height:52px;
display:grid;
grid-template-columns:35px 1fr 75px;
align-items:center;
border:1px solid #d7e4dc;
border-radius:12px;
background:#fbfdfc;
overflow:hidden;
}

.catalog-search input {
border:0;
outline:0;
background:transparent;
font:500 14px inherit;
padding:0 8px;
}

.catalog-search button {
height:34px;
margin-right:7px;
border:0;
border-radius:8px;
background:#eaf4ee;
color:#0d5c34;
font-weight:800;
cursor:pointer;
}

.catalog-meta {
display:flex;
justify-content:space-between;
margin:16px 2px 13px;
color:#718078;
font-size:13px;
font-weight:700;
}

.catalog-chips {
display:flex;
flex-wrap:wrap;
gap:8px;
}

.catalog-chips button {
border:1px solid #dce8e1;
background:#fff;
color:#53635a;
border-radius:999px;
padding:9px 14px;
font:700 12px inherit;
cursor:pointer;
}

.catalog-chips button.active {
background:#0b2a1d;
border-color:#0b2a1d;
color:#fff;
}

.catalog-grid {
max-width:1500px;
margin:auto;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:18px;
}

.catalog-product-card {
border:1px solid #dfe9e3!important;
border-radius:18px!important;
box-shadow:0 7px 22px rgba(18,59,42,.045)!important;
}

.catalog-product-card:hover {
transform:translateY(-4px);
box-shadow:0 18px 40px rgba(18,59,42,.10)!important;
}

.catalog-product-card .product-image {
aspect-ratio:1/1!important;
padding:20px!important;
background:radial-gradient(circle at 50% 20%,#fff 0,#f8fbf9 48%,#e9f2ed 100%)!important;
}

.catalog-product-card .product-image img {
object-fit:contain!important;
mix-blend-mode:multiply;
filter:contrast(1.02) saturate(.97);
}

.catalog-product-card .product-info {
padding:18px 18px 20px!important;
}

.catalog-product-card .product-info h3 {
font-size:17px!important;
line-height:1.3!important;
font-weight:800!important;
}

.catalog-product-card .product-info p {
font-size:13px!important;
line-height:1.55!important;
color:#718078;
font-weight:500;
}

.catalog-product-card .product-info strong {
font-size:15px!important;
font-weight:800!important;
}

.catalog-product-card .product-info small {
color:#32714d!important;
background:#f0f7f3!important;
border:1px solid #e0ece5;
padding:4px 7px;
border-radius:999px;
}

.catalog-cta {
margin:0 5% 95px;
padding:68px 6%;
border-radius:24px;
background:#0b2a1d;
color:#fff;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:40px;
}

.catalog-cta small {
letter-spacing:.16em;
font-size:11px;
font-weight:900;
color:#bfe5cd;
}

.catalog-cta h2 {
max-width:850px;
margin:10px 0;
font-size:clamp(38px,5vw,65px);
line-height:1;
letter-spacing:-.04em;
font-weight:800;
}

.catalog-cta p {
font-size:16px;
line-height:1.6;
color:#c9d8d0;
font-weight:500;
}

.premium-detail {
max-width:1500px!important;
padding:35px 5% 100px!important;
background:linear-gradient(180deg,#fff,#f7faf8);
}

.premium-detail .detail-breadcrumb {
padding:8px 0 22px;
}

.premium-detail .detail-breadcrumb a {
color:#0d5c34;
font-weight:800;
}

.premium-detail .static-detail-grid {
gap:70px;
}

.premium-detail .detail-photo {
min-height:620px;
border-radius:24px;
border:1px solid #d9e7df;
background:radial-gradient(circle at 50% 12%,#fff 0,rgba(255,255,255,.8) 22%,transparent 50%),linear-gradient(145deg,#fff,#eef5f1);
box-shadow:0 24px 65px rgba(20,70,45,.10);
padding:45px;
}

.premium-detail .detail-photo img {
height:520px;
object-fit:contain;
mix-blend-mode:multiply;
filter:contrast(1.03) saturate(.98) drop-shadow(0 24px 25px rgba(27,66,46,.15));
transition:transform .3s;
}

.premium-detail .detail-photo:hover img {
transform:scale(1.018);
}

.premium-detail .detail-copy {
padding:30px 0;
}

.premium-detail .detail-copy>small {
color:#16834a;
font-size:11px;
letter-spacing:.16em;
font-weight:900;
}

.premium-detail .detail-copy h1 {
font-size:clamp(38px,5vw,70px);
line-height:1;
letter-spacing:-.045em;
font-weight:800;
}

.premium-detail .detail-copy>p {
font-size:17px;
line-height:1.8;
color:#66746c;
font-weight:500;
}

.premium-detail .detail-price {
font-size:25px;
color:#0b2a1d;
font-weight:800;
}

.premium-detail .detail-actions .btn {
border-radius:10px;
padding:14px 19px;
}

.premium-detail .detail-shop {
border:1px solid #d6e3db!important;
background:#fff!important;
color:#183b2b!important;
}

.premium-detail .detail-note {
border-left:4px solid #16834a;
background:#f1f8f4;
border-radius:0 14px 14px 0;
color:#5e6c64;
padding:18px 20px;
}

.premium-detail .detail-loading,
.premium-detail .detail-not-found {
padding:120px 20px;
text-align:center;
}

@media(max-width:1000px) {
.catalog-grid {
grid-template-columns:repeat(3,minmax(0,1fr));
}

.catalog-hero {
display:block;
}

.catalog-hero-link {
display:inline-block;
margin-top:22px;
}
}

@media(max-width:850px) {
.catalog-hero {
padding:60px 5% 42px;
}

.catalog-hero h1 {
font-size:clamp(35px,7vw,45px);
}

.catalog-shell {
padding:30px 4% 75px;
}

.catalog-grid {
grid-template-columns:repeat(2,minmax(0,1fr));
gap:13px;
}

.catalog-product-card .product-image {
padding:12px!important;
}

.catalog-product-card .product-info {
padding:14px!important;
}

.catalog-product-card .product-info h3 {
font-size:15px!important;
}

.catalog-product-card .product-info p {
display:none;
}

.catalog-cta {
margin:0 4% 70px;
padding:48px 7%;
display:block;
}

.catalog-cta .btn {
margin-top:18px;
}

.premium-detail {
padding:25px 4% 70px!important;
}

.premium-detail .static-detail-grid {
grid-template-columns:1fr;
gap:30px;
}

.premium-detail .detail-photo {
min-height:390px;
padding:25px;
}

.premium-detail .detail-photo img {
height:340px;
}

.premium-detail .detail-copy {
padding:0;
}

.premium-detail .detail-copy h1 {
font-size:30px;
}
}

@media(max-width:560px) {
.catalog-hero {
padding:48px 5% 34px;
}

.catalog-hero h1 {
font-size:clamp(32px,9vw,39px);
}

.catalog-hero p {
font-size:15px;
line-height:1.7;
}

.catalog-hero-link {
margin-top:18px;
}

.catalog-shell {
padding:24px 4% 65px;
}

.catalog-toolbar-modern {
margin-bottom:28px;
padding:15px;
border-radius:15px;
}

.catalog-search {
height:48px;
grid-template-columns:32px 1fr 64px;
}

.catalog-search input {
font-size:13px;
}

.catalog-meta {
margin-top:14px;
font-size:12px;
}

.catalog-chips {
gap:6px;
}

.catalog-chips button {
padding:8px 11px;
font-size:11px;
}

.catalog-grid {
grid-template-columns:1fr 1fr;
gap:10px;
}

.catalog-product-card {
border-radius:14px!important;
}

.catalog-product-card .product-image {
padding:9px!important;
}

.catalog-product-card .product-info {
padding:12px!important;
}

.catalog-product-card .product-info h3 {
font-size:14px!important;
line-height:1.28!important;
}

.catalog-product-card .product-info strong {
font-size:13px!important;
}

.catalog-product-card .product-info small {
font-size:10px;
}

.catalog-cta {
margin:0 4% 55px;
padding:38px 7%;
border-radius:18px;
}

.catalog-cta h2 {
font-size:clamp(32px,9vw,39px);
}

.catalog-cta p {
font-size:14px;
}

.premium-detail .detail-photo {
min-height:330px;
}

.premium-detail .detail-photo img {
height:280px;
}
}