/* ========================================
   About page — Premium Edition
   ======================================== */

/* --- Scroll reveal base --- */
.sks-about-overview,
.sks-about-origin,
.sks-about-message,
.sks-about-pillar{
  opacity:0;transform:translateY(32px);
  transition:opacity 0.8s var(--sks-ease),transform 0.8s var(--sks-ease);
}
.sks-about-overview.is-visible,
.sks-about-origin.is-visible,
.sks-about-message.is-visible{
  opacity:1;transform:translateY(0);
}
.sks-about-pillar.is-visible{
  opacity:1;transform:translateY(0);
  transition:opacity 0.8s var(--sks-ease),transform 0.5s var(--sks-ease),
    border-color 0.5s var(--sks-ease),box-shadow 0.5s var(--sks-ease);
}

/* --- Overview section --- */
.sks-about-overview{
  padding:88px 24px 80px;
  background:
    radial-gradient(ellipse 55% 45% at 50% 25%,rgba(196,154,93,0.08) 0%,transparent 70%),
    linear-gradient(180deg,var(--sks-bg) 0%,var(--sks-bg-2) 100%);
}
.sks-about-overview__inner{max-width:880px;margin:0 auto;}
.sks-about-overview__text{
  font-family:var(--sks-f-serif);
  font-size:clamp(20px,2.4vw,30px);line-height:2.1;
  color:var(--sks-text-80);margin:0 0 48px;
  letter-spacing:0.04em;
}

/* Pillars — two-column cards */
.sks-about-overview__pillars{
  display:grid;grid-template-columns:repeat(2,1fr);gap:24px;
}
.sks-about-pillar{
  position:relative;
  padding:32px;
  border:1px solid var(--sks-glass-border);
  border-radius:var(--sks-radius-card);
  background:var(--sks-glass-shine),rgba(14,14,17,0.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  overflow:hidden;
  transition:opacity 0.8s var(--sks-ease),transform 0.8s var(--sks-ease);
}
/* Top gold accent line — visible on hover */
.sks-about-pillar::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent 10%,rgba(225,191,134,0.35) 50%,transparent 90%);
  opacity:0;
}
.sks-about-pillar__num{
  position:absolute;top:16px;right:16px;
  font-family:var(--sks-f-en);font-size:28px;font-weight:300;
  color:rgba(225,191,134,0.08);line-height:1;
}
.sks-about-pillar__title{
  margin:0 0 16px;font-family:var(--sks-f-en);
  font-size:13px;font-weight:500;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--sks-gold-2);
}
.sks-about-pillar__desc{
  margin:0;font-family:var(--sks-f-serif);
  font-size:14.5px;line-height:2.1;color:var(--sks-text-68);
  letter-spacing:0.03em;
}

/* --- Name Origin section --- */
.sks-about-origin{
  padding:88px 24px 80px;
}
.sks-about-origin__inner{max-width:680px;margin:0 auto;}
.sks-about-origin__content{text-align:center;}

/* Brand name with gold glow */
.sks-about-origin__name{
  margin:0 0 8px;
  font-family:var(--sks-f-en);font-size:clamp(36px,5vw,56px);font-weight:300;
  letter-spacing:0.16em;color:var(--sks-text);
  text-shadow:0 0 60px rgba(196,154,93,0.15),0 0 120px rgba(196,154,93,0.06);
}
.sks-about-origin__reading{
  margin:0 0 24px;
  font-family:var(--sks-f-serif);font-size:clamp(14px,1.6vw,18px);
  letter-spacing:0.2em;color:rgba(225,191,134,0.80);
}

/* Accent line above quote */
.sks-about-origin__accent{
  display:block;width:48px;height:1px;margin:0 auto 24px;
  background:linear-gradient(90deg,transparent,rgba(196,154,93,0.5) 50%,transparent);
}

/* Quote */
.sks-about-origin__quote{
  margin:0 0 32px;padding:0;border:none;
  font-family:var(--sks-f-serif);
  font-size:clamp(18px,2.2vw,24px);
  line-height:2;letter-spacing:0.04em;
  color:var(--sks-text);
}

.sks-about-origin__desc{
  margin:0;
  font-family:var(--sks-f-serif);
  font-size:clamp(14px,1.4vw,16px);line-height:2.2;
  color:var(--sks-text-68);letter-spacing:0.03em;
}

/* --- Message section — warm background --- */
.sks-about-message{
  padding:88px 32px 96px;
  max-width:1120px;margin:0 auto;
  position:relative;
}
.sks-about-message::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 65% 50% at 35% 25%,rgba(196,154,93,0.07) 0%,transparent 70%);
}
.sks-about-message > *{position:relative;z-index:1;}

.sks-about-message__intro{text-align:center;margin-bottom:56px;}
.sks-about-message__credit{
  font-family:var(--sks-f-ui);
  font-size:12px;font-weight:500;letter-spacing:0.28em;
  color:rgba(225,191,134,0.70);margin:0;text-transform:uppercase;
}

.sks-about-message__grid{
  display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);
  gap:clamp(48px,6vw,78px);align-items:start;
}

.sks-about-message__visual{position:sticky;top:128px;}

