/* ============ NEW BRUTALISM v57 — 黑白+薄荷+明黄+硬框 ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Noto Sans SC','Space Grotesk','PingFang SC',sans-serif;color:#0b0b0b;background:#fff;line-height:1.65}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
h1,h2,h3,h4{font-family:'Archivo Black','Noto Sans SC',sans-serif;font-weight:900;letter-spacing:-.5px;line-height:1.1}
.nb-wrap{max-width:1200px;margin:0 auto;padding:0 24px}

/* header */
.nb-head{background:#fff;border-bottom:3px solid #000;position:sticky;top:0;z-index:100}
.nb-h-in{display:flex;align-items:center;justify-content:space-between;height:72px}
.nb-logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:18px}
.nb-logo-mark{width:38px;height:38px;background:#000;color:#9ff0c5;display:grid;place-items:center;font-family:'Archivo Black';border:3px solid #000;box-shadow:4px 4px 0 #9ff0c5;transform:rotate(-4deg);font-size:18px}
.nb-nav{display:flex;align-items:center;gap:26px;font-weight:700;font-size:14px}
.nb-nav a:hover{color:#0d9488}
.nb-cta{background:#000;color:#fff!important;padding:10px 16px;border:3px solid #000;box-shadow:3px 3px 0 #9ff0c5;transform:rotate(-1deg)}
.nb-cta:hover{transform:rotate(0) translateY(-2px);box-shadow:5px 5px 0 #9ff0c5}
.nb-ham{display:none;width:42px;height:42px;border:3px solid #000;background:#9ff0c5;flex-direction:column;gap:4px;justify-content:center;align-items:center}
.nb-ham span{width:22px;height:3px;background:#000}
.nb-mmenu{display:none;border-top:3px solid #000;background:#fff;padding:16px 24px}
.nb-mmenu.open{display:flex;flex-direction:column;gap:12px;font-weight:700}
.nb-mmenu a{padding:10px 0;border-bottom:2px dashed #ddd}

/* hero */
.nb-hero{padding:72px 0 80px;background:repeating-linear-gradient(45deg,#fff 0,#fff 20px,#fafafa 20px,#fafafa 40px);position:relative;overflow:hidden}
.nb-hero::before{content:"IVF";position:absolute;right:-30px;top:40px;font-family:'Archivo Black';font-size:320px;color:#9ff0c5;opacity:.15;transform:rotate(-10deg);pointer-events:none;z-index:0}
.nb-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center;position:relative;z-index:1}
.nb-chip{display:inline-block;padding:6px 12px;font-weight:700;font-size:12px;border:3px solid #000;margin-bottom:20px;transform:rotate(-1deg);box-shadow:3px 3px 0 #000}
.nb-chip-green{background:#9ff0c5}
.nb-chip-black{background:#000;color:#fff}
.nb-hero h1{font-size:72px;margin-bottom:20px;line-height:1}
.nb-underline{background:#ffe64d;padding:0 6px;display:inline-block;box-decoration-break:clone;border:3px solid #000;box-shadow:6px 6px 0 #000;transform:rotate(-1deg)}
.nb-hero p{font-size:17px;margin-bottom:30px;max-width:520px;border-left:5px solid #000;padding-left:16px}
.nb-h-ctas{display:flex;gap:14px;margin-bottom:26px;flex-wrap:wrap}
.nb-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 24px;font-weight:900;font-size:15px;border:3px solid #000;transition:all .2s}
.nb-btn-black{background:#000;color:#fff;box-shadow:6px 6px 0 #9ff0c5}
.nb-btn-black:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 #9ff0c5}
.nb-btn-mint{background:#9ff0c5;color:#000;box-shadow:6px 6px 0 #000}
.nb-btn-mint:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 #000}
.nb-btn-block{width:100%}
.nb-sticker-row{display:flex;gap:10px;flex-wrap:wrap}
.nb-stick{padding:6px 12px;font-weight:900;font-size:12px;border:3px solid #000;transform:rotate(-2deg);box-shadow:3px 3px 0 #000}
.nb-stick-y{background:#ffe64d}
.nb-stick-p{background:#ffc7e0}
.nb-stick-b{background:#c9f}
.nb-h-r{position:relative}
.nb-h-frame{border:5px solid #000;box-shadow:10px 10px 0 #000;transform:rotate(-2deg);background:#fff;overflow:hidden}
.nb-h-frame img{width:100%;height:480px;object-fit:cover;display:block}
.nb-badge{position:absolute;padding:8px 14px;font-weight:900;font-size:13px;border:3px solid #000}
.nb-badge-1{background:#ffe64d;top:-14px;left:-14px;transform:rotate(-6deg);box-shadow:3px 3px 0 #000}
.nb-badge-2{background:#9ff0c5;bottom:30px;right:-10px;transform:rotate(4deg);box-shadow:3px 3px 0 #000}
.nb-badge-3{background:#ffc7e0;top:40%;right:-20px;transform:rotate(-3deg);box-shadow:3px 3px 0 #000}

/* section head */
.nb-sec{margin-bottom:50px;display:flex;align-items:flex-end;gap:24px}
.nb-sec-center{justify-content:center;text-align:center}
.nb-sec-n{font-family:'Archivo Black';font-size:48px;color:#9ff0c5;-webkit-text-stroke:2px #000;text-stroke:2px #000;line-height:1}
.nb-sec h2{font-size:40px}
.nb-sec h2 span{color:#0d9488}

/* services */
.nb-svc{padding:80px 0;background:#fff}
.nb-svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.nb-card{border:3px solid #000;padding:22px;transition:all .2s}
.nb-card:hover{transform:translate(-4px,-4px)}
.nb-card h3{font-size:20px;margin-bottom:8px;font-family:'Noto Sans SC';font-weight:900}
.nb-card p{font-size:14px;margin-bottom:14px;color:#333}
.nb-c-tag{font-size:11px;font-weight:700;background:#000;color:#fff;padding:4px 8px;display:inline-block}
.nb-card-b{background:#fff;box-shadow:6px 6px 0 #000}
.nb-card-b:hover{box-shadow:10px 10px 0 #000}
.nb-card-g{background:#9ff0c5;box-shadow:6px 6px 0 #000}
.nb-card-g:hover{box-shadow:10px 10px 0 #000}
.nb-card-y{background:#ffe64d;box-shadow:6px 6px 0 #000}
.nb-card-y:hover{box-shadow:10px 10px 0 #000}
.nb-card-p{background:#ffc7e0;box-shadow:6px 6px 0 #000}
.nb-card-p:hover{box-shadow:10px 10px 0 #000}
.nb-card-r{background:#ffd6cc;box-shadow:6px 6px 0 #000}
.nb-card-r:hover{box-shadow:10px 10px 0 #000}

/* ivf */
.nb-ivf{padding:80px 0;background:#9ff0c5;border-top:4px solid #000;border-bottom:4px solid #000}
.nb-ivf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:30px}
.nb-ivf-c{background:#fff;border:3px solid #000;padding:28px;box-shadow:8px 8px 0 #000;position:relative;transition:all .2s}
.nb-ivf-c:hover{transform:translate(-3px,-3px);box-shadow:11px 11px 0 #000}
.nb-ivf-g{position:absolute;top:-20px;right:10px;font-family:'Archivo Black';font-size:70px;-webkit-text-stroke:3px #000;color:transparent;line-height:1}
.nb-ivf-c h3{font-size:22px;margin-bottom:12px;font-family:'Noto Sans SC';font-weight:900}
.nb-ivf-tags{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.nb-ivf-tags span{font-size:11px;font-weight:700;padding:4px 10px;border:2px solid #000}
.nb-ivf-gc{background:#ffe64d}
.nb-ivf-pc{background:#ffc7e0}
.nb-warnbox{background:#fff;border:4px solid #000;padding:22px;box-shadow:8px 8px 0 #000;display:flex;gap:16px;align-items:flex-start}
.nb-warnbox b{font-size:16px;white-space:nowrap;background:#000;color:#fff;padding:4px 10px}
.nb-warnbox p{font-size:14px}

/* process */
.nb-process{padding:80px 0;background:#fff}
.nb-proc-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.nb-proc-list>div{background:#fff;border:3px solid #000;padding:24px;box-shadow:6px 6px 0 #ffe64d;position:relative;transition:all .2s}
.nb-proc-list>div:nth-child(even){box-shadow:6px 6px 0 #ffc7e0}
.nb-proc-list>div:nth-child(3n){box-shadow:6px 6px 0 #9ff0c5}
.nb-proc-list>div:hover{transform:translate(-3px,-3px)}
.nb-proc-list b{font-family:'Archivo Black';font-size:48px;-webkit-text-stroke:2px #000;color:transparent;line-height:1;display:block;margin-bottom:8px}
.nb-proc-list h4{font-family:'Noto Sans SC';font-weight:900;font-size:20px;margin-bottom:6px}
.nb-proc-list p{font-size:14px;color:#333}

/* faq */
.nb-faq{padding:80px 0;background:#ffe64d;border-top:4px solid #000;border-bottom:4px solid #000}
.nb-faq-list{max-width:900px;margin:0 auto}
.nb-fq{background:#fff;border:3px solid #000;margin-bottom:14px;box-shadow:5px 5px 0 #000}
.nb-fq[open] summary{border-bottom:3px solid #000;background:#9ff0c5}
.nb-fq summary{list-style:none;padding:18px 22px;font-weight:900;font-size:16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.nb-fq summary::marker{display:none}
.nb-fq summary::-webkit-details-marker{display:none}
.nb-fq summary i{width:14px;height:14px;border-right:3px solid #000;border-bottom:3px solid #000;transform:rotate(45deg);transition:transform .2s}
.nb-fq[open] summary i{transform:rotate(-135deg)}
.nb-fq>div{padding:20px 22px;font-size:14px;line-height:1.8}

/* news */
.nb-news{padding:80px 0;background:#fff}
ul.article-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;list-style:none;margin:0;padding:0;width:100%;box-sizing:border-box}
ul.article-cards>li.article-card{min-width:0;width:auto;max-width:none;margin:0;float:none;box-sizing:border-box;background:#fff;border:3px solid #000;padding:0;box-shadow:5px 5px 0 #9ff0c5;overflow:hidden;transition:all .2s}
ul.article-cards>li.article-card:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 #9ff0c5}
.article-card .card-thumb{width:100%;overflow:hidden;border-bottom:3px solid #000}
.article-card .card-thumb img{display:block;width:100%;max-width:100%;height:180px;object-fit:cover}
.article-card .card-body{padding:16px}
.article-card .card-title{overflow-wrap:anywhere;font-weight:900;font-size:15px;margin-bottom:8px;line-height:1.4;color:#000}
.article-card .card-title a{color:#000}
.article-card .card-date{display:block;font-size:12px;font-weight:700;color:#0d9488;margin-bottom:8px}
.article-card .card-summary{overflow-wrap:anywhere;font-size:13px;color:#333;line-height:1.6}

/* about */
.nb-about{padding:80px 0;background:#0b0b0b;color:#fff}
.nb-ab-in{display:grid;grid-template-columns:1.3fr .9fr;gap:60px;align-items:center}
.nb-ab-l h2{font-size:42px;margin:16px 0 16px}
.nb-ab-l p{opacity:.9;margin-bottom:24px}
.nb-ab-l ul{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.nb-ab-l ul li{padding:10px 14px;border:2px solid #fff;font-weight:700;font-size:14px;background:rgba(255,255,255,.05)}
.nb-chip-black{border-color:#fff;box-shadow:3px 3px 0 #9ff0c5}
.nb-dis{background:#9ff0c5;color:#000;border:4px solid #fff;padding:28px;box-shadow:8px 8px 0 #fff}
.nb-dis h3{font-family:'Noto Sans SC';font-weight:900;font-size:22px;margin-bottom:14px;border-bottom:3px solid #000;padding-bottom:10px}
.nb-dis p{font-size:14px;margin-bottom:18px}

/* contact */
.nb-contact{padding:80px 0;background:#fff}
.nb-ct-in{display:grid;grid-template-columns:1fr 1.1fr;gap:50px;align-items:flex-start}
.nb-ct-l h2{font-size:44px;margin:14px 0 18px}
.nb-ct-l p{margin-bottom:24px;max-width:440px}
.nb-bigphone{display:inline-block;font-family:'Archivo Black';font-size:30px;padding:20px 30px;background:#000;color:#ffe64d;border:4px solid #000;box-shadow:8px 8px 0 #9ff0c5;transform:rotate(-1deg)}
.nb-bigphone:hover{transform:rotate(0) translate(-2px,-2px);box-shadow:10px 10px 0 #9ff0c5}
.nb-form{background:#ffc7e0;border:4px solid #000;padding:30px;box-shadow:10px 10px 0 #000}
.nb-form h3{font-family:'Noto Sans SC';font-weight:900;font-size:24px;margin-bottom:20px;border-bottom:3px solid #000;padding-bottom:10px}
.nb-form label{display:block;font-weight:700;font-size:13px;margin-bottom:14px}
.nb-f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.nb-form input,.nb-form select,.nb-form textarea{width:100%;padding:12px;border:3px solid #000;background:#fff;font-family:inherit;font-size:14px;margin-top:6px}
.nb-form textarea{resize:vertical}

/* DETAIL */
.nb-detail{padding:50px 0 80px;background:#fff}
.nb-bread{font-size:13px;color:#666;margin-bottom:24px;font-weight:700}
.nb-bread a{color:#0d9488}
.nb-art{max-width:820px;margin:0 auto;background:#fff}
.nb-at{font-size:38px;line-height:1.25;margin-bottom:16px}
.nb-ameta{display:flex;gap:16px;font-size:13px;color:#666;margin-bottom:20px;font-weight:700}
.nb-asum{background:#9ff0c5;border:3px solid #000;padding:18px;margin-bottom:24px;font-size:15px;box-shadow:5px 5px 0 #000}
.nb-acov{border:3px solid #000;margin-bottom:24px;box-shadow:6px 6px 0 #000;overflow:hidden}
.nb-acov img{width:100%;height:auto}
.nb-abody{font-size:16px;line-height:1.9}
.nb-abody p{margin-bottom:18px}
.nb-abody h2,.nb-abody h3,.nb-abody h4{margin:28px 0 14px;font-weight:900}
.nb-abody h2{font-size:26px}
.nb-abody h3{font-size:22px}
.nb-abody h4{font-size:18px}
.nb-abody img{width:100%;max-width:100%;height:auto;margin:16px 0;border:3px solid #000;box-shadow:4px 4px 0 #000}
.nb-abody ul,.nb-abody ol{padding-left:22px;margin-bottom:16px}
.nb-abody li{margin-bottom:6px}
.nb-disclaimer{background:#ffe64d;border:3px solid #000;padding:22px;margin:30px 0;box-shadow:5px 5px 0 #000}
.nb-disclaimer h4{margin-bottom:8px}
.nb-arel{margin-bottom:24px}
.nb-arel h4{margin-bottom:14px}
.nb-atags{display:flex;gap:10px;flex-wrap:wrap}
.nb-atags a{padding:8px 14px;background:#fff;border:3px solid #000;font-weight:700;font-size:13px;box-shadow:3px 3px 0 #9ff0c5}
.nb-atags a:hover{background:#9ff0c5;transform:translate(-2px,-2px);box-shadow:5px 5px 0 #000}
.nb-act{display:flex;gap:14px;flex-wrap:wrap}

/* FOOTER */
.nb-foot{background:#0b0b0b;color:#fff;padding:60px 0 0;border-top:6px solid #9ff0c5}
.nb-ft-in{display:grid;grid-template-columns:1.6fr 1fr 1.4fr;gap:40px;padding-bottom:40px;border-bottom:2px solid rgba(255,255,255,.1)}
.nb-ft-logo{margin-bottom:18px;color:#fff}
.nb-ft-logo .nb-logo-mark{box-shadow:4px 4px 0 #ffe64d}
.nb-ft-l p{opacity:.8;margin-bottom:22px;font-size:14px;max-width:380px}
.nb-ft-c h4,.nb-ft-r h4{margin-bottom:16px;font-family:'Noto Sans SC';font-weight:900;font-size:16px}
.nb-ft-c a{display:block;padding:6px 0;opacity:.8;font-size:14px}
.nb-ft-c a:hover{opacity:1;color:#9ff0c5}
.nb-ft-r a{display:inline-block;margin:4px 6px 4px 0;font-size:13px;opacity:.7}
.nb-ft-r a:hover{opacity:1;color:#9ff0c5}
.nb-ft-bottom{padding:20px 0;background:#000}
.nb-ftb-in{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;font-size:12px;opacity:.7}
.nb-ftb-in a{color:#9ff0c5}

/* responsive */
@media (max-width:1024px){
  .nb-hero h1{font-size:56px}
  .nb-h-frame img{height:380px}
  .nb-svc-grid{grid-template-columns:repeat(2,1fr)}
  .nb-ivf-grid{grid-template-columns:1fr}
  .nb-proc-list{grid-template-columns:repeat(2,1fr)}
  .nb-ab-in,.nb-ct-in{grid-template-columns:1fr;gap:40px}
  .nb-ft-in{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .nb-nav{display:none}
  .nb-ham{display:flex}
  .nb-hero{padding:40px 0 60px}
  .nb-hero-in{grid-template-columns:1fr;gap:40px}
  .nb-hero h1{font-size:44px}
  .nb-hero::before{font-size:180px;top:-10px}
  .nb-h-frame img{height:300px}
  .nb-badge-3{display:none}
  .nb-sec{flex-direction:column;align-items:flex-start}
  .nb-sec h2{font-size:30px}
  .nb-sec-n{font-size:36px}
  .nb-svc{padding:50px 0}
  .nb-svc-grid{grid-template-columns:1fr}
  .nb-ivf,.nb-process,.nb-faq,.nb-news,.nb-about,.nb-contact{padding:50px 0}
  .nb-proc-list{grid-template-columns:1fr}
  .nb-f2{grid-template-columns:1fr}
  .nb-ab-l ul{grid-template-columns:1fr}
  .nb-at{font-size:28px}
  .nb-bigphone{font-size:22px;padding:16px 20px}
  .nb-ft-in{grid-template-columns:1fr}
  .nb-ftb-in{flex-direction:column;align-items:center;text-align:center}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}
