/* ATIRO CODE extensions v13. Scoped additions; existing pages remain intact. */
.code-extension-page .product-hero {background:radial-gradient(ellipse at 85% 25%,#d4edf4,transparent 62%),#f6fafb;padding-bottom:66px}
.code-extension-page .product-hero-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(38px,5vw,80px);align-items:center}
.code-extension-page .product-hero h1{font-size:clamp(35px,3.7vw,58px);max-width:680px;line-height:1.45;margin:18px 0}
.code-extension-page .product-lead{font-size:15px;max-width:620px;line-height:2}
.code-extension-page .product-name{font-size:16px;letter-spacing:.08em}
.code-extension-page .product-category{font-size:12px;margin-top:12px}
.code-extension-page .hero-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.code-extension-page .hero-buttons .button{font-size:12px;gap:20px}
.code-extension-page .heading-en{font-size:12px!important;letter-spacing:.12em!important;line-height:1.6!important;margin-top:12px!important;color:var(--deep)}
.code-extension-page .chapter h2 .heading-ja{font-size:clamp(31px,3.4vw,46px)}
.code-extension-page .chapter-description{font-size:14px;line-height:2}
.ce-kicker{font:600 10px/1.6 var(--sans);letter-spacing:.15em;color:var(--deep)}
.ce-parent-link{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--deep);border-bottom:1px solid #a9d7e4;padding-bottom:3px;margin-top:20px}
.ce-chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
.ce-chip{border:1px solid #c4e3ed;background:#fff9;border-radius:30px;font-size:10px;color:var(--deep);padding:5px 11px;line-height:1.7}
.ce-note{font-size:12px;line-height:1.95;color:var(--muted);margin-top:18px}
.ce-hero-visual{border-radius:22px;border:1px solid #c9e3eb;box-shadow:0 24px 64px #09495c0d;background:linear-gradient(150deg,#fff,#edf7fa);padding:28px;position:relative;overflow:hidden}
.ce-visual-top{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}
.ce-mini-brand{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.05em;font-weight:700}
.ce-mini-brand img{width:42px;max-height:46px;object-fit:contain}
.ce-sample{font-size:9px;font-weight:600;letter-spacing:.08em;display:inline-block;border:1px solid #cbe2e9;padding:3px 8px;border-radius:5px;color:var(--muted)}
.ce-input-lanes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ce-lane{background:#fff;border:1px solid #d9e8ed;border-radius:12px;padding:17px 15px;min-width:0}
.ce-lane .ce-icon{margin-bottom:12px}
.ce-lane strong{display:block;font-size:14px;line-height:1.7}
.ce-lane p{font-size:11px;line-height:1.85;color:var(--text);margin-top:7px}
.ce-icon{display:grid;place-items:center;width:40px;height:40px;color:var(--deep);background:#e6f6fa;border-radius:10px}
.ce-icon svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ce-down{display:block;text-align:center;color:var(--brand);font-size:22px;line-height:1;margin:10px 0}
.ce-core{background:var(--ink);border-radius:12px;color:#fff;padding:20px;text-align:center}
.ce-core small{display:block;font-size:9px;letter-spacing:.15em;color:#8bdef3}
.ce-core strong{display:block;font-size:19px;margin-top:5px;font-weight:600}
.ce-core p{font-size:11px;margin-top:5px;color:#c6e5ec}
.ce-output{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ce-output>div{padding:14px 10px;border-radius:10px;background:white;border:1px solid #d1e6ed;text-align:center;font-size:12px;font-weight:600}
.ce-output small{display:block;color:var(--text);font-weight:400;font-size:10px;margin-top:5px}
.ce-visual-caption{font-size:10px;line-height:1.8;color:var(--muted);margin-top:20px}
.ce-auth-art{height:162px;width:100%;object-fit:cover;object-position:center;border-radius:12px;margin-bottom:18px}
.ce-sms-row{display:flex;align-items:center;gap:10px;background:white;border:1px solid #d0e5ee;border-radius:10px;padding:14px;margin-bottom:8px}
.ce-sms-row .ce-icon{flex:none}
.ce-sms-row strong{display:block;font-size:14px}
.ce-sms-row small{font-size:11px;color:var(--text)}
.ce-code-sample{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#e8f6fa;border-radius:10px;padding:14px 17px;margin-top:14px}
.ce-code-sample b{font:600 24px/1.4 var(--sans);letter-spacing:.1em}
.ce-code-sample small{font-size:10px;line-height:1.7;color:var(--deep)}
.ce-stack{display:grid;gap:20px}
.ce-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ce-card{border:1px solid var(--line);background:#fff;border-radius:12px;padding:26px;min-width:0}
.ce-card h3{font-size:20px;line-height:1.6;margin:10px 0 12px}
.ce-card p{font-size:13px;color:var(--text);line-height:1.95}
.ce-card .ce-icon{margin-bottom:15px}
.ce-card .ce-tag{display:inline-block;margin-top:16px;background:#edf7fa;color:var(--deep);font-size:10px;padding:5px 9px;border-radius:4px}
.ce-band{border-left:3px solid var(--brand);background:#eaf7fb;padding:20px 24px}
.ce-band strong{display:block;font-size:16px;margin-bottom:7px}
.ce-band p{font-size:12px;line-height:1.95;color:var(--text)}
.ce-flow{list-style:none;padding:0;margin:0;display:grid}
.ce-flow li{position:relative;display:grid;grid-template-columns:45px minmax(0,1fr);gap:20px;padding:0 0 28px}
.ce-flow li:not(:last-child):before{content:"";position:absolute;left:21px;top:48px;bottom:10px;width:1px;background:#aed6e3}
.ce-flow li:not(:last-child):after{content:"";position:absolute;left:18px;bottom:10px;width:7px;height:7px;border-bottom:1px solid #70b5cc;border-right:1px solid #70b5cc;transform:rotate(45deg)}
.ce-flow-number{display:grid;place-items:center;width:44px;height:44px;border:1px solid #a9d3e2;border-radius:50%;background:#f2fbfe;color:var(--deep);font:600 12px/1 var(--sans)}
.ce-flow h3{font-size:21px;line-height:1.6;margin:7px 0 8px}
.ce-flow p{font-size:13px;color:var(--text);line-height:1.95}
.ce-flow small{display:inline-block;font-size:10px;margin-top:10px;padding:5px 10px;border:1px solid #d2e6ed;background:#fff;border-radius:5px;color:var(--deep)}
.ce-comparison{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.ce-comparison>article{border:1px solid #ccdfe6;padding:22px;border-radius:12px;background:white}
.ce-comparison .is-featured{border-top:3px solid var(--brand);background:#f0fbfe}
.ce-comparison h3{font-size:18px;margin:10px 0 15px;line-height:1.8}
.ce-comparison p{font-size:12px;line-height:1.95;color:var(--text)}
.ce-business-flow{display:grid;gap:10px}
.ce-business-flow>article{display:grid;grid-template-columns:40px 1fr;gap:16px;background:white;border:1px solid #c8e1eb;padding:23px;border-radius:12px}
.ce-business-flow h3{font-size:19px;margin-bottom:8px}
.ce-business-flow p{font-size:13px;color:var(--text);line-height:1.95}
.ce-business-flow>article>span{font:600 12px var(--sans);color:var(--deep);padding-top:9px}
.ce-price-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ce-price{background:#fff;border:1px solid #c9e0e9;border-top:3px solid var(--brand);border-radius:10px;padding:26px}
.ce-price small{display:block;font-size:11px;letter-spacing:.1em;color:var(--text)}
.ce-price strong{font-size:50px;font-weight:600;letter-spacing:-.04em;line-height:1.4;display:block;margin-top:10px}
.ce-price strong span{font-size:20px;letter-spacing:0;margin-left:5px}
.ce-price p{font-size:11px;color:var(--text);line-height:1.85}
.ce-price-check{padding:22px;border:1px solid #c4e2eb;border-radius:12px;background:#edf8fb;display:grid;grid-template-columns:1fr 130px;gap:10px 20px;align-items:center}
.ce-price-check label{font-size:14px;font-weight:600}
.ce-price-check input{width:100%;border:1px solid #a8cddc;background:white;border-radius:5px;min-height:44px;padding:6px 12px;color:var(--ink)}
.ce-price-check output{grid-column:1/-1;font-size:17px;font-weight:600;color:var(--deep);padding-top:8px}
.ce-price-list{padding:0;list-style:none;margin:10px 0 0}
.ce-price-list li{padding:12px 0;border-bottom:1px solid #e1ecf1;font-size:13px}
.ce-price-list li:before{content:"+";display:inline-block;margin-right:12px;color:var(--brand);font-weight:700}
.ce-table-wrap{overflow-x:auto;border:1px solid #d1e3ea;border-radius:10px;background:#fff}
.ce-table{border-collapse:collapse;width:100%;text-align:left;font-size:13px}
.ce-table caption{padding:17px;text-align:left;font-weight:600;color:var(--ink)}
.ce-table th,.ce-table td{padding:15px 18px;border-top:1px solid #dae8ee;line-height:1.8}
.ce-table th{background:#edf7fa;font-weight:500;color:var(--deep)}
.ce-table td:last-child{font-weight:600;white-space:nowrap}
.ce-faq details{border-top:1px solid var(--line)}
.ce-faq details:last-child{border-bottom:1px solid var(--line)}
.ce-faq summary{cursor:pointer;position:relative;list-style:none;font-weight:600;font-size:15px;line-height:1.9;padding:22px 38px 22px 0}
.ce-faq summary:after{content:"+";position:absolute;right:4px;top:20px;color:var(--brand);font-size:20px}
.ce-faq details[open] summary:after{content:"−"}
.ce-faq summary::-webkit-details-marker{display:none}
.ce-faq details p{font-size:13px;color:var(--text);line-height:2;padding:0 20px 24px 0}
.ce-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:25px}
.ce-tabs button{padding:12px 15px;min-height:46px;border:1px solid #c0dce7;border-radius:6px;color:var(--deep);background:white;font-size:12px;font-weight:600}
.ce-tabs button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}
.ce-service-mode{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}
.ce-service-mode>h3{font-size:23px;margin:0 0 10px}
.ce-service-mode>.ce-note{margin:0 0 22px}
.ce-scenario{border-top:1px solid var(--line);padding:24px 0}
.ce-scenario h3{font-size:22px;margin:8px 0 10px}
.ce-scenario p{font-size:13px;color:var(--text);line-height:1.95}
.ce-scenario .ce-measure{font-size:11px;color:var(--deep);margin-top:13px;border-left:2px solid var(--brand);padding-left:12px}
.ce-related-grid{display:grid;gap:15px}
.ce-related-card{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 25px;background:#fff;border:1px solid #cbe1e9;border-radius:10px;transition:background .25s,transform .25s}
.ce-related-card:hover{background:#ebf8fc;transform:translateY(-2px)}
.ce-related-card b{display:block;font-size:20px;line-height:1.5;margin:5px 0 7px}
.ce-related-card p{font-size:12px;line-height:1.9;color:var(--text)}
.ce-related-card>span{color:var(--brand);font-size:24px}
.ce-related-card small{font-size:9px;letter-spacing:.12em;color:var(--deep)}
.code-related-children{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 30px 42px}
.code-related-children a{padding:16px 18px;border:1px solid #285664;background:#ffffff07;border-radius:6px;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:13px;line-height:1.7}
.code-related-children a:hover{background:#ffffff12;border-color:#53b9d6}
.code-related-children a small{display:block;font-size:9px;letter-spacing:.1em;color:#8ed2e4;margin-bottom:5px}
.code-related-children a>span{color:#66cee7}
.ce-inline-nav{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.ce-inline-nav a{display:flex;align-items:center;gap:12px;border:1px solid #b7d8e4;border-radius:6px;padding:12px 16px;font-size:12px;color:var(--deep);background:#fff}
.ce-source-note{font-size:11px;line-height:1.9;color:var(--muted);padding-top:22px;border-top:1px solid var(--line)}
.ce-source-note a{text-decoration:underline}
@media(min-width:1500px){.ce-hero-visual{padding:34px}}
@media(max-width:1000px){.code-extension-page .product-hero-layout{gap:35px}.ce-card{padding:22px}.ce-hero-visual{padding:22px}}
@media(max-width:860px){.code-extension-page .product-hero-layout{display:block}.ce-hero-visual{margin-top:38px;max-width:680px}.code-extension-page .product-hero h1{font-size:43px}.ce-auth-art{height:220px}}
@media(max-width:600px){.code-extension-page .product-hero h1{font-size:34px;line-height:1.5}.code-extension-page .product-lead{font-size:14px}.code-extension-page .hero-buttons{display:grid;grid-template-columns:1fr}.code-extension-page .hero-buttons .button{font-size:13px}.ce-hero-visual{padding:20px 16px;border-radius:14px}.ce-visual-top{margin-bottom:18px;gap:10px}.ce-mini-brand{font-size:10px}.ce-mini-brand img{width:35px}.ce-lane{padding:14px 12px}.ce-lane strong{font-size:13px}.ce-lane p{font-size:11px}.ce-card-grid,.ce-comparison{grid-template-columns:1fr}.ce-card{padding:23px}.ce-card h3{font-size:20px}.ce-price-pair{gap:10px}.ce-price{padding:19px 14px}.ce-price strong{font-size:40px}.ce-price strong span{font-size:16px}.ce-flow li{grid-template-columns:37px 1fr;gap:15px}.ce-flow-number{height:37px;width:37px}.ce-flow li:not(:last-child):before{left:18px;top:43px}.ce-flow li:not(:last-child):after{left:15px}.ce-flow h3{font-size:19px;margin-top:4px}.ce-business-flow>article{padding:20px 16px;grid-template-columns:28px 1fr;gap:10px}.ce-business-flow h3{font-size:19px}.ce-business-flow p{font-size:13px}.ce-faq summary{font-size:14px}.code-related-children{grid-template-columns:1fr;margin-left:0}.ce-related-card{padding:20px}.ce-related-card b{font-size:18px}.ce-auth-art{height:160px}.ce-tabs{gap:6px}.ce-tabs button{font-size:11px;padding:11px 10px}.ce-price-check{grid-template-columns:1fr 100px}.ce-code-sample{padding:12px}.ce-code-sample b{font-size:22px}.code-extension-page .detail-nav>.shell{gap:23px}.ce-source-note{font-size:11px}}
@media(prefers-reduced-motion:reduce){.ce-related-card{transition:none}}
html[data-motion=off] .ce-related-card{transition:none}

.ce-hero-visual{margin:0}
@media(max-width:860px){.ce-hero-visual{margin-top:38px}}

.code-extension-page .ce-title-unit{display:inline-block;white-space:nowrap}