/* Página editorial: conceito, origem e objetivo do Ikigai */
.site-nav{display:flex;align-items:center;gap:18px;margin-left:auto;margin-right:24px}
.site-nav a{font-size:11px;text-transform:uppercase;letter-spacing:.08em;text-decoration:none;color:#817981;transition:color .2s ease}
.site-nav a:hover,.site-nav a.active{color:var(--plum)}

.about-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.about-hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.28;background-image:radial-gradient(rgba(69,54,96,.13) .7px,transparent .7px);background-size:18px 18px;mask-image:linear-gradient(90deg,#000,transparent 72%)}
.about-hero-inner{position:relative;z-index:1;max-width:1164px;margin:0 auto;padding:96px 38px 92px;display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:center}
.about-hero-copy h1,.about-intro h2,.about-history h2,.about-framework h2,.about-method h2,.about-sources h2,.about-cta h2{font-family:"Playfair Display",Georgia,serif;color:var(--plum);font-weight:500;letter-spacing:-.055em}
.about-hero-copy h1{font-size:clamp(54px,7vw,88px);line-height:.98;margin:20px 0 24px;max-width:720px}
.about-hero-copy h1 em,.about-framework h2 em,.about-method h2 em{font-weight:400;font-style:italic;color:#a76762}
.about-hero-copy>p{max-width:650px;font-size:16px;line-height:1.85;color:var(--ink-soft)}
.about-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:32px}
.about-text-link{font-size:12px;font-weight:700;color:var(--plum)}
.about-word-card{background:var(--plum-dark);color:#fffaf2;border-radius:8px;padding:38px 36px;box-shadow:0 28px 70px rgba(51,39,69,.18)}
.about-japanese{display:block;font-family:Georgia,serif;font-size:64px;letter-spacing:.03em;margin-bottom:26px;color:#f4ded7}
.about-word-row{display:grid;grid-template-columns:72px 1fr;gap:16px;padding:14px 0;border-top:1px solid rgba(255,255,255,.12)}
.about-word-row strong{font-family:"Playfair Display",Georgia,serif;font-size:24px;font-weight:500}
.about-word-row span{align-self:center;color:#d9d0d9;font-size:13px}
.about-word-card p{margin:22px 0 0;color:#d2c8d2;font-size:12px;line-height:1.7}

.about-intro{max-width:1164px;margin:0 auto;padding:92px 38px;display:grid;grid-template-columns:.9fr 1.1fr;gap:100px;align-items:start}
.about-intro h2{font-size:clamp(42px,5vw,64px);line-height:1.04;margin:16px 0 0}
.about-intro-text{font-size:15px;line-height:1.9;color:var(--ink-soft)}
.about-intro-text p:first-child{margin-top:0}
.about-intro-text strong{color:var(--plum)}

.about-history{background:var(--plum-dark);color:#fffaf2}
.about-history-inner{max-width:1164px;margin:0 auto;padding:94px 38px}
.about-history-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;margin-top:28px;align-items:start}
.about-history h2{color:#fffaf2;font-size:clamp(40px,4.7vw,60px);line-height:1.05;margin:0 0 26px}
.about-history-grid>div:first-child p{color:#d7cfd7;font-size:15px;line-height:1.9;max-width:600px}
.about-history-note{background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.12);border-radius:7px;padding:30px}
.about-history-note>span{display:block;color:#e4b2a7;text-transform:uppercase;letter-spacing:.15em;font-size:9px;font-weight:700}
.about-history-note h3{font-family:"Playfair Display",Georgia,serif;font-size:28px;line-height:1.16;font-weight:500;margin:14px 0;color:#fffaf2}
.about-history-note p{color:#d7cfd7;font-size:13px;line-height:1.75;margin-bottom:0}

.about-framework{max-width:1164px;margin:0 auto;padding:100px 38px 104px}
.about-framework-heading{max-width:830px;margin-bottom:44px}
.about-framework h2{font-size:clamp(42px,5vw,66px);line-height:1.04;margin:16px 0 22px}
.about-framework-heading>p{max-width:720px;color:var(--ink-soft);font-size:15px;line-height:1.85}
.about-dimensions{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.about-dimension{min-height:250px;border-radius:7px;padding:25px 23px;color:var(--plum);position:relative;overflow:hidden}
.about-dimension:nth-child(1),.about-dimension:nth-child(2),.about-dimension:nth-child(3){grid-column:span 2}
.about-dimension:nth-child(4),.about-dimension:nth-child(5){grid-column:span 3}
.about-dimension>span{font-size:9px;font-weight:700;letter-spacing:.13em}
.about-dimension h3{font-family:"Playfair Display",Georgia,serif;font-size:27px;line-height:1.08;font-weight:500;margin:54px 0 14px}
.about-dimension p{font-size:12px;line-height:1.7;color:#5e5661;max-width:300px}
.love-card{background:#b9ddcf}.strengths-card{background:#ece9ad}.needs-card{background:#efb5a5}.paid-card{background:#d8c7df}.lifestyle-card{background:#c9d7e4}

.about-method{background:#f0ece6;padding:96px max(38px,calc((100vw - 1164px)/2));display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:start}
.about-method h2{font-size:clamp(42px,4.8vw,62px);line-height:1.04;margin:16px 0 24px}
.about-method-copy>p{color:var(--ink-soft);font-size:14px;line-height:1.85;max-width:520px}
.about-steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.about-steps li{display:grid;grid-template-columns:44px 1fr;gap:16px;background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:20px 22px}
.about-steps li>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--plum);color:#fff;font-size:11px;font-weight:700}
.about-steps strong{display:block;color:var(--plum);font-size:13px;margin-bottom:5px}
.about-steps p{margin:0;color:var(--ink-soft);font-size:12px;line-height:1.65}

.about-principle{background:var(--plum);color:#fffaf2;padding:90px 38px}
.about-principle>div{max-width:940px;margin:0 auto;text-align:center}
.about-principle blockquote{font-family:"Playfair Display",Georgia,serif;font-size:clamp(34px,5vw,58px);line-height:1.16;letter-spacing:-.04em;font-style:italic;margin:24px auto 26px;color:#fffaf2}
.about-principle p{max-width:690px;margin:0 auto;color:#d8d0d8;font-size:13px;line-height:1.8}

.about-sources{max-width:1164px;margin:0 auto;padding:88px 38px;display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}
.about-sources h2{font-size:46px;line-height:1.05;margin:14px 0 18px}
.about-sources p{color:var(--ink-soft);font-size:13px;line-height:1.8}
.about-source-links{display:grid;gap:12px;padding-top:8px}
.about-source-links a{display:block;text-decoration:none;background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:18px 20px;color:var(--plum);font-size:12px;font-weight:700;transition:transform .18s ease,box-shadow .18s ease}
.about-source-links a:hover{transform:translateY(-2px);box-shadow:var(--shadow)}

.about-cta{padding:0 38px 100px}
.about-cta>div{max-width:1088px;margin:0 auto;background:#e8dfd7;border-radius:8px;padding:60px 64px;text-align:center}
.about-cta h2{font-size:clamp(40px,5vw,62px);line-height:1.04;max-width:770px;margin:16px auto 20px}
.about-cta p{max-width:650px;margin:0 auto 28px;color:var(--ink-soft);font-size:14px;line-height:1.8}

@media(max-width:900px){
  .site-nav{margin-left:12px;margin-right:12px}
  .tagline{display:none}
  .about-hero-inner,.about-intro,.about-history-grid,.about-method,.about-sources{grid-template-columns:1fr;gap:44px}
  .about-hero-inner{padding-top:70px}
  .about-dimensions{grid-template-columns:1fr 1fr}
  .about-dimension:nth-child(n){grid-column:span 1}
}

@media(max-width:620px){
  .header-inner{padding:0 18px;height:72px}
  .brand{font-size:20px}
  .brand-mark{width:31px;height:31px}
  .site-nav{margin:0 0 0 auto}
  .site-nav a{font-size:9px;letter-spacing:.06em}
  .about-hero-inner,.about-intro,.about-history-inner,.about-framework,.about-sources{padding-left:18px;padding-right:18px}
  .about-hero-inner{padding-top:54px;padding-bottom:62px}
  .about-hero-copy h1{font-size:50px}
  .about-word-card{padding:28px 24px}
  .about-japanese{font-size:52px}
  .about-intro{padding-top:66px;padding-bottom:66px}
  .about-history-inner{padding-top:70px;padding-bottom:70px}
  .about-framework{padding-top:72px;padding-bottom:76px}
  .about-dimensions{grid-template-columns:1fr}
  .about-dimension{min-height:220px}
  .about-method{padding:72px 18px;grid-template-columns:1fr;gap:42px}
  .about-principle{padding:72px 18px}
  .about-sources{padding-top:66px;padding-bottom:66px}
  .about-cta{padding:0 18px 76px}
  .about-cta>div{padding:44px 24px}
  .about-actions{align-items:flex-start;flex-direction:column}
}