/* ============================================================
   franco-media.com - N46c (Brain rulings LR2, LS2, LX6, LX9, LZ2, LZ4, LZ5, 03-11-2026)
   P:\SIG\02 Franco-Media\Agents\Nick\BRIEF - N46c theme build (03-11-2026).md
   Loaded after n46.css (inc/n46c.php, priority 41). Tokens only: no colour value, no font
   name and no important flag in this file; two new motion tokens in tokens.css (--duration-fade,
   --duration-zoom).
   ============================================================ */

/* ===== 1. Contact card rows (LR2, item 1) =====
   The number at the body size on one line, the label ("Shop", "Martin") on its own small line
   under it, every row the same height. The container is the card's content box: 290 px in the
   340 px rail, 250 px in a 300 px rail or on a 320 px phone. Below 282 px the icon disc gets
   smaller and the chevron leaves, so the longest number (about 157 px) still fits on one line. */
.ccard{ container-type:inline-size; }
.ccrow{ height:calc(var(--space-15) + var(--space-10)); min-height:0; box-sizing:border-box; }
.ccrow .txt{ justify-content:center; gap:0; }
.ccrow .val{
  font-size:var(--size-body);
  letter-spacing:normal;
  white-space:nowrap;
  overflow-wrap:normal;
  text-wrap:nowrap;
}
.ccrow .lab{
  font-family:var(--font-body);
  font-weight:var(--weight-regular);
  font-size:var(--size-small);
  line-height:1.3;
  color:var(--os-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@container (max-width:281px){
  .ccrow{ gap:var(--space-4); padding:var(--space-4) var(--space-5); }
  .ccrow .ico{ width:var(--space-13); height:var(--space-13); }
  .ccrow .ico svg{ width:var(--space-8); height:var(--space-8); }
  .ccrow .chev{ display:none; }
}
@container (max-width:230px){
  .ccrow{ gap:var(--space-3); padding:var(--space-3) var(--space-4); }
  .ccrow .ico{ width:var(--space-12); height:var(--space-12); }
}

/* ===== 2. A heading right after a picture (LR2, item 2) =====
   At least one line of body text above any H2 or H3 that follows an image, a figure, a gallery
   or a WPBakery single image, in page and post content. */
:is(.entry-content,.abody,.desc) :is(img,figure,.gallery,.wpb_single_image,.wpb_gallery,.vc_images_carousel,.wp-caption,.wp-block-image,.wp-block-gallery,p:has(> img:only-child),p:has(> a:only-child > img:only-child)) + h2,
:is(.entry-content,.abody,.desc) :is(.wpb_single_image,.wpb_gallery,.vc_images_carousel,.gallery) + .wpb_text_column > .wpb_wrapper > h2:first-child{
  margin-top:max(var(--space-12), calc(var(--size-body) * var(--lh-body)));
}
:is(.entry-content,.abody,.desc) :is(img,figure,.gallery,.wpb_single_image,.wpb_gallery,.vc_images_carousel,.wp-caption,.wp-block-image,.wp-block-gallery,p:has(> img:only-child),p:has(> a:only-child > img:only-child)) + h3,
:is(.entry-content,.abody,.desc) :is(.wpb_single_image,.wpb_gallery,.vc_images_carousel,.gallery) + .wpb_text_column > .wpb_wrapper > h3:first-child{
  margin-top:max(var(--space-11), calc(var(--size-body) * var(--lh-body)));
}

/* ===== 3. Body text at the body size (LR2, item 3) =====
   Page and post body text at --size-body, the lead size only on the first paragraph of the intro
   (the class n46c-lead, set by gpcf_n46c_lead(), or the guide intro). Chic Furniture keeps its own
   sizes (body class gpcf-own-brand). Components printed inside a body keep their own sizes. */
body:not(.gpcf-own-brand) :is(.entry-content,.abody,.desc){ font-size:var(--size-body); line-height:var(--lh-body); }
body:not(.gpcf-own-brand) :is(.entry-content,.abody,.desc) :is(p,li):not(.eyebrow):not(:where(.card *,.pcard *,.fiche *,.vc_cta3 *,.faq *,.gpcf-faq *,.vc_tta *,.promo-clients *,.adv-more *,.findus *,.vc_row-has-fill *,.vc_col-has-fill *,[class*="siam-"] *,.fm-pricelist *,.rehub-deal *,.vc_grid-container *,.n46c-skip *)){
  font-size:var(--size-body);
  line-height:var(--lh-body);
}
body:not(.gpcf-own-brand) :is(.entry-content,.abody,.desc) :is(p.n46c-lead,.guide > .intro){
  font-size:var(--size-lead);
  line-height:1.55;
}

/* ===== 4. Content grids as the card family (LR2, item 4) =====
   (a) The WPBakery column of a single image plus text (a column of two to six twelfths that holds
   both): every such column is a card, the row is a grid of three columns (two on a tablet, one on
   a phone). The image sits first in an equal box, contained; the heading before the image is the
   card title; the first heading after it is the price, one body line; the next ones (the fee)
   are small and muted. These lines are h4 to h6 in the content, whose display face is forced by an
   older rule of style.css (font-family with the important flag), so they keep Montserrat; size,
   weight and colour are set here. */
:is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image){
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--card-gap);
  margin-left:0;
  margin-right:0;
  align-items:stretch;
}
:is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image)::before,
:is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image)::after{ content:none; display:none; }
:is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image) > .wpb_column{ width:auto; float:none; min-width:0; }
:is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image) > .wpb_column > .vc_column-inner{ padding:0; height:100%; }
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper{
  display:flex;
  flex-direction:column;
  gap:var(--space-2);
  height:100%;
  box-sizing:border-box;
  padding:0 0 var(--space-7);
  background:var(--os-card);
  border:1px solid var(--os-line);
  border-radius:var(--radius-card);
  overflow:hidden;
}
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > :is(.vc_separator,.vc_empty_space){ display:none; }
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > :not(.wpb_single_image){ margin:0; padding:0 var(--space-7); }
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > .wpb_single_image{
  order:-1;
  margin:0 0 var(--space-5);
  padding:var(--space-5);
  aspect-ratio:4 / 3;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--os-card);
  border-bottom:1px solid var(--os-line);
}
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > .wpb_single_image :is(figure,.vc_single_image-wrapper){ display:flex; width:100%; height:100%; margin:0; align-items:center; justify-content:center; }
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > .wpb_single_image img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:0;
  box-shadow:none;
  background:none;
  padding:0;
}
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6):has(~ .wpb_single_image),
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6):first-child:not(.wpb_single_image ~ *){
  font-family:var(--font-display);
  font-weight:var(--weight-display);
  font-size:var(--size-card-title);
  line-height:var(--lh-card-title);
  letter-spacing:normal;
  text-transform:none;
  color:var(--os-heading);
}
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6){
  font-weight:var(--weight-bold);
  font-size:var(--size-body);
  line-height:var(--lh-body);
  letter-spacing:normal;
  text-transform:none;
  color:var(--os-text);
}
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6) ~ :is(h2,h3,h4,h5,h6){
  font-weight:var(--weight-regular);
  font-size:var(--size-small);
  color:var(--os-muted);
}
:is(.entry-content,.abody,.desc) .vc_row > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6):has(> .vc_column-inner > .wpb_wrapper > .wpb_single_image):has(> .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column)) > .vc_column-inner > .wpb_wrapper :is(p,li){ font-size:var(--size-body); line-height:var(--lh-body); }

