/* Akashic Chronicles — site stylesheet
   Palette sampled directly from the painting: deep indigo field,
   ember/crimson rays, ochre-gold flecks. Type: Fraunces (display,
   old-style warmth, not another Playfair/Cormorant) + Archivo (body,
   "archive" — apt for a chronicle) + Space Mono (catalog labels). */
:root{
  --field: #14163b;
  --field-2: #1f2264;
  --field-3: #262a72;
  --ink: #f3eee2;
  --ink-dim: #b6b2d6;
  --ink-faint: #837fa8;
  --ember: #c85a30;
  --ember-bright: #e2703f;
  --crimson: #7a2530;
  --gold: #d9a65c;
  --line: rgba(217,166,92,0.22);
  --line-strong: rgba(217,166,92,0.4);
  --max: 1180px;
  --display: "Fraunces", Georgia, serif;
  --body: "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --mono: "Space Mono", "Courier New", monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--field);
  color:var(--ink);
  font-family:var(--body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 30px;}
::selection{background:var(--ember);color:var(--field);}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}

/* ---------- signature mark: radiating burst, echoes the painting ---------- */
.burst{display:block;}
.burst line{stroke:var(--gold);stroke-width:1.4;stroke-linecap:round;opacity:0.85;}
.burst circle{fill:var(--ink);}
.burst.animate line{stroke-dasharray:40;stroke-dashoffset:40;animation:burst-draw 1.1s ease forwards;}
.burst.animate line:nth-child(1){animation-delay:.02s;}
.burst.animate line:nth-child(2){animation-delay:.08s;}
.burst.animate line:nth-child(3){animation-delay:.14s;}
.burst.animate line:nth-child(4){animation-delay:.2s;}
.burst.animate line:nth-child(5){animation-delay:.05s;}
.burst.animate line:nth-child(6){animation-delay:.11s;}
.burst.animate line:nth-child(7){animation-delay:.17s;}
.burst.animate line:nth-child(8){animation-delay:.23s;}
@keyframes burst-draw{to{stroke-dashoffset:0;}}
@media (prefers-reduced-motion: reduce){
  .burst.animate line{animation:none;stroke-dashoffset:0;}
}

.divider-mark{display:flex;align-items:center;gap:14px;margin:0 0 28px;}
.divider-mark .burst{width:26px;height:26px;flex:none;}
.divider-mark span{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);}
.center .divider-mark{justify-content:center;}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(20,22,59,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;}
.brand{font-family:var(--display);font-size:21px;letter-spacing:0.01em;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:10px;}
.brand .burst{width:22px;height:22px;}
.brand em{font-style:normal;color:var(--gold);}
.nav-links{display:flex;align-items:center;gap:34px;font-family:var(--mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;}
.nav-links a{opacity:0.75;transition:opacity .2s;white-space:nowrap;}
.nav-links a:hover, .nav-links a.active{opacity:1;color:var(--gold);}
.lang-switch{display:flex;gap:8px;font-family:var(--mono);font-size:11px;margin-left:6px;}
.lang-switch a{opacity:0.55;border:1px solid var(--line);padding:4px 9px;}
.lang-switch a.active{opacity:1;color:var(--gold);border-color:var(--gold);}
.nav-toggle{display:none;background:none;border:0;color:var(--ink);font-size:24px;cursor:pointer;}

@media (max-width:860px){
  .nav-links{position:fixed;inset:78px 0 0 0;background:var(--field);flex-direction:column;justify-content:flex-start;padding:40px 30px;gap:26px;transform:translateY(-8px);opacity:0;pointer-events:none;transition:all .25s;}
  .nav-links.open{opacity:1;transform:translateY(0);pointer-events:auto;}
  .nav-toggle{display:block;}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  padding:15px 32px;
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  font-weight:400;
  border:1px solid var(--gold);
  transition:all .25s;
}
.btn-solid{background:var(--ember);border-color:var(--ember);color:var(--ink);}
.btn-solid:hover{background:var(--ember-bright);border-color:var(--ember-bright);}
.btn-outline{color:var(--ink);}
.btn-outline:hover{background:rgba(217,166,92,0.1);}

/* ---------- hero: full-bleed, text over the field, no boxed product-shot ---------- */
.hero-immersive{
  position:relative;min-height:100vh;display:flex;align-items:flex-end;
  padding:150px 0 90px;
  overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center;
  animation:heroBreathe 18s ease-in-out infinite alternate;
}
.hero-immersive::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg, rgba(20,22,59,0.55) 0%, rgba(20,22,59,0.35) 35%, rgba(20,22,59,0.94) 92%),
    linear-gradient(90deg, rgba(20,22,59,0.75) 0%, rgba(20,22,59,0.15) 55%);
}
.hero-immersive .wrap{position:relative;z-index:2;}
.hero-immersive .inner{max-width:640px;}
@keyframes heroBreathe{from{transform:scale(1);}to{transform:scale(1.045);}}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);margin-bottom:20px;display:flex;align-items:center;gap:10px;
  opacity:0;animation:fadeUp .8s ease forwards;animation-delay:.05s;}
