/* ==========================================================================
   Pits — blog.css (Blog, κατηγορίες, άρθρο). Redesign «Logbook», Οκτ 2026 — OCTOPUSH.
   ========================================================================== */


:root{
	--lg-text:#3f4a50;
	--lg-muted:#5f6b76;
	--lg-line:#d6e2e8;
	--lg-ink:#00709f;
	--f-mono:"IBM Plex Mono",ui-monospace,monospace;
	--f-serif:"Instrument Serif",Georgia,serif;
	--ease-out:cubic-bezier(.16,1,.3,1);
}
.lg-wrap{width:calc(100% - 2*var(--edge));max-width:1440px;margin-inline:auto}
.lg-mono{font:500 12px/1.5 var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.lg-serif{font:italic 400 1.08em/1 var(--f-serif);letter-spacing:0;color:var(--c-accent)}
.lg-arr{width:18px;height:18px;flex:none;transition:transform .4s var(--ease-out)}
a:hover>.lg-arr,a:hover .lg-more .lg-arr{transform:translateX(4px)}
.lg-stamp{position:absolute;top:20px;right:20px;padding:9px 12px;background:#fff;border:2px dashed var(--c-accent);color:var(--lg-ink);font:500 12px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;transform:rotate(6deg)}

/* ---------- Masthead ---------- */
.lg-mast{padding-block:clamp(48px,7vw,104px) clamp(40px,5vw,64px)}
.lg-mast__eye{margin:0;color:var(--lg-ink)}
.lg-mast__eye a{color:inherit}
.lg-mast h1{margin:18px 0 0;max-width:15ch;font:800 clamp(44px,7vw,104px)/.98 var(--f-head);letter-spacing:-.035em;text-wrap:balance}
.lg-mast--sm h1{font-size:clamp(44px,6vw,88px)}
.lg-mast__row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 64px;margin-top:clamp(28px,4vw,44px);padding-top:24px;border-top:1px solid var(--lg-line)}
.lg-mast__row p{max-width:46ch;margin:0;font-size:19px;color:var(--lg-muted)}
.lg-mast__count{display:flex;gap:clamp(20px,3vw,44px);margin:0}
.lg-mast__count dt{font:500 11px/1.4 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--lg-muted)}
.lg-mast__count dd{margin:4px 0 0;font:800 34px/1 var(--f-head);color:var(--c-primary);font-variant-numeric:tabular-nums}

