@charset "utf-8";
/* Emmanuel Wegulo - Digital Business Card Template - GOLD EDITION */

:root {
    --gold: #E8B84B;
    --gold-lt: #F5D070;
    --gold-dk: #C8981A;
    --gold-bg: #F0C84A;
    --white: #FFFFFF;
    --text: #1A1A1A;
    --text2: #444;
    --text3: #888;
    --card: #FFFFFF;
    --border: rgba(0,0,0,.07);
    --shadow: rgba(0,0,0,.09);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{background:#D4A820;font-family:'Lato',sans-serif;min-height:100vh;display:flex;align-items:center;justify-content:center}
.shell{width:100%;max-width:390px;min-height:100vh;background:var(--gold-bg);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 0 60px rgba(0,0,0,.2)}

.scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.scroll::-webkit-scrollbar{display:none}

.profile-section{
    background:var(--gold-bg);
    padding:1.6rem 1.2rem 1.4rem;
    text-align:center;
    position:relative;
    overflow:hidden;
}
.profile-section::before{
    content:'';position:absolute;top:-30px;left:-30px;
    width:160px;height:160px;border-radius:50%;
    background:rgba(255,255,255,.1);pointer-events:none;
}
.profile-section::after{
    content:'';position:absolute;bottom:-40px;right:-20px;
    width:140px;height:140px;border-radius:50%;
    background:rgba(0,0,0,.06);pointer-events:none;
}
.av-wrap{position:relative;z-index:2;display:inline-block;margin-bottom:.85rem}
.av{
    width:150px;height:150px;border-radius:50%;
    background:linear-gradient(135deg,#C8981A,#E8B84B);
    border:4px solid rgba(255,255,255,.9);
    box-shadow:0 6px 24px rgba(0,0,0,.22);
    display:flex;align-items:center;justify-content:center;
    font-family:'Montserrat',sans-serif;font-size:2.6rem;font-weight:900;color:#fff;
    cursor:pointer;transition:transform .2s;
    overflow:hidden;
}
.av img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.av:hover{transform:scale(1.04)}
.profile-name{font-family:'Montserrat',sans-serif;font-size:1.55rem;font-weight:900;color:var(--text);letter-spacing:-.01em;margin-bottom:.18rem;position:relative;z-index:2}
.profile-role{font-size:0.95rem;font-weight:700;color:var(--text2);margin-bottom:.12rem;position:relative;z-index:2}
.profile-company{font-size:0.95rem;font-weight:400; text-transform:uppercase;color:var(--text2);opacity:.75;margin-bottom:1.1rem;position:relative;z-index:2}
.profile-tagline{font-size:.92rem;font-weight:400;color:var(--text2);font-style:italic;margin-bottom:.5rem;position:relative;z-index:2}

/* Icon Action Buttons */
.action-icons{display:flex;justify-content:center;gap:.9rem;margin-bottom:1.2rem;position:relative;z-index:2}
.act-ico{
    width:55px;height:55px;border-radius:55%;
    background:rgba(255,255,255,.9);
    box-shadow:0 3px 12px rgba(0,0,0,.14);
    display:flex;align-items:center;justify-content:center;
    font-size:1rem;color:var(--gold-dk);
    cursor:pointer;text-decoration:none;transition:all .2s;border:none;
}
.act-ico:hover{background:#fff;transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.18);color:var(--text)}

/* Action Buttons - WhatsApp and Exchange same style */
.action-btns{display:flex;gap:.6rem;padding:0 1.2rem 1.4rem;position:relative;z-index:2}
.btn-action{
    flex:1;background:transparent;color:var(--gold-dk);border:2px solid var(--gold-dk);
    padding:.75rem;font-family:'Montserrat',sans-serif;font-size:.8rem;font-weight:800;
    display:flex;align-items:center;justify-content:center;gap:.38rem;
    cursor:pointer;text-decoration:none;transition:all .2s;border-radius:8px
}
.btn-action:hover{background:var(--gold-dk);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}

/* White Cards */
.wcard{background:var(--card);margin:.5rem .8rem;border-radius:14px;overflow:hidden;box-shadow:0 3px 16px var(--shadow)}
.wcard-hdr{padding:.85rem 1.1rem .5rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.wcard-title{font-family:'Montserrat',sans-serif;font-size:.82rem;font-weight:900;color:var(--text);letter-spacing:.04em;text-transform:uppercase}
.wcard-more{font-size:.72rem;font-weight:700;color:var(--gold-dk);cursor:pointer}

/* About */
.about-text{font-size:.84rem;font-weight:400;color:var(--text2);line-height:1.75;padding:.65rem 1.1rem .9rem}
.about-text strong{color:var(--gold-dk);font-weight:700}

/* Services with Price and CTA Button */
.services-section{background:var(--card);margin:.5rem .8rem;border-radius:14px;overflow:hidden;box-shadow:0 3px 16px var(--shadow);padding:0.5rem 0}
.svc-card{background:#FAFAFA;margin:0.5rem 0.8rem;border-radius:12px;overflow:hidden;border:1px solid var(--border);transition:all .22s}
.svc-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--shadow);border-color:var(--gold-dk)}
.svc-img{width:100%;height:140px;object-fit:cover;display:block;cursor:pointer}
.svc-body{padding:0.8rem 1rem}
.svc-name{font-family:'Montserrat',sans-serif;font-size:0.95rem;font-weight:800;color:var(--text);margin-bottom:0.2rem}
.svc-desc{font-size:0.75rem;font-weight:400;color:var(--text2);line-height:1.5;margin-bottom:0.5rem}
.svc-footer-row{display:flex;align-items:center;justify-content:space-between;margin-top:0.4rem;padding-top:0.4rem;border-top:1px solid var(--border)}
.svc-price{font-size:0.85rem;font-weight:800;color:var(--gold-dk);margin:0}
.svc-cta-link{display:inline-flex;align-items:center;gap:0.3rem;background:var(--gold-dk);color:#fff;padding:0.3rem 0.7rem;border-radius:20px;text-decoration:none;font-weight:700;font-size:0.65rem;text-transform:uppercase;letter-spacing:.05em;transition:all .2s;cursor:pointer}
.svc-cta-link:hover{background:var(--gold);transform:translateY(-1px)}
.svc-cta-link i{font-size:0.55rem}

/* Gallery Carousel */
.carousel-sec{position:relative;margin:0 .8rem .5rem;border-radius:14px;overflow:hidden}
.prop-img{width:100%;height:230px;object-fit:cover;display:block;cursor:pointer}
.carousel-indicators [data-bs-target]{width:20px;height:2px;background:var(--gold-dk);border:none;opacity:.5}
.carousel-indicators .active{opacity:1;width:30px}
.carousel-control-prev,.carousel-control-next{width:32px;height:32px;top:50%;transform:translateY(-50%);background:rgba(200,152,26,.7);margin:0 .5rem;opacity:1;border-radius:50%}

/* Reviews Section - Centered */
.reviews-section{background:var(--card);margin:.5rem .8rem;border-radius:14px;overflow:hidden;box-shadow:0 3px 16px var(--shadow);padding-bottom:.5rem}
.review-slide{padding:0.8rem 1rem;text-align:center}
.review-top{display:flex;flex-direction:column;align-items:center;gap:0.4rem;margin-bottom:0.8rem}
.review-av{width:55px;height:55px;border-radius:50%;object-fit:cover;border:2px solid var(--gold-dk);cursor:pointer}
.review-name{font-family:'Montserrat',sans-serif;font-size:0.9rem;font-weight:800;color:var(--text)}
.review-role{font-size:0.68rem;font-weight:400;color:var(--text3)}
.review-stars{color:var(--gold-dk);font-size:0.8rem;margin-top:0.2rem}
.review-text{font-size:0.82rem;font-weight:400;color:var(--text2);line-height:1.6;font-style:italic}
.reviews-car .carousel-indicators{bottom:-5px}
.reviews-car .carousel-indicators [data-bs-target]{background:var(--text3);opacity:.4;width:12px;height:2px;border:none;border-radius:1px}
.reviews-car .carousel-indicators .active{background:var(--gold-dk);opacity:1;width:20px}

/* Contact Form */
.form-sec{background:var(--card);margin:.5rem .8rem;border-radius:14px;overflow:hidden;box-shadow:0 3px 16px var(--shadow);padding:0.8rem}
.form-input{width:100%;background:#F5F5F5;border:1.5px solid rgba(0,0,0,.08);border-radius:10px;padding:0.7rem 1rem;font-family:'Lato',sans-serif;font-size:0.85rem;color:var(--text);outline:none;margin-bottom:0.6rem;display:block}
.form-input:focus{border-color:var(--gold-dk);background:#FFFBF0;box-shadow:0 0 0 3px rgba(200,152,26,.1)}
.form-input::placeholder{color:#BBB;font-size:0.8rem}
textarea.form-input{resize:none;min-height:80px}
.btn-form{width:100%;background:var(--gold-dk);color:#fff;border:none;border-radius:10px;padding:0.8rem;font-family:'Montserrat',sans-serif;font-size:0.85rem;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:0.4rem;transition:all .2s}
.btn-form:hover{background:var(--gold);transform:translateY(-1px)}

/* Contact Rows */
.con-row{display:flex;align-items:center;gap:.85rem;padding:.78rem 1.1rem;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text);transition:background .14s}
.con-row:hover{background:#FAFAFA}
.con-row:last-child{border-bottom:none}
.con-ico{width:36px;height:36px;border-radius:9px;background:rgba(232,184,75,.15);display:flex;align-items:center;justify-content:center;font-size:.88rem;color:var(--gold-dk);flex-shrink:0}
.con-lbl{font-size:.6rem;font-weight:700;color:var(--text3);letter-spacing:.1em;text-transform:uppercase}
.con-val{font-size:.85rem;font-weight:700;color:var(--text)}
.con-arr{margin-left:auto;font-size:.78rem;color:#CCC}
.con-row:hover .con-arr{color:var(--gold-dk)}

/* Social Rows */
.soc-row{
    display:flex;align-items:center;gap:.85rem;
    padding:.8rem 1.1rem;
    border-bottom:1px solid var(--border);
    text-decoration:none;color:var(--text);
    transition:background .14s;cursor:pointer;
}
.soc-row:hover{background:#FAFAFA}
.soc-row:last-child{border-bottom:none}
.soc-ico-wrap{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#fff;flex-shrink:0}
.soc-name{font-family:'Montserrat',sans-serif;font-size:.86rem;font-weight:800;color:var(--text)}
.soc-sub{font-size:.7rem;font-weight:400;color:var(--text3)}
.soc-arr{margin-left:auto;font-size:.8rem;color:#CCC;flex-shrink:0}
.soc-row:hover .soc-arr{color:var(--gold-dk)}

/* Web Links */
.link-row{display:flex;align-items:center;gap:.85rem;padding:.72rem 1.1rem;border-top:1px solid var(--border);text-decoration:none;color:var(--text);transition:background .15s;cursor:pointer}
.link-row:hover{background:#FAFAFA}
.link-ico{width:36px;height:36px;border-radius:10px;background:rgba(232,184,75,.15);display:flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--gold-dk);flex-shrink:0}
.link-name{font-size:.85rem;font-weight:600;color:var(--text);flex:1}
.link-arr{font-size:.78rem;color:#CCC}

/* Tags */
.tags{display:flex;flex-wrap:wrap;gap:.38rem;padding:.65rem 1.1rem .9rem}
.tag{background:rgba(232,184,75,.15);color:var(--gold-dk);border:1.5px solid rgba(200,152,26,.2);padding:.24rem .72rem;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;border-radius:20px;transition:all .18s;cursor:default}
.tag:hover{background:var(--gold-dk);color:#fff}

/* Business Hours Section - with today highlight */
.hr{display:flex;justify-content:space-between;padding:.52rem 1.1rem;border-bottom:1px solid var(--border)}
.hr:last-child{border-bottom:none}
.hr.today{background:rgba(200,152,26,0.1);margin:0 -0.5rem;padding:0.52rem 1.6rem;border-radius:8px}
.hr-day{font-size:.83rem;font-weight:500;color:var(--text2)}
.hr-time{font-family:'Montserrat',sans-serif;font-size:.84rem;font-weight:800;color:var(--text)}
.hr-closed{font-size:.83rem;color:var(--text3);font-style:italic}
.open-badge{display:inline-flex;align-items:center;gap:.32rem;font-size:.64rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:.18rem .62rem;margin:.7rem 1.1rem .3rem;width:fit-content}
.open-badge.open{color:#2E7D32;background:rgba(46,125,50,.09);border:1px solid rgba(46,125,50,.2)}
.open-badge.closed{color:#DC3545;background:rgba(220,53,69,.1);border-color:rgba(220,53,69,.2)}
.open-dot{width:5px;height:5px;border-radius:50%;animation:blink 2s ease-in-out infinite}
.open-dot.open{background:#2E7D32}
.open-dot.closed{background:#DC3545}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.18}}
.next-open{font-size:.7rem;color:var(--text3);padding:0 1.1rem .8rem;text-align:center}

/* QR */
.qr-sec{padding:1.1rem;text-align:center}
.qr-wrap{display:inline-flex;flex-direction:column;align-items:center;gap:.45rem;cursor:pointer}
.qr-frame{background:#fff;padding:10px;border:2.5px solid var(--gold-dk);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.12);display:inline-block;transition:transform .2s}
.qr-wrap:hover .qr-frame{transform:scale(1.03)}
.qr-frame img{width:110px;height:110px;object-fit:contain;display:block}
.qr-hint{font-size:.67rem;font-weight:800;color:var(--gold-dk);letter-spacing:.1em;text-transform:uppercase}

/* CTA Section */
.cta-section{padding:0.8rem;display:flex;flex-direction:column;gap:0.6rem}
.btn-cta{display:flex;align-items:center;justify-content:center;gap:0.5rem;background:var(--gold-dk);color:#fff;border:none;padding:0.8rem;font-family:'Montserrat',sans-serif;font-size:0.85rem;font-weight:800;border-radius:10px;cursor:pointer;text-decoration:none;transition:all .2s}
.btn-cta:hover{background:var(--gold)}
.btn-cta-outline{display:flex;align-items:center;justify-content:center;gap:0.5rem;background:transparent;color:var(--gold-dk);border:2px solid var(--gold-dk);padding:0.75rem;font-family:'Montserrat',sans-serif;font-size:0.85rem;font-weight:800;border-radius:10px;cursor:pointer;text-decoration:none;transition:all .2s}
.btn-cta-outline:hover{background:var(--gold-dk);color:#fff}

/* Footer */
.footer{background:var(--gold-dk);padding:1.2rem;text-align:center;margin-top:.5rem}
.footer-brand{font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:900;color:#fff;letter-spacing:.08em;margin-bottom:.2rem}
.footer-url{font-size:.68rem;color:rgba(255,255,255,.65)}
.footer-nfc{font-size:.6rem;color:rgba(255,255,255,.55);margin-top:.3rem;display:flex;align-items:center;justify-content:center;gap:.3rem}
.footer-nfc a{color:rgba(255,255,255,.85);text-decoration:none}
.footer-nfc a:hover{text-decoration:underline}
.footer-copyright{font-size:.55rem;color:rgba(255,255,255,.45);margin-top:.3rem;display:flex;align-items:center;justify-content:center;gap:.3rem}

/* Bottom Bar */
.bot-bar{background:var(--gold-dk);border-top:3px solid rgba(255,255,255,.2);padding:.6rem 1.1rem;display:flex;gap:.5rem;flex-shrink:0;position:sticky;bottom:0;z-index:50}
.bb{flex:1;border-radius:8px;padding:.58rem .35rem;font-family:'Montserrat',sans-serif;font-size:.64rem;font-weight:800;display:flex;flex-direction:column;align-items:center;gap:.16rem;cursor:pointer;border:none;transition:all .18s;min-height:44px}
.bb i{font-size:.9rem}
.bb-share{background:rgba(255,255,255,.15);color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.2)}
.bb-share:hover{background:rgba(255,255,255,.25);color:#fff}
.bb-save{background:#fff;color:var(--gold-dk)}
.bb-save:hover{background:var(--gold-lt)}
.bb-qr{background:rgba(255,255,255,.15);color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.2)}
.bb-qr:hover{background:rgba(255,255,255,.25);color:#fff}

/* Modals */
.modal-content{border:none;background:#fff;border-radius:22px 22px 0 0}
.modal.bottom-modal .modal-dialog{margin:0 auto;position:fixed;bottom:0;left:0;right:0;max-width:390px}
.m-hdr{background:var(--gold-bg);border-radius:22px 22px 0 0;border-bottom:1px solid rgba(0,0,0,.08);padding:.88rem 1.2rem;display:flex;align-items:center;justify-content:space-between}
.m-title{font-family:'Montserrat',sans-serif;font-size:.95rem;font-weight:900;color:var(--text);display:flex;align-items:center;gap:.42rem}
.m-title i{color:var(--gold-dk)}
.m-close{background:rgba(0,0,0,.08);border:none;color:var(--text);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.85rem;transition:all .18s}
.m-close:hover{background:var(--gold-dk);color:#fff}
.m-body{padding:1.1rem 1.2rem}
.m-label{font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#888;margin-bottom:.28rem;display:block}
.m-field{margin-bottom:.72rem}
.fi{width:100%;background:#F5F5F5;border:1.5px solid rgba(0,0,0,.1);border-radius:10px;padding:.72rem .92rem;font-family:'Lato',sans-serif;font-size:.88rem;color:var(--text);outline:none;transition:border-color .2s;margin-bottom:.62rem;display:block}
.fi:focus{border-color:var(--gold-dk);background:rgba(232,184,75,.06);box-shadow:0 0 0 3px rgba(232,184,75,.12)}
.fi::placeholder{color:#BBB;font-size:.82rem}
textarea.fi{resize:none;min-height:82px}
.btn-form-modal{width:100%;background:var(--gold-dk);color:#fff;border:none;border-radius:10px;padding:.85rem;font-family:'Montserrat',sans-serif;font-size:.88rem;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.42rem;transition:all .2s}
.btn-form-modal:hover{background:var(--gold);transform:translateY(-1px)}

.share-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;padding:1rem 1.2rem}
.s-plat{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.78rem .35rem;background:#F5F5F5;border:1px solid rgba(0,0,0,.06);border-radius:12px;cursor:pointer;text-decoration:none;transition:all .18s}
.s-plat i{font-size:1.3rem}
.s-plat span{font-size:.57rem;font-weight:700;color:#999;letter-spacing:.04em}
.s-plat:hover{background:var(--gold-bg);border-color:var(--gold)}
.s-plat:hover span{color:var(--text)}
.s-link-box{margin:0 1.2rem 1.2rem;background:#F5F5F5;border:1px solid rgba(0,0,0,.06);border-radius:10px;padding:.58rem .88rem;display:flex;align-items:center;gap:.5rem}
.s-url{flex:1;font-size:.72rem;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s-copy{background:var(--gold-dk);color:#fff;border:none;border-radius:20px;padding:.3rem .78rem;font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:800;cursor:pointer;transition:background .2s;white-space:nowrap}
.s-copy:hover{background:var(--gold)}

.bl-m-item{display:flex;align-items:center;gap:.82rem;padding:.78rem 1.2rem;border-bottom:1px solid rgba(0,0,0,.05);text-decoration:none;color:var(--text);transition:background .14s}
.bl-m-item:hover{background:#FFFBF0}
.bl-m-item:last-child{border-bottom:none}
.bl-m-ico{width:36px;height:36px;background:#F5F5F5;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0}
.bl-m-name{font-size:.88rem;font-weight:700;color:var(--text)}
.bl-m-sub{font-size:.68rem;color:#888}
.bl-m-arr{margin-left:auto;font-size:.76rem;color:#CCC}
.bl-m-item:hover .bl-m-arr{color:var(--gold-dk)}

.qr-modal-body{padding:1.6rem 1.2rem;text-align:center}
.qr-modal-frame{background:#fff;padding:14px;border:2.5px solid var(--gold);border-radius:16px;box-shadow:0 4px 24px rgba(0,0,0,.1);display:inline-block;margin-bottom:.8rem}
.qr-modal-frame img{width:175px;height:175px;object-fit:contain}
.qr-modal-name{font-family:'Montserrat',sans-serif;font-size:1.2rem;font-weight:900;color:var(--text);margin-bottom:.15rem}
.qr-modal-url{font-size:.74rem;color:#888;margin-bottom:1.1rem}
.qr-act-row{display:flex;gap:.6rem}
.qr-act-btn{flex:1;background:var(--gold-dk);color:#fff;border:none;border-radius:10px;padding:.72rem;font-family:'Montserrat',sans-serif;font-size:.82rem;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.38rem;transition:all .2s}
.qr-act-btn:hover{background:var(--gold)}
.qr-act-btn.outline{background:#F5F5F5;color:var(--text2);border:1.5px solid rgba(0,0,0,.1)}
.qr-act-btn.outline:hover{border-color:var(--gold-dk);color:var(--gold-dk)}

.cp-modal{display:none;position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.5);align-items:flex-end;justify-content:center}
.cp-modal.open{display:flex;animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.cp-sheet{background:#fff;width:100%;max-width:390px;border-radius:22px 22px 0 0;animation:slideUp .25s ease;max-height:85vh;overflow-y:auto}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.cp-handle{width:32px;height:3px;background:#DDD;border-radius:2px;margin:.8rem auto .5rem}
.cp-header{padding:.5rem 1.2rem .85rem;text-align:center;border-bottom:1px solid rgba(0,0,0,.06)}
.cp-title{font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:900;color:var(--text);margin-bottom:.12rem;display:flex;align-items:center;justify-content:center;gap:.38rem}
.cp-title i{color:var(--gold-dk)}
.cp-sub{font-size:.72rem;color:#888}
.cp-fields{padding:.65rem 1.2rem;display:flex;flex-direction:column;gap:.4rem}
.cp-field{display:flex;align-items:center;gap:.75rem;padding:.5rem .8rem;background:#F9F9F9;border-radius:10px;border:1px solid rgba(0,0,0,.06)}
.cp-field-ico{font-size:.88rem;color:var(--gold-dk);width:16px;text-align:center;flex-shrink:0}
.cp-field-lbl{font-size:.58rem;font-weight:700;color:#AAA;letter-spacing:.1em;text-transform:uppercase}
.cp-field-val{font-size:.82rem;font-weight:600;color:var(--text);margin-top:.03rem}
.cp-actions{padding:.32rem 1.2rem 1.2rem;display:flex;gap:.55rem}
.cp-ok{flex:1;background:var(--gold-dk);color:#fff;border:none;border-radius:10px;padding:.78rem;font-family:'Montserrat',sans-serif;font-size:.88rem;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.38rem;transition:all .2s}
.cp-ok:hover{background:var(--gold)}
.cp-cancel{flex:1;background:#F5F5F5;color:#888;border:1.5px solid rgba(0,0,0,.09);border-radius:10px;padding:.78rem;font-family:'Montserrat',sans-serif;font-size:.88rem;font-weight:700;cursor:pointer;transition:all .2s}
.cp-cancel:hover{border-color:var(--gold-dk);color:var(--gold-dk)}

.lbox{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.92);align-items:center;justify-content:center;padding:1rem}
.lbox.open{display:flex;animation:fadeIn .2s ease}
.lbox-inner{position:relative;max-width:100%;max-height:90vh;display:flex;flex-direction:column;align-items:center}
.lbox-img{max-width:100%;max-height:76vh;object-fit:contain;border-radius:10px;display:block}
.lbox-cap{margin-top:.6rem;font-size:.82rem;font-weight:800;color:var(--gold-lt);letter-spacing:.1em;text-transform:uppercase;text-align:center}
.lbox-close{position:absolute;top:-12px;right:-12px;width:30px;height:30px;background:var(--gold-dk);color:#fff;border:none;border-radius:50%;font-size:.9rem;font-weight:900;display:flex;align-items:center;justify-content:center;cursor:pointer}
.tap-img{cursor:pointer;transition:opacity .2s}
.tap-img:hover{opacity:.88}

@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.a1{animation:fadeUp .6s .05s both}.a2{animation:fadeUp .6s .18s both}.a3{animation:fadeUp .6s .3s both}
@media(min-width:600px){body{padding:2rem;align-items:center}.shell{min-height:auto;max-height:92vh;border-radius:44px;box-shadow:0 0 0 10px #D4A820,0 0 0 12px #B8901A,0 28px 70px rgba(0,0,0,.35)}}