:root{--bg:#0a0a09;--panel:#11110f;--panel2:#171612;--text:#f3efe7;--muted:#aaa395;--line:#302d27;--accent:#c97a32;--accent2:#e9ad69;--max:1260px;--serif:Georgia,'Times New Roman',serif;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.6}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.wrap{width:min(calc(100% - 40px),var(--max));margin:auto}.site-header{position:fixed;z-index:50;top:0;left:0;right:0;padding:20px 0;background:linear-gradient(180deg,rgba(0,0,0,.7),transparent);transition:.25s}.site-header.scrolled{background:rgba(8,8,7,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:13px 0}.header-row{display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.brand-mark{width:34px;height:34px;border:1px solid var(--accent);display:grid;place-items:center;color:var(--accent2);font-family:var(--serif);font-size:20px}.nav{display:flex;align-items:center;gap:28px;font-size:14px}.nav a{color:#e7e0d5}.nav a:hover{color:var(--accent2)}.menu-btn{display:none;background:none;border:1px solid var(--line);color:white;padding:8px 11px}.hero{min-height:100svh;position:relative;display:grid;align-items:end;overflow:hidden}.hero-media{position:absolute;inset:0}.hero-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05)}.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.8) 0%,rgba(0,0,0,.4) 48%,rgba(0,0,0,.18) 75%),linear-gradient(0deg,rgba(0,0,0,.85),transparent 55%)}.hero-content{position:relative;z-index:2;padding:180px 0 88px;max-width:830px}.kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent2);font-weight:700}.hero h1,.page-hero h1{font-family:var(--serif);font-weight:400;line-height:.95;letter-spacing:-.045em;margin:14px 0 24px;font-size:clamp(60px,10vw,145px)}.hero p{font-size:clamp(18px,2vw,25px);max-width:730px;color:#ded6ca}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--accent);padding:13px 20px;text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:800}.btn.fill{background:var(--accent);color:#120c07}.btn:hover{border-color:var(--accent2);background:var(--accent2);color:#111}.section{padding:100px 0}.section.alt{background:var(--panel)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:42px}.section-head h2,.content h2{font-family:var(--serif);font-weight:400;font-size:clamp(36px,5vw,68px);line-height:1;margin:8px 0}.section-head p{max-width:620px;color:var(--muted)}.intro-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:start}.intro-grid .big{font-family:var(--serif);font-size:clamp(32px,5vw,64px);line-height:1.05}.intro-grid .copy{font-size:19px;color:#cbc4b8}.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.work-card{position:relative;overflow:hidden;background:#12110f;min-height:360px}.work-card:nth-child(6n+1),.work-card:nth-child(6n+4){grid-column:span 7}.work-card:nth-child(6n+2),.work-card:nth-child(6n+3),.work-card:nth-child(6n+5),.work-card:nth-child(6n+6){grid-column:span 5}.work-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s,filter .4s}.work-card:hover img{transform:scale(1.035);filter:brightness(.78)}.work-meta{position:absolute;inset:auto 0 0 0;padding:24px;background:linear-gradient(0deg,rgba(0,0,0,.88),transparent);display:flex;justify-content:space-between;align-items:end;gap:18px}.work-meta h3{margin:0;font-family:var(--serif);font-size:30px;font-weight:400}.work-meta span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent2)}.profile{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}.profile img{width:100%;aspect-ratio:4/5;object-fit:cover}.profile h2{font-family:var(--serif);font-weight:400;font-size:clamp(46px,6vw,82px);line-height:1;margin:10px 0 26px}.profile p{color:#c9c1b4;font-size:18px}.press-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.press-card{border:1px solid var(--line);padding:24px;background:var(--panel2);min-height:240px;display:flex;flex-direction:column}.press-card .outlet{color:var(--accent2);font-size:11px;text-transform:uppercase;letter-spacing:.15em}.press-card h3{font-family:var(--serif);font-size:26px;line-height:1.15;font-weight:400}.press-card p{color:var(--muted);font-size:14px}.press-card .more{margin-top:auto;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.11em}.cta{padding:100px 0;background:linear-gradient(120deg,#22160c,#0f0d0a 55%)}.cta-row{display:flex;align-items:end;justify-content:space-between;gap:45px}.cta h2{font-family:var(--serif);font-weight:400;font-size:clamp(44px,7vw,92px);line-height:.95;margin:0;max-width:850px}.site-footer{border-top:1px solid var(--line);padding:50px 0 28px;color:var(--muted)}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px}.footer-grid h4{color:white;margin:0 0 14px}.footer-grid a{display:block;margin:6px 0}.footer-bottom{border-top:1px solid var(--line);padding-top:22px;margin-top:38px;font-size:13px;display:flex;justify-content:space-between;gap:20px}.page-hero{padding:180px 0 70px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 75% 20%,#2a190c 0,transparent 30%)}.page-hero p{max-width:760px;color:var(--muted);font-size:19px}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:35px}.filter{border:1px solid var(--line);padding:8px 13px;font-size:12px;color:var(--muted)}.filter.active,.filter:hover{border-color:var(--accent);color:white}.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.project-card{border:1px solid var(--line);background:var(--panel)}
.project-card img{
    width:100%;
    aspect-ratio:9/16;
    object-fit:cover;
    object-position:center;
}

    .project-card .body{padding:18px}.project-card h3{font-family:var(--serif);font-size:28px;font-weight:400;margin:0 0 5px}.project-card .meta{color:var(--accent2);font-size:11px;text-transform:uppercase;letter-spacing:.12em}.project-detail-hero{position:relative;min-height:78svh;display:flex;align-items:end}.project-detail-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.project-detail-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.9),transparent 70%)}.project-detail-hero .wrap{z-index:2;padding-bottom:58px}.project-detail-hero h1{font-family:var(--serif);font-size:clamp(48px,8vw,110px);line-height:.95;font-weight:400;margin:8px 0}.project-info{display:grid;grid-template-columns:1fr 2fr;gap:60px}.facts{border-top:1px solid var(--line)}.fact{display:flex;justify-content:space-between;gap:24px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.fact span:first-child{color:var(--muted)}.rich{font-size:18px;color:#d1cabf}.rich p:first-child{margin-top:0}
    
    .gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:45px}.gallery-grid img{width:100%;height:600px;object-fit:cover}.content{max-width:900px}.content p,.content li{color:#c9c1b4;font-size:18px}.content img{margin:36px 0}.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.post-card{border-top:1px solid var(--line);padding-top:18px}.post-card img{aspect-ratio:16/10;object-fit:cover;width:100%;margin-bottom:16px}.post-card time{font-size:11px;color:var(--accent2);text-transform:uppercase;letter-spacing:.12em}.post-card h3{font-family:var(--serif);font-size:30px;line-height:1.08;font-weight:400;margin:9px 0}.post-card p{color:var(--muted)}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.contact-list{border-top:1px solid var(--line)}.contact-list div{padding:16px 0;border-bottom:1px solid var(--line)}.contact-list small{display:block;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field.full{grid-column:1/-1}.field label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);margin-bottom:6px}.field input,.field textarea,.field select{width:100%;background:#11100e;border:1px solid var(--line);color:white;padding:13px 14px;outline:none}.field input:focus,.field textarea:focus{border-color:var(--accent)}.field textarea{min-height:170px;resize:vertical}.notice{border:1px solid #466749;background:#142016;color:#bfe3c3;padding:13px 15px;margin-bottom:22px}.error{border-color:#75423e;background:#251311;color:#f2c1bb}.empty{padding:40px;border:1px dashed var(--line);color:var(--muted)}
@media(max-width:900px){.nav{display:none;position:absolute;top:65px;left:20px;right:20px;background:#111;padding:18px;border:1px solid var(--line);flex-direction:column;align-items:flex-start}.nav.open{display:flex}.menu-btn{display:block}.intro-grid,.profile,.project-info,.contact-grid,.footer-grid{grid-template-columns:1fr}.work-card,.work-card:nth-child(n){grid-column:span 12}.press-grid,.project-grid,.journal-grid{grid-template-columns:1fr 1fr}.gallery-grid img{height:420px}.cta-row{align-items:flex-start;flex-direction:column}.hero-content{padding-bottom:60px}}
@media(max-width:600px){.wrap{width:min(calc(100% - 28px),var(--max))}.section{padding:72px 0}.press-grid,.project-grid,.journal-grid,.form-grid{grid-template-columns:1fr}.hero h1,.page-hero h1{font-size:52px}.project-detail-hero h1{font-size:48px}.gallery-grid{grid-template-columns:1fr}.gallery-grid img,.gallery-grid img:nth-child(3n){grid-column:auto;height:auto}.footer-bottom{flex-direction:column}}

#lightbox{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.95);
    z-index:99999;
    align-items:center;
    justify-content:center;
}

#lightbox img{
    max-width:90%;
    max-height:90%;
    object-fit:contain;
    cursor:pointer;
}

.gallery-grid img{
    cursor:pointer;
}

#lightbox span{
    position:absolute;
    top:20px;
    right:40px;
    color:white;
    font-size:50px;
    cursor:pointer;
    z-index:10;
}
#gallery-lightbox{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100vw;
    height:100vh;
    background:rgba(0,0,0,.95);
    z-index:9999999;
    align-items:center;
    justify-content:center;
}

