/* ADAYA – Creativity in a Glass */
:root{
  --paper:#F7F4EF; --paper-2:#EAE5DC; --ink:#17150F; --ink-2:#2A2720; --text:#3A362E; --soft:#4A463D; --muted:#7A7466;
  --copper:#9A6A34; --night:#1C1B18; --rule:rgba(23,21,15,.14); --rule-2:rgba(23,21,15,.18);
  --pad:clamp(20px,5vw,72px);
  --display:'Archivo',sans-serif; --body:'Noto Sans Hebrew',sans-serif; --mono:'Noto Sans Mono',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--ink);color:var(--paper)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
@keyframes riseIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* language */
[data-en]{display:none!important}
html[lang="en"] [data-he]{display:none!important}
html[lang="en"] [data-en]{display:revert!important}
html[lang="en"] body{font-family:var(--display);font-stretch:100%}

/* type helpers */
.display{font-family:var(--display);font-stretch:125%;font-weight:200;text-transform:uppercase}
.mono{font-family:var(--mono);text-transform:uppercase;letter-spacing:.28em;font-size:10.5px}
.copper{color:var(--copper)}
.ltr{direction:ltr;unicode-bidi:isolate}

/* nav */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px var(--pad);background:rgba(247,244,239,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--rule)}
.brand img{height:34px;width:auto}
.links{display:flex;align-items:center;gap:clamp(14px,2.4vw,38px);font-size:14px}
.links a{color:var(--soft);padding-bottom:2px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.links a:hover{color:var(--ink)}
.links a.on{color:var(--ink);border-color:var(--ink)}
.lang{font:500 11px var(--mono);letter-spacing:.2em;background:none;border:1px solid var(--rule-2);color:var(--ink);padding:7px 11px;cursor:pointer;transition:.2s}
.lang:hover{background:var(--ink);color:var(--paper)}

.meta{display:flex;justify-content:space-between;padding:14px var(--pad) 0;color:var(--copper)}

/* hero */
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,72px);align-items:end;padding:clamp(36px,7vw,90px) var(--pad) clamp(48px,8vw,110px)}
.hero>div{animation:riseIn .9s cubic-bezier(.2,.7,.2,1) both}
.hero h1{line-height:.92;letter-spacing:.01em;font-size:clamp(3rem,8.6vw,7.6rem)}
.lead{max-width:46ch;margin-top:30px;font-size:clamp(15px,1.5vw,18px);font-weight:300;line-height:1.85;color:var(--text)}
.btns{display:flex;gap:14px;margin-top:38px;flex-wrap:wrap}
.btn{padding:14px 30px;font-size:14px;letter-spacing:.04em;border:1px solid rgba(23,21,15,.28);transition:.2s}
.btn:hover{border-color:var(--ink)}
.btn.solid{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.solid:hover{background:var(--copper);border-color:var(--copper)}
.hero figure{position:relative;aspect-ratio:3/4;background:var(--night);overflow:hidden;animation:riseIn 1.1s cubic-bezier(.2,.7,.2,1) both}
.hero figure img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.hero figcaption{position:absolute;left:16px;bottom:14px;color:rgba(247,244,239,.85);letter-spacing:.24em;font-size:10px}

/* stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(247,244,239,.12);color:var(--paper)}
.stats>div{background:var(--night);padding:clamp(28px,4vw,52px) clamp(20px,4vw,48px)}
.stats b{display:block;font-family:var(--display);font-stretch:125%;font-weight:200;font-size:clamp(2.4rem,5vw,4rem);line-height:1;direction:ltr;text-align:start}
.stats span{display:block;margin-top:10px;font-size:13px;color:rgba(247,244,239,.6)}
html[lang="en"] .stats [data-en]{display:block!important}

/* about */
.about{padding:clamp(40px,7vw,90px) var(--pad) clamp(56px,9vw,120px);display:grid;grid-template-columns:.42fr .58fr;gap:clamp(28px,5vw,80px)}
.about h2,.sec-title{line-height:.95;font-size:clamp(1.9rem,3.6vw,3.1rem)}
.about .body{font-size:clamp(15px,1.5vw,18px);font-weight:300;line-height:1.95;color:var(--text);max-width:60ch}
.about .body p+p{margin-top:22px}
.about figure{margin-top:32px;max-width:300px;aspect-ratio:4/5;overflow:hidden}
.about figure img{width:100%;height:100%;object-fit:cover}
strong{font-weight:500;color:var(--ink)}

/* services */
.services{padding:clamp(56px,9vw,120px) var(--pad) clamp(40px,7vw,90px)}
.services .head{border-top:1px solid var(--ink);padding-top:22px;display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.services .head h2{font-weight:300;font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:.02em}
.svc{display:grid;grid-template-columns:.34fr .66fr;gap:clamp(20px,4vw,64px);padding:clamp(30px,4vw,54px) 0;border-top:1px solid var(--rule)}
.svc:last-child{border-bottom:1px solid var(--rule)}
.svc .num{font:12px var(--mono);color:var(--copper);margin-bottom:14px}
.svc h3{line-height:.98;font-size:clamp(1.6rem,3vw,2.6rem)}
.svc .sub{margin-top:12px;font-size:13.5px;color:var(--muted)}
.svc .intro{font-size:16px;font-weight:300;line-height:1.85;color:var(--text);max-width:52ch;margin-bottom:22px}
.svc ul{list-style:none}
.svc li{border-top:1px solid var(--rule);padding:12px 0;font-size:15px;font-weight:300;color:var(--ink-2);transition:color .2s}
.svc li:hover{color:var(--copper)}

/* contact */
.contact{background:var(--night);color:var(--paper);padding:clamp(64px,10vw,150px) var(--pad)}
.contact h2{line-height:.9;font-size:clamp(3.2rem,12vw,10rem)}
.contact .lead{color:rgba(247,244,239,.7);max-width:44ch}
.channels{display:flex;flex-wrap:wrap;gap:clamp(20px,4vw,64px);margin-top:44px}
.channels a{display:flex;flex-direction:column;gap:6px}
.channels small{color:rgba(247,244,239,.45);letter-spacing:.24em;font-size:10px}
.channels span{font-size:clamp(16px,2vw,22px);direction:ltr;unicode-bidi:isolate;transition:color .2s}
.channels a:hover span{color:var(--copper)}

footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:22px var(--pad);background:var(--night);color:rgba(247,244,239,.5);border-top:1px solid rgba(247,244,239,.12);direction:ltr}
footer img{height:22px;width:auto;filter:invert(1);opacity:.75}
footer a:hover{color:var(--copper)}

/* page header (projects / brands) */
.page-head{padding:clamp(36px,7vw,84px) var(--pad) clamp(30px,4vw,54px);display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;animation:riseIn .8s cubic-bezier(.2,.7,.2,1) both}
.page-head h1{line-height:.9;font-size:clamp(3rem,10vw,8rem)}
.page-head p{max-width:34ch;font-size:clamp(14px,1.4vw,16px);font-weight:300;line-height:1.8;color:var(--soft);padding-bottom:10px}

/* projects */
.proj-wrap{padding:clamp(40px,7vw,90px) var(--pad) clamp(60px,9vw,120px)}
.proj-wrap .head{border-top:1px solid var(--ink);padding-top:22px;display:flex;justify-content:space-between;align-items:baseline;margin-bottom:clamp(24px,3vw,40px)}
.proj-wrap .head h2{font-weight:300;font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:.02em}
section[id],header[id]{scroll-margin-top:72px}
.projects{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,1fr));gap:clamp(20px,2.6vw,38px)}
.projects .ph{aspect-ratio:4/5;background:var(--paper-2);overflow:hidden}
.projects .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.projects article:hover .ph img{transform:scale(1.03)}
.projects .tag{display:flex;justify-content:space-between;margin-top:14px;color:var(--copper);letter-spacing:.22em;font-size:10px;direction:ltr}
.projects h3{margin-top:8px;font-size:20px;font-weight:500}
.projects p{margin-top:6px;font-size:14px;font-weight:300;line-height:1.7;color:var(--soft)}