/* (b) The old WPBakery post grids (vc_basic_grid): the same columns and equal, contained image
   boxes; the cards themselves are styled by n46.css section L. */
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--card-gap);
  margin:0;
}
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper::before,
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper::after{ content:none; display:none; }
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper > .vc_grid-item{ width:auto; float:none; padding:0; min-width:0; }
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper > .vc_grid-item .vc_grid-item-mini{ height:100%; }
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper > .vc_grid-item .vc_gitem-zone-a{
  aspect-ratio:4 / 3;
  height:auto;
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  background-color:var(--os-card);
}
body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper > .vc_grid-item .vc_gitem-zone-a .vc_gitem-zone-img{ display:none; }

@media (max-width:1024px){
  :is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image),
  body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px){
  :is(.entry-content,.abody,.desc) .vc_row:has(> .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > .wpb_single_image ~ :is(h2,h3,h4,h5,h6,p,.wpb_text_column), > .wpb_column:is(.vc_col-sm-2,.vc_col-sm-3,.vc_col-sm-4,.vc_col-sm-6) > .vc_column-inner > .wpb_wrapper > :is(h2,h3,h4,h5,h6,p,.wpb_text_column) ~ .wpb_single_image),
  body :is(.entry-content,.abody,.desc) .vc_grid.vc_row .vc_pageable-slide-wrapper{ grid-template-columns:1fr; }
}

