/* team-guide.css — 농구·축구 제작 가이드, 후원·제작 이력 페이지 전용 (2026-09-16) */
.tg-page{background:#fff;color:#111}
.tg-page main{overflow-x:hidden}
.tg-wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.tg-eyebrow{display:inline-block;font-size:12px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#dc2626}
.tg-h2{font-size:clamp(28px,4.2vw,48px);font-weight:900;line-height:1.12;letter-spacing:-.02em;margin:10px 0 14px;color:#111}
.tg-lead{font-size:17px;line-height:1.75;color:#4b5563;max-width:680px}
.tg-sec{padding:96px 0}
.tg-sec--muted{background:#f5f5f4}
.tg-sec--dark{background:#0b0b0c;color:#fff}
.tg-sec--dark .tg-h2{color:#fff}
.tg-sec--dark .tg-lead{color:rgba(255,255,255,.66)}
.tg-sec a{color:inherit}
/* hero */
.tg-hero{position:relative;min-height:640px;display:flex;align-items:flex-end;color:#fff;background:#0b0b0c;isolation:isolate}
.tg-hero__bg{position:absolute;inset:0;z-index:-1}
.tg-hero__bg img{width:100%;height:100%;object-fit:cover;opacity:.62}
.tg-hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,12,.25) 0%,rgba(11,11,12,.55) 45%,#0b0b0c 100%)}
.tg-hero__inner{padding:150px 20px 56px;max-width:1200px;margin:0 auto;width:100%}
.tg-hero h1{font-size:clamp(40px,7.4vw,88px);font-weight:900;line-height:1.02;letter-spacing:-.035em;margin:14px 0 20px}
.tg-hero h1 em{font-style:normal;color:#ef4444}
.tg-hero p.tg-hero__sub{font-size:clamp(16px,1.8vw,20px);line-height:1.7;color:rgba(255,255,255,.78);max-width:640px}
.tg-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.tg-btn{display:inline-flex;align-items:center;gap:8px;height:52px;padding:0 24px;border-radius:999px;font-weight:800;font-size:15px;text-decoration:none!important;transition:transform .15s,background .15s}
.tg-btn:hover{transform:translateY(-1px)}
.tg-btn--red{background:#dc2626;color:#fff!important}
.tg-btn--red:hover{background:#b91c1c}
.tg-btn--ghost{border:1px solid rgba(255,255,255,.4);color:#fff!important}
.tg-btn--ghost:hover{background:rgba(255,255,255,.1)}
.tg-btn--dark{background:#111;color:#fff!important}
.tg-btn--line{border:1px solid #111;color:#111!important;background:#fff}
.tg-btn .material-symbols-outlined{font-size:20px}
/* stats */
.tg-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(255,255,255,.14);border-top:1px solid rgba(255,255,255,.14);margin-top:56px}
.tg-stat{background:#0b0b0c;padding:22px 4px 4px}
.tg-stat b{display:block;font-size:clamp(28px,3.6vw,42px);font-weight:900;letter-spacing:-.03em;line-height:1}
.tg-stat span{display:block;margin-top:8px;font-size:13px;color:rgba(255,255,255,.6);line-height:1.45}
@media(min-width:768px){.tg-stats{grid-template-columns:repeat(4,1fr)}.tg-stat{padding:26px 20px 6px 0}}
/* summary chips (AI-friendly facts) */
.tg-facts{display:grid;gap:12px;grid-template-columns:1fr;margin-top:36px}
@media(min-width:768px){.tg-facts{grid-template-columns:repeat(3,1fr)}}
.tg-fact{border:1px solid #e7e5e4;border-radius:18px;padding:22px;background:#fff}
.tg-fact .material-symbols-outlined{color:#dc2626;font-size:28px}
.tg-fact h3{font-size:17px;font-weight:800;margin:10px 0 6px}
.tg-fact p{font-size:14.5px;line-height:1.65;color:#57534e}
/* grade cards */
.tg-grades{display:grid;gap:16px;grid-template-columns:1fr;margin-top:40px}
@media(min-width:640px){.tg-grades{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.tg-grades{grid-template-columns:repeat(4,1fr)}}
.tg-grade{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #e7e5e4;border-radius:22px;padding:26px 24px 24px}
.tg-grade--hot{background:#111;color:#fff;border-color:#111}
.tg-grade__tag{position:absolute;top:18px;right:18px;font-size:11px;font-weight:900;letter-spacing:.06em;padding:5px 10px;border-radius:999px;background:#dc2626;color:#fff}
.tg-grade h3{font-size:24px;font-weight:900;letter-spacing:-.02em}
.tg-grade__fabric{font-size:12.5px;color:#78716c;margin-top:4px;line-height:1.5}
.tg-grade--hot .tg-grade__fabric{color:rgba(255,255,255,.6)}
.tg-grade__price{margin:22px 0 4px;font-size:40px;font-weight:900;letter-spacing:-.035em;line-height:1}
.tg-grade__price small{font-size:15px;font-weight:700;margin-left:2px}
.tg-grade__unit{font-size:13px;color:#78716c}
.tg-grade--hot .tg-grade__unit{color:rgba(255,255,255,.6)}
.tg-grade ul{list-style:none;padding:0;margin:20px 0 0;border-top:1px solid #e7e5e4}
.tg-grade--hot ul{border-color:rgba(255,255,255,.16)}
.tg-grade li{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:10px 0;border-bottom:1px solid #f0efee}
.tg-grade--hot li{border-color:rgba(255,255,255,.1)}
.tg-grade li span:last-child{font-weight:700}
.tg-grade__for{margin-top:auto;padding-top:18px;font-size:14px;line-height:1.6;color:#44403c}
.tg-grade--hot .tg-grade__for{color:rgba(255,255,255,.82)}
/* tables */
.tg-tablewrap{overflow-x:auto;border:1px solid #e7e5e4;border-radius:18px;background:#fff;margin-top:14px}
.tg-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
.tg-table th,.tg-table td{padding:14px 18px;text-align:left;border-bottom:1px solid #f0efee;vertical-align:top}
.tg-table thead th{background:#fafaf9;font-size:12.5px;font-weight:800;color:#57534e;letter-spacing:.02em}
.tg-table tr:last-child td{border-bottom:0}
.tg-table td.n{text-align:right;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.tg-table a{color:#b91c1c;font-weight:700}
.tg-cols{display:grid;gap:28px;grid-template-columns:1fr;margin-top:48px}
@media(min-width:900px){.tg-cols{grid-template-columns:1fr 1fr}}
.tg-h3{font-size:20px;font-weight:900;letter-spacing:-.01em}
.tg-note{font-size:13px;color:#78716c;margin-top:10px;line-height:1.6}
.tg-note a{color:#b91c1c;text-decoration:underline}
.tg-discount{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.tg-pill{display:inline-flex;align-items:baseline;gap:8px;padding:14px 18px;border-radius:14px;background:#fff;border:1px solid #e7e5e4;font-size:14px}
.tg-pill b{font-size:22px;font-weight:900;color:#dc2626}
/* steps */
.tg-steps{list-style:none;padding:0;margin:44px 0 0;display:grid;gap:14px;grid-template-columns:1fr;counter-reset:s}
@media(min-width:768px){.tg-steps{grid-template-columns:repeat(5,1fr)}}
.tg-step{position:relative;padding:24px 20px;border-radius:20px;background:#fff;border:1px solid #e7e5e4;counter-increment:s}
.tg-step::before{content:"0" counter(s);display:block;font-size:13px;font-weight:900;color:#dc2626;letter-spacing:.08em}
.tg-step h3{font-size:18px;font-weight:900;margin:10px 0 6px}
.tg-step p{font-size:14px;line-height:1.6;color:#57534e}
.tg-step__time{display:inline-block;margin-top:12px;font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;background:#fef2f2;color:#b91c1c}
/* photo mosaic */
.tg-mosaic{display:grid;gap:10px;grid-template-columns:repeat(2,1fr);margin-top:44px}
@media(min-width:900px){.tg-mosaic{grid-template-columns:repeat(4,1fr);grid-auto-rows:220px}.tg-mosaic .big{grid-column:span 2;grid-row:span 2}.tg-mosaic .wide{grid-column:span 2}}
.tg-tile{position:relative;display:block;overflow:hidden;border-radius:18px;background:#1c1917;aspect-ratio:1/1;text-decoration:none!important}
@media(min-width:900px){.tg-tile{aspect-ratio:auto}}
.tg-tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tg-tile:hover img{transform:scale(1.04)}
.tg-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.82))}
.tg-tile figcaption,.tg-tile .cap{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;color:#fff}
.tg-tile .cap b{display:block;font-size:17px;font-weight:900}
.tg-tile .cap span{display:block;font-size:12.5px;color:rgba(255,255,255,.75);margin-top:2px;line-height:1.4}
/* timeline */
.tg-timeline{list-style:none;padding:0;margin:44px 0 0;border-left:2px solid rgba(255,255,255,.16)}
.tg-timeline li{position:relative;padding:0 0 26px 28px}
.tg-timeline li::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:#0b0b0c;border:2px solid rgba(255,255,255,.5)}
.tg-timeline li.key::before{background:#dc2626;border-color:#dc2626}
.tg-timeline time{display:block;font-size:13px;font-weight:800;color:rgba(255,255,255,.55);letter-spacing:.02em}
.tg-timeline strong{display:block;font-size:18px;font-weight:800;margin-top:3px;color:#fff;line-height:1.4}
.tg-timeline li.key strong{font-size:21px}
.tg-timeline a{font-size:12.5px;color:rgba(255,255,255,.55);text-decoration:underline}
.tg-split{display:grid;gap:48px;grid-template-columns:1fr}
@media(min-width:960px){.tg-split{grid-template-columns:5fr 6fr;align-items:start}}
.tg-sticky{position:sticky;top:110px}
.tg-feature{border-radius:24px;overflow:hidden;background:#1c1917}
.tg-feature img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tg-feature p{padding:16px 20px;font-size:13.5px;color:rgba(255,255,255,.7)}
.tg-list{list-style:none;padding:0;margin:18px 0 0}
.tg-list li{padding:14px 0;border-bottom:1px solid rgba(0,0,0,.08);font-size:15px;line-height:1.6}
.tg-sec--dark .tg-list li{border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.85)}
.tg-list b{font-weight:800}
.tg-list a{color:#b91c1c;text-decoration:underline;font-size:13px;margin-left:4px}
.tg-sec--dark .tg-list a{color:#fca5a5}
/* faq */
.tg-faqs{margin-top:36px;border-top:1px solid #e7e5e4}
.tg-faq{border-bottom:1px solid #e7e5e4}
.tg-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 2px;font-size:17px;font-weight:800}
.tg-faq summary::-webkit-details-marker{display:none}
.tg-faq summary .material-symbols-outlined{transition:transform .2s;color:#a8a29e}
.tg-faq[open] summary .material-symbols-outlined{transform:rotate(45deg);color:#dc2626}
.tg-faq-a{padding:0 2px 24px;font-size:15.5px;line-height:1.8;color:#44403c;max-width:860px}
/* cta */
.tg-cta{position:relative;overflow:hidden;border-radius:28px;background:#dc2626;color:#fff;padding:56px 32px;isolation:isolate}
.tg-cta::after{content:"STIZ";position:absolute;right:-20px;bottom:-60px;font-size:220px;font-weight:900;letter-spacing:-.06em;color:rgba(255,255,255,.1);z-index:-1;line-height:1}
.tg-cta h2{font-size:clamp(28px,4vw,46px);font-weight:900;letter-spacing:-.03em;line-height:1.15}
.tg-cta p{margin-top:10px;font-size:16px;color:rgba(255,255,255,.85)}
.tg-cta .tg-btn--white{background:#fff;color:#b91c1c!important}
.tg-cta .tg-btn--ghost{border-color:rgba(255,255,255,.55)}
.tg-links{display:grid;gap:12px;grid-template-columns:1fr;margin-top:24px}
@media(min-width:768px){.tg-links{grid-template-columns:repeat(3,1fr)}}
.tg-link{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;border-radius:18px;border:1px solid #e7e5e4;text-decoration:none!important;color:#111!important;font-weight:800;background:#fff;transition:border-color .15s}
.tg-link:hover{border-color:#111}
.tg-link small{display:block;font-weight:500;color:#78716c;font-size:13px;margin-top:3px}
.tg-updated{max-width:1200px;margin:0 auto;padding:28px 20px 60px;font-size:12.5px;color:#a8a29e}
@media(max-width:640px){.tg-sec{padding:68px 0}.tg-hero{min-height:560px}.tg-hero__inner{padding-top:120px}.tg-cta{padding:40px 24px}}
.tg-cols>div,.tg-split>*{min-width:0}