#gallery-lightbox img{
    max-width:90vw;
    max-height:90vh;
    width:auto;
    height:auto;
    object-fit:contain;
}

#gallery-lightbox button{
    position:fixed;
    top:50%;
    transform:translateY(-50%);
    background:none;
    border:0;
    color:white;
    font-size:55px;
    cursor:pointer;
    z-index:10000000;
}

#gallery-lightbox button:first-child{
    left:30px;
}

#gallery-lightbox button:nth-child(3){
    right:30px;
}

#gallery-lightbox span{
    position:fixed;
    top:20px;
    right:30px;
    color:white;
    font-size:45px;
    cursor:pointer;
}

/* FIX LIGHTBOX POSITION */
#gallery-lightbox,
#lightbox{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.95);
    z-index: 2147483647 !important;
}

#gallery-lightbox img,
#lightbox img{
    max-width: 90vw !important;
    max-height: 90vh !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}

#gallery-lightbox button,
#lightbox button{
    position: fixed !important;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2147483647 !important;
}

#gallery-lightbox span,
#lightbox span{
    position: fixed !important;
    top:20px;
    right:30px;
    z-index:2147483647 !important;
}
/* CONTACT PAGE REFINED */
 
.contact-page{
    padding:100px 0;
 
    background:
    radial-gradient(
        circle at 90% 20%,
        rgba(201,122,50,.08),
        transparent 30%
    );
}
 
 
.contact-page .contact-grid{
 
    display:grid;
 
    grid-template-columns:
    .8fr 1.2fr;
 
    gap:70px;
 
}
 
 
/* LEFT */
 
