/*
Theme Name: JB Styles Interior Design
Theme URI: https://jbstyles.thedigiscale.com/
Author: OpenAI
Description: A premium editorial portfolio theme for JB Styles Interior Design by Jade Burns.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: jb-styles
*/
:root{--ink:#24251f;--paper:#f7f4ee;--cream:#e9e2d6;--olive:#676b50;--clay:#b77d63;--muted:#77766f;--line:rgba(36,37,31,.18);--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button,input,textarea{font:inherit}.site-header{position:absolute;z-index:10;top:0;left:0;width:100%;color:#fff;padding:24px 5.5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.24)}.brand{font-family:var(--serif);font-size:25px;letter-spacing:.12em;line-height:1}.brand small{display:block;font:9px var(--sans);letter-spacing:.23em;text-transform:uppercase;margin-top:7px}.nav{display:flex;align-items:center;gap:30px;font-size:11px;letter-spacing:.14em;text-transform:uppercase}.nav a{transition:opacity .2s}.nav a:hover{opacity:.65}.nav .nav-cta{border:1px solid rgba(255,255,255,.75);padding:12px 18px}.menu-toggle{display:none;background:none;border:1px solid #fff;color:#fff;padding:8px 12px}.hero{min-height:790px;height:min(100vh,960px);position:relative;display:flex;align-items:flex-end;color:white;background:#6d6b5d;overflow:hidden}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 54%;filter:saturate(.78)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,22,18,.68) 0%,rgba(19,22,18,.28) 52%,rgba(19,22,18,.06) 100%),linear-gradient(0deg,rgba(19,22,18,.42),transparent 50%)}.hero-inner{position:relative;z-index:1;width:100%;padding:140px 9% 78px;max-width:1180px}.eyebrow{font-size:10px;letter-spacing:.24em;text-transform:uppercase}.hero h1{font-family:var(--serif);font-size:clamp(54px,8.1vw,112px);font-weight:400;letter-spacing:-.055em;line-height:.98;max-width:850px;margin:25px 0}.hero h1 em{font-weight:400;color:#e7d7c6}.hero-copy{max-width:460px;font-size:15px;color:rgba(255,255,255,.88);margin:0 0 30px}.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;padding:15px 21px;background:var(--ink);color:#fff;font-size:10px;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--ink);transition:background .2s,color .2s}.button:hover{background:transparent;color:inherit}.button-light{background:var(--paper);color:var(--ink);border-color:var(--paper)}.hero-meta{position:absolute;z-index:2;right:5.5%;bottom:38px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;writing-mode:vertical-rl;color:rgba(255,255,255,.8)}.section{padding:110px 8%}.section-head{display:grid;grid-template-columns:1fr 1.2fr;gap:9%;align-items:start;margin-bottom:52px}.kicker{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--olive)}h2{font-family:var(--serif);font-weight:400;letter-spacing:-.04em;font-size:clamp(38px,5vw,66px);line-height:1.05;margin:12px 0 20px}p{margin:0 0 18px}.section-intro{max-width:510px;color:#66665f;font-size:15px}.intro{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center;background:var(--paper)}.intro-photo-wrap{position:relative}.intro-photo{width:100%;height:600px;object-fit:cover;object-position:center}.image-note{position:absolute;right:-22px;bottom:25px;background:var(--cream);padding:18px 22px;font:italic 17px var(--serif)}.intro-copy{max-width:510px}.intro-copy .signature{font-family:var(--serif);font-style:italic;font-size:25px;margin-top:24px}.work{background:#e9e5dc}.work-top{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:44px}.work-top h2{max-width:600px;margin-bottom:0}.work-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:24px;align-items:start}.project{margin:0}.project img{width:100%;height:490px;object-fit:cover;transition:transform .5s}.project:hover img{transform:scale(1.012)}.project:nth-child(2){margin-top:100px}.project:nth-child(2) img{height:400px}.project figcaption{display:flex;justify-content:space-between;gap:16px;padding-top:15px;border-top:1px solid var(--line);margin-top:13px;font-family:var(--serif);font-size:20px}.project figcaption span:last-child{font:10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);align-self:center}.services{background:#f7f4ee}.service-list{border-top:1px solid var(--line)}.service{display:grid;grid-template-columns:70px 1fr 1fr 24px;gap:22px;align-items:center;padding:27px 0;border-bottom:1px solid var(--line)}.service-num{font-size:11px;color:var(--clay);letter-spacing:.15em}.service h3{font:normal 28px var(--serif);margin:0}.service p{color:#6c6b64;font-size:13px;max-width:420px;margin:0}.service-arrow{font-size:24px;color:var(--olive)}.statement{background:var(--olive);color:#f8f4ec;padding:105px 8%;text-align:center}.statement .kicker{color:#e3c9b7}.statement h2{max-width:900px;margin:24px auto 30px;font-size:clamp(40px,6vw,78px)}.statement p{max-width:570px;margin:0 auto 28px;color:rgba(255,255,255,.82)}.statement .button{background:transparent;border-color:rgba(255,255,255,.7)}.statement .button:hover{background:#f8f4ec;color:var(--ink)}.contact{display:grid;grid-template-columns:1fr 1fr;gap:10%;background:#dfd6c9}.contact h2{max-width:510px}.contact-details{margin-top:34px;display:grid;gap:12px}.contact-details a,.contact-details span{border-bottom:1px solid rgba(36,37,31,.22);padding:12px 0;font-size:14px}.contact-form{padding-top:10px}.contact-form label{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;margin:18px 0 7px}.contact-form input,.contact-form textarea{width:100%;border:0;border-bottom:1px solid rgba(36,37,31,.35);background:transparent;padding:12px 0;outline:none;color:var(--ink)}.contact-form textarea{min-height:90px;resize:vertical}.contact-form .button{margin-top:22px;cursor:pointer}.site-footer{padding:28px 6%;background:#24251f;color:#eee8de;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.footer-brand{font-family:var(--serif);font-size:20px;letter-spacing:.12em}.site-footer a{border-bottom:1px solid rgba(255,255,255,.4)}.fade-up{animation:rise .8s ease both}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(max-width:800px){.site-header{padding:19px 6%}.nav{display:none;position:absolute;top:72px;left:0;right:0;background:#24251f;padding:24px 6%;flex-direction:column;align-items:flex-start;gap:18px}.nav.open{display:flex}.menu-toggle{display:block}.hero{min-height:700px;height:90svh}.hero-inner{padding:130px 7% 90px}.hero h1{font-size:clamp(51px,13vw,82px)}.hero-meta{right:4%;bottom:24px}.section{padding:76px 7%}.section-head,.intro,.contact{grid-template-columns:1fr;gap:30px}.intro-photo{height:440px}.image-note{right:0}.work-top{display:block}.work-grid{grid-template-columns:1fr;gap:34px}.project:nth-child(2){margin-top:0}.project img,.project:nth-child(2) img{height:auto;aspect-ratio:4/3}.service{grid-template-columns:35px 1fr 20px;gap:12px}.service p{grid-column:2;grid-row:2}.service-arrow{grid-column:3;grid-row:1}.statement{padding:78px 7%}.site-footer{flex-direction:column;align-items:flex-start}.contact-form{padding-top:0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fade-up{animation:none}.project img{transition:none}}
