/*
Theme Name: Axsara Concept Studio
Author: Axsara Concept
Description: Custom bilingual Axsara architecture theme.
Version: 1.0.0
Text Domain: axsara-concept
*/

:root{
  --ink:#121212;
  --paper:#f3f1ec;
  --muted:#8b8780;
  --body:#4a4844;
  --line:rgba(18,18,18,.14);
  --error:#a3392f;
  --sans:'Inter Tight',system-ui,-apple-system,sans-serif;
  --serif:'Instrument Serif',Georgia,serif;
  --pad:clamp(20px,3.2vw,48px);
  --ease:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html.lenis,html.lenis body{height:auto}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
body.is-loading{overflow:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
::selection{background:var(--ink);color:var(--paper)}

.label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.kicker{display:flex;align-items:baseline;gap:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:40px}
.num{font-family:var(--serif);font-style:italic;font-size:22px;letter-spacing:0;text-transform:none;color:var(--ink)}

/* ---------- Loader ---------- */
.loader{position:fixed;inset:0;z-index:100;background:var(--ink);color:var(--paper);display:flex;align-items:flex-end;justify-content:space-between;padding:var(--pad);transition:transform 1.2s var(--ease)}
.loader-word{font-family:var(--serif);font-size:clamp(48px,9vw,140px);line-height:.88;letter-spacing:-.02em}
.loader-count{font-size:12px;letter-spacing:.2em;font-variant-numeric:tabular-nums}
body.is-loaded .loader{transform:translateY(-100%)}

/* ---------- Header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:22px var(--pad);color:#fff;mix-blend-mode:difference;transition:transform .7s var(--ease)}
.site-header.is-hidden{transform:translateY(-120%)}
.brand img{height:32px;width:auto;filter:invert(1)}
.brand-wordmark{display:inline-flex;align-items:baseline;gap:8px;font-size:19px;font-weight:500;letter-spacing:.13em;line-height:1}
.brand-wordmark span{font-size:9px;letter-spacing:.18em;font-weight:400}
.nav{display:flex;gap:30px;font-size:13px}
.nav a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding-bottom:2px;transition:background-size .5s var(--ease)}
.nav a:hover{background-size:100% 1px}

/* ---------- Line reveal ---------- */
.line{display:block;overflow:hidden;padding-bottom:.04em}
.line>span{display:block;transform:translateY(110%);transition:transform 1.4s var(--ease)}
.reveal-lines.in .line>span,
body.is-loaded .hero .line>span{transform:none}
.line:nth-child(2)>span{transition-delay:.08s}
.line:nth-child(3)>span{transition-delay:.16s}
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease)}
.reveal.in{opacity:1;transform:none}
.clip-reveal{clip-path:inset(100% 0 0 0);transition:clip-path 1.6s var(--ease)}
.clip-reveal.in{clip-path:inset(0 0 0 0)}

/* ---------- Hero ---------- */
.hero{position:relative;height:100svh;min-height:620px;overflow:hidden;color:#fff;background:#1a1a1a}
.hero-media{position:absolute;inset:0;overflow:hidden;transform:scale(1.18);transition:transform 2.6s var(--ease)}
body.is-loaded .hero-media{transform:scale(1)}
.hero-media img{will-change:transform;object-position:center 54%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0) 55%,rgba(0,0,0,.5) 100%)}
.hero-title{position:absolute;left:var(--pad);bottom:calc(var(--pad) - .1em);font-weight:300;font-size:clamp(60px,11vw,180px);line-height:.86;letter-spacing:-.05em;will-change:transform}
.hero-title .line:nth-child(2)>span{transition-delay:.12s}
.hero-meta{position:absolute;right:var(--pad);bottom:var(--pad);text-align:right;font-size:12px;letter-spacing:.08em;opacity:.9}
.hero-meta .line>span{transition-delay:.3s}

/* ---------- Intro ---------- */
.intro{padding:clamp(130px,18vw,250px) var(--pad) clamp(110px,14vw,200px);text-align:center}
.display{font-weight:400;font-size:clamp(46px,7.6vw,128px);line-height:.94;letter-spacing:-.045em}
.intro-cols{display:grid;grid-template-columns:repeat(2,minmax(0,290px));justify-content:center;gap:40px;margin-top:52px;text-align:left;font-size:13px;color:var(--muted)}