.hero-immersive h1{font-family:var(--display);font-size:clamp(42px,6.2vw,86px);line-height:0.98;margin:0 0 26px;font-weight:600;font-optical-sizing:auto;}
.hero-immersive h1 em{color:var(--ember-bright);font-style:normal;}
.hero-immersive h1 .line{display:block;opacity:0;transform:translateY(28px);animation:lineUp .9s cubic-bezier(.2,.7,.2,1) forwards;}
.hero-immersive h1 .line:nth-child(1){animation-delay:.2s;}
.hero-immersive h1 .line:nth-child(2){animation-delay:.4s;}
.hero-immersive p.lead{font-size:19px;color:var(--ink-dim);max-width:44ch;margin:0 0 36px;
  opacity:0;animation:fadeUp .8s ease forwards;animation-delay:.6s;}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;opacity:0;animation:fadeUp .8s ease forwards;animation-delay:.75s;}
@keyframes lineUp{to{opacity:1;transform:none;}}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}

@media (max-width:760px){
  .hero-immersive{padding:120px 0 70px;min-height:88vh;}
}
@media (prefers-reduced-motion: reduce){
  .hero-bg{animation:none;}
  .eyebrow, .hero-immersive h1 .line, .hero-immersive p.lead, .hero-cta{animation:none;opacity:1;transform:none;}
}

.subhero{padding:160px 0 60px;border-bottom:1px solid var(--line);}
.subhero .inner{max-width:720px;}
.subhero h1{font-family:var(--display);font-size:clamp(36px,4.6vw,58px);line-height:1.04;margin:0 0 22px;font-weight:600;}
@media (max-width:760px){.subhero{padding:130px 0 44px;}}

/* ---------- sections ---------- */
section{padding:110px 0;}
.section-tight{padding:74px 0;}
.center{text-align:center;}
h2{font-family:var(--display);font-size:clamp(30px,3.6vw,48px);font-weight:600;line-height:1.1;margin:0 0 20px;}
h3{font-family:var(--display);font-size:25px;font-weight:600;margin:0 0 12px;}
.lede{font-size:19px;color:var(--ink-dim);max-width:62ch;}
.lede.center{margin-left:auto;margin-right:auto;}
p{color:var(--ink-dim);}
strong{color:var(--ink);}

.statement{background:var(--field-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.statement blockquote{
  font-family:var(--display);font-size:clamp(25px,2.8vw,36px);font-weight:500;line-height:1.4;font-style:italic;
  color:var(--ink);margin:0;max-width:900px;
}
.statement cite{display:block;margin-top:26px;font-style:normal;font-family:var(--mono);font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);}

/* ---------- series teaser ---------- */
.teaser-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:70px;align-items:center;}
.teaser-grid img{border:1px solid var(--line-strong);}
@media (max-width:860px){.teaser-grid{grid-template-columns:1fr;}}

.spec-inline{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px;font-family:var(--mono);font-size:12px;letter-spacing:0.03em;color:var(--ink-faint);}
.spec-inline span{white-space:nowrap;}
.spec-inline span::before{content:"·";color:var(--gold);margin-right:8px;}
.spec-inline span:first-child::before{content:"";margin-right:0;}

