/*
Theme Name: Satyanarayan Portfolio
Theme URI: https://itwebsvcs.com/
Author: Satyanarayan
Description: Personal portfolio theme for a WordPress Developer and SEO Expert. Includes dynamic project and blog sections.
Version: 1.1.6
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: satya-portfolio
*/

    :root{--orange:#C65D32;--charcoal:#202020;--cream:#F5F0E8;--sand:#DCC9AE;--white:#fff;--muted:#bdb7af;--ink:#25221f;--max:1200px}
    *{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--cream);line-height:1.6}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}.wrap{width:min(var(--max),calc(100% - 48px));margin:auto}.eyebrow{display:flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:700}.eyebrow:before{content:"";width:28px;height:2px;background:var(--orange)}.section-title{font:800 clamp(2.5rem,5vw,4.8rem)/1.02 "Manrope",sans-serif;letter-spacing:-.065em;margin:18px 0 24px}.section-intro{max-width:650px;font-size:1.05rem;color:#625c55}.nav{position:fixed;inset:0 0 auto;z-index:50;color:white;transition:background .3s,backdrop-filter .3s}.nav.menu-open{z-index:80}.nav.scrolled{background:rgba(32,32,32,.9);backdrop-filter:blur(14px);border-bottom:1px solid #ffffff17}.nav-inner{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{font:800 1.1rem "Manrope",sans-serif;letter-spacing:-.04em}.brand span{color:#ed986f}.nav-links{display:flex;gap:30px;align-items:center;font-size:.88rem;color:#f1eae4}.nav-links a{transition:color .2s}.nav-links a:hover{color:#ed986f}.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;padding:13px 20px;border-radius:3px;font-weight:700;font-size:.88rem;transition:transform .2s,background .2s,border-color .2s;cursor:pointer}.nav-cta,.btn-primary{background:var(--orange);color:white}.nav-cta:hover,.btn:hover{transform:translateY(-2px)}.menu-toggle{display:none;border:1px solid #ffffffb0;color:#fff;background:rgba(255,255,255,.08);padding:10px 13px;border-radius:4px;position:relative;z-index:51;font-weight:700;box-shadow:0 3px 12px #0002;backdrop-filter:blur(8px)}.menu-toggle .menu-label{color:#fff}.nav.menu-open .menu-toggle{z-index:51}.menu-backdrop{position:fixed;inset:0;background:rgba(12,10,9,.58);z-index:60;opacity:0;visibility:hidden;transition:opacity .28s,visibility .28s}.menu-backdrop.open{opacity:1;visibility:visible}
    .hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:#4a281b;color:white}.hero-media{position:absolute;inset:0;background:linear-gradient(90deg,rgba(83,35,17,.72),rgba(198,93,50,.45) 48%,rgba(30,23,19,.15)),linear-gradient(0deg,rgba(24,20,18,.82),transparent 66%),url("assets/satyanarayan-hero.png") center 38%/cover no-repeat;transform:scale(1.02)}.hero-media video{position:absolute;width:100%;height:100%;object-fit:cover;inset:0;display:none}.hero.has-video .hero-media video{display:block}.hero-content{position:relative;z-index:2;padding:155px 0 48px;width:100%;max-width:var(--max);margin:0 auto}.hero-copy{max-width:min(100%,850px);padding-left:clamp(0px,1.2vw,18px);padding-right:clamp(0px,2vw,28px)}.hero .eyebrow{color:#ffe0cc}.hero h1{font:800 clamp(3.7rem,8.8vw,8.4rem)/.98 "Manrope",sans-serif;letter-spacing:-.075em;margin:24px 0 22px;max-width:100%;overflow-wrap:anywhere}.hero h1 span{color:#f3b18f}.hero-role{font:600 clamp(1.08rem,2vw,1.65rem)/1.3 "Manrope",sans-serif;letter-spacing:-.03em;margin-bottom:15px;max-width:680px}.hero p{max-width:560px;color:#f4e7df;font-size:clamp(.95rem,1.25vw,1.05rem);line-height:1.75;margin:0 0 28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.btn-secondary{color:white;border-color:#ffffff88;background:#ffffff0c}.btn-secondary:hover{background:#ffffff20}.hero-bottom{margin-top:68px;display:flex;align-items:flex-end;justify-content:space-between;gap:28px}.stats{display:flex;gap:clamp(22px,5vw,68px);flex-wrap:wrap}.stat{border-left:1px solid #ffffff65;padding-left:15px}.stat strong{display:block;font:700 1rem "Manrope",sans-serif}.stat span{font-size:.75rem;color:#ead6ca}.scroll-note{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#f4d5c2;white-space:nowrap}
    .about{background:var(--cream);padding:120px 0}.about-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(42px,8vw,110px);align-items:center}.portrait-frame{position:relative;max-width:470px}.portrait-frame:before{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid #c65d3266}.portrait-frame img{display:block;position:relative;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 25%;filter:saturate(.85)}.portrait-note{position:absolute;bottom:20px;left:-18px;background:var(--orange);color:white;padding:15px 18px;font-size:.8rem;font-weight:600;letter-spacing:.02em}.about-copy p{color:#5d5751;max-width:660px}.skills{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}.skill{border:1px solid #d5c9ba;padding:8px 12px;font-size:.78rem;color:#4f4842;background:#ffffff55}
    .experience{background:var(--sand);padding:112px 0}.experience-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:55px}.experience-head .section-title{max-width:560px;margin-bottom:0}.timeline{max-width:900px;margin-left:auto;border-left:1px solid #a48c70;padding-left:34px}.timeline-item{position:relative;padding:0 0 42px}.timeline-item:last-child{padding-bottom:0}.timeline-item:before{content:"";position:absolute;width:11px;height:11px;background:var(--orange);border:4px solid var(--sand);border-radius:50%;left:-41px;top:6px;box-shadow:0 0 0 1px #a48c70}.timeline-date{font-size:.75rem;text-transform:uppercase;letter-spacing:.13em;color:#685847;font-weight:700}.timeline h3{font:700 1.4rem "Manrope",sans-serif;margin:8px 0 3px;letter-spacing:-.03em}.timeline h4{font-size:.92rem;font-weight:600;margin:0 0 12px;color:#6c4b36}.upwork-link{display:inline-block;margin-left:8px;color:#155e45;text-decoration:underline;text-underline-offset:3px;font-weight:700}.upwork-link:hover{color:#202020}.timeline p{max-width:700px;color:#51483e;margin:0}.timeline .skills{margin-top:16px}
    .projects{background:var(--charcoal);color:white;padding:120px 0}.projects .section-intro{color:#bcb6af}.projects-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:48px}.projects-top .section-title{max-width:600px;margin-bottom:0}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.project-card{border:1px solid #ffffff20;background:#292929;min-width:0;transition:transform .25s,border-color .25s}.project-card:hover{transform:translateY(-6px);border-color:#c65d32a8}.project-art{height:230px;position:relative;overflow:hidden;background:#322a25;display:flex;align-items:center;justify-content:center}.project-art:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#c65d3233,transparent 60%)}.art-window{position:relative;width:72%;height:70%;background:#f5f0e8;box-shadow:0 16px 50px #0005;transform:rotate(-4deg);padding:12px;z-index:1}.art-top{height:8px;display:flex;gap:4px;margin-bottom:12px}.art-top i{width:5px;height:5px;border-radius:50%;background:#c65d32}.art-lines{display:grid;grid-template-columns:1fr .65fr;gap:8px;height:75%}.art-lines div:first-child{background:linear-gradient(160deg,#d66c3b,#f0b28c)}.art-lines div:last-child{background:repeating-linear-gradient(0deg,#d6c6b6 0 5px,#f5f0e8 5px 12px)}.art-seo{width:150px;height:150px;border:1px solid #e5a07e;border-radius:50%;display:grid;place-items:center;position:relative;z-index:1}.art-seo span{font:800 2.6rem "Manrope";color:#f2a37e}.art-seo:before,.art-seo:after{content:"";position:absolute;border:1px solid #e5a07e66;border-radius:50%;inset:15px}.art-seo:after{inset:-15px}.art-speed{display:flex;align-items:center;gap:10px;z-index:1}.art-speed span{font:800 4.5rem "Manrope";color:#f2a37e;letter-spacing:-.1em}.art-speed i{width:48px;height:48px;border-top:4px solid #f2a37e;border-right:4px solid #f2a37e;border-radius:50%;transform:rotate(35deg)}.project-content{padding:24px}.project-number{color:#e28a62;font-size:.72rem;letter-spacing:.13em;font-weight:700}.project-content h3{font:700 1.3rem "Manrope";letter-spacing:-.04em;margin:10px 0}.project-content p{color:#bdb7af;font-size:.9rem;min-height:88px;margin:0}.project-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.project-tags span{font-size:.69rem;border:1px solid #ffffff26;padding:5px 8px;color:#e5dcd4}.project-link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;color:#f0a07a;font-size:.82rem;font-weight:700;border-bottom:1px solid #c65d3266;padding-bottom:5px}.project-link:hover{color:#fff;border-color:#fff}
    .contact{background:var(--charcoal);color:white;padding:60px 0 34px}.contact-panel{border-top:1px solid #ffffff30;padding:76px 0 70px;display:grid;grid-template-columns:1.1fr .9fr;gap:60px}.contact h2{font:800 clamp(3rem,7vw,6.4rem)/.95 "Manrope";letter-spacing:-.08em;max-width:700px;margin:20px 0 24px}.contact .closing{color:#c5bdb5;max-width:500px}.contact-info{display:grid;align-content:center;gap:18px}.contact-row{display:grid;grid-template-columns:100px 1fr;gap:16px;padding-bottom:14px;border-bottom:1px solid #ffffff20;font-size:.9rem}.contact-row span:first-child{color:#a9a29b}.contact-row a,.contact-row strong{overflow-wrap:anywhere}.contact-row a:hover{color:#f1a17b}.whatsapp-icon{width:20px;height:20px;vertical-align:middle;margin-right:8px;color:#35c96f;flex:0 0 auto}.contact-row a[aria-label="Chat with Satyanarayan on WhatsApp"]{display:inline-flex;align-items:center;gap:2px}.contact-button{margin-top:12px;justify-self:start}.footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #ffffff20;padding-top:24px;color:#9f9891;font-size:.76rem}.footer strong{color:#e4d9cf}.quick-contact{position:fixed;right:22px;bottom:24px;z-index:55;display:flex;flex-direction:column;gap:12px}.quick-contact a{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 8px 24px #0002;transition:transform .2s,box-shadow .2s}.quick-contact a:hover{transform:translateY(-3px);box-shadow:0 12px 28px #0003}.quick-contact .quick-whatsapp{background:#20c76a}.quick-contact .quick-call{background:#1769e0}.quick-contact svg{width:25px;height:25px;display:block}.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
    .drawer-heading,.menu-close{display:none}
    @media(max-width:850px){
      .nav-inner{height:72px}.menu-toggle{display:flex;align-items:center;gap:8px}.menu-cta{display:none}.nav-cta{display:none}
      .nav-links{display:flex;position:fixed;z-index:82;top:0;right:0;left:auto;width:min(84vw,340px);height:100dvh;padding:25px 25px 36px;background:#24211f;color:#f5f0e8;flex-direction:column;align-items:stretch;gap:0;border-left:1px solid #ffffff1c;box-shadow:-22px 0 55px #0003;transform:translateX(105%);visibility:hidden;transition:transform .3s cubic-bezier(.2,.75,.25,1),visibility .3s;overflow-y:auto}
      .nav-links.open{transform:translateX(0);visibility:visible}
      .drawer-heading{display:flex;align-items:center;justify-content:space-between;padding:5px 0 22px;margin-bottom:10px;border-bottom:1px solid #ffffff24;text-transform:uppercase;letter-spacing:.15em;font-size:.72rem;color:#e7b99f;font-weight:700}
      .menu-close{display:inline-flex;align-items:center;justify-content:center;position:relative;z-index:85;width:44px;height:44px;border:1px solid #ffffffb0;background:#C65D32;color:#fff;border-radius:5px;font-size:1.8rem;font-weight:700;line-height:1;cursor:pointer;box-shadow:0 3px 12px #0004}.menu-close:hover{background:#a94723}
      .nav-links>a{padding:18px 0;border-bottom:1px solid #ffffff20;font-size:1.05rem;font-weight:600;color:#fff;display:block}.nav-links>a:focus-visible,.menu-toggle:focus-visible,.menu-close:focus-visible{outline:3px solid #f3b18f;outline-offset:3px}
      .nav-links>a:hover{color:#f1a17b}.hero-content{padding-top:125px}.hero-bottom{align-items:flex-start;flex-direction:column;margin-top:50px}.stats{align-items:flex-start;flex-direction:column}.about-grid{grid-template-columns:1fr}.portrait-frame{max-width:430px;margin:0 auto 10px}.about-copy{max-width:720px}.experience-head,.projects-top{align-items:flex-start;flex-direction:column}.project-grid{grid-template-columns:1fr 1fr}.project-card:last-child{grid-column:span 2}.contact-panel{grid-template-columns:1fr;gap:34px}.contact-info{max-width:600px}
    }
    @media(min-width:851px){.menu-backdrop{display:none}}
    @media(max-width:560px){.wrap{width:min(var(--max),calc(100% - 34px))}.hero-content{padding-top:128px;padding-bottom:34px}.hero h1{font-size:clamp(3rem,13.5vw,4.6rem);letter-spacing:-.065em;line-height:1.02;overflow-wrap:normal;word-break:normal}.hero-role{font-size:1.08rem}.hero p{max-width:100%;font-size:.94rem}.hero-actions .btn{padding:12px 14px}.quick-contact{right:14px;bottom:18px;gap:10px;z-index:54}.quick-contact a{width:48px;height:48px}.quick-contact svg{width:22px;height:22px}.hero p{font-size:.97rem}.stats{gap:18px 26px}.stat{min-width:125px}.scroll-note{display:none}.about,.experience,.projects{padding:82px 0}.section-title{font-size:2.8rem}.project-grid{grid-template-columns:1fr}.project-card:last-child{grid-column:auto}.project-content p{min-height:0}.project-art{height:210px}.contact{padding-top:35px}.contact-panel{padding:55px 0}.contact h2{font-size:3.5rem}.contact-row{grid-template-columns:82px 1fr}.footer{flex-direction:column}.portrait-frame:before{inset:12px -10px -12px 10px}.portrait-note{left:-8px}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*,*:before,*:after{animation:none!important;transition:none!important}}
  
/* WordPress dynamic content additions */
.blog-section{background:#f5f0e8;padding:110px 0}.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.blog-card{background:#fff;border:1px solid #e5d9cc;min-width:0}.blog-thumb{height:210px;background:#dcc9ae;overflow:hidden}.blog-thumb img{width:100%;height:100%;object-fit:cover;display:block}.blog-card-body{padding:24px}.blog-meta{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:#8a6c55}.blog-card h3{font:700 1.25rem/1.25 Manrope,sans-serif;margin:10px 0}.blog-card p{font-size:.9rem;color:#625c55}.blog-read{display:inline-block;color:#b34d25;font-weight:700;font-size:.85rem;margin-top:8px}.archive-wrap{padding:130px 0 90px}.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.post-content{max-width:850px;margin:0 auto;padding:130px 24px 90px}.post-content h1{font:800 clamp(2.4rem,5vw,4.5rem)/1.05 Manrope,sans-serif;letter-spacing:-.06em}.post-content .entry-content{font-size:1.05rem;line-height:1.85}.post-content .entry-content img{max-width:100%;height:auto}.post-content .entry-content h2,.post-content .entry-content h3{font-family:Manrope,sans-serif;line-height:1.2}.pagination{display:flex;gap:10px;margin-top:35px}.pagination a,.pagination span{padding:10px 14px;border:1px solid #d5c9ba}.project-featured{width:100%;height:230px;object-fit:cover;display:block}.empty-note{padding:25px;border:1px dashed #9d8a76;color:#625c55}.wp-block-image img{height:auto}.site-footer{background:#202020;color:#bdb7af;padding:25px 0;font-size:.8rem}.site-footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
@media(max-width:850px){.blog-grid,.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.blog-section{padding:82px 0}.blog-grid,.archive-grid{grid-template-columns:1fr}.blog-thumb{height:200px}.archive-wrap{padding-top:100px}}

/* Inner pages use a dark navigation background so links stay readable on the cream canvas. */
.blog .nav,.single-post .nav,.post-type-archive-portfolio_project .nav,.single-portfolio_project .nav{background:rgba(32,32,32,.96);backdrop-filter:blur(12px);border-bottom:1px solid #ffffff17}
.blog .nav-links,.single-post .nav-links,.post-type-archive-portfolio_project .nav-links,.single-portfolio_project .nav-links{color:#f5f0e8}
.project-single-image{width:100%;margin:26px auto 34px;overflow:hidden;background:#e8ded2;border-radius:4px}
.project-single-featured{display:block;width:100%;max-width:100%;height:auto;max-height:68vh;object-fit:contain;object-position:center;margin:0 auto}
.single-portfolio_project .post-content{min-width:0}
.single-portfolio_project .post-content h1{overflow-wrap:anywhere}
@media(max-width:560px){.project-single-image{margin:22px auto 28px;border-radius:3px}.project-single-featured{max-height:62vh;width:100%;height:auto;object-fit:contain}.single-portfolio_project .post-content{padding-top:112px;padding-left:17px;padding-right:17px}.single-portfolio_project .post-content h1{font-size:clamp(2.1rem,9vw,3rem);line-height:1.05}.site-footer .wrap{flex-direction:column;gap:8px}.site-footer{padding:22px 0}}

/* v1.0.3 hard override: keep inner-page navigation readable on every scroll state. */
body.blog header.nav,body.archive header.nav,body.single-post header.nav,body.post-type-archive-portfolio_project header.nav,body.single-portfolio_project header.nav{background:#202020!important;color:#f5f0e8!important;border-bottom:1px solid #ffffff20!important;backdrop-filter:blur(12px)}
body.blog header.nav .nav-links,body.archive header.nav .nav-links,body.single-post header.nav .nav-links,body.post-type-archive-portfolio_project header.nav .nav-links,body.single-portfolio_project header.nav .nav-links{color:#f5f0e8!important}
body.blog header.nav .nav-links a,body.archive header.nav .nav-links a,body.single-post header.nav .nav-links a,body.post-type-archive-portfolio_project header.nav .nav-links a,body.single-portfolio_project header.nav .nav-links a{color:#f5f0e8!important}
body.blog header.nav .brand,body.archive header.nav .brand,body.single-post header.nav .brand,body.post-type-archive-portfolio_project header.nav .brand,body.single-portfolio_project header.nav .brand{color:#fff!important}
/* A fixed image frame with contain ensures the complete project screenshot is visible. */
.project-single-image{width:100%;height:520px;display:flex;align-items:center;justify-content:center;margin:26px auto 34px;overflow:hidden;background:#e8ded2;border-radius:4px}
.project-single-featured{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;margin:0 auto}
@media(max-width:760px){.project-single-image{height:360px;margin:22px auto 28px}.project-single-featured{width:100%;height:100%;object-fit:contain}}
@media(max-width:420px){.project-single-image{height:300px}}


/* v1.0.4: consistent featured image sizing on blog articles and responsive cards */
.single-post .entry-featured{width:100%;height:clamp(220px,48vw,480px);margin:26px auto 34px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#e8ded2;border-radius:4px}
.single-post .single-post-featured-image{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;margin:0 auto}
.blog .blog-thumb,.archive .blog-thumb{height:230px;display:flex;align-items:center;justify-content:center;background:#e8ded2}
.blog .blog-thumb img,.archive .blog-thumb img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
@media(max-width:560px){.single-post .post-content{padding:108px 17px 65px}.single-post .post-content h1{font-size:clamp(2rem,8.5vw,2.8rem);line-height:1.08}.single-post .entry-featured{height:300px;margin:20px auto 26px}.blog .blog-thumb,.archive .blog-thumb{height:220px}.quick-contact{right:14px;bottom:18px;gap:10px}.quick-contact a{width:50px;height:50px}}


/* v1.0.5: fill project archive cards with the image without changing the navigation. */
body.post-type-archive-portfolio_project .blog-thumb{height:260px}
body.post-type-archive-portfolio_project .blog-thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
@media(max-width:560px){body.post-type-archive-portfolio_project .blog-thumb{height:230px}}


/* v1.0.6: remove mobile menu button shadow and make blog/project images fill their frames consistently. */
@media(max-width:760px){
  .menu-toggle{box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .menu-close{box-shadow:none!important}
  .nav-links{box-shadow:none!important}
}
/* Blog and project archive cards: fill the complete image area with no side gutters. */
.blog .blog-thumb,.archive .blog-thumb,body.post-type-archive-portfolio_project .blog-thumb{height:clamp(230px,26vw,340px);display:block;overflow:hidden;background:#e8ded2}
.blog .blog-thumb img,.archive .blog-thumb img,body.post-type-archive-portfolio_project .blog-thumb img{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center}
/* Single project and single blog pages: preserve the full original featured image. */
.single-portfolio_project .project-single-image,.single-post .entry-featured{width:100%;height:auto;display:block;overflow:visible;margin:26px auto 34px;background:transparent;border-radius:4px}
.single-portfolio_project .project-single-featured,.single-post .single-post-featured-image{display:block;width:100%;height:auto;max-width:100%;max-height:none;object-fit:contain;object-position:center;margin:0 auto;border-radius:4px}
@media(max-width:760px){
  .single-portfolio_project .project-single-image,.single-post .entry-featured{height:auto;margin:22px auto 28px}
  .single-portfolio_project .project-single-featured,.single-post .single-post-featured-image{width:100%;height:auto;object-fit:contain}
}


/* Footer back-to-top link */
.back-to-top{color:inherit;text-decoration:none;font-size:.9rem;white-space:nowrap;transition:opacity .2s ease}.back-to-top:hover{opacity:.7;text-decoration:underline}
@media(max-width:560px){.back-to-top{margin-top:8px}}

/* Back-to-top interaction */
.back-to-top{cursor:pointer}.back-to-top:focus-visible{outline:2px solid #ed986f;outline-offset:4px}


/* v1.0.9: responsive Latest Blog carousel; advances one card per click. */
.blog-slider{position:relative}
.blog-slider-controls{display:flex;justify-content:flex-end;gap:10px;margin:0 0 18px}
.blog-slider-arrow{width:44px;height:44px;border:1px solid #c9b9a8;border-radius:50%;background:transparent;color:#24211f;font:inherit;font-size:1.25rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease}
.blog-slider-arrow:hover:not(:disabled){background:#24211f;color:#fff;border-color:#24211f}
.blog-slider-arrow:disabled{opacity:.35;cursor:not-allowed}
.blog-slider-arrow:focus-visible{outline:2px solid #b34d25;outline-offset:3px}
.blog-slider-viewport{overflow:hidden;width:100%}
.blog-slider-track{display:flex!important;gap:18px;transition:transform .38s ease;will-change:transform}
.blog-slider-track>.blog-card{display:block;flex:0 0 calc((100% - 36px)/3);width:calc((100% - 36px)/3);min-width:0;box-sizing:border-box}
.blog-slider-track>.empty-note{flex:1 0 100%}
@media(max-width:850px){.blog-slider-track>.blog-card{flex-basis:calc((100% - 18px)/2);width:calc((100% - 18px)/2)}}
@media(max-width:560px){.blog-slider-controls{margin-bottom:14px}.blog-slider-arrow{width:40px;height:40px}.blog-slider-track>.blog-card{flex-basis:100%;width:100%}.blog-slider-track{gap:14px}}
@media(prefers-reduced-motion:reduce){.blog-slider-track{transition:none}}

/* Project card refinements: preserve full image and use internal project links. */
.project-art{height:auto;aspect-ratio: 3 / 2;}
.project-art .project-featured{display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center;background:#322a25;position:relative;z-index:1}
.project-art:after{pointer-events:none}
.project-number{overflow-wrap:anywhere}
.project-archive-wrap .project-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.archive-project-card{background:#fff;border:1px solid #e5d9cc;color:var(--ink);min-width:0;display:flex;flex-direction:column}
.archive-project-card:hover{border-color:#c65d3280}
.archive-project-art{aspect-ratio:3/2;height:auto;background:#e8ded2}
.archive-project-art .project-featured{background:#e8ded2}
.archive-project-art:after{display:none}
.archive-project-content{padding:24px;display:flex;flex-direction:column;flex:1}
.archive-project-content h3{font:700 1.3rem "Manrope",sans-serif;letter-spacing:-.04em;margin:10px 0;color:var(--ink)}
.archive-project-content h3 a{color:inherit}
.archive-project-content p{color:#625c55;font-size:.9rem;min-height:88px;margin:0}
.archive-project-content .project-tags span{color:#514940;border-color:#d9cfc4}
.archive-project-content .project-link{color:var(--orange);border-color:#c65d3266;align-self:flex-start}
.archive-project-content .project-link:hover{color:#8d3e20;border-color:#8d3e20}
.archive-project-image-link{display:block}
@media(max-width:900px){.project-archive-wrap .project-archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.project-archive-wrap .project-archive-grid{grid-template-columns:1fr}.archive-project-content p{min-height:0}.archive-project-art{aspect-ratio:3/2}}

/* Homepage project slider: mirrors the Latest Blog slider behaviour. */
.project-slider{position:relative}
.project-slider .project-slider-track{display:flex!important;gap:18px;transition:transform .38s ease;will-change:transform;grid-template-columns:none}
.project-slider-track>.project-card{display:flex;flex:0 0 calc((100% - 36px)/3);width:calc((100% - 36px)/3);min-width:0;box-sizing:border-box;flex-direction:column}
.project-slider-track>.project-card:last-child{grid-column:auto}
.project-slider-track>.empty-note{flex:1 0 100%}
.project-slider .project-content{flex:1;display:flex;flex-direction:column;align-items:flex-start}
.project-slider .project-content p{min-height:88px}
.project-slider .project-link{margin-top:auto;padding-top:22px}
@media(max-width:850px){.project-slider-track>.project-card{flex-basis:calc((100% - 18px)/2);width:calc((100% - 18px)/2)}}
@media(max-width:560px){.project-slider-track>.project-card{flex-basis:100%;width:100%}.project-slider .project-content p{min-height:0}.project-slider .project-slider-track{gap:14px}}
@media(prefers-reduced-motion:reduce){.project-slider .project-slider-track{transition:none}}


/* v1.1.5: stronger slider arrow contrast on dark and light sections. */
.blog-slider-arrow{position:relative;z-index:2;color:#f5eee5;background:#292725;border:1px solid #bda995;box-shadow:0 2px 8px rgba(0,0,0,.18);font-size:1.6rem;font-weight:700;text-shadow:none;opacity:1}
.blog-slider-arrow:hover:not(:disabled){background:#c85b32;color:#fff;border-color:#c85b32}
.blog-slider-arrow:disabled{opacity:.72;color:#f5eee5;border-color:#9d8e80}
.blog-slider-arrow:focus-visible{outline:2px solid #f5eee5;outline-offset:3px}

/* Custom 404 page */
.error-404-page{min-height:78vh;background:var(--cream);padding-top:82px;display:flex;align-items:stretch}
.error-404-section{width:100%;display:flex;align-items:center;padding:76px 0 90px;position:relative;overflow:hidden}
.error-404-inner{max-width:900px;position:relative;z-index:1}
.error-404-number{font:800 clamp(6rem,19vw,13rem)/.82 "Manrope",sans-serif;letter-spacing:-.09em;color:var(--orange);margin:25px 0 30px}
.error-404-inner h1{font:800 clamp(2.3rem,5.5vw,4.8rem)/1.05 "Manrope",sans-serif;letter-spacing:-.065em;color:var(--charcoal);max-width:800px;margin:0 0 20px}
.error-404-copy{max-width:620px;color:#625c55;font-size:1.08rem;line-height:1.8;margin:0 0 30px}
.error-404-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.error-404-secondary{border-color:var(--orange);color:var(--orange);background:transparent}
.error-404-secondary:hover{background:#c65d3210}
.error-404-blog-link{font-weight:700;color:var(--charcoal);padding:12px 8px;text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:5px}
@media(max-width:600px){.error-404-page{padding-top:70px}.error-404-section{padding:58px 0 68px}.error-404-number{margin:22px 0 25px}.error-404-actions{align-items:stretch;flex-direction:column}.error-404-actions .btn{width:100%}.error-404-blog-link{text-align:center}}


/* v1.1.7: match the 404 header to the readable dark header used on the Blog page. */
body.error404 header.nav{background:#202020!important;color:#f5f0e8!important;border-bottom:1px solid #ffffff20!important;backdrop-filter:blur(12px)}
body.error404 header.nav .nav-links,body.error404 header.nav .nav-links a{color:#f5f0e8!important}
body.error404 header.nav .brand{color:#fff!important}