/* ---------- Band ---------- */
.band{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;padding:0 var(--pad)}
.band-side{grid-column:1/4;align-self:end;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--body);padding-bottom:40px}
.band-wrap{grid-column:4/13}
.band-media{position:relative;height:clamp(420px,86vh,940px);overflow:hidden}
[data-parallax]{position:absolute;left:0;top:-10%;height:120%;will-change:transform}
.caption{display:flex;justify-content:space-between;padding-top:12px;font-size:11px;letter-spacing:.08em;color:var(--muted)}

/* Persistent visibility for key architectural photographs. */
.band-media > img,
.about-media > img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:1;
  visibility:visible;
  clip-path:none;
}
.band-media > img { object-position:center center; }
.about-media > img { object-position:center center; }

/* ---------- Sections ---------- */
.section{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;padding:clamp(110px,14vw,200px) var(--pad)}
.meta{grid-column:1/4}
.meta-list div{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:12px}
.meta-list div:last-child{border-bottom:1px solid var(--line)}
.meta-list dt{color:var(--muted)}
.content{grid-column:5/13}
.serif-lead{font-family:var(--serif);font-weight:400;font-size:clamp(38px,4.6vw,72px);line-height:.98;letter-spacing:-.015em;margin-bottom:44px}
.lead{font-family:var(--serif);font-size:clamp(23px,2.3vw,34px);line-height:1.18;max-width:30ch}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:56px;max-width:760px;color:var(--body)}

/* ---------- Scrub statement ---------- */
.statement{padding:0 var(--pad) clamp(110px,14vw,200px)}
.scrub-text{font-family:var(--serif);font-size:clamp(36px,5.6vw,94px);line-height:1.02;letter-spacing:-.015em;text-indent:24%}
.scrub-text .w{opacity:.15;transition:opacity .5s ease}
.scrub-text .w.on{opacity:1}

/* ---------- About ---------- */
.about-media{grid-column:1/6;position:sticky;top:12vh;align-self:start;height:76vh;overflow:hidden}
.about-content{grid-column:7/13}
.pillars{list-style:none;margin-top:72px;border-top:1px solid var(--line)}
.pillars li{display:grid;grid-template-columns:44px 1fr 1.4fr;gap:16px;padding:24px 0;border-bottom:1px solid var(--line);font-size:14px;transition:padding .6s var(--ease)}
.pillars li:hover{padding-left:14px}
.pillars .i{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:17px}
.pillars .d{color:var(--body)}
.closing{margin-top:56px;color:var(--body);max-width:52ch}
.pursuit{margin-top:72px;padding-top:28px;border-top:1px solid var(--ink)}
.pursuit p{font-family:var(--serif);font-size:clamp(28px,3vw,44px);line-height:1.08;margin-top:18px}