/* ---------- work page ---------- */
.work-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:74px;align-items:start;padding-top:150px;}
.work-media img{border:1px solid var(--line-strong);}
.work-thumbs{display:flex;gap:10px;margin-top:12px;}
.work-thumbs img{width:72px;height:72px;object-fit:cover;border:1px solid var(--line);opacity:0.7;cursor:pointer;transition:opacity .2s;}
.work-thumbs img:hover{opacity:1;}
.spec-table{width:100%;border-collapse:collapse;margin:30px 0 36px;font-family:var(--mono);}
.spec-table tr{border-bottom:1px solid var(--line);}
.spec-table td{padding:14px 0;font-size:13px;}
.spec-table td:first-child{color:var(--gold);letter-spacing:0.06em;text-transform:uppercase;font-size:11px;width:42%;}
.spec-table td:last-child{font-family:var(--body);font-size:15px;color:var(--ink);}
.price{font-family:var(--display);font-size:34px;color:var(--ink);margin:0 0 6px;}
.price small{display:block;font-family:var(--body);font-size:13px;color:var(--ink-dim);text-transform:none;letter-spacing:0.02em;margin-top:8px;}
.status-dot{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:#8fb99e;margin-bottom:18px;}
.status-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:#8fb99e;}
.work-title{font-family:var(--display);font-size:clamp(36px,4.2vw,54px);margin:0 0 18px;font-weight:600;}
@media (max-width:900px){.work-grid{grid-template-columns:1fr;padding-top:120px;gap:44px;}}

/* ---------- process (real sequence: state -> hand -> layers) ---------- */
.process-seq{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.process-step{padding:36px 30px;border-right:1px solid var(--line);position:relative;}
.process-step:last-child{border-right:none;}
.process-step .stage{font-family:var(--mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;}
.process-step h3{margin-bottom:10px;}
.process-step:nth-child(1){transition-delay:0s;}
.process-step:nth-child(2){transition-delay:.14s;}
.process-step:nth-child(3){transition-delay:.28s;}
@media (max-width:860px){
  .process-seq{grid-template-columns:1fr;}
  .process-step{border-right:none;border-bottom:1px solid var(--line);}
  .process-step:last-child{border-bottom:none;}
}

/* ---------- gallery ---------- */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.gallery-grid a{display:block;overflow:hidden;border:1px solid var(--line);aspect-ratio:1;position:relative;}
.gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.gallery-grid a:hover img{transform:scale(1.06);}
.gallery-grid .cap{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;font-family:var(--mono);font-size:10px;letter-spacing:.05em;color:var(--ink);background:linear-gradient(0deg,rgba(10,11,32,.85),transparent);opacity:0;transition:opacity .3s;}
.gallery-grid a:hover .cap{opacity:1;}
.gallery-grid > *{transition-delay:calc(var(--gi, 0) * 0.08s);}
@media (max-width:760px){.gallery-grid{grid-template-columns:repeat(2,1fr);}}

/* ---------- about portrait ---------- */
.about-portrait-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:64px;align-items:center;}
.about-portrait-grid img{border:1px solid var(--line-strong);}
@media (max-width:900px){.about-portrait-grid{grid-template-columns:1fr;}}

.about-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:64px;align-items:start;}
@media (max-width:900px){.about-grid{grid-template-columns:1fr;}}

/* ---------- process video ---------- */
.video-wrap{position:relative;overflow:hidden;border:1px solid var(--line-strong);}
.video-wrap video{width:100%;display:block;}

/* ---------- form ---------- */
.form-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:74px;}
form{display:flex;flex-direction:column;gap:22px;}
label{font-family:var(--mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;display:block;}
input,textarea,select{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);
  color:var(--ink);font-family:var(--body);font-size:16px;padding:11px 2px;outline:none;
}
input:focus,textarea:focus,select:focus{border-color:var(--gold);}
textarea{resize:vertical;min-height:120px;}
.contact-list{list-style:none;padding:0;margin:0 0 40px;font-family:var(--mono);font-size:13px;}
.contact-list li{padding:16px 0;border-top:1px solid var(--line);}
.contact-list li a{font-family:var(--body);font-size:15px;color:var(--ember-bright);}
.form-note{font-size:13px;color:var(--ink-faint);margin-top:6px;}
@media (max-width:900px){.form-grid{grid-template-columns:1fr;gap:44px;}}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:50px 0;}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;font-family:var(--mono);font-size:12px;color:var(--ink-faint);}
footer a{opacity:0.85;}
footer a:hover{opacity:1;color:var(--gold);}

/* ---------- reveal animation ---------- */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .8s ease, transform .8s ease;}
[data-reveal].in{opacity:1;transform:translateY(0);}