.contact-info{
 
    padding:20px 0;
 
}
 
 
.contact-list div{
 
    padding:25px 0;
 
    border-bottom:
    1px solid rgba(255,255,255,.12);
 
}
 
 
.contact-list small{
 
    display:block;
 
    color:#c97a32;
 
    font-size:11px;
 
    letter-spacing:3px;
 
    margin-bottom:10px;
 
}
 
 
.contact-list a,
.contact-list div{
 
    color:#eee;
 
}
 
 
 
/* FORM */
 
.contact-form{
 
    background:#10100f;
 
    border:
    1px solid rgba(255,255,255,.08);
 
    padding:40px;
 
}
 
 
.form-grid{
 
    gap:25px;
 
}
 
 
.field label{
 
    color:#c97a32;
 
    font-size:11px;
 
    letter-spacing:2px;
 
}
 
 
.field input,
.field textarea{
 
    background:#0b0b0a;
 
    border:
    1px solid rgba(255,255,255,.12);
 
    padding:16px;
 
    color:white;
 
}
 
 
.field input:focus,
.field textarea:focus{
 
    border-color:#c97a32;
 
}
 
 
.contact-form .btn.fill{
 
    background:#c97a32;
 
    color:#111;
 
    padding:15px 35px;
 
}
/* ==================================================
   FLOATING SOCIAL ICONS
   ================================================== */
 
