/* ===== Shop / About / Contact — extends styles.css ===== */

/* generic page hero */
.page-hero{background:linear-gradient(180deg,var(--sky-100),var(--sky-50));padding:50px 0 56px;text-align:center;}
.page-hero .eyebrow{margin-bottom:16px;}
.page-hero h1{font-size:clamp(34px,4.6vw,54px);margin-bottom:14px;color:var(--ink);}
.page-hero h1 .accent{color:var(--orange);}
.page-hero p{font-size:17px;max-width:640px;margin:0 auto;}
.page-hero-lead{max-width:760px;margin:0 auto;}
.page-hero-lead p{font-size:16.5px;color:var(--body);line-height:1.7;}

/* full category description — left-aligned readable prose below the products */
.cat-desc{max-width:960px;margin:0 auto;}
.cat-desc h2{font-size:clamp(24px,2.8vw,32px);color:var(--ink);margin:34px 0 14px;line-height:1.2;}
.cat-desc h2:first-child{margin-top:0;}
.cat-desc h3{font-size:21px;color:var(--ink);margin:26px 0 10px;}
.cat-desc h4{font-size:17px;color:var(--navy);font-family:var(--head);font-weight:700;margin:20px 0 8px;}
.cat-desc p{font-size:16px;line-height:1.78;color:var(--body);margin-bottom:16px;}
.cat-desc p strong,.cat-desc li strong{color:var(--ink);}
.cat-desc a{color:var(--navy);font-weight:600;text-decoration:underline;text-decoration-color:var(--sky-200);text-underline-offset:2px;}
.cat-desc a:hover{text-decoration-color:var(--orange);}
.cat-desc ul,.cat-desc ol{margin:8px 0 20px;padding-left:0;display:grid;gap:10px;}
.cat-desc ul li{position:relative;list-style:none;padding-left:30px;font-size:15.5px;line-height:1.6;color:var(--body);}
.cat-desc ul li::before{content:"\2713";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:6px;background:var(--orange-50);color:var(--orange);font-size:11px;font-weight:700;display:grid;place-items:center;}
.cat-desc ol{counter-reset:cd;}
.cat-desc ol li{position:relative;list-style:none;counter-increment:cd;padding-left:38px;font-size:15.5px;line-height:1.6;color:var(--body);}
.cat-desc ol li::before{content:counter(cd);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:7px;background:var(--navy);color:#fff;font-family:var(--head);font-weight:700;font-size:12px;display:grid;place-items:center;}
.cat-desc img{max-width:100%;height:auto;border-radius:var(--r-sm);}

/* ============ SHOP ============ */
.shop-layout{display:grid;grid-template-columns:268px 1fr;gap:40px;align-items:start;}
.shop-side{position:sticky;top:96px;display:grid;gap:20px;}
.filter-box{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;box-shadow:var(--shadow-sm);}
.filter-box h4{font-family:var(--head);font-weight:700;font-size:15px;color:var(--ink);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.filter-box h4 i{color:var(--orange);}
.filter-list{display:grid;gap:2px;}
.filter-list button{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;background:none;border:none;padding:10px 12px;border-radius:9px;font-family:var(--body-font);font-size:14px;color:var(--body);cursor:pointer;transition:.18s;}
.filter-list button:hover{background:var(--sky-50);color:var(--navy);}
.filter-list button.active{background:var(--orange-50);color:var(--orange);font-weight:600;}
.filter-list button .ct{font-size:12px;color:var(--muted);background:var(--sky-100);border-radius:999px;padding:1px 9px;}
.filter-list button.active .ct{background:#fff;color:var(--orange);}
.side-cta{background:linear-gradient(150deg,var(--navy),var(--navy-900));border-radius:var(--r-lg);padding:26px;color:#fff;text-align:center;}
.side-cta .ico{width:54px;height:54px;border-radius:14px;background:var(--orange);display:grid;place-items:center;font-size:26px;margin:0 auto 14px;}
.side-cta h4{color:#fff;font-size:17px;margin-bottom:8px;}
.side-cta p{color:#bcd0f5;font-size:13px;margin-bottom:16px;}

.shop-main .shop-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap;}
.shop-bar .count{font-size:14.5px;color:var(--body);}
.shop-bar .count strong{color:var(--ink);font-family:var(--head);}
.shop-bar .sort{display:flex;align-items:center;gap:10px;}
.shop-bar .sort label{font-size:13.5px;color:var(--muted);font-family:var(--head);font-weight:600;}
.shop-bar select{border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-family:var(--body-font);font-size:13.5px;color:var(--ink);background:#fff;outline:none;cursor:pointer;}

.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.shop-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.25s;display:flex;flex-direction:column;}
.shop-card.hide{display:none;}
.shop-card:hover{box-shadow:var(--shadow);transform:translateY(-4px);}
.shop-card .top{position:relative;height:230px;overflow:hidden;}
.shop-card .top img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s;}
.shop-card:hover .top img{transform:scale(1.05);}
.shop-card .cat-pill{position:absolute;bottom:0;left:12px;background:rgba(23,58,134,.95);color:#fff;font-family:var(--head);font-weight:700;font-size:12px;padding:6px 13px;border-radius:999px;backdrop-filter:blur(6px);letter-spacing:0.03em;text-transform:uppercase;}
.shop-card .wish{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--navy);display:grid;place-items:center;font-size:18px;border:none;cursor:pointer;transition:.2s;}
.shop-card .wish:hover{background:var(--orange);color:#fff;}
.shop-card .body{padding:18px;display:flex;flex-direction:column;flex:1;}
.shop-card h3{font-size:16.5px;margin-bottom:6px;}
.shop-card h3 a{color:var(--ink);transition:color .2s;}
.shop-card:hover h3 a{color:var(--orange);}
.shop-card .stars{color:var(--orange);font-size:13px;margin-bottom:12px;display:flex;gap:1px;}
.shop-card .pfoot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:14px;margin-top:auto;}
.shop-card .price{font-family:var(--head);font-weight:700;color:var(--ink);font-size:16px;}
.shop-card .price small{font-weight:400;color:var(--muted);font-size:12px;}
.shop-card .add{background:var(--navy);color:#fff;border:none;border-radius:9px;padding:9px 16px;font-family:var(--head);font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:.2s;}
.shop-card .add:hover{background:var(--orange);}

/* ============ ABOUT ============ */
.about-intro{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;}
.about-intro .img-wrap{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3;}
.about-intro .img-wrap img{width:100%;height:100%;object-fit:cover;display:block;}
.about-intro h2{font-size:clamp(28px,3.4vw,40px);margin:18px 0 16px;}
.about-intro h2 .accent{color:var(--orange);}
.about-intro p{font-size:15.5px;margin-bottom:16px;}
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:8px;}
.about-stat{text-align:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 18px;box-shadow:var(--shadow-sm);}
.about-stat strong{display:block;font-family:var(--head);font-weight:800;font-size:38px;color:var(--orange);line-height:1;}
.about-stat span{font-size:13.5px;color:var(--body);margin-top:8px;display:block;}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.value-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:32px 28px;transition:.2s;}
.value-card:hover{box-shadow:var(--shadow);transform:translateY(-4px);}
.value-card .ico{width:60px;height:60px;border-radius:16px;background:var(--orange);color:#fff;display:grid;place-items:center;font-size:28px;margin-bottom:20px;box-shadow:0 10px 22px rgba(238,106,28,.3);}
.value-card h3{font-size:20px;margin-bottom:12px;}
.value-card p{font-size:14.3px;}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.team-card{text-align:center;}
.team-card .ph{aspect-ratio:1;border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px;}
.team-card .ph img{width:100%;height:100%;object-fit:cover;display:block;}
.team-card h3{font-size:17px;margin-bottom:4px;}
.team-card span{font-size:13px;color:var(--orange);font-weight:600;}

/* ============ CONTACT ============ */
.contact-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start;}
.contact-cards{display:grid;gap:18px;}
.contact-card{display:flex;align-items:flex-start;gap:16px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;transition:.2s;}
.contact-card:hover{box-shadow:var(--shadow-sm);border-color:var(--orange);}
.contact-card .ico{width:52px;height:52px;border-radius:14px;background:var(--orange-50);color:var(--orange);display:grid;place-items:center;font-size:24px;flex-shrink:0;}
.contact-card h4{font-size:16px;margin-bottom:5px;}
.contact-card p,.contact-card a{font-size:14px;color:var(--body);}
.contact-card a:hover{color:var(--navy);}
.contact-form{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:40px;box-shadow:var(--shadow-sm);}
.contact-form h3{font-size:26px;margin-bottom:6px;}
.contact-form .sub{font-size:14px;color:var(--muted);margin-bottom:26px;}
.contact-form .field{margin-bottom:16px;}
.contact-form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.contact-form label{display:block;font-family:var(--head);font-weight:600;font-size:13px;color:var(--ink);margin-bottom:7px;}
.contact-form label .req{color:var(--orange);}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:13px 15px;font-family:var(--body-font);font-size:14px;color:var(--ink);background:var(--sky-50);outline:none;transition:.2s;}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--orange);background:#fff;box-shadow:0 0 0 3px rgba(238,106,28,.1);}
.contact-form .btn{width:100%;margin-top:6px;}
.map-wrap{border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--line);height:380px;background:var(--sky-100);}
.map-wrap iframe{width:100%;height:100%;border:0;display:block;}

