/* =========================================================
   SMART WORLD PUBLISHING PLATFORM 1.2
   Front-end design system
   ========================================================= */

:root{
    --swp-navy:#082f54;
    --swp-navy-dark:#062844;
    --swp-teal:#0b8c8f;
    --swp-teal-dark:#08777a;
    --swp-green:#4a9b55;
    --swp-gold:#c9972c;
    --swp-text:#172a3b;
    --swp-muted:#667887;
    --swp-border:#dfe7eb;
    --swp-soft:#f5f8f9;
    --swp-soft-teal:#eef7f7;
    --swp-white:#fff;
    --swp-shadow:0 12px 34px rgba(8,47,84,.08);
}

.swp-platform-ui,
.swp-page-breakout,
.swp-managed-page,
.swp-magazine-page{
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    color:var(--swp-text);
}

.swp-platform-ui *,
.swp-page-breakout *,
.swp-managed-page *,
.swp-magazine-page *{
    box-sizing:border-box;
}

.swp-page-breakout{
    position:relative;
    width:100vw;
    max-width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    background:#fff;
}

.swp-shell{
    width:min(1320px,calc(100% - 48px));
    margin:0 auto;
}

.swp-directory-page{
    padding:42px 0 54px;
}

.swp-managed-page{
    padding:40px 0 56px;
}

.swp-managed-page-inner{
    max-width:1120px;
}

.swp-managed-page-inner>h1,
.swp-managed-page-inner>h2{
    margin:0 0 10px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:clamp(30px,4vw,44px)!important;
    line-height:1.12!important;
    font-weight:700!important;
}

.swp-managed-page-inner>h3{
    margin:28px 0 8px!important;
    color:var(--swp-navy)!important;
    font-size:20px!important;
    line-height:1.25!important;
}

.swp-managed-page-inner>p{
    margin:0 0 14px!important;
    max-width:840px;
    color:var(--swp-muted)!important;
    font-size:15px!important;
    line-height:1.7!important;
}

/* =========================================================
   PAGE INTRO / SECTION HEADS
   ========================================================= */

.swp-page-intro{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin:0 0 30px;
    padding:0 0 24px;
    border-bottom:1px solid var(--swp-border);
}

.swp-page-intro h1{
    margin:4px 0 8px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:clamp(34px,4.8vw,54px)!important;
    font-weight:700!important;
    line-height:1.08!important;
    letter-spacing:-.02em;
}

.swp-page-intro p{
    max-width:780px;
    margin:0!important;
    color:var(--swp-muted)!important;
    font-size:15px!important;
    line-height:1.65!important;
}

.swp-page-intro-note{
    flex:0 0 290px;
    padding:14px 16px;
    border-left:3px solid var(--swp-gold);
    background:var(--swp-soft);
}

.swp-page-intro-note strong,
.swp-page-intro-note span{
    display:block;
}

