/* Habib Novel — 2026 editorial refresh.
   Presentation-only overrides; existing CMS routes and original banner remain intact. */
:root{
  --ink:#182b27;--deep:#123f35;--forest:#1b5d4c;--accent:#ba985a;
  --sand:#f6f7f4;--muted:#687972;--white:#fff;--line:#e4eae4;
  --shadow:0 22px 60px rgba(18,55,44,.08);
  --surface:#fff;--mint:#eef5ef;--gold:#dbc18c;
  --serif:'DM Serif Display',Georgia,'Times New Roman',serif;
  --sans:'Plus Jakarta Sans','DM Sans',sans-serif;
}
html{scroll-padding-top:90px}
body{font-family:'DM Sans',Arial,sans-serif;font-size:15px;line-height:1.75;color:var(--ink);background:linear-gradient(180deg,#fff 0,#f7f8f5 34%,#f7f8f5 100%);-webkit-font-smoothing:antialiased}
::selection{background:#e4cd9c;color:#12352b}
a,button,input{transition:color .2s ease,border-color .2s ease,background-color .2s ease,box-shadow .2s ease}
:focus-visible{outline:3px solid #bd9b59!important;outline-offset:3px}
.shell{width:min(1240px,calc(100% - 64px))}
.topline{padding:12px 0 4px;background:#fff}
.topline .shell{max-width:1240px}
.topline .social{gap:8px}
.topline .social a{width:30px;height:30px;font-size:12px;border:1px solid #e3e9e3;background:#f8faf8;color:#294d42;transition:transform .2s ease,background-color .2s ease}
.topline .social a:hover{transform:translateY(-2px);background:#e8f0e8}
.topline .subscribe{background:#133e34;color:white;border-color:#133e34;border-radius:999px;font-family:var(--sans);font-weight:700;letter-spacing:.11em;padding:9px 17px}
.topline .subscribe:hover{background:#285e4d;color:white}
.masthead{padding:15px 20px 31px;background:#fff}
.masthead .brand{font-family:var(--serif);font-size:clamp(27px,3vw,39px);font-weight:400;letter-spacing:.095em;line-height:1.25;color:#173b31}
.masthead .brand:hover{color:#426952}
.masthead .tagline{font-family:'DM Sans',sans-serif;font-style:normal;font-size:11px;letter-spacing:.14em;color:#839088;margin-top:7px}
.mainnav{background:rgba(255,255,255,.96);border-color:#e6ece6;backdrop-filter:blur(18px);box-shadow:0 8px 22px rgba(21,62,46,.035)}
.mainnav .shell{height:64px;min-height:64px}
.mainnav .navlinks{gap:clamp(15px,3vw,40px)}
.mainnav .navlinks a{position:relative;font:700 10px/1.5 var(--sans);letter-spacing:.10em;color:#395348;padding:23px 0}
.mainnav .navlinks a:after{content:'';position:absolute;left:0;right:100%;bottom:14px;height:2px;border-radius:2px;background:#bf9f64;transition:right .25s ease}
.mainnav .navlinks a:hover,.mainnav .navlinks a[aria-current="page"]{color:#124b39}
.mainnav .navlinks a:hover:after,.mainnav .navlinks a[aria-current="page"]:after{right:0}
.mainnav form{border:1px solid #e3eae3;background:#f7faf7;border-radius:999px;padding-left:4px}
.mainnav input{width:116px;border:0!important;padding:8px 10px!important;background:transparent}
.mainnav input:focus{width:142px}
.mainnav button{color:#215746;padding:7px 12px}
.mainnav form:focus-within{box-shadow:0 0 0 3px #dbe9dd}
.site-main-banner{width:min(1392px,calc(100% - 48px));margin:28px auto 0;border-radius:25px;overflow:hidden;border:1px solid #e9eae4;background:#e8e7dd;box-shadow:0 24px 70px rgba(23,62,44,.11)}
.site-main-banner img{width:100%;display:block;height:auto;aspect-ratio:1916/821;object-fit:contain}
.home-intro{padding-top:clamp(45px,5vw,80px);padding-bottom:clamp(30px,3vw,45px)}
.home-intro .home-kicker{display:flex;align-items:center;gap:12px;font:800 10px/1.5 var(--sans);color:#977a4c;letter-spacing:.17em;text-transform:uppercase}
.home-intro .home-kicker:before{content:'';width:28px;height:2px;border-radius:2px;background:#c6a46c}
.home-intro-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(275px,.7fr);align-items:end;gap:clamp(25px,6vw,100px);margin-top:18px}
.home-intro h1{margin:0;font:400 clamp(38px,5.1vw,71px)/1.10 var(--serif);letter-spacing:-.037em;max-width:830px;color:#183c31;text-wrap:balance}
.home-intro h1 em{font-weight:400;color:#ad8a50}
.home-intro-aside{padding:8px 0 4px;border-left:1px solid #dce6dc;padding-left:25px}
.home-intro-aside p{font-size:14px;line-height:1.85;color:#687d71;margin:0 0 17px}
.home-intro-aside a{display:inline-flex;align-items:center;gap:20px;font:800 12px/1.5 var(--sans);text-decoration:none;color:#1f644d;padding-bottom:7px;border-bottom:1px solid #adc5b1}
.home-intro-aside a:hover{gap:26px;color:#987841}
.explore{margin-top:5px;padding:26px 30px;background:#eaf2eb;border:1px solid #deebdf;border-radius:20px;box-shadow:none;gap:30px}
.explore .eyebrow{font:800 10px/1.5 var(--sans);letter-spacing:.14em;color:#997c48}
.explore-intro strong{font:700 15px/1.5 var(--sans);letter-spacing:-.03em;color:#21483a}
.explore-links{gap:9px}
.explore-links a{font:700 12px/1.2 var(--sans);display:inline-flex;align-items:center;gap:12px;border-radius:999px;padding:13px 17px;border:1px solid #d8e5d8;background:#fff;color:#265240;box-shadow:0 3px 12px rgba(14,47,31,.025)}
.explore-links a span{margin:0;color:#b2925b}
.explore-links a:hover{background:#164735;color:#fff;border-color:#164735;transform:translateY(-2px)}
.explore-links a:hover span{color:#e7c88d}
.section-head{padding:clamp(70px,8vw,115px) 20px 34px}
.section-head>span,.page-title>span{font:800 11px/1.5 var(--sans);letter-spacing:.19em;color:#a28550}
.section-head h2,.page-title h1{font:400 clamp(37px,4.3vw,58px)/1.15 var(--serif);letter-spacing:-.03em;color:#173b31;margin:12px 0 10px;text-wrap:balance}
.section-head h2 em{font-weight:400;color:#b48e50}
.section-head p{font-size:14px;color:#7c8880}
.page-title{padding:76px 20px 34px}
.post-grid{width:min(1240px,calc(100% - 64px));display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px;margin:18px auto 100px;align-items:stretch}
.post-grid .card{display:flex;flex-direction:column;grid-template-columns:none;min-width:0;min-height:0;background:#fff;border:1px solid #e6ece6;border-radius:21px;overflow:hidden;box-shadow:0 7px 30px rgba(13,58,37,.045);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.post-grid .card:hover{transform:translateY(-6px);border-color:#cfded0;box-shadow:0 24px 50px rgba(18,62,44,.12)}
.post-grid .card>a{position:relative;display:block;flex:none;width:100%;aspect-ratio:16/10;min-height:0;overflow:hidden;background:linear-gradient(135deg,#dfece1,#d1decf)}
.post-grid .card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.post-grid .card:hover img{transform:scale(1.05)}
.post-grid .card-body{flex:1;display:flex;flex-direction:column;align-items:flex-start;padding:25px 25px 27px}
.post-grid .card .eyebrow{display:inline-flex;align-items:center;background:#eff5ee;border-radius:999px;padding:6px 11px;color:#517258;font:800 10px/1.4 var(--sans);letter-spacing:.085em}
.post-grid .card h2{font:400 clamp(22px,1.9vw,27px)/1.24 var(--serif);letter-spacing:-.017em;color:#1d3c32;margin:18px 0 13px;text-wrap:pretty}
.post-grid .card h2 a{transition:color .2s}
.post-grid .card h2 a:hover{color:#348165}
.post-grid .card .meta{color:#8b9a90;font:600 11px/1.6 'DM Sans',sans-serif;margin:0 0 13px}
.post-grid .card .view-count{color:#57806a;font-weight:700}
.post-grid .card p{font-size:13px;line-height:1.85;color:#687b70;margin:0 0 23px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-grid .readmore{font:800 11px/1.5 var(--sans);color:#246447;gap:12px;margin-top:auto;letter-spacing:.01em}
.post-grid .readmore span{font-size:16px;color:#a58750}
.post-grid .card:first-child{grid-column:span 2;grid-row:span 2}
.post-grid .card:first-child>a{aspect-ratio:1.75}
.post-grid .card:first-child .card-body{padding:31px 34px 36px}
.post-grid .card:first-child h2{font-size:clamp(29px,3vw,43px);max-width:720px;margin:20px 0 14px}
.post-grid .card:first-child p{max-width:660px;font-size:14px;-webkit-line-clamp:2}
.post-grid .card:not(:has(>a)){background:radial-gradient(circle at 100% 0%,#e9f2e9 0%,#fff 46%);border-top:4px solid #c8ad72}
.pagination{margin:-44px 0 97px;gap:13px}
.pagination a{padding:12px 21px;border-radius:999px;border:1px solid #d9e5d9;background:#fff;color:#245540;font:700 12px/1.5 var(--sans)}
.pagination a:hover{background:#174a39;border-color:#174a39;color:#fff}
.single{width:min(980px,calc(100% - 52px));margin:51px auto 105px;box-shadow:0 24px 70px rgba(19,58,39,.075);border:1px solid #e7ece7;border-radius:26px;background:#fff}
.single>header{padding:75px 11% 43px}
.single>header .eyebrow{display:inline-flex;background:#eaf3ec;padding:7px 13px;border-radius:999px;color:#54755e}
.single h1{font:400 clamp(38px,5.2vw,66px)/1.15 var(--serif);letter-spacing:-.025em;color:#193a30;margin:22px 0;text-wrap:balance}
.single .meta{font-size:12px;color:#8a9990}
.single-cover{width:100%;max-height:560px;object-fit:cover}
.content{color:#34483e;font:17px/2 'DM Sans',sans-serif;padding:50px 11% 68px}
.content :is(h2,h3,h4){font-family:var(--serif);font-weight:400;letter-spacing:-.015em;color:#1b4334}
.content h2{font-size:clamp(28px,3vw,37px)}
.content h3{font-size:clamp(23px,2.4vw,30px)}
.content p{margin:0 0 1.35em}
.content :is(img,video){border-radius:16px}
.content blockquote{background:#edf5ee;border-left:3px solid #bfa16b;padding:22px 27px;border-radius:0 14px 14px 0}
.video-embed{border-radius:18px;box-shadow:0 16px 38px rgba(12,44,29,.08)}
.share,.comments{padding-left:11%;padding-right:11%}
.share a{border-radius:999px;font-family:var(--sans)}
.comments h2{font-family:var(--serif);font-weight:400}
.community-cta{padding:clamp(65px,7vw,97px) 0;background:radial-gradient(circle at 80% -30%,#286e56 0%,#154e3d 38%,#123f34 100%);position:relative;overflow:hidden}
.community-cta:after{content:'✧';position:absolute;right:8%;top:-120px;font:normal 390px/1 Georgia,serif;color:rgba(255,255,255,.055);pointer-events:none}
.community-cta .shell{position:relative;z-index:1}
.community-cta h2{font:400 clamp(34px,4.5vw,57px)/1.14 var(--serif);max-width:690px}
.community-cta h2 em{font-weight:400;color:#efcf91}
.community-cta p{max-width:600px;line-height:1.9;color:#c8d9ce}
.community-cta a{font:800 12px/1.5 var(--sans);background:#e4ca91;color:#224234;border:1px solid #e4ca91;border-radius:999px;padding:16px 23px}
.community-cta a:hover{background:#fff;border-color:#fff;color:#194e3b;transform:translateY(-2px)}
.follow{background:#10392e;padding-top:41px;padding-bottom:41px}
.follow strong{font:400 36px/1.3 var(--serif)}
.follow span{font-size:11px;letter-spacing:.05em;color:#c3d3c8}
footer{background:#0d2c25;padding:57px 0 23px}
.footer-brand{font:700 22px/1.4 var(--sans);letter-spacing:-.04em}
.footer-brand span{color:#e3c688}
footer p{font-size:13px}
.footer-links{gap:28px;flex-wrap:wrap}
.footer-links a{font-size:12px;font-weight:700;color:#d9e5dc}
.copyright{margin-top:43px;padding-top:22px}
.editorial-page{color:#1c3c31}
.page-breadcrumb{font-size:12px;padding-top:29px}
.page-breadcrumb a{color:#326950}
.editorial-page .editorial-kicker{color:#aa894f}
.editorial-page h1,.editorial-page h2{letter-spacing:-.035em}
.editorial-page h1,.editorial-page h2,.editorial-page h3{font-family:var(--serif);font-weight:400}
.editorial-action{border-radius:999px;background:#e2c58e;box-shadow:0 8px 20px #062b1b20}
.editorial-action:hover{background:#f5daa6}
.profile-hero,.contact-hero{border-radius:27px;box-shadow:0 24px 65px rgba(18,56,42,.11)}
.profile-hero-copy,.contact-hero-text{background:radial-gradient(circle at 0% 0%,#286b54,#123e33 65%,#0c3229)}
.profile-hero h1,.contact-hero h1{font-weight:400}
.profile-aside,.contact-card{border-radius:21px;box-shadow:0 9px 30px #153b2910}
.profile-aside-heading strong,.story-heading h2,.contact-section-heading h2,.contact-detail-primary h2,.profile-bottom-cta h2{font-family:var(--serif);font-weight:400}
.profile-story-content{font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.95}
.profile-bottom-cta,.contact-detail-panel{background:#eaf2ea}
.contact-card h3{font-family:var(--serif);font-weight:400;font-size:27px}
.contact-card-symbol{border-radius:16px}
.contact-detail-panel{border-radius:24px}
.notfound h1{font:400 45px/1.2 var(--serif);color:#1a4835}
@media(max-width:1150px){
  .mainnav .navlinks{gap:22px}
  .mainnav form input{width:75px}
  .post-grid{gap:18px}
  .post-grid .card-body{padding:21px}
}
@media(max-width:900px){
  .home-intro-grid{grid-template-columns:1fr .68fr;gap:22px}
  .post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .post-grid .card:first-child{grid-column:span 2;grid-row:auto}
  .mainnav .navlinks a:after{display:none}
}
@media(max-width:850px){
  .topline{display:none}
  .masthead{padding:0;background:#fff;backdrop-filter:blur(20px)}
  .masthead .mobile-header-row{height:68px}
  .masthead .brand{font-family:var(--serif)!important;font-size:clamp(17px,4.1vw,23px)!important;letter-spacing:.025em!important;font-weight:400!important;color:#1a4939}
  .masthead .mobile-menu-trigger,.masthead .mobile-search-trigger{color:#215440;border-radius:14px}
  .masthead :is(.mobile-menu-trigger,.mobile-search-trigger)[aria-expanded="true"]{background:#e8f3ea}
  .mainnav .navlinks{padding:16px 25px 26px!important;border-radius:0 0 24px 24px}
  .mainnav .navlinks a{font-size:12px!important;letter-spacing:.08em!important;padding:16px 0!important}
  .mainnav .navlinks a[aria-current="page"]{color:#a17e44!important}
  .site-main-banner{margin:12px auto 0;width:calc(100% - 28px);border-radius:18px;box-shadow:0 12px 35px rgba(19,51,35,.1)}
  .home-intro{padding-top:52px}
  .home-intro h1{font-size:clamp(36px,5.3vw,52px)}
}
@media(max-width:700px){
  .shell{width:calc(100% - 36px)}
  .home-intro-grid{grid-template-columns:1fr;gap:19px}
  .home-intro-aside{border-left:0;border-top:1px solid #e1e7df;padding:17px 0 0}
  .home-intro h1{max-width:530px}
  .explore{flex-direction:column;align-items:stretch;padding:24px}
  .explore-links{display:grid;grid-template-columns:repeat(3,1fr)}
  .explore-links a{justify-content:space-between;gap:8px;padding:12px 10px;font-size:11px}
  .section-head{padding:70px 22px 29px}
  .post-grid{width:calc(100% - 36px);margin-bottom:75px;gap:15px}
  .post-grid .card:first-child .card-body{padding:25px}
  .post-grid .card:first-child h2{font-size:31px}
  .single{width:calc(100% - 32px);margin:22px auto 65px;border-radius:20px}
  .single>header{padding:43px 7% 31px}
  .single h1{font-size:clamp(34px,6vw,48px)}
  .content{padding:30px 7% 45px;font-size:16px;line-height:1.9}
  .share,.comments{padding-left:7%;padding-right:7%}
  .community-cta .shell{align-items:flex-start}
  .follow strong{font-size:32px}
  .profile-hero,.contact-hero{border-radius:21px}
}
@media(max-width:540px){
  .site-main-banner{width:100%;margin-top:0;border:0;border-radius:0;box-shadow:none}
  .home-intro{padding-top:43px;padding-bottom:30px}
  .home-intro .home-kicker{font-size:9px}
  .home-intro h1{font-size:clamp(35px,10vw,47px)}
  .home-intro-aside p{font-size:13px}
  .explore{width:calc(100% - 30px);border-radius:17px;padding:20px}
  .explore-links{grid-template-columns:1fr}
  .explore-links a{padding:13px 17px;font-size:12px}
  .section-head{padding:67px 15px 24px}
  .section-head h2,.page-title h1{font-size:39px}
  .post-grid{grid-template-columns:1fr;width:calc(100% - 30px);gap:19px;margin-top:8px}
  .post-grid .card:first-child{grid-column:auto}
  .post-grid .card:first-child h2{font-size:28px}
  .post-grid .card:first-child>a{aspect-ratio:16/10}
  .post-grid .card:first-child .card-body{padding:24px}
  .post-grid .card-body{padding:24px}
  .post-grid .card h2{font-size:25px}
  .post-grid .card p{font-size:13px}
  .single h1{font-size:37px}
  .follow{grid-template-columns:3fr;gap:16px}
  .follow div{padding-bottom:16px}
  .footer-brand{font-size:19px}
}
@media(max-width:375px){
  .masthead .brand{font-size:15px!important}
  .home-intro h1{font-size:34px}
  .section-head h2{font-size:34px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}