/* Shared layout for stone product pages. Built by tools/seo/product_layout.py. */

/* Header menu */
header .header-inner{height:auto;min-height:78px}
.header-inner{gap:24px}
.pnav{display:flex;flex-wrap:nowrap;gap:22px;align-items:center;margin-left:auto}
.header-inner .nav-cta{text-decoration:none;font-size:13.5px;padding:9px 20px}
.pnav a{color:rgba(255,255,255,.72);text-decoration:none;font-size:13.5px;letter-spacing:.02em;white-space:nowrap}
.pnav a:hover,.pnav a.active{color:var(--gold-light)}
.pnav a.active{border-bottom:1px solid var(--gold)}

/* FAQ accordion */
details.faq-item>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:14px}
details.faq-item>summary::-webkit-details-marker{display:none}
details.faq-item>summary::after{content:"+";font-family:'DM Sans',sans-serif;font-weight:300;font-size:22px;line-height:1;color:var(--gold);flex:none}
details.faq-item[open]>summary::after{content:"\2212"}
details.faq-item[open]>summary{padding-bottom:4px}

/* Footer */
footer .footer-grid{max-width:1200px;margin:0 auto 48px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px}
footer .footer-grid p{color:rgba(255,255,255,.4);font-size:13px;line-height:1.7;margin-top:12px;max-width:340px}
.footer-social{display:flex;gap:10px;margin-top:20px}
.social-btn{width:34px;height:34px;border:1px solid rgba(255,255,255,.12);border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.45);text-decoration:none;font-size:12px;font-weight:700}
.social-btn:hover{border-color:var(--gold);color:var(--gold-light)}
.footer-col h4{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-light);margin-bottom:16px;font-weight:500}
.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col ul li{margin-bottom:9px}
.footer-col ul li a{color:rgba(255,255,255,.45);text-decoration:none;font-size:13.5px}
.footer-col ul li a:hover{color:var(--gold-light)}
.footer-bottom{max-width:1200px;margin:0 auto;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.28)}
.footer-bottom a{color:rgba(255,255,255,.28);text-decoration:none}
.footer-bottom a:hover{color:var(--gold-light)}

/* Buy buttons above the spec table */
.detail-top .product-info{display:flex;flex-direction:column}
.detail-top .product-info>.detail-table{order:1}
.detail-top .product-info>.detail-table~:not(.cta-buttons){order:2}
.detail-top .product-info>.cta-buttons{margin:4px 0 20px}

/* Mobile bottom bar */
.pbar{display:none}

@media(max-width:1024px){
  .pnav{gap:16px}
  .pnav a{font-size:12.5px}
}

@media(max-width:900px){
  /* Menu becomes a swipeable row under the logo */
  .header-inner{flex-wrap:wrap;row-gap:10px;height:auto;padding:14px 20px}
  .pnav{order:3;flex:1 0 100%;margin:0 -20px;padding:2px 20px 4px;overflow-x:auto;scrollbar-width:none;gap:18px}
  .pnav::-webkit-scrollbar{display:none}
  .header-inner .nav-cta{margin-left:auto}
  .header-inner>.fbs-btn{order:2;margin-left:10px}
}

@media(max-width:768px){
  /* Name and buy buttons before the long spec table */
  .detail-top{display:flex;flex-direction:column;gap:0}
  .detail-top .product-info{display:contents}
  .detail-top>.product-info>*{order:8}
  .detail-top .product-eyebrow,.detail-top .eyebrow-line{order:1}
  .detail-top .product-name{order:2}
  .detail-top .product-id,.detail-top .meta-line{order:3;margin-bottom:16px}
  .detail-top .gallery-wrap{order:4;margin-bottom:18px}
  .detail-top .stock-badge{order:5}
  .detail-top .product-badges{order:6}
  .detail-top .cta-buttons{order:7;margin-bottom:20px}
  .detail-top .product-info>.detail-table{order:9}
  .detail-top .product-info>.detail-table~:not(.cta-buttons){order:10}

  .pbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:960;background:var(--dark);border-top:1px solid rgba(255,255,255,.1);padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:6px}
  .pbar a{flex:1;text-align:center;padding:11px 4px;border-radius:var(--radius);font-size:12.5px;white-space:nowrap;font-weight:500;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.14)}
  .pbar a.pbar-wa{background:#25d366;border-color:#25d366;color:#fff;flex:1.3}
  .fb-wa-float{display:none!important}
  /* The bottom bar carries the contact buttons, so the tall header can scroll away */
  html body>header{position:relative}
  body{padding-bottom:68px}

  .back-nav .nav-divider{display:none}

  footer .footer-grid{grid-template-columns:1fr 1fr;gap:28px;margin-bottom:28px}
  footer .footer-grid>div:first-child{grid-column:1/-1}
}
