/* gt-one.net トップ：4つの帯（.st2）と職人の欄（.cr2）を派手に　rk v1113-12（たむさん 11/13 見本 mock_gtone_craft_v3 OK）
   index.html と en/index.html だけが読む。site.css には触らない */
@keyframes cr2shine{0%{background-position:100% 0}100%{background-position:-150% 0}}
@keyframes cr2rise{0%{transform:translate(0,0) scale(1);opacity:0}10%{opacity:1}100%{transform:translate(var(--dx),-700px) scale(.3);opacity:0}}
/* ---- 4つの帯 ---- */
.strip.st2{border:0;border-radius:10px;padding:2px;overflow:visible;background:linear-gradient(90deg,#6d4f22,#fff0c8,#b8925a,#fff0c8,#6d4f22);background-size:200% 100%;animation:cr2shine 6s linear infinite;box-shadow:0 0 50px rgba(255,170,60,.3)}
.strip.st2>div{position:relative;text-align:center;padding:26px 12px 22px;background:linear-gradient(180deg,#14110c,#0a0a0b)!important;border-right:1px solid rgba(232,201,138,.25);border-bottom:0}
.strip.st2>div:first-child{border-radius:8px 0 0 8px}.strip.st2>div:last-child{border-radius:0 8px 8px 0;border-right:0}
.strip.st2>div:after{content:"";position:absolute;left:20%;right:20%;bottom:0;height:2px;background:linear-gradient(90deg,transparent,#e8c98a,transparent)}
.strip.st2 svg{display:block;width:32px;height:32px;margin:0 auto;color:#E8C98A;filter:drop-shadow(0 0 6px rgba(232,180,90,.6))}
.strip.st2 b{margin:10px 0 6px;font-size:24px!important;white-space:nowrap;letter-spacing:.06em;background:linear-gradient(180deg,#fff,#f3dca6 50%,#b8925a);-webkit-background-clip:text;background-clip:text;color:transparent}
.strip.st2>div>span{display:block;color:#cfc9bd!important;font-size:12.5px;letter-spacing:.1em}
html[lang=ja] .strip.st2>div>span{text-transform:none}
@media (max-width:860px){.strip.st2>div{border-bottom:0!important}.strip.st2>div:nth-child(1){border-radius:8px 0 0 0}.strip.st2>div:nth-child(2){border-radius:0 8px 0 0;border-right:0}.strip.st2>div:nth-child(3){border-radius:0 0 0 8px;border-top:1px solid rgba(232,201,138,.25)}.strip.st2>div:nth-child(4){border-radius:0 0 8px 0;border-top:1px solid rgba(232,201,138,.25)}}
@media (max-width:520px){.strip.st2>div{padding:20px 8px 18px}.strip.st2 b{font-size:18px!important;white-space:normal}.strip.st2>div>span{font-size:11px;letter-spacing:.04em}}
/* ---- 職人の欄 ---- */
.craft.cr2{position:relative;background:radial-gradient(ellipse 60% 70% at 25% 50%,rgba(255,120,20,.18),transparent 65%)}
.cr2-emb{position:absolute;inset:-60px 0 0;overflow:hidden;pointer-events:none;z-index:0}
.cr2-emb i{position:absolute;bottom:-10px;width:4px;height:4px;border-radius:50%;background:#ffcf73;box-shadow:0 0 10px 3px rgba(255,150,40,.9);animation:cr2rise linear infinite;opacity:0}
.cr2 .cr-wrap,.cr2 .cr-tx{position:relative;z-index:1}
.cr2 .cr-wrap{padding:3px;border-radius:6px;background:linear-gradient(135deg,#f3dca6,#8a6630 40%,#f3dca6 70%,#6d4f22);box-shadow:0 0 0 1px rgba(255,220,150,.4),0 0 60px rgba(255,150,40,.5),0 0 140px rgba(255,120,20,.25);transform:rotate(-1.2deg)}
.cr2 .cr-wrap:before{content:"";position:absolute;inset:-14px;border:1px solid rgba(232,201,138,.35);border-radius:10px;transform:rotate(2.4deg);pointer-events:none}
.cr2 .cr-ph{border:0}
.cr2 .cr-ph img{filter:contrast(1.12) saturate(1.15)}
.cr2 .ttl{border-left:0;padding-left:0}
.cr2 .ttl .en{display:flex;align-items:center;gap:12px;font-size:14px;color:#ffd894;-webkit-text-fill-color:#ffd894;background:none;text-shadow:0 0 12px rgba(255,190,90,.8)}
.cr2 .ttl .en:before{content:"";width:46px;height:2px;background:linear-gradient(90deg,#E8C98A,transparent)}
.cr2 .ttl h2{margin-top:10px;font-size:clamp(30px,4.4vw,54px);line-height:1.25;background:linear-gradient(100deg,#c79a52 0%,#fff6dc 18%,#e8c98a 32%,#b8925a 50%,#fff6dc 66%,#c79a52 85%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cr2shine 5s linear infinite;filter:drop-shadow(0 0 18px rgba(255,190,90,.35))}
.cr2 .ttl h2 .l-en{font-size:inherit}
.cr2 .cr-tx p{font-size:15.5px;line-height:2.05;color:#d5d1c8}
.cr2 .cr2-lead{display:block;color:#ffd894;font-weight:900;margin-bottom:4px}
.cr2 .qa{counter-reset:cr2q;gap:14px}
.cr2 .qa li{counter-increment:cr2q;position:relative;display:grid;grid-template-columns:48px 1fr;column-gap:12px;align-items:center;padding:16px 40px 16px 14px;border:1px solid rgba(184,146,90,.4);border-left:1px solid rgba(184,146,90,.4);border-radius:8px;background:linear-gradient(160deg,#17140f,#0b0b0c 60%)!important;box-shadow:inset 0 1px 0 rgba(255,230,180,.08),0 8px 24px rgba(0,0,0,.5);overflow:hidden;transition:transform .25s,box-shadow .25s}
.cr2 .qa li:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#6d4f22,#f3dca6,#6d4f22)}
.cr2 .qa li:after{content:counter(cr2q,decimal-leading-zero);position:absolute;right:10px;bottom:4px;font:700 40px/1 var(--disp,sans-serif);color:rgba(232,201,138,.18)}
.cr2 .qa li:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(232,201,138,.7),0 12px 30px rgba(255,170,60,.3)}
.cr2 .qa .ic{grid-row:1/3;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#f6e2b0,#a47a3a 70%);box-shadow:0 0 0 2px rgba(255,230,170,.3),0 0 18px rgba(255,180,70,.6)}
.cr2 .qa .ic svg{width:23px;height:23px;color:#1a140a}
.cr2 .qa b{color:#ffe2a8;font-size:16px;margin:0}
.cr2 .qa li>span{font-size:13px;color:#c9c4ba;line-height:1.6}
@media (max-width:860px){.cr2 .cr-wrap{transform:none}.cr2 .cr-wrap:before{display:none}}
@media (prefers-reduced-motion:reduce){.strip.st2,.cr2 .ttl h2{animation:none}.cr2-emb{display:none}}