/* The website's own pages, on top of frame.css: the homepage's sections, written pages and the insight posts. */
section{padding:74px 0;}
/* Two plain sections in a row share one gap rather than stacking two */
section:not([class]) + section:not([class]){padding-top:0;}
h2{font-size:32px;margin-bottom:10px;}
.lead{color:var(--muted);font-size:18px;max-width:640px;}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--teal-text);margin-bottom:16px;}
.eyebrow::before{content:"";width:26px;height:3px;background:var(--accent);border-radius:2px;}
.btn-ghost{border-color:rgba(255,255,255,.4);color:#fff;}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn-li{background:var(--card);color:var(--heading);border-color:var(--line);display:inline-flex;align-items:center;gap:9px;}
.btn-li:hover{border-color:var(--teal-text);color:var(--teal-text);}
.btn-li svg{width:18px;height:18px;}

/* Homepage: the opening banner over the aerial photo */
.hero{background:linear-gradient(115deg,rgba(15,61,69,.94) 0%,rgba(15,61,69,.86) 42%,rgba(14,124,134,.78) 100%),url("hero-aerial.jpg") center 40%/cover no-repeat;color:#fff;position:relative;overflow:hidden;padding:104px 0 96px;}
.hero .c1{position:absolute;right:-120px;top:-120px;width:360px;height:360px;background:var(--teal);opacity:.28;border-radius:50%;mix-blend-mode:screen;}
.hero .c2{position:absolute;right:80px;bottom:-160px;width:280px;height:280px;background:var(--accent);opacity:.20;border-radius:50%;mix-blend-mode:screen;}
.hero .inner{position:relative;z-index:2;max-width:720px;}
.hero h1{color:#fff;font-size:44px;margin-bottom:20px;max-width:760px;}
.hero p{color:#d5ebeb;font-size:20px;max-width:620px;margin-bottom:32px;}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px;align-items:center;}
.hero .creds{font-size:14px;color:#9fd0cf;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}

/* Homepage: service cards */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:38px;}
.grid.grid-2{grid-template-columns:repeat(2,1fr);}
.card{border:1px solid var(--line);border-radius:12px;padding:26px 24px;background:var(--card);transition:.15s;display:flex;flex-direction:column;}
.card:hover{border-color:var(--teal-text);box-shadow:0 8px 30px rgba(15,61,69,.07);transform:translateY(-2px);}
.card .num{width:42px;height:42px;border-radius:50%;background:var(--teal);color:#fff;font-weight:900;font-size:17px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.card .num svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.card h3{font-size:19px;margin-bottom:8px;}
.card h3 .flag{display:inline-block;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#fff;background:var(--accent-btn);padding:2px 8px;border-radius:20px;margin-left:8px;vertical-align:middle;}
.card p{color:var(--muted);font-size:15.5px;flex:1;}

/* Homepage: a pale section, and the latest insight cards */
.how{background:var(--soft);}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:38px;}
.post{border:1px solid var(--line);border-radius:12px;padding:0;overflow:hidden;background:var(--card);display:flex;flex-direction:column;transition:.15s;}
.post:hover{border-color:var(--teal-text);box-shadow:0 8px 30px rgba(15,61,69,.07);transform:translateY(-2px);}
.post .pbody{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1;}
.post .src{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--teal-text);margin-bottom:10px;display:flex;align-items:center;gap:7px;}
.post .src svg{width:15px;height:15px;}
.post h3{font-size:17px;margin-bottom:8px;line-height:1.3;}
.post p{color:var(--muted);font-size:15px;flex:1;}
.post .go{margin-top:14px;color:var(--teal-text);font-weight:900;font-size:14px;}

/* Homepage: about, with the signature and the "At a glance" card */
.about-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;align-items:center;}
.about p{color:var(--muted);margin-bottom:16px;font-size:17px;}
.about p strong{color:var(--ink);}
.sig{display:flex;align-items:center;gap:16px;margin-top:30px;padding-top:24px;border-top:1px solid var(--line);}
.sig-av{width:58px;height:58px;border-radius:50%;object-fit:cover;object-position:50% 26%;flex:none;box-shadow:0 4px 14px rgba(15,61,69,.18);}
.sig-name{font-weight:900;color:var(--heading);font-size:17px;}
.sig-role{color:var(--muted);font-size:14px;font-weight:700;}
.factcard{background:var(--dark);color:#fff;border-radius:14px;padding:30px 28px;position:relative;overflow:hidden;}
.factcard .cc{position:absolute;right:-50px;bottom:-50px;width:150px;height:150px;background:var(--teal);opacity:.3;border-radius:50%;}
.factcard h3{color:#fff;font-size:18px;margin-bottom:16px;position:relative;z-index:2;}
.factcard ul{list-style:none;position:relative;z-index:2;}
.factcard li{padding:9px 0 9px 26px;position:relative;color:#d5ebeb;font-size:15.5px;border-top:1px solid rgba(255,255,255,.12);}
.factcard li:first-of-type{border-top:none;}
.factcard li::before{content:"";position:absolute;left:0;top:16px;width:9px;height:9px;background:var(--accent);border-radius:2px;}

/* Homepage: the closing booking band */
.book{background:var(--dark);color:#fff;position:relative;overflow:hidden;}
.book .c1{position:absolute;left:-100px;top:-100px;width:300px;height:300px;background:var(--teal);opacity:.28;border-radius:50%;}
.book .c2{position:absolute;right:-90px;bottom:-120px;width:260px;height:260px;background:var(--accent);opacity:.2;border-radius:50%;}
.book .inner{position:relative;z-index:2;text-align:center;max-width:680px;margin:0 auto;}
.book h2{color:#fff;font-size:34px;}
.book p{color:#d5ebeb;font-size:19px;margin:12px auto 28px;max-width:560px;}
.book .cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.book .alt{margin-top:26px;color:#9fd0cf;font-size:15px;}
.book .alt a{color:#fff;font-weight:700;border-bottom:1px solid rgba(255,255,255,.4);}

/* Written pages: the link back above the title, the text, and the buttons at the foot */
.backlink{display:inline-block;margin-bottom:22px;color:#9fd0cf;font-weight:700;font-size:14px;}
.backlink:hover{color:#fff;}
.prose{padding:60px 0;}
.prose h2{font-size:26px;margin:36px 0 12px;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-size:19px;margin:26px 0 8px;color:var(--heading);}
.prose p{margin-bottom:14px;color:var(--ink);font-size:16.5px;}
.prose ul{margin:0 0 16px 0;list-style:none;}
.prose li{padding:7px 0 7px 26px;position:relative;color:var(--ink);font-size:16px;}
.prose li::before{content:"";position:absolute;left:0;top:14px;width:8px;height:8px;background:var(--accent);border-radius:2px;}
.pagefoot{margin-top:40px;border-top:1px solid var(--line);padding-top:26px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;}

/* Insight posts: the date line, the author, the short answer up top and the questions at the end */
.postmeta{color:#9fd0cf;font-size:14px;font-weight:700;letter-spacing:.02em;}
.postmeta .dot{opacity:.6;margin:0 8px;}
.authorline{display:flex;align-items:center;gap:12px;margin:2px 0 26px;}
.authorline .av{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--teal);}
.authorline .who{font-weight:900;color:var(--heading);font-size:15px;}
.authorline .who small{display:block;color:var(--muted);font-weight:700;font-size:12.5px;letter-spacing:.02em;}
.answer{background:var(--soft);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:8px;padding:16px 20px;font-size:17px;color:var(--heading);font-weight:700;margin:4px 0 24px;}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 44px;margin-top:34px;}
.qa .q{font-weight:900;color:var(--heading);font-size:17px;margin-bottom:6px;}
.qa .a{color:var(--muted);font-size:15.5px;}

/* The insights list */
.postlist{display:flex;flex-direction:column;gap:2px;margin-top:10px;}
.postrow{display:block;border-bottom:1px solid var(--line);padding:24px 4px;transition:.15s;}
.postrow:hover{background:var(--soft);}
/* the last row's rule would sit right above .pagefoot's, reading as a double divider */
.postlist .postrow:last-child{border-bottom:none;}
.postrow .d{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--teal-text);margin-bottom:7px;}
.postrow h3{font-size:22px;margin-bottom:8px;}
.postrow p{color:var(--muted);font-size:16px;max-width:680px;}
.postrow .go{display:inline-block;margin-top:12px;color:var(--teal-text);font-weight:900;font-size:15px;}

@media(max-width:860px){
  section{padding:54px 0;}
  h2{font-size:27px;}
  .grid,.posts{grid-template-columns:1fr 1fr;}
  .about-grid{grid-template-columns:1fr;gap:30px;}
  .faq-grid{grid-template-columns:1fr;gap:24px;}
  .hero{padding:80px 0 72px;}
  .hero h1{font-size:33px;}
}
@media(max-width:640px){.grid.grid-2{grid-template-columns:1fr;}}
@media(max-width:520px){
  .grid,.posts{grid-template-columns:1fr;}
  .hero h1{font-size:28px;}
  .hero p{font-size:17px;}
}