/* ---------- Work (horizontal) ---------- */
.work{position:relative}
.work-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.work-head{display:flex;justify-content:space-between;align-items:flex-end;padding:0 var(--pad);margin-bottom:4vh}
.display-sm{font-weight:400;font-size:clamp(40px,5vw,84px);line-height:.95;letter-spacing:-.04em}
.work-track{display:flex;align-items:flex-end;gap:2.4vw;padding:0 var(--pad);width:max-content;will-change:transform}
.work-card{flex:none;width:clamp(260px,30vw,500px)}
.work-card.wide{width:clamp(320px,50vw,860px)}
.work-card .media{height:60vh;overflow:hidden}
.work-card img{transition:transform 1.4s var(--ease)}
.work-card img[src$="axsara-residential-concept-06.jpg"]{object-fit:contain;background:#111}
.work-card:hover img{transform:scale(1.045)}
.work-card figcaption{display:flex;justify-content:space-between;gap:16px;padding-top:14px;font-size:12px}
.work-card figcaption span:last-child{color:var(--muted)}
.work-end{width:clamp(280px,28vw,440px);height:60vh;display:flex;flex-direction:column;justify-content:space-between;padding:32px;border:1px solid var(--line)}
.work-end .serif-lead{margin:0;font-size:clamp(32px,3vw,48px)}
.link-arrow{display:inline-flex;gap:12px;font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.link-arrow span{transition:transform .5s var(--ease)}
.link-arrow:hover span{transform:translateX(6px)}
.work-progress{margin:5vh var(--pad) 0;height:1px;background:var(--line);overflow:hidden}
.work-progress span{display:block;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}

/* ---------- Vision ---------- */
.vision{background:var(--ink);color:var(--paper);padding:clamp(130px,16vw,230px) var(--pad) clamp(90px,10vw,140px)}
.vision .kicker{color:rgba(243,241,236,.5)}
.vision .num{color:var(--paper)}
.vision .scrub-text .w{opacity:.13}
.vision .scrub-text .w.on{opacity:1}
.marquee{background:var(--ink);color:var(--paper);overflow:hidden;padding:2vh 0 12vh}
.marquee-track{display:flex;width:max-content;font-weight:300;font-size:clamp(64px,11vw,190px);line-height:1.05;letter-spacing:-.04em;white-space:nowrap;will-change:transform}
.marquee-track>span{padding-right:.35em}
.marquee-track em{opacity:.5}

/* ---------- Enquiry ---------- */
.enquire{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;padding:clamp(120px,14vw,200px) var(--pad)}
.enquire-head{grid-column:1/6}
.enquire-intro{margin-top:40px;max-width:40ch;color:var(--body)}
.enquire-form{grid-column:7/13}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 36px}
.field{position:relative;padding-top:20px}
.field.full,.chips,.consent{grid-column:1/-1}
.field input,.field select,.field textarea{width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;font:inherit;font-size:16px;color:var(--ink);padding:12px 0;outline:none;appearance:none;-webkit-appearance:none}
.field textarea{resize:vertical;min-height:130px;display:block}
.field select{cursor:pointer;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23121212'/%3E%3C/svg%3E") no-repeat right 4px center}
.field>label{position:absolute;left:0;top:32px;font-size:15px;color:var(--muted);pointer-events:none;transition:all .4s var(--ease)}
.field input:focus+label,.field input:not(:placeholder-shown)+label,
.field textarea:focus+label,.field textarea:not(:placeholder-shown)+label,
.field.static>label{top:0;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.field::after{content:'';position:absolute;left:0;right:0;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.field::after{top:calc(100% - 1px)}
.field:has(.error-msg)::after{top:auto;bottom:0}
.field:focus-within::after{transform:scaleX(1)}
.error-msg{display:block;max-height:0;overflow:hidden;font-size:11px;color:var(--error);transition:max-height .3s ease}
.has-error .error-msg{max-height:30px;padding-top:6px}
.has-error input,.has-error textarea{border-bottom-color:var(--error)}

.chips{border:0;padding-top:32px}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-block;padding:9px 18px;border:1px solid var(--line);border-radius:999px;font-size:13px;transition:all .35s var(--ease)}
.chip:hover span{border-color:var(--ink)}
.chip input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}

.consent{padding-top:28px}
.check{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:var(--body);cursor:pointer}
.check input{position:absolute;opacity:0}
.box{flex:none;width:16px;height:16px;margin-top:2px;border:1px solid var(--ink);position:relative;transition:background .3s}
.check input:checked+.box{background:var(--ink)}
.check input:checked+.box::after{content:'';position:absolute;left:4px;top:1px;width:5px;height:9px;border:solid var(--paper);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.check input:focus-visible+.box{outline:2px solid var(--ink);outline-offset:2px}

.btn{margin-top:48px;display:inline-flex;align-items:center;gap:16px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);border-radius:999px;padding:20px 32px;font:inherit;font-size:12px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background .4s var(--ease),color .4s var(--ease)}
.btn:hover{background:transparent;color:var(--ink)}
.btn .arrow{transition:transform .5s var(--ease)}
.btn:hover .arrow{transform:translateX(6px)}
.btn:disabled{opacity:.5;pointer-events:none}
.form-success{display:none}
.is-sent .form-body{display:none}
.is-sent .form-success{display:block;animation:fadeUp 1s var(--ease)}
.form-success h3{font-family:var(--serif);font-weight:400;font-size:clamp(36px,4vw,60px);line-height:1;margin:20px 0 18px}
.form-success p{color:var(--body);max-width:42ch}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* ---------- Footer ---------- */
.footer{padding:90px var(--pad) 28px;border-top:1px solid var(--line);overflow:hidden}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px;font-size:13px}
.footer-grid p{max-width:34ch;color:var(--body)}
.footer-grid ul{list-style:none;display:flex;flex-direction:column;gap:6px;margin-top:14px}
.footer-grid a:hover{opacity:.55}
.footer-word{font-family:var(--serif);font-size:23vw;line-height:.78;letter-spacing:-.03em;text-align:center;margin:90px 0 24px;white-space:nowrap}
.footer-bottom{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.08em;color:var(--muted)}
.to-top{background:none;border:0;font:inherit;color:inherit;letter-spacing:inherit;cursor:pointer}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .nav a:not(.nav-cta){display:none}
  .brand img{height:26px}
  .brand-wordmark{font-size:15px}
  .brand-wordmark span{font-size:8px}
  .intro-cols{grid-template-columns:1fr;gap:12px}
  .band-side{display:none}
  .band-wrap,.meta,.content,.about-media,.about-content,.enquire-head,.enquire-form{grid-column:1/-1}
  .meta{margin-bottom:40px}
  .about-media{position:relative;top:0;height:auto;aspect-ratio:4/5;margin-bottom:56px}
  .two-col,.form-grid{grid-template-columns:1fr}
  .scrub-text{text-indent:0}
  .pillars li{grid-template-columns:36px 1fr}
  .pillars .d{grid-column:2}
  .work-sticky{position:relative;height:auto;padding:110px 0}
  .work-track{flex-direction:column;align-items:stretch;width:auto;transform:none!important;gap:48px}
  .work-card,.work-card.wide,.work-end{width:100%}
  .work-card .media{height:auto;aspect-ratio:4/5}
  .work-card.wide .media{aspect-ratio:1/1}
  .work-end{height:auto;gap:40px}
  .work-progress,.work-hint{display:none}
  .enquire-form{margin-top:56px}
  .footer-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .reveal,.line>span,.clip-reveal,.hero-media{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
}

/* SEO additions preserve the existing Axsara visual system. */
.language-nav{display:flex;gap:12px;align-items:center;border-left:1px solid currentColor;padding-left:20px;font-size:11px;letter-spacing:.08em}
.language-nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:4px}
.hero-seo{position:absolute;left:var(--pad);bottom:clamp(115px,14vw,210px);z-index:1;max-width:600px;font-size:clamp(12px,1.1vw,15px);line-height:1.5;opacity:.95}
.services-section{padding:clamp(90px,10vw,150px) var(--pad);border-top:1px solid var(--line)}
.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:50px}
.service-card{padding:30px 0;border-top:1px solid var(--line)}
.service-card h3{font-family:var(--serif);font-size:clamp(26px,3vw,42px);font-weight:400;line-height:1.08;margin-bottom:20px}
.service-card p{font-size:14px;color:var(--body);max-width:45ch}
.form-notice{font-size:13px;color:var(--error);margin-top:15px;min-height:1.3em}
.form-anti-spam{position:absolute;left:-99999px;height:1px;width:1px;overflow:hidden}
.turnstile-wrap{grid-column:1/-1;margin-top:24px}
@media(max-width:900px){.language-nav{padding-left:10px;gap:8px}.services-grid{grid-template-columns:1fr}.hero-seo{bottom:160px;max-width:310px}.nav{gap:12px}}

