
/* ==========================================================
   Potentialloops Professional Subpage System
   Shared responsive polish for research, business and service pages
   ========================================================== */
:root{
    --pl-navy:#102b4c;
    --pl-blue:#145b91;
    --pl-teal:#08a9a5;
    --pl-ink:#172b45;
    --pl-muted:#66768a;
    --pl-line:#e3ebf3;
    --pl-soft:#f5f9fc;
}
body{color:var(--pl-ink);overflow-x:hidden}
img{max-width:100%;height:auto}
a{transition:all .2s ease}
.service-detail-hero,.business-page-hero{
    padding:145px 0 85px;
    background:
      radial-gradient(circle at 90% 15%,rgba(8,169,165,.12),transparent 28%),
      radial-gradient(circle at 10% 20%,rgba(20,91,145,.10),transparent 30%),
      linear-gradient(135deg,#f8fbff,#eef7fd 60%,#f8fffe);
}
.service-detail-hero h1,.business-page-hero h1{
    color:var(--pl-navy);
    font-size:clamp(38px,5vw,64px);
    line-height:1.08;
    font-weight:900;
    letter-spacing:-1.8px;
    margin:14px 0 22px;
}
.service-detail-hero h1 span,.business-page-hero h1 span{color:var(--pl-teal)}
.service-detail-hero p,.business-page-hero p{
    max-width:820px;
    color:var(--pl-muted);
    font-size:18px;
    line-height:1.85;
}
.eyebrow,.pl-eyebrow{
    display:inline-block;
    color:var(--pl-teal);
    font-size:12px;
    font-weight:900;
    letter-spacing:1.4px;
    text-transform:uppercase;
}
.detail-stat-card{
    background:var(--pl-navy);
    color:#fff;
    border-radius:24px;
    padding:30px;
    box-shadow:0 24px 55px rgba(16,43,76,.16);
}
.detail-stat-card strong{display:block;font-size:22px;margin-bottom:10px}
.detail-stat-card span{display:block;color:#dbe8f2;line-height:1.7}
.section{padding:86px 0}
.section-header{max-width:850px;margin:0 auto 42px}
.section-header h2{color:var(--pl-navy);font-size:clamp(30px,4vw,46px);font-weight:900;line-height:1.15}
.section-header p{color:var(--pl-muted);font-size:17px;line-height:1.8}
.section-tag{
    color:var(--pl-teal);
    text-transform:uppercase;
    letter-spacing:1.2px;
    font-size:12px;
    font-weight:900;
}
.detail-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
}
.detail-item{
    background:#fff;
    border:1px solid var(--pl-line);
    border-radius:20px;
    padding:28px;
    box-shadow:0 8px 28px rgba(16,43,76,.04);
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.detail-item:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 42px rgba(16,43,76,.09);
    border-color:#cbdde9;
}
.detail-item>i{
    width:48px;height:48px;border-radius:14px;
    display:inline-flex;align-items:center;justify-content:center;
    background:#edf7fb;color:var(--pl-blue);font-size:19px;
    margin-bottom:18px;
}
.detail-item h3{color:var(--pl-navy);font-size:21px;font-weight:800;margin-bottom:10px}
.detail-item p{color:var(--pl-muted);line-height:1.75;margin-bottom:0}
.business-dark{
    background:var(--pl-navy)!important;
    color:#fff;
}
.business-dark h2,.business-dark h3{color:#fff}
.business-dark p{color:#d4e0eb;line-height:1.8}
.business-link{color:var(--pl-blue);font-weight:800;text-decoration:none}
.business-link:hover{color:var(--pl-teal)}
.usecase-list{display:grid;gap:12px}
.usecase-list>div{
    display:flex;gap:12px;align-items:flex-start;
    padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);
}
.usecase-list i{color:#62d8d1;margin-top:4px}
.pl-final-cta{
    padding:75px 0;
    background:linear-gradient(135deg,#f1f9fc,#f7fffe);
    border-top:1px solid var(--pl-line);
}
.pl-final-cta h2{color:var(--pl-navy);font-size:clamp(30px,4vw,46px);font-weight:900;line-height:1.15;margin:10px 0 12px}
.pl-final-cta p{color:var(--pl-muted);font-size:17px;line-height:1.8;max-width:820px}
.pl-cta-btn{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:54px;padding:0 23px;border-radius:12px;
    background:var(--pl-navy);color:#fff;text-decoration:none;font-weight:800;
}
.pl-cta-btn:hover{background:var(--pl-blue);color:#fff;transform:translateY(-2px)}
.consultation-form-card{
    background:#fff;
    border:1px solid var(--pl-line);
    border-radius:24px;
    padding:32px;
    box-shadow:0 24px 60px rgba(16,43,76,.10);
}
.consultation-form-card h3{color:var(--pl-navy);font-weight:900}
.consultation-form-card .form-label{font-weight:700;color:#324961}
.consultation-form-card .form-control,.consultation-form-card .form-select{
    min-height:48px;border-radius:10px;border-color:#d4e0ea;
}
.consultation-form-card textarea.form-control{min-height:130px}
.consultation-form-card .form-control:focus,.consultation-form-card .form-select:focus{
    border-color:var(--pl-teal);
    box-shadow:0 0 0 .2rem rgba(8,169,165,.12);
}
.btn-primary-custom,.btn-submit{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:52px;padding:0 22px;border:0;border-radius:11px;
    background:var(--pl-navy);color:#fff;text-decoration:none;font-weight:800;
}
.btn-primary-custom:hover,.btn-submit:hover{background:var(--pl-blue);color:#fff;transform:translateY(-1px)}
.btn-outline-custom{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:52px;padding:0 22px;border:1px solid #bfd0df;border-radius:11px;
    background:#fff;color:var(--pl-navy);text-decoration:none;font-weight:800;
}
.btn-outline-custom:hover{border-color:var(--pl-blue);color:var(--pl-blue)}
@media(max-width:991px){
    .service-detail-hero,.business-page-hero{padding:120px 0 65px}
    .detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:767px){
    .service-detail-hero,.business-page-hero{padding:100px 0 55px}
    .section{padding:62px 0}
    .detail-grid{grid-template-columns:1fr;gap:16px}
    .detail-item{padding:23px}
    .detail-stat-card{padding:24px}
    .consultation-form-card{padding:22px;border-radius:18px}
    .pl-final-cta{padding:55px 0}
    .pl-cta-btn{width:100%}
    .btn-primary-custom,.btn-outline-custom{width:100%}
}