.swp-page-intro-note strong{
    margin-bottom:3px;
    color:var(--swp-navy);
    font-size:11px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.swp-page-intro-note span{
    color:var(--swp-muted);
    font-size:12px;
    line-height:1.45;
}

.swp-section-head{
    margin:0 0 18px;
}

.swp-section-head-split{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
}

.swp-section-head h2{
    margin:4px 0 6px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:clamp(27px,3.2vw,38px)!important;
    font-weight:700!important;
    line-height:1.14!important;
    letter-spacing:-.015em;
}

.swp-section-head p{
    max-width:760px;
    margin:0!important;
    color:var(--swp-muted)!important;
    font-size:13px!important;
    line-height:1.6!important;
}

.swp-eyebrow{
    display:block;
    margin:0 0 5px;
    color:var(--swp-teal-dark);
    font-size:10px;
    font-weight:800;
    line-height:1.3;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.swp-text-link{
    color:var(--swp-teal-dark)!important;
    font-size:12px;
    font-weight:750;
    line-height:1.3;
    text-decoration:none!important;
    white-space:nowrap;
    transition:color .18s ease;
}

.swp-text-link:hover,
.swp-text-link:focus{
    color:var(--swp-navy)!important;
}

/* =========================================================
   STATUS PILLS
   ========================================================= */

.swp-status{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:4px 8px;
    border-radius:4px;
    font-size:8.5px;
    font-weight:800;
    line-height:1;
    letter-spacing:.04em;
    text-transform:uppercase;
    white-space:nowrap;
}

.swp-status-primary{
    background:var(--swp-teal);
    color:#fff;
}

.swp-status-coming{
    background:#fff4d8;
    color:#8b6409;
    border:1px solid #eed999;
}

.swp-status-live{
    background:#ecf7ed;
    color:#32703c;
    border:1px solid #c5e2c9;
}

/* =========================================================
   BUTTONS
   ========================================================= */

.swp-button{
    min-height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:9px 16px;
    border:1px solid var(--swp-teal);
    border-radius:6px;
    background:var(--swp-teal);
    color:#fff!important;
    font-family:inherit;
    font-size:11.5px;
    font-weight:760;
    line-height:1.2;
    text-decoration:none!important;
    cursor:pointer;
    transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}

.swp-button:hover,
.swp-button:focus{
    border-color:var(--swp-teal-dark);
    background:var(--swp-teal-dark);
    color:#fff!important;
    transform:translateY(-1px);
}

.swp-button-secondary{
    border-color:var(--swp-navy);
    background:var(--swp-navy);
}

.swp-button-secondary:hover,
.swp-button-secondary:focus{
    border-color:var(--swp-navy-dark);
    background:var(--swp-navy-dark);
}

.swp-button-light{
    border-color:#b8cbd4;
    background:#fff;
    color:var(--swp-navy)!important;
}

.swp-button-light:hover,
.swp-button-light:focus{
    border-color:var(--swp-teal);
    background:var(--swp-soft-teal);
    color:var(--swp-teal-dark)!important;
}

/* =========================================================
   MAGAZINE DIRECTORY
   ========================================================= */

.swp-magazine-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px;
}

.swp-magazine-grid-single{
    grid-template-columns:minmax(0,1fr);
}

.swp-magazine-card{
    display:grid;
    grid-template-rows:auto 1fr;
    overflow:hidden;
    border:1px solid var(--swp-border);
    border-radius:9px;
    background:#fff;
    box-shadow:0 8px 24px rgba(8,47,84,.05);
}

.swp-magazine-grid-single .swp-magazine-card{
    grid-template-columns:minmax(300px,40%) 1fr;
    grid-template-rows:1fr;
    min-height:330px;
}

.swp-card-media{
    position:relative;
    display:block;
    aspect-ratio:16/10;
    overflow:hidden;
    background:var(--swp-soft);
    text-decoration:none!important;
}

.swp-magazine-grid-single .swp-card-media{
    aspect-ratio:auto;
    min-height:100%;
}

.swp-card-media img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .25s ease;
}

.swp-card-media:hover img{
    transform:scale(1.025);
}

.swp-card-media-placeholder{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:28px;
    background:var(--swp-navy);
    color:#fff!important;
}

.swp-card-media-placeholder::after{
    content:"";
    position:absolute;
    right:-35px;
    bottom:-35px;
    width:120px;
    height:120px;
    border:18px solid rgba(255,255,255,.07);
    border-radius:50%;
}

.swp-placeholder-mark{
    width:78px;
    height:78px;
    flex:0 0 78px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.22);
    border-radius:50%;
    color:#fff;
}