/* Updated responsive branding / mobile navigation / footer */
.site-header{gap:24px}
.brand{display:flex;align-items:center;min-width:0;flex-shrink:0}
.brand img{display:block;width:clamp(150px,16vw,225px);height:auto;max-width:100%;object-fit:contain;filter:none}
.header-controls{display:flex;align-items:center;gap:18px;margin-left:12px;flex-shrink:0}
.language-nav{border-left:1px solid rgba(255,255,255,.6);padding-left:16px;gap:13px;display:flex;align-items:center;font-size:12px;letter-spacing:.08em}
.language-nav a{padding:7px 1px;opacity:.74}
.language-nav a[aria-current="page"]{opacity:1;font-weight:600;text-decoration:underline;text-underline-offset:6px}
.menu-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;padding:9px;background:transparent;border:1px solid rgba(255,255,255,.55);border-radius:3px;cursor:pointer;color:#fff}
.menu-toggle span{display:block;height:1.5px;width:100%;background:currentColor;transition:transform .25s,opacity .25s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.footer-grid{grid-template-columns:minmax(240px,2fr) repeat(3,minmax(130px,1fr));gap:32px}
.footer-logo{width:min(260px,100%);height:auto;object-fit:contain;margin-bottom:22px}
.footer-column address{font-style:normal;line-height:1.8;margin-top:14px;color:var(--body)}
.footer-column a{overflow-wrap:anywhere}
@media(max-width:1100px){.nav{gap:16px}.brand img{width:clamp(145px,18vw,190px)}}
@media(max-width:900px){
  .site-header{mix-blend-mode:normal;background:transparent;backdrop-filter:none;padding:12px var(--pad);gap:10px;z-index:110;transform:none!important}
  .site-header.is-hidden{transform:none}
  .brand img{width:clamp(125px,40vw,185px);height:auto;filter:none}
  .header-controls{gap:12px;margin-left:auto}
  .language-nav{padding-left:0;border:0;gap:12px;font-size:12px}
  .language-nav a{display:inline-flex;min-height:40px;align-items:center;padding:6px 2px}
  .menu-toggle{display:flex;z-index:2}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(17,17,17,.35);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:20px var(--pad) 28px;flex-direction:column;gap:0;box-shadow:0 18px 30px rgba(0,0,0,.25);border-top:1px solid rgba(255,255,255,.15)}
  .nav.is-open{display:flex}
  .nav a,.nav a:not(.nav-cta){display:block;font-size:16px;color:#fff;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.14)}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
}
@media(max-width:520px){.footer-grid{grid-template-columns:1fr;gap:30px}.footer-logo{width:230px}}


/* Transparent mobile header + translucent readable expanded menu. */
@media(max-width:900px){
  .site-header .brand img{filter:drop-shadow(0 1px 3px rgba(0,0,0,.55))}
  .site-header .language-nav a,.site-header .menu-toggle{filter:drop-shadow(0 1px 3px rgba(0,0,0,.7))}
  .nav.is-open{box-shadow:0 16px 30px rgba(0,0,0,.12)}
}
/* Replace the oversized footer wordmark with the supplied black logo. */
.footer-word-logo{display:flex;align-items:center;justify-content:center;margin:90px 0 24px}
.footer-word-logo img{display:block;width:min(100%,1250px);height:auto;object-fit:contain}
@media(max-width:520px){.footer-word-logo{margin:56px 0 28px}}

/* WordPress content */
.ax-article{max-width:880px;margin:auto;padding:140px 24px 90px}.ax-article h1{font-size:clamp(42px,6vw,80px);line-height:1.05;font-weight:400;margin-bottom:32px}.ax-article h2{font-size:clamp(28px,3vw,44px);margin:32px 0 16px}.ax-article p,.ax-article li{font-size:17px;line-height:1.8;margin-bottom:20px}.ax-article img{height:auto;max-width:100%}.ax-article a{text-decoration:underline}.ax-list{max-width:1080px;margin:auto;padding:140px 24px 100px}.ax-list h1{font-size:clamp(46px,7vw,96px);font-weight:400}.ax-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;margin-top:50px}.ax-card img{height:260px;object-fit:cover}.ax-card h2{font-size:24px;font-weight:400;margin-top:16px}.ax-card p{color:var(--body)}.ax-intro-edit{padding:50px var(--pad);max-width:1100px;margin:auto}.ax-intro-edit p{font-size:19px}.nav-journal{white-space:nowrap}
