/*
Theme Name: Nathan James Luxe
Theme URI: https://nathanjamesfilmproductions.co.uk/
Author: Nathan James Film Productions
Description: Luxury cinematic photography and film portfolio. Compatible with existing WordPress pages and NextGEN gallery shortcodes.
Version: 1.1.0
Requires at least: 6.0
Text Domain: njl
*/
:root{--ivory:#f7f3eb;--gold:#b18a54;--charcoal:#20201e;--muted:#5c554c;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--charcoal);font:14px/1.65 Arial,Helvetica,sans-serif}a{color:inherit}img{max-width:100%;height:auto}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.13}button,a{transition:color .2s,background .2s,transform .2s}a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:4px}.wrap{max-width:1400px;margin:auto;padding-inline:5.5%}.eyebrow{font-size:10px;font-weight:600;letter-spacing:.24em;text-transform:uppercase}.btn{display:inline-flex;gap:14px;align-items:center;justify-content:center;border:1px solid var(--gold);padding:11px 20px;text-decoration:none;letter-spacing:.18em;text-transform:uppercase;font-size:10px;font-weight:700;color:var(--gold)}.btn:hover{background:var(--gold);color:#fff;transform:translateY(-2px)}
.site-header{background:var(--ivory);position:relative;z-index:30}.masthead{height:96px;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center}.monogram{font:56px/1 Georgia,serif;color:var(--gold);letter-spacing:-.19em;text-decoration:none;justify-self:start;padding-right:14px}.brand{text-align:center;text-decoration:none;line-height:1.1}.brand strong{display:block;font:24px Georgia,serif;letter-spacing:.32em;white-space:nowrap}.brand span{display:block;letter-spacing:.39em;font-size:10px;margin-top:5px}.brand em{display:block;font:italic 13px Georgia,serif;color:#88745d;margin-top:4px}.header-actions{display:flex;align-items:flex-end;flex-direction:column;gap:12px}.social{display:flex;gap:13px;align-items:center}.social a{text-decoration:none;color:var(--gold);font-size:12px;border:1px solid var(--gold);border-radius:50%;width:21px;height:21px;text-align:center;line-height:19px}.header-actions .btn{padding:6px 26px;font-size:9px}.nav-bar{min-height:37px;display:flex;justify-content:center;align-items:center;gap:32px}.nav-bar a{text-decoration:none;font-size:10px;letter-spacing:.17em;text-transform:uppercase;padding:12px 0;white-space:nowrap}.nav-bar a:hover,.nav-bar .current-menu-item>a{color:var(--gold)}.nav-bar ul{list-style:none;padding:0;margin:0;display:flex;gap:30px}.nav-bar li{position:relative}.nav-bar .sub-menu{display:none;position:absolute;left:-18px;top:100%;background:var(--ivory);min-width:190px;box-shadow:0 12px 24px #0002;z-index:50;padding:8px 18px;flex-direction:column;gap:0}.nav-bar li:hover>.sub-menu,.nav-bar li:focus-within>.sub-menu{display:flex}.menu-toggle{display:none}
.hero{position:relative;min-height:430px;display:flex;align-items:center;overflow:hidden;color:#fff;background:#29251f}.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 43%}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b0b0bd9 0%,#0b0b0b91 31%,#0b0b0b12 72%);z-index:1}.hero-inner{width:100%;position:relative;z-index:2}.hero-copy{max-width:460px}.hero h1{font-size:clamp(39px,4.6vw,64px);margin:8px 0 12px}.hero p{max-width:390px;line-height:1.55}.hero .btn{margin-top:7px}.showreel{position:absolute;right:6%;bottom:17%;z-index:2;display:flex;gap:12px;align-items:center;text-decoration:none;font-size:10px;letter-spacing:.15em;text-transform:uppercase}.play{display:grid;place-items:center;border:1px solid #dfbd84;border-radius:50%;width:48px;height:48px;font-size:18px}.scroll-prompt{position:absolute;z-index:2;bottom:10px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.2em;text-align:center}.scroll-prompt span{display:block;font-size:23px}
.section-title{text-align:center;margin-bottom:24px}.section-title .eyebrow{display:flex;align-items:center;justify-content:center;gap:13px}.section-title .eyebrow:before,.section-title .eyebrow:after{content:"";width:25px;height:1px;background:var(--gold)}.section-title h2{font-size:clamp(29px,3vw,40px);margin:6px 0}.services{padding-block:35px 30px}.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.service-card{background:#fffaf4;box-shadow:0 4px 20px #382a1c0b}.service-card:hover{transform:translateY(-4px)}.service-card img{width:100%;height:160px;object-fit:cover;object-position:center 30%;display:block}.service-copy{padding:12px 19px 18px}.service-icon{font-size:24px;line-height:1}.service-card h3{font:700 11px Arial,sans-serif;letter-spacing:.13em;text-transform:uppercase;margin:12px 0 8px}.service-card p{font-size:12px;color:var(--muted);min-height:40px}.learn{font-size:10px;text-decoration:none;color:#a17a4a;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid #d4b38a}
.galleries{padding-block:35px 30px;background:linear-gradient(#151614ed,#151614ed),url('https://nathanjamesfilmproductions.co.uk/wp-content/uploads/2025/04/MGL3729-Edit-scaled.jpg') center/cover;color:#fff;text-align:center}.galleries .section-title{margin-bottom:22px}.galleries .section-title .eyebrow{color:#d4ad76}.galleries .section-title p{max-width:500px;margin:5px auto}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;text-align:left}.gallery-card{height:215px;position:relative;display:block;overflow:hidden;border:1px solid #987445;text-decoration:none}.gallery-card img{width:100%;height:100%;object-fit:cover;object-position:center 28%;transition:transform .35s}.gallery-card:hover img{transform:scale(1.05)}.gallery-card:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#000c)}.gallery-caption{position:absolute;z-index:1;left:18px;right:18px;bottom:12px}.gallery-caption strong{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase}.gallery-caption small{font-size:12px}.gallery-caption b{float:right}.galleries>.wrap>.btn{margin-top:22px}
.about{display:grid;grid-template-columns:1.12fr 1.06fr .8fr;gap:4%;align-items:center;padding-block:35px}.about>img{width:100%;height:225px;object-fit:cover;object-position:center 35%}.about h2{font-size:30px;margin:8px 0 12px}.about p{font-size:12px;color:var(--muted)}.about .btn{margin-top:7px}.award{text-align:center;border-left:1px solid var(--gold);padding-left:18px}.award .laurel{font:32px Georgia,serif;color:var(--gold)}.award strong{display:block;font:23px Georgia,serif;color:#98713f}.award strong span{display:block;font-size:30px}.award .eyebrow{font-size:9px}
.testimonials{position:relative;text-align:center;color:#fff;padding:42px 15px;background:linear-gradient(#1516149e,#1516149e),url('https://nathanjamesfilmproductions.co.uk/wp-content/uploads/2025/04/MGL7444-copy-scaled.jpg') center/cover}.testimonials blockquote{font:21px/1.45 Georgia,serif;max-width:650px;margin:10px auto}.testimonials cite{font-style:normal;color:#dbb983;font-size:10px;letter-spacing:.2em}.dots{display:flex;justify-content:center;gap:8px;margin-top:15px}.dots button{border:0;width:7px;height:7px;border-radius:50%;background:#999;cursor:pointer;padding:0}.dots button.active{background:#dfbb80}
.site-footer{background:var(--charcoal);color:#e9e5df}.footer-main{display:flex;align-items:center;justify-content:space-between;gap:22px;padding-block:24px}.footer-brand{display:flex;align-items:center;gap:15px;text-decoration:none}.footer-brand .monogram{font-size:39px}.footer-brand span{font:15px Georgia,serif;letter-spacing:.15em}.footer-brand small{display:block;font:8px Arial,sans-serif;letter-spacing:.28em;color:#cba675}.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:13px}.footer-links a{text-decoration:none;font-size:9px;letter-spacing:.07em;text-transform:uppercase}.footer-links a:hover{color:var(--gold)}.footer-bottom{text-align:center;border-top:1px solid #ffffff20;padding:13px 15px;font-size:10px;color:#aaa}.footer-bottom a{text-decoration:none;margin:0 9px}.interior{max-width:1120px;margin:0 auto;padding:55px 24px 80px;min-height:45vh}.interior h1{font-size:clamp(36px,4vw,54px);text-align:center;margin:0 0 32px}.interior .entry-content img{height:auto}.interior .entry-content{overflow-wrap:anywhere}.interior .entry-content p{font-size:15px}.interior .entry-content .ngg-galleryoverview{max-width:100%}.screen-reader-text{position:absolute;left:-9999px}
@media(max-width:1000px){.nav-bar,.nav-bar ul{gap:16px}.nav-bar a{font-size:9px}.footer-main{flex-wrap:wrap;justify-content:center}.service-grid{gap:12px}.gallery-grid{gap:12px}}
@media(max-width:760px){.masthead{height:80px;grid-template-columns:60px 1fr 60px}.monogram{font-size:39px}.brand strong{font-size:17px;letter-spacing:.16em}.brand span{font-size:8px;letter-spacing:.2em}.brand em{font-size:10px}.header-actions{display:none}.menu-toggle{display:block;border:1px solid var(--gold);color:var(--gold);background:transparent;padding:7px 9px;justify-self:end;grid-column:3;grid-row:1}.nav-bar{display:none;padding-bottom:15px}.nav-bar.open{display:block}.nav-bar ul{display:block}.nav-bar li{border-top:1px solid #ded1bf}.nav-bar a{display:block;padding:11px 0}.nav-bar .sub-menu{display:block;position:static;box-shadow:none;padding-left:20px}.hero{min-height:510px}.hero h1{font-size:44px}.showreel{right:6%;bottom:22px}.scroll-prompt{display:none}.service-grid{grid-template-columns:repeat(2,1fr)}.gallery-grid{grid-template-columns:1fr 1fr}.about{grid-template-columns:1fr 1fr}.about>img{height:260px}.award{grid-column:1/-1;border-left:0;border-top:1px solid var(--gold);padding:22px 0 0}.footer-links{order:3;width:100%}}
@media(max-width:520px){.wrap{padding-inline:20px}.service-grid,.gallery-grid,.about{grid-template-columns:1fr}.service-card img{height:225px}.gallery-card{height:230px}.about>img{height:240px}.hero h1{font-size:39px}.hero-copy{padding-bottom:65px}.showreel{left:20px;right:auto}.footer-main{flex-direction:column}.footer-brand{justify-content:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Refined editorial polish */
:root{--gold:#aa8558;--ivory:#f8f5ef;--charcoal:#1d1e1c}
body{font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:1320px}
.masthead{height:104px}
.brand strong{letter-spacing:.29em}
.nav-bar{min-height:44px;border-top:1px solid #b18a541c}
.nav-bar a{font-size:10px;letter-spacing:.15em}
.hero{min-height:500px}
.hero:before{background:linear-gradient(90deg,#10110fe3 0%,#10110f99 37%,#10110f0d 82%)}
.hero h1{max-width:540px;letter-spacing:-.022em;line-height:1.07}
.hero p{font-size:14px;line-height:1.75}
.section-title{margin-bottom:33px}
.section-title h2{letter-spacing:-.02em}
.services{padding-block:62px 68px}
.service-grid{gap:22px}
.service-card{box-shadow:none;border:1px solid #e9e1d5;background:#fffcf7;transition:transform .25s,box-shadow .25s}
.service-card:hover{box-shadow:0 16px 38px #1c1b1820}
.service-card img{height:190px}
.service-copy{padding:18px 21px 24px}
.service-card h3{font-size:11px;letter-spacing:.16em}
.service-card p{line-height:1.75;min-height:50px}
.learn{display:inline-block;margin-top:7px}
.galleries{padding-block:62px 68px}
.gallery-grid{gap:23px}
.gallery-card{height:250px}
.gallery-caption{bottom:18px;left:20px;right:20px}
.about{padding-block:65px;gap:4.5%}
.about>img{height:270px}
.about h2{line-height:1.15}
.about p{line-height:1.85}
.award{padding-left:28px}
.testimonials{padding:68px 20px}
.testimonials blockquote{font-size:clamp(24px,3vw,34px);line-height:1.35}
.testimonials p{max-width:550px;margin:15px auto 24px;line-height:1.7}
.testimonials .btn{color:#fff}
.footer-main{padding-block:31px}
.interior{padding-top:65px}
@media(max-width:1000px){.nav-bar,.nav-bar ul{gap:14px}.service-grid{gap:15px}.service-card img{height:165px}}
@media(max-width:760px){.masthead{height:83px}.hero{min-height:510px}.services,.galleries{padding-block:48px}.about{padding-block:48px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-card img{height:180px}.gallery-card{height:220px}.nav-bar{border-top:0}}
@media(max-width:520px){.service-grid,.gallery-grid,.about{grid-template-columns:1fr}.service-card img{height:220px}.gallery-card{height:245px}.about>img{height:250px}.hero h1{font-size:40px}}