.swp-placeholder-mark svg{
    width:38px;
    height:38px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.35;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-placeholder-copy{
    position:relative;
    z-index:2;
}

.swp-placeholder-copy small,
.swp-placeholder-copy strong{
    display:block;
}

.swp-placeholder-copy small{
    margin-bottom:5px;
    color:#b8d7e3;
    font-size:10px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.swp-placeholder-copy strong{
    max-width:300px;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:28px;
    line-height:1.1;
}

.swp-card-body{
    padding:20px;
}

.swp-magazine-grid-single .swp-card-body{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:34px 38px;
}

.swp-card-meta,
.swp-card-topline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:7px;
    margin:0 0 10px;
}

.swp-card-body h3{
    margin:0 0 8px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:22px!important;
    font-weight:700!important;
    line-height:1.2!important;
}

.swp-magazine-grid-single .swp-card-body h3{
    font-size:32px!important;
}

.swp-card-body h3 a{
    color:inherit!important;
    text-decoration:none!important;
}

.swp-card-body h3 a:hover{
    color:var(--swp-teal-dark)!important;
}

.swp-card-tagline{
    margin:0 0 8px!important;
    color:var(--swp-teal-dark)!important;
    font-size:11px!important;
    font-weight:700!important;
    line-height:1.5!important;
}

.swp-card-description,
.swp-card-body>p{
    margin:0 0 14px!important;
    color:var(--swp-muted)!important;
    font-size:12.5px!important;
    line-height:1.65!important;
}

.swp-card-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:12px 16px;
    margin-top:auto;
}

.swp-card-date{
    color:#8997a1;
    font-size:9.5px;
    line-height:1.2;
}

/* =========================================================
   MAGAZINE HERO + NAV
   ========================================================= */

.swp-magazine-page{
    background:#fff;
    color:var(--swp-text);
}

.swp-magazine-hero{
    position:relative;
    overflow:hidden;
    background:var(--swp-navy);
    color:#fff;
}

.swp-magazine-hero::after{
    content:"";
    position:absolute;
    right:-70px;
    top:-110px;
    width:310px;
    height:310px;
    border:42px solid rgba(255,255,255,.06);
    border-radius:50%;
}

.swp-magazine-hero-media{
    position:absolute;
    inset:0;
}

.swp-magazine-hero-media::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(6,40,68,.82);
}

.swp-magazine-hero-media img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.swp-magazine-hero-inner{
    position:relative;
    z-index:2;
    min-height:330px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
    padding-top:52px;
    padding-bottom:52px;
}

.swp-magazine-hero-copy{
    max-width:850px;
}

.swp-magazine-hero .swp-eyebrow{
    color:#9fd8d7;
}

.swp-magazine-hero h1{
    max-width:900px;
    margin:5px 0 12px!important;
    color:#fff!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:clamp(40px,6vw,68px)!important;
    font-weight:700!important;
    line-height:1.03!important;
    letter-spacing:-.025em;
}

.swp-hero-tagline{
    max-width:760px;
    margin:0!important;
    color:#d9e7ee!important;
    font-size:16px!important;
    line-height:1.6!important;
}

.swp-hero-badges{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:22px;
}

.swp-hero-badges span{
    display:inline-flex;
    align-items:center;
    min-height:29px;
    padding:5px 9px;
    border:1px solid rgba(255,255,255,.2);
    border-radius:4px;
    background:rgba(255,255,255,.06);
    color:#fff;
    font-size:9.5px;
    font-weight:700;
}

.swp-hero-badges .swp-hero-status{
    border-color:#d6b65d;
    background:#fff5dc;
    color:#7c5908;
}

.swp-magazine-hero-symbol{
    width:128px;
    height:128px;
    flex:0 0 128px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    background:rgba(255,255,255,.055);
    color:#fff;
}

.swp-magazine-hero-symbol svg{
    width:66px;
    height:66px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-magazine-nav{
    position:relative;
    z-index:5;
    overflow-x:auto;
    background:#fff;
    border-bottom:1px solid var(--swp-border);
    box-shadow:0 4px 13px rgba(8,47,84,.035);
}

.swp-magazine-nav .swp-shell{
    display:flex;
    align-items:center;
    gap:2px;
    white-space:nowrap;
}

.swp-magazine-nav a{
    min-height:52px;
    display:flex;
    align-items:center;
    padding:0 15px;
    border-bottom:3px solid transparent;
    color:#475c6d!important;
    font-size:11.5px;
    font-weight:720;
    text-decoration:none!important;
    transition:color .18s ease,background .18s ease,border-color .18s ease;
}

.swp-magazine-nav a:hover{
    background:var(--swp-soft);
    color:var(--swp-teal-dark)!important;
}

.swp-magazine-nav a.is-active{
    border-bottom-color:var(--swp-teal);
    color:var(--swp-navy)!important;
}

.swp-magazine-main{
    padding-top:38px;
    padding-bottom:56px;
}

/* =========================================================
   INTRO PANEL
   ========================================================= */

.swp-intro-panel{
    display:grid;
    grid-template-columns:62px 1fr;
    gap:18px;
    margin:0 0 38px;
    padding:22px 24px;
    border:1px solid #d8e6e8;
    border-left:4px solid var(--swp-teal);
    border-radius:8px;
    background:var(--swp-soft-teal);
}

.swp-intro-icon{
    width:52px;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--swp-navy);
    color:#fff;
}

