/*
Theme Name: Mac & Beau
Theme URI: https://macandbeau.com
Author: Mac & Beau
Description: Editorial WordPress theme for the Mac & Beau acting agency. Requires Mac & Beau Talent Manager for directory functionality.
Version: 1.2.5
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: mac-beau
*/
:root{--ink:#171b1d;--ivory:#f6f3ec;--gold:#c4a87c;--mute:#aaa6a0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#faf9f6;color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-weight:400;line-height:1.55}a{color:inherit}img{max-width:100%;height:auto}.mb-wrap{width:min(1280px,calc(100% - 64px));margin:auto}.mb-header{background:#191d1e;color:#f8f5ed;position:relative;z-index:5}.mb-header-inner{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:30px}.mb-brand{text-decoration:none;display:flex;flex-direction:column;line-height:1}.mb-brand-main{font-size:1.75rem;font-family:Georgia,'Times New Roman',serif;letter-spacing:.11em}.mb-brand-sub{font-size:.57rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold);margin-top:10px}.mb-nav ul{list-style:none;display:flex;gap:24px;align-items:center;padding:0;margin:0}.mb-nav a{text-decoration:none;text-transform:uppercase;letter-spacing:.13em;font-size:.68rem;font-weight:bold}.mb-nav a:hover{color:var(--gold)}.mb-hero{min-height:630px;color:#fff;background:linear-gradient(90deg,rgba(13,16,17,.96),rgba(13,16,17,.7) 56%,rgba(13,16,17,.35)),radial-gradient(circle at 85% 42%,#4b433a,#151718 57%);display:flex;align-items:center}.mb-hero-inner{padding:100px 0}.mb-kicker{text-transform:uppercase;letter-spacing:.28em;font-size:.7rem;color:var(--gold);font-weight:700}.mb-hero h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(3.1rem,7.2vw,7.2rem);line-height:1.04;letter-spacing:-.035em;max-width:900px;margin:22px 0}.mb-hero p{max-width:550px;font-size:1.12rem;color:#dedcd7}.mb-buttons{display:flex;flex-wrap:wrap;gap:13px;margin-top:38px}.mb-btn{display:inline-block;background:var(--gold);color:#111!important;padding:16px 25px;text-decoration:none;letter-spacing:.13em;font-size:.72rem;text-transform:uppercase;font-weight:750}.mb-btn-outline{background:transparent;border:1px solid #aaa;color:white!important}.mb-section{padding:90px 0}.mb-section h2,.mb-page-title{font-family:Georgia,'Times New Roman',serif;font-weight:normal;font-size:clamp(2.4rem,5vw,4.5rem);line-height:1.1;margin:10px 0 25px}.mb-section-top{display:flex;align-items:end;justify-content:space-between;gap:24px}.mb-section-top p{max-width:540px}.mb-dark{background:#202526;color:#faf8f4}.mb-intro{max-width:780px;font-size:1.27rem}.mb-footer{background:#15191b;color:#f0eee9;padding:60px 0 25px}.mb-footer-columns{display:flex;justify-content:space-between;gap:35px;flex-wrap:wrap}.mb-footer a{text-decoration:none;color:#c7b8a0}.mb-footer-small{border-top:1px solid #444;margin-top:50px;padding-top:20px;color:#bcb7af;font-size:.78rem}.mb-page-hero{background:#222729;color:#fff;padding:100px 0 65px}.mb-main{padding:65px 0 110px;min-height:300px}.mb-actor-detail{display:grid;grid-template-columns:minmax(220px,420px) 1fr;gap:55px;align-items:start}.mb-profile-photo{width:100%;aspect-ratio:4/5;background:#ddd8d0;object-fit:cover}.mb-profile-fallback{aspect-ratio:4/5;display:grid;place-items:center;background:#dedbd5;font:4rem Georgia,serif}.mb-detail-list{display:grid;grid-template-columns:135px 1fr;gap:8px 15px;margin:30px 0}.mb-detail-list dt{text-transform:uppercase;letter-spacing:.13em;font-size:.73rem;color:#777}.mb-detail-list dd{margin:0}.mb-profile-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.mb-copy{max-width:850px}.mb-social{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase}.mb-mobile-nav{display:none}@media(max-width:780px){.mb-wrap{width:calc(100% - 34px)}.mb-header-inner{min-height:78px}.mb-brand-main{font-size:1.35rem}.mb-nav ul{gap:10px;flex-wrap:wrap;justify-content:end}.mb-nav a{font-size:.58rem}.mb-section{padding:65px 0}.mb-hero{min-height:540px}.mb-actor-detail{grid-template-columns:1fr;gap:28px}.mb-detail-list{grid-template-columns:105px 1fr}.mb-section-top{display:block}}@media(max-width:490px){.mb-header-inner{display:block;padding:20px 0}.mb-nav ul{margin-top:22px;justify-content:start}.mb-hero-inner{padding:75px 0}.mb-buttons{gap:9px}.mb-btn{padding:14px 17px}.mb-page-hero{padding:65px 0 40px}}

/* v1.1 — official MAC&BEAU identity. The supplied logo is black on white. */
.mb-header{background:#fff;color:#171b1d;border-bottom:1px solid #e8e5e0}
.mb-header-inner{min-height:110px}
.mb-brand-official{display:inline-flex;flex:0 0 auto;max-width:min(100%,260px);line-height:1}
.mb-official-logo{display:block;width:100%;max-width:260px;height:auto;object-fit:contain}
.mb-header .mb-nav a{color:#171b1d}
.mb-header .mb-nav a:hover,.mb-header .mb-nav a:focus-visible{color:#8e7047}
.mb-footer .mb-brand-official{background:#fff;padding:8px;max-width:240px}
.mb-footer .mb-official-logo{max-width:224px}
.mb-gallery-clip{position:relative}
.mb-gallery-clip .mb-gallery-track{animation-duration:75s}
@media (max-width:780px){.mb-header-inner{min-height:85px}.mb-official-logo{max-width:215px}.mb-brand-official{max-width:215px}}
@media (max-width:490px){.mb-header-inner{display:flex;flex-direction:column;align-items:flex-start;padding:14px 0;gap:10px}.mb-nav ul{margin-top:0;gap:13px}.mb-header .mb-nav a{font-size:.62rem}.mb-official-logo{max-width:200px}}
@media (prefers-reduced-motion:reduce){.mb-gallery-clip .mb-gallery-track{animation:none;max-width:100vw;overflow-x:auto}}

/* Casting enquiry context */
.mb-enquiry-actor{font-size:1.15rem;margin-bottom:1.5rem;}


/* v1.2.2: mobile gallery safety — the shortcode supplies the gallery markup. */
.mb-gallery-clip { overflow:hidden; max-width:100vw; isolation:isolate; }
.mb-gallery-clip .mb-gallery-track,
.mb-gallery-clip .mb-gallery-duplicate { display:flex; flex-wrap:nowrap; align-items:flex-start; gap:14px; }
.mb-gallery-clip .mb-gallery-track { width:max-content; max-width:none; min-width:0; animation:mb-scroll 75s linear infinite; will-change:transform; }
.mb-gallery-clip .mb-gallery-track > .mb-actor-tile,
.mb-gallery-clip .mb-gallery-duplicate > .mb-actor-tile {
  display:block; flex:0 0 215px; width:215px; min-width:215px; max-width:215px;
  position:relative; white-space:normal; margin:0;
}
.mb-gallery-clip .mb-actor-photo { display:block; aspect-ratio:4/5; overflow:hidden; width:100%; }
.mb-gallery-clip .mb-actor-photo img {display:block; width:100%; height:100%; object-fit:cover; }
.mb-gallery-clip .mb-actor-name { display:block; white-space:normal; overflow-wrap:break-word; line-height:1.4; }
/* Only desktop pointers should pause on hover. Touch hover states can remain stuck. */
@media (hover:none), (pointer:coarse) {
  .mb-gallery-clip:hover .mb-gallery-track,
  .mb-gallery-clip:focus-within .mb-gallery-track { animation-play-state:running !important; }
}
@media (max-width:780px) {
  .mb-gallery-clip { width:100vw; margin:24px 0 28px calc(50% - 50vw); }
  .mb-gallery-clip .mb-gallery-track,
  .mb-gallery-clip .mb-gallery-duplicate { gap:14px; }
  .mb-gallery-clip .mb-gallery-track > .mb-actor-tile,
  .mb-gallery-clip .mb-gallery-duplicate > .mb-actor-tile { flex:0 0 165px; width:165px; min-width:165px; max-width:165px; }
  .mb-gallery-clip .mb-actor-name { font-size:.76rem; letter-spacing:.055em; }
}
@media (max-width:420px) {
  .mb-gallery-clip .mb-gallery-track > .mb-actor-tile,
  .mb-gallery-clip .mb-gallery-duplicate > .mb-actor-tile { flex-basis:154px; width:154px; min-width:154px; max-width:154px; }
}
@media (prefers-reduced-motion:reduce) {
  .mb-gallery-clip .mb-gallery-track {animation:none !important;will-change:auto;}
  .mb-gallery-clip { overflow-x:auto; }
}

/* v1.2.3 — About page editorial styling, scoped to the About page only.
   Existing WordPress blocks, PMA image/link and wording are retained. */
.mb-about-page .mb-page-hero {
  background: #202526;
  padding: clamp(64px, 8vw, 106px) 0 clamp(54px, 6vw, 82px);
}
.mb-about-page .mb-page-title {
  color: #fff;
  font-size: clamp(3.6rem, 8vw, 7rem);
  line-height: 1.02;
  margin: 16px 0 0;
}
.mb-about-page .mb-main { padding-top: clamp(52px, 7vw, 94px); padding-bottom: clamp(78px, 9vw, 130px); }
.mb-about-page .mb-about-copy {
  max-width: 940px;
  padding-left: clamp(0px, 2.3vw, 34px);
  border-left: 3px solid #c4a87c;
}
.mb-about-page .mb-about-copy > :first-child { margin-top: 0; }
.mb-about-page .mb-about-copy > p,
.mb-about-page .mb-about-copy > .wp-block-paragraph { 
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(1.04rem, 1.45vw, 1.2rem);
  line-height: 1.75;
  margin: 0 0 1.45em;
  color: #303335;
}
.mb-about-page .mb-about-copy > p:first-child {
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .24em;
  font-weight: 700;
  color: #9d7b4b;
  margin-bottom: 2.25em;
}
.mb-about-page .mb-about-copy h2,
.mb-about-page .mb-about-copy h3 {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  line-height: 1.12;
  margin: 1.5em 0 .7em;
}
.mb-about-page .mb-about-copy .wp-block-image { max-width: 325px; margin: 24px 0 0; }
.mb-about-page .mb-about-copy .wp-block-image img { display: block; width: 100%; height: auto; }
.mb-about-page .mb-about-copy a:not(.wp-element-button) { text-underline-offset: 3px; }
@media (max-width: 780px) {
  .mb-about-page .mb-about-copy { padding-left: 19px; }
  .mb-about-page .mb-page-hero { padding: 65px 0 50px; }
  .mb-about-page .mb-about-copy .wp-block-image { max-width: min(290px, 100%); }
}

/* v1.2.4 — PMA member logo in site-wide footer. */
.mb-pma-membership { display:flex; flex-direction:column; align-items:flex-start; gap:10px; flex:0 1 220px; }
.mb-pma-link { display:inline-flex; align-items:center; justify-content:center; background:#fff; border-radius:2px; padding:12px 15px; width:190px; max-width:100%; min-height:100px; }
.mb-pma-link img { display:block; width:100%; height:auto; object-fit:contain; }
.mb-pma-link:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
.mb-pma-membership p { color:#c7b8a0; font-size:.76rem; line-height:1.5; margin:0; max-width:220px; }
@media(max-width:780px) { .mb-pma-membership { flex-basis:100%; margin-top:12px; } }