.social-float{
    position:fixed;
 
    top:105px;
    right:22px;
 
    z-index:9999;
 
    display:flex;
    flex-direction:column;
 
    gap:9px;
 
    padding:7px;
 
    background:rgba(20,20,20,.60);
 
    border:1px solid rgba(255,255,255,.12);
 
    border-radius:30px;
 
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
 
    box-shadow:
        0 10px 35px rgba(0,0,0,.40);
}
 
 
/* All social buttons */
 
.social-float a{
    width:43px;
    height:43px;
 
    display:flex;
    align-items:center;
    justify-content:center;
 
    border-radius:50%;
 
    color:#fff;
 
    box-shadow:
        0 4px 14px rgba(0,0,0,.30);
 
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        filter .25s ease;
}
 
 
/* SVG icon */
 
.social-float a svg{
    width:20px;
    height:20px;
 
    fill:#fff;
}
 
 
/* Facebook */
 
.social-facebook{
    background:#1877F2;
}
 
 
/* Instagram */
 
.social-instagram{
    background:
        radial-gradient(
            circle at 30% 107%,
            #fdf497 0%,
            #fdf497 5%,
            #fd5949 45%,
            #d6249f 60%,
            #285AEB 90%
        );
}
 
 
/* LinkedIn */
 
.social-linkedin{
    background:#0A66C2;
}
 
 
/* Hover */
 
.social-float a:hover{
    transform:
        translateX(-5px)
        scale(1.08);
 
    filter:brightness(1.12);
 
    box-shadow:
        0 7px 20px rgba(0,0,0,.45);
}
 
 
/* Decorative line */
 
.social-float::before{
    content:"";
 
    position:absolute;
 
    width:1px;
    height:24px;
 
    top:-30px;
    left:50%;
 
    background:
        rgba(201,122,50,.65);
}
 
 
/* Mobile */
 
@media(max-width:600px){
 
    .social-float{
        top:82px;
        right:9px;
 
        padding:5px;
 
        gap:5px;
    }
 
 
    .social-float a{
        width:36px;
        height:36px;
    }
 
 
    .social-float a svg{
        width:17px;
        height:17px;
    }
 
 
    .social-float::before{
        display:none;
    }
 
}



/* PRODUCTS PAGE */
.products-page .products-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}
.products-page .product-card{
    min-width:0;
    overflow:hidden;
    border:1px solid var(--line);
    background:var(--panel);
    transition:transform .3s ease,border-color .3s ease;
}
.products-page .product-card:hover{
    transform:translateY(-4px);
    border-color:var(--accent);
}
.products-page .product-image{
    width:100%;
    aspect-ratio:4/5;
    overflow:hidden;
    background:var(--panel2);
}
.products-page .product-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transition:transform .4s ease;
}
.products-page .product-card:hover .product-image img{
    transform:scale(1.035);
}
.products-page .product-content{padding:22px}
.products-page .product-content h2{
    margin:0 0 10px;
    font-family:var(--serif);
    font-size:clamp(23px,2.3vw,30px);
    line-height:1.2;
    font-weight:400;
}
.products-page .product-price{
    color:var(--accent2);
    font-size:15px;
    margin:0 0 12px;
}
.products-page .product-content p{
    color:var(--muted);
    font-size:14px;
    line-height:1.8;
    margin:0 0 22px;
}
.products-page .product-contact{
    display:inline-flex;
    align-items:center;
    gap:12px;
}
.products-page .product-contact span{transition:transform .2s ease}
.products-page .product-contact:hover span{transform:translateX(4px)}
.products-page .products-enquiry{
    padding:75px 0;
    text-align:center;
    border-top:1px solid var(--line);
    background:var(--panel);
}
.products-page .products-enquiry h2{
    max-width:850px;
    margin:12px auto 16px;
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(36px,5vw,64px);
    line-height:1.05;
}
.products-page .products-enquiry p{
    max-width:620px;
    margin:0 auto 25px;
    color:var(--muted);
}

