
  /* ===== 히어로 · 소개: 기존 유지 ===== */
  .hero{position:relative;min-height:min(88vh,780px);display:flex;align-items:flex-end;overflow:hidden;background:#e9dcc4}
  .hero-media{position:absolute;inset:0}
  .hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity var(--t-reveal) linear}
  .hero-media #hero-vid{opacity:1}
  /* standalone: 영상 대체 정지 이미지 (원본 .hero-media video와 동일 배치) */
  .hero-media .hero-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:1}
  .hero-scrim{position:absolute;inset:0;background:
     linear-gradient(102deg, rgba(19,16,11,.74) 0%, rgba(19,16,11,.44) 36%, rgba(19,16,11,.08) 64%, rgba(19,16,11,0) 82%),
     linear-gradient(0deg, rgba(19,16,11,.62) 0%, rgba(19,16,11,.12) 34%, rgba(19,16,11,0) 52%)}
  .hero-inner{position:relative;width:100%;padding-block:clamp(2.6rem,6vw,4.4rem)}
  .hero .eyebrow{display:inline-flex;align-items:center;gap:.5rem;color:#efe7d6;font-size:.9rem;font-weight:600;margin-bottom:1.1rem}
  .hero .eyebrow .ln{width:26px;height:1.5px;background:#cbb98f;display:inline-block}
  .hero h1{color:#fff;font-size:clamp(2.6rem,6.4vw,4.6rem);line-height:1.14;font-weight:800;letter-spacing:-.035em;text-shadow:0 2px 30px rgba(0,0,0,.25)}
  .hero .sub{color:#efe9dc;font-size:clamp(1.05rem,1.7vw,1.25rem);margin-top:1.2rem;max-width:34ch;line-height:1.7}
  .hero-cta{margin-top:1.9rem;display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}

  .intro{padding-block:var(--sec)}
  .intro .grid{display:grid;grid-template-columns:1.25fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
  .intro .lab{color:var(--meta);font-size:.82rem;font-weight:700;letter-spacing:.14em;margin-bottom:1.2rem}
  .intro .stmt{font-size:clamp(1.6rem,3.4vw,2.5rem);line-height:1.42;font-weight:700;letter-spacing:-.02em}
  .intro .note{margin-top:1.3rem;color:var(--body);max-width:52ch}
  .quote{background:var(--white);border:1px solid var(--line);padding:clamp(1.8rem,3vw,2.6rem);box-shadow:0 24px 50px -38px rgba(23,20,15,.42)}
  .quote .qlab{color:var(--meta);font-size:.76rem;font-weight:700;letter-spacing:.12em;margin-bottom:.5rem}
  .quote .qm{font-family:Georgia,serif;font-size:3.2rem;line-height:.3;color:var(--ink);opacity:.13}
  .quote p{margin-top:.5rem;font-size:1.14rem;line-height:1.72;color:var(--ink);font-weight:500;letter-spacing:-.01em}
  .quote .sig{margin-top:1.5rem;padding-top:1.15rem;border-top:1px solid var(--line);display:flex;align-items:baseline;gap:.6rem;font-size:.95rem}
  .quote .sig .role{color:var(--meta)}
  .quote .sig .nm{font-weight:800;color:var(--ink);font-size:1.05rem}

  /* ===== [이식 1] 사업 = 풀블리드 사진 + 전폭 행 리스트 =====
     원리 출처: Farm Africa 'What we do' — 사진 위에 얇은 구분선 행을 얹고
     행 전체를 hover 시 색면으로 채운다. 카드 4장 그리드를 대체한다. */
  .rows{position:relative;overflow:hidden;color:#fff;isolation:isolate}
  .rows .bg{position:absolute;inset:0;z-index:-2}
  .rows .bg img{width:100%;height:100%;object-fit:cover}
  /* 사진에 인물·밝은 면이 많아 텍스트와 경쟁한다. 좌측(읽는 쪽)에 가중치를 둔 2겹 스크림. */
  .rows .scrim{position:absolute;inset:0;z-index:-1;background:
     linear-gradient(92deg,rgba(14,12,10,.9) 0%,rgba(14,12,10,.8) 46%,rgba(14,12,10,.62) 74%,rgba(14,12,10,.55) 100%),
     linear-gradient(0deg,rgba(14,12,10,.5) 0%,rgba(14,12,10,.18) 40%,rgba(14,12,10,.42) 100%)}
  .rows .inner{padding-block:clamp(3.4rem,7vw,6rem)}
  .rows .rhead{text-align:center;margin-bottom:clamp(2.2rem,4vw,3.4rem)}
  .rows .rlab{display:inline-flex;align-items:center;gap:.5rem;color:#e7ded2;font-size:.86rem;font-weight:700;letter-spacing:.14em}
  .rows .rlab .ln{width:22px;height:1.5px;background:var(--pine);display:inline-block}
  .rows h2{margin-top:1rem;color:#fff;font-size:clamp(1.6rem,3.4vw,2.5rem);font-weight:700;letter-spacing:-.02em;line-height:1.42}
  .rows .rsub{margin-top:1rem;color:#ded6ca;font-size:1.02rem;max-width:46ch;margin-inline:auto}

  .rowlist{border-top:1px solid rgba(255,255,255,.26)}
  .row{position:relative;display:grid;grid-template-columns:3.2rem minmax(0,1fr) auto;align-items:start;gap:1.2rem;
       border-bottom:1px solid rgba(255,255,255,.26);padding:1.6rem .4rem;min-height:96px;color:#fff;isolation:isolate}
  .row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--pine);
       transform:scaleX(0);transform-origin:left;transition:transform var(--t-base) var(--ease-out)}
  .row:hover::before,.row:focus-visible::before{transform:scaleX(1)}
  .row .rn{font-size:.9rem;font-weight:700;letter-spacing:.1em;color:rgba(255,255,255,.62);padding-top:.55em;transition:color var(--t-base)}
  .row:hover .rn{color:rgba(255,255,255,.9)}
  .row .rtitle{font-size:clamp(1.3rem,2.4vw,1.95rem);font-weight:800;letter-spacing:-.02em;line-height:1.3}
  .row .rdesc{display:block;margin-top:.35rem;font-size:1rem;color:rgba(255,255,255,.74);max-width:52ch;line-height:1.6;
       transition:color var(--t-base)}
  .row:hover .rdesc{color:rgba(255,255,255,.92)}
  .row .rchip{display:inline-block;margin-top:.6rem;font-size:.82rem;font-weight:600;color:rgba(255,255,255,.7);
       border:1px solid rgba(255,255,255,.34);padding:.12rem .55rem;transition:border-color var(--t-base),color var(--t-base)}
  .row:hover .rchip{color:#fff;border-color:rgba(255,255,255,.7)}
  .row .rgo{width:46px;height:46px;flex:none;margin-top:.15rem;border:1.5px solid rgba(255,255,255,.5);border-radius:50%;
       display:grid;place-items:center;transition:background var(--t-base),border-color var(--t-base),transform var(--t-base)}
  .row:hover .rgo{background:#fff;border-color:#fff;transform:translateX(5px)}
  .row .rgo svg{width:17px;height:17px;stroke:#fff;transition:stroke var(--t-base)}
  .row:hover .rgo svg{stroke:var(--pine)}
  .rows .rfoot{margin-top:clamp(1.8rem,3vw,2.6rem);text-align:center}

  /* ===== [이식 2] 소식 = 초대형 라벨 + 탭 + 가로 캐러셀(엣지 블리드) =====
     원리 출처: SK D&D 'NEWS' — 카드에 테두리·그림자를 두지 않고
     이미지+텍스트만 두며, 목록이 화면 오른쪽으로 흘러나가 '더 있음'을 알린다. */
  .newsx{padding-block:var(--sec);overflow:hidden}
  .nx-top{display:flex;align-items:flex-end;justify-content:space-between;gap:1.4rem;flex-wrap:wrap}
  .nx-ctl{display:flex;align-items:center;gap:.5rem;flex:none;padding-bottom:.2rem}
  .nx-ctl .more{margin-right:.8rem}
  .nx-nav{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--white);display:grid;place-items:center;cursor:pointer;
       transition:background var(--t-base),border-color var(--t-base),opacity var(--t-base)}
  .nx-nav svg{width:20px;height:20px;stroke:var(--ink);transition:stroke var(--t-base)}
  .nx-nav:hover:not(:disabled){background:var(--alt);border-color:rgba(23,20,15,.24)}
  .nx-nav:disabled{opacity:.28;cursor:default}
  .nx-nav:focus-visible{outline:2px solid var(--charcoal);outline-offset:2px}
  .nx-top .lab{color:var(--meta);font-size:.82rem;font-weight:700;letter-spacing:.14em}
  .nx-lead{margin-top:1rem;font-size:clamp(1.6rem,3.4vw,2.5rem);font-weight:700;letter-spacing:-.02em;line-height:1.42;color:var(--ink);max-width:28ch}

  .nx-rail{display:flex;gap:clamp(1.5rem,2.6vw,2.2rem);margin-top:clamp(1.8rem,3.2vw,2.6rem);
       overflow-x:auto;scroll-snap-type:x proximity;padding-block:.4rem 1.4rem;
       margin-right:calc(-1 * max(var(--pad), (100vw - var(--maxw))/2 + var(--pad)));
       padding-right:var(--pad);scrollbar-width:none}
  .nx-rail::-webkit-scrollbar{display:none}
  .nx-rail::-webkit-scrollbar-thumb{background:var(--line)}
  .nx-rail::-webkit-scrollbar-track{background:transparent}

  .nx-card{flex:0 0 clamp(270px,26vw,330px);scroll-snap-align:start;color:inherit;display:flex;flex-direction:column;
       background:var(--white);border:1px solid var(--line);
       transition:transform 620ms cubic-bezier(.22,.61,.36,1),box-shadow 620ms cubic-bezier(.22,.61,.36,1),border-color 620ms cubic-bezier(.22,.61,.36,1)}
  .nx-card:hover{transform:translateY(-6px);border-color:rgba(23,20,15,.16);box-shadow:0 26px 46px -28px rgba(23,20,15,.42)}
  .nx-card .th{position:relative;aspect-ratio:4/3;background:#ece3d0;overflow:hidden}
  .nx-card .th img{width:100%;height:100%;object-fit:cover}
  .nx-card .cb{display:flex;flex-direction:column;flex:1;gap:.8rem;padding:1.4rem 1.4rem 1.7rem}
  .nx-card .cmeta{display:flex;align-items:center;gap:.7rem}
  .nx-card .cat{font-size:.82rem;font-weight:700;letter-spacing:.02em;color:var(--pine)}
  .nx-card h3{font-size:1.08rem;font-weight:700;line-height:1.5;letter-spacing:-.01em;transition:color var(--t-fast);
       display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:3em}
  .nx-card:hover h3{color:var(--pine)}
  .nx-card .dt{font-size:.88rem;color:var(--meta);letter-spacing:.01em}

  /* ===== [이식 3] 후원 = 풀블리드 + 중앙 선언문 + 알약 버튼 =====
     원리 출처: SK D&D 'Sustainability' — 작은 라벨 → 거대한 선언문 → 한글 보조문 → 아웃라인 알약. */
  .decl{position:relative;overflow:hidden;color:#fff;text-align:center;isolation:isolate}
  .decl .bg{position:absolute;inset:0;z-index:-2}
  .decl .bg img{width:100%;height:100%;object-fit:cover}
  .decl .scrim{position:absolute;inset:0;z-index:-1;background:rgba(18,16,14,.62)}
  .decl .inner{padding-block:clamp(4.5rem,10vw,8.5rem)}
  .decl .dlab{font-size:.88rem;font-weight:700;letter-spacing:.2em;color:#f0e7da}
  .decl h2{margin-top:1.4rem;font-size:clamp(2.1rem,5.4vw,4.1rem);font-weight:800;letter-spacing:-.035em;line-height:1.18}
  .decl p{margin-top:1.5rem;color:#e6ddd0;font-size:clamp(1rem,1.5vw,1.14rem);line-height:1.75;max-width:44ch;margin-inline:auto}
  .decl .pill{display:inline-flex;align-items:center;justify-content:center;min-height:56px;margin-top:2.2rem;
       padding:0 2.6rem;border:1.5px solid rgba(255,255,255,.7);border-radius:999px;color:#fff;font-weight:700;
       font-size:1.02rem;transition:background var(--t-base),color var(--t-base),border-color var(--t-base)}
  .decl .pill:hover{background:#fff;color:var(--ink);border-color:#fff}

  @media (max-width:920px){
    .intro .grid{grid-template-columns:1fr}
    .row{grid-template-columns:2.4rem minmax(0,1fr) auto;gap:.9rem}
    .nx-rail{margin-right:calc(-1 * var(--pad))}
  }
  @media (max-width:620px){
    .hero{min-height:auto}
    .row{padding:1.2rem .2rem;min-height:88px}
  }

  /* 소식 레일 — 드래그 이동 + 좌우 화살표 */
  .nx-railwrap{position:relative;--bleed:max(var(--pad), (100vw - var(--maxw))/2 + var(--pad))}
  .nx-rail{cursor:grab}
  .nx-rail.dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}
  .nx-rail.dragging a{pointer-events:none}
  