:root{--paper:#fffaf7;--ink:#382f34;--muted:#81767a;--pink:#d98fa0;--soft:#f7e3e8;--line:#eadfe1;--shadow:0 16px 40px #553a431a;--r:22px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}.header{position:sticky;top:0;z-index:10;min-height:78px;padding:12px clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;gap:30px;background:#fffaf7ee;border-bottom:1px solid #eadfe1aa;backdrop-filter:blur(14px)}.brand{display:flex;flex-direction:column;line-height:1.1}.brand b,footer strong{font:clamp(25px,3vw,36px) Georgia,serif;letter-spacing:.04em}.brand small{margin-top:6px;color:var(--muted);font-size:9px}.header nav{display:flex;gap:clamp(18px,3vw,38px);font-size:13px;font-weight:700}.menu{display:none}.hero{position:relative;min-height:650px;display:grid;grid-template-columns:48% 52%;overflow:hidden;background:linear-gradient(135deg,#fffaf7,#fff1f0)}.hero-copy{align-self:center;padding:70px clamp(24px,6vw,90px);z-index:2}.en{margin:0 0 8px;color:var(--pink);font:11px Georgia,serif;letter-spacing:.18em}h1,h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500}h1{margin:0 0 24px;font-size:clamp(34px,4.5vw,62px);line-height:1.45}.hero-copy>p:not(.en),.heading>p,.about>p:last-child{color:var(--muted)}.button{display:inline-flex;margin-top:22px;padding:10px 25px;border:1px solid var(--pink);border-radius:99px;color:#a05266;background:#fff;font-weight:700}.hero-photo{display:grid;place-items:center;color:#9d7f87;background:linear-gradient(145deg,#e9e2f4,#f5dce3 50%,#dcefe7);font:12px Georgia,serif;letter-spacing:.2em}.badge{position:absolute;right:4vw;bottom:8%;width:145px;aspect-ratio:1;display:grid;place-items:center;padding:18px;border-radius:50%;text-align:center;background:#fff0f3ee;box-shadow:var(--shadow);font-size:13px}.section{padding:clamp(65px,8vw,115px) clamp(20px,5vw,72px)}.heading{margin-bottom:32px;display:flex;align-items:end;justify-content:space-between;gap:25px}.heading h2,.news h2,.about h2{margin:0;font-size:clamp(29px,3vw,42px)}.heading>p{max-width:500px;margin:0;font-size:14px}.studios{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.5vw,34px)}.card{overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--shadow);transition:.2s}.card:hover{transform:translateY(-5px)}.photo{aspect-ratio:4/3;display:grid;place-items:center;color:#60485377;font:12px Georgia,serif;letter-spacing:.22em}.p1{background:linear-gradient(135deg,#f8efe8,#dcefe7)}.p2{background:linear-gradient(135deg,#eadfd8,#cab6c0)}.p3{background:linear-gradient(135deg,#f7dfe6,#f1eef6)}.p4{background:linear-gradient(135deg,#d9c4eb,#f0b9d0)}.p5{background:linear-gradient(135deg,#e8e0cf,#cfe3d8)}.p6{background:linear-gradient(135deg,#f2d9d0,#d7d2e8)}.card>div:last-child{padding:20px}.card h3,.event h3{margin:0;font-size:21px}.card p{margin:0 0 12px;color:var(--muted);font-size:13px}.card b,.event b{color:#a85f71;font-size:13px}.tint{background:linear-gradient(120deg,#fff8f5,#fff1f2)}.events{display:grid;grid-template-columns:1fr 1fr;gap:28px}.event{display:grid;grid-template-columns:44% 1fr;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:#fff}.event .photo{height:100%;min-height:230px;aspect-ratio:auto}.event>div:last-child{align-self:center;padding:30px}.event small{color:var(--pink)}.pe1{background:linear-gradient(145deg,#f7dbe4,#f6e7d5)}.pe2{background:linear-gradient(145deg,#e8e2f5,#dceee5)}.news{display:grid;grid-template-columns:1fr 3fr;gap:40px}.news>p{display:grid;grid-template-columns:130px 1fr;gap:20px;border-bottom:1px solid var(--line)}time{color:var(--pink)}.about{max-width:900px;margin:auto;text-align:center}footer{padding:45px clamp(20px,5vw,72px);display:grid;grid-template-columns:1fr auto;align-items:end;gap:25px;border-top:1px solid var(--line);background:#fff}footer p{margin:3px 0;color:var(--muted);font-size:12px}footer nav{display:flex;gap:22px;font-size:12px}footer>small{grid-column:1/-1;color:#aaa}
@media(max-width:900px){.menu{display:block;width:44px;height:44px;padding:9px;border:1px solid var(--line);border-radius:50%;background:#fff}.menu i{display:block;height:2px;margin:5px;background:var(--ink)}.menu span{position:absolute;width:1px;height:1px;overflow:hidden}.header nav{position:fixed;inset:78px 16px auto;padding:20px;display:none;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.header nav.open{display:flex}.hero{grid-template-columns:1fr}.hero-photo{order:1;min-height:50svh}.hero-copy{order:2;padding-top:50px}.badge{top:calc(50svh - 75px);bottom:auto}.studios{grid-template-columns:repeat(2,1fr)}.heading{align-items:start;flex-direction:column;gap:8px}}
@media(max-width:600px){.header{min-height:68px;padding:9px 15px}.brand b{font-size:24px}.hero-photo{min-height:58vw}.hero-copy{padding:44px 20px 60px}h1{font-size:clamp(31px,10vw,43px)}.badge{top:calc(58vw - 58px);right:14px;width:115px;font-size:10px}.section{padding:62px 18px}.studios{grid-template-columns:1fr}.card{display:grid;grid-template-columns:43% 1fr}.card .photo{height:100%;min-height:180px;aspect-ratio:auto}.card>div:last-child{align-self:center;padding:15px}.events{grid-template-columns:1fr}.event{grid-template-columns:1fr}.event .photo{min-height:185px;aspect-ratio:16/9}.news{grid-template-columns:1fr;gap:15px}.news>p{grid-template-columns:1fr;gap:2px}footer{grid-template-columns:1fr}footer nav{flex-wrap:wrap}}

/* Main visual: the original photo stays untouched; the fade is a CSS overlay. */
.hero-photo {
  position: relative;
  overflow: hidden;
  color: transparent;
  background: url("../images/hero/hero-main.webp") center center / cover no-repeat;
}
.hero-photo::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--paper) 0%, rgb(255 250 247 / 72%) 16%, transparent 52%);
  content: "";
  pointer-events: none;
}
@media (max-width: 900px) {
  .hero-photo { background-position: 62% center; }
  .hero-photo::after { background: linear-gradient(180deg, transparent 52%, var(--paper) 100%); }
}

/* Studio and event photography */
.p1 { background: url("../images/studios/bescos.webp") center / cover no-repeat; }
.p2 { background: url("../images/studios/yousta.webp") center / cover no-repeat; }
.p3 { background: url("../images/studios/assort.webp") center / cover no-repeat; }
.p4 { background: url("../images/studios/miista.webp") center / cover no-repeat; }
.p5 { background: url("../images/studios/neosta.webp") center / cover no-repeat; }
.p6 { background: url("../images/studios/new-studio.webp") center / cover no-repeat; }
.pe1 { background: url("../images/events/popin.webp") center / cover no-repeat; }
.pe2 { background: url("../images/events/odecoss.webp") center / cover no-repeat; }
.photo span { visibility: hidden; }

/* Mobile hero: keep the photograph and copy as separate, non-overlapping blocks. */
@media (max-width: 600px) {
  .hero__badge,
  .badge { display: none; }
  .hero-copy { padding-top: 34px; }
  .hero-copy h1 {
    font-size: clamp(28px, 8.2vw, 34px);
    line-height: 1.55;
    letter-spacing: .01em;
  }
  .hero-copy .en {
    font-size: 9px;
    line-height: 1.6;
    letter-spacing: .12em;
  }
}