.swp-intro-icon svg{
    width:25px;
    height:25px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-intro-copy h2{
    margin:2px 0 6px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:25px!important;
    line-height:1.2!important;
}

.swp-intro-copy p{
    margin:0!important;
    max-width:900px;
    color:var(--swp-muted)!important;
    font-size:13px!important;
    line-height:1.65!important;
}

/* =========================================================
   ARTICLES
   ========================================================= */

.swp-articles-section,
.swp-issues-section,
.swp-overview-products,
.swp-products-section{
    margin:0 0 42px;
}

.swp-article-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.swp-article-card{
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--swp-border);
    border-radius:8px;
    background:#fff;
    box-shadow:0 6px 18px rgba(8,47,84,.035);
}

.swp-article-card .swp-card-media{
    aspect-ratio:16/9;
}

.swp-article-card .swp-card-media-placeholder{
    min-height:175px;
}

.swp-article-card .swp-placeholder-mark{
    width:58px;
    height:58px;
    flex-basis:58px;
}

.swp-article-card .swp-placeholder-mark svg{
    width:29px;
    height:29px;
}

.swp-article-card .swp-placeholder-copy strong{
    font-size:20px;
}

.swp-article-card .swp-card-body{
    display:flex;
    flex:1;
    flex-direction:column;
    padding:16px;
}

.swp-article-card .swp-card-body h3{
    font-size:18px!important;
}

.swp-article-card .swp-card-body .swp-text-link{
    margin-top:auto;
}

/* =========================================================
   PRODUCT CATEGORIES
   ========================================================= */

.swp-product-category-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin:0 0 30px;
}

.swp-product-category{
    min-height:82px;
    display:grid;
    grid-template-columns:48px 1fr auto;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border:1px solid var(--swp-border);
    border-radius:7px;
    background:#fff;
    color:var(--swp-text)!important;
    text-decoration:none!important;
    transition:border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease;
}

.swp-product-category:hover,
.swp-product-category:focus{
    border-color:#a9d0d1;
    background:var(--swp-soft-teal);
    color:var(--swp-text)!important;
    transform:translateY(-1px);
    box-shadow:0 7px 18px rgba(8,47,84,.055);
}

.swp-product-category-media{
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border-radius:6px;
    background:var(--swp-soft);
    color:var(--swp-teal-dark);
}

.swp-product-category-media img{
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
}