@media(max-width:1024px){
  .shop-layout{grid-template-columns:1fr;}
  .shop-side{position:static;grid-template-columns:1fr 1fr;display:grid;}
  .shop-grid{grid-template-columns:repeat(2,1fr);}
  .about-intro,.contact-layout{grid-template-columns:1fr;gap:36px;}
  .values-grid,.team-grid{grid-template-columns:repeat(2,1fr);}
  .about-stats{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  .shop-side{grid-template-columns:1fr;}
  .shop-grid{grid-template-columns:1fr 1fr;}
  .values-grid,.team-grid,.about-stats{grid-template-columns:1fr;}
  .contact-form{padding:28px 22px;}
  .contact-form .field-row{grid-template-columns:1fr;}
}
@media(max-width:420px){
  .shop-grid{grid-template-columns:1fr;}
}

/* ============ FAQ FULL PAGE ============ */
.faqpage-layout{display:grid;grid-template-columns:300px 1fr;gap:48px;align-items:start;}
.faq-nav{position:sticky;top:96px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow-sm);}
.faq-nav h4{font-family:var(--head);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:14px;}
.faq-nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;font-size:14px;color:var(--body);transition:.16s;}
.faq-nav a i{color:var(--orange);font-size:18px;}
.faq-nav a:hover,.faq-nav a.active{background:var(--orange-50);color:var(--orange);font-weight:600;}
.faq-block{margin-bottom:40px;}
.faq-block .faq-cat{scroll-margin-top:96px;}