.sks-about-message__photo-wrap{
  position:relative;border:1px solid var(--sks-glass-border);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,0.04),rgba(255,255,255,0.02));
  overflow:hidden;
  box-shadow:
    0 24px 80px rgba(0,0,0,0.40),
    0 0 0 1px rgba(255,255,255,0.03),
    0 0 60px rgba(196,154,93,0.06);
}
/* Top shimmer line */
.sks-about-message__photo-wrap::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:2;
  background:linear-gradient(90deg,transparent 10%,rgba(225,191,134,0.25) 50%,transparent 90%);
}
/* Gradient vignette */
.sks-about-message__photo-wrap::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,0.02) 0%,rgba(0,0,0,0.18) 100%);
  pointer-events:none;
}
.sks-about-message__photo{
  display:block;width:100%;height:auto;aspect-ratio:4/5;
  object-fit:cover;object-position:center 18%;
  filter:saturate(0.92) contrast(1.02) brightness(0.98);
}

.sks-about-message__profile{padding-top:24px;}
.sks-about-message__name-ja{
  margin:0 0 8px;font-family:var(--sks-f-serif);font-size:28px;
  font-weight:500;letter-spacing:0.06em;color:var(--sks-text);
}
.sks-about-message__name-en{
  margin:0;font-family:var(--sks-f-en);font-size:14px;
  letter-spacing:0.14em;color:rgba(225,191,134,0.85);
}

/* --- Message body: bright & readable --- */
.sks-about-message__body{max-width:760px;}
.sks-about-message__body p{
  font-family:var(--sks-f-serif);
  font-size:clamp(15.5px,1.6vw,18px);font-weight:400;
  line-height:2.35;letter-spacing:0.03em;
  color:rgba(246,241,234,0.88);
  margin:0 0 2.2em;
}
.sks-about-message__body p:last-of-type{margin-bottom:0;}

/* First paragraph — opening impact */
.sks-about-message__body .sks-prose__opening{
  font-size:clamp(17px,1.85vw,21px);
  color:var(--sks-text);
  line-height:2.15;
  margin-bottom:2.6em;
}

/* Closing — subtle emphasis */
.sks-about-message__body .sks-prose__closing{
  color:var(--sks-text);
}

/* --- Nav wrapper --- */
.sks-about-nav{padding:80px 0 96px;}

/* --- Hover effects (pointer devices only) --- */
@media (hover:hover){
  .sks-about-pillar::before{transition:opacity 0.5s var(--sks-ease);}
  .sks-about-pillar__num{transition:color 0.5s var(--sks-ease);}
  .sks-about-pillar.is-visible:hover::before{opacity:1;}
  .sks-about-pillar.is-visible:hover{
    border-color:rgba(196,154,93,0.25);
    transform:translateY(-4px);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.06),
      0 16px 40px rgba(0,0,0,0.2),
      0 0 20px rgba(196,154,93,0.04);
  }
  .sks-about-pillar.is-visible:hover .sks-about-pillar__num{
    color:rgba(225,191,134,0.14);
  }
  .sks-about-message__photo-wrap{
    transition:box-shadow 0.6s var(--sks-ease),transform 0.6s var(--sks-ease);
  }
  .sks-about-message.is-visible .sks-about-message__photo-wrap:hover{
    transform:translateY(-4px);
    box-shadow:
      0 32px 100px rgba(0,0,0,0.45),
      0 0 0 1px rgba(196,154,93,0.12),
      0 0 90px rgba(196,154,93,0.08);
  }
}

/* --- Responsive --- */
@media (max-width:768px){
  .sks-about-overview{padding:64px 20px 56px;}
  .sks-about-overview__text{line-height:2.0;margin-bottom:32px;}
  .sks-about-overview__pillars{grid-template-columns:1fr;gap:16px;}
  .sks-about-pillar{padding:24px;}
  .sks-about-pillar__num{font-size:24px;}
  .sks-about-origin{padding:56px 20px 48px;}
  .sks-about-origin__name{font-size:32px;}
  .sks-about-message{padding:64px 20px 80px;}
  .sks-about-message__intro{margin-bottom:40px;}
  .sks-about-message__grid{grid-template-columns:1fr;gap:40px;}
  .sks-about-message__visual{position:static;max-width:420px;margin:0 auto;}
  .sks-about-message__profile{text-align:center;}
  .sks-about-message__body p{
    line-height:2.15;
    margin:0 0 1.8em;
  }
  .sks-about-message__name-ja{font-size:22px;}
  .sks-about-message__name-en{font-size:12px;}
  .sks-about-nav{padding:64px 0 80px;}
}

@media (max-width:480px){
  .sks-about-overview{padding:48px 16px 40px;}
  .sks-about-overview__text{font-size:18px;line-height:1.95;}
  .sks-about-origin{padding:48px 16px 40px;}
  .sks-about-origin__name{font-size:28px;}
  .sks-about-origin__quote{font-size:17px;}
  .sks-about-origin__accent{width:36px;}
  .sks-about-message{padding:48px 16px 56px;}
  .sks-about-message__intro{margin-bottom:32px;}
  .sks-about-message__visual{max-width:280px;}
  .sks-about-message__profile{padding-top:16px;}
  .sks-about-message__body p{font-size:14.5px;line-height:2.05;}
  .sks-about-nav{padding:48px 0 64px;}
}

@media (prefers-reduced-motion:reduce){
  .sks-about-overview,
  .sks-about-origin,
  .sks-about-message,
  .sks-about-pillar{
    opacity:1 !important;transform:none !important;transition:none !important;
  }
}