/* PIX THE STUDIOS — CHANGE 56: the ☰ menu slides in from the right (same side as the button) */
.mobile-nav-panel{
  display:flex !important; flex-direction:column; align-items:flex-end; text-align:right;
  left:auto !important; right:0 !important; width:min(380px, 100vw);
  height:calc(100vh - var(--pix-header-h, 64px)); max-height:none !important;
  background:var(--ivory, #F7F2EA) !important; border-left:1px solid var(--line, #E3D6BF); border-bottom:0 !important;
  padding:2rem 2.2rem 2rem !important; gap:1.05rem !important;
  transform:translateX(100%); visibility:hidden; transition:transform .32s ease, visibility 0s linear .32s;
  box-shadow:-14px 0 30px rgba(0,0,0,0.10) !important;
}
.mobile-nav-panel.open{ transform:translateX(0); visibility:visible; transition:transform .32s ease; }
.mobile-nav-panel a{ font-size:0.95rem !important; letter-spacing:0.14em !important; }
.mobile-nav-panel a[aria-current="page"]{ color:var(--champagne-deep, #A8813E) !important; }
.mobile-nav-panel a[href="build-your-quote.html"]{ margin-top:0.6rem; border:1.5px solid var(--maroon, #3E1015); color:var(--maroon, #3E1015) !important; padding:0.8rem 1.2rem; text-align:center; align-self:stretch; }
.pix-menu-backdrop{ position:fixed; inset:var(--pix-header-h, 64px) 0 0 0; background:rgba(20,10,8,0.28); z-index:140; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility 0s linear .3s; }
.pix-menu-backdrop.show{ opacity:1; visibility:visible; transition:opacity .3s ease; }
@media (max-width:480px){ .mobile-nav-panel{ width:100vw; } }

/* CHANGE A6 — comfortable tap targets on phones (44px) */
.mobile-nav-panel a{ min-height:44px; display:flex !important; align-items:center; justify-content:flex-end; }
.mobile-nav-panel a[href="build-your-quote.html"]{ justify-content:center; }
@media (max-width:768px){ footer a{ display:inline-block; padding:10px 6px; } .journey-link{ padding:12px 4px 6px !important; } }

/* CHANGE 80 — footer "Book directly" band in brand maroon + gold button */
.website-offer-banner{ background:#3E1015 !important; border-top:2px solid #C6A15B !important; border-bottom:2px solid #C6A15B !important; color:#F6EBDD !important; }
.website-offer-banner span{ color:#F6EBDD !important; }
.website-offer-btn{ background:#D9B56F !important; color:#3E1015 !important; }
.website-offer-btn:hover{ background:#e6c787 !important; }
/* CHANGE 82 — social icons up, right under the @handle, bigger with labels */
.footer-bottom .social-row.pix-social-top{ margin:0.8rem 0 1.4rem !important; gap:0.7rem !important; justify-content:center; flex-wrap:wrap !important; max-width:100%; }
@media (max-width:480px){ .footer-bottom .social-row.pix-social-top a{ padding:0.5rem 0.8rem !important; font-size:0.74rem; } }
.footer-bottom .social-row.pix-social-top a{ width:auto !important; height:auto !important; padding:0.55rem 1rem !important; border-radius:30px !important; display:inline-flex !important; align-items:center; gap:0.45rem; font-size:0.8rem; letter-spacing:0.06em; text-decoration:none; }
.footer-bottom .social-row.pix-social-top a svg{ width:18px; height:18px; }
.footer-bottom .social-row.pix-social-top a::after{ content:attr(aria-label); }
.footer-bottom .social-row.pix-social-top a[aria-label="Google"]::after{ content:"Google Reviews"; }
/* CHANGE 84 — sticky "Build Your Quote" on phones */
.pix-sticky-quote{ display:none; }
@media (max-width:760px){
  .pix-sticky-quote{ display:flex; align-items:center; justify-content:center; position:fixed; left:12px; right:86px; bottom:16px; z-index:150; height:52px; background:#3E1015; color:#fff; border:1.5px solid #D9B56F; border-radius:30px; font:500 13px/1 Jost, system-ui, sans-serif; letter-spacing:0.14em; text-transform:uppercase; text-decoration:none; box-shadow:0 8px 22px rgba(0,0,0,0.22); transform:translateY(90px); transition:transform .35s ease; }
  .pix-sticky-quote.show{ transform:none; }
  body.pix-editing .pix-sticky-quote{ display:none; }
  footer{ padding-bottom:84px; }
}

/* 02/03 — the same footer on every page: Follow @handle + 6-photo Instagram grid */
.pix-ig{ padding:2.4rem 6vw 2.2rem !important; text-align:center; }
.pix-ig-head{ display:inline-flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0.5rem; max-width:100%; color:#C9793A; text-decoration:none; font-size:0.86rem; letter-spacing:0.18em; text-transform:uppercase; margin-bottom:1.2rem; }
.pix-ig-head span{ overflow-wrap:anywhere; }
@media (max-width:480px){ .pix-ig-head{ font-size:0.7rem; letter-spacing:0.06em; } }
.pix-ig-grid{ display:grid; grid-template-columns:repeat(6, 1fr); gap:8px; max-width:1200px; margin:0 auto; }
.pix-ig-tile{ display:block; aspect-ratio:1/1; border-radius:2px !important; background-size:cover; background-position:center; color:transparent !important; font-size:0 !important; overflow:hidden; }
.pix-ig-tile:hover{ opacity:0.86; }
/* the grid is always shown — boxes without a photo show a soft placeholder */
.pix-ig-tile:not(.pix-has-photo){ background:linear-gradient(135deg,#ece2d3,#dccbb2) !important; }
html.pix-owner .pix-ig-tile:not(.pix-has-photo){ color:#8a7560 !important; font-size:0.7rem !important; display:flex; align-items:center; justify-content:center; }
@media (max-width:760px){ .pix-ig-grid{ grid-template-columns:repeat(3, 1fr); } }

/* CHANGE 07 (v28) — highlighted words in the brand colour (same as the PIX logo), italic, a little bolder — clean, no marker */
.hl{ color:#C9793A !important; font-style:italic; font-weight:600 !important; background:none !important; padding:0 !important; }
/* CHANGE 05 — premium, consistent body text on every page */
section p, .faq-a{ line-height:1.85; letter-spacing:0.005em; }

/* 01 — the big featured photo above the "Book directly" band, same size on every page */
.pix-featured-wrap{ max-width:none !important; width:100% !important; box-sizing:border-box; }
.pix-featured-wrap .big-image{ display:block; width:100%; max-width:1008px; margin:0 auto; aspect-ratio:16/9; max-height:72vh; background-size:cover !important; background-position:center; border-radius:4px; overflow:hidden; color:transparent; }
html.pix-owner .pix-featured-wrap .big-image:not(.pix-has-photo){ color:#8a7560; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#ece2d3,#dccbb2); }

/* 97 — accent text on light backgrounds is always the brand orange (never brown) */
.eyebrow-inline, .sig-mark, .journey-eyebrow, .cat-eyebrow, .eyebrow, .footer-bottom .handle, .hl, .hl-light:not(.website-offer-banner *){ color:#C9793A !important; }

/* 94 — photos respond to the mouse: a soft zoom and lift */
@media (hover:hover) and (pointer:fine){
  .ph-box.pix-has-photo, .hover-cycle, .big-image.pix-has-photo, .pix-ig-tile.pix-has-photo, .gz.pix-has-photo{ transition:transform .7s cubic-bezier(.2,.7,.2,1) !important; }
  html body .ph-box.pix-has-photo:not([class*="corridor"]):hover, html body .hover-cycle:hover, html body .big-image.pix-has-photo:hover, html body .gz.pix-has-photo:hover{ transform:scale(1.035) !important; z-index:2; }
  body.pix-editing .ph-box:hover, body.pix-editing .hover-cycle:hover, body.pix-editing .big-image:hover{ transform:none !important; box-shadow:none !important; }
}

/* 95 — Call Now + Chat Now buttons (replace the single WhatsApp bubble) */
.whatsapp-float{ display:none !important; }
.pix-contact{ position:fixed; right:18px; bottom:22px; z-index:160; display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.pix-contact a{ display:inline-flex; align-items:center; gap:10px; height:50px; padding:0 22px 0 18px; border-radius:30px; color:#fff; text-decoration:none; font:500 15px/1 Jost, system-ui, sans-serif; letter-spacing:0.02em; box-shadow:0 8px 22px rgba(0,0,0,0.20); transition:transform .25s ease, box-shadow .25s ease; }
.pix-contact a:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,0.26); }
.pix-contact a svg{ width:20px; height:20px; flex:none; }
.pix-contact .call, .pix-contact .chat{ background:#3E1015; border:1.5px solid #D9B56F; } .pix-contact a svg{ color:#D9B56F; }
/* 96 — back to top with a reading-progress ring */
.pix-top{ position:relative; width:50px; height:50px; border-radius:50%; border:0; background:#FFFDF9; color:#C9793A; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,0.14); display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s ease; }
.pix-top.show{ opacity:1; pointer-events:auto; }
.pix-top svg.ring{ position:absolute; inset:0; transform:rotate(-90deg); }
.pix-top svg.ring circle{ fill:none; stroke-width:3; }
body.pix-editing .pix-contact{ display:none; }
@media (max-width:760px){
  .pix-contact{ right:12px; bottom:16px; gap:8px; }
  .pix-contact a{ width:52px; height:52px; padding:0; justify-content:center; }
  .pix-contact a span{ display:none; }
  .pix-top{ width:44px; height:44px; }
  .pix-sticky-quote{ right:76px !important; }
}

/* 93 — one big photo under "Follow @pixthestudios" (above the band) */
.pix-ig-grid.pix-ig-one{ grid-template-columns:1fr !important; max-width:1008px; }
.pix-ig-one .pix-ig-tile{ aspect-ratio:16/9 !important; max-height:72vh; }
@media (max-width:760px){ .pix-ig-grid.pix-ig-one{ grid-template-columns:1fr !important; } .pix-ig-one .pix-ig-tile{ aspect-ratio:4/3 !important; } }