.swp-product-category-media svg{
    width:25px;
    height:25px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.5;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-product-category-copy strong,
.swp-product-category-copy small{
    display:block;
}

.swp-product-category-copy strong{
    margin-bottom:2px;
    color:var(--swp-navy);
    font-size:11.5px;
    line-height:1.3;
}

.swp-product-category-copy small{
    color:#8a99a3;
    font-size:8.8px;
}

.swp-category-arrow{
    color:var(--swp-teal-dark);
    font-size:14px;
    transition:transform .18s ease;
}

.swp-product-category:hover .swp-category-arrow{
    transform:translateX(2px);
}

.swp-product-head{
    margin-top:31px;
}

/* WooCommerce is intentionally allowed to use the active theme's product-card design. */
.swp-woocommerce-loop{
    margin-top:6px;
}

.swp-shell .products{
    margin-top:0!important;
    margin-bottom:0!important;
}

/* =========================================================
   MAGAZINE ISSUES / COMING SOON
   ========================================================= */

.swp-coming-soon{
    display:grid;
    grid-template-columns:72px 1fr auto;
    align-items:center;
    gap:18px;
    padding:20px 22px;
    border:1px solid #d9e4e8;
    border-radius:8px;
    background:var(--swp-soft);
}

.swp-coming-icon{
    width:62px;
    height:62px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    background:var(--swp-navy);
    color:#fff;
}

.swp-coming-icon svg{
    width:32px;
    height:32px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.4;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-coming-copy h3{
    margin:7px 0 5px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:21px!important;
    line-height:1.22!important;
}

.swp-coming-copy p{
    margin:0!important;
    max-width:720px;
    color:var(--swp-muted)!important;
    font-size:11.5px!important;
    line-height:1.6!important;
}

.swp-coming-actions{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:9px;
}

.swp-issue-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.swp-issue-card{
    display:grid;
    grid-template-columns:150px 1fr;
    overflow:hidden;
    border:1px solid var(--swp-border);
    border-radius:8px;
    background:#fff;
}

.swp-issue-cover{
    min-height:220px;
    background:var(--swp-soft);
}

.swp-issue-cover img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.swp-issue-cover-placeholder{
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--swp-navy);
    color:#fff;
}

.swp-issue-cover-placeholder svg{
    width:48px;
    height:48px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.35;
}

/* =========================================================
   CTA CARDS - EXPLICIT SPACING RESET FIXES THE OLD ISSUE
   ========================================================= */

.swp-cta-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-top:42px;
}

.swp-cta-card{
    display:grid;
    grid-template-columns:52px 1fr auto;
    align-items:center;
    gap:16px;
    min-height:142px;
    padding:20px;
    border:1px solid var(--swp-border);
    border-radius:8px;
    background:#fff;
}

.swp-cta-card-primary{
    border-color:#cbdfe1;
    background:var(--swp-soft-teal);
}

.swp-cta-icon{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--swp-navy);
    color:#fff;
}

.swp-cta-card-primary .swp-cta-icon{
    background:var(--swp-teal);
}