/* ============ LEGAL / SIMPLE PAGE ============ */
.legal{max-width:860px;margin:0 auto;}
.legal .upd{display:inline-flex;align-items:center;gap:8px;background:var(--sky-100);color:var(--navy);font-family:var(--head);font-weight:600;font-size:13px;padding:7px 16px;border-radius:999px;margin-bottom:26px;}
.legal h2{font-size:24px;margin:34px 0 14px;color:var(--ink);scroll-margin-top:96px;}
.legal h2:first-of-type{margin-top:0;}
.legal h3{font-size:18px;margin:22px 0 10px;color:var(--ink);}
.legal p{font-size:16px;line-height:1.75;margin-bottom:16px;color:var(--body);}
.legal ul{display:grid;gap:10px;margin:6px 0 20px;}
.legal ul li{position:relative;padding-left:28px;font-size:15.5px;color:var(--body);}
.legal ul li::before{content:"\2713";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:50%;background:rgba(28,163,90,.12);color:var(--green);font-size:11px;font-weight:700;display:grid;place-items:center;}
.legal a{color:var(--navy);font-weight:600;text-decoration:underline;text-decoration-color:var(--sky-200);}
.legal a:hover{text-decoration-color:var(--orange);}
.legal .callout{background:var(--orange-50);border-left:4px solid var(--orange);border-radius:0 12px 12px 0;padding:18px 22px;margin:22px 0;}
.legal .callout p{margin:0;color:var(--ink);font-size:15px;}

@media(max-width:1024px){
  .faqpage-layout{grid-template-columns:1fr;}
  .faq-nav{position:static;display:flex;flex-wrap:wrap;gap:8px;}
  .faq-nav h4{width:100%;}
}