/* Widen the Work page content wrapper only */
.work-page .wrap{
    width:min(94%,1700px);
    max-width:none;
    margin-left:auto;
    margin-right:auto;
}

@media(max-width:900px){
    .products-page .products-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:20px;
    }
    .work-page .wrap{width:94%}
}

@media(max-width:600px){
    .products-page .products-grid{
        grid-template-columns:1fr;
        gap:22px;
    }
    .products-page .product-content{padding:18px}
    .products-page .products-enquiry{padding:58px 0}
    .work-page .wrap{width:calc(100% - 30px)}
}



/* WORK PAGE - EXPAND CONTENT WIDTH */
.work-page .wrap {
    width: calc(100% - 60px) !important;
    max-width: 1700px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.work-page .project-grid {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Tablet */
@media (max-width: 900px) {
    .work-page .wrap {
        width: calc(100% - 40px) !important;
    }

    .work-page .project-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Mobile */
@media (max-width: 600px) {
    .work-page .wrap {
        width: calc(100% - 30px) !important;
    }

    .work-page .project-grid {
        grid-template-columns: 1fr;
    }
}
/* WORK PAGE ONLY — CONSISTENT IMAGE PROPORTION, NO CROPPING */
.work-page .project-grid .project-card > img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    height: auto !important;
    object-fit: contain !important;
    object-position: center;
    background: #111;
}
 
/* Tablet */
@media (max-width: 900px) {
    .work-page .project-grid .project-card > img {
        aspect-ratio: 4 / 5;
    }
}
 
/* Mobile */
@media (max-width: 600px) {
    .work-page .project-grid .project-card > img {
        aspect-ratio: 4 / 5;
    }
}


/* INDIVIDUAL PROJECT GALLERY — 4:5, FULL IMAGE, NO CROPPING */
.gallery-grid img,
.gallery-grid img:nth-child(3n) {
    display: block;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 5;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center;
    background: #111;
}
 
 /* Zakir Khan artwork background across all pages */
html,
body {
    min-height: 100%;
    background-color: #080808;
}
 
body {
    background-image:
        linear-gradient(
            90deg,
            rgba(8, 8, 8, 0.98) 0%,
            rgba(8, 8, 8, 0.94) 35%,
            rgba(8, 8, 8, 0.82) 65%,
            rgba(8, 8, 8, 0.72) 100%
        ),
        url("https://zakirkhanartist.com/uploads/profile/zakir-work-bg.jpg");
 
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
 
/* Mobile responsive */
@media (max-width: 768px) {
    body {
        background-attachment: scroll;
        background-position: 65% center;
    }
}

/* =====================================
   CONTACT PAGE REDESIGN
===================================== */

.contact-page {
    padding: 85px 0 110px;
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(201, 122, 50, 0.07),
            transparent 35%
        );
}

.contact-page .contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    align-items: start;
    gap: clamp(35px, 6vw, 85px);
}

/* Left information area */

.contact-info {
    padding: 24px 0;
}

.contact-info h2 {
    max-width: 460px;
    margin: 18px 0;
    font-family: var(--serif);
    font-size: clamp(38px, 4.5vw, 62px);
    font-weight: 400;
    line-height: 1.05;
    color: var(--text);
}

.contact-intro {
    max-width: 430px;
    margin-bottom: 38px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.8;
}

.contact-page .contact-list {
    border-top: 1px solid rgba(255,255,255,.14);
}

.contact-page .contact-list div {
    padding: 22px 0;
    border-bottom: 1px solid rgba(255,255,255,.14);
    color: var(--text);
    overflow-wrap: anywhere;
}

.contact-page .contact-list small {
    display: block;
    margin-bottom: 7px;
    color: var(--accent2);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.contact-page .contact-list a {
    transition: color .2s ease;
}

.contact-page .contact-list a:hover {
    color: var(--accent2);
}

/* Form panel */

.contact-page .contact-form {
    padding: clamp(24px, 4vw, 44px);
    background: rgba(19, 18, 16, .96);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 20px 60px rgba(0,0,0,.20);
}

.contact-page .form-heading {
    margin-bottom: 30px;
}

.contact-page .form-heading h2 {
    margin: 10px 0;
    font-family: var(--serif);
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 400;
    line-height: 1.15;
}

.contact-page .form-heading p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

/* Form fields */

.contact-page .form-grid {
    gap: 22px 18px;
}

.contact-page .field label {
    display: block;
    margin-bottom: 9px;
    color: #d7cfc2;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.contact-page .field input,
.contact-page .field textarea {
    display: block;
    width: 100%;
    min-height: 52px;
    padding: 14px 15px;
    color: #f3efe7;
    background: #0b0b0a;
    border: 1px solid #39352e;
    border-radius: 2px;
    outline: none;
    transition: border-color .2s ease, background .2s ease;
}

.contact-page .field input:focus,
.contact-page .field textarea:focus {
    border-color: var(--accent);
    background: #11100e;
}

.contact-page .field textarea {
    min-height: 160px;
    resize: vertical;
}

.contact-page .field input::placeholder,
.contact-page .field textarea::placeholder {
    color: #77736c;
}

/* Submit button */

.contact-page .contact-form .btn.fill {
    min-height: 48px;
    padding: 14px 25px;
    background: var(--accent);
    border: 1px solid var(--accent);
    color: #120c07;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

.contact-page .contact-form .btn.fill:hover {
    background: var(--accent2);
    border-color: var(--accent2);
    transform: translateY(-2px);
}

/* Tablet and mobile */

@media (max-width: 900px) {
    .contact-page {
        padding: 65px 0 80px;
    }

    .contact-page .contact-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .contact-info {
        padding: 0;
    }

    .contact-info h2 {
        max-width: 600px;
    }

    .contact-intro {
        margin-bottom: 25px;
    }

    .contact-page .contact-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 25px;
    }
}

@media (max-width: 600px) {
    .contact-page {
        padding: 45px 0 65px;
    }

    .contact-page .contact-list {
        grid-template-columns: 1fr;
    }

    .contact-page .contact-form {
        padding: 23px 18px;
    }

    .contact-page .form-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .contact-page .field.full {
        grid-column: auto;
    }

    .contact-page .field input {
        min-height: 50px;
    }

    .contact-page .field textarea {
        min-height: 140px;
    }

    .contact-page .contact-form .btn.fill {
        width: 100%;
        justify-content: center;
    }
}
/* =========================================================
   MAIN GALLERY PAGE ONLY
   Desktop = 3 columns
   Tablet  = 2 columns
   Mobile  = 1 column
   4:5 cards, full image, no cropping
   ========================================================= */
 
.gallery-main-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
}
 
 
/* Cancel existing work-card 7/5 column spans */
.gallery-main-grid > .work-card,
.gallery-main-grid > .work-card:nth-child(n) {
    grid-column: auto !important;
 
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
 
    aspect-ratio: 4 / 5;
    overflow: hidden;
}
 
 
/* Complete image visible — no cropping */
.gallery-main-grid > .work-card img {
    display: block;
 
    width: 100% !important;
    height: 100% !important;
 
    aspect-ratio: auto !important;
 
    object-fit: contain !important;
    object-position: center !important;
 
    background: #111;
}
 
 
/* Remove original work-grid hover zoom */
.gallery-main-grid > .work-card:hover img {
    transform: none !important;
}
 
 
/* TABLET */
@media (max-width: 900px) {
 
    .gallery-main-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
 
    .gallery-main-grid > .work-card,
    .gallery-main-grid > .work-card:nth-child(n) {
        grid-column: auto !important;
    }
}
 
 
/* MOBILE */
@media (max-width: 600px) {
 
    .gallery-main-grid {
        grid-template-columns: 1fr !important;
    }
 
}