/* Obra Láser · blog público, primera etapa de desarrollo */
.blog-hero{padding:100px 0 85px;overflow:hidden}
.blog-hero-layout{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:72px}
.blog-hero h1{max-width:670px;margin:0;font-size:clamp(3.4rem,6.5vw,6.2rem);letter-spacing:-.07em;line-height:1.03}
.blog-hero h1 span{color:var(--orange)}
.blog-lead{max-width:570px;margin:26px 0 30px;font-size:1.17rem;color:#b5b8bd}
.blog-hero-art{height:390px;min-width:0;position:relative;isolation:isolate;overflow:hidden;border-radius:28px;background:radial-gradient(circle at 72% 28%,rgba(255,122,26,.16),transparent 53%),#111316}
.blog-art-grid{position:absolute;inset:0;opacity:.38;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(90deg,transparent,black)}
.blog-art-square{position:absolute;width:170px;height:170px;top:74px;left:23%;border:2px solid #f58233;transform:rotate(-14deg);box-shadow:0 0 0 12px rgba(255,122,26,.04),0 0 60px rgba(255,122,26,.18)}
.blog-art-square-two{width:150px;height:150px;left:43%;top:125px;transform:rotate(15deg);border-color:#666a6d;box-shadow:none}
.blog-art-laser{position:absolute;left:56%;top:-30px;height:370px;width:2px;background:linear-gradient(transparent,#ff872e 30%,#ff872e 70%,transparent);transform:rotate(35deg);filter:drop-shadow(0 0 14px #ff872e)}
.blog-art-mark{position:absolute;bottom:24px;left:30px;font-weight:800;letter-spacing:.15em;color:#e5e6e7}
.blog-art-mark span{color:var(--orange)}
.blog-list-section{padding-top:70px}
.blog-notice{display:flex;align-items:flex-start;gap:12px;max-width:900px;margin:0 0 52px;padding:15px 19px;border:1px solid rgba(255,122,26,.25);border-radius:12px;background:rgba(255,122,26,.07);color:#e5b997;font-size:.91rem}
.blog-notice span{color:var(--orange)}
.blog-heading{max-width:780px;margin-bottom:32px}
.blog-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.blog-filter{border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.025);padding:11px 19px;color:#c8cacf;cursor:pointer;font-weight:650;font-size:.87rem}
.blog-filter:hover,.blog-filter:focus-visible{border-color:var(--orange-2);color:white}
.blog-filter.is-active{color:#101010;border-color:var(--orange);background:var(--orange)}
.blog-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.blog-card{border-radius:22px;overflow:hidden;min-width:0;display:flex;flex-direction:column;box-shadow:none;transition:transform .2s,border-color .2s}
.blog-card:hover{transform:translateY(-4px);border-color:rgba(255,122,26,.38)}
.blog-card[hidden]{display:none!important}
.blog-card-visual{height:194px;position:relative;overflow:hidden;background:#171a1d}
.blog-card-visual>span{position:absolute;top:20px;left:22px;font-size:.72rem;color:#e1e1e1;letter-spacing:.19em;font-weight:800}
.blog-visual-guide{background:radial-gradient(circle at 80% 30%,rgba(255,122,26,.26),transparent 43%),linear-gradient(130deg,#1c2228,#16181a)}
.blog-visual-lines{width:126px;height:105px;border:3px solid #ff8d3c;border-bottom-color:transparent;position:absolute;top:64px;right:48px;transform:skew(-13deg) rotate(12deg);box-shadow:17px -14px 0 -5px #575a5b}
.blog-visual-money{background:radial-gradient(circle at 70% 46%,rgba(255,255,255,.09),transparent 48%),#202022}
.blog-visual-circle{width:135px;height:135px;position:absolute;right:48px;top:40px;border-radius:50%;border:15px solid rgba(255,122,26,.3);box-shadow:0 0 0 2px rgba(255,122,26,.53)}
.blog-visual-update{background:linear-gradient(140deg,#1b1b1f,#26201a)}
.blog-visual-cross{width:150px;height:150px;position:absolute;right:55px;top:42px;border:2px dashed #9c694d;transform:rotate(22deg)}
.blog-visual-cross:after{content:"";position:absolute;inset:34px;border:2px solid var(--orange)}
.blog-card-content{display:flex;flex-direction:column;flex:1;padding:26px 25px 30px}
.blog-card-top{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:22px}
.blog-pill{display:inline-flex;align-items:center;padding:5px 10px;background:rgba(255,122,26,.12);border-radius:7px;color:#ffa65c;font-size:.76rem;font-weight:750}
.blog-state{font-size:.69rem;letter-spacing:.03em;color:#92969b;text-transform:uppercase}
.blog-card h3{font-size:1.45rem;line-height:1.18;letter-spacing:-.034em;margin:0 0 14px}
.blog-card p{font-size:.94rem;color:#afb2b7;line-height:1.65;margin:0 0 26px}
.blog-card .text-link{margin-top:auto;font-size:.9rem;color:#ffac6f}
.blog-card .muted{color:#8f949a}
.blog-empty{padding:20px;color:#b2b3b7}
.blog-end{border-top:1px solid var(--line)}
.blog-end-layout{display:flex;gap:48px;align-items:center;justify-content:space-between}
.blog-end h2{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.045em;margin:0 0 14px}
.blog-end p:not(.eyebrow){max-width:620px;color:#aeb1b6}
.blog-end .button{flex-shrink:0}
.blog-article{padding:42px 0 105px}
.blog-article-shell{max-width:1100px}
.blog-breadcrumb{display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:#90959b;font-size:.85rem;margin-bottom:76px}
.blog-breadcrumb a:hover{color:var(--orange-2)}
.blog-article-top{max-width:850px;margin:0 auto 52px;text-align:center}
.blog-article-top h1{font-size:clamp(2.7rem,6vw,5.2rem);letter-spacing:-.065em;line-height:1.07;margin:0}
.blog-article-lead{font-size:1.18rem;line-height:1.8;color:#adb1b6;margin:23px auto;max-width:750px}
.blog-article-disclaimer{display:inline-block;padding:9px 14px;border:1px solid rgba(255,122,26,.3);border-radius:12px;color:#ffb07a;background:rgba(255,122,26,.065);font-size:.83rem}
.blog-article-cover{height:360px;border-radius:25px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:radial-gradient(circle at 53% 44%,rgba(255,122,26,.13),transparent 40%),#111518}
.blog-cover-frame{display:flex;align-items:center;gap:34px;color:#d8d8db;font-size:.8rem;font-weight:800;letter-spacing:.12em}
.blog-cover-frame div{width:180px;height:140px;transform:skew(-12deg);border:3px solid var(--orange);box-shadow:12px -12px 0 -4px #777}
.blog-article-cover>p{margin:0;color:#9299a0;font-size:.8rem}
.blog-article-body{display:grid;grid-template-columns:200px minmax(0,1fr);gap:75px;max-width:910px;margin:70px auto 0}
.blog-article-side{font-size:.86rem;color:#95989e}
.blog-article-side p{margin-bottom:24px}
.blog-article-prose h2{font-size:clamp(1.65rem,3vw,2rem);line-height:1.2;letter-spacing:-.03em;margin:0 0 19px}
.blog-article-prose p{font-size:1.07rem;line-height:1.85;color:#bcc0c4;margin:0 0 45px}
.blog-article-tip{padding:22px 24px;margin:-6px 0 48px;background:rgba(255,122,26,.065);border-left:3px solid var(--orange);color:#efd6c1;border-radius:0 12px 12px 0}
.blog-article-end{padding-top:12px}
.blog-article-end a{color:#f3f3f3}
@media(max-width:1000px){.blog-hero-layout{gap:35px}.blog-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.blog-hero{padding:65px 0 48px}.blog-hero-layout{grid-template-columns:1fr}.blog-hero-art{height:270px}.blog-hero h1{font-size:clamp(2.9rem,12vw,4.8rem)}.blog-cards{grid-template-columns:1fr}.blog-card-visual{height:185px}.blog-end-layout{display:block}.blog-end .button{margin-top:20px}.blog-breadcrumb{margin-bottom:50px}.blog-article{padding-bottom:70px}.blog-article-cover{height:250px}.blog-article-body{grid-template-columns:1fr;gap:20px;margin-top:48px}.blog-article-side .text-link{display:none}.blog-cover-frame{gap:15px}.blog-cover-frame div{width:110px;height:95px}.blog-article-lead{font-size:1.04rem}}
@media(prefers-reduced-motion:reduce){.blog-card{transition:none}}

/* Compact informational pages. */
.blog-hero{padding:44px 0 36px}.blog-hero-layout{gap:32px}
.blog-hero h1{font-size:clamp(2.3rem,5vw,4.2rem)}.blog-lead{margin:18px 0;font-size:1rem}
.blog-hero-art{height:280px}.blog-list-section{padding-top:36px}.blog-notice{margin-bottom:24px}
.blog-heading{margin-bottom:20px}.blog-filters{gap:8px;margin-bottom:20px}
.blog-cards{gap:14px}.blog-card-content{padding:18px}.blog-card-top{margin-bottom:14px}
.blog-card h3{font-size:1.2rem;margin-bottom:10px}.blog-card p{margin-bottom:16px;line-height:1.5}
.blog-end-layout{gap:24px}
@media(max-width:720px){.blog-hero{padding:28px 0}.blog-hero h1{font-size:2.3rem}.blog-hero-layout{gap:20px}.blog-hero-art{height:220px}.blog-list-section{padding-top:28px}}