/* brands */
.houses{padding:0 var(--pad) clamp(30px,4vw,48px)}
.houses>div{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:baseline;border-top:1px solid var(--ink);padding-top:18px;direction:ltr}
.houses span{font-size:15px;color:var(--text)}
.houses i{font-style:normal;color:#B9B2A6}
.brands{padding:0 var(--pad) clamp(64px,9vw,120px)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(160px,20vw,240px),1fr));border-top:1px solid var(--rule-2);border-inline-start:1px solid var(--rule-2)}
.grid a{display:flex;flex-direction:column;justify-content:space-between;min-height:190px;padding:24px;border-inline-end:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2);transition:background .25s,color .25s;direction:ltr}
.grid a:hover{background:var(--ink);color:var(--paper)}
.grid small{color:var(--copper);letter-spacing:.22em;font-size:9.5px}
.grid b{font-family:var(--display);font-stretch:112%;font-weight:300;text-transform:uppercase;font-size:clamp(1.2rem,2vw,1.7rem);line-height:1}
.note{margin-top:22px;font-size:13px;font-weight:300;color:var(--muted);max-width:60ch}

/* mobile */
@media (max-width:820px){
  .hero,.about,.svc,.page-head{grid-template-columns:1fr}
  .hero figure{max-width:440px;order:-1}
  .stats{grid-template-columns:1fr}
  .links{gap:14px;font-size:13px}
}
@media (max-width:560px){
  .links a:not(.on):not(.keep){display:none}
  .brand img{height:28px}
}
.lead p+p{margin-top:14px}