/* ===== 5. The navy Banyan Living band on the real estate hubs (LS2, item 5) =====
   The band is .rehub-deal of j6.css (section 8); inside a page body the content rules of n46.css
   and of this file must not reach its heading, line and button. */
body :is(.entry-content,.abody,.desc) .rehub-deal{ margin:var(--space-10) 0 var(--space-7); }
body :is(.entry-content,.abody,.desc) .rehub-deal h3{ margin:0; color:var(--on-dark); font-size:var(--size-h2); line-height:var(--lh-h2); }
body:not(.gpcf-own-brand) :is(.entry-content,.abody,.desc) .rehub-deal p:not(.eyebrow){ margin:var(--space-3) 0 0; color:var(--on-dark-hero-sub); font-size:var(--size-body); line-height:var(--lh-body); }
body :is(.entry-content,.abody,.desc) .rehub-deal a.btn,
body :is(.entry-content,.abody,.desc) .rehub-deal a.btn:hover{ color:var(--os-cta-ink); text-decoration:none; }
@media (max-width:768px){
  body :is(.entry-content,.abody,.desc) .rehub-deal h3{ font-size:var(--m-size-h2); }
}

/* ===== 7. The rates page: the public price sentence under "What this would cost you anywhere else" (LZ2, item 7) ===== */
.rates .val-from{ margin:var(--space-4) 0 0; font-size:var(--size-lead); line-height:1.5; color:var(--os-text); }

/* ===== 9. Home rail banners: a slow cross-fade (LX9, item 9) ===== */
.rail--home .sigad-rot > .sigad{
  transition:opacity var(--duration-fade) var(--ease), visibility var(--duration-fade) var(--ease);
}

/* ===== 10. Readers online in the header band (LX9, item 10) =====
   One line at the bottom left of the band, the dot pulsing (still with reduced motion). */
.pagehead .gpcf-hd-online{
  display:inline-flex;
  align-items:center;
  gap:var(--space-3);
  margin:var(--space-9) 0 0;
  font-family:var(--font-body);
  font-size:var(--size-chrome);
  line-height:1.3;
  color:var(--on-dark-muted);
}
.pagehead .gpcf-hd-online[hidden]{ display:none; }
.pagehead .gpcf-hd-online b{ font-weight:var(--weight-bold); color:var(--on-dark); }
.pagehead .gpcf-hd-online .dot{
  position:relative;
  flex:0 0 auto;
  width:var(--space-3);
  height:var(--space-3);
  border-radius:50%;
  background:var(--os-pearl-aqua);
}
.pagehead .gpcf-hd-online .dot::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:inherit;
  animation:n46c-dot 1.8s ease-out infinite;
}
@keyframes n46c-dot{
  0%{ opacity:.65; transform:scale(1); }
  100%{ opacity:0; transform:scale(3); }
}

/* ===== 11. Header photo: a slow zoom in and out (LX9, item 11) ===== */
.pagehead-photo .photo img{
  transform-origin:center;
  animation:n46c-zoom var(--duration-zoom) ease-in-out infinite;
}
@keyframes n46c-zoom{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.08); }
}

/* Reduced motion: no zoom, no pulse, no fade (one banner shows at a time, as in N46b). */
@media (prefers-reduced-motion:reduce){
  .pagehead-photo .photo img,
  .pagehead .gpcf-hd-online .dot::after{ animation:none; }
  .rail--home .sigad-rot > .sigad{ transition:none; }
}