.swp-cta-icon svg{
    width:23px;
    height:23px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.55;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-cta-copy{
    min-width:0;
}

.swp-cta-row .swp-eyebrow{
    margin:0 0 4px!important;
}

.swp-cta-row h3{
    margin:0 0 5px!important;
    color:var(--swp-navy)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:21px!important;
    font-weight:700!important;
    line-height:1.2!important;
}

.swp-cta-row p{
    margin:0!important;
    max-width:600px;
    color:var(--swp-muted)!important;
    font-size:11.5px!important;
    line-height:1.55!important;
}

/* =========================================================
   EMPTY STATES
   ========================================================= */

.swp-empty-state{
    display:flex;
    align-items:center;
    gap:15px;
    min-height:95px;
    padding:18px 20px;
    border:1px dashed #cfdce1;
    border-radius:8px;
    background:var(--swp-soft);
}

.swp-empty-state-large{
    min-height:180px;
    justify-content:center;
    text-align:center;
    flex-direction:column;
}

.swp-empty-icon{
    width:45px;
    height:45px;
    flex:0 0 45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff;
    color:var(--swp-teal-dark);
    border:1px solid #d4e3e5;
}

.swp-empty-icon svg{
    width:22px;
    height:22px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.5;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.swp-empty-state h3{
    margin:0 0 4px!important;
    color:var(--swp-navy)!important;
    font-size:16px!important;
    line-height:1.25!important;
}

.swp-empty-state p{
    margin:0!important;
    color:var(--swp-muted)!important;
    font-size:11.5px!important;
    line-height:1.55!important;
}

/* =========================================================
   FORMS
   ========================================================= */

.swp-form{
    width:100%;
    max-width:900px;
    margin:18px 0 0;
    padding:22px;
    border:1px solid var(--swp-border);
    border-radius:8px;
    background:#fff;
    box-shadow:0 8px 24px rgba(8,47,84,.035);
}

.swp-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px 16px;
}

.swp-field{
    margin:0 0 13px;
}

.swp-field label{
    display:block;
    margin:0 0 5px!important;
    color:var(--swp-navy)!important;
    font-size:10.5px!important;
    font-weight:750!important;
    line-height:1.35!important;
}

.swp-field label span{
    color:#b23a35;
}

.swp-field input,
.swp-field select,
.swp-field textarea{
    width:100%;
    min-height:43px;
    margin:0!important;
    padding:9px 11px!important;
    border:1px solid #cad6dc!important;
    border-radius:5px!important;
    outline:0!important;
    background:#fff!important;
    color:var(--swp-text)!important;
    font-family:inherit!important;
    font-size:12px!important;
    line-height:1.4!important;
    box-shadow:none!important;
    transition:border-color .18s ease,box-shadow .18s ease;
}

.swp-field input:focus,
.swp-field select:focus,
.swp-field textarea:focus{
    border-color:var(--swp-teal)!important;
    box-shadow:0 0 0 3px rgba(11,140,143,.08)!important;
}

.swp-field textarea{
    min-height:125px;
    resize:vertical;
}

.swp-field small{
    display:block;
    margin-top:5px;
    color:#81909a;
    font-size:9px;
    line-height:1.45;
}

.swp-form-actions{
    margin-top:2px;
}

.swp-hp{
    position:absolute!important;
    left:-99999px!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
}

.swp-notice{
    max-width:900px;
    margin:0 0 14px;
    padding:11px 13px;
    border:1px solid #d7e0e3;
    border-radius:5px;
    font-size:11.5px;
    line-height:1.5;
}

.swp-notice-success{
    border-color:#bdd9c1;
    background:#f1f8f2;
    color:#32663a;
}

.swp-notice-error{
    border-color:#e1c2bf;
    background:#fff4f3;
    color:#8b3934;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:1100px){
    .swp-magazine-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .swp-magazine-grid-single{grid-template-columns:1fr}
    .swp-magazine-grid-single .swp-magazine-card{grid-template-columns:minmax(260px,38%) 1fr}
    .swp-article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .swp-product-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .swp-cta-card{grid-template-columns:48px 1fr}.swp-cta-card>.swp-button{grid-column:2;margin-top:2px;justify-self:start}
    .swp-coming-soon{grid-template-columns:62px 1fr}.swp-coming-actions{grid-column:2;flex-direction:row;align-items:center}
}

@media(max-width:820px){
    .swp-shell{width:min(100% - 28px,1320px)}
    .swp-directory-page,.swp-managed-page{padding-top:30px;padding-bottom:42px}
    .swp-page-intro{align-items:flex-start;flex-direction:column;gap:15px}
    .swp-page-intro-note{flex:0 0 auto;width:100%}
    .swp-magazine-grid-single .swp-magazine-card{grid-template-columns:1fr}
    .swp-magazine-grid-single .swp-card-media{min-height:260px}
    .swp-magazine-grid-single .swp-card-body{padding:24px}
    .swp-magazine-hero-inner{min-height:285px;padding-top:42px;padding-bottom:42px}
    .swp-magazine-hero-symbol{width:90px;height:90px;flex-basis:90px}.swp-magazine-hero-symbol svg{width:45px;height:45px}
    .swp-product-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .swp-issue-grid{grid-template-columns:1fr}
    .swp-cta-row{grid-template-columns:1fr}
}

@media(max-width:620px){
    .swp-shell{width:min(100% - 24px,1320px)}
    .swp-page-intro h1{font-size:34px!important}
    .swp-section-head-split{align-items:flex-start;flex-direction:column;gap:8px}
    .swp-magazine-grid,.swp-article-grid,.swp-form-grid{grid-template-columns:1fr}
    .swp-card-media-placeholder{min-height:210px;padding:22px}
    .swp-placeholder-copy strong{font-size:23px}
    .swp-magazine-hero-inner{min-height:260px;display:block}.swp-magazine-hero-symbol{display:none}.swp-magazine-hero h1{font-size:39px!important}.swp-hero-tagline{font-size:14px!important}
    .swp-magazine-main{padding-top:28px;padding-bottom:42px}
    .swp-intro-panel{grid-template-columns:45px 1fr;gap:12px;padding:17px}.swp-intro-icon{width:42px;height:42px}.swp-intro-copy h2{font-size:20px!important}
    .swp-product-category-grid{grid-template-columns:1fr 1fr;gap:8px}.swp-product-category{min-height:72px;grid-template-columns:40px 1fr auto;padding:8px}.swp-product-category-media{width:38px;height:38px}.swp-product-category-copy strong{font-size:10.5px}.swp-product-category-copy small{display:none}
    .swp-coming-soon{grid-template-columns:1fr;text-align:left}.swp-coming-icon{width:52px;height:52px}.swp-coming-actions{grid-column:1;flex-direction:column;align-items:flex-start}
    .swp-issue-card{grid-template-columns:105px 1fr}.swp-issue-cover{min-height:185px}
    .swp-cta-card{grid-template-columns:42px 1fr;gap:12px;padding:16px;min-height:0}.swp-cta-icon{width:40px;height:40px}.swp-cta-card>.swp-button{grid-column:1/-1;width:100%}.swp-cta-row h3{font-size:18px!important}
    .swp-form{padding:16px}
}

@media(max-width:400px){
    .swp-product-category-grid{grid-template-columns:1fr}
    .swp-magazine-nav a{padding:0 12px;font-size:10.5px}
    .swp-magazine-grid-single .swp-card-body h3{font-size:26px!important}
}

/* =========================================================
   PHASE 2 — MULTI-MAGAZINE / HAJJ & UMRAH ADDITIONS
   ========================================================= */
.swp-audience-note{
    margin:14px 0 0!important;
    max-width:760px;
    color:rgba(255,255,255,.82)!important;
    font-size:11px!important;
    line-height:1.55!important;
}
.swp-resource-magazine + .swp-resource-magazine{
    margin-top:56px;
    padding-top:46px;
    border-top:1px solid var(--swp-border,#e2e8ec);
}
.swp-directory-topic + .swp-directory-topic{
    margin-top:48px;
    padding-top:42px;
    border-top:1px solid var(--swp-border,#e2e8ec);
}
.swp-product-experience-grid{width:100%;}
.swp-issue-format-labels{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:10px 0 2px;
}
.swp-issue-format-labels span{
    display:inline-flex;
    align-items:center;
    min-height:25px;
    padding:4px 8px;
    border:1px solid #d9e5e8;
    border-radius:999px;
    background:#f7fafb;
    color:#41586a;
    font-size:9.5px;
    font-weight:700;
}
.swp-issue-actions{
    display:flex!important;
    flex-wrap:wrap;
    gap:8px!important;
}
.swp-social-links{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.swp-social-links a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:6px 11px;
    border:1px solid #d8e3e6;
    border-radius:6px;
    background:#fff;
    color:#173b56!important;
    font-size:10.5px;
    font-weight:700;
    text-decoration:none!important;
}
.swp-social-links a:hover{
    border-color:#9dc7c8;
    background:#f0f8f8;
    color:#08777a!important;
}
@media (max-width:700px){
    .swp-resource-magazine + .swp-resource-magazine{margin-top:42px;padding-top:34px;}
    .swp-directory-topic + .swp-directory-topic{margin-top:36px;padding-top:30px;}
    .swp-issue-actions .swp-button{width:100%;justify-content:center;}
}

/* Phase 3 real Hajj & Umrah image icon support */
.swp-real-kaaba-icon{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;filter:none!important}
.swp-placeholder-mark .swp-real-kaaba-icon{width:50px!important;height:50px!important}
.swp-magazine-hero-symbol .swp-real-kaaba-icon{width:82px!important;height:82px!important}
.swp-intro-icon .swp-real-kaaba-icon{width:36px!important;height:36px!important}
.swp-product-category-media .swp-real-kaaba-icon{width:34px!important;height:34px!important;padding:2px!important}
.swp-empty-icon .swp-real-kaaba-icon{width:27px!important;height:27px!important}
@media(max-width:700px){.swp-magazine-hero-symbol .swp-real-kaaba-icon{width:58px!important;height:58px!important}.swp-intro-icon .swp-real-kaaba-icon{width:29px!important;height:29px!important}}