/* project categories */
.cat{display:grid;grid-template-columns:.34fr .66fr;gap:clamp(20px,4vw,64px);padding:clamp(30px,4vw,54px) 0;border-top:1px solid var(--rule)}
.cat:last-child{border-bottom:1px solid var(--rule)}
.cat h3{line-height:.98;font-size:clamp(1.6rem,3vw,2.6rem)}
.cat .sub{margin-top:12px;font-size:13.5px;color:var(--muted)}
.cat figure{margin-top:24px;aspect-ratio:4/5;max-width:260px;overflow:hidden;background:var(--paper-2)}
.cat figure img{width:100%;height:100%;object-fit:cover}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));border-top:1px solid var(--rule-2);border-inline-start:1px solid var(--rule-2);align-self:start}
.tile{display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-height:118px;padding:18px;border-inline-end:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2);transition:background .25s,color .25s}
.tile:hover{background:var(--ink);color:var(--paper)}
.tile small{color:var(--copper);letter-spacing:.22em;font-size:9.5px;direction:ltr;text-align:start}
.tile b{font-family:var(--display),var(--body);font-stretch:112%;font-weight:300;text-transform:uppercase;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.2}
html[lang="he"] .tile b:not(.ltr){font-family:var(--body);font-weight:400}
.more{grid-column:2;margin-top:14px;font-size:14px;color:var(--muted)}
@media (max-width:820px){.cat{grid-template-columns:1fr}.cat figure{max-width:none;aspect-ratio:16/9}.more{grid-column:1}}

/* photo strip */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(8px,1.2vw,16px);margin:18px 0 clamp(24px,3vw,40px)}
.gallery img{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--paper-2)}
@media (max-width:820px){.gallery{grid-template-columns:repeat(2,1fr)}}

/* service photos */
.svc figure{margin-top:24px;aspect-ratio:4/5;max-width:260px;overflow:hidden;background:var(--paper-2)}
.svc figure img{width:100%;height:100%;object-fit:cover}
@media (max-width:820px){.svc figure{max-width:none;aspect-ratio:16/9}}
.svc-photo{margin:18px 0 8px;aspect-ratio:21/9;overflow:hidden;background:var(--paper-2)}
.svc-photo img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
@media (max-width:820px){.svc-photo{aspect-ratio:4/3}.svc-photo img{object-position:20% center}}

/* projects collage */
.collage{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(120px,16vw,230px);gap:clamp(6px,1vw,14px);margin:18px 0 clamp(28px,4vw,48px);
  grid-template-areas:"a b c d" "a e e f" "a e e f"}
.collage img{width:100%;height:100%;object-fit:cover;background:var(--paper-2)}
.c-a{grid-area:a}.c-b{grid-area:b}.c-c{grid-area:c}.c-d{grid-area:d}.c-e{grid-area:e}.c-f{grid-area:f}.c-g{grid-area:g}.c-h{grid-area:h}
@media (max-width:820px){.collage{grid-template-columns:repeat(2,1fr);grid-auto-rows:42vw;grid-template-areas:"a b" "a c" "e e" "d f"}}