/* ---------- Τελευταίο άρθρο ---------- */
.lg-feat__a{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:clamp(28px,5vw,80px);color:inherit}
.lg-feat__a:hover{color:inherit}
.lg-feat__media{position:relative;display:block;aspect-ratio:5/4;border-radius:22px;overflow:hidden;background:var(--c-tint)}
.lg-feat__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.lg-feat__a:hover .lg-feat__media img{transform:scale(1.04)}
.lg-feat__latest{position:absolute;left:22px;bottom:16px;font:400 46px/1 var(--f-script);color:#fff;text-shadow:0 2px 18px rgb(0 0 0 / .35)}
.lg-feat__body{display:block}
.lg-feat__body>.lg-mono{color:var(--lg-ink)}
.lg-feat__body h2{margin:16px 0 18px;font:800 clamp(30px,3.4vw,48px)/1.08 var(--f-head);letter-spacing:-.02em;text-wrap:balance;transition:color .3s}
.lg-feat__a:hover h2{color:var(--c-accent)}
.lg-feat__body p{margin:0 0 28px;max-width:44ch;color:var(--lg-muted)}
.lg-more{display:inline-flex;align-items:center;gap:10px;padding-bottom:6px;border-bottom:2px solid var(--c-accent);color:var(--c-primary);font:700 16px/1 var(--f-head)}

/* ---------- Logbook ---------- */
.lg-log{position:relative;padding-block:clamp(64px,8vw,112px) clamp(48px,6vw,80px)}
.lg-log--flush{padding-top:0}
.lg-log__head,.lg-row{display:grid;grid-template-columns:72px minmax(0,1fr) 230px 140px 48px;gap:24px}
.lg-log__head{padding-bottom:14px;color:var(--lg-muted);border-bottom:2px solid var(--c-primary)}
.lg-log__list{list-style:none;margin:0;padding:0}
.lg-row{position:relative;align-items:center;padding:30px 0;border-bottom:1px solid var(--lg-line);color:inherit;transition:padding .5s var(--ease-out)}
.lg-row:hover{color:inherit}
.lg-row::before{content:"";position:absolute;inset:0 calc(-1 * min(24px,var(--edge)));z-index:-1;border-radius:14px;background:#fff;opacity:0;transition:opacity .35s}
.lg-row__n{font:500 15px/1 var(--f-mono);color:var(--c-accent)}
.lg-row__t{margin:0;font:700 clamp(19px,2vw,27px)/1.25 var(--f-head);letter-spacing:-.01em;color:var(--c-primary);text-wrap:balance;transition:color .3s}
.lg-row__cat{display:block;margin-top:8px;color:var(--lg-muted)}
.lg-row__dm{display:none}
.lg-row__w,.lg-row__d{color:var(--c-primary)}
.lg-row__w small{display:block;font-size:11px;color:var(--lg-muted)}
.lg-row__go{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--lg-line);color:var(--c-primary);transition:background .3s,color .3s,border-color .3s,transform .5s var(--ease-out)}
.lg-row__thumb{display:none}
@media (hover:hover){
	.lg-row:hover{padding-left:16px}
	.lg-row:hover::before{opacity:1}
	.lg-row:hover .lg-row__t{color:var(--c-accent)}
	.lg-row:hover .lg-row__go{background:var(--c-accent);border-color:var(--c-accent);color:#fff;transform:rotate(-45deg)}
}
.lg-log__end{margin:28px 0 0;text-align:center;color:var(--lg-muted)}
.lg-peek{position:fixed;left:0;top:0;z-index:90;width:300px;aspect-ratio:4/5;border-radius:16px;overflow:hidden;pointer-events:none;opacity:0;transform:translate3d(-999px,-999px,0);transition:opacity .3s;box-shadow:0 30px 60px -24px rgb(17 61 72 / .55);background:var(--c-tint)}
.lg-peek.is-on{opacity:1}
.lg-peek img{width:100%;height:100%;object-fit:cover}

/* ---------- CTA μπάντα ---------- */
.lg-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;margin-bottom:clamp(64px,8vw,120px);padding:clamp(36px,6vw,72px);border-radius:28px;background:var(--c-primary)}
.lg-band .script{color:#7fd3ff}
.lg-band__t{margin:0;font:800 clamp(30px,4vw,52px)/1.05 var(--f-head);letter-spacing:-.02em;color:#fff}
.lg-band .lg-serif{color:#7fd3ff}

@media (max-width:1024px){
	.lg-log__head{display:none}
	.lg-row{grid-template-columns:48px minmax(0,1fr) 112px;gap:16px 18px;padding:24px 0}
	.lg-row__w,.lg-row__d,.lg-row__go{display:none}
	.lg-row__dm{display:inline}
	.lg-row__thumb{display:block;width:112px;height:112px;border-radius:12px;object-fit:cover;background:var(--c-tint)}
	.lg-peek{display:none}
}
@media (max-width:767px){
	.lg-feat__a{grid-template-columns:1fr}
	.lg-feat__media{aspect-ratio:4/3}
	.lg-feat__latest{font-size:36px}
	.lg-mast__count dd{font-size:28px}
	.lg-row{grid-template-columns:30px minmax(0,1fr) 84px;gap:14px}
	.lg-row__thumb{width:84px;height:84px}
	.lg-row__t{font-size:18px}
	.lg-row__n{font-size:13px}
	.lg-row__dm{display:none}
}

/* ================= Άρθρο ================= */
.lg-prog{position:fixed;left:0;right:0;top:calc(var(--adm) + var(--header-h));z-index:95;height:16px;pointer-events:none}
.lg-prog::before{content:"";position:absolute;left:0;right:0;top:0;border-top:2px dotted rgb(0 148 217 / .3)}
.lg-prog__fill{position:absolute;left:0;top:0;width:100%;height:2px;background:var(--c-accent);transform:scaleX(var(--p,0));transform-origin:left}
.lg-prog__boat{position:absolute;top:-10px;left:0;width:24px;color:var(--c-primary);transform:translateX(calc(var(--p,0) * (100vw - 24px)))}

.lg-ph{width:calc(100% - 2*var(--edge));max-width:1040px;margin-inline:auto;padding:clamp(48px,7vw,104px) 0 clamp(32px,4vw,48px)}
.lg-ph__crumbs{display:flex;flex-wrap:wrap;gap:10px;margin:0;color:var(--lg-muted)}
.lg-ph__crumbs a{color:var(--lg-ink)}
.lg-ph h1{margin:22px 0 26px;font:800 clamp(36px,5.6vw,76px)/1.03 var(--f-head);letter-spacing:-.03em;text-wrap:balance}
.lg-ph__lead{max-width:40em;margin:0;font:400 clamp(19px,1.6vw,22px)/1.6 var(--f-body);color:var(--c-primary)}
.lg-ph__meta{display:flex;flex-wrap:wrap;gap:10px 28px;margin:30px 0 0;padding-top:20px;border-top:1px solid var(--lg-line);color:var(--lg-muted)}
.lg-ph__meta b{color:var(--c-primary);font-weight:500}

.lg-hero{margin-block:0}
.lg-hero img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:22px;background:var(--c-tint)}
.lg-cap{display:flex;justify-content:space-between;gap:16px;margin-top:12px;color:var(--lg-muted)}

.lg-art{display:grid;grid-template-columns:200px minmax(0,680px) 280px;justify-content:center;gap:0 56px;padding-block:clamp(48px,6vw,88px)}
.lg-art--solo .lg-prose{grid-column:2}

/* Διαδρομή / περιεχόμενα */
.lg-route{position:sticky;top:calc(var(--adm) + var(--header-h) + 48px);align-self:start}
.lg-route>p{margin:0 0 18px;color:var(--lg-muted)}
.lg-route ol{position:relative;list-style:none;margin:0;padding:0}
.lg-route ol::before{content:"";position:absolute;left:6px;top:10px;bottom:10px;border-left:2px dotted rgb(0 148 217 / .45)}
.lg-route li a{position:relative;display:grid;gap:2px;padding:0 0 22px 30px;color:var(--c-primary)}
.lg-route li a::before{content:"";position:absolute;left:0;top:7px;width:14px;height:14px;border-radius:50%;background:var(--c-bg);border:2px solid var(--c-accent);transition:background .3s,transform .4s var(--ease-out)}
.lg-route b{font:700 16px/1.3 var(--f-head);transition:color .3s}
.lg-route small{font:500 11px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lg-muted)}
.lg-route li.is-here a::before,.lg-route li.is-past a::before{background:var(--c-accent)}
.lg-route li.is-here a::before{transform:scale(1.3)}
.lg-route li.is-here b{color:var(--c-accent)}

/* Κείμενο */
.lg-prose{grid-column:2;min-width:0;counter-reset:lg;font-size:18px;line-height:1.78;color:var(--lg-text)}
.lg-prose>*{margin-block:0 1.35em}
.lg-prose>p:first-of-type::first-letter{float:left;margin:.08em .12em 0 0;font:800 4.2em/.8 var(--f-head);color:var(--c-primary)}
.lg-prose h2{counter-increment:lg;margin:2.2em 0 .8em;font:800 clamp(26px,2.6vw,34px)/1.15 var(--f-head);letter-spacing:-.015em;color:var(--c-primary)}
.lg-prose h2::before{content:counter(lg,decimal-leading-zero);display:block;margin-bottom:10px;font:500 12px/1.5 var(--f-mono);letter-spacing:.08em;color:var(--c-accent)}
.lg-prose h3{margin:1.8em 0 .6em;font:700 22px/1.3 var(--f-head);color:var(--c-primary)}
.lg-prose a:not([class]){color:var(--c-primary);text-decoration:underline;text-decoration-color:var(--c-accent);text-decoration-thickness:2px;text-underline-offset:4px}
.lg-prose a:not([class]):hover{color:var(--c-accent)}
.lg-prose strong{color:var(--c-primary)}
.lg-prose ul,.lg-prose ol{padding-left:1.2em}
.lg-prose li+li{margin-top:.4em}
.lg-prose li::marker{color:var(--c-accent)}
.lg-prose img{border-radius:16px}
.lg-prose figure{margin-inline:0}
.lg-prose figcaption{margin-top:10px;font:500 12px/1.5 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lg-muted)}
.lg-prose blockquote{margin:1.8em 0;padding:0 0 0 28px;border-left:3px solid var(--c-accent);font:italic 400 clamp(26px,2.6vw,34px)/1.28 var(--f-serif);color:var(--c-primary)}
.lg-prose blockquote p{margin:0}
.lg-prose hr{border:0;border-top:1px solid var(--lg-line);margin:2.4em 0}

/* Κάρτα τοποθεσίας στο περιθώριο */
.lg-place{float:right;clear:right;width:280px;margin:6px calc(-280px - 56px) 24px 0;padding:10px 10px 16px;border-radius:18px;background:#fff;box-shadow:0 22px 40px -28px rgb(17 61 72 / .5),0 0 0 1px rgb(17 61 72 / .05);line-height:1.5}
.lg-place img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px;background:var(--c-tint)}
.lg-place__b{padding:14px 8px 0}
.lg-place .lg-mono{margin:0;color:var(--lg-ink);font-size:11px}
.lg-place__t{margin:6px 0 6px;font:800 21px/1.2 var(--f-head);color:var(--c-primary)}
.lg-place__d{margin:0 0 14px;font-size:14.5px;line-height:1.6;color:var(--lg-muted)}
.lg-place__go{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;background:var(--c-tint);color:var(--c-primary);font:600 14px/1.35 var(--f-body);transition:background .3s,color .3s}
.lg-place__go small{display:block;font:500 11px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lg-ink);transition:color .3s}
.lg-place__go:hover{background:var(--c-accent);color:#fff}
.lg-place__go:hover small{color:#e3f4fb}

.lg-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;clear:both;margin-top:3em;padding-top:22px;border-top:1px solid var(--lg-line)}
.lg-foot>.lg-mono{color:var(--lg-muted)}
.lg-share{display:flex;flex-wrap:wrap;gap:8px}
.lg-share a,.lg-share button{display:inline-flex;text-decoration:none!important;align-items:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:var(--pill);border:1px solid var(--lg-line);background:#fff;color:var(--c-primary);font:600 14px/1 var(--f-body);cursor:pointer;transition:border-color .3s}
.lg-share a:hover,.lg-share button:hover{border-color:var(--c-accent);color:var(--c-primary)}
.lg-share svg{width:16px;height:16px}

/* Next port */
.lg-next{padding-block:clamp(56px,7vw,104px);border-top:1px solid var(--lg-line)}
.lg-next__head{margin-bottom:clamp(32px,4vw,52px)}
.lg-next__head h2{margin:0;max-width:16ch;font:800 clamp(32px,4.2vw,56px)/1.08 var(--f-head);letter-spacing:-.02em}
.lg-next__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start}
.lg-pc{display:grid;gap:14px;align-content:start;color:inherit;transform:rotate(-2.5deg);transition:transform .7s var(--ease-out)}
.lg-pc:hover{color:inherit;transform:rotate(0) translateY(-8px)}
.lg-pc__card{position:relative;display:block;padding:12px 12px 50px;background:#fff;border-radius:6px;box-shadow:0 22px 40px -26px rgb(17 61 72 / .55),0 2px 4px rgb(17 61 72 / .06)}
.lg-pc__img{display:block;aspect-ratio:4/5;overflow:hidden;border-radius:3px;background:var(--c-tint)}
.lg-pc__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.lg-pc:hover .lg-pc__img img{transform:scale(1.05)}
.lg-pc .lg-stamp{top:24px;right:24px}
.lg-pc__date{position:absolute;left:16px;bottom:10px;font:400 30px/1 var(--f-script);color:var(--c-primary)}
.lg-pc small{color:var(--lg-muted)}
.lg-pc h3{margin:0;font:700 20px/1.3 var(--f-head);color:var(--c-primary);transition:color .3s}
.lg-pc:hover h3{color:var(--c-accent)}

/* Boarding pass (ίδιο με την αρχική) */
.hx-tk{--cut:230px;filter:drop-shadow(0 18px 30px rgb(17 61 72 / .12));transition:transform .5s var(--ease-out),filter .5s}
.hx-tk:hover{transform:translateY(-6px) rotate(-.4deg);filter:drop-shadow(0 26px 40px rgb(17 61 72 / .22))}
.hx-tk__link{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:22px;overflow:hidden;color:inherit;
	-webkit-mask:radial-gradient(circle 13px at 0 var(--cut),#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 13px at 100% var(--cut),#0000 98%,#000) right/51% 100% no-repeat;
	mask:radial-gradient(circle 13px at 0 var(--cut),#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 13px at 100% var(--cut),#0000 98%,#000) right/51% 100% no-repeat}
.hx-tk__link:hover{color:inherit}
.hx-tk__media{position:relative;height:var(--cut);overflow:hidden;background:var(--c-tint)}
.hx-tk__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.hx-tk:hover .hx-tk__media img{transform:scale(1.07)}
.hx-tk__tags{position:absolute;top:14px;left:14px;display:flex;flex-wrap:wrap;gap:6px}
.hx-tk__tags span{padding:7px 12px;border-radius:var(--pill);background:rgb(17 61 72 / .6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:500 12px/1 var(--f-body)}
.hx-tk__stub{display:grid;gap:16px;padding:24px 22px 22px;border-top:2px dashed var(--lg-line);flex:1}
.hx-tk__route{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:12px}
.hx-tk__route small{display:block;color:var(--lg-muted)}
.hx-tk__route b{font:700 15px/1.2 var(--f-head);color:var(--c-primary)}
.hx-tk__route .r{text-align:right}
.hx-tk__path{position:relative;height:22px;margin-bottom:3px}
.hx-tk__path::before{content:"";position:absolute;left:0;right:0;bottom:4px;border-bottom:2px dotted rgb(0 148 217 / .45)}
.hx-tk__ship{position:absolute;left:0;bottom:2px;width:24px;color:var(--c-accent);transition:left 1.4s var(--ease-out)}
.hx-tk:hover .hx-tk__ship{left:calc(100% - 24px)}
.hx-tk__title{margin:0;font:800 21px/1.2 var(--f-head);letter-spacing:-.01em;color:var(--c-primary)}
.hx-tk__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:auto}
.hx-tk__foot dl{display:flex;gap:22px;margin:0}
.hx-tk__foot dt{color:var(--lg-muted)}
.hx-tk__foot dd{margin:2px 0 0;font:700 19px/1.1 var(--f-head);color:var(--c-primary);font-variant-numeric:tabular-nums}
.hx-tk__foot dd small{font:500 13px/1 var(--f-body);color:var(--lg-muted)}
.hx-tk__go{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:var(--c-accent);color:#fff;transition:background .3s,transform .5s var(--ease-out)}
.hx-tk:hover .hx-tk__go{background:var(--c-primary);transform:rotate(-45deg)}

@media (max-width:1180px){
	.lg-art,.lg-art--solo{grid-template-columns:minmax(0,680px)}
	.lg-art--solo .lg-prose,.lg-prose{grid-column:1}
	.lg-route{position:static;margin:0 0 40px;padding:18px 20px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px rgb(17 61 72 / .06)}
	.lg-route>p{margin-bottom:14px}
	.lg-route ol{display:flex;justify-content:space-between;gap:8px}
	.lg-route ol::before{left:7px;right:7px;top:7px;bottom:auto;border-left:0;border-top:2px dotted rgb(0 148 217 / .45)}
	.lg-route li{min-width:0}
	.lg-route li a{padding:26px 0 0;gap:0}
	.lg-route li a::before{top:0}
	.lg-route li:last-child a{text-align:right}
	.lg-route li:last-child a::before{left:auto;right:0}
	.lg-route b{font-size:14px}
	.lg-route small{display:none}
	.lg-place{float:none;display:grid;grid-template-columns:200px minmax(0,1fr);gap:4px 18px;align-items:center;width:auto;margin:0 0 1.6em;padding:10px}
	.lg-place img{height:100%;aspect-ratio:auto}
	.lg-place__b{padding:6px 6px 6px 0}
	.lg-next__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.lg-pc{grid-column:1/-1;width:100%;max-width:420px;justify-self:center}
}
@media (max-width:767px){
	.lg-hero{width:100%}
	.lg-hero img{aspect-ratio:4/3;border-radius:0}
	.lg-cap{flex-direction:column;gap:2px;padding-inline:var(--edge)}
	.lg-route ol{overflow-x:auto;scrollbar-width:none}
	.lg-route b{font-size:13px}
	.lg-place{grid-template-columns:1fr}
	.lg-place img{aspect-ratio:16/10}
	.lg-place__b{padding:12px 6px 4px}
	.lg-prose{font-size:17.5px}
	.lg-next__grid{grid-template-columns:1fr}
	.lg-pc{max-width:none}
}
@media (prefers-reduced-motion:reduce){
	.lg-prog__boat,.lg-pc,.hx-tk,.lg-row{transition:none}
	.lg-peek{display:none}
}
