/* Guest Portal styles extracted from portal.blade.php */

/* Utilities */
.full-bleed{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw}
.grad-text{background:linear-gradient(135deg,#0d6efd,#6f42c1);-webkit-background-clip:text;background-clip:text;color:transparent}
.reveal{opacity:0;transform:translateY(12px);transition:all .5s ease}
.reveal.show{opacity:1;transform:none}

/* Hero */
.landing-hero{min-height:80vh;background:url('/background.jpg') center/cover no-repeat;position:relative}
.landing-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(13,110,253,.85) 0%, rgba(25,135,84,.75) 50%, rgba(111,66,193,.65) 100%);z-index:1}
.landing-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 30%, rgba(255,255,255,.08) 0%, transparent 50%),radial-gradient(circle at 80% 70%, rgba(255,255,255,.06) 0%, transparent 50%);z-index:2}
.landing-hero .hero-content{position:relative;z-index:3;color:#fff;padding:80px 0}
@media (max-width: 991.98px){ .landing-hero{min-height:70vh} .landing-hero .hero-content{padding:60px 0} }
@media (max-width: 575.98px){ .landing-hero{min-height:65vh} .landing-hero .hero-content{padding:40px 0} }
.hero-login-card{position:absolute;top:10%;right:32px;transform:translateY(-50%);z-index:4;width:400px;max-width:calc(100vw - 64px)}
.glass-card{backdrop-filter: blur(15px);background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.15)}
.hero-badge{display:inline-flex;align-items:center;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);border-radius:50px;padding:8px 16px;margin-bottom:24px;font-size:14px;font-weight:500}
.hero-badge i{color:#20c997;margin-right:8px}
.typewriter > .text{border-right:3px solid rgba(255,255,255,.9);white-space:nowrap;overflow:hidden;color:#e8f5f0}
.stats{gap:20px;margin-top:32px}
.stats .stat{backdrop-filter: blur(10px);background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:16px 20px;color:#fff;min-width:160px;text-align:center;transition:all .3s ease}
.stats .stat:hover{background:rgba(255,255,255,.25);transform:translateY(-3px)}
.stats .stat .number{font-size:1.75rem;font-weight:700;margin-bottom:4px;color:#fff}
.stats .stat .label{font-size:13px;opacity:.9;text-transform:uppercase;letter-spacing:.5px}
@media (max-width: 991.98px){ .hero-login-card{position:static;transform:none;width:auto;max-width:100%;margin:24px auto 0} }

/* Blogs - Featured + Grid */
.blogs-grid .featured{position:relative;border-radius:18px;overflow:hidden;min-height:320px;background:#f4f6fb;box-shadow:0 10px 28px rgba(0,0,0,.12)}
.blogs-grid .featured img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.blogs-grid .featured:hover img{transform:scale(1.06)}
.blogs-grid .featured::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,110,253,.0) 40%, rgba(0,0,0,.55) 100%)}
.blogs-grid .featured .content{position:absolute;left:0;right:0;bottom:0;z-index:2;color:#fff;padding:18px}
.blogs-grid .chip{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.38);color:#fff;padding:4px 10px;border-radius:999px;font-size:12px}
.blogs-grid .featured h3{font-size:1.25rem;font-weight:700;margin:8px 0 6px}
.blogs-grid .meta{display:flex;align-items:center;gap:8px;color:#dfe7ff;font-size:12px}
.blogs-grid .meta img{width:26px;height:26px;border-radius:50%;object-fit:cover}
.mini-card{border:1px solid #eef2f7;border-radius:14px;background:#fff;overflow:hidden;height:100%;transition:transform .25s ease, box-shadow .25s ease}
.mini-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.12)}
.mini-thumb{position:relative;height:140px;background:#f6f7fb}
.mini-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mini-body{padding:12px 14px}
.mini-title{font-weight:700;margin-bottom:6px}
.mini-excerpt{color:#6b7a90;font-size:14px;margin-bottom:10px}
.mini-meta{display:flex;align-items:center;gap:8px;color:#6b7a90;font-size:12px}
.mini-meta img{width:24px;height:24px;border-radius:50%;object-fit:cover}
@media (max-width: 991.98px){ .blogs-grid .featured{min-height:240px} .mini-thumb{height:120px} }

/* Features Section */
.services-section{background:transparent;position:relative}
.services-section::before{content:"";position:absolute;inset:-10%;z-index:0;background:radial-gradient(55% 45% at 15% 25%, rgba(13,110,253,.22) 0%, rgba(13,110,253,0) 60%),radial-gradient(45% 55% at 85% 35%, rgba(111,66,193,.20) 0%, rgba(111,66,193,0) 60%),radial-gradient(40% 50% at 40% 85%, rgba(13,202,240,.18) 0%, rgba(13,202,240,0) 60%);filter: blur(36px);animation: featureBgFloat 16s ease-in-out infinite alternate}
.services-section::after{content:"";position:absolute;inset:0;z-index:0;background: linear-gradient(120deg, rgba(255,255,255,.06), rgba(255,255,255,0) 60%);background-size: 200% 200%;animation: featureSheen 18s ease-in-out infinite;pointer-events:none}
@keyframes featureBgFloat { 0% { transform: translate3d(0,0,0) scale(1); } 100% { transform: translate3d(-1.5%, -1%, 0) scale(1.03); } }
@keyframes featureSheen { 0% { background-position: 0% 0%; } 100% { background-position: 100% 100%; } }
.features-heading-band{padding:24px 16px;text-align:center}
.features-heading-band h2{margin-bottom:4px}
.features-heading-band p{margin:0;color:#6b7a90}
.features-heading-band, .services-section > .container {position:relative;z-index:1}
.feature-card{position:relative;border-radius:16px;background:#fff;border:1px solid #e9eef3;box-shadow:0 8px 24px rgba(0,0,0,.06);transition:transform .25s ease, box-shadow .25s ease;overflow:hidden}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.12)}
.feature-card::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;background:linear-gradient(135deg,#0d6efd33,#6f42c133);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:2;pointer-events:none}
.feature-card::after{content:"";position:absolute;inset:-10%;z-index:0;pointer-events:none;filter:blur(18px);opacity:.45;will-change:transform;background:radial-gradient(50% 50% at 15% 20%, var(--c1, rgba(13,110,253,.14)) 0%, rgba(13,110,253,0) 60%),radial-gradient(60% 60% at 85% 80%, var(--c2, rgba(111,66,193,.12)) 0%, rgba(111,66,193,0) 60%);animation: cardFloat 12s ease-in-out infinite alternate}
.feature-body{position:relative;z-index:1;padding:16px}
.icon-ring{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:var(--icon-bg,#eef4ff);border:1px solid var(--icon-border,#dfe7ff);color:var(--icon-fg,#0d6efd);font-size:22px}
.feature-title{font-weight:700;margin:10px 0 6px}
.feature-text{color:#536578}
.feature-bullets{margin:10px 0 0 0;padding-left:18px}
.feature-bullets li{margin-bottom:4px;color:#6b7a90;font-size:14px}
.feature-cta{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.features-grid > [class*='col-']:nth-of-type(1) .icon-ring{--icon-bg:#eef4ff;--icon-border:#dfe7ff;--icon-fg:#0d6efd}
.features-grid > [class*='col-']:nth-of-type(2) .icon-ring{--icon-bg:#f1eaff;--icon-border:#e4d6ff;--icon-fg:#6f42c1}
.features-grid > [class*='col-']:nth-of-type(3) .icon-ring{--icon-bg:#e8f8f3;--icon-border:#d2efe6;--icon-fg:#20c997}
.features-grid > [class*='col-']:nth-of-type(4) .icon-ring{--icon-bg:#fff3e8;--icon-border:#ffe3cc;--icon-fg:#fd7e14}
.features-grid > [class*='col-']:nth-of-type(5) .icon-ring{--icon-bg:#e8f9ff;--icon-border:#d0f1ff;--icon-fg:#0dcaf0}
.features-grid > [class*='col-']:nth-of-type(6) .icon-ring{--icon-bg:#eaf5ee;--icon-border:#d3eadd;--icon-fg:#198754}
.features-grid > [class*='col-']:nth-of-type(7) .icon-ring{--icon-bg:#ffeaf4;--icon-border:#ffd3e7;--icon-fg:#d63384}
.features-grid > [class*='col-']:nth-of-type(8) .icon-ring{--icon-bg:#eee8ff;--icon-border:#ddd0ff;--icon-fg:#6610f2}
.features-grid > [class*='col-']:nth-of-type(1) .feature-card{--c1: rgba(13,110,253,.16); --c2: rgba(111,66,193,.14)}
.features-grid > [class*='col-']:nth-of-type(2) .feature-card{--c1: rgba(111,66,193,.16); --c2: rgba(13,202,240,.14)}
.features-grid > [class*='col-']:nth-of-type(3) .feature-card{--c1: rgba(32,201,151,.16); --c2: rgba(13,110,253,.12)}
.features-grid > [class*='col-']:nth-of-type(4) .feature-card{--c1: rgba(253,126,20,.16); --c2: rgba(111,66,193,.12)}
.features-grid > [class*='col-']:nth-of-type(5) .feature-card{--c1: rgba(13,202,240,.16); --c2: rgba(13,110,253,.12)}
.features-grid > [class*='col-']:nth-of-type(6) .feature-card{--c1: rgba(25,135,84,.16); --c2: rgba(111,66,193,.12)}
.features-grid > [class*='col-']:nth-of-type(7) .feature-card{--c1: rgba(214,51,132,.16); --c2: rgba(111,66,193,.12)}
.features-grid > [class*='col-']:nth-of-type(8) .feature-card{--c1: rgba(102,16,242,.16); --c2: rgba(13,110,253,.12)}
@keyframes cardFloat { 0% { transform: translate3d(0,0,0) scale(1); } 100% { transform: translate3d(2%, -2%, 0) scale(1.03); } }
@media (max-width: 991.98px){ .feature-body{padding:14px} }

/* How it works */
.how-heading-band{padding:20px 16px;text-align:center}
.how-heading-band p{margin:0;color:#6b7a90}
.how-step{border:1px solid #eef2f7;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.06);transition:transform .25s ease, box-shadow .25s ease}
.how-step:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.12)}
.icon-pill-xl{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:14px;border:1px solid var(--icon-border,#dfe7ff);background:var(--icon-bg,#eef4ff);color:var(--icon-fg,#0d6efd);font-size:24px}
.num-badge{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:var(--num-bg,#eaf3ff);color:var(--num-fg,#0d6efd);font-weight:700}
.how-grid > [class*='col-']:nth-of-type(1) .icon-pill-xl{--icon-bg:#eef4ff;--icon-border:#dfe7ff;--icon-fg:#0d6efd} .how-grid > [class*='col-']:nth-of-type(1) .num-badge{--num-bg:#eaf3ff;--num-fg:#0d6efd}
.how-grid > [class*='col-']:nth-of-type(2) .icon-pill-xl{--icon-bg:#f1eaff;--icon-border:#e4d6ff;--icon-fg:#6f42c1} .how-grid > [class*='col-']:nth-of-type(2) .num-badge{--num-bg:#efe6ff;--num-fg:#6f42c1}
.how-grid > [class*='col-']:nth-of-type(3) .icon-pill-xl{--icon-bg:#e8f8f3;--icon-border:#d2efe6;--icon-fg:#20c997} .how-grid > [class*='col-']:nth-of-type(3) .num-badge{--num-bg:#ddf6ef;--num-fg:#20c997}
.how-grid > [class*='col-']:nth-of-type(4) .icon-pill-xl{--icon-bg:#fff3e8;--icon-border:#ffe3cc;--icon-fg:#fd7e14} .how-grid > [class*='col-']:nth-of-type(4) .num-badge{--num-bg:#ffe9d6;--num-fg:#fd7e14}

/* Screenshots gallery */
.shots-wrap{position:relative}
.shots-wrap .edge{position:absolute;top:0;bottom:0;width:48px;z-index:2;pointer-events:none}
.shots-wrap .edge.left{left:0;background:linear-gradient(90deg,rgba(255,255,255,1),rgba(255,255,255,0))}
.shots-wrap .edge.right{right:0;background:linear-gradient(270deg,rgba(255,255,255,1),rgba(255,255,255,0))}
.h-scroll{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 8px}
.h-scroll::-webkit-scrollbar{height:8px}
.h-scroll::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:999px}
.shot{scroll-snap-align:start;flex:0 0 auto;width:220px;border-radius:22px;overflow:hidden;border:1px solid #eef2f7;box-shadow:0 8px 22px rgba(0,0,0,.08);background:#000;position:relative;transition:transform .25s ease, box-shadow .25s ease}
.shot:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.14)}
.shot img{display:block;width:100%;height:420px;object-fit:cover}
.device-notch{position:absolute;top:0;left:50%;transform:translate(-50%, -30%);width:96px;height:20px;background:#111;border-bottom-left-radius:12px;border-bottom-right-radius:12px;z-index:1;opacity:.85}
@media (max-width: 991.98px){ .shot{width:180px} .shot img{height:340px} .shots-wrap .edge{width:36px} }
.scroll-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:3}
.scroll-btn.btn-prev{left:-8px}
.scroll-btn.btn-next{right:-8px}
.scroll-btn i{font-size:18px}
.shots-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:1050}
.shots-lightbox.open{display:flex}
.shots-lightbox .inner{max-width:92vw;max-height:92vh;position:relative}
.shots-lightbox img{max-width:100%;max-height:85vh;display:block;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.shots-lightbox .caption{color:#fff;text-align:center;margin-top:8px;font-size:.95rem;opacity:.9}
.shots-lightbox .lb-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center}
.shots-lightbox .lb-prev{left:-56px}
.shots-lightbox .lb-next{right:-56px}
.shots-lightbox .lb-close{top:-48px;right:0;transform:none;width:38px;height:38px}
@media (max-width: 575.98px){ .shots-lightbox .lb-prev{left:-12px} .shots-lightbox .lb-next{right:-12px} .shots-lightbox .lb-close{top:-44px} }

/* CTA section */
.cta-section{background:linear-gradient(135deg,#99d6eb,#add8e6)}
.cta-shape{position:absolute;border-radius:999px;filter:blur(30px);opacity:.4;z-index:0}
.cta-shape.one{width:280px;height:280px;background:rgba(255,255,255,.3);top:10%;left:5%;animation: ctaFloat1 8s ease-in-out infinite alternate}
.cta-shape.two{width:320px;height:320px;background:rgba(255,230,128,.4);bottom:10%;right:8%;opacity:.35;animation: ctaFloat2 10s ease-in-out infinite alternate}
.cta-shape.three{width:200px;height:200px;background:rgba(32,201,151,.25);top:60%;left:15%;animation: ctaFloat3 12s ease-in-out infinite alternate}
@keyframes ctaFloat1 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(20px, -15px) scale(1.1); } }
@keyframes ctaFloat2 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(-25px, 20px) scale(1.05); } }
@keyframes ctaFloat3 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(15px, -10px) scale(1.15); } }
.cta-card{backdrop-filter: blur(12px);background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);border-radius:24px;padding:32px;position:relative;z-index:2}
.cta-pills .pill{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:999px;padding:8px 14px;font-weight:500;transition:all .3s ease}
.cta-pills .pill:hover{background:rgba(255,255,255,.3);transform:translateY(-2px)}
.cta-device{border-radius:24px;overflow:hidden;position:relative;z-index:2}
.cta-device img{width:100%;height:100%;max-height:360px;object-fit:cover}
@media (max-width: 991.98px){ .cta-device img{max-height:260px} .cta-card{padding:24px} .cta-shape{filter:blur(20px)